.site-search-wrap { background: #fff; border-bottom: 1px solid var(--border); padding: 10px 0; }
.site-search-wrap .wrap { position: relative; display: block; }
#site-search-input {
  width: 100%; box-sizing: border-box; padding: 9px 14px; font-size: 14px;
  font-family: inherit; color: var(--text); background: var(--bg);
  border: 1px solid var(--border); border-radius: 6px; outline: none;
  transition: border-color .15s, background .15s;
}
#site-search-input:focus { border-color: var(--accent); background: #fff; }
#site-search-input::placeholder { color: var(--text-sub); }
#site-search-results {
  position: absolute; top: calc(100% + 6px); left: 20px; right: 20px;
  background: #fff; border: 1px solid var(--border); border-radius: 6px;
  box-shadow: 0 6px 20px rgba(0,0,0,.08); max-height: 70vh; overflow-y: auto; z-index: 100;
}
.sr-item {
  display: block; padding: 12px 14px; border-bottom: 1px solid var(--border);
  text-decoration: none; color: var(--text); transition: background .1s;
}
.sr-item:last-child { border-bottom: none; }
.sr-item:hover { background: var(--accent-light); text-decoration: none; }
.sr-tag {
  display: inline-block; font-size: 11px; padding: 1px 6px; border-radius: 3px;
  margin-right: 8px; vertical-align: middle; letter-spacing: .3px;
}
.sr-tag-article { background: var(--accent-light); color: var(--accent); }
.sr-tag-glossary { background: var(--tag-bg); color: var(--text-sub); }
.sr-title { font-size: 14px; font-weight: 700; color: var(--accent); line-height: 1.5; }
.sr-snippet {
  display: block; font-size: 12px; color: var(--text-sub); line-height: 1.5;
  margin-top: 4px; margin-left: calc(11px + 12px + 8px);
}
.sr-empty { padding: 18px 14px; text-align: center; font-size: 13px; color: var(--text-sub); }
#site-search-results mark { background: #fff3a0; color: inherit; padding: 0 2px; border-radius: 2px; }
@media (max-width: 639px) {
  .site-search-wrap { padding: 8px 0; }
  #site-search-input { font-size: 16px; }
  .sr-snippet { margin-left: 0; margin-top: 6px; }
}