/* Rosenthal & Excell — availability board.
   Rides on the tokens already in styles.css (--paper, --ink, --ox, --line).
   Square corners, hairline rules, one accent. Deliberately none of the VD
   house patterns: no rounded cards, no pill badges, no gradient buttons. */

/* ---------- filter bar ---------- */
.lf{
  display:flex;justify-content:space-between;align-items:flex-end;gap:24px;
  flex-wrap:wrap;border-bottom:1px solid var(--ink);padding-bottom:14px;
}
.lf-chips{display:flex;gap:0;flex-wrap:wrap}
.lf-chip{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-45);background:transparent;
  border:0;border-bottom:2px solid transparent;
  padding:8px 18px 8px 0;margin-right:18px;cursor:pointer;line-height:1;
  transition:color .16s ease,border-color .16s ease;
}
.lf-chip:hover{color:var(--ink)}
.lf-chip.on{color:var(--ox);border-bottom-color:var(--ox)}
.lf-chip:focus-visible{outline:2px solid var(--ox);outline-offset:3px}
.lf-city{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.lf-city select{
  font-family:var(--sans);font-size:15px;color:var(--ink);
  background:transparent;border:0;border-bottom:1px solid var(--line-2);
  padding:4px 22px 4px 0;cursor:pointer;min-width:170px;border-radius:0;
  appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-45) 50%),
                   linear-gradient(135deg,var(--ink-45) 50%,transparent 50%);
  background-position:calc(100% - 10px) 55%,calc(100% - 5px) 55%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}
.lf-city select:focus-visible{outline:2px solid var(--ox);outline-offset:3px}
.lf-count{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-45);margin-top:16px;
}

/* ---------- the grid ---------- */
/* The hairline ledger is drawn by the cards themselves. Doing it with a
   container background and 1px gaps looks identical when the last row is full
   and leaves a grey phantom tile when it is not, which is most weeks. */
.lc-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:20px;
  border-top:1px solid var(--line);border-left:1px solid var(--line);
}
.lc{
  position:relative;display:flex;flex-direction:column;background:var(--card);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  transition:background .18s ease;
}
.lc:hover{background:var(--paper-2)}
.lc[hidden]{display:none}

/* ---------- card carousel ---------- */
.lc-media{
  position:relative;overflow:hidden;background:var(--paper-3);
  touch-action:pan-y;
}
.lc-track{display:flex;transition:transform .42s cubic-bezier(.22,.61,.24,1)}
.lc-slide{flex:0 0 100%;min-width:0}
.lc-slide img{
  width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;display:block;
}
.lc-nophoto{
  aspect-ratio:3/2;background:
    repeating-linear-gradient(45deg,var(--paper-2) 0 10px,var(--paper-3) 10px 20px);
}
/* Arrows sit above the stretched link, which is what keeps a swipe or an
   arrow press from navigating to the listing. */
.lc-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:32px;height:32px;padding:0;cursor:pointer;border-radius:0;
  background:rgba(248,244,233,.92);border:1px solid var(--line-2);
  opacity:0;transition:opacity .18s ease,background .18s ease;
}
.lc-arrow::before{
  content:"";position:absolute;top:50%;left:50%;width:7px;height:7px;
  border-top:1.5px solid var(--ink);border-right:1.5px solid var(--ink);
}
.lc-prev{left:10px}
.lc-prev::before{transform:translate(-30%,-50%) rotate(-135deg)}
.lc-next{right:10px}
.lc-next::before{transform:translate(-70%,-50%) rotate(45deg)}
.lc-arrow:hover{background:var(--paper)}
.lc:hover .lc-arrow,.lc-arrow:focus-visible{opacity:1}
.lc-arrow:focus-visible{outline:2px solid var(--ox);outline-offset:2px}
.lc-dots{
  position:absolute;left:0;right:0;bottom:0;z-index:3;
  display:flex;justify-content:center;gap:2px;pointer-events:none;
  padding:18px 0 2px;
  /* Aerial property photography is bright and busy, and cream dots on it were
     effectively invisible. A short scrim gives them something to sit on
     without putting a bar across the picture. */
  background:linear-gradient(to top,rgba(26,26,24,.42),rgba(26,26,24,0));
}
.lc-dot{
  pointer-events:auto;width:24px;height:24px;padding:11px 3px;border:0;
  border-radius:0;background:rgba(248,244,233,.55);cursor:pointer;
  background-clip:content-box;transition:background .18s ease;
}
.lc-dot.on{background:var(--paper);background-clip:content-box}
.lc-dot:focus-visible{outline:2px solid var(--paper);outline-offset:2px}

