.ui-redesign-prototype {
  --ui-bg: #f3f6f7;
  --ui-panel: #ffffff;
  --ui-ink: #17333b;
  --ui-muted: #6c8086;
  --ui-line: #d9e3e5;
  --ui-teal: #087f82;
  --ui-teal-dark: #075d61;
  --ui-blue: #2f6f9d;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  background: var(--ui-bg);
  color: var(--ui-ink);
  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
}

.ui-prototype-sidebar {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 26px;
  min-height: 100vh;
  padding: 27px 18px 20px;
  background: #123c45;
  color: #e9f4f4;
}

.ui-prototype-sidebar-toggle {
  position: absolute;
  top: 27px;
  right: -12px;
  z-index: 2;
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  padding: 0 0 2px;
  border: 1px solid #b8d3d4;
  border-radius: 50%;
  background: #f7ffff;
  color: #14686c;
  box-shadow: 0 3px 10px rgba(22, 62, 69, 0.18);
  font: inherit;
  font-size: 19px;
  line-height: 1;
  cursor: pointer;
}

.ui-prototype-sidebar-toggle:hover {
  border-color: #70b4b3;
  background: #e8f7f6;
}

.ui-prototype-sidebar-toggle:focus-visible,
.ui-prototype-nav button:focus-visible,
.ui-prototype-secondary-button:focus-visible,
.ui-prototype-primary-button:focus-visible {
  outline: 3px solid rgba(168, 235, 229, 0.75);
  outline-offset: 2px;
}

.ui-prototype-brand,
.ui-prototype-sidebar-footer,
.ui-prototype-nav button,
.ui-prototype-header,
.ui-prototype-section-heading > div,
.ui-prototype-list-toolbar > div,
.ui-prototype-detail-card,
.ui-prototype-header-actions {
  display: flex;
  align-items: center;
}

.ui-prototype-brand {
  gap: 11px;
  padding: 0 9px;
}

.ui-prototype-brand-mark {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(231, 248, 247, 0.34);
  border-radius: 10px;
  color: #b7ece8;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.05em;
}

.ui-prototype-brand strong,
.ui-prototype-brand span,
.ui-prototype-sidebar-footer strong,
.ui-prototype-sidebar-footer small,
.ui-prototype-nav strong,
.ui-prototype-nav small {
  display: block;
}

.ui-prototype-brand strong {
  font-size: 13px;
}

.ui-prototype-brand div span,
.ui-prototype-sidebar-footer small {
  margin-top: 3px;
  color: #a7c3c5;
  font-size: 10px;
}

.ui-prototype-sidebar-label {
  padding: 0 10px;
  color: #8eb0b4;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ui-prototype-nav {
  display: grid;
  gap: 5px;
}

.ui-prototype-nav button {
  width: 100%;
  gap: 12px;
  padding: 12px 10px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #d8e9e9;
  text-align: left;
  cursor: pointer;
}

.ui-prototype-nav button:hover,
.ui-prototype-nav button.is-active {
  background: #1c5660;
  color: #ffffff;
}

.ui-prototype-nav-icon {
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  border: 1px solid rgba(192, 231, 229, 0.32);
  border-radius: 7px;
  color: #a6d9d7;
  font-size: 13px;
}

.ui-prototype-nav strong {
  font-size: 12px;
}

.ui-prototype-nav small {
  margin-top: 3px;
  color: #8eb0b4;
  font-size: 10px;
}

.ui-prototype-nav button.is-active small {
  color: #bce4e1;
}

.ui-prototype-sidebar-footer {
  gap: 9px;
  margin-top: auto;
  padding: 12px 10px;
  border-top: 1px solid rgba(196, 230, 229, 0.18);
}

.ui-prototype-demo-dot,
.ui-prototype-mode-pill > span,
.ui-prototype-status > span {
  display: inline-block;
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #71d1a6;
}

.ui-prototype-main {
  min-width: 0;
}

.ui-prototype-header {
  justify-content: space-between;
  gap: 24px;
  padding: 31px clamp(24px, 4vw, 58px) 24px;
  border-bottom: 1px solid var(--ui-line);
  background: rgba(255, 255, 255, 0.84);
}

