/* Lead Finder · Design System v3
   One hue per meaning, used consistently everywhere:
   teal = primary action · green = call now / success · blue = review first / info
   amber = low priority / warning · red = excluded / danger */

:root {
  color-scheme: light;
  --bg: #f4f6f5;
  --panel: #ffffff;
  --panel-soft: #f7f9f8;
  --text: #17201e;
  --muted: #5c6a66;
  --line: #dfe6e3;
  --accent: #0d7377;
  --accent-hover: #0a5c5f;
  --accent-light: #e2f0ef;
  --accent-text: #0a5c5f;
  --good: #1e8a4c;      --good-light: #e0f3e8; --good-text: #166b3b;
  --info: #2563eb;      --info-light: #e3ecfd; --info-text: #1d4ed8;
  --warn: #c26a04;      --warn-light: #faeeda; --warn-text: #9a5403;
  --bad: #d33030;       --bad-light: #fbe6e5;  --bad-text: #b02525;
  --ink: #101a18;
  --ink-soft: #233331;
  --ink-line: rgba(255,255,255,.14);
  --ink-muted: #9fb3ae;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(14,28,26,.05), 0 1px 3px rgba(14,28,26,.06);
  --shadow-md: 0 4px 12px rgba(14,28,26,.09), 0 2px 4px rgba(14,28,26,.05);
  --shadow-lg: 0 16px 48px rgba(14,28,26,.17), 0 4px 12px rgba(14,28,26,.08);
  --sidebar-w: 196px;
  --speed: .16s;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  background: var(--bg); color: var(--text);
  line-height: 1.5; font-size: 14px;
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
button { font: inherit; }

/* ---------- layout ---------- */

.app-shell { max-width:1180px; margin:0 auto; padding:18px 20px 64px; }
.app-header { display:flex; align-items:center; gap:14px; padding:6px 2px 18px; }
.primary-tabs { margin-left:auto; display:flex; gap:2px; padding:3px; border:1px solid var(--line); border-radius:11px; background:var(--panel); box-shadow:var(--shadow-sm); }
.primary-tabs a { padding:7px 14px; border-radius:8px; color:var(--muted); font-size:.82rem; font-weight:650; text-decoration:none; }
.primary-tabs a.active { background:var(--accent); color:#fff; }
.review-count { margin-left:5px; padding:1px 6px; border-radius:99px; background:var(--warn); color:#fff; font-size:.66rem; }
.sales-links { display:flex; gap:4px; }
.sales-links a { color:var(--muted); font-size:.76rem; padding:6px 7px; text-decoration:none; border-radius:7px; }
.sales-links a:hover,.sales-links a.active { background:var(--panel); color:var(--text); }

.sidebar {
  width: var(--sidebar-w); flex: 0 0 var(--sidebar-w);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
  background: var(--ink); color: var(--ink-muted);
}
.brand { display:flex; align-items:center; gap:10px; font-weight:750; font-size:.98rem; letter-spacing:-.01em; color:var(--text); text-decoration:none; }
.brand-mark { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:var(--accent); color:#fff; }
.brand-mark svg { display:block; }
.sidebar nav { display: flex; flex-direction: column; gap: 4px; padding: 0 12px; }
.sidebar nav a {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: var(--r-sm);
  color: var(--ink-muted); text-decoration: none; font-weight: 600; font-size: .92rem;
  transition: background var(--speed), color var(--speed);
}
.sidebar nav a:hover { background: rgba(255,255,255,.09); color: #fff; text-decoration: none; }
.sidebar nav a.active { background: var(--ink-soft); color: #fff; box-shadow: inset 3px 0 0 var(--accent); }
.nav-section { margin:14px 12px 3px; color:#7d8b87; font-size:.65rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.nav-icon { width: 18px; text-align: center; }
.sidebar-foot { margin-top: auto; padding: 16px; font-size: .82rem; }
.stat-chips { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.stat-chip { background: var(--ink-soft); border-radius: var(--r-sm); padding: 7px 11px; color: var(--ink-muted); }
.stat-chip b { color: #f8fafc; }
.sidebar-foot .user-badge { color: var(--ink-muted); border-top: 1px solid var(--ink-line); padding-top: 12px; }

main { min-width:0; padding:0; max-width:none; }
.loading-page { color: var(--muted); padding: 48px; text-align: center; }

.hero {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 28px 32px; margin-bottom: 20px;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--r-lg); box-shadow: var(--shadow-sm);
}
.hero h1 { margin: 0; font-size: 1.55rem; letter-spacing: -.015em; }
.hero p { margin: 6px 0 0; color: var(--muted); }
.hero .cta { white-space: nowrap; }

.page-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.page-head h2 { margin: 0; font-size: 1.3rem; letter-spacing: -.01em; }
.page-head .spacer { flex: 1; }
.eyebrow { font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .7px; color: var(--muted); }
.back-link { display: inline-block; color: var(--muted); font-size: .9rem; font-weight: 600; margin-bottom: 12px; }
.back-link:hover { color: var(--accent); text-decoration: none; }

/* ---------- controls ---------- */

.filters { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

input, select, textarea {
  font: inherit; color: var(--text); background: var(--panel);
  border: 1px solid var(--line); border-radius: var(--r-sm); padding: 8px 12px;
  transition: border-color var(--speed), box-shadow var(--speed);
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-light); }
textarea { width: 100%; resize: vertical; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 8px 15px; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--panel); color: var(--text);
  font-weight: 600; cursor: pointer;
  transition: border-color var(--speed), color var(--speed), background var(--speed), box-shadow var(--speed), transform var(--speed);
}
.btn:hover { border-color: var(--accent); color: var(--accent); }
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-light); }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 2px 8px rgba(13,115,119,.3); }
.btn.primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: #fff; }
.btn.danger { color: var(--bad-text); border-color: var(--bad-light); }
.btn.danger:hover { background: var(--bad-light); }
.btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }

.icon-btn { width: 44px; min-width: 44px; height: 44px; padding: 0; display: inline-grid; place-items: center; }
.icon-btn.small { width: 34px; min-width: 34px; height: 34px; border-radius: 9px; }
.icon-btn.small .icon svg { width: 17px; height: 17px; }
.btn.dark { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn.dark:hover { background: var(--ink-soft); border-color: var(--ink-soft); color: #fff; }
.icon { display: inline-grid; place-items: center; line-height: 0; }
.icon svg { width: 20px; height: 20px; transition: transform var(--speed); }
.icon-btn:hover .icon svg { transform: scale(1.1); }

/* borderless inline text actions */
.text-btn {
  border: 0; background: none; padding: 4px 8px;
  color: var(--accent-text); font-weight: 650; font-size: .82rem;
  cursor: pointer; border-radius: 7px; text-decoration: none;
  display: inline-flex; align-items: center; gap: 5px;
}
.text-btn:hover { background: var(--accent-light); color: var(--accent-hover); text-decoration: none; }
.text-btn:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--accent-light); }
.text-btn.danger { color: var(--bad-text); }
.text-btn.danger:hover { background: var(--bad-light); color: var(--bad); }
.text-btn.icon-text-btn { margin-left: auto; color: var(--muted); padding: 5px 7px; }
.text-btn.icon-text-btn:hover { color: var(--text); background: var(--panel-soft); }
.text-btn .icon svg { width: 15px; height: 15px; }

.badge {
  display: inline-block; margin-right: 4px; padding: 3px 10px;
  border-radius: var(--r-pill); border: 1px solid var(--line);
  background: var(--panel-soft); color: var(--muted);
  font-size: .74rem; font-weight: 700; white-space: nowrap;
}
.badge.small { font-size: .68rem; padding: 2px 8px; }
.badge.no_website, .badge.no_website_found { background: var(--info-light); color: var(--info-text); border-color: transparent; }
.badge.social_only, .badge.ambiguous_match { background: var(--warn-light); color: var(--warn-text); border-color: transparent; }
.badge.has_website, .badge.website_found { background: var(--good-light); color: var(--good-text); border-color: transparent; }
.badge.st-new { background: var(--panel-soft); color: var(--muted); }
.badge.st-interested, .badge.st-won { background: var(--good-light); color: var(--good-text); border-color: transparent; }
.badge.st-callback, .badge.st-pitch_approved, .badge.st-queued { background: var(--info-light); color: var(--info-text); border-color: transparent; }
.badge.st-not_reached, .badge.st-contacted { background: var(--warn-light); color: var(--warn-text); border-color: transparent; }
.badge.st-lost, .badge.st-rejected, .badge.st-do_not_call { background: var(--bad-light); color: var(--bad-text); border-color: transparent; }
.badge.rush { background: var(--warn-light); color: var(--warn-text); border-color: transparent; }
.badge.due { background: var(--bad-light); color: var(--bad-text); border-color: transparent; }
.badge.verified { background: var(--good-light); color: var(--good-text); border-color: transparent; }
.badge.pending { background: #e7edeb; color: var(--muted); }
.badge.failed { background: var(--bad-light); color: var(--bad-text); border-color: transparent; }

/* ---------- surfaces ---------- */

.panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 20px 24px; box-shadow: var(--shadow-sm); margin-bottom: 18px; }
.panel h2 { margin: 0 0 14px; font-size: 1.08rem; letter-spacing: -.01em; }
.panel h3 { margin: 18px 0 8px; font-size: .76rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .6px; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }

.card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-md); padding: 12px 14px; box-shadow: var(--shadow-sm); cursor: pointer; transition: box-shadow var(--speed), border-color var(--speed), transform var(--speed); }
.card:hover { box-shadow: var(--shadow-md); border-color: var(--accent-light); transform: translateY(-1px); }
.card .card-badges, .card-foot { display: flex; align-items: center; gap: 6px; margin-top: 10px; min-height: 24px; }
.card .assignee { float: right; background: var(--accent-light); color: var(--accent-text); font-size: .72rem; font-weight: 800; border-radius: var(--r-pill); padding: 2px 8px; }

table { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--panel); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-sm); }
th, td { text-align: left; padding: 13px 16px; border-bottom: 1px solid var(--line); font-size: .9rem; vertical-align: top; }
th { background: var(--panel-soft); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); }
tbody tr:last-child td { border-bottom: 0; }
tbody tr { transition: background var(--speed); }
tbody tr:hover { background: var(--panel-soft); }
tr[hidden] { display: none; }

