/* Поиск выставочной — оверлей command-palette (кирпич 1.7). */

/* строка поиска в топбаре стала кликабельной (курсор + ⌘K-подсказка) */
.search { cursor: pointer; }
.search #navSearchInput { cursor: pointer; padding-right: 3.3rem; }
.s-kbd {
  position: absolute;
  right: 0.9rem;
  top: 50%;
  transform: translateY(-50%);
  font: 600 0.72rem/1 ui-monospace, Menlo, monospace;
  color: var(--muted-2, var(--muted));
  border: 1px solid var(--line, var(--line));
  border-radius: 6px;
  padding: 3px 6px;
  background: var(--stone, var(--stone));
  pointer-events: none;
}
@media (max-width: 1100px) { .s-kbd { display: none; } .search #navSearchInput { padding-right: 1.2rem; } }

/* оверлей */
.sp-overlay { position: fixed; inset: 0; z-index: 200; display: flex; flex-direction: column; align-items: center; }
.sp-overlay[hidden] { display: none; }
.sp-backdrop { position: absolute; inset: 0; background: rgba(18, 28, 23, 0.42); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); animation: sp-fade 0.12s ease; }

.sp-panel {
  position: relative;
  margin-top: 11vh;
  width: min(640px, 92vw);
  max-height: 76vh;
  display: flex;
  flex-direction: column;
  background: var(--surface, var(--surface));
  border: 1px solid var(--line, var(--line));
  border-radius: 16px;
  box-shadow: 0 24px 60px -12px rgba(14, 86, 66, 0.28), 0 8px 24px rgba(0, 0, 0, 0.12);
  overflow: hidden;
  animation: sp-pop 0.14s cubic-bezier(0.2, 0.7, 0.3, 1);
}
@keyframes sp-fade { from { opacity: 0; } }
@keyframes sp-pop { from { opacity: 0; transform: translateY(-8px) scale(0.98); } }

.sp-inbar { display: flex; align-items: center; gap: 0.7rem; padding: 0.95rem 1.1rem; border-bottom: 1px solid var(--line, var(--line)); }
.sp-inico { width: 1.2rem; height: 1.2rem; color: var(--malachite-mid, var(--malachite-mid)); flex-shrink: 0; }
.sp-inico svg { width: 100%; height: 100%; }
.sp-input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 1.05rem; color: var(--ink, var(--ink-panel)); }
.sp-input::placeholder { color: var(--muted-2, var(--muted)); }
.sp-esc { font: 600 0.7rem/1 ui-monospace, Menlo, monospace; color: var(--muted-2, var(--muted)); border: 1px solid var(--line, var(--line)); border-radius: 6px; padding: 3px 7px; background: var(--stone, var(--stone)); }

.sp-results { overflow-y: auto; padding: 0.5rem; }
.sp-group { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted-2, var(--muted)); padding: 0.6rem 0.65rem 0.3rem; }
.sp-hint-row { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted-2, var(--muted)); padding: 0.55rem 0.65rem 0.1rem; }

.sp-item { display: flex; align-items: center; gap: 0.8rem; padding: 0.6rem 0.65rem; border-radius: 11px; text-decoration: none; color: var(--ink, var(--ink-panel)); }
.sp-item.on { background: var(--malachite-soft, var(--malachite-soft)); }
.sp-ic { width: 2.1rem; height: 2.1rem; flex-shrink: 0; display: flex; align-items: center; justify-content: center; border-radius: 9px; background: var(--stone, var(--stone)); color: var(--malachite, var(--malachite)); }
.sp-item.on .sp-ic { background: var(--surface); }
.sp-ic svg { width: 1.15rem; height: 1.15rem; }
.sp-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.sp-ttl { font-size: 0.95rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-ttl mark { background: var(--warning-soft); color: inherit; border-radius: 3px; padding: 0 1px; }
.sp-sub { font-size: 0.8rem; color: var(--ink-2, var(--ink-2)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-badge { flex-shrink: 0; font-size: 0.7rem; color: var(--muted-2, var(--muted)); border: 1px solid var(--line, var(--line)); border-radius: 999px; padding: 2px 9px; }

.sp-empty { padding: 2rem 1rem; text-align: center; color: var(--ink-2, var(--ink-2)); font-size: 0.92rem; }

.sp-foot { display: flex; gap: 1.1rem; align-items: center; padding: 0.6rem 1.1rem; border-top: 1px solid var(--line, var(--line)); font-size: 0.76rem; color: var(--muted-2, var(--muted)); }
.sp-foot kbd { font: 600 0.7rem/1 ui-monospace, Menlo, monospace; border: 1px solid var(--line, var(--line)); border-radius: 5px; padding: 2px 5px; background: var(--stone, var(--stone)); margin: 0 1px; color: var(--ink-2, var(--ink-2)); }

@media (max-width: 560px) {
  .sp-panel { margin-top: 0; width: 100vw; max-height: 100dvh; height: 100dvh; border-radius: 0; border: 0; }
  .sp-foot { display: none; }
}