/* Equipe Hermelo: entrada separada (#admin) e Painel da plataforma. */

/* A entrada da equipe é uma tela de convidado, como o login dos salões. */
html[data-page="admin"] .sidebar,
html[data-page="admin"] :is(.mobile-header, .navigation-backdrop, .skip-content) { display: none; }
html[data-page="admin"] #app { grid-template-columns: 1fr; }
html[data-page="admin"] .content { max-width: none; padding: 0; background: var(--paper, var(--surface-2)); }
html[data-page="admin"] body { background: var(--paper, var(--surface-2)); }

.admin-entry { min-height: 100dvh; display: grid; place-items: center; padding: 32px 16px; }
.admin-card { width: min(420px, 100%); display: grid; gap: 10px; padding: 28px 28px 22px; border: 1px solid var(--rule); border-radius: 16px; background: var(--surface); box-shadow: 0 12px 32px rgba(15, 30, 22, .08); }
.admin-card h1 { margin: 4px 0 0; font-size: 24px; letter-spacing: -.02em; }
.admin-sub { margin: 0 0 6px; color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }
.admin-card form { display: grid; gap: 8px; }
.admin-card .form-label { margin-top: 6px; }
.admin-card .btn { margin-top: 8px; }
.admin-code { font-size: 26px; letter-spacing: .4em; text-align: center; font-variant-numeric: tabular-nums; }
.admin-error { margin: 4px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--bad-bg); color: var(--bad); font-size: 14px; }
.admin-links { margin: 6px 0 0; text-align: center; font-size: 14px; }
.admin-links .link-button { border: 0; background: none; padding: 0; color: var(--brand-text); font: inherit; text-decoration: underline; cursor: pointer; }
.admin-help, .admin-foot { margin: 8px 0 0; color: var(--ink-mute); font-size: 13px; line-height: 1.5; }
.admin-foot { padding-top: 12px; border-top: 1px solid var(--rule); }
.admin-steps { margin: 4px 0 6px; padding-left: 20px; display: grid; gap: 10px; color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }
.admin-qr { margin: 10px 0 4px; display: grid; width: max-content; padding: 10px; border: 1px solid var(--rule); border-radius: 12px; background: #fff; }
.admin-qr img { display: block; width: 180px; height: 180px; }
.admin-secret summary { cursor: pointer; color: var(--brand-text); font-weight: 600; }
.admin-secret code { display: block; margin-top: 4px; padding: 8px 10px; border-radius: 8px; background: var(--surface-2); font-size: 14px; letter-spacing: .06em; word-break: break-all; }

/* Painel */
.admin-dash { display: grid; gap: 22px; max-width: 1180px; }
.admin-dash-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; }
.admin-dash-head .page-subtitle { margin: 4px 0 0; }
.admin-dash-head .btn { width: auto; }
.admin-kpis { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 12px; }
.admin-kpi { display: grid; gap: 6px; align-content: start; padding: 18px 20px; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--surface); color: inherit; text-decoration: none; }
.admin-kpi span { color: var(--ink-2); font-size: 13.5px; font-weight: 600; }
.admin-kpi strong { font-size: 28px; line-height: 1.1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.admin-kpi small { color: var(--ink-mute); font-size: 13px; line-height: 1.45; }
.admin-kpi.is-main { background: var(--brand-deep); border-color: var(--brand-deep); color: #EEF3EC; }
.admin-kpi.is-main span, .admin-kpi.is-main small { color: #B8CBBE; }
a.admin-kpi:hover { border-color: var(--brand); }
.admin-health.is-healthy { color: var(--ok); }
.admin-health.is-attention { color: var(--wait); }
.admin-health.is-risk { color: var(--bad); }

.admin-block { display: grid; gap: 12px; padding: 20px 22px; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--surface); scroll-margin-top: 16px; }
.admin-block h2 { margin: 0; font-size: 17px; }
.admin-block-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.admin-note { margin: 0; color: var(--ink-mute); font-size: 13px; line-height: 1.5; }
.admin-empty { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--ok); font-weight: 600; }

.admin-queue { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.admin-queue a { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--rule); border-radius: 12px; color: inherit; text-decoration: none; }
.admin-queue a:hover { border-color: var(--brand); background: var(--brand-soft); }
.admin-queue strong { display: grid; place-items: center; height: 36px; border-radius: 10px; background: var(--surface-2); font-size: 18px; font-variant-numeric: tabular-nums; }
.admin-queue li.is-risk strong { background: var(--bad-bg); color: var(--bad); }
.admin-queue li.is-attention strong { background: var(--wait-bg); color: var(--wait); }
.admin-queue b { display: block; font-size: 14.5px; }
.admin-queue small { display: block; color: var(--ink-mute); font-size: 13px; }
.admin-queue svg { color: var(--ink-mute); transform: rotate(-90deg); }

.admin-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.admin-filters button { padding: 6px 12px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.admin-filters button span { color: var(--ink-mute); font-weight: 600; margin-left: 2px; }
.admin-filters button[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-text); }
.admin-table td { vertical-align: top; }
.admin-table td small { display: block; margin-top: 2px; color: var(--ink-mute); font-size: 13px; }
.admin-signal { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13.5px; white-space: nowrap; }
.admin-signal::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--ink-mute); }
.admin-signal.is-risk { color: var(--bad); } .admin-signal.is-risk::before { background: var(--bad); }
.admin-signal.is-attention { color: var(--wait); } .admin-signal.is-attention::before { background: var(--wait); }
.admin-signal.is-healthy { color: var(--ok); } .admin-signal.is-healthy::before { background: var(--ok); }
.admin-signal.is-off { color: var(--ink-mute); }