.ui-prototype-eyebrow,
.ui-prototype-step {
  margin: 0;
  color: var(--ui-teal);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ui-prototype-header h1,
.ui-prototype-entry-card h2,
.ui-prototype-list-card h2,
.ui-prototype-detail-card h2,
.ui-prototype-placeholder h2 {
  margin: 6px 0 0;
  color: var(--ui-ink);
  letter-spacing: -0.025em;
}

.ui-prototype-header h1 {
  font-size: clamp(25px, 3vw, 34px);
}

.ui-prototype-header p:last-child,
.ui-prototype-section-heading p,
.ui-prototype-list-toolbar p,
.ui-prototype-detail-card p,
.ui-prototype-placeholder p {
  margin: 7px 0 0;
  color: var(--ui-muted);
  font-size: 12px;
}

.ui-prototype-header-actions {
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.ui-prototype-mode-pill,
.ui-prototype-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #4c696f;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}

.ui-prototype-mode-pill.is-read > span {
  background: #a1aeb1;
}

.ui-prototype-secondary-button,
.ui-prototype-primary-button {
  min-height: 36px;
  padding: 0 14px;
  border-radius: 7px;
  font: inherit;
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}

.ui-prototype-secondary-button {
  border: 1px solid #b9cacc;
  background: #ffffff;
  color: #35545b;
}

.ui-prototype-secondary-button:hover {
  border-color: var(--ui-teal);
  color: var(--ui-teal-dark);
}

.ui-prototype-primary-button {
  border: 1px solid var(--ui-teal);
  background: var(--ui-teal);
  color: white;
}

.ui-prototype-primary-button:hover {
  background: var(--ui-teal-dark);
}

.ui-prototype-content {
  display: grid;
  gap: 17px;
  max-width: 1500px;
  margin: 0 auto;
  padding: 23px clamp(24px, 4vw, 58px) 44px;
}

.ui-prototype-status-line {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  color: #547178;
  font-size: 11px;
}

.ui-prototype-status-count {
  color: #819397;
}

.ui-prototype-entry-card,
.ui-prototype-list-card,
.ui-prototype-detail-card,
.ui-prototype-placeholder {
  border: 1px solid var(--ui-line);
  border-radius: 12px;
  background: var(--ui-panel);
  box-shadow: 0 8px 24px rgba(29, 66, 75, 0.05);
}

.ui-prototype-entry-card,
.ui-prototype-list-card {
  overflow: hidden;
}

.ui-prototype-section-heading,
.ui-prototype-list-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 19px 21px;
  border-bottom: 1px solid var(--ui-line);
}

.ui-prototype-section-heading > div,
.ui-prototype-list-toolbar > div {
  align-items: flex-start;
  gap: 12px;
}

.ui-prototype-entry-controls {
  display: grid;
  gap: 7px;
  justify-items: end;
}

.ui-prototype-entry-mode-switch {
  display: inline-flex;
  gap: 3px;
  padding: 3px;
  border: 1px solid #d3e1e1;
  border-radius: 7px;
  background: #f1f7f7;
}

.ui-prototype-entry-mode-switch button {
  min-height: 28px;
  padding: 0 9px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #668086;
  font: inherit;
  font-size: 10px;
  font-weight: 750;
  cursor: pointer;
}

.ui-prototype-entry-mode-switch button:hover,
.ui-prototype-entry-mode-switch button.is-active {
  background: #ffffff;
  color: var(--ui-teal-dark);
  box-shadow: 0 1px 3px rgba(33, 79, 84, 0.12);
}

.ui-prototype-entry-mode-switch button:focus-visible {
  outline: 2px solid var(--ui-teal);
  outline-offset: 1px;
}

.ui-prototype-step {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 7px;
  background: #e3f2f1;
  color: var(--ui-teal-dark);
  font-size: 9px;
  letter-spacing: 0.03em;
}

.ui-prototype-entry-card h2,
.ui-prototype-list-card h2 {
  font-size: 15px;
}

.ui-prototype-required-note {
  color: #8b9b9e;
  font-size: 10px;
}

.ui-prototype-entry-form {
  display: grid;
  grid-template-columns:
    minmax(145px, 0.8fr) minmax(220px, 1.4fr) minmax(130px, 0.75fr) minmax(150px, 0.9fr)
    auto;
  gap: 12px;
  align-items: end;
  padding: 18px 21px 20px;
}

.ui-prototype-manual-entry-note {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 17px 21px 19px;
  background: #f8fbfb;
}

.ui-prototype-manual-entry-note > div {
  min-width: 0;
}

.ui-prototype-manual-entry-note strong {
  color: #31575e;
  font-size: 11px;
}

.ui-prototype-manual-entry-note p {
  margin: 5px 0 0;
  color: var(--ui-muted);
  font-size: 11px;
}

.ui-prototype-manual-entry-status {
  margin-left: auto;
  color: #8a6c3e;
  font-size: 10px;
  font-weight: 750;
  white-space: nowrap;
}

.ui-prototype-entry-form label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ui-prototype-entry-form label > span {
  color: #557178;
  font-size: 10px;
  font-weight: 750;
}

.ui-prototype-entry-form input,
.ui-prototype-search input {
  width: 100%;
  min-width: 0;
  height: 36px;
  box-sizing: border-box;
  border: 1px solid #c7d5d8;
  border-radius: 6px;
  background: #fbfdfd;
  color: var(--ui-ink);
  font: inherit;
  font-size: 11px;
  outline: none;
}

.ui-prototype-entry-form input {
  padding: 0 10px;
}

.ui-prototype-entry-form input:focus,
.ui-prototype-search input:focus {
  border-color: var(--ui-teal);
  box-shadow: 0 0 0 3px rgba(8, 127, 130, 0.12);
}

.ui-prototype-entry-form input:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.ui-prototype-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.ui-prototype-metric-card {
  display: grid;
  gap: 5px;
  padding: 15px 17px;
  border: 1px solid #eadfc7;
  border-left: 4px solid #d4a451;
  border-radius: 9px;
  background: #fffaf0;
}

.ui-prototype-metric-card.is-green {
  border-color: #cbe4d6;
  border-left-color: #58a875;
  background: #f5fcf7;
}

.ui-prototype-metric-card.is-blue {
  border-color: #cadce9;
  border-left-color: var(--ui-blue);
  background: #f5faff;
}

.ui-prototype-metric-card span,
.ui-prototype-metric-card small {
  color: #6d8085;
  font-size: 10px;
}

.ui-prototype-metric-card strong {
  color: var(--ui-ink);
  font-size: 24px;
  line-height: 1;
}

.ui-prototype-table-wrap {
  overflow: auto;
}

.ui-prototype-table-wrap table {
  width: 100%;
  min-width: 880px;
  border-collapse: collapse;
  font-size: 11px;
}

.ui-prototype-table-wrap th {
  padding: 11px 14px;
  border-bottom: 1px solid var(--ui-line);
  background: #f7fafb;
  color: #6c8085;
  font-size: 10px;
  font-weight: 800;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.ui-prototype-table-wrap td {
  padding: 13px 14px;
  border-bottom: 1px solid #edf1f2;
  vertical-align: middle;
}

.ui-prototype-manual-entry-row {
  cursor: default !important;
  background: #fffdf7;
}

.ui-prototype-manual-entry-row:hover {
  background: #fffdf7 !important;
}

.ui-prototype-table-input {
  width: 100%;
  min-width: 105px;
  height: 30px;
  box-sizing: border-box;
  padding: 0 8px;
  border: 1px solid #c7d5d8;
  border-radius: 5px;
  background: #ffffff;
  color: var(--ui-ink);
  font: inherit;
  font-size: 10px;
  outline: none;
}

.ui-prototype-table-input:focus {
  border-color: var(--ui-teal);
  box-shadow: 0 0 0 3px rgba(8, 127, 130, 0.12);
}

.ui-prototype-table-input:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.ui-prototype-table-save {
  min-height: 30px;
  padding: 0 10px;
  white-space: nowrap;
}

.ui-prototype-table-wrap tbody tr {
  cursor: pointer;
  transition: background 120ms ease;
}

.ui-prototype-table-wrap tbody tr:hover,
.ui-prototype-table-wrap tbody tr.is-selected {
  background: #f2fbfa;
}

.ui-prototype-table-wrap td strong,
.ui-prototype-table-wrap td small {
  display: block;
}

.ui-prototype-table-wrap td strong {
  color: #274d55;
}

.ui-prototype-table-wrap td small {
  margin-top: 4px;
  color: #94a3a6;
  font-size: 9px;
}

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

.ui-prototype-chip {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 0 7px;
  border-radius: 5px;
  font-size: 10px;
  font-weight: 700;
}

.ui-prototype-chip.is-requirement {
  border: 1px solid #cbe4e2;
  background: #eef9f8;
  color: #176a6c;
}

.ui-prototype-chip.is-assignment {
  border: 1px solid #cadbea;
  background: #f0f6fb;
  color: #2f6387;
}

.ui-prototype-muted {
  color: #9aa8aa;
  font-size: 10px;
  font-style: italic;
}

.ui-prototype-status.is-present > span {
  background: #55a675;
}

.ui-prototype-status.is-open > span {
  background: #d5a04d;
}

.ui-prototype-search {
  position: relative;
  display: block;
  width: min(340px, 40%);
}

.ui-prototype-search input {
  padding: 0 10px 0 32px;
}

.ui-prototype-search-icon {
  position: absolute;
  top: 9px;
  left: 11px;
  z-index: 1;
  color: #7d9296;
  font-size: 17px;
  line-height: 1;
}

.ui-prototype-detail-card {
  align-items: flex-start;
  justify-content: space-between;
  gap: 30px;
  padding: 18px 21px;
}

.ui-prototype-detail-card h2 {
  font-size: 17px;
}

.ui-prototype-detail-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 22px;
  min-width: min(55%, 600px);
}

.ui-prototype-detail-facts span,
.ui-prototype-detail-facts small,
.ui-prototype-detail-facts strong {
  display: block;
}

.ui-prototype-detail-facts small {
  color: #8a9a9e;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.ui-prototype-detail-facts strong {
  margin-top: 5px;
  color: #375a61;
  font-size: 11px;
}

.ui-prototype-placeholder {
  display: grid;
  min-height: 300px;
  place-content: center;
  justify-items: center;
  padding: 30px;
  text-align: center;
}

.ui-prototype-placeholder h2 {
  font-size: 22px;
}

.ui-prototype-placeholder p {
  max-width: 470px;
  line-height: 1.6;
}

.ui-prototype-placeholder button {
  margin-top: 19px;
}

.ui-redesign-prototype.is-sidebar-collapsed {
  grid-template-columns: 72px minmax(0, 1fr);
}

.ui-redesign-prototype.is-sidebar-collapsed .ui-prototype-sidebar {
  padding-right: 12px;
  padding-left: 12px;
}

.ui-redesign-prototype.is-sidebar-collapsed .ui-prototype-brand {
  justify-content: center;
  padding-right: 0;
  padding-left: 0;
}

.ui-redesign-prototype.is-sidebar-collapsed .ui-prototype-brand-copy,
.ui-redesign-prototype.is-sidebar-collapsed .ui-prototype-sidebar-label,
.ui-redesign-prototype.is-sidebar-collapsed .ui-prototype-nav button > span:last-child,
.ui-redesign-prototype.is-sidebar-collapsed .ui-prototype-sidebar-footer > span:last-child {
  display: none;
}

.ui-redesign-prototype.is-sidebar-collapsed .ui-prototype-nav button {
  justify-content: center;
  padding-right: 0;
  padding-left: 0;
}

.ui-redesign-prototype.is-sidebar-collapsed .ui-prototype-sidebar-footer {
  justify-content: center;
  padding-right: 0;
  padding-left: 0;
}

@media (max-width: 1050px) {
  .ui-redesign-prototype {
    grid-template-columns: 205px minmax(0, 1fr);
  }

  .ui-prototype-entry-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ui-prototype-entry-wide {
    grid-column: span 2;
  }

  .ui-prototype-entry-form .ui-prototype-primary-button {
    justify-self: start;
  }
}

@media (max-width: 760px) {
  .ui-redesign-prototype {
    display: block;
  }

  .ui-prototype-sidebar {
    min-height: auto;
    padding: 15px;
  }

  .ui-prototype-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ui-prototype-sidebar-footer {
    display: none;
  }

  .ui-prototype-header,
  .ui-prototype-detail-card,
  .ui-prototype-section-heading,
  .ui-prototype-list-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .ui-prototype-header-actions {
    justify-content: flex-start;
  }

  .ui-prototype-entry-controls {
    justify-items: start;
  }

  .ui-prototype-manual-entry-note {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .ui-prototype-manual-entry-status {
    width: 100%;
    margin-left: 40px;
    white-space: normal;
  }

  .ui-prototype-search {
    width: 100%;
  }

  .ui-prototype-metric-grid,
  .ui-prototype-detail-facts {
    grid-template-columns: 1fr;
  }

  .ui-prototype-detail-facts {
    min-width: 0;
    width: 100%;
  }
}
:root {
  --lab-ink: #172126;
  --lab-muted: #5b6d72;
  --lab-teal-900: #17343b;
  --lab-teal-700: #196b52;
  --lab-teal-500: #2b8a72;
  --lab-line: #cad6d9;
  --lab-line-soft: #e1e9eb;
  --lab-surface: #ffffff;
  --lab-surface-muted: #f3f7f8;
  --lab-focus: #b9dce6;
  --lab-radius-sm: 6px;
  --lab-radius-md: 10px;
  --lab-shadow: 0 8px 24px rgb(23 52 59 / 0.1);
  font-family: "Segoe UI", Arial, sans-serif;
  color: var(--lab-ink);
  background: #f5f7f8;
  font-synthesis: none;
}

* {
  box-sizing: border-box;
}
html,
body,
#root {
  height: 100%;
}
body {
  margin: 0;
  min-width: 0;
  overflow: hidden;
}
button,
input,
select,
textarea {
  font-family: inherit;
}
button {
  transition:
    border-color 0.15s ease,
    background-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.05s ease;
}
button:active:not(:disabled) {
  transform: translateY(1px);
}
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--lab-focus);
  outline-offset: 1px;
}
.login-page {
  display: grid;
  place-items: center;
  min-height: 100%;
  padding: 32px;
  background:
    radial-gradient(circle at 15% 10%, #e5f3ef 0, transparent 34%),
    radial-gradient(circle at 90% 90%, #e6f0f7 0, transparent 38%), #f3f6f7;
}
.login-card {
  width: min(420px, 100%);
  border: 1px solid #c8d5d8;
  border-radius: 18px;
  padding: 34px 38px 25px;
  background: rgb(255 255 255 / 0.96);
  box-shadow:
    0 22px 60px rgb(23 52 59 / 0.15),
    0 2px 8px rgb(23 52 59 / 0.06);
}
.login-brand {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 auto 20px;
  border-radius: 16px;
  background: linear-gradient(145deg, #1c7a5d, #135d4a);
  box-shadow: 0 8px 18px rgb(25 107 82 / 0.25);
  color: white;
}
.login-brand span {
  font-size: 18px;
  font-weight: 850;
  letter-spacing: 0.08em;
}
.login-intro {
  text-align: center;
}
.login-intro .eyebrow {
  color: #196b52;
}
.login-intro h1 {
  margin: 7px 0 8px;
  color: #17343b;
  font-size: 27px;
  letter-spacing: -0.02em;
}
.login-intro > p:last-child {
  margin: 0 auto;
  max-width: 310px;
  color: #62767b;
  font-size: 13px;
  line-height: 1.5;
}
.login-form {
  display: grid;
  gap: 15px;
  margin-top: 27px;
}
.login-form label {
  display: grid;
  gap: 6px;
  color: #29484f;
  font-size: 12px;
  font-weight: 750;
}
.login-form input {
  width: 100%;
  min-height: 44px;
  border: 1px solid #aabdc1;
  border-radius: 8px;
  padding: 9px 12px;
  background: #fbfdfd;
  color: #172126;
  font: inherit;
  font-size: 15px;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}
.login-form input:hover {
  border-color: #7d9ca3;
}
.login-form input:focus {
  outline: 0;
  border-color: #1b7559;
  background: white;
  box-shadow: 0 0 0 3px rgb(27 117 89 / 0.16);
}
.login-submit {
  width: 100%;
  min-height: 46px;
  margin-top: 4px;
  border-radius: 8px;
  background: linear-gradient(135deg, #1c7a5d, #176448);
  font-size: 15px;
  box-shadow: 0 7px 14px rgb(25 107 82 / 0.2);
}
.login-submit:hover:not(:disabled) {
  background: linear-gradient(135deg, #176c52, #12563e);
}
.login-mode-switch {
  min-height: 34px;
  border: 0;
  padding: 3px 6px;
  background: transparent;
  color: #196b52;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.login-mode-switch:hover:not(:disabled) {
  color: #104c3a;
  text-decoration: underline;
}
.login-mode-switch:disabled {
  cursor: wait;
  opacity: 0.55;
}
.login-message {
  min-height: 20px;
  margin: 0;
  color: #8a3f00;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
}
.login-footer {
  margin: 21px 0 0;
  border-top: 1px solid #e0e8e9;
  padding-top: 16px;
  color: #809196;
  font-size: 11px;
  text-align: center;
}
.workbook-app {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: 100%;
}
.app-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 52px;
  padding: 6px 14px;
  border-bottom: 1px solid var(--lab-line);
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfb 100%);
  box-shadow: 0 1px 6px rgb(23 52 59 / 0.06);
}
.app-header-main {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}
.app-brand {
  min-width: 0;
}
.app-header strong {
  display: block;
  overflow: hidden;
  font-size: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.app-header .eyebrow {
  margin-bottom: 1px;
  font-size: 10px;
}
.navigation-trigger {
  display: inline-flex;
  flex: 0 0 38px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 38px;
  height: 38px;
  border: 1px solid #aab9be;
  border-radius: 6px;
  padding: 0;
  background: white;
  cursor: pointer;
}
.navigation-trigger:hover {
  border-color: #196b52;
  background: #edf6f2;
}
.navigation-trigger:focus-visible {
  outline: 3px solid #b9dce6;
  outline-offset: 1px;
}
.navigation-trigger span {
  display: block;
  width: 19px;
  height: 2px;
  border-radius: 2px;
  background: #29454d;
}
.navigation-layer {
  position: fixed;
  z-index: 100;
  inset: 0;
}
.navigation-backdrop {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  background: rgb(19 34 39 / 0.38);
  cursor: default;
}
.workbook-navigation {
  position: absolute;
  z-index: 1;
  inset: 0 auto 0 0;
  display: flex;
  flex-direction: column;
  width: min(310px, 86vw);
  border-right: 1px solid #819298;
  background: #f7f9f9;
  box-shadow: 8px 0 28px rgb(0 0 0 / 0.2);
}
.workbook-navigation-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 67px;
  padding: 12px 14px 11px 20px;
  border-bottom: 1px solid #cad4d7;
  background: white;
}
.workbook-navigation-header strong {
  font-size: 19px;
}
.workbook-navigation-header button {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 5px;
  padding: 0;
  background: transparent;
  color: #40565d;
  font: inherit;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}
.workbook-navigation-header button:hover {
  background: #e7edef;
}
.workbook-files {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 14px 12px;
}
.workbook-files button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 8px 12px;
  background: transparent;
  color: #29454d;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
.workbook-files button:hover {
  border-color: #b6c5c9;
  background: white;
}
.workbook-files button[aria-current="page"] {
  border-color: #196b52;
  background: #196b52;
  color: white;
}
.navigation-current-marker {
  font-size: 16px;
}
.workbook-navigation-hint {
  margin: auto 20px 20px;
  color: #63767b;
  font-size: 12px;
  line-height: 1.45;
}
.workbook-content {
  min-height: 0;
  overflow: auto;
  background: #f1f5f6;
}
.workbook-content > section {
  min-height: 100%;
}
.workbook-content > section:not([hidden]),
.workbook-content > section > section:not([hidden]) {
  height: 100%;
  min-height: 0;
}

.worksheet-page {
  min-height: 100%;
  padding: 20px clamp(12px, 2vw, 28px) 24px;
}
.worksheet-page-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.worksheet-page-heading p:last-child {
  margin: 0;
  color: #5b6d72;
  font-size: 12px;
}
.eyebrow {
  margin: 0 0 1px;
  color: #456169;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
h1 {
  margin: 0;
  font-size: 22px;
}
h2 {
  margin: 0;
  font-size: 17px;
}
.section-heading p {
  margin: 2px 0 0;
  color: #5b6d72;
  font-size: 12px;
}
.connection {
  border-radius: 999px;
  background: #e4f3eb;
  color: #14613d;
  padding: 8px 13px;
  font-size: 13px;
  font-weight: 650;
}
.connection[data-error="true"] {
  background: #fff0e0;
  color: #8a3f00;
}
.app-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  min-width: 0;
}
.app-header-actions > button {
  min-height: 34px;
  border: 1px solid #b3c2c5;
  border-radius: 7px;
  padding: 6px 12px;
  background: white;
  color: #29484f;
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  cursor: pointer;
}
.app-header-actions > button:hover:not(:disabled) {
  border-color: #196b52;
  background: #edf7f2;
  color: #14563f;
}
.app-header-actions > button:focus-visible {
  outline: 3px solid #b9dce6;
  outline-offset: 1px;
}
.app-header-actions > button:disabled {
  cursor: wait;
  opacity: 0.6;
}
.primary-button {
  min-height: 38px;
  border: 0;
  border-radius: var(--lab-radius-sm);
  padding: 8px 16px;
  background: #196b52;
  color: white;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
  box-shadow: 0 3px 8px rgb(25 107 82 / 0.16);
}
.primary-button:hover:not(:disabled) {
  background: #155c46;
  box-shadow: 0 5px 12px rgb(25 107 82 / 0.22);
}
.primary-button:disabled {
  opacity: 0.55;
  cursor: wait;
}
.scanner-heading {
  margin: 0 0 8px;
}
.scanner {
  display: grid;
  grid-template-columns: 150px minmax(300px, 680px);
  align-items: center;
  gap: 12px;
  background: white;
  border: 1px solid #dbe2e5;
  border-radius: 8px;
  padding: 16px;
}
.scanner label {
  font-weight: 700;
}
.scanner input {
  min-height: 42px;
  border: 2px solid #7e969d;
  border-radius: 5px;
  padding: 8px 11px;
  font: inherit;
}
.scanner input:focus {
  outline: 3px solid #b9dce6;
  border-color: #286c80;
}
.scan-message {
  min-height: 22px;
  color: #304b53;
  font-weight: 600;
}
.table-status {
  margin: -8px 0 8px;
  color: #486169;
  font-size: 12px;
  font-weight: 650;
}
.worksheet {
  background: var(--lab-surface);
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-md);
  box-shadow: var(--lab-shadow);
  overflow: hidden;
}
.worksheet-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--lab-line);
  background: var(--lab-surface-muted);
}
.worksheet-toolbar p {
  margin: 2px 0 0;
  color: #52676d;
  font-size: 12px;
}
.grid-scroll {
  height: auto;
  min-height: 0;
  overflow: auto;
  background: white;
}
.sample-intake-page,
.derived-list-page,
.current-workbook-page,
.archive-workbook-page,
.pending-worksheet,
.evaluation-page,
.preparation-page {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}
.sample-intake-page .worksheet-page-heading,
.derived-list-page .worksheet-page-heading,
.current-workbook-page .worksheet-page-heading,
.archive-workbook-page .worksheet-page-heading,
.pending-worksheet .worksheet-page-heading,
.evaluation-page .worksheet-page-heading,
.preparation-page .worksheet-page-heading,
.sample-intake-page .table-status,
.derived-list-page .derived-list-message,
.current-workbook-page .table-status,
.archive-workbook-page .table-status {
  flex: 0 0 auto;
}
.sample-intake-page .worksheet {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}
.sample-intake-page .worksheet-toolbar {
  flex: 0 0 auto;
}
.sample-intake-page .grid-scroll,
.derived-list-page .derived-grid-scroll,
.current-workbook-page .excel-work-grid-scroll,
.archive-workbook-page .excel-work-grid-scroll,
.pending-worksheet .placeholder-grid-scroll {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
}
.grid-scroll[data-row-selecting="true"] .sample-grid {
  user-select: none;
  cursor: crosshair;
}
.sample-grid-selection-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  min-height: 24px;
  padding: 2px 6px;
  border: 1px solid #c5d0d3;
  border-bottom: 0;
  background: #f3f8f9;
  color: #40565d;
  font-size: 11px;
}
.sample-grid-selection-status button {
  border: 1px solid #93a6ac;
  border-radius: 3px;
  padding: 2px 6px;
  background: white;
  color: inherit;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}
