.search-tools { display:grid; grid-template-columns:minmax(0,1fr) 58px; gap:10px; align-items:stretch; }
.search-tools .search-box { grid-template-columns:22px minmax(0,1fr) auto; gap:8px; padding-inline:16px; }
.search-tools .search-box input { font-size:14px; }
.filter-trigger { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-height:70px; border:1px solid #ffffff; border-radius:23px; background:#ffffffcf; box-shadow:var(--shadow-soft); color:#44647b; font-size:11px; font-weight:650; }
.filter-trigger svg { width:23px; height:23px; }
.filter-trigger.is-active { background:#e3f2ff; color:#0878f9; border-color:#bcdfff; }
.filter-active-dot { position:absolute; top:7px; right:7px; width:7px; height:7px; border-radius:50%; background:#0878f9; }
.filter-summary { display:flex; align-items:center; gap:8px; min-width:0; }
.filter-summary-chips { display:flex; gap:6px; flex:1; overflow:auto; scrollbar-width:none; }
.filter-summary-chips::-webkit-scrollbar { display:none; }
.filter-summary-chip { display:inline-flex; align-items:center; gap:6px; flex-shrink:0; min-height:32px; padding:5px 10px; border:1px solid #c6e3f4; border-radius:10px; background:#f4fcff; color:#356578; font-size:11px; }
.filter-summary-chip span { font-size:15px; line-height:1; color:#86a0b0; }
.filter-clear { padding:8px 0 8px 5px; background:transparent; color:#718397; font-size:11px; white-space:nowrap; }
.card-facts { display:flex; flex-wrap:wrap; align-items:center; gap:5px 8px; margin:8px 3px 4px; color:#617b8b; font-size:10px; }
.card-facts .card-score { color:#337f8d; font-weight:720; }
body.filters-open { overflow:hidden; }
#filterDialog { position:fixed; inset:auto 0 0; width:min(100%,480px); max-width:100%; max-height:min(89dvh,840px); margin:0 auto; padding:0; overflow:hidden; border:0; border-radius:28px 28px 0 0; background:#fcfeff; color:var(--ink); box-shadow:0 -20px 70px #173c5428; }
#filterDialog[open] { display:flex; flex-direction:column; }
#filterDialog::backdrop { background:#18334355; backdrop-filter:blur(3px); }
.filter-sheet-header { position:relative; flex-shrink:0; padding:25px 22px 15px; border-bottom:1px solid #edf2f5; background:linear-gradient(145deg,#eefaff,#fcfeff 80%); }
.filter-sheet-header::before { content:''; position:absolute; top:9px; left:calc(50% - 17px); width:34px; height:4px; border-radius:4px; background:#d0dce4; }
.filter-sheet-header h2 { margin:0 44px 6px 0; font-size:22px; font-weight:750; letter-spacing:-.025em; }
.filter-sheet-header p { margin:0; color:#8494a4; font-size:11px; }
.filter-sheet-close { position:absolute; right:16px; top:22px; width:38px; height:38px; border-radius:50%; background:#eaf1f6; color:#718294; font-size:25px; line-height:1; }
.filter-sheet-body { min-height:0; overflow:auto; overscroll-behavior:contain; padding:4px 22px 10px; scrollbar-width:thin; }
.filter-field { min-width:0; padding:18px 0; margin:0; border:0; border-bottom:1px solid #edf2f5; }
.filter-field:last-child { border-bottom:0; }
.filter-field legend { float:left; width:100%; margin-bottom:13px; padding:0; display:flex; align-items:center; justify-content:space-between; font-size:14px; font-weight:710; }
.filter-field legend span { font-size:10px; font-weight:450; color:#97a3b2; }
.filter-options { clear:both; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.filter-option { position:relative; display:flex; justify-content:center; align-items:center; min-height:37px; padding:7px 4px; border:1px solid transparent; border-radius:11px; background:#f0f4f7; color:#627284; font-size:12px; cursor:pointer; text-align:center; line-height:1.25; }
.filter-option input { position:absolute; width:1px; height:1px; opacity:0; }
.filter-option:has(input:checked) { border-color:#a7d1fc; background:#e9f4ff; color:#0878f9; font-weight:650; }
.filter-option:has(input:focus-visible) { outline:3px solid #0878f944; outline-offset:2px; }
.filter-options.more-options { margin-top:8px; }
.filter-more { clear:both; display:block; padding:11px 0 0; background:transparent; color:#8092a5; font-size:11px; }
.filter-range { clear:both; display:grid; grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr); gap:10px; align-items:center; }
.filter-range > span { text-align:center; color:#a0adb8; }
.filter-number { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:5px; min-width:0; padding:10px 12px; border:1px solid #e4ecf1; border-radius:12px; background:white; }
.filter-number input { min-width:0; width:100%; padding:0; border:0; background:transparent; color:#18394e; font-size:15px; outline:none; }
.filter-number:focus-within { border-color:#83bff7; box-shadow:0 0 0 3px #0878f913; }
.filter-number input::placeholder { color:#a3b0bc; font-size:12px; }
.filter-number input::-webkit-inner-spin-button { appearance:none; }
.filter-number span { font-size:11px; color:#98a5b3; }
.filter-presets { display:flex; gap:7px; flex-wrap:wrap; margin-top:11px; }
.filter-preset { min-height:30px; padding:5px 10px; border:1px solid #e3ebf2; border-radius:8px; background:transparent; color:#8191a4; font-size:11px; }
.filter-preset[aria-pressed="true"] { border-color:#acd5fc; background:#eef7ff; color:#0878f9; }
.filter-host-options { grid-template-columns:.8fr 1fr 1fr; }
.filter-field-help { clear:both; margin:10px 0 0; color:#95a2b1; font-size:10px; line-height:1.6; }
.filter-sheet-footer { flex-shrink:0; padding:12px 22px max(18px,env(safe-area-inset-bottom)); border-top:1px solid #e9f0f5; background:#ffffff; box-shadow:0 -6px 22px #204b6b05; }
.filter-sheet-footer > p { margin:0 0 9px; color:#8a9cad; font-size:10px; text-align:center; }
.filter-sheet-footer .filter-error { color:#bc4e51; text-align:left; font-size:11px; }
.filter-sheet-actions { display:grid; grid-template-columns:80px minmax(0,1fr); gap:10px; }
.filter-reset { min-height:46px; border:1px solid #dce9f1; border-radius:14px; background:white; color:#71889a; font-size:13px; }
.filter-apply { min-height:46px; border-radius:14px; background:linear-gradient(105deg,#1596fb,#3171f9); color:white; font-size:14px; font-weight:650; box-shadow:0 5px 14px #0878f927; }
.filter-apply:disabled { background:#bfd6e8; box-shadow:none; cursor:default; }
@media (min-width:650px) { #filterDialog { inset:24px 0; margin:auto; max-height:min(88dvh,840px); border-radius:28px; } }
@media (max-width:359px) { .search-tools { grid-template-columns:minmax(0,1fr) 50px; gap:7px; } .search-tools .search-box { padding-inline:12px; } .search-tools .search-box input { font-size:12px; } .filter-sheet-body { padding-inline:16px; } }
@media (prefers-reduced-motion:no-preference) { #filterDialog[open] { animation:filter-appear 180ms ease-out; } @keyframes filter-appear { from { opacity:0; transform:translateY(25px); } to { opacity:1; transform:translateY(0); } } }