.record-dialog {
  position: fixed;
  inset: 0 0 0 auto;
  width: min(590px, 100%);
  max-width: none;
  height: 100svh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-left: 1px solid rgba(242, 238, 231, 0.2);
  border-radius: 0;
  background: #10100f;
  color: #f2eee7;
  box-shadow: -24px 0 70px rgba(0, 0, 0, 0.44);
  opacity: 0;
  transform: translateX(36px);
  transition: opacity 220ms cubic-bezier(0.23, 1, 0.32, 1), transform 220ms cubic-bezier(0.23, 1, 0.32, 1), overlay 220ms allow-discrete, display 220ms allow-discrete;
}

.record-dialog[open] { opacity: 1; transform: translateX(0); }
.record-dialog::backdrop { background: rgba(8, 7, 6, 0.78); backdrop-filter: blur(6px); }

@starting-style {
  .record-dialog[open] { opacity: 0; transform: translateX(36px); }
}

.record-dialog__frame { height: 100%; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.record-dialog__head {
  min-height: 76px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 14px 18px 14px 24px;
  border-bottom: 1px solid rgba(242, 238, 231, 0.14);
  background: rgba(22, 20, 18, 0.96);
}
.record-dialog__meta { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 7px 14px; color: #a19b94; font-size: 9px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.record-dialog__meta time { color: #d3cec7; }
.record-dialog__close {
  min-width: 68px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid rgba(242, 238, 231, 0.25);
  border-radius: 0;
  background: rgba(242, 238, 231, 0.04);
  color: #f2eee7;
  cursor: pointer;
  font-size: 9px;
  font-weight: 760;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.record-dialog__body { min-height: 0; overflow: auto; overscroll-behavior: contain; padding: clamp(30px, 5vw, 54px) clamp(22px, 5vw, 48px); scrollbar-color: #c89468 #10100f; }
.record-dialog__footer { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(242, 238, 231, 0.17); background: #171614; }
.record-dialog__footer[hidden] { display: none; }
.record-dialog__footer button { min-height: 60px; border: 0; border-right: 1px solid rgba(242, 238, 231, 0.16); border-radius: 0; background: transparent; color: #f2eee7; cursor: pointer; font-size: 10px; font-weight: 750; }
.record-dialog__footer button:last-child { border-right: 0; }

.deal-title-block > p { margin: 0 0 11px; color: #ddbc97; font-size: 9px; font-weight: 760; letter-spacing: 0.09em; text-transform: uppercase; }
/* Was clamp(2.55rem, 5.8vw, 4.85rem): a three word name ran to three lines
   at a size nothing else on the page uses. */
.deal-title-block h2 { margin: 0; color: #f2eee7; font: 400 clamp(1.7rem, 2.6vw, 2.5rem)/1.04 var(--serif, Georgia, serif); letter-spacing: -0.035em; text-wrap: balance; overflow-wrap: anywhere; }
.deal-title-block address { margin-top: 16px; color: #aaa49d; font-size: 13px; font-style: normal; line-height: 1.5; }
.deal-photo { margin: 30px 0 0; }
.deal-photo img { display: block; width: 100%; aspect-ratio: 16 / 9; background: #1b1916; object-fit: cover; }
.deal-photo figcaption { display: flex; justify-content: flex-end; margin-top: 9px; }
.deal-photo figcaption a { color: #99938c; font-size: 9px; font-weight: 680; letter-spacing: 0.055em; line-height: 1.4; text-align: right; text-transform: uppercase; }
.deal-photo figcaption span { margin-left: 4px; color: #ddbc97; }
.deal-price { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-top: 30px; padding: 22px 0; border-top: 1px solid rgba(242, 238, 231, 0.18); border-bottom: 1px solid rgba(242, 238, 231, 0.18); }
.deal-price strong { font: 400 clamp(2.35rem, 6vw, 4.2rem)/0.9 var(--serif, Georgia, serif); letter-spacing: -0.055em; }
.deal-price span { max-width: 180px; color: #a19b94; font-size: 11px; line-height: 1.35; text-align: right; }
.deal-summary { margin: 25px 0 0; color: #c9c3bc; font: 400 20px/1.38 var(--serif, Georgia, serif); }
.deal-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 32px; background: rgba(242, 238, 231, 0.14); }
.deal-field { min-width: 0; padding: 17px; background: #10100f; }
.deal-field dt, .deal-field dd { margin: 0; }
.deal-field dt, .record-links h3, .parcel-ledger__head span { color: #969089; font-size: 9px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.deal-field dd { margin-top: 8px; color: #f2eee7; font-size: 13px; font-weight: 620; line-height: 1.4; overflow-wrap: anywhere; }

.parcel-ledger { margin-top: 36px; }
.parcel-ledger__head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.parcel-ledger__head h3 { margin: 0; color: #f2eee7; font: 400 27px/1 var(--serif, Georgia, serif); }
.parcel-ledger__head span { max-width: 180px; text-align: right; }
.parcel-ledger__rows { border-top: 1px solid rgba(242, 238, 231, 0.17); }
.parcel-ledger article { min-height: 72px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 12px; border-bottom: 1px solid rgba(242, 238, 231, 0.13); }
.parcel-ledger article > span { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(221, 188, 151, 0.45); color: #ddbc97; font-size: 8px; }
.parcel-ledger article div { min-width: 0; }
.parcel-ledger article strong, .parcel-ledger article small { display: block; }
.parcel-ledger article strong { overflow: hidden; font: 400 16px/1.2 var(--serif, Georgia, serif); text-overflow: ellipsis; white-space: nowrap; }
.parcel-ledger article small { margin-top: 5px; color: #969089; font-size: 9px; }
.parcel-ledger article > b { color: #f2eee7; font-size: 11px; }

.record-links { margin-top: 24px; }
.record-links h3 { margin: 0 0 10px; }
.record-pills { display: flex; flex-wrap: wrap; gap: 7px; }
.record-link { min-height: 34px; display: inline-flex; align-items: center; gap: 6px; padding: 0 11px; border: 1px solid rgba(242, 238, 231, 0.22); border-radius: 999px; color: #f2eee7; font: 600 11px/1 var(--sans, Arial, sans-serif); letter-spacing: 0.02em; white-space: nowrap; transition: color 160ms ease-out, background-color 160ms ease-out, border-color 160ms ease-out, transform 120ms ease-out; }
.record-link span { color: #ddbc97; font-size: 10px; }
.record-link:active { transform: scale(0.97); }

.record-chooser__kicker { margin: 0 0 10px; color: #ddbc97; font-size: 9px; font-weight: 760; letter-spacing: 0.09em; text-transform: uppercase; }
.record-chooser h2 { margin: 0; color: #f2eee7; font: 400 clamp(2.6rem, 6vw, 4.8rem)/0.92 var(--serif, Georgia, serif); letter-spacing: -0.06em; }
.record-chooser__copy { margin: 16px 0 28px; color: #aaa49d; font-size: 12px; }
.record-chooser__list { border-top: 1px solid rgba(242, 238, 231, 0.16); }
.record-chooser__list button { width: 100%; min-height: 84px; display: grid; grid-template-columns: minmax(0, 1fr) auto 18px; align-items: center; gap: 14px; padding: 13px 4px; border: 0; border-bottom: 1px solid rgba(242, 238, 231, 0.13); border-radius: 0; background: transparent; color: #f2eee7; cursor: pointer; text-align: left; }
.record-chooser__list button span { min-width: 0; }
.record-chooser__list button span:nth-child(2) { text-align: right; }
.record-chooser__list small, .record-chooser__list strong, .record-chooser__list b { display: block; }
.record-chooser__list small { color: #969089; font-size: 8px; font-weight: 680; letter-spacing: 0.06em; text-transform: uppercase; }
.record-chooser__list strong { margin-top: 5px; overflow: hidden; font: 400 18px/1.15 var(--serif, Georgia, serif); text-overflow: ellipsis; white-space: nowrap; }
.record-chooser__list b { font-size: 11px; }
.record-chooser__list span:nth-child(2) small { margin-top: 5px; color: #ddbc97; }
.record-chooser__list i { color: #ddbc97; font-style: normal; }

.record-dialog button:focus-visible, .record-dialog a:focus-visible { outline: 2px solid #ddbc97; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
  .record-dialog__close:hover, .record-dialog__footer button:hover { background: #ddbc97; color: #1e1913; }
  .record-link:hover { border-color: #ddbc97; background: rgba(221, 188, 151, 0.12); color: #ddbc97; }
  .record-chooser__list button:hover { background: rgba(221, 188, 151, 0.08); }
}
@media (max-width: 580px) {
  .record-dialog { width: 100%; border-left: 0; }
  .record-dialog__head { min-height: 68px; padding: 10px 12px 10px 17px; }
  .record-dialog__close { min-width: 62px; min-height: 42px; }
  .record-dialog__body { padding: 28px 18px; }
  .deal-title-block h2 { font-size: clamp(1.6rem, 6.6vw, 2.1rem); }
  /* Kept at two columns: the reference lays these facts out as paired cards, and
     one column per fact turned a compact block into a long scroll. */
  .deal-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .parcel-ledger__head { align-items: start; flex-direction: column; }
  .parcel-ledger__head span { max-width: none; text-align: left; }
  .parcel-ledger article { grid-template-columns: 28px minmax(0, 1fr); }
  .parcel-ledger article > b { grid-column: 2; margin: -8px 0 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .record-dialog, .record-dialog button, .record-dialog a { transition-duration: 0.01ms; }
}

/* Never leave one card beside an empty cell. */
.deal-fields .deal-field:last-child:nth-child(odd) { grid-column: 1 / -1; }

/* The closing date belongs with the price, not at the bottom of the grid. */
.deal-closed {
  display: block;
  margin-top: 8px;
  color: var(--text-dim, #a49c92);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.deal-closed { white-space: nowrap; }

/* align-items:end sat the date on the price's box bottom, which the serif's
   descender space pushes below its baseline, so the two read as misaligned.
   Baseline alignment lines the words up on the line they are actually on. */
.deal-price { align-items: baseline; }
.deal-price .deal-closed { margin-top: 0; }