.sample-grid-selection-status button:hover {
  background: #e6f2f5;
}
.sample-sync-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 24px;
  margin: 4px 0 6px;
  padding: 3px 7px;
  border: 1px solid #c5d0d3;
  background: #f8fbfc;
  color: #40565d;
  font-size: 11px;
}
.sample-sync-status[data-sync-state="error"] {
  border-color: #c27c7c;
  background: #fff4f4;
  color: #7a2424;
}
.sample-sync-status[data-sync-state="waiting"] {
  border-color: #c9a227;
  background: #fffbe8;
  color: #6b5310;
}
.sample-sync-status button {
  flex: 0 0 auto;
  border: 1px solid #93a6ac;
  border-radius: 3px;
  padding: 2px 6px;
  background: white;
  color: inherit;
  font: inherit;
  font-size: 10px;
  cursor: pointer;
}
.sample-sync-status button:disabled {
  cursor: wait;
  opacity: 0.65;
}
.quick-entry-bar-scroll {
  width: calc(100% - var(--input-datasheet-scrollbar-width, 0px));
  min-width: 0;
  margin-bottom: 6px;
  overflow: visible;
}
.quick-entry-bar {
  position: relative;
  z-index: 30;
  display: grid;
  align-items: stretch;
  gap: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 28px;
  grid-auto-rows: 28px;
  margin-bottom: 0;
  overflow: visible;
  border: 1px solid #1674a0;
  border-radius: 6px;
  padding: 0;
  background: #eef7fc;
  font-size: 11px;
}
.quick-entry-bar > * {
  min-width: 0;
  min-height: 28px;
}
.quick-entry-gutter {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 2px;
  border-right: 1px solid #b4c8d0;
  color: #587078;
  font-size: 10px;
  line-height: 1.1;
  text-align: center;
  overflow-wrap: anywhere;
}
.quick-entry-bar > input {
  width: 100%;
  min-width: 0;
  height: 28px;
  max-width: none;
  border: 1px solid #b4c8d0;
  border-radius: 3px;
  padding: 3px 5px;
  background: white;
  font: inherit;
  font-size: 11px;
}
.quick-entry-bar > input:focus {
  outline: 2px solid #1674a0;
  border-color: #1674a0;
}
.quick-entry-bar .autocomplete-input {
  min-width: 0;
  width: 100%;
  max-width: none;
}
.quick-entry-bar .autocomplete-input input {
  height: 28px;
  width: 100%;
  border: 1px solid #b4c8d0;
  border-radius: 3px;
  padding: 1px 4px;
  background: white;
}
.quick-entry-bar .autocomplete-input .autocomplete-options {
  z-index: 100;
}
.quick-entry-bar .multi-select-dropdown {
  position: relative;
  z-index: 101;
  width: 100%;
  min-width: 0;
  max-width: none;
  background: #eef7fc;
}
.quick-entry-bar .multi-select-dropdown[open] {
  z-index: 120;
}
/* The quick-entry row stays a single fixed input row. Its dropdowns are
   rendered as document-level overlays and therefore may cover the table below. */
.quick-entry-bar:has(.multi-select-dropdown[open]) {
  position: relative;
  z-index: 30;
  overflow: visible;
}
.sample-intake-page .worksheet:has(.quick-entry-bar .multi-select-dropdown[open]) {
  overflow: visible;
}
.quick-entry-bar .multi-select-dropdown[open] .multi-select-options {
  z-index: 140;
}
.quick-entry-bar .multi-select-dropdown summary {
  min-height: 28px;
  height: 28px;
  padding: 4px 16px 0 5px;
  border: 1px solid #b4c8d0;
  border-radius: 3px;
  background: white;
  font-size: 11px;
}
.quick-entry-bar .quick-entry-submit {
  position: relative;
  right: auto;
  z-index: 102;
  min-height: 28px;
  width: 100%;
  padding: 0;
  font-size: 18px;
  line-height: 1;
  white-space: nowrap;
}
.quick-entry-bar[data-committing="true"] {
  opacity: 0.65;
}
.quick-entry-bar[data-dpd-mode="true"] {
  border-color: #8c5a00;
  background: #fff8e8;
}
.quick-entry-bar[data-dpd-mode="true"] .quick-entry-gutter {
  background: #fff0c2;
  color: #704800;
  font-size: 9px;
  font-weight: 700;
}
.quick-entry-bar[data-dpd-mode="true"] .quick-entry-submit {
  background: #d9981e;
}
.autocomplete-input {
  position: relative;
  width: 100%;
  min-width: 0;
}
.autocomplete-options {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  z-index: 12;
  width: max-content;
  min-width: 0;
  max-width: calc(100vw - 24px);
  max-height: 260px;
  overflow: auto;
  border: 1px solid #7d9299;
  border-radius: 4px;
  background: white;
  box-shadow: 0 5px 14px rgb(0 0 0 / 0.16);
}
.autocomplete-options > div {
  min-height: 25px;
  padding: 4px 7px;
  border-bottom: 1px solid #edf0f1;
  color: #172126;
  font-size: 11px;
  line-height: 1.25;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.autocomplete-options > div:hover,
.autocomplete-options > div.highlighted {
  background: #edf6f8;
}
.autocomplete-options .autocomplete-empty {
  color: #63777c;
  cursor: default;
}
.autocomplete-options-floating {
  position: fixed;
  top: auto;
  left: auto;
  width: max-content;
  min-width: 0;
  max-width: calc(100vw - 24px);
  max-height: min(260px, calc(100vh - 24px));
}
.reference-values-dialog {
  display: grid;
  gap: 12px;
  width: min(1080px, 96vw);
  max-height: 92vh;
  overflow-y: auto;
  align-content: start;
  border: 1px solid #82969c;
  border-radius: 10px;
  padding: 16px;
  background: white;
  box-shadow: 0 20px 60px rgb(0 0 0 / 0.28);
}
.reference-values-dialog > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.reference-values-form {
  display: grid;
  grid-template-columns: minmax(150px, 0.7fr) minmax(240px, 1.4fr) auto;
  align-items: end;
  gap: 10px;
}
.reference-values-form label {
  display: grid;
  gap: 3px;
  color: #40565d;
  font-size: 11px;
  font-weight: 700;
}
.reference-values-form input,
.reference-values-form select {
  min-height: 32px;
  border: 1px solid #9fb0b5;
  border-radius: 4px;
  padding: 5px 7px;
  background: white;
  font: inherit;
}
.reference-values-warning {
  margin: 0;
  border-left: 3px solid #d79a18;
  padding: 6px 9px;
  background: #fff5da;
  color: #61490f;
  font-size: 12px;
}
.reference-values-list {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 5px;
  min-height: 60px;
  max-height: 42vh;
  overflow: auto;
  border: 1px solid #d1dade;
  border-radius: 5px;
  padding: 8px;
  background: #f7fafb;
}
.reference-values-list span {
  border: 1px solid #b8c6ca;
  border-radius: 999px;
  padding: 3px 7px;
  background: white;
  color: #354c53;
  font-size: 11px;
}
.procedure-sorting-section {
  display: grid;
  gap: 12px;
  border: 1px solid #c4d1d5;
  border-radius: 8px;
  padding: 14px;
  background: #f5f8f9;
}
.procedure-sorting-section .section-heading-row {
  align-items: start;
}
.procedure-sorting-section h3 {
  margin: 0;
}
.procedure-sorting-intro {
  max-width: 680px;
  margin: 4px 0 0;
  color: #52676d;
  font-size: 12px;
  line-height: 1.4;
}
.procedure-sort-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.procedure-sort-summary span {
  border: 1px solid #c4d1d5;
  border-radius: 999px;
  padding: 5px 10px;
  background: white;
  color: #40565d;
  font-size: 12px;
}
.procedure-sort-summary strong {
  color: #173f52;
  font-size: 14px;
}
.existing-procedure-list {
  display: grid;
  gap: 8px;
  border: 1px solid #e0c47d;
  border-radius: 7px;
  padding: 10px;
  background: #fffaf0;
}
.existing-procedure-list h4 {
  margin: 0;
  color: #5b4718;
}
.existing-procedure-list p {
  margin: -3px 0 2px;
  color: #6a5c39;
  font-size: 12px;
}
.procedure-sort-group {
  display: grid;
  gap: 6px;
  border: 1px solid #b8cbd1;
  border-radius: 7px;
  padding: 10px;
  background: white;
  box-shadow: 0 1px 2px rgb(33 61 70 / 0.06);
}
.procedure-group-name {
  display: grid;
  grid-template-columns: auto minmax(180px, 360px);
  align-items: center;
  gap: 8px;
  color: #1e5268;
  font-size: 12px;
  font-weight: 800;
}
.procedure-group-name input {
  min-height: 30px;
  border: 1px solid #91aeb9;
  border-radius: 4px;
  padding: 5px 8px;
  font: inherit;
  font-weight: 700;
}
.procedure-sort-entry-head,
.procedure-sort-entry {
  display: grid;
  grid-template-columns: auto auto minmax(180px, 1fr) auto minmax(80px, auto);
  align-items: center;
  gap: 7px;
}
.procedure-sort-entry.is-selected {
  outline: 2px solid rgba(42, 116, 147, 0.45);
  outline-offset: -2px;
  background: #eef8fb;
}
.procedure-pending-item {
  display: block;
  width: 100%;
  margin: 4px 0;
  padding: 8px 10px;
  border: 1px solid #c8d7dc;
  border-radius: 6px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}
.procedure-pending-item.is-selected {
  border-color: #2a7493;
  background: #e8f5f8;
  box-shadow: inset 3px 0 #2a7493;
}
.procedure-insert-end {
  margin-top: 6px;
}
.procedure-sort-entry-head {
  padding: 2px 4px;
  color: #6a7c82;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.procedure-sort-entry {
  padding: 6px 4px;
  border-top: 1px solid #e2e9eb;
  cursor: grab;
}
.procedure-sort-entry:active {
  cursor: grabbing;
}
.procedure-drag-handle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  color: #6b858d;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -3px;
  cursor: grab;
  user-select: none;
}
.procedure-sort-position {
  min-width: 24px;
  color: #55727b;
  font-size: 12px;
  font-weight: 800;
  text-align: center;
}
.procedure-sort-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.procedure-entry-details {
  min-width: 0;
}
.procedure-entry-details summary {
  color: #2a7493;
  cursor: pointer;
  font-size: 11px;
  font-weight: 700;
}
.procedure-entry-detail-fields {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
  margin-top: 6px;
  padding: 8px;
  border: 1px solid #dbe6e9;
  border-radius: 5px;
  background: #f7fafb;
}
.procedure-entry-detail-fields label {
  display: grid;
  gap: 3px;
  color: #52676d;
  font-size: 11px;
}
.procedure-entry-detail-fields input,
.procedure-entry-detail-fields select {
  min-height: 29px;
  min-width: 120px;
  border: 1px solid #b4c5ca;
  border-radius: 4px;
  padding: 4px 6px;
  background: white;
  font: inherit;
}
.procedure-entry-enabled {
  display: flex !important;
  align-items: center;
  min-height: 29px;
}
.procedure-sort-entry input:not([type="checkbox"]),
.procedure-sort-entry select {
  min-width: 0;
  min-height: 30px;
  border: 1px solid #b4c5ca;
  border-radius: 4px;
  padding: 5px 7px;
  background: white;
  font: inherit;
}
.procedure-sort-entry label {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #40565d;
  font-size: 11px;
  white-space: nowrap;
}
.procedure-sort-entry button,
.procedure-sort-group .section-heading-row button {
  min-height: 29px;
  padding: 4px 8px;
  white-space: nowrap;
}
.procedure-sort-entry button[aria-label],
.procedure-sort-group .section-heading-row button {
  font-weight: 700;
}
@media (max-width: 680px) {
  .reference-values-form {
    grid-template-columns: 1fr;
  }
  .procedure-sort-entry-head {
    display: none;
  }
  .procedure-sort-entry {
    grid-template-columns: auto auto 1fr;
  }
  .procedure-sort-actions,
  .procedure-entry-details {
    grid-column: 1 / -1;
  }
  .procedure-sort-entry input:not([type="checkbox"]),
  .procedure-sort-entry select {
    width: 100%;
  }
  .procedure-group-name {
    grid-template-columns: 1fr;
    align-items: start;
  }
}
.sample-grid tr.row-selected > th,
.sample-grid tr.row-selected > td {
  background: #ccecff;
  box-shadow: inset 0 0 0 1px #1683b0;
}
.sample-grid tr.row-selected.lazy-create-row > th,
.sample-grid tr.row-selected.lazy-create-row > td {
  background: #c4e7f6;
}

.sample-grid thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  height: 24px;
  background: #dfe6e8;
  text-align: left;
  border-bottom: 2px solid #82969c;
  font-size: 10px;
}
.sample-grid th,
.sample-grid td {
  min-height: 22px;
  padding: 0;
  border-right: 1px solid #cdd7da;
  border-bottom: 1px solid #cdd7da;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
}
.sample-grid thead th {
  overflow-wrap: anywhere;
  white-space: normal;
}
.sample-grid th:nth-child(1) {
  width: 3%;
}
.sample-grid th:nth-child(2) {
  width: 7%;
}
.sample-grid th:nth-child(3) {
  width: 6%;
}
.sample-grid th:nth-child(4),
.sample-grid th:nth-child(5),
.sample-grid th:nth-child(6),
.sample-grid th:nth-child(7),
.sample-grid th:nth-child(8) {
  width: 6%;
}
.sample-grid th:nth-child(9) {
  width: 5%;
}
.sample-grid th:nth-child(10) {
  width: 4%;
}
.sample-grid th:nth-child(11) {
  width: 9%;
}
.sample-grid th:nth-child(12) {
  width: 4%;
}
.sample-grid th:nth-child(13) {
  width: 8%;
}
.sample-grid th:nth-child(14) {
  width: 5%;
}
.sample-grid td.present-number,
.sample-grid th.present-number {
  background: #80d39a;
  color: #1f3b27;
}
.sample-grid .lazy-create-row td,
.sample-grid .lazy-create-row th {
  height: 36px;
  padding: 1px 2px;
  background: #eaf4fb;
  border-bottom: 2px solid #6f99aa;
}
/* Zuordnung-Dropdown darf nicht von der Zelle abgeschnitten werden. */
.sample-grid .assignment-cell {
  overflow: visible;
}
.sample-grid .editable-sample-row td {
  padding: 0;
  overflow: visible;
  white-space: normal;
}

