:root{
  --bg:#f4f3ec;--card:#fff;--ink:#1f3128;--muted:#6a7468;--line:#dfe2d6;--green:#2f4a3a;--green2:#3f6650;
  --soft:#e9eee2;--amber:#8a5a1c;--amber-bg:#fbf0d8;--red:#9b3b2e;--red-bg:#f8e4df;--blue:#2f5d7c;--blue-bg:#e3eef5;
  --r:12px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid #c69648;outline-offset:2px}
[hidden]{display:none!important}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}

.hero{background:linear-gradient(135deg,#2f4a3a,#3e5f4b);color:#fff;padding:26px 0 30px;border-bottom:5px solid #b8c7a3}
.topline{display:flex;justify-content:space-between;gap:12px;font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:#d3dfc8}
.brand{font-weight:700}
h1{font-size:clamp(28px,4vw,46px);line-height:1.1;letter-spacing:-.03em;margin:22px 0 10px;font-weight:700}
.lead{max-width:820px;color:#e2e9db;margin:0 0 20px}
.stats{display:flex;flex-wrap:wrap;gap:10px}
.stat{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:8px 14px;font-size:13px}
.stat b{font-size:18px;display:block;line-height:1.2}

main{padding-top:22px;padding-bottom:60px}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.tabs button{border:1px solid #cbd4c1;background:#fff;border-radius:10px;padding:11px 18px;font-weight:700;font-size:15px;display:flex;gap:10px;align-items:center}
.tabs button[aria-selected=true]{background:var(--green);border-color:var(--green);color:#fff}
.tabs .count{font-size:12px;font-weight:600;background:var(--soft);color:#46603f;border-radius:99px;padding:1px 9px}
.tabs button[aria-selected=true] .count{background:#4f7360;color:#fff}

.toolbar{display:grid;grid-template-columns:1fr 210px 160px 200px;gap:10px}
.ctl span{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.ctl input,.ctl select{width:100%;height:42px;border:1px solid #cdd4c3;border-radius:9px;background:#fff;padding:0 12px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;align-items:center}
.chip{height:34px;border-radius:99px;border:1px solid #cdd4c3;background:#fff;padding:0 13px;font-size:13px}
.chip[aria-pressed=true]{background:var(--soft);border-color:#9fb38d;color:#2c4a2c;font-weight:600}
.price-range{font-size:13px;color:var(--muted)}
.price-range input{width:100px;height:34px;border:1px solid #cdd4c3;border-radius:8px;padding:0 8px;background:#fff}
.resultline{color:var(--muted);font-size:13px;margin:14px 0 10px}

.list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.house{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:box-shadow .15s}
.house:hover{box-shadow:0 4px 18px rgba(30,50,30,.07)}
.house.gone{opacity:.62}
.house.seen .row{background:#fafbf7}
.row{display:grid;grid-template-columns:200px 1fr 250px;gap:18px;padding:14px;align-items:start}
.side{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;align-content:start}
.side .c-check{grid-column:1/-1}
.thumb{position:relative;width:200px;aspect-ratio:4/3;border-radius:9px;overflow:hidden;background:#e7eadf;border:0;padding:0}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb .n{position:absolute;left:6px;top:6px;background:rgba(20,35,25,.78);color:#fff;font-size:11px;font-weight:700;border-radius:6px;padding:1px 7px}
.thumb .pc{position:absolute;right:6px;bottom:6px;background:rgba(20,35,25,.78);color:#fff;font-size:11px;border-radius:6px;padding:1px 7px}
.thumb.nophoto{display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px}
.title{font-size:17px;font-weight:700;text-decoration:none;line-height:1.3;display:inline-block}
a.title:hover{text-decoration:underline;text-underline-offset:3px}
.title .ext{font-size:12px;color:var(--muted);font-weight:500}
.addr{color:var(--muted);font-size:13px;margin-top:2px}
.meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tag{font-size:11px;border-radius:6px;padding:2px 7px;background:var(--soft);color:#3d5a3d;font-weight:600}
.tag.agency{background:var(--blue-bg);color:var(--blue)}
.tag.src{background:#f0eee6;color:#6b6450}
.tag.new{background:#e1f0dc;color:#2f6a2a}
.util-mini{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:8px;font-size:12px;color:#55604f}
.util-mini span b{font-weight:600;color:var(--ink)}
.col-label{font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:2px}
.price{font-size:20px;font-weight:800;white-space:nowrap}
.sub{font-size:12px;color:var(--muted)}
.fee{font-size:11px;color:var(--amber);margin-top:3px}
.dist{font-size:15px;font-weight:700}
.badge{display:inline-block;font-size:11px;font-weight:700;border-radius:6px;padding:3px 8px;line-height:1.35;background:var(--soft);color:#33582f}
.badge.caution{background:var(--amber-bg);color:var(--amber)}
.badge.reserve{background:#efeae0;color:#6d5b3e}
.badge.gone{background:var(--red-bg);color:var(--red)}
.actions{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.btn{border:1px solid #c8d1bd;background:#fff;border-radius:8px;padding:6px 11px;font-size:13px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:5px}
.btn.primary{background:var(--green);color:#fff;border-color:var(--green)}
.btn.icon{padding:6px 9px}
.btn[aria-pressed=true].star{background:#fff6dc;border-color:#e3c46d;color:#8a6510}
.btn[aria-pressed=true].eye{background:var(--soft)}

.details{border-top:1px solid var(--line);background:#fbfbf7}
.dtabs{display:flex;gap:4px;padding:10px 14px 0;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.dtabs button{border:0;background:transparent;padding:9px 13px;border-radius:8px 8px 0 0;font-weight:600;font-size:14px;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px}
.dtabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--green);background:#fff}
.dpanel{padding:16px 18px 20px;background:#fff}
.grid2{display:grid;grid-template-columns:1.4fr 1fr;gap:22px}
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.fact{background:#f6f7f1;border:1px solid #e6e9de;border-radius:9px;padding:8px 11px}
.fact .k{font-size:11px;color:var(--muted)}
.fact .v{font-weight:650;font-size:14px}
.note{margin:14px 0 0;padding:12px 14px;background:var(--amber-bg);border-radius:9px;font-size:14px;color:#5d4316}
.note b{color:#4a3510}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:6px}
.gallery button{padding:0;border:0;border-radius:7px;overflow:hidden;aspect-ratio:4/3;background:#eee}
.gallery img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s}
.gallery button:hover img{transform:scale(1.04)}
.more-photos{margin-top:8px}
.contact-card{border:1px solid var(--line);border-radius:11px;padding:14px;display:flex;gap:12px;align-items:flex-start;background:#fafbf6}
.contact-card img{width:56px;height:56px;border-radius:50%;object-fit:cover;background:#ddd;flex:none}
.contact-card h4{margin:0 0 2px;font-size:16px}
.contact-card .ag{color:var(--blue);font-weight:600;font-size:14px}
.contact-card .line{font-size:14px;margin-top:4px}
.phones{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.phone{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.phone a.num{font-weight:700;font-size:16px;text-decoration:none}
.mini{font-size:12px;border-radius:6px;padding:3px 8px;text-decoration:none;font-weight:600}
.mini.viber{background:#efe7fb;color:#5b3c99}
.mini.wa{background:#e1f5e6;color:#1e7a3c}
.mini.tel{background:var(--soft);color:#2f4a3a}
.utilgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.util{border:1px solid var(--line);border-radius:11px;padding:12px 14px;display:flex;gap:12px;align-items:flex-start}
.util .ic{font-size:22px;line-height:1;width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:var(--soft);flex:none}
.util .k{font-size:12px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.util .v{font-weight:600}
.util.unknown .v{color:#9a9f94;font-weight:500;font-style:italic}
.util.unknown .ic{filter:grayscale(1);opacity:.6}
.letter{max-width:780px;background:#fffdf7;border:1px solid #ece4cf;border-radius:12px;padding:20px 24px;white-space:pre-line;font-size:15px;line-height:1.65;box-shadow:0 1px 0 #efe7d0}
.letter-h{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap;max-width:780px}
.letter-h h4{margin:0;font-size:15px}
.orig{white-space:pre-line;font-size:13px;color:#555;background:#f6f6f2;border-radius:10px;padding:14px 16px;max-width:780px;margin-top:12px}
.mynote textarea{width:100%;min-height:70px;border:1px solid #cdd4c3;border-radius:9px;padding:10px;font:inherit;font-size:14px;resize:vertical}
.mynote{margin-top:14px}
.mynote label{font-size:12px;color:var(--muted);font-weight:600}
.hint{font-size:12px;color:var(--muted);margin-top:8px}
.links{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}

.notice{margin-top:30px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 18px;font-size:13px;color:#545e51}
.empty{text-align:center;color:var(--muted);padding:40px}

.lightbox{position:fixed;inset:0;background:rgba(10,15,12,.93);z-index:50;display:flex;align-items:center;justify-content:center}
.lightbox img{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:6px}
.lightbox button{position:absolute;background:rgba(255,255,255,.12);border:0;color:#fff;font-size:34px;width:54px;height:54px;border-radius:50%}
.lb-close{top:16px;right:16px;font-size:22px!important}
.lb-prev{left:16px;top:50%;transform:translateY(-50%)}
.lb-next{right:16px;top:50%;transform:translateY(-50%)}
.lb-count{position:absolute;bottom:16px;color:#ddd;font-size:13px}

@media (max-width:980px){
  .row{grid-template-columns:170px 1fr}
  .thumb{width:170px}
  .side{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}
  .toolbar{grid-template-columns:1fr 1fr}
  .toolbar .grow{grid-column:1/-1}
  .grid2{grid-template-columns:1fr}
}
@media (max-width:620px){
  .wrap{padding:0 12px}
  .row{grid-template-columns:1fr;gap:10px}
  .thumb{width:100%;aspect-ratio:16/9}
  .side{grid-template-columns:1fr 1fr}
  .side .c-check{grid-column:1/-1}
  .price-range{margin-left:0}
  .dpanel{padding:14px 12px}
  .letter{padding:16px}
  .dtabs{flex-wrap:nowrap;overflow-x:auto;padding:8px 8px 0}
  .dtabs button{padding:8px 10px;font-size:13px;white-space:nowrap}
  .facts{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:repeat(3,1fr)}
  .stat{padding:6px 10px}
}
