:root {
  --bg: #f6f7f9;
  --panel: #ffffff;
  --panel2: #f1f3f6;
  --text: #1d2733;
  --muted: #6b7684;
  --accent: #0e9f6e;
  --accent-dark: #0b8459;
  --accent-soft: #e6f6ef;
  --good: #0e9f6e;
  --mid: #b45309;
  --bad: #dc2626;
  --border: #e4e8ee;
  --shadow: 0 1px 3px rgba(16, 24, 40, .07), 0 1px 2px rgba(16, 24, 40, .05);
  --shadow-lg: 0 4px 16px rgba(16, 24, 40, .09);
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
header {
  display: flex; align-items: center; gap: 1.5rem;
  padding: 0.7rem 1.4rem; background: var(--panel);
  border-bottom: 1px solid var(--border); box-shadow: var(--shadow);
  position: sticky; top: 0; z-index: 10;
}
h1 { font-size: 1.15rem; margin: 0; letter-spacing: -.01em; }
h2 { font-size: 1rem; margin: 1.2rem 0 0.5rem; }
nav { display: flex; gap: 0.25rem; flex: 1; }
nav button {
  background: none; border: none; color: var(--muted); padding: 0.5rem 1rem;
  border-radius: 999px; cursor: pointer; font-size: 0.95rem; font-weight: 500;
}
nav button:hover { color: var(--text); background: var(--panel2); }
nav button.active { background: var(--accent-soft); color: var(--accent-dark); }
#lm-status { font-size: 1.05rem; color: var(--muted); }
#lm-status.ok { color: var(--good); }
#lm-status.err { color: var(--bad); }

main { padding: 1.6rem 1.4rem; max-width: 1200px; margin: 0 auto; }
.tab { display: none; }
.tab.active { display: block; }
.muted { color: var(--muted); font-size: 0.85rem; }

.toolbar { display: flex; gap: 0.6rem; align-items: center; margin-bottom: 1.2rem; flex-wrap: wrap; }

input, select, textarea, button {
  background: var(--panel); color: var(--text); border: 1px solid var(--border);
  border-radius: 8px; padding: 0.5rem 0.7rem; font: inherit;
}
input::placeholder, textarea::placeholder { color: #a5aeb9; }
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(14, 159, 110, .13);
}
button { cursor: pointer; font-weight: 500; }
button:hover { border-color: var(--accent); color: var(--accent-dark); }
button.primary {
  background: var(--accent); border-color: var(--accent); color: #fff;
}
button.primary:hover { background: var(--accent-dark); color: #fff; }
button.danger { color: var(--bad); }
button.danger:hover { border-color: var(--bad); }
button:disabled { opacity: .6; cursor: default; }

/* cards */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(330px, 100%), 1fr)); gap: 1.1rem; }
.card {
  background: var(--panel); border: 1px solid var(--border); border-radius: 14px;
  overflow: hidden; display: flex; flex-direction: column; box-shadow: var(--shadow);
  transition: box-shadow .15s ease;
  min-width: 0; /* let grid shrink cards below their min-content width */
  overflow-wrap: break-word;
}
.card:hover { box-shadow: var(--shadow-lg); }
/* the object a shared ?objekt= link points at */
.card.linked { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(14, 159, 110, .18), var(--shadow-lg); }
.card img { width: 100%; height: 175px; object-fit: cover; background: var(--panel2); }
.card .noimg { width: 100%; height: 70px; background: var(--panel2); display: flex;
  align-items: center; justify-content: center; color: var(--muted); font-size: 1.7rem; }
