/* REAL ESTATE (/ui/realestate-page.js). Built from the design canvas the owner
   approved on 2026-09-24 ("Let design Real Estate Mockup. Premium Smart and
   Real Estate Feel", then "Let's build it"). The picture leads every card,
   the price is in Fraunces (loaded by the page itself), and everything else
   stays quiet: counts sit on the filters that use them, never in a row of
   boxes. Every class is re- and sits under .rlx. */

/* ── in the app: a page that scrolls as a document ── */
.rlx.rl-page.re-pg.active{display:block;overflow:auto}
.rlx.re-pg .re-in{max-width:1320px;margin:0 auto;padding-bottom:56px;display:flex;flex-direction:column;gap:22px}
.rlx.re-pg .rl-pg-hd{align-items:flex-start;margin-bottom:0}
.rlx.re-pg .rl-pg-hd h1{font-size:30px;letter-spacing:-.035em}
.rlx.re-pg .rl-pg-hd p{font-size:14px;margin-top:7px;color:var(--rl-ink3)}
.rlx.re-pg .rl-pg-hd p b{color:var(--rl-ink);font-weight:700}
.rlx .re-mono{font-family:"DM Mono",ui-monospace,monospace;font-weight:500}
.rlx .re-sr{position:absolute;width:1px;height:1px;overflow:hidden}
.rlx .re-none{font-size:12.5px;font-weight:600;color:var(--rl-ink3);white-space:nowrap}
.rlx .re-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:800;color:#b93520;text-decoration:none;white-space:nowrap}
.rlx .re-link:hover{color:#8f2816}
.rlx .re-quiet{margin:0;font-size:13px;line-height:1.55;color:var(--rl-ink3)}
.rlx .re-help{display:block;margin-top:6px;font-size:12px;line-height:1.45;font-weight:500;color:var(--rl-ink3)}

/* ── tabs ── */
.rlx .re-tabs{display:flex;gap:28px;border-bottom:1px solid var(--rl-line)}
.rlx .re-tab{position:relative;display:inline-flex;align-items:center;gap:8px;height:46px;font-size:14px;font-weight:600;color:var(--rl-ink3)}
.rlx .re-tab .n{min-width:22px;height:20px;padding:0 6px;border-radius:99px;background:var(--rl-surface3);color:var(--rl-ink2);font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.rlx .re-tab.is-on{color:var(--rl-ink);font-weight:800}
.rlx .re-tab.is-on .n{background:#161a24;color:#fff}
.rlx .re-tab.is-on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:2px;background:#161a24}
.rlx .re-tab:focus-visible{outline:2px solid var(--rl-acc);outline-offset:2px;border-radius:6px}

/* ── the toolbar ── */
.rlx .re-tools{display:flex;flex-direction:column;gap:12px}
.rlx .re-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rlx .re-row .sp{flex:1}
.rlx .re-seg{display:inline-flex;padding:4px;border-radius:12px}
.rlx .re-seg button{flex:none;height:34px;padding:0 14px;font-size:13px;font-weight:700;border-radius:9px}
.rlx .re-seg button.is-on{font-weight:800}
.rlx .re-search{width:300px;height:40px}
.rlx .re-chip{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 11px 0 12px;border-radius:10px;background:#fff;border:1px solid var(--rl-line);box-shadow:var(--rl-sh-xs);font-size:13px;font-weight:600;color:var(--rl-ink3);white-space:nowrap;transition:border-color .15s,background .15s}
.rlx .re-chip:hover{border-color:#d5d9e3;background:#fafbfc}
.rlx .re-chip b{font-weight:700;color:var(--rl-ink)}
.rlx .re-chip .rl-ic{color:var(--rl-ink4)}
.rlx .re-chip.is-set{border-color:#161a24;box-shadow:0 0 0 1px #161a24}
.rlx .re-row>.re-chip:first-of-type .rl-ic:first-child{color:var(--rl-ink3)}
.rlx .re-clear{display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 10px;border-radius:10px;font-size:13px;font-weight:700;color:var(--rl-ink2)}
.rlx .re-clear:hover{background:var(--rl-surface3)}
.rlx .re-view{display:inline-flex;padding:4px;border-radius:12px}
.rlx .re-view button{flex:none;width:34px;height:34px;padding:0;display:grid;place-items:center;border-radius:9px;color:var(--rl-ink3)}
.rlx .re-view button.is-on{color:var(--rl-ink)}

/* ── the menus the chips open ── */
.rlx .re-opts{display:flex;flex-direction:column;min-width:220px;max-height:min(420px,60vh);overflow:auto}
.rlx .re-opt{display:flex;align-items:center;gap:10px}
.rlx .re-opt .ck{width:18px;flex:none;display:grid;place-items:center;color:var(--rl-ink)}
.rlx .re-opt em{margin-left:auto;font-style:normal;font-size:12px;font-weight:700;color:var(--rl-ink4)}
.rlx .re-opt.is-on{font-weight:700}
.rlx .re-opt-h{padding:8px 10px 4px;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--rl-ink3)}

/* ── a listing card ── */
.rlx .re-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px}
.rlx .re-card{position:relative;display:flex;flex-direction:column;min-width:0;border-radius:18px;background:#fff;overflow:hidden;cursor:pointer;
  box-shadow:inset 0 0 0 1px var(--rl-line),0 1px 2px rgba(16,24,40,.05),0 18px 36px -30px rgba(16,24,40,.45);transition:transform .2s var(--rl-ease),box-shadow .2s}
.rlx .re-card:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px #d7dbe4,0 22px 44px -26px rgba(15,18,24,.45)}
.rlx .re-card:focus-visible{outline:0;box-shadow:0 0 0 3px var(--rl-ring),inset 0 0 0 1px var(--rl-acc)}
.rlx .re-card.is-preview,.rlx .re-card.is-skel{cursor:default}
.rlx .re-card.is-preview:hover,.rlx .re-card.is-skel:hover{transform:none}
.rlx .re-pic{position:relative;aspect-ratio:16/9;background:#e9edf3;overflow:hidden}
.rlx .re-pic>img{display:block;width:100%;height:100%;object-fit:cover}
.rlx .re-card.is-off .re-pic>img,.rlx .re-card.is-off .re-pic>.re-bp{filter:grayscale(1) contrast(.92) brightness(1.03)}
.rlx .re-glass{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:8px;background:rgba(15,18,24,.58);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font-size:11.5px;font-weight:700;white-space:nowrap}
.rlx .re-kind{position:absolute;top:12px;left:12px}
.rlx .re-count{position:absolute;left:12px;bottom:12px}
.rlx .re-count.is-r{left:auto;right:14px;bottom:14px}
.rlx .re-more{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.92);color:var(--rl-ink);box-shadow:0 2px 8px -2px rgba(15,18,24,.3)}
.rlx .re-more:hover{background:#fff}
.rlx .re-addph{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:10px;background:#fff;color:var(--rl-ink);font-size:12.5px;font-weight:800;box-shadow:0 6px 16px -8px rgba(15,18,24,.35),0 0 0 1px rgba(15,18,24,.06);white-space:nowrap}
.rlx .re-band{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 16px;border-radius:99px;background:#fff;color:var(--rl-ink);font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;box-shadow:0 8px 20px -10px rgba(15,18,24,.5);white-space:nowrap}
.rlx .re-body{display:flex;flex-direction:column;gap:10px;padding:16px 18px}
.rlx .re-price{display:flex;align-items:baseline;gap:6px 10px;flex-wrap:wrap}
.rlx .re-price b{font-family:"Fraunces",Georgia,serif;font-size:25px;font-weight:600;line-height:1;letter-spacing:-.015em;color:var(--rl-ink);white-space:nowrap;font-variant-numeric:lining-nums}
.rlx .re-price b.is-ask{font-family:inherit;font-size:16px;font-weight:800;letter-spacing:0}
.rlx .re-price .pm{font-size:12.5px;font-weight:700;color:var(--rl-ink2);margin-left:-4px}
.rlx .re-price .x{font-size:12.5px;font-weight:600;color:var(--rl-ink3);white-space:nowrap}
.rlx .re-price.is-big b{font-size:40px}
.rlx .re-price.is-big .x,.rlx .re-price.is-big .pm{font-size:13px}
.rlx .re-card.is-off .re-price b{color:var(--rl-ink3)}
.rlx .re-t{display:flex;flex-direction:column;gap:5px;min-width:0}
.rlx .re-t h3{margin:0;font-size:15px;line-height:1.3;font-weight:800;letter-spacing:-.005em;color:var(--rl-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-place{display:flex;align-items:center;gap:6px;min-width:0;font-size:13px;font-weight:600;color:var(--rl-ink2)}
.rlx .re-place .rl-ic{color:var(--rl-ink4)}
.rlx .re-place span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-place i{font-style:normal;color:var(--rl-ink4)}
.rlx .re-specs{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;font-weight:600;color:var(--rl-ink2)}
.rlx .re-specs span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.rlx .re-specs .rl-ic{color:var(--rl-ink4)}
.rlx .re-foot{display:flex;align-items:center;gap:8px;padding-top:14px;margin-top:2px;border-top:1px solid var(--rl-line)}
.rlx .re-foot .sp{flex:1}
.rlx .re-fits{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 11px;border-radius:10px;background:var(--rl-acc-soft);color:#b93520;font-size:12.5px;font-weight:800;white-space:nowrap}
.rlx .re-fits:hover{background:#ffe6de}
.rlx .re-skel-pic{display:block;aspect-ratio:16/9;border-radius:0}
.rlx .re-card.is-skel .re-body{gap:12px}

/* A status: one colour each, the text a shade darker than its dot. */
.rlx [data-st="available"]{--c:var(--rl-ok);--t:#067a55}
.rlx [data-st="sold"],.rlx [data-st="rented"]{--c:#8a92a6;--t:#475067}
.rlx [data-st="inactive"]{--c:var(--rl-warn);--t:#a15c07}
.rlx .re-st,.rlx .re-pill,.rlx .re-stage{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:99px;font-size:11.5px;font-weight:800;white-space:nowrap;color:var(--t,var(--rl-ink2));background:color-mix(in srgb,var(--c,var(--rl-ink3)) 11%,#fff)}
.rlx .re-st i,.rlx .re-pill i,.rlx .re-stage i{flex:none;width:6px;height:6px;border-radius:50%;background:var(--c,var(--rl-ink3))}
.rlx .re-stage{color:color-mix(in srgb,var(--c) 70%,#0f1218)}
.rlx .re-pill.is-ok{--c:var(--rl-ok);--t:#067a55}
.rlx .re-pill.is-warn{--c:var(--rl-warn);--t:#a15c07}
.rlx .re-pill.is-info{--c:var(--rl-info);--t:#1d4fc4}
.rlx .re-pill.is-bad{--c:var(--rl-danger);--t:#be123c}
.rlx .re-pill.is-mute{--c:#8a92a6;--t:#475067}

/* A listing with no photo yet: an elevation on drafting paper. */
.rlx .re-bp{position:relative;display:block;width:100%;height:100%;background-color:#eef2f8;background-image:linear-gradient(rgba(71,80,103,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(71,80,103,.08) 1px,transparent 1px);background-size:18px 18px}
.rlx .re-bp i{position:absolute;display:block}
.rlx .re-bp .b1{left:34%;bottom:28%;width:26%;height:50%;border:1.5px solid rgba(71,80,103,.42);border-bottom:0;background-image:repeating-linear-gradient(90deg,transparent 0 11px,rgba(71,80,103,.2) 11px 12.5px),repeating-linear-gradient(180deg,transparent 0 13px,rgba(71,80,103,.2) 13px 14.5px)}
.rlx .re-bp .b2{left:60%;bottom:28%;width:13%;height:30%;border:1.5px solid rgba(71,80,103,.32);border-left:0;border-bottom:0}
.rlx .re-bp .g{left:14%;right:14%;bottom:28%;height:0;border-top:1.5px solid rgba(71,80,103,.42)}

/* ── the list ── */
.rlx .re-listw{border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--rl-line),0 1px 2px rgba(16,24,40,.05);overflow:auto}
.rlx .re-table{width:100%;min-width:900px}
.rlx .re-table td{vertical-align:middle}
.rlx .re-table tbody tr{cursor:pointer}
.rlx .re-table tbody tr.is-off .re-thumb{filter:grayscale(1)}
.rlx .re-thumb{display:block;width:84px;height:60px;border-radius:10px;overflow:hidden;background:#e9edf3;flex:none}
.rlx .re-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.rlx .re-thumb .re-bp{background-size:9px 9px}
.rlx .re-rt{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:360px}
.rlx .re-rt b{font-size:14px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-rt .re-place{font-size:12.5px}
.rlx .re-rk{display:flex;flex-direction:column;gap:2px}
.rlx .re-rk b{font-size:13px;font-weight:700;white-space:nowrap}
.rlx .re-rk span{font-size:12px;font-weight:600;color:var(--rl-ink3);white-space:nowrap}
.rlx .re-num{font-size:13px;font-weight:600;color:var(--rl-ink2);white-space:nowrap;font-variant-numeric:tabular-nums}
.rlx .re-rp{display:flex;align-items:baseline;gap:5px}
.rlx .re-rp b{font-family:"Fraunces",Georgia,serif;font-size:18px;font-weight:600;white-space:nowrap}
.rlx .re-rp span{font-size:12px;font-weight:700;color:var(--rl-ink2)}
.rlx .re-racts{display:flex;justify-content:flex-end;gap:6px}
.rlx .re-grid-ph{display:none}
.rlx .re-more-ft{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:var(--rl-ink3)}
.rlx .re-more-ft b{color:var(--rl-ink)}

/* ── nothing yet ── */
.rlx .re-empty{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;gap:32px;padding:28px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--rl-line)}
.rlx .re-empty-bp{aspect-ratio:16/10;border-radius:16px;overflow:hidden}
.rlx .re-empty .t b{display:block;font-size:20px;font-weight:800;letter-spacing:-.01em}
.rlx .re-empty .t p{margin:8px 0 18px;max-width:46ch;font-size:14px;line-height:1.6;color:var(--rl-ink2)}

/* ── a listing, opened ── */
.rlx .re-crumbs{display:flex;align-items:center;gap:12px;min-width:0}
.rlx .re-crumbs span{font-size:13px;font-weight:600;color:var(--rl-ink3)}
.rlx .re-crumbs i{font-style:normal;color:var(--rl-ink4)}
.rlx .re-crumbs b{font-size:13px;font-weight:700;color:var(--rl-ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-detail{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:26px;align-items:start}
.rlx .re-dl,.rlx .re-dr{display:flex;flex-direction:column;gap:22px;min-width:0}
.rlx .re-dr{position:sticky;top:12px}
.rlx .re-card2{display:flex;flex-direction:column;gap:16px;min-width:0;padding:22px 24px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px var(--rl-line),0 1px 2px rgba(16,24,40,.05),0 18px 36px -30px rgba(16,24,40,.45)}
.rlx .re-h{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.rlx .re-h h2{margin:0;font-size:16px;font-weight:800;letter-spacing:-.005em}
.rlx .re-h .n{font-size:13px;font-weight:700;color:var(--rl-ink4)}
.rlx .re-h .sp{flex:1}
.rlx .re-gal{display:flex;flex-direction:column;gap:10px}
.rlx .re-cover{position:relative;display:block;width:100%;aspect-ratio:16/9;max-height:460px;border-radius:18px;overflow:hidden;background:#e9edf3}
.rlx .re-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--rl-ease)}
.rlx .re-cover:hover img{transform:scale(1.02)}
.rlx .re-cover .re-kind{top:16px;left:16px;height:28px;font-size:12px}
.rlx .re-allph{position:absolute;left:16px;bottom:16px;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:10px;background:rgba(255,255,255,.94);color:var(--rl-ink);font-size:12.5px;font-weight:800}
.rlx .re-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.rlx .re-thumbs button{position:relative;display:block;aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:#e9edf3}
.rlx .re-thumbs img{display:block;width:100%;height:100%;object-fit:cover}
.rlx .re-plus{position:absolute;inset:0;display:grid;place-items:center;background:rgba(15,18,24,.5);color:#fff;font-size:14px;font-weight:800}
.rlx .re-gal.is-none{position:relative;aspect-ratio:16/9;max-height:460px;border-radius:18px;overflow:hidden}
.rlx .re-gal-bp{position:absolute;inset:0}
.rlx .re-gal-empty{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 18px;border-radius:14px;background:rgba(255,255,255,.94);text-align:center;box-shadow:0 12px 28px -18px rgba(15,18,24,.5)}
.rlx .re-gal-empty b{font-size:14px;font-weight:800}
.rlx .re-gal-empty span{font-size:12.5px;color:var(--rl-ink3);max-width:34ch}
.rlx .re-gal-empty .rl-btn{margin-top:4px}
.rlx .re-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 20px}
.rlx .re-fact{display:flex;align-items:center;gap:12px;min-width:0}
.rlx .re-fact .rl-tile{width:38px;height:38px;border-radius:11px;--c:var(--rl-ink2)}
.rlx .re-fact>span:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.rlx .re-fact small{font-size:12px;font-weight:600;color:var(--rl-ink3)}
.rlx .re-fact b{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px}
.rlx .re-two>.re-card2:only-child{grid-column:1/-1}
.rlx .re-amen{display:flex;flex-wrap:wrap;gap:8px}
.rlx .re-amen span{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:8px;background:var(--rl-surface2);font-size:12.5px;font-weight:700;color:var(--rl-ink2)}
.rlx .re-amen .rl-ic{color:var(--rl-ok)}
.rlx .re-about{margin:0;font-size:13.5px;line-height:1.65;font-weight:500;color:var(--rl-ink2);white-space:pre-line}
.rlx .re-vgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rlx .re-visit{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--rl-surface2);min-width:0}
.rlx .re-visit .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rlx .re-visit .t b{font-size:13.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-visit .t span{font-size:12.5px;font-weight:600;color:var(--rl-ink3)}
.rlx .re-date{width:46px;height:50px;flex:none;border-radius:11px;background:#fff;box-shadow:inset 0 0 0 1px var(--rl-line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.rlx .re-date small{font-family:"DM Mono",ui-monospace,monospace;font-size:9.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--rl-ink3)}
.rlx .re-date b{font-family:"Fraunces",Georgia,serif;font-size:19px;font-weight:600;line-height:1}
.rlx .re-date.is-req{background:#fff5e6;box-shadow:none;color:#a15c07}

/* the price card */
.rlx .re-pcard{gap:18px}
.rlx .re-pc-top{display:flex;align-items:center;gap:8px}
.rlx .re-pc-top .sp{flex:1}
.rlx .re-k{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;background:#161a24;color:#fff;font-size:11px;font-weight:800}
.rlx .re-pc-main{display:flex;flex-direction:column;gap:10px}
.rlx .re-pc-main h1{margin:0;font-size:22px;line-height:1.25;font-weight:800;letter-spacing:-.015em;text-wrap:balance}
.rlx .re-pc-main .re-place{font-size:13.5px}
.rlx .re-pc-acts{display:flex;flex-direction:column;gap:8px}
.rlx .re-pc-acts>.rl-btn{width:100%;justify-content:center}
.rlx .re-pc-acts .two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rlx .re-pc-acts .two .rl-btn{justify-content:center}
.rlx .re-info{display:flex;flex-direction:column;margin-top:-6px}
.rlx .re-info>div{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--rl-line);min-width:0}
.rlx .re-info>div:last-child{border-bottom:0}
.rlx .re-info .rl-ic{color:var(--rl-ink4)}
.rlx .re-info .l{font-size:13px;font-weight:600;color:var(--rl-ink3);white-space:nowrap}
.rlx .re-info .v{flex:1;min-width:0;text-align:right;font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-info .v.is-warn{color:#a15c07}
.rlx .re-warn{display:flex;gap:8px;margin:-6px 0 0;padding:10px 12px;border-radius:12px;background:#fff5e6;font-size:12.5px;line-height:1.5;font-weight:600;color:#7a4a08}
.rlx .re-warn .rl-ic{margin-top:2px;color:#a15c07}
.rlx .re-warn .re-link{font-size:12.5px}

/* buyers who fit */
.rlx .re-fitc{gap:10px;padding:20px 12px 14px}
.rlx .re-fitc>.re-h,.rlx .re-fitc>.re-sub,.rlx .re-fitc>.re-quiet{padding:0 10px}
.rlx .re-sub{margin:-4px 0 0;font-size:12.5px;line-height:1.45;color:var(--rl-ink3)}
.rlx .re-fits-l{display:flex;flex-direction:column}
.rlx .re-fit{display:flex;align-items:flex-start;gap:12px;width:100%;padding:12px 10px;border-radius:12px;text-align:left;transition:background .12s}
.rlx .re-fit:hover{background:#fafbfc}
.rlx .re-fit .rl-chk{margin-top:9px}
.rlx .re-fit .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}
.rlx .re-fit .n{display:flex;align-items:center;gap:8px;min-width:0}
.rlx .re-fit .n b{font-size:13.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-fit .reqs,.rlx .re-reqs{display:flex;flex-wrap:wrap;gap:5px}
.rlx .re-req{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 8px;border-radius:7px;font-size:11.5px;font-weight:700;white-space:nowrap;background:#fff;color:var(--rl-ink3);box-shadow:inset 0 0 0 1px var(--rl-line)}
.rlx .re-req.is-ok{background:#e7f7f0;color:#067a55;box-shadow:none}
.rlx .re-fit .ch,.rlx .re-bcard .ch{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--rl-ink3)}
.rlx .re-fit .ch i,.rlx .re-chat i,.rlx .re-bcard .ch i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--rl-warn)}
.rlx .re-fit .ch i.is-open,.rlx .re-chat i.is-open,.rlx .re-bcard .ch i.is-open{background:var(--rl-ok)}
.rlx .re-fit-ft{display:flex;align-items:center;gap:10px;padding:6px 10px 0;font-size:12.5px;font-weight:600;color:var(--rl-ink3)}
.rlx .re-fit-ft .sp{flex:1}
.rlx .re-av{flex:none;border-radius:50%;font-size:13px;font-weight:800}
.rlx .re-av.is-num{width:34px;height:34px;display:grid;place-items:center;background:var(--rl-surface3);color:var(--rl-ink2)}

/* ── buyers ── */
.rlx .re-source{display:flex;align-items:center;gap:14px;padding:12px 16px 12px 12px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--rl-line),0 1px 2px rgba(16,24,40,.05)}
.rlx .re-source .rl-tile{width:36px;height:36px;border-radius:10px;--c:var(--rl-ink2)}
.rlx .re-source p{flex:1;margin:0;font-size:13px;line-height:1.5;font-weight:600;color:var(--rl-ink2)}
.rlx .re-source p b{color:var(--rl-ink)}
.rlx .re-btable{min-width:1060px}
.rlx .re-btable tbody tr{cursor:default}
.rlx .re-who{display:flex;align-items:center;gap:11px;min-width:0}
.rlx .re-who>span:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.rlx .re-who b{font-size:13.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-who small{font-size:12px;font-weight:600;color:var(--rl-ink3);white-space:nowrap}
.rlx .re-ai{display:inline-flex;align-items:center;gap:4px;font-size:11.5px!important;font-weight:700!important;color:#b93520!important}
.rlx .re-loc{font-size:13px;font-weight:700}
.rlx .re-chat{display:flex;flex-direction:column;gap:3px}
.rlx .re-chat span{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;white-space:nowrap}
.rlx .re-chat small{padding-left:14px;font-size:12px;font-weight:600;color:var(--rl-ink3);white-space:nowrap}
.rlx .re-stack{display:inline-flex;align-items:center;gap:10px}
.rlx .re-stack .ims{display:inline-flex}
.rlx .re-stack .ims>span{display:block;width:30px;height:30px;border-radius:8px;overflow:hidden;box-shadow:0 0 0 2px #fff;background:#e9edf3}
.rlx .re-stack .ims>span+span{margin-left:-8px}
.rlx .re-stack img{display:block;width:100%;height:100%;object-fit:cover}
.rlx .re-stack .re-bp{background-size:6px 6px}
.rlx .re-stack b{font-size:13px;font-weight:800;white-space:nowrap}
.rlx .re-bcards{display:none}

/* ── the photos, large ── */
.rlx .rl-dlg.is-reviewer{width:min(1100px,calc(100vw - 32px))}
.rlx .re-view-bd{position:relative;display:grid;place-items:center;padding:0 20px;background:#0f1218}
.rlx .re-view-bd img{display:block;max-width:100%;max-height:min(70vh,720px);object-fit:contain}
.rlx .re-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);color:var(--rl-ink);box-shadow:0 6px 16px -6px rgba(0,0,0,.4)}
.rlx .re-nav.is-l{left:14px}.rlx .re-nav.is-r{right:14px}
.rlx .re-view-th{display:flex;gap:8px;padding:12px 20px 18px;overflow-x:auto}
.rlx .re-view-th button{flex:0 0 76px;height:56px;border-radius:9px;overflow:hidden;opacity:.6;box-shadow:inset 0 0 0 2px transparent}
.rlx .re-view-th button.is-on{opacity:1;box-shadow:0 0 0 2px var(--rl-ink)}
.rlx .re-view-th img{display:block;width:100%;height:100%;object-fit:cover}

/* ── adding and editing: the form, and the photos and the card beside it ── */
.rlx .rl-dlg.is-ref{width:min(1040px,calc(100vw - 32px));height:min(880px,calc(100vh - 48px))}
.rlx .re-ef{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 336px;border-top:1px solid var(--rl-line)}
.rlx .re-ef-form{padding:22px 26px 28px;display:flex;flex-direction:column;gap:28px}
.rlx .re-fsec{display:flex;flex-direction:column;gap:14px}
.rlx .re-fsec h3{margin:0;font-size:15px;font-weight:800;letter-spacing:-.005em}
.rlx .re-sec-sub{margin:-8px 0 0;font-size:12.5px;color:var(--rl-ink3)}
.rlx .re-fld{min-width:0}
.rlx .re-grid3{display:grid;grid-template-columns:140px minmax(0,1fr) minmax(0,1fr);gap:14px}
.rlx .re-fseg{display:flex}
.rlx .re-fseg button{flex:1 1 0;height:36px}
.rlx .re-choices{display:flex;flex-wrap:wrap;gap:8px}
.rlx .re-choice{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:10px;background:#fff;border:1px solid #dfe2ea;font-size:13px;font-weight:700;color:var(--rl-ink2);transition:.15s}
.rlx .re-choice:hover{border-color:#cfd3dd}
.rlx .re-choice.is-on{background:#161a24;border-color:#161a24;color:#fff}
.rlx .re-choice.is-own{background:transparent;border-style:dashed;color:var(--rl-ink3)}
.rlx .re-choice.is-own.is-on{background:#fff;border-style:solid;border-color:#161a24;color:var(--rl-ink)}
.rlx .re-own{margin-top:10px;max-width:280px}
.rlx .re-money{display:flex;align-items:center;gap:8px;height:44px;padding:0 13px;border-radius:var(--rl-r10);background:#fff;border:1px solid var(--rl-line);box-shadow:var(--rl-sh-xs);transition:.15s}
.rlx .re-money:focus-within{border-color:var(--rl-acc);box-shadow:0 0 0 4px var(--rl-ring)}
.rlx .re-money .cur{font-size:14px;font-weight:700;color:var(--rl-ink3)}
.rlx .re-money input{flex:1;min-width:0;height:40px;font-size:14px!important;font-weight:600;font-variant-numeric:tabular-nums}
.rlx .re-money .w{font-size:13px;font-weight:700;color:var(--rl-ink);white-space:nowrap}
.rlx .re-amenbox{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:9px;min-height:52px;border-radius:12px;border:1px solid var(--rl-line);background:#fff;box-shadow:var(--rl-sh-xs)}
.rlx .re-amenbox:focus-within{border-color:var(--rl-acc);box-shadow:0 0 0 4px var(--rl-ring)}
.rlx .re-am{display:inline-flex;align-items:center;gap:4px;height:32px;padding:0 4px 0 11px;border-radius:8px;background:var(--rl-surface2);box-shadow:inset 0 0 0 1px var(--rl-line);font-size:13px;font-weight:700}
.rlx .re-am button{width:24px;height:24px;border-radius:6px;display:grid;place-items:center;color:var(--rl-ink3)}
.rlx .re-am button:hover{background:var(--rl-surface3);color:var(--rl-ink)}
.rlx .re-amenbox input{flex:1 1 150px;min-width:130px;height:32px;font-size:13.5px!important}
.rlx .re-ideas{display:flex;flex-wrap:wrap;gap:6px}
.rlx .re-ideas button{display:inline-flex;align-items:center;gap:5px;height:28px;padding:0 10px;border-radius:8px;border:1px dashed #d5d9e3;font-size:12px;font-weight:700;color:var(--rl-ink3)}
.rlx .re-ideas button:hover{border-style:solid;color:var(--rl-ink)}
.rlx .re-ta{min-height:104px;resize:vertical;line-height:1.55}
.rlx .re-warn-t{color:#a15c07;font-weight:700}
.rlx .re-ef-side{min-height:0;overflow:auto;padding:22px;background:var(--rl-bg);border-left:1px solid var(--rl-line);display:flex;flex-direction:column;gap:22px}
.rlx .re-ef-blk{display:flex;flex-direction:column;gap:10px}
.rlx .re-ef-h{display:flex;align-items:baseline;gap:8px}
.rlx .re-ef-h span:last-child{font-size:12px;font-weight:600;color:var(--rl-ink4)}
.rlx .re-phs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.rlx .re-ph{position:relative;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:#e9edf3;cursor:grab;box-shadow:0 0 0 1px rgba(15,18,24,.06)}
.rlx .re-ph.is-drag{opacity:.4}
.rlx .re-ph img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.rlx .re-cov{position:absolute;left:6px;bottom:6px;height:20px;padding:0 7px;border-radius:6px;font-size:10.5px}
.rlx .re-mkcov{position:absolute;left:6px;bottom:6px;height:22px;padding:0 7px;border-radius:6px;background:rgba(255,255,255,.94);font-size:10.5px;font-weight:800;opacity:0;transition:opacity .15s}
.rlx .re-ph:hover .re-mkcov,.rlx .re-mkcov:focus-visible{opacity:1}
.rlx .re-phx{position:absolute;top:5px;right:5px;width:22px;height:22px;border-radius:7px;display:grid;place-items:center;background:rgba(255,255,255,.94);color:var(--rl-ink)}
.rlx .re-phadd{aspect-ratio:4/3;border-radius:10px;border:1.5px dashed #d5d9e3;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:12px;font-weight:800;color:var(--rl-ink2);cursor:pointer}
.rlx .re-phadd:hover{border-color:var(--rl-ink3)}
.rlx .re-phadd:focus-within{outline:2px solid var(--rl-acc);outline-offset:2px}
.rlx .re-preview .re-card{box-shadow:inset 0 0 0 1px var(--rl-line),0 18px 36px -26px rgba(16,24,40,.45)}
.rlx .re-preview .re-price b{font-size:21px}
.rlx .re-preview .re-body{padding:13px 14px 14px}
.rlx .re-ef-ft{flex-wrap:wrap}
.rlx .re-ef-st{display:inline-flex;align-items:center;gap:10px;font-size:12.5px;font-weight:700;color:var(--rl-ink2)}
.rlx .re-ef-st .re-fseg button{flex:none;padding:0 12px}
.rlx .re-why{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:#be123c}

/* ── sending listings ── */
.rlx .rl-dlg.is-rsh{width:min(1000px,calc(100vw - 32px));height:min(780px,calc(100vh - 48px))}
.rlx .re-sh{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 336px;border-top:1px solid var(--rl-line)}
.rlx .re-sh-l{min-height:0;overflow:auto;padding:18px 20px;display:flex;flex-direction:column;gap:14px}
.rlx .re-sh-l .rl-search{width:100%;height:42px}
.rlx .re-grp{display:flex;flex-direction:column;gap:2px}
.rlx .re-grp-h{display:flex;align-items:center;gap:8px;padding:0 10px 4px}
.rlx .re-grp-h>span:not(.rl-sec):not(.sp){font-size:12px;font-weight:700;color:var(--rl-ink4)}
.rlx .re-grp-h .sp{flex:1}
.rlx .re-grp-h .re-link{font-size:12.5px}
.rlx .re-pp,.rlx .re-hp{display:flex;align-items:center;gap:12px;width:100%;padding:10px;border-radius:12px;text-align:left;transition:background .12s}
.rlx .re-pp:hover,.rlx .re-hp:hover{background:#fafbfc}
.rlx .re-pp .t,.rlx .re-hp .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rlx .re-pp .n{display:flex;align-items:center;gap:8px;min-width:0}
.rlx .re-pp .n b,.rlx .re-hp .t b{font-size:13.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-pp .s,.rlx .re-hp .t>span:not(.re-reqs){font-size:12px;font-weight:600;color:var(--rl-ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-pp .st{display:inline-flex;align-items:center;gap:7px;flex:none;font-size:12px;font-weight:700;white-space:nowrap}
.rlx .re-pp .st i{width:7px;height:7px;border-radius:50%;background:currentColor}
.rlx .re-pp .st.is-open{color:#067a55}
.rlx .re-pp .st.is-tpl{color:#a15c07}
.rlx .re-pp .st.is-none{color:#be123c}
.rlx .re-pp .st.is-unknown{color:var(--rl-ink3)}
.rlx .re-pp.is-add .rl-chk{border-style:dashed}
.rlx .re-hp .re-thumb{width:64px;height:48px;border-radius:8px}
.rlx .re-sh-who .re-pp{background:var(--rl-surface2);cursor:default}
.rlx .re-sh-r{min-height:0;overflow:auto;padding:18px 20px;background:var(--rl-bg);border-left:1px solid var(--rl-line);display:flex;flex-direction:column;gap:12px}
.rlx .re-wa{display:flex;flex-direction:column;gap:10px;padding:14px 12px;border-radius:16px;background:#eceff4}
.rlx .re-wa-h{align-self:center;font-size:11px;font-weight:700;color:var(--rl-ink3);text-align:center}
.rlx .re-bub{align-self:flex-end;max-width:272px}
.rlx .re-bub-in{padding:6px 6px 7px;border-radius:16px 16px 5px 16px;background:linear-gradient(180deg,#e9f8ee,#ddf2e6);box-shadow:0 1px 2px rgba(14,159,110,.16);font-size:13px;line-height:1.5}
.rlx .re-bub-in p{margin:0;padding:7px 5px 0}
.rlx .re-bub-in em{display:block;text-align:right;font-size:10px;font-style:normal;color:var(--rl-ink4);margin-top:2px}
.rlx .re-url{color:#1d6fb8;font-weight:600}
.rlx .re-lc{border-radius:11px;overflow:hidden;background:rgba(255,255,255,.72)}
.rlx .re-lc img,.rlx .re-lc .re-lc-bp{display:block;width:100%;height:118px;object-fit:cover}
.rlx .re-lc>div{display:flex;flex-direction:column;gap:2px;padding:8px 10px 9px}
.rlx .re-lc b{font-size:12.5px;font-weight:800}
.rlx .re-lc span{font-size:11.5px;font-weight:600;color:var(--rl-ink3)}
.rlx .re-quiet-bub{display:flex;justify-content:flex-end}
.rlx .re-callout{margin:0}
.rlx .re-note{display:flex;gap:8px;margin:0;font-size:12px;line-height:1.45;font-weight:600;color:var(--rl-ink2)}
.rlx .re-note .rl-ic{flex:none;margin-top:1px;color:var(--rl-ink4)}
.rlx .re-tplrow{display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--rl-line)}
.rlx .re-tplrow .rl-tile{width:34px;height:34px;border-radius:10px}
.rlx .re-tplrow .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rlx .re-tplrow .t b{font-size:13px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rlx .re-tplrow .t span{font-size:11.5px;color:var(--rl-ink3)}
.rlx .re-vars{display:flex;flex-direction:column;gap:8px}
.rlx .re-var{display:grid;grid-template-columns:44px minmax(0,1fr);gap:6px 8px;align-items:center}
.rlx .re-var>span{font-family:"DM Mono",ui-monospace,monospace;font-size:12px;color:var(--rl-ink3)}
.rlx .re-var input{grid-column:2}
.rlx .re-sh-ft .re-sum{font-size:13px;font-weight:600;color:var(--rl-ink2)}
.rlx .re-sh-ft .re-sum b{color:var(--rl-ink)}

/* ── narrower screens ── */
@media (max-width:1180px){
  .rlx .re-detail{grid-template-columns:minmax(0,1fr) 380px}
  .rlx .re-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* One column: the price and Share come straight after the photos, then the
   buyers it fits, then the rest. */
@media (max-width:980px){
  .rlx .re-detail{display:flex;flex-direction:column;align-items:stretch;gap:22px}
  .rlx .re-dl,.rlx .re-dr{display:contents}
  .rlx .re-gal{order:1}
  .rlx .re-pcard{order:2}
  .rlx .re-fitc{order:3}
  .rlx .re-dl>.re-card2:not(.re-visits){order:4}
  .rlx .re-two{order:5}
  .rlx .re-visits{order:6}
  .rlx .re-search{width:220px}
  .rlx .re-ef,.rlx .re-sh{grid-template-columns:minmax(0,1fr) 300px}
}
/* A phone: one column; the list is cards; dialogs are sheets that scroll.
   The old theme collapses .content while a page like this is up; put it back
   and let the page's own column scroll (as Appointments and Workshop do). */
@media (max-width:760px){
  body:has(#page-realestate.re-pg.active) .content{height:auto!important;padding:0!important;overflow:visible!important}
  #page-realestate.re-pg.active .re-in{padding:0 16px 96px;gap:16px}
  .rlx.re-pg .rl-pg-hd{padding:0}
  .rlx.re-pg .rl-pg-hd .acts .rl-btn{height:40px;min-height:40px!important}
  .rlx.re-pg .rl-pg-hd .acts .is-dark{width:40px;padding:0}
  .rlx.re-pg .rl-pg-hd h1{font-size:24px}
  .rlx.re-pg .rl-pg-hd p{font-size:13px}
  .rlx .re-tabs{gap:22px}
  .rlx .re-row{gap:8px}
  .rlx .re-row .sp{display:none}
  .rlx .re-seg{flex:1 1 100%;overflow-x:auto}
  .rlx .re-seg button{flex:1 0 auto}
  /* rl-page.css sends a phone's search box to the end of its row; here it
     shares a row with the sort, and in the share sheet it stays on top */
  .rlx .re-tools .re-search{flex:1 1 0;min-width:0;width:auto;order:0}
  .rlx .re-sh-l .rl-search{order:-1;flex:none}
  .rlx .re-pp .re-stage{display:none}
  .rlx .re-pp .st{font-size:11.5px}
  /* a phone always shows cards, so the cards/list switch goes */
  .rlx .re-view{display:none}
  .rlx .re-chips{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:0 16px 2px;scrollbar-width:none}
  .rlx .re-chips::-webkit-scrollbar{display:none}
  .rlx .re-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .rlx .re-listw{display:none}
  .rlx .re-grid-ph{display:grid}
  .rlx .re-bcards{display:flex;flex-direction:column;gap:8px}
  .rlx .re-bcard{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--rl-line)}
  .rlx .re-bcard .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
  .rlx .re-bcard .t b{font-size:14px;font-weight:800}
  .rlx .re-bcard .t>span:not(.ch){font-size:12.5px;color:var(--rl-ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .rlx .re-empty{grid-template-columns:minmax(0,1fr);padding:18px}
  .rlx .re-facts{grid-template-columns:minmax(0,1fr)}
  .rlx .re-two,.rlx .re-vgrid{grid-template-columns:minmax(0,1fr)}
  .rlx .re-card2{padding:18px}
  .rlx .re-price.is-big b{font-size:34px}
  .rlx .re-crumbs span,.rlx .re-crumbs i{display:none}
  .rlx .rl-dlg.is-ref,.rlx .rl-dlg.is-rsh,.rlx .rl-dlg.is-reviewer{width:auto;height:auto}
  .rlx .re-ef,.rlx .re-sh{display:block;flex:1;min-height:0;overflow-y:auto}
  .rlx .re-ef-form,.rlx .re-sh-l{overflow:visible}
  .rlx .re-ef-side,.rlx .re-sh-r{border-left:0;border-top:1px solid var(--rl-line)}
  .rlx .re-grid3,.rlx .re-ef .rl-grid2{grid-template-columns:minmax(0,1fr)}
  .rlx .re-ef-ft .re-ef-st{flex:1 1 100%;overflow-x:auto}
}
@media (prefers-reduced-motion:reduce){
  .rlx .re-card,.rlx .re-cover img{transition:none}
  .rlx .re-card:hover{transform:none}
}