.lc-body{display:flex;flex-direction:column;padding:22px 24px 26px;flex:1}
.lc-tag{
  font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ox);align-self:flex-start;
}
.lc-tag[data-s="sale"],.lc-tag[data-s="both"]{
  color:var(--ink);border-bottom:1px solid var(--line-2);padding-bottom:3px;
}
.lc-name{
  font-family:var(--display);font-weight:500;font-size:21px;line-height:1.24;
  letter-spacing:-.012em;color:var(--ink);margin:10px 0 0;
}
.lc-link{text-decoration:none;color:inherit}
/* Stretches the property-name link across the whole card, so the card is one
   big target without wrapping interactive content in an anchor. */
.lc-link::after{content:"";position:absolute;inset:0;z-index:1}
.lc-link:focus-visible{outline:2px solid var(--ox);outline-offset:3px}
.lc-where{
  font-family:var(--sans);font-size:14px;color:var(--ink-45);margin-top:4px;
  line-height:1.45;min-height:1.45em;  /* holds the slot when there is no city */
}
.lc-spec{
  font-family:var(--sans);font-size:14px;color:var(--ink-70);
  margin-top:auto;padding-top:16px;border-top:1px solid var(--line);
  min-height:calc(16px + 1.5em + 2.9em + 7px + 1.4em);  /* kind + figs + name */
}
/* Size and rate are what both personas scan for, and they were the smallest,
   faintest text on the card. Tabular figures are what let the eye run down a
   column of ranges. */
.lc-figs{
  font-family:var(--sans);font-size:16px;color:var(--ink);
  font-variant-numeric:tabular-nums;display:block;
  min-height:2.9em;   /* two lines reserved, so every spec block is one height */
}
.lc-kind{
  font-family:var(--sans);font-size:12.5px;color:var(--ink-45);display:block;
  margin-bottom:3px;
}
.lc-none{
  font-family:var(--sans);font-size:16px;color:var(--ink-45);
  margin-top:28px;text-align:center;
}
.lf-reset{
  background:none;border:0;border-bottom:1px solid var(--ox);color:var(--ox);
  font:inherit;cursor:pointer;padding:0;
}
.lc-empty{
  border-top:1px solid var(--ink);border-bottom:1px solid var(--line);
  padding:56px 0 64px;max-width:60ch;
}

/* ---------- detail ---------- */
.ld-crumb{
  font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-45);
}
.ld-crumb a{text-decoration:none;color:inherit}
.ld-crumb a:hover{color:var(--ox)}

.ld-wrap{position:relative}
.ld-gal{
  position:relative;border:1px solid var(--line);background:var(--paper-3);
  overflow:hidden;touch-action:pan-y;
}
.ld-track{display:flex;transition:transform .48s cubic-bezier(.22,.61,.24,1)}
.ld-slide{flex:0 0 100%;min-width:0}
/* A 3:2 frame at full container width is over 800px tall on a desktop, which
   pushes every fact below the fold. Cap the height and let it letterbox. */
