:root {
  --bg: #ffffff;
  --surface: #ffffff;
  --soft: #F6F4FB;
  --ink: #101a2e;
  --muted: #5a6478;
  --line: #e2e6ee;
  --accent: #3B1C8C;
  --accent-hover: #4C1D95;
  --accent-ink: #ffffff;
  --accent-soft: #F1ECFD;
  --accent-line: #DCD0F7;
  --primary-bg: #3B1C8C;
  --primary-hover: #4C1D95;
  --field: #ffffff;
  --line-strong: #bcc5d6;
  --high: #a4261b;
  --high-soft: #fdecea;
  --high-line: #f2cdc8;
  --mid: #8a5a00;
  --mid-soft: #fdf4df;
  --mid-ink: #6b4600;
  --mid-line: #efdfb5;
  --topbar-bg: rgb(255 255 255 / .92);
  --shadow: rgb(16 26 46 / .04);
  /* Cores dos gráficos: paleta categórica validada para daltonismo, nesta ordem. */
  --s1: #2a78d6; --s2: #eb6834; --s3: #1baf7a; --s4: #eda100; --s5: #e87ba4; --s6: #008300; --s7: #6250d6; --s8: #e34948;
  --radius: 12px;
  color-scheme: light;
}
/* Tema escuro: escolhido pelo usuário, ou automático conforme o sistema. */
:root[data-theme="dark"] {
  --bg: #110B1F;
  --surface: #1A1430;
  --soft: #231A3B;
  --field: #150F28;
  --ink: #e8ecf4;
  --muted: #9aa4b8;
  --line: #30264B;
  --line-strong: #45395F;
  --accent: #C4B5FD;
  --accent-hover: #DDD6FE;
  --accent-ink: #ffffff;
  --accent-soft: #2A1F4A;
  --accent-line: #3D2E6B;
  --primary-bg: #7C3AED;
  --primary-hover: #8B5CF6;
  --high: #ff8a80;
  --high-soft: #3a1d1d;
  --high-line: #5a2a2a;
  --mid: #f5c26b;
  --mid-soft: #33290f;
  --mid-ink: #f5c26b;
  --mid-line: #5a4718;
  --topbar-bg: rgb(26 20 48 / .92);
  --shadow: rgb(0 0 0 / .3);
  --s1: #3987e5; --s2: #d95926; --s3: #199e70; --s4: #c98500; --s5: #d55181; --s6: #008300; --s7: #9085e9; --s8: #e66767;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  --bg: #110B1F;
  --surface: #1A1430;
  --soft: #231A3B;
  --field: #150F28;
  --ink: #e8ecf4;
  --muted: #9aa4b8;
  --line: #30264B;
  --line-strong: #45395F;
  --accent: #C4B5FD;
  --accent-hover: #DDD6FE;
  --accent-ink: #ffffff;
  --accent-soft: #2A1F4A;
  --accent-line: #3D2E6B;
  --primary-bg: #7C3AED;
  --primary-hover: #8B5CF6;
  --high: #ff8a80;
  --high-soft: #3a1d1d;
  --high-line: #5a2a2a;
  --mid: #f5c26b;
  --mid-soft: #33290f;
  --mid-ink: #f5c26b;
  --mid-line: #5a4718;
  --topbar-bg: rgb(26 20 48 / .92);
  --shadow: rgb(0 0 0 / .3);
  --s1: #3987e5; --s2: #d95926; --s3: #199e70; --s4: #c98500; --s5: #d55181; --s6: #008300; --s7: #9085e9; --s8: #e66767;
  color-scheme: dark;
  }
}
:root[data-theme="dark"] .sidebar-logo img, :root[data-theme="dark"] .login-brand img, :root[data-theme="dark"] .topbar-logo { background: #fff; border-radius: 10px; padding: 6px 8px; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .sidebar-logo img, :root:not([data-theme="light"]) .login-brand img, :root:not([data-theme="light"]) .topbar-logo { background: #fff; border-radius: 10px; padding: 6px 8px; }
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--ink); font: 15px/1.5 "Segoe UI", system-ui, -apple-system, Roboto, sans-serif; }
h1 { font-size: 24px; line-height: 1.25; margin: 0; letter-spacing: -.01em; font-weight: 650; }
h2 { font-size: 16px; margin: 0 0 12px; font-weight: 650; }
h3 { font-size: 14px; margin: 0 0 8px; }
p { margin: 0 0 8px; }
a { color: var(--accent); }
[hidden] { display: none !important; }
.muted { color: var(--muted); }
.small { font-size: 13px; }
.section-title { font-size: 18px; margin: 28px 0 12px; }