/* Präzisionsmodus: .precision-value zeigt den vollen Zellinhalt ohne Abschneiden.
   Das Element liegt absolut hinter dem Eingabefeld und wird nur sichtbar, wenn
   das Eingabefeld nicht fokussiert ist. Bei Fokus verschwindet es (input wird sichtbar).
   Text bricht um, anstatt abgeschnitten zu werden.
   WICHTIG: position:absolute verhindert, dass .precision-value zur Zeilenhöhe
   beiträgt. Die Eingabeelemente (input, .autocomplete-input, .multi-select-dropdown)
   sind bei td:not(:focus-within) opacity:0, sodass nur .precision-value sichtbar ist
   und keine Textverdopplung entsteht. */
.sample-grid .editable-sample-row td {
  position: relative;
}
.sample-grid .precision-value {
  position: absolute;
  inset: 0;
  display: block;
  padding: 1px 3px;
  overflow: visible;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.25;
  font-size: 11px;
  color: inherit;
  pointer-events: none;
  word-wrap: break-word;
  z-index: 0;
}
.sample-grid .editable-sample-row td.cell-focused .precision-value {
  display: none;
}
.sample-grid .precision-value:empty::before {
  content: "\00a0";
}
/* Eingabeelemente in nicht-fokussierten Zellen unsichtbar machen (opacity:0),
   damit nur .precision-value sichtbar ist und kein Textverdopplung entsteht.
   Bei Fokus (td.cell-focused) werden sie voll sichtbar (opacity:1). */
.sample-grid .editable-sample-row td:not(.cell-focused) input,
.sample-grid .editable-sample-row td:not(.cell-focused) .autocomplete-input,
.sample-grid .editable-sample-row td:not(.cell-focused) .multi-select-dropdown {
  opacity: 0;
}
.sample-grid .editable-sample-row td.cell-focused input,
.sample-grid .editable-sample-row td.cell-focused .autocomplete-input,
.sample-grid .editable-sample-row td.cell-focused .multi-select-dropdown {
  opacity: 1;
}

/* Save-Status-Indikator in der Zeilennummer-Spalte */
.sample-grid .save-status {
  display: inline-block;
  margin-left: 2px;
  font-size: 10px;
  font-weight: 700;
  vertical-align: middle;
  cursor: help;
}
.sample-grid .save-status[data-save-status="saved"] {
  color: #2a7d4f;
}
.sample-grid .save-status[data-save-status="dirty"] {
  color: #b8860b;
}
.sample-grid .save-status[data-save-status="saving"] {
  color: #1674a0;
  animation: save-spin 1s linear infinite;
}
.sample-grid .save-status[data-save-status="conflict"] {
  color: #c0392b;
  font-weight: 900;
}
@keyframes save-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* Save-Status-Zusammenfassung in der Auswahlleiste */
.sample-grid-selection-status .save-status-summary {
  color: #40565d;
  font-size: 11px;
}
.lazy-create-row input,
.lazy-create-row select {
  width: 100%;
  height: 30px;
  min-width: 0;
  border: 1px solid transparent;
  border-radius: 0;
  padding: 2px 4px;
  background: #f8fcfe;
  color: inherit;
  font: inherit;
  font-size: 11px;
}
.lazy-create-row input:focus,
.lazy-create-row select:focus {
  position: relative;
  z-index: 1;
  outline: 2px solid #1674a0;
  border-color: #1674a0;
  background: white;
}
.lazy-create-actions {
  min-width: 92px;
  text-align: center;
}
.lazy-create-actions-content {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
}
.lazy-create-label {
  color: #315663;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.1;
}
.lazy-create-actions button {
  min-height: 22px;
  border: 1px solid #8ca0a6;
  border-radius: 3px;
  padding: 1px 4px;
  background: white;
  color: #315663;
  font: inherit;
  font-size: 10px;
}
.lazy-create-actions button:not(:disabled) {
  cursor: pointer;
}
.lazy-create-actions button:not(:disabled):hover {
  background: #e6f2f5;
}
.sample-grid .row-handle {
  position: sticky;
  left: 0;
  z-index: 1;
  width: 36px;
  padding: 0;
  background: #e9edef;
  color: #617278;
  text-align: center;
  font-size: 10px;
  font-weight: 650;
  cursor: grab;
}
.sample-grid thead .row-number-heading {
  left: 0;
  z-index: 4;
  text-align: center;
}
.sample-grid .lazy-create-row .row-handle {
  z-index: 4;
  background: #d7eaf3;
  cursor: default;
}
.editable-sample-row input,
.editable-sample-row select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 20px;
  border: 1px solid transparent;
  border-radius: 0;
  padding: 1px 3px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 11px;
}
.editable-sample-row.lazy-create-row input,
.editable-sample-row.lazy-create-row select {
  height: 30px;
  min-height: 30px;
  background: #f8fcfe;
}
.editable-sample-row select[multiple] {
  height: 20px;
}
.editable-sample-row input:focus,
.editable-sample-row select:focus {
  position: relative;
  z-index: 2;
  outline: 2px solid #217346;
  outline-offset: -2px;
  border-color: #217346;
  background: white;
}
.sample-grid td:focus-within {
  position: relative;
  overflow: visible;
  box-shadow: inset 0 0 0 2px #217346;
}
.row-drag-grip {
  display: inline-block;
  margin-right: 2px;
  color: #52676d;
  cursor: grab;
  user-select: none;
}
.row-drag-grip:active {
  cursor: grabbing;
}
.editable-sample-row[data-saving="true"] {
  opacity: 0.7;
}
.multi-select-dropdown {
  position: relative;
  width: 100%;
  height: 22px;
}
.multi-select-dropdown summary {
  height: 22px;
  overflow: hidden;
  padding: 2px 18px 0 5px;
  background: transparent;
  cursor: pointer;
  list-style-position: inside;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
}
.lazy-create-row .multi-select-dropdown,
.lazy-create-row .multi-select-dropdown summary {
  height: 30px;
}
.lazy-create-row .multi-select-dropdown summary {
  padding-top: 6px;
  background: #f8fcfe;
}
.multi-select-dropdown[open] summary {
  outline: 2px solid #1674a0;
  background: white;
}
.multi-select-options {
  position: absolute;
  right: 0;
  z-index: 12;
  width: max-content;
  min-width: 0;
  max-height: 220px;
  max-width: calc(100vw - 24px);
  overflow: auto;
  border: 1px solid #7d9299;
  border-radius: 4px;
  background: white;
  box-shadow: 0 5px 14px rgb(0 0 0 / 0.16);
}
.multi-select-options-floating {
  min-width: 0;
  max-width: calc(100vw - 24px);
}
.multi-select-options label {
  display: grid;
  grid-template-columns: 18px max-content;
  align-items: center;
  min-height: 25px;
  padding: 2px 6px;
  border-bottom: 1px solid #edf0f1;
  font-size: 11px;
  white-space: nowrap;
  cursor: pointer;
}
.multi-select-options label:hover {
  background: #edf6f8;
}
.multi-select-options input {
  width: 14px;
  height: 14px;
}
.blank-row td {
  color: transparent;
}