.card .body { padding: 0.85rem 1rem 0.9rem; display: flex; flex-direction: column; gap: 0.4rem; flex: 1; }
.card .top { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; }
.card .addr { font-weight: 650; }
.card .addr a { color: var(--text); text-decoration: none; }
.card .addr a:hover { color: var(--accent-dark); text-decoration: underline; }
.score { font-weight: 700; padding: 0.15rem 0.55rem; border-radius: 999px; font-size: 0.88rem; white-space: nowrap; }
.score.good { background: #e5f6ee; color: #067a52; }
.score.mid { background: #fdf3e4; color: #b45309; }
.score.bad { background: #fdeaea; color: #b91c1c; }
.score.none { background: var(--panel2); color: var(--muted); }
.card .meta { color: var(--muted); font-size: 0.86rem; }
.card .summary { font-size: 0.89rem; color: #313d4b; }
.proscons { font-size: 0.84rem; margin: 0.2rem 0 0; padding: 0; list-style: none; }
.proscons li.pro::before { content: "+ "; color: var(--good); font-weight: 700; }
.proscons li.con::before { content: "− "; color: var(--bad); font-weight: 700; }
.card .actions { display: flex; gap: 0.4rem; margin-top: auto; padding-top: 0.6rem; }
.card .actions button { font-size: 0.8rem; padding: 0.3rem 0.65rem; border-radius: 999px; }
.badge { font-size: 0.7rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600;
  color: var(--muted); background: var(--panel2); border-radius: 5px; padding: 0.05rem 0.35rem; }

/* legal documents (privacy policy, terms) */
main.doc { max-width: 720px; }
main.doc h2 { font-size: 1.4rem; margin-top: 0.4rem; }
main.doc h3 { font-size: 1rem; margin: 1.6rem 0 0.4rem; }
main.doc p, main.doc li { color: #313d4b; }
main.doc ul { padding-left: 1.2rem; }
main.doc li { margin-bottom: 0.4rem; }
main.doc a { color: var(--accent-dark); }
main.doc code { background: var(--panel2); border-radius: 4px; padding: 0 0.25rem; font-size: 0.9em; }

/* object page + discussion */
.backlink { display: inline-block; margin-bottom: 0.9rem; color: var(--accent-dark);
  text-decoration: none; font-weight: 500; }
.backlink:hover { text-decoration: underline; }
.objhead {
  display: flex; gap: 1.2rem; background: var(--panel); border: 1px solid var(--border);
  border-radius: 14px; padding: 1rem; box-shadow: var(--shadow); margin-bottom: 1.4rem;
}
.objhead img { width: 320px; height: 220px; object-fit: cover; border-radius: 10px; flex: none; }
.objhead .objinfo { flex: 1; min-width: 0; }
.objhead .top { display: flex; justify-content: space-between; align-items: center; gap: 0.6rem; }
.objhead h2 { margin: 0; font-size: 1.25rem; }
.objhead .summary { font-size: 0.92rem; color: #313d4b; }
.badge.chat { background: var(--accent-soft); color: var(--accent-dark); }
a.badge { text-decoration: none; }
a.badge:hover { background: var(--border); }

.thread { display: flex; flex-direction: column; gap: 0.7rem; margin-bottom: 1.2rem; }
.cmt { background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
  padding: 0.65rem 0.9rem; box-shadow: var(--shadow); }
.cmt.ai { background: var(--accent-soft); border-color: #c9ebdc; }
.cmt-head { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; margin-bottom: 0.25rem; }
.cmt-head .cmt-del { margin-left: auto; border: none; background: none; color: var(--muted);
  padding: 0 0.2rem; font-size: 0.85rem; opacity: 0; }
.cmt:hover .cmt-del { opacity: 1; }
.cmt-head .cmt-del:hover { color: var(--bad); }
.cmt-body { white-space: pre-wrap; font-size: 0.93rem; }
#obj-form textarea { width: 100%; }
#obj-form .row { margin-top: 0.5rem; align-items: center; }

@media (max-width: 700px) {
  .objhead { flex-direction: column; gap: 0.8rem; }
  .objhead img { width: 100%; height: 200px; }
}

/* profiles */
.split { display: grid; grid-template-columns: 1fr 1.2fr; gap: 1.6rem; align-items: start; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }
#profile-list .pitem {
  background: var(--panel); border: 1px solid var(--border); border-radius: 14px;
  padding: 0.95rem 1.15rem; margin-bottom: 0.8rem; box-shadow: var(--shadow);
}
.pitem .head { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; }
.pitem .head strong { font-size: 1.02rem; }
.pitem .criteria { color: var(--muted); font-size: 0.86rem; margin: 0.35rem 0; }
.pitem .actions { display: flex; gap: 0.45rem; flex-wrap: wrap; }
.pitem .actions button { font-size: 0.83rem; padding: 0.32rem 0.7rem; border-radius: 999px; }

form label { display: block; margin: 0.65rem 0 0.2rem; font-size: 0.9rem; font-weight: 500; }
form input, form select, form textarea { width: 100%; margin-top: 0.2rem; font-weight: 400; }
form .row { display: flex; gap: 0.8rem; align-items: end; }
form .row label { flex: 1; }
form .row button { margin-top: 0.9rem; }
form h3 { font-size: 0.78rem; text-transform: uppercase; letter-spacing: .07em;
  color: var(--accent-dark); margin: 1.4rem 0 0.1rem; }
.checks { display: flex; gap: 0.9rem; flex-wrap: wrap; margin: 0.35rem 0; }
.check { display: flex; gap: 0.35rem; align-items: center; margin: 0; font-size: 0.89rem; font-weight: 400; }
.check input { width: auto; accent-color: var(--accent); }
#profile-form {
  background: var(--panel); border: 1px solid var(--border); border-radius: 14px;
  padding: 1.1rem 1.4rem 1.5rem; box-shadow: var(--shadow);
}
.narrow { max-width: 560px; }

.derived {
  background: var(--accent-soft); border: 1px solid #c9ebdc; border-radius: 10px;
  padding: 0.8rem 1rem; margin-top: 0.9rem; font-size: 0.9rem;
  display: flex; flex-direction: column; gap: 0.45rem;
}
.derived .warn { color: var(--mid); font-size: 0.85rem; }
.derived[hidden] { display: none; }

.chips { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.chip { background: var(--panel); border: 1px solid var(--border); border-radius: 999px;
  padding: 0.15rem 0.7rem; font-size: 0.84rem; display: inline-flex; gap: 0.4rem; align-items: center; }
.chip .src { font-size: 0.72rem; color: var(--muted); }

/* realtors */
.toolbar button.active { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-dark); }
.chip .x { cursor: pointer; color: var(--muted); margin-left: 0.2rem; }
.chip .x:hover { color: var(--bad); }
.realtors { display: flex; flex-direction: column; gap: 0.55rem; max-width: 720px; }
.rrow {
  display: flex; align-items: center; gap: 0.9rem;
  background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
  padding: 0.65rem 1rem; box-shadow: var(--shadow); cursor: pointer;
}
.rrow:hover { box-shadow: var(--shadow-lg); border-color: var(--accent); }
.rrow .rank { color: var(--muted); font-weight: 600; min-width: 1.4rem; text-align: right; }
.rrow .rmain { flex: 1; min-width: 0; }
.rrow .rmain .muted { font-size: 0.8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rrow .rn { color: var(--muted); font-size: 0.88rem; white-space: nowrap; }
.rrow .areas { margin-top: 0.25rem; display: flex; flex-wrap: wrap; gap: 0.25rem; }
.areatag {
  font-size: 0.76rem; background: var(--accent-soft); color: var(--accent-dark);
  border-radius: 999px; padding: 0.05rem 0.5rem; white-space: nowrap;
}

/* map */
#res-map {
  height: 72vh; border-radius: 14px; border: 1px solid var(--border);
  box-shadow: var(--shadow); z-index: 1;
}
#res-map[hidden], #res-list[hidden] { display: none; }
.home-pin { font-size: 24px; filter: drop-shadow(0 1px 2px rgba(0,0,0,.4)); }
.leaflet-popup-content { font: 13px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }

/* runs */
.run {
  background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
  padding: 0.8rem 1.1rem; margin-bottom: 0.65rem; display: flex; gap: 1rem;
  align-items: center; flex-wrap: wrap; box-shadow: var(--shadow);
}
.run .status { font-weight: 600; }
.run .status.running { color: var(--mid); }
.run .status.done { color: var(--good); }
.run .status.failed { color: var(--bad); }
.run .warn { color: var(--mid); font-size: 0.85rem; flex-basis: 100%; }

/* chat */
#chat-log { display: flex; flex-direction: column; gap: 0.65rem; min-height: 50vh;
  max-height: 65vh; overflow-y: auto; padding-bottom: 1rem; }
.msg { max-width: 75%; padding: 0.65rem 1rem; border-radius: 16px; white-space: pre-wrap; }
.msg.user { background: var(--accent); color: #fff; align-self: flex-end; border-bottom-right-radius: 5px; }
.msg.agent { background: var(--panel); border: 1px solid var(--border); align-self: flex-start;
  border-bottom-left-radius: 5px; box-shadow: var(--shadow); }
.msg.agent a { color: var(--accent-dark); }
.msg.thinking { color: var(--muted); font-style: italic; }
#chat-form { display: flex; gap: 0.5rem; margin-top: 0.9rem; }
#chat-input { flex: 1; border-radius: 999px; padding-left: 1rem; min-width: 0; }
#chat-form button { border-radius: 999px; }

/* login */
#login-overlay {
  position: fixed; inset: 0; z-index: 50; background: var(--bg);
  display: flex; align-items: center; justify-content: center; padding: 1rem;
}
#login-overlay[hidden] { display: none; }
.login-box {
  background: var(--panel); border: 1px solid var(--border); border-radius: 16px;
  box-shadow: var(--shadow-lg); padding: 2rem 2.2rem; max-width: 420px; width: 100%;
  text-align: center; display: flex; flex-direction: column; gap: 0.8rem;
}
.login-box h2 { margin: 0; }
.user-code {
  font-size: 2rem; font-weight: 700; letter-spacing: 0.2em;
  background: var(--accent-soft); color: var(--accent-dark);
  border-radius: 10px; padding: 0.5rem; margin: 0.4rem 0;
}
#login-error { color: var(--bad); }
#logout { font-size: 0.82rem; padding: 0.35rem 0.8rem; border-radius: 999px; }

/* ---------- mobile ---------- */
@media (max-width: 700px) {
  /* app-like bottom tab bar */
  header { padding: 0.55rem 1rem; gap: 0.5rem; }
  nav#tabs {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 20;
    background: var(--panel); border-top: 1px solid var(--border);
    box-shadow: 0 -2px 10px rgba(16, 24, 40, .07);
    display: flex; justify-content: space-around; gap: 0;
    padding: 0.3rem 0.2rem calc(0.3rem + env(safe-area-inset-bottom));
  }
  nav#tabs button {
    flex: 1; padding: 0.5rem 0.2rem; font-size: 0.78rem; border-radius: 10px;
  }
  main { padding: 1rem 0.8rem calc(4.6rem + env(safe-area-inset-bottom)); }

  /* prevent iOS zoom-on-focus (needs >=16px) and easier touch targets */
  input, select, textarea { font-size: 16px; }
  button { padding: 0.55rem 0.8rem; }

  .toolbar select { flex: 1; min-width: 0; }
  form .row { flex-direction: column; align-items: stretch; gap: 0; }
  form .row button { width: 100%; }
  #profile-form { padding: 1rem 1rem 1.3rem; }
  .split { gap: 1.1rem; }
  .card img { height: 200px; }
  .msg { max-width: 88%; }
  #chat-log { min-height: 40vh; max-height: none; overflow-y: visible; }
  .run { padding: 0.7rem 0.9rem; gap: 0.5rem 0.9rem; }
}