/* Estrutura: menu lateral */
.layout { display: grid; grid-template-columns: 252px minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 20px 14px 16px; background: var(--surface); border-right: 1px solid var(--line); }
.sidebar-logo { display: block; padding: 4px 8px 14px; }
.sidebar-logo img { display: block; width: 150px; height: auto; }
.menu { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.menu-section { margin-top: 10px; }
.menu-group { width: 100%; display: flex; justify-content: space-between; align-items: center; border: 0; background: none; padding: 8px 10px; font-size: 14px; font-weight: 700; color: var(--ink); }
.menu-group:hover { color: var(--accent); border: 0; }
.menu-group .chev { transition: transform .15s ease; }
.menu-group[aria-expanded="false"] .chev { transform: rotate(-90deg); }
.menu-items { display: flex; flex-direction: column; gap: 2px; }
.menu-item { display: flex; justify-content: space-between; align-items: center; gap: 8px; width: 100%; text-align: left; border: 0; border-radius: 8px; background: none; padding: 7px 10px 7px 18px; color: var(--ink); text-decoration: none; font-size: 14px; font-weight: 400; white-space: normal; }
.menu-item.top { font-weight: 700; padding-left: 10px; }
.menu-item:hover { background: var(--soft); color: var(--accent); border: 0; }
.menu-item.active { background: var(--accent-soft); color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); }
button.menu-item { color: var(--accent); }
.menu-count { min-width: 22px; height: 20px; padding: 0 6px; border-radius: 99px; background: var(--soft); color: var(--muted); font-size: 11px; font-weight: 700; display: inline-grid; place-items: center; }
.menu-count.warn { background: #ff8c00; color: #fff; }
.sidebar-user { border-top: 1px solid var(--line); padding: 12px 8px 0; display: flex; flex-direction: column; gap: 8px; font-size: 14px; }
.theme-switch { display: flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.theme-switch button { flex: 1; border: 0; border-radius: 0; padding: 6px 4px; font-size: 12px; background: var(--surface); color: var(--muted); }
.theme-switch button + button { border-left: 1px solid var(--line); }
.theme-switch button[aria-pressed="true"] { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.content { min-width: 0; display: flex; flex-direction: column; }
.topbar { display: flex; align-items: center; gap: 12px; padding: 10px 24px; min-height: 56px; background: var(--topbar-bg); backdrop-filter: blur(6px); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.topbar-actions { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.menu-toggle, .topbar-logo { display: none; }
.menu-backdrop { display: none; }
.brand { font-weight: 800; letter-spacing: .06em; color: var(--accent); text-decoration: none; font-size: 16px; white-space: nowrap; }
.brand span { font-weight: 400; }
.login-brand { display: block; }
.login-brand img { display: block; width: 180px; height: auto; margin: 0 auto 4px; }

main { width: 100%; padding: 28px 32px 48px; }
.page-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; margin-bottom: 16px; box-shadow: 0 1px 2px var(--shadow); }
.row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.row.nowrap { flex-wrap: nowrap; }
.spread { justify-content: space-between; }
.stack > * + * { margin-top: 12px; }
.grow-input { flex: 1; min-width: 200px; }
.form-actions { margin-top: 12px; }

button, .btn { font: inherit; font-size: 14px; font-weight: 500; padding: 8px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); cursor: pointer; text-decoration: none; display: inline-block; white-space: nowrap; }
button:hover, .btn:hover { border-color: var(--accent); color: var(--accent); }
button.primary, .btn.primary { background: var(--primary-bg); border-color: var(--primary-bg); color: var(--accent-ink); }
button.primary:hover, .btn.primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); color: var(--accent-ink); }
button.danger { color: var(--high); }
button.danger:hover { border-color: var(--high); color: var(--high); }
button:disabled { opacity: .5; cursor: default; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.field { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 550; min-width: 0; }
.field .hint { font-weight: 400; color: var(--muted); }
label.check { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-size: 14px; }
label.check input { width: auto; }
input, select, textarea { font: inherit; font-weight: 400; width: 100%; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--field); color: var(--ink); }
input:disabled, select:disabled, textarea:disabled, textarea:read-only { background: var(--soft); color: var(--muted); }
textarea { resize: vertical; min-height: 72px; }
.grid { display: grid; gap: 12px; grid-template-columns: repeat(12, minmax(0, 1fr)); }
.c2 { grid-column: span 2; } .c3 { grid-column: span 3; } .c4 { grid-column: span 4; } .c5 { grid-column: span 5; }
.c6 { grid-column: span 6; } .c8 { grid-column: span 8; } .c9 { grid-column: span 9; } .c12 { grid-column: span 12; }

table { width: 100%; border-collapse: collapse; }
th { text-align: left; font-size: 12px; font-weight: 600; color: var(--muted); padding: 8px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
td { padding: 11px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
tr:last-child td { border-bottom: 0; }
tr.click { cursor: pointer; }
tr.click:hover td { background: var(--soft); }
tr.me td { background: var(--accent-soft); }
.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.table-wrap { overflow-x: auto; }

.badge { display: inline-block; padding: 1px 9px; border-radius: 99px; font-size: 12px; background: var(--soft); border: 1px solid var(--line); white-space: nowrap; }
.badge.ok { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent); }
.badge.high { background: var(--high-soft); border-color: var(--high-line); color: var(--high); }
.badge.mid { background: var(--mid-soft); border-color: var(--mid-line); color: var(--mid); }

/* Painel */
.filters { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; padding: 14px 16px; background: var(--soft); border-radius: var(--radius); margin-bottom: 16px; }
.filters label.field { flex: 1 1 140px; max-width: 220px; }
.stats { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); margin-bottom: 16px; }
.stat { border: 1px solid var(--line); border-top: 4px solid var(--tile, var(--s1)); border-radius: 2px; padding: 14px 18px 16px; background: var(--surface); box-shadow: 0 1px 2px var(--shadow); min-width: 0; }
.stats .stat:nth-child(4n+1) { --tile: var(--s1); }
.stats .stat:nth-child(4n+2) { --tile: var(--s2); }
.stats .stat:nth-child(4n+3) { --tile: var(--s3); }
.stats .stat:nth-child(4n+4) { --tile: var(--s7); }
.stat-label { font-size: 13px; color: var(--muted); }
.stat-value { font-size: 24px; font-weight: 650; letter-spacing: -.01em; color: var(--ink); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.chart-row { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }
.chart { container-type: inline-size; border-radius: 2px; }
.stats ~ .card, .chart-row .card { border-radius: 2px; }
.page-title-xl { font-size: 30px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.welcome { border-left: 4px solid var(--accent); background: var(--accent-soft); border-color: var(--accent-line); border-left-color: var(--accent); }
.welcome-hello { margin: 0 0 8px; font-size: 22px; font-weight: 700; color: var(--ink); }
.welcome-topo { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.welcome-topo .welcome-hello { margin-bottom: 8px; }
.welcome-opcao { display: inline-flex; align-items: center; gap: 6px; }
.welcome-opcao select { font-size: 13px; padding: 4px 8px; width: auto; }
.welcome-verse { margin: 0; }
.welcome-verse p { margin: 0; font-style: italic; color: var(--ink); line-height: 1.5; }
.welcome-verse cite { display: block; margin-top: 4px; font-size: 13px; font-style: normal; font-weight: 600; color: var(--muted); }
.menu-item.top { font-size: 15px; }
.goal-pair { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.goal-form { border-top: 1px solid var(--line); padding-top: 12px; }
a.person-link { color: inherit; text-decoration: none; border-bottom: 1px dashed var(--muted); }
a.person-link:hover { color: var(--accent); border-bottom-color: var(--accent); }
.funnel-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; }
.funnel-step { display: flex; flex-direction: column; gap: 2px; padding: 12px; border: 1px solid var(--line); border-top: 4px solid var(--stage); border-radius: 2px; color: var(--ink); text-decoration: none; background: var(--surface); }
.funnel-step:hover { border-color: var(--stage); }
.funnel-num { font-size: 24px; font-weight: 700; }
.plot { position: relative; height: 220px; margin: 8px 0 12px; }
/* Gráfico estreito: mostra um mês sim, outro não, para os rótulos não se encostarem. */
@container (max-width: 640px) { .col:nth-child(even) .col-label { visibility: hidden; } }
.grid-line { position: absolute; left: 64px; right: 0; height: 1px; background: var(--line); }
.grid-line span { position: absolute; right: calc(100% + 8px); top: -9px; font-size: 12px; color: var(--muted); white-space: nowrap; }
.columns { position: absolute; left: 64px; right: 0; top: 0; bottom: 0; display: flex; gap: 2px; }
.col { flex: 1 1 0; min-width: 0; height: 100%; padding: 0 0 24px; border: 0; border-radius: 0; background: none; position: relative; display: flex; align-items: flex-end; justify-content: center; }
.col:hover { background: var(--soft); }
.bar { display: block; width: 100%; max-width: 24px; background: var(--bar, var(--s1)); border-radius: 4px 4px 0 0; }
.col:hover .bar { filter: brightness(1.12); }
.bar.picked { outline: 2px solid var(--ink); outline-offset: 2px; }
.col-label { position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%); font-size: 11px; font-weight: 400; color: var(--muted); white-space: nowrap; }
.chart-tip { position: absolute; top: 0; transform: translateX(-50%); background: var(--ink); color: var(--bg); font-size: 12px; padding: 4px 8px; border-radius: 6px; white-space: nowrap; pointer-events: none; z-index: 5; }
.rank-cell { min-width: 200px; }
.rank-track { height: 6px; background: var(--soft); border-radius: 3px; margin-top: 4px; }
.rank-fill { display: block; height: 6px; background: var(--who, var(--s1)); border-radius: 3px; }
.who-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--who, var(--s1)); margin-right: 8px; vertical-align: 0; }
.chart h2 .swatch { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 8px; vertical-align: -1px; }
details summary { cursor: pointer; color: var(--muted); }

/* Metas: termômetro */
.goal { padding: 10px 0; }
.goal + .goal { border-top: 1px solid var(--line); }
.goal.big { padding: 4px 0 18px; }
.goal.me .goal-name { font-weight: 700; }
.goal-head { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: baseline; margin-bottom: 6px; font-size: 14px; }
.goal.big .goal-head { font-size: 16px; }
.goal-name { font-weight: 550; }
.goal-nums { color: var(--muted); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.goal-nums strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.goal-track { position: relative; height: 12px; background: var(--soft); border-radius: 6px; overflow: hidden; }
.goal.big .goal-track { height: 20px; border-radius: 10px; }
.goal-fill { display: block; height: 100%; background: var(--goal-bad); border-radius: inherit; transition: width .4s ease; }
.goal-fill.goal-warn { background: var(--goal-warn); }
.goal-fill.goal-good { background: var(--goal-good); }
.goal-flag { font-size: 12px; font-weight: 600; padding: 1px 8px; border-radius: 99px; border: 1px solid var(--line); }
.goal-flag-bad { color: var(--high); background: var(--high-soft); border-color: var(--high-line); }
.goal-flag-warn { color: var(--mid-ink); background: var(--mid-soft); border-color: var(--mid-line); }
.goal-flag-good { color: #0a7a0a; background: #e7f6e7; border-color: #bfe5bf; }
:root { --goal-bad: #d03b3b; --goal-warn: #fab219; --goal-good: #0ca30c; }
:root[data-theme="dark"] .goal-flag-good { color: #6fdc6f; background: #12301a; border-color: #1f4d29; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .goal-flag-good { color: #6fdc6f; background: #12301a; border-color: #1f4d29; } }
.goal-list { border-top: 1px solid var(--line); padding-top: 4px; }
.goal-input { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 14px; }
.goal-input input { width: 110px; }
dialog.wide { width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 48px); }

/* Etapas da venda */
.workflow { padding: 16px 20px; }
.stepper { display: flex; list-style: none; margin: 0 0 12px; padding: 0; gap: 4px; overflow-x: auto; }
.stepper li { flex: 1 1 0; min-width: 96px; display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; text-align: center; }
.stepper li::before { content: ""; position: absolute; top: 13px; left: calc(-50% + 16px); right: calc(50% + 16px); height: 2px; background: var(--line); }
.stepper li:first-child::before { display: none; }
.stepper li.done::before, .stepper li.current::before { background: var(--accent); }
.stepper .dot { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: var(--soft); color: var(--muted); border: 2px solid var(--line); position: relative; z-index: 1; }
.stepper li.done .dot { background: var(--primary-bg); color: #fff; border-color: var(--primary-bg); }
.stepper li.current .dot { background: var(--surface); color: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.stepper .label { font-size: 12px; color: var(--muted); line-height: 1.3; }
.stepper li.current .label { color: var(--accent); font-weight: 650; }
.stepper.cancelled { opacity: .45; }
.dropzones.single { grid-template-columns: minmax(0, 1fr); }
.signed-zone { border-color: var(--accent); background: var(--accent-soft); }
.filters .field.grow { flex: 3 1 260px; max-width: none; }
.deal-table .deal-main { min-width: 220px; }
@media (max-width: 900px) {
  .deal-table thead { display: none; }
  .deal-table, .deal-table tbody { display: block; }
  .deal-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; padding: 14px 4px; border-bottom: 1px solid var(--line); }
  .deal-table td { border: 0; padding: 0; text-align: left; white-space: normal; }
  .deal-table td.deal-main { grid-column: 1 / -1; }
  .deal-table td[data-label]::before { content: attr(data-label); display: block; font-size: 12px; color: var(--muted); margin-bottom: 2px; }
}

/* Avisos */
.bell { position: relative; display: inline-flex; align-items: center; gap: 6px; }
.bell svg { flex: none; }
.clear-filters { align-self: flex-end; background: none; border-style: dashed; color: var(--muted); }
.clear-filters:hover { color: var(--accent); border-style: solid; }
.kprop { color: var(--ink); }
.interest-list { display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.interest { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border: 1px solid var(--line); border-left: 3px solid var(--s2); border-radius: 2px; background: var(--surface); }
.badge.chip { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent); }
.bell-count { background: var(--high); color: #fff; border-radius: 99px; font-size: 11px; font-weight: 700; min-width: 18px; height: 18px; padding: 0 5px; display: inline-grid; place-items: center; }
.notice-list { display: flex; flex-direction: column; gap: 6px; max-height: 60vh; overflow-y: auto; }
.notice { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; white-space: normal; width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
.notice.unread { border-color: var(--accent); background: var(--accent-soft); font-weight: 550; }

.loft-sync { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 12px; border-radius: 8px; font-size: 14px; margin-top: 8px; }
.loft-sync.ok { background: var(--accent-soft); color: var(--accent); }
.loft-sync.warn { background: var(--mid-soft); color: var(--mid-ink); }
.sign-list { margin: 0; padding-left: 18px; font-size: 14px; }
.sign-list li { margin: 4px 0; }

/* Funil de clientes */
.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 12px; align-items: start; }
.kcol { background: var(--soft); border-radius: var(--radius); border-top: 4px solid var(--stage); display: flex; flex-direction: column; max-height: calc(100vh - 260px); min-height: 200px; }
.kcol.over { outline: 2px dashed var(--stage); outline-offset: -2px; }
.kcol-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px; font-size: 14px; }
.kcol-head .menu-count { margin-left: auto; }
.kdot { width: 10px; height: 10px; border-radius: 50%; background: var(--stage); }
.kcol-body { display: flex; flex-direction: column; gap: 8px; padding: 0 10px 12px; overflow-y: auto; }
.kcard { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left; white-space: normal; width: 100%; padding: 10px 12px; border: 1px solid var(--line); border-left: 3px solid var(--stage); border-radius: 8px; background: var(--surface); color: var(--ink); cursor: grab; box-shadow: 0 1px 2px var(--shadow); }
.kcard:hover { border-color: var(--stage); color: var(--ink); }
.kcard.dragging { opacity: .5; }
.kempty { text-align: center; padding: 16px 0; }
.assign-row { margin-top: 8px; }
.assign-row select { width: auto; min-width: 200px; }
.client-dialog { width: min(760px, calc(100vw - 32px)); }
.timeline { display: flex; flex-direction: column; gap: 8px; max-height: 320px; overflow-y: auto; }
.tl-item { border-left: 3px solid var(--line); padding: 4px 0 4px 10px; font-size: 14px; white-space: pre-wrap; }
.tl-item.tl-etapa, .tl-item.tl-sistema { border-left-color: var(--accent-line); color: var(--muted); }
.tl-item.tl-ligacao, .tl-item.tl-whatsapp, .tl-item.tl-visita, .tl-item.tl-proposta, .tl-item.tl-email, .tl-item.tl-nota { border-left-color: var(--s1); }

/* Equipe da venda */
.team { display: flex; flex-direction: column; gap: 6px; min-width: 320px; }
.team-line { display: grid; grid-template-columns: minmax(140px, 1fr) auto auto auto; gap: 8px; align-items: center; font-size: 13px; }
button.link { border: 0; background: none; padding: 0; color: var(--accent); text-decoration: underline; font-size: 13px; }
.readonly-value { display: block; padding: 8px 10px; border: 1px dashed var(--line); border-radius: 8px; background: var(--soft); font-weight: 600; color: var(--accent); }
.rest-row { margin-top: 4px; }

/* Negociação */
.editor { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--line); margin-bottom: 16px; overflow-x: auto; }
.tabs button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; padding: 9px 12px; white-space: nowrap; color: var(--muted); }
.tabs button:hover { color: var(--accent); }
.tabs button.active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 600; }
.side { position: sticky; top: 72px; max-height: calc(100vh - 88px); overflow-y: auto; display: flex; flex-direction: column; gap: 0; }
.alerts { max-height: 45vh; overflow-y: auto; }
.history-card input { margin-bottom: 8px; }
.hist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.hist-item { position: relative; padding: 6px 0 6px 16px; border-left: 2px solid var(--line); font-size: 13px; line-height: 1.35; }
.hist-item::before { content: ""; position: absolute; left: -5px; top: 11px; width: 8px; height: 8px; border-radius: 50%; background: var(--line-strong); }
.hist-item.key::before { background: var(--accent); }
.hist-item.key strong { color: var(--accent); }
.alert { display: block; width: 100%; text-align: left; white-space: normal; padding: 8px 10px; margin-bottom: 6px; border-radius: 8px; font-size: 13px; line-height: 1.4; border: 0; }
.alert.alta { background: var(--high-soft); color: var(--high); }
.alert.media { background: var(--mid-soft); color: var(--mid-ink); }
.alert.alta:hover { color: var(--high); filter: brightness(.97); }
.alert.media:hover { color: var(--mid-ink); filter: brightness(.97); }

.person { border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; margin: 12px 0; }
.line-item { display: grid; gap: 8px; grid-template-columns: 3fr 1.3fr 1.3fr 2fr 1.3fr auto; align-items: end; margin-bottom: 10px; }
.line-item.items { grid-template-columns: 1fr 5fr 2fr auto; }
.total-line { padding: 10px 12px; background: var(--soft); border-radius: 8px; font-size: 14px; margin-top: 8px; }
.total-line.bad { background: var(--high-soft); color: var(--high); }

.dropzones { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin-bottom: 16px; }
.dropzone { border: 1.5px dashed var(--line-strong); border-radius: var(--radius); padding: 16px; background: var(--surface); text-align: center; cursor: pointer; display: block; position: relative; }
.dropzone:hover, .dropzone.over { border-color: var(--accent); background: var(--accent-soft); }
.dropzone strong { display: block; }
.dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.doc { border-top: 1px solid var(--line); padding: 12px 0; }
.doc:first-of-type { border-top: 0; }
.kv { display: grid; grid-template-columns: minmax(120px, 200px) 1fr; gap: 2px 12px; margin: 8px 0 0; font-size: 13px; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; overflow-wrap: anywhere; }
.conflict { border: 1px solid var(--mid-line); background: var(--mid-soft); border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; font-size: 13px; }

.draft-text { font-family: Georgia, "Times New Roman", serif; font-size: 15px; line-height: 1.6; min-height: 560px; }
.issue { padding: 10px 0; border-top: 1px solid var(--line); font-size: 14px; }
.issue:first-of-type { border-top: 0; }
.template-text { font-family: Consolas, ui-monospace, monospace; font-size: 13px; min-height: 480px; }
/* Editor de modelos: texto à esquerda, campos do cadastro à direita. */
.template-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.template-layout .stack > .card { margin-bottom: 0; }
.field-panel { position: sticky; top: 76px; max-height: calc(100vh - 96px); overflow: auto; }
.field-panel h2 { margin: 0; }
.field-list { display: flex; flex-direction: column; gap: 6px; }
.field-group summary { cursor: pointer; font-weight: 600; font-size: 14px; padding: 6px 0; }
.field-group[open] summary { margin-bottom: 4px; }
.field-pick { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; text-align: left; white-space: normal; padding: 6px 10px; margin-bottom: 4px; background: var(--soft); }
.field-pick code { font-size: 11px; color: var(--muted); word-break: break-all; }
.field.grow { flex: 1 1 240px; }
.template-preview { border: 1px solid var(--line); border-radius: 8px; padding: 14px; background: var(--soft); }
.preview-text { white-space: pre-wrap; font-family: "Times New Roman", serif; font-size: 15px; line-height: 1.5; margin-top: 10px; max-height: 520px; overflow: auto; }
.preview-text mark { background: var(--mid-soft); color: var(--mid-ink); border-radius: 3px; padding: 0 2px; }
@media (max-width: 960px) {
  .template-layout { grid-template-columns: 1fr; }
  .field-panel { position: static; max-height: 420px; }
}
code { font-family: Consolas, ui-monospace, monospace; font-size: 12.5px; background: var(--soft); padding: 1px 4px; border-radius: 4px; }

.login { max-width: 400px; margin: 12vh auto; padding: 0 16px; }
.error { color: var(--high); font-size: 14px; }
.banner { padding: 10px 14px; border-radius: 8px; background: var(--mid-soft); color: var(--mid-ink); font-size: 14px; margin-bottom: 16px; }
.empty { padding: 32px; text-align: center; color: var(--muted); margin: 0; }

#toasts { position: fixed; right: 16px; bottom: 16px; display: flex; flex-direction: column; gap: 8px; z-index: 50; max-width: min(420px, calc(100vw - 32px)); }
.toast { background: var(--primary-bg); color: #fff; padding: 10px 14px; border-radius: 8px; font-size: 14px; }
.toast.err { background: var(--high); }
dialog { border: 1px solid var(--line); border-radius: var(--radius); padding: 20px; background: var(--surface); color: var(--ink); width: min(460px, calc(100vw - 32px)); }
dialog::backdrop { background: rgb(0 32 85 / .35); }

@media (max-width: 960px) {
  .layout { grid-template-columns: minmax(0, 1fr); }
  .sidebar { position: fixed; left: 0; top: 0; bottom: 0; width: 280px; max-width: 85vw; z-index: 40; transform: translateX(-100%); transition: transform .2s ease; box-shadow: 0 0 40px rgb(0 32 85 / .2); }
  body.menu-open .sidebar { transform: none; }
  body.menu-open .menu-backdrop { display: block; position: fixed; inset: 0; background: rgb(0 32 85 / .35); z-index: 30; }
  .menu-toggle { display: inline-block; }
  .topbar-logo { display: block; height: 32px; width: auto; }
  .topbar { padding: 8px 16px; }
}
@media (max-width: 760px) {
  .col:nth-child(even) .col-label { visibility: hidden; }
}
@media (max-width: 960px) {
  .editor { grid-template-columns: minmax(0, 1fr); }
  .side { position: static; max-height: none; order: -1; }
  .alerts { max-height: none; }
}
@media (max-width: 680px) {
  main { padding: 16px; }
  .chart-row { grid-template-columns: minmax(0, 1fr); }
  .filters label.field { max-width: none; }
  .c2, .c3, .c4, .c5, .c6, .c8, .c9 { grid-column: span 12; }
  .line-item, .line-item.items { grid-template-columns: minmax(0, 1fr); padding-bottom: 12px; border-bottom: 1px solid var(--line); }
}

/* ---------- Avaliador de imóveis ---------- */
.save-label { min-width: 110px; text-align: right; }
.cep-status { font-weight: 400; color: var(--muted); }
.map-box { width: 100%; height: 380px; border-radius: 10px; border: 1px solid var(--line); overflow: hidden; background: var(--soft); z-index: 0; }
.laudo-map { height: 320px; margin: 8px 0; }
.map-status:empty { display: none; }
.map-label { background: rgb(255 255 255 / .85); border: 0; box-shadow: none; font-weight: 700; color: #3B1C8C; font-size: 12px; padding: 1px 6px; }
.seg { display: inline-flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; align-self: flex-start; }
.seg-item { display: flex; align-items: center; gap: 6px; padding: 8px 14px; font-size: 14px; cursor: pointer; border-right: 1px solid var(--line); }
.seg-item:last-child { border-right: 0; }
.seg-item input { width: auto; margin: 0; }
.seg-item.on { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.raio-row { gap: 12px; font-size: 14px; }
.raio-row input[type="range"] { width: min(320px, 60vw); padding: 0; }
.chip-x { text-decoration: none; font-size: 15px; line-height: 1; margin-left: 2px; }
@media print { .laudo-map { height: 260px; break-inside: avoid; } .leaflet-control-zoom { display: none; } }
.perception { margin-top: 18px; padding: 14px 16px; border: 1px solid var(--accent-line); border-left: 4px solid var(--accent); border-radius: 8px; background: var(--accent-soft); }
.perception h3, .laudo-perception h3 { margin: 0 0 10px; font-size: 15px; color: var(--accent); }
.perception p { margin: 8px 0 0; }
.laudo-perception { margin-top: 14px; padding: 12px 16px; border: 1px dashed var(--accent-line); border-radius: 8px; }
.laudo-perception .mid-value { font-size: 20px; color: var(--ink); }

/* ---------- Imóveis e Marketing ---------- */
.badge.good { background: color-mix(in srgb, var(--s3) 14%, transparent); border-color: color-mix(in srgb, var(--s3) 45%, transparent); color: var(--s3); }
.badge.sit { font-weight: 600; }
.sit-counters { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 16px; }
.sit-counter { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 14px; text-align: left; white-space: normal; border-left: 4px solid var(--line); }
.sit-counter strong { font-size: 24px; }
.sit-counter span { font-size: 13px; color: var(--muted); }
.sit-counter.good { border-left-color: var(--s3); } .sit-counter.ok { border-left-color: var(--accent); }
.sit-counter.mid { border-left-color: var(--s4); } .sit-counter.high { border-left-color: var(--s8); }
.sit-counter.on { background: var(--accent-soft); border-color: var(--accent-line); }
.check-inline span { display: flex; align-items: center; gap: 6px; min-height: 38px; font-weight: 400; }
.check-inline input { width: auto; }
.market-alert { padding: 16px 20px; border-radius: var(--radius); border: 1px solid var(--line); border-left: 6px solid var(--line); background: var(--surface); margin-bottom: 16px; }
.market-alert p { margin: 6px 0; }
.market-alert.good { border-left-color: var(--s3); background: color-mix(in srgb, var(--s3) 8%, var(--surface)); }
.market-alert.ok { border-left-color: var(--accent); background: var(--accent-soft); }
.market-alert.mid { border-left-color: var(--s4); background: var(--mid-soft); }
.market-alert.high { border-left-color: var(--s8); background: var(--high-soft); }
.market-title { font-size: 20px; }
.market-diff { font-size: 22px; font-weight: 800; font-variant-numeric: tabular-nums; }
.market-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin: 12px 0 4px; }
.market-grid > div { display: flex; flex-direction: column; gap: 2px; }
.market-grid strong { font-size: 18px; }
.profile-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px; }
.plain-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; }
.tips { margin: 0; padding-left: 20px; display: grid; gap: 8px; line-height: 1.5; }
.thumbs { display: flex; flex-wrap: wrap; gap: 8px; }
.thumbs img { width: 160px; height: 120px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }
.thumbs.pick img { width: 96px; height: 72px; display: block; }
.thumb-btn { padding: 0; border: 3px solid transparent; border-radius: 10px; position: relative; background: none; }
.thumb-btn.on { border-color: var(--s2); }
.thumb-btn.on::after { content: attr(data-n); position: absolute; top: 4px; left: 4px; background: var(--s2); color: #fff; font-size: 12px; font-weight: 700; border-radius: 99px; width: 20px; height: 20px; display: grid; place-items: center; }
.pre-wrap { white-space: pre-wrap; font-size: 14px; line-height: 1.55; }
.story-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 24px; align-items: start; }
.story-form .field > span:has(input[type="checkbox"]) { display: flex; align-items: center; gap: 6px; }
.story-form .field input[type="checkbox"] { width: auto; margin: 0; }
.goal-grid { display: grid; grid-template-columns: minmax(0, 1fr) repeat(3, 110px); gap: 8px 10px; align-items: center; max-height: 55vh; overflow-y: auto; }
.goal-grid-name { font-size: 14px; font-weight: 550; }
.perm-table { min-width: 1100px; font-size: 14px; }
.perm-table th.perm-cell { font-size: 12px; text-align: center; white-space: normal; width: 86px; line-height: 1.2; }
.perm-table td.perm-cell { text-align: center; }
.perm-table td.perm-cell input { width: 18px; height: 18px; margin: 0; }
.perm-table tbody tr:first-child { background: var(--accent-soft); }
.perm-name { min-width: 200px; }
.blocked-area { max-width: 560px; margin: 40px auto; text-align: center; align-items: center; }
@media (max-width: 680px) { .goal-grid { grid-template-columns: minmax(0, 1fr) repeat(3, 64px); } }
.story-preview { position: sticky; top: 80px; }
.story-canvas { width: 100%; max-width: 340px; aspect-ratio: 9 / 16; height: auto; border-radius: 16px; box-shadow: 0 8px 30px rgb(0 0 0 / .25); display: block; }
@media (max-width: 960px) {
  .profile-grid, .story-layout { grid-template-columns: minmax(0, 1fr); }
  .story-preview { position: static; justify-self: center; width: min(340px, 100%); }
}
.chips { display: flex; flex-wrap: wrap; gap: 6px; font-weight: 400; }
.chip-check { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid var(--line); border-radius: 99px; background: var(--soft); font-size: 13px; cursor: pointer; }
.chip-check:has(input:checked) { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent); }
.check-field { justify-content: flex-end; font-weight: 400; }
.check-field span { display: flex; gap: 6px; align-items: center; min-height: 38px; }
.research-note { padding: 10px 14px; border-left: 3px solid var(--accent); background: var(--soft); border-radius: 6px; font-size: 14px; }
.sample-table { font-size: 13px; min-width: 1280px; }
.sample-table th { white-space: nowrap; font-size: 12px; }
.sample-table td { vertical-align: top; padding: 6px 4px; }
.sample-table tr.off td { opacity: .55; }
.cell-input { width: 86px; padding: 5px 6px; font-size: 13px; }
.cell-input.tiny { width: 52px; }
.cell-input.money { width: 110px; }
.cell-input.wide { width: 180px; display: block; }
.cell-input.wide + .cell-input.wide { margin-top: 4px; }
.src-cell { min-width: 130px; max-width: 200px; }
.clip { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 190px; }
.params summary { color: var(--ink); }
.params .grid { margin-top: 12px; }
.loft-list { max-height: 50vh; overflow-y: auto; }
.loft-row { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.loft-row input[type="checkbox"], .loft-pick input[type="checkbox"], .chip-check input, .check-field input, .sample-table input[type="checkbox"] { width: auto; flex: none; margin: 3px 0 0; }
.loft-pick { justify-content: flex-start; font-size: 14px; }

.laudo { background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius); padding: 36px 40px; max-width: 900px; margin: 0 auto; }
.laudo-head { display: flex; gap: 24px; align-items: center; border-bottom: 3px solid var(--accent); padding-bottom: 16px; margin-bottom: 8px; }
.laudo-head h1 { margin: 0; font-size: 26px; letter-spacing: .06em; color: var(--accent); }
.laudo-head p { margin: 4px 0 0; }
.laudo-sec { margin-top: 22px; break-inside: avoid-page; }
.laudo-sec h2 { font-size: 16px; color: var(--accent); border-bottom: 1px solid var(--line); padding-bottom: 4px; margin: 0 0 10px; }
.laudo-text { font-size: 14px; line-height: 1.55; }
.laudo-text li { margin-bottom: 4px; }
.kv { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 6px 16px; margin: 0; font-size: 14px; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; }
.laudo-table { font-size: 12.5px; }
.laudo-table tr.muted td { color: var(--muted); }
.laudo-links { overflow-wrap: anywhere; display: none; }
.laudo-value { padding: 16px 20px; background: var(--accent-soft); border: 1px solid var(--accent-line); border-radius: 8px; }
.laudo-value .big { font-size: 30px; font-weight: 800; color: var(--accent); margin: 2px 0 4px; }
.laudo-sign { margin-top: 56px; text-align: center; font-size: 14px; }
.sign-line { width: 280px; border-top: 1px solid var(--ink); margin: 0 auto 8px; }
@media (max-width: 680px) {
  .laudo { padding: 20px 16px; }
  .laudo-head { flex-direction: column; align-items: flex-start; }
  .kv { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .kv dd { margin-bottom: 8px; }
}
@media print {
  @page { size: A4; margin: 16mm 14mm; }
  :root { --surface: #fff; --ink: #101a2e; --muted: #5a6478; --line: #d5dae4; --accent: #3B1C8C; --accent-soft: #F4F0FE; --accent-line: #DCD0F7; --soft: #F6F4FB; }
  body { background: #fff !important; }
  .sidebar, .topbar, .menu-backdrop, .no-print, #toasts { display: none !important; }
  .layout, .content, main { display: block !important; padding: 0 !important; margin: 0 !important; }
  .laudo { border: 0; padding: 0; max-width: none; }
  .laudo a { color: inherit; text-decoration: none; }
  .laudo-links { display: block; font-size: 9px; }
  .table-wrap { overflow: visible; }
  .laudo-table tr { break-inside: avoid; }
}

/* ======================================================================
   Visual quadrado e moderno: vale para todo o sistema (fica no fim de propósito,
   para valer também sobre o que vier antes). Cantos retos em tudo; só os pontos
   de cor dos corretores continuam redondos.
   ====================================================================== */
:root { --radius: 0px; --canvas: #F3F0FA; --card-shadow: 0 1px 0 rgb(16 26 46 / .04), 0 8px 24px -16px rgb(16 26 46 / .35); }
:root[data-theme="dark"] { --canvas: #0D0818; --card-shadow: 0 1px 0 rgb(0 0 0 / .4), 0 10px 28px -18px rgb(0 0 0 / .9); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --canvas: #0D0818; --card-shadow: 0 1px 0 rgb(0 0 0 / .4), 0 10px 28px -18px rgb(0 0 0 / .9); } }

*, *::before, *::after { border-radius: 0 !important; }
/* Títulos grandes só com a primeira letra maiúscula ("Dashboard", não "DASHBOARD") */
.page-title-xl { text-transform: none; letter-spacing: -.015em; }
.who-dot { border-radius: 50% !important; }

/* Fundo levemente cinza e cartões brancos com sombra fina */
.content { background: var(--canvas); }
.card, .stat, .laudo, dialog, .login .card, .market-alert, .sit-counter, .filters, .perception, .laudo-value, .research-note {
  box-shadow: var(--card-shadow);
}
.card { border: 1px solid var(--line); padding: 22px 24px; }
.filters { background: var(--surface); border: 1px solid var(--line); }
dialog { border: 1px solid var(--line); box-shadow: 0 30px 80px -20px rgb(0 0 0 / .45); }

/* Títulos de cartão, rótulos e cabeçalhos: pequenos, maiúsculos e espaçados */
.card > h2, .card > .row > h2, .card > .row.spread > h2, .card > summary h2, .params summary strong {
  font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted);
}
.card > h2, .card > .row.spread { margin-bottom: 14px; }
.goal-section { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); margin: 18px 0 10px; padding-top: 14px; border-top: 1px solid var(--line); }
.card > .row + .goal-section { border-top: 0; padding-top: 0; margin-top: 4px; }
th { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.stat { border-top-width: 3px; padding: 16px 18px 18px; }
.stat-label { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.stat-value { font-size: 26px; font-weight: 750; margin-top: 4px; }
.section-title { font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }

/* Botões, campos e etiquetas */
button, .btn { font-weight: 600; letter-spacing: .01em; }
button.primary, .btn.primary { box-shadow: 0 6px 16px -10px var(--primary-bg); }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.badge { font-weight: 600; padding: 2px 8px; }
.menu-item { border-left: 3px solid transparent; }
.menu-item.active { box-shadow: none; border-left-color: var(--accent); }

/* Barras de meta retas e mais finas */
.goal-track { height: 10px; }
.goal.big .goal-track { height: 16px; }

/* Imóveis: capa junto ao código */
.cover-cell { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--ink); }
.cover-cell img { width: 96px; height: 72px; object-fit: cover; display: block; border: 1px solid var(--line); background: var(--soft); flex: none; }
.cover-empty { display: grid; place-items: center; width: 96px; height: 72px; background: var(--soft); color: var(--muted); font-size: 11px; border: 1px solid var(--line); flex: none; }
.property-head { align-items: flex-end; }
.property-id { display: flex; gap: 20px; align-items: center; min-width: 0; }
.property-cover { width: 240px; height: 160px; object-fit: cover; display: block; border: 1px solid var(--line); box-shadow: var(--card-shadow); flex: none; }
.property-cover.cover-empty { width: 240px; height: 160px; }
.property-code { font-size: 12px; font-weight: 800; letter-spacing: .12em; color: var(--accent); margin-top: 6px; }
@media (max-width: 680px) {
  .property-id { flex-direction: column; align-items: flex-start; }
  .property-cover, .property-cover.cover-empty { width: 100%; height: 200px; }
}

/* ======================================================================
   Layout no estilo de CRM imobiliário de mercado (referência Praedium),
   com a paleta do dasimobi: berinjela na estrutura, violeta nas ações e âmbar nos detalhes.
   ====================================================================== */
:root { --navy: #24124A; --navy-2: #3B1C8C; --orange: #7C3AED; --orange-hover: #6D28D9; --orange-soft: #F1ECFD; }

/* Menu lateral escuro */
.sidebar { background: var(--navy); border-right: 0; color: #dfe6f3; padding: 0 0 14px; gap: 0; }
.sidebar-logo { background: #fff; padding: 16px 20px; margin-bottom: 10px; border-bottom: 3px solid var(--orange); }
.sidebar-logo img { width: 140px; background: none !important; padding: 0 !important; }
.menu { padding: 0 10px; }
.menu-item { color: #dfe6f3; font-size: 14px; padding: 9px 12px 9px 20px; border-left: 3px solid transparent; }
.menu-item.top { color: #fff; font-weight: 600; padding-left: 12px; }
.menu-item:hover { background: rgb(255 255 255 / .07); color: #fff; }
.menu-item.active { background: rgb(255 255 255 / .1); color: #fff; border-left-color: var(--orange); font-weight: 700; }
button.menu-item { color: #C4B5FD; }
.menu-group { color: rgb(255 255 255 / .55); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; padding: 14px 12px 6px; }
.menu-group:hover { color: #fff; }
.menu-count { background: rgb(255 255 255 / .14); color: #fff; }
.menu-count.warn { background: var(--orange); color: #fff; }
.sidebar-user { border-top: 1px solid rgb(255 255 255 / .12); margin: 8px 10px 0; padding: 14px 6px 0; color: #fff; }
.sidebar-user .muted { color: rgb(255 255 255 / .6); }
.sidebar-user button { background: transparent; color: #fff; border-color: rgb(255 255 255 / .3); }
.sidebar-user button:hover { border-color: var(--orange); color: #C4B5FD; }
.theme-switch { border-color: rgb(255 255 255 / .25); }
.theme-switch button { background: transparent; color: rgb(255 255 255 / .7); }
.theme-switch button + button { border-left-color: rgb(255 255 255 / .2); }
.theme-switch button[aria-pressed="true"] { background: rgb(255 255 255 / .14); color: #fff; }

/* Barra de topo e cabeçalho da página */
.topbar { background: var(--surface); box-shadow: 0 1px 0 var(--line); }
.page-head h1, .page-title-xl { font-size: 26px; font-weight: 750; color: var(--ink); }
.page-head { padding-bottom: 14px; border-bottom: 1px solid var(--line); margin-bottom: 18px; }

/* Botões: ação principal em laranja; os outros contornados. Maiúsculas pequenas e espaçadas. */
button, .btn { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 9px 14px; border: 1px solid var(--line-strong); color: var(--navy); background: var(--surface); }
button:hover, .btn:hover { border-color: var(--orange); color: var(--orange); }
button.primary, .btn.primary { background: var(--orange); border-color: var(--orange); color: #fff; box-shadow: 0 6px 14px -8px var(--orange); }
button.primary:hover, .btn.primary:hover { background: var(--orange-hover); border-color: var(--orange-hover); color: #fff; }
button.link, .menu-item, .menu-group, .tabs button, .seg-item, .theme-switch button, .thumb-btn, .kcard, .sit-counter, .chip-check, .notice, .col, .goal-grid button { text-transform: none; letter-spacing: normal; }
/* Cartões e itens clicáveis que são botões por dentro mantêm o texto normal */
.kcard, .sit-counter, .notice, .thumb-btn, .col, .loft-row { font-size: 14px; font-weight: 400; color: var(--ink); }
.kcard strong { font-weight: 700; }
.kcard .small { font-size: 12.5px; }
button.link { font-size: 13px; font-weight: 600; color: var(--orange); text-decoration: none; }
button.link:hover { text-decoration: underline; }
.clear-filters { border-style: solid; color: var(--muted); }

/* Abas sublinhadas */
.tabs { border-bottom: 1px solid var(--line); gap: 6px; }
.tabs button { font-size: 14px; font-weight: 600; color: var(--muted); padding: 10px 14px; border-bottom: 3px solid transparent; }
.tabs button.active { color: var(--navy); border-bottom-color: var(--orange); }

/* Filtros numa faixa branca, alinhados */
.filters { padding: 12px 16px; gap: 14px; }
.filters .field { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.filters .field input, .filters .field select { font-size: 14px; font-weight: 400; letter-spacing: normal; text-transform: none; color: var(--ink); }

/* Tabelas com cabeçalho cinza */
thead th { background: var(--soft); border-bottom: 1px solid var(--line); }
tbody tr:hover td { background: color-mix(in srgb, var(--orange) 5%, transparent); }

/* Funil em colunas: fundo cinza, faixa colorida embaixo da etapa, cartões brancos */
.kanban { gap: 14px; }
.kcol { background: color-mix(in srgb, var(--line) 55%, var(--canvas)); border-top: 0; border-bottom: 4px solid var(--stage); box-shadow: none; }
.kcol-head { padding: 12px 14px 10px; align-items: flex-start; }
.kcol-head .kdot { margin-top: 5px; }
.kcol-title { display: flex; flex-direction: column; gap: 1px; }
.kcol-title strong { font-size: 14px; }
.kcol-sum { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.kcol-body { padding: 0 10px 12px; gap: 10px; }
.kcard { border: 1px solid var(--line); border-left: 0; background: var(--surface); box-shadow: 0 2px 6px -3px rgb(16 26 46 / .2); padding: 12px 14px; gap: 4px; }
.kcard:hover { border-color: var(--orange); }
.kcard.won { background: color-mix(in srgb, #1baf7a 12%, var(--surface)); border-color: color-mix(in srgb, #1baf7a 40%, transparent); }
.kcard.lost { opacity: .75; }
.ktag { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 2px 8px; margin-bottom: 2px; }
.ktag.ganho { background: #1baf7a; color: #fff; }
.ktag.perdido { background: var(--high-soft); color: var(--high); border: 1px solid var(--high-line); }

/* Indicadores com o laranja da marca na primeira cor */
.stats .stat:nth-child(4n+1) { --tile: var(--orange); }
.stats .stat:nth-child(4n+2) { --tile: var(--navy); }
.welcome { border-left-color: var(--orange); }
.goal-section { color: var(--orange); }
a { color: var(--navy); }
:root[data-theme="dark"] a { color: #C4B5FD; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) a { color: #C4B5FD; } }
:root[data-theme="dark"] button, :root[data-theme="dark"] .btn { color: #dfe6f3; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) button, :root:not([data-theme="light"]) .btn { color: #dfe6f3; } }
:root[data-theme="dark"] .tabs button.active { color: #fff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .tabs button.active { color: #fff; } }

/* Celular: o menu escuro abre por cima */
@media (max-width: 960px) {
  .sidebar { box-shadow: 10px 0 40px rgb(0 0 0 / .35); }
}

/* App instalado no celular (PWA) */
.sidebar-user .install-app { background: var(--orange); border-color: var(--orange); color: #fff; }
.sidebar-user .install-app:hover { background: var(--orange-hover); color: #fff; }
.push-offer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; background: var(--orange-soft); border: 1px solid color-mix(in srgb, var(--orange) 35%, transparent); }
:root[data-theme="dark"] .push-offer { background: color-mix(in srgb, var(--orange) 14%, var(--surface)); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .push-offer { background: color-mix(in srgb, var(--orange) 14%, var(--surface)); } }
/* Áreas do entalhe e da barra do iPhone quando aberto como app */
@supports (padding: env(safe-area-inset-top)) {
  .topbar { padding-top: max(10px, env(safe-area-inset-top)); }
  .sidebar { padding-bottom: max(14px, env(safe-area-inset-bottom)); }
  main { padding-bottom: max(48px, calc(24px + env(safe-area-inset-bottom))); }
}
@media (display-mode: standalone) {
  body { overscroll-behavior-y: none; }
}

/* ---------- Topo: lupa (busca geral) e menu do usuário ---------- */
.sidebar-user { display: none !important; } /* perfil, senha, tema e sair ficam no menu do usuário, no topo */
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.gsearch { position: relative; }
.gsearch-icon { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--muted); display: flex; pointer-events: none; }
.gsearch-input { width: 300px; padding: 8px 12px 8px 36px; font-size: 14px; background: var(--soft); border-color: var(--line); }
.gsearch-input:focus { background: var(--surface); width: 360px; }
.gsearch-panel { position: absolute; right: 0; top: calc(100% + 8px); width: 440px; max-height: 70vh; overflow-y: auto; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 24px 50px -20px rgb(16 26 46 / .5); z-index: 80; padding: 6px; }
.gsearch-group + .gsearch-group { border-top: 1px solid var(--line); margin-top: 4px; padding-top: 4px; }
.gsearch-title { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--orange); padding: 8px 10px 4px; }
.gsearch-item { display: flex; gap: 10px; align-items: center; padding: 8px 10px; text-decoration: none; color: var(--ink); }
.gsearch-item:hover, .gsearch-item:focus { background: var(--soft); outline: none; }
.gsearch-item img { width: 48px; height: 36px; object-fit: cover; flex: none; }
.gsearch-item span { display: flex; flex-direction: column; min-width: 0; }
.gsearch-item strong { font-size: 14px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gsearch-empty { padding: 14px; margin: 0; color: var(--muted); font-size: 14px; }
.avatar { position: relative; display: inline-grid; place-items: center; border-radius: 50% !important; background: var(--navy, #3B1C8C); color: #fff; font-weight: 800; overflow: hidden; flex: none; }
.avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 50% !important; }
.umenu { position: relative; }
.umenu-btn { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px 4px 4px; text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 650; color: var(--ink); background: var(--surface); }
.umenu-btn .chev { font-size: 11px; opacity: .6; }
.umenu-panel { position: absolute; right: 0; top: calc(100% + 8px); width: 290px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 24px 50px -20px rgb(16 26 46 / .5); z-index: 80; padding: 8px; display: flex; flex-direction: column; gap: 2px; }
.umenu-panel[hidden] { display: none; }
.umenu-head { display: flex; gap: 12px; align-items: center; padding: 8px 8px 12px; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.umenu-head strong { display: block; font-size: 15px; }
.umenu-item { text-align: left; border: 0; background: none; padding: 10px; font-size: 14px; font-weight: 550; text-transform: none; letter-spacing: 0; color: var(--ink); }
.umenu-item:hover { background: var(--soft); color: var(--orange); }
.umenu-item.danger { color: var(--high); }
.umenu-theme { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; }
.umenu-theme .theme-switch { flex: 1; max-width: 200px; border-color: var(--line); }
.umenu-theme .theme-switch button { color: var(--muted); background: var(--surface); }
.umenu-theme .theme-switch button[aria-pressed="true"] { background: var(--orange-soft); color: var(--navy); }
.umenu-panel .install-app { margin: 4px 10px; }
.profile-row { display: flex; gap: 20px; align-items: center; }
@media (max-width: 960px) {
  .gsearch-input, .gsearch-input:focus { width: 170px; }
  .gsearch-panel { position: fixed; left: 12px; right: 12px; top: 64px; width: auto; }
  .umenu-name, .umenu-btn .chev { display: none; }
  .umenu-btn { padding: 2px; border: 0; }
}
@media (max-width: 560px) {
  .gsearch-input { width: 42px; padding-left: 30px; background: transparent; }
  .gsearch-input:focus { width: calc(100vw - 150px); background: var(--surface); }
}

/* ---------- Agenda ---------- */
.agenda-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; align-items: start; }
.ag-nav { margin-bottom: 12px; }
.ag-title { margin: 0; text-transform: capitalize !important; letter-spacing: 0 !important; font-size: 18px !important; color: var(--ink) !important; }
.ag-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.ag-wd { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); padding: 8px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--soft); }
.ag-day { min-height: 104px; padding: 6px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 3px; cursor: pointer; min-width: 0; }
.ag-day:hover { background: var(--soft); }
.ag-day.out { background: color-mix(in srgb, var(--soft) 60%, transparent); color: var(--muted); }
.ag-day.sel { box-shadow: inset 0 0 0 2px var(--orange, #E8892B); }
.ag-num { font-size: 13px; font-weight: 700; }
.ag-day.today .ag-num { background: var(--orange, #E8892B); color: #fff; border-radius: 50% !important; width: 24px; height: 24px; display: grid; place-items: center; }
.ag-chip { display: block; width: 100%; text-align: left; font-size: 11.5px !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: 0 !important; padding: 2px 6px !important; border: 0 !important; border-left: 3px solid var(--ag, var(--s1)) !important; background: color-mix(in srgb, var(--ag, var(--s1)) 14%, var(--surface)) !important; color: var(--ink) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ag-visita { --ag: #E8892B; } .ag-ligacao { --ag: var(--s1); } .ag-reuniao { --ag: var(--s7); } .ag-tarefa { --ag: var(--s3); } .ag-outro { --ag: var(--muted); }
.st-cancelado { opacity: .5; text-decoration: line-through; }
.ag-daylist .ag-item { display: flex; gap: 12px; width: 100%; text-align: left; padding: 10px 12px; margin-bottom: 8px; border: 1px solid var(--line); border-left: 4px solid var(--ag); background: var(--surface); text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--ink); }
.ag-time { font-weight: 800; font-size: 15px; min-width: 46px; }
.ag-body { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
@media (max-width: 1100px) { .agenda-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 700px) { .ag-day { min-height: 64px; } .ag-chip { font-size: 0 !important; height: 6px; padding: 0 !important; } }

/* Negócios em aberto: amarelo (vence a cor automática pela posição) */
.stats .stat.stat-open { --tile: #f2b705; }

/* Selo "Loft ao vivo" */
.loft-live { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--muted); }
.loft-live .live-dot { width: 9px; height: 9px; border-radius: 50% !important; background: #1baf7a; box-shadow: 0 0 0 0 rgb(27 175 122 / .6); animation: live-pulse 2s infinite; flex: none; }
.loft-live.off .live-dot { background: var(--line-strong); animation: none; }
.loft-live .loft-new { font-size: 12px; padding: 6px 10px; background: var(--orange); border-color: var(--orange); color: #fff; }
@keyframes live-pulse { 0% { box-shadow: 0 0 0 0 rgb(27 175 122 / .55); } 70% { box-shadow: 0 0 0 8px rgb(27 175 122 / 0); } 100% { box-shadow: 0 0 0 0 rgb(27 175 122 / 0); } }
@media (prefers-reduced-motion: reduce) { .loft-live .live-dot { animation: none; } }

/* Tarefas da negociação e quadros "Minhas tarefas" / "Próximos compromissos" */
.tasks-card .task-list { display: grid; gap: 8px; margin-top: 8px; }
.tasks-card .task-check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.tasks-card .task-check input { margin-top: 3px; width: auto; }
.tasks-card .task-check > span { display: grid; gap: 2px; }
.tasks-card .task.concluida strong { text-decoration: line-through; opacity: .6; }
.tasks-card .task.late .small { color: #c0392b; }
.work-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin: 16px 0; }
.work-row .card { margin: 0; }
.work-item { display: grid; gap: 2px; padding: 8px 0; border-top: 1px solid var(--line); color: inherit; text-decoration: none; }
.work-item:first-of-type { border-top: 0; }
.work-item:hover strong { color: var(--orange); }

/* Painel do avaliador */
.av-painel { margin-bottom: 16px; }
.av-painel > .row { margin-bottom: 8px; }
.av-painel .field.inline { display: flex; align-items: center; gap: 8px; flex-direction: row; }
.av-tickets { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin-top: 16px; }
.av-tickets .card { margin: 0; }
.av-tickets table { width: 100%; }
.av-search { max-width: 380px; width: 100%; }

/* Estoque próprio */
.estoque-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; margin-top: 12px; }
.estoque-item { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; color: inherit; text-decoration: none; background: var(--card, #fff); }
.estoque-item:hover { border-color: var(--orange); }
.estoque-capa { aspect-ratio: 4 / 3; background: var(--soft, #f1f3f6); display: grid; place-items: center; overflow: hidden; }
.estoque-capa img { width: 100%; height: 100%; object-fit: cover; }
.estoque-info { padding: 10px 12px; display: grid; gap: 4px; }
.estoque-preco { color: var(--navy, #12325b); }
.estoque-flags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.estoque-flags .flag { border: 1px solid var(--line); border-radius: 999px; padding: 1px 8px; color: var(--muted, #6b7280); }
.estoque-flags .flag.on { border-color: #1f9d55; color: #1f9d55; }
.fotos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.foto-item { position: relative; aspect-ratio: 4 / 3; border-radius: 10px; overflow: hidden; background: var(--soft, #f1f3f6); }
.foto-item img { width: 100%; height: 100%; object-fit: cover; }
.foto-capa { position: absolute; left: 6px; top: 6px; background: var(--orange); color: #fff; font-size: 12px; padding: 1px 8px; border-radius: 999px; }
.foto-acoes { position: absolute; right: 6px; bottom: 6px; display: flex; gap: 4px; }
.foto-acoes button { padding: 2px 8px; font-size: 12px; min-height: 0; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.chip-check { display: inline-flex; gap: 6px; align-items: center; border: 1px solid var(--line); border-radius: 999px; padding: 3px 10px; font-size: 13px; cursor: pointer; }
.chip-check input { width: auto; margin: 0; }
.check { display: inline-flex; gap: 8px; align-items: center; margin-right: 18px; }
.check input { width: auto; }
.integ-card summary { cursor: pointer; }
.integ-linha { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); }
.integ-linha code { display: block; word-break: break-all; margin-top: 4px; }
.integ-portal { border-left: 4px solid var(--line); }
.integ-portal.ligado { border-left-color: #22a06b; }
.integ-portal h2 { margin: 0; }
.integ-stats { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 10px 0 4px; }
.integ-acoes { margin-top: 12px; }
.integ-enderecos { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 10px; }
.integ-enderecos summary { cursor: pointer; font-weight: 600; }
.integ-resumo { display: grid; gap: 6px; }
.integ-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.integ-aviso { background: #fff7e0; border: 1px solid #f2b705; border-radius: 10px; padding: 8px 12px; color: #6b4e00; }

/* ---------- Aluguéis e financeiro ---------- */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(190px, 100%), 1fr)); gap: 12px; margin-bottom: 16px; }
.kpi-tile { display: grid; gap: 2px; background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--accent-line); border-radius: 12px; padding: 14px 16px; box-shadow: var(--card-shadow, none); }
.kpi-tile strong { font-size: 22px; letter-spacing: -.01em; }
.kpi-tile.ok { border-left-color: #22a06b; }
.kpi-tile.alerta { border-left-color: var(--high, #d03b3b); }
.alerta-titulo { font-size: 14px; margin: 14px 0 4px; color: var(--accent); }
.alerta-titulo.alto { color: var(--high, #d03b3b); }
.alerta-linha { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border-top: 1px solid var(--line); flex-wrap: wrap; }
.acoes-cobranca { gap: 6px; flex-wrap: wrap; }
dialog.aluguel-dialog { border: 1px solid var(--line); border-radius: 14px; padding: 20px; width: min(640px, 94vw); background: var(--surface); color: var(--ink); }
dialog.aluguel-dialog::backdrop { background: rgb(10 15 26 / .55); }
dialog.aluguel-dialog h2 { margin: 0; }
dialog.aluguel-dialog > * + * { margin-top: 12px; }
.recibo { border: 1px solid var(--line); border-radius: 10px; padding: 18px; background: #fff; color: #101a2e; }
.recibo h3 { margin-top: 0; }
.recibo table { width: 100%; }
.recibo-assinatura { margin-top: 36px; text-align: center; }
ul.historico { list-style: none; padding: 0; margin: 0; }
ul.historico li { padding: 8px 0; border-top: 1px solid var(--line); }
.fin-duas { display: grid; grid-template-columns: 1.4fr 1fr; gap: 16px; }
@media (max-width: 900px) { .fin-duas { grid-template-columns: 1fr; } }
.fin-barras { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; height: 220px; align-items: end; margin-top: 10px; }
.fin-coluna { display: grid; grid-template-rows: 1fr auto auto; height: 100%; text-align: center; gap: 2px; }
.fin-coluna.atual span:first-of-type { font-weight: 700; }
.fin-par { display: flex; gap: 4px; align-items: flex-end; justify-content: center; height: 100%; }
.fin-barra { width: 40%; max-width: 26px; min-height: 2px; border-radius: 4px 4px 0 0; }
.fin-barra.receita, .dot.receita { background: #22a06b; }
.fin-barra.despesa, .dot.despesa { background: #d0603b; }
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 6px 0 2px; vertical-align: middle; }
.fin-legenda { display: flex; align-items: center; gap: 4px; }
@media print {
  body.imprimindo-recibo > *:not(dialog) { display: none !important; }
  body.imprimindo-recibo dialog.aluguel-dialog { border: 0; width: 100%; box-shadow: none; }
  body.imprimindo-recibo dialog.aluguel-dialog .row { display: none; }
}

/* ---------- Marca do sistema (dasimobi) ---------- */
.dasimobi-marca { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; line-height: 1; }
.dasimobi-marca img { width: 32px; height: 32px; border-radius: 9px; flex: none; }
.dasimobi-nome { font-weight: 800; font-size: 21px; letter-spacing: .01em; color: var(--ink); }
.dasimobi-nome span { color: #7C3AED; }
.dasimobi-marca.pequena img { width: 26px; height: 26px; border-radius: 7px; }
.dasimobi-marca.pequena .dasimobi-nome { font-size: 17px; }
.dasimobi-marca.grande img { width: 48px; height: 48px; border-radius: 13px; }
.dasimobi-marca.grande .dasimobi-nome { font-size: 32px; }
:root[data-theme="dark"] .dasimobi-nome span { color: #C4B5FD; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .dasimobi-nome span { color: #C4B5FD; } }
/* No menu lateral escuro, o nome fica claro. */
.sidebar-logo { background: transparent !important; border-bottom: 3px solid var(--orange); padding: 18px 20px 16px; }
.sidebar-logo .dasimobi-nome { color: #fff; }
.sidebar-logo .dasimobi-nome span { color: #C4B5FD; }
.login-brand { display: grid; justify-items: center; gap: 8px; }
.drawer-toggle img { display: block; border-radius: 8px; }

/* Ícones dos portais no Integrador de anúncios (sigla + nome embaixo) */
.portal-icones { display: flex; gap: 10px; align-items: flex-start; }
.portal-icone { display: grid; justify-items: center; gap: 4px; width: 64px; text-align: center; }
.portal-sigla { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; color: #fff; font-weight: 800; font-size: 14px; letter-spacing: .02em; box-shadow: 0 4px 10px -6px rgb(0 0 0 / .5); }
.portal-nome { font-size: 11px; line-height: 1.2; color: var(--muted); }
.portal-icones.grande .portal-sigla { width: 52px; height: 52px; font-size: 16px; border-radius: 14px; }
.integ-cabeca { align-items: flex-start; }
.integ-titulo { gap: 14px; align-items: center; }
.integ-vitrine { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.integ-vitrine-item { display: grid; justify-items: center; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 14px; text-decoration: none; color: inherit; background: var(--surface); }
.integ-vitrine-item:hover { border-color: var(--accent); }
.integ-vitrine-item.ligado { border-color: #22a06b; }

/* Site e marca */
.logo-preview { display: grid; place-items: center; min-height: 110px; border: 1px dashed var(--line-strong); border-radius: 12px; padding: 16px; margin: 10px 0; background: repeating-conic-gradient(var(--soft) 0 25%, var(--surface) 0 50%) 50% / 20px 20px; }
.logo-preview img { max-height: 90px; max-width: 100%; }
.modelos-site { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 12px; }
.modelo-site { border: 1px solid var(--line); border-radius: 12px; padding: 14px; display: grid; gap: 6px; }
.modelo-site.escolhido { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.secoes-site { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 4px 16px; }
.site-editor-painel { margin-top: 16px; }

.msg-previa { white-space: pre-wrap; font: 13px/1.5 inherit; font-family: inherit; background: var(--soft); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; max-height: 340px; overflow: auto; margin: 6px 0 0; }

/* Marca do sistema: o símbolo não herda as larguras antigas do logo em imagem */
html[data-layout="topo"] .topnav-logo .dasimobi-marca img, .sidebar-logo .dasimobi-marca img, .topbar-logo .dasimobi-marca img { width: 26px; height: 26px; background: none !important; padding: 0 !important; }
.sidebar-logo .dasimobi-marca img { width: 32px; height: 32px; }
html[data-layout="topo"] .topnav-logo, .topbar-logo { background: none !important; padding: 0 !important; display: inline-flex; align-items: center; text-decoration: none; }
.login-brand .dasimobi-marca img { width: 48px; height: 48px; background: none !important; padding: 0 !important; }
/* Logo do cliente (instalação com marca própria): mantém a proporção do logo. */
.dasimobi-marca.instancia-marca img, html[data-layout="topo"] .topnav-logo .instancia-marca img, .sidebar-logo .instancia-marca img, .topbar-logo .instancia-marca img,
html[data-layout="topo"] .marca-toggle .dasimobi-marca.instancia-marca img { width: auto !important; height: 34px !important; max-width: 160px; border-radius: 0; object-fit: contain; }
.login-brand .instancia-marca img { height: 64px !important; max-width: 260px; }

/* Boleto e PIX automáticos */
.gateway-faixa { border: 1px dashed var(--line-strong); border-radius: 12px; padding: 10px 14px; margin-bottom: 16px; font-size: 14px; color: var(--muted); }
/* Editor do site: prévia do resultado no Google */
.serp { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; max-width: 640px; font-family: Arial, sans-serif; background: var(--surface); }
.serp-url { font-size: 13px; color: var(--muted); }
.serp-titulo { font-size: 19px; color: #1a0dab; margin: 2px 0; }
.serp-desc { font-size: 14px; color: var(--muted); }
:root[data-theme="dark"] .serp-titulo { color: #99c3ff; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .serp-titulo { color: #99c3ff; } }
.lista-ok { margin: 0; padding-left: 20px; display: grid; gap: 6px; }
.codigo-acesso { font-size: 22px; letter-spacing: .12em; font-family: ui-monospace, Consolas, monospace; }
/* Roleta de atendimento */
.roleta-checks { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 6px; }
.roleta-checks.rolagem { max-height: 150px; overflow-y: auto; border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; }
.roleta-regras { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.roleta-regra { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; }
.roleta-regra.desligada { opacity: .6; }
.roleta-regra-txt { min-width: 0; flex: 1 1 280px; }
.roleta-resultado:empty { display: none; }
.roleta-resultado { margin: 0; font-weight: 600; }
/* Aluguel: seguros, despesas e créditos */
.subtitulo-form { margin: 8px 0 0; font-size: 15px; color: var(--ink); }
.item-extra { white-space: nowrap; font-weight: 400; }
.lanc-seta { display: flex; align-items: flex-end; }
.seta-repasse { width: 100%; border-radius: 10px; font-weight: 600; border: 1.5px solid var(--line-strong); background: var(--surface); color: var(--muted); }
.seta-repasse.ligada { border-color: #22a06b; color: #17784f; background: color-mix(in srgb, #22a06b 10%, var(--surface)); }
.seta-repasse:disabled { opacity: 1; cursor: default; }
.gateway-faixa.ligado { border-style: solid; border-color: #22a06b; background: color-mix(in srgb, #22a06b 8%, var(--surface)); color: var(--ink); }
.copiar-linha { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line); }
.copiar-linha code { display: block; word-break: break-all; font-size: 12.5px; margin-top: 4px; }

.servico-migracao { border-left: 4px solid var(--orange); background: color-mix(in srgb, var(--orange) 6%, var(--surface)); }

/* Cores da imobiliária (modelo Clássico) */
.cores-amostra { display: grid; gap: 8px; margin-top: 18px; }
.cor-faixa, .cor-botao { display: block; color: #fff; font-weight: 700; padding: 10px 12px; border-radius: 10px; text-align: center; font-size: 13px; }
.cor-hex { width: 100px; font-family: monospace; }
input[type="color"] { width: 48px; height: 38px; padding: 2px; border-radius: 8px; cursor: pointer; }

.cores-amostra { margin-bottom: 12px; }

/* Cadastros: busca de pessoa/imóvel, documentos */
.busca-resultados { display: grid; gap: 6px; margin-top: 6px; }
.busca-item { display: grid; text-align: left; gap: 2px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); text-transform: none; letter-spacing: 0; font-weight: 400; }
.busca-item:hover { border-color: var(--accent); background: var(--accent-soft); }
.busca-item strong { font-size: 14px; }
input.pct { width: 80px; }
.docs-envio { border-top: 1px solid var(--line); padding-top: 12px; }

/* Marketing: artes e Reels */
.arte-editor { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 24px; align-items: start; margin-top: 16px; }
@media (max-width: 900px) { .arte-editor { grid-template-columns: 1fr; } }
.arte-previa { position: sticky; top: 84px; display: grid; gap: 10px; }
.arte-canvas { width: 100%; height: auto; border-radius: 16px; box-shadow: 0 20px 40px -20px rgb(0 0 0 / .5); background: #111; }
.arte-canvas.story { max-width: 380px; }
.arte-fotos { display: flex; flex-wrap: wrap; gap: 6px; }
.arte-foto { padding: 0; border: 2px solid transparent; border-radius: 8px; overflow: hidden; width: 72px; height: 54px; }
.arte-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.arte-foto.ativa { border-color: var(--accent); }
.reels-lista { display: grid; gap: 6px; }
.reels-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; }
.reels-nome { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reels-video { width: 100%; max-width: 380px; border-radius: 16px; background: #000; }
progress { width: 100%; max-width: 380px; height: 10px; }

/* Lista suspensa (condomínio no cadastro do imóvel) */
.campo-suspenso { position: relative; max-width: 640px; }
.sugestoes-suspensas { position: absolute; left: 0; right: 0; top: 100%; z-index: 30; margin-top: 2px; background: var(--surface); border-radius: 12px; box-shadow: 0 16px 40px -12px rgb(0 0 0 / .35); }
.sugestoes-suspensas:empty { display: none; }
.busca-item.novo { border-style: dashed; color: var(--accent); }