/* 찾기 · 랭킹 */
.search-form { display: grid; gap: var(--sp-3); margin-block-end: var(--sp-3); }
.search-mode { max-width: 320px; }
.ing-chips {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-height: 48px; padding: 8px 10px;
  border: 1px solid var(--line-strong); border-radius: var(--radius); background: var(--surface); cursor: text;
}
.ing-chips .chip { min-height: 32px; gap: 4px; }
.ing-chips .chip button { border: 0; background: none; color: inherit; font-size: 1rem; line-height: 1; padding: 0 2px; cursor: pointer; }
.ing-chips input { flex: 1; min-width: 120px; border: 0; outline: none; background: transparent; min-height: 32px; font: inherit; }
.ing-box .tip { margin: 6px 0 0; font-size: var(--fs-xs); color: var(--text-sub); }
.filters .sep { flex: none; width: 1px; background: var(--line-strong); margin-block: 6px; }
.active-tag { display: flex; align-items: center; gap: var(--sp-2); margin: var(--sp-2) 0 0; }
.result-count { margin: var(--sp-3) 0 var(--sp-2); font-size: var(--fs-sm); }
.recipe-card .match { display: inline-block; margin-block-start: 4px; padding: 2px 8px; border-radius: 6px; background: var(--brand-soft); color: var(--brand-text); font-size: var(--fs-xs); font-weight: 700; }

/* 테마 모음 */
.theme-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.theme { position: relative; display: block; aspect-ratio: 1; border-radius: var(--radius); overflow: hidden; background: var(--brand-soft); color: #fff; text-decoration: none; }
.theme-img, .theme-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.theme::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgb(70 58 50 / 70%)); }
.theme-name, .theme-n { position: absolute; inset-inline: 8px; z-index: 1; }
.theme-name { bottom: 22px; font-weight: 800; font-size: var(--fs-sm); }
.theme-n { bottom: 6px; font-size: var(--fs-xs); opacity: .9; }
.theme:not(:has(img)) { color: var(--brand-text); }
.theme:not(:has(img))::after { display: none; }

/* 순위 */
.recipe-list.ranked .thumb { position: relative; }
.rank-no {
  position: absolute; inset-inline-start: 6px; top: 6px; z-index: 1; min-width: 26px; height: 26px; padding: 0 6px;
  display: grid; place-items: center; border-radius: 8px; background: var(--text); color: var(--surface); font-weight: 800; font-size: var(--fs-sm);
}
.ranked li:nth-child(-n+3) .rank-no { background: var(--brand); color: var(--on-brand); }
.scope-tabs.three { grid-template-columns: repeat(3, 1fr); }
