.finder { max-width: 1100px; margin: 0 auto; padding: 16px; }
.finder__header { display:flex; gap:16px; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; }
.finder__title { margin:0; font-size: 24px; }
.finder__subtitle { margin:6px 0 0; opacity:.75; }

.finder__actions { display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; }
.finder__sort { display:flex; flex-direction:column; gap:6px; font-size: 12px; }

.finder__grid { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 14px; }
@media (max-width: 900px) { .finder__grid { grid-template-columns: 1fr; } }

.card { background:#fff; border:1px solid rgba(0,0,0,.12); border-radius:14px; padding:14px; }
.card__title { margin:0 0 10px; font-size: 14px; letter-spacing:.02em; text-transform: uppercase; opacity:.8; }

.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 520px) { .grid2 { grid-template-columns: 1fr; } }

.field { display:flex; flex-direction:column; gap:6px; margin-bottom: 10px; }
.field > span { font-size: 12px; opacity:.8; }
.field input, .finder select {
    height: 40px; padding: 0 10px; border-radius: 10px;
    border:1px solid rgba(0,0,0,.18);
}

.hint { font-size: 12px; opacity:.75; margin-top: 6px; }

.btn { height: 40px; padding: 0 14px; border-radius: 10px; border:1px solid rgba(0,0,0,.18); background:#fff; cursor:pointer; }
.btn--primary { border-color: transparent; background: #111; color:#fff; }
.btn--ghost { background: transparent; }

.chipset { display:flex; flex-wrap:wrap; gap:8px; }
.chip input { position:absolute; opacity:0; pointer-events:none; }
.chip {
    display:inline-flex; align-items:center;
    border:1px solid rgba(0,0,0,.18);
    border-radius:999px;
    padding:8px 10px;
    cursor:pointer;
    user-select:none;
    font-size: 13px;
}
.chip:has(input:checked) {
    border-color: rgba(0,0,0,.45);
    background: rgba(0,0,0,.06);
}
.is-invalid {
    border-color: #c33 !important;
    outline: none;
}