#sr-finder { max-width:1200px; margin:0 auto; padding:32px 16px 64px; font-family:system-ui,-apple-system,Segoe UI,sans-serif; color:#111827; }
.sr-layout{ display:grid; grid-template-columns:260px minmax(0,1fr); grid-template-areas:"tabs tabs" "filters results"; gap:24px 32px; align-items:flex-start; }
.sr-tabs{ grid-area:tabs; display:inline-flex; gap:8px; padding:4px; border-radius:999px; background:#f3f4f6; }
.sr-tab{ border:0; background:transparent; padding:6px 14px; border-radius:999px; cursor:pointer; font-size:.85rem; color:#4b5563; }
.sr-tab.is-active{ background:#111827; color:#fff; }

.sr-filters{ grid-area:filters; background:#f9fafb; border:1px solid #e5e7eb; border-radius:16px; padding:18px 16px 20px; position:sticky; top:120px; }
.sr-title{ margin:0 0 12px; font-size:1.1rem; font-weight:600; }
.sr-block{ margin-bottom:14px; }
.sr-label{ display:block; font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#6b7280; margin-bottom:6px; }
.sr-input,.sr-select{ width:100%; border:1px solid #d1d5db; border-radius:10px; padding:8px 10px; font-size:.9rem; background:#fff; }
.sr-row{ display:flex; align-items:center; gap:8px; }
.sr-sep{ color:#9ca3af; }
.sr-btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:8px 10px; border-radius:999px; border:0; cursor:pointer; font-size:.85rem; }
.sr-btn--ghost{ width:100%; border:1px solid #d1d5db; background:#fff; color:#374151; }
.sr-btn--ghost:hover{ background:#f3f4f6; }
.sr-btn--primary{ background:#111827; color:#fff; text-decoration:none; }
.sr-btn--primary:hover{ opacity:.92; }

.sr-results{ grid-area:results; }
.sr-results-head{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.sr-count{ color:#4b5563; font-size:.9rem; }
.sr-sort{ display:flex; align-items:center; gap:8px; font-size:.85rem; color:#6b7280; }
.sr-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
@media (max-width:980px){ .sr-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){ .sr-grid{grid-template-columns:1fr} }

.sr-card{ background:#fff; border:1px solid #e5e7eb; border-radius:16px; overflow:hidden; box-shadow:0 6px 18px rgba(0,0,0,.06); display:flex; flex-direction:column; }
.sr-img{ height:170px; display:flex; align-items:center; justify-content:center; background:#f3f4f6; }
.sr-img img{ max-height:160px; max-width:92%; object-fit:contain; }
.sr-noimg{ opacity:.5; }
.sr-meta{ padding:12px 14px; display:flex; flex-direction:column; gap:6px; }
.sr-brand{ font-size:11px; opacity:.7; text-transform:uppercase; letter-spacing:.02em; }
.sr-title{ font-weight:700; line-height:1.2; }
.sr-price{ font-weight:700; margin-top:2px; }
.sr-actions{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:8px; }
.sr-compare{ display:flex; align-items:center; gap:6px; font-size:.85rem; color:#6b7280; }
.sr-compare input{ width:14px; height:14px; }

.sr-empty{ color:#6b7280; font-size:.95rem; }

.sr-pager{ display:flex; align-items:center; justify-content:center; gap:10px; margin-top:16px; }
.sr-page{ color:#6b7280; font-size:.9rem; }

.sr-comparebar{ position:fixed; left:0; right:0; bottom:0; background:#111827; color:#fff; padding:10px 16px; display:none; justify-content:space-between; align-items:center; gap:12px; z-index:9999; }
.sr-compare-actions{ display:flex; gap:8px; }
.sr-comparebar .sr-btn--ghost{ width:auto; }

.sr-modalbackdrop{ position:fixed; inset:0; background:rgba(0,0,0,.45); display:none; align-items:center; justify-content:center; z-index:10000; }
.sr-modal{ background:#fff; border-radius:16px; width:95%; max-width:980px; max-height:90vh; display:flex; flex-direction:column; overflow:hidden; }
.sr-modal-head{ display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-bottom:1px solid #e5e7eb; }
.sr-modal-title{ font-weight:700; }
.sr-modal-x{ border:0; background:transparent; font-size:22px; cursor:pointer; }
.sr-modal-body{ padding:12px 16px 16px; overflow:auto; }
.sr-table{ width:100%; border-collapse:collapse; font-size:.9rem; }
.sr-table th,.sr-table td{ border-bottom:1px solid #e5e7eb; padding:8px; vertical-align:top; text-align:left; }
.sr-table td:nth-child(n+2){ text-align:center; }
.sr-table img{ max-height:120px; width:auto; }
@media (max-width:900px){
  .sr-layout{ grid-template-columns:1fr; grid-template-areas:"tabs" "filters" "results"; }
  .sr-filters{ position:static; }
  .sr-tabs{ justify-content:center; }
}
