:root {
  --font-sans: "Avenir Next", "Segoe UI", "Helvetica Neue", sans-serif;
  --login-bg: #f4f7fc;
  --login-surface: rgba(255, 255, 255, 0.95);
  --login-border: rgba(173, 191, 218, 0.42);
  --login-text: #13345f;
  --login-muted: #7085a5;
  --login-accent: #1b63e8;
  --login-accent-strong: #1454cf;
  --login-shadow: 0 30px 80px rgba(71, 97, 145, 0.18);
  --focus-ring: #5ca8ff;
  --dark-bg: #08111f;
  --dark-surface: rgba(12, 26, 44, 0.95);
  --dark-surface-soft: rgba(16, 34, 56, 0.92);
  --dark-border: rgba(132, 163, 196, 0.18);
  --text-main: #e8f2ff;
  --text-muted: #a7bfd8;
  --accent: #2dd4bf;
  --accent-strong: #14b8a6;
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
  --shadow-dark: 0 22px 44px rgba(0, 0, 0, 0.28);
  --radius-xl: 32px;
  --radius-lg: 22px;
  --radius-md: 16px;
}

html,
body {
  min-height: 100%;
}

html {
  scrollbar-gutter: stable;
}

body {
  font-family: var(--font-sans);
  background: linear-gradient(180deg, #eef4fb 0%, #f9fbfe 100%);
  color: var(--login-text);
}

/* The root output remains mounted for the whole session. Route renderers replace
   only its content, so theme and critical CSS never disappear between views. */
.clinical-app-root,
.app-view {
  width: 100%;
  min-height: 100vh;
}

.clinical-app-root.recalculating {
  opacity: 1 !important;
}

.app-view {
  animation: app-view-enter 150ms ease-out both;
}

.app-view--application,
.app-view--clinical_knowledge {
  display: flex;
}

.app-view--application > .bslib-sidebar-layout,
.app-view--clinical_knowledge > .bslib-sidebar-layout {
  width: 100%;
  min-height: 100vh;
}

.platform-initializing {
  min-height: 100vh;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 0.85rem;
  background:
    radial-gradient(circle at top center, rgba(116, 184, 255, 0.13), transparent 34%),
    linear-gradient(180deg, #eff4fb 0%, #fbfdff 100%);
  color: #6680a3;
}

.platform-initializing__indicator {
  width: 34px;
  height: 34px;
  border: 3px solid rgba(23, 105, 224, 0.18);
  border-top-color: #1769e0;
  border-radius: 50%;
  animation: platform-initializing-spin 700ms linear infinite;
}

.platform-initializing__label {
  font-size: 0.9rem;
  font-weight: 650;
  letter-spacing: 0.01em;
}

@keyframes app-view-enter {
  from {
    opacity: 0.96;
  }

  to {
    opacity: 1;
  }
}

@keyframes platform-initializing-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-view,
  .platform-initializing__indicator {
    animation: none;
  }
}

a {
  color: var(--login-accent);
  text-decoration: none;
}

a:hover {
  color: var(--login-accent-strong);
  text-decoration: underline;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

.login-stage {
  position: relative;
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: clamp(1.5rem, 4vw, 3.25rem);
  overflow: hidden;
  background:
    radial-gradient(circle at top center, rgba(116, 184, 255, 0.16), transparent 32%),
    radial-gradient(circle at bottom left, rgba(124, 182, 255, 0.12), transparent 30%),
    linear-gradient(180deg, #eff4fb 0%, #fbfdff 100%);
}

.login-stage::before {
  content: "";
  position: absolute;
  inset: 12% 24% auto 24%;
  height: 360px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(115, 181, 255, 0.18), transparent 70%);
  filter: blur(34px);
  pointer-events: none;
}

.login-stage__network {
  position: absolute;
  top: 0;
  bottom: 0;
  width: min(34vw, 460px);
  background: url("/static/images/login_background.svg") no-repeat center center / contain;
  opacity: 0.34;
  pointer-events: none;
  z-index: 0;
}

.login-stage__network--left {
  left: -3%;
}

.login-stage__network--right {
  right: -1%;
  transform: scaleX(-1);
}

.login-stage__content {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: calc(100vh - clamp(3rem, 8vw, 6.5rem));
  display: grid;
  align-content: center;
  justify-items: center;
  gap: clamp(1.75rem, 4vw, 2.5rem);
}

.login-card {
  position: relative;
  z-index: 2;
  width: min(95vw, 700px);
  max-width: 700px;
  padding: clamp(3.1rem, 6vw, 3.75rem);
  border: 1px solid var(--login-border);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 28px 70px rgba(71, 97, 145, 0.18);
  backdrop-filter: blur(10px);
  display: grid;
  justify-items: center;
  gap: 1.55rem;
}

.login-card__branding {
  display: grid;
  justify-items: center;
  gap: 1.2rem;
  text-align: center;
}

.login-logo-image {
  width: clamp(220px, 30vw, 280px);
  max-width: 100%;
  height: auto;
}

.login-logo-placeholder {
  display: grid;
  place-items: center;
  width: min(100%, 320px);
  min-height: 120px;
  padding: 1rem 1.25rem;
  border: 1px dashed rgba(128, 154, 196, 0.42);
  border-radius: 24px;
  background: rgba(245, 249, 255, 0.92);
  color: var(--login-text);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
}

.login-wordmark {
  display: grid;
  gap: 0.55rem;
  justify-items: center;
}

.login-wordmark__primary {
  margin: 0;
  color: #5667c6;
  font-size: clamp(2.1rem, 4vw, 3rem);
  letter-spacing: 0.28em;
  font-weight: 700;
}

.login-wordmark__secondary {
  margin: 0;
  color: #153d77;
  font-size: clamp(1rem, 2vw, 1.45rem);
  letter-spacing: 0.34em;
  font-weight: 500;
}

.login-wordmark__subtitle {
  margin: 0.45rem auto 0;
  max-width: 36rem;
  color: var(--login-muted);
  font-size: 0.94rem;
  line-height: 1.55;
}

.login-form-shell {
  width: min(100%, 540px);
  display: grid;
  gap: 1.1rem;
}

.login-form {
  display: grid;
  gap: 1rem;
}

.login-form .shiny-input-container {
  width: 100%;
  margin-bottom: 0;
}

.login-form label {
  margin-bottom: 0.35rem;
  color: var(--login-text);
  font-weight: 700;
}

.login-card .feedback-panel {
  width: 100%;
  margin: 0;
}

.login-form .form-control,
.login-form .form-select {
  min-height: 3.1rem;
  border: 1px solid var(--login-border);
  border-radius: 16px;
  background: rgba(249, 252, 255, 0.98);
  color: var(--login-text);
  box-shadow: inset 0 1px 2px rgba(14, 45, 90, 0.04);
}

.login-form .form-control::placeholder {
  color: #95a4bf;
}

.login-form .form-control:focus,
.login-form .form-select:focus {
  border-color: #7ab4ff;
  box-shadow: 0 0 0 0.25rem rgba(27, 99, 232, 0.16);
}

.login-field-wrap {
  position: relative;
}

.login-field-wrap--password .form-control {
  padding-right: 5rem;
}

.password-toggle-button {
  position: absolute;
  right: 0.8rem;
  bottom: 0.48rem;
  border: 0;
  border-radius: 999px;
  padding: 0.45rem 0.8rem;
  background: rgba(27, 99, 232, 0.1);
  color: var(--login-accent);
  font-size: 0.88rem;
  font-weight: 700;
}

.login-form__meta {
  display: flex;
  justify-content: flex-start;
  margin-top: 0;
}

.login-submit-button {
  width: 100%;
  min-height: 3.35rem;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--login-accent) 0%, var(--login-accent-strong) 100%);
  color: #fff;
  font-size: 1.28rem;
  font-weight: 700;
  box-shadow: 0 16px 28px rgba(27, 99, 232, 0.18);
  margin-top: 0.15rem;
}

.login-submit-button:hover,
.login-submit-button:focus {
  color: #fff;
}

.login-submit-button:disabled {
  opacity: 0.88;
  cursor: wait;
}

.login-divider {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: var(--login-muted);
  font-weight: 600;
}

.login-divider::before,
.login-divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: rgba(168, 183, 206, 0.58);
}

.login-signup-row {
  display: flex;
  justify-content: center;
  gap: 0.35rem;
  color: var(--login-text);
  font-size: 1rem;
}

.development-access {
  margin-top: 0.5rem;
  padding: 0.8rem 1rem;
  border: 1px solid rgba(173, 191, 218, 0.5);
  border-radius: 16px;
  background: rgba(244, 248, 254, 0.82);
}

.development-access summary {
  cursor: pointer;
  color: var(--login-text);
  font-weight: 700;
  text-align: center;
}

.development-access p {
  margin: 0.55rem 0 0;
  color: var(--login-muted);
}

.development-access__warning {
  color: #b45309;
  font-weight: 600;
}

.login-privacy-note,
.login-disclaimer {
  color: var(--login-muted);
  line-height: 1.6;
}

.login-privacy-note {
  margin: 0;
  font-size: 0.89rem;
  line-height: 1.5;
}

.login-disclaimer {
  width: min(46rem, calc(100% - 2rem));
  margin: 0 auto;
  max-width: 46rem;
  text-align: center;
  font-size: 0.95rem;
}