@media (pointer: coarse) {
  .sample-grid .editable-sample-row > th,
  .sample-grid .editable-sample-row > td {
    height: 40px;
  }
  .editable-sample-row input,
  .editable-sample-row select,
  .multi-select-dropdown,
  .multi-select-dropdown summary {
    height: 40px;
    min-height: 40px;
  }
  .editable-sample-row.lazy-create-row > th,
  .editable-sample-row.lazy-create-row > td,
  .editable-sample-row.lazy-create-row input,
  .editable-sample-row.lazy-create-row select,
  .editable-sample-row.lazy-create-row .multi-select-dropdown,
  .editable-sample-row.lazy-create-row .multi-select-dropdown summary {
    height: 44px;
    min-height: 44px;
  }
  .multi-select-dropdown summary {
    padding-top: 11px;
  }
  .excel-work-grid th,
  .excel-work-grid td {
    height: 36px;
    padding: 3px 5px;
  }
  .excel-work-grid input {
    height: 32px;
  }
  .excel-work-grid tr > :first-child {
    width: 44px;
    min-width: 44px;
  }
  .excel-work-grid .worksheet-row-select {
    width: 44px;
    min-width: 44px;
  }
}
.sample-number {
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}
.preparation-panel {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  padding: 14px;
  border: 1px solid #cbd5d8;
  border-radius: 8px;
  background: white;
}
.preparation-panel > .section-heading {
  flex: 0 0 auto;
}
.preparation-panel > form {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}
.preparation-metadata {
  display: flex;
  gap: 12px;
  margin: 12px 0;
}
.preparation-metadata label {
  display: grid;
  gap: 4px;
  color: #334b52;
  font-size: 12px;
  font-weight: 700;
}
.preparation-metadata input {
  min-height: 36px;
  border: 1px solid #9cadb2;
  border-radius: 4px;
  padding: 6px 8px;
  font: inherit;
}
.preparation-bulk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 8px;
}
.preparation-bulk-actions button {
  min-height: 34px;
  border: 1px solid #8aa2a8;
  border-radius: 5px;
  padding: 6px 10px;
  background: #eef5f6;
  color: #244c56;
  font: inherit;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.preparation-bulk-actions button:hover:not(:disabled) {
  background: #dcecef;
}
.preparation-bulk-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.preparation-list {
  flex: 1 1 auto;
  max-height: none;
  min-height: 0;
  overflow: auto;
  border: 1px solid #d4dcde;
}
.preparation-list > label {
  display: grid;
  grid-template-columns: 160px minmax(260px, 1fr) 190px;
  align-items: center;
  gap: 10px;
  min-height: 43px;
  padding: 6px 9px;
  border-bottom: 1px solid #e1e6e8;
}
.preparation-list select {
  min-height: 32px;
  border: 1px solid #9cadb2;
  border-radius: 4px;
  background: white;
}
.empty-preparation {
  margin: 0;
  padding: 22px;
  color: #65777c;
  text-align: center;
}
.preparation-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 12px;
  color: #304b53;
  font-weight: 600;
}
.workbook-tabs {
  display: flex;
  align-items: end;
  gap: 2px;
  min-height: 44px;
  padding: 7px 12px 0;
  overflow-x: auto;
  border-top: 1px solid #aab8bd;
  background: #e3e8ea;
}
.workbook-tabs button {
  flex: 0 0 auto;
  min-height: 36px;
  border: 1px solid #aebcc1;
  border-bottom: 0;
  border-radius: 5px 5px 0 0;
  padding: 7px 18px;
  background: #f3f5f6;
  color: #344a51;
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  cursor: pointer;
}
.workbook-tabs button:hover {
  background: white;
}
.workbook-tabs button[aria-selected="true"] {
  position: relative;
  min-height: 38px;
  background: white;
  color: #135f49;
  font-weight: 800;
  box-shadow: inset 0 3px #228264;
}
.mapping-status {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 4px 9px;
  background: #fff1cf;
  color: #71510a;
  font-size: 11px;
  font-weight: 750;
}
.connection-note {
  margin-bottom: 12px;
  border-left: 4px solid #4b8799;
  padding: 10px 12px;
  background: #edf5f7;
  color: #34535c;
  font-size: 13px;
}
.placeholder-grid-scroll {
  height: auto;
  min-height: 0;
  overflow: auto;
  border: 1px solid #aebcc1;
  background: white;
}
.placeholder-grid {
  min-width: 1440px;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.placeholder-grid th,
.placeholder-grid td {
  width: 115px;
  height: 34px;
  border-right: 1px solid #d0d8db;
  border-bottom: 1px solid #d0d8db;
}
.placeholder-grid thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 28px;
  background: #e1e7e9;
  color: #53676d;
  font-size: 12px;
}
.placeholder-grid tr > :first-child {
  position: sticky;
  left: 0;
  width: 42px;
  background: #e9edef;
  color: #66777c;
  text-align: center;
  font-size: 12px;
}
.placeholder-grid thead tr > :first-child {
  z-index: 3;
}
.pending-notice {
  margin: 9px 0 0;
  color: #66777c;
  font-size: 12px;
}
.dialog-backdrop {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 28px;
  background: rgb(18 32 37 / 0.48);
}
.distribution-dialog {
  display: grid;
  grid-template-rows: auto auto auto auto minmax(180px, 1fr) auto;
  width: min(1180px, 94vw);
  height: min(820px, 90vh);
  overflow: hidden;
  border: 1px solid #82969c;
  border-radius: 10px;
  background: white;
  box-shadow: 0 20px 60px rgb(0 0 0 / 0.28);
}
.distribution-dialog > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 18px;
  border-bottom: 1px solid #d2dbde;
}
.distribution-dialog > header h2 {
  font-size: 22px;
}
.close-button {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #edf1f2;
  color: #344a51;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}
.archive-import-dialog {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(920px, 94vw);
  max-height: 90vh;
  overflow: hidden;
  border: 1px solid #82969c;
  border-radius: 10px;
  background: white;
  box-shadow: 0 20px 60px rgb(0 0 0 / 0.28);
}
.archive-import-dialog > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 15px 18px;
  border-bottom: 1px solid #d2dbde;
}
.archive-import-dialog > header h2 {
  margin: 0;
  font-size: 22px;
}
.archive-import-content {
  display: grid;
  gap: 14px;
  overflow: auto;
  padding: 16px 18px;
}
.archive-import-content > p {
  margin: 0;
  color: #40575e;
}
.archive-import-file {
  display: grid;
  gap: 7px;
  font-weight: 700;
}
.archive-import-file input {
  border: 1px solid #a7b7bc;
  border-radius: 5px;
  padding: 9px;
  background: #f8fafb;
  font: inherit;
}
.archive-import-actions {
  display: flex;
  gap: 8px;
}
.archive-import-actions button,
.archive-import-dialog footer button {
  min-height: 34px;
  border: 1px solid #81969d;
  border-radius: 4px;
  padding: 6px 12px;
  background: white;
  color: #29464e;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.archive-import-actions button:disabled,
.archive-import-dialog footer button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.archive-import-dialog footer .primary-button {
  border-color: #17637b;
  background: #17637b;
  color: white;
}
.archive-import-message {
  min-height: 20px;
  font-weight: 700;
}
.archive-import-preview {
  display: grid;
  gap: 12px;
}
.archive-import-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  border: 1px solid #b8c7cc;
  border-radius: 5px;
  padding: 9px 11px;
  background: #f4f8f9;
}
.archive-import-summary code {
  margin-left: auto;
  color: #536970;
}
.archive-import-table-scroll {
  max-height: 260px;
  overflow: auto;
  border: 1px solid #b8c7cc;
}
.archive-import-table-scroll table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.archive-import-table-scroll th,
.archive-import-table-scroll td {
  border-bottom: 1px solid #dbe2e5;
  padding: 7px 9px;
  text-align: left;
}
.archive-import-table-scroll thead th {
  position: sticky;
  top: 0;
  background: #e8eef0;
}
.archive-import-blockers {
  border: 1px solid #c96b5f;
  border-left-width: 5px;
  border-radius: 5px;
  padding: 10px 12px;
  background: #fff2ef;
  color: #7e2f26;
}
.archive-import-legacy-positions {
  border: 1px solid #6f96a3;
  border-left-width: 5px;
  border-radius: 5px;
  padding: 10px 12px;
  background: #eef7fa;
  color: #294f5b;
}
.archive-import-legacy-positions ul {
  margin: 7px 0 0;
  padding-left: 21px;
}
.archive-import-blockers ul,
.archive-import-result ul {
  margin: 7px 0 0;
  padding-left: 21px;
}
.archive-import-confirmation {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  border: 1px solid #d1b15d;
  border-radius: 5px;
  padding: 11px 12px;
  background: #fff9e8;
  font-weight: 700;
}
.archive-import-confirmation input {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  margin-top: 1px;
}
.archive-import-result {
  border: 1px solid #65a47e;
  border-left-width: 5px;
  border-radius: 5px;
  padding: 10px 12px;
  background: #edf8f1;
  color: #245d3b;
}
.archive-grid tr[data-import-target="true"] > td,
.archive-grid tr[data-import-target="true"] > th {
  background: #fff1b8;
  box-shadow:
    inset 0 2px 0 #d39e2a,
    inset 0 -2px 0 #d39e2a;
}
.archive-import-dialog > footer {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  padding: 12px 18px;
  border-top: 1px solid #d2dbde;
  background: #f7f9fa;
}
.distribution-dialog .scanner {
  margin: 14px 18px 0;
}
.distribution-dialog .scan-message {
  margin: 8px 18px;
}
.distribution-search {
  display: grid;
  grid-template-columns: 120px minmax(280px, 560px);
  align-items: center;
  gap: 10px;
  padding: 0 18px 12px;
  font-weight: 700;
}
.distribution-search input {
  min-height: 36px;
  border: 1px solid #92a5ab;
  border-radius: 4px;
  padding: 6px 9px;
  font: inherit;
}
.distribution-list {
  min-height: 0;
  margin: 0 18px;
  overflow: auto;
  border: 1px solid #c5d0d3;
}
.distribution-list[data-left-dragging="true"] {
  cursor: crosshair;
  user-select: none;
}
.distribution-hint {
  margin: 0;
  padding: 7px 9px;
  border-bottom: 1px solid #dce3e5;
  background: #f5f8f9;
  color: #3f5961;
  font-size: 12px;
  font-weight: 650;
}
.distribution-row {
  display: grid;
  grid-template-columns: 18px 130px minmax(220px, 1fr) minmax(180px, 0.8fr) 170px;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 5px 9px;
  border-bottom: 1px solid #dce3e5;
  font-size: 13px;
}
.distribution-list[data-left-dragging="true"] .distribution-row:hover {
  outline: 2px solid #35a85d;
  outline-offset: -2px;
}
.distribution-row[data-present="true"] {
  background: #edf9f1;
}
.presence-indicator {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #c2ccd0;
}
.distribution-row[data-present="true"] .presence-indicator {
  background: #35a85d;
}
.distribution-row button {
  min-height: 30px;
  border: 1px solid #93a6ac;
  border-radius: 4px;
  background: white;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.distribution-dialog > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 13px 18px;
  border-top: 1px solid #cfd8db;
  background: #f5f7f8;
  font-size: 13px;
  font-weight: 650;
}
.distribution-dialog > footer > div {
  display: flex;
  gap: 8px;
}
.distribution-dialog > footer button:not(.primary-button) {
  min-height: 38px;
  border: 1px solid #9babb0;
  border-radius: 5px;
  padding: 7px 14px;
  background: white;
  font: inherit;
  cursor: pointer;
}
.current-grid-scroll {
  height: auto;
  min-height: 0;
  overflow: auto;
  border: 1px solid #aebcc1;
  background: white;
}
.current-grid {
  min-width: 1300px;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.current-grid th,
.current-grid td {
  height: 35px;
  padding: 5px 7px;
  border-right: 1px solid #cdd7da;
  border-bottom: 1px solid #cdd7da;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.current-grid th {
  position: sticky;
  top: 0;
  background: #dfe6e8;
  text-align: left;
}
.current-grid th:nth-child(1) {
  width: 150px;
}
.current-grid th:nth-child(2) {
  width: 100px;
}
.current-grid th:nth-child(3) {
  width: 400px;
}

.evaluation-page {
  display: flex;
  flex-direction: column;
  min-width: 1000px;
}
.evaluation-heading {
  flex: 0 0 auto;
  margin-bottom: 7px;
}
.evaluation-message {
  flex: 0 0 auto;
  min-height: 22px;
  margin: 0 0 8px;
  color: #3f5961;
  font-size: 13px;
  font-weight: 700;
}
.evaluation-page .connection-note {
  flex: 0 0 auto;
  margin: 0 0 8px;
}
.evaluation-workspace {
  display: grid;
  flex: 1 1 auto;
  grid-template-columns: minmax(640px, 1.45fr) minmax(390px, 0.85fr);
  min-height: 0;
  overflow: hidden;
  border: 1px solid #aebcc1;
  background: white;
}
.evaluation-input,
.evaluation-results {
  min-width: 0;
  min-height: 0;
}
.evaluation-input {
  display: flex;
  flex-direction: column;
  border-right: 1px solid #aebcc1;
}
.evaluation-results {
  overflow: auto;
}
.evaluation-input > h2,
.evaluation-results > h2 {
  height: 40px;
  flex: 0 0 auto;
  padding: 9px 12px;
  border-bottom: 1px solid #aebcc1;
  background: #f3f6f7;
  font-size: 16px;
}
.evaluation-grid-scroll {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
  overflow: auto;
}
.evaluation-grid {
  min-width: 670px;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.evaluation-grid th,
.evaluation-grid td {
  height: 38px;
  padding: 4px 7px;
  border-right: 1px solid #ccd6d9;
  border-bottom: 1px solid #ccd6d9;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.evaluation-grid thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 34px;
  background: #dfe6e8;
  color: #334b52;
  text-align: left;
}
.evaluation-grid tr > :nth-child(1) {
  width: 42px;
  background: #e9edef;
  color: #65777c;
  text-align: center;
}
.evaluation-grid tr > :nth-child(2) {
  width: 120px;
}
.evaluation-grid tr > :nth-child(3) {
  width: 75px;
  text-align: center;
}
.evaluation-grid tr > :nth-child(4) {
  width: 185px;
}
.evaluation-grid tr > :nth-child(5) {
  width: 105px;
}
.evaluation-grid tr > :nth-child(6) {
  width: 135px;
}
.evaluation-grid tbody th {
  font-size: 12px;
  font-weight: 650;
}
.evaluation-grid input {
  width: 100%;
  height: 30px;
  border: 1px solid transparent;
  border-radius: 0;
  padding: 4px 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-variant-numeric: tabular-nums;
}
.evaluation-grid input:focus {
  outline: 2px solid #1674a0;
  border-color: #1674a0;
  background: white;
}
.evaluation-grid input:disabled {
  color: #57676c;
  background: #f1f4f5;
}
.evaluation-group {
  font-weight: 750;
}
.evaluation-group-target {
  background: #fff3d9;
}
.evaluation-group-reference {
  background: #e8f1fa;
}
.evaluation-results {
  background: #fbfcfc;
}
.evaluation-results table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.evaluation-results th,
.evaluation-results td {
  height: 38px;
  padding: 6px 9px;
  border-right: 1px solid #d0d9dc;
  border-bottom: 1px solid #d0d9dc;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.evaluation-results thead th {
  height: 34px;
  background: #dfe6e8;
  color: #334b52;
  text-align: left;
}
.evaluation-results thead th:first-child,
.evaluation-results tbody th {
  width: 52%;
}
.evaluation-results tbody th {
  background: #f1f4f5;
  text-align: left;
  font-size: 13px;
}
.evaluation-results tbody td {
  background: white;
  font-variant-numeric: tabular-nums;
}
.evaluation-results tr[data-status="ok"] td {
  background: #e8f6ed;
  color: #14613d;
  font-weight: 700;
}
.evaluation-results tr[data-status="warning"] td {
  background: #fff3d8;
  color: #795300;
  font-weight: 700;
}
.evaluation-results tr[data-status="error"] td {
  background: #fde9e7;
  color: #8d2f27;
  font-weight: 750;
}
.evaluation-alert {
  margin: 8px;
  border-left: 4px solid #b24a3f;
  padding: 8px 10px;
  background: #fde9e7;
  color: #7c2f28;
  font-size: 13px;
  font-weight: 700;
}

.derived-list-page {
  display: flex;
  min-width: 0;
  flex-direction: column;
}
.derived-list-heading {
  margin-bottom: 7px;
}
.derived-list-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}
.sample-intake-actions {
  justify-content: flex-end;
  margin-bottom: 6px;
}
.derived-list-actions button:not(.primary-button) {
  min-height: 28px;
  border: 1px solid #8fa2a8;
  border-radius: 4px;
  padding: 4px 9px;
  background: white;
  color: #29464e;
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.derived-list-actions button:disabled {
  opacity: 0.55;
  cursor: wait;
}
.mapping-status[data-warning="true"] {
  background: #fde6e3;
  color: #8b3027;
}
.derived-list-message {
  min-height: 22px;
  margin: 0 0 7px;
  color: #456169;
  font-size: 13px;
  font-weight: 650;
}
.derived-list-message[data-error="true"] {
  color: #922e27;
}
.derived-grid-scroll {
  height: auto;
  min-height: 0;
  overflow: auto;
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-md);
  background: var(--lab-surface);
  box-shadow: var(--lab-shadow);
}
.derived-grid {
  min-width: 1100px;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-size: 13px;
}
.derived-grid th,
.derived-grid td {
  height: 35px;
  padding: 5px 7px;
  border-right: 1px solid #cbd5d8;
  border-bottom: 1px solid #cbd5d8;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.derived-grid thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #dfe6e8;
  color: #314950;
  text-align: left;
}
.derived-grid tbody tr[data-band="shaded"] td {
  background: #e2e2e2;
}
.rna-grid th:nth-child(1) {
  width: 190px;
}
.rna-grid th:nth-child(2) {
  width: 420px;
}
.rna-grid th:nth-child(3) {
  width: 140px;
}
.rna-grid th:nth-child(4) {
  width: 420px;
}
.rna-grid th:nth-child(5) {
  width: 100px;
}
.rna-grid td[data-repeat="true"] {
  color: #b3261e;
}
.investigation-highlights [data-highlight-kind="jak_assay"] {
  color: #b3261e;
  font-weight: 750;
}
.investigation-highlights [data-highlight-kind="molecular_assay"] {
  color: #1e4f8a;
  font-weight: 750;
}
.investigation-highlights [data-highlight-kind="fusion_assay"] {
  color: #a65300;
  font-weight: 750;
}
.investigation-highlights [data-highlight-kind="cell_selected_assay"] {
  color: #6a398d;
  font-weight: 750;
}
.f109-grid th:nth-child(1) {
  width: 240px;
}
.f109-grid th:nth-child(2) {
  width: 420px;
}
.f109-grid th:nth-child(3) {
  width: 470px;
}
.f109-grid th:nth-child(4) {
  width: 220px;
}
.dpd-input-grid {
  min-width: 1300px;
}
.dpd-input-grid th:nth-child(1) {
  width: 85px;
}
.dpd-input-grid th:nth-child(2) {
  width: 180px;
}
.dpd-input-grid th:nth-child(3) {
  width: 380px;
}
.dpd-input-grid th:nth-child(4) {
  width: 140px;
}
.dpd-input-grid th:nth-child(5) {
  width: 440px;
}
.dpd-input-grid th:nth-child(6) {
  width: 190px;
}
.dpd-input-grid tr[data-selected="true"] td {
  background: #e6f5eb;
}
.dpd-input-grid select {
  width: 100%;
  min-height: 29px;
  border: 1px solid #8fa2a8;
  background: white;
  font: inherit;
}
.dpd-plate-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(430px, 1fr));
  gap: 14px;
  min-height: 0;
  overflow: auto;
}
.dpd-plate-block {
  border: 1px solid #aebcc1;
  background: white;
}
.dpd-plate-block > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 7px 10px;
  border-bottom: 1px solid #aebcc1;
  background: #eef2f3;
}
.dpd-plate-block > header span {
  color: #50666d;
  font-size: 12px;
  font-weight: 700;
}
.dpd-plate-grid {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.dpd-plate-grid th,
.dpd-plate-grid td {
  height: 68px;
  border-right: 1px solid #cbd5d8;
  border-bottom: 1px solid #cbd5d8;
}
.dpd-plate-grid th {
  width: 54px;
  background: #e5eaec;
  color: #53676d;
  font-size: 12px;
}
.dpd-plate-grid thead th {
  height: 31px;
}
.dpd-plate-grid td {
  position: relative;
  padding: 8px;
  background: #fbfcfc;
  text-align: center;
}
.dpd-plate-grid td small {
  position: absolute;
  top: 3px;
  left: 5px;
  color: #718187;
  font-size: 10px;
}
.dpd-plate-grid td strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}
.dpd-plate-grid td[data-filled="true"] {
  background: #e7f2fa;
  color: #214f68;
}
.dpd-plate-grid td[data-control="true"] {
  background: #fff0cf;
  color: #765000;
}
.dpd-empty-layout {
  display: grid;
  min-height: 420px;
  place-content: center;
  border: 1px solid #aebcc1;
  background: white;
  color: #53676d;
  text-align: center;
}
.dpd-empty-layout strong {
  color: #314950;
  font-size: 18px;
}
.dpd-empty-layout p {
  margin: 6px 0 0;
}