.kv { display: grid; grid-template-columns: minmax(130px, auto) 1fr; gap: 7px 18px; font-size: .9rem; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; }

.hint { color: var(--muted); font-size: .85rem; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .82rem; background: var(--panel-soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px; white-space: pre-wrap; max-height: 300px; overflow: auto; }
.form-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 10px 0; }
.form-row label { font-size: .88rem; color: var(--muted); }

.status-msg { font-size: .9rem; font-weight: 600; color: var(--muted); }
.status-msg.ok { color: var(--good-text); }
.status-msg.warning { color: var(--warn-text); }
.status-msg.error { color: var(--bad-text); }

.toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); background: var(--ink); color: #f8fafc; padding: 12px 20px; border-radius: var(--r-md); box-shadow: var(--shadow-lg); z-index: 99; font-size: .92rem; font-weight: 600; max-width: 80vw; }
.toast.error { background: var(--bad); }

.spinner { display: inline-block; width: 14px; height: 14px; border: 2px solid var(--accent-light); border-top-color: var(--accent); border-radius: 50%; animation: lf-spin .7s linear infinite; vertical-align: -2px; margin-right: 6px; }
@keyframes lf-spin { to { transform: rotate(360deg); } }

/* ---------- calling cockpit ---------- */

.call-wrap { max-width: 1080px; margin: 0 auto; }
.call-progress { height: 6px; border-radius: var(--r-pill); overflow: hidden; background: var(--line); margin-bottom: 18px; }
.progress-bar { height: 100%; background: var(--line); border-radius: var(--r-pill); overflow: hidden; }
.progress-bar > div { height: 100%; background: var(--accent); border-radius: var(--r-pill); transition: width .3s ease; }
.investigation-state { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; padding: 11px 14px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow-sm); font-size: .8rem; color: var(--muted); }
.investigation-state > span:not(.investigation-pct):not(.spinner) { flex: 0 0 auto; }
.investigation-state .progress-bar { flex: 1 1 auto; height: 6px; min-width: 60px; }
.investigation-state .investigation-pct { font-weight: 750; color: var(--text); white-space: nowrap; }
.investigation-state.paused { background: var(--panel); }
.investigation-state.paused .progress-bar > div { background: #b6c2bf; }
.call-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-md); padding: 28px 32px; }
.call-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.call-phone { display: inline-block; margin: 8px 0; font-size: 2.1rem; font-weight: 800; letter-spacing: -.02em; color: var(--accent); }
.call-phone:hover { color: var(--accent-hover); text-decoration: none; }
.call-cols { display: grid; grid-template-columns: 1.25fr 1fr; gap: 28px; margin-top: 22px; }
.call-empty { text-align: center; color: var(--muted); padding: 56px 24px; }
.call-outcomes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.outcome-btn { flex: 1 1 160px; padding: 14px; border-radius: var(--r-md); border: 1px solid var(--line); background: var(--panel); font-weight: 700; cursor: pointer; text-align: left; color: var(--text); transition: border-color var(--speed), box-shadow var(--speed), transform var(--speed), color var(--speed); }
.outcome-btn small { display: block; margin-top: 3px; font-weight: 500; color: var(--muted); font-size: .76rem; }
.outcome-btn:hover { border-color: var(--accent); color: var(--accent); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.outcome-btn.o-interested { border-left: 4px solid var(--good); }
.outcome-btn.o-interested:hover { border-color: var(--good); color: var(--good-text); }
.outcome-btn.o-no_interest, .outcome-btn.o-do_not_call { border-left: 4px solid var(--bad); }
.outcome-btn.o-no_interest:hover, .outcome-btn.o-do_not_call:hover { border-color: var(--bad); color: var(--bad-text); }
.call-guide { margin-top: 26px; }
.call-guide-head { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.call-guide-head h2 { margin: 2px 0 0; font-size: 1.15rem; }
.guide-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.guide-goal { display: inline-block; font-weight: 700; color: var(--accent-text); background: var(--accent-light); border-radius: var(--r-sm); padding: 8px 12px; }
.guide-script { background: var(--panel-soft); border-left: 3px solid var(--accent); border-radius: 0 var(--r-sm) var(--r-sm) 0; padding: 10px 14px; margin: 8px 0; font-size: .92rem; }
.knowledge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; margin-top: 8px; }
.knowledge-grid h3 { margin: 0; font-size: .9rem; }
.guide-knowledge { font-size: .9rem; }
.callback-row { display: none; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 18px; }
.callback-row.visible { display: flex; }
.pitch-list { padding-left: 20px; }
.pitch-list li { margin: 4px 0; }

/* ---------- board ---------- */

/* A kanban is columns side by side: one lane per stage, cards stacked down it,
   the board scrolling sideways when the stages outgrow the window. */
.board { display: flex; flex-direction: row; align-items: flex-start; gap: 14px;
  overflow-x: auto; padding-bottom: 12px; scroll-snap-type: x proximity; }
.board-col { flex: 0 0 268px; display: flex; flex-direction: column; gap: 8px;
  max-height: calc(100vh - 190px); scroll-snap-align: start; }
.board-cards { display: flex; flex-direction: column; gap: 8px; overflow-y: auto; padding-right: 2px; }
.board-col > h3 { display: flex; align-items: baseline; gap: 6px; margin: 0; font-size: 14px; }
.col-count { color: var(--muted); font-weight: 600; font-size: .82rem; }

/* ---------- timeline ---------- */

.timeline { list-style: none; margin: 0; padding-left: 20px; position: relative; }
.timeline::before { content: ''; position: absolute; left: 4px; top: 6px; bottom: 6px; width: 2px; background: var(--line); border-radius: 2px; }
.timeline li { position: relative; padding: 9px 0 9px 14px; }
.timeline li::before { content: ''; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); position: absolute; left: -20px; top: 14px; box-shadow: 0 0 0 3px var(--panel); }
.timeline li.k-call::before { background: var(--good); }
.timeline li.k-email::before, .timeline li.k-link_sent::before { background: var(--warn); }
.timeline li.k-status_change::before { background: #94a39f; }
.timeline .t-head { font-size: .8rem; color: var(--muted); }
.timeline .t-body { font-size: .92rem; }

/* ---------- candidates / source evidence ---------- */

.source-google_places { background: #e8f0fe; color: #174ea6; }
.source-osm { background: #e6f4ea; color: #176b32; }
.disposition { background: var(--warn-light); color: var(--warn-text); }
.source-evidence { margin: 12px 0; padding: 12px; border: 1px solid var(--line); border-radius: var(--r-md); }
.source-evidence pre { max-height: 280px; overflow: auto; white-space: pre-wrap; font-size: .75rem; background: var(--panel-soft); border-radius: var(--r-sm); padding: 10px; }
.cand { border: 1px solid var(--line); border-radius: var(--r-md); padding: 12px 14px; margin-bottom: 10px; transition: border-color var(--speed); }
.cand.canonical { border-color: var(--good); background: var(--good-light); }
.cand .cand-url { font-weight: 600; overflow-wrap: anywhere; }
.cand .meta { font-size: .8rem; color: var(--muted); }
.match-badges .badge { text-transform: none; }

.quality-score { display: inline-block; font-weight: 800; border-radius: var(--r-sm); padding: 2px 10px; font-size: .8rem; }
.quality-score.bad { background: var(--bad-light); color: var(--bad-text); }
.quality-score.mid { background: var(--warn-light); color: var(--warn-text); }
.quality-score.good { background: var(--good-light); color: var(--good-text); }

/* ---------- Finder ---------- */

.finder-history { display: flex; gap: 10px; overflow-x: auto; padding: 4px 2px 12px; scroll-snap-type: x proximity; }
.finder-history-card { aspect-ratio: 1; width: 148px; flex: 0 0 148px; scroll-snap-align: start; display: flex; flex-direction: column; align-items: flex-start; text-align: left; padding: 14px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); color: var(--text); cursor: pointer; box-shadow: var(--shadow-sm); transition: border-color var(--speed), box-shadow var(--speed), transform var(--speed); }
.finder-history-card:hover { border-color: var(--accent); transform: translateY(-1px); }
.finder-history-card.selected { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-light); }
.history-city { width: 100%; font-size: 1rem; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.history-categories { color: var(--muted); font-size: .75rem; line-height: 1.3; margin-top: 4px; }
.history-count { margin-top: auto; font-size: .8rem; font-weight: 700; }
.finder-history-card time { color: var(--muted); font-size: .68rem; }
.history-warning { color: var(--warn-text); font-size: .7rem; font-weight: 800; }
.history-failed { color: var(--bad-text); font-size: .7rem; font-weight: 800; }
.finder-history-empty { min-height: 80px; display: flex; align-items: center; }

.finder-toolbar { position: relative; display: flex; gap: 14px; align-items: flex-end; padding: 14px 16px; border-radius:14px; flex-wrap: wrap; }
.finder-inputs, .finder-filters { display: flex; align-items: flex-end; gap: 10px; }
.finder-inputs { flex-wrap: wrap; }
.finder-filters { margin-left: auto; flex: 0 0 auto; align-items: center; }
.finder-inputs > #fCity { min-width: 130px; width: 150px; }
.finder-field { display:flex; flex-direction:column; gap:5px; color:var(--muted); font-size:.68rem; font-weight:700; }
.finder-field input,.finder-field select { height:38px; padding:0 10px; border-radius:9px; }
.finder-field select { min-width:76px; }
.finder-field .industry-control { align-self:stretch; margin:0; }
.industry-control { height:38px; padding:0 12px; border-radius:9px; font-weight:600; }
.industry-control span { padding:0 6px; border-radius:99px; background:var(--accent-light); color:var(--accent-text); font-size:.7rem; }
.website-switch { display:flex; align-items:center; gap:9px; height:38px; color:var(--muted); font-size:.76rem; font-weight:650; cursor:pointer; }
.website-switch input { position:absolute; opacity:0; }
.website-switch i { position:relative; width:36px; height:21px; border-radius:99px; background:#d3dcd9; transition:background var(--speed); }
.website-switch i::after { content:''; position:absolute; width:15px; height:15px; top:3px; left:3px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.18); transition:left var(--speed); }
.website-switch input:checked + i { background:var(--accent); }
.website-switch input:checked + i::after { left:18px; }
.website-switch input:focus-visible + i { box-shadow:0 0 0 3px var(--accent-light); }
.source-label { color:var(--muted); font-size:.68rem; font-weight:700; margin-right:2px; }
.finder-tools-row { position: relative; display:flex; justify-content:flex-end; align-items:center; gap:6px; margin:2px 2px 12px; color:var(--muted); font-size:.78rem; }
.finder-tools-row span { margin-right:auto; }
.compact-filter { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: .76rem; font-weight: 700; white-space: nowrap; }
.compact-filter input { width: 64px; min-width: 0; padding: 8px 7px; }
.compact-filter span { display: flex; align-items: center; gap: 3px; }
.finder-submit .icon svg { width: 22px; height: 22px; }
.finder-submit .spinner { margin: 0; }

.anchored-popover { position: absolute; top: calc(100% + 4px); z-index: 30; width: min(620px, calc(100vw - 60px)); max-height: min(72vh, 680px); overflow-y: auto; padding: 18px 20px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); box-shadow: var(--shadow-lg); }
.anchored-popover[hidden] { display: none; }
.industry-popover { left: 16px; }
.ranking-popover { right: 0; max-width: 560px; }
.history-popover { right: 0; width: min(760px, calc(100vw - 60px)); padding: 14px; }
.history-popover .finder-history { padding-bottom: 2px; }
.popover-head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding-bottom: 12px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.popover-head span { color: var(--muted); font-size: .78rem; }
.anchored-popover fieldset { border: 0; border-bottom: 1px solid var(--line); margin: 12px 0; padding: 0 0 12px; }
.anchored-popover legend { font-weight: 800; margin-bottom: 7px; }
.anchored-popover label { color: var(--text); font-size: .88rem; }
.popover-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 12px 0; }
.popover-grid input { width: 88px; }
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 5px 12px; margin: 10px 0; }
.cat-grid label { font-size: .88rem; display: flex; gap: 7px; align-items: center; color: var(--text); }

