
.bar__search {
  position: relative;
  flex: 0 0 12.5rem;
  width: 12.5rem;
  min-width: 0;
  pointer-events: auto;
}
.home-search__open { display: none; }
.home-search__field { position: relative; margin: 0; }
.home-search__label,
.home-search__status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.home-search__glyph {
  position: absolute;
  left: 10px;
  top: 9px;
  width: 14px;
  height: 14px;
  color: var(--sc-accent, #c5a45d);
  pointer-events: none;
}
.home-search__input {
  display: block;
  width: 100%;
  height: 32px;
  box-sizing: border-box;
  border: 1px solid var(--paw-line, #34363a);
  border-radius: 2px;
  background: color-mix(in srgb, var(--sc-canvas, #191a1c) 88%, transparent);
  color: var(--sc-ink, #f7f5ed);
  font: 500 13px/32px "Geist", system-ui, sans-serif;
  padding: 0 3.5rem 0 30px;
}
.home-search__input::placeholder { color: var(--sc-ink-soft, #b9b5a8); }
.home-search__input::-webkit-search-cancel-button { display: none; }
.home-search__input:focus-visible {
  outline: 2px solid var(--sc-accent, #c5a45d);
  outline-offset: 2px;
}
.home-search__keys {
  position: absolute;
  right: 8px;
  top: 8px;
  color: var(--sc-ink-soft, #b9b5a8);
  font: 600 10px/16px "Geist", system-ui, sans-serif;
  letter-spacing: 0.04em;
  pointer-events: none;
}
.home-search__input:not(:placeholder-shown) ~ .home-search__keys { visibility: hidden; }
.home-search__list {
  position: absolute;
  z-index: 4;
  top: calc(100% + 6px);
  right: 0;
  width: min(18.5rem, calc(100vw - 24px));
  margin: 0;
  padding: 4px;
  background: var(--sc-canvas, #191a1c);
  border: 1px solid var(--paw-line, #34363a);
  border-radius: 2px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}
.home-search__list[hidden] { display: none !important; }
.home-search__list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 36px;
  padding: 6px 8px;
  color: var(--sc-ink, #f7f5ed);
  text-decoration: none;
  font: 500 13px/1.3 "Geist", system-ui, sans-serif;
  border-radius: 2px;
}
.home-search__list a:hover,
.home-search__list a:focus-visible {
  background: var(--sc-surface, #232427);
  outline: 2px solid var(--sc-accent, #c5a45d);
  outline-offset: -2px;
}
.home-search__title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-search__section {
  flex: 0 0 auto;
  color: var(--sc-accent, #c5a45d);
  font: 700 9px/1 "Archivo", "Helvetica Neue", Arial, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.home-search__empty {
  margin: 0;
  padding: 8px;
  color: var(--sc-ink-soft, #b9b5a8);
  font: 500 13px/1.3 "Geist", system-ui, sans-serif;
}
@media (max-width: 1100px) and (min-width: 861px) {
  .bar__search { flex-basis: 9.5rem; width: 9.5rem; }
  .home-search__keys { display: none; }
  .home-search__input { padding-right: 10px; }
}
@media (max-width: 860px) {
  .bar__search {
    flex: 0 0 32px;
    width: 32px;
    max-width: 32px;
  }
  .home-search__field { display: none; }
  .home-search__open {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 2px;
    background: transparent;
    color: var(--sc-accent, #c5a45d);
    cursor: pointer;
  }
  .home-search__open:focus-visible {
    outline: 2px solid var(--sc-accent, #c5a45d);
    outline-offset: 2px;
  }
  .home-search__open svg { display: block; width: 16px; height: 16px; }
  .bar__search.is-open {
    flex: 1 0 100%;
    order: 4;
    width: 100%;
    max-width: none;
    margin: 4px 0 8px;
  }
  .bar__search.is-open .home-search__open { display: none; }
  .bar__search.is-open .home-search__field { display: block; }
  .bar__search.is-open .home-search__keys { display: none; }
  .bar__search.is-open .home-search__input { padding-right: 10px; font-size: 16px; }
}
