:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #c9c9c4;
  color: #121212;
  font-synthesis: none;
}

* { box-sizing: border-box; }

body { min-height: 100vh; margin: 0; background: #c9c9c4; line-height: 1.45; }
body.modal-open { overflow: hidden; }

header {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 0 max(4vw, 28px);
  background: #111;
  color: #fff;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: #fff;
  font-size: .93rem;
  font-weight: 760;
  letter-spacing: -.015em;
  text-decoration: none;
  white-space: nowrap;
}

.brand::before { width: 9px; height: 9px; background: #fff; content: ""; }

nav { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 2px; }
nav a, .link-button {
  border: 0;
  padding: 9px 10px;
  background: transparent;
  color: #adadad;
  font: inherit;
  font-size: .82rem;
  font-weight: 650;
  text-decoration: none;
  transition: color .14s ease, background-color .14s ease;
}
nav a:hover, .link-button:hover { background: #2a2a2a; color: #fff; }
nav form { display: flex; align-items: center; }
.link-button { min-height: auto; margin: 0; cursor: pointer; }

main { width: min(1360px, calc(100vw - 64px)); margin: 48px auto 84px; }
h1, h2 { color: #111; letter-spacing: -.04em; }
h1 { margin: 0 0 9px; font-size: clamp(2rem, 3.6vw, 3.05rem); font-weight: 740; line-height: 1; }
h2 { margin: 0 0 18px; font-size: 1rem; font-weight: 730; }
p.muted { max-width: 680px; margin: 0; color: #656561; font-size: .94rem; }

.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 42px; margin: 36px 0; }
.card { min-width: 0; padding: 22px 0 0; border-top: 2px solid #111; background: transparent; }
.card.wide { overflow-x: auto; margin-top: 40px; padding-top: 20px; border-top-width: 1px; }
.grid + .card.wide { margin-top: 0; }

label { display: block; margin: 17px 0 7px; color: #343432; font-size: .76rem; font-weight: 760; letter-spacing: .035em; text-transform: uppercase; }
input, select, textarea {
  width: 100%;
  border: 1px solid #b9b9b4;
  border-radius: 0;
  outline: none;
  background: #eeeeea;
  color: #111;
  font: inherit;
  font-size: .9rem;
  transition: border-color .14s ease, box-shadow .14s ease;
}
input, select { min-height: 42px; padding: 9px 11px; }
textarea { min-height: 104px; padding: 10px 11px; resize: vertical; }
input::placeholder, textarea::placeholder { color: #92928d; }
input:focus, select:focus, textarea:focus { border-color: #111; box-shadow: inset 0 0 0 1px #111; }

button, .button {
  display: inline-flex;
  min-height: 41px;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
  padding: 10px 15px;
  border: 1px solid #111;
  border-radius: 0;
  background: #111;
  color: #fff;
  font: inherit;
  font-size: .82rem;
  font-weight: 750;
  letter-spacing: .01em;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .14s ease, color .14s ease;
}
button:hover, .button:hover { background: #fff; color: #111; }
button.secondary, .button.secondary { border-color: #aaa9a4; background: transparent; color: #111; }
button.secondary:hover, .button.secondary:hover { border-color: #111; background: #111; color: #fff; }
button.danger { border-color: #a63c31; background: transparent; color: #a63c31; }
button.danger:hover { background: #a63c31; color: #fff; }

.alert { margin: 24px 0; padding: 11px 14px; border-left: 3px solid #111; background: #d1d1cb; font-size: .89rem; }
.alert.error { border-color: #a63c31; background: #f4e4e1; color: #72261f; }
.alert.success { border-color: #307548; background: #e2eee5; color: #19542d; }
.alert.info { border-color: #32618a; background: #e0ebf2; color: #1c4a70; }

table { width: 100%; min-width: 940px; border-collapse: collapse; font-size: .87rem; }
th, td { padding: 13px 10px; border-bottom: 1px solid #cecec8; text-align: left; vertical-align: top; }
th { color: #5c5c58; font-size: .72rem; font-weight: 760; letter-spacing: .055em; text-transform: uppercase; white-space: nowrap; }
td { color: #1d1d1b; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover td { background: rgba(0, 0, 0, .025); }
td input, td select { min-width: 132px; min-height: 37px; padding: 7px 8px; font-size: .84rem; }
td textarea.compact-area { min-width: 220px; min-height: 62px; padding: 7px 8px; font-size: .82rem; }

.small { color: #686863; font-size: .78rem; }
.inline { display: flex; align-items: end; gap: 12px; flex-wrap: wrap; }
.inline > * { flex: 1 1 180px; }
.inline button, .inline .button { flex: 0 0 auto; margin-top: 0; }
.inline input, .inline select { margin-top: 0; }
.date-picker { position: relative; flex: 0 1 220px; }
.date-picker-trigger { width: 100%; min-height: 42px; justify-content: flex-start; gap: 8px; margin: 0; padding: 8px 11px; border-color: #b9b9b4; background: #eeeeea; color: #111; }
.date-picker-trigger span:first-child { color: #686863; font-size: .7rem; font-weight: 760; letter-spacing: .04em; text-transform: uppercase; }
.date-picker-trigger strong { flex: 1; overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.date-picker-panel { position: absolute; z-index: 20; top: calc(100% + 7px); right: 0; display: grid; width: min(610px, calc(100vw - 48px)); grid-template-columns: 225px 1fr; border: 1px solid #111; background: #eeeeea; box-shadow: 8px 8px 0 rgba(17, 17, 17, .2); }
.date-picker-panel[hidden] { display: none; }
.date-presets { padding: 14px; border-right: 1px solid #b9b9b4; }
.date-presets p { margin: 0 0 8px; color: #62625d; font-size: .7rem; font-weight: 760; letter-spacing: .05em; text-transform: uppercase; }
.date-preset { width: 100%; min-height: 36px; justify-content: flex-start; gap: 9px; margin: 0; padding: 8px 4px; border: 0; border-bottom: 1px solid #d1d1cc; background: transparent; color: #222; font-size: .8rem; font-weight: 600; white-space: nowrap; }
.date-preset:last-child { border-bottom: 0; }
.date-preset:hover, .date-preset.is-selected { background: #d9d9d4; color: #111; }
.date-radio { flex: 0 0 14px; width: 14px; height: 14px; border: 1px solid #8c8c87; border-radius: 50%; background: #fff; }
.date-preset.is-selected .date-radio { border: 4px solid #2779ad; }
.calendar { min-width: 0; padding: 14px 16px 12px; }
.calendar-header { display: grid; grid-template-columns: 34px 1fr 34px; align-items: center; margin-bottom: 12px; }
.calendar-header strong { text-align: center; }
.calendar-header button { min-height: 32px; margin: 0; padding: 0; border-color: transparent; background: transparent; color: #111; font-size: 1.25rem; }
.calendar-header button:hover { border-color: #111; background: #111; color: #fff; }
.calendar-weekdays, .calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(30px, 1fr)); }
.calendar-weekdays span { padding: 4px 0 7px; color: #777772; font-size: .66rem; text-align: center; }
.calendar-day { min-height: 34px; margin: 0; padding: 0; border: 1px solid transparent; background: transparent; color: #222; font-size: .78rem; font-weight: 600; }
.calendar-day:hover { border-color: #111; background: #fff; color: #111; }
.calendar-day.is-in-range { background: #c9ddea; color: #153e58; }
.calendar-day.is-range-start, .calendar-day.is-range-end { background: #2779ad; color: #fff; }
.calendar-day.is-today { border-color: #2779ad; }
.calendar-help { margin: 10px 0 0; color: #686863; font-size: .7rem; }

.status-form { min-width: 250px; }
.status-form textarea { min-height: 72px; }
.status-form button { width: 100%; margin-top: 10px; }
.table-form { display: flex; flex-wrap: wrap; gap: 6px; }
.table-form button { min-height: 37px; margin: 0; padding: 8px 10px; }
.row-actions { min-width: 145px; }

.key { display: block; overflow-wrap: anywhere; padding: 13px 14px; border-left: 2px solid #111; background: #d1d1cb; color: #171715; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .81rem; line-height: 1.55; }

.lead-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.page-title-actions { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.page-title-actions h1 { margin: 0; }
.page-title-actions > button { margin: 0; }
.page-action-buttons { display: flex; align-items: center; gap: 8px; }
.page-action-buttons button { margin: 0; }
.bulk-toolbar { display: flex; align-items: center; gap: 10px; margin: 7px 0 14px; padding: 10px 12px; border-left: 3px solid #111; background: #d7d7d1; }
.bulk-toolbar[hidden] { display: none; }
.bulk-toolbar span { margin-right: auto; font-size: .84rem; }
.bulk-toolbar select { width: 190px; min-height: 37px; }
.bulk-toolbar button { min-height: 37px; margin: 0; padding: 8px 12px; }
.select-column { width: 42px; text-align: center; }
.select-column input { width: 16px; min-width: 16px; height: 16px; min-height: 16px; margin: 2px 0 0; accent-color: #111; }
.client-lead-heading { margin-bottom: 14px; padding-left: 16px; border-left: 3px solid #111; }
.client-lead-heading .lead-welcome { margin: 0 0 9px; }
.lead-count { margin: 0; color: #555550; font-size: 1.15rem; font-weight: 700; letter-spacing: -.015em; }
.lead-count strong { color: #1b783b; font-size: 1.35rem; }
.lead-quote { max-width: 680px; margin: 0; color: #656561; font-size: .94rem; font-style: italic; }
.live-state { color: #1b783b; font-size: .76rem; font-weight: 760; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.live-dot { display: inline-block; animation: live-pulse 2.2s ease-in-out infinite; }
@keyframes live-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .22; }
}
@media (prefers-reduced-motion: reduce) {
  .live-dot { animation: none; }
}
.lead-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.tag { display: inline-flex; padding: 3px 6px; border: 1px solid currentColor; font-size: .66rem; font-weight: 800; letter-spacing: .06em; line-height: 1; }
.tag-new { color: #19733a; background: #d5ebd9; }
.tag-lead { color: #555550; background: #deded9; }
.tag-duplicate { color: #8a5420; background: #f0ddca; }
.status-value { font-weight: 730; }
.contact-facts, .lead-facts { margin: 9px 0 0; }
.contact-facts div { margin-top: 5px; }
.contact-facts dt, .lead-facts dt { color: #6b6b66; font-size: .67rem; font-weight: 760; letter-spacing: .045em; text-transform: uppercase; }
.contact-facts dd, .lead-facts dd { margin: 1px 0 0; overflow-wrap: anywhere; }

.lead-link { display: grid; gap: 4px; width: max-content; color: #111; text-decoration: none; }
.lead-link strong { border-bottom: 1px solid #111; font-size: .93rem; }
.lead-link:hover strong { color: #1b783b; border-color: #1b783b; }
.lead-facts { display: grid; grid-template-columns: repeat(2, minmax(140px, 1fr)); gap: 12px 18px; padding: 13px; border-left: 2px solid #111; background: #d1d1cb; }
.lead-facts .fact-wide { grid-column: 1 / -1; }
.lead-actions { min-width: 116px; }
.icon-action { display: grid; width: 34px; height: 34px; margin: 0; padding: 0; place-items: center; border: 1px solid #6e6e68; background: #e7e7e1; color: #111; cursor: pointer; font-size: 1.05rem; line-height: 1; list-style: none; }
.lead-edit-modal { position: fixed; z-index: 50; inset: 0; display: grid; padding: 24px; place-items: center; background: rgba(17, 17, 17, .52); }
.lead-edit-modal[hidden] { display: none; }
.lead-edit-dialog { width: min(440px, 100%); max-height: calc(100vh - 48px); overflow-y: auto; padding: 20px; border: 1px solid #111; background: #e7e7e1; box-shadow: 9px 9px 0 rgba(17, 17, 17, .28); }
.client-create-dialog { width: min(520px, 100%); }
.landing-create-dialog, .request-example-dialog { width: min(560px, 100%); }
.management-edit-dialog { width: min(680px, 100%); }
.compact-edit-dialog { width: min(480px, 100%); }
.modal-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.modal-form-grid label { margin-top: 17px; }
.modal-field-wide { grid-column: 1 / -1; }
.request-example-content { padding-top: 18px; }
.request-example-content > p { margin: 0 0 18px; }
.lead-edit-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 12px; border-bottom: 1px solid #aaa9a3; }
.lead-edit-header h2 { margin: 0; }
.modal-close { flex: 0 0 34px; width: 34px; min-height: 34px; margin: 0; padding: 0; border-color: #777772; background: transparent; color: #111; font-size: 1.25rem; }
.lead-edit-dialog textarea { min-height: 120px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.modal-actions button { width: auto; margin: 0; }
.modal-danger-zone { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 22px; padding-top: 17px; border-top: 1px solid #b26a62; }
.modal-danger-zone strong { color: #852e25; font-size: .85rem; }
.modal-danger-zone p { margin: 3px 0 0; color: #6c4b47; font-size: .76rem; }
.modal-danger-zone form { flex: 0 0 auto; }
.modal-danger-zone button { margin: 0; }
.back-link { display: inline-block; margin-bottom: 26px; color: #111; font-size: .84rem; font-weight: 700; text-decoration: none; }
.back-link:hover { color: #1b783b; }
.lead-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 44px; align-items: start; }
.detail-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 24px; border-bottom: 2px solid #111; }
.detail-title .tag { margin-top: 5px; }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px 42px; margin-top: 34px; }
.detail-section { padding-top: 18px; border-top: 1px solid #555550; }
.detail-section h2 { margin-bottom: 15px; }
.detail-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 22px; margin: 0; }
.detail-facts div { min-width: 0; }
.detail-facts dt { color: #5c5c57; font-size: .7rem; font-weight: 760; letter-spacing: .05em; text-transform: uppercase; }
.detail-facts dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.contact-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.contact-actions .button { margin: 0; }
.workflow { margin: 0; padding: 0; list-style: none; }
.workflow li { display: grid; gap: 3px; padding: 11px 0 11px 15px; border-left: 2px solid #6c6c66; }
.workflow li + li { border-top: 1px solid #aaa9a3; }
.workflow span { color: #62625d; font-size: .82rem; }
.lead-side-actions { position: sticky; top: 22px; padding-top: 20px; border-top: 2px solid #111; }
.lead-side-actions h2 { margin-bottom: 6px; }
.lead-side-actions button { width: 100%; }
.detail-status-form label { margin-top: 14px; }
.detail-status-form textarea { min-height: 120px; }
.detail-status-form button { margin-top: 14px; }
.detail-editor { margin-top: 48px; padding-top: 22px; border-top: 2px solid #111; }
.detail-editor > h2 { margin-bottom: 6px; }
.detail-edit-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 16px; margin-top: 24px; }
.detail-edit-form h3 { grid-column: 1 / -1; margin: 18px 0 0; padding-bottom: 7px; border-bottom: 1px solid #8f8f89; font-size: .78rem; letter-spacing: .055em; text-transform: uppercase; }
.detail-edit-form h3:first-of-type { margin-top: 0; }
.detail-edit-form label { margin: 0; }
.field-help { display: block; margin-top: 6px; color: #686863; font-size: .72rem; font-weight: 500; letter-spacing: 0; line-height: 1.35; text-transform: none; }
.detail-edit-form .field-wide, .detail-edit-actions { grid-column: 1 / -1; }
.detail-edit-actions { display: flex; justify-content: flex-end; }
.detail-edit-actions button { min-width: 190px; margin-top: 8px; }
.queue-state { margin: 14px 0 0; color: #1b783b; font-size: .86rem; font-weight: 700; }

.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 38px 44px; margin-top: 40px; }
.settings-card:last-child { grid-column: 1 / -1; max-width: 700px; }
.settings-facts { display: grid; gap: 15px; margin: 0; }
.settings-facts div { padding-bottom: 12px; border-bottom: 1px solid #aaa9a4; }
.settings-facts dt { color: #666661; font-size: .69rem; font-weight: 760; letter-spacing: .05em; text-transform: uppercase; }
.settings-facts dd { margin: 3px 0 0; font-weight: 650; }
.check-option { display: grid; grid-template-columns: 18px 1fr; gap: 11px; align-items: start; margin: 15px 0; padding: 12px 0; border-bottom: 1px solid #aaa9a4; color: #161615; font-size: .88rem; letter-spacing: 0; text-transform: none; cursor: pointer; }
.check-option input { width: 17px; height: 17px; min-height: 17px; margin: 2px 0 0; accent-color: #111; }
.check-option span { display: grid; gap: 3px; }
.check-option strong { font-size: .9rem; }
.check-option small, .settings-note { color: #64645f; font-size: .78rem; font-weight: 450; }
.settings-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.settings-actions button { margin-top: 16px; }

.integration-jump-links { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 24px; }
.integration-jump-links a { color: #343432; font-size: .82rem; font-weight: 700; text-underline-offset: 5px; }
.integration-jump-links a:hover { color: #111; }
.integration-section { margin-top: 44px; scroll-margin-top: 28px; }
.integration-section + .integration-section { margin-top: 58px; padding-top: 34px; border-top: 2px solid #111; }
.integration-section-title { margin: 0 0 8px; font-size: 1.4rem; }
.integration-section .page-title-actions + p.muted { margin-top: 8px; }
.integration-section > .card.wide { margin-top: 24px; }
.integration-dialog { width: min(850px, calc(100vw - 40px)); }
.integration-dialog h3 { font-size: .84rem; border-bottom: 1px solid #77776f; padding-bottom: 10px; margin: 12px 0 0; }
.integration-dialog .small { margin: 0; }
.integration-secret { padding: 22px; margin-top: 26px; background: #dce5da; border-left: 3px solid #367144; }
.integration-secret input { font-family: monospace; font-size: .8rem; }
.integration-error { max-width: 350px; color: #8e3029; font-size: .76rem; margin-top: 6px; overflow-wrap: anywhere; }
.integration-steps { padding-left: 22px; line-height: 1.65; }
.integration-steps li + li { margin-top: 18px; }
.form-answers { grid-column: 1 / -1; }
.form-answers dl { margin: 0; display: grid; gap: 18px; }
.form-answers dl > div { border-bottom: 1px solid #aaa9a4; padding-bottom: 16px; }
.form-answers dt { font-weight: 700; overflow-wrap: anywhere; }
.form-answers dd { margin: 6px 0 0; overflow-wrap: anywhere; line-height: 1.55; }

.login { width: min(470px, 100%); margin: clamp(48px, 12vh, 126px) auto; padding: 0 0 0 28px; border-top: 0; border-left: 3px solid #111; }
.login h1 { margin-bottom: 10px; }
.login button { width: 100%; margin-top: 24px; }
.login-cancel-form { margin-top: 14px; text-align: center; }
.login-cancel-form button { width: auto; background: transparent; color: #555550; font-size: .84rem; text-decoration: underline; padding: 6px 0; border: 0; cursor: pointer; }
.login-cancel-form button:hover { color: #111; background: transparent; }

.two-factor-status-row { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.two-factor-status-row p { margin: 0; }
.two-factor-setup-box { display: flex; flex-direction: column; align-items: center; gap: 16px; margin: 18px 0; padding: 18px; background: #d7d7d2; border: 1px solid #aaa9a4; }
.qr-code-wrap { background: #fff; padding: 12px; display: inline-flex; border: 1px solid #b5b5af; }
.qr-code-svg { display: block; }
.manual-key-display { text-align: center; font-size: .84rem; }
.manual-key-code { display: block; font-family: monospace; font-size: .95rem; font-weight: 700; letter-spacing: .08em; margin-top: 6px; user-select: all; }
.recovery-codes-section { margin-top: 20px; }
.recovery-codes-section h3 { margin: 0 0 6px; font-size: .92rem; }
.recovery-codes-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 16px; margin: 12px 0 20px; padding: 14px; background: #fff; border: 1px solid #aaa9a4; font-family: monospace; font-size: .88rem; font-weight: 600; text-align: center; }
.recovery-alert-box { padding: 18px; margin-bottom: 24px; background: #e0ded8; border-left: 3px solid #111; }
.recovery-alert-box h3 { margin: 0 0 8px; font-size: .96rem; }
.modal-warning-zone { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 20px; padding-top: 16px; border-top: 1px dashed #aaa9a4; }
.modal-warning-zone p { margin: 4px 0 0; font-size: .78rem; color: #555550; }

.audit-action-code { display: inline-block; font-family: monospace; font-size: .75rem; color: #555550; margin-top: 3px; }
.audit-ip-code { font-family: monospace; font-size: .82rem; }
.audit-chip { display: inline-block; background: #dcdbd6; border: 1px solid #b5b5af; padding: 2px 6px; font-size: .78rem; margin: 2px 4px 2px 0; border-radius: 2px; }
.pagination-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; padding-top: 14px; border-top: 1px solid #aaa9a4; }
.pagination-info { font-size: .88rem; color: #444440; }
.button.disabled, span.button.disabled { opacity: .45; pointer-events: none; cursor: default; }

.metric-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin: 18px 0 24px; }
.metric-card { background: #deded8; border: 1px solid #111; padding: 12px 16px; display: flex; flex-direction: column; gap: 4px; box-shadow: 3px 3px 0 rgba(17, 17, 17, .12); }
.metric-label { font-size: .72rem; text-transform: uppercase; font-weight: 750; color: #5a5a55; letter-spacing: .04em; }
.metric-value { font-size: 1.55rem; font-weight: 700; color: #111; line-height: 1.1; }
.metric-sub { font-size: .75rem; color: #62625d; margin-top: 2px; }

.copy-icon-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; margin-left: 4px; padding: 0; border: 1px solid #b9b9b4; background: #eee; cursor: pointer; font-size: 11px; border-radius: 0; vertical-align: middle; }
.copy-icon-btn:hover { background: #111; color: #fff; border-color: #111; }
.copy-tooltip { position: absolute; bottom: 125%; left: 50%; transform: translateX(-50%); background: #111; color: #fff; font-size: .65rem; font-weight: 600; padding: 2px 6px; white-space: nowrap; pointer-events: none; z-index: 100; }
.contact-with-copy { display: inline-flex; align-items: center; gap: 4px; }

.phone-copy-text { position: relative; display: inline-block; cursor: pointer; user-select: all; }
.phone-copy-text:hover { opacity: .75; }

.phone-cell-content { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.phone-quick-actions { display: inline-flex; align-items: center; gap: 3px; flex-shrink: 0; }
.phone-action-icon { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border: 1px solid #b9b9b4; background: #eee; font-size: 11px; text-decoration: none; color: #111; border-radius: 0; line-height: 1; }
.phone-action-icon:hover { background: #25d366; color: #fff; border-color: #25d366; }
.btn-whatsapp { border-color: #128c7e; color: #128c7e; }
.btn-whatsapp:hover { background: #25d366; color: #fff; border-color: #25d366; }

.workflow-badge { display: inline-block; font-size: .68rem; font-weight: 700; padding: 2px 7px; border: 1px solid #8c8c86; letter-spacing: .02em; line-height: 1.3; }
.workflow-uncontacted { background: #deded8; color: #62625d; border-color: #aaa9a3; text-transform: uppercase; }
.workflow-updated { background: #111; color: #f4f4f0; border-color: #111; }
.lead-meta-row { display: flex; align-items: center; gap: 6px; margin-top: 4px; }

@media (max-width: 760px) {
  header { min-height: auto; align-items: flex-start; flex-direction: column; padding: 18px 20px; gap: 13px; }
  nav { width: 100%; justify-content: flex-start; }
  main { width: min(100% - 32px, 1360px); margin-top: 34px; }
  .grid { grid-template-columns: 1fr; gap: 30px; margin: 28px 0; }
  .card.wide { margin-top: 28px; }
  .inline > * { flex-basis: 100%; }
  .inline button, .inline .button { width: 100%; }
  .date-picker { flex-basis: 100%; }
  .date-picker-panel { right: auto; left: 0; grid-template-columns: 1fr; }
  .date-presets { border-right: 0; border-bottom: 1px solid #b9b9b4; }
  table { min-width: 810px; }
  .login { padding-left: 20px; }
  .lead-detail-layout, .detail-grid { grid-template-columns: 1fr; gap: 28px; }
  .lead-side-actions { position: static; }
  .detail-facts { grid-template-columns: 1fr; }
  .detail-edit-form { grid-template-columns: 1fr; }
  .detail-edit-form h3, .detail-edit-form .field-wide, .detail-edit-actions { grid-column: 1; }
  .modal-form-grid { grid-template-columns: 1fr; }
  .modal-field-wide { grid-column: 1; }
  .modal-danger-zone { align-items: stretch; flex-direction: column; }
  .modal-danger-zone button { width: 100%; }
  .page-title-actions { align-items: stretch; flex-direction: column; }
  .page-title-actions > button { width: 100%; }
  .page-action-buttons { align-items: stretch; flex-direction: column; }
  .page-action-buttons button { width: 100%; }
  .bulk-toolbar { align-items: stretch; flex-direction: column; }
  .bulk-toolbar span { margin-right: 0; }
  .bulk-toolbar select, .bulk-toolbar button { width: 100%; }
  .settings-grid { grid-template-columns: 1fr; gap: 28px; }
  .settings-card:last-child { grid-column: 1; }
}