@media (max-width: 1250px) {
  .dpd-plate-layout {
    grid-template-columns: 1fr;
  }
}

.major-plate-page {
  min-width: 0;
}
.major-plate-scroll {
  flex: 1 1 auto;
  max-height: none;
  min-height: 0;
  overflow: auto;
  border: 1px solid #aebcc1;
  background: white;
}
.major-plate-grid {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12px;
}
.major-plate-grid th,
.major-plate-grid td {
  min-width: 74px;
  padding: 3px 5px;
  border-right: 1px solid #ccd6d9;
  border-bottom: 1px solid #ccd6d9;
  vertical-align: middle;
}
.major-plate-grid thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #dfe6e8;
  white-space: nowrap;
}
.major-plate-grid tbody + tbody tr:first-child > * {
  border-top: 2px solid #78909c;
}
.major-plate-grid tbody[data-review="true"] .plate-block-number,
.major-plate-grid tbody[data-review="true"] .plate-warning {
  background: #fff1c7;
  color: #754b00;
}
.major-plate-grid input,
.major-plate-grid textarea {
  box-sizing: border-box;
  width: 100%;
  min-width: 92px;
  border: 1px solid transparent;
  background: transparent;
  font: inherit;
  padding: 4px;
}
.major-plate-grid input:focus,
.major-plate-grid textarea:focus {
  outline: 2px solid #4b8d79;
  background: white;
}
.major-plate-grid textarea {
  min-width: 180px;
  min-height: 72px;
  resize: vertical;
}
.major-plate-grid .plate-block-number {
  position: sticky;
  left: 0;
  z-index: 2;
  min-width: 42px;
  background: #f2f6f7;
  text-align: center;
  font-size: 16px;
}
.major-plate-grid .plate-warning {
  min-width: 145px;
  max-width: 220px;
}

.major-plate-grid .phqv-archive-value,
.major-plate-grid .phqv-fusion-switch {
  display: block;
  margin-top: 4px;
  padding: 3px 4px;
  overflow-wrap: anywhere;
}
.major-plate-grid .phqv-archive-value {
  color: #40575e;
  background: #f2f6f7;
}
.major-plate-grid .phqv-fusion-switch {
  border-color: #b91c1c;
  color: #991b1b;
  background: #fff1f2;
  box-shadow: inset 0 0 0 1px #b91c1c;
}
.major-plate-grid .plate-archive {
  min-width: 270px;
  max-width: 330px;
  padding: 7px 9px;
  white-space: normal;
}
.phqv-archive-status {
  display: grid;
  gap: 6px;
  color: #40575e;
  line-height: 1.35;
}
.phqv-archive-status > strong {
  font-size: 12px;
}
.phqv-archive-status > ul {
  margin: 0;
  padding-left: 17px;
}
.phqv-archive-status[data-state="applied"] {
  color: #14613d;
}
.phqv-archive-status[data-state="blocked"],
.phqv-archive-status[data-state="confirmation_required"],
.phqv-archive-status[data-state="ambiguous"] {
  color: #795300;
}
.phqv-archive-status[data-state="error"] {
  color: #8b2d20;
}
.phqv-archive-comparison {
  margin: 0;
  padding: 5px 6px;
  border-left: 3px solid #76909a;
  background: #edf3f5;
  color: #334d55;
}
.phqv-archive-confirmation {
  display: grid;
  gap: 7px;
  margin-top: 3px;
}
.phqv-archive-confirmation label {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-weight: 700;
}
.major-plate-grid .phqv-archive-confirmation input {
  width: auto;
  min-width: 0;
  margin-top: 1px;
}
.phqv-archive-confirmation button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.qc-panel {
  margin-top: 14px;
  border: 1px solid #aebcc1;
  background: white;
}
.qc-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 12px;
  border-bottom: 1px solid #ccd6d9;
  background: #f3f6f7;
}
.qc-heading h2 {
  font-size: 16px;
}
.qc-heading p {
  margin: 2px 0 0;
  color: #53676d;
  font-size: 12px;
}
.qc-heading button,
.major-plate-grid button {
  min-height: 30px;
  border: 1px solid #81969d;
  border-radius: 4px;
  padding: 4px 9px;
  background: white;
  color: #29464e;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.qc-layout {
  display: grid;
  grid-template-columns: minmax(640px, 1.35fr) minmax(380px, 0.65fr);
}
.qc-grid-scroll {
  overflow: auto;
  border-right: 1px solid #ccd6d9;
}
.qc-grid {
  min-width: 650px;
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.qc-grid th,
.qc-grid td {
  height: 31px;
  padding: 3px 5px;
  border-right: 1px solid #d5dddf;
  border-bottom: 1px solid #d5dddf;
}
.qc-grid thead th {
  background: #dfe6e8;
  text-align: left;
}
.qc-grid input {
  width: 100%;
  height: 25px;
  border: 1px solid transparent;
  background: transparent;
  font: inherit;
}
.qc-grid input:focus {
  outline: 2px solid #4b8d79;
  background: white;
}
.qc-result-grid {
  padding: 10px;
}
.qc-result-grid > label {
  display: grid;
  grid-template-columns: 1fr 130px;
  align-items: center;
  gap: 8px;
  margin-bottom: 9px;
  font-size: 12px;
  font-weight: 700;
}
.qc-result-grid input {
  min-height: 30px;
  border: 1px solid #9aabb0;
  padding: 4px 6px;
  font: inherit;
}
.qc-result-grid table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.qc-result-grid th,
.qc-result-grid td {
  padding: 7px;
  border: 1px solid #d0d9dc;
  text-align: left;
}
.qc-result-grid tr[data-state="within_range"] td {
  background: #e8f6ed;
  color: #14613d;
}
.qc-result-grid tr[data-state="outside_range"] td,
.qc-result-grid tr[data-state="not_calculable"] td {
  background: #fff1d6;
  color: #795300;
  font-weight: 700;
}
.qc-errors {
  margin: 10px 0 0;
  padding: 9px 10px 9px 28px;
  border: 1px solid #e0b875;
  background: #fff7e8;
  color: #795300;
  font-size: 12px;
}
.excel-work-grid-scroll {
  position: relative;
  height: auto;
  min-height: 0;
  overflow: auto;
  border: 1px solid var(--lab-line);
  border-radius: var(--lab-radius-md);
  background: var(--lab-surface);
  box-shadow: var(--lab-shadow);
}
.excel-work-grid {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  font-size: 11px;
}
.excel-work-grid th,
.excel-work-grid td {
  width: 110px;
  min-width: 40px;
  min-height: 22px;
  padding: 1px 3px;
  border-right: 1px solid #ccd6d9;
  border-bottom: 1px solid #ccd6d9;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.excel-work-grid thead {
  position: sticky;
  top: 0;
  z-index: 3;
}
.excel-work-grid thead th {
  position: relative;
  top: auto;
  width: 110px;
  min-width: 40px;
  background: #dfe6e8;
  text-align: center;
  white-space: normal;
  height: 24px;
  overflow: visible;
}
.excel-work-grid thead th > .column-resize-handle {
  position: absolute;
  height: 24px;
  bottom: auto;
}
.excel-work-grid thead .excel-group-head th {
  top: auto;
  height: 36px;
  min-height: 36px;
  background: #cbd8dc;
  color: #40575e;
  font-size: 10px;
  line-height: 12px;
}
.excel-work-grid thead th small {
  display: block;
  margin-top: 1px;
  color: #6b7c81;
  font-size: 9px;
}
.excel-work-grid tr > :first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  width: 32px;
  min-width: 32px;
  background: #e9edef;
  color: #617278;
  text-align: center;
  font-size: 10px;
}
.excel-work-grid thead tr > :first-child {
  z-index: 4;
}
.excel-work-grid input {
  width: 100%;
  min-height: 20px;
  height: auto;
  border: 1px solid transparent;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 11px;
  padding: 0 2px;
}
.excel-work-grid input:focus {
  outline: 2px solid #1674a0;
  background: white;
}
.excel-work-grid input[type="checkbox"] {
  width: 16px;
  height: 16px;
  min-width: 16px;
  accent-color: #1674a0;
  cursor: pointer;
}
.excel-work-grid .worksheet-row-select {
  width: 32px;
  min-width: 32px;
  padding: 1px;
  text-align: center;
}
.excel-work-grid tr[data-selected="true"] td {
  background: #e6f5eb;
}
.excel-work-grid tr[data-selected="true"] td.worksheet-row-select {
  background: #ccebd8;
}
.excel-work-grid tr[data-saving="true"] {
  opacity: 0.72;
}

@keyframes sample-attention-pulse {
  0%,
  100% {
    background-color: transparent;
    box-shadow: inset 0 0 0 0 transparent;
  }
  18%,
  58% {
    background-color: #fff2b8;
    box-shadow: inset 0 0 0 3px #e3a11b;
  }
}

.excel-work-grid tr[data-attention="true"] > td,
.excel-work-grid tr[data-attention="true"] > th,
.distribution-row[data-attention="true"] {
  animation: sample-attention-pulse 1.8s ease-in-out 1;
}

@media (prefers-reduced-motion: reduce) {
  .excel-work-grid tr[data-attention="true"] > td,
  .excel-work-grid tr[data-attention="true"] > th,
  .distribution-row[data-attention="true"] {
    animation-duration: 0.01ms;
  }
}
.excel-work-grid-scroll:focus {
  outline: 2px solid #1674a0;
  outline-offset: -2px;
}
/* Zell-Auswahl (Excel-ähnlich): aktive Zelle grüner Rahmen, ausgewählte Zellen blau. */
.excel-work-grid td[data-active="true"],
.sample-grid td[data-active="true"] {
  background: #d6f0ff;
  box-shadow: inset 0 0 0 2px #217346;
}
.excel-work-grid td[data-cell][data-selected="true"] {
  background: #cfe8fb;
}
.sample-grid td[data-cell][data-selected="true"] {
  background: #cfe8fb;
}
/* Auto-Fill (Excel-Ausfüllen): Eck-Handle an der unteren-rechten Ecke der
   Auswahl + Vorschau der Zielzeilen beim Ziehen nach unten. */
.excel-work-grid td[data-fill-handle] {
  position: relative;
}
.excel-work-grid .excel-fill-handle {
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 7px;
  height: 7px;
  background: #217346;
  border: 1px solid #ffffff;
  cursor: crosshair;
  z-index: 3;
}
.excel-work-grid td[data-fill-preview] {
  outline: 1px dashed #217346;
  outline-offset: -2px;
  background: rgba(33, 115, 70, 0.12);
}
/* Custom-Editor (Phase 1a): wrappedTextEditor rendert eine <textarea> für
   mehrzeiligen Freitext. In der fixed-layout-Zelle wächst sie mit dem Inhalt
   (field-sizing: content, progressive enhancement), bricht lange Texte um
   (pre-wrap) und ist auf ~4 Zeilen begrenzt (danach Scroll). Selektor zielt auf
   td textarea — nur wrappedTextEditor rendert eine Textarea, also eindeutig
   ohne zusätzliches data-editor-Attribut (snapshot-sicher). Aktuell ist KEINE
   Spalte auf wrappedText gesetzt → rein Capability (siehe worksheet-cell-editor). */
.excel-work-grid td textarea {
  width: 100%;
  min-height: 1.5em;
  max-height: 76px;
  resize: none;
  overflow-y: auto;
  white-space: pre-wrap;
  field-sizing: content;
  border: none;
  background: transparent;
  box-sizing: border-box;
  font: inherit;
  color: inherit;
  padding: inherit;
  vertical-align: top;
}
.sample-grid td[data-mark-color="yellow"],
.sample-grid tr[data-row-mark-color="yellow"] td {
  background: #fff3a3;
}
.sample-grid td[data-mark-color="green"],
.sample-grid tr[data-row-mark-color="green"] td {
  background: #c9f2cf;
}
.sample-grid td[data-mark-color="blue"],
.sample-grid tr[data-row-mark-color="blue"] td {
  background: #cce5ff;
}
.sample-grid td[data-mark-color="red"],
.sample-grid tr[data-row-mark-color="red"] td {
  background: #ffd0d0;
}
.sample-grid td[data-mark-color="orange"],
.sample-grid tr[data-row-mark-color="orange"] td {
  background: #ffe0b2;
}
.input-datasheet-undo-button {
  margin-left: 8px;
  border: 1px solid #1674a0;
  border-radius: 3px;
  padding: 2px 7px;
  background: #eef7fc;
  color: #12516b;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}
.input-datasheet-undo-button:hover {
  background: #d9eef7;
}
.sample-marking-actions {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding-left: 2px;
}
.sample-marking-actions .archive-mark-button {
  min-width: 24px;
  padding: 1px 4px;
  font-size: 16px;
  line-height: 20px;
}
.derived-grid-selection td[data-cell][data-selected="true"] {
  background: #cfe8fb;
}
.derived-grid-selection td[data-cell][data-active="true"] {
  box-shadow: inset 0 0 0 2px #2d7d46;
}
.derived-grid-selection:focus {
  outline: 2px solid #2d7d46;
  outline-offset: -2px;
}

.column-resize-handle {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  cursor: col-resize;
  z-index: 5;
  background: transparent;
}
.column-resize-handle:hover {
  background: #1674a0;
}
.column-resize-handle.active {
  background: #1674a0;
}

/* Variable Spaltenbreiten pro Blatt (Excel-orientiert).
   nth-child Offset: 1=Checkbox, 2=Zeilennummer, danach A,B,C,... */
.excel-work-grid[data-worksheet="bcr-abl"] th:nth-child(3),
.excel-work-grid[data-worksheet="bcr-abl"] td:nth-child(3) {
  width: 110px;
  min-width: 80px;
}
.excel-work-grid[data-worksheet="bcr-abl"] th:nth-child(4),
.excel-work-grid[data-worksheet="bcr-abl"] td:nth-child(4) {
  width: 70px;
  min-width: 55px;
}
.excel-work-grid[data-worksheet="bcr-abl"] th:nth-child(5),
.excel-work-grid[data-worksheet="bcr-abl"] td:nth-child(5) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="bcr-abl"] th:nth-child(6),
.excel-work-grid[data-worksheet="bcr-abl"] td:nth-child(6) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="bcr-abl"] th:nth-child(8),
.excel-work-grid[data-worksheet="bcr-abl"] td:nth-child(8) {
  width: 180px;
  min-width: 120px;
}
.excel-work-grid[data-worksheet="bcr-abl"] th:nth-child(15),
.excel-work-grid[data-worksheet="bcr-abl"] td:nth-child(15) {
  width: 200px;
  min-width: 140px;
}
.excel-work-grid[data-worksheet="bcr-abl"] th:nth-child(17),
.excel-work-grid[data-worksheet="bcr-abl"] td:nth-child(17) {
  width: 240px;
  min-width: 160px;
}

