:root{
  --df-bg:#F2F3F4;
  --df-teal:#3AF1C5;
  --df-blue:#00112C;
  --df-gray:#6B7280;
  --df-border:#E5E7EB;
  --df-card:#ffffff;
}
.df-hero{ padding:12px 0 18px; }
.df-search-wrap{ position:relative; background:#fff; border:1px solid var(--df-border); border-radius:16px; box-shadow:0 10px 20px rgba(0,0,0,0.04); max-width:1200px; margin:0 auto; padding:8px 8px 8px 16px; }
.df-search-input{ width:100%; height:60px; border:0; outline:none; font-size:18px; }
.df-search-btn{ position:absolute; right:10px; top:10px; height:56px; padding:0 22px; background:var(--df-teal); color:#00112C; border:0; border-radius:12px; font-weight:700; cursor:pointer; }

.df-filter{ background:#fff; border:1px solid var(--df-border); border-radius:14px; padding:14px; }
.df-filter-head{ font-weight:700; margin-bottom:8px; color:#102132; }
.df-sec{ border-top:1px solid var(--df-border); padding-top:8px; margin-top:8px; }
.df-sec:first-of-type{ border-top:0; padding-top:0; margin-top:0; }
.df-sec summary{ cursor:pointer; font-weight:600; color:#102132; }
.df-sec-body{ padding:8px 4px 6px; }
.df-check{ display:flex; align-items:center; gap:8px; margin:6px 0; }
.df-range input[type="range"]{ width:100%; accent-color:var(--df-teal); }
.df-price{ display:flex; align-items:center; gap:8px; }
.df-price input{ width:100%; height:38px; border:1px solid var(--df-border); border-radius:10px; padding:0 10px; }
.df-dash{ color:#999; }
.df-startend input{ width:100%; height:38px; border:1px solid var(--df-border); border-radius:10px; padding:0 10px; margin-bottom:8px; }
.df-filter-actions{ display:flex; gap:8px; margin-top:12px; }
.df-apply{ background:var(--df-blue); color:#fff; border:0; border-radius:10px; height:38px; padding:0 14px; cursor:pointer; }
.df-reset{ background:#e5e7eb; color:#111827; border:0; border-radius:10px; height:38px; padding:0 14px; cursor:pointer; }

.df-quick-ul{ list-style:none; padding:0; margin:12px 0 0; }
.df-quick-ul li{ display:flex; justify-content:space-between; padding:6px 2px; border-bottom:1px solid var(--df-border); }
.df-quick-price{ color:#0f6d2f; }
.df-quick-empty,.df-quick-loading{ color:var(--df-gray); padding:8px 0; }

.df-results{ background:#fff; border:1px solid var(--df-border); border-radius:14px; }
.df-results-head{ display:flex; justify-content:space-between; align-items:center; padding:12px 14px; border-bottom:1px solid var(--df-border); }
.df-count{ color:#102132; font-weight:600; }
.df-actions{ display:flex; align-items:center; gap:12px; }
.df-sort{ height:36px; border:1px solid var(--df-border); border-radius:10px; padding:0 10px; }
.df-reset-link{ color:#var(--df-gray); text-decoration:none; }

.df-list{ display:block; }
.df-row{ display:flex; justify-content:space-between; gap:12px; padding:14px; border-bottom:1px solid var(--df-border); }
.df-row:last-child{ border-bottom:0; }
.df-row-main{ display:flex; flex-direction:column; }
.df-domain{ color:var(--df-teal); font-weight:700; text-decoration:none; }
.df-domain:hover{ filter:brightness(1.1); }
.df-seller{ color:#df-gray; font-size:14px; margin-top:4px; }
.df-row-side{ display:flex; align-items:center; gap:12px; }
.df-price{ font-weight:700; color:#0f6d2f; }
.df-price.df-na{ color:#6B7280; }
.df-buy{ background:var(--df-blue); color:#fff; text-decoration:none; padding:10px 16px; border-radius:10px; font-weight:700; }

@media (max-width: 768px){
  .df-row{ flex-direction:column; align-items:flex-start; }
  .df-row-side{ justify-content:space-between; width:100%; }
}