/* The sort-and-filter bar on listing flip-through pages (CC-ASK-3904; A-528, T-1095). Loaded only while the owner's switch is on.
   Tokens come from site.css (--ink, --soft, --line, --teal, --teal-d, --paper, --cream, --coral-d). 44 px targets; fits 320 px. */
.lf-bar{flex-basis:100%;display:flex;flex-direction:column;gap:8px;margin:2px 0 4px;}
.lf-bar[hidden]{display:none;}
/* On a listing the slot follows the header, so the title keeps Previous and Next beside it on the right (A-553, T-1118). */
.home-head + .lf-bar{margin:8px 0 0;}
/* The no-match notice (listing_nomatch_notice_on): one calm line and two buttons, under the chips. */
.lf-nomatch{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 12px;border:1px solid var(--line,#d9d2c5);border-radius:8px;background:var(--cream,#f6f1e7);}
.lf-nomatch[hidden]{display:none;}
.home-flip .lf-nomatch .lf-nomatch-t,.lf-nomatch-t{font-weight:700;flex:1 1 220px;}
.lf-nomatch button{min-height:44px;padding:6px 14px;border:1px solid var(--line,#d9d2c5);border-radius:999px;background:#fff;color:var(--ink,#2B2622);font:inherit;font-weight:800;cursor:pointer;}
.lf-nomatch .lf-nomatch-go{background:var(--teal-d,#1f6f5c);border-color:var(--teal-d,#1f6f5c);color:#fff;}
/* site.css colours and sizes every span inside .home-flip (and makes it a full-width flex item on phones): the bar's own spans take their parent's. */
.home-flip .lf-bar span,.home-flip .lf-sheet span{color:inherit;font-size:inherit;margin:0;flex-basis:auto;}
.home-flip .lf-bar .lf-now,.home-flip .lf-sheet .lf-now{color:var(--soft);font-size:.78rem;}
.home-flip .lf-sheet .lf-check-c,.home-flip .lf-sheet .lf-tile-c,.home-flip .lf-bar .lf-tile-c{font-size:.8rem;}
.home-flip .lf-sheet .lf-check-c{color:var(--soft);font-size:.84rem;}
.home-flip .lf-sheet .lf-field,.home-flip .lf-bar .lf-field{color:var(--soft);font-size:.84rem;}
.lf-phone{display:flex;gap:8px;}
.lf-desk{display:none;}
.lf-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit;font-weight:700;font-size:.9rem;cursor:pointer;}
.lf-phone .lf-btn{flex:1 1 0;min-width:0;}
.lf-btn:hover,.lf-btn[aria-expanded="true"],.lf-btn.on{border-color:var(--teal);}
.lf-btn.on{background:var(--cream);}
.lf-btn:focus-visible,.lf-pill:focus-visible,.lf-sortopt:focus-visible,.lf-chip:focus-visible,.lf-x:focus-visible,.lf-reset:focus-visible,.lf-show:focus-visible,.lf-input:focus-visible,.lf-check input:focus-visible{outline:3px solid var(--teal);outline-offset:2px;}
.lf-now{font-weight:400;font-size:.78rem;color:var(--soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:9em;}
.lf-badge{font-weight:800;}
.lf-chips{display:flex;flex-wrap:wrap;gap:6px;}
.lf-note{margin:0;font-size:.86rem;color:var(--soft);}
.lf-note[hidden]{display:none;}
.lf-chip{min-height:44px;padding:6px 14px;border-radius:999px;border:1px solid var(--teal);background:var(--cream);color:var(--teal-d);font:inherit;font-weight:700;font-size:.86rem;cursor:pointer;}
.lf-group{margin:0 0 18px;}
.lf-groupset{margin:0 0 18px;}
.lf-groupset .lf-group:last-child{margin-bottom:0;}
.lf-panel .lf-groupset:last-child,.lf-sheetbody .lf-groupset:last-child{margin-bottom:0;}
.lf-h{font-family:var(--font-head);font-size:.95rem;margin:0 0 8px;}
.lf-pills{display:flex;flex-wrap:wrap;gap:8px;}
.lf-pill{min-height:44px;min-width:44px;padding:6px 14px;border-radius:10px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit;font-weight:700;cursor:pointer;}
.lf-pill[aria-pressed="true"]{border-color:var(--teal);background:var(--teal-d);color:#fff;}
.lf-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;}
.lf-tile{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;}
.lf-tile-c{font-weight:400;font-size:.8rem;opacity:.85;}
.lf-checks{display:grid;grid-template-columns:1fr;gap:2px;}
.lf-check{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;}
.lf-check input{width:22px;height:22px;flex:none;accent-color:var(--teal-d);}
.lf-check-l{flex:1;}
.lf-check-c{color:var(--soft);font-size:.84rem;}
.lf-pricerow{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.lf-field{display:flex;flex-direction:column;gap:4px;font-size:.84rem;color:var(--soft);}
.lf-input{min-height:44px;padding:8px 12px;border-radius:10px;border:1px solid var(--line);font:inherit;font-size:1rem;color:var(--ink);background:#fff;width:100%;}
.lf-sortlist{display:flex;flex-direction:column;gap:6px;}
.lf-sortopt{min-height:44px;padding:8px 14px;text-align:left;border-radius:10px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit;font-weight:600;cursor:pointer;}
.lf-sortopt.on{border-color:var(--teal);background:var(--cream);font-weight:800;}
.lf-reset{min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit;font-weight:700;cursor:pointer;}
.lf-show{flex:1;min-height:44px;padding:8px 18px;border-radius:999px;border:0;background:var(--teal-d);color:#fff;font:inherit;font-weight:800;cursor:pointer;}
/* the bottom sheet (phone) */
.lf-sheet{position:fixed;inset:auto 0 0 0;margin:0;width:100%;max-width:none;max-height:88vh;padding:0;border:0;border-radius:18px 18px 0 0;background:var(--paper);color:var(--ink);flex-direction:column;box-shadow:0 -10px 30px rgba(43,38,34,.18);}
.lf-sheet[open]{display:flex;}
.lf-sheet::backdrop{background:rgba(43,38,34,.45);}
.lf-sheethead{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line);}
.lf-sheettitle{font-size:1.1rem;margin:0;}
.lf-x{width:44px;height:44px;border-radius:50%;border:0;background:transparent;color:var(--ink);font-size:1.6rem;line-height:1;cursor:pointer;}
.lf-sheetbody{padding:16px;overflow-y:auto;flex:1;}
.lf-sheetfoot,.lf-panelfoot{display:flex;flex-wrap:wrap;gap:10px;padding:12px 16px;border-top:1px solid var(--line);background:var(--paper);}
/* The live count is a plain line above the buttons, never a button (Shawn, 10-28). */
.lf-panelstatus{flex:1 1 100%;order:-1;margin:0;font-size:.88rem;font-weight:600;color:var(--ink);}
.lf-panelfoot{padding:12px 0 0;margin-top:6px;}
.lf-sheetfoot:empty{display:none;}
/* desktop: Zillow's row, each a dropdown button; Sort on the right */
@media (min-width:720px){
  .lf-phone{display:none;}
  .lf-desk{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:8px;}
  .lf-groups{display:flex;flex-wrap:wrap;gap:8px;}
  .lf-dd{position:relative;}
  .lf-panel{position:absolute;z-index:30;top:calc(100% + 6px);left:0;min-width:300px;max-width:min(420px,90vw);max-height:70vh;overflow-y:auto;padding:16px;border-radius:14px;border:1px solid var(--line);background:var(--paper);box-shadow:var(--shadow);}
  .lf-panel-r{left:auto;right:0;min-width:240px;}
  .lf-panel[hidden]{display:none;}
}
@media (max-width:640px){ .lf-panel{display:none;} }
.lf-panel[hidden]{display:none;}

/* A category page's cards (slice 3): the bar hides a card with the hidden attribute, which the site's own card rule must not override. */
.listing-grid > li[hidden] { display: none; }
.lf-gridline { margin: .5rem 0 1rem; }

/* Near a place (brief 48, slice 2) */
.lf-find{margin-top:.6rem;width:100%;justify-content:center;}
.lf-nearmsg{margin:.4rem 0 0;font-size:.84rem;min-height:1.2em;color:var(--soft);}
.lf-hint{margin:.4rem 0 0;font-size:.8rem;color:var(--soft);}

/* The Near box on a flip page and the Investor page (its Near group): the same form, in a panel or the sheet. */
.lf-nearform .voice-wrap{width:100%;}
.lf-flip{font-weight:700;white-space:nowrap;}
/* Icon buttons (A-skip): the name stays for screen readers; a dropdown is never clipped by its roll-up (the box no longer hides overflow). */
.lf-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.lf-icbtn{position:relative;gap:4px;padding:8px 14px;min-width:44px;}
.lf-ic{display:inline-flex;align-items:center;gap:4px;color:var(--teal-d);}
.lf-ic svg{display:block;}
.lf-hint{margin:.2rem 0 0;}
/* Investor homes (brief 66): the one slim row. `data-slim` pages (the bar in grid mode, not rolled up) show Near · Price · Beds · Home type · More · Sort as 30 px chips on ONE line on a desktop;
   More is a dropdown, closed on first paint, and its label carries "More · N on". On a phone the bar is only Sort and Filters (the 44 px buttons above, untouched). */
@media (min-width:720px){
  [data-bar-grid][data-slim][data-rollup="0"] .lf-desk{flex-wrap:nowrap;align-items:center;}
  [data-bar-grid][data-slim][data-rollup="0"] .lf-groups{flex-wrap:nowrap;gap:6px;min-width:0;}
  [data-bar-grid][data-slim][data-rollup="0"] .lf-ddbtn{min-height:30px;padding:2px 12px;font-size:.84rem;white-space:nowrap;}
  [data-bar-grid][data-slim][data-rollup="0"] .lf-ddbtn .lf-sr{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;}   /* the icon buttons show their words on this one slim row */
}
/* A graphic on a chip (data-icon-<key> on the page): small, before the label, never moving the count. */
.lf-tile .lf-ico{width:22px;height:22px;flex:none;margin-bottom:2px;object-fit:contain;}

/* ── The always-open compact row (brief 71 slice 3, the approved mockup): ONE row on a desktop, two tight rows on a phone. Small icons carry a tooltip (title) and a
   screen-reader name; the fields are the mockup's pills. Tokens come from the site's (the Gazette hands its own to its box). ─────────────────────────────────────────── */
.lf-cbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;border:1px solid var(--line);border-radius:10px;background:var(--cream);padding:6px 8px;}
.lf-fld{display:flex;align-items:center;gap:6px;min-height:44px;margin:0;border:1px solid var(--line);border-radius:999px;background:#fff;padding:0 12px;color:var(--soft);white-space:nowrap;}
.lf-fld[hidden]{display:none;}
.lf-fld svg{flex:0 0 auto;color:var(--teal-d);}
.lf-fld:focus-within{outline:3px solid var(--teal);outline-offset:2px;}
.lf-in{border:0;background:transparent;font:inherit;font-size:1rem;color:var(--ink);min-width:0;outline:0;padding:0;margin:0;width:100%;box-shadow:none;}
.lf-where{flex:1 1 180px;min-width:0;}
.lf-where .voice-wrap{flex:1 1 0;min-width:0;}
.lf-where .lf-in{padding-right:44px;}
.lf-dist .lf-miles{border:0;background:none;font:inherit;font-weight:600;color:var(--ink);min-height:40px;padding:0;outline:0;}
.lf-px{gap:4px;}
.lf-px .lf-in{width:60px;}
.lf-dollar{color:var(--teal-d);font-size:1.1rem;}
.lf-per{font-size:.8rem;}
.lf-beds{position:relative;}
.lf-bedval{font-weight:800;color:var(--teal-d);}
.lf-bedval:empty{display:none;}
.lf-bedpop{position:absolute;z-index:30;top:calc(100% + 6px);right:0;display:flex;gap:6px;padding:10px;border-radius:14px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);}
.lf-bedpop[hidden]{display:none;}
.lf-bed{min-width:44px;min-height:44px;padding:0 6px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-weight:700;font-size:.9rem;cursor:pointer;}
.lf-bed[aria-pressed="true"]{background:var(--teal-d);border-color:var(--teal-d);color:#fff;}
.lf-bed:focus-visible,.lf-ib:focus-visible,.lf-go:focus-visible,.lf-subx:focus-visible,.lf-subdone-x:focus-visible{outline:3px solid var(--teal);outline-offset:2px;}
.lf-ib{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--teal-d);font:inherit;font-weight:700;font-size:.9rem;cursor:pointer;}
.lf-ib:hover,.lf-ib[aria-expanded="true"],.lf-ib.on{border-color:var(--teal);}
.lf-ib.on{background:var(--cream);}
.lf-ib:disabled{opacity:.45;cursor:not-allowed;}
.lf-sub{margin-left:auto;background:var(--teal-d);border-color:var(--teal-d);color:#fff;}
.lf-sub:hover,.lf-sub[aria-expanded="true"]{border-color:var(--teal-d);background:var(--teal-d);filter:brightness(1.12);}
.lf-sub .lf-ic{color:#fff;}
.lf-sub:disabled{opacity:.55;cursor:not-allowed;}
.lf-moredd{position:relative;}
.lf-morepanel{right:0;left:auto;}
.lf-statusrow{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding:6px 4px 0;}
.lf-status{margin:0;font-size:.88rem;font-weight:600;color:var(--ink);}
.lf-asking{font-size:.8rem;color:var(--soft);}
.lf-cbar ~ .lf-chips{padding:6px 2px 0;}
.lf-cbar ~ .lf-chips .lf-chip{min-height:30px;padding:2px 10px;font-size:.85rem;background:#fff;}
.lf-cbar ~ .lf-nearmsg{margin:.3rem 4px 0;min-height:0;}
.lf-cbar ~ .lf-nearmsg:empty{margin:0;}
.lf-brk{display:none;}
@media (max-width:640px){
  /* ONE row: [ZIP or place · miles] [$ min–max] [bedrooms] [More] [bell]. (No grow-on-focus: it moved the buttons under a finger on blur and swallowed the tap.) */
  .lf-cbar{gap:4px;padding:4px;}
  .lf-fld,.lf-ib{min-height:40px;}
  .lf-where{flex:1 1 90px;padding:0 8px;}
  .lf-dist{padding:0 6px;}
  .lf-dist svg{display:none;}
  .lf-sub{margin-left:0;min-width:40px;padding:0;}
  .lf-sub-t{display:none;}
  .lf-ib{min-width:40px;padding:0 8px;}
  .lf-brk{display:none;}
  .lf-px{flex:1 1 0;min-width:0;padding:0 8px;gap:3px;}
  .lf-px .lf-in{width:100%;}
  .lf-per{display:none;}
  .lf-bedpop{right:auto;left:0;}
  .lf-cbar ~ .lf-chips{display:none;}
}
}

/* The Subscribe panel (list-bar-subscribe.js): opens under the bar, the bar stays put. Principle 3: an email, a cadence, a tick. */
.lf-subbox{margin-top:8px;}
.lf-subbox[hidden],.lf-subp[hidden],.lf-subdone[hidden],.lf-sumnote[hidden],.lf-sumprob[hidden]{display:none;}
.lf-subp,.lf-subdone{position:relative;max-width:560px;border:1.5px solid var(--teal-d);border-radius:10px;background:#fff;color:var(--ink);padding:12px 14px;}
.lf-subh{margin:0 36px 4px 0;font-family:var(--font-head);font-size:1.05rem;font-weight:800;}
.lf-subx{position:absolute;top:4px;right:4px;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--ink);font-size:1.5rem;line-height:1;cursor:pointer;}
.lf-subp p{margin:4px 0;}
.lf-sum{background:var(--cream);border-radius:6px;padding:6px 10px;font-weight:600;}
.lf-sumnote,.lf-subfine{font-size:.8rem;color:var(--soft);}
.lf-sumprob{font-weight:700;color:var(--coral-d,#a8321a);}
.lf-emailrow{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin:6px 0;}
.lf-emaillab{flex:1 1 220px;min-width:0;display:block;}
.lf-subin{width:100%;min-height:44px;border:1px solid #9a9a9a;border-radius:6px;padding:0 10px;font:inherit;font-size:1rem;color:var(--ink);background:#fff;box-sizing:border-box;}
.lf-subin[aria-invalid="true"]{border-color:var(--coral-d,#a8321a);}
.lf-subin:focus-visible{outline:3px solid var(--teal);outline-offset:2px;}
.lf-gbox{margin:0;}
.lf-freq{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0;}
.lf-freqopt{position:relative;display:block;margin:0;}
.lf-freqopt input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;}
.lf-freqopt span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:999px;font-weight:700;background:#fff;}
.lf-freqopt input:checked + span{border:2px solid var(--teal);background:var(--cream);padding:0 15px;}
.lf-freqopt input:focus-visible + span{outline:3px solid var(--teal);outline-offset:2px;}
.lf-consent{display:flex;gap:10px;align-items:flex-start;margin:10px 0;cursor:pointer;}
.lf-consent input{flex:0 0 22px;width:22px;height:22px;margin:1px 0 0;accent-color:var(--teal-d);}
.lf-landbox{margin:8px 0;padding:8px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.lf-landtab{margin:0 0 6px;}
.lf-landchip{display:inline-flex;align-items:center;min-height:32px;padding:0 14px;border:2px solid var(--teal);border-radius:999px;background:var(--cream);font-weight:800;}
.lf-landgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin:4px 0;}
.lf-landfld{display:block;min-width:0;margin:4px 0;}
.lf-landlab{display:block;font-size:.85rem;font-weight:700;color:var(--ink);margin:0 0 2px;padding:0;}
.lf-landsel{width:100%;}
.lf-landview{border:0;margin:6px 0;padding:0;min-width:0;}
.lf-landck{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin:0 14px 0 0;cursor:pointer;}
.lf-landck input{width:22px;height:22px;accent-color:var(--teal-d);}
.lf-landnote{font-size:.8rem;color:var(--soft);margin:4px 0;}
@media (max-width:420px){.lf-landgrid{grid-template-columns:1fr;}}
.lf-hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}
.lf-go{width:100%;min-height:48px;border:0;border-radius:6px;background:var(--teal-d);color:#fff;font:inherit;font-weight:800;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;}
.lf-go:disabled{opacity:.6;cursor:wait;}
.lf-subsays{min-height:1.2em;font-weight:600;}
.lf-subsays.bad{color:var(--coral-d,#a8321a);}
.lf-subdone-t{margin:0 0 8px;font-weight:600;}
.lf-subdone-x{min-height:44px;padding:0 18px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-weight:700;cursor:pointer;}