.admin-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.admin-funnel { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.admin-funnel li { display: grid; grid-template-columns: 56px 1fr; align-items: baseline; gap: 10px; }
.admin-funnel strong { font-size: 20px; text-align: right; font-variant-numeric: tabular-nums; }
.admin-funnel span { color: var(--ink-2); font-size: 14px; }
.admin-activity { list-style: none; margin: 0; padding: 0; display: grid; }
.admin-activity li { display: grid; gap: 2px; padding: 9px 0; border-top: 1px solid var(--rule); font-size: 14px; }
.admin-activity li:first-child { border-top: 0; }
.admin-activity small { color: var(--ink-mute); font-size: 13px; }

@media (max-width: 980px) {
  .admin-kpis { grid-template-columns: 1fr 1fr; }
  .admin-columns { grid-template-columns: 1fr; }
}
@media (max-width: 540px) {
  .admin-kpis { grid-template-columns: 1fr; }
  .admin-card { padding: 22px 18px 18px; }

}

/* Salões: ações de desativar, reativar e excluir. */
.platform-salon-actions { text-align: right; white-space: nowrap; }
.platform-salon-actions .btn { width: auto; margin-left: 6px; }
.platform-salon-actions small { display: inline-block; margin-left: 8px; font-size: 13px; }
.btn.btn-danger-solid { background: var(--bad); border-color: var(--bad); color: #fff; }
.btn.btn-danger-solid:disabled { opacity: .45; }
h3.admin-sub { margin: 16px 0 6px; font-weight: 700; color: var(--ink); }

/* Painel · seções independentes, contatos e foco vindo de aviso (E2-12). */
button.admin-kpi { text-align: left; cursor: pointer; font: inherit; }
.admin-table tr.is-focus td { background: color-mix(in srgb, var(--brand, #123e40) 10%, transparent); }
.admin-table td small a { color: inherit; }
.admin-due { color: var(--wait, #9a5b00); font-weight: 700; }
.admin-contact-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; align-items: end; }
.admin-contact-form label { display: grid; gap: 4px; font-size: 13px; color: var(--ink-2); }
.admin-contact-form .admin-contact-note { grid-column: 1 / -1; }
.admin-contact-form .btn { width: auto; justify-self: start; }
.admin-contacts .admin-sub { margin-top: 18px; }

/* CRM interno: visão comparável na lista e ficha para acompanhar cada conta. */
.admin-dash, .admin-dash > *, #painel-main { min-width: 0; }
#painel-main { display: grid; gap: 24px; }
.admin-search { display: grid; gap: 8px; color: var(--ink-2); font-size: 14px; max-width: 640px; }
#painel-salons .admin-table { min-width: 960px; }
#painel-salons td { white-space: normal; max-width: 256px; overflow-wrap: anywhere; }
#painel-salons td:first-child { min-width: 192px; }
.admin-client-detail { display: grid; gap: 32px; font-size: 14px; }
.admin-client-detail section { min-width: 0; }
.admin-client-detail h3 { margin: 0 0 16px; font-size: 18px; font-weight: 600; }
.admin-client-detail .admin-note { margin-top: 12px; }
.admin-client-intro { background: var(--surface-2); padding: 16px; border-radius: var(--radius); }
.admin-client-intro h3 { margin: 8px 0; font-size: 20px; }
.admin-client-intro p { margin: 0 0 8px; }
.admin-client-intro small { color: var(--ink-2); }
.admin-client-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 24px; margin: 0; }
.admin-client-facts dt { color: var(--ink-2); margin-bottom: 4px; }
.admin-client-facts dd { margin: 0; overflow-wrap: anywhere; font-weight: 600; }
.admin-client-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.admin-checklist { padding: 0; margin: 0; list-style: none; display: grid; gap: 8px; }
.admin-checklist li { display: grid; grid-template-columns: 24px 1fr auto; gap: 8px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--rule); }
.admin-checklist li > span:first-child { color: var(--ink-2); font-size: 18px; }
.admin-checklist li.is-done > span:first-child { color: var(--ok); }
.admin-checklist b { font-weight: 600; }
.admin-client-detail textarea { resize: vertical; min-height: 96px; }
@media (max-width: 540px) {
  .admin-client-facts { grid-template-columns: 1fr; }
  .admin-client-detail { gap: 24px; }
  .admin-contact-form { grid-template-columns: 1fr; }
  .admin-block { padding: 16px; }
}
.admin-table .admin-last-note { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.admin-client-detail [hidden] { display: none; }

/* ---------------------------------------------------------------------------
   B-01 · CRM interno: Hoje, Clientes e Ficha. Celular primeiro (390 px):
   tudo empilha, sem rolagem horizontal, alvos de toque com 44 px. */
.crm-page { display: grid; gap: 20px; max-width: 1180px; min-width: 0; }
.crm-page > * { min-width: 0; }
.crm-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; }
.crm-head .page-subtitle { margin: 4px 0 0; }
.crm-date::first-letter { text-transform: uppercase; }
.crm-page .btn { min-height: 44px; width: auto; }
.crm-muted { color: var(--ink-mute); font-size: 13.5px; }
.crm-label { margin: 0 0 10px; font-size: 13px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-2); display: flex; justify-content: space-between; gap: 8px; }
.crm-label span { color: var(--ink-mute); letter-spacing: 0; text-transform: none; font-weight: 650; }
.crm-section-title { margin: 0 0 12px; font-size: 18px; display: flex; align-items: center; gap: 8px; }
.crm-count { display: inline-grid; place-items: center; min-width: 26px; height: 22px; padding: 0 7px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 13px; font-weight: 750; font-variant-numeric: tabular-nums; letter-spacing: 0; }

/* E-02 · Hoje do dono. Celular primeiro (390 px): 3 números, "Precisa de
   você", a fila em Salões e Leads para retomar, resultado em um toque. */
.hoje-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; }
/* No celular a barra de cima já diz "Hoje": o título fica só para leitores de tela. */
.hoje-head .page-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }
.hoje-head .page-subtitle { margin: 0; }
.hoje-head .btn { min-height: 44px; padding: 6px 14px; gap: 6px; }
.hoje-body { display: grid; gap: 14px; min-width: 0; }
.hoje-page { gap: 14px; }
.hoje-refresh-label { display: none; }
.hoje-head .btn { min-width: 44px; }
.hoje-numbers { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.hoje-number { display: grid; gap: 2px; align-content: start; padding: 10px 12px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); color: inherit; text-decoration: none; min-width: 0; min-height: 44px; }
.hoje-number:hover, .hoje-number:focus-visible { border-color: var(--brand); }
.hoje-number-label { color: var(--ink-2); font-size: 13px; font-weight: 700; }
.hoje-number strong { font-size: 22px; line-height: 1.2; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.hoje-number strong small { font-size: 14px; font-weight: 650; color: var(--ink-mute); }
.hoje-number-note { color: var(--ink-mute); font-size: 13px; line-height: 1.35; }
.hoje-note-long { display: none; }
.hoje-number.is-risk strong { color: var(--bad); }
.hoje-number-main { grid-column: 1 / -1; background: var(--brand-soft); border-color: transparent; }
.hoje-number-main strong { font-size: 26px; color: var(--brand-text); }
.hoje-alerts { padding: 6px 12px; border-radius: var(--radius-sm); background: var(--wait-bg); }
.hoje-alerts-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.hoje-alerts-title { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 14px; color: var(--ink); }
.hoje-alerts ul { list-style: none; margin: 0; padding: 0; display: grid; }
.hoje-alerts li.is-extra { display: none; }
.hoje-alerts.is-expanded li.is-extra { display: block; }
.hoje-alert { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--ink); font-size: 14px; font-weight: 700; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.hoje-alerts-more { min-height: 44px; padding: 0; border: 0; background: none; color: var(--ink-2); font: inherit; font-size: 13.5px; font-weight: 650; cursor: pointer; }
.hoje-alert.is-risk { color: var(--bad); }
.hoje-alert span { text-decoration: none; }
.hoje-queue { display: grid; gap: 12px; min-width: 0; }
.hoje-queue-head { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px 12px; }
.hoje-queue-head .hoje-progress { display: contents; }
.hoje-queue-head .hoje-progress p { justify-self: end; }
.hoje-queue-head .hoje-bar { grid-column: 1 / -1; }
.hoje-queue-head .crm-section-title { margin: 0; }
.hoje-progress { display: grid; gap: 6px; }
.hoje-progress p { margin: 0; font-size: 14px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.hoje-bar { height: 8px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.hoje-bar span { display: block; height: 100%; border-radius: inherit; background: var(--ok); transition: width .3s ease; }
.hoje-guide { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 4px 4px 4px 12px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); }
.hoje-guide p { margin: 0; font-size: 13px; line-height: 1.4; color: var(--ink-2); }
.hoje-guide .btn { min-height: 44px; }
.hoje-disclaimer, .hoje-updated { margin: 0; color: var(--ink-mute); font-size: 13px; }
.hoje-block { display: grid; gap: 8px; }
.hoje-block summary { display: flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; list-style: none; }
.hoje-block summary::-webkit-details-marker { display: none; }
.hoje-block summary::after { content: ''; width: 8px; height: 8px; margin-left: 2px; border-right: 2px solid var(--ink-mute); border-bottom: 2px solid var(--ink-mute); transform: rotate(45deg) translateY(-2px); }
.hoje-block:not([open]) summary::after { transform: rotate(-45deg); }
.hoje-block h3 { margin: 0; font-size: 16px; }
.hoje-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.hoje-item { display: grid; gap: 10px; padding: 12px 14px; border: 1px solid var(--rule); border-left: 4px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); transition: opacity .2s ease, transform .2s ease; }
.hoje-item.is-risk { border-left-color: var(--bad); }
.hoje-item.is-attention { border-left-color: var(--wait); }
.hoje-item.is-leaving { opacity: 0; transform: translateX(16px); }
.hoje-item-main { display: grid; gap: 2px; min-width: 0; }
.hoje-item-name { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.hoje-item-name strong { font-size: 16px; overflow-wrap: anywhere; }
.hoje-chip { padding: 1px 8px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 13px; font-weight: 650; }
.hoje-item-person { color: var(--ink-2); font-size: 14px; }
.hoje-item-reason { margin-top: 4px; font-size: 14.5px; font-weight: 650; overflow-wrap: anywhere; }
.hoje-item.is-risk .hoje-item-reason { color: var(--bad); }
.hoje-item.is-attention .hoje-item-reason { color: var(--wait); }
.hoje-item-actions { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.hoje-item-actions .hoje-btn-wa { background: var(--brand-soft); border-color: transparent; color: var(--brand-text); }
.hoje-ficha-link { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; padding: 0 6px; color: var(--ink-2); font-size: 14px; font-weight: 650; text-decoration: underline; text-underline-offset: 3px; }
.hoje-item-usage { color: var(--wait); font-weight: 650; }
.hoje-item.is-marked { box-shadow: 0 0 0 2px var(--brand); }
.hoje-item-mark { margin-top: 2px; color: var(--brand-text); font-size: 13px; font-weight: 650; }
.hoje-ficha-note { display: flex; align-items: center; gap: 6px; margin: 0; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--ok-bg); color: var(--ok); font-size: 14px; font-weight: 650; }
.hoje-error { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; padding: 10px 14px; border: 1px solid var(--bad); border-radius: var(--radius-sm); background: var(--bad-bg); }
.hoje-error p { margin: 0; color: var(--ink); font-size: 14px; }
.hoje-error .btn { min-height: 44px; }
.hoje-trail { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; margin: 0; color: var(--ink-mute); font-size: 13.5px; }
.hoje-trail a { display: inline-flex; align-items: center; min-height: 44px; color: var(--brand-text); font-weight: 650; }
/* "Desfazer" no lugar da linha registrada: não cobre outra linha. */
.hoje-undo { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 6px 6px 16px; border-radius: var(--radius-sm); background: var(--ink); color: var(--paper); list-style: none; }
.hoje-undo p { margin: 0; font-size: 14px; }
.hoje-undo .btn { min-height: 44px; background: var(--paper); color: var(--ink); border-color: transparent; font-weight: 750; }
.hoje-item-actions .btn { justify-content: center; gap: 6px; min-height: 44px; width: auto; }
.hoje-nophone { color: var(--ink-mute); font-size: 13.5px; text-align: center; }
.hoje-item.is-open [data-register] { border-color: var(--brand); color: var(--brand-text); }
.hoje-register { display: grid; gap: 8px; padding-top: 12px; border-top: 1px solid var(--rule-soft); grid-column: 1 / -1; }
.hoje-register[hidden] { display: none; }
.hoje-register-q { margin: 0; font-weight: 700; font-size: 14.5px; }
.hoje-outcomes { display: grid; gap: 8px; }
.hoje-outcome { display: grid; gap: 1px; justify-items: start; min-height: 52px; padding: 8px 14px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.hoje-outcome strong { font-size: 15px; }
.hoje-outcome span { color: var(--ink-mute); font-size: 13px; }
.hoje-outcome:hover, .hoje-outcome:focus-visible { border-color: var(--brand); background: var(--brand-soft); }
.hoje-outcome:disabled { opacity: .55; cursor: progress; }
.hoje-outcome.is-busy { opacity: 1; border-color: var(--brand); }
.hoje-register-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 12px; margin: 0; font-size: 13.5px; }
.hoje-register-foot a { display: inline-flex; align-items: center; min-height: 44px; color: var(--brand-text); font-weight: 650; }
.hoje-register-foot .btn { min-height: 44px; }
.hoje-done { display: grid; gap: 8px; justify-items: start; padding: 20px; border-radius: var(--radius-sm); background: var(--ok-bg); }
.hoje-done h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 20px; color: var(--ok); }
.hoje-done p { margin: 0; font-size: 15px; color: var(--ink); max-width: 60ch; }
.hoje-done .btn { min-height: 44px; margin-top: 4px; }
@media (min-width: 640px) {
  .hoje-body, .hoje-page { gap: 20px; }
  .hoje-refresh-label { display: inline; }
  .hoje-head .page-title { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: normal; grid-column: 1; }
  .hoje-head .page-subtitle { grid-column: 1 / -1; grid-row: 2; }
  .hoje-head .btn { grid-column: 2; grid-row: 1; }
  .hoje-alerts { padding: 8px 14px; }
  .hoje-alerts ul { display: flex; flex-wrap: wrap; gap: 0 18px; }
  .hoje-alerts li.is-extra { display: block; }
  .hoje-alerts-more { display: none; }
  .hoje-note-long { display: block; }
  .hoje-note-short { display: none; }
  .hoje-number { padding: 12px 14px; }
  .hoje-number-main strong { font-size: 30px; }
  .hoje-numbers { grid-template-columns: 1.4fr 1fr 1fr; }
  .hoje-number-main { grid-column: auto; }
  .hoje-item { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .hoje-item-actions { display: flex; }
  .hoje-outcomes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hoje-queue-head { grid-template-columns: auto minmax(200px, 320px); justify-content: space-between; align-items: end; }
  .hoje-queue-head .hoje-progress { display: grid; }
  .hoje-queue-head .hoje-bar { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .hoje-item, .hoje-bar span { transition: none; }
}
.crm-empty-muted { margin: 0; padding: 16px; color: var(--ink-mute); }

/* Clientes */
.crm-search { display: grid; gap: 6px; color: var(--ink-2); font-size: 13.5px; max-width: 640px; }
.crm-search .form-input { min-height: 44px; }
.crm-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.crm-chips button { min-height: 44px; padding: 6px 14px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.crm-chips button span { color: var(--ink-mute); font-weight: 600; margin-left: 2px; font-variant-numeric: tabular-nums; }
.crm-chips button[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-text); }
.crm-total { margin-top: -8px; }
.crm-group { display: grid; gap: 8px; margin-bottom: 18px; }
.crm-group-title { margin: 0; font-size: 15px; display: flex; align-items: center; gap: 8px; }
.crm-group-internal summary { list-style: none; cursor: pointer; min-height: 44px; display: flex; align-items: center; }
.crm-group-internal summary::-webkit-details-marker { display: none; }
.crm-group-internal summary::before { content: "›"; margin-right: 8px; color: var(--ink-mute); font-size: 18px; transition: transform .15s; }
.crm-group-internal[open] summary::before { transform: rotate(90deg); }
.crm-rows { list-style: none; margin: 0; padding: 0; display: grid; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); overflow: hidden; }
.crm-row { display: grid; grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--rule-soft); }
.crm-row:first-child { border-top: 0; }
.crm-row-main { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 64px; padding: 12px 14px; color: inherit; text-decoration: none; }
.crm-row-main:hover, .crm-row-main:focus-visible { background: var(--brand-soft); }
.crm-row-text { display: grid; gap: 3px; min-width: 0; }
.crm-row-name { overflow-wrap: anywhere; }
.crm-row-name strong { font-size: 15.5px; }
.crm-row-name span { color: var(--ink-2); font-size: 14px; }
.crm-row-meta { color: var(--ink-mute); font-size: 13px; overflow-wrap: anywhere; }
.crm-row-phone { display: none; }
.crm-next { display: inline-flex; align-items: center; gap: 5px; font-size: 13.5px; font-weight: 650; color: var(--ink-2); overflow-wrap: anywhere; }
.crm-next svg { flex: none; }
.crm-next.is-late { color: var(--bad); }
.crm-next.is-missing { color: var(--wait); }
.crm-next.is-muted { color: var(--ink-mute); font-weight: 500; }
.crm-dot { width: 12px; height: 12px; border-radius: 50%; background: var(--ink-mute); opacity: .55; }
.crm-dot.is-risk { background: var(--bad); opacity: 1; }
.crm-dot.is-attention { background: var(--wait); opacity: 1; }
.crm-dot.is-healthy { background: var(--ok); opacity: 1; }

/* Ficha */
.crm-back { display: inline-flex; align-items: center; min-height: 44px; color: var(--brand-text); font-weight: 650; text-decoration: none; width: max-content; }
.crm-ficha-head { display: grid; gap: 12px; }
.crm-ficha-id .page-title { margin: 0; overflow-wrap: anywhere; }
.crm-ficha-person { margin: 2px 0 8px; color: var(--ink-2); font-size: 15px; }
.crm-ficha-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; }
.crm-ficha-reason { margin: 8px 0 0; color: var(--ink-2); font-size: 14px; }
.crm-chip { display: inline-flex; align-items: center; min-height: 26px; padding: 2px 10px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 13px; font-weight: 750; }
.crm-chip.is-risk { background: var(--bad-bg); color: var(--bad); }
.crm-chip.is-healthy { background: var(--ok-bg); color: var(--ok); }
.crm-ficha-contact { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.crm-ficha-contact a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--brand-text); font-weight: 650; overflow-wrap: anywhere; }
.crm-nextbox { display: grid; gap: 14px; padding: 16px; border: 1px solid var(--rule); border-left: 4px solid var(--brand); border-radius: var(--radius); background: var(--surface); }
.crm-nextbox.is-late { border-left-color: var(--bad); }
.crm-nextbox.is-missing { border-left-color: var(--wait); background: color-mix(in srgb, var(--wait-bg) 55%, var(--surface)); }
.crm-nextbox-body { min-width: 0; }
.crm-next-title { margin: 0; font-size: 18px; font-weight: 700; overflow-wrap: anywhere; }
.crm-next-due { margin: 4px 0 0; color: var(--ink-2); font-size: 14px; font-weight: 650; }
.crm-next-due.is-late { color: var(--bad); }
.crm-next-none { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--wait); font-size: 16px; font-weight: 700; }
.crm-next-none.is-muted { color: var(--ink-mute); font-weight: 600; }
.crm-task-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.crm-snooze { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; margin-top: 10px; }
.crm-snooze label { display: grid; gap: 4px; font-size: 13px; color: var(--ink-2); }
.crm-snooze .form-input { min-height: 44px; }
.crm-nextbox-cta { display: grid; gap: 8px; }
.crm-nextbox-cta .btn { justify-content: center; gap: 6px; }
.crm-ficha-cols { display: grid; gap: 24px; }
.crm-col-main, .crm-col-side { display: grid; gap: 24px; align-content: start; min-width: 0; }
.crm-col-side { gap: 12px; }
.crm-register { padding: 16px; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--surface); scroll-margin-top: 16px; }
.crm-form-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.crm-form-grid label { display: grid; gap: 4px; font-size: 13.5px; font-weight: 650; color: var(--ink-2); min-width: 0; }
.crm-form-grid .form-input { min-height: 44px; width: 100%; }
.crm-form-grid textarea.form-input { min-height: 88px; resize: vertical; }
.crm-next-fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.crm-next-fields[hidden], .crm-form-grid [hidden] { display: none; }
.crm-check { display: flex !important; align-items: center; gap: 10px; min-height: 44px; font-weight: 600 !important; cursor: pointer; }
.crm-check input { width: 20px; height: 20px; accent-color: var(--brand); }
.crm-form-error { margin: 0; padding: 10px 12px; border-radius: var(--radius-xs); background: var(--bad-bg); color: var(--bad); font-size: 14px; }
.crm-form-grid .btn-primary { min-width: 160px; justify-content: center; }
.crm-timeline { list-style: none; margin: 0; padding: 0; display: grid; }
.crm-timeline li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 10px; padding: 12px 0; border-top: 1px solid var(--rule-soft); font-size: 14px; }
.crm-timeline li:first-child { border-top: 0; }
.crm-tl-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--surface-2); color: var(--ink-2); }
.crm-timeline p { margin: 4px 0 0; overflow-wrap: anywhere; }
.crm-timeline small { display: block; margin-top: 2px; color: var(--ink-mute); font-size: 13px; }
.crm-tl-next { color: var(--ink-2); font-weight: 600; }
.crm-side-card { padding: 14px 16px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); min-width: 0; }
.crm-side-card .admin-checklist li { padding: 6px 0; font-size: 14px; }
.crm-side-card p { margin: 0 0 8px; }
.crm-facts { display: grid; gap: 8px; margin: 0; }
.crm-facts div { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; }
.crm-facts dt { color: var(--ink-2); }
.crm-facts dd { margin: 0; font-weight: 650; text-align: right; overflow-wrap: anywhere; min-width: 0; }
.crm-facts a { color: var(--brand-text); }
.crm-lost summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; color: var(--bad); font-weight: 650; }
.crm-lost form { margin-top: 8px; }