.ld-slide img{
  width:100%;height:auto;aspect-ratio:3/2;max-height:600px;object-fit:cover;
  display:block;cursor:zoom-in;
}
.ld-slide img:focus-visible{outline:3px solid var(--ox);outline-offset:-3px}
.ld-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:44px;height:44px;padding:0;cursor:pointer;border-radius:0;
  background:rgba(248,244,233,.9);border:1px solid var(--line-2);
  transition:background .18s ease;
}
.ld-arrow::before{
  content:"";position:absolute;top:50%;left:50%;width:10px;height:10px;
  border-top:1.5px solid var(--ink);border-right:1.5px solid var(--ink);
}
.ld-prev{left:14px}
.ld-prev::before{transform:translate(-30%,-50%) rotate(-135deg)}
.ld-next{right:14px}
.ld-next::before{transform:translate(-70%,-50%) rotate(45deg)}
.ld-arrow:hover{background:var(--paper)}
.ld-arrow:focus-visible{outline:2px solid var(--ox);outline-offset:2px}
.ld-count{
  position:absolute;right:14px;bottom:14px;z-index:2;margin:0;
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;
  background:rgba(248,244,233,.9);border:1px solid var(--line-2);
  padding:5px 10px;color:var(--ink-70);
}
.visually-hidden{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.ld-thumbs{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.ld-thumbs:empty{display:none}
.ld-thumb{
  width:104px;padding:0;border:1px solid var(--line);background:none;
  cursor:pointer;line-height:0;transition:border-color .16s ease,opacity .16s ease;
  opacity:.72;border-radius:0;
}
.ld-thumb:hover{opacity:1}
.ld-thumb.on{border-color:var(--ox);opacity:1}
.ld-thumb:focus-visible{outline:2px solid var(--ox);outline-offset:2px}
.ld-thumb img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.ld-facts{border-top:1px solid var(--ink)}
.ld-facts .pf-row{padding:13px 0;border-bottom:1px solid var(--line)}
.ld-facts .pf-row .n{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-45);
}
.ld-facts .pf-row .d{
  font-family:var(--sans);font-size:16px;color:var(--ink);text-align:right;
}
.ld-hl{list-style:none;margin-top:24px;padding:0;border-top:1px solid var(--line)}
.ld-hl li{
  padding:11px 0 11px 22px;border-bottom:1px solid var(--line);
  color:var(--ink-70);position:relative;
}
.ld-hl li::before{
  /* Sits on the optical centre of the first line: 11px padding plus half a
     ~27px line box. Anything smaller reads as a superscript. */
  content:"";position:absolute;left:0;top:24px;
  width:9px;height:1px;background:var(--ox);
}

/* ---------- lightbox ---------- */
/* Above the incumbent .frame-t / .frame-l, which are z-index 120 and were
   painting a green band across the top of the overlay. */
.lb{
  position:fixed;inset:0;z-index:130;display:flex;align-items:center;
  justify-content:center;gap:12px;padding:56px 20px;
  background:rgba(20,22,19,.985);
}
.lb[hidden]{display:none}
.lb-stage{margin:0;max-width:min(1400px,100%);display:flex;
  flex-direction:column;align-items:center;gap:12px}
.lb-stage img{
  max-width:100%;max-height:calc(100vh - 140px);width:auto;height:auto;
  object-fit:contain;border:1px solid rgba(248,244,233,.16);
}
.lb-cap{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.2em;
  color:#B9B9AE;
}
.lb-x{
  position:absolute;top:16px;right:18px;width:40px;height:40px;padding:0;
  font-size:26px;line-height:1;cursor:pointer;border-radius:0;
  background:transparent;border:1px solid rgba(248,244,233,.3);color:#F3F1EA;
}
.lb-x:hover{background:rgba(248,244,233,.12)}
.lb-nav{
  width:46px;height:46px;flex:0 0 auto;padding:0;cursor:pointer;border-radius:0;
  background:transparent;border:1px solid rgba(248,244,233,.3);position:relative;
}
.lb-nav[hidden]{display:none}
.lb-nav::before{
  content:"";position:absolute;top:50%;left:50%;width:11px;height:11px;
  border-top:1.5px solid #F3F1EA;border-right:1.5px solid #F3F1EA;
}
.lb-prev::before{transform:translate(-30%,-50%) rotate(-135deg)}
.lb-next::before{transform:translate(-70%,-50%) rotate(45deg)}
.lb-nav:hover{background:rgba(248,244,233,.12)}
.lb button:focus-visible{outline:2px solid #F3F1EA;outline-offset:2px}

/* ---------- enquiry form ---------- */
.ld-form{display:flex;flex-direction:column;gap:14px}
.ld-form label{
  display:flex;flex-direction:column;gap:6px;
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-45);
}
.ld-form input,.ld-form textarea{
  font-family:var(--sans);font-size:16px;color:var(--ink);letter-spacing:normal;
  text-transform:none;background:var(--card);border:1px solid var(--line-2);
  padding:11px 13px;border-radius:0;width:100%;
}
.ld-form input:focus,.ld-form textarea:focus{
  outline:0;border-color:var(--ox);box-shadow:inset 0 -2px 0 var(--ox);
}
.ld-form textarea{resize:vertical;min-height:96px}
.ld-f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ld-form .btn{align-self:flex-start;margin-top:4px}
.ld-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.ld-msg{
  font-family:var(--sans);font-size:15px;color:var(--ink-45);min-height:1em;
  text-transform:none;letter-spacing:normal;
}
.ld-msg.bad{color:#8C2F1E}
.ld-msg.good{color:var(--ox);font-size:17px}

/* ---------- responsive ---------- */
@media (max-width:1000px){
  .lc-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:680px){
  .lc-grid{grid-template-columns:1fr}
  .lf{align-items:flex-start}
  .ld-f2{grid-template-columns:1fr}
  .ld-facts .pf-row{flex-direction:column;align-items:flex-start;gap:3px}
  .ld-facts .pf-row .d{text-align:left}
  /* Touch has no hover, so the card arrows would never appear. */
  .lc-arrow{opacity:1;width:28px;height:28px}
  .ld-arrow{width:36px;height:36px}
  .lb{padding:56px 6px;gap:2px}
  .lb-nav{width:44px;height:44px}
}
@media (hover:none){
  .lc-arrow{opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .lc-track,.ld-track,.lc,.lf-chip,.ld-thumb,.lc-arrow,.ld-arrow{transition:none}
}

/* ---------- availabilities table ---------- */
.sp-h{
  margin:16px 0 0;font-family:var(--display);font-weight:500;
  font-size:clamp(22px,2.4vw,26px);line-height:1.3;letter-spacing:-.02em;
}
.sp-wrap{margin-top:22px}
.sp{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:16px}
.sp caption{text-align:left}
.sp th{
  text-align:left;font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-45);padding:0 16px 11px 0;
  border-bottom:1px solid var(--ink);white-space:nowrap;
}
.sp td{
  padding:15px 16px 15px 0;border-bottom:1px solid var(--line);
  color:var(--ink-70);vertical-align:baseline;
}
.sp tbody tr:hover{background:var(--paper-2)}
.sp th:last-child,.sp td:last-child{padding-right:0}
.sp-n{font-family:var(--display);font-size:18px;color:var(--ink);font-weight:500}

/* A five-column table cannot survive a phone. Below the breakpoint each row
   becomes its own small block, with the column name carried down from
   data-l so nothing loses its meaning. This is why the table never needs to
   scroll sideways. */
@media (max-width:680px){
  .sp thead{
    position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  }
  .sp,.sp tbody,.sp tr,.sp td{display:block;width:100%}
  .sp tr{
    border-bottom:1px solid var(--line);padding:14px 0;
  }
  .sp tr:first-child{border-top:1px solid var(--ink)}
  .sp td{
    border:0;padding:3px 0;display:flex;justify-content:space-between;gap:18px;
  }
  .sp td::before{
    content:attr(data-l);font-size:11px;font-weight:600;letter-spacing:.16em;
    text-transform:uppercase;color:var(--ink-45);flex:0 0 auto;
  }
  .sp td:first-child{padding-bottom:8px}
  .sp td:first-child::before{align-self:center}
}

/* ---------- broker block ---------- */
.bk{display:flex;gap:18px;align-items:flex-start;margin-top:26px;
  padding-top:24px;border-top:1px solid var(--line-2)}
.bk-face{
  width:78px;height:78px;flex:0 0 auto;object-fit:cover;
  border:1px solid var(--line-2);filter:grayscale(1);
}
.bk-txt{min-width:0}
.bk-name{
  font-family:var(--display);font-weight:500;font-size:20px;color:var(--ink);
  margin-top:6px;line-height:1.2;
}
.bk-title{font-family:var(--sans);font-size:14px;color:var(--ink-45);margin-top:2px}
.bk-lines{display:flex;flex-direction:column;gap:3px;margin-top:9px;font-size:15px}
.bk-lines a{color:var(--ox);text-decoration:none;border-bottom:1px solid transparent}
.bk-lines a:hover{border-bottom-color:var(--ox)}
.bk-mail{word-break:break-word}
.bk-dre{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-45);margin-top:4px;
}
@media (max-width:520px){
  .bk{flex-direction:column;gap:12px}
}

/* The lede caps at 60ch; the body copy did not, and ran to about 95 characters
   a line on a wide screen. */
.ld-wrap-prose .prose p{max-width:66ch}
.ld-wrap-prose .prose{min-width:0}
.lc-who{
  font-family:var(--sans);font-size:12.5px;color:var(--ink-45);display:block;
  margin-top:7px;line-height:1.4;min-height:1.4em;
}
.ld-back{
  font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink-45);border-top:1px solid var(--line);
  padding-top:18px;
}
.ld-back a{text-decoration:none;color:inherit}
.ld-back a:hover{color:var(--ox)}
.ld-form [aria-invalid=true]{border-color:#8C2F1E;box-shadow:inset 0 -2px 0 #8C2F1E}

/* ---------- board controls ---------- */
.lf-right{display:flex;gap:26px;align-items:flex-end;flex-wrap:wrap}
.lf-field{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.lf-field select,.lf-size input{
  font-family:var(--sans);font-size:15px;color:var(--ink);background:transparent;
  border:0;border-bottom:1px solid var(--line-2);padding:4px 0;border-radius:0;
}
.lf-field select{
  padding-right:22px;cursor:pointer;min-width:150px;appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-45) 50%),
                   linear-gradient(135deg,var(--ink-45) 50%,transparent 50%);
  background-position:calc(100% - 10px) 55%,calc(100% - 5px) 55%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;
}
.lf-size{display:flex;align-items:center;gap:8px;color:var(--ink-45)}
.lf-size input{width:74px;font-variant-numeric:tabular-nums}
.lf-size input::placeholder{color:var(--ink-45);opacity:.7}
.lf-field select:focus-visible,.lf-size input:focus-visible{
  outline:2px solid var(--ox);outline-offset:3px}

