/* NL Housing Radar 3 — "Delft & signal" design system.
   Delft-blue ink on porcelain, Dutch orange reserved for live/urgent signal. RTL/LTR, light/dark, mobile-first.
   CSP-safe: no inline styles anywhere; all styling lives here. */
:root {
  --bg: #eef1f6; --surface: #ffffff; --surface-2: #f5f7fb; --sunk: #e7ebf3; --line: #d9dfea; --line-2: #c7cfdf;
  --ink: #12204a; --ink-2: #33416a; --muted: #66718d;
  --delft: #1d4ab0; --delft-ink: #ffffff; --delft-soft: #e3eafb; --deep: #0d1d4a; --deep-2: #16296a;
  --signal: #f0641a; --signal-soft: #fde9dc;
  --ok: #0f7a55; --ok-soft: #dcf2e8; --warn: #a96300; --warn-soft: #fbefd6; --bad: #bf3229; --bad-soft: #fbe3e0;
  --info: #1d4ab0; --info-soft: #e3eafb;
  --r-l: 18px; --r: 12px; --r-s: 8px;
  --lift: 0 1px 0 rgba(18, 32, 74, .04), 0 10px 30px -18px rgba(18, 32, 74, .35);
  --font: system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #080e20; --surface: #0f1730; --surface-2: #131d3a; --sunk: #0b1228; --line: #1f2b52; --line-2: #2c3b6c;
    --ink: #e6ecfb; --ink-2: #c3cdea; --muted: #8b97ba;
    --delft: #7ea2ff; --delft-ink: #071233; --delft-soft: #18275a; --deep: #0a1638; --deep-2: #12245a;
    --signal: #ff8640; --signal-soft: #3a1f10;
    --ok: #4cd29c; --ok-soft: #0f2e25; --warn: #f4b544; --warn-soft: #33260c; --bad: #ff7a70; --bad-soft: #3a1513;
    --info: #7ea2ff; --info-soft: #18275a;
    --lift: 0 1px 0 rgba(0, 0, 0, .3), 0 14px 34px -20px rgba(0, 0, 0, .8); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #080e20; --surface: #0f1730; --surface-2: #131d3a; --sunk: #0b1228; --line: #1f2b52; --line-2: #2c3b6c;
  --ink: #e6ecfb; --ink-2: #c3cdea; --muted: #8b97ba;
  --delft: #7ea2ff; --delft-ink: #071233; --delft-soft: #18275a; --deep: #0a1638; --deep-2: #12245a;
  --signal: #ff8640; --signal-soft: #3a1f10;
  --ok: #4cd29c; --ok-soft: #0f2e25; --warn: #f4b544; --warn-soft: #33260c; --bad: #ff7a70; --bad-soft: #3a1513;
  --info: #7ea2ff; --info-soft: #18275a;
  --lift: 0 1px 0 rgba(0, 0, 0, .3), 0 14px 34px -20px rgba(0, 0, 0, .8); color-scheme: dark;
}

/* ---------- base */
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--bg); color: var(--ink); font: 15px/1.65 var(--font); -webkit-text-size-adjust: 100%;
  font-feature-settings: "kern"; text-rendering: optimizeLegibility; }
body { min-height: 100vh; overflow-x: hidden; }
a { color: var(--delft); text-decoration: none; } a:hover { text-decoration: underline; text-underline-offset: 3px; }
h1 { font-size: 1.75rem; font-weight: 800; letter-spacing: -.01em; margin: 0; line-height: 1.25; }
h2 { font-size: 1.05rem; font-weight: 750; margin: 0 0 .75rem; line-height: 1.4; }
h3 { font-size: .95rem; font-weight: 700; margin: 0 0 .45rem; }
small, .muted { color: var(--muted); }
code { background: var(--sunk); padding: .05em .4em; border-radius: 5px; font-size: .88em; }
.hidden { display: none !important; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--delft); color: var(--delft-ink); }
svg.ic { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; vertical-align: -3px; }
svg.ic.sm { width: 15px; height: 15px; vertical-align: -2px; }
svg.ic.fill { fill: currentColor; }

/* ---------- shell */
.top { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: .6rem; padding: .55rem 1.25rem; min-height: 60px;
  background: color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter: saturate(1.4) blur(12px); border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: .65rem; font-weight: 800; color: var(--ink); }