/* source toggles: checkbox-driven icon buttons */
.source-check { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.source-toggle { width: 38px; min-width: 38px; height: 38px; border-radius: 10px; opacity: .38; filter: grayscale(1); transition: opacity var(--speed), filter var(--speed), box-shadow var(--speed), border-color var(--speed); }
.source-toggle .icon svg { width: 18px; height: 18px; }
.source-check:checked + .source-toggle { opacity: 1; filter: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-light); }
.source-check:focus-visible + .source-toggle { outline: 2px solid var(--accent); outline-offset: 2px; }
.source-check:disabled + .source-toggle { cursor: default; }
.finder-submit.icon-btn { width: 42px; min-width: 42px; height: 42px; border-radius: 11px; }

/* ranking color language: green / blue / amber / red, one rule per bucket */
.ranking-call_now { --ranking-color: var(--good-text); --ranking-tint: var(--good-light); }
.ranking-review_first { --ranking-color: var(--info-text); --ranking-tint: var(--info-light); }
.ranking-low_priority { --ranking-color: var(--warn-text); --ranking-tint: var(--warn-light); }
.ranking-excluded { --ranking-color: var(--bad-text); --ranking-tint: var(--bad-light); }

.bucket-key { display: grid; gap: 6px; margin-top: 12px; }
.bucket-key span { padding: 7px 10px; border-radius: var(--r-sm); font-size: .8rem; font-weight: 800; background: var(--ranking-tint); color: var(--ranking-color); border-left: 4px solid var(--ranking-color); }

.finder-warnings { border: 1px solid var(--warn); background: var(--warn-light); color: var(--warn-text); border-radius: var(--r-md); padding: 12px 16px; margin: 12px 0; }
.finder-warnings ul { margin: 6px 0 0; padding-left: 20px; }
.finder-run-failed { margin-top: 14px; border-color: var(--bad); background: var(--bad-light); color: var(--bad-text); }
.finder-run-failed p { margin-bottom: 0; }

.finder-meta-row { display:flex; align-items:center; gap:14px; margin:16px 2px 10px; color:var(--muted); font-size:.8rem; }
.finder-ranking-head { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-left:auto; }
.finder-ranking-head label { font-size: .85rem; }
.bucket-check { position: absolute; opacity: 0; pointer-events: none; }
.bucket-filter { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 58px; padding: 6px 10px; border: 1px solid var(--ranking-color); border-radius: var(--r-sm); background: transparent; color: var(--ranking-color); font-weight: 800; cursor: pointer; opacity: .45; transition: box-shadow var(--speed), opacity var(--speed), background var(--speed); }
.bucket-check:checked + .bucket-filter { background: var(--ranking-tint); opacity: 1; }
.bucket-check:not(:checked) + .bucket-filter span { visibility: hidden; }
.bucket-check:focus-visible + .bucket-filter { outline: 2px solid var(--ranking-color); outline-offset: 2px; }
.bucket-filter:hover { box-shadow: var(--shadow-sm); }
.lower-buckets { display: inline-block; }
.lower-buckets label { display: block; margin: 6px 0 0 18px; }
.lower-buckets summary, .ranking-reasons summary { cursor: pointer; font-weight: 700; }