.lc-none{
  font-family:var(--sans);font-size:16px;color:var(--ink-70);
  margin-top:34px;padding-top:26px;border-top:1px solid var(--line);
  max-width:56ch;text-align:left;
}
.lc-none-do{display:flex;align-items:center;gap:22px;margin-top:16px;flex-wrap:wrap}

/* ---------- monthly estimate ---------- */
.ld-est{
  margin-top:18px;padding-top:16px;border-top:1px solid var(--line);
  font-size:15px;color:var(--ink-45);max-width:46ch;
}
.ld-est strong{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}

/* ---------- facts as a description list ---------- */
.ld-facts{margin:0}
.ld-facts .pf-row dt,.ld-facts .pf-row dd{margin:0}
.ld-map{
  font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ox);text-decoration:none;
  border-bottom:1px solid var(--brass-lt);white-space:nowrap;
}
.ld-map:hover{border-bottom-color:var(--ox)}

/* ---------- previous / next listing ---------- */
.ld-nbs{
  display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;
  border-top:1px solid var(--line);padding-top:22px;
}
.ld-nb{text-decoration:none;color:inherit;display:block;min-width:0}
.ld-nb.next{text-align:right}
.ld-nb-l{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-45);display:block;
}
.ld-nb-n{
  font-family:var(--display);font-size:18px;line-height:1.25;color:var(--ink);
  display:block;margin-top:4px;
}
.ld-nb:hover .ld-nb-n{color:var(--ox)}
.ld-nb-all{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-45);text-decoration:none;
  white-space:nowrap;
}
.ld-nb-all:hover{color:var(--ox)}
@media (max-width:680px){
  .ld-nbs{grid-template-columns:1fr;gap:16px}
  .ld-nb.next{text-align:left}
  .ld-nb-x{display:none}
  .lf-right{gap:18px;width:100%}
}

