.chem-header-search > summary {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-inline: 6px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--control-radius, var(--radius, 6px));
  cursor: pointer;
  list-style: none;
}

.chem-header-search > summary::-webkit-details-marker { display: none; }
.chem-header-search[open] > summary,
.chem-header-search > summary:hover { color: var(--brand); border-color: var(--brand); }

.chem-header-search-panel {
  --search-gutter: clamp(16px, 3vw, 40px);
  position: absolute;
  inset-block-start: calc(100% + 8px);
  inset-inline-end: var(--search-gutter);
  z-index: 60;
  width: min(420px, calc(100% - 2 * var(--search-gutter)));
  padding: 16px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--control-radius, var(--radius, 6px));
  box-shadow: 0 8px 24px #0002;
}

.chem-header-search-panel label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
}

.chem-header-search-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.chem-header-search-fields .form-control {
  min-width: 0;
  min-height: 44px;
  background: var(--paper);
  border-color: var(--line);
  color: var(--ink);
  font-size: 16px;
}

.chem-header-search-fields .button { min-height: 44px; padding: 8px 14px; }
.chem-header-search :focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

.search-match {
  padding: 0;
  color: #ad1730;
  background: transparent;
  font-weight: 700;
}

:root[data-theme="dark"] .search-match { color: #ff8b98; }

.search-result-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.search-result-specs > div { display: flex; gap: 6px; min-width: 0; }
.search-result-specs dd { margin: 0; overflow-wrap: anywhere; }
.search-result-specs:not(:has(dd:not(:empty))),
.search-result-specs > div:has(dd:empty) { display: none; }

@media (min-width: 992px) {
  .chem-header-main:has(.chem-header-search) { position: relative; }
  .chem-header-search-panel { inset-inline-end: 0; }
}

@media (min-width: 1101px) {
  .chem-header-main:has(.chem-header-search) { column-gap: 16px; }
  .chem-header-main:has(.chem-header-search) .chem-nav-list { column-gap: clamp(8px, 1vw, 14px); }
}

@media (max-width: 991px) {
  .chem-header-search > summary { width: 44px; height: 44px; margin-inline: 0; }
}

@media (max-width: 480px) {
  .chem-header-main:has(.chem-header-search) { column-gap: 8px; }
  .chem-header-tools:has(.chem-header-search) { gap: 6px; }
  .chem-header-main:has(.chem-header-search) .chem-header-brand {
    gap: 7px;
    font-size: clamp(14px, 4.1vw, 17px);
  }
}