.finder-results-table { overflow-x: auto; }
.finder-result-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(430px,1fr)); gap:14px; }
.finder-result-card { background:var(--panel); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-sm); padding:16px 18px; position:relative; transition:transform var(--speed),box-shadow var(--speed),border-color var(--speed); }
.finder-card-head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.finder-card-head h3 { margin:0; font-size:1rem; letter-spacing:-.01em; }
.finder-card-head h3 a { color:var(--text); }
.finder-card-head h3 a:hover { color:var(--accent); }
.finder-card-head .hint { margin-top:3px; }
.rank-grade { min-width:42px; border:0; border-radius:11px; padding:8px 10px; display:flex; flex-direction:column; align-items:center; cursor:help; }
.rank-grade b { font-size:1.05rem; line-height:1.1; }
.rank-grade span { display:none; }
.rank-grade.green { background:var(--good-light); color:var(--good-text); }.rank-grade.blue { background:var(--info-light); color:var(--info-text); }.rank-grade.amber { background:var(--warn-light); color:var(--warn-text); }.rank-grade.red { background:var(--bad-light); color:var(--bad-text); }.rank-grade.neutral { background:#e7edeb; color:var(--muted); }
.finder-card-line { display:flex; align-items:center; gap:7px; min-width:0; margin-top:9px; flex-wrap:wrap; }
.finder-status-line { gap:5px; }
.badge.inline-status { margin-right:0; padding:4px 11px; font-size:.76rem; border-radius:9px; }
.finder-evidence-line { margin-top:6px; }
.finder-evidence-line .hint { font-size:.78rem; }
.finder-card-category { margin-left:auto; color:var(--muted); font-size:.78rem; }
.finder-card-actions { display:flex; align-items:center; gap:2px; margin-top:11px; padding-top:10px; border-top:1px solid var(--line); }
.website-link { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:calc(100% - 140px); color:var(--muted); font-size:.78rem; }
.evidence-btn, .website-portal { width:28px; min-width:28px; height:28px; padding:0; border:0; color:var(--accent-text); background:transparent; }
.evidence-btn:hover, .website-portal:hover { background:var(--accent-light); color:var(--accent); }
.score-pill { min-width:34px; padding:3px 8px; border:1px solid var(--line); border-radius:99px; color:var(--muted); background:var(--panel-soft); font-size:.74rem; font-weight:800; cursor:pointer; }
.score-pill:hover { border-color:var(--accent); color:var(--accent); }
.score-dialog { inset:auto 12px 12px; }
.score-dialog .score-tooltip { display:block; }
.score-tooltip b { display:block; margin-bottom:8px; font-size:1rem; }
.score-tooltip dl { display:grid; grid-template-columns:1fr auto; gap:4px 16px; margin:0; font-size:.8rem; }
.score-tooltip dt { color:var(--muted); }
.score-tooltip dd { margin:0; font-weight:800; }
.finder-hover-actions { display:flex; gap:6px; }
.finder-card-actions .finder-hover-actions { margin-left:auto; }
.finder-hover-actions .decide { opacity:0; transform:translateX(4px); transition:opacity var(--speed), transform var(--speed); }
.finder-result-card:hover .finder-hover-actions .decide, .finder-result-card:focus-within .finder-hover-actions .decide { opacity:1; transform:translateX(0); }
.evidence-popover { position:absolute; z-index:55; left:14px; right:14px; bottom:12px; margin:0; padding:13px 14px; border:1px solid var(--line); border-radius:12px; background:var(--panel); box-shadow:var(--shadow-lg); font-size:.78rem; }
.evidence-popover[hidden] { display:none; }
.evidence-popover-head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding-bottom:8px; border-bottom:1px solid var(--line); }
.evidence-popover-head b { display:flex; align-items:center; gap:5px; color:var(--accent-text); }
.evidence-popover-head .icon { width:15px; height:15px; }
.evidence-popover-head span { color:var(--muted); font-size:.7rem; }
.evidence-readable { display:grid; grid-template-columns:auto 1fr; gap:7px 12px; margin:10px 0; }
.evidence-readable dt { color:var(--muted); }
.evidence-readable dd { margin:0; overflow-wrap:anywhere; }
.evidence-readable small { display:block; margin-top:2px; color:var(--good-text); }
.confirm-dialog { width:min(430px,100%); padding:22px; border-radius:16px; background:var(--panel); box-shadow:var(--shadow-lg); display:grid; grid-template-columns:36px 1fr; gap:0 12px; }
.confirm-dialog h3 { margin:2px 0 5px; font-size:1.08rem; }
.confirm-dialog p { margin:0; color:var(--muted); font-size:.86rem; }
.confirm-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:10px; background:var(--warn-light); color:var(--warn-text); }
.confirm-icon .icon { width:19px; height:19px; }
.confirm-actions { grid-column:1/-1; display:flex; justify-content:flex-end; gap:8px; margin-top:18px; }
.archive-head { justify-content:flex-start; }
.archive-head h2 { margin:0; }.archive-head p { margin:3px 0 0; }
.archive-list { max-width:920px; display:grid; gap:9px; }
.archive-card { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:13px 15px; border:1px solid var(--line); border-radius:var(--r-md); background:var(--panel); box-shadow:var(--shadow-sm); }
.archive-card h3 { margin:0; font-size:.95rem; }.archive-card p { margin:3px 0 0; color:var(--muted); font-size:.8rem; }
.archive-reason { display:inline-flex; align-items:center; gap:4px; margin-top:7px; color:var(--bad-text); font-size:.76rem; }.archive-reason .icon { width:13px; height:13px; }
.archive-actions { display:flex; gap:8px; align-items:center; }
.rank-dialog { position:absolute; inset:12px; z-index:50; padding:16px; border:1px solid var(--line); border-radius:12px; background:var(--panel); box-shadow:var(--shadow-lg); overflow:auto; }
.rank-dialog[hidden] { display:none; }
.rank-dialog .icon-btn.small { position:absolute; top:8px; right:8px; border:0; background:transparent; }
.rank-dialog .ranking-explanation { position:static; }
.rank-dialog .ranking-tooltip { display:block; position:static; width:auto; box-shadow:none; border:0; padding:0; }
.finder-result-card:hover { transform:translateY(-1px); box-shadow:var(--shadow-md); border-color:#cbd6d2; }
.ranking-row { box-shadow: inset 4px 0 0 var(--ranking-color); }
.ranking-row:hover { background: var(--ranking-tint); }
.ranking-score { position: relative; display: inline-grid; place-items: center; min-width: 46px; min-height: 38px; padding: 3px 8px; border: 2px solid var(--ranking-color); border-radius: var(--r-md); background: var(--ranking-tint); color: var(--ranking-color); font-size: 1.3rem; font-weight: 900; line-height: 1; cursor: help; }
.ranking-explanation { position: absolute; inset: 0; border-radius: inherit; }
.ranking-explanation > .ranking-summary { display: none; }
.ranking-tooltip { position: absolute; left: calc(100% + 10px); top: 0; z-index: 40; display: none; width: 340px; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--panel); color: var(--text); box-shadow: var(--shadow-lg); font-size: .78rem; font-weight: 500; line-height: 1.4; text-align: left; }
.ranking-explanation:hover .ranking-tooltip, .ranking-explanation:focus .ranking-tooltip, .ranking-explanation:focus-within .ranking-tooltip { display: block; }
.ranking-tooltip dl { display: grid; grid-template-columns: 1fr auto; gap: 3px 12px; margin: 8px 0; }
.ranking-tooltip dt { color: var(--muted); }
.ranking-tooltip dd { margin: 0; font-weight: 800; }
.ranking-tooltip ul { margin: 8px 0 0; padding-left: 18px; }
.back-button { margin-bottom: 14px; font-size: 1.25rem; }
.ranking-components { white-space: nowrap; font-size: .78rem; font-weight: 700; }
.ranking-summary { max-width: 38ch; font-size: .8rem; line-height: 1.4; font-weight: 650; }
.ranking-reasons { margin-top: 4px; font-size: .8rem; }
.ranking-reasons ul { padding-left: 18px; min-width: 260px; }
.reason-effect { display: inline-block; min-width: 24px; font-weight: 800; }
/* ---------- presence icon chips ---------- */
/* One icon per verdict; the sentence behind it lives in the data-tip. */
.presence-chip { display: inline-flex; align-items: center; justify-content: center; gap: 3px; min-width: 35px; height: 24px;
  padding: 0 6px; border-radius: 99px; cursor: default; vertical-align: middle; }
