:root {
  --bg: #08080b;
  --panel: #141419;
  --panel2: #1b1b21;
  --line: #303039;
  --pink: #ef0a91;
  --blue: #35a8ff;
  --green: #23d69b;
  --red: #ff5e78;
  --text: #f7f7fa;
  --muted: #9696a2;
  --display: "Trebuchet MS", Arial, sans-serif;
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: Arial, sans-serif;
  font-size: 14px;
}
button,
input,
select,
textarea {
  font: inherit;
}
.boot {
  min-height: 100vh;
  display: grid;
  place-items: center;
  color: var(--muted);
}
button {
  cursor: pointer;
}
.login {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1.1fr 0.65fr;
  align-items: center;
  gap: 8%;
  padding: 7%;
  background:
    radial-gradient(circle at 20% 50%, #142238, transparent 32%),
    radial-gradient(circle at 90% 10%, #ef0a9122, transparent 25%), #070709;
}
.login-copy img {
  width: 230px;
  max-height: 100px;
  object-fit: contain;
  object-position: left;
}
.eyebrow {
  font: 700 11px var(--display);
  letter-spacing: 0.2em;
  color: var(--pink);
}
.login h1 {
  font: 600 clamp(54px, 7vw, 92px)/0.93 var(--display);
  letter-spacing: -0.055em;
  margin: 22px 0;
}
.login h1 em {
  display: block;
  color: var(--pink);
  font-style: normal;
}
.login-copy p {
  max-width: 620px;
  color: #c5c5cd;
  font-size: 16px;
  line-height: 1.7;
}
.login-card {
  background: linear-gradient(150deg, #1b1b21, #101014);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 32px;
  box-shadow: 0 35px 80px #0009;
}
.login-card h2 {
  font: 600 30px var(--display);
  margin: 7px 0;
}
.login-card > p {
  color: var(--muted);
  margin: 0 0 24px;
}
.field {
  display: grid;
  gap: 7px;
  margin: 14px 0;
  color: #d5d5dc;
  font-size: 12px;
  font-weight: 700;
}
.field-label {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
  width: max-content;
  max-width: 100%;
  line-height: 1.2;
}
.field-label b {
  display: inline;
  margin: 0;
  color: var(--pink);
  line-height: inherit;
}
input,
select,
textarea {
  width: 100%;
  border: 1px solid #393942;
  border-radius: 9px;
  background: #0b0b0f;
  color: #fff;
  padding: 12px;
  outline: none;
}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--pink);
  box-shadow: 0 0 0 3px #ef0a911b;
}
.primary,
.ghost,
.danger {
  border-radius: 10px;
  padding: 11px 17px;
  border: 1px solid transparent;
  color: #fff;
  font-weight: 700;
}
.primary {
  background: linear-gradient(135deg, #ff169d, var(--pink));
  box-shadow: 0 9px 25px #ef0a9126;
}
.ghost {
  background: #1a1a20;
  border-color: #393941;
}
.danger {
  background: #ff5e7817;
  border-color: #ff5e7855;
  color: #ff8698;
}
.text-danger {
  color: #ff9cae !important;
  background: transparent !important;
  border: 0 !important;
  padding: 8px 4px !important;
  font-size: 11px !important;
  font-weight: 700;
}
.text-danger:hover { color: #fff !important; text-decoration: underline; }
.danger-notice { border-color:#ff5e7855; color:#ffc2cc; background:#ff5e780c; }
.danger-notice b,.danger-notice span,.danger-notice small { display:block; }
.danger-notice span { margin-top:4px; color:#ffd3da; }
.danger-notice small { margin-top:8px; color:#c5a0a8; line-height:1.45; }
.purge-modal { width:min(560px,100%) !important; }
.purge-modal .modal-head { padding:17px 20px; }
.purge-modal .modal-head h2 { font-size:22px; }
.purge-form { max-width:100%; padding:18px 20px; }
.purge-summary { border:1px solid #ff5e7855; border-radius:10px; background:#ff5e780c; padding:11px 13px; color:#ffd1d9; font-size:11px; }
.purge-summary b,.purge-summary span,.purge-summary small { display:block; }
.purge-summary span { margin-top:3px; }
.purge-summary small { color:#c69ba5; margin-top:6px; }
.purge-confirm { margin-top:15px; }
.purge-confirm > span { font-size:11px; color:var(--muted); }
.purge-confirm > b { color:var(--pink); letter-spacing:.07em; font-size:12px; margin:3px 0 7px; }
.full {
  width: 100%;
}
.error {
  border: 1px solid #ff5e7866;
  background: #ff5e7812;
  color: #ff94a5;
  border-radius: 9px;
  padding: 10px;
  margin: 12px 0;
  font-size: 11px;
}
.field-error { color: #ff94a5; font-size: 10px; line-height: 1.35; min-height: 14px; }
[aria-invalid="true"] { border-color: var(--pink); box-shadow: 0 0 0 3px #ef0a911b; }
.page-loading { min-height: 260px; display:grid; place-items:center; color:var(--muted); }
.retry { padding:28px; max-width:560px; }
.retry h2 { margin-top:0; }
.sale-value[hidden], .loss-reason[hidden] { display:none !important; }
.export-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; white-space:nowrap; }
.export-button span { font-size:18px; line-height:1; }
.client-toolbar { display:flex; align-items:center; gap:12px; margin:-8px 0 18px; padding:12px; }
.client-toolbar input { flex:1; min-width:190px; }
.client-toolbar select { max-width:190px; }
.client-toolbar span { color:var(--muted); white-space:nowrap; }
.admin-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:16px; }
.admin-grid .panel { display:grid; gap:12px; align-content:start; min-height:150px; }
.admin-grid h2 { margin:0; }
.admin-grid p { color:var(--muted); line-height:1.55; margin:0; }
.muted { display:block; color:var(--muted); font-size:11px; line-height:1.45; }
.empty { padding:22px; color:var(--muted); text-align:center; }
.shell {
  min-height: 100vh;
}
.top {
  height: 78px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--line);
  background: #030304;
  padding: 0 24px;
  position: sticky;
  top: 0;
  z-index: 10;
}
.top img {
  width: 155px;
  height: 66px;
  object-fit: contain;
}
.top-title {
  border-left: 1px solid var(--line);
  margin-left: 18px;
  padding-left: 18px;
}
.top-title span,
.top-title b {
  display: block;
}
.top-title span {
  font: 700 9px var(--display);
  letter-spacing: 0.17em;
  color: var(--pink);
}
.top-title b {
  font: 600 16px var(--display);
}
.top-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 14px;
}
.secure {
  font-size: 10px;
  color: var(--green);
}
.secure:before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--green);
  margin-right: 6px;
  box-shadow: 0 0 10px var(--green);
}
.layout {
  display: grid;
  grid-template-columns: 178px minmax(0, 1fr);
  min-height: calc(100vh - 78px);
}
.side {
  border-right: 1px solid var(--line);
  padding: 23px 10px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.side small {
  font: 700 9px var(--display);
  letter-spacing: 0.15em;
  color: #696974;
  padding: 0 10px 8px;
}
.nav {
  border: 0;
  background: transparent;
  color: #92929e;
  border-radius: 9px;
  padding: 11px 10px;
  text-align: left;
}
.nav.active,
.nav:hover {
  background: #1c1c22;
  color: #fff;
}
.nav.active {
  box-shadow: inset 3px 0 var(--pink);
}
.main {
  padding: 34px;
  overflow: hidden;
}
.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 24px;
}
.page-head h1 {
  font: 600 34px var(--display);
  margin: 6px 0 2px;
}
.page-head p {
  margin: 0;
  color: var(--muted);
}
.head-actions,
.filters,
.actions {
  display: flex;
  gap: 9px;
  align-items: center;
}
.head-actions label { display:flex; align-items:center; gap:7px; color:var(--muted); white-space:nowrap; }
.head-actions input, .head-actions select { min-width:130px; }
.stats {
  display: grid;
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  gap: 11px;
  margin-bottom: 18px;
}
.stat {
  display: block;
  width: 100%;
  text-align: left;
  color: inherit;
  font-family: inherit;
  border: 1px solid #303039;
  border-radius: 15px;
  background: linear-gradient(145deg, #19191f, #101014);
  padding: 16px;
  min-height: 112px;
  cursor: pointer;
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.stat:hover {
  border-color: #ef0a9180;
  transform: translateY(-2px);
}
.stat:focus-visible {
  outline: 2px solid var(--pink);
  outline-offset: 3px;
}
.stat.active {
  border-color: var(--pink);
  background: linear-gradient(145deg, #281320, #141016);
  box-shadow: 0 0 0 2px #ef0a9128, 0 12px 30px #ef0a9118;
}
.stat.active span::after {
  content: " • filtrando";
  color: var(--pink);
  font-weight: 700;
}
.stat.static {
  cursor: default;
}
.stat.static:hover {
  border-color: #303039;
  transform: none;
}
.stat span {
  display: block;
  color: #a2a2ad;
  font-size: 10px;
}
.stat b {
  display: block;
  font: 600 28px var(--display);
  color: var(--blue);
  margin-top: 6px;
}
.stat.sale b {
  color: var(--green);
}
.stat small {
  display: block;
  color: var(--green);
  font-size: 9px;
  margin-top: 4px;
}
.panel {
  border: 1px solid #2d2d35;
  background: #111115;
  border-radius: 16px;
  overflow: hidden;
}
.client-card { display:flex; align-items:center; gap:13px; padding:14px; border:1px solid var(--line); border-radius:14px; background:#17171c; }
.client-card .actions { margin-left:auto; }
.client-info { display:grid; gap:4px; min-width:0; }
.client-info span, .client-info small { color:var(--muted); font-size:11px; }
.avatar { display:grid; place-items:center; width:48px; height:48px; border:1px solid #41414a; border-radius:12px; color:var(--pink); font-weight:800; flex:0 0 auto; }
.cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:16px; }
.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid #2a2a31;
}
.panel-head h2 {
  font: 600 19px var(--display);
  margin: 0;
}
.panel-head p {
  margin: 4px 0 0;
  color: #7f7f8a;
  font-size: 10px;
}
.filters input {
  min-width: 210px;
}
.table {
  overflow: auto;
}
table {
  width: 100%;
  border-collapse: collapse;
  min-width: 900px;
}
th {
  padding: 12px 16px;
  text-align: left;
  color: #73737e;
  font: 700 9px var(--display);
  letter-spacing: 0.08em;
  background: #0d0d11;
}
td {
  padding: 14px 16px;
  border-top: 1px solid #27272e;
  color: #c3c3ca;
  font-size: 11px;
}
td b {
  display: block;
  color: #fff;
}
.pill {
  display: inline-flex;
  border: 1px solid #ef0a9155;
  color: #ff63ba;
  background: #ef0a9111;
  border-radius: 999px;
  padding: 5px 8px;
  font-size: 9px;
}
.row-action {
  border: 0;
  background: transparent;
  color: var(--pink);
  padding: 5px;
}
.row-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;white-space:nowrap}.delete-link{color:var(--red)!important;opacity:.82}.delete-link:hover{opacity:1;text-decoration:underline}.import-preview{border:1px solid var(--line);border-radius:12px;background:#0d0d11;padding:16px;color:var(--muted);margin:12px 0;max-height:52vh;overflow:auto}.status-map{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px}.status-map .field{margin:4px 0}.status-map .field span{overflow-wrap:anywhere}
.empty {
  padding: 45px;
  text-align: center;
  color: #777783;
}
.modal-bg {
  position: fixed;
  inset: 0;
  background: #000c;
  backdrop-filter: blur(7px);
  z-index: 20;
  display: grid;
  place-items: center;
  padding: 18px;
}
.modal {
  width: min(820px, 100%);
  max-height: 92vh;
  overflow: auto;
  border: 1px solid #383842;
  background: #16161b;
  border-radius: 20px;
  box-shadow: 0 32px 90px #000b;
}
.modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 21px 24px;
  border-bottom: 1px solid #303038;
}
.modal-head h2 {
  font: 600 25px var(--display);
  margin: 3px 0 0;
}
.modal-subtitle { margin: 6px 0 0; color: var(--muted); font-size: 11px; }
.modal-subtitle strong, .field b { color: var(--pink); }
.close {
  border: 0;
  background: #24242b;
  color: #fff;
  border-radius: 8px;
  width: 34px;
  height: 34px;
  font-size: 20px;
}
.form {
  padding: 22px 24px;
}
.form-section + .form-section { border-top: 1px solid #2b2b33; margin-top: 20px; padding-top: 18px; }
.form-section h3 { margin: 0 0 12px; color: #d8d8df; font: 700 11px var(--display); letter-spacing: .08em; text-transform: uppercase; }
.form-notes { margin-top: 18px; }
.check-field { margin: 20px 0 0; }
.check-field span { display: inline-flex; align-items: center; gap: 8px; }
.check-field input { width: auto; accent-color: var(--pink); }
.field-error { color: #ff9aac; font-size: 10px; font-weight: 600; margin-top: -2px; }
[aria-invalid="true"] { border-color: var(--red); box-shadow: 0 0 0 3px #ff5e7819; }
.loss-reason[hidden] { display: none; }
.grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 15px;
}
.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin-top: 12px;
}
.cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  padding: 16px;
  align-items:start;
}
.client-card {
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid #303038;
  background: #17171d;
  border-radius: 13px;
  padding: 15px;
}
.avatar {
  width: 48px;
  height: 48px;
  border: 1px solid #41414b;
  border-radius: 11px;
  background: #23232b;
  display: grid;
  place-items: center;
  color: var(--pink);
  font-weight: 800;
}
.client-info {
  flex: 1;
}
.client-info b,
.client-info span,
.client-info small {
  display: block;
}
.client-info span,
.client-info small {
  color: #858590;
  font-size: 10px;
  margin-top: 3px;
}
.option-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.option-card {
  border: 1px solid #303038;
  background: #141419;
  border-radius: 15px;
  padding: 18px;
}
.option-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.option-title h3 {
  font: 600 17px var(--display);
  margin: 0;
}
.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 15px;
}
.chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid #383842;
  background: #222228;
  border-radius: 999px;
  padding: 7px 8px 7px 11px;
  font-size: 9px;
}
.chip button {
  border: 0;
  background: #34343d;
  color: #aaaab4;
  border-radius: 50%;
  width: 19px;
  height: 19px;
}
.notice {
  border: 1px solid #35a8ff55;
  background: #35a8ff0c;
  border-radius: 12px;
  padding: 13px 15px;
  color: #b8dfff;
  font-size: 11px;
  margin-bottom: 15px;
}
@media (max-width: 1000px) {
  .main { padding: 26px 22px 90px; }
  .layout { grid-template-columns: 156px minmax(0, 1fr); }
  .top-actions { gap: 8px; }
  .top-actions .nav { padding: 9px 8px; }
  .stats {
    grid-template-columns: repeat(3, 1fr);
  }
  .page-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .head-actions {
    width: 100%;
    flex-wrap: wrap;
  }
}
@media (max-width: 720px) {
  .login {
    grid-template-columns: 1fr;
    padding: 28px 18px;
  }
  .login-copy h1 {
    font-size: 52px;
  }
  .layout {
    display: block;
  }
  .side {
    position: fixed;
    z-index: 12;
    left: 0;
    right: 0;
    bottom: 0;
    height: 64px;
    display: flex;
    flex-direction: row;
    padding: 7px 9px;
    background: #0d0d11;
    border: 1px solid #303038;
  }
  .side small {
    display: none;
  }
  .nav {
    flex: 1;
    text-align: center;
    font-size: 10px;
  }
  .main {
    padding: 24px 13px 82px;
  }
  .top {
    padding: 0 10px;
  }
  .top img {
    width: 112px;
  }
  .top-title {
    margin-left: 7px;
    padding-left: 9px;
  }
  .top-title span,
  .secure {
    display: none;
  }
  .top-title b {
    font-size: 12px;
  }
  .top-actions { gap: 3px; }
  .top-actions .nav { padding: 8px 6px; font-size: 10px; }
  .top-actions .ghost { padding: 8px 7px; font-size: 10px; }
  .stats {
    grid-template-columns: 1fr 1fr;
  }
  .filters {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr;
  }
  .filters input {
    grid-column: 1/-1;
    min-width: 0;
  }
  .grid,
  .option-grid,
  .cards {
    grid-template-columns: 1fr;
  }
  .panel-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .head-actions { gap: 7px; }
  .head-actions label { flex: 1; min-width: 130px; }
  .head-actions input { width: 100%; }
  .modal-bg { padding: 10px; align-items: end; }
  .modal { width: 100%; max-height: 94vh; border-radius: 18px 18px 12px 12px; }
  .modal-head, .form { padding-left: 17px; padding-right: 17px; }
  .modal-head h2 { font-size: 22px; }
  .modal-actions { position: sticky; bottom: -1px; background: #16161b; padding: 12px 0 1px; }
  .modal-actions button { flex: 1; }
  .admin-grid { grid-template-columns:1fr; }
  .client-toolbar { flex-direction:column; align-items:stretch; }
  .client-toolbar select { max-width:none; }
  .client-toolbar span { text-align:center; }
  .export-button { width:100%; }
}

/* Experiência móvel completa — painéis administrativo e do cliente */
@media (max-width: 720px) {
  html, body { width:100%; max-width:100%; overflow-x:hidden; font-size:14px; }
  body { -webkit-text-size-adjust:100%; }
  button, input, select, textarea { min-width:0; max-width:100%; }
  input, select, textarea { font-size:16px; }

  .top {
    position:sticky; height:auto; min-height:112px; padding:10px 14px 8px;
    display:grid; grid-template-columns:92px minmax(0,1fr); gap:5px 10px;
    align-items:center;
  }
  .top img { width:92px; height:48px; object-position:left center; }
  .top-title { margin:0; padding-left:10px; min-width:0; }
  .top-title span { display:block; font-size:7px; }
  .top-title b { font-size:13px; line-height:1.15; overflow-wrap:anywhere; }
  .top-actions {
    grid-column:1/-1; width:100%; margin:2px 0 0; gap:5px;
    display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .top-actions .secure { display:none; }
  .top-actions .nav, .top-actions .ghost {
    width:100%; min-height:34px; padding:7px 5px; border-radius:8px;
    font-size:11px; line-height:1.15; text-align:center; white-space:normal;
  }
  .top-actions .ghost:first-of-type { grid-column:auto; }

  .main { width:100%; max-width:100%; padding:20px 14px 86px; overflow:visible; }
  .page-head { gap:14px; margin-bottom:18px; }
  .page-head h1, .agency-head h1, .clients-head h1 {
    font-size:clamp(25px,8vw,32px); line-height:1.05; overflow-wrap:anywhere;
  }
  .page-head p, .agency-head p, .clients-head p { font-size:13px; line-height:1.4; }
  .eyebrow { font-size:9px; }
  .head-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; gap:9px; }
  .head-actions > select, .head-actions > .export-button, .head-actions > #new-lead,
  .head-actions > #new-client, .head-actions > #back-settings { grid-column:1/-1; width:100%; }
  .head-actions label { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); }
  .head-actions input, .head-actions select { width:100%; min-width:0; min-height:44px; }
  .head-actions button { min-height:44px; padding:10px 13px; }
  .export-button { font-size:14px; }

  .stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .stat { min-width:0; min-height:116px; padding:14px; }
  .stat span { font-size:11px; overflow-wrap:anywhere; }
  .stat b { font-size:30px; }
  .stat small { font-size:10px; line-height:1.3; overflow-wrap:anywhere; }
  .stats .stat:last-child:nth-child(odd) { grid-column:1/-1; min-height:96px; }

  .panel { max-width:100%; }
  .panel-head { padding:16px; gap:13px; }
  .panel-head h2 { font-size:19px; }
  .filters { grid-template-columns:1fr 1fr; gap:8px; }
  .filters input { grid-column:1/-1; width:100%; }
  .filters select { width:100%; min-width:0; padding:11px 9px; font-size:14px; }

  .table { overflow:visible; padding:0 12px 12px; }
  table { display:block; min-width:0; width:100%; }
  thead { display:none; }
  tbody { display:grid; gap:10px; }
  tr { display:grid; grid-template-columns:1fr 1fr; gap:9px 14px; padding:14px; border:1px solid #2d2d35; border-radius:12px; background:#16161b; }
  td { display:block; min-width:0; padding:0; border:0; font-size:12px; overflow-wrap:anywhere; }
  td::before { content:attr(data-label); display:block; margin-bottom:4px; color:#72727e; font:700 8px var(--display); letter-spacing:.08em; text-transform:uppercase; }
  td[data-label="Lead"], td[data-label="Cliente"] { grid-column:auto; }
  td.mobile-row-action { grid-column:1/-1; }
  td.mobile-row-action::before { display:none; }
  .row-action { width:100%; min-height:36px; border:1px solid #393941; border-radius:8px; background:#1a1a20; font-weight:700; }

  .clients-head .head-actions { grid-template-columns:1fr; }
  .client-toolbar { gap:10px; margin-bottom:12px; }
  .client-toolbar label { font-size:10px; }
  .client-toolbar input, .client-toolbar select { font-size:16px; }
  .cards { padding:10px; gap:10px; }
  .client-card { grid-template-columns:42px minmax(0,1fr); gap:0 11px; padding:13px; }
  .client-info > div:first-child b { font-size:16px; line-height:1.15; }
  .client-info small { overflow-wrap:anywhere; }
  .client-metrics { gap:6px 9px; }
  .client-card .actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
  .client-card .actions button:not(.text-danger) { width:100%; min-height:38px; padding:8px 5px; }
  .client-card .actions .danger { grid-column:auto; }
  .client-card .actions .text-danger { grid-column:1/-1; min-height:34px; }

  .agency-grid { gap:10px; }
  .admin-card { min-height:0 !important; padding:15px; gap:12px; }
  .admin-card h2 { font-size:20px; }
  .admin-card p { font-size:12px; overflow-wrap:anywhere; }
  .admin-card button { width:100%; min-height:42px; }
  .backup-actions { gap:8px; }
  .support .panel-head { align-items:stretch; }
  .support .head-actions { grid-template-columns:1fr; }
  .support .head-actions input, .support .head-actions button { width:100%; }

  .option-grid { gap:10px; }
  .option-card { padding:15px; }
  .option-title { align-items:flex-start; gap:10px; }
  .option-title > div { min-width:0; }
  .option-title h3 { font-size:18px; }
  .option-title small { display:block; margin-top:4px; line-height:1.35; }
  .option-title button { flex:0 0 auto; min-height:38px; padding:8px 11px; font-size:12px; }
  .chips { gap:6px; margin-top:13px; }
  .chip { max-width:100%; padding:6px 7px 6px 9px; font-size:10px; overflow-wrap:anywhere; }
  .chip button { flex:0 0 19px; }

  .side { height:66px; padding:6px; gap:4px; padding-bottom:max(6px,env(safe-area-inset-bottom)); }
  .side .nav { min-width:0; padding:8px 3px; font-size:11px; white-space:nowrap; }
  .nav.active { box-shadow:inset 3px 0 var(--pink); }

  .modal-bg { padding:8px; }
  .modal { max-height:calc(100dvh - 16px); }
  .modal-head { padding:15px 16px; }
  .form { padding:16px; }
  .grid { grid-template-columns:1fr; gap:0; }
  .modal-actions { gap:7px; }
  .modal-actions button { min-height:42px; padding:9px 10px; }
}

@media (max-width: 390px) {
  .main { padding-left:11px; padding-right:11px; }
  .top { padding-left:11px; padding-right:11px; }
  .head-actions { grid-template-columns:1fr; }
  .head-actions label { grid-template-columns:32px minmax(0,1fr); }
  .stats { grid-template-columns:1fr 1fr; }
  .client-card .actions { grid-template-columns:1fr; }
  .client-card .actions .text-danger { grid-column:1; }
  .option-title { display:grid; grid-template-columns:1fr; }
  .option-title button { width:100%; }
}
.toast {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 50;
  border: 1px solid #23d69b77;
  background: #10251f;
  color: #9dffe0;
  border-radius: 10px;
  padding: 13px 17px;
  box-shadow: 0 18px 45px #0009;
}
.toast.error { border-color: #ff5e7877; background: #2a1118; color: #ffabb8; }
.support { margin-top: 14px; }
.support a { text-decoration: none; }
.top-actions a { text-decoration: none; }
.head-actions label { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; }
.head-actions input { width: 142px; }
.head-actions input[type="date"] { cursor: pointer; min-height: 42px; }
.duplicate { color: var(--red); font-size: 10px; }
.available { color: var(--green); font-size: 10px; }
.chip input { width: auto; accent-color: var(--pink); }

/* Ajustes de leitura e proporção — central administrativa e clientes */
.login-card .full + .full { margin-top: 10px; }
.agency-head { align-items: center; margin-bottom: 16px; }
.agency-head h1 { font-size: 30px; letter-spacing: -.02em; }
.agency-head p { max-width: 530px; font-size: 13px; }
.agency-grid { grid-template-columns: repeat(2, minmax(260px, 1fr)); }
.admin-card { min-height: 176px !important; padding: 20px; display:flex !important; flex-direction:column; align-items:flex-start; }
.admin-card h2 { font: 600 22px var(--display); margin: 5px 0 7px; }
.admin-card p { font-size: 12px; max-width: 430px; }
.admin-card button { margin-top: auto; }
.backup-actions { display:flex; gap:8px; width:100%; margin-top:auto; }
.backup-actions button { flex:1; margin-top:0; }
.backup-preview { margin:14px 0; padding:12px; border:1px solid #35a8ff55; border-radius:10px; background:#35a8ff0c; color:#b8dfff; font-size:11px; line-height:1.55; }
#backup-client-field[hidden] { display:none !important; }
.restore-scope { display:grid; gap:10px; border:1px solid var(--line); border-radius:10px; margin:18px 0; padding:13px; }
.restore-scope legend { color:var(--muted); font-size:11px; padding:0 5px; }
.restore-scope label { display:flex; align-items:center; gap:8px; font-size:12px; }
.restore-scope input { width:auto; accent-color:var(--pink); }
.card-label { color: var(--pink); font: 700 9px var(--display); letter-spacing: .16em; }
.clients-head { margin-bottom: 16px; }
.clients-head h1 { font-size: 30px; }
.clients-head p { font-size: 13px; }
.client-toolbar { padding: 13px 16px; margin: 0 0 14px; display:grid; grid-template-columns:minmax(240px, 1fr) 175px auto; gap: 12px; }
.client-toolbar label { display:grid; gap:5px; color:var(--muted); font:700 9px var(--display); letter-spacing:.08em; }
.client-toolbar input,.client-toolbar select { min-height:42px; font-size:12px; }
.client-toolbar .client-search-label { min-width:0; }
.client-toolbar span { align-self:end; padding-bottom:12px; font-size:12px; }
.client-card { display:grid; grid-template-columns:48px minmax(0,1fr); align-items:start; align-content:start; height:max-content; min-height:0; padding:16px; gap:0 14px; }
.client-info { min-width:0; gap:8px; }
.client-info > div:first-child { display:grid; gap:3px; }
.client-info > div:first-child b { font:600 17px var(--display); }
.client-info > div:first-child span { font-size:11px; }
.client-info small { font-size:10px; line-height:1.45; }
.client-info small i { color:#5e5e69; font-style:normal; padding:0 3px; }
.client-metrics { display:flex; flex-wrap:wrap; align-items:center; gap:7px 12px; color:#a8a8b2; font-size:10px; }
.client-metrics b { color:#fff; font-size:12px; }
.client-state { padding:4px 8px; border-radius:99px; border:1px solid #393943; }
.client-state.active { color:#7ff4c6; border-color:#23d69b55; background:#23d69b10; }
.client-state.inactive { color:#ff9caf; border-color:#ff5e7855; background:#ff5e7810; }
.client-card .actions { grid-column:2 / -1; display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin:12px 0 0; padding-top:11px; border-top:1px solid #2b2b33; }
.client-card .actions button { min-height:36px; padding:8px 12px; font-size:12px; }
.client-card .actions .text-danger { margin-left:auto; }
.filters select { min-height:42px; border-color:#3a3a45; font-size:12px; color:#e5e5eb; }
.filters select:focus { border-color:var(--pink); box-shadow:0 0 0 2px #ef0a9116; }
.filters input { min-height:42px; font-size:12px; }

@media (max-width: 720px) {
  .agency-head h1,.clients-head h1 { font-size:26px; }
  .agency-grid { grid-template-columns:1fr; }
  .admin-card { min-height:155px !important; padding:16px; }
  .backup-actions { flex-direction:column; }
  .client-toolbar { grid-template-columns:1fr; padding:14px; }
  .client-toolbar span { align-self:start; padding:0; }
  .client-card { display:grid; grid-template-columns:42px minmax(0,1fr); padding:15px; }
  .client-card .avatar { width:42px; height:42px; }
  .client-card .actions { grid-column:1 / -1; width:100%; }
  .client-card .actions button:not(.text-danger) { flex:1; }
  .client-card .actions .text-danger { width:100%; margin:0; text-align:center; }
}

/* Camada final: mantém a versão móvel acima das regras legadas */
@media (max-width: 720px) {
  .login { min-height:100dvh; display:block; padding:20px 16px 28px; }
  .login-copy { max-width:520px; margin:0 auto 18px; }
  .login-copy img { width:150px; max-height:65px; }
  .login .eyebrow { margin-top:12px; }
  .login h1 { font-size:clamp(36px,11vw,48px); line-height:.96; margin:12px 0; }
  .login-copy p { font-size:14px; line-height:1.45; margin:0; }
  .login-card { max-width:520px; margin:0 auto; padding:20px 18px; border-radius:17px; }
  .login-card h2 { font-size:24px; }
  .login-card > p { margin-bottom:15px; font-size:13px; }
  .login-card .field { margin:11px 0; }
  .login-card button { min-height:44px; }

  .top { height:auto; min-height:112px; padding:10px 14px 8px; display:grid; grid-template-columns:92px minmax(0,1fr); gap:5px 10px; }
  .top img { width:92px; height:48px; }
  .top-title { margin:0; padding-left:10px; }
  .top-title span { display:block; font-size:7px; }
  .top-title b { font-size:13px; line-height:1.15; }
  .top-actions { grid-column:1/-1; width:100%; margin:2px 0 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
  .top-actions .nav,.top-actions .ghost { width:100%; min-height:34px; padding:7px 5px; font-size:11px; line-height:1.15; text-align:center; }

  .main { width:100%; max-width:100%; padding:20px 14px 86px; overflow:visible; }
  .page-head h1,.agency-head h1,.clients-head h1 { font-size:clamp(25px,8vw,32px); line-height:1.05; }
  .head-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; gap:9px; }
  .head-actions label { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px; }
  .head-actions input { width:100%; min-width:0; }
  .head-actions > select,.head-actions > .export-button,.head-actions > #new-lead,.head-actions > #new-client,.head-actions > #back-settings { grid-column:1/-1; width:100%; }

  .agency-grid { grid-template-columns:1fr; gap:10px; }
  .admin-card { min-height:0 !important; padding:15px; }
  .backup-actions { flex-direction:column; }
  .support .head-actions { grid-template-columns:1fr; }

  .client-toolbar { display:grid; grid-template-columns:1fr; padding:14px; }
  .client-toolbar input,.client-toolbar select { font-size:16px; }
  .client-toolbar span { align-self:start; padding:0; }
  .client-card { display:grid; grid-template-columns:42px minmax(0,1fr); padding:13px; }
  .client-card .actions { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .client-card .actions button:not(.text-danger) { width:100%; }
  .client-card .actions .text-danger { grid-column:1/-1; width:100%; margin:0; }

  .option-grid { grid-template-columns:1fr; }
  .filters { display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .filters input { grid-column:1/-1; min-width:0; }
}

@media (max-width:390px) {
  .head-actions { grid-template-columns:1fr; }
  .client-card .actions { grid-template-columns:1fr; }
  .client-card .actions .text-danger { grid-column:1; }
}

/* Calibração móvel 2 — mais largura útil e menos altura */
@media (max-width:720px) {
  .top {
    min-height:100px; padding:9px 13px 7px;
    grid-template-columns:122px minmax(0,1fr); gap:3px 10px;
  }
  .top img { width:122px; height:59px; }
  .top-title { padding-left:11px; }
  .top-title span { font-size:8px; letter-spacing:.14em; }
  .top-title b { font-size:15px; line-height:1.12; }
  .top-actions {
    display:flex; justify-content:flex-end; align-items:center;
    width:100%; gap:5px; margin:0;
  }
  .top-actions .nav,.top-actions .ghost {
    width:auto; flex:0 1 auto; min-width:76px; min-height:29px;
    padding:5px 9px; font-size:10px; border-radius:7px;
  }
  .top-actions .ghost { min-width:105px; }

  .main { padding:16px 12px 80px; }
  .page-head { gap:11px; margin-bottom:14px; }
  .page-head h1,.agency-head h1,.clients-head h1 {
    font-size:26px; line-height:1.06; margin:4px 0 2px;
  }
  .page-head p,.agency-head p,.clients-head p { font-size:11px; line-height:1.35; }
  .eyebrow { font-size:8px; letter-spacing:.17em; }

  .head-actions { gap:6px; }
  .head-actions > select { min-height:39px; padding:8px 10px; font-size:14px; }
  .head-actions label { font-size:9px; gap:4px; }
  .head-actions input[type="date"] { min-height:39px; height:39px; padding:6px 8px; }
  .head-actions button,.export-button { min-height:39px; padding:8px 11px; font-size:12px; }
  .export-button span { font-size:15px; }

  .stats { gap:7px; margin-bottom:13px; }
  .stat { min-height:93px; padding:12px; border-radius:12px; }
  .stat span { font-size:10px; }
  .stat b { font-size:26px; margin-top:4px; }
  .stat small { font-size:9px; margin-top:2px; }
  .stats .stat:last-child:nth-child(odd) { min-height:78px; }

  .clients-head { margin-bottom:12px; }
  .clients-head .head-actions { display:flex; width:auto; align-self:flex-start; }
  .clients-head .head-actions > #new-client { width:auto; min-width:150px; min-height:40px; padding:8px 15px; }
  .clients-head .head-actions > #back-settings { width:auto; min-height:38px; }

  .client-toolbar {
    grid-template-columns:minmax(0,1.65fr) minmax(105px,.75fr);
    gap:7px; padding:9px; margin-bottom:9px; border-radius:12px;
  }
  .client-toolbar label { gap:3px; font-size:8px; letter-spacing:.05em; }
  .client-toolbar input,.client-toolbar select {
    min-height:39px; height:39px; padding:7px 9px; font-size:14px;
  }
  .client-toolbar #client-count {
    grid-column:1/-1; justify-self:end; font-size:10px; line-height:1;
  }

  .cards { padding:7px; gap:7px; }
  .client-card {
    grid-template-columns:38px minmax(0,1fr); gap:0 9px;
    padding:11px; border-radius:11px;
  }
  .client-card .avatar { width:38px; height:38px; border-radius:9px; font-size:12px; }
  .client-info { gap:5px; }
  .client-info > div:first-child { grid-template-columns:minmax(0,1fr) auto; align-items:baseline; gap:6px; }
  .client-info > div:first-child b { font-size:15px; line-height:1.12; }
  .client-info > div:first-child span { margin:0; font-size:9px; text-align:right; }
  .client-metrics { display:grid; grid-template-columns:auto minmax(0,1fr); gap:5px 8px; font-size:9px; }
  .client-metrics b { display:inline; font-size:10px; }
  .client-state { padding:3px 6px; white-space:nowrap; }
  .client-info small {
    margin:0; font-size:9px; line-height:1.25;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  .client-card .actions {
    grid-column:1/-1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
    gap:5px; margin-top:8px; padding-top:8px;
  }
  .client-card .actions button:not(.text-danger),
  .client-card .actions .text-danger {
    grid-column:auto; width:100%; min-height:32px; height:32px;
    padding:5px 3px !important; margin:0; border-radius:7px;
    font-size:9px !important; line-height:1; text-align:center;
  }
  .client-card .actions .text-danger {
    border:1px solid #ff5e7838 !important; color:#ff91a3 !important;
  }

  .side { height:61px; }
  .side .nav { padding:6px 3px; font-size:10px; }
}

@media (max-width:360px) {
  .top { grid-template-columns:108px minmax(0,1fr); }
  .top img { width:108px; }
  .top-title b { font-size:14px; }
  .top-actions .nav,.top-actions .ghost { min-width:0; padding-left:7px; padding-right:7px; }
  .client-toolbar { grid-template-columns:1fr; }
  .client-toolbar #client-count { grid-column:1; }
  .client-card .actions { grid-template-columns:1fr 1fr; }
}

/* Calibração móvel 3 — marca maior, títulos e período menores */
@media (max-width:720px) {
  .top {
    min-height:112px; padding:8px 12px 7px;
    grid-template-columns:180px minmax(0,1fr); gap:2px 9px;
  }
  .top img { width:180px; height:70px; }
  .top-title { padding-left:10px; }
  .top-title span { font-size:8px; line-height:1.15; }
  .top-title b { font-size:19px; line-height:1.06; }
  .top-actions { margin-top:-2px; }

  .page-head h1,.agency-head h1,.clients-head h1 {
    font-size:19px; line-height:1.12; margin:3px 0 2px;
  }
  .page-head p,.agency-head p,.clients-head p {
    font-size:9px; line-height:1.3;
  }
  .eyebrow { font-size:7px; }
  .page-head { gap:8px; margin-bottom:11px; }

  .head-actions { gap:5px; }
  .head-actions > select {
    min-height:33px; height:33px; padding:5px 9px; font-size:12px;
  }
  .head-actions label {
    grid-template-columns:22px minmax(0,1fr); gap:3px; font-size:8px;
  }
  .head-actions input[type="date"] {
    min-height:32px; height:32px; padding:3px 6px; font-size:12px;
    border-radius:7px;
  }
  .head-actions button,.export-button {
    min-height:33px; height:33px; padding:5px 9px; font-size:11px;
    border-radius:7px;
  }
  .export-button span { font-size:13px; }
}

@media (max-width:390px) {
  .top { grid-template-columns:165px minmax(0,1fr); }
  .top img { width:165px; height:66px; }
  .top-title b { font-size:18px; }
}

@media (max-width:350px) {
  .top { grid-template-columns:148px minmax(0,1fr); }
  .top img { width:148px; height:62px; }
  .top-title b { font-size:16px; }
}

/* Correção estrutural móvel — aplicada a todas as telas */
@media (max-width:720px) {
  html,body,.shell,.layout,.main { width:100%; max-width:100%; overflow-x:hidden; }

  .top {
    min-height:88px; height:auto; padding:7px 11px;
    grid-template-columns:145px minmax(0,1fr);
    grid-template-rows:auto auto; gap:1px 9px;
  }
  .top img {
    grid-column:1; grid-row:1/3;
    width:145px; height:70px; align-self:center;
  }
  .top-title {
    grid-column:2; grid-row:1; align-self:end;
    min-width:0; margin:0; padding-left:9px;
  }
  .top-title span { font-size:7px; letter-spacing:.12em; }
  .top-title b { font-size:16px; line-height:1.06; overflow-wrap:anywhere; }
  .top-actions {
    grid-column:2; grid-row:2; align-self:start;
    width:100%; min-width:0; display:flex; justify-content:flex-start;
    gap:3px; margin:1px 0 0;
  }
  .top-actions .nav,.top-actions .ghost {
    width:auto; min-width:0; min-height:24px; height:24px;
    padding:3px 6px; border-radius:6px; font-size:8px; line-height:1;
    white-space:nowrap;
  }
  .top-actions .ghost { min-width:0; }

  .main { padding:14px 11px 76px; }
  .page-head { width:100%; min-width:0; gap:7px; margin-bottom:10px; }
  .page-head > div { min-width:0; }
  .page-head h1,.agency-head h1,.clients-head h1 {
    max-width:100%; font-size:18px; line-height:1.12;
    margin:2px 0; overflow-wrap:anywhere;
  }
  .page-head p,.agency-head p,.clients-head p {
    max-width:100%; font-size:9px; line-height:1.25; overflow-wrap:anywhere;
  }
  .eyebrow { font-size:7px; }

  .head-actions {
    display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    width:100%; max-width:100%; min-width:0; gap:5px;
  }
  .head-actions > * { min-width:0; max-width:100%; }
  .head-actions > select {
    grid-column:1/-1; width:100%; min-width:0;
    height:31px; min-height:31px; padding:4px 8px;
    border-radius:7px; font-size:11px;
  }
  .head-actions label {
    display:grid; grid-template-columns:1fr; align-items:start;
    min-width:0; width:100%; gap:2px; font-size:7px; line-height:1;
  }
  .head-actions label input[type="date"] {
    width:100%; min-width:0; max-width:100%;
    height:30px; min-height:30px; padding:2px 5px;
    border-radius:7px; font-size:11px;
  }
  .head-actions .export-button,.head-actions > #new-lead {
    grid-column:1/-1; width:100%; height:31px; min-height:31px;
    padding:4px 8px; font-size:10px; border-radius:7px;
  }
  .export-button span { font-size:12px; }

  .stats { width:100%; max-width:100%; }
  .stat { min-width:0; }
  .panel,.filters,.table { width:100%; max-width:100%; min-width:0; }
  .filters > * { min-width:0; max-width:100%; }

  .clients-head .head-actions { width:auto; max-width:100%; }
  .clients-head .head-actions > #new-client,.clients-head .head-actions > #back-settings {
    grid-column:auto; width:auto;
  }
}

@media (max-width:380px) {
  .top { grid-template-columns:132px minmax(0,1fr); }
  .top img { width:132px; height:65px; }
  .top-title b { font-size:15px; }
  .top-actions .nav,.top-actions .ghost { padding-left:4px; padding-right:4px; font-size:7px; }
}