.excel-work-grid[data-worksheet="M2"] th:nth-child(4),
.excel-work-grid[data-worksheet="M2"] td:nth-child(4),
.excel-work-grid[data-worksheet="M2"] th:nth-child(5),
.excel-work-grid[data-worksheet="M2"] td:nth-child(5) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="M2"] th:nth-child(9),
.excel-work-grid[data-worksheet="M2"] td:nth-child(9) {
  width: 90px;
  min-width: 70px;
}
.excel-work-grid[data-worksheet="M2"] th:nth-child(12),
.excel-work-grid[data-worksheet="M2"] td:nth-child(12) {
  width: 180px;
  min-width: 120px;
}

.excel-work-grid[data-worksheet="M3"] th:nth-child(4),
.excel-work-grid[data-worksheet="M3"] td:nth-child(4),
.excel-work-grid[data-worksheet="M3"] th:nth-child(5),
.excel-work-grid[data-worksheet="M3"] td:nth-child(5) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="M3"] th:nth-child(13),
.excel-work-grid[data-worksheet="M3"] td:nth-child(13) {
  width: 180px;
  min-width: 120px;
}

.excel-work-grid[data-worksheet="M4"] th:nth-child(4),
.excel-work-grid[data-worksheet="M4"] td:nth-child(4),
.excel-work-grid[data-worksheet="M4"] th:nth-child(5),
.excel-work-grid[data-worksheet="M4"] td:nth-child(5) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="M4"] th:nth-child(11),
.excel-work-grid[data-worksheet="M4"] td:nth-child(11) {
  width: 180px;
  min-width: 120px;
}

.excel-work-grid[data-worksheet="JAK-2"] th:nth-child(4),
.excel-work-grid[data-worksheet="JAK-2"] td:nth-child(4),
.excel-work-grid[data-worksheet="JAK-2"] th:nth-child(5),
.excel-work-grid[data-worksheet="JAK-2"] td:nth-child(5) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="JAK-2"] th:nth-child(9),
.excel-work-grid[data-worksheet="JAK-2"] td:nth-child(9) {
  width: 180px;
  min-width: 120px;
}

.excel-work-grid[data-worksheet="MPNGENE"] th:nth-child(4),
.excel-work-grid[data-worksheet="MPNGENE"] td:nth-child(4),
.excel-work-grid[data-worksheet="MPNGENE"] th:nth-child(5),
.excel-work-grid[data-worksheet="MPNGENE"] td:nth-child(5) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="MPNGENE"] th:nth-child(8),
.excel-work-grid[data-worksheet="MPNGENE"] td:nth-child(8) {
  width: 180px;
  min-width: 120px;
}

.excel-work-grid[data-worksheet="HemaVision"] th:nth-child(4),
.excel-work-grid[data-worksheet="HemaVision"] td:nth-child(4),
.excel-work-grid[data-worksheet="HemaVision"] th:nth-child(5),
.excel-work-grid[data-worksheet="HemaVision"] td:nth-child(5) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="HemaVision"] th:nth-child(10),
.excel-work-grid[data-worksheet="HemaVision"] td:nth-child(10) {
  width: 180px;
  min-width: 120px;
}

.excel-work-grid[data-worksheet="Andere PCR's"] th:nth-child(4),
.excel-work-grid[data-worksheet="Andere PCR's"] td:nth-child(4),
.excel-work-grid[data-worksheet="Andere PCR's"] th:nth-child(5),
.excel-work-grid[data-worksheet="Andere PCR's"] td:nth-child(5) {
  width: 55px;
  min-width: 45px;
}
.excel-work-grid[data-worksheet="Andere PCR's"] th:nth-child(10),
.excel-work-grid[data-worksheet="Andere PCR's"] td:nth-child(10) {
  width: 180px;
  min-width: 120px;
}
.archive-row-action button {
  width: 100%;
  min-height: 27px;
  border: 1px solid #8ca0a6;
  border-radius: 3px;
  background: white;
  color: #27464e;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.sample-row-action button {
  width: 100%;
  min-height: 30px;
  border: 1px solid #b78b83;
  border-radius: 3px;
  background: #fff7f5;
  color: #7c2f24;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.sample-row-action button:disabled {
  cursor: wait;
  opacity: 0.55;
}
.archive-dialog {
  width: min(720px, 92vw);
  max-height: 88vh;
  overflow: auto;
  border-radius: 8px;
  background: white;
  box-shadow: 0 18px 50px rgb(0 0 0 / 0.3);
}
.archive-dialog > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 17px;
  border-bottom: 1px solid #d0d9dc;
}
.archive-dialog > p,
.archive-confirm,
.archive-extra-fields {
  margin: 14px 17px;
}
.archive-extra-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 9px;
}
.archive-extra-fields label {
  display: grid;
  gap: 4px;
  color: #40575e;
  font-size: 12px;
  font-weight: 700;
}
.archive-extra-fields input {
  min-height: 34px;
  border: 1px solid #94a7ad;
  padding: 5px 7px;
  font: inherit;
}
.archive-confirm {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-weight: 700;
}
.archive-dialog-message {
  min-height: 20px;
  color: #8a3f00;
}
.archive-dialog > footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 17px;
  border-top: 1px solid #d0d9dc;
  background: #f4f7f8;
}
.archive-dialog > footer > button:not(.primary-button),
.load-more-button {
  min-height: 36px;
  border: 1px solid #93a6ac;
  border-radius: 4px;
  padding: 6px 12px;
  background: white;
  font: inherit;
  cursor: pointer;
}
.archive-grid td {
  background: white;
}
.archive-grid td[data-mark-color="yellow"] {
  background: #fff3a3;
}
.archive-grid td[data-mark-color="green"] {
  background: #c9f2cf;
}
.archive-grid td[data-mark-color="blue"] {
  background: #cce5ff;
}
.archive-grid td[data-mark-color="red"] {
  background: #ffd0d0;
}
.archive-grid td[data-mark-color="orange"] {
  background: #ffe0b2;
}
.archive-grid tr[data-row-mark-color="yellow"] td {
  background: #fff3a3;
}
.archive-grid tr[data-row-mark-color="green"] td {
  background: #c9f2cf;
}
.archive-grid tr[data-row-mark-color="blue"] td {
  background: #cce5ff;
}
.archive-grid tr[data-row-mark-color="red"] td {
  background: #ffd0d0;
}
.archive-grid tr[data-row-mark-color="orange"] td {
  background: #ffe0b2;
}
.archive-grid td[data-mark-color] {
  background: var(--archive-mark-color, white);
}
.archive-grid td[data-mark-color="yellow"] {
  --archive-mark-color: #fff3a3;
}
.archive-grid td[data-mark-color="green"] {
  --archive-mark-color: #c9f2cf;
}
.archive-grid td[data-mark-color="blue"] {
  --archive-mark-color: #cce5ff;
}
.archive-grid td[data-mark-color="red"] {
  --archive-mark-color: #ffd0d0;
}
.archive-grid td[data-mark-color="orange"] {
  --archive-mark-color: #ffe0b2;
}

/* Excel-Light Phase 2: 5-Farben-Markierungen für das Current-Grid
   (.excel-work-grid), gleiche Farben wie .archive-grid. Bewusst mit tr-Anker
   (Spezifität 0,2,2 — gleich wie .excel-work-grid tr[data-selected="true"] td),
   damit die Markierung die Zeilenauswahl-Hintergrundfüllung durch Source-
   Reihenfolge übersteuert: markierte Zellen/Zeilen bleiben sichtbar markiert,
   auch wenn die Zeile (über die Checkbox) ausgewählt ist — analog zum Archiv,
   das keine Zeilenauswahl-Hintergrundregel hat. */
.excel-work-grid tr td[data-mark-color="yellow"] {
  background: #fff3a3;
}
.excel-work-grid tr td[data-mark-color="green"] {
  background: #c9f2cf;
}
.excel-work-grid tr td[data-mark-color="blue"] {
  background: #cce5ff;
}
.excel-work-grid tr td[data-mark-color="red"] {
  background: #ffd0d0;
}
.excel-work-grid tr td[data-mark-color="orange"] {
  background: #ffe0b2;
}
.excel-work-grid tr[data-row-mark-color="yellow"] td {
  background: #fff3a3;
}
.excel-work-grid tr[data-row-mark-color="green"] td {
  background: #c9f2cf;
}
.excel-work-grid tr[data-row-mark-color="blue"] td {
  background: #cce5ff;
}
.excel-work-grid tr[data-row-mark-color="red"] td {
  background: #ffd0d0;
}
.excel-work-grid tr[data-row-mark-color="orange"] td {
  background: #ffe0b2;
}

.archive-marking-actions {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding-left: 2px;
}
.archive-marking-actions .archive-mark-button {
  min-width: 24px;
  padding: 1px 4px;
  font-size: 16px;
  line-height: 20px;
}
.archive-mark-yellow {
  color: #d4a900 !important;
}
.archive-mark-green {
  color: #26934a !important;
}
.archive-mark-blue {
  color: #2b72c6 !important;
}
.archive-mark-red {
  color: #c43d3d !important;
}
.archive-mark-orange {
  color: #d97812 !important;
}

/* InputWorksheet (eigenes Grid, Sub-Projekt 3): Wrapper für Layout/Overflow. */
.input-worksheet-wrapper {
  width: 100%;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  overflow: hidden;
}
.input-datasheet-reference-overview {
  display: grid;
  grid-template-columns: 48px repeat(12, minmax(0, 1fr)) 32px;
  width: calc(100% - var(--input-datasheet-scrollbar-width, 0px));
  min-width: 980px;
  border: 1px solid #b9c7cf;
  border-bottom: 0;
  border-radius: var(--lab-radius-md) var(--lab-radius-md) 0 0;
  background: #f3f8f9;
  box-shadow: 0 1px 0 rgb(23 63 82 / 0.06);
}
.input-datasheet-reference-overview + .quick-entry-bar-scroll {
  margin-top: 0;
}
.input-datasheet-reference-overview > div {
  min-width: 0;
  min-height: 38px;
  padding: 4px 5px;
  border-right: 1px solid #d3dfe2;
  color: #40575e;
  font-size: 10px;
  line-height: 1.2;
}
.input-datasheet-reference-overview > div:last-child {
  border-right: 0;
}
.input-datasheet-reference-overview .reference-overview-gutter,
.input-datasheet-reference-overview .reference-overview-action {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-inline: 2px;
  color: #587078;
  font-size: 9px;
  text-align: center;
}
.input-datasheet-reference-overview strong {
  display: block;
  margin-bottom: 2px;
  color: #173f52;
  font-size: 10px;
}
.input-datasheet-reference-overview .reference-overview-procedure {
  background: #edf7fa;
  box-shadow: inset 0 2px 0 #9fc8d4;
}
.input-datasheet-reference-overview .reference-overview-procedure strong {
  color: #14526a;
}
.input-datasheet-reference-overview .reference-overview-free {
  background: #fafcfc;
}
.input-datasheet-reference-overview .reference-overview-hint {
  color: #71868c;
  font-size: 8px;
}
.input-datasheet-reference-overview .reference-overview-values {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 2px;
  max-height: none;
  overflow: visible;
  color: #52676d;
  font-size: 8px;
  line-height: 1.12;
}
.input-datasheet-reference-overview .reference-overview-values span {
  display: inline-block;
  border: 1px solid #d4e1e4;
  border-radius: 3px;
  padding: 1px 3px;
  background: #fff;
  overflow-wrap: anywhere;
}
.input-datasheet-reference-overview .reference-overview-procedure .reference-overview-values {
  display: block;
  color: #42656f;
  font-size: 8px;
  line-height: 1.25;
}
.input-datasheet-reference-overview .reference-overview-procedure .reference-overview-values span {
  display: inline;
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
}
.input-datasheet-reference-overview
  .reference-overview-procedure
  .reference-overview-values
  span:not(:last-child)::after {
  content: " · ";
  color: #7899a3;
}
.workbook-app[data-density="compact"] .worksheet-grid td {
  padding-top: 2px;
  padding-bottom: 2px;
}
/* Mirror-Zeilen (2. Präp.) im INPUT-Grid: ausgegraut mit gestrichelter
   Oberkante, Zellen nicht editierbar (disabled). */