.presence-chip .icon { width: 13px; height: 13px; }
.presence-chip .icon:last-child { width: 12px; height: 12px; }
.presence-chip .icon svg { width: 100%; height: 100%; }
.presence-chip.no_website { background: var(--good-light); color: var(--good-text); }
.presence-chip.website_found { background: var(--warn-light); color: var(--warn-text); }
.presence-chip.ambiguous, .presence-chip.unchecked { background: var(--warn-light); color: var(--warn-text); }
.presence-chip.pending { background: #e7edeb; color: var(--muted); }
.presence-chip.failed { background: var(--bad-light); color: var(--bad-text); }
.presence-mark { display: inline-flex; align-items: center; justify-content: center; width: 12px; height: 12px; font-size: 16px; font-weight: 850; line-height: 1; }
.presence-mark .icon { width: 12px; height: 12px; }
.contact-state { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px;
  border-radius: 50%; cursor: default; vertical-align: middle; }
.contact-state.available { background: var(--good-light); color: var(--good-text); }
.contact-state.missing { background: var(--bad-light); color: var(--bad-text); }
.contact-state .icon { width: 14px; height: 14px; }
.contact-state .icon svg { width: 100%; height: 100%; }

.review-queue { max-width: 960px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items:stretch; }
.review-head { display:flex; align-items:flex-end; gap:18px; flex-wrap:wrap; margin:4px 2px 14px; }
.review-head h1 { margin:0; font-size:1.1rem; }
.review-head p { margin:2px 0 0; color:var(--muted); font-size:.8rem; }
.review-head .filters { margin-left:auto; background:var(--panel); border:1px solid var(--line); border-radius:11px; padding:3px; box-shadow:var(--shadow-sm); }
.review-filter-icons { margin-left:auto; display:flex; gap:4px; padding:3px; border:1px solid var(--line); border-radius:11px; background:var(--panel); box-shadow:var(--shadow-sm); }
.review-filter-btn { width:34px; height:32px; position:relative; display:grid; place-items:center; border:0; border-radius:8px; background:transparent; color:var(--muted); font-weight:800; cursor:pointer; }
.review-filter-btn[aria-pressed="true"] { background:var(--accent); color:#fff; }
.review-filter-btn b { position:absolute; top:-5px; right:-5px; min-width:15px; padding:0 4px; border-radius:99px; background:var(--warn); color:#fff; font-size:.58rem; line-height:15px; }
.review-address { display:inline-block; margin-top:2px; color:var(--muted); font-size:.78rem; }
.review-presence { display: inline-block; margin-left: 8px; vertical-align: middle; }
/* Prüfen cards: the verdict at a glance, the evidence on demand. */
.review-card { position:relative; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-md);
  box-shadow: var(--shadow-sm); padding:14px; min-height:190px; display:flex; flex-direction:column; gap:10px; min-width:0; cursor:pointer; transition:border-color var(--speed), box-shadow var(--speed), transform var(--speed); }
.review-card:hover { border-color:#c9d9d5; box-shadow:var(--shadow-md); transform:translateY(-1px); }
.review-card-main { min-width: 0; }
.review-kind { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: .72rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: .05em; }
.review-kind .icon { width: 13px; height: 13px; }
.review-kind .icon svg { width: 100%; height: 100%; }
.review-kind .review-impact { margin-left: auto; padding: 1px 8px; border-radius: 99px; background: var(--warn-light);
  color: var(--warn-text); font-size: .64rem; }
.review-card h2 { margin: 5px 0 0; font-size:1rem; letter-spacing:-.01em; display:inline; }
.review-why-line { margin:7px 0 0; color:var(--muted); font-size:.8rem; max-width:100%;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: default; }
.review-cands { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 7px; }
.cand-chip { display: inline-block; max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle;
  padding: 2px 9px; border-radius: 99px; border: 1px solid var(--line); background: var(--panel-soft);
  font-size: .74rem; font-weight: 600; color: var(--muted); cursor: default; }
.cand-chip.verified { background: var(--good-light); color: var(--good-text); border-color: transparent; }
.review-fact-line { margin: 6px 0 0; font-size: .82rem; }
.review-card-actions { display:flex; align-items:center; gap:6px; padding-top:10px; border-top:1px solid var(--line); margin-top:auto; }
.review-card-actions select { flex:1; min-width:0; max-width:none; font-size:.78rem; padding:6px 8px; }
.review-action { width:30px; min-width:30px; height:30px; padding:0; color:var(--accent-text); background:var(--panel-soft); }
.review-action.primary { background:var(--accent); color:#fff; border-color:var(--accent); }
.review-action:hover { border-color:var(--accent); color:var(--accent); }.review-action.primary:hover { background:var(--accent-hover); color:#fff; }
.review-details { margin-top:0; padding-top:10px; border-top:1px solid var(--line); max-height:380px; overflow:auto; cursor:default; }
.review-details .rank-revision { margin-top: 0; }
@media (max-width: 720px) { .review-queue { grid-template-columns:1fr; } }
.review-note { display:flex; align-items:center; gap:8px; margin-top:10px; color:var(--muted); font-size:.8rem; }
.finder-card-evidence { margin-top:8px; padding:9px 10px; border:1px solid var(--line); border-radius:9px; background:var(--panel-soft); font-size:.72rem; }
.finder-card-evidence[hidden] { display:none; }
.finder-card-evidence ul { margin:5px 0 0; padding-left:18px; }
.rank-revision { display:grid; grid-template-columns:auto auto auto; align-items:center; justify-content:start; gap:10px; margin-top:10px; }
.rank-revision span { min-width:42px; padding:7px 10px; border-radius:9px; background:var(--accent-light); color:var(--accent-text); font-size:1rem; font-weight:850; text-align:center; }
.rank-revision p { grid-column:1/-1; margin:0; color:var(--muted); }
.rank-revision details { grid-column:1/-1; }
.evidence-list { display:grid; grid-template-columns:minmax(110px,auto) 1fr; gap:3px 10px; margin:8px 0; font-size:.72rem; }
.evidence-list dt { color:var(--muted); }
.evidence-list dd { margin:0; overflow-wrap:anywhere; }
.review-candidate { display:block; margin:7px 0; }
.review-evidence-head { display:flex; justify-content:space-between; gap:10px; padding-bottom:7px; border-bottom:1px solid var(--line); font-size:.78rem; }
.review-evidence-head span { color:var(--muted); }
.review-candidate { padding:10px 11px; border:1px solid var(--line); border-radius:10px; background:var(--panel-soft); }
.review-candidate > a { display:block; overflow-wrap:anywhere; font-weight:750; font-size:.8rem; }
.review-candidate-state { display:inline-block; margin-top:5px; padding:2px 7px; border-radius:99px; background:#e7edeb; color:var(--muted); font-size:.67rem; font-weight:750; }
.review-candidate-state.verified { background:var(--good-light); color:var(--good-text); }
.evidence-yes,.evidence-no { display:flex; align-items:flex-start; gap:5px; margin:8px 0 0; font-size:.75rem; line-height:1.35; }
.evidence-yes { color:var(--good-text); }.evidence-no { color:var(--muted); }.evidence-yes .icon { flex:0 0 auto; width:13px; height:13px; }

/* ---------- call cockpit ---------- */
.call-cockpit { max-width: 780px; margin: 0 auto; }
.call-cockpit .eyebrow { font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin-bottom: 8px; }
.cockpit-hero { background: var(--ink); color: #fff; border-radius: 18px; padding: 22px 24px; margin-bottom: 16px; box-shadow: var(--shadow-md); }
.cockpit-hero h1 { margin: 8px 0 6px; font-size: 1.6rem; letter-spacing: -.03em; }
.cockpit-address { margin: 0; color: var(--ink-muted); font-size: .92rem; }
.cockpit-meta { display: flex; gap: 6px; flex-wrap: wrap; margin: 12px 0 14px; }
.cockpit-meta .badge { background: rgba(255,255,255,.12); color: #fff; border-color: transparent; }
.cockpit-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cockpit-actions .btn { border-color: rgba(255,255,255,.2); color: #fff; background: rgba(255,255,255,.08); }
.cockpit-actions .btn.primary, .cockpit-actions .btn.dark { background: #fff; color: var(--ink); border-color: #fff; }
.phone-btn { font-size: 1rem; padding: 10px 16px; }
.phone-btn .icon svg { width: 18px; height: 18px; }
.cockpit-card { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 18px; margin-bottom: 14px; box-shadow: var(--shadow-sm); }
.cockpit-card h2, .cockpit-card h3 { margin-top: 0; }
.cockpit-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 12px; }
.cockpit-facts div { background: var(--panel-soft); border-radius: 10px; padding: 11px 13px; }
.cockpit-facts span { font-size: .62rem; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); }
.cockpit-facts strong { display: block; margin-top: 5px; font-size: .92rem; overflow-wrap: anywhere; }
.cockpit-facts a { color: var(--accent-text); }
.permission { display: flex; align-items: flex-start; gap: 9px; background: var(--warn-light); border: 1px solid #ecd9b4; border-radius: 11px; padding: 10px 12px; font-size: .8rem; font-weight: 700; margin-bottom: 10px; }
.permission input { margin-top: 3px; accent-color: var(--accent); }
.email-send-row { margin-bottom: 10px; }
.email-preview { white-space: pre-wrap; background: var(--panel-soft); border: 1px solid var(--line); border-radius: 10px; padding: 12px; font-size: .82rem; max-height: 240px; overflow: auto; }
.timer-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.timer-display { font-variant-numeric: tabular-nums; font-size: 2.6rem; font-weight: 950; letter-spacing: -.04em; min-width: 110px; }
.timer-controls { display: flex; gap: 8px; }
.script-box { background: var(--accent-light); border-left: 4px solid var(--accent); border-radius: 10px; padding: 14px; font-weight: 700; line-height: 1.55; white-space: pre-wrap; margin-bottom: 10px; }
.script-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.script-collapsed { display: none; }
.objections-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.objections-grid details { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--panel-soft); }
.objections-grid summary { font-weight: 800; color: var(--text); cursor: pointer; }
.objections-grid p { margin: 8px 0 0; font-size: .84rem; color: var(--muted); }
.cockpit-outcomes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 16px 0; }
.cockpit-outcomes .outcome-btn { padding: 14px 10px; border-radius: 12px; }
.cockpit-outcomes .outcome-btn small { font-size: .68rem; }
.cockpit-history { margin-top: 18px; }

@media (max-width: 720px) {
  .cockpit-facts { grid-template-columns: 1fr; }
  .objections-grid { grid-template-columns: 1fr; }
  .cockpit-outcomes { grid-template-columns: 1fr 1fr; }
  .cockpit-actions .btn { flex: 1 1 40%; }
}

/* ---------- responsive ---------- */

@media (max-width: 1000px) { .grid-2 { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .call-cols, .guide-grid, .knowledge-grid { grid-template-columns: 1fr; } .call-guide-head { align-items: start; flex-direction: column; } }

@media (max-width: 720px) {
  .app-shell { padding:12px 12px 48px; }
  .app-header { flex-wrap:wrap; }
  .primary-tabs { order:3; width:100%; margin-left:0; }
  .primary-tabs a { flex:1; text-align:center; }
  .sales-links,.user-badge { display:none; }
  .anchored-popover { position: fixed; left: 12px; right: 12px; top: 92px; width: auto; }
  .popover-grid { grid-template-columns: 1fr; }
  .hero { flex-direction: column; align-items: flex-start; }
  .finder-toolbar { flex-direction: column; align-items: stretch; }
  .finder-inputs { align-items: stretch; }
  .finder-field { flex: 1 1 42%; }
  .finder-field input, .finder-field select { width: 100%; }
  .website-switch { flex: 1 1 100%; }
  .finder-filters { margin-left: 0; justify-content: flex-end; }
  .finder-result-cards { grid-template-columns:minmax(0,1fr); }
  .finder-meta-row { align-items:flex-start; flex-direction:column; }
  .finder-ranking-head { margin-left:0; }
}

/* ---------- sichten ---------- */
.sift-list { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--panel); }
.sift-row { display: grid; grid-template-columns: minmax(180px, 1.4fr) minmax(120px, 1fr) auto minmax(120px, auto) auto;
  gap: 14px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--line); position: relative; cursor: pointer; }
.sift-row:last-child { border-bottom: 0; }
.sift-row.current { background: var(--accent-light); box-shadow: inset 3px 0 0 var(--accent); }
.sift-row:hover { background: var(--panel-soft); }
.sift-name { font-weight: 600; }
.sift-meta, .sift-phone { color: var(--muted); font-size: 13px; }
.sift-actions { display: flex; gap: 6px; justify-content: flex-end; }
.sift-hint { margin: 6px 2px 12px; }
/* Fixed to the viewport, not the column: a lane with its own scroll box would
   clip anything positioned inside it. */
.reason-menu { position: fixed; z-index: 400; width: 210px; padding: 8px; display: flex; flex-direction: column; gap: 3px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 14px 38px rgba(14,28,26,.18); }
.reason-head { padding: 2px 6px 5px; font-size: 11px; text-transform: uppercase; letter-spacing: .02em; color: #7d8b87; }
.reason-option { display: block; width: 100%; padding: 7px 9px; text-align: left; font: inherit; font-size: 13px;
  color: var(--text); background: transparent; border: 0; border-radius: 8px; cursor: pointer; }
.reason-option:hover { background: var(--panel-soft); }
.reason-option.plain { color: var(--muted); }
.reason-custom { display: flex; gap: 5px; margin: 5px 0 2px; padding-top: 6px; border-top: 1px solid var(--line); }
.reason-custom input { flex: 1; min-width: 0; padding: 6px 8px; font: inherit; font-size: 13px;
  border: 1px solid var(--line); border-radius: 8px; }
.reason-custom .btn { padding: 4px 8px; }
.reason-custom .icon { width: 14px; height: 14px; }
.reason-custom .icon svg { width: 100%; height: 100%; }
.badge.no-phone { background: #eef1f0; color: #74817d; }
@media (max-width: 900px) {
  .sift-row { grid-template-columns: 1fr auto; grid-auto-rows: min-content; }
  .sift-meta, .sift-phone { grid-column: 1 / -1; }
}

/* ---------- board columns ---------- */
/* The stage explanation lives in the heading's tooltip: available on hover,
   not eating a third of every column. */
.col-title { display: flex; align-items: center; gap: 6px; }
.col-title .icon { width: 13px; height: 13px; color: #a9b6b2; }
.col-title .icon svg { width: 100%; height: 100%; }
.board-col-sift { background: #e9efed; border-radius: 12px; padding: 10px; flex-basis: 288px; }
.sift-card .card-actions { display: flex; gap: 6px; position: absolute; top: 10px; right: 12px; margin: 0; opacity: 0; transform: translateY(-2px); transition: opacity var(--speed), transform var(--speed); }
.btn.small { padding: 3px 9px; font-size: 12px; }
.btn.block { display: block; width: 100%; text-align: center; margin-bottom: 8px; }
.finder-tools-row .spacer { flex: 1; }

.board-head { margin-bottom: 12px; }

.board-cards .card { padding: 10px 12px; }
.board-cards .card h4 { margin: 0 0 4px; font-size: 14px; line-height: 1.25; }
.board-cards .card .meta { font-size: 12px; }
.board-col-sift .board-cards { max-height: none; }

/* ---------- lane modal ---------- */
body.modal-open { overflow: hidden; }
/* No backdrop-filter: with overlay scrollbars it paints the lane's scrollbar
   over the dimmed layer, so the column behind appeared to shine through. */
.modal-backdrop { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center;
  padding: 24px; background: rgba(10, 18, 16, .55); }
/* One fixed window for every view: switching panels must not resize it. */
.modal { width: min(760px, 100%); height: min(760px, 84vh); padding: 20px 22px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 60px rgba(14,28,26,.24); }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.modal-head h3 { margin: 4px 0 2px; font-size: 1.2rem; }
.modal-head p { margin: 0; }
.modal-head-actions { display: flex; align-items: center; gap: 6px; }
.modal-top-action { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0;
  border: 1px solid var(--line); border-radius: 10px; background: var(--panel); color: var(--muted); cursor: pointer; }
.modal-top-action:hover { background: var(--accent-light); border-color: var(--accent); color: var(--accent-text); }
.modal-top-action.good { color: var(--good-text); border-color: #c3e4d0; }
.modal-top-action.good:hover { background: var(--good-light); border-color: var(--good); }
.modal-top-action.bad { color: var(--bad-text); border-color: #f0cfcd; }
.modal-top-action.bad:hover { background: var(--bad-light); border-color: var(--bad); }
.modal-top-action .icon { width: 18px; height: 18px; }
.modal-top-action .icon svg { width: 100%; height: 100%; }
.panel-icon-action { display: inline-flex; align-items: center; justify-content: center; gap: 3px; min-width: 28px; height: 32px; padding: 0 4px;
  border: 0; border-radius: 7px; background: transparent; color: var(--muted); cursor: pointer; }
.panel-icon-action:hover { background: var(--accent-light); color: var(--accent-text); }
.panel-icon-action .icon { width: 17px; height: 17px; }
.panel-icon-action .icon svg { width: 100%; height: 100%; }
.panel-icon-action > span:last-child { font-size: .72rem; font-weight: 800; }
.research-ready { display: inline-flex; color: var(--good); }
.research-ready .icon { width: 16px; height: 16px; }
.research-ready .icon svg { width: 100%; height: 100%; }
.modal-lane { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 600;
  letter-spacing: .02em; text-transform: uppercase; background: var(--accent-light); color: var(--accent-text); }
.modal-hint { margin: 12px 0 0; color: var(--muted); font-size: 13px; }
.modal-layout { display: grid; grid-template-columns: minmax(0, 1fr) 148px; gap: 14px; margin-top: 16px; min-height: 0; flex: 1 1 auto; }
.modal-body { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.modal-nav { align-self: stretch; display: flex; flex-direction: column; padding: 2px 0; border-left: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
.modal-nav-links { display: flex; flex-direction: column; }
.modal-nav-actions { display: flex; flex-direction: column; gap: 7px; margin-top: auto; padding: 12px 0 0; border-top: 1px solid var(--line); }
.modal-nav-actions .btn { justify-content: flex-start; font-size: 12px; }
.modal-nav-action { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px; border: 0; border-radius: 0 8px 8px 0; background: transparent; color: var(--text); font: inherit; font-size: 12px; text-align: left; text-decoration: none; cursor: pointer; }
.modal-nav-action:hover { background: var(--accent-light); color: var(--accent-text); }
.modal-nav-action .icon { width: 16px; height: 16px; color: var(--muted); }
.modal-nav-action .icon svg { width: 100%; height: 100%; }
.modal-nav-action:hover .icon { color: var(--accent); }
.modal-nav-action.primary { border-radius: 0 8px 8px 0; background: var(--good); color: #fff; }
.modal-nav-action.primary .icon, .modal-nav-action.primary:hover .icon { color: #fff; }
.modal-nav-action.primary:hover { background: var(--good-text); color: #fff; }
.builder-prompt-view { display: flex; flex-direction: column; gap: 10px; min-height: 0; }
.builder-prompt-view > b { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.builder-prompt-view pre { margin: 0; padding: 14px; overflow: auto; border-radius: 12px; background: var(--panel-soft); color: var(--text); white-space: pre-wrap; font: 13px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace; }
.build-brief { padding: 14px 16px; border-radius: 12px; background: var(--panel-soft); }
.build-brief b, .builder-choice > span { display: block; color: var(--muted); font-size: 11px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.build-brief p { margin: 7px 0 0; white-space: pre-wrap; font-size: 14px; line-height: 1.5; }
.build-state { display: flex; align-items: center; gap: 11px; padding: 13px 14px; border: 1px solid var(--line); border-radius: 12px; }
.build-state.ready { border-color: #c3e4d0; background: var(--good-light); color: var(--good-text); }
.build-state.waiting { background: var(--panel-soft); color: var(--muted); }
.build-state .icon { width: 22px; height: 22px; flex: 0 0 auto; }
.build-state .icon svg { width: 100%; height: 100%; }
.build-state b, .build-state span { display: block; }
.build-state b { font-size: 14px; color: var(--text); }
.build-state span { margin-top: 2px; font-size: 12px; }
.builder-choice { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 2px 0; }
.builder-choice > span { margin: 0; }
.builder-choice select { min-width: 180px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px; font: inherit; font-size: 13px; background: var(--panel); }
.external-preview { display: grid; gap: 8px; padding-top: 4px; }
.modal-nav button { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px; border: 0; border-radius: 8px; background: transparent; color: var(--text); text-align: left; font: inherit; font-size: 12px; cursor: pointer; }
.modal-nav button:hover { background: var(--accent-light); color: var(--accent-text); border-radius: 0 8px 8px 0; }
.modal-nav .icon { display: inline-flex; width: 16px; height: 16px; color: var(--muted); }
.modal-nav .icon svg { width: 100%; height: 100%; }
.modal-nav button:hover .icon { color: var(--accent); }
.modal-nav em, .modal-nav .research-ready { margin-left: auto; font-style: normal; color: var(--muted); font-size: 11px; font-weight: 750; }
@media (max-width: 680px) {
  .modal-layout { grid-template-columns: 1fr; overflow-y: auto; }
  .modal-body { overflow: visible; }
  .modal-nav { order: -1; display: block; border-left: 0; border-bottom: 1px solid var(--line); }
  .modal-nav-links { display: grid; grid-template-columns: repeat(5, 1fr); }
  .modal-nav-actions { display: none; }
  .modal-nav button { justify-content: center; padding: 7px 3px; }
  .modal-nav button span, .modal-nav button em, .modal-nav .research-ready { display: none; }
}

.confirm-backdrop { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 24px; background: rgba(10,18,16,.35); }
.confirm-dialog { width: min(360px, 100%); padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); box-shadow: 0 20px 50px rgba(14,28,26,.28); }
.confirm-dialog h3 { margin: 0; font-size: 1rem; }
.confirm-dialog p { margin: 8px 0 18px; color: var(--muted); font-size: 13px; }
.confirm-dialog > div { display: flex; justify-content: flex-end; gap: 8px; }
.modal-facts { display: grid; gap: 8px; margin: 0; }
.modal-facts div { display: grid; grid-template-columns: 90px 1fr; gap: 10px; align-items: baseline; }
.modal-facts dt { color: var(--muted); font-size: 12px; }
.modal-facts dd { margin: 0; font-size: 14px; word-break: break-word; }
.modal-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.modal-field span { color: var(--muted); }
.modal-field textarea, .modal-field input { width: 100%; padding: 10px 12px; font: inherit; font-size: 14px;
  border: 1px solid var(--line); border-radius: 10px; resize: vertical; background: var(--panel); }
.modal-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 4px; }
.modal-quote { padding: 12px 14px; background: var(--panel-soft); border-radius: 12px; }
.modal-quote b { font-size: 12px; text-transform: uppercase; letter-spacing: .02em; color: var(--muted); }
.modal-quote p { margin: 6px 0 0; white-space: pre-wrap; font-size: 14px; }
.modal-placeholder { display: grid; place-items: center; align-content: center; flex: 1; min-height: 300px; text-align: center;
  border: 1px dashed var(--line); border-radius: 14px; background: var(--panel-soft); color: var(--muted); }
.modal-placeholder-mark { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 10px; border-radius: 50%; background: var(--accent-light); color: var(--accent-text); }
.modal-placeholder-mark .icon { width: 24px; height: 24px; }
.modal-placeholder-mark .icon svg { width: 100%; height: 100%; }
.modal-placeholder b { color: var(--text); font-size: 1rem; }
.modal-placeholder p { max-width: 34ch; margin: 5px 24px 0; font-size: .85rem; }
.call-focus { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.call-number { font-size: 1.7rem; font-weight: 600; letter-spacing: -.01em; text-decoration: none; }
.card-title { cursor: pointer; }
.card-title:hover { text-decoration: underline; }

/* ---------- known links ---------- */
.known-links { padding: 12px 14px; background: var(--panel-soft); border-radius: 12px; }
.known-links-head { font-size: 12px; text-transform: uppercase; letter-spacing: .02em; color: var(--muted); margin-bottom: 8px; }
.known-links-head .hint { text-transform: none; letter-spacing: 0; }
.link-group + .link-group { margin-top: 10px; }
.link-group b { font-size: 12px; color: var(--muted); font-weight: 600; }
.link-group ul { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.link-group li a { font-size: 13px; word-break: break-all; }

/* ---------- research ---------- */
.research-block { padding: 12px 14px; background: var(--accent-light); border-radius: 12px; }
.research-block.empty { background: var(--panel-soft); }
.research-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.research-head b { font-size: 12px; text-transform: uppercase; letter-spacing: .02em; color: var(--muted); }
.research-head .btn { margin-left: auto; }
.research-short { margin: 0; font-size: 14px; line-height: 1.5; }
.research-facts { margin-top: 10px; }
.research-facts dt { text-transform: capitalize; }
.research-long { margin-top: 10px; }
.research-long summary { cursor: pointer; font-size: 13px; color: var(--muted); }
.research-long p { white-space: pre-wrap; font-size: 13px; line-height: 1.55; margin: 8px 0 0; }
.research-brief { padding: 12px 14px; background: var(--accent-light); border: 1px solid #c5e2e0; border-radius: 12px; }
.research-brief b { display: block; color: var(--accent-text); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
.research-brief p { margin: 6px 0 0; white-space: pre-wrap; font-size: 13px; line-height: 1.5; }
.badge.research-done { background: var(--good-light); color: var(--good-text); }

/* ---------- decide buttons ---------- */
/* Ghost until hovered: a column of decisions should not shout. */
.decide { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 30px;
  padding: 0; border-radius: 9px; border: 1px solid transparent; background: transparent; cursor: pointer; transition: transform .08s ease, background var(--speed), color var(--speed); }
.decide .icon { width: 17px; height: 17px; }
.decide .icon svg { width: 100%; height: 100%; }
.decide:active { transform: scale(.94); }
.decide.yes { color: #8fa39d; }
.decide.yes:hover { background: var(--good-light); color: var(--good-text); }
.decide.no { color: #b3a3a0; }
.decide.no:hover { background: var(--bad-light); color: var(--bad-text); }
.user-badge { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px;
  border-radius: 50%; background: var(--ink); color: #f7f9f8; font-size: 12px; font-weight: 600;
  letter-spacing: .02em; cursor: default; line-height: 1; text-align: center; padding: 0 0 1px 1px; }
.badge.ambiguous_match { background: var(--warn-light); color: var(--warn-text); }

/* ---------- tooltips ---------- */
/* One tooltip for everything: dark, crisp, with a teal spine. Native title
   tooltips never appear; render() strips them from anything with data-tip. */
.floating-tip { position: fixed; z-index: 500; width: max-content; max-width: 300px; padding: 8px 12px; white-space: pre-line;
  border: 1px solid var(--line); border-radius: 999px; background: var(--panel); color: var(--text); font-size: 12px; font-weight: 650; line-height: 1.45; text-align: left;
  letter-spacing: .005em; box-shadow: var(--shadow-md);
  pointer-events: none; opacity: 0; transform: translateY(4px) scale(.98); transition: opacity .13s ease, transform .13s ease; }
.floating-tip.visible { opacity: 1; transform: translateY(0) scale(1); }

/* ---------- card rows ---------- */
.meta-row { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.meta-row .meta { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.meta-row .badge { flex: 0 0 auto; }
/* Sichten actions stay out of the way until the card is intentionally read. */
.sift-card:hover .card-actions, .sift-card:focus-within .card-actions { opacity: 1; transform: translateY(0); }
.concept-card-actions { position: absolute; top: 10px; right: 12px; display: flex; gap: 6px; opacity: 0; transform: translateY(-2px); transition: opacity var(--speed), transform var(--speed); }
.board-cards .card:hover .concept-card-actions, .board-cards .card:focus-within .concept-card-actions { opacity: 1; transform: translateY(0); }

/* ---------- action buttons ---------- */
.btn.act-go, .btn.act-save, .btn.act-drop, .btn.act-wait { display: inline-flex; align-items: center; gap: 6px; }
.btn.act-go .icon, .btn.act-save .icon, .btn.act-drop .icon, .btn.act-wait .icon { width: 15px; height: 15px; }
.btn.act-go .icon svg, .btn.act-save .icon svg, .btn.act-drop .icon svg, .btn.act-wait .icon svg { width: 100%; height: 100%; }
.btn.act-go { background: var(--good); border-color: var(--good-text); color: #fff; }
.btn.act-go:hover { background: var(--good-text); }
.btn.act-save { background: var(--panel); border-color: var(--line); color: var(--text); }
.btn.act-drop { background: var(--panel); border-color: #eec9c5; color: var(--bad-text); }
.btn.act-drop:hover { background: var(--bad-light); }
.btn.act-wait { background: var(--panel); border-color: #ecd9b4; color: var(--warn-text); }
.btn.act-wait:hover { background: var(--warn-light); }

/* ---------- links popup ---------- */
.links-trigger-row { display: flex; align-items: center; gap: 10px; }
.links-trigger-row .btn { display: inline-flex; align-items: center; gap: 7px; }
.links-trigger-row .icon { width: 15px; height: 15px; }
.links-trigger-row .icon svg { width: 100%; height: 100%; }
.count-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 19px;
  padding: 0 6px; border-radius: 999px; background: var(--ink); color: #f7f9f8; font-size: 11px; font-weight: 600; }
.links-backdrop { z-index: 260; }
.link-row { display: flex; align-items: center; gap: 10px; padding: 3px 0; }
.link-row a { font-size: 13px; word-break: break-all; }
.link-row.seen a { color: #97a3a0; text-decoration: line-through; }
.link-check { display: inline-flex; cursor: pointer; }
.link-check input { width: 16px; height: 16px; accent-color: var(--good); cursor: pointer; }

.badge.pending .spinner, .research-block .spinner { margin-right: 6px; }

/* ---------- modal panels ---------- */
.modal-facts.stammdaten { padding: 12px 14px; background: var(--panel-soft); border-radius: 12px; }
.panel-row { display: flex; flex-wrap: wrap; gap: 6px; }
.panel-row .btn { display: inline-flex; align-items: center; gap: 6px; }
.panel-row .icon { width: 14px; height: 14px; }
.panel-row .icon svg { width: 100%; height: 100%; }
.presence-list, .history-list { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.presence-list li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 7px 9px; border: 1px solid var(--line); border-radius: 9px; }
.presence-list li.canonical { border-color: #c3e4d0; background: var(--good-light); }
.presence-list li.rejected a { color: #97a3a0; text-decoration: line-through; }
.presence-list li .btn { margin-left: auto; }
.presence-list a, .history-list b { font-size: 13px; word-break: break-all; }
.history-list li { padding: 8px 10px; background: var(--panel-soft); border-radius: 9px; }
.history-list p { margin: 4px 0 0; font-size: 13px; }

/* ---------- modal views ---------- */
.modal { display: flex; flex-direction: column; }
.modal-body { overflow-y: auto; }
.modal-head-main { display: flex; align-items: flex-start; gap: 10px; }
.btn.icon-btn.back { font-size: 17px; line-height: 1; padding: 4px 9px; }
.count-pill.done { background: var(--good); }
.share-block, .followup-block { padding: 12px 14px; background: var(--panel-soft); border-radius: 12px; }
.share-block b, .followup-block b { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .02em; color: var(--muted); margin-bottom: 8px; }
.followup-block input { padding: 7px 9px; font: inherit; font-size: 13px; border: 1px solid var(--line); border-radius: 8px; }
.link-button { padding: 0; border: 0; background: none; font: inherit; color: var(--accent); cursor: pointer; text-align: left; }
.link-button:hover { text-decoration: underline; }

/* ---------- modal sizing ---------- */
.modal-head { flex: 0 0 auto; }
.modal-hint { flex: 0 0 auto; }
.modal-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: 4px; }
.modal .loading-page { margin: auto; }
/* The lanes keep their scroll position but stop drawing scrollbars while a
   modal is open, which is what was bleeding through the dimmed layer. */
body.modal-open .board-cards, body.modal-open .board-col { overflow: hidden; }
/* Back and close are a pair: identical box, identical optical weight. */
.modal-head-actions .btn.icon-btn { display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; padding: 0; font-size: 16px; line-height: 1; }
.modal-head-actions .btn.icon-btn .icon { width: 17px; height: 17px; }
.modal-head-actions .btn.icon-btn .icon svg { width: 100%; height: 100%; }

/* ---------- lane state ---------- */
.state-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.state-chip { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px; border-radius: 999px;
  font-size: 12px; font-weight: 500; border: 1px solid transparent; }
.state-chip.yes { background: var(--good-light); color: var(--good-text); border-color: #c3e4d0; }
.state-chip.no { background: var(--panel-soft); color: var(--muted); border-color: var(--line); }

/* ---------- finished stage ---------- */
/* When the work of a lane is done the modal should look done, not wear a tick. */
.stage-done { padding: 14px 16px; background: var(--good-light); border: 1px solid #c3e4d0; border-radius: 12px; }
.stage-done-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; color: var(--good-text); }
.stage-done-head b { font-size: 15px; }
.stage-done-head .icon { width: 20px; height: 20px; }
.stage-done-head .icon svg { width: 100%; height: 100%; stroke-width: 3; }
.stage-done p { margin: 0; white-space: pre-wrap; font-size: 14px; line-height: 1.55; }
.btn.act-go.big { padding: 10px 18px; font-size: 15px; }
.state-chip.neutral { background: var(--panel-soft); color: var(--muted); border-color: var(--line); }

/* ---------- finished cards ---------- */
/* Completion is a quiet status mark in the lower-right edge, not a second
   visual title competing with the business name. */
.board-cards .card { position: relative; }
.step-check { position: absolute; right: 12px; bottom: 11px; display: inline-flex; align-items: center; justify-content: center; color: var(--good-text); }
.step-check .icon { width: 18px; height: 18px; }
.step-check .icon svg { width: 100%; height: 100%; stroke-width: 3; }
.board-cards .card.step-done { border-color: #c3e4d0; box-shadow: inset -4px -4px 0 var(--good-light), var(--shadow-sm); }

/* ---------- column quick action ---------- */
.col-quick { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px;
  margin-left: auto; border-radius: 7px; color: var(--muted); }
.col-quick:hover { background: var(--accent-light); color: var(--accent-text); text-decoration: none; }
.col-quick .icon { width: 14px; height: 14px; }
.col-quick .icon svg { width: 100%; height: 100%; }

/* ---------- social satellites ---------- */
/* This fan is portalled to body and position:fixed. It is deliberately not a
   card child, because the board columns own an overflow scroll container. */
.social-hub { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0;
  border: 0; border-radius: 50%; background: #ece7f8; color: #6b55a8; cursor: pointer;
  transition: background var(--speed), color var(--speed), transform var(--speed); }
.social-hub:hover, .social-hub:focus-visible { background: #ded2f5; color: #513b8d; transform: scale(1.1); outline: none; }
.social-hub > .icon { width: 13px; height: 13px; }
.social-hub > .icon svg { width: 100%; height: 100%; }
.social-fan { position: fixed; z-index: 510; display: flex; align-items: center; gap: 5px; padding: 6px;
  border: 1px solid var(--line); border-radius: 999px; background: var(--panel); box-shadow: var(--shadow-lg);
  opacity: 0; transform: translateY(5px) scale(.94); pointer-events: none;
  transition: opacity .14s ease, transform .14s ease; }
.social-fan.visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.social-sat { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px;
  border-radius: 50%; background: var(--panel-soft); color: var(--text); transition: background var(--speed), color var(--speed), transform var(--speed); }
.social-sat:hover { background: var(--accent); color: #fff; text-decoration: none; transform: scale(1.1); }
.social-sat .icon { width: 16px; height: 16px; }
.social-sat .icon svg { width: 100%; height: 100%; }