.brand, .brand:hover { text-decoration: none; color: var(--ink); }
.brand svg { width: 34px; height: 34px; flex: none; }
.brand > span { line-height: 1.2; }
.brand small { display: block; font-weight: 500; font-size: .72rem; margin-top: .1rem; }
.top .spacer { flex: 1; }
.top .who { font-size: .82rem; color: var(--muted); padding-inline-end: .4rem; }
.top .btn.sm { min-height: 34px; }
.iconbtn { width: 36px; padding: 0; }
.layout { display: grid; grid-template-columns: 236px minmax(0, 1fr); gap: 1.75rem; max-width: 1440px; margin: 0 auto; padding: 1.5rem 1.25rem 6rem; }
.side { position: sticky; top: 5.2rem; align-self: start; display: flex; flex-direction: column; gap: 2px; }
.side a { position: relative; display: flex; align-items: center; gap: .7rem; padding: .55rem .8rem; border-radius: var(--r-s); color: var(--ink-2); font-weight: 550; }
.side a svg.ic { color: var(--muted); }
.side a:hover { background: var(--surface); text-decoration: none; color: var(--ink); }
.side a.on { background: var(--surface); color: var(--delft); font-weight: 750; box-shadow: var(--lift); }
.side a.on svg.ic { color: var(--delft); }
.side a.on::before { content: ""; position: absolute; inset-inline-start: -10px; top: 9px; bottom: 9px; width: 3px; border-radius: 3px; background: var(--delft); }
.side .count { margin-inline-start: auto; font-size: .72rem; background: var(--signal); color: #fff; border-radius: 99px; padding: 0 .45rem; }
.side .foot { margin-top: 1.2rem; padding: .8rem; border-top: 1px dashed var(--line-2); font-size: .78rem; color: var(--muted); }
.bottom { display: none; }
main.view { min-width: 0; }
@media (max-width: 860px) {
  .layout { grid-template-columns: minmax(0, 1fr); padding: 1rem .8rem 6.8rem; gap: 1rem; }
  .side { display: none; }
  .bottom { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; position: fixed; inset-inline: 0; bottom: 0; z-index: 40;
    background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(12px); border-top: 1px solid var(--line);
    padding: .3rem .3rem calc(.3rem + env(safe-area-inset-bottom)); }
  .bottom a { display: flex; flex-direction: column; align-items: center; gap: .1rem; font-size: .64rem; color: var(--muted); padding: .35rem .1rem;
    border-radius: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .bottom a svg.ic { width: 21px; height: 21px; }
  .bottom a.on { color: var(--delft); font-weight: 700; }
  .bottom a:hover { text-decoration: none; }
  .top { padding: .5rem .8rem; }
  .top .who, .brand small { display: none; }
  h1 { font-size: 1.4rem; }
}

/* ---------- surfaces */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-l); padding: 1.15rem 1.25rem; min-width: 0; }
.card + .card { margin-top: 1.1rem; }
.grid > .card + .card, .cards > .card + .card { margin-top: 0; }
.head { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: 1.25rem; }
.head .grow { flex: 1; min-width: 12rem; }
.head .grow > .muted, .head .grow > span.muted { display: block; margin-top: .2rem; font-size: .88rem; }
.card > .head { margin-bottom: .8rem; }
.card > .head h2 { margin: 0; }
.grid { display: grid; gap: 1.1rem; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .g3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .g2, .g3 { grid-template-columns: minmax(0, 1fr); } .g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.stack > * + * { margin-top: .7rem; }
.kpi { padding: .9rem 1.1rem; } .kpi b { display: block; font-size: 1.7rem; font-weight: 800; line-height: 1.15; font-variant-numeric: tabular-nums; }
.kpi span { font-size: .82rem; color: var(--muted); }

/* ---------- radar hero (the one loud element) */
.hero { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2rem; align-items: center; overflow: hidden;
  background: radial-gradient(120% 140% at 0% 0%, var(--deep-2) 0%, var(--deep) 55%); color: #e9eefc; border-radius: 22px;
  padding: 1.6rem 2rem; margin-bottom: 1.1rem; isolation: isolate; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5;
  background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 28px 28px; mask-image: linear-gradient(to left, #000, transparent 70%); }
[dir="rtl"] .hero::after { mask-image: linear-gradient(to right, #000, transparent 70%); }
.radar { width: 196px; height: 196px; display: block; }
.radar .ring { fill: none; stroke: rgba(170, 195, 255, .22); stroke-width: 1; }
.radar .axis { stroke: rgba(170, 195, 255, .14); stroke-width: 1; }
.radar .sweep { transform-origin: 100px 100px; }
@media (prefers-reduced-motion: no-preference) { .radar .sweep { animation: sweep 4.8s linear infinite; } }
@keyframes sweep { to { transform: rotate(360deg); } }
.radar .blip { stroke: var(--deep); stroke-width: 2; }
.radar .blip.OK, .radar .blip.MATCH { fill: #4cd29c; } .radar .blip.WARN, .radar .blip.CHECK { fill: #f4b544; }
.radar .blip.DOWN { fill: #ff6b61; } .radar .blip.WAITING { fill: #7ea2ff; }
.radar .blip.PARKED, .radar .blip.DISABLED { fill: rgba(200, 212, 245, .28); }
.radar .blip.FAST { fill: var(--signal); }
.radar .core { fill: var(--signal); }
.hero .big { display: flex; align-items: baseline; gap: .8rem; flex-wrap: wrap; }
.hero .big b { font-size: 4.2rem; line-height: 1; font-weight: 850; letter-spacing: -.03em; font-variant-numeric: tabular-nums; color: #fff; }
.hero .big span { font-size: 1.1rem; font-weight: 600; color: #c9d4f5; }
.hero .live { display: inline-flex; align-items: center; gap: .45rem; font-size: .8rem; font-weight: 700; color: #ffd2b8; margin-bottom: .6rem; }
.hero .live i { width: 8px; height: 8px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 4px rgba(240, 100, 26, .25); }
.hero .facts { display: flex; flex-wrap: wrap; gap: .35rem 1.6rem; margin-top: 1rem; font-size: .9rem; color: #b9c6ee; }
.hero .facts b { color: #fff; font-weight: 750; font-variant-numeric: tabular-nums; margin-inline-end: .3rem; }
.hero .acts { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.2rem; }
.hero .btn { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .16); color: #fff; }
.hero .btn:hover { background: rgba(255, 255, 255, .15); }
.hero .btn.primary { background: var(--signal); border-color: var(--signal); color: #fff; }
.hero .btn.primary:hover { filter: brightness(1.07); }
.hero a { color: #fff; }
@media (max-width: 760px) {
  .hero { grid-template-columns: minmax(0, 1fr); padding: 1.2rem; gap: 1rem; border-radius: 18px; }
  .radar { width: 132px; height: 132px; }
  .hero .big b { font-size: 3.2rem; }
}

/* ---------- statline (secondary numbers, one quiet strip) */
.statline { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-l); margin-bottom: 1.1rem; overflow: hidden; }
.statline > div { padding: .85rem 1.15rem; border-inline-start: 1px solid var(--line); }
.statline > div:first-child { border-inline-start: 0; }
.statline b { display: block; font-size: 1.35rem; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.25; }
.statline span { font-size: .8rem; color: var(--muted); }
.statline .alarm b { color: var(--bad); }
@media (max-width: 640px) { .statline { grid-template-columns: repeat(2, minmax(0, 1fr)); } .statline > div:nth-child(odd) { border-inline-start: 0; }
  .statline > div:nth-child(n+3) { border-top: 1px solid var(--line); } }

/* ---------- signal wall (sources at a glance) */
.wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .55rem; }
.sig { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .15rem .6rem; align-items: center; padding: .6rem .75rem;
  border: 1px solid var(--line); border-radius: var(--r); background: var(--surface-2); color: var(--ink); }
.sig:hover { text-decoration: none; border-color: var(--line-2); background: var(--surface); }
.sig .name { font-weight: 700; font-size: .87rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sig .n { font-weight: 800; font-variant-numeric: tabular-nums; font-size: 1rem; }
.sig small { grid-column: 2 / 4; font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sig.PARKED, .sig.DISABLED { opacity: .55; }
.sig.DOWN { border-color: color-mix(in srgb, var(--bad) 45%, var(--line)); background: var(--bad-soft); }
.sig.WARN { border-color: color-mix(in srgb, var(--warn) 45%, var(--line)); }

/* ---------- buttons, badges, chips */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; border: 1px solid var(--line-2); background: var(--surface);
  border-radius: var(--r-s); padding: .45rem .95rem; cursor: pointer; font-weight: 650; min-height: 40px; color: var(--ink); text-decoration: none; white-space: nowrap; }
.btn:hover { background: var(--surface-2); text-decoration: none; border-color: var(--muted); }
.btn.primary { background: var(--delft); border-color: var(--delft); color: var(--delft-ink); }
.btn.primary:hover { filter: brightness(1.08); }
.btn.danger { color: var(--bad); border-color: color-mix(in srgb, var(--bad) 40%, var(--line)); }
.btn.ghost { border-color: transparent; background: transparent; }
.btn.sm { min-height: 32px; padding: .2rem .65rem; font-size: .84rem; border-radius: 7px; }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.btn:active:not(:disabled) { transform: translateY(1px); }
:focus-visible { outline: 2px solid var(--delft); outline-offset: 2px; }
.badge { display: inline-flex; align-items: center; gap: .3rem; border-radius: 6px; padding: .02rem .5rem; font-size: .74rem; font-weight: 700;
  background: var(--sunk); color: var(--ink-2); white-space: nowrap; line-height: 1.7; }
.b-ok { background: var(--ok-soft); color: var(--ok); } .b-warn { background: var(--warn-soft); color: var(--warn); }
.b-bad { background: var(--bad-soft); color: var(--bad); } .b-info { background: var(--info-soft); color: var(--info); }
.b-acc { background: var(--delft-soft); color: var(--delft); }
.b-sig { background: var(--signal); color: #fff; }
.chip { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid var(--line-2); background: var(--surface); border-radius: 99px;
  padding: .18rem .75rem; font-size: .84rem; cursor: pointer; color: var(--ink-2); }
.chip:hover { border-color: var(--delft); }
.chip.on { background: var(--delft); color: var(--delft-ink); border-color: var(--delft); font-weight: 650; }
.chip .x { border: 0; background: transparent; cursor: pointer; padding: 0; color: inherit; opacity: .75; font-size: 1rem; line-height: 1; }

/* ---------- forms */
.field { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.field > span { font-size: .8rem; color: var(--ink-2); font-weight: 650; }
input[type=text], input[type=number], input[type=password], input[type=date], input[type=search], input[type=url], select, textarea {
  width: 100%; border: 1px solid var(--line-2); background: var(--surface); border-radius: var(--r-s); padding: .5rem .7rem; min-height: 42px; }
input:hover, select:hover, textarea:hover { border-color: var(--muted); }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--delft); box-shadow: 0 0 0 3px var(--delft-soft); }
textarea { min-height: 84px; resize: vertical; }
.check { display: flex; align-items: flex-start; gap: .6rem; cursor: pointer; padding: .2rem 0; }
.check input { width: 18px; height: 18px; margin-top: .25rem; accent-color: var(--delft); flex: none; }
.seg { display: inline-flex; border: 1px solid var(--line-2); border-radius: 10px; padding: 3px; gap: 2px; flex-wrap: wrap; background: var(--sunk); }
.seg button { border: 0; background: transparent; padding: .3rem .85rem; cursor: pointer; min-height: 32px; border-radius: 7px; color: var(--ink-2); font-weight: 600; }
.seg button:hover { color: var(--ink); }
.seg button.on { background: var(--surface); color: var(--delft); font-weight: 750; box-shadow: 0 1px 2px rgba(18, 32, 74, .15); }
fieldset { border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-l); padding: 1rem 1.2rem 1.2rem; margin: 0 0 1rem; min-width: 0; }
legend { font-weight: 800; padding: 0 .4rem; display: inline-flex; align-items: center; gap: .45rem; }
legend svg.ic { color: var(--delft); }
.lock { font-size: .74rem; color: var(--warn); font-weight: 650; }
.policy { font-size: .76rem; min-height: 28px !important; padding: .05rem .3rem !important; width: auto !important; }
.suggest { position: relative; }
.suggest-list { position: absolute; inset-inline: 0; top: 100%; z-index: 25; background: var(--surface); border: 1px solid var(--line-2);
  border-radius: var(--r); box-shadow: var(--lift); max-height: 280px; overflow: auto; margin-top: .3rem; padding: .25rem; }
.suggest-list button { display: block; width: 100%; text-align: start; border: 0; background: transparent; padding: .5rem .7rem; cursor: pointer; border-radius: 7px; }
.suggest-list button:hover, .suggest-list button:focus { background: var(--delft-soft); }
.suggest-list small { display: block; }

/* ---------- listing tickets */
.cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.lcard { display: flex; flex-direction: column; gap: .5rem; position: relative; padding: 1rem 1.15rem 1rem; padding-inline-start: 1.35rem; overflow: hidden; }
.lcard::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0; width: 5px; background: var(--line-2); }
.lcard.v-ok::before { background: var(--ok); } .lcard.v-warn::before { background: var(--warn); } .lcard.gone::before { background: var(--bad); }
.lcard.urgent { border-color: color-mix(in srgb, var(--signal) 45%, var(--line)); }
.lcard.urgent::before { background: linear-gradient(var(--signal) 0 36%, var(--ok) 36%); }
.lcard .top-row { display: flex; align-items: center; gap: .35rem; flex-wrap: wrap; }
.lcard .t { font-weight: 800; font-size: 1.05rem; line-height: 1.35; overflow-wrap: anywhere; }
.lcard .meta { font-size: .84rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: .2rem .9rem; }
.lcard .meta > span { display: inline-flex; align-items: center; gap: .3rem; }
.lcard .pricebar { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; flex-wrap: wrap;
  border-block: 1px dashed var(--line-2); padding: .45rem 0; margin: .15rem 0; }
.lcard .price { font-size: 1.45rem; font-weight: 850; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.lcard .price small { font-weight: 550; font-size: .8rem; margin-inline-start: .2rem; }
.lcard .alloc { font-size: .8rem; color: var(--ink-2); font-weight: 600; text-align: end; }
.lcard .why { font-size: .84rem; }
.lcard .actions { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; margin-top: auto; padding-top: .4rem; }
.lcard .actions .spacer { flex: 1; }
.lcard.gone { opacity: .6; }
.lcard .imgs { display: flex; gap: .3rem; overflow-x: auto; } .lcard .imgs img { height: 90px; border-radius: 8px; flex: none; }
.btn.star.on { color: var(--signal); border-color: color-mix(in srgb, var(--signal) 50%, var(--line)); }
.btn.star.on svg.ic { fill: currentColor; }
ul.why { list-style: none; margin: 0; padding: 0; }
ul.why li { padding-inline-start: 1.3rem; position: relative; line-height: 1.55; margin-bottom: .15rem; }
ul.why li::before { position: absolute; inset-inline-start: 0; top: .02rem; font-weight: 900; width: 1rem; text-align: center; }
.why li.p::before { content: "✓"; color: var(--ok); } .why li.u::before { content: "?"; color: var(--warn); } .why li.n::before { content: "✕"; color: var(--bad); }

/* ---------- tables */
.tablewrap { overflow-x: auto; margin: 0 -1.25rem; padding: 0 1.25rem; }
.tbl { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .88rem; }
.tbl th, .tbl td { text-align: start; padding: .6rem .6rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl thead th { color: var(--muted); font-weight: 650; font-size: .76rem; white-space: nowrap; background: var(--surface); position: sticky; top: 0; z-index: 1;
  border-bottom-color: var(--line-2); }
.tbl tbody tr:hover td { background: var(--surface-2); }
.tbl tbody tr:last-child td { border-bottom: 0; }
.tbl tr.ptr td:first-child { position: relative; }
.num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.modal .tbl th { width: 38%; color: var(--muted); font-weight: 600; font-size: .8rem; background: none; position: static; }
.modal .tbl td { font-weight: 600; }

/* ---------- modal / toast / banners */
.modal-bg { position: fixed; inset: 0; background: rgba(6, 12, 32, .55); backdrop-filter: blur(3px); z-index: 60; display: flex; align-items: flex-start;
  justify-content: center; padding: 5vh .75rem; overflow: auto; }
.modal { background: var(--surface); border-radius: 20px; max-width: 820px; width: 100%; box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .55);
  padding: 1.4rem 1.5rem; border: 1px solid var(--line); }
@media (prefers-reduced-motion: no-preference) { .modal { animation: rise .18s ease-out; } }
@keyframes rise { from { transform: translateY(8px); opacity: 0; } }
.modal .mh { display: flex; align-items: flex-start; gap: .8rem; margin-bottom: .7rem; }
.modal .mh h2 { flex: 1; margin: 0; font-size: 1.3rem; font-weight: 800; overflow-wrap: anywhere; }
.modal details { border: 1px solid var(--line); border-radius: var(--r); padding: .5rem .8rem; background: var(--surface-2); }
.modal details summary { cursor: pointer; font-weight: 700; }
.modal details[open] summary { margin-bottom: .4rem; }
.toast { position: fixed; inset-inline: 0; bottom: 5.5rem; margin: 0 auto; width: max-content; max-width: 92vw; z-index: 80; background: var(--deep); color: #fff;
  padding: .6rem 1.1rem; border-radius: 12px; box-shadow: 0 16px 40px -16px rgba(0, 0, 0, .6); font-weight: 650; }
.toast.err { background: var(--bad); }
.banner { border-radius: var(--r); padding: .65rem .9rem; margin-bottom: 1rem; display: flex; gap: .6rem; align-items: center; flex-wrap: wrap;
  border: 1px solid transparent; font-weight: 550; }
.banner > svg.ic { flex: none; }
.banner.warn { background: var(--warn-soft); color: var(--warn); border-color: color-mix(in srgb, var(--warn) 25%, transparent); }
.banner.bad { background: var(--bad-soft); color: var(--bad); border-color: color-mix(in srgb, var(--bad) 25%, transparent); }
.banner.info { background: var(--info-soft); color: var(--info); border-color: color-mix(in srgb, var(--info) 22%, transparent); }
.banner .btn { margin-inline-start: auto; }
.secret { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: .85rem; background: var(--sunk); padding: .55rem .75rem;
  border-radius: var(--r-s); overflow-wrap: anywhere; }

/* ---------- login: split panel with the radar */
.login-wrap { min-height: calc(100vh - 61px); display: grid; place-items: center; padding: 1.5rem 1rem; }
.login-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); width: 100%; max-width: 900px; background: var(--surface);
  border: 1px solid var(--line); border-radius: 26px; overflow: hidden; box-shadow: var(--lift); }
.login-split .hero { margin: 0; border-radius: 0; grid-template-columns: minmax(0, 1fr); align-content: center; justify-items: start; padding: 2.2rem; }
.login-split .hero h1 { color: #fff; font-size: 1.9rem; }
.login-split .hero p { color: #b9c6ee; margin: .4rem 0 0; max-width: 32ch; }
.login { width: 100%; padding: 2.2rem; }
.login h1 { font-size: 1.45rem; } .login form { display: grid; gap: .9rem; margin-top: 1.2rem; }
.login .btn.primary { min-height: 46px; font-size: 1rem; }
.login > .muted { font-size: .85rem; }
@media (max-width: 760px) { .login-split { grid-template-columns: minmax(0, 1fr); } .login-split .hero { padding: 1.4rem; } .login { padding: 1.4rem; } }

/* ---------- map */
.tm { position: relative; overflow: hidden; background: var(--sunk); border-radius: var(--r); touch-action: none; user-select: none; height: 460px; cursor: grab; }
.tm:active { cursor: grabbing; }
.mapbox { height: 64vh; min-height: 360px; }
.tm-tiles, .tm-marks { position: absolute; inset: 0; } .tm-svg { position: absolute; inset: 0; pointer-events: none; }
.tm-tile { position: absolute; left: 0; top: 0; width: 256px; height: 256px; }
[data-theme="dark"] .tm-tile { filter: brightness(.72) contrast(1.15) saturate(.7) hue-rotate(190deg) invert(.08); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .tm-tile { filter: brightness(.72) contrast(1.15) saturate(.7) hue-rotate(190deg) invert(.08); } }
.tm-mark { position: absolute; left: 0; top: 0; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; border: 2.5px solid #fff; background: var(--delft);
  box-shadow: 0 2px 6px rgba(0, 0, 0, .35); cursor: pointer; padding: 0; }
.tm-mark.v { background: #0f9a6b; } .tm-mark.u { background: #d98a00; } .tm-mark.approx { opacity: .65; border-style: dashed; }
.tm-mark.origin { width: 14px; height: 14px; background: #1d4ab0; border-radius: 4px; }
.tm-mark.pt { width: 10px; height: 10px; margin: -5px 0 0 -5px; background: var(--signal); }
.tm-circle { fill: rgba(29, 74, 176, .09); stroke: #1d4ab0; stroke-width: 2; stroke-dasharray: 6 5; }
.tm-poly { fill: rgba(240, 100, 26, .12); stroke: #f0641a; stroke-width: 2; }
.tm-ctl { position: absolute; top: .6rem; inset-inline-end: .6rem; display: flex; flex-direction: column; gap: .3rem; z-index: 3; }
.tm-ctl button { width: 36px; height: 36px; border-radius: 9px; border: 1px solid var(--line-2); background: var(--surface); font-size: 1.2rem; cursor: pointer; box-shadow: var(--lift); }
.tm-att { position: absolute; bottom: 0; inset-inline-end: 0; font-size: .7rem; background: color-mix(in srgb, var(--surface) 85%, transparent); padding: 0 .4rem; z-index: 3; }
.legend { display: flex; gap: 1rem; flex-wrap: wrap; font-size: .8rem; color: var(--muted); margin-top: .6rem; }
.legend i { display: inline-block; width: 11px; height: 11px; border-radius: 50%; margin-inline-end: .35rem; vertical-align: -1px; }
.legend i.lg-v { background: #0f9a6b; } .legend i.lg-u { background: #d98a00; } .legend i.lg-z { background: #1d4ab0; border-radius: 3px; }

/* ---------- health dots, install page, misc */
.dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: var(--line-2); margin-inline-end: .4rem; flex: none; }
.dot.OK { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-soft); } .dot.WARN { background: var(--warn); box-shadow: 0 0 0 3px var(--warn-soft); }
.dot.DOWN { background: var(--bad); box-shadow: 0 0 0 3px var(--bad-soft); } .dot.WAITING { background: var(--info); box-shadow: 0 0 0 3px var(--info-soft); }
.install main.narrow { max-width: 820px; margin: 2rem auto; padding: 0 1rem; }
.install ol li { margin-bottom: .6rem; }
.skeleton { color: var(--muted); padding: 3rem; text-align: center; }
.empty { color: var(--muted); padding: 2.2rem 1rem; text-align: center; border: 1px dashed var(--line-2); border-radius: var(--r); grid-column: 1 / -1; }
td.empty { border: 0; }
.mt1 { margin-top: 1rem; } .grow1 { flex: 1; } .minw200 { min-width: 200px; } .w220 { max-width: 220px; } .ptr { cursor: pointer; }
.h200 { height: 200px; } .h340 { height: 340px; } .zcard { padding: .6rem .9rem; border-radius: var(--r); } .prow { border-bottom: 1px solid var(--line); padding: .5rem 0; }
.spacer { flex: 1; }
.savebar { position: sticky; bottom: 0; z-index: 5; background: color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter: blur(8px);
  padding: .7rem 0; border-top: 1px solid var(--line); }
@media (max-width: 860px) { .savebar { bottom: calc(3.9rem + env(safe-area-inset-bottom)); } }
code, .ltr { direction: ltr; unicode-bidi: isolate; } .secret { unicode-bidi: plaintext; }
.sectitle { display: flex; align-items: center; gap: .6rem; margin: 1.6rem 0 .8rem; }
.sectitle h2 { margin: 0; }
.sectitle a { font-size: .86rem; font-weight: 650; }
.sectitle .spacer { flex: 1; }
.card h2 svg.ic { color: var(--delft); margin-inline-end: .35rem; }
.head select, .head input[type=search] { width: auto; min-width: 150px; flex: 0 1 auto; }
.head .seg { flex: none; }
.sig .name { unicode-bidi: plaintext; text-align: start; }
@media (max-width: 640px) { .head select, .head input[type=search] { flex: 1 1 140px; } }

/* v3.3.1 optional listing photographs, no impact on scan scheduling */
.nlhr-photo{display:block;width:100%;height:170px;object-fit:cover;border-radius:10px;margin:8px 0}
.nlhr-gallery{display:flex;gap:8px;overflow-x:auto;margin:12px 0}
.nlhr-gallery img{height:160px;max-width:230px;object-fit:cover;border-radius:9px;flex-shrink:0}
.nlhr-extra{margin:5px 0}

/* 3.4.0 — decision-first listing display (preserves all underlying facts). */
.nlhr-rowtitle {display:flex;align-items:center;gap:10px;min-width:200px}
.nlhr-rowtitle b{display:block;line-height:1.35}
.nlhr-rowtitle small{display:block;font-size:.73rem;color:var(--muted)}
.nlhr-labels {display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.elig-chip {display:inline-block;border:1px solid var(--line-2);background:var(--surface-2);border-radius:16px;font-size:.72rem;padding:2px 7px;color:var(--ink-2);white-space:nowrap}
.nlhr-tablephoto {width:58px;height:52px;border-radius:8px;object-fit:cover;flex-shrink:0}
.nlhr-board th {white-space:nowrap}
.nlhr-board td {vertical-align:middle}
.nlhr-summary {display:grid;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:10px;padding:12px;background:var(--surface-2);border-radius:12px;margin-top:10px}
.nlhr-summary>div>small {display:block;color:var(--muted)}
.nlhr-summary strong {font-size:.88rem;line-height:1.3}
.nlhr-summary .nlhr-labels {align-items:center}
.nlhr-gallery img {height:155px}
@media(max-width:700px) {.nlhr-rowtitle {min-width:165px}.nlhr-board {font-size:.78rem}.nlhr-tablephoto {width:42px;height:42px}}

/* Restore the v2.8 listing filters without increasing the five-column table density. */
.nlhr-filters .row {display:flex; flex-wrap:wrap; gap:.55rem; align-items:center;}
.nlhr-filters select {max-width: 100%; min-width: 9rem; flex: 1 1 9rem;}
.nlhr-filters .muted {margin: .65rem 0 0; font-size:.78rem;}
@media(max-width:660px){.nlhr-filters .row {display:grid;grid-template-columns:1fr 1fr;} .nlhr-filters select {min-width:0;width:100%;}}

/* ---------- 3.4.3: unified Telegram card, yield sparkline */
.tgcard .tgsec { border: 1px solid var(--line); border-radius: var(--r); padding: .8rem .95rem; background: var(--surface-2); }
.tgcard .tgsec + .tgsec { margin-top: .7rem; }
.tgcard .tghead { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .35rem; }
.tgcard .banner { margin: .8rem 0 0; }
svg.spark { width: 96px; height: 24px; display: block; }
svg.spark rect { fill: var(--line-2); }
svg.spark rect.on { fill: var(--delft); }
.nlhr-labels:empty { display: none; }


/* NL Housing 3.4.8 — visual workspace, UI-only and backwards-compatible */
body:has(.nlh-board-view) .layout{max-width:1920px;gap:1.1rem;padding:1rem 1.3rem 3rem;grid-template-columns:215px minmax(0,1fr)}
body:has(.nlh-board-view) .side{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:15px 10px;box-shadow:var(--lift)}
.nlh-page{min-width:0}.nlh-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;gap:1rem}
.nlh-heading p{margin:.23rem 0 0;color:var(--muted);font-size:.85rem}.nlh-small-link{font-size:.82rem;display:flex;align-items:center;gap:5px}
.nlh-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) minmax(180px,1.25fr);gap:.65rem;margin-bottom:.85rem}
.nlh-stat,.nlh-status-box{background:var(--surface);border:1px solid var(--line);border-radius:15px;min-width:0;box-shadow:0 3px 12px rgba(10,25,70,.03)}
.nlh-stat{display:flex;align-items:center;padding:1rem .9rem;gap:.75rem}
.nlh-stat-ico{border-radius:12px;padding:.7rem;display:flex;align-items:center;justify-content:center;flex:none}.nlh-stat-ico .ic{width:24px;height:24px}
.nlh-stat-blue{color:#1d4ab0;background:#e5eeff}.nlh-stat-orange{color:#d76f1a;background:#fff0e5}.nlh-stat-green{color:#158059;background:#e4f6ee}.nlh-stat-purple{color:#6856b3;background:#f0edfb}
.nlh-stat strong{display:block;font-size:1.48rem;font-weight:800;line-height:1.25;font-variant-numeric:tabular-nums}.nlh-stat small{display:block;font-size:.75rem;color:var(--muted)}
.nlh-status-box{display:grid;grid-template-rows:1fr 1fr;overflow:hidden}.nlh-status-box a{display:flex;align-items:center;gap:.62rem;padding:.4rem .8rem;min-width:0;color:var(--ink)}
.nlh-status-box a+a{border-top:1px solid var(--line)}.nlh-status-box .ic{color:var(--delft);flex:none}.nlh-status-box b{display:block;font-size:.78rem}.nlh-status-box small{display:block;font-size:.69rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.nlh-filter-panel{border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:.72rem .8rem;margin-bottom:.8rem}
.nlh-main-filters{display:grid;grid-template-columns:repeat(5,minmax(110px,1fr)) minmax(155px,1.8fr) auto;gap:.5rem;align-items:center}
.nlh-main-filters select,.nlh-main-filters input{min-width:0;width:100%;height:43px;border:1px solid var(--line);background:var(--surface-2);border-radius:9px;padding:.4rem .7rem;color:var(--ink);font-size:.81rem}
.nlh-main-filters .btn{min-height:43px;display:flex;align-items:center;gap:.3rem}
.nlh-extra-filters{margin-top:.45rem}.nlh-extra-filters summary{font-size:.77rem;cursor:pointer;color:var(--muted);width:max-content}.nlh-extra-grid{display:flex;flex-wrap:wrap;gap:.5rem;padding-top:.6rem}.nlh-extra-grid select{min-width:160px;max-width:280px}
.nlh-controls{display:flex;align-items:center;gap:.7rem;margin:.75rem 0}.nlh-view-toggle{display:flex;border:1px solid var(--line);border-radius:10px;padding:3px;background:var(--surface);gap:3px}
.nlh-view-toggle button{background:none;border:none;color:var(--muted);cursor:pointer;border-radius:8px;padding:.42rem .75rem;font-size:.8rem;font-weight:600;display:flex;gap:5px;align-items:center}
.nlh-view-toggle button.selected{background:var(--deep);color:#fff}.nlh-view-toggle .ic{width:16px;height:16px}.nlh-spacer{flex:1}
.nlh-sort-label{display:flex;gap:.4rem;align-items:center;color:var(--muted);font-size:.8rem}.nlh-sort-label select{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:.38rem}.nlh-count{font-size:.77rem;color:var(--muted);white-space:nowrap}
.nlh-workspace{direction:ltr;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(310px,1fr);align-items:start;gap:.75rem;min-width:0}
.nlh-workspace[data-mode="table"]{grid-template-columns:minmax(0,1fr)}.nlh-workspace[data-mode="table"] .nlh-map-column{display:none}
.nlh-workspace[data-mode="map"]{grid-template-columns:minmax(0,1fr)}.nlh-workspace[data-mode="map"] .nlh-results{display:none}
.nlh-results{min-width:0}.nlh-listings{display:grid;gap:.44rem}
.nlh-listing{direction:ltr;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.62rem;display:grid;grid-template-columns:74px minmax(130px,1.8fr) minmax(83px,.72fr) minmax(90px,.77fr) minmax(100px,.9fr) 20px;align-items:center;gap:.56rem;color:var(--ink);cursor:pointer;width:100%;min-width:0;transition:box-shadow .15s,border-color .15s;}
.nlh-listing:hover,.nlh-listing:focus-visible{border-color:var(--delft);box-shadow:0 3px 14px rgba(20,50,130,.10);outline:none}
.nlh-thumbnail{display:block;width:74px;height:66px;overflow:hidden;border-radius:9px}.nlh-thumb{width:74px;height:66px}.nlh-no-photo{display:flex;width:100%;height:100%;background:var(--surface-2);color:var(--line-2);align-items:center;justify-content:center}
.nlh-no-photo .ic{width:34px;height:34px}.nlh-property{display:block;min-width:0}.nlh-property b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.82rem;line-height:1.35;color:var(--ink);max-height:2.75em}
.nlh-property small{display:block;color:var(--muted);font-size:.7rem;margin:.15rem 0 .12rem}.nlh-tagline{display:flex;flex-wrap:wrap;gap:4px}
.nlh-tagline .elig-chip{padding:0 6px;font-size:.64rem;background:var(--surface-2)}
.nlh-rent{font-size:.87rem;font-weight:800;white-space:nowrap}.nlh-rent small{display:block;font-size:.63rem;color:var(--muted);font-weight:400}.nlh-date{font-size:.76rem;font-variant-numeric:tabular-nums}.nlh-date small,.nlh-allocation>small{display:block;font-size:.68rem;color:var(--muted)}
.nlh-allocation{min-width:0}.nlh-allocation>small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4}
.nlh-statuses{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}.nlh-statuses .badge{font-size:.64rem;padding:1px 5px}.nlh-chevron{color:var(--muted)}.nlh-chevron svg{width:15px;height:15px}
.nlh-more{margin:1rem auto;display:block}.nlh-more[hidden]{display:none}.nlh-map-column{min-width:0}.nlh-map-shell{height:min(73vh,720px);min-height:520px;position:sticky;top:80px;background:var(--surface);border:1px solid var(--line);border-radius:15px;overflow:hidden}
.nlh-map{width:100%;height:100%;position:relative}.nlh-map-preview{position:absolute;top:50px;inset-inline-end:13px;width: min(285px,calc(100% - 32px));background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:10px;display:flex;gap:.65rem;box-shadow:var(--lift);z-index:4;align-items:start}
.nlh-map-preview[hidden]{display:none}.nlh-previewphoto{width:78px;height:75px;flex:none}.nlh-preview-fallback{display:grid;place-items:center;width:68px;height:72px;background:var(--surface-2);color:var(--muted);border-radius:8px;flex:none}
.nlh-map-preview>div{flex:1;min-width:0}.nlh-map-preview b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.76rem;line-height:1.3}.nlh-map-preview small{display:block;font-size:.72rem;color:var(--muted)}.nlh-map-preview strong{display:block;font-size:.78rem}.nlh-map-preview strong small{display:inline}
.nlh-map-preview .elig-chip{font-size:.61rem}.nlh-detail-link{border:0;background:var(--surface-2);border-radius:7px;padding:4px;cursor:pointer}
.nlh-map-footnote{position:absolute;bottom:9px;left:10px;right:10px;background:color-mix(in srgb,var(--surface) 86%,transparent);border-radius:7px;padding:3px 6px;font-size:.63rem;color:var(--muted);text-align:center;pointer-events:none;z-index:3}
.nlh-board-note{font-size:.74rem;color:var(--muted);margin-top:.8rem}
@media(max-width:1440px){.nlh-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.nlh-status-box{grid-column:1/-1;grid-template-columns:1fr 1fr;grid-template-rows:auto}.nlh-status-box a+a{border-top:0;border-inline-start:1px solid var(--line)}.nlh-main-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1160px){.nlh-workspace{grid-template-columns:minmax(0,1fr)}.nlh-map-shell{position:relative;top:0;height:450px;min-height:350px}.nlh-listing{grid-template-columns:70px minmax(160px,2fr) 95px 105px 110px 16px}}
@media(max-width:860px){body:has(.nlh-board-view) .layout{display:block;padding:1rem .65rem 6.3rem}body:has(.nlh-board-view) .side{display:none}.nlh-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.nlh-status-box{grid-column:1/-1}.nlh-main-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:660px){.nlh-heading h1{font-size:1.4rem}.nlh-controls{flex-wrap:wrap}.nlh-listing{grid-template-columns:60px minmax(0,1fr) auto;grid-template-rows:auto auto;gap:.4rem}.nlh-thumbnail{grid-row:span 2;width:60px;height:67px}.nlh-thumb{width:60px;height:67px}.nlh-rent{grid-column:3;grid-row:1}.nlh-date{grid-column:2;grid-row:2}.nlh-allocation{grid-column:3;grid-row:2}.nlh-chevron{display:none}.nlh-main-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.nlh-map-shell{min-height:350px;height:440px}.nlh-view-toggle button{padding:.36rem .5rem;font-size:.73rem}}

/* 3.5.8: city and applicant type visible in every live listing, including split/mobile. */
.nlh-city-line{display:flex;align-items:center;gap:.3rem;margin-top:.27rem;margin-bottom:.12rem;min-width:0;font-size:.77rem;font-weight:750;color:var(--ink)}
.nlh-city-line .ic,.nlh-city-line svg{width:13px;height:13px;flex:none;color:var(--delft)}
.nlh-city-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.nlh-tagline{margin-top:.24rem;align-items:center}
.nlh-profile-badge{display:inline-flex;align-items:center;border-radius:6px;padding:2px 7px;line-height:1.4;font-size:.69rem;font-weight:800;border:1px solid transparent}
.nlh-profile-student,.nlh-profile-both{color:#1450a3;background:#e7f0ff;border-color:#b7d0ff}
.nlh-profile-worker{color:#136448;background:#e4f7ed;border-color:#b3e7d0}
.nlh-profile-starter,.nlh-profile-general{color:#594489;background:#f0eafe;border-color:#ddd0f8}
.nlh-profile-unknown{color:#80560c;background:#fff5e0;border-color:#f0d69a}
.nlh-tagline .nlh-household-chip{font-weight:500;color:var(--muted);background:var(--surface-2)}
@media(max-width:660px){.nlh-city-line{font-size:.74rem}.nlh-profile-badge{font-size:.68rem}.nlh-property b{-webkit-line-clamp:2}}

/* 3.4.9: readable filters and more purposeful map interaction. Other pages unchanged. */
.nlh-filter-panel{padding:1rem 1.05rem;border-radius:17px;box-shadow:0 3px 18px rgba(23,48,90,.04)}
.nlh-main-filters{display:grid;grid-template-columns:repeat(5,minmax(118px,1fr)) minmax(180px,1.45fr);gap:.7rem;align-items:end}
.nlh-field{min-width:0;display:flex;flex-direction:column;gap:.32rem;color:var(--ink);font-size:.76rem;font-weight:700}
.nlh-field>span{padding-inline:.15rem;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nlh-main-filters .nlh-field select,.nlh-main-filters .nlh-field input,.nlh-extra-grid .nlh-field select,.nlh-extra-grid .nlh-field input{
 width:100%;min-width:0;height:43px;border:1px solid var(--line-2);background:var(--surface);border-radius:11px;padding:.48rem .8rem;
 color:var(--ink);font-size:.81rem;font-weight:500;outline-offset:2px;
}
.nlh-field :is(select,input):focus-visible{outline:2px solid var(--delft);border-color:var(--delft)}
.nlh-filter-actions{display:flex;align-items:center;gap:.6rem;border-top:1px solid var(--line);padding-top:.7rem;margin-top:.8rem;flex-wrap:wrap}
.nlh-shortcuts-label{font-size:.73rem;color:var(--muted);font-weight:600}
.nlh-shortcuts{display:flex;flex-wrap:wrap;gap:.3rem}
.nlh-shortcut{padding:.34rem .75rem;color:var(--ink);border-radius:999px;background:var(--surface-2);border:1px solid var(--line-2);font-size:.75rem;cursor:pointer;font-weight:600}
.nlh-shortcut.selected{background:var(--deep);color:#fff;border-color:var(--deep)}
.nlh-shortcut:hover:not(.selected){border-color:var(--delft)}
.nlh-filter-spacer{flex:1}.nlh-active-filters{font-size:.72rem;color:var(--muted);white-space:nowrap}
.nlh-filter-actions .btn{min-height:35px;font-size:.78rem;padding:.36rem .6rem}
.nlh-extra-filters{margin-top:.7rem}
.nlh-extra-filters summary{font-size:.79rem;font-weight:650;padding:.3rem .1rem}
.nlh-extra-grid{display:grid;grid-template-columns:repeat(3,minmax(135px,1fr)) auto;align-items:end;gap:.7rem;padding-top:.6rem}
.nlh-extra-grid select{max-width:none;min-width:0}
.nlh-verified-toggle{display:flex;gap:.45rem;align-items:center;justify-content:center;min-height:43px;border:1px solid var(--line-2);border-radius:10px;padding:.4rem .65rem;font-size:.8rem;cursor:pointer}
.nlh-verified-toggle input{accent-color:var(--delft);width:16px;height:16px}
.nlh-coverage{color:#ad6c08;font-size:.73rem;max-width:260px;line-height:1.3}
.nlh-row-selected{border-color:var(--delft);background:color-mix(in srgb,var(--surface) 95%,var(--delft));box-shadow:0 0 0 2px color-mix(in srgb,var(--delft) 18%,transparent)}
.nlh-workspace[data-mode="split"]{grid-template-columns:minmax(0,1.4fr) minmax(380px,1fr)}
.nlh-map-shell{border-radius:18px;box-shadow:0 5px 20px rgba(25,45,87,.08)}
.tm-mark.nlh-cluster{width:32px;height:32px;margin:-16px 0 0 -16px;color:white;background:#204eb3;border:3px solid #fff;
 box-shadow:0 2px 10px rgba(15,45,110,.28);font-size:.69rem;font-weight:800;display:flex;align-items:center;justify-content:center}
.tm-mark.nlh-selected{outline:3px solid rgba(37,103,222,.35);outline-offset:3px}
.nlh-map-preview{max-width:275px;inset-inline-end:12px;top:14px}
@media(max-width:1440px){.nlh-main-filters{grid-template-columns:repeat(3,minmax(0,1fr))}.nlh-search{grid-column:3}}
@media(max-width:1160px){.nlh-workspace[data-mode="split"]{grid-template-columns:minmax(0,1fr)}.nlh-map-shell{position:relative;top:0;min-height:410px;height:470px}}
@media(max-width:760px){.nlh-main-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.nlh-search{grid-column:1/-1}.nlh-extra-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nlh-filter-panel{padding:.75rem}.nlh-filter-actions{gap:.4rem}.nlh-shortcuts-label{width:100%}}
@media(max-width:440px){.nlh-extra-grid{grid-template-columns:minmax(0,1fr)}.nlh-filter-actions .btn{flex-grow:1}.nlh-filter-spacer{display:none}.nlh-active-filters{width:100%}}

/* 3.5.0: cohesive navigation, secondary routes, readable audit */
.nlh-section-nav{display:flex;gap:.5rem;flex-wrap:wrap;margin:0 0 1rem;padding:.25rem 0}
.nlh-section-nav a{border:1px solid var(--line);background:var(--surface);border-radius:11px;padding:.55rem .85rem;color:var(--text);font-size:.9rem;text-decoration:none}
.nlh-section-nav a.on{background:var(--delft);color:#fff;border-color:var(--delft)}
.nlh-audit-pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:550px;max-height:240px;overflow:auto;font-size:.8rem}
.nlh-report-link{text-decoration:none;color:inherit}
@media(max-width:860px){.bottom{display:flex;justify-content:space-around;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}.bottom a{flex:1;min-width:57px}.nlh-section-nav{position:relative;z-index:1}}

.nlh-audit-change{display:flex;align-items:baseline;gap:.75rem;justify-content:space-between;border-bottom:1px solid var(--line);padding:.45rem 0}
.nlh-audit-change span{overflow-wrap:anywhere;text-align:start}

/* 3.5.1 per-source scan speed */
.speed-sel { display: flex; align-items: center; gap: .35rem; margin-top: .3rem; font-size: .78rem; color: var(--muted, #6b7280); white-space: nowrap; }
.speed-sel select { padding: .12rem .35rem; font-size: .8rem; min-width: 4.4rem; width: auto; }

/* 3.5.2: zoom controls must never be covered by selected property's preview.
   Pin controls to the inline start, preview to the inline end (RTL-safe). */
.nlh-map .tm-ctl {inset-inline-start:12px;inset-inline-end:auto;top:12px;z-index:9;}
.nlh-map-preview {inset-inline-start:auto;inset-inline-end:12px;top:12px;z-index:4;}
@media(max-width:520px){
  .nlh-map-preview {top:auto;bottom:42px;max-width:min(255px,calc(100% - 72px));}
  .nlh-map .tm-ctl {top:12px;inset-inline-start:10px;}
}

/* 3.5.4: one-step, individually selected suspected-listing review. */
.nlh-review-items{display:grid;gap:.55rem;max-height:min(45vh,460px);overflow-y:auto;padding:.4rem 2px;margin:.65rem 0 1rem;overscroll-behavior:contain}
.nlh-review-item{display:flex;gap:.7rem;align-items:start;padding:.72rem .85rem;border:1px solid var(--line);border-radius:11px;cursor:pointer;background:var(--surface)}
.nlh-review-item:hover{border-color:var(--delft)}
.nlh-review-item input{margin-top:.35rem;flex-shrink:0}
.nlh-review-item span{display:grid;gap:.18rem;min-width:0;overflow-wrap:anywhere}
.nlh-review-item small{color:var(--muted);font-size:.78rem}
.nlh-review-item a{width:fit-content;text-decoration:underline;color:var(--delft)}
.nlh-request-editor{max-height:min(67vh,700px);overflow-y:auto;padding:.35rem 2px;overscroll-behavior:contain}
@media(max-width:640px){.nlh-review-items{max-height:42vh}.nlh-review-item{padding:.65rem}}

/* 3.5.5: customer alert pause stays outside the approval editor. */
.nlh-customer-pause{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px}
.nlh-customer-pause p{margin:4px 0 0}
@media(max-width:560px){.nlh-customer-pause{align-items:stretch;flex-direction:column}.nlh-customer-pause button{width:100%}}

/* ---------------------------------------------------------------- 3.6.0 Sources page */
.src-sum { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .7rem; margin-bottom: 1rem; }
.src-sum .kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-l); padding: .7rem .9rem;
  display: flex; flex-direction: column; }
.src-sum .kpi b { font-size: 1.35rem; font-variant-numeric: tabular-nums; }
.srow { display: grid; grid-template-columns: minmax(170px, 1.5fr) minmax(120px, 1fr) minmax(95px, .8fr) minmax(105px, .9fr)
  minmax(80px, .6fr) minmax(150px, 1.4fr) minmax(190px, 1.6fr); gap: .5rem .9rem; align-items: start;
  padding: .75rem 0; border-top: 1px solid var(--line); }
.srow:first-child { border-top: 0; }
.srow > div { display: flex; flex-direction: column; min-width: 0; gap: .1rem; }
.srow .s-name { gap: .25rem; } .srow .s-name .badge { align-self: flex-start; }
.srow small { font-size: .74rem; line-height: 1.35; overflow-wrap: anywhere; }
.srow b { font-variant-numeric: tabular-nums; }
.srow .s-state { flex-direction: row; flex-wrap: wrap; align-items: baseline; } .srow .s-state small { flex-basis: 100%; }
.srow .s-err span { font-size: .8rem; color: var(--ink-2); overflow-wrap: anywhere; }
.srow .s-err.now { background: var(--bad-soft); border-radius: 8px; padding: .35rem .5rem; }
.srow .s-err.now span, .srow .s-err.now small { color: var(--bad); }
.srow .s-ctl { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; }
.srow .s-ctl .check { margin: 0; } .srow .s-ctl .speed-sel { margin: 0; }
.srow .s-ctl .row { display: flex; flex-wrap: wrap; gap: .3rem; flex-basis: 100%; }
.srow .late { color: var(--bad); font-weight: 700; }
.srow.st-DISABLED { opacity: .72; }
.dot.ERROR { background: var(--bad); box-shadow: 0 0 0 3px var(--bad-soft); }
.dot.PARKED, .dot.DISABLED { background: var(--line-2); }
.banner.ok { background: var(--ok-soft); color: var(--ok); }
details.card > summary { cursor: pointer; padding: .2rem 0; }
@media (max-width: 1100px) {
  .srow { grid-template-columns: 1fr 1fr; }
  .srow .s-name, .srow .s-err, .srow .s-ctl { grid-column: 1 / -1; }
}
.nlh-stale-note { margin: .4rem 0 0; font-size: .8rem; color: var(--warn); }

.srow .parity { color: var(--info); }
.modal ul.sample { margin: .4rem 0 0; padding-inline-start: 1.1rem; font-size: .85rem; }
/* 3.6.8: Sources page — problems listed first */
.src-sum .kpi-bad { border-color: var(--bad, #c0392b); }
.src-sum .kpi-bad b { color: var(--bad, #c0392b); }
.src-problems { grid-column: 1 / -1; background: var(--surface); border: 1px solid var(--bad, #c0392b); border-radius: var(--r-l);
  padding: .6rem .9rem; display: flex; flex-direction: column; gap: .35rem; font-size: .85rem; }
.src-problems > div { display: flex; flex-wrap: wrap; gap: .35rem; align-items: baseline; overflow-wrap: anywhere; }
/* 3.6.9: Sources page — one line per source, problems grouped by cause */
.src-filter { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin: .2rem 0 .8rem; }
.src-filter .chip { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: .3rem .8rem; font: inherit; font-size: .85rem; cursor: pointer; color: var(--ink); }
.src-filter .chip.on { background: var(--ink); color: var(--bg, #fff); border-color: var(--ink); }
.src-filter input { flex: 1 1 160px; min-width: 0; padding: .35rem .7rem; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); font: inherit; }
.src-list { padding: 0; overflow: hidden; }
.sline { border-top: 1px solid var(--line); } .sline:first-child { border-top: 0; }
.sline > summary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto auto auto; gap: .2rem .6rem; align-items: center;
  padding: .65rem .9rem; cursor: pointer; list-style: none; }
.sline > summary::-webkit-details-marker { display: none; }
.sline > summary .nm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; unicode-bidi: plaintext; }
.sline > summary .tag { font-size: .7rem; border: 1px solid var(--line); border-radius: 6px; padding: .05rem .4rem; color: var(--muted); }
.sline > summary .num { font-weight: 800; font-variant-numeric: tabular-nums; }
.sline > summary .when { color: var(--muted); font-size: .75rem; white-space: nowrap; }
.sline > summary .dg { font-size: .72rem; border-radius: 6px; padding: .05rem .4rem; white-space: nowrap; background: var(--surface-2, rgba(0,0,0,.04)); }
.sline > summary .dg:empty { display: none; }
.sline.sev-you > summary .dg { color: var(--bad); font-weight: 600; }
.sline.sev-fix > summary .dg { color: var(--warn); }
.sline.sev-auto > summary .dg { color: var(--muted); }
.sline[open] > summary { background: var(--surface-2, rgba(0,0,0,.03)); }
.sline .srow { border-top: 1px dashed var(--line); }
.src-prob { display: flex; flex-direction: column; gap: .8rem; }
.src-prob .ph { display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: center; }
.src-prob .ph b { flex: 1 1 220px; font-size: .9rem; }
.src-prob .pl { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .4rem; }
.pchip { display: inline-flex; align-items: center; gap: .3rem; border: 1px solid var(--line); border-radius: 999px; padding: .15rem .3rem .15rem .6rem; font-size: .8rem; }
.btn.xs { padding: .1rem .45rem; font-size: .72rem; min-height: 0; }
.src-guide summary { cursor: pointer; } .src-okline { display: flex; gap: .4rem; align-items: center; margin: .2rem 0 .6rem; }
@media (max-width: 640px) {
  .sline > summary { grid-template-columns: auto minmax(0, 1fr) auto auto auto; }
  .sline > summary .when { display: none; }
}
.ov-prob { display: flex; flex-wrap: wrap; gap: .2rem .5rem; align-items: baseline; padding: .6rem .75rem; border: 1px solid var(--line);
  border-radius: var(--r-l, 12px); margin-bottom: .5rem; color: var(--ink); }
.ov-prob:hover { text-decoration: none; border-color: var(--line-2); }
.ov-prob b { flex: 1 1 200px; font-size: .88rem; } .ov-prob small { flex-basis: 100%; font-size: .74rem; }
.ov-prob.sev-you { border-color: color-mix(in srgb, var(--bad) 45%, var(--line)); background: var(--bad-soft); }
.ov-prob.sev-fix { border-color: color-mix(in srgb, var(--warn) 45%, var(--line)); }
/* 3.6.9: rent range filter on the live board */
.nlh-rent .rentrow { display: flex; gap: .4rem; } .nlh-rent .rentrow input { flex: 1 1 0; min-width: 0; }
.nlh-rent .rentchips { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .35rem; }
.nlh-rent .chip { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: .15rem .55rem; font: inherit; font-size: .75rem; cursor: pointer; color: var(--ink); }
.nlh-main-filters .nlh-rent { grid-column: 1 / -1; }
.nlh-rent .rentrow input { width: auto; }
@media (min-width: 761px) { .nlh-rent { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .5rem; }
  .nlh-rent > span { flex-basis: 100%; } .nlh-rent .rentrow { flex: 0 1 340px; } .nlh-rent .rentchips { margin-top: 0; } }

/* 4.0 Sources: one card per source */
.src-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: .9rem; }
.src-card h3 { margin: 0; font-size: 1.05rem; }
.src-card .tag { font-size: .72rem; border: 1px solid var(--line); border-radius: 6px; padding: .05rem .45rem; color: var(--muted); }
.src-card.sev-you { border-color: var(--bad, #c0392b); }
.src-card.sev-fix { border-color: var(--warn, #d68910); }
.src-card .statline { margin: .5rem 0; }
.src-card .row { flex-wrap: wrap; gap: .4rem; align-items: center; }

/* 4.1 customer setup */
.step { margin-bottom: .9rem; }
.step h3 { display: flex; gap: .45rem; align-items: center; margin: 0 0 .6rem; font-size: 1.02rem; flex-wrap: wrap; }
.step .hint { display: block; margin-top: .25rem; line-height: 1.5; }
.step.more > summary { cursor: pointer; list-style: none; padding: .1rem 0; }
.step.more > summary::-webkit-details-marker { display: none; }
.step.more > summary::before { content: "▸ "; } .step.more[open] > summary::before { content: "▾ "; }
.steps-help { margin: .2rem 0 .7rem; padding-inline-start: 1.2rem; line-height: 1.7; }
.pvex { margin: .5rem 0 0; padding-inline-start: 1.1rem; line-height: 1.7; }
.row.nc { border-top: 1px solid var(--line); padding: .45rem 0; align-items: center; }
.grow1 { flex: 1 1 220px; min-width: 0; }
.ready { border: 1px solid var(--line); border-radius: var(--r-l, 12px); padding: .7rem .9rem; margin-top: .7rem; }
.ready.ok { border-color: var(--ok); background: var(--ok-soft); } .ready.bad { border-color: var(--bad); background: var(--bad-soft); }
.ready ul { list-style: none; padding: 0; margin: .4rem 0; line-height: 1.9; } .ready li.bad { color: var(--bad); font-weight: 600; }
.btn.wrap { white-space: normal; text-align: start; height: auto; line-height: 1.4; padding-block: .4rem; max-width: 100%; }
select.policy { display: none; } .show-pol select.policy { display: inline-block; }
.bad-txt{color:var(--bad)}
/* 4.2.1 matched customers on the board */
.nlh-tagline .match-chip, .match-chip { background: var(--ok-soft); border-color: var(--ok); color: var(--ok); font-weight: 700; }
.nlh-cust select { min-width: 150px; }
.banner.fits a { font-weight: 700; }
/* 4.3.0 Plaza eligibility */
.pe-box{border:1px solid var(--line-2);border-radius:12px;padding:10px 12px;background:var(--surface-2)}
.pe-box h3{margin:0 0 6px}.pe-box h4{margin:8px 0 4px;font-size:.85rem}.pe-box .tbl th{width:38%}
.pe-chip.pe-student_only{border-color:#7c5cff}.pe-chip.pe-study_and_work_advertised{border-color:#1a9c5b}
.pe-chip.pe-youth_target,.pe-chip.pe-student_or_youth{border-color:#d68a00}
.pe-chip.pe-unknown,.pe-chip.pe-student_target_unverified,.pe-chip.pe-general_unverified{border-style:dashed}
.pe-report{max-height:60vh;overflow:auto}.pe-report td{vertical-align:top}
/* 4.3.1 map: precision, price pills, base maps */
.tm-mark.near { box-shadow: 0 0 0 4px rgba(29,74,176,.25), var(--lift, 0 1px 3px rgba(0,0,0,.3)); }
.tm-mark.price { width: auto; height: auto; min-width: 0; margin: 0; padding: 2px 7px; border-radius: 12px; border-width: 2px;
  color: #fff; font: 700 .72rem/1.3 system-ui, sans-serif; white-space: nowrap; direction: ltr; z-index: 1; }
.tm-mark.price.nlh-selected { z-index: 3; transform-origin: center; }
.tm-mark.price.approx { opacity: .7; }
.tm-mark.nlh-cluster.all-v { background: #0f9a6b; } .tm-mark.nlh-cluster.none-v { background: #b26f00; }
.tm-circle.near { fill: rgba(29,74,176,.07); stroke-dasharray: 3 4; }
.tm[data-layer="photo"] .tm-tile { filter: none !important; }
.tm-ctl button.tm-layer { font-size: 1rem; }
/* 4.3.2 compact listings table */
.ltable-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;max-width:100%}
.ltable{width:100%;border-collapse:collapse;direction:ltr;text-align:left;font-size:.85rem;min-width:1050px}
.ltable th{position:sticky;top:0;background:var(--surface);z-index:1;border-bottom:1px solid var(--line);padding:0}
.ltable th button{all:unset;cursor:pointer;display:block;padding:.6rem .55rem;font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap}
.ltable th[aria-sort="ascending"] button,.ltable th[aria-sort="descending"] button{color:var(--ink)}
.ltable th button:focus-visible{outline:2px solid var(--delft);outline-offset:-2px}
.ltable td{padding:.55rem;border-bottom:1px solid var(--line);vertical-align:middle;white-space:nowrap}
.ltable td.nm{white-space:normal;min-width:190px;max-width:300px}.ltable td.nm .sub{margin-top:2px;display:flex;flex-wrap:wrap;gap:3px;font-size:.75rem;color:var(--ink-2)}
.ltable .n{text-align:right;font-variant-numeric:tabular-nums}
.ltable tbody tr{cursor:pointer}.ltable tbody tr:hover,.ltable tbody tr:focus-visible{background:var(--surface-2);outline:none}
.ltable tbody tr.sel{background:color-mix(in srgb,var(--delft) 8%,transparent)}
.ltable .src{display:inline-block;border:1px solid var(--line-2);background:var(--surface-2);border-radius:7px;padding:1px 7px;font-size:.75rem}
.ltable .nlh-statuses .badge{font-size:.68rem}
.nlh-workspace[data-mode="table"] .nlh-results{min-width:0}
.ltable .nlh-statuses{display:flex;flex-wrap:nowrap;gap:3px;align-items:center}
.ltable td.nm .sub .elig-chip{font-size:.66rem;padding:0 6px;line-height:1.5}
.ltable td{padding:.42rem .55rem}
.ltable td.nm,.ltable th:first-child{position:sticky;left:0;background:var(--surface);z-index:2}
.ltable tbody tr:hover td.nm{background:var(--surface-2)}
@media(max-width:700px){.ltable td.nm{min-width:150px;max-width:180px}}

/* 4.6.1 — World Monitor-inspired staff intelligence, powered by real NLHR events.
   CSS-only visual layout; no inline styles, CDN, or external JS dependencies. */
.nlhm { margin-top: 1.2rem; }
.nlhm-top, .nlhm-section-head { display: flex; gap: .8rem; justify-content: space-between; align-items: center; flex-wrap: wrap; }
.nlhm-top { margin-bottom: .9rem; }
.nlhm-top h2, .nlhm-section-head h3 { margin: 0; display: flex; align-items: center; gap: .4rem; }
.nlhm-top p { font-size: .83rem; margin: .15rem 0 0; }
.nlhm-updated { font-size: .75rem; color: var(--muted); display: flex; align-items: center; gap: .3rem; }
.nlhm-controls { display: inline-flex; border: 1px solid var(--line); padding: .18rem; border-radius: 10px; gap: .12rem; flex-wrap: wrap; background: var(--sunk); }
.nlhm-controls button { border: 0; color: var(--ink-2); background: transparent; border-radius: 7px; padding: .3rem .64rem; font-size: .77rem; cursor: pointer; }
.nlhm-controls button:hover { color: var(--ink); background: var(--surface-2); }
.nlhm-controls button.active { background: var(--surface); color: var(--delft); box-shadow: var(--lift); font-weight: 750; }
.nlhm-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; margin: .7rem 0 1rem; }
.nlhm-metric { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: .7rem 1rem; display: flex; flex-direction: column; border-inline-start: 3px solid var(--delft); }
.nlhm-metric b { font-size: 1.65rem; line-height: 1.25; font-variant-numeric: tabular-nums; }
.nlhm-metric span { color: var(--muted); font-size: .75rem; }
.nlhm-metric.price { border-inline-start-color: var(--signal); }
.nlhm-metric.other { border-inline-start-color: var(--warn); }
.nlhm-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 1rem; }
.nlhm-section { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-l); padding: 1rem; min-width: 0; }
.nlhm-section-head { margin-bottom: .8rem; }
.nlhm-section-head .muted { font-size: .72rem; }
.nlhm-section-head a { font-size: .8rem; }
.nlhm-chart { width: 100%; height: auto; display: block; }
.nlhm-chart text { fill: var(--muted); font-family: var(--font); font-size: 12px; direction: ltr; }
.nlhm-baseline { stroke: var(--line-2); stroke-width: 1.7; }
.nlhm-guide { stroke: var(--line); stroke-width: 1; stroke-dasharray: 3 6; }
.nlhm-bar { rx: 2px; }
.nlhm-bar.new { fill: var(--delft); } .nlhm-bar.price { fill: var(--signal); } .nlhm-bar.other { fill: var(--warn); }
.nlhm-legend { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; font-size: .75rem; color: var(--muted); }
.nlhm-legend span::before { content: ''; width: 8px; height: 8px; margin-inline-end: 5px; display: inline-block; background: var(--delft); border-radius: 2px; }
.nlhm-legend .price::before { background: var(--signal); } .nlhm-legend .other::before { background: var(--warn); }
.nlhm-sources { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .5rem; }
.nlhm-source { border: 1px solid var(--line); background: var(--surface-2); border-radius: var(--r-s); padding: .52rem .65rem; display: flex; flex-direction: column; gap: .15rem; color: var(--ink-2); min-width: 0; }
.nlhm-source:hover { border-color: var(--delft); text-decoration: none; }
.nlhm-source-name { display: flex; align-items: center; gap: .4rem; min-width: 0; }
.nlhm-source-name b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1; font-size: .79rem; }
.nlhm-source-name small, .nlhm-source-sub { font-size: .68rem; color: var(--muted); }
.nlhm-source-name i { height: 8px; width: 8px; flex: none; background: var(--warn); border-radius: 50%; }
.nlhm-source.ok .nlhm-source-name i { background: var(--ok); }
.nlhm-source.bad .nlhm-source-name i { background: var(--bad); }
.nlhm-source.off { opacity: .67; }
.nlhm-source.off .nlhm-source-name i { background: var(--muted); }
.nlhm-source-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nlhm-events { margin-top: 1rem; }
.nlhm-timeline { display: flex; flex-direction: column; }
.nlhm-event { width: 100%; display: flex; align-items: center; text-align: start; gap: .7rem; border: 0; border-bottom: 1px solid var(--line); padding: .68rem .3rem; background: transparent; cursor: pointer; }
.nlhm-event:last-child { border-bottom: 0; }
.nlhm-event:hover, .nlhm-event:focus-visible { background: var(--surface-2); border-radius: 7px; }
.nlhm-event-dot { flex: none; background: var(--delft); height: 9px; width: 9px; border-radius: 50%; }
.nlhm-event.price .nlhm-event-dot { background: var(--signal); }
.nlhm-event.other .nlhm-event-dot { background: var(--warn); }
.nlhm-event-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.nlhm-event-info b { font-size: .84rem; color: var(--ink); overflow-wrap: anywhere; }
.nlhm-event-info small, .nlhm-event-right small { font-size: .72rem; color: var(--muted); }
.nlhm-event-right { display: flex; flex-direction: column; align-items: end; text-align: end; white-space: nowrap; }
.nlhm-event-right b { font-variant-numeric: tabular-nums; font-size: .83rem; }
.nlhm-empty, .nlhm-note { font-size: .75rem; }
.nlhm-empty { padding: 1.25rem .5rem; text-align: center; }
.nlhm-note { margin: .6rem 0 0; }
@media (max-width: 1080px) { .nlhm-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) {
  .nlhm-summary { gap: .35rem; }
  .nlhm-metric { padding: .55rem; } .nlhm-metric b { font-size: 1.25rem; }
  .nlhm-metric span { font-size: .65rem; }
  .nlhm-sources { grid-template-columns: 1fr; }
  .nlhm-section { padding: .8rem; }
  .nlhm-event { gap: .4rem; }
}

/* 4.6.2 monitor: a source not scanned yet is grey (not "healthy"); chart labels readable on a phone */
.nlhm-source.wait .nlhm-source-name i { background: var(--muted); }
.nlhm-source.off .nlhm-source-name i { background: var(--line-2); }
@media (max-width: 600px) { .nlhm-chart text { font-size: 22px; } }