/* ---------- print ----------
   A broker forwards a flyer, not a URL. Without this the printed page carried
   the nav, the filter bar, the enquiry form and a black footer, and lost the
   photos beyond the first. This turns a listing into a one-page leave-behind
   with the address, the numbers, the suites and who to call. */
@media print{
  .frame-t,.frame-l,.skip,.top-nav,.nav-toggle,.lf,.lf-right,.lc-arrow,
  .lc-dots,.ld-arrow,.ld-count,.ld-thumbs,.ld-form,.ld-nbs,.lc-none,
  .eo-close,.lb,footer.site .cols,.ld-map{display:none!important}
  @page{margin:14mm}
  html,body{background:#fff!important;color:#000;font-size:11pt}
  body.framed{padding:0}
  .wrap{max-width:none;padding:0}
  .lockup{border-bottom:1.5pt solid #000;padding-bottom:6pt;margin-bottom:10pt}
  .lockup .est{color:#000}
  section{padding:0!important;margin-bottom:10pt;break-inside:avoid}
  h1{font-size:22pt;margin-bottom:2pt}
  .eo-datum,.lc-tag{color:#000}
  .ld-gal{border:0.5pt solid #999}
  /* Only the cover photo prints; the rest are off-screen slides. */
  .ld-track{display:block}
  .ld-slide{display:none}
  .ld-slide:first-child{display:block}
  .ld-slide img{max-height:88mm;object-fit:cover}
  .ld-facts .pf-row{padding:3pt 0;border-bottom:0.5pt solid #bbb}
  .ld-facts .pf-row .d{color:#000}
  .sp{font-size:10pt}
  .sp th{border-bottom:1pt solid #000;color:#000}
  .sp td{border-bottom:0.5pt solid #bbb;padding:5pt 10pt 5pt 0}
  .sp tbody tr{break-inside:avoid}
  .bk{border-top:1pt solid #000;page-break-inside:avoid}
  .bk-face{filter:none}
  .bk-lines a{color:#000;text-decoration:none}
  .eo-band{background:none!important;border:0}
  /* The board prints as a schedule: photos are noise on paper. */
  .lc-grid{display:block;border:0}
  .lc{border:0;border-bottom:0.5pt solid #bbb;break-inside:avoid;
      display:grid;grid-template-columns:1fr auto;padding:6pt 0}
  .lc-media{display:none}
  .lc-spec{border-top:0;padding-top:0;min-height:0;text-align:right}
  .lc-figs,.lc-where,.lc-who{min-height:0}
  .lc-name{font-size:13pt}
  footer.site{background:none!important;color:#000;border-top:1pt solid #000}
  footer.site .legal{color:#000}
  a[href^="tel:"]{color:#000;text-decoration:none}
  /* Print the URL after a link, so a paper copy can be typed back in. */
  .ld-nb-all[href]::after{content:""}
}

/* A listing with nothing to say on the right collapses to one column instead
   of holding open an empty half-page. */
.eo-two.ld-thin{grid-template-columns:minmax(0,1fr);gap:24px;max-width:640px}
.eo-two.ld-thin .prose p{color:var(--ink-45)}

/* A property with no photography reads the same on the listing page as it does
   on the board, rather than silently dropping the section. */
.ld-gal-empty{position:relative}
.ld-gal-empty .lc-nophoto{aspect-ratio:3/1}
.ld-noph{
  position:absolute;inset:auto 0 0 0;padding:18px 22px;
  background:linear-gradient(to top,rgba(248,244,233,.96),rgba(248,244,233,.72));
  font-family:var(--sans);font-size:15px;color:var(--ink-70);max-width:56ch;
}

/* ---------- maps ---------- */
.lm-bar{display:flex;align-items:center;gap:14px;margin-top:18px;flex-wrap:wrap}
.lm-btn{
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink);background:transparent;
  border:1px solid var(--line-2);padding:9px 16px;cursor:pointer;border-radius:0;
  transition:border-color .16s ease,background .16s ease;
}
.lm-btn:hover{border-color:var(--ink-45);background:var(--card)}
.lm-btn[aria-expanded=true]{border-color:var(--ox);color:var(--ox)}
.lm-btn:focus-visible{outline:2px solid var(--ox);outline-offset:2px}
.lm-hint{font-family:var(--sans);font-size:14px;color:var(--ink-45)}
.lm{height:420px;margin-top:16px;border:1px solid var(--line);background:var(--paper-2)}
.lm[hidden]{display:none}
.lm .leaflet-container{font-family:var(--sans)}
.lm-fail{padding:24px;color:var(--ink-45);font-size:15px}

.ld-mapimg{display:block;position:relative;border:1px solid var(--line);line-height:0}
.ld-mapimg img{width:100%;height:auto;display:block}
.ld-mapimg-l{
  position:absolute;right:12px;bottom:12px;line-height:1;
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ink);background:rgba(248,244,233,.94);
  border:1px solid var(--line-2);padding:7px 11px;
}
.ld-mapimg:hover .ld-mapimg-l{background:var(--paper)}
.ld-mapimg:focus-visible{outline:2px solid var(--ox);outline-offset:3px}
@media print{ .lm-bar,.lm{display:none!important} .ld-mapimg-l{display:none} }