.platform-library-stage {
  min-height: 100vh;
  display: grid;
  padding: 1.5rem 1.5rem 2rem;
  background:
    radial-gradient(circle at top left, rgba(34, 184, 230, 0.1), transparent 28%),
    radial-gradient(circle at top right, rgba(23, 105, 224, 0.08), transparent 24%),
    linear-gradient(180deg, #f8fbff 0%, #f5f9ff 48%, #edf5ff 100%);
  color: #12315b;
}

.clinical-app-shell {
  min-height: 100vh;
  padding: 1.5rem;
  background:
    radial-gradient(circle at top left, rgba(45, 212, 191, 0.08), transparent 28%),
    radial-gradient(circle at top right, rgba(56, 189, 248, 0.08), transparent 24%),
    linear-gradient(180deg, #08111f 0%, #0a1626 100%);
  color: var(--text-main);
}

.library-topbar,
.clinical-app-shell__hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.library-dashboard {
  width: min(100%, 1280px);
  margin: 0 auto;
  min-height: auto;
  display: grid;
  gap: 1.15rem;
  align-content: start;
}

.library-topbar {
  align-items: center;
  padding: 0.15rem 0;
}

.library-topbar__brand,
.app-sidebar-platform-brand,
.clinical-app-shell__hero-brand {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.library-topbar__brand-text,
.app-sidebar-platform-brand__text,
.clinical-app-shell__hero-brand-text {
  display: grid;
  gap: 0.35rem;
}

.library-topbar__title {
  color: #12315b;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.library-topbar__actions,
.clinical-app-shell__hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.platform-logo {
  display: block;
  height: auto;
  object-fit: contain;
}

.platform-logo--header {
  width: 58px;
}

.platform-logo--sidebar {
  width: 84px;
}

.platform-logo--hero {
  width: 72px;
}

.platform-logo-placeholder {
  display: grid;
  place-items: center;
  border-radius: 18px;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-align: center;
}

.platform-library-stage .platform-logo-placeholder {
  border: 1px dashed rgba(91, 133, 187, 0.3);
  background: rgba(255, 255, 255, 0.88);
  color: #1769e0;
}

.clinical-app-shell .platform-logo-placeholder {
  border: 1px dashed rgba(173, 191, 218, 0.3);
  background: rgba(16, 34, 56, 0.82);
  color: var(--text-main);
}

.platform-logo-placeholder--header {
  width: 58px;
  min-height: 58px;
  padding: 0.45rem;
}

.platform-logo-placeholder--sidebar {
  width: 84px;
  min-height: 84px;
  padding: 0.65rem;
}

.platform-logo-placeholder--hero {
  width: 72px;
  min-height: 72px;
  padding: 0.6rem;
}

.library-welcome {
  position: relative;
  display: grid;
  gap: 0.55rem;
  padding: 1.7rem 1.8rem;
  border: 1px solid #d9e7f7;
  border-radius: 28px;
  background:
    radial-gradient(circle at top right, rgba(34, 184, 230, 0.16), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(246, 250, 255, 0.96) 58%, rgba(237, 245, 255, 0.94) 100%);
  box-shadow: 0 24px 48px rgba(30, 88, 157, 0.1);
  overflow: hidden;
}

.library-welcome__text {
  display: grid;
  gap: 0.4rem;
  max-width: 34rem;
}

.library-welcome__eyebrow {
  color: #1769e0;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.library-welcome__name {
  margin: 0;
  color: #12315b;
  font-size: clamp(2.25rem, 4vw, 3.3rem);
  line-height: 1.02;
  letter-spacing: -0.04em;
}

.library-welcome__subtitle {
  margin: 0.1rem 0 0;
  color: #6880a1;
  font-size: 1rem;
  line-height: 1.5;
}

.library-applications-panel {
  display: grid;
  gap: 1.15rem;
  padding: 1.4rem 1.5rem 1.5rem;
  border: 1px solid #d9e7f7;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 18px 38px rgba(30, 88, 157, 0.08);
}

.clinical-app-shell__hero h1 {
  margin: 0;
  font-size: clamp(2rem, 3vw, 2.7rem);
}

.library-applications-panel__heading,
.clinical-app-shell__hero-text {
  display: grid;
  gap: 0.3rem;
}

.library-applications-panel__header h2 {
  margin: 0;
  color: #12315b;
}

.platform-library-stage p,
.muted-note,
.metric-note,
.section-heading p,
.feedback-panel ul,
.feedback-panel p,
.sidebar-username {
  color: #6680a3;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.eyebrow--light {
  background: #edf5ff;
  border: 1px solid #d8e7fb;
  color: #1769e0;
}

.eyebrow--dark {
  background: rgba(45, 212, 191, 0.12);
  color: #98fff1;
}

.user-identity {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--dark-border);
  border-radius: 16px;
  background: rgba(10, 23, 40, 0.7);
}

.user-identity__text {
  display: grid;
  gap: 0.1rem;
}

.user-identity__label,
.user-identity__username {
  color: var(--text-muted);
  font-size: 0.9rem;
}

.library-logout-button {
  min-height: 2.8rem;
  padding-inline: 1.15rem;
  border: 1px solid #c7dbf5;
  border-radius: 14px;
  background: #fff;
  color: #1769e0;
  font-weight: 700;
  box-shadow: 0 10px 18px rgba(23, 105, 224, 0.08);
}

.library-knowledge-button {
  min-height: 2.8rem;
  padding-inline: 1.15rem;
  border: 1px solid transparent;
  border-radius: 14px;
  background: linear-gradient(135deg, #1769e0 0%, #168fd3 100%);
  color: #fff;
  font-weight: 700;
  box-shadow: 0 12px 24px rgba(23, 105, 224, 0.18);
}

.library-knowledge-button:hover,
.library-knowledge-button:focus {
  border-color: transparent;
  background: linear-gradient(135deg, #1459c4 0%, #117fbf 100%);
  color: #fff;
  transform: translateY(-1px);
}

.library-logout-button:hover,
.library-logout-button:focus {
  color: #1454cf;
  background: #f8fbff;
  border-color: #a9c9f1;
}

.library-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 2.1fr) repeat(2, minmax(170px, 1fr));
  gap: 0.9rem;
  align-items: end;
}

.library-toolbar .shiny-input-container {
  margin-bottom: 0;
}

.platform-library-stage .library-toolbar label {
  margin-bottom: 0.35rem;
  color: #12315b;
  font-weight: 700;
}

.platform-library-stage .library-toolbar .form-control,
.platform-library-stage .library-toolbar .form-select {
  min-height: 2.85rem;
  border: 1px solid #d9e7f7;
  border-radius: 14px;
  background: #fff;
  color: #12315b;
  box-shadow: inset 0 1px 2px rgba(18, 49, 91, 0.04);
}

.platform-library-stage .library-toolbar .form-control::placeholder {
  color: #8aa0bf;
}

.platform-library-stage .library-toolbar .form-control:focus,
.platform-library-stage .library-toolbar .form-select:focus {
  border-color: #7ab4ff;
  box-shadow: 0 0 0 0.25rem rgba(23, 105, 224, 0.12);
}

.app-library-grid {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.5rem, 2vw, 2rem);
  align-items: stretch;
}

.app-card,
.card,
.metric-card,
.detail-card,
.feedback-panel {
  border: 1px solid var(--dark-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-dark);
}

.platform-library-stage .app-card,
.platform-library-stage .app-library-empty {
  border: 1px solid #d9e7f7;
  border-radius: 22px;
  box-shadow: 0 16px 34px rgba(30, 88, 157, 0.08);
}

.platform-library-stage .app-card {
  position: relative;
  display: grid;
  align-content: start;
  gap: 1rem;
  padding: 1.3rem;
  height: 100%;
  min-height: 298px;
  background: #fff;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease;
}

.platform-library-stage .app-card:hover {
  transform: translateY(-4px);
  border-color: #c6daf5;
  box-shadow: 0 24px 44px rgba(30, 88, 157, 0.12);
}

.app-card__status-row {
  display: flex;
  justify-content: flex-end;
  min-height: 1.9rem;
}

.platform-library-stage .app-card__icon {
  display: grid;
  place-items: center;
  width: 68px;
  height: 68px;
  border-radius: 20px;
  background: linear-gradient(180deg, #f6fbff 0%, #ebf4ff 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.app-card__icon svg {
  width: 38px;
  height: 38px;
}

.platform-library-stage .app-card__icon path {
  fill: none;
  stroke: #1c8adf;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.app-card__title,
.app-library-empty h3 {
  margin: 0;
}

.platform-library-stage .app-card__title,
.platform-library-stage .app-library-empty h3 {
  color: #12315b;
  font-size: 1.5rem;
  line-height: 1.14;
  letter-spacing: -0.03em;
}

.app-card__description {
  margin: 0;
  color: var(--text-muted);
  line-height: 1.6;
}

.platform-library-stage .app-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.platform-library-stage .app-card__category,
.platform-library-stage .app-card__roles {
  padding: 0.35rem 0.7rem;
  border: 1px solid #d9e7f7;
  border-radius: 999px;
  background: #edf5ff;
  color: #2f5b93;
  font-size: 0.86rem;
  font-weight: 600;
}

.app-card__button {
  width: 100%;
  min-height: 3.35rem;
  border-radius: 16px;
  font-weight: 700;
  font-size: 1rem;
  margin-top: auto;
}

.platform-library-stage .app-card__button--available {
  background: linear-gradient(135deg, #1769e0 0%, #22b8e6 100%);
  border: 0;
  color: #fff;
  box-shadow: 0 16px 28px rgba(23, 105, 224, 0.18);
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    filter 180ms ease;
}

.platform-library-stage .app-card__button--available:hover,
.platform-library-stage .app-card__button--available:focus {
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 20px 32px rgba(23, 105, 224, 0.2);
  filter: saturate(1.04);
}

.platform-library-stage .app-card__button--disabled {
  border: 1px solid #dde5f0;
  background: #f3f6fa;
  color: #94a4bb;
  box-shadow: none;
}

.status-badge,
.role-badge,
.group-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.34rem 0.78rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.platform-library-stage .status-badge--available {
  background: #dff7ec;
  box-shadow: inset 0 0 0 1px rgba(23, 100, 62, 0.08);
  color: #17643e;
}

.platform-library-stage .status-badge--coming-soon {
  background: #fff3d6;
  box-shadow: inset 0 0 0 1px rgba(154, 107, 0, 0.08);
  color: #9a6b00;
}

.platform-library-stage .role-clinician,
.platform-library-stage .role-admin {
  background: #edf5ff;
  color: #2f5b93;
}

.platform-library-stage .group-badge {
  background: rgba(34, 184, 230, 0.12);
  color: #1b6d97;
}

.platform-library-stage .app-library-empty {
  padding: 2rem;
  background: rgba(255, 255, 255, 0.88);
  border-style: dashed;
  text-align: center;
}

.app-sidebar {
  background: linear-gradient(180deg, rgba(10, 24, 41, 0.98), rgba(7, 15, 26, 0.98));
  border-right: 1px solid var(--dark-border);
}

.app-sidebar-summary,
.sidebar-profile {
  display: grid;
  gap: 0.6rem;
}

.app-sidebar-summary h3 {
  margin: 0;
}

.sidebar-platform-note,
.clinical-app-shell__hero-kicker {
  margin: 0;
  color: var(--text-muted);
}

.clinical-app-shell__hero-brand {
  margin-bottom: 0.2rem;
}

.quick-actions {
  display: grid;
  gap: 0.7rem;
  margin: 1.25rem 0;
}

.disclaimer-banner {
  margin-bottom: 1rem;
  padding: 0.85rem 1rem;
  border-left: 4px solid var(--warning);
  border-radius: 14px;
  background: rgba(245, 158, 11, 0.12);
  color: #fde7b0;
}

.page-section,
.section-heading,
.clinical-app-shell {
  display: grid;
  gap: 1rem;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 1rem;
}

.metric-card {
  display: grid;
  gap: 0.4rem;
  padding: 1.1rem 1.15rem;
  background: linear-gradient(180deg, rgba(14, 31, 50, 0.98), rgba(11, 23, 39, 0.96));
}

.metric-label {
  font-size: 0.9rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.metric-value {
  margin: 0;
  font-size: 2rem;
}

.metric-primary {
  border-top: 3px solid #38bdf8;
}

.metric-success {
  border-top: 3px solid var(--success);
}

.metric-warning {
  border-top: 3px solid var(--warning);
}

.metric-accent {
  border-top: 3px solid var(--accent);
}

.card {
  background: linear-gradient(180deg, rgba(12, 26, 44, 0.96), rgba(10, 21, 35, 0.96));
  color: var(--text-main);
}

.card-header {
  border-bottom: 1px solid var(--dark-border);
  background: transparent;
  color: var(--text-main);
  font-weight: 700;
}

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

.form-field-wide {
  grid-column: 1 / -1;
}

.encounter-form-stack {
  display: grid;
  gap: 1rem;
}

.form-actions,
.table-actions,
.modal-footer-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.feedback-panel {
  padding: 1rem 1.05rem;
  background: rgba(12, 24, 39, 0.94);
}

.feedback-panel strong {
  display: inline-block;
  margin-bottom: 0.35rem;
}

.feedback-error {
  border-left: 4px solid var(--danger);
}

.feedback-success {
  border-left: 4px solid var(--success);
}

.feedback-warning {
  border-left: 4px solid var(--warning);
}

.feedback-info {
  border-left: 4px solid var(--accent);
}

.detail-header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
}

.detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}

.detail-card {
  padding: 1rem;
  background: rgba(8, 18, 31, 0.58);
}

.detail-card h4 {
  margin-top: 0;
}

@media (max-width: 992px) {
  .login-stage {
    padding: 1.5rem 1rem 2rem;
  }

  .login-stage__network {
    opacity: 0.24;
    width: min(42vw, 320px);
  }

  .login-stage__content {
    width: 100%;
    min-height: calc(100vh - 3.5rem);
  }

  .library-topbar,
  .clinical-app-shell__hero {
    flex-direction: column;
  }

  .library-topbar__actions,
  .clinical-app-shell__hero-actions,
  .user-identity {
    width: 100%;
  }

  .app-sidebar-platform-brand,
  .clinical-app-shell__hero-brand {
    align-items: flex-start;
  }

  .library-toolbar {
    grid-template-columns: 1fr;
  }

  .app-library-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .form-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .login-stage {
    padding: 1rem 0.75rem 1.5rem;
  }

  .login-stage__network {
    display: none;
  }

  .login-card {
    border-radius: 22px;
    width: min(95vw, 100%);
    padding: 2.15rem 1.4rem;
    gap: 1.35rem;
  }

  .login-wordmark__primary {
    letter-spacing: 0.18em;
    font-size: 2rem;
  }

  .login-wordmark__secondary {
    letter-spacing: 0.22em;
    font-size: 1rem;
  }

  .login-signup-row {
    flex-direction: column;
    align-items: center;
  }

  .login-form-shell {
    width: 100%;
  }

  .login-logo-image {
    width: clamp(200px, 62vw, 240px);
  }

  .login-logo-placeholder {
    min-height: 96px;
    font-size: 0.9rem;
  }

  .platform-logo--header {
    width: 50px;
  }

  .platform-logo--sidebar,
  .platform-logo--hero {
    width: 60px;
  }

  .platform-logo-placeholder--header {
    width: 50px;
    min-height: 50px;
  }

  .platform-logo-placeholder--sidebar,
  .platform-logo-placeholder--hero {
    width: 60px;
    min-height: 60px;
  }

  .platform-library-stage,
  .clinical-app-shell {
    padding: 1rem;
  }

  .library-welcome,
  .library-applications-panel {
    padding: 1.25rem;
  }

  .app-library-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Clinical Knowledge is a platform-level reference workspace, not patient data entry. */
.knowledge-shell-page {
  min-height: 100vh;
  padding: 1.35rem;
  background:
    radial-gradient(circle at 8% 0%, rgba(34, 184, 230, 0.11), transparent 24%),
    radial-gradient(circle at 96% 4%, rgba(23, 105, 224, 0.09), transparent 27%),
    linear-gradient(180deg, #f6faff 0%, #edf5ff 100%);
}

.knowledge-shell {
  width: min(100%, 1320px);
  margin: 0 auto;
  display: grid;
  gap: 1.1rem;
}

.knowledge-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 76px;
  padding: 0.8rem 1.05rem;
  border: 1px solid #d9e7f7;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 16px 36px rgba(30, 88, 157, 0.08);
  backdrop-filter: blur(12px);
}

.knowledge-topbar__brand,
.knowledge-topbar__actions,
.knowledge-heading-actions {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.knowledge-topbar__brand > div:last-child {
  display: grid;
  gap: 0.08rem;
}

.knowledge-topbar__platform {
  color: #6680a3;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.knowledge-topbar__title {
  color: #12315b;
  font-size: 1.08rem;
}

.knowledge-user-chip {
  display: grid;
  gap: 0.08rem;
  min-width: 150px;
  padding: 0.64rem 0.85rem;
  border: 1px solid #d9e7f7;
  border-radius: 14px;
  background: #f8fbff;
  color: #12315b;
  font-weight: 700;
  line-height: 1.2;
}

.knowledge-user-chip small {
  color: #6680a3;
  font-size: 0.75rem;
  font-weight: 700;
}

.knowledge-shell__content.pediatric-shell {
  width: 100%;
  max-width: none;
  margin: 0;
  gap: 1rem;
}

.knowledge-sidebar {
  border-right: 1px solid #d9e7f7;
  background: linear-gradient(180deg, #fff 0%, #f3f8ff 100%);
  box-shadow: 14px 0 30px rgba(30, 88, 157, 0.06);
}

.knowledge-sidebar__inner {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  justify-content: space-between;
  gap: 1.25rem;
  padding: 1.2rem 1rem;
}

.knowledge-sidebar__section,
.knowledge-sidebar__nav {
  display: grid;
  gap: 0.7rem;
}

.knowledge-sidebar__eyebrow {
  color: #6680a3;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.knowledge-sidebar__button,
.knowledge-sidebar__logout {
  width: 100%;
  min-height: 2.85rem;
  justify-content: flex-start;
  padding: 0.72rem 0.88rem;
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  color: #12315b;
  font-weight: 700;
  text-align: left;
  box-shadow: none;
}

.knowledge-sidebar__button:hover,
.knowledge-sidebar__button:focus,
.knowledge-sidebar__logout:hover,
.knowledge-sidebar__logout:focus {
  border-color: #d3e4f8;
  background: #f7fbff;
  color: #1769e0;
}

.knowledge-sidebar__button.is-active {
  border-color: #cfe1f8;
  background: linear-gradient(135deg, rgba(23, 105, 224, 0.11), rgba(34, 184, 230, 0.08));
  color: #1769e0;
  box-shadow: inset 3px 0 0 #1769e0;
}

.knowledge-sidebar__button--secondary {
  margin-top: 0.2rem;
  border-color: #d9e7f7;
  background: #fff;
}

.knowledge-sidebar__footer {
  padding-top: 0.7rem;
  border-top: 1px solid #e1ecf8;
}

.medication-workspace {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.knowledge-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.1rem 1.2rem;
  border: 1px solid #d9e7f7;
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 10%, rgba(34, 184, 230, 0.13), transparent 30%),
    linear-gradient(135deg, #fff 0%, #f3f8ff 100%);
  box-shadow: 0 14px 32px rgba(30, 88, 157, 0.08);
}

.knowledge-page-heading > div:first-child {
  display: grid;
  gap: 0.3rem;
}

.knowledge-page-heading h1 {
  margin: 0;
  color: #12315b;
  font-size: clamp(1.85rem, 3vw, 2.45rem);
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.knowledge-page-heading p {
  margin: 0;
  color: #6680a3;
}

.knowledge-eyebrow {
  color: #1769e0;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.knowledge-primary-button,
.knowledge-secondary-button,
.knowledge-danger-button {
  min-height: 2.75rem;
  padding: 0.68rem 1rem;
  border-radius: 13px;
  font-weight: 750;
}

.knowledge-primary-button {
  border: 1px solid transparent;
  background: linear-gradient(135deg, #1769e0 0%, #1594d0 100%);
  color: #fff;
  box-shadow: 0 10px 22px rgba(23, 105, 224, 0.18);
}

.knowledge-primary-button:hover,
.knowledge-primary-button:focus {
  border-color: transparent;
  background: linear-gradient(135deg, #1459c4 0%, #117fbf 100%);
  color: #fff;
}

.knowledge-secondary-button {
  border: 1px solid #cfe0f5;
  background: #fff;
  color: #1769e0;
}

.knowledge-secondary-button:hover,
.knowledge-secondary-button:focus {
  border-color: #abcbed;
  background: #f6faff;
  color: #1454cf;
}

.knowledge-danger-button {
  border: 1px solid #f1c6ca;
  background: #fff7f8;
  color: #af3943;
}

.knowledge-danger-button:hover,
.knowledge-danger-button:focus {
  border-color: #e6a8ae;
  background: #ffedef;
  color: #922c35;
}

.medication-identity-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
  align-items: start;
}

.medication-identity-grid .shiny-input-container,
.medication-filter-grid .shiny-input-container {
  width: 100%;
  margin-bottom: 0;
}

.medication-brand-field {
  grid-column: 1 / -1;
}

.medication-section-accordion {
  display: grid;
  gap: 0.7rem;
}

.medication-section-accordion .accordion-item {
  overflow: hidden;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(30, 88, 157, 0.06);
}

.medication-section-accordion .accordion-button {
  color: #12315b;
  font-weight: 750;
  background: linear-gradient(180deg, #fff 0%, #f7fbff 100%);
}

.medication-section-accordion .accordion-button:not(.collapsed) {
  color: #1769e0;
  background: #eef6ff;
  box-shadow: inset 0 -1px 0 #d9e7f7;
}

.medication-section-accordion .accordion-body {
  padding: 0.9rem;
}

.medication-editor-actions,
.medication-filter-actions,
.medication-table-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.7rem;
}

.medication-editor-actions {
  position: sticky;
  z-index: 12;
  bottom: 0.75rem;
  justify-content: flex-end;
  padding: 0.8rem;
  border: 1px solid #d9e7f7;
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 34px rgba(30, 88, 157, 0.14);
  backdrop-filter: blur(12px);
}

.medication-filter-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.8rem;
}

.medication-filter-actions {
  justify-content: space-between;
  margin-top: 0.9rem;
  color: #6680a3;
  font-size: 0.9rem;
  font-weight: 650;
}

.medication-table-actions {
  justify-content: flex-end;
  margin-bottom: 0.85rem;
}

.medication-results-card .card-body {
  min-width: 0;
}

.medication-governance-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.medication-governance-strip span {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.35rem 0.7rem;
  border: 1px solid #d8e7f7;
  border-radius: 999px;
  background: #fff;
  color: #527397;
  font-size: 0.8rem;
  font-weight: 700;
}

.medication-detail-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.medication-detail-summary > div {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
}

.medication-detail-summary strong {
  color: #6680a3;
  font-size: 0.76rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.medication-detail-summary span {
  color: #12315b;
  white-space: pre-wrap;
}

.medication-detail-summary__wide {
  grid-column: 1 / -1;
}

.knowledge-detail-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid #e0ebf8;
  border-radius: 13px;
}

.knowledge-detail-table {
  width: 100%;
  min-width: 720px;
  margin: 0;
  border-collapse: collapse;
  color: #12315b;
  font-size: 0.85rem;
}

.knowledge-detail-table th,
.knowledge-detail-table td {
  padding: 0.65rem 0.72rem;
  border-right: 1px solid #e5eef9;
  border-bottom: 1px solid #e5eef9;
  vertical-align: top;
  text-align: left;
  white-space: pre-wrap;
}

.knowledge-detail-table th:last-child,
.knowledge-detail-table td:last-child {
  border-right: 0;
}

.knowledge-detail-table thead th {
  background: linear-gradient(180deg, #edf6ff 0%, #e6f2ff 100%);
  color: #1d5799;
  font-weight: 750;
  white-space: nowrap;
}

.knowledge-detail-table tbody tr:last-child td {
  border-bottom: 0;
}

.knowledge-empty-state {
  padding: 0.9rem;
  border: 1px dashed #cfdff2;
  border-radius: 12px;
  background: #f8fbff;
  color: #7187a5;
  font-size: 0.88rem;
}

/* Disease Knowledge shares the clinical reference language without coupling its data model to medications. */
.disease-workspace {
  display: grid;
  gap: 1rem;
  min-width: 0;
}

.disease-overview-grid,
.disease-filter-grid,
.disease-detail-summary {
  display: grid;
  gap: 0.8rem;
}

.disease-overview-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.disease-overview-grid .shiny-input-container,
.disease-filter-grid .shiny-input-container {
  width: 100%;
  margin-bottom: 0;
}

.disease-section-accordion {
  display: grid;
  gap: 0.7rem;
}

.disease-section-accordion .accordion-item {
  overflow: hidden;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(30, 88, 157, 0.06);
}

.disease-section-accordion .accordion-button {
  color: #12315b;
  font-weight: 750;
  background: linear-gradient(180deg, #fff 0%, #f7fbff 100%);
}

.disease-section-accordion .accordion-button:not(.collapsed) {
  color: #1769e0;
  background: #eef6ff;
  box-shadow: inset 0 -1px 0 #d9e7f7;
}

.disease-section-accordion .accordion-body {
  padding: 0.9rem;
}

.disease-editor-actions,
.disease-filter-actions,
.disease-table-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.7rem;
}

.disease-editor-actions {
  position: sticky;
  z-index: 12;
  bottom: 0.75rem;
  justify-content: flex-end;
  padding: 0.8rem;
  border: 1px solid #d9e7f7;
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 34px rgba(30, 88, 157, 0.14);
  backdrop-filter: blur(12px);
}

.disease-filter-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.disease-filter-actions {
  justify-content: space-between;
  margin-top: 0.9rem;
  color: #6680a3;
  font-size: 0.9rem;
  font-weight: 650;
}

.disease-table-actions {
  justify-content: flex-end;
  margin-bottom: 0.85rem;
}

.disease-results-card .card-body {
  min-width: 0;
}

.disease-governance-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.disease-governance-strip span {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.35rem 0.7rem;
  border: 1px solid #d8e7f7;
  border-radius: 999px;
  background: #fff;
  color: #527397;
  font-size: 0.8rem;
  font-weight: 700;
}

.knowledge-status-warning {
  padding: 0.78rem 1rem;
  border: 1px solid #f0d69b;
  border-left: 4px solid #d59a13;
  border-radius: 14px;
  background: #fff9e9;
  color: #765617;
  font-size: 0.9rem;
  font-weight: 650;
}

.disease-detail-summary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.disease-detail-summary > div {
  display: grid;
  gap: 0.3rem;
  min-width: 0;
}

.disease-detail-summary strong {
  color: #6680a3;
  font-size: 0.76rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.disease-detail-summary span {
  color: #12315b;
  white-space: pre-wrap;
}

.disease-detail-summary__wide {
  grid-column: 1 / -1;
}

.legacy-treatment-view {
  display: grid;
  gap: 0.7rem;
}

.legacy-treatment-notice {
  padding: 0.75rem 0.9rem;
  border: 1px solid #edcf91;
  border-left: 4px solid #c98b0b;
  border-radius: 12px;
  background: #fff9e9;
  color: #6f5317;
  font-size: 0.86rem;
}

.clinical-algorithm-card {
  overflow: hidden;
  border: 1px solid #cfe2f7;
  box-shadow: 0 18px 44px rgba(30, 88, 157, 0.11);
}

.clinical-algorithm-card > .card-header {
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #d9e7f7;
  background:
    radial-gradient(circle at top right, rgba(34, 184, 230, 0.13), transparent 34%),
    linear-gradient(135deg, #f8fbff 0%, #eef6ff 100%);
}

.clinical-algorithm-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.clinical-algorithm-heading h2 {
  margin: 0.16rem 0 0;
  color: #12315b;
  font-size: clamp(1.25rem, 2vw, 1.65rem);
}

.clinical-algorithm-status,
.clinical-algorithm-branch-label {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.03em;
}

.clinical-algorithm-status {
  min-height: 1.9rem;
  padding: 0.32rem 0.68rem;
  border: 1px solid transparent;
  white-space: nowrap;
}

.clinical-algorithm-status--reviewed {
  border-color: #abdcc8;
  background: #e3f7ee;
  color: #176342;
}

.clinical-algorithm-status--draft {
  border-color: #eccf91;
  background: #fff4d9;
  color: #795711;
}

.clinical-algorithm-intro {
  margin: 0;
  color: #5f7899;
  font-size: 0.9rem;
}

.clinical-algorithm-graph-warning {
  padding: 0.75rem 0.9rem;
  border: 1px solid #e7c97e;
  border-left: 4px solid #c88a0a;
  border-radius: 12px;
  background: #fffaf0;
  color: #715318;
  font-size: 0.82rem;
}

.clinical-algorithm-graph-warning ul {
  margin: 0.4rem 0 0;
  padding-left: 1.15rem;
}

.clinical-decision-tree {
  --clinical-tree-line: #9dbbd9;
  width: 100%;
  min-width: 0;
  padding: 0.4rem 0.15rem 1rem;
}

.clinical-tree-root-list,
.clinical-tree-level {
  margin: 0;
  padding-left: 0;
  list-style: none;
}

.clinical-tree-root-item {
  min-width: 0;
  text-align: center;
}

.clinical-tree-level {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 2.2rem;
}

.clinical-tree-level::before {
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 2.2rem;
  border-left: 2px solid var(--clinical-tree-line);
  content: "";
}

.clinical-tree-item {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  padding: 2.2rem 0.4rem 0;
  text-align: center;
}

.clinical-tree-item::before,
.clinical-tree-item::after {
  position: absolute;
  top: 0;
  right: 50%;
  width: 50%;
  height: 2.2rem;
  border-top: 2px solid var(--clinical-tree-line);
  content: "";
}

.clinical-tree-item::after {
  right: auto;
  left: 50%;
  border-left: 2px solid var(--clinical-tree-line);
}

.clinical-tree-item:only-child::before,
.clinical-tree-item:only-child::after {
  display: none;
}

.clinical-tree-item:first-child::before,
.clinical-tree-item:last-child::after {
  border: 0;
}

.clinical-tree-item:last-child::before {
  border-right: 2px solid var(--clinical-tree-line);
  border-radius: 0 9px 0 0;
}

.clinical-tree-item:first-child::after {
  border-radius: 9px 0 0;
}

.clinical-tree-edge-label {
  position: absolute;
  z-index: 2;
  top: 0.52rem;
  left: 50%;
  display: inline-flex;
  max-width: calc(100% - 0.8rem);
  min-height: 1.2rem;
  align-items: center;
  padding: 0.16rem 0.45rem;
  transform: translateX(-50%);
  border: 1px solid #c4d9ee;
  border-radius: 999px;
  background: #f1f7ff;
  color: #315f94;
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  overflow-wrap: anywhere;
}

.clinical-tree-pathway {
  display: grid;
  justify-items: center;
  min-width: 0;
}

.clinical-algorithm-node,
.clinical-algorithm-endpoint {
  display: grid;
  gap: 0.3rem;
  width: min(100%, 280px);
  min-width: 0;
  padding: 0.68rem 0.78rem;
  border: 1px solid #cfdff1;
  border-left-width: 5px;
  border-radius: 12px;
  background: #fff;
  color: #173a66;
  box-shadow: 0 6px 16px rgba(30, 88, 157, 0.06);
}

.clinical-tree-root-item > .clinical-algorithm-node--root {
  width: min(100%, 390px);
  margin: 0 auto;
  padding: 0.82rem 1rem;
  border: 2px solid #1769e0;
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(34, 184, 230, 0.13), transparent 42%),
    linear-gradient(145deg, #ffffff 0%, #eef6ff 100%);
  box-shadow: 0 12px 26px rgba(23, 105, 224, 0.13);
}

.clinical-algorithm-node__type {
  color: #5c7596;
  font-size: 0.67rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.clinical-algorithm-node__text {
  overflow-wrap: break-word;
  word-break: normal;
  font-size: 0.86rem;
  font-weight: 680;
  line-height: 1.38;
}

.clinical-algorithm-node--scenario {
  border-left-color: #1769e0;
}

.clinical-algorithm-node--condition {
  border-left-color: #d69a16;
  background: #fffdf6;
}

.clinical-algorithm-node--action {
  border-left-color: #17a673;
  background: #f8fffc;
}

.clinical-algorithm-node--alternative {
  border-left-color: #7087a4;
  background: #f8fafc;
}

.clinical-algorithm-node--escalation {
  border-left-color: #d34f5f;
  background: #fffafb;
}

.clinical-algorithm-endpoint {
  display: inline-flex;
  width: auto;
  min-height: 1.55rem;
  align-items: center;
  justify-content: center;
  padding: 0.2rem 0.62rem;
  border-style: dashed;
  border-left-width: 1px;
  border-left-color: #7c91ad;
  border-radius: 999px;
  background: #f2f6fb;
  color: #607895;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  box-shadow: none;
}

.clinical-algorithm-connector {
  position: relative;
  width: 2px;
  height: 1.35rem;
  margin: 0 auto;
  background: var(--clinical-tree-line);
}

.clinical-algorithm-connector::after {
  position: absolute;
  bottom: -1px;
  left: 50%;
  width: 0;
  height: 0;
  transform: translateX(-50%);
  border-top: 5px solid #7398be;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  content: "";
}

.clinical-algorithm-action-branches {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  width: min(100%, 580px);
  gap: 0.9rem;
  padding-top: 1rem;
}

.clinical-algorithm-action-branches::before {
  position: absolute;
  top: 0;
  right: 25%;
  left: 25%;
  border-top: 2px solid var(--clinical-tree-line);
  content: "";
}

.clinical-algorithm-action-branches > div {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 0.38rem;
  min-width: 0;
  padding-top: 0.65rem;
}

.clinical-algorithm-action-branches > div::before {
  position: absolute;
  top: 0;
  left: 50%;
  height: 0.65rem;
  border-left: 2px solid var(--clinical-tree-line);
  content: "";
}

.clinical-algorithm-branch-label {
  padding: 0.24rem 0.55rem;
  border: 1px solid #cbdff4;
  background: #eaf4ff;
  color: #2e639e;
}

.clinical-algorithm-row-details,
.clinical-algorithm-source-table {
  margin-top: 0.75rem;
  border-top: 1px solid #dce8f5;
  color: #587394;
  font-size: 0.82rem;
}

.clinical-algorithm-row-details summary,
.clinical-algorithm-source-table summary {
  padding-top: 0.65rem;
  color: #2e629d;
  cursor: pointer;
  font-weight: 750;
}

.clinical-algorithm-row-details dl {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 0.35rem 0.65rem;
  margin: 0.65rem 0 0;
}

.clinical-tree-pathway > .clinical-algorithm-row-details {
  width: min(100%, 320px);
  text-align: left;
}

.clinical-algorithm-row-details dt {
  color: #607b9c;
  font-weight: 750;
}

.clinical-algorithm-row-details dd {
  margin: 0;
  color: #173a66;
  overflow-wrap: break-word;
  word-break: normal;
}

.clinical-algorithm-source-table .knowledge-detail-table-wrap {
  margin-top: 0.7rem;
}

.clinical-algorithm-explorer {
  --clinical-tree-line: #9dbbd9;
  display: grid;
  min-width: 0;
  gap: 1rem;
  padding: 1rem;
  overflow: hidden;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(34, 184, 230, 0.08), transparent 30%),
    #f8fbff;
}

.clinical-algorithm-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
}

.clinical-algorithm-focus-nav,
.clinical-algorithm-global-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.clinical-algorithm-focus-button,
.clinical-algorithm-command {
  min-height: 2.1rem;
  padding: 0.38rem 0.72rem;
  border: 1px solid #c9ddf2;
  border-radius: 999px;
  background: #fff;
  color: #315f94;
  font-size: 0.78rem;
  font-weight: 780;
  line-height: 1.2;
  cursor: pointer;
  transition:
    border-color 150ms ease,
    box-shadow 150ms ease,
    transform 150ms ease;
}

.clinical-algorithm-focus-button:hover,
.clinical-algorithm-command:not(:disabled):hover {
  border-color: #8ebce9;
  box-shadow: 0 5px 14px rgba(23, 105, 224, 0.1);
  transform: translateY(-1px);
}

.clinical-algorithm-focus-button:focus-visible,
.clinical-algorithm-command:focus-visible,
.clinical-algorithm-group-card:focus-visible,
.clinical-algorithm-scenario-card:focus-visible {
  outline: 3px solid rgba(34, 184, 230, 0.3);
  outline-offset: 2px;
}

.clinical-algorithm-focus-button.is-selected {
  border-color: #1769e0;
  background: linear-gradient(135deg, #1769e0 0%, #168ed0 100%);
  color: #fff;
  box-shadow: 0 7px 17px rgba(23, 105, 224, 0.2);
}

.clinical-algorithm-command {
  border-radius: 9px;
}

.clinical-algorithm-command:disabled {
  border-color: #dfe9f4;
  background: #f1f5f9;
  color: #91a2b7;
  cursor: default;
}

.clinical-algorithm-view[hidden] {
  display: none !important;
}

.clinical-algorithm-overview {
  display: grid;
  justify-items: center;
  min-width: 0;
  padding: 0.45rem 0 0.7rem;
}

.clinical-algorithm-overview > .clinical-algorithm-node--root {
  width: min(100%, 390px);
  padding: 0.82rem 1rem;
  border: 2px solid #1769e0;
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(34, 184, 230, 0.13), transparent 42%),
    linear-gradient(145deg, #ffffff 0%, #eef6ff 100%);
  box-shadow: 0 12px 26px rgba(23, 105, 224, 0.13);
  text-align: center;
}

.clinical-algorithm-overview-connector {
  width: 2px;
  height: 2rem;
  background: var(--clinical-tree-line);
}

.clinical-algorithm-group-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 280px));
  width: 100%;
  min-width: 0;
  justify-content: center;
  gap: 1rem;
  padding-top: 1.7rem;
}

.clinical-algorithm-group-grid::before {
  position: absolute;
  top: 0;
  right: max(10%, 2rem);
  left: max(10%, 2rem);
  border-top: 2px solid var(--clinical-tree-line);
  content: "";
}

.clinical-algorithm-group-card {
  position: relative;
  display: grid;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 8.2rem;
  align-content: center;
  gap: 0.45rem;
  padding: 1rem;
  border: 1px solid #c9ddf2;
  border-radius: 16px;
  background: #fff;
  color: #12315b;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(30, 88, 157, 0.08);
  transition:
    border-color 170ms ease,
    box-shadow 170ms ease,
    transform 170ms ease;
}

.clinical-algorithm-group-card-wrap {
  position: relative;
  min-width: 0;
}

.clinical-algorithm-group-card::before {
  position: absolute;
  bottom: 100%;
  left: 50%;
  height: 1.7rem;
  border-left: 2px solid var(--clinical-tree-line);
  content: "";
}

.clinical-algorithm-group-card:hover {
  border-color: #75afe5;
  box-shadow: 0 13px 28px rgba(23, 105, 224, 0.14);
  transform: translateY(-2px);
}

.clinical-algorithm-group-card strong {
  font-size: 1rem;
  line-height: 1.35;
  overflow-wrap: break-word;
  word-break: normal;
}

.clinical-algorithm-group-count {
  color: #6680a3;
  font-size: 0.75rem;
  font-weight: 680;
}

.clinical-algorithm-group-view {
  min-width: 0;
  padding: 0.2rem 0 0.65rem;
}

.clinical-algorithm-focus-heading {
  display: grid;
  gap: 0.18rem;
  margin-bottom: 1rem;
  text-align: center;
}

.clinical-algorithm-focus-heading h3,
.clinical-algorithm-focus-heading p {
  margin: 0;
}

.clinical-algorithm-focus-heading h3 {
  color: #12315b;
  font-size: clamp(1.1rem, 2vw, 1.4rem);
}

.clinical-algorithm-focus-heading p {
  color: #6680a3;
  font-size: 0.82rem;
}

.clinical-algorithm-scenario-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 300px));
  width: 100%;
  min-width: 0;
  justify-content: center;
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.clinical-algorithm-branch-item {
  min-width: 0;
}

.clinical-algorithm-branch-item.is-expanded {
  grid-column: 1 / -1;
}

.clinical-algorithm-branch {
  min-width: 0;
}

.clinical-algorithm-scenario-card {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 6.8rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  padding: 0.85rem 0.9rem;
  border: 1px solid #cddff2;
  border-left: 5px solid #1769e0;
  border-radius: 14px;
  background: #fff;
  color: #163a66;
  cursor: pointer;
  list-style: none;
  box-shadow: 0 7px 18px rgba(30, 88, 157, 0.08);
  transition:
    border-color 150ms ease,
    box-shadow 150ms ease,
    transform 150ms ease;
}

.clinical-algorithm-scenario-card::-webkit-details-marker {
  display: none;
}

.clinical-algorithm-scenario-card:hover {
  border-color: #83b5e4;
  box-shadow: 0 11px 24px rgba(23, 105, 224, 0.13);
  transform: translateY(-1px);
}

.clinical-algorithm-scenario-card__content {
  display: grid;
  min-width: 0;
  gap: 0.45rem;
}

.clinical-algorithm-scenario-card__content strong {
  font-size: 0.9rem;
  line-height: 1.4;
  overflow-wrap: break-word;
  word-break: normal;
}

.clinical-algorithm-disclosure-label {
  flex: 0 0 auto;
  color: #1769e0;
  font-size: 0.7rem;
  font-weight: 800;
  white-space: nowrap;
}

.clinical-algorithm-branch-body {
  width: 100%;
  min-width: 0;
  margin-top: 0.75rem;
  padding: 1rem;
  overflow: hidden;
  border: 1px solid #d7e6f5;
  border-left: 3px solid #75afe5;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(30, 88, 157, 0.06);
}

.clinical-algorithm-step-sequence {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 280px));
  min-width: 0;
  justify-content: center;
  align-items: start;
  gap: 0.8rem;
}

.clinical-algorithm-step-sequence > .clinical-algorithm-node,
.clinical-algorithm-step-sequence > .clinical-algorithm-endpoint {
  width: 100%;
}

.clinical-algorithm-step-sequence .clinical-algorithm-action-branches {
  width: 100%;
  grid-column: 1 / -1;
}

.clinical-algorithm-row-details {
  width: min(100%, 720px);
  margin-right: auto;
  margin-left: auto;
  text-align: left;
}

.clinical-algorithm-next-label {
  margin: 1rem 0 0.55rem;
  color: #5e7898;
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.clinical-algorithm-scenario-list--nested {
  position: relative;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 300px));
  padding: 0.85rem 0 0.2rem 1rem;
  border-left: 2px solid var(--clinical-tree-line);
}

.clinical-algorithm-scenario-list--nested > .clinical-algorithm-branch-item {
  position: relative;
}

.clinical-algorithm-scenario-list--nested > .clinical-algorithm-branch-item::before {
  position: absolute;
  top: 3.4rem;
  right: 100%;
  width: 1rem;
  border-top: 2px solid var(--clinical-tree-line);
  content: "";
}

@media (max-width: 1100px) {
  .medication-filter-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .medication-identity-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .disease-overview-grid,
  .disease-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .clinical-tree-item {
    padding-right: 0.22rem;
    padding-left: 0.22rem;
  }

  .clinical-algorithm-node {
    padding: 0.62rem 0.66rem;
  }

  .clinical-algorithm-node__text {
    font-size: 0.8rem;
  }
}

@media (max-width: 780px) {
  .knowledge-shell-page {
    padding: 0.8rem;
  }

  .knowledge-topbar,
  .knowledge-page-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .knowledge-topbar__actions,
  .knowledge-heading-actions {
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .medication-filter-grid,
  .medication-detail-summary,
  .disease-detail-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .clinical-decision-tree {
    padding-right: 0;
    padding-left: 0;
  }

  .clinical-tree-root-item {
    text-align: left;
  }

  .clinical-tree-root-item > .clinical-algorithm-node--root {
    width: 100%;
    margin: 0;
  }

  .clinical-tree-level {
    display: block;
    margin-left: 0.55rem;
    padding: 0 0 0 1.15rem;
  }

  .clinical-tree-level::before {
    top: 0;
    bottom: 0.75rem;
    left: 0;
    width: 0;
    height: auto;
  }

  .clinical-tree-item,
  .clinical-tree-item:only-child {
    padding: 1rem 0 0 1rem;
    text-align: left;
  }

  .clinical-tree-item::before,
  .clinical-tree-item:only-child::before,
  .clinical-tree-item:first-child::before,
  .clinical-tree-item:last-child::before {
    position: absolute;
    top: 1.8rem;
    right: auto;
    left: 0;
    display: block;
    width: 1rem;
    height: 0;
    border: 0;
    border-top: 2px solid var(--clinical-tree-line);
    border-radius: 0;
  }

  .clinical-tree-item::after,
  .clinical-tree-item:only-child::after {
    display: none;
  }

  .clinical-tree-edge-label {
    position: relative;
    top: auto;
    left: auto;
    max-width: 100%;
    margin: 0 0 0.4rem;
    transform: none;
  }

  .clinical-tree-pathway {
    justify-items: stretch;
  }

  .clinical-tree-pathway > .clinical-algorithm-node,
  .clinical-tree-pathway > .clinical-algorithm-row-details {
    width: 100%;
  }

  .clinical-tree-pathway > .clinical-algorithm-connector {
    margin-right: auto;
    margin-left: auto;
  }
}

@media (max-width: 540px) {
  .knowledge-topbar__actions,
  .knowledge-heading-actions,
  .medication-editor-actions,
  .medication-table-actions,
  .disease-editor-actions,
  .disease-table-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .knowledge-topbar__actions .btn,
  .knowledge-heading-actions .btn,
  .medication-editor-actions .btn,
  .medication-table-actions .btn,
  .disease-editor-actions .btn,
  .disease-table-actions .btn {
    width: 100%;
  }

  .knowledge-user-chip {
    min-width: 0;
  }

  .medication-filter-grid,
  .medication-identity-grid,
  .medication-detail-summary,
  .disease-overview-grid,
  .disease-filter-grid,
  .disease-detail-summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .medication-filter-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .disease-filter-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .clinical-algorithm-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .clinical-algorithm-action-branches {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    padding-top: 0;
    padding-left: 1rem;
    border-left: 2px solid var(--clinical-tree-line);
  }

  .clinical-algorithm-action-branches::before {
    display: none;
  }

  .clinical-algorithm-action-branches > div {
    justify-items: stretch;
    padding: 0.45rem 0 0.45rem 1rem;
  }

  .clinical-algorithm-action-branches > div::before {
    top: 50%;
    left: -1rem;
    width: 1rem;
    height: 0;
    border-top: 2px solid var(--clinical-tree-line);
    border-left: 0;
  }

  .clinical-algorithm-action-branches .clinical-algorithm-node {
    width: 100%;
  }
}

@media (max-width: 780px) {
  .clinical-algorithm-explorer {
    gap: 0.85rem;
    padding: 0.8rem;
  }

  .clinical-algorithm-controls {
    align-items: stretch;
    flex-direction: column;
  }

  .clinical-algorithm-focus-nav {
    align-items: stretch;
  }

  .clinical-algorithm-focus-button {
    flex: 1 1 auto;
  }

  .clinical-algorithm-global-actions {
    justify-content: flex-end;
  }

  .clinical-algorithm-overview {
    justify-items: stretch;
  }

  .clinical-algorithm-overview > .clinical-algorithm-node--root {
    width: 100%;
  }

  .clinical-algorithm-overview-connector {
    margin-left: 1rem;
  }

  .clinical-algorithm-group-grid,
  .clinical-algorithm-scenario-list {
    grid-template-columns: minmax(0, 1fr);
    justify-content: stretch;
  }

  .clinical-algorithm-group-grid {
    gap: 0.75rem;
    padding-top: 0;
    padding-left: 2rem;
    border-left: 2px solid var(--clinical-tree-line);
  }

  .clinical-algorithm-group-grid::before {
    display: none;
  }

  .clinical-algorithm-group-card {
    min-height: 6.2rem;
  }

  .clinical-algorithm-group-card::before {
    top: 50%;
    right: 100%;
    bottom: auto;
    left: auto;
    width: 2rem;
    height: 0;
    border-top: 2px solid var(--clinical-tree-line);
    border-left: 0;
  }

  .clinical-algorithm-focus-heading {
    text-align: left;
  }

  .clinical-algorithm-branch-item.is-expanded {
    grid-column: auto;
  }

  .clinical-algorithm-scenario-card {
    min-height: 5.5rem;
  }

  .clinical-algorithm-branch-body {
    padding: 0.8rem;
  }

  .clinical-algorithm-step-sequence {
    grid-template-columns: minmax(0, 1fr);
  }

  .clinical-algorithm-scenario-list--nested {
    display: grid;
    margin-left: 0.25rem;
    padding-left: 1rem;
  }

  .clinical-algorithm-row-details dl {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 540px) {
  .clinical-algorithm-global-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .clinical-algorithm-command {
    width: 100%;
  }

  .clinical-algorithm-scenario-card {
    align-items: flex-start;
    flex-direction: column;
  }

  .clinical-algorithm-disclosure-label {
    white-space: normal;
  }
}

/* Focused Disease Knowledge navigator. Only the active route is visible. */
.clinical-algorithm-navigator {
  --algorithm-line: #aac3dc;
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  padding: 1rem;
  overflow: clip;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(34, 184, 230, 0.07), transparent 32%),
    #f8fbff;
}

.clinical-algorithm-route[hidden],
.clinical-algorithm-detail-panel[hidden],
.clinical-algorithm-detail-view[hidden] {
  display: none !important;
}

.clinical-algorithm-route {
  min-width: 0;
}

.clinical-algorithm-route-header {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  padding: 0.15rem 0.15rem 0.85rem;
  border-bottom: 1px solid #dce9f6;
}

.clinical-algorithm-breadcrumb {
  min-width: 0;
}

.clinical-algorithm-breadcrumb ol {
  display: flex;
  min-width: 0;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.clinical-algorithm-breadcrumb li {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 0.3rem;
  color: #6680a3;
  font-size: 0.78rem;
  font-weight: 720;
}

.clinical-algorithm-breadcrumb li + li::before {
  color: #9bb0c9;
  content: ">";
}

.clinical-algorithm-breadcrumb button,
.clinical-algorithm-breadcrumb span {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.clinical-algorithm-breadcrumb button {
  color: #1769e0;
  cursor: pointer;
}

.clinical-algorithm-breadcrumb button:hover {
  text-decoration: underline;
  text-underline-offset: 0.18rem;
}

.clinical-algorithm-breadcrumb span[aria-current="page"] {
  max-width: 25rem;
  color: #294d78;
}

.clinical-algorithm-route-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 0.45rem;
}

.clinical-algorithm-back,
.clinical-algorithm-start-over,
.clinical-algorithm-detail-trigger,
.clinical-algorithm-detail-close {
  min-height: 2.15rem;
  padding: 0.38rem 0.72rem;
  border: 1px solid #c9ddf2;
  border-radius: 9px;
  background: #fff;
  color: #315f94;
  font-size: 0.76rem;
  font-weight: 780;
  cursor: pointer;
  transition:
    border-color 150ms ease,
    box-shadow 150ms ease,
    transform 150ms ease;
}

.clinical-algorithm-back::before {
  margin-right: 0.3rem;
  content: "\2190";
}

.clinical-algorithm-back:hover,
.clinical-algorithm-start-over:hover,
.clinical-algorithm-detail-trigger:hover,
.clinical-algorithm-detail-close:hover {
  border-color: #8ebce9;
  box-shadow: 0 5px 14px rgba(23, 105, 224, 0.1);
  transform: translateY(-1px);
}

.clinical-algorithm-stage {
  display: grid;
  width: min(100%, 980px);
  min-width: 0;
  justify-items: center;
  gap: 0.75rem;
  margin: 0 auto;
  padding: clamp(1.45rem, 3vw, 2.4rem) clamp(0.3rem, 2vw, 1.5rem) 1.4rem;
  text-align: center;
}

.clinical-algorithm-stage h3 {
  max-width: 48rem;
  margin: 0;
  color: #12315b;
  font-size: clamp(1.2rem, 2.4vw, 1.75rem);
  line-height: 1.25;
  overflow-wrap: break-word;
  word-break: normal;
}

.clinical-algorithm-stage h3:focus {
  outline: none;
}

.clinical-algorithm-choice:focus-visible,
.clinical-algorithm-back:focus-visible,
.clinical-algorithm-start-over:focus-visible,
.clinical-algorithm-detail-trigger:focus-visible,
.clinical-algorithm-detail-close:focus-visible,
.clinical-algorithm-breadcrumb button:focus-visible {
  outline: 3px solid rgba(34, 184, 230, 0.32);
  outline-offset: 3px;
}

.clinical-algorithm-disease-root,
.clinical-algorithm-question,
.clinical-algorithm-action-box {
  display: grid;
  width: min(100%, 360px);
  min-width: 0;
  gap: 0.32rem;
  padding: 1rem 1.1rem;
  border-radius: 15px;
  background: #fff;
  color: #12315b;
  box-shadow: 0 9px 22px rgba(30, 88, 157, 0.08);
  overflow-wrap: break-word;
  word-break: normal;
}

.clinical-algorithm-disease-root {
  border: 2px solid #1769e0;
  background:
    radial-gradient(circle at top right, rgba(34, 184, 230, 0.12), transparent 42%),
    #fff;
}

.clinical-algorithm-question {
  border: 1px solid #d7e5f4;
  border-top: 4px solid #22a4d7;
}

.clinical-algorithm-action-box {
  border: 1px solid #cce8dc;
  border-top: 4px solid #22a878;
  background: #fbfffd;
}

.clinical-algorithm-question > span,
.clinical-algorithm-action-box > span {
  color: #6680a3;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.clinical-algorithm-question > strong,
.clinical-algorithm-action-box > strong {
  font-size: 0.9rem;
  line-height: 1.42;
}

.clinical-algorithm-vertical-connector,
.clinical-algorithm-branch-connector {
  width: 2px;
  height: 1.7rem;
  background: var(--algorithm-line);
}

.clinical-algorithm-choice-prompt {
  margin: 0.1rem 0 0;
  color: #5e7898;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.clinical-algorithm-choices {
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 360px));
  width: 100%;
  min-width: 0;
  justify-content: center;
  gap: 1rem;
  padding-top: 1.35rem;
}

.clinical-algorithm-choices:not(.clinical-algorithm-choices--selector)::before {
  position: absolute;
  top: 0;
  right: max(12%, 2rem);
  left: max(12%, 2rem);
  border-top: 1px solid var(--algorithm-line);
  content: "";
}

.clinical-algorithm-choices > div {
  position: relative;
  min-width: 0;
}

.clinical-algorithm-choices:not(.clinical-algorithm-choices--selector) > div::before {
  position: absolute;
  bottom: 100%;
  left: 50%;
  height: 1.35rem;
  border-left: 1px solid var(--algorithm-line);
  content: "";
}

.clinical-algorithm-choices--selector {
  grid-template-columns: minmax(0, 620px);
  gap: 0.65rem;
  padding-top: 0.25rem;
}

.clinical-algorithm-choice {
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 5.4rem;
  align-items: center;
  justify-content: space-between;
  gap: 0.9rem;
  padding: 0.9rem 1rem;
  border: 1px solid #c9ddf2;
  border-radius: 14px;
  background: #fff;
  color: #12315b;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(30, 88, 157, 0.08);
  transition:
    border-color 160ms ease,
    box-shadow 160ms ease,
    transform 160ms ease;
}

.clinical-algorithm-choice:hover {
  border-color: #75afe5;
  box-shadow: 0 13px 28px rgba(23, 105, 224, 0.14);
  transform: translateY(-2px);
}

.clinical-algorithm-choice strong {
  min-width: 0;
  font-size: 0.94rem;
  line-height: 1.38;
  overflow-wrap: break-word;
  word-break: normal;
}

.clinical-algorithm-choice span {
  flex: 0 0 auto;
  color: #1769e0;
  font-size: 0.7rem;
  font-weight: 800;
}

.clinical-algorithm-choice span::after {
  margin-left: 0.24rem;
  content: "\2192";
}

.clinical-algorithm-detail-trigger {
  margin-top: 0.15rem;
  border-color: transparent;
  background: transparent;
  color: #1769e0;
  box-shadow: none;
}

.clinical-algorithm-detail-panel {
  position: fixed;
  z-index: 1090;
  inset: 0;
  display: grid;
  justify-items: end;
}

.clinical-algorithm-detail-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  border: 0;
  background: rgba(12, 35, 64, 0.32);
  cursor: pointer;
}

.clinical-algorithm-detail-drawer {
  position: relative;
  z-index: 1;
  width: min(100%, 470px);
  height: 100%;
  padding: 1rem;
  overflow-y: auto;
  border-left: 1px solid #cbdff4;
  background: #f8fbff;
  color: #12315b;
  box-shadow: -20px 0 48px rgba(22, 58, 102, 0.2);
}

.clinical-algorithm-detail-header {
  position: sticky;
  z-index: 2;
  top: -1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: -1rem -1rem 1rem;
  padding: 1rem;
  border-bottom: 1px solid #d9e7f7;
  background: rgba(248, 251, 255, 0.97);
  backdrop-filter: blur(10px);
}

.clinical-algorithm-detail-view {
  min-width: 0;
}

.clinical-algorithm-detail-view > h3 {
  margin: 0.25rem 0 1rem;
  color: #12315b;
  font-size: 1.35rem;
  overflow-wrap: break-word;
}

.clinical-algorithm-detail-list {
  display: grid;
  grid-template-columns: minmax(7rem, max-content) minmax(0, 1fr);
  gap: 0.45rem 0.75rem;
  margin: 0;
}

.clinical-algorithm-detail-list dt {
  color: #6680a3;
  font-size: 0.72rem;
  font-weight: 800;
}

.clinical-algorithm-detail-list dd {
  min-width: 0;
  margin: 0;
  color: #173a66;
  font-size: 0.84rem;
  line-height: 1.45;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  word-break: normal;
}

.clinical-algorithm-detail-section {
  display: grid;
  gap: 0.7rem;
  margin-top: 1.15rem;
  padding-top: 1rem;
  border-top: 1px solid #d9e7f7;
}

.clinical-algorithm-detail-section > h4,
.clinical-algorithm-regimen h4,
.clinical-algorithm-evidence h4 {
  margin: 0;
  color: #12315b;
  font-size: 0.95rem;
}

.clinical-algorithm-regimen,
.clinical-algorithm-evidence {
  display: grid;
  gap: 0.6rem;
  padding: 0.85rem;
  border: 1px solid #d6e5f4;
  border-radius: 12px;
  background: #fff;
}

@media (max-width: 780px) {
  .clinical-algorithm-navigator {
    padding: 0.75rem;
  }

  .clinical-algorithm-route-header {
    align-items: stretch;
    flex-direction: column;
  }

  .clinical-algorithm-route-actions {
    justify-content: space-between;
  }

  .clinical-algorithm-stage {
    padding: 1.25rem 0 0.9rem;
  }

  .clinical-algorithm-choices {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
    padding-top: 0.25rem;
  }

  .clinical-algorithm-choices:not(.clinical-algorithm-choices--selector)::before,
  .clinical-algorithm-choices:not(.clinical-algorithm-choices--selector) > div::before {
    display: none;
  }

  .clinical-algorithm-choice {
    min-height: 4.5rem;
  }

  .clinical-algorithm-detail-drawer {
    width: min(100%, 520px);
  }
}

@media (max-width: 540px) {
  .clinical-algorithm-breadcrumb span[aria-current="page"] {
    max-width: 12rem;
  }

  .clinical-algorithm-back,
  .clinical-algorithm-start-over {
    flex: 1 1 0;
  }

  .clinical-algorithm-detail-drawer {
    width: 100%;
  }

  .clinical-algorithm-detail-list {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.18rem;
  }

  .clinical-algorithm-detail-list dd + dt {
    margin-top: 0.35rem;
  }
}

.pediatric-shell-page {
  min-height: 100vh;
  padding: 1.5rem;
  background:
    radial-gradient(circle at top left, rgba(34, 184, 230, 0.1), transparent 24%),
    radial-gradient(circle at top right, rgba(23, 105, 224, 0.08), transparent 26%),
    linear-gradient(180deg, #f4f8fe 0%, #eef5fd 100%);
}

.pediatric-shell {
  width: min(100%, 1280px);
  margin: 0 auto;
  display: grid;
  gap: 1.35rem;
  color: #12315b;
}

.pediatric-shell__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.55rem 1.7rem;
  border: 1px solid #d9e7f7;
  border-radius: 26px;
  background:
    radial-gradient(circle at top right, rgba(34, 184, 230, 0.14), transparent 28%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(244, 249, 255, 0.96) 100%);
  box-shadow: 0 22px 48px rgba(30, 88, 157, 0.1);
}

.pediatric-shell__header-main,
.pediatric-shell__header-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.pediatric-shell__header-text {
  display: grid;
  gap: 0.25rem;
}

.pediatric-shell__header-text h1 {
  margin: 0;
  color: #12315b;
  font-size: clamp(2rem, 3vw, 2.6rem);
  line-height: 1.02;
  letter-spacing: -0.04em;
}

.pediatric-shell__header-text p {
  margin: 0;
  color: #6a84a6;
  font-size: 1rem;
}

.pediatric-app-icon {
  display: grid;
  place-items: center;
  width: 70px;
  height: 70px;
  border-radius: 22px;
  background: linear-gradient(180deg, #f8fbff 0%, #e9f4ff 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 16px 28px rgba(23, 105, 224, 0.12);
}

.pediatric-app-icon svg {
  width: 42px;
  height: 42px;
  fill: none;
  stroke: url(#pedsIconStroke);
  stroke-width: 3.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.pediatric-user-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.8rem 1rem;
  border: 1px solid #d9e7f7;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.88);
  color: #12315b;
  box-shadow: 0 12px 22px rgba(30, 88, 157, 0.06);
}

.pediatric-user-chip__name {
  font-weight: 700;
}

.pediatric-user-chip__role {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.68rem;
  border-radius: 999px;
  background: #edf5ff;
  color: #2f5b93;
  font-size: 0.83rem;
  font-weight: 700;
}

.pediatric-secondary-button,
.pediatric-shell .btn-primary,
.pediatric-shell .btn-secondary,
.pediatric-shell .btn-danger {
  min-height: 2.95rem;
  border-radius: 14px;
  font-weight: 700;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease,
    background-color 180ms ease;
}

.pediatric-secondary-button {
  border: 1px solid #c9dcf6;
  background: #fff;
  color: #1769e0;
  box-shadow: 0 12px 22px rgba(23, 105, 224, 0.08);
}

.pediatric-secondary-button:hover,
.pediatric-secondary-button:focus {
  color: #1454cf;
  border-color: #aecaee;
  background: #f8fbff;
}

.pediatric-shell .btn-primary {
  border: 0;
  background: linear-gradient(135deg, #1769e0 0%, #22b8e6 100%);
  color: #fff;
  box-shadow: 0 16px 28px rgba(23, 105, 224, 0.16);
}

.pediatric-shell .btn-primary:hover,
.pediatric-shell .btn-primary:focus {
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 20px 34px rgba(23, 105, 224, 0.2);
}

.pediatric-shell .btn-secondary {
  border: 1px solid #c9dcf6;
  background: #fff;
  color: #1769e0;
  box-shadow: 0 10px 20px rgba(23, 105, 224, 0.08);
}

.pediatric-shell .btn-secondary:hover,
.pediatric-shell .btn-secondary:focus {
  color: #1454cf;
  border-color: #aecaee;
  background: #f8fbff;
}

.pediatric-shell .btn-danger {
  border: 1px solid rgba(199, 75, 80, 0.18);
  background: #fdf1f2;
  color: #b63f44;
  box-shadow: none;
}

.pediatric-shell .btn-danger:hover,
.pediatric-shell .btn-danger:focus {
  color: #a7373c;
  border-color: rgba(199, 75, 80, 0.28);
  background: #fde8ea;
}

.pediatric-shell__content {
  display: grid;
}

.pediatric-navset > .nav,
.pediatric-navset .nav-tabs,
.pediatric-navset .navbar {
  display: none !important;
}

.pediatric-navset .tab-content {
  overflow: visible;
}

.pediatric-navset .tab-pane {
  display: none;
}

.pediatric-navset .tab-pane.active {
  display: block;
}

.pediatric-shell .page-section {
  display: grid;
  gap: 1.25rem;
  align-content: start;
}

.pediatric-shell .page-section--dashboard {
  gap: 1rem;
}

.pediatric-shell .page-section--insights {
  gap: 1rem;
  min-width: 0;
}

.pediatric-shell .section-heading--insights {
  gap: 0.2rem;
}

.pediatric-shell .insights-eyebrow {
  color: #1769e0;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.pediatric-shell .section-heading {
  display: grid;
  gap: 0.35rem;
}

.pediatric-shell .section-heading h2 {
  margin: 0;
  color: #12315b;
  font-size: clamp(1.7rem, 2.4vw, 2.1rem);
  letter-spacing: -0.03em;
}

.pediatric-shell .section-heading p {
  margin: 0;
  color: #6a84a6;
  max-width: 44rem;
  line-height: 1.55;
}

.dashboard-data-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.15rem;
}

.pediatric-shell .metric-card,
.pediatric-shell .card,
.pediatric-shell .detail-card,
.pediatric-shell .feedback-panel {
  border: 1px solid #d9e7f7;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 18px 36px rgba(30, 88, 157, 0.08);
  color: #12315b;
}

.pediatric-shell .metric-card {
  display: grid;
  align-content: start;
  gap: 0.5rem;
  min-height: 148px;
  padding: 1.2rem 1.25rem;
}

.pediatric-shell .metric-primary {
  border-top: 4px solid #1769e0;
}

.pediatric-shell .metric-success {
  border-top: 4px solid #2e9d67;
}

.pediatric-shell .metric-warning {
  border-top: 4px solid #d59a13;
}

.pediatric-shell .metric-accent {
  border-top: 4px solid #22b8e6;
}

.pediatric-shell .metric-label {
  color: #6a84a6;
  font-size: 0.96rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
}

.pediatric-shell .metric-value {
  margin: 0;
  color: #12315b;
  font-size: clamp(2rem, 3vw, 2.6rem);
  line-height: 1;
}

.pediatric-shell .metric-note {
  margin: 0;
  color: #6a84a6;
  line-height: 1.5;
}

.pediatric-shell .dashboard-metric-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.pediatric-shell .page-section--insights .dashboard-metric-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.9rem;
}

.pediatric-shell .page-section--insights .metric-card {
  min-height: 96px;
  gap: 0.3rem;
  padding: 0.85rem 0.95rem;
  border-radius: 18px;
}

.pediatric-shell .page-section--insights .metric-value {
  font-size: clamp(1.75rem, 2.3vw, 2.15rem);
}

.pediatric-shell .page-section--dashboard .metric-card {
  min-height: 104px;
  gap: 0.35rem;
  padding: 0.9rem 1rem;
}

.pediatric-shell .page-section--dashboard .metric-value {
  font-size: clamp(1.8rem, 2.4vw, 2.2rem);
}

.pediatric-shell .dashboard-filter-panel {
  padding: 1rem 1.1rem;
  border: 1px solid #d9e7f7;
  border-radius: 22px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  box-shadow: 0 18px 36px rgba(30, 88, 157, 0.08);
}

.pediatric-shell .dashboard-filter-grid {
  display: grid;
  grid-template-columns: minmax(240px, 1.3fr) repeat(6, minmax(0, 1fr)) auto;
  gap: 0.95rem;
  align-items: end;
}

.pediatric-shell .dashboard-filter-grid .shiny-input-container {
  margin-bottom: 0;
}

.pediatric-shell .dashboard-filter-grid label {
  margin-bottom: 0.35rem;
  color: #12315b;
  font-size: 0.9rem;
  font-weight: 700;
}

.pediatric-shell .dashboard-filter-actions {
  display: grid;
  gap: 0.6rem;
  align-items: center;
}

.pediatric-shell .dashboard-filter-summary {
  color: #6680a3;
  font-size: 0.88rem;
  line-height: 1.4;
}

.pediatric-shell .dashboard-analytics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.pediatric-shell .insights-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  min-width: 0;
}

.pediatric-shell .insights-chart-grid > *,
.pediatric-shell .insights-chart-grid > .shiny-html-output {
  display: flex;
  min-width: 0;
  max-width: 100%;
}

.pediatric-shell .insights-card {
  width: 100%;
  min-width: 0;
  min-height: 310px;
  border-radius: 20px;
}

.pediatric-shell .insights-card .dashboard-card-body {
  min-width: 0;
  padding: 0.75rem 0.9rem 0.9rem;
}

.pediatric-shell .insights-card .dashboard-plot-frame {
  min-width: 0;
  overflow: hidden;
}

.pediatric-shell .insights-card .dashboard-trend-plot {
  min-width: 0;
  max-height: 250px;
}

.pediatric-shell .insights-card .dashboard-bar-list {
  gap: 0.8rem;
}

.pediatric-shell .insights-card .dashboard-bar-list__label {
  min-width: 0;
  overflow-wrap: anywhere;
}

.pediatric-shell .insights-card .dashboard-histogram {
  grid-template-columns: repeat(auto-fit, minmax(54px, 1fr));
  gap: 0.5rem;
  min-height: 220px;
}

.pediatric-shell .insights-card .dashboard-histogram__bar-shell {
  min-height: 132px;
  padding-inline: 0.28rem;
}

.pediatric-shell .insights-card .dashboard-histogram__label {
  font-size: 0.72rem;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.pediatric-shell .dashboard-analytics-grid--summary {
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.95fr);
}

.pediatric-shell .dashboard-analytics-card {
  display: grid;
  align-content: start;
  min-height: 100%;
  overflow: hidden;
}

.pediatric-shell .dashboard-analytics-card--wide {
  min-width: 0;
}

.pediatric-shell .dashboard-analytics-card--full {
  grid-column: 1 / -1;
}

.pediatric-shell .dashboard-card-header {
  display: grid;
  gap: 0.28rem;
  padding: 0.85rem 1rem;
  border-bottom: 1px solid #e3eefb;
  background: linear-gradient(180deg, #fbfdff 0%, #f6faff 100%);
}

.pediatric-shell .dashboard-card-title {
  color: #12315b;
  font-size: 1.03rem;
  font-weight: 700;
}

.pediatric-shell .dashboard-card-subtitle {
  color: #6a84a6;
  font-size: 0.87rem;
  line-height: 1.45;
}

.pediatric-shell .dashboard-card-body {
  display: grid;
  gap: 0.75rem;
  padding: 0.75rem 1rem 0.9rem;
}

.pediatric-shell .dashboard-analytics-card--trend .dashboard-card-body {
  padding-top: 0.55rem;
}

.pediatric-shell .dashboard-plot-frame {
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scrollbar-color: #b9cfea #edf5ff;
  scrollbar-width: thin;
}

.pediatric-shell .dashboard-plot {
  display: block;
  width: 100%;
  height: auto;
  color: #12315b;
  font-family: "Avenir Next", "Segoe UI", sans-serif;
}

.pediatric-shell .dashboard-trend-plot {
  min-width: 760px;
  max-height: 280px;
}

.pediatric-shell .dashboard-diagnosis-plot {
  min-width: 620px;
  max-height: 300px;
}

.pediatric-shell .dashboard-age-plot {
  min-width: 620px;
  max-height: 300px;
}

.pediatric-shell .dashboard-plot-gridline {
  stroke: #dceafb;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.pediatric-shell .dashboard-plot-axis {
  stroke: #9eb7d6;
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

.pediatric-shell .dashboard-plot-tick,
.pediatric-shell .dashboard-plot-axis-title {
  fill: #6680a3;
  font-size: 13px;
}

.pediatric-shell .dashboard-plot-axis-title {
  fill: #52739c;
  font-weight: 700;
}

.pediatric-shell .dashboard-plot-category {
  fill: #12315b;
  font-size: 14px;
  font-weight: 650;
}

.pediatric-shell .dashboard-plot-value {
  fill: #12315b;
  font-size: 13px;
  font-weight: 700;
}

.pediatric-shell .dashboard-trend-area {
  fill: rgba(34, 184, 230, 0.12);
}

.pediatric-shell .dashboard-trend-line {
  fill: none;
  stroke: #1769e0;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 4;
  vector-effect: non-scaling-stroke;
}

.pediatric-shell .dashboard-trend-point {
  fill: #ffffff;
  stroke: #22b8e6;
  stroke-width: 3;
  vector-effect: non-scaling-stroke;
}

.pediatric-shell .dashboard-diagnosis-bar {
  fill: #1769e0;
}

.pediatric-shell .dashboard-age-bar {
  fill: #22b8e6;
}

.pediatric-shell .dashboard-age-bar--unknown {
  fill: #9ab0c8;
}

.pediatric-shell .dashboard-card-stack {
  display: grid;
  gap: 1rem;
}

.pediatric-shell .dashboard-card-control {
  display: grid;
  max-width: 260px;
}

.pediatric-shell .dashboard-subsection-heading {
  margin: 0;
  color: #12315b;
  font-size: 0.94rem;
  font-weight: 700;
}

.pediatric-shell .dashboard-empty-state {
  display: grid;
  place-items: center;
  min-height: 180px;
  padding: 1rem;
  border: 1px dashed #d9e7f7;
  border-radius: 18px;
  background: linear-gradient(180deg, #fbfdff 0%, #f5f9ff 100%);
  text-align: center;
}

.pediatric-shell .dashboard-empty-state p {
  margin: 0;
  color: #6a84a6;
  max-width: 26rem;
  line-height: 1.55;
}

.pediatric-shell .dashboard-bar-list,
.pediatric-shell .dashboard-coverage-list {
  display: grid;
  gap: 0.95rem;
}

.pediatric-shell .dashboard-bar-list__row,
.pediatric-shell .dashboard-coverage-list__row {
  display: grid;
  gap: 0.45rem;
}

.pediatric-shell .dashboard-bar-list__meta,
.pediatric-shell .dashboard-coverage-list__meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
}

.pediatric-shell .dashboard-bar-list__label {
  color: #12315b;
  font-weight: 700;
  line-height: 1.35;
}

.pediatric-shell .dashboard-bar-list__value {
  color: #6680a3;
  font-size: 0.88rem;
  text-align: right;
}

.pediatric-shell .dashboard-bar-list__track {
  overflow: hidden;
  min-height: 0.8rem;
  border-radius: 999px;
  background: #edf5ff;
}

.pediatric-shell .dashboard-bar-list__fill {
  min-height: 0.8rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #1769e0 0%, #22b8e6 100%);
}

.pediatric-shell .dashboard-bar-list__fill--coverage {
  background: linear-gradient(135deg, #22b8e6 0%, #1769e0 100%);
}

.pediatric-shell .dashboard-histogram {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));
  gap: 0.75rem;
  align-items: end;
  min-height: 240px;
  padding: 0.5rem 0.2rem 0;
}

.pediatric-shell .dashboard-histogram__item {
  display: grid;
  gap: 0.45rem;
  justify-items: center;
  align-items: end;
}

.pediatric-shell .dashboard-histogram__count {
  color: #6680a3;
  font-size: 0.83rem;
  font-weight: 700;
}

.pediatric-shell .dashboard-histogram__bar-shell {
  display: flex;
  align-items: flex-end;
  width: 100%;
  min-height: 160px;
  padding: 0 0.4rem;
  border-radius: 18px 18px 0 0;
  background: linear-gradient(180deg, #f7fbff 0%, #edf5ff 100%);
}

.pediatric-shell .dashboard-histogram__bar {
  width: 100%;
  min-height: 12px;
  border-radius: 16px 16px 0 0;
  background: linear-gradient(180deg, #22b8e6 0%, #1769e0 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

.pediatric-shell .dashboard-histogram__label {
  color: #12315b;
  font-size: 0.82rem;
  font-weight: 700;
  text-align: center;
}

.pediatric-shell .dashboard-inline-stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 0.8rem 0.95rem;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background: linear-gradient(180deg, #fbfdff 0%, #f5f9ff 100%);
}

.pediatric-shell .dashboard-inline-stat__label {
  color: #12315b;
  font-weight: 700;
}

.pediatric-shell .dashboard-inline-stat__value {
  color: #1769e0;
  font-weight: 700;
}

.pediatric-shell .dashboard-table-wrap {
  overflow-x: auto;
}

.pediatric-shell .dashboard-table {
  width: 100%;
  border-collapse: collapse;
}

.pediatric-shell .dashboard-table th,
.pediatric-shell .dashboard-table td {
  padding: 0.8rem 0.75rem;
  border-bottom: 1px solid #e6effa;
  text-align: left;
}

.pediatric-shell .dashboard-table th {
  color: #6680a3;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.pediatric-shell .dashboard-table td {
  color: #12315b;
  font-size: 0.94rem;
}

.pediatric-shell .card-header {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #e3eefb;
  background: linear-gradient(180deg, #fbfdff 0%, #f6faff 100%);
  color: #12315b;
  font-weight: 700;
}

.pediatric-shell .card-body,
.pediatric-shell .card > .shiny-html-output,
.pediatric-shell .card > .html-fill-item,
.pediatric-shell .card > .shiny-data-frame-output,
.pediatric-shell .card > .shiny-bound-output {
  color: #12315b;
}

.pediatric-empty-state {
  display: grid;
  place-items: center;
  gap: 0.35rem;
  min-height: 240px;
  padding: 1.5rem;
  text-align: center;
}

.pediatric-empty-state h3 {
  margin: 0;
  color: #12315b;
  font-size: 1.15rem;
}

.pediatric-empty-state p {
  margin: 0;
  color: #6a84a6;
  max-width: 28rem;
}

.pediatric-shell .form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.pediatric-shell .form-field-wide {
  grid-column: 1 / -1;
}

.pediatric-shell .encounter-form-stack,
.pediatric-shell .detail-grid {
  display: grid;
  gap: 1rem;
}

.pediatric-shell .encounter-onepage-layout {
  display: grid;
  gap: 0.75rem;
  padding-bottom: 5rem;
}

.pediatric-shell .encounter-edit-context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid #cfe2f8;
  border-radius: 14px;
  background: linear-gradient(135deg, #f7fbff 0%, #edf6ff 100%);
  color: #456887;
  font-size: 0.9rem;
}

.pediatric-shell .encounter-edit-context strong {
  color: #12315b;
}

.pediatric-shell .encounter-section {
  scroll-margin-top: 7rem;
  overflow: visible;
}

.pediatric-shell .encounter-section .card {
  margin-bottom: 0;
  overflow: visible;
}

.pediatric-shell .encounter-section .card-header {
  padding: 0.72rem 1rem;
  font-size: 0.95rem;
}

.pediatric-shell .encounter-section .card-body {
  padding: 0.8rem 0.9rem;
  overflow: visible;
}

.pediatric-shell .encounter-section__body {
  display: grid;
  gap: 0.55rem;
  overflow: visible;
}

.pediatric-shell .encounter-section-nav {
  position: sticky;
  top: 1rem;
  z-index: 15;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid #d9e7f7;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 18px 36px rgba(30, 88, 157, 0.08);
  backdrop-filter: blur(14px);
}

.pediatric-shell .encounter-section-nav__link {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
  padding: 0.3rem 0.68rem;
  border: 1px solid #d9e7f7;
  border-radius: 999px;
  background: #f7fbff;
  color: #1769e0;
  font-size: 0.84rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.pediatric-shell .encounter-section-nav__link:hover {
  background: #edf5ff;
  color: #1457ba;
  text-decoration: none;
}

.pediatric-shell .encounter-form-grid--compact {
  gap: 0.9rem;
}

.pediatric-shell .encounter-basic-information {
  display: grid;
  gap: 0.9rem;
  overflow: visible;
}

.pediatric-shell .encounter-basic-information__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
}

.pediatric-shell .encounter-readonly-input {
  background: linear-gradient(180deg, #fbfdff 0%, #f1f7ff 100%);
  border-color: #d9e7f7;
  color: #12315b;
  font-weight: 700;
  cursor: not-allowed;
}

.pediatric-shell .encounter-chief-complaint {
  display: grid;
  gap: 0.7rem;
}

.pediatric-shell .encounter-diagnosis-input,
.pediatric-shell .encounter-diagnosis-combobox .selectize-input,
.pediatric-shell .encounter-diagnosis-combobox .selectize-input.full {
  min-height: 3rem;
  padding: 0.55rem 0.78rem;
  border: 1px solid #d9e7f7;
  border-radius: 16px;
  background: linear-gradient(180deg, #fcfeff 0%, #f5f9ff 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.pediatric-shell .encounter-diagnosis-input:focus,
.pediatric-shell .encounter-diagnosis-combobox .selectize-input.focus {
  border-color: #22b8e6;
  box-shadow: 0 0 0 0.16rem rgba(34, 184, 230, 0.15);
}

.pediatric-shell .encounter-diagnosis-combobox .selectize-control {
  margin-bottom: 0;
}

.pediatric-shell .encounter-review-filters {
  gap: 0.95rem;
}

.pediatric-shell .encounter-chief-complaint .selectize-control {
  margin-bottom: 0;
}

.pediatric-shell .encounter-chief-complaint .selectize-input,
.pediatric-shell .encounter-chief-complaint .selectize-input.full {
  min-height: 3rem;
  padding: 0.55rem 0.78rem;
  border: 1px solid #d9e7f7;
  border-radius: 16px;
  background: linear-gradient(180deg, #fcfeff 0%, #f5f9ff 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.pediatric-shell .encounter-chief-complaint .selectize-input.focus {
  border-color: #22b8e6;
  box-shadow: 0 0 0 0.16rem rgba(34, 184, 230, 0.15);
}

.pediatric-shell .encounter-chief-complaint .selectize-dropdown,
.pediatric-shell .encounter-chief-complaint .selectize-dropdown-content {
  border-color: #d9e7f7;
  border-radius: 16px;
}

.pediatric-shell .encounter-chief-complaint .selectize-input > div {
  padding: 0.28rem 0.7rem;
  border: 1px solid #d3e3f8;
  border-radius: 999px;
  background: #edf5ff;
  color: #1769e0;
  font-weight: 700;
}

.pediatric-shell .encounter-chief-complaint__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.pediatric-shell .encounter-custom-symptom-stack {
  display: grid;
  gap: 0.7rem;
}

.pediatric-shell .encounter-custom-symptom {
  display: grid;
  gap: 0.85rem;
  padding: 0.95rem;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background: linear-gradient(180deg, #fbfdff 0%, #f4f9ff 100%);
}

.pediatric-shell .encounter-inline-feedback {
  margin: 0;
}

.pediatric-shell .encounter-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.pediatric-shell .encounter-management-reference {
  display: grid;
  gap: 0.9rem;
  padding: 0.95rem;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background: linear-gradient(180deg, #fbfdff 0%, #f4f9ff 100%);
}

.pediatric-shell .encounter-table-plain {
  display: grid;
  gap: 0.85rem;
  overflow: visible;
}

.pediatric-shell .encounter-hidden-counter {
  display: none;
}

.pediatric-shell .encounter-hidden-field {
  display: none !important;
}

.pediatric-shell .encounter-table__instruction {
  margin: 0;
  color: #6a84a6;
  line-height: 1.55;
}

.pediatric-shell .encounter-table-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
}

.pediatric-shell .encounter-table-toolbar__controls {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(180px, 220px);
  gap: 0.9rem;
  flex: 1 1 460px;
}

.pediatric-shell .encounter-table-toolbar__controls--compact {
  grid-template-columns: minmax(180px, 220px);
  flex: 0 1 220px;
}

.pediatric-shell .encounter-table-toolbar--clinical {
  justify-content: flex-start;
}

.pediatric-shell .encounter-table-toolbar--clinical .encounter-table-toolbar__controls--compact {
  grid-template-columns: minmax(100px, 130px);
  flex: 0 0 130px;
}

.pediatric-shell .encounter-table-row-count {
  width: 120px;
  max-width: 100%;
}

.pediatric-shell .encounter-table-toolbar__buttons {
  display: flex;
  flex: 1 1 280px;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.75rem;
}

.pediatric-shell .encounter-table-toolbar__buttons--spreadsheet {
  flex: 1 1 520px;
}

.pediatric-shell .encounter-table-scroller {
  overflow-x: auto;
  padding-bottom: 0.35rem;
}

.pediatric-shell .encounter-table-scroller--spreadsheet {
  padding-bottom: 0.1rem;
}

.pediatric-shell .encounter-table {
  display: grid;
  gap: 0.85rem;
  min-width: max-content;
}

.pediatric-shell .encounter-table__header,
.pediatric-shell .encounter-table__row {
  display: grid;
  gap: 0.75rem;
  align-items: start;
  min-width: max-content;
}

.pediatric-shell .encounter-table__header {
  padding: 0 0.25rem;
}

.pediatric-shell .encounter-table__row {
  padding: 1rem;
  border: 1px solid #d9e7f7;
  border-radius: 20px;
  background: linear-gradient(180deg, #fcfeff 0%, #f4f9ff 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.pediatric-shell .encounter-table__cell {
  min-width: 0;
}

.pediatric-shell .encounter-table__cell--header {
  color: #6680a3;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.pediatric-shell .encounter-table__cell--index {
  display: grid;
  place-items: center;
  min-height: 3rem;
  border-radius: 16px;
  background: #edf5ff;
  color: #1769e0;
  font-weight: 800;
}

.pediatric-shell .encounter-table .shiny-input-container {
  width: 100%;
}

.pediatric-shell .encounter-table .selectize-control {
  margin-bottom: 0;
}

.pediatric-shell .encounter-table .selectize-input,
.pediatric-shell .encounter-table .selectize-input.full {
  min-height: 3rem;
  border: 1px solid #d9e7f7;
  border-radius: 14px;
  background: #fff;
  box-shadow: inset 0 1px 2px rgba(18, 49, 91, 0.04);
}

.pediatric-shell .encounter-table .selectize-input.focus {
  border-color: #7ab4ff;
  box-shadow: 0 0 0 0.25rem rgba(23, 105, 224, 0.12);
}

.pediatric-shell .encounter-table .selectize-dropdown,
.pediatric-shell .encounter-table .selectize-dropdown-content {
  border-color: #d9e7f7;
  border-radius: 12px;
}

.pediatric-shell .encounter-table .form-control,
.pediatric-shell .encounter-table .form-select,
.pediatric-shell .encounter-table textarea {
  width: 100%;
}

.pediatric-shell .encounter-table textarea.form-control {
  min-height: 7rem;
  resize: vertical;
}

.pediatric-shell .encounter-clinical-sheet,
.pediatric-shell .encounter-symptom-sheet {
  gap: 0.75rem;
  overflow: visible;
}

.pediatric-shell .encounter-clinical-table,
.pediatric-shell .encounter-symptom-table {
  width: max-content;
  min-width: 100%;
  gap: 0;
}

.pediatric-shell .encounter-clinical-table .encounter-table__header,
.pediatric-shell .encounter-clinical-table .encounter-table__row,
.pediatric-shell .encounter-symptom-table .encounter-table__header,
.pediatric-shell .encounter-symptom-table .encounter-table__row {
  gap: 0;
}

.pediatric-shell .encounter-clinical-table .encounter-table__header,
.pediatric-shell .encounter-symptom-table .encounter-table__header {
  padding: 0;
  border: 1px solid #d9e7f7;
  border-bottom: none;
  border-radius: 18px 18px 0 0;
  background: linear-gradient(180deg, #edf6ff 0%, #dfeeff 100%);
}

.pediatric-shell .encounter-clinical-table .encounter-table__row,
.pediatric-shell .encounter-symptom-table .encounter-table__row {
  padding: 0;
  border: 1px solid #d9e7f7;
  border-top: none;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}

.pediatric-shell .encounter-clinical-table .encounter-table__row:last-child,
.pediatric-shell .encounter-symptom-table .encounter-table__row:last-child {
  border-radius: 0 0 18px 18px;
}

.pediatric-shell .encounter-clinical-table .encounter-table__cell,
.pediatric-shell .encounter-symptom-table .encounter-table__cell {
  min-height: 100%;
  padding: 0.6rem 0.55rem;
  border-right: 1px solid #e3edf8;
}

.pediatric-shell .encounter-clinical-table .encounter-table__cell:last-child,
.pediatric-shell .encounter-symptom-table .encounter-table__cell:last-child {
  border-right: none;
}

.pediatric-shell .encounter-clinical-table .encounter-table__cell--header,
.pediatric-shell .encounter-symptom-table .encounter-table__cell--header {
  display: flex;
  align-items: center;
  min-height: 3rem;
  padding: 0.78rem 0.6rem;
  color: #1769e0;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pediatric-shell .encounter-clinical-table .encounter-table__cell--index,
.pediatric-shell .encounter-symptom-table .encounter-table__cell--index {
  min-height: 3.05rem;
  border-radius: 0;
  background: #f2f8ff;
  color: #1769e0;
}

.pediatric-shell .encounter-clinical-table .form-control,
.pediatric-shell .encounter-clinical-table .form-select,
.pediatric-shell .encounter-clinical-table .selectize-input,
.pediatric-shell .encounter-clinical-table .selectize-input.full,
.pediatric-shell .encounter-symptom-table .form-control,
.pediatric-shell .encounter-symptom-table .form-select,
.pediatric-shell .encounter-symptom-table .selectize-input,
.pediatric-shell .encounter-symptom-table .selectize-input.full {
  min-height: 2.55rem;
  border-radius: 10px;
  font-size: 0.92rem;
}

.pediatric-shell .encounter-clinical-table .selectize-input,
.pediatric-shell .encounter-clinical-table .selectize-input.full,
.pediatric-shell .encounter-symptom-table .selectize-input,
.pediatric-shell .encounter-symptom-table .selectize-input.full {
  padding: 0.35rem 0.55rem;
}

/* Browser-managed clinical grids keep one stable data model per section. */
.pediatric-shell .clinical-data-grid {
  display: grid;
  min-width: 0;
  gap: 0.45rem;
}

.pediatric-shell .clinical-data-grid__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}

.pediatric-shell .clinical-data-grid__row-count-label {
  display: grid;
  flex: 0 0 108px;
  gap: 0.18rem;
  margin: 0;
  color: #12315b;
  font-size: 0.78rem;
  font-weight: 800;
}

.pediatric-shell .clinical-data-grid__row-count {
  width: 108px;
  min-height: 2.15rem;
  padding: 0.28rem 0.5rem;
  border: 1px solid #c8dcf4;
  border-radius: 10px;
  background: #fff;
  color: #12315b;
  font-weight: 700;
}

.pediatric-shell .clinical-data-grid__toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.pediatric-shell .clinical-data-grid__button {
  min-height: 2.15rem;
  padding: 0.3rem 0.65rem;
  border: 1px solid #c8dcf4;
  border-radius: 10px;
  background: linear-gradient(180deg, #ffffff 0%, #f1f7ff 100%);
  color: #1769e0;
  font-size: 0.8rem;
  font-weight: 800;
  box-shadow: 0 4px 10px rgba(23, 105, 224, 0.06);
}

.pediatric-shell .clinical-data-grid__button:hover:not(:disabled) {
  border-color: #8abaf2;
  background: #edf5ff;
  color: #1457ba;
}

.pediatric-shell .clinical-data-grid__button:disabled {
  opacity: 0.48;
  box-shadow: none;
  cursor: not-allowed;
}

.pediatric-shell .clinical-data-grid__hint {
  align-self: center;
  margin-left: auto;
  color: #6680a3;
  font-size: 0.76rem;
  font-weight: 650;
}

.pediatric-shell .clinical-data-grid__scroller {
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  border: 1px solid #cbdff5;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(26, 83, 151, 0.07);
  outline: none;
  scrollbar-color: #a8c8ec #eef6ff;
  scrollbar-width: thin;
}

.pediatric-shell .clinical-data-grid__scroller:focus-within {
  border-color: #7fb7f4;
  box-shadow: 0 0 0 0.18rem rgba(23, 105, 224, 0.1), 0 8px 22px rgba(26, 83, 151, 0.07);
}

.pediatric-shell .clinical-data-grid__table {
  width: max-content;
  min-width: 100%;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  background: #fff;
  color: #12315b;
  font-size: 0.84rem;
}

.pediatric-shell .clinical-data-grid__table th,
.pediatric-shell .clinical-data-grid__table td {
  box-sizing: border-box;
  height: 2.35rem;
  padding: 0.34rem 0.48rem;
  overflow: hidden;
  border-right: 1px solid #dce9f7;
  border-bottom: 1px solid #dce9f7;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pediatric-shell .clinical-data-grid__table tr > :last-child {
  border-right: none;
}

.pediatric-shell .clinical-data-grid__table tbody tr:last-child > * {
  border-bottom: none;
}

.pediatric-shell .clinical-data-grid__column-header,
.pediatric-shell .clinical-data-grid__corner {
  position: sticky;
  top: 0;
  z-index: 3;
  min-height: 2.45rem;
  background: linear-gradient(180deg, #edf6ff 0%, #dfeeff 100%);
  color: #1457ba;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.pediatric-shell .clinical-data-grid__corner,
.pediatric-shell .clinical-data-grid__row-header {
  position: sticky;
  left: 0;
  width: 52px;
  min-width: 52px;
  max-width: 52px;
  text-align: center;
}

.pediatric-shell .clinical-data-grid__corner {
  z-index: 5;
}

.pediatric-shell .clinical-data-grid__row-header {
  z-index: 2;
  background: #f3f8ff;
  color: #1769e0;
  font-size: 0.78rem;
  font-weight: 850;
  cursor: pointer;
  user-select: none;
}

.pediatric-shell .clinical-data-grid__row-header.is-selected {
  background: #d9ebff;
  color: #0e55b6;
}

.pediatric-shell .clinical-data-grid__cell {
  position: relative;
  background: #fff;
  cursor: cell;
  outline: none;
  user-select: none;
}

.pediatric-shell .clinical-data-grid__cell:hover {
  background: #f8fbff;
}

.pediatric-shell .clinical-data-grid__cell.is-readonly {
  padding-right: 1.65rem;
  background: #eef5fd;
  color: #486987;
  cursor: default;
  font-weight: 750;
}

.pediatric-shell .clinical-data-grid__cell.is-readonly::after {
  position: absolute;
  top: 50%;
  right: 0.55rem;
  width: 0.62rem;
  height: 0.48rem;
  border: 1.5px solid #7897b7;
  border-radius: 2px;
  content: "";
  transform: translateY(-20%);
}

.pediatric-shell .clinical-data-grid__cell.is-readonly::before {
  position: absolute;
  top: 50%;
  right: 0.68rem;
  width: 0.36rem;
  height: 0.35rem;
  border: 1.5px solid #7897b7;
  border-bottom: 0;
  border-radius: 0.3rem 0.3rem 0 0;
  content: "";
  transform: translateY(-100%);
}

.pediatric-shell .clinical-data-grid__cell.is-readonly:hover {
  background: #e8f2fc;
}

.pediatric-shell .clinical-data-grid__cell.is-selected {
  background: #e9f4ff;
}

.pediatric-shell .clinical-data-grid__cell.is-readonly.is-selected {
  background: #dfeefd;
}

.pediatric-shell .clinical-data-grid__cell.is-active {
  z-index: 1;
  background: #f7fbff;
  box-shadow: inset 0 0 0 2px #1769e0;
}

.pediatric-shell .clinical-data-grid__cell.is-invalid {
  background: #fff7e8;
  color: #7f4b00;
  box-shadow: inset 0 0 0 1px #e9a23b;
}

.pediatric-shell .clinical-data-grid__cell.is-invalid.is-active {
  box-shadow: inset 0 0 0 2px #d97706;
}

.pediatric-shell .clinical-data-grid__cell.is-editing {
  padding: 0;
  overflow: visible;
  background: #fff;
}

.pediatric-shell .clinical-data-grid__editor {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 2.5rem;
  margin: 0;
  padding: 0.4rem 0.5rem;
  border: none;
  border-radius: 0;
  background: #fff;
  color: #12315b;
  font: inherit;
  outline: 2px solid #1769e0;
  outline-offset: -2px;
}

.pediatric-shell .clinical-data-grid__feedback {
  color: #6680a3;
  font-size: 0.76rem;
  font-weight: 650;
}

.pediatric-shell .clinical-data-grid__feedback:empty {
  display: none;
}

.pediatric-shell .clinical-data-grid__feedback[data-kind="success"] {
  color: #187552;
}

.pediatric-shell .clinical-data-grid__feedback[data-kind="warning"] {
  color: #925900;
}

.pediatric-shell .clinical-data-grid--fixed-row .clinical-data-grid__toolbar {
  align-items: center;
}

.pediatric-shell .clinical-data-grid--fixed-row .clinical-data-grid__toolbar-actions {
  order: 2;
}

.pediatric-shell .clinical-data-grid--fixed-row .clinical-data-grid__hint {
  margin-right: auto;
  margin-left: 0;
}

.pediatric-shell .clinical-data-grid--basic-information .clinical-data-grid__scroller {
  border-radius: 12px;
}

.pediatric-shell .clinical-data-grid--basic-information .clinical-data-grid__table th,
.pediatric-shell .clinical-data-grid--basic-information .clinical-data-grid__table td {
  height: 2.25rem;
  padding-block: 0.3rem;
}

.pediatric-shell .selectize-control {
  position: relative;
  z-index: 20;
}

.pediatric-shell .selectize-control.dropdown-active {
  z-index: 10040;
}

/* Portaled Selectize panels sit above sticky navigation and neighboring cards. */
body > .selectize-dropdown,
.pediatric-shell .selectize-dropdown,
.clinical-autocomplete-menu {
  z-index: 10050 !important;
  overflow: visible;
  border: 1px solid #b7d4f8;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 14px 34px rgba(20, 70, 130, 0.2);
}

body > .selectize-dropdown .selectize-dropdown-content,
.pediatric-shell .selectize-dropdown .selectize-dropdown-content,
.clinical-autocomplete-menu .selectize-dropdown-content {
  max-height: min(320px, calc(100vh - 2rem));
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.35rem;
  border-radius: 11px;
  background: #ffffff;
  overscroll-behavior: contain;
  scrollbar-color: #aac8ec #edf5ff;
  scrollbar-width: thin;
}

body > .selectize-dropdown [data-selectable],
.pediatric-shell .selectize-dropdown [data-selectable],
.clinical-autocomplete-menu .option {
  display: flex;
  align-items: center;
  min-height: 2.65rem;
  margin: 0.1rem 0;
  padding: 0.62rem 0.85rem;
  border-radius: 8px;
  color: #12315b;
  line-height: 1.35;
}

body > .selectize-dropdown [data-selectable]:hover,
body > .selectize-dropdown .active,
.pediatric-shell .selectize-dropdown [data-selectable]:hover,
.pediatric-shell .selectize-dropdown .active,
.clinical-autocomplete-menu .option:hover,
.clinical-autocomplete-menu .option.is-active {
  background: #eaf4ff;
  color: #12315b;
}

body > .selectize-dropdown .selected:not(.active),
.pediatric-shell .selectize-dropdown .selected:not(.active) {
  background: #f3f8ff;
  color: #1769e0;
}

.pediatric-shell .draft-summary-preview {
  display: grid;
  gap: 1rem;
}

.pediatric-shell .encounter-action-bar {
  position: sticky;
  bottom: 0.75rem;
  z-index: 16;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.7rem 0.75rem;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 20px 42px rgba(30, 88, 157, 0.12);
  backdrop-filter: blur(14px);
}

.pediatric-shell .encounter-action-bar__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  width: 100%;
}

.pediatric-shell .detail-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.pediatric-shell .repeatable-row {
  display: grid;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid #d9e7f7;
  border-radius: 18px;
  background: linear-gradient(180deg, #fbfdff 0%, #f5f9ff 100%);
}

.pediatric-shell .repeatable-row__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pediatric-shell .repeatable-row__header h4 {
  margin: 0;
  color: #12315b;
  font-size: 1rem;
}

.pediatric-shell .repeatable-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.pediatric-shell .detail-card {
  padding: 1rem;
  background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
}

.pediatric-shell .detail-card h4 {
  margin: 0 0 0.4rem;
  color: #12315b;
  font-size: 1rem;
}

.pediatric-shell .detail-card p {
  margin: 0;
  color: #6a84a6;
  line-height: 1.55;
}

.pediatric-shell .group-badge {
  background: rgba(34, 184, 230, 0.12);
  color: #1b6d97;
}

.pediatric-shell .shiny-input-container {
  margin-bottom: 0;
}

.pediatric-shell label {
  margin-bottom: 0.4rem;
  color: #12315b;
  font-weight: 700;
}

.pediatric-shell .form-control,
.pediatric-shell .form-select,
.pediatric-shell textarea {
  min-height: 3rem;
  border: 1px solid #d9e7f7;
  border-radius: 14px;
  background: #fff;
  color: #12315b;
  box-shadow: inset 0 1px 2px rgba(18, 49, 91, 0.04);
}

.pediatric-shell textarea.form-control {
  min-height: auto;
}

.pediatric-shell .form-control::placeholder,
.pediatric-shell textarea::placeholder {
  color: #8ea3bf;
}

.pediatric-shell .form-control:focus,
.pediatric-shell .form-select:focus,
.pediatric-shell textarea:focus {
  border-color: #7ab4ff;
  box-shadow: 0 0 0 0.25rem rgba(23, 105, 224, 0.12);
}

.pediatric-shell .table-actions,
.pediatric-shell .form-actions,
.pediatric-shell .modal-footer-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.pediatric-shell .feedback-panel {
  padding: 1rem 1.05rem;
}

.pediatric-shell .feedback-panel strong {
  display: inline-block;
  margin-bottom: 0.35rem;
}

.pediatric-shell .feedback-panel p,
.pediatric-shell .feedback-panel ul {
  margin-bottom: 0;
}

.pediatric-shell .feedback-error {
  border-left: 4px solid #c74b50;
  background: #fdf1f2;
}

.pediatric-shell .feedback-success {
  border-left: 4px solid #2e9d67;
  background: #eefbf3;
}

.pediatric-shell .feedback-warning {
  border-left: 4px solid #d59a13;
  background: #fff8e7;
}

.pediatric-shell .feedback-info {
  border-left: 4px solid #22b8e6;
  background: #eef9fd;
}

.pediatric-shell table {
  color: #12315b;
}

.pediatric-shell thead th {
  color: #12315b;
  background: #f7fbff;
  border-bottom-color: #dbe8f8;
}

.pediatric-shell tbody td {
  border-color: #e6effa;
}

.pediatric-shell tbody tr:nth-child(even) {
  background: #fbfdff;
}

.pediatric-sidebar {
  border-right: 1px solid #d9e7f7;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(244, 249, 255, 0.95) 100%);
  box-shadow: 14px 0 30px rgba(30, 88, 157, 0.06);
}

.pediatric-sidebar__inner {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  justify-content: space-between;
  gap: 1.4rem;
  padding: 1.2rem 1rem;
}

.pediatric-sidebar__groups {
  display: grid;
  gap: 1.35rem;
}

.pediatric-sidebar__section {
  display: grid;
  gap: 0.9rem;
}

.pediatric-sidebar__eyebrow {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 0.32rem 0.72rem;
  border-radius: 999px;
  background: #edf5ff;
  border: 1px solid #d9e7f7;
  color: #1769e0;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pediatric-sidebar__nav {
  display: grid;
  gap: 0.55rem;
}

.pediatric-sidebar__button,
.pediatric-logout-button {
  width: 100%;
  justify-content: flex-start;
  min-height: 3rem;
  padding: 0.8rem 0.95rem;
  border: 1px solid transparent;
  border-radius: 16px;
  background: transparent;
  color: #12315b;
  font-weight: 700;
  text-align: left;
  box-shadow: none;
}

.pediatric-sidebar__button:hover,
.pediatric-sidebar__button:focus,
.pediatric-logout-button:hover,
.pediatric-logout-button:focus {
  border-color: #d9e7f7;
  background: #f7fbff;
  color: #1769e0;
}

.pediatric-sidebar__button.is-active {
  border-color: #cfe1f8;
  background: linear-gradient(135deg, rgba(23, 105, 224, 0.1) 0%, rgba(34, 184, 230, 0.08) 100%);
  color: #1769e0;
  box-shadow: inset 3px 0 0 #1769e0;
}

.pediatric-sidebar__footer {
  padding-top: 0.25rem;
  border-top: 1px solid #e3eefb;
}

.pediatric-shell .page-section--clinical-query {
  gap: 1rem;
}

.pediatric-shell .clinical-query-card {
  overflow: hidden;
}

.pediatric-shell .clinical-query-card > .card-header,
.pediatric-shell .clinical-query-option-card > .card-header {
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #e3eefb;
  background: linear-gradient(180deg, #fbfdff 0%, #f5faff 100%);
}

.pediatric-shell .clinical-query-card__heading {
  display: grid;
  gap: 0.25rem;
}

.pediatric-shell .clinical-query-card__heading h3,
.pediatric-shell .clinical-query-results-heading h3,
.pediatric-shell .clinical-query-option-card h4,
.pediatric-shell .clinical-query-summary-card h4 {
  margin: 0;
  color: #12315b;
}

.pediatric-shell .clinical-query-card__heading h3 {
  font-size: 1.08rem;
}

.pediatric-shell .clinical-query-card__heading p {
  margin: 0;
  color: #6680a3;
  font-size: 0.88rem;
}

.pediatric-shell .clinical-query-question-grid,
.pediatric-shell .clinical-query-context-form {
  display: grid;
  gap: 1rem;
  padding: 1.05rem 1.15rem 1.15rem;
}

.pediatric-shell .clinical-query-question-grid .shiny-input-container,
.pediatric-shell .clinical-query-context-form .shiny-input-container {
  width: 100%;
  margin-bottom: 0;
}

.pediatric-shell .clinical-query-question-grid label,
.pediatric-shell .clinical-query-context-form label {
  margin-bottom: 0.35rem;
  color: #12315b;
  font-size: 0.9rem;
  font-weight: 700;
}

.pediatric-shell .clinical-query-question-grid textarea {
  min-height: 132px;
  line-height: 1.55;
}

.pediatric-shell .clinical-query-question-actions,
.pediatric-shell .clinical-query-context-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 1rem;
  align-items: center;
}

.pediatric-shell .clinical-query-question-actions .btn,
.pediatric-shell .clinical-query-context-actions .btn {
  min-width: 190px;
}

.pediatric-shell .clinical-query-helper {
  color: #6a84a6;
  font-size: 0.84rem;
  line-height: 1.45;
}

.pediatric-shell .clinical-query-feedback {
  margin: 0;
}

.pediatric-shell .clinical-query-feedback strong {
  display: block;
  margin-bottom: 0.25rem;
}

.pediatric-shell .clinical-query-feedback ul,
.pediatric-shell .clinical-query-context-warnings ul {
  margin: 0.35rem 0 0;
  padding-left: 1.2rem;
}

.pediatric-shell .clinical-query-context-source {
  display: grid;
  gap: 0.08rem;
  justify-items: end;
  color: #6680a3;
  font-size: 0.78rem;
}

.pediatric-shell .clinical-query-context-source strong {
  color: #1769e0;
  font-size: 0.88rem;
}

.pediatric-shell .clinical-query-context-warnings {
  margin: 1rem 1.15rem 0;
}

.pediatric-shell .clinical-query-fact-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.7rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #e3eefb;
  background: #f8fbff;
}

.pediatric-shell .clinical-query-fact-strip > div {
  display: grid;
  gap: 0.18rem;
  min-width: 0;
  padding: 0.72rem 0.8rem;
  border: 1px solid #d9e7f7;
  border-radius: 14px;
  background: #fff;
}

.pediatric-shell .clinical-query-fact-strip span {
  color: #6680a3;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.pediatric-shell .clinical-query-fact-strip strong {
  overflow: hidden;
  color: #12315b;
  font-size: 0.91rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pediatric-shell .clinical-query-context-form__compact {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
}

.pediatric-shell .clinical-query-context-form__details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.pediatric-shell .clinical-query-context-form__details textarea {
  min-height: 92px;
  line-height: 1.45;
}

.pediatric-shell .clinical-query-results-stack {
  display: grid;
  gap: 1rem;
}

.pediatric-shell .clinical-query-results-heading {
  display: flex;
  gap: 1rem;
  align-items: end;
  justify-content: space-between;
  padding: 0.2rem 0.1rem;
}

.pediatric-shell .clinical-query-results-heading > div {
  display: grid;
  gap: 0.15rem;
}

.pediatric-shell .clinical-query-results-heading > div > span {
  color: #1769e0;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pediatric-shell .clinical-query-results-count {
  padding: 0.38rem 0.7rem;
  border: 1px solid #d9e7f7;
  border-radius: 999px;
  background: #fff;
  color: #6680a3;
  font-size: 0.8rem;
  font-weight: 700;
}

.pediatric-shell .clinical-query-results-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.pediatric-shell .clinical-query-summary-card {
  min-height: 100%;
}

.pediatric-shell .clinical-query-summary-card > .card-header {
  padding: 0.85rem 1rem;
}

.pediatric-shell .clinical-query-summary-card > :not(.card-header) {
  margin: 0;
  padding: 0.9rem 1rem 1rem;
}

.pediatric-shell .clinical-query-summary-card ul,
.pediatric-shell .clinical-query-option-card ul {
  margin: 0;
  padding-left: 1.15rem;
  color: #355b86;
}

.pediatric-shell .clinical-query-summary-card li,
.pediatric-shell .clinical-query-option-card li {
  margin: 0.25rem 0;
  line-height: 1.45;
}

.pediatric-shell .clinical-query-empty-copy {
  margin: 0;
  color: #6a84a6;
  line-height: 1.5;
}

.pediatric-shell .clinical-query-no-reference {
  padding: 1.25rem 1.35rem;
  border: 1px solid #f0d9a4;
  border-left: 4px solid #d59a13;
  border-radius: 18px;
  background: linear-gradient(135deg, #fffaf0 0%, #fffdf8 100%);
}

.pediatric-shell .clinical-query-no-reference h4 {
  margin: 0 0 0.35rem;
  color: #754f0b;
  font-size: 1rem;
}

.pediatric-shell .clinical-query-no-reference p {
  margin: 0;
  color: #846b3d;
  line-height: 1.55;
}

.pediatric-shell .clinical-query-options-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.pediatric-shell .clinical-query-option-card {
  overflow: hidden;
  border: 1px solid #d9e7f7;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 16px 32px rgba(30, 88, 157, 0.08);
}

.pediatric-shell .clinical-query-option-card__title {
  display: grid;
  gap: 0.18rem;
}

.pediatric-shell .clinical-query-option-card__title > span {
  color: #6680a3;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pediatric-shell .clinical-query-status {
  flex: 0 0 auto;
  padding: 0.36rem 0.65rem;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 800;
}

.pediatric-shell .clinical-query-status--eligible {
  background: #dff7ec;
  color: #216a4a;
}

.pediatric-shell .clinical-query-status--caution {
  background: #fff3d6;
  color: #8a5c05;
}

.pediatric-shell .clinical-query-status--excluded {
  background: #fde8ea;
  color: #a7373c;
}

.pediatric-shell .clinical-query-status--insufficient {
  background: #edf2f8;
  color: #5f7189;
}

.pediatric-shell .clinical-query-option-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  padding: 1rem 1.1rem;
}

.pediatric-shell .clinical-query-option-grid section {
  min-width: 0;
}

.pediatric-shell .clinical-query-option-card h5 {
  margin: 0 0 0.4rem;
  color: #12315b;
  font-size: 0.88rem;
}

.pediatric-shell .clinical-query-option-card p {
  margin: 0.28rem 0;
  color: #526f94;
  line-height: 1.48;
}

.pediatric-shell .clinical-query-explanation,
.pediatric-shell .clinical-query-sources {
  margin: 0 1.1rem 1rem;
  padding: 0.85rem 0.95rem;
  border-radius: 14px;
  background: #f4f9ff;
  color: #46698f;
  font-size: 0.88rem;
  line-height: 1.5;
}

.pediatric-shell .clinical-query-sources {
  border: 1px solid #e0ecfa;
  background: #fff;
}

.pediatric-shell .clinical-query-safety-footer {
  padding: 0.8rem 1rem;
  border-top: 1px solid #d9e7f7;
  color: #6680a3;
  font-size: 0.84rem;
  text-align: center;
}

@media (max-width: 1200px) {
  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pediatric-shell .dashboard-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pediatric-shell .clinical-query-fact-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .pediatric-shell .clinical-query-context-form__compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 992px) {
  .pediatric-shell-page {
    padding: 1.15rem;
  }

  .pediatric-shell .dashboard-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pediatric-shell .encounter-section-nav {
    top: 0.75rem;
  }

  .pediatric-shell .encounter-table-toolbar__controls {
    grid-template-columns: 1fr;
  }

  .pediatric-shell .encounter-table-toolbar__controls--compact {
    grid-template-columns: 1fr;
  }

  .pediatric-shell .encounter-table-toolbar__buttons {
    justify-content: flex-start;
  }

  .pediatric-shell__header {
    flex-direction: column;
    align-items: stretch;
  }

  .pediatric-shell__header-actions {
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .dashboard-data-grid,
  .pediatric-shell .dashboard-analytics-grid,
  .pediatric-shell .form-grid {
    grid-template-columns: 1fr;
  }

  .pediatric-shell .encounter-basic-information__row {
    grid-template-columns: 1fr;
  }

  .pediatric-shell .encounter-action-bar {
    bottom: 0.75rem;
  }

  .pediatric-shell .dashboard-filter-grid {
    grid-template-columns: 1fr;
  }

  .pediatric-shell .clinical-query-context-form__details,
  .pediatric-shell .clinical-query-results-grid,
  .pediatric-shell .clinical-query-options-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .metric-grid,
  .pediatric-shell .dashboard-metric-grid {
    grid-template-columns: 1fr;
  }

  .pediatric-shell-page {
    padding: 1rem;
  }

  .pediatric-shell .page-section--insights .dashboard-metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pediatric-shell .insights-chart-grid {
    grid-template-columns: 1fr;
  }

  .pediatric-shell .insights-card {
    min-height: 0;
  }

  .pediatric-shell .insights-card .dashboard-card-body {
    padding: 0.7rem 0.75rem 0.8rem;
  }

  .pediatric-shell .insights-card--trend .dashboard-plot-value {
    display: none;
  }

  .pediatric-shell__header {
    padding: 1.3rem;
  }

  .pediatric-shell__header-main,
  .pediatric-shell__header-actions {
    align-items: flex-start;
  }

  .pediatric-user-chip {
    width: 100%;
    justify-content: space-between;
  }

  .metric-grid {
    grid-template-columns: 1fr;
  }

  .pediatric-shell .encounter-section-nav__link {
    font-size: 0.8rem;
    padding: 0.3rem 0.65rem;
  }

  .pediatric-shell .encounter-action-bar__buttons {
    justify-content: stretch;
  }

  .pediatric-shell .encounter-table-toolbar__buttons--spreadsheet .btn {
    flex: 1 1 100%;
  }

  .pediatric-shell .encounter-action-bar__buttons .btn {
    flex: 1 1 100%;
  }

  .pediatric-shell .clinical-query-fact-strip,
  .pediatric-shell .clinical-query-context-form__compact,
  .pediatric-shell .clinical-query-option-grid {
    grid-template-columns: 1fr;
  }

  .pediatric-shell .clinical-query-question-actions,
  .pediatric-shell .clinical-query-context-actions,
  .pediatric-shell .clinical-query-results-heading,
  .pediatric-shell .clinical-query-card > .card-header,
  .pediatric-shell .clinical-query-option-card > .card-header {
    align-items: stretch;
    flex-direction: column;
  }

  .pediatric-shell .clinical-query-question-actions .btn,
  .pediatric-shell .clinical-query-context-actions .btn {
    width: 100%;
  }

  .pediatric-shell .clinical-query-context-source {
    justify-items: start;
  }
}

@media (max-width: 640px) {
  .pediatric-shell-page {
    padding: 0.85rem;
  }

  .pediatric-shell__header {
    padding: 1.15rem;
    border-radius: 22px;
  }

  .pediatric-shell__header-main {
    align-items: center;
  }

  .pediatric-app-icon {
    width: 60px;
    height: 60px;
    border-radius: 18px;
  }

  .pediatric-app-icon svg {
    width: 36px;
    height: 36px;
  }

  .pediatric-shell__header-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .pediatric-secondary-button,
  .pediatric-user-chip {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .pediatric-shell .clinical-data-grid__toolbar {
    align-items: stretch;
  }

  .pediatric-shell .clinical-data-grid__row-count-label {
    flex-basis: 104px;
  }

  .pediatric-shell .clinical-data-grid__row-count {
    width: 104px;
  }

  .pediatric-shell .clinical-data-grid__toolbar-actions {
    flex: 1 1 240px;
  }

  .pediatric-shell .clinical-data-grid__button {
    flex: 1 1 112px;
  }

  .pediatric-shell .clinical-data-grid__hint {
    flex: 1 1 100%;
    margin-left: 0;
  }
}