/* Mensagem pronta (modal) */
.crm-templates { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 8px; }
.crm-template { display: grid; border: 1px solid var(--rule); border-radius: var(--radius-sm); overflow: hidden; }
.crm-template-main { display: grid; gap: 4px; padding: 12px 14px; min-height: 44px; color: inherit; text-decoration: none; }
a.crm-template-main:hover, a.crm-template-main:focus-visible { background: var(--brand-soft); }
.crm-template-preview { color: var(--ink-mute); font-size: 13.5px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.crm-template-alt { display: flex; align-items: center; min-height: 44px; padding: 0 14px; border-top: 1px solid var(--rule-soft); color: var(--brand-text); font-size: 13.5px; font-weight: 650; }

@media (min-width: 640px) {
  .crm-next-fields { grid-template-columns: minmax(0, 1fr) 180px; }
  .crm-nextbox { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
  .crm-nextbox-cta { min-width: 220px; }
}
@media (min-width: 900px) {
  .crm-row { grid-template-columns: minmax(0, 1fr) 170px; align-items: center; }
  .crm-row-phone { display: flex; align-items: center; justify-content: flex-end; min-height: 44px; padding-right: 16px; color: var(--brand-text); font-size: 13.5px; font-weight: 650; white-space: nowrap; }
  .crm-ficha-head { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
  .crm-ficha-contact { flex-direction: column; align-items: flex-end; }
  .crm-ficha-cols { grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); }
  .crm-form-grid { grid-template-columns: 1fr 1fr; }
  .crm-form-grid .crm-span { grid-column: 1 / -1; }
}

/* B-02 · Leads, campos da conta, importação; B-05 · resumo para os agentes. */
.crm-head-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.crm-head-actions .btn { width: auto; min-height: 44px; }
.crm-form-compact { gap: 10px; }
.crm-form-compact .btn { width: auto; }
.crm-template-alts { display: flex; border-top: 1px solid var(--rule-soft); }
.crm-template-alts .crm-template-alt { flex: 1; border-top: 0; background: none; border-left: 0; border-right: 0; border-bottom: 0; font: inherit; font-size: 13.5px; font-weight: 650; color: var(--brand-text); cursor: pointer; text-align: left; }
.crm-template-alts .crm-template-alt + .crm-template-alt { border-left: 1px solid var(--rule-soft); }
.crm-import { display: grid; gap: 12px; }
.crm-import label { display: grid; gap: 4px; font-size: 13.5px; font-weight: 650; color: var(--ink-2); }
.crm-import .btn { justify-self: start; min-height: 44px; }
.crm-ficha-contact .btn-sm { min-height: 44px; width: auto; }
.crm-side-card .btn-ghost { min-height: 44px; margin-top: 8px; color: var(--bad); }
@media (min-width: 640px) {
  .crm-form-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .crm-form-compact .crm-span { grid-column: 1 / -1; }
}

/* Lead: link para o Google Maps na lista (junto do celular) e na ficha. */
.crm-row-maps { gap: 4px; }
.crm-row-side { display: none; }
@media (min-width: 900px) { .crm-row-side { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; } .crm-row-side .crm-row-phone { min-height: 36px; } }
.crm-ficha-contact a svg { vertical-align: -2px; }

/* Ficha do lead: pesquisar o salão (Maps, Google, Instagram) em botões grandes. */
.crm-find { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.crm-find .btn { width: auto; min-height: 48px; padding: 0 18px; gap: 8px; text-decoration: none; }
.crm-find-maps { border: 2px solid var(--brand); background: var(--brand-soft); color: var(--brand-text); font-weight: 750; }
.crm-find-maps:hover, .crm-find-maps:focus-visible { background: var(--brand); color: var(--brand-ink); }
.crm-find-note { flex-basis: 100%; margin: 0; }
@media (max-width: 540px) { .crm-find .btn { flex: 1 1 100%; justify-content: center; } }

/* Instagram do lead: botão claro na barra e "Abrir perfil" ao lado do campo salvo. */
.crm-find-ig span { font-weight: 600; opacity: .85; }
.crm-ig-field { display: grid; gap: 8px; }
.crm-ig-field label { display: grid; gap: 4px; font-size: 13.5px; font-weight: 650; color: var(--ink-2); min-width: 0; }
.crm-ig-open { width: auto; min-height: 44px; justify-self: start; gap: 8px; color: var(--brand-text); border-color: var(--brand); text-decoration: none; }

/* Endereço do lead logo abaixo do nome. */
.crm-ficha-address { display: flex; align-items: flex-start; gap: 6px; margin: 2px 0 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.4; overflow-wrap: anywhere; }
.crm-ficha-address svg { flex: none; margin-top: 2px; color: var(--brand-text); }

/* Etiquetas: escolhidas (chips com ×), que já existem (um toque) e criar nova. */
.crm-tags { display: grid; gap: 8px; }
.crm-tags-label { color: var(--ink-2); font-size: 13.5px; font-weight: 650; }
.crm-tag-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.crm-tag { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface); color: var(--ink-2); font: inherit; font-size: 13.5px; font-weight: 650; cursor: pointer; }
.crm-tag small { color: var(--ink-mute); font-size: 13px; font-weight: 600; }
button.crm-tag:hover, button.crm-tag:focus-visible { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-text); }
.crm-tag.is-on { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-text); cursor: default; padding-right: 4px; }
.crm-tag.is-on button { display: grid; place-items: center; min-width: 28px; min-height: 28px; border: 0; border-radius: 50%; background: none; color: inherit; font-size: 18px; line-height: 1; cursor: pointer; }
.crm-tag.is-on button:hover, .crm-tag.is-on button:focus-visible { background: var(--rule); }
.crm-tag-add { display: flex; gap: 8px; }
.crm-tag-add .form-input { flex: 1; min-width: 0; min-height: 44px; }
.crm-tag-add .btn { width: auto; min-height: 44px; }
.crm-tag-existing { display: grid; gap: 6px; }
.crm-tag-existing .crm-muted { font-size: 13px; }

/* Lista de Clientes: filtro por etiquetas e etiquetas na linha. */
.crm-tagfilter { display: grid; gap: 8px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); }
.crm-tagfilter summary { cursor: pointer; font-weight: 700; font-size: 14.5px; min-height: 44px; display: flex; align-items: center; gap: 8px; }
.crm-tagfilter-mode { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13.5px; color: var(--ink-2); }
.crm-tagfilter-mode button { min-height: 44px; padding: 0 14px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface); color: var(--ink-2); font: inherit; font-weight: 700; cursor: pointer; }
.crm-tagfilter-mode button[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-text); }
.crm-row-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.crm-row-tags span { padding: 1px 8px; border: 1px solid var(--rule); border-radius: 999px; color: var(--ink-2); font-size: 13px; }

/* Filtros de lugar e Instagram. */
.crm-chips-label { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink-2); font-size: 13.5px; font-weight: 750; }
.crm-facet-title { margin: 10px 0 6px; font-size: 13.5px; font-weight: 750; letter-spacing: .02em; color: var(--ink-2); }
.crm-hood-search { max-width: 360px; margin-bottom: 8px; }
.crm-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.crm-complete { display: grid; gap: 6px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--rule-soft); }
.crm-complete .btn { width: auto; min-height: 44px; justify-self: start; }
.crm-complete .btn span { color: var(--ink-mute); font-weight: 600; }