.input-worksheet-mirror-row td {
  background: #f2f6f7;
  color: #587078;
}
.input-worksheet-mirror-row:not(:first-child) > td {
  border-top: 1px dashed #a9bcc1;
}
.input-datasheet-repeat-label {
  display: block;
  color: #587078;
  font-size: 9px;
  line-height: 1.1;
}
/* INPUT-Editoren im eigenen Grid: Autocomplete/MultiSelect füllen die Zelle. */
.excel-work-grid .autocomplete-input,
.excel-work-grid .multi-select-dropdown {
  width: 100%;
  min-height: 100%;
}
.excel-work-grid .multi-select-dropdown {
  height: 100%;
}
.excel-work-grid .multi-select-dropdown summary {
  display: flex;
  align-items: flex-start;
  height: 100%;
  min-height: 100%;
  overflow: visible;
  padding: 1px 18px 1px 2px;
  text-overflow: clip;
  white-space: normal;
}
.excel-work-grid .multi-select-selected-values {
  align-content: flex-start;
  overflow: visible;
}
.excel-work-grid .selection-chip {
  white-space: normal;
  overflow-wrap: anywhere;
}
.excel-work-grid .selection-chip span:first-child {
  overflow: visible;
  overflow-wrap: anywhere;
  text-overflow: clip;
  white-space: normal;
}
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(20, 35, 42, 0.38);
}
.workspace-settings-dialog {
  width: min(460px, 100%);
  display: grid;
  gap: 14px;
  padding: 22px;
  border: 1px solid #b9c7cf;
  border-radius: var(--lab-radius-lg);
  background: #fff;
  box-shadow: 0 20px 60px rgba(21, 43, 52, 0.25);
}
.workspace-settings-overview {
  width: min(780px, 100%);
  max-height: min(760px, 92vh);
  overflow: auto;
}
.workspace-settings-layout {
  display: grid;
  grid-template-columns: minmax(170px, 210px) minmax(0, 1fr);
  gap: 18px;
  min-height: 330px;
}
.workspace-settings-navigation {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-right: 12px;
  border-right: 1px solid #d9e3e7;
}
.workspace-settings-navigation button {
  min-height: 36px;
  padding: 7px 10px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  text-align: left;
}
.workspace-settings-navigation button:hover {
  background: #edf6f8;
}
.workspace-settings-navigation button[aria-current="page"] {
  background: #dceff5;
  color: #123f51;
  font-weight: 700;
}
.workspace-settings-section {
  align-content: start;
  display: grid;
  gap: 12px;
}
.workspace-settings-section h3,
.workspace-settings-section h4,
.workspace-settings-section p {
  margin: 0;
}
.workspace-settings-section > label,
.settings-form label,
.shared-settings-card label {
  display: grid;
  gap: 6px;
}
.settings-checkbox {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  padding: 11px 12px;
  border: 1px solid #d6e1e5;
  border-radius: 6px;
  background: #f9fbfc;
}
.settings-checkbox input {
  margin-top: 3px;
}
.settings-checkbox span:not(.sr-only) {
  display: grid;
  gap: 3px;
}
.settings-checkbox small,
.settings-hint,
.settings-warning {
  display: block;
  color: #63777c;
  font-size: 12px;
}
.settings-warning {
  color: #9a3f24;
}
.settings-option-card,
.shared-settings-card {
  display: grid;
  gap: 9px;
  padding: 12px;
  border: 1px solid #d6e1e5;
  border-radius: 6px;
  background: #f9fbfc;
}
.shared-settings-card {
  border-color: #b9d6df;
  background: #f3f9fb;
}
.settings-card-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.settings-scope-badge {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  background: #d7edf3;
  color: #174d60;
  font-size: 11px;
  font-weight: 700;
}
.settings-status-list {
  display: grid;
  gap: 6px;
  margin: 0;
}
.settings-status-list div {
  display: grid;
  grid-template-columns: minmax(130px, 0.7fr) minmax(0, 1.3fr);
  gap: 8px;
}
.settings-status-list dt {
  color: #63777c;
}
.settings-status-list dd {
  margin: 0;
  overflow-wrap: anywhere;
}
.settings-message {
  padding: 8px 10px;
  border-radius: 5px;
  background: #edf6f8;
  color: #174d60;
}
.settings-form {
  display: grid;
  gap: 12px;
}
.password-settings-dialog {
  width: min(520px, 100%);
}
.workspace-settings-empty {
  padding: 14px;
  border: 1px dashed #c1d0d5;
  border-radius: 6px;
  color: #63777c;
  background: #f8fbfc;
}
.input-completion-settings-dialog {
  width: min(980px, 100%);
  max-height: min(820px, 92vh);
  overflow: auto;
}
@media (max-width: 680px) {
  .workspace-settings-layout {
    grid-template-columns: 1fr;
  }
  .workspace-settings-navigation {
    padding-right: 0;
    padding-bottom: 10px;
    border-right: 0;
    border-bottom: 1px solid #d9e3e7;
  }
}
.preparation-print-preview {
  width: min(900px, 100%);
  max-height: min(850px, 92vh);
  overflow: auto;
  display: grid;
  gap: 14px;
  padding: 22px;
  border: 1px solid #b9c7cf;
  border-radius: var(--lab-radius-lg);
  background: #fff;
  box-shadow: 0 20px 60px rgba(21, 43, 52, 0.25);
}
.preparation-print-preview-list {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 28px;
}
.preparation-print-preview-list li {
  padding: 5px 8px;
  border-bottom: 1px solid #e3ebee;
}
.label-preview-pages {
  display: grid;
  gap: 16px;
}
.label-preview-page {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid #c7d4d9;
  border-radius: 8px;
}
.label-preview-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}
.label-preview-grid span {
  min-height: 38px;
  display: grid;
  place-items: center;
  padding: 4px;
  border: 1px dashed #aebfc5;
  text-align: center;
  overflow-wrap: anywhere;
}
.workspace-settings-dialog label {
  display: grid;
  gap: 6px;
  font-weight: 600;
}
.workspace-settings-dialog input,
.workspace-settings-dialog select {
  min-height: 36px;
}
.workspace-settings-dialog .settings-checkbox {
  font-weight: 500;
}
.workspace-settings-dialog .settings-checkbox input {
  min-height: auto;
}
.workspace-settings-dialog .checkbox-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
}
.workspace-settings-dialog .checkbox-label input {
  min-height: auto;
}
.dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px;
}
.autocomplete-entry {
  display: flex;
  align-items: center;
  min-width: 0;
  width: 100%;
}
.autocomplete-entry > input {
  min-width: 0;
  flex: 1 1 auto;
}
.input-datasheet-delete {
  border: 0;
  background: transparent;
  color: #a33;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}
.input-datasheet-presence {
  border: 0;
  background: transparent;
  padding: 0 2px;
  color: #27734d;
  cursor: pointer;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.archive-grid td[data-revised="true"] {
  box-shadow: none;
}
.archive-grid .archive-legacy-cell {
  min-width: 190px;
  max-width: 280px;
  padding: 5px 8px;
  vertical-align: top;
  color: #35545d;
}
.archive-legacy-cell summary {
  cursor: pointer;
  color: #17637b;
  font-weight: 700;
  white-space: nowrap;
}
.archive-legacy-cell p {
  margin: 6px 0 3px;
  font-size: 12px;
}
.archive-legacy-cell ul {
  display: grid;
  gap: 3px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.archive-legacy-cell li {
  display: grid;
  grid-template-columns: minmax(54px, auto) minmax(0, 1fr);
  gap: 7px;
  font-size: 12px;
}
.archive-legacy-cell li span {
  overflow-wrap: anywhere;
  white-space: normal;
}
.load-more-button {
  margin-top: 10px;
}

/* Abgeleitete Anzeigeblätter: sitzungsweise editierbare Zellen (nicht persistiert). */
.derived-grid td {
  padding: 0;
  vertical-align: top;
}
.derived-grid input {
  box-sizing: border-box;
  width: 100%;
  height: 35px;
  min-width: 0;
  border: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 5px 7px;
  cursor: text;
}
.derived-grid input:hover {
  border-color: #a0b0b5;
  background: #f8fafb;
}
.derived-grid input:focus {
  outline: 2px solid #1674a0;
  border-color: #1674a0;
  background: white;
}
.dpd-plate-grid input {
  width: 100%;
  height: 30px;
  border: 1px solid transparent;
  background: transparent;
  color: inherit;
  font: inherit;
  padding: 2px 4px;
}
.dpd-plate-grid input:focus {
  outline: 2px solid #1674a0;
  background: white;
}
.derived-grid tbody tr[data-dirty="true"] {
  background: #fff8d8;
}
.dpd-plate-grid td[data-dirty="true"] {
  background: #fff8d8;
}
.local-dirty-hint {
  margin: 6px 0 0;
  padding: 5px 9px;
  border-left: 3px solid #c9a227;
  background: #fffbe8;
  color: #6b5310;
  font-size: 12px;
}
.excel-work-grid tr.lazy-create-row[data-committing="true"] {
  opacity: 0.72;
}
.dpd-document-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
  padding: 10px 12px;
  border: 1px solid #d0d9dc;
  border-radius: 6px;
  background: #f6f8f9;
}
.dpd-document-actions label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  color: #40575e;
}
.dpd-document-actions input {
  min-height: 30px;
  border: 1px solid #94a7ad;
  border-radius: 4px;
  padding: 4px 8px;
  font: inherit;
}
.dpd-document-actions button {
  min-height: 32px;
  border: 1px solid #93a6ac;
  border-radius: 4px;
  padding: 5px 12px;
  background: white;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.dpd-document-actions button:disabled {
  opacity: 0.55;
  cursor: wait;
}

/* AutocompleteInput: tippbares Dropdown mit gefilterten Vorschlägen. */
.autocomplete-input {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  height: 100%;
  min-height: 22px;
  z-index: 1;
}
.autocomplete-input:focus-within {
  z-index: 20;
}
.autocomplete-input input {
  width: 100%;
  min-height: 18px;
  flex: 1;
  border: 1px solid transparent;
  background: transparent;
  padding: 1px 3px;
  font: inherit;
  font-size: 11px;
}
.autocomplete-input input:focus {
  outline: 2px solid #1674a0;
  border-color: #1674a0;
  background: white;
}
.autocomplete-selected-values,
.multi-select-selected-values {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  min-width: 0;
  overflow: hidden;
}
.multi-select-selected-text {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  line-height: 1.25;
}
.selection-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  max-width: 100%;
  min-height: 17px;
  border: 1px solid #8ab5c6;
  border-radius: 999px;
  padding: 0 5px;
  background: #eaf6fb;
  color: #29444d;
  font: inherit;
  font-size: 10px;
  line-height: 1.2;
  cursor: pointer;
}
.selection-chip:hover {
  border-color: #1674a0;
  background: #d8eff8;
}
.selection-chip span:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.autocomplete-options {
  position: absolute;
  left: 0;
  top: 100%;
  z-index: 15;
  width: max-content;
  min-width: 0;
  max-width: calc(100vw - 24px);
  max-height: 260px;
  overflow: auto;
  border: 1px solid #7d9299;
  background: white;
  box-shadow: 0 8px 22px rgb(0 0 0 / 0.2);
}
.autocomplete-options > div {
  padding: 6px 8px;
  cursor: pointer;
  white-space: nowrap;
}
.autocomplete-options > div:hover,
.autocomplete-options > div.highlighted {
  background: #edf6f8;
}
.autocomplete-options .autocomplete-empty {
  color: #6b7c81;
  font-style: italic;
  cursor: default;
}
.quick-entry-bar .autocomplete-input[data-has-selection="true"] {
  flex-direction: row;
  align-items: center;
  gap: 2px;
  overflow: hidden;
  padding: 0 2px;
  background: white;
}
.quick-entry-bar .autocomplete-input[data-has-selection="true"] .autocomplete-selected-values {
  flex: 0 1 auto;
  flex-wrap: nowrap;
  max-width: calc(100% - 18px);
  overflow: hidden;
}
.quick-entry-bar .autocomplete-input[data-has-selection="true"] .selection-chip {
  flex: 0 1 auto;
  min-width: 0;
  padding-inline: 3px;
}
.quick-entry-bar .autocomplete-input[data-has-selection="true"] .autocomplete-entry {
  flex: 1 1 18px;
  min-width: 18px;
  height: 100%;
}
.quick-entry-bar .autocomplete-input[data-has-selection="true"] .autocomplete-entry input {
  min-width: 0;
  padding-inline: 1px;
}
.sample-grid .autocomplete-options {
  min-width: 0;
}

.preparation-history-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: auto;
}
.history-search-panel,
.history-import-panel {
  border: 1px solid #cbd8da;
  border-radius: 8px;
  padding: 16px;
  background: #fff;
}
.history-search-panel h2,
.history-import-panel h2 {
  margin: 0 0 8px;
  color: #17343b;
  font-size: 16px;
}
.history-search-form {
  display: flex;
  align-items: end;
  gap: 10px;
}
.history-search-form label {
  display: grid;
  gap: 5px;
  min-width: min(420px, 100%);
  color: #40575e;
  font-size: 12px;
  font-weight: 700;
}
.history-search-form input {
  min-height: 34px;
  border: 1px solid #94a7ad;
  border-radius: 4px;
  padding: 6px 9px;
  font: inherit;
}
.history-search-form button,
.history-preview button {
  min-height: 34px;
  border: 1px solid #28725c;
  border-radius: 4px;
  padding: 6px 14px;
  background: #196b52;
  color: white;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.history-search-form button:disabled,
.history-preview button:disabled {
  opacity: 0.55;
  cursor: wait;
}
.history-status {
  margin: 10px 0 0;
  color: #48646a;
  font-size: 13px;
}
.history-results-scroll {
  max-height: 360px;
  margin-top: 12px;
  overflow: auto;
  border: 1px solid #d4dfe1;
}
.history-results {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.history-results th,
.history-results td {
  border-bottom: 1px solid #e0e7e8;
  padding: 7px 8px;
  text-align: left;
  vertical-align: top;
}
.history-results th {
  position: sticky;
  top: 0;
  background: #edf4f4;
  color: #29484f;
}
.history-results small {
  color: #6c7b80;
}
.history-import-panel > p {
  margin: 0 0 12px;
  color: #536a70;
  font-size: 13px;
}
.history-preview {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid #a8cfc0;
  border-radius: 5px;
  background: #f0faf5;
  color: #245a49;
}
.history-preview span {
  flex: 1 1 100%;
  font-size: 13px;
}
.history-overview-panel {
  border: 1px solid #cbd8da;
  border-radius: 8px;
  padding: 16px;
  background: #fff;
}
.history-overview-panel h2 {
  margin: 0 0 8px;
  color: #17343b;
  font-size: 16px;
}
.history-overview-section {
  margin-top: 12px;
}
.history-overview-section h3 {
  margin: 0 0 6px;
  color: #29484f;
  font-size: 13px;
  font-weight: 700;
}

@media (max-width: 760px) {
  .app-header {
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 10px;
  }
  .app-header-actions {
    width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 2px;
  }
  .app-header-actions > button {
    flex: 0 0 auto;
  }
  .worksheet-page-heading {
    align-items: flex-start;
    flex-direction: column;
  }
  .derived-list-actions {
    width: 100%;
    flex-wrap: wrap;
  }
  .derived-list-actions .mapping-status {
    order: -1;
  }
  .workbook-tabs {
    min-height: 40px;
    padding: 5px 7px 0;
  }
  .workbook-tabs button {
    min-height: 32px;
    padding: 6px 12px;
    font-size: 12px;
  }
  .worksheet-page {
    padding: 14px 10px 18px;
  }
}