/* ═══════════════════════════════════════════════════════════
   Aqua Search v2 · 全站资源搜索样式
   搜索框住在资源页顶部的 .yr-bar 工具行里（分类胶囊与排序之间），
   输入时整页原内容让位给结果面板，清空即还原。
   ═══════════════════════════════════════════════════════════ */

/* 搜索框：玻璃胶囊，与分类胶囊同一视觉语言 */
.sr-box {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1 1 260px;
  min-width: 200px;
  max-width: 420px;
  height: 46px;
  padding: 0 16px;
  border-radius: 999px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .78), rgba(234, 241, 251, .55));
  border: 1px solid rgba(129, 166, 224, .35);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 6px 18px rgba(47, 108, 246, .10);
  transition: border-color .3s var(--e-expo, ease), box-shadow .3s var(--e-expo, ease);
}
.sr-box:focus-within {
  border-color: var(--azure, #2f6cf6);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 0 0 3px rgba(47, 108, 246, .14);
}
.sr-ico {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  stroke: var(--ink-soft, #3d587d);
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  opacity: .6;
}
.sr-box:focus-within .sr-ico { stroke: var(--azure, #2f6cf6); opacity: .9; }
.sr-input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  font: inherit;
  font-size: 14px;
  color: var(--ink, #0d1f3c);
}
.sr-input::placeholder { color: rgba(93, 118, 156, .55); }
.sr-input::-webkit-search-cancel-button { display: none; }
.sr-clear {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
  color: var(--ink-soft, #3d587d);
  background: rgba(47, 108, 246, .10);
}
.sr-clear:hover { background: rgba(47, 108, 246, .18); }

/* ── 搜索时：页面原内容让位 ── */
body.sr-on .shell-body,
body.sr-on .shell > .sw-lede,
body.sr-on .filter-bar,
body.sr-on .yr-sort {
  display: none !important;
}

/* ── 结果面板 ── */
.sr-panel {
  padding: 20px 22px 24px;
  margin: 4px 0 26px;
}
.sr-count {
  font-size: 13px;
  letter-spacing: .04em;
  color: var(--ink-soft, #3d587d);
  margin-bottom: 14px;
}
.sr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}
.sr-card {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .66);
  border: 1px solid rgba(129, 166, 224, .28);
  transition: border-color .25s var(--e-expo, ease), transform .25s var(--e-expo, ease);
}
.sr-card:hover {
  border-color: rgba(47, 108, 246, .45);
  transform: translateY(-2px);
}
.sr-thumb {
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
  border-radius: 12px;
  object-fit: cover;
  background: rgba(47, 108, 246, .08);
}
.sr-thumb.off { display: none; }
.sr-main { flex: 1 1 auto; min-width: 0; }
.sr-kinds { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 5px; }
.sr-kind, .sr-cat, .sr-badge {
  display: inline-block;
  font-size: 11px;
  letter-spacing: .05em;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(47, 108, 246, .10);
  color: var(--azure-deep, #1a49c4);
}
.sr-cat { background: rgba(13, 31, 60, .07); color: var(--ink-soft, #3d587d); }
.sr-badge { background: rgba(196, 138, 47, .14); color: #8a5c14; }
.sr-title {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink, #0d1f3c);
  text-decoration: none;
  margin-bottom: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
a.sr-title:hover { color: var(--azure, #2f6cf6); }
.sr-sum {
  font-size: 12.5px;
  line-height: 1.65;
  color: var(--ink-soft, #3d587d);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 8px;
}
.sr-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.sr-act {
  display: inline-block;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 12px;
  text-decoration: none;
  border: 1px solid rgba(129, 166, 224, .4);
  color: var(--ink, #0d1f3c);
  background: rgba(255, 255, 255, .6);
}
.sr-act:hover { border-color: var(--azure, #2f6cf6); color: var(--azure, #2f6cf6); }
.sr-act.primary {
  border: 0;
  background: linear-gradient(135deg, var(--azure, #2f6cf6), var(--azure-deep, #1a49c4));
  color: #fff;
  box-shadow: 0 4px 12px rgba(26, 73, 196, .22);
}
.sr-empty {
  margin: 6px 0 0;
  font-size: 13.5px;
  color: var(--ink-soft, #3d587d);
}

/* ── 手机/平板：搜索框整行，工具行允许换行 ── */
@media (max-width: 900px) {
  .yr-bar { flex-wrap: wrap; }
  .sr-box { flex: 1 1 100%; max-width: none; order: 9; }
}

/* ── v2 · 搜索范围按钮（本站 / 本模块）── */
.sr-box { position: relative; }
.sr-scope { position: relative; display: inline-flex; flex: 0 0 auto; margin-left: 8px; }
.sr-scope-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 7px 14px; border: 1px solid rgba(129, 166, 224, .42);
  border-radius: var(--r-pill, 999px); cursor: pointer;
  font: inherit; font-size: 12px; font-weight: 900; letter-spacing: .05em;
  color: var(--azure-deep, #1a49c4);
  background: linear-gradient(140deg, rgba(255, 255, 255, .9), rgba(206, 228, 255, .55));
  box-shadow: 0 6px 16px rgba(26, 73, 196, .1), inset 0 1px 0 #fff;
  white-space: nowrap;
}
.sr-scope-btn:hover { box-shadow: 0 10px 22px rgba(26, 73, 196, .18), inset 0 1px 0 #fff; }
.sr-scope-caret { font-size: 10px; opacity: .7; }
.sr-scope-menu {
  display: none;
  position: absolute; top: calc(100% + 10px); right: 0; z-index: 70;
  min-width: 190px; padding: 7px;
  border-radius: 15px;
  background: linear-gradient(165deg, rgba(255, 255, 255, .97), rgba(236, 243, 252, .94));
  border: 1px solid rgba(129, 166, 224, .38);
  box-shadow: 0 18px 42px rgba(13, 31, 60, .18);
}
.sr-scope-item {
  display: flex; flex-direction: column; gap: 2px;
  width: 100%; padding: 9px 12px;
  border: 0; border-radius: 10px; cursor: pointer;
  font: inherit; text-align: left; background: transparent;
}
.sr-scope-item:hover { background: rgba(47, 108, 246, .1); }
.sr-scope-item .sr-scope-name { font-size: 13px; font-weight: 900; color: var(--ink, #0d1f3c); }
.sr-scope-item .sr-scope-sub { font-size: 11px; font-weight: 700; color: var(--ink-faint, #7f97b8); }
.sr-scope-item.active { background: rgba(47, 108, 246, .13); }
.sr-scope-item.active .sr-scope-name { color: var(--azure-deep, #1a49c4); }
.sr-scope-item.active .sr-scope-name::after { content: ' ✓'; }
@media (max-width: 640px) {
  .sr-scope-btn { padding: 6px 10px; font-size: 11px; }
  .sr-scope-menu { min-width: 170px; }
}