/* Lead: sem canal de contato, em espera e guia de etapas. */
.crm-nochannel { flex-basis: 100%; display: grid; gap: 8px; padding: 12px 14px; border: 1px solid var(--wait); border-left-width: 4px; border-radius: var(--radius-sm); background: var(--wait-bg); }
.crm-nochannel p { margin: 0; font-size: 14.5px; line-height: 1.45; color: var(--ink); }
.crm-nochannel .btn { width: auto; min-height: 44px; justify-self: start; }
.crm-chip.is-wait { background: var(--wait-bg); color: var(--wait); }
.crm-guide { margin: 8px 0; }
.crm-guide summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 700; font-size: 14.5px; color: var(--brand-text); }
.crm-guide ul { margin: 6px 0; padding-left: 18px; display: grid; gap: 8px; font-size: 14px; line-height: 1.45; }

/* Editar conversa registrada */
.crm-tl-edit { margin-left: 8px; min-height: 44px; padding: 0 12px; border: 0; background: none; color: var(--brand, #123E40); font: inherit; font-size: 14px; font-weight: 600; text-decoration: underline; cursor: pointer; }
.crm-edit-form { padding: 12px; border: 1px solid var(--rule); border-radius: var(--radius-sm); }
.crm-edit-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.crm-edit-actions .btn { min-height: 44px; }
.crm-timeline li:has(> .crm-edit-form) { display: block; }
.crm-form-grid .crm-span { grid-column: 1 / -1; }
.crm-edit-form { background: var(--surface-2); border-color: var(--rule); }
.crm-result-line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.crm-result { display: inline-block; margin-top: 2px; padding: 2px 10px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--rule); color: var(--ink); font-size: 13px; font-weight: 650; }

/* E-01 · Entrar na equipe: marca, "Mostrar" com alvo de 44 px e saída discreta para quem é de salão. */
.admin-brand { display: flex; align-items: center; gap: 10px; margin: 0 0 4px; color: var(--ink-2); font-size: 14px; font-weight: 700; }
.admin-brand span { padding-left: 10px; border-left: 1px solid var(--rule); }
.admin-logo { display: block; width: 110px; height: auto; }
.admin-logo.is-dark, :root[data-theme="dark"] .admin-logo.is-light { display: none; }
:root[data-theme="dark"] .admin-logo.is-dark { display: block; }
.admin-card .btn.w-full { justify-content: center; text-align: center; }
.admin-card .password-toggle { min-height: 44px; min-width: 64px; font-size: 14px; }
.admin-card .password-field .form-input { padding-right: 84px; }
.admin-help { margin-top: 2px; }
.admin-other { margin: 4px 0 0; text-align: center; font-size: 14px; }
.admin-other a, .admin-links a { display: inline-flex; align-items: center; min-height: 44px; color: var(--brand-text); }
.admin-foot { display: flex; align-items: center; gap: 6px; }

/* E-01 · Aviso 2 minutos antes de a sessão da equipe fechar. */
.admin-idle { position: fixed; z-index: 1200; right: 16px; bottom: 16px; left: auto; width: min(380px, calc(100vw - 32px)); display: grid; gap: 8px; padding: 16px 18px; border: 1px solid var(--rule); border-radius: 14px; background: var(--surface); color: var(--ink); box-shadow: 0 16px 40px rgba(15, 30, 22, .18); }
.admin-idle p { margin: 0; font-size: 15px; font-weight: 700; line-height: 1.4; }
.admin-idle .admin-idle-sub { color: var(--ink-2); font-size: 14px; font-weight: 500; }
.admin-idle .btn { justify-self: start; min-height: 44px; }

/* E-01 · Minha conta da equipe: Você, Segurança e Aparência. */
.account-sub { margin: 4px 0 0; color: var(--ink-2); font-size: 15px; }
.account-lines { margin: 0 0 12px; padding: 0; list-style: none; display: grid; gap: 10px; font-size: 15px; color: var(--ink-2); }
.account-lines b { color: var(--ink); font-weight: 650; }
.account-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.account-actions .btn { width: auto; min-height: 44px; }
.account-note { margin: 4px 0 0; color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.account-page .account-show input { width: 20px; height: 20px; }
.account-page .account-intro { margin: 0 0 16px; }

/* E-03 · Clientes: portas Salões | Leads, Mais ▾, linha com WhatsApp e sinal em texto. */
.crm-doors { display: inline-flex; width: max-content; max-width: 100%; padding: 4px; gap: 4px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface-2); }
.crm-doors button { min-height: 44px; min-width: 112px; padding: 0 18px; border: 0; border-radius: 999px; background: none; color: var(--ink-2); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.crm-doors button span { margin-left: 4px; color: var(--ink-mute); font-weight: 600; font-variant-numeric: tabular-nums; }
.crm-doors button[aria-pressed="true"] { background: var(--surface); color: var(--brand-text); box-shadow: 0 1px 3px rgba(15, 29, 23, .14); }
.crm-menu { position: relative; margin-left: auto; }
.crm-menu-list { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; display: grid; min-width: 320px; padding: 6px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); box-shadow: var(--shadow-lg); }
.crm-menu-list[hidden] { display: none; }
.crm-menu-list button { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; border: 0; border-radius: var(--radius-xs); background: none; color: var(--ink); font: inherit; font-size: 14.5px; font-weight: 600; text-align: left; cursor: pointer; }
.crm-menu-list button:hover, .crm-menu-list button:focus-visible { background: var(--brand-soft); color: var(--brand-text); }
.crm-head-actions > span:empty { display: none; }
.crm-chips button.is-late[aria-pressed="false"] span, .crm-chips button.is-late[aria-pressed="false"] { color: var(--bad); }
.crm-chips button.is-missing[aria-pressed="false"] { color: var(--wait); }
.crm-count-line { margin: -6px 0 0; color: var(--ink-2); font-size: 14px; font-variant-numeric: tabular-nums; }
/* E-11 · chip "Primeira mensagem": com 0 fica esmaecido (tracejado), nunca some. */
.crm-chips button.is-first { display: inline-flex; align-items: center; gap: 5px; }
.crm-chips button.is-first svg { flex: none; }
.crm-chips button.is-zero[aria-pressed="false"] { border-style: dashed; background: var(--surface-2); color: var(--ink-mute); }
.crm-first-link { min-height: 44px; padding: 0 2px; font-size: 14px; }
.crm-first-summary { color: var(--ink); font-size: 14.5px; font-weight: 700; }
.crm-first-line { display: inline-flex; align-items: center; gap: 5px; justify-self: start; padding: 3px 8px; border-radius: var(--radius-xs); background: var(--brand-soft); color: var(--brand-text); font-size: 13.5px; font-weight: 700; overflow-wrap: anywhere; }
.crm-first-line svg { flex: none; }
.crm-ok { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; color: var(--ok); font-weight: 650; }
.crm-ok-line { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--ok-bg); color: var(--ink); font-size: 14.5px; }
.crm-ok-line svg { flex: none; color: var(--ok); }
.crm-row-acts { grid-template-columns: minmax(0, 1fr); }
.crm-row-acts .crm-row-main { grid-template-columns: minmax(0, 1fr); padding-bottom: 6px; min-height: 0; }
.crm-row-do { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 0 14px 12px; }
.crm-row-do .btn { min-height: 44px; width: auto; gap: 6px; padding: 0 16px; text-decoration: none; }
.crm-btn-wa { background: var(--brand-soft); border-color: transparent; color: var(--brand-text); }
.crm-btn-wa:hover, .crm-btn-wa:focus-visible { background: var(--brand); color: var(--brand-ink); }
.crm-row-sub { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0 12px; }
.crm-row-sub:empty { display: none; }
.crm-row-acts:hover { background: var(--brand-soft); }
.crm-row-acts .crm-row-main:hover { background: transparent; }
.crm-mini { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; color: var(--brand-text); font-size: 13.5px; font-weight: 650; }
.crm-row-tel { color: var(--ink-mute); font-size: 13px; font-variant-numeric: tabular-nums; }
.crm-signal { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-2); font-size: 13.5px; }
.crm-signal.is-risk { color: var(--bad); font-weight: 650; }
.crm-signal.is-attention { color: var(--wait); font-weight: 650; }
.crm-signal .crm-dot { width: 9px; height: 9px; flex: none; }
.crm-with { color: var(--brand-text); font-size: 13.5px; font-weight: 700; }
.crm-empty { display: grid; justify-items: start; gap: 10px; padding: 18px; border: 1px dashed var(--rule); border-radius: var(--radius-sm); background: var(--surface); }
.crm-empty p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink); }
.crm-empty.is-done { border-style: solid; border-color: transparent; background: var(--ok-bg); }
.crm-empty .btn { width: auto; min-height: 44px; }
.crm-empty-actions { display: flex; flex-wrap: wrap; gap: 8px; }
@media (min-width: 900px) {
  .crm-row-acts { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .crm-row-acts .crm-row-main { padding-bottom: 12px; min-height: 64px; }
  .crm-row-do { flex-direction: column; align-items: flex-end; gap: 2px; padding: 8px 16px 8px 0; }
}

/* E-03 · Leads: abas, busca com Filtros (n), resumo de hoje, "Mostrar mais". */
.crm-leads { display: grid; gap: 14px; min-width: 0; }
.crm-leads[hidden], [data-door-body][hidden] { display: none; }
[data-door-body="saloes"] { display: grid; gap: 16px; min-width: 0; }
.crm-lead-tabs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: 0 -2px; padding: 2px; }
.crm-lead-tabs::-webkit-scrollbar { display: none; }
.crm-lead-tabs button { flex: none; min-height: 44px; padding: 0 14px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface); color: var(--ink-2); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.crm-lead-tabs button span { margin-left: 2px; color: var(--ink-mute); font-weight: 600; font-variant-numeric: tabular-nums; }
.crm-lead-tabs button[aria-selected="true"] { border-color: var(--brand); background: var(--brand); color: var(--brand-ink); }
.crm-lead-tabs button[aria-selected="true"] span { color: inherit; opacity: .85; }
.crm-tools { display: flex; gap: 8px; align-items: center; max-width: 720px; }
.crm-search-inline { flex: 1; min-width: 0; max-width: none; }
.crm-filter-btn { flex: none; gap: 6px; }
.crm-filter-btn.is-on { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-text); }
.crm-filter-btn .crm-count { background: var(--brand); color: var(--brand-ink); }
.crm-lead-summary { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.crm-lead-summary strong { color: var(--ink); }
.crm-order-note { margin: 0; }
.crm-more { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 12px; }
.crm-more p { margin: 0; color: var(--ink-2); font-size: 14px; }
.crm-more .btn { width: auto; min-height: 44px; }

/* E-03 · Gaveta de filtros (web/lib/filtros-gaveta.js): folha de baixo no celular, painel à direita no computador. */
body.fg-locked { overflow: hidden; }
.fg-layer { position: fixed; inset: 0; z-index: 140; display: flex; align-items: flex-end; justify-content: center; background: rgba(23, 22, 20, .38); animation: fg-fade .15s ease-out; }
.fg-sheet { display: flex; flex-direction: column; width: 100%; max-height: 88dvh; border-radius: 18px 18px 0 0; background: var(--surface); box-shadow: var(--shadow-lg); animation: fg-up .18s ease-out; }
.fg-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 16px 8px; }
.fg-head h2 { margin: 0; font-size: 19px; }
.fg-close { width: 44px; height: 44px; flex: none; border: 1px solid var(--rule); border-radius: 10px; background: var(--surface); color: var(--ink-2); font-size: 24px; line-height: 1; cursor: pointer; }
.fg-body { flex: 1; overflow-y: auto; display: grid; gap: 18px; align-content: start; padding: 4px 16px 16px; }
.fg-foot { display: flex; gap: 8px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--rule-soft); }
.fg-foot .btn { flex: 1; min-height: 48px; justify-content: center; }
.fg-facet { margin: 0; padding: 0; border: 0; min-width: 0; }
.fg-facet legend { padding: 0; margin-bottom: 8px; font-size: 14px; font-weight: 750; color: var(--ink); }
.fg-hint { margin: -2px 0 8px; color: var(--ink-mute); font-size: 13px; }
.fg-options { display: flex; flex-wrap: wrap; gap: 6px; }
.fg-option { min-height: 44px; padding: 0 14px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface); color: var(--ink-2); font: inherit; font-size: 14px; font-weight: 650; cursor: pointer; }
.fg-option span { margin-left: 2px; color: var(--ink-mute); font-weight: 600; font-variant-numeric: tabular-nums; }
.fg-option[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-text); }
.fg-search { margin-bottom: 8px; max-width: none; }
@keyframes fg-up { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes fg-fade { from { opacity: 0; } to { opacity: 1; } }
@media (min-width: 720px) {
  .fg-layer { justify-content: flex-end; align-items: stretch; }
  .fg-sheet { width: min(440px, 100%); max-height: none; height: 100%; border-radius: 0; }
  .fg-head { padding: 20px 24px 8px; }
  .fg-body { padding: 4px 24px 20px; }
  .fg-foot { padding: 14px 24px; }
}
@media (prefers-reduced-motion: reduce) { .fg-layer, .fg-sheet { animation: none; } }

/* E-03 · Novo lead e Importar leads de uma planilha. */
.modal-container.modal-lead { max-width: 560px; }
.lm-form, .lm-import { display: grid; gap: 12px; }
.lm-form label, .lm-import label { display: grid; gap: 4px; font-size: 14px; font-weight: 650; color: var(--ink-2); min-width: 0; }
.lm-form label[hidden], .lm-import label[hidden] { display: none; }
.lm-form .form-input, .lm-import .form-input { min-height: 44px; width: 100%; }
.lm-sub { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }
.lm-hint { margin: -6px 0 0; min-height: 0; color: var(--ink-2); font-size: 13.5px; }
.lm-hint:empty { display: none; }
.lm-hint.is-warn { color: var(--wait); font-weight: 650; }
.lm-hint.is-bad { color: var(--bad); font-weight: 650; }
.lm-more summary { display: flex; align-items: center; gap: 8px; min-height: 44px; color: var(--brand-text); font-weight: 700; font-size: 14.5px; cursor: pointer; list-style: none; }
.lm-more summary::-webkit-details-marker { display: none; }
.lm-more summary::before { content: "›"; display: inline-block; font-size: 18px; line-height: 1; transition: transform .15s; }
.lm-more[open] summary::before { transform: rotate(90deg); }
.lm-more-grid { display: grid; gap: 12px; padding-top: 4px; }
.lm-dup { display: grid; gap: 10px; padding: 12px 14px; border: 1px solid var(--wait); border-left-width: 4px; border-radius: var(--radius-sm); background: var(--wait-bg); }
.lm-dup:empty, [data-dup]:empty { display: none; }
.lm-dup p { margin: 0; font-size: 14.5px; color: var(--ink); }
.lm-dup .btn { width: auto; justify-self: start; min-height: 44px; text-decoration: none; }
.lm-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.lm-actions .btn, .lm-import > .btn { width: auto; min-height: 44px; justify-content: center; }
.lm-import > .btn { justify-self: start; }
.lm-links { margin: 0; }
.lm-links .btn { width: auto; min-height: 44px; gap: 6px; }
.lm-table-wrap { overflow-x: auto; border: 1px solid var(--rule); border-radius: var(--radius-sm); }
.lm-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.lm-table caption { padding: 8px 12px 4px; text-align: left; color: var(--ink-mute); font-size: 13px; }
.lm-table th, .lm-table td { padding: 8px 12px; border-top: 1px solid var(--rule-soft); text-align: left; overflow-wrap: anywhere; }
.lm-table th { color: var(--ink-2); font-size: 13px; font-weight: 750; }
.lm-counts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 15px; color: var(--ink); }
.lm-counts strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.lm-counts span { color: var(--ink-mute); font-size: 13.5px; }
.lm-report { display: grid; gap: 12px; }
.lm-report-title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 19px; font-weight: 750; color: var(--ok); }
.lm-refused { margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: 14px; }
.lm-warn { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 10px 12px; border-radius: var(--radius-xs); background: var(--wait-bg); color: var(--ink); font-size: 14px; line-height: 1.45; }
.lm-warn svg { flex: none; margin-top: 2px; color: var(--wait); }
@media (min-width: 640px) {
  .lm-more-grid { grid-template-columns: 1fr 1fr; }
  .lm-more-grid .lm-span { grid-column: 1 / -1; }
}
@media (max-width: 520px) {
  .crm-clientes .crm-head-actions { width: 100%; flex-wrap: nowrap; }
  .crm-clientes .crm-head-actions > span:not(:empty) { flex: 1; min-width: 0; }
  .crm-clientes .crm-head-actions > span .btn { width: 100%; justify-content: center; padding: 0 12px; line-height: 1.25; white-space: normal; }
  .crm-clientes .crm-menu { flex: none; }
  .crm-doors { width: 100%; }
  .crm-doors button { flex: 1; min-width: 0; }
  .crm-menu-list { min-width: min(300px, calc(100vw - 32px)); }
  /* As abas rolam de lado dentro da faixa (nunca a página); a borda esmaecida avisa que há mais. */
  .crm-lead-tabs { -webkit-mask-image: linear-gradient(to right, #000 82%, transparent); mask-image: linear-gradient(to right, #000 82%, transparent); padding-right: 32px; }
}

/* E-04 · Fichas (lead e cliente) e Mensagem pronta: o que fazer agora primeiro,
   o resto recolhido. Celular primeiro: alvos de 44 px, fonte ≥ 13 px. */
.fx-ficha { gap: 16px; }
.fx-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.fx-top .crm-menu-list { min-width: min(320px, calc(100vw - 32px)); }
.crm-menu-list button.is-danger b { color: var(--bad); }
.crm-menu-list button span { display: grid; gap: 1px; text-align: left; }
.crm-menu-list button small { color: var(--ink-mute); font-size: 13px; font-weight: 500; }
.crm-menu-list button:has(small) { min-height: 52px; padding: 6px 12px; }
.fx-head { display: grid; gap: 6px; }
.fx-head .page-title { margin: 0; overflow-wrap: anywhere; }
.fx-sub { margin: 0; color: var(--ink-2); font-size: 15px; overflow-wrap: anywhere; }
.fx-sub a { color: var(--brand-text); font-weight: 650; }
.fx-state { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 0; color: var(--ink-2); font-size: 14px; }
.fx-queue { color: var(--brand-text); font-weight: 700; }
.fx-links { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; margin: 0; }
.fx-links a, .fx-phone { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--brand-text); font-weight: 650; font-size: 14.5px; overflow-wrap: anywhere; }
.fx-phone { color: var(--ink-2); font-weight: 600; font-variant-numeric: tabular-nums; }
.fx-address { margin: -6px 0 0; color: var(--ink-mute); font-size: 13.5px; overflow-wrap: anywhere; }
.fx-stateline { display: flex; align-items: baseline; gap: 8px; margin: 2px 0 0; font-size: 15px; font-weight: 650; color: var(--ink); }
.fx-stateline .crm-dot { flex: none; transform: translateY(1px); }
.fx-summary { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }
.fx-now { display: grid; gap: 10px; padding: 14px; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--surface); }
.fx-now-do { display: grid; }
.crm-page .btn.fx-main { width: 100%; min-height: 52px; justify-content: center; gap: 8px; font-size: 16px; text-decoration: none; }
.fx-now-say { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.45; }
.fx-now-more { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; }
.fx-now-more .btn { gap: 6px; text-decoration: none; }
.fx-link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0; border: 0; background: none; color: var(--brand-text); font: inherit; font-size: 14.5px; font-weight: 650; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.fx-search { display: grid; gap: 8px; padding-top: 4px; border-top: 1px solid var(--rule-soft); }
.fx-search[hidden] { display: none; }
.fx-search .admin-note { margin: 0; }
.fx-search-links { display: flex; flex-wrap: wrap; gap: 8px; }
.fx-search-links .btn { gap: 6px; text-decoration: none; }
.fx-sent { display: grid; gap: 10px; padding: 12px 14px; border: 1px solid var(--brand); border-left-width: 4px; border-radius: var(--radius-sm); background: var(--brand-soft); }
.fx-sent[hidden] { display: none; }
.fx-sent p { margin: 0; font-size: 14.5px; line-height: 1.45; color: var(--ink); }
.fx-sent-actions, .fx-reg-actions, .fx-confirm-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.fx-sent-actions .btn, .fx-reg-actions .btn, .fx-confirm-actions .btn { min-height: 44px; justify-content: center; }
.fx-detail summary, .fx-data > summary, .fx-situ-change > summary { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; min-height: 44px; cursor: pointer; color: var(--brand-text); font-weight: 700; font-size: 14.5px; }
.fx-detail label { margin-top: 6px; }
.fx-data > summary { color: var(--ink); }
.fx-data > summary .crm-label { margin: 0; }
.fx-data-sum { color: var(--ink-mute); font-size: 13.5px; font-weight: 600; overflow-wrap: anywhere; }
.fx-data[open] > summary { margin-bottom: 8px; }
.fx-origin { color: var(--ink-2); font-size: 14px; }
.fx-situ-now { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.fx-tl-edit { margin: 6px 0 0; padding: 6px 10px; border-left: 3px solid var(--wait); border-radius: 0 var(--radius-xs) var(--radius-xs) 0; background: var(--surface-2); color: var(--ink-2); font-size: 13.5px; }
.fx-tl-edit span { color: var(--ink-mute); }
.fx-tabs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin-bottom: 8px; padding: 2px; }
.fx-tabs::-webkit-scrollbar { display: none; }
.fx-tabs button { flex: none; min-height: 44px; padding: 0 14px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface); color: var(--ink-2); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.fx-tabs button span { margin-left: 2px; color: var(--ink-mute); font-weight: 600; font-variant-numeric: tabular-nums; }
.fx-tabs button[aria-selected="true"] { border-color: var(--brand); background: var(--brand); color: var(--brand-ink); }
.fx-tabs button[aria-selected="true"] span { color: inherit; opacity: .85; }
.crm-timeline > li[hidden] { display: none; }
.fx-allclear { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--ok-bg); color: var(--ink); font-size: 14.5px; font-weight: 650; }
.fx-allclear svg { flex: none; color: var(--ok); }
.fx-billing-lead { font-size: 15px; font-weight: 650; color: var(--ink); line-height: 1.45; }
.fx-tone.is-healthy { color: var(--ok); }
.fx-tone.is-attention { color: var(--wait); }
.fx-tone.is-risk { color: var(--bad); }
.fx-sub-h { margin: 14px 0 8px; font-size: 13.5px; font-weight: 750; color: var(--ink-2); }
.fx-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 0; padding: 0; list-style: none; }
.fx-tags li { padding: 3px 10px; border: 1px solid var(--rule); border-radius: 999px; color: var(--ink-2); font-size: 13px; font-weight: 650; }
/* Ficha do cliente no celular: as duas colunas se desfazem e a ordem vira
   próximo passo → cobrança → como está usando → registrar → linha do tempo → dados. */
