:root {
  --bg:#0f0f0f; --panel:#1a1a1a; --panel-2:#202020; --text:#f5f5f5; --muted:#a3a3a3;
  --line:#2d2d2d; --accent:#4ade80; --accent-soft:rgba(74,222,128,.14); --shadow:0 24px 60px rgba(0,0,0,.35);
}
* { box-sizing:border-box; }
body {
  margin:0; font-family:"Inter",sans-serif; background:
  radial-gradient(circle at top right, rgba(74,222,128,.16), transparent 28%),
  linear-gradient(180deg, #111 0%, var(--bg) 55%); color:var(--text);
}
a { color:inherit; text-decoration:none; }
.shell { width:min(1200px, calc(100% - 32px)); margin:0 auto; padding:28px 0 56px; }
.hero,.panel,.stat,.card,.change { background:linear-gradient(180deg, rgba(255,255,255,.02), transparent), var(--panel); border:1px solid var(--line); box-shadow:var(--shadow); }
.hero { position:relative; overflow:hidden; border-radius:28px; padding:28px; margin-bottom:18px; display:flex; justify-content:space-between; align-items:flex-start; }
.eyebrow { margin:0 0 8px; color:var(--accent); font-weight:700; text-transform:uppercase; letter-spacing:.12em; font-size:.78rem; }
h1,h2,p { margin:0; }
h1 { font-size:clamp(2rem, 5vw, 3.8rem); line-height:.95; letter-spacing:-.04em; }
h1 span { display:block; color:#d4d4d4; font-size:clamp(1rem, 2vw, 1.4rem); font-weight:500; margin-top:10px; letter-spacing:-.02em; }
.hero-glow { width:180px; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle, rgba(74,222,128,.42), transparent 65%); filter:blur(6px); }
.stats,.grid,.filters { display:grid; gap:14px; }
.stats { grid-template-columns:repeat(4,1fr); margin-bottom:18px; }
.stat,.panel,.card,.change { border-radius:22px; }
.stat { padding:18px; }
.stat-label,.meta,.card small,.change time,.section-head p,.controls p { color:var(--muted); }
.stat strong { display:block; font-size:1.7rem; margin-top:8px; letter-spacing:-.03em; }
.controls { padding:20px; margin-bottom:18px; }
.control-head,.section-head,.card-top,.card-meta,.change { display:flex; gap:12px; }
.control-head,.section-head,.card-top,.change { justify-content:space-between; align-items:flex-start; }
.control-head { margin-bottom:16px; }
.filters { grid-template-columns:repeat(4,1fr); }
label span { display:block; font-size:.82rem; color:var(--muted); margin-bottom:8px; }
input,select {
  width:100%; border:1px solid var(--line); background:var(--panel-2); color:var(--text);
  border-radius:14px; padding:12px 14px; font:inherit; outline:none;
}
input:focus,select:focus,.pill.active { border-color:var(--accent); box-shadow:0 0 0 4px var(--accent-soft); }
.pills,.tags,.badges { display:flex; gap:8px; flex-wrap:wrap; }
.pill,.tag,.badge {
  border:1px solid var(--line); background:var(--panel-2); color:#ddd; border-radius:999px; padding:8px 12px; font-size:.82rem;
}
.pill { cursor:pointer; }
.pill.active,.badge { background:var(--accent-soft); color:#d8ffe6; border-color:rgba(74,222,128,.35); }
.grid { grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); }
.card { padding:18px; cursor:pointer; transition:transform .18s ease, border-color .18s ease; position:relative; }
.card:hover { transform:translateY(-3px); border-color:rgba(74,222,128,.45); }
.card-fav { border-color:rgba(239,68,68,.35); box-shadow:0 0 24px rgba(239,68,68,.08), var(--shadow); }
.card-top-right { display:flex; align-items:center; gap:8px; }
.fav-btn { background:none; border:none; cursor:pointer; font-size:1.3rem; padding:4px 6px; border-radius:10px; transition:transform .15s ease, background .15s ease; line-height:1; }
.fav-btn:hover { transform:scale(1.25); background:rgba(255,255,255,.06); }
.fav-pill { border-color:rgba(239,68,68,.3) !important; }
.fav-pill.active { background:rgba(239,68,68,.15) !important; color:#fca5a5 !important; border-color:rgba(239,68,68,.5) !important; box-shadow:0 0 0 4px rgba(239,68,68,.12) !important; }
.fav-count { color:#f87171; }
.price { font-size:2rem; font-weight:800; letter-spacing:-.04em; }
.address { font-size:1rem; line-height:1.35; margin:8px 0 14px; }
.meta,.card-meta { font-size:.92rem; }
.card-meta { margin:12px 0; flex-wrap:wrap; }
.card-meta span,.meta span { display:inline-flex; gap:6px; align-items:center; }
.area-row { margin-bottom:10px; }
.area-tag { background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.08); }
.crime { padding-left:10px; position:relative; }
.crime::before { content:""; position:absolute; left:0; top:50%; width:6px; height:6px; border-radius:50%; transform:translateY(-50%); background:var(--crime,#f97316); }
.actions { margin-top:14px; display:flex; justify-content:space-between; align-items:center; }
.link { color:var(--accent); font-weight:600; }
.price-section { margin-top:28px; }
.price-list { display:grid; gap:12px; }
.change { padding:16px 18px; border-radius:18px; }
.delta.up { color:#fca5a5; } .delta.down { color:#86efac; }
.empty { padding:24px; border:1px dashed var(--line); border-radius:20px; text-align:center; color:var(--muted); background:rgba(255,255,255,.02); }
@media (max-width: 900px) {
  .stats,.filters { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 640px) {
  .shell { width:min(100% - 20px, 1200px); padding-top:20px; }
  .hero { padding:20px; }
  .hero-glow { display:none; }
  .stats,.filters { grid-template-columns:1fr; }
  .control-head,.section-head,.change,.actions { flex-direction:column; }
}