/* Listing Detail — page-specific layout */

.dl-grid { display:grid; grid-template-columns: 1fr 360px; gap: 32px; align-items:start; }
.dl-gallery { background:var(--ds-surf); border-radius:var(--ds-radius); overflow:hidden; box-shadow:var(--ds-shadow); }
.dl-hero { aspect-ratio: 16/9; max-height: 480px; background:#2A2B30; position:relative; display:grid; place-items:center; color:#6B6E75; }
.dl-hero img { width:100%; height:100%; object-fit:cover; display:block; }
.dl-hero .counter { position:absolute; bottom:16px; right:16px; background:rgba(10,12,20,.72); color:#fff; padding:6px 12px; border-radius:99px; font-family:var(--ds-font-mono); font-size:11px; letter-spacing:0.06em; display:inline-flex; align-items:center; gap:8px; backdrop-filter:blur(6px); }
.dl-hero .nav-arrow { position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; background:rgba(255,255,255,.94); border:0; border-radius:50%; display:grid; place-items:center; box-shadow:0 4px 14px rgba(10,12,20,.18); cursor:pointer; }
.dl-hero .nav-arrow.prev { left:16px; } .dl-hero .nav-arrow.next { right:16px; }
.dl-hero-empty { display:flex; flex-direction:column; align-items:center; gap:12px; color:var(--ds-ink-4); }

.dl-thumbs { display:grid; grid-template-columns: repeat(6, 1fr); gap:2px; background:var(--ds-surf); }
.dl-thumb { aspect-ratio: 1/1; background:#222; position:relative; overflow:hidden; cursor:pointer; border:0; padding:0; }
.dl-thumb img { width:100%; height:100%; object-fit:cover; }
.dl-thumb.on::after { content:""; position:absolute; inset:0; box-shadow: inset 0 0 0 3px var(--ds-ink); }
.dl-thumb .more { position:absolute; inset:0; background:rgba(10,12,20,.7); color:#fff; display:grid; place-items:center; font-family:var(--ds-font-display); font-weight:500; font-size:18px; }

.dl-rail { position:sticky; top:26px; display:flex; flex-direction:column; gap:18px; }

.dl-headline h1 { font-family:var(--ds-font-display); font-weight:500; font-size:40px; line-height:1.02; letter-spacing:-0.03em; margin-top:8px; max-width:720px; }
.dl-headline h1 em { font-style:italic; font-weight:400; color:var(--ds-heritage); }
.dl-headline .addr { display:flex; align-items:center; gap:10px; margin-top:14px; color:var(--ds-ink-3); font-size:14px; }
.dl-headline .addr .ds-icon { width:16px; height:16px; color:var(--ds-ink-4); }

.dl-specs { display:grid; grid-template-columns: repeat(4, 1fr); gap:0; border-top:1px solid var(--ds-line-2); }
.dl-spec { padding:18px 22px; border-right:1px solid var(--ds-line-2); }
.dl-spec:last-child { border-right:0; }
.dl-spec .k { font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ds-ink-4); font-weight:600; margin-bottom:8px; }
.dl-spec .v { font-family:var(--ds-font-display); font-size:20px; font-weight:500; letter-spacing:-0.015em; color:var(--ds-ink); }
.dl-spec .v .unit { font-size:11px; color:var(--ds-ink-4); letter-spacing:0.04em; font-weight:500; margin-left:3px; font-family:var(--ds-font-mono); }

.dl-def { display:grid; grid-template-columns: 160px 1fr; row-gap:14px; column-gap:18px; }
.dl-def dt { font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ds-ink-4); font-weight:600; padding-top:3px; }
.dl-def dd { font-size:14px; color:var(--ds-ink-2); margin:0; }

.dl-timeline { display:flex; flex-direction:column; gap:0; position:relative; padding-left:18px; }
.dl-timeline::before { content:""; position:absolute; left:5px; top:8px; bottom:8px; width:1px; background:var(--ds-line); }
.dl-tline-item { position:relative; padding: 0 0 22px; }
.dl-tline-item:last-child { padding-bottom:0; }
.dl-tline-item::before { content:""; position:absolute; left:-18px; top:5px; width:11px; height:11px; border-radius:50%; background:var(--ds-surf); box-shadow: 0 0 0 2px var(--ds-ink); }
.dl-tline-item.dim::before { box-shadow: 0 0 0 2px var(--ds-ink-5); }
.dl-tline-item .when { font-family:var(--ds-font-mono); font-size:10.5px; letter-spacing:0.06em; color:var(--ds-ink-4); text-transform:uppercase; margin-bottom:4px; }
.dl-tline-item .what { font-size:13.5px; color:var(--ds-ink); font-weight:500; }
.dl-tline-item .who { font-size:12px; color:var(--ds-ink-4); margin-top:2px; }

.dl-price-big { font-family:var(--ds-font-display); font-size:36px; font-weight:500; letter-spacing:-0.025em; line-height:1; }
.dl-price-big .cur { font-size:14px; color:var(--ds-ink-4); font-family:var(--ds-font-mono); letter-spacing:0.04em; margin-right:4px; font-weight:500; }
.dl-price-alt { font-family:var(--ds-font-mono); font-size:11px; color:var(--ds-ink-4); letter-spacing:0.06em; text-transform:uppercase; margin-top:8px; }
.dl-price-permeter { font-family:var(--ds-font-mono); font-size:11px; color:var(--ds-ink-4); letter-spacing:0.06em; text-transform:uppercase; margin-top:3px; }

.dl-sync { display:flex; flex-direction:column; gap:10px; }
.dl-sync-row { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--ds-surf-2); border-radius:var(--ds-radius-sm); }
.dl-sync-row .dl-sync-icon { width:28px; height:28px; border-radius:8px; display:grid; place-items:center; font-family:var(--ds-font-display); font-weight:600; font-size:11px; flex-shrink:0; }
.dl-sync-row .dl-sync-icon.myhome { background:#FFF1E6; color:#9A4400; }
.dl-sync-row .dl-sync-icon.ss { background:#E6F0F8; color:#004680; }
:root[data-theme="dark"] .dl-sync-row .dl-sync-icon.myhome { background:rgba(232,119,34,0.16); color:#F3A368; }
:root[data-theme="dark"] .dl-sync-row .dl-sync-icon.ss     { background:rgba(0,113,206,0.18);  color:#6AAEE8; }
.dl-sync-row .dl-sync-title { font-size:12.5px; font-weight:600; color:var(--ds-ink); line-height:1.1; }
.dl-sync-row .dl-sync-meta { font-size:10.5px; color:var(--ds-ink-4); font-family:var(--ds-font-mono); letter-spacing:0.04em; text-transform:uppercase; margin-top:3px; }
.dl-sync-row.off .dl-sync-title { color:var(--ds-ink-3); }
.dl-sync-row .action { margin-left:auto; font-size:11px; color:var(--ds-ink-4); font-weight:600; text-transform:uppercase; letter-spacing:0.08em; text-decoration:none; background:transparent; border:0; cursor:pointer; padding:4px 8px; }
.dl-sync-row.on .action { color:var(--ds-good); }
.dl-sync-row.off .action { color:var(--ds-heritage); }
.dl-sync-row.off .action:hover { text-decoration:underline; }

.dl-coop-item { padding:14px 16px; background:var(--ds-surf-2); border-radius:var(--ds-radius-sm); display:flex; gap:12px; align-items:flex-start; }
.dl-coop-item + .dl-coop-item { margin-top:10px; }
.dl-coop-avatar { width:36px; height:36px; border-radius:50%; background:linear-gradient(135deg,#5B3608,#8B5A1C); color:#fff; display:grid; place-items:center; font-weight:600; font-family:var(--ds-font-display); font-size:13px; flex-shrink:0; }
.dl-coop-body { flex:1; min-width:0; }
.dl-coop-name { font-size:13.5px; font-weight:600; color:var(--ds-ink); }
.dl-coop-agency { font-size:11.5px; color:var(--ds-ink-4); font-family:var(--ds-font-mono); letter-spacing:0.04em; text-transform:uppercase; margin-top:2px; }
.dl-coop-msg { font-size:13px; color:var(--ds-ink-2); margin-top:8px; line-height:1.5; }
.dl-coop-meta { display:flex; align-items:center; gap:10px; margin-top:10px; font-size:11px; color:var(--ds-ink-4); }

.dl-note-readonly { background:var(--ds-surf-2); padding:14px 16px; border-radius:var(--ds-radius-sm); font-size:13px; color:var(--ds-ink-2); line-height:1.55; white-space:pre-wrap; }

.dl-section-title { font-family:var(--ds-font-display); font-size:18px; font-weight:600; letter-spacing:-0.015em; margin-bottom:16px; color:var(--ds-ink); }

@media (max-width: 1100px) {
  .dl-grid { grid-template-columns: 1fr; }
  .dl-rail { position:static; }
  .dl-def { grid-template-columns: 130px 1fr; }
  .dl-headline h1 { font-size:32px; }
}