/* Same filter form, input names and submit/clear handlers. Presentation only. */
#wardrobe-filter-modal{width:min(520px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--line);border-radius:28px;background:var(--paper);overflow:hidden}
#wardrobe-filter-modal[open]{animation:filter-sheet-in .24s cubic-bezier(.2,.7,.2,1)}
#wardrobe-filter-modal::backdrop{background:#0005;backdrop-filter:blur(3px);animation:filter-backdrop-in .2s ease-out}
#wardrobe-filter-form{padding:0;display:flex;flex-direction:column;max-height:calc(100dvh - 34px);overflow:hidden}
#wardrobe-filter-form .modal-heading{margin:0;padding:20px 20px 16px;flex:none;border-bottom:1px solid var(--line);align-items:center}
#wardrobe-filter-form .eyebrow{display:none}
#wardrobe-filter-form h2{font-size:23px;margin:0;font-weight:700}
#wardrobe-filter-form .close-button{width:38px;height:38px;min-height:38px;border-radius:50%;border:1px solid var(--line);background:var(--white);color:var(--ink);font-size:23px}
.wfilter-body{overflow-y:auto;overscroll-behavior:contain;padding:18px 20px 20px;min-height:0}
#wardrobe-filter-form .wfilter-color-block{margin:0 0 20px}
#wardrobe-filter-form .wfilter-label{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:10px}
#wardrobe-filter-form .wfilter-swatches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
#wardrobe-filter-form .wfilter-swatch{min-height:44px;border-radius:14px;gap:7px;padding:8px;justify-content:flex-start;font-size:12px;position:relative;transition:background .16s,border-color .16s,transform .16s}
#wardrobe-filter-form .wfilter-swatch i{width:18px;height:18px}
#wardrobe-filter-form .wfilter-swatch.active{background:var(--accent-soft);border-color:var(--accent);color:var(--ink)}
#wardrobe-filter-form .wfilter-swatch.active i{box-shadow:0 0 0 2px var(--white),0 0 0 3px var(--accent)}
#wardrobe-filter-form .wfilter-swatch:active{transform:scale(.96)}
#wardrobe-filter-form .wfilter-grid{margin:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}
#wardrobe-filter-form .wfilter-grid label>span{font-size:12px;color:var(--muted);margin-bottom:6px}
#wardrobe-filter-form select{min-height:48px;border-radius:14px;background:var(--white);font-size:16px;padding:8px;transition:background .16s,border-color .16s}
#wardrobe-filter-form select:has(option:checked:not([value=""])){background:var(--accent-soft);border-color:var(--accent)}
#wardrobe-filter-form .wfilter-check{margin-top:20px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--white);min-height:52px;font-size:14px;gap:10px;cursor:pointer;transition:background .16s,border-color .16s}
#wardrobe-filter-form .wfilter-check:has(:checked){background:var(--accent-soft);border-color:var(--accent)}
#wardrobe-filter-form .wfilter-check input{width:20px;height:20px;accent-color:var(--accent)}
#wardrobe-filter-form .modal-actions{flex:none;margin:0;padding:14px 20px max(14px,env(safe-area-inset-bottom));border-top:1px solid var(--line);display:flex;gap:10px;background:var(--paper)}
#wardrobe-filter-form .modal-actions button{min-height:48px;border-radius:16px;font-size:14px;transition:transform .16s,background .16s}
#wardrobe-filter-form .modal-actions .primary-button{flex:1.7}#wardrobe-filter-form .modal-actions .secondary-button{flex:1;background:var(--white)}
#wardrobe-filter-form .modal-actions button:active{transform:scale(.98)}
#wardrobe-filter-form :is(button,select,input):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
#active-filter-summary .summary-chip{background:var(--accent-soft);color:var(--ink);border:1px solid var(--line);min-height:36px;display:inline-flex;gap:7px;align-items:center;animation:filter-chip-in .16s ease-out}
#active-filter-summary .summary-chip::after{content:'×';font-size:17px;opacity:.65}
#active-filter-summary .summary-chip:active{transform:scale(.97)}
#wardrobe-filter-count{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 4px;background:var(--accent);color:var(--on-accent);border-radius:50%;font-size:11px}
#wardrobe-filter-count[hidden]{display:none}
@keyframes filter-sheet-in{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}
@keyframes filter-chip-in{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@keyframes filter-backdrop-in{from{opacity:0}to{opacity:1}}
@media(max-width:360px){.wfilter-body{padding:16px}#wardrobe-filter-form .modal-heading{padding:16px}#wardrobe-filter-form .modal-actions{padding:12px 16px}#wardrobe-filter-form .wfilter-swatches{gap:6px}#wardrobe-filter-form .wfilter-swatch{font-size:11px;padding:7px;gap:5px}}
@media(prefers-reduced-motion:reduce){#wardrobe-filter-modal[open],#wardrobe-filter-modal::backdrop,#active-filter-summary .summary-chip{animation:none}#wardrobe-filter-form :is(button,select,label){transition:none}#wardrobe-filter-form :is(button,label):active,#active-filter-summary .summary-chip:active{transform:none}}