@media (max-width: 899px) {
  .fx-cols { display: flex; flex-direction: column; gap: 16px; }
  .fx-cols > .crm-col-main, .fx-cols > .crm-col-side { display: contents; }
  .fx-o1 { order: 1; } .fx-o2 { order: 2; } .fx-o3 { order: 3; } .fx-o4 { order: 4; } .fx-o5 { order: 5; } .fx-o6 { order: 6; }
}
.fx-confirm { display: grid; gap: 12px; }
.fx-confirm-effect { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink); }
.fx-confirm label { display: grid; gap: 6px; font-size: 14px; font-weight: 650; color: var(--ink-2); }
.fx-confirm .form-input { min-height: 44px; width: 100%; }
/* Mensagem pronta: a sugerida inteira e grande; as outras recolhidas. */
.fx-msg-how { margin: 0 0 12px; color: var(--ink-2); font-size: 14.5px; }
.fx-msg-how span { color: var(--ink-mute); font-size: 13.5px; }
/* No celular a ação da sugerida fica presa no rodapé enquanto o texto rola. */
.fx-msg-suggested .fx-msg-actions { position: sticky; bottom: -18px; z-index: 1; margin: 4px -14px -14px; padding: 10px 14px 18px; border-radius: 0 0 var(--radius) var(--radius); background: var(--surface); box-shadow: 0 -8px 16px -12px rgba(0, 0, 0, .45); }
.fx-msg-suggested { display: grid; gap: 8px; padding: 14px; border: 2px solid var(--brand); border-radius: var(--radius); background: var(--surface); }
.fx-msg-label { margin: 0; color: var(--brand-text); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.fx-msg-title { margin: 0; font-size: 17px; font-weight: 750; color: var(--ink); }
.fx-msg-when { margin: 0; color: var(--ink-2); font-size: 14px; }
.fx-msg-text { margin: 4px 0 0; padding: 12px; border-radius: var(--radius-sm); background: var(--surface-2); color: var(--ink); font-size: 14.5px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.fx-msg-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin-top: 4px; }
.fx-msg-actions .btn { min-height: 48px; gap: 8px; justify-content: center; text-decoration: none; }
.fx-msg-suggested .fx-msg-actions .btn-primary { flex: 1 1 100%; }
.fx-alt { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border: 0; background: none; color: var(--brand-text); font: inherit; font-size: 14px; font-weight: 650; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.fx-msg-others { margin-top: 14px; }
.fx-msg-others > summary { display: flex; align-items: center; min-height: 44px; cursor: pointer; color: var(--brand-text); font-weight: 750; font-size: 15px; }
.fx-msg-list { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 8px; }
.fx-msg-item { border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); }
.fx-msg-item > summary { display: grid; gap: 2px; min-height: 44px; padding: 10px 14px; cursor: pointer; }
.fx-msg-item > summary b { font-size: 15px; color: var(--ink); }
.fx-msg-item > summary span { color: var(--ink-2); font-size: 13.5px; }
.fx-msg-item-body { padding: 0 14px 12px; }
@media (min-width: 900px) {
  .fx-now { grid-template-columns: minmax(0, 1fr) minmax(240px, auto); align-items: center; column-gap: 20px; }
  .fx-now-do { grid-column: 2; grid-row: 1 / span 2; }
  .fx-now-say { grid-column: 1; grid-row: 1; }
  .fx-now-more { grid-column: 1; grid-row: 2; }
  .fx-now > .fx-search, .fx-now > .fx-sent { grid-column: 1 / -1; }
  .fx-msg-suggested .fx-msg-actions .btn-primary { flex: 0 1 auto; min-width: 240px; }
}
/* E-03 · ajustes da avaliação: revisão da semana, lote importado, arquivo em português, linha compacta no celular. */
.crm-review { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 14px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); }
.crm-review[hidden] { display: none; }
.crm-review-text { display: grid; gap: 2px; min-width: 0; font-size: 14px; color: var(--ink-2); }
.crm-review-text strong { color: var(--ink); font-size: 14.5px; }
.crm-review-bar { grid-column: 1 / -1; grid-row: 2; height: 6px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.crm-review-bar span { display: block; height: 100%; border-radius: inherit; background: var(--ok); }
.crm-review-btn { grid-column: 2; grid-row: 1; width: auto; min-height: 44px; }
.crm-review-btn[aria-pressed="true"] { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-text); }
.fg-scope { margin: 0; padding: 10px 12px; border-radius: var(--radius-xs); background: var(--surface-2); color: var(--ink-2); font-size: 13.5px; line-height: 1.45; }
.fg-link, .crm-inline-link { min-height: 44px; padding: 0 4px; border: 0; background: none; color: var(--brand-text); font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; }
.lm-actions[hidden] { display: none; }
.lm-file { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 4px 12px; }
.lm-file-label { grid-column: 1 / -1; font-size: 14px; font-weight: 650; color: var(--ink-2); }
.lm-import .lm-file-btn { position: relative; display: inline-flex; align-items: center; width: auto; min-height: 44px; gap: 6px; color: var(--ink); font-size: 14.5px; cursor: pointer; }
.lm-file-btn:focus-within { outline: 2px solid var(--brand); outline-offset: 2px; }
.lm-file-input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.lm-file-name { min-width: 0; overflow-wrap: anywhere; color: var(--ink-mute); font-size: 13.5px; }
@media (max-width: 640px) {
  .crm-row-acts .crm-row-meta { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .crm-row-acts .crm-row-text { gap: 2px; }
  .crm-row-do { padding-bottom: 10px; }
  .crm-review { padding: 10px 12px; }
  .crm-review-text span { display: none; }
}
.lm-table td:nth-child(2) { white-space: nowrap; }

/* E-03 · rodada 2: no celular, o WhatsApp sobe para a direita do nome e os links
   ficam na ficha; resultado e próximo passo numa linha (cerca de 3 leads por tela). */
@media (max-width: 640px) {
  .crm-row-acts { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
  .crm-row-acts .crm-row-main { padding: 10px 4px 10px 14px; }
  .crm-row-acts .crm-row-do { flex-direction: column; align-items: flex-end; gap: 0; padding: 10px 12px 10px 0; }
  .crm-row-acts .crm-row-do .btn { padding: 0 12px; }
  .crm-row-acts .crm-row-sub { display: none; }
  .crm-row-acts .crm-row-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .crm-row-acts .crm-result-line { gap: 2px 8px; }
}

/* E-05 · Dinheiro e pedidos. Celular primeiro (390 px): 4 números em 2×2 que
   abrem a lista logo abaixo, "O que precisa de você agora" e seções recolhidas. */
.money-page { gap: 16px; }
.money-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; }
.money-head .page-title { margin: 0; }
/* No celular a barra de cima já diz "Dinheiro e pedidos": o título fica só para leitores de tela. */

.money-head .page-subtitle { grid-column: 1 / -1; margin: 0; }
.money-head .btn { min-height: 44px; gap: 6px; }
.money-numbers { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.money-number { display: grid; gap: 2px; align-content: start; justify-items: start; min-width: 0; min-height: 88px; padding: 10px 12px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.money-number:hover, .money-number:focus-visible { border-color: var(--brand); }
.money-number[aria-expanded="true"] { border-color: var(--brand); box-shadow: inset 0 -3px 0 var(--brand); }
.money-number-label { color: var(--ink-2); font-size: 13px; font-weight: 700; line-height: 1.3; }
.money-number strong { font-size: 20px; line-height: 1.25; font-variant-numeric: tabular-nums; letter-spacing: -.01em; overflow-wrap: anywhere; }
.money-number-note { color: var(--ink-mute); font-size: 13px; line-height: 1.35; }
.money-number.is-risk strong { color: var(--bad); }
.money-number.is-attention { background: var(--wait-bg); border-color: transparent; }
.money-number.is-attention strong { color: var(--wait); }
.money-number-list { display: grid; gap: 8px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); }
.money-number-list[hidden] { display: none; }
.money-number-list-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.money-number-list-head h2 { margin: 0; font-size: 16px; }
.money-number-list-head .btn { min-height: 44px; }
.money-now { display: grid; gap: 10px; }
.money-now .crm-section-title { margin: 0; }
.money-all-clear { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 14px 16px; border-radius: var(--radius-sm); background: var(--ok-bg); color: var(--ink); font-size: 15px; line-height: 1.45; }
.money-all-clear svg { flex: none; margin-top: 2px; color: var(--ok); }
.money-pending { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.money-item { display: grid; gap: 10px; padding: 12px 14px; border: 1px solid var(--rule); border-left: 4px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); }
.money-item.is-late { border-left-color: var(--bad); }
.money-item.is-soon { border-left-color: var(--wait); }
.money-item-main { display: grid; gap: 2px; min-width: 0; }
.money-item-main p { margin: 0; }
.money-item-top { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.money-due { color: var(--ink-2); font-size: 13px; font-weight: 700; }
.money-item.is-late .money-due { color: var(--bad); }
.money-item.is-soon .money-due { color: var(--wait); }
.money-item-title { font-size: 15px; font-weight: 700; overflow-wrap: anywhere; }
.money-item-detail { color: var(--ink-2); font-size: 14px; overflow-wrap: anywhere; }
.money-item-action { min-height: 44px; justify-content: center; width: 100%; }
.money-chip { display: inline-flex; align-items: center; min-height: 24px; padding: 1px 9px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 13px; font-weight: 700; }
.money-chip.is-ok { background: var(--ok-bg); color: var(--ok); }
.money-chip.is-bad { background: var(--bad-bg); color: var(--bad); }
.money-sections { display: grid; gap: 10px; }
.money-section { border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); scroll-margin-top: 16px; }
.money-section > summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 10px; min-height: 52px; padding: 10px 14px; cursor: pointer; list-style: none; }
.money-section > summary::-webkit-details-marker { display: none; }
.money-section > summary svg { grid-column: 2; grid-row: 1 / span 2; transition: transform .15s ease; }
.money-section[open] > summary svg { transform: rotate(180deg); }
.money-section-title { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; }
.money-section-note { color: var(--ink-mute); font-size: 13px; }
.money-section-body { display: grid; gap: 10px; padding: 0 14px 14px; min-width: 0; }
.money-help { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.5; max-width: 70ch; }
.money-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.money-actions .btn { min-height: 44px; }
.money-sub { margin: 6px 0 0; font-size: 14px; color: var(--ink-2); }
.money-quiet { margin: 0; color: var(--ink-mute); font-size: 14px; }
.money-quiet-sm { color: var(--ink-mute); font-size: 13px; }
.money-rows { list-style: none; margin: 0; padding: 0; display: grid; }
.money-rows > li { display: grid; gap: 8px; padding: 10px 0; border-top: 1px solid var(--rule-soft); min-width: 0; }
.money-rows > li:first-child { border-top: 0; }
.money-rows > li.is-focus { background: var(--wait-bg); border-radius: var(--radius-sm); padding: 10px; }
.money-row-main { display: grid; gap: 2px; min-width: 0; font-size: 14px; overflow-wrap: anywhere; }
.money-row-main > span { color: var(--ink-2); }
.money-row-side { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.money-row-side .btn { min-height: 44px; }
.money-note { color: var(--ink-mute); font-size: 13.5px; }
.money-bad { color: var(--bad); font-weight: 700; }
.money-wait { color: var(--wait); font-weight: 700; }
.money-subs { list-style: none; margin: 0; padding: 0; display: grid; }
.money-subs > li { display: grid; gap: 2px; padding: 10px 0; border-top: 1px solid var(--rule-soft); font-size: 14px; min-width: 0; overflow-wrap: anywhere; }
.money-subs-salon { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-weight: 700; }
.money-subs-label { color: var(--ink-mute); font-weight: 650; }
.money-subs-head { display: none !important; }
.money-done > summary { min-height: 44px; display: flex; align-items: center; color: var(--ink-2); font-size: 14px; font-weight: 650; cursor: pointer; }
.money-modal-facts { margin: 0 0 12px; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--surface-2); font-size: 14px; }
.money-foot { margin: 4px 0 0; color: var(--ink-mute); font-size: 13.5px; }
@media (min-width: 640px) {
  .money-page { gap: 20px; }
  .money-numbers { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
  .money-number { padding: 14px 16px; }
  .money-number strong { font-size: 24px; }
  .money-item { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .money-item-action { width: auto; }
  .money-rows > li { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .money-row-side { justify-content: flex-end; }
}
@media (min-width: 900px) {
  .money-subs-head { display: grid !important; color: var(--ink-mute); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
  .money-subs > li { grid-template-columns: 1.3fr 1.2fr 1fr .6fr; gap: 12px; align-items: center; }
  .money-subs-head { border-top: 0 !important; }
  .money-subs-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) { .money-section > summary svg { transition: none; } }

/* E-05 · rodada 2: mês anterior/próximo, baixar o mês, cobrança na linha, celular
   sem o botão de atualizar por cima do subtítulo. */
.money-head .page-subtitle { grid-column: 1 / -1; grid-row: 2; }
.money-month { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.money-month strong { font-size: 16px; min-width: 0; }
.money-month .btn { min-height: 44px; gap: 6px; }
.money-month [data-month]:first-child svg { transform: rotate(90deg); }
.money-month [data-month]:nth-child(3) svg { transform: rotate(-90deg); }
.money-month [data-export] { margin-left: auto; }
.money-month-note { margin: -4px 0 0; color: var(--ink-mute); font-size: 13px; line-height: 1.45; }
.money-item-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.money-ficha-link { min-height: 44px; min-width: 64px; justify-content: center; }
.money-item-mark { color: var(--ink-2); font-size: 13.5px; font-weight: 650; }
.money-subs > li.is-muted { color: var(--ink-mute); }
.money-subs > li.is-muted .money-subs-salon { font-weight: 600; }
@media (max-width: 639px) {
  .money-head .page-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .money-head .page-subtitle { grid-column: 1; grid-row: 1; }
  .money-head .btn { grid-column: 2; grid-row: 1; min-width: 44px; padding: 0 12px; }
  .money-month { flex-wrap: nowrap; gap: 6px; }
  .money-month strong { font-size: 15px; white-space: nowrap; }
  .money-month [data-export] { padding: 0 12px; }
  .money-wide { display: none; }
  .money-refresh-label { display: none; }
  .money-month [data-month] span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .money-month [data-month] { min-width: 44px; padding: 0 10px; }
}
@media (min-width: 640px) {
  .money-item-actions { display: flex; }
}

/* E-06 · De onde vêm os salões (med-), Opiniões dos salões (op-) e Saúde
   técnica (sa-). Celular primeiro (390 px): alvos de 44 px, fonte ≥ 13 px,
   nenhuma tabela empurra a página para o lado (rola dentro do contêiner). */
.med-page { gap: 16px; }
.med-page .hoje-number-note { overflow-wrap: anywhere; }
.med-reading { margin: 0; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--brand-soft); color: var(--ink); font-size: 15px; line-height: 1.5; }
.med-funnel { display: grid; gap: 16px; }
.med-funnel-group { display: grid; gap: 8px; min-width: 0; }
.med-funnel-title { margin: 0; font-size: 14px; font-weight: 700; color: var(--ink-2); }
.med-funnel-title small { font-weight: 600; color: var(--ink-mute); font-size: 13px; }
.med-bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.med-bars li { display: grid; gap: 4px; min-width: 0; }
.med-bar-text { font-size: 14px; color: var(--ink-2); }
.med-bar-text strong { color: var(--ink); font-size: 17px; font-variant-numeric: tabular-nums; margin-right: 2px; }
.med-bar { display: block; height: 10px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.med-bar > span { display: block; height: 100%; border-radius: inherit; background: var(--brand); }
.med-bars li.is-loss .med-bar > span { background: var(--wait); }
.med-bars small { color: var(--ink-mute); font-size: 13px; }
.med-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--brand-text); font-weight: 700; font-size: 14.5px; }
.med-period button { min-height: 44px; }
.med-table th[scope="row"] { font-weight: 650; text-align: left; white-space: normal; min-width: 128px; text-transform: none; letter-spacing: normal; color: var(--ink); }
.med-table td, .med-table th { font-size: 14px; }
.med-table td { font-variant-numeric: tabular-nums; }
.med-more > summary { display: flex; align-items: center; min-height: 44px; color: var(--brand-text); font-size: 14px; font-weight: 700; cursor: pointer; }
.med-more[open] > summary { margin-bottom: 8px; }
.med-more .table-container + .admin-note { margin-top: 8px; }
.med-ai { display: grid; gap: 2px; }
.med-ai-total { margin: 0; display: flex; align-items: baseline; gap: 8px; }
.med-ai-total strong { font-size: 26px; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.med-ai-total span { color: var(--ink-2); font-size: 14px; }
.med-ai-per { margin: 0; font-size: 15px; color: var(--ink); }
.med-help { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.5; max-width: 70ch; }
.med-sub { margin: 12px 0 6px; font-size: 14px; font-weight: 700; }
.med-retry { min-height: 44px; justify-self: start; }
#med-origins.is-loading .table-container { opacity: .5; }
@media (max-width: 639px) {
  /* No celular cada linha vira um bloco: nome da origem e, abaixo, os números com rótulo. */
  .med-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .med-table, .med-table tbody, .med-table tr { display: block; }
  .med-table tr { display: flex; flex-wrap: wrap; gap: 2px 12px; padding: 10px 0; border-bottom: 1px solid var(--rule-soft); }
  .med-table th[scope="row"], .med-table td { padding: 0; border: 0; }
  .med-table th[scope="row"] { flex-basis: 100%; min-width: 0; font-size: 14.5px; }
  .med-table td { color: var(--ink-2); font-size: 14px; }
  .med-table td::after { content: " " attr(data-label); color: var(--ink-mute); }
}
@media (min-width: 900px) {
  .med-funnel { grid-template-columns: 1fr 1.3fr; gap: 24px; }
}

.op-filters button { min-height: 44px; }
.op-item { gap: 6px; }
.op-item-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.op-age { color: var(--ink-2); font-size: 13px; font-weight: 650; }
.op-age.is-late { padding: 2px 8px; border-radius: 999px; background: var(--wait-bg); color: var(--wait); font-weight: 700; }
.op-state { margin-left: auto; color: var(--ink-2); font-size: 13px; font-weight: 700; }
.op-salon-line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0; font-size: 14px; }
.op-salon { display: inline-flex; align-items: center; min-height: 44px; color: var(--brand-text); font-size: 16px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.op-stage { padding: 2px 8px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 13px; font-weight: 700; }
.op-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.op-actions .btn { min-height: 44px; }
.op-confirm { display: grid; gap: 8px; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--wait-bg); }
.op-confirm p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink); }
.op-label { font-size: 13.5px; font-weight: 650; color: var(--ink-2); }
.op-empty { margin-top: 4px; font-size: 14px; line-height: 1.5; }
.op-empty.is-done { border-style: solid; border-color: transparent; background: var(--ok-bg); }
.op-empty.is-done strong { display: flex; align-items: center; gap: 6px; }

.sa-page { display: grid; gap: 16px; }
.sa-page .health-summary, .sa-page .health-grid { margin-bottom: 0; }
.sa-summary { align-items: flex-start; }
.sa-summary > div { display: grid; gap: 6px; }
.sa-summary h2 { margin: 2px 0 0 !important; }
.sa-action, .sa-who { color: var(--ink) !important; }
.sa-who { font-size: 13.5px !important; }
.sa-checked { font-size: 13px !important; }
.sa-on { display: inline-flex; align-items: center; gap: 4px; color: var(--ok); font-size: 13px; font-weight: 700; }
.sa-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sa-grid .health-card > strong small { font-size: 16px; font-weight: 600; color: var(--ink-mute); }
.sa-today { color: var(--ink) !important; font-weight: 650; }
.sa-grid .health-card > strong.sa-word { font-size: 22px; line-height: 1.2; }
.sa-alert { display: grid; gap: 8px; padding: 14px 16px; border-radius: var(--radius-sm); background: var(--bad-bg); }
.sa-alert p { margin: 0; font-size: 14px; line-height: 1.5; }
.sa-alert .btn { min-height: 44px; }
.sa-tech .health-details { border-top: 0; }
@media (max-width: 760px) {
  .sa-grid { grid-template-columns: 1fr; gap: 10px; }
  .sa-grid .health-card__head { margin-bottom: 8px; }
  .sa-grid .health-card > p { min-height: 0; margin-bottom: 8px; }
}
@media (min-width: 1100px) {
  .sa-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.med-before { color: var(--ink-2); font-weight: 650; }
.med-base { margin-top: -4px; }
.sa-grid .health-card > strong.sa-unmeasured { color: var(--ink-2); }
/* E-08 · Equipe e acessos (#equipe) e "Atribuir a…" em Leads. Celular primeiro
   (390 px): cartões de pessoa em uma coluna, botões de 44 px, nada de rolagem lateral. */
.eq-page { display: grid; gap: 22px; max-width: 1280px; }
.eq-head .btn-primary { min-height: 44px; gap: 6px; }
.eq-block, .eq-needs { display: grid; gap: 12px; min-width: 0; }
.eq-needs { padding: 16px; border: 1px solid var(--rule); border-left: 4px solid var(--wait); border-radius: var(--radius); background: var(--surface); }
.eq-h { margin: 0; font-size: 18px; font-weight: 800; color: var(--ink); }
.eq-sub-h { margin: 6px 0 0; font-size: 15px; font-weight: 750; color: var(--ink); }
.eq-note { margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.eq-note a { color: var(--brand-text); font-weight: 650; }
.eq-people, .eq-credits, .eq-alerts, .eq-log, .eq-converted { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; min-width: 0; }
.eq-person { display: grid; gap: 8px; padding: 14px 16px; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--surface); min-width: 0; }
.eq-person.is-off { background: var(--surface-2); }
.eq-person-head { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.eq-avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--brand-soft); color: var(--brand-text); font-weight: 800; }
.eq-person-id { display: grid; min-width: 0; }
.eq-person-id strong { font-size: 16px; overflow-wrap: anywhere; }
.eq-person-id span { color: var(--ink-2); font-size: 13.5px; overflow-wrap: anywhere; }
.eq-chip { display: inline-flex; align-items: center; min-height: 26px; padding: 2px 10px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 13px; font-weight: 750; white-space: nowrap; }
.eq-chip.is-ok { background: var(--ok-bg); color: var(--ok); }
.eq-chip.is-wait { background: var(--wait-bg); color: var(--wait); }
.eq-chip.is-off { background: var(--bad-bg); color: var(--bad); }
.eq-person-line { margin: 0; color: var(--ink-2); font-size: 14px; }
.eq-person-nums { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.eq-person-nums span { padding: 3px 10px; border-radius: 999px; background: var(--surface-2); color: var(--ink); font-size: 13.5px; font-weight: 650; font-variant-numeric: tabular-nums; }
.eq-person-credit { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--wait); font-size: 14px; font-weight: 650; }
.eq-person-actions, .eq-credit-actions, .eq-form-actions, .eq-converted-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.eq-person-actions .btn, .eq-credit-actions .btn, .eq-form-actions .btn, .eq-converted-actions .btn { min-height: 44px; gap: 6px; }
.eq-more { position: relative; }
.eq-empty { justify-items: start; }
.eq-credit { display: grid; gap: 10px; padding: 12px 14px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); min-width: 0; }
.eq-credit-text { display: grid; gap: 3px; min-width: 0; font-size: 14px; color: var(--ink-2); }
.eq-credit-text strong { color: var(--ink); font-size: 15.5px; overflow-wrap: anywhere; }
.eq-credit-facts { font-size: 13.5px; }
.eq-credit-check { font-size: 13.5px; font-weight: 650; }
.eq-credit-check.is-ok { color: var(--ok); }
.eq-credit-check.is-warn { color: var(--wait); }
.eq-alert { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: start; gap: 8px; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--wait-bg); color: var(--ink); }
.eq-alert-icon { color: var(--wait); padding-top: 2px; }
.eq-alert strong { display: block; font-size: 14.5px; overflow-wrap: anywhere; }
.eq-alert small { display: block; color: var(--ink-2); font-size: 14px; line-height: 1.45; }
.eq-alert .btn { min-height: 44px; background: var(--surface); }
.eq-alert-text { min-width: 0; }
.eq-log-tools { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.eq-log-tools label { display: grid; gap: 4px; color: var(--ink-2); font-size: 13.5px; font-weight: 650; min-width: 0; }
.eq-log-tools .form-input { min-height: 44px; min-width: 170px; font-size: 16px; }
.eq-log-tools input[type="date"] { padding: 0 12px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); font-family: inherit; }
.eq-log-day { margin: 10px 0 6px; color: var(--ink-2); font-size: 13.5px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
.eq-lead-filter { margin: 0; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--brand-soft); color: var(--ink); font-size: 14px; }
.eq-lead-filter[hidden] { display: none; }
.eq-person-warn { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 0; padding: 8px 10px; border-radius: var(--radius-sm); background: var(--bad-bg); color: var(--ink); font-size: 14px; }
.eq-person-warn svg { color: var(--bad); flex: none; }
.eq-person-warn span { flex: 1 1 200px; min-width: 0; }
.eq-person-warn .btn { min-height: 44px; background: var(--surface); }
.eq-warn { display: flex; gap: 6px; align-items: flex-start; margin: 0; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--wait-bg); color: var(--ink); font-size: 14px; line-height: 1.45; }
.eq-warn svg { flex: none; margin-top: 2px; color: var(--wait); }
.eq-cols { display: grid; gap: 22px; min-width: 0; }
.eq-check { display: flex !important; align-items: center; gap: 8px; min-height: 44px; color: var(--ink); font-size: 14.5px; font-weight: 600; cursor: pointer; }
.eq-check input { width: 20px; height: 20px; }
.eq-log { gap: 0; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); overflow: hidden; }
.eq-log-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: baseline; padding: 10px 14px; border-top: 1px solid var(--rule-soft); }
.eq-log-item:first-child { border-top: 0; }
.eq-log-text { min-width: 0; color: var(--ink); font-size: 14.5px; overflow-wrap: anywhere; }
.eq-log-item time { color: var(--ink-2); font-size: 13px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.eq-log-item.is-denied .eq-log-text, .eq-log-item.is-alert .eq-log-text { color: var(--wait); font-weight: 650; }
.eq-form { display: grid; gap: 8px; }
.eq-form .form-input { min-height: 44px; font-size: 16px; }
.eq-form-actions { margin-top: 6px; }
.eq-preview { margin: 4px 0 0; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--brand-soft); color: var(--brand-text); font-size: 14.5px; font-weight: 650; }
.eq-done { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 12px; border-radius: var(--radius-sm); background: var(--ok-bg); color: var(--ink); font-size: 15px; line-height: 1.45; }
.eq-done svg { flex: none; color: var(--ok); margin-top: 2px; }
.eq-results { display: grid; gap: 12px; }
.eq-nums { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.eq-nums li { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid var(--rule); border-radius: var(--radius-sm); background: var(--surface); }
.eq-nums strong { font-size: 24px; font-variant-numeric: tabular-nums; }
.eq-nums span { font-weight: 700; font-size: 14px; }
.eq-nums small { color: var(--ink-2); font-size: 13px; line-height: 1.35; }
.eq-converted li { display: grid; gap: 8px; padding: 10px 12px; border: 1px solid var(--rule); border-radius: var(--radius-sm); }
.eq-converted li > span:first-child { display: grid; gap: 2px; min-width: 0; }
.eq-converted small { color: var(--ink-2); font-size: 13.5px; }
@media (min-width: 1200px) {
  .eq-cols { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: start; }
}
@media (min-width: 900px) and (max-width: 1199px) {
  .eq-people { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
  .eq-credit, .eq-converted li { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .eq-nums { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .eq-head .btn-primary { grid-column: 1 / -1; grid-row: 3; width: 100%; justify-content: center; }
  .eq-log-item { grid-template-columns: minmax(0, 1fr); }
  .eq-log-tools label { flex: 1 1 140px; }
  .eq-person-actions .btn-primary { flex: 1 1 auto; justify-content: center; }
  .eq-page { padding-bottom: 96px; }
  .eq-alert { grid-template-columns: 22px minmax(0, 1fr); }
  .eq-alert .btn { grid-column: 2; justify-self: start; }
}

/* "Atribuir a…": caixa de escolha na linha do lead e barra fixa no rodapé. */
.crm-pick { display: grid; place-items: center; width: 44px; min-height: 44px; cursor: pointer; }
.crm-pick input { width: 22px; height: 22px; accent-color: var(--brand); cursor: pointer; }
.crm-rows .crm-row-acts.is-picking { grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; padding-left: 4px; }
.crm-rows .crm-row-acts.is-picked { background: var(--brand-soft); }
.crm-pickbar { position: sticky; bottom: 0; z-index: 30; display: grid; gap: 8px; margin: 0 0 10px; padding: 12px 14px; border: 1px solid var(--brand); border-radius: var(--radius-sm); background: var(--surface); box-shadow: var(--shadow-lg); }
.crm-pickbar[hidden] { display: none; }
.crm-pickbar-text { margin: 0; font-size: 14.5px; color: var(--ink); }
.crm-pickbar-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.crm-pickbar-actions .btn { min-height: 44px; }
.crm-assign { display: grid; gap: 6px; margin: 0; padding: 0; border: 0; min-width: 0; }
.crm-assign-opt { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 8px; align-items: center; min-height: 52px; padding: 6px 12px; border: 1px solid var(--rule); border-radius: var(--radius-sm); cursor: pointer; }
.crm-assign-opt:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); }
.crm-assign-opt:has(input:disabled) { opacity: .6; cursor: default; }
.crm-assign-opt input { width: 20px; height: 20px; accent-color: var(--brand); }
.crm-assign-opt span { display: grid; min-width: 0; }
.crm-assign-opt b { overflow-wrap: anywhere; }
.crm-assign-opt small { color: var(--ink-2); font-size: 13px; }
.fx-with { color: var(--brand-text); font-weight: 700; }
.fx-origin-lead { display: flex; align-items: flex-start; gap: 6px; margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.45; }
.fx-origin-lead svg { flex: none; margin-top: 2px; }
.fx-origin-lead a { display: inline-flex; align-items: center; min-height: 44px; margin-left: 4px; color: var(--brand-text); font-weight: 700; }
@media (max-width: 640px) {
  .crm-rows .crm-row-acts.is-picking { grid-template-columns: 44px minmax(0, 1fr) auto; align-items: start; }
  .crm-pickbar { margin: 0 -4px 10px; }
}

/* E-11 · Salões: filtros de uso e integrações. Chip com 0 fica esmaecido (não
   some); as escolhas viram chips removíveis acima da lista; cada linha mostra
   "N de 6 passos" e, com filtro, o valor de cada critério escolhido (sem
   leitura de uso, o sinal já diz e a linha não aparece). */
.fg-option.is-zero { border-style: dashed; background: var(--surface-2); color: var(--ink-mute); }
.fg-option.is-zero[aria-pressed="true"] { border-style: solid; }
.crm-usage-on { display: grid; gap: 4px; }
.crm-usage-on[hidden] { display: none; }
.crm-usage-chips { display: flex; align-items: flex-start; gap: 6px; }
.crm-usage-chip-list { display: flex; flex: 0 1 auto; flex-wrap: wrap; gap: 6px; min-width: 0; }
.crm-usage-chips .crm-inline-link { flex: none; }
/* E-11 · ajustes: na gaveta, cada item com "Falta" e "Já tem" (um sentido por item). */
.crm-usage-rows { display: grid; gap: 4px; }
.crm-usage-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 6px 12px; padding: 8px 0; border-top: 1px solid var(--rule); }
.crm-usage-row:first-child { border-top: 0; }
.crm-usage-row-name { display: grid; gap: 2px; min-width: 0; color: var(--ink); font-size: 14.5px; font-weight: 650; }
.crm-usage-row-name small { color: var(--ink-mute); font-size: 13px; font-weight: 500; line-height: 1.4; }
.crm-usage-row-name .crm-usage-changed { color: var(--brand-text); font-weight: 700; }
.crm-usage-row-pick { display: flex; gap: 6px; }
@media (max-width: 640px) {
  .crm-usage-row-pick .fg-option { padding: 0 10px; }
  .crm-usage-and { display: none; }
}
.crm-usage-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px 0 14px; border: 1px solid var(--brand); border-radius: 999px; background: var(--brand-soft); color: var(--brand-text); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; text-align: left; }
.crm-usage-chip span { font-size: 18px; line-height: 1; }
.crm-usage-note { margin: 0; color: var(--ink-2); font-size: 13.5px; }
.crm-row-usage { color: var(--ink-2); font-size: 13px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

/* Online agora (E-11) */
.on-page { display: grid; gap: 18px; max-width: 760px; }
.on-head .page-title { margin: 0; }
.on-head .page-subtitle { margin: 4px 0 0; }
.on-top { display: grid; gap: 12px; }
.on-count { margin: 0; font-size: 30px; line-height: 1.15; font-weight: 800; color: var(--ink); }
.on-windows { display: flex; flex-wrap: wrap; gap: 8px; }
.on-window { min-height: 44px; padding: 0 16px; border: 1px solid var(--rule); border-radius: 999px; background: var(--surface); color: var(--ink-2); font: inherit; font-size: 14px; font-weight: 650; cursor: pointer; }
.on-window[aria-pressed="true"] { background: var(--brand-soft); color: var(--brand-text); border-color: var(--brand); }
.on-group { display: grid; gap: 6px; margin-bottom: 14px; }
.on-salon { margin: 0; font-size: 16px; font-weight: 800; color: var(--ink); }
.on-salon a { color: var(--brand-text); display: inline-flex; align-items: center; min-height: 44px; }
.on-people { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.on-person { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 52px; padding: 8px 14px; border: 1px solid var(--rule); border-radius: var(--radius); background: var(--surface); }
.on-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--ink-mute); }
.on-dot.is-now { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-bg); }
.on-who { display: grid; min-width: 0; }
.on-who strong { font-size: 15px; overflow-wrap: anywhere; }
.on-role { font-size: 13px; color: var(--ink-mute); }
.on-ago { font-size: 14px; font-weight: 650; color: var(--ink-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.on-hint, .on-note { margin: 0; font-size: 13px; line-height: 1.5; color: var(--ink-mute); }
.on-empty { justify-items: stretch; }
@media (max-width: 480px) { .on-count { font-size: 26px; } }
.on-offline { margin: 0; font-size: 15px; font-weight: 650; color: var(--ink-2); }
.on-offline:empty { display: none; }
.on-stage { margin-left: 8px; padding: 2px 8px; border-radius: 999px; background: var(--surface-2); color: var(--ink-2); font-size: 13px; font-weight: 650; vertical-align: middle; }
/* Excluir salão sem guardar cópia (conta de teste). */
.fx-nocopy { display: flex; gap: 10px; align-items: flex-start; margin: 12px 0; padding: 12px; min-height: 44px; border: 1px solid var(--rule); border-radius: var(--radius-sm); font-size: 14px; cursor: pointer; }
.fx-nocopy input { width: 22px; height: 22px; margin-top: 1px; flex: none; accent-color: var(--bad, #9c4030); }
.fx-nocopy:has(input:checked) { border-color: var(--bad, #9c4030); background: var(--bad-bg, #fbece9); }

/* Cadastro e acessos (ficha do cliente, 24/10/2026). */
.fx-access { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 14px; }
.fx-access li { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.fx-access li > span:first-child { font-weight: 650; font-variant-numeric: tabular-nums; }
.fx-access li > span + span { color: var(--ink-2); }
