/* ==========================================================================
   Ranjha Leads - components added for the working app.
   Uses only the v0 design tokens (--forest, --mint, --gold, --ink, ...).
   ========================================================================== */
:root { --red:#b4533c; --red-bg:#f8e6e0; --focus:#d3ac65; }
.ic { flex:none; vertical-align:middle; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
:focus-visible { outline:2px solid var(--focus); outline-offset:2px; }
body.crm-body { background:#f4f6f1; }
a.text-button, a.secondary-button, a.primary-button, a.outline-button { cursor:pointer; }
.muted { color:var(--muted); }
.small { font-size:11px; }
.nowrap { white-space:nowrap; }
.stack { display:grid; gap:13px; }
.row { display:flex; align-items:center; gap:10px; }
.row.wrap { flex-wrap:wrap; }
.spacer { flex:1; }
.mt { margin-top:13px; } .mt-lg { margin-top:26px; } .mb { margin-bottom:13px; }
.danger-text { color:var(--red); }
.primary-button[disabled], .secondary-button[disabled] { opacity:.5; cursor:not-allowed; }
.secondary-button { background:#fff; }
.danger-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 17px; border:1px solid #e3b9ad; border-radius:999px; color:var(--red); background:#fff; font-weight:700; font-size:13px; }
.button-sm { padding:8px 12px !important; font-size:11px !important; }

/* Tones */
.avatar.red, .timeline-dot.red, .status-dot.red { background:var(--red-bg); }
.status-dot.red, .timeline-dot.red { background:var(--red); }
.status-dot.gold { background:var(--gold); }
.timeline-dot.gold { background:var(--gold); }
.red-pill { background:var(--red-bg); color:var(--red); }
.blue-pill { background:var(--blue); color:#2f5d6c; }
.grey-pill { background:#eceee9; color:#66736d; }
.stat-card.red { background:#f8ebe6; }
.stat-card.red strong { color:var(--red); }

/* Header extras */
.crm-header-sub { margin-top:6px; color:var(--muted); font-size:12px; }
.icon-button { position:relative; }
.icon-button .count { position:absolute; top:-3px; right:-3px; min-width:16px; padding:2px 4px; border-radius:9px; background:var(--gold); color:#fff; font-size:9px; font-weight:800; text-align:center; }
.side-nav a, .sidebar-bottom a { display:flex; align-items:center; gap:12px; width:100%; padding:12px 13px; border-radius:10px; color:#9db4a4; background:transparent; text-align:left; font-size:13px; }
.side-nav a.active, .side-nav a:hover, .sidebar-bottom a:hover { background:#295a4d; color:#fff; }
.side-nav a b { margin-left:auto; color:#b8dbc0; font-size:11px; }
.sidebar-bottom .user-row { display:flex; align-items:center; gap:12px; border-top:1px solid #2d5b4f; padding:17px 13px 0; color:#d7e6da; font-size:13px; }
.bottom-nav a { position:relative; display:flex; flex-direction:column; align-items:center; gap:4px; min-width:52px; color:#91a099; background:transparent; font-size:9px; }
.bottom-nav a.active { color:var(--forest); }
.bottom-nav a b { position:absolute; top:-3px; right:9px; min-width:14px; padding:2px 3px; border-radius:8px; background:var(--gold); color:#fff; font-size:8px; text-align:center; }
.search-form { display:flex; align-items:center; gap:8px; }

/* Flash messages */
.flash { display:flex; align-items:flex-start; gap:10px; margin-bottom:16px; padding:13px 15px; border-radius:13px; font-size:13px; line-height:1.45; }
.flash.success { background:var(--mint); color:var(--forest); }
.flash.error { background:var(--red-bg); color:#7c3424; }
.flash.info { background:var(--blue); color:#2f5d6c; }
.flash button { margin-left:auto; background:none; color:inherit; padding:0; }

/* Cards */
.card { padding:20px; border:1px solid #e3e9e1; border-radius:18px; background:#fff; }
.card + .card { margin-top:13px; }
.card-heading .eyebrow-label { display:block; margin-bottom:6px; }
.card-sub { margin-top:4px; color:var(--muted); font-size:11px; }
.kv { display:grid; gap:0; }
.detail-row .tag { white-space:nowrap; }
.detail-row strong a { color:var(--forest); text-decoration:underline; }
.empty { padding:28px 16px; border:1px dashed #d5ddd5; border-radius:14px; color:var(--muted); text-align:center; font-size:12px; line-height:1.6; }
.empty .ic { display:block; margin:0 auto 8px; color:#a9b8af; }
.notice { display:flex; gap:10px; padding:13px; border-radius:12px; background:#f5eedf; color:#6d5427; font-size:12px; line-height:1.5; }
.notice.red { background:var(--red-bg); color:#7c3424; }
.notice.mint { background:#f1f7f1; color:var(--forest); }
.notice .ic { color:inherit; margin-top:1px; }

/* Metrics grid (dashboard): every card is a link to the filtered list */
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:20px 0 34px; }
a.stat-card { display:block; transition:transform .12s ease, box-shadow .12s ease; }
a.stat-card:hover { transform:translateY(-1px); box-shadow:0 8px 20px #153d3012; }
.stat-card .amount { display:block; margin-top:3px; color:var(--forest); font-size:12px; font-weight:700; }
.stat-card.zero { opacity:.62; }

/* Lists */
.lead-card { color:inherit; }
a.lead-card { display:flex; }
.lead-card .lead-side { display:flex; flex-direction:column; align-items:flex-end; gap:6px; text-align:right; }
.lead-card .lead-side small { color:#8a958f; font-size:10px; }
.lead-card.overdue { border-color:#e8c8be; }
.task-row { display:flex; align-items:center; gap:12px; padding:13px; border:1px solid #e4e9e3; border-radius:14px; background:#fff; }
.task-row + .task-row { margin-top:8px; }
.task-row .lead-main { min-width:0; }
.task-row .lead-main strong, .task-row .lead-main small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.call-chip { display:inline-grid; place-items:center; width:40px; height:40px; flex:none; border-radius:50%; background:var(--forest); color:#fff; }
.section { margin-top:30px; }
.section:first-child { margin-top:0; }
.count-badge { display:inline-block; min-width:20px; margin-left:6px; padding:2px 7px; border-radius:999px; background:#e6ece7; color:var(--forest); font-size:11px; font-weight:800; letter-spacing:0; text-align:center; vertical-align:middle; }

/* Filters */
.filter-bar { display:flex; gap:8px; margin-bottom:12px; }
.filter-bar input[type=search] { flex:1; min-width:0; padding:12px 14px; border:1px solid #dfe6df; border-radius:999px; background:#fff; font-size:14px; }
.chips { display:flex; gap:6px; overflow-x:auto; padding-bottom:4px; margin-bottom:12px; scrollbar-width:none; }
.chips::-webkit-scrollbar { display:none; }
.chip { flex:none; display:inline-flex; align-items:center; gap:6px; padding:8px 12px; border:1px solid #dfe6df; border-radius:999px; background:#fff; color:#5f6e67; font-size:11px; font-weight:700; white-space:nowrap; }
.chip.active { border-color:var(--forest); background:var(--forest); color:#fff; }
.filters-panel { display:none; margin-bottom:14px; }
.filters-panel.open { display:block; }
.filter-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.result-meta { display:flex; justify-content:space-between; align-items:center; margin:4px 0 10px; color:var(--muted); font-size:11px; }
.pager { display:flex; justify-content:center; align-items:center; gap:12px; margin-top:16px; font-size:12px; color:var(--muted); }

/* Forms */
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-grid .full { grid-column:1 / -1; }
.field { display:flex; flex-direction:column; gap:6px; }
.field > label, .field > .label { color:#6c7a73; font-size:11px; font-weight:800; }
.field input:not([type=checkbox]):not([type=radio]), .field select, .field textarea, .input {
  width:100%; padding:12px 12px; border:1px solid #dfe6df; border-radius:11px; color:var(--ink); background:#fff; font:inherit; font-size:15px;
}
.field textarea { min-height:92px; resize:vertical; line-height:1.45; }
.field input:focus, .field select:focus, .field textarea:focus { border-color:var(--forest); outline:none; box-shadow:0 0 0 3px #ddefe3; }
.field .help { color:#8a958f; font-size:11px; line-height:1.45; }
.field.has-error input, .field.has-error select, .field.has-error textarea { border-color:var(--red); }
.field .error { color:var(--red); font-size:11px; font-weight:700; }
.check { display:flex; align-items:flex-start; gap:10px; padding:11px 12px; border:1px solid #e3e9e1; border-radius:11px; background:#fff; font-size:13px; line-height:1.4; cursor:pointer; }
.check input { width:20px; height:20px; margin:0; flex:none; accent-color:var(--forest); }
.check small { display:block; margin-top:2px; color:var(--muted); font-size:11px; }
.radio-pills { display:flex; flex-wrap:wrap; gap:6px; }
.radio-pills label { position:relative; }
.radio-pills input { position:absolute; opacity:0; }
.radio-pills span { display:inline-block; padding:10px 14px; border:1px solid #dfe6df; border-radius:999px; background:#fff; color:#5f6e67; font-size:12px; font-weight:700; cursor:pointer; }
.radio-pills input:checked + span { border-color:var(--forest); background:var(--mint); color:var(--forest); }
.radio-pills input:focus-visible + span { outline:2px solid var(--focus); }
.form-actions { display:flex; gap:10px; align-items:center; margin-top:18px; flex-wrap:wrap; }
fieldset { margin:0; padding:0; border:0; }
legend { padding:0; margin-bottom:8px; color:var(--forest); font-size:13px; font-weight:800; }
.form-section + .form-section { margin-top:22px; padding-top:20px; border-top:1px solid var(--line); }

/* Call outcome grid: big targets for thumbs */
.outcome-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.outcome-grid label { position:relative; }
.outcome-grid input { position:absolute; opacity:0; }
.outcome-grid span { display:flex; align-items:center; gap:8px; min-height:52px; padding:12px; border:1px solid #dfe6df; border-radius:13px; background:#fff; color:#4c5a54; font-size:13px; font-weight:700; cursor:pointer; }
.outcome-grid input:checked + span { border-color:var(--forest); background:var(--mint); color:var(--forest); box-shadow:inset 0 0 0 1px var(--forest); }
.outcome-grid input:focus-visible + span { outline:2px solid var(--focus); }
.outcome-grid .good span .ic { color:#5d956a; }
.outcome-grid .bad span .ic { color:var(--red); }
.outcome-grid .neutral span .ic { color:var(--gold); }
.reveal { display:none; }
.reveal.show { display:block; }

/* Tabs */
.tabs { display:flex; gap:6px; overflow-x:auto; margin:16px 0 13px; padding-bottom:2px; scrollbar-width:none; }
.tabs::-webkit-scrollbar { display:none; }
.tabs a { flex:none; display:inline-flex; align-items:center; gap:6px; padding:9px 14px; border-radius:999px; background:#fff; border:1px solid #e3e9e1; color:#66746d; font-size:12px; font-weight:700; }
.tabs a.active { border-color:var(--forest); background:var(--forest); color:#fff; }
.tabs a b { min-width:16px; padding:1px 5px; border-radius:8px; background:var(--gold); color:#fff; font-size:9px; text-align:center; }

/* Lead detail */
.profile-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.call-big { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; margin-top:18px; padding:16px; border-radius:16px; background:var(--forest); color:#fff; font-size:16px; font-weight:800; }
.call-big small { display:block; color:#b8cabe; font-size:12px; font-weight:400; }
.call-alt { display:block; margin-top:8px; text-align:center; color:var(--forest); font-size:12px; font-weight:700; }
.quick-actions a, .quick-actions button { flex:1; padding:11px 8px; font-size:11px; }
.progress-steps { display:grid; grid-template-columns:repeat(6,1fr); gap:4px; margin-top:14px; }
.progress-steps div { display:flex; flex-direction:column; gap:5px; color:#9aa59f; font-size:9px; font-weight:700; text-align:center; }
.progress-steps div::before { content:''; height:5px; border-radius:3px; background:#e5eae4; }
.progress-steps div.done { color:var(--forest); }
.progress-steps div.done::before { background:#68a97a; }
.progress-steps div.current::before { background:var(--gold); }
.timeline-item .note-body { margin-top:6px; padding:10px 12px; border-radius:10px; background:#f6f8f4; color:#3d4b45; font-size:12px; line-height:1.5; white-space:pre-wrap; word-break:break-word; }
.vis { display:inline-flex; align-items:center; gap:4px; padding:2px 6px; border-radius:5px; font-size:9px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.vis-admin { background:#f5eedf; color:#8b6d35; }
.vis-installer { background:var(--blue); color:#2f5d6c; }
.vis-surveyor { background:var(--mint); color:var(--forest); }
.history-row { display:flex; gap:12px; padding:12px 0; border-top:1px solid #edf0eb; font-size:12px; }
.history-row:first-child { border-top:0; padding-top:0; }
.history-row > div { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.history-row strong { color:var(--forest); font-size:12px; }
.history-row small { color:#87918b; font-size:10px; }
.history-row p { color:#5f6c66; font-size:12px; line-height:1.5; white-space:pre-wrap; }
.history-actions { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.dl-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:12px; }
.dl-grid div { padding:11px; border-radius:11px; background:#f6f8f4; }
.dl-grid span { display:block; color:#87918b; font-size:10px; }
.dl-grid strong { display:block; margin-top:4px; color:var(--forest); font-size:13px; }

/* Bottom sheets (native <dialog>) */
dialog.sheet { width:min(560px, 100%); max-height:92vh; margin:auto; padding:0; border:0; border-radius:22px; background:#fff; color:var(--ink); box-shadow:0 30px 70px #0b2a2140; }
dialog.sheet::backdrop { background:#0f2d2566; }
.sheet-inner { display:flex; flex-direction:column; max-height:92vh; }
.sheet-head { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:18px 20px 12px; border-bottom:1px solid var(--line); }
.sheet-head h3 { color:var(--forest); font-size:18px; letter-spacing:-.03em; }
.sheet-head p { margin-top:3px; color:var(--muted); font-size:11px; }
.sheet-body { padding:16px 20px; overflow-y:auto; }
.sheet-foot { display:flex; gap:10px; padding:12px 20px calc(14px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:#fff; }
.sheet-foot .primary-button { flex:1; padding:15px; font-size:14px; }

/* Tables (desktop) */
.table-wrap { overflow-x:auto; border:1px solid #e3e9e1; border-radius:14px; background:#fff; }
table.table { width:100%; border-collapse:collapse; font-size:12px; }
.table th { padding:11px 12px; border-bottom:1px solid var(--line); color:#7d8982; font-size:10px; font-weight:800; letter-spacing:.06em; text-align:left; text-transform:uppercase; white-space:nowrap; }
.table td { padding:11px 12px; border-bottom:1px solid #eef1ec; color:#3d4b45; vertical-align:top; }
.table tr:last-child td { border-bottom:0; }
.table td a { color:var(--forest); font-weight:700; }
.code { display:block; padding:11px 12px; border-radius:10px; background:#f3f5f1; color:#20302a; font-family:ui-monospace,Menlo,Consolas,monospace; font-size:12px; word-break:break-all; user-select:all; }

/* Auth */
.auth-page { min-height:100vh; display:grid; place-items:center; padding:24px 16px; background:var(--cream); }
.auth-card { width:min(420px,100%); padding:28px; border:1px solid #e4e9e0; border-radius:22px; background:#fff; box-shadow:0 14px 40px #153d3010; }
.auth-card .brand { margin-bottom:26px; }
.auth-card h1 { color:var(--forest); font-size:27px; }
.auth-card > p { margin:8px 0 22px; color:var(--muted); font-size:13px; line-height:1.55; }
.auth-links { display:flex; justify-content:space-between; margin-top:16px; font-size:12px; }
.auth-links a { color:var(--forest); font-weight:700; }

/* Push banner */
.push-banner { display:none; align-items:center; gap:12px; margin-bottom:16px; padding:13px 15px; border-radius:14px; background:var(--forest); color:#fff; font-size:12px; line-height:1.45; }
.push-banner.show { display:flex; }
.push-banner .ic { color:var(--gold); }
.push-banner button { margin-left:auto; flex:none; padding:9px 13px; border-radius:999px; background:var(--mint); color:var(--forest); font-size:11px; font-weight:800; }
.push-banner .dismiss { background:transparent; color:#b8cabe; padding:9px 4px; }

/* More menu */
.menu-list { display:grid; gap:8px; }
.menu-list a, .menu-list button { display:flex; align-items:center; gap:13px; width:100%; padding:15px; border:1px solid #e4e9e3; border-radius:14px; background:#fff; color:var(--forest); font-size:14px; font-weight:700; text-align:left; }
.menu-list a small { display:block; margin-top:3px; color:var(--muted); font-size:11px; font-weight:400; }
.menu-list a .ic:last-child { margin-left:auto; color:#9aa59f; }
.menu-list .soon { opacity:.55; }

/* Public tweaks */
.public-page .brand-mark svg { color:var(--mint); }
.video-card { cursor:default; }

@media (max-width:850px) {
  .metric-grid { grid-template-columns:1fr 1fr; gap:9px; margin:13px 0 28px; }
  .filter-grid { grid-template-columns:1fr 1fr; }
  .form-grid { grid-template-columns:1fr; }
  .dl-grid { grid-template-columns:1fr 1fr; }
  .card { padding:17px; border-radius:15px; }
  dialog.sheet { width:100%; max-width:100%; margin:auto 0 0; border-radius:22px 22px 0 0; max-height:94vh; }
  dialog.sheet[open] { animation:sheet-up .18s ease-out; }
  .crm-header .search-form { display:none; }
  .hide-mobile { display:none !important; }
  .table-wrap.cards-on-mobile { border:0; background:transparent; }
  .progress-steps { grid-template-columns:repeat(3,1fr); row-gap:10px; }
}
@media (min-width:851px) { .hide-desktop { display:none !important; } }
@keyframes sheet-up { from { transform:translateY(40px); opacity:.6; } to { transform:none; opacity:1; } }
@media (prefers-reduced-motion:reduce) { * { animation:none !important; transition:none !important; } }

/* Compact metric tiles on phones: 17 metrics must not push Today's Actions off-screen */
@media (max-width:850px) {
  .metric-grid a.stat-card { display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:9px; align-items:center; min-height:0; padding:11px 12px; }
  .metric-grid a.stat-card .stat-icon { grid-row:1 / span 2; margin:0; }
  .metric-grid a.stat-card > span:not(.amount) { font-size:10px; line-height:1.25; }
  .metric-grid a.stat-card strong { margin-top:2px; font-size:20px; line-height:1; }
  .metric-grid a.stat-card .amount { grid-column:2; margin-top:2px; font-size:10px; }
}
.dash-order { display:flex; flex-direction:column; }
@media (max-width:850px) { .dash-actions { order:-1; } }

/* Lead owner bar */
.owner-bar { display:flex; align-items:center; gap:10px; margin:-6px 0 14px; padding:10px 12px; border:1px solid #e3e9e1; border-radius:14px; background:#fff; font-size:12px; color:#4c5a54; }
.owner-bar .owner-text { flex:1; min-width:0; }
.owner-bar b { color:var(--forest); }
.owner-bar form { margin:0; }
a.dl-grid > *, .dl-grid a { color:inherit; }
.dl-grid a { display:block; padding:11px; border-radius:11px; background:#f6f8f4; }
.lead-dates{display:flex;flex-wrap:wrap;gap:4px 12px;color:var(--ink-soft,#4b5a52)}.lead-dates span{display:inline-flex;align-items:center;gap:4px}

/* ---------------------------------------------------------------- call queue */
.queue-bar { position:sticky; top:8px; z-index:5; display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0 0 14px; padding:12px 14px; border-radius:16px; background:var(--forest); color:#fff; box-shadow:0 10px 24px -14px #0008; }
.queue-bar > div { flex:1 1 160px; display:flex; flex-direction:column; line-height:1.25; }
.queue-bar > div span { color:#cfe3d8; font-size:13px; }
.queue-bar .secondary-button { background:#ffffff14; border-color:#ffffff55; color:#fff; }
.queue-bar .primary-button { background:var(--gold); color:var(--forest); }
.queue-bar .text-button { color:#cfe3d8; }
.queue-start { display:flex; align-items:center; gap:14px; padding:16px 18px; border-radius:18px; background:var(--forest); color:#fff; text-decoration:none; }
.queue-start .qs-ic { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:var(--gold); color:var(--forest); flex:none; }
.queue-start strong { display:block; font-size:18px; }
.queue-start small { color:#cfe3d8; font-size:13px; }
.queue-start .ic:last-child { margin-left:auto; }

/* ---------------------------------------------------------------- survey cards */
.survey-list { display:grid; gap:10px; }
.survey-card { display:flex; gap:14px; padding:14px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.survey-card.needs { border-color:#e7cf9c; background:#fffaf0; }
.survey-when { flex:none; display:flex; flex-direction:column; align-items:center; justify-content:center; width:58px; height:58px; border-radius:14px; background:var(--mint); color:var(--forest); }
.survey-card.needs .survey-when { background:#f5e6c4; color:#7a5510; }
.survey-day { font-size:12px; font-weight:700; text-transform:none; }
.survey-date { font-size:15px; font-weight:800; }
.survey-body { flex:1; min-width:0; }
.survey-body .row { display:flex; align-items:center; gap:8px; }
.survey-body .row strong a { color:var(--forest); }
.survey-body .spacer { flex:1; }
.survey-line { display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin:4px 0 0; color:var(--ink); font-size:13.5px; }
.survey-line a { color:var(--forest); font-weight:600; }
.survey-notes { margin:8px 0 0; padding:8px 10px; border-radius:10px; background:#f4f7f3; color:#3b4a44; font-size:13.5px; line-height:1.5; }
.survey-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.survey-actions:empty { display:none; }

/* ---------------------------------------------------------------- week planner */
.planner-head { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:12px; }
.planner-head h2 { margin:0 6px; font-size:20px; color:var(--forest); }
.planner-filter { margin-left:auto; }
.planner-filter select { height:40px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:#fff; font:inherit; }
.planner { border:1px solid var(--line); border-radius:18px; background:#fff; overflow:hidden; }
.planner-scale { position:relative; height:26px; margin-left:86px; border-bottom:1px solid var(--line); }
.planner-scale span { position:absolute; top:6px; font-size:11px; color:var(--muted); transform:translateX(-50%); }
.planner-scale span:first-child { display:none; }
.planner-row { display:flex; min-height:64px; border-bottom:1px solid var(--line); }
.planner-row:last-child { border-bottom:0; }
.planner-row.today { background:#f6fbf7; }
.planner-day { flex:none; width:86px; padding:10px 12px; border-right:1px solid var(--line); display:flex; flex-direction:column; font-size:13px; color:var(--muted); }
.planner-day b { color:var(--forest); font-size:14px; }
.planner-row.today .planner-day b::after { content:" · today"; font-weight:600; color:var(--muted); font-size:12px; }
.planner-track { position:relative; flex:1; min-height:64px;
  background-image:repeating-linear-gradient(to right, transparent 0, transparent calc(100% / var(--span) * 2 - 1px), #eef1ec calc(100% / var(--span) * 2 - 1px), #eef1ec calc(100% / var(--span) * 2)); }
.planner-none { position:absolute; left:12px; top:22px; font-size:12px; color:#a8b2ac; }
.planner-block { position:absolute; top:6px; bottom:6px; display:flex; flex-direction:column; justify-content:center; min-width:86px; padding:4px 8px; overflow:hidden;
  border-radius:10px; border-left:4px solid var(--forest); background:var(--mint); color:var(--forest); text-decoration:none; font-size:12px; line-height:1.25; }
.planner-block:hover, .planner-block:focus-visible { z-index:2; box-shadow:0 6px 16px -8px #0006; outline:none; }
.planner-block.req { border-left-color:#c98a12; background:#fbefd3; color:#6b4a0c; border-style:dashed solid dashed solid; }
.planner-block.done { border-left-color:#2f7a52; background:#e4f3ea; opacity:.85; }
.planner-block.miss { border-left-color:#b5483a; background:#f8e3df; color:#7d2d22; }
.pb-time { font-weight:700; white-space:nowrap; }
.pb-name, .pb-meta { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pb-name { font-weight:700; }
.pb-meta { opacity:.8; }
.planner-key { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin-top:8px; }
.planner-key .key { display:inline-block; width:14px; height:10px; border-radius:3px; margin-left:6px; background:var(--mint); border-left:3px solid var(--forest); }
.planner-key .key.req { background:#fbefd3; border-left-color:#c98a12; }
.planner-key .key.done { background:#e4f3ea; border-left-color:#2f7a52; }
.planner-key .key.miss { background:#f8e3df; border-left-color:#b5483a; }
/* phones: each day becomes a simple list */
@media (max-width: 760px) {
  .planner-scale { display:none; }
  .planner-row { flex-direction:column; min-height:0; }
  .planner-row.empty-day { flex-direction:row; align-items:center; }
  .planner-day { width:auto; flex-direction:row; gap:8px; border-right:0; padding:10px 12px 4px; }
  .planner-row.empty-day .planner-day { padding-bottom:10px; }
  .planner-track { background:none; min-height:0; padding:0 10px 10px; display:grid; gap:6px; }
  .planner-row.empty-day .planner-track { padding:0; }
  .planner-none { position:static; display:block; padding:0 0 0 4px; }
  .planner-block { position:static; width:auto !important; padding:8px 10px; }
}
.notice.gold { background:#fbf1dc; color:#6b4a0c; text-decoration:none; }
a.notice { display:flex; align-items:center; }
a.notice > .ic:last-child { margin-left:auto; }
.survey-card p { min-height:0; }
.survey-card .survey-line { color:var(--ink); }
.planner-block { min-width:132px; }
.planner-row.today .planner-day b::after { content:none; }
.planner-row.today .planner-day span::after { content:" · today"; font-weight:700; color:var(--forest); }
@media (max-width: 760px) { .quick-actions { display:grid; grid-template-columns:1fr 1fr; } }
.queue-start { margin-top:12px; }
.planner-row { min-height:calc(var(--lanes, 1) * 54px + 10px); }
.planner-track { min-height:calc(var(--lanes, 1) * 54px + 10px); }
.planner-block { top:calc(6px + var(--lane, 0) * 54px); bottom:auto; height:48px; }
.planner-block.req { border:1px dashed #c98a12; border-left:4px solid #c98a12; }
@media (max-width: 760px) { .planner-row, .planner-track { min-height:0; } .planner-block { height:auto; } }
.planner-row, .planner-track { min-height:calc(var(--lanes, 1) * 58px + 10px); }
.planner-block { top:calc(5px + var(--lane, 0) * 58px); height:53px; padding:3px 8px; }

/* ---------- Survey day sheet (screen + print) ---------- */
.planner-print { margin-top:4px; font-size:11px; font-weight:600; color:var(--forest); text-decoration:none; display:inline-flex; align-items:center; gap:3px; }
.planner-print:hover { text-decoration:underline; }
.ds-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:14px; }
.ds-pick { display:flex; flex-wrap:wrap; gap:8px; }
.ds-pick input, .ds-pick select { height:40px; padding:0 10px; border:1px solid var(--line); border-radius:10px; background:#fff; font:inherit; }
.day-sheet { background:#fff; border:1px solid var(--line); border-radius:18px; padding:18px; margin-bottom:18px; }
.ds-head { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:12px; }
.ds-head h2 { margin:4px 0 2px; font-size:22px; color:var(--forest); }
.ds-head p { margin:0; }
.ds-timeline { position:relative; margin:4px 0 16px; padding-top:20px; }
.ds-scale { position:absolute; inset:0 0 auto 0; height:18px; }
.ds-scale span { position:absolute; top:0; font-size:10px; color:var(--muted); transform:translateX(-50%); }
.ds-scale span:first-child { transform:none; } .ds-scale span:last-child { transform:translateX(-100%); }
.ds-track { position:relative; height:calc(var(--lanes,1) * 40px + 4px); border:1px solid var(--line); border-radius:10px;
  background:repeating-linear-gradient(90deg, transparent 0, transparent calc(100%/12 - 1px), var(--line) calc(100%/12 - 1px), var(--line) calc(100%/12)); }
.ds-block { position:absolute; top:calc(var(--lane,0) * 40px + 3px); height:34px; display:flex; align-items:center; gap:5px; padding:0 7px; overflow:hidden; white-space:nowrap;
  min-width:30px; border-radius:7px; background:var(--mint); border-left:3px solid var(--forest); font-size:12px; color:var(--forest); box-sizing:border-box; }
.ds-block b { flex:none; display:inline-grid; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--forest); color:#fff; font-size:11px; }
.ds-block span { overflow:hidden; text-overflow:ellipsis; font-weight:600; }
.ds-block small { color:inherit; opacity:.75; }
.ds-block.req { background:#fbefd3; border-left-color:#c98a12; color:#6b4a0c; }
.ds-visits { list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.ds-visit { display:flex; gap:12px; border:1px solid var(--line); border-radius:14px; padding:14px; break-inside:avoid; page-break-inside:avoid; }
.ds-num { flex:none; width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:var(--forest); color:#fff; font-weight:700; }
.ds-main { flex:1; min-width:0; }
.ds-top { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ds-time { font-weight:700; font-size:15px; color:var(--forest); }
.ds-ref { font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
.ds-main h3 { margin:2px 0 8px; font-size:19px; }
.ds-main h3 a { color:inherit; text-decoration:none; }
.ds-grid { display:grid; grid-template-columns:1fr 1fr; gap:4px 18px; }
.ds-grid p { margin:0 0 5px; min-height:0; display:flex; gap:6px; align-items:flex-start; line-height:1.4; }
.ds-grid p .ic { flex:none; margin-top:2px; color:var(--muted); }
.ds-addr b { letter-spacing:.02em; }
.ds-notes { margin-top:8px; padding:9px 11px; border-radius:10px; background:#f6f4ec; font-size:14px; line-height:1.45; }
.ds-write { margin-top:10px; font-size:13px; }
.ds-write span { margin-right:16px; white-space:nowrap; }
.ds-lines { margin-top:8px; height:72px; background:repeating-linear-gradient(transparent 0, transparent 23px, #b9c2bd 23px, #b9c2bd 24px); }
.ds-foot { margin:12px 0 0; }
.print-only { display:none; }
@media (max-width: 760px) {
  .day-sheet { padding:14px 12px; border-radius:14px; }
  .ds-grid { grid-template-columns:1fr; }
  .ds-visit { padding:12px 10px; gap:10px; }
  .ds-block small { display:none; }
  .ds-scale span.odd { display:none; }
}
@media print {
  @page { size:A4; margin:12mm; }
  html, body, .crm-body { background:#fff !important; }
  .sidebar, .crm-header, .bottom-nav, .push-banner, .flash, .no-print { display:none !important; }
  .crm-page, .crm-content, main { display:block !important; margin:0 !important; padding:0 !important; max-width:none !important; width:auto !important; }
  .print-only { display:block; }
  .day-sheet { border:0; border-radius:0; padding:0; margin:0; }
  .day-sheet + .day-sheet { break-before:page; page-break-before:always; }
  .ds-grid { grid-template-columns:1fr 1fr; }
  .ds-visit { border-color:#999; }
  .ds-main h3 a, .ds-grid a { color:#000; text-decoration:none; }
  .ds-block, .ds-num, .ds-block b, .ds-notes, .status-pill { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .ds-block small { display:inline; }
}

/* ---------- View as (admin looking at someone else's account) ---------- */
.viewas-bar { position:sticky; top:0; z-index:40; display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:0 0 14px; padding:10px 14px;
  border-radius:14px; background:#fbefd3; border:1px solid #e6c77a; color:#5b3f08; font-size:14px; box-shadow:0 6px 18px -12px #0005; }
.viewas-bar span { flex:1; min-width:200px; }
.viewas-bar small { display:block; color:#7a5a1c; }
.viewas-bar button { display:inline-flex; align-items:center; gap:6px; height:38px; padding:0 14px; border:0; border-radius:999px;
  background:#5b3f08; color:#fff; font:inherit; font-weight:700; cursor:pointer; }
@media print { .viewas-bar { display:none !important; } }

/* ---------- "Call" in the phone menu bar: the main thing staff do ---------- */
.bottom-nav a.nav-call > span { display:grid; place-items:center; width:46px; height:46px; margin-top:-22px; border-radius:50%;
  background:var(--forest); color:#fff; box-shadow:0 8px 18px -8px #0b3b2e99; border:3px solid #fff; }
.bottom-nav a.nav-call { color:var(--forest); font-weight:700; }
.bottom-nav a.nav-call.active > span { background:#0b2e24; }
.bottom-nav a.nav-call b { top:-24px; right:calc(50% - 28px); }

/* ---------- Dictation + property fit ---------- */
.dictate { display:inline-flex; width:auto; align-self:flex-start; align-items:center; gap:8px; margin-top:8px; min-height:44px; padding:0 18px;
  border:1.5px solid var(--forest); border-radius:999px; background:#f3f9f5; color:var(--forest); font:inherit; font-size:14px; font-weight:700; cursor:pointer; }
.dictate .ic { width:18px; height:18px; }
.dictate.on { background:#b5483a; border-color:#b5483a; color:#fff; animation:dictate-pulse 1.4s ease-in-out infinite; }
.dictate-hint { margin:6px 0 0; min-height:0; font-size:12px; color:#6c7a73; }
@keyframes dictate-pulse { 50% { box-shadow:0 0 0 6px #b5483a33; } }
@media (prefers-reduced-motion: reduce) { .dictate.on { animation:none; } }
.queue-bar .queue-fit { margin-top:3px; font-weight:600; color:#fff !important; }
.queue-bar .queue-fit.fit-0::before { content:"★ "; color:#f2c46d; }
.queue-bar .queue-fit.fit-3 { color:#f6c9c1 !important; }
@media print { .dictate { display:none; } }

/* ---------- Decide card (who calls, which company, the plan) ---------- */
.decide-card { margin:0 0 14px; padding:16px; border:2px solid var(--gold); border-radius:18px; background:#fffaf0; }
.decide-card.decided { border-width:1px; border-color:var(--line); background:#fff; }
.decide-head { display:flex; flex-wrap:wrap; align-items:flex-start; gap:8px 12px; }
.decide-head > div { flex:1 1 220px; }
.decide-head h3 { margin:4px 0 2px; font-size:17px; color:var(--forest); }
.decide-head p { margin:0; min-height:0; }
.fit-chip { padding:5px 10px; border-radius:999px; font-size:12px; font-weight:700; background:#eef3ef; color:var(--forest); white-space:nowrap; }
.fit-chip.fit-0 { background:#dcefe3; } .fit-chip.fit-0::before { content:"★ "; color:#c98a12; }
.fit-chip.fit-3 { background:#f8e3df; color:#7d2d22; }
.decide-form { display:none; margin-top:14px; }
.decide-form.open { display:block; }
.decide-form select { width:100%; }
.decide-plans { border:0; padding:0; margin:14px 0; display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; }
.decide-plans legend { margin-bottom:6px; }
.plan-option { display:flex; gap:8px; align-items:flex-start; padding:12px; border:1px solid var(--line); border-radius:12px; background:#fff; cursor:pointer; }
.plan-option:has(input:checked) { border-color:var(--forest); box-shadow:0 0 0 1px var(--forest); background:#f3f9f5; }
.plan-option input { margin-top:3px; accent-color:var(--forest); }
.plan-option small { display:block; color:var(--muted); font-size:12px; margin-top:2px; }
@media (max-width: 760px) { .decide-plans { grid-template-columns:1fr; } .decide-card { padding:14px 12px; } }

/* ---------- Lead page: all sections on one page, chips jump between them ---------- */
.lead-jump { position:sticky; top:0; z-index:6; display:flex; align-items:center; gap:8px; margin:14px -4px 12px; padding:8px 4px; background:#f4f6f1;
  box-shadow:0 8px 12px -12px #0003; }
.lead-jump > .jump-all { flex:none; display:inline-flex; align-items:center; border-radius:999px; text-decoration:none; font-weight:700; }
.lead-jump .jump-scroll { flex:1; min-width:0; margin:0; align-items:center; padding-bottom:0; }
.queue-bar ~ .lead-jump { top:80px; }
.lead-section { scroll-margin-top:72px; margin-bottom:18px; }
.queue-bar ~ .lead-section { scroll-margin-top:150px; }
.lead-section + .lead-section { padding-top:4px; }
@media (max-width: 760px) { .queue-bar ~ .lead-jump { top:96px; } .queue-bar ~ .lead-section { scroll-margin-top:170px; } }
@media print { .lead-jump { position:static; box-shadow:none; } }
/* "View all" is the first, filled button: always back to the whole lead */
.lead-jump > a.jump-all { gap:6px; padding:10px 16px; font-size:13px; background:var(--forest); border-color:var(--forest); color:#fff; box-shadow:0 4px 10px -6px #0b3b2e88; }
.lead-jump > a.jump-all.active { background:#0b2e24; }
.lead-jump .jump-label { flex:none; padding:0 2px 0 6px; color:#7d8a83; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.lead-jump a.active:not(.jump-all) { border-color:var(--forest); background:#e4f1e8; color:var(--forest); }
/* Back to top: big, labelled, bottom centre */
.to-top { position:fixed; left:50%; bottom:24px; z-index:30; display:inline-flex; align-items:center; gap:8px; height:48px; padding:0 20px;
  border-radius:999px; background:var(--forest); color:#fff; font-size:15px; font-weight:700; text-decoration:none; box-shadow:0 10px 24px -8px #0008;
  opacity:0; transform:translate(-50%, 10px); pointer-events:none; transition:opacity .2s, transform .2s; }
.to-top.show { opacity:1; transform:translate(-50%, 0); pointer-events:auto; }
@media (max-width: 760px) { .to-top { bottom:104px; } }
@media (prefers-reduced-motion: reduce) { .to-top { transition:none; } }
@media print { .to-top { display:none; } }
.visit-result { display:flex; width:100%; justify-content:center; align-items:center; gap:10px; margin-top:12px; min-height:56px; font-size:16px; }
.visit-result span { display:flex; flex-direction:column; align-items:flex-start; line-height:1.2; }
.visit-result small { font-size:12px; font-weight:600; opacity:.85; }

/* ---------- Leads list: active filters, Clear on the left ---------- */
.active-filters { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:10px 12px; border-radius:14px; background:#e9f3ec; border:1px solid #cfe3d6; }
.clear-filters { display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:0 16px; border-radius:999px; background:var(--forest); color:#fff;
  font-size:14px; font-weight:700; text-decoration:none; box-shadow:0 4px 10px -6px #0b3b2e88; }
.clear-filters:hover { background:#0b2e24; }
.af-label { color:#56655d; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.af-chip { display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 12px; border-radius:999px; background:#fff; border:1.5px solid var(--forest);
  color:var(--forest); font-size:14px; font-weight:700; text-decoration:none; }
.af-chip .ic { opacity:.7; }

/* ---------- EPC on the property card ---------- */
.epc-band { display:inline-grid; place-items:center; min-width:28px; height:24px; padding:0 6px; border-radius:6px; color:#fff; font-weight:800; font-size:13px; background:#8a968f; }
.epc-a { background:#008054; } .epc-b { background:#19b459; } .epc-c { background:#8dce46; color:#1d2b10; } .epc-d { background:#ffd500; color:#3a3000; }
.epc-e { background:#fcaa65; color:#3a2000; } .epc-f { background:#ef8023; } .epc-g { background:#e9153b; }
.epc-choose { margin:8px 0; padding:10px; border:1px solid var(--line); border-radius:12px; background:#fbfcfa; }
.epc-choose p { margin:0 0 8px; min-height:0; }
.epc-option { display:flex; align-items:center; gap:10px; padding:8px 0; border-top:1px solid var(--line); }
.epc-option:first-of-type { border-top:0; }
.epc-addr { flex:1; min-width:0; display:flex; flex-direction:column; font-size:13px; }
.epc-addr small { color:var(--muted); font-size:11px; }
.epc-note { margin:4px 0 0; min-height:0; }
.epc-check { margin:6px 0 4px; }
.epc-was { color:#9a5b12; font-weight:600; }
.detail-row span.epc-band { color:#fff; }
.detail-row span.epc-c, .detail-row span.epc-d, .detail-row span.epc-e { color:#2b2400; }
.detail-row span.epc-was { color:#9a5b12; font-weight:700; }

/* AI calls (Vapi) */
.ai-calls { margin-bottom:14px; }
.ai-call p { margin:6px 0 0; }
.ai-transcript { margin-top:8px; font-size:13.5px; }
.ai-transcript summary { cursor:pointer; color:var(--forest); font-weight:600; min-height:32px; display:flex; align-items:center; }
.ai-transcript div { white-space:normal; max-height:340px; overflow:auto; padding:8px 10px; background:var(--surface-2, #f4f7f4); border-radius:10px; }
.survey-line.ai-held { color:var(--forest); flex-wrap:nowrap; align-items:flex-start; }
.survey-line.ai-held svg { flex:none; margin-top:3px; }
.survey-hours { border:0; padding:0; margin:0; }
.day-picks { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 12px; }
.day-pick input { position:absolute; opacity:0; pointer-events:none; }
.day-pick span { display:inline-flex; align-items:center; justify-content:center; min-width:52px; min-height:44px; padding:0 10px; border:1px solid #dfe6df; border-radius:12px; font-weight:600; cursor:pointer; }
.day-pick input:checked + span { background:var(--forest); color:#fff; border-color:var(--forest); }
.day-pick input:focus-visible + span { outline:2px solid var(--forest); outline-offset:2px; }

/* New lead pop-up */
#lead-pops { position:fixed; z-index:90; right:16px; top:16px; display:flex; flex-direction:column; gap:10px; width:min(380px, calc(100vw - 32px)); }
.lead-pop { background:#fff; border:2px solid var(--forest); border-radius:16px; padding:14px 16px; box-shadow:0 12px 32px rgba(16,60,53,.22); animation:pop-in .25s ease-out; }
.lead-pop strong { display:block; color:var(--forest); font-size:16px; }
.lead-pop p { margin:4px 0 10px; font-size:14px; color:var(--ink); }
.lead-pop-actions { display:flex; gap:12px; align-items:center; }
.lead-pop-survey_requested { border-color:#c9a24a; }
@keyframes pop-in { from { transform:translateY(-8px); opacity:0; } to { transform:none; opacity:1; } }
@media (prefers-reduced-motion: reduce) { .lead-pop { animation:none; } }
@media print { #lead-pops { display:none; } }
.decide-why { display:flex; gap:6px; align-items:flex-start; margin:6px 0 0; color:var(--forest); }
.decide-why svg { flex:none; margin-top:2px; }
.quick-actions .inline-form { display:flex; flex:1; margin:0; }
.quick-actions .inline-form button { width:100%; }

/* Lead source report */
.report-dates { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-end; font-size:13px; }
.report-dates label { display:flex; flex-direction:column; gap:4px; font-weight:600; color:#5f6e67; }
.report-dates input { height:40px; padding:0 10px; border:1px solid #dfe6df; border-radius:10px; font:inherit; }
.report-tiles { display:grid; grid-template-columns:repeat(5, 1fr); gap:10px; }
.report-tiles > div { padding:14px; border:1px solid #e3e9e1; border-radius:14px; background:#fff; }
.report-tiles span { display:block; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#7d8982; }
.report-tiles b { display:block; margin-top:4px; font-size:26px; color:var(--forest); }
.report-tiles small { color:#6c7973; font-size:12px; }
.report-tiles .hl { background:var(--mint, #e6f4ec); border-color:transparent; }
.report-table .num { text-align:right; white-space:nowrap; }
.report-table small { color:#7d8982; }
.report-table th[scope=row] { text-align:left; font-size:13px; text-transform:none; letter-spacing:0; color:var(--forest); white-space:normal; min-width:150px; }
.report-table .camp-row th[scope=row] { padding-left:26px; font-weight:500; color:#3d4b45; }
.report-table .camp-row td { color:#5f6e67; }
.report-table .src-row td, .report-table .src-row th { background:#f7faf6; }
.report-table .total-row td, .report-table .total-row th { border-top:2px solid var(--line); font-weight:700; }
.report-help { font-size:13px; color:#3d4b45; }
.report-help summary { cursor:pointer; font-weight:700; color:var(--forest); min-height:36px; display:flex; align-items:center; }
.report-help li { margin:6px 0; }
@media (max-width:760px) { .report-tiles { grid-template-columns:1fr 1fr; } .report-tiles .hl { grid-column:span 2; } }
.report-table th[scope=row], .report-table thead th:first-child { position:sticky; left:0; z-index:1; background:#fff; box-shadow:1px 0 0 #eef1ec; }
.report-table .src-row th[scope=row] { background:#f7faf6; }
.notice a { color:inherit; font-weight:700; text-decoration:underline; }

/* "Ask the CRM" helper (layouts/crm.php + js/assistant.js) */
.assist-fab { position:fixed; right:16px; bottom:88px; z-index:60; display:flex; align-items:center; gap:7px; padding:12px 16px; border-radius:999px;
  background:var(--forest); color:var(--mint); font-weight:800; font-size:13px; box-shadow:0 12px 30px #0b2a2140; }
.assist { position:fixed; z-index:70; left:0; right:0; bottom:0; height:min(78vh, 620px); display:flex; flex-direction:column; background:#fff;
  border-radius:22px 22px 0 0; box-shadow:0 -20px 60px #0b2a2133; }
.assist[hidden] { display:none; }
.assist-head { display:flex; align-items:center; gap:4px; padding:14px 12px 10px 18px; border-bottom:1px solid var(--line); }
.assist-head div { flex:1; display:flex; flex-direction:column; }
.assist-head b { color:var(--forest); font-size:16px; }
.assist-head small { color:var(--muted); font-size:11px; }
.assist-head [aria-pressed="true"] { background:var(--mint); color:var(--forest); }
.assist-log { flex:1; overflow-y:auto; padding:14px 14px 6px; display:flex; flex-direction:column; gap:8px; }
.assist-ai, .assist-me { max-width:88%; padding:10px 13px; border-radius:14px; font-size:14px; line-height:1.45; white-space:pre-line; }
.assist-ai { align-self:flex-start; background:var(--cream); color:var(--ink); }
.assist-me { align-self:flex-end; background:var(--forest); color:#fff; }
.assist-wait { color:var(--muted); animation:assist-dots 1s ease-in-out infinite; }
@keyframes assist-dots { 50% { opacity:.4; } }
.assist-link { display:inline-block; margin:8px 8px 0 0; padding:7px 11px; border-radius:999px; background:var(--forest); color:#fff !important; font-size:12px; font-weight:800; white-space:nowrap; }
.assist-chips { display:flex; flex-wrap:wrap; gap:6px; padding:4px 14px 8px; }
.assist-chips button { padding:8px 12px; border-radius:999px; border:1px solid var(--line); background:#fff; color:var(--forest); font-size:12px; font-weight:700; }
.assist-form { display:flex; align-items:center; gap:6px; padding:10px 12px calc(12px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); }
.assist-form input { flex:1; min-width:0; padding:12px 14px; border:1px solid #dfe6df; border-radius:12px; font:inherit; font-size:15px; }
.assist-send { background:var(--forest); color:#fff; }
.assist-mic.on { background:#b4533c; color:#fff; animation:assist-dots 1s ease-in-out infinite; }
@media (min-width: 851px) {
  .assist-fab { bottom:24px; right:24px; }
  .assist { left:auto; right:24px; bottom:24px; width:400px; height:min(600px, calc(100vh - 48px)); border-radius:22px; }
}
@media print { .assist-fab, .assist { display:none !important; } }
.assist-chips[hidden] { display:none; }
.assist-links { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; white-space:normal; }
.assist-links .assist-link { margin:0; }
.know-card { padding:14px 16px; }
.know-card summary { display:flex; align-items:center; gap:10px; cursor:pointer; list-style:none; }
.know-card summary::-webkit-details-marker { display:none; }
.know-card summary .lead-main { flex:1; }
.know-body { margin-top:12px; color:var(--ink); font-size:14px; line-height:1.55; }
.know-cat { margin:26px 0 10px; color:var(--forest); font-size:18px; }
/* website traffic report */
.traffic-tiles { grid-template-columns:repeat(4, 1fr); }
.traffic-legend { display:flex; flex-wrap:wrap; gap:6px 16px; margin:0 0 10px; padding:0; list-style:none; font-size:13px; color:#3d4b45; }
.traffic-legend li { display:inline-flex; align-items:center; gap:6px; }
.traffic-legend i, .src-dot { display:inline-block; width:10px; height:10px; border-radius:3px; flex:none; }
.src-dot { margin-right:8px; vertical-align:0; }
.traffic-svg { display:block; width:100%; height:auto; overflow:visible; }
.traffic-svg .grid { stroke:#e8ede7; stroke-width:1; }
.traffic-svg .base { stroke:#c9d3cc; stroke-width:1; }
.traffic-svg .ax { fill:#7d8982; font-size:11px; font-family:inherit; }
.traffic-svg .bar rect:not(.hit) { stroke:#fff; stroke-width:1; }
.traffic-svg .hit { fill:transparent; }
.traffic-svg .bar:hover .hit { fill:#103c350d; }
.traffic-svg .lead-bar { fill:var(--forest, #103c35); }
.traffic-sub { margin:18px 0 4px; font-size:13px; color:var(--forest); }
.share-cell { min-width:120px; white-space:nowrap; }
.share-bar { display:inline-block; width:80px; height:8px; margin-right:8px; border-radius:4px; background:#eef2ed; vertical-align:middle; overflow:hidden; }
.share-bar i { display:block; height:100%; border-radius:4px; }
.traffic-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.traffic-grid .card { margin:0; }
.how-list { margin:0; padding:0; list-style:none; }
.how-list li { display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid #eef2ed; font-size:14px; }
.how-list b { color:var(--forest); }
@media (max-width:760px) { .traffic-tiles { grid-template-columns:1fr 1fr; } .traffic-tiles .hl { grid-column:auto; } .traffic-grid { grid-template-columns:1fr; } .traffic-svg .ax { font-size:24px; } }
/* Approve list */
.approve-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
.approve-head p { margin:0; }
.approve-counts { display:flex; flex-wrap:wrap; gap:6px; }
.rate-chip { display:inline-flex; align-items:center; gap:5px; padding:5px 10px; border-radius:999px; font-size:12px; font-weight:800; white-space:nowrap; }
.rate-hot { background:#fbe1d9; color:#8a2c17; }
.rate-warm { background:#fbefd3; color:#7a5410; }
.rate-not_ready { background:#e4eef8; color:#1f4f7d; }
.rate-not_suitable { background:#eceeec; color:#5d6762; }
.approve-list { display:grid; gap:12px; }
.approve-card { padding:16px 18px; border:1px solid #e3e9e1; border-left:4px solid #d9e1da; border-radius:16px; background:#fff; }
.approve-card.is-hot { border-left-color:#d4552f; }
.approve-card.is-warm { border-left-color:#e2a52c; }
.approve-card.is-not_ready { border-left-color:#4a86c0; }
.approve-card header { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.approve-who { display:flex; flex-direction:column; gap:2px; min-width:0; }
.approve-who a { color:var(--forest); font-size:17px; text-decoration:none; }
.approve-facts { margin:10px 0 0; font-size:14px; color:#26332f; font-weight:600; }
.approve-summary { margin:8px 0 0; font-size:14px; line-height:1.5; color:#3d4b45; }
.approve-checks { display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 0; padding:0; list-style:none; font-size:12px; }
.approve-checks li { padding:4px 9px; border-radius:8px; background:#f2f5f1; color:#4b5952; }
.approve-checks li.v-no { background:#f8e3df; color:#7d2d22; }
.approve-checks li.v-yes b { color:#1b6b45; }
.approve-q, .approve-visit { display:flex; gap:8px; align-items:flex-start; margin:10px 0 0; padding:9px 11px; border-radius:10px; background:#f7f5ee; font-size:13px; line-height:1.45; }
.approve-visit { background:#e7f4ec; }
.approve-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:14px; }
.approve-actions .primary-button, .approve-actions .secondary-button { padding:10px 14px; font-size:13.5px; }
.approve-more { flex-basis:100%; font-size:13px; }
.approve-more summary { cursor:pointer; color:var(--forest); font-weight:700; min-height:32px; display:inline-flex; align-items:center; }
.approve-more-body { display:grid; gap:10px; margin-top:6px; }
.approve-card-lead { margin-bottom:14px; }
.decide-more { margin-bottom:14px; }
.decide-more > summary { cursor:pointer; color:var(--forest); font-weight:700; font-size:13px; min-height:36px; display:inline-flex; align-items:center; gap:6px; }
@media (max-width:640px) { .approve-actions .primary-button { flex-basis:100%; justify-content:center; } .approve-actions .secondary-button { flex:1; justify-content:center; } }
.area-tag { margin-left:8px; padding:2px 8px; border-radius:6px; background:#eef3ef; color:#3d4b45; font-size:11px; font-weight:800; letter-spacing:.02em; }
.chip-alert { border-color:#e2a52c; background:#fbefd3; color:#7a5410; }
/* dashboard: website visitors */
.dash-traffic { padding:18px 20px; border:1px solid #e3e9e1; border-radius:20px; background:#fff; }
.dt-head { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-bottom:14px; }
.dt-head h2 { margin:2px 0 0; font-size:20px; color:var(--forest); }
.dt-tiles { display:grid; grid-template-columns:repeat(4, 1fr); gap:10px; margin-bottom:16px; }
.dt-tiles > div { padding:12px 14px; border-radius:14px; background:#f6f8f5; }
.dt-tiles span { display:block; font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#7d8982; }
.dt-tiles b { display:block; margin-top:4px; font-size:28px; line-height:1.1; color:var(--forest); }
.dt-tiles small { color:#6c7973; font-size:12px; }
.dt-tiles .hl { background:var(--mint, #e6f4ec); }
.dt-change { font-weight:800; } .dt-change.up { color:#1b6b45; } .dt-change.down { color:#a03a26; }
.dt-grid { display:grid; grid-template-columns:minmax(0, 1.6fr) minmax(0, 1fr); gap:20px; align-items:start; }
.dt-grid h3 { margin:0 0 8px; font-size:13px; color:var(--forest); }
.dt-table { width:100%; border-collapse:collapse; font-size:13px; }
.dt-table th, .dt-table td { padding:7px 4px; border-bottom:1px solid #eef2ed; text-align:left; font-weight:500; }
.dt-table thead th { font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#7d8982; }
.dt-table .num { text-align:right; white-space:nowrap; }
.dt-table tfoot th, .dt-table tfoot td { font-weight:800; border-bottom:0; }
.dt-src { display:flex; align-items:center; color:#26332f; font-weight:700; }
.dt-share { display:block; width:100%; height:5px; margin:5px 0 0; }
.dt-top { margin:10px 0 0; }
@media (max-width:900px) { .dt-grid { grid-template-columns:1fr; } }
@media (max-width:640px) { .dt-tiles { grid-template-columns:1fr 1fr; } .dash-traffic { padding:14px; } .dt-tiles b { font-size:24px; } }
.dash-traffic { margin-top:16px; }
@media (max-width:760px) { .dash-traffic .traffic-svg .ax { font-size:17px; } }
button.call-big { border:0; font:inherit; font-size:16px; font-weight:800; cursor:pointer; }
.line-call audio { display:block; width:100%; max-width:420px; height:36px; margin-top:8px; }
.transcript { margin-top:6px; font-size:13px; } .transcript summary { cursor:pointer; color:var(--forest); font-weight:700; }
.transcript p { white-space:normal; color:#3d4b45; line-height:1.5; max-height:260px; overflow:auto; }
/* installer manager: your jobs */
.jobs-card { padding:18px 20px; border:1px solid #e3e9e1; border-radius:20px; background:#fff; margin-top:16px; }
.jobs-h { display:flex; align-items:center; gap:8px; margin:14px 0 6px; font-size:14px; color:var(--forest); }
.jobs-h b { margin-left:auto; padding:2px 9px; border-radius:999px; background:#fbefd3; color:#7a5410; font-size:12px; }
.jobs-list { margin:0; padding:0; list-style:none; }
.jobs-list li { display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid #eef2ed; }
.jobs-main { flex:1; min-width:0; display:flex; flex-direction:column; color:#26332f; text-decoration:none; }
.jobs-main small { color:#6c7973; font-size:12.5px; }
.approve-owed { flex-basis:100%; display:flex; gap:6px; align-items:flex-start; margin:0; padding:8px 10px; border-radius:10px; background:#f8e3df; color:#7d2d22; font-size:13px; }
.alerts-nudge { margin-top:14px; }
/* lead page: at a glance */
.glance { margin-top:14px; display:grid; gap:8px; }
.glance-chips { display:flex; flex-wrap:wrap; gap:6px; }
.glance-chips span { padding:5px 10px; border-radius:9px; background:#f2f5f1; color:#3d4b45; font-size:12.5px; font-weight:600; }
.glance-box { display:flex; gap:8px; align-items:flex-start; margin:0; padding:10px 12px; border-radius:12px; background:#f7f5ee; font-size:13.5px; line-height:1.45; color:#26332f; }
.glance-box b { color:var(--forest); }
.glance-box.mint { background:#e7f4ec; } .glance-box.gold { background:#fbefd3; }
.approve-missing { display:flex; gap:6px; margin:8px 0 0; font-size:12.5px; color:#7a5410; }

/* marketing & costs report */
.mk-tiles-4 { grid-template-columns:repeat(4, 1fr); }
.mk-tiles small { display:block; margin-top:2px; }
.chip-form { display:inline-flex; flex:none; align-items:center; gap:4px; }
.chip-form input[type=date] { padding:6px 8px; border:1px solid #dfe6df; border-radius:999px; background:#fff; color:#3d4b45; font:inherit; font-size:11px; }
.chip-form button.chip { cursor:pointer; font:inherit; font-size:11px; font-weight:700; }
.mk-funnel { margin:4px 0 8px; padding:0; list-style:none; display:grid; gap:9px; }
.mk-funnel li { display:grid; grid-template-columns:150px 1fr 56px; grid-template-rows:auto auto; column-gap:12px; align-items:center; }
.mk-f-label { font-size:13px; font-weight:700; color:#26332f; }
.mk-f-track { height:14px; border-radius:4px; background:#f2f5f1; overflow:hidden; }
.mk-f-track i { display:block; height:100%; border-radius:0 4px 4px 0; background:var(--forest, #103c35); }
.mk-funnel b { text-align:right; font-size:15px; color:var(--forest, #103c35); font-variant-numeric:tabular-nums; }
.mk-funnel small { grid-column:2 / 4; color:#6c7973; font-size:11.5px; min-height:0; }
.mk-kinds { display:grid; grid-template-columns:repeat(4, 1fr); gap:10px; }
.mk-kinds > div { padding:12px; border:1px solid #e3e9e1; border-radius:12px; }
.mk-kinds span { display:block; font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:#7d8982; }
.mk-kinds b { display:block; margin:2px 0; font-size:22px; color:var(--forest, #103c35); }
.mk-kinds small { color:#6c7973; font-size:12px; line-height:1.4; }
.mk-table td.num, .mk-convs td.num { white-space:nowrap; font-variant-numeric:tabular-nums; }
.mk-convs td { white-space:nowrap; }
.mk-ok { color:#1d7a4f; }
.mk-downloads { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.mk-spend-form { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:10px; align-items:end; }
.mk-spend-form label { display:grid; gap:5px; color:#6c7a73; font-size:11px; font-weight:800; }
.mk-spend-form label small { font-weight:600; }
.mk-spend-form .wide { grid-column:span 2; }
.mk-spend-form input, .mk-spend-form select { width:100%; padding:10px 12px; border:1px solid #dfe6df; border-radius:12px; background:#fff; color:#26332f; font:inherit; font-size:14px; font-weight:500; }
.mk-spend-form button { justify-self:start; }
@media (max-width:760px) {
  .mk-tiles-4, .mk-kinds { grid-template-columns:1fr 1fr; }
  .mk-funnel li { grid-template-columns:110px 1fr 44px; }
  .mk-spend-form { grid-template-columns:1fr 1fr; }
}
.mk-sm { font-size:16px !important; }
.mk-events { margin:8px 0 0; padding:0; list-style:none; display:grid; gap:4px; font-size:13px; color:#26332f; }
.mk-events time { display:inline-block; width:44px; color:#7d8982; font-variant-numeric:tabular-nums; }
.mk-transcript { display:grid; gap:8px; max-width:760px; }
.mk-transcript p { margin:0; padding:9px 12px; border-radius:12px; font-size:14px; line-height:1.45; color:#26332f; }
.mk-transcript p b { display:block; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#7d8982; }
.mk-transcript .ai { background:#f2f5f1; margin-right:48px; }
.mk-transcript .them { background:#e7f4ec; margin-left:48px; }
.mk-convs tr.mk-more { display:none; }
.mk-all:checked ~ .table-wrap .mk-convs tr.mk-more { display:table-row; }
.mk-all:checked ~ .mk-all-label { display:none; }
.mk-all-label { display:inline-block; margin-top:10px; cursor:pointer; }
.traffic-grid > * { min-width:0; }
.mk-spend-form > * { min-width:0; }
.table-wrap { position:relative; max-width:100%; }
.chips { position:relative; }

/* recovery list */
.rec-list { display:grid; gap:12px; }
.rec-card { display:grid; gap:10px; }
.rec-card + .rec-card { margin-top:0; }
.rec-top { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; }
.rec-name { display:block; font-size:17px; font-weight:800; color:var(--forest); }
.rec-tag { flex:none; padding:4px 9px; border-radius:99px; background:#f2f5f1; color:#5c6b64; font-size:11.5px; font-weight:700; }
.rec-tag.due { background:#fbefd3; color:#7a5410; }
.rec-actions { display:flex; gap:10px; align-items:center; }
.rec-actions form { margin:0; }

/* next step on the lead page */
.next-step { display:flex; gap:10px; align-items:flex-start; margin:0 0 12px; padding:12px 14px; border-radius:14px; background:#e7f4ec; color:#103c35; }
.next-step .ic { flex:none; margin-top:2px; }
.next-step b { font-size:14.5px; }
.next-step small { display:block; margin-top:2px; color:#3d4b45; font-size:12.5px; line-height:1.4; }
.next-step.urgent { background:#fdeee9; color:#8a2f1d; }
.next-who { display:inline-block; margin-left:6px; padding:2px 8px; border-radius:99px; background:#ffffffaa; font-size:11px; font-weight:800; vertical-align:1px; }

/* waiting too long */
.stuck-list { display:grid; gap:10px; }
.stuck-stage { padding:0; }
.stuck-stage + .stuck-stage { margin-top:0; }
.stuck-stage summary { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:14px 18px; cursor:pointer; list-style:none; }
.stuck-stage summary::-webkit-details-marker { display:none; }
.stuck-title { font-weight:800; color:var(--forest); font-size:14.5px; }
.stuck-title small { display:block; font-weight:600; color:#7d8982; font-size:12px; }
.stuck-count { flex:none; padding:4px 10px; border-radius:99px; background:#f2f5f1; color:#5c6b64; font-size:12px; font-weight:800; }
.stuck-count.over { background:#fdeee9; color:#a03a26; }
.stuck-rows { margin:0; padding:0 18px 14px; list-style:none; display:grid; gap:2px; }
.stuck-rows li { display:grid; grid-template-columns:1fr auto; column-gap:10px; padding:7px 0; border-top:1px solid #eef1ec; font-size:13.5px; }
.stuck-rows li a { font-weight:700; color:var(--forest); }
.stuck-rows li small { grid-column:1; color:#7d8982; }
.stuck-rows li span { grid-column:2; grid-row:1 / span 2; align-self:center; color:#5c6b64; font-variant-numeric:tabular-nums; }
.stuck-rows li.over span { color:#a03a26; font-weight:800; }
.stuck-card { display:flex; align-items:center; gap:12px; padding:13px 15px; border:1px solid #e3e9e1; border-radius:16px; background:#fff; color:#26332f; }
.stuck-card > span:nth-child(2) { flex:1; min-width:0; }
.stuck-card strong { display:block; font-size:14.5px; color:var(--forest); }
.stuck-card small { display:block; color:#6c7973; font-size:12.5px; line-height:1.35; }
.stuck-card .qs-ic { display:grid; place-items:center; width:36px; height:36px; border-radius:12px; background:#e7f4ec; color:var(--forest); flex:none; }
.stuck-card.over .qs-ic { background:#fdeee9; color:#a03a26; }
.stuck-card.over strong { color:#a03a26; }
.journey-costs { display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin-top:12px; }
.journey-costs > div { padding:10px; border-radius:12px; background:#f7f5ee; }
.journey-costs span { display:block; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#7d8982; }
.journey-costs span small { display:block; font-weight:600; text-transform:none; letter-spacing:0; }
.journey-costs b { display:block; margin-top:3px; font-size:17px; color:var(--forest); }
.journey-costs .total { background:#e7f4ec; }
.journey-costs .income { grid-column:span 2; background:#e7f4ec; }
@media (max-width:760px) { .journey-costs { grid-template-columns:1fr 1fr; } }
.ok-text { color:#1d7a4f; } .warn-text { color:#a0601a; }
.perm-edit { margin-top:8px; } .perm-edit summary { cursor:pointer; color:var(--forest); font-weight:700; font-size:13px; } .perm-edit form { margin-top:10px; }

/* AI testing lab */
.lab-banner { display:grid; gap:6px; padding:14px 16px; border-radius:16px; background:#e7f4ec; color:#103c35; font-size:13.5px; line-height:1.45; }
.lab-status { font-size:12.5px; } .lab-ok { color:#1d7a4f; font-weight:800; } .lab-bad { color:#a03a26; font-weight:800; }
.lab-grid { display:grid; grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr); gap:14px; align-items:start; }
.lab-side { display:grid; gap:12px; } .lab-side .card { margin:0; } .lab-side h3 { margin:0 0 8px; font-size:14px; color:var(--forest); }
.lab-setup { display:flex; flex-wrap:wrap; gap:8px; align-items:end; margin-bottom:12px; }
.lab-setup label { display:grid; gap:4px; font-size:11px; font-weight:800; color:#6c7a73; }
.lab-setup select { padding:8px 10px; border:1px solid #dfe6df; border-radius:10px; background:#fff; font:inherit; font-size:13px; }
.lab-tick { display:flex !important; align-items:center; gap:6px; font-weight:600 !important; font-size:12.5px !important; }
.lab-conv { display:grid; gap:8px; max-height:560px; overflow:auto; padding:4px; }
.lab-msg { padding:9px 12px; border-radius:12px; font-size:14px; line-height:1.45; white-space:pre-wrap; }
.lab-msg b { display:block; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:#7d8982; }
.lab-msg small { display:block; color:#7d8982; font-size:11px; }
.lab-msg.ai { background:#f2f5f1; margin-right:40px; } .lab-msg.you { background:#e7f4ec; margin-left:40px; }
.lab-send { display:grid; gap:8px; margin-top:10px; }
.lab-send textarea, .lab-code { width:100%; padding:10px 12px; border:1px solid #dfe6df; border-radius:12px; font:inherit; font-size:14px; }
.lab-code { font-family:ui-monospace, Menlo, monospace; font-size:12px; white-space:pre-wrap; word-break:break-all; background:#f7f9f6; }
.lab-send-row { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.lab-tools { display:grid; gap:6px; max-height:360px; overflow:auto; }
.lab-tool { border:1px solid #e3e9e1; border-radius:10px; padding:6px 9px; font-size:12.5px; } .lab-tool.bad { border-color:#f0c4b8; background:#fdf6f3; }
.lab-tool summary { cursor:pointer; } .lab-tool pre { margin:6px 0 0; padding:6px; border-radius:8px; background:#f7f9f6; font-size:11px; white-space:pre-wrap; word-break:break-all; max-height:200px; overflow:auto; }
.lab-diff table td, .lab-diff table th { font-size:11.5px; padding:5px 6px; word-break:break-all; }
.lab-clip { display:grid; gap:3px; margin-bottom:8px; } .lab-clip audio { width:100%; height:32px; }
.lab-res { display:inline-block; padding:2px 8px; border-radius:99px; font-size:11px; font-weight:800; }
.res-pass { background:#dff3e6; color:#1d7a4f; } .res-fail, .res-error { background:#fdeee9; color:#a03a26; } .res-review { background:#fbefd3; color:#7a5410; } .res-not_run { background:#eef1ec; color:#5c6b64; }
.lab-verdict { margin:0 0 6px; padding:8px 10px; border-radius:10px; font-size:12.5px; font-weight:700; }
.lab-batchbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:8px; }
.lab-batchbar select { padding:8px 10px; border:1px solid #dfe6df; border-radius:10px; font:inherit; font-size:13px; }
.lab-progress { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:8px 0; font-size:13px; }
.lab-bar { flex:1 1 200px; height:10px; border-radius:99px; background:#eef2ed; overflow:hidden; } .lab-bar i { display:block; height:100%; width:0; background:var(--forest); }
.lab-scen th[scope=row] { min-width:260px; font-weight:500; color:#26332f; }
.lab-recent { margin:0; padding:0; list-style:none; display:grid; gap:4px; font-size:13px; }
@media (max-width:900px) { .lab-grid { grid-template-columns:1fr; } }
.lab-progress[hidden], .lab-send[hidden] { display:none; }
.lab-mini { font-size:11px; padding:0 4px; }