/* =========================================================
   Mind GEO — Dashboard (usa tokens e componentes de app.css)
   ========================================================= */
.dash-body, body.mode-dash { background: #f6f6f7; font-size: 14px; }

/* Aplicação única: um shell por vez (mode-onb = configuração de cliente, mode-dash = dashboard) */
body.mode-onb .dash { display: none; }
body.mode-login .dash, body.mode-login .ob { display: none; }
body.mode-login { background: #f6f6f7; }
body.mode-dash .ob { display: none; }
body.mode-onb { background: #fff; font-size: 15px; }
body.mode-onb .brand-mark { flex: 0 0 auto; }
body.mode-onb .brand-name { white-space: nowrap; }
body.mode-onb .ob-user { min-width: 0; }
#obBack { flex: 0 0 auto; }
.dash { display: grid; grid-template-columns: 252px 1fr; height: 100vh; overflow: hidden; }
.dash.side-collapsed { grid-template-columns: 0 1fr; }
.dash.side-collapsed .d-side { visibility: hidden; }

/* ---------- Sidebar ---------- */
.d-side { background: #f6f6f7; padding: 14px 12px; overflow-y: auto; display: flex; flex-direction: column; }
.d-side-top { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.proj-switch { flex: 1; min-width: 0; display: flex; align-items: center; gap: 9px; height: 40px; padding: 0 10px; border: 0; background: transparent; border-radius: 8px; cursor: pointer; font-weight: 600; font-size: 15px; text-align: left; }
.proj-switch:hover { background: #ececef; }
.proj-logo { display: grid; place-items: center; width: 22px; height: 22px; flex: 0 0 22px; }
.d-nav .grp { font-size: 12.5px; color: var(--label); padding: 16px 10px 6px; }
.d-nav a, .d-nav .nav-disabled { display: flex; align-items: center; gap: 10px; height: 36px; padding: 0 10px; border-radius: 8px; color: var(--text-2); font-size: 14.5px; }
.d-nav a:hover { background: #ececef; color: var(--text); }
.d-nav a.is-active { background: #e9e9ec; color: var(--text); font-weight: 500; }
.d-nav svg { flex: 0 0 18px; color: var(--muted); }
.d-nav .nav-disabled { color: #a1a1aa; cursor: default; }
.d-nav .badge { margin-left: auto; font-size: 11.5px; padding: 1px 7px; border-radius: 6px; background: #e8f0fe; color: #2f6fe0; font-weight: 500; }
.d-nav .soon { margin-left: auto; font-size: 11px; color: #a1a1aa; }

/* ---------- Main ---------- */
.d-main { display: flex; flex-direction: column; min-width: 0; height: 100vh; }
.d-top { display: flex; align-items: center; gap: 10px; padding: 12px 18px 10px 8px; min-height: 58px; }
.d-menu-btn { display: none; }
.filters { display: flex; gap: 6px; flex-wrap: wrap; flex: 1; min-width: 0; }
.top-actions { display: flex; gap: 8px; align-items: center; }
.fchip { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 11px; border-radius: 8px; border: 1px solid transparent; background: #ececef; color: var(--text-2); cursor: pointer; font-size: 14px; white-space: nowrap; }
.fchip:hover { background: #e4e4e7; color: var(--text); }
.fchip svg { color: var(--muted); }
.fchip.is-set { background: #fff; border-color: var(--border); color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.fchip.brand { background: #fff; border-color: var(--border); color: var(--text); font-weight: 500; }
.fchip .tagpill { margin: 0; }
.d-content { flex: 1; overflow-y: auto; margin: 0 14px 14px 0; background: #fff; border: 1px solid #ececef; border-radius: 14px; padding: 0 0 28px; outline: none; }
.v-head { display: flex; align-items: center; gap: 10px; padding: 16px 22px; border-bottom: 1px solid #f0f0f2; font-size: 15px; font-weight: 500; position: sticky; top: 0; background: rgba(255,255,255,.96); backdrop-filter: blur(6px); z-index: 5; border-radius: 14px 14px 0 0; }
.v-head svg { color: var(--muted); }
.v-head .crumb { color: var(--muted); font-weight: 400; }
.v-head .crumb a:hover { color: var(--text); }
.v-head .sep { color: #c4c4c8; }
.v-head .right { margin-left: auto; display: flex; align-items: center; gap: 8px; font-weight: 400; }
.v-body { padding: 16px 18px 0; }
.demo-pill { font-size: 11.5px; font-weight: 500; color: #b45309; background: #fff7e6; border: 1px solid #fde7b0; padding: 2px 8px; border-radius: 99px; }

.grid-ov { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; }
.grid-src { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 14px; }
.grid-src-top { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 14px; }

/* ---------- Cards ---------- */
.card { border: 1px solid #ececef; border-radius: 12px; background: #fff; min-width: 0; }
.card-h { display: flex; align-items: center; gap: 8px; padding: 14px 16px 6px; min-height: 48px; }
.card-h .t { font-weight: 500; font-size: 14.5px; }
.card-h .s { color: var(--muted); font-size: 14px; }
.card-h .right { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.card-h svg { color: var(--muted); flex: 0 0 auto; }
.card-b { padding: 4px 16px 16px; }
.section-h { display: flex; align-items: center; gap: 8px; padding: 22px 4px 10px; }
.section-h .t { font-weight: 500; font-size: 14.5px; }
.section-h .s { color: var(--muted); }
.section-h .right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.link { color: var(--text-2); display: inline-flex; align-items: center; gap: 4px; cursor: pointer; border: 0; background: none; font-size: 14px; padding: 4px 2px; }
.link:hover { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
.btn-xs { height: 32px; padding: 0 11px; font-size: 13.5px; border-radius: 7px; }
.btn-dark { background: #111113; color: #fff; border: 1px solid #111113; }
.btn-dark:hover { background: #2a2a2e; }
.btn-light { background: #fff; border: 1px solid var(--border); color: var(--text); }
.btn-light:hover { background: #fafafa; }
.btn-soft { background: #f4f4f5; border: 1px solid transparent; color: var(--text-2); }
.btn-soft:hover { background: #ececef; color: var(--text); }

/* ---------- Tabela ---------- */
.tbl-wrap { overflow-x: auto; }
.tbl { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; }
.tbl th { text-align: left; font-weight: 400; color: var(--muted); background: #fafafa; padding: 10px 12px; border-bottom: 1px solid #ececef; white-space: nowrap; font-size: 13.5px; }
.tbl th.sort { cursor: pointer; user-select: none; }
.tbl th.sort:hover { color: var(--text); }
.tbl th .arr { opacity: .5; margin-left: 4px; font-size: 11px; }
.tbl th.is-sorted { color: var(--text); }
.tbl th.is-sorted .arr { opacity: 1; }
.tbl td { padding: 10px 12px; border-bottom: 1px solid #f2f2f4; vertical-align: middle; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl tbody tr.click { cursor: pointer; }
.tbl tbody tr.click:hover td { background: #fafafb; }
.tbl .num { text-align: right; font-variant-numeric: tabular-nums; }
.tbl .rank { color: var(--muted); width: 36px; text-align: center; }
.tbl-box { border: 1px solid #ececef; border-radius: 12px; overflow: hidden; background: #fff; }
.tbl tr.group td { background: #fff; border-bottom: 1px solid #ececef; }
.tbl tr.group .gname { font-weight: 500; }
.tbl tr.group .gsub { color: var(--muted); font-size: 13px; }
.tbl .q { max-width: 460px; }
.tbl .q .txt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.4; }
.tbl .pending { color: var(--muted); font-size: 13px; }
/* Tabela de marcas: 6 colunas em meio card → padding e métricas mais compactos */
.brands-tbl th, .brands-tbl td { padding-left: 8px; padding-right: 8px; }
.brands-tbl th:first-child, .brands-tbl td:first-child { padding-left: 14px; }
.brands-tbl th:last-child, .brands-tbl td:last-child { padding-right: 14px; }
.brands-tbl .metric { gap: 6px; }
.brands-tbl .metric b { min-width: 34px; }
.brands-tbl .cell-brand { gap: 8px; }
.brands-tbl .delta { font-size: 12px; min-width: 40px; }

.cell-brand { display: flex; align-items: center; gap: 10px; font-weight: 500; }
.cell-url .title { display: block; max-width: 520px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.cell-url .addr { display: block; max-width: 520px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 13px; }
.empty { padding: 34px 16px; text-align: center; color: var(--muted); }

/* ---------- Pequenos indicadores ---------- */
.delta { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; min-width: 50px; font-variant-numeric: tabular-nums; }
.delta.up { color: #16a34a; }
.delta.down { color: #dc2626; }
.delta.flat { color: #a1a1aa; }
.metric { display: inline-flex; align-items: center; gap: 10px; justify-content: flex-end; }
.metric b { font-weight: 500; min-width: 40px; text-align: right; font-variant-numeric: tabular-nums; }
.sent { display: inline-flex; align-items: center; gap: 5px; padding: 1px 7px 1px 5px; border: 1px solid #ececef; border-radius: 6px; font-variant-numeric: tabular-nums; font-size: 13px; background: #fff; }
.sent i { width: 2px; height: 12px; border-radius: 2px; background: #a1a1aa; }
.sent.pos i { background: #16a34a; } .sent.neg i { background: #dc2626; }
.pos-pill { display: inline-flex; align-items: center; gap: 3px; padding: 1px 7px; border: 1px solid #ececef; border-radius: 6px; font-size: 13px; font-variant-numeric: tabular-nums; background: #fff; }
.pos-pill span { color: var(--muted); }
.stack { display: inline-flex; align-items: center; gap: 3px; }
.stack .more { font-size: 12px; color: var(--muted); margin-left: 2px; }
.vol { display: inline-flex; gap: 2px; }
.vol i { width: 4px; height: 14px; border-radius: 2px; background: #e4e4e7; }
.vol.v1 i:nth-child(-n+1), .vol.v2 i:nth-child(-n+2) { background: #e34948; }
.vol.v3 i:nth-child(-n+3) { background: #eda100; }
.vol.v4 i:nth-child(-n+4), .vol.v5 i:nth-child(-n+5) { background: #1baf7a; }
.tagpill { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 6px; font-size: 12.5px; white-space: nowrap; margin: 1px 2px 1px 0; }
.tone-red { background: #fdecec; color: #c62828; } .tone-orange { background: #fdf0e6; color: #c2410c; }
.tone-yellow { background: #fdf6dd; color: #a16207; } .tone-green { background: #e8f6ec; color: #15803d; }
.tone-blue { background: #eaf1fd; color: #1d5fc2; } .tone-violet { background: #f0edfd; color: #5b43c9; }
.tone-gray { background: #f1f1f3; color: #52525b; } .tone-pink { background: #fcebf2; color: #be185d; } .tone-aqua { background: #e5f7f1; color: #0f7a55; }
.flag { font-size: 15px; line-height: 1; }
.mi { display: inline-grid; place-items: center; flex: 0 0 auto; }
.status-dot { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; padding: 2px 9px; border-radius: 99px; background: #e8f6ec; color: #15803d; }
.status-dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }

/* ---------- Tabs ---------- */
.tabs { display: inline-flex; gap: 2px; background: #f4f4f5; padding: 3px; border-radius: 9px; }
.tabs a, .tabs button { height: 30px; padding: 0 12px; display: inline-flex; align-items: center; border-radius: 7px; color: var(--muted); border: 0; background: none; cursor: pointer; font-size: 14px; }
.tabs .is-active { background: #fff; color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.tabs .cnt { margin-left: 6px; font-size: 12px; color: var(--muted); }

.toolbar { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid #ececef; flex-wrap: wrap; }
.toolbar .grow { flex: 1; }
.search { position: relative; }
.search input { height: 34px; width: 230px; border: 1px solid var(--border); border-radius: 8px; padding: 0 10px 0 32px; outline: none; font-size: 14px; }
.search input:focus { border-color: var(--focus); box-shadow: 0 0 0 3px var(--focus-ring); }
.search svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--muted); }
.switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; color: var(--text-2); user-select: none; }
.switch input { appearance: none; width: 34px; height: 20px; border-radius: 99px; background: #e4e4e7; position: relative; cursor: pointer; transition: background .15s; margin: 0; }
.switch input::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform .15s; }
.switch input:checked { background: #111113; }
.switch input:checked::after { transform: translateX(14px); }
.bulkbar { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: #111113; color: #fff; border-radius: 10px; margin: 10px 12px 0; font-size: 14px; }
.bulkbar .btn { height: 30px; font-size: 13px; background: #2a2a2e; color: #fff; border-color: #3f3f46; }

/* ---------- Gráficos ---------- */
.chart-host { position: relative; }
.chart-svg { display: block; width: 100%; height: auto; overflow: visible; }
.chart-grid line { stroke: #f0f0f2; stroke-width: 1; }
.chart-grid .chart-vgrid { stroke: #f5f5f7; }
.chart-tick { fill: #9a9aa2; font-size: 12px; font-family: var(--font); }
.chart-cross { stroke: #a1a1aa; stroke-width: 1; stroke-dasharray: 3 3; }
.chart-tip { position: absolute; background: #fff; border: 1px solid #ececef; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.08); padding: 10px 12px; font-size: 13.5px; pointer-events: none; z-index: 4; min-width: 210px; }
.chart-tip-date { color: var(--text-2); margin-bottom: 6px; font-size: 13px; }
.chart-tip-row { display: flex; align-items: center; gap: 8px; padding: 3px 0; }
.chart-tip-row i { width: 10px; height: 3px; border-radius: 2px; flex: 0 0 10px; }
.chart-tip-row .tip-logo { display: inline-grid; place-items: center; }
.chart-tip-row .tip-name { flex: 1; color: var(--text-2); }
.chart-tip-row b { font-weight: 500; font-variant-numeric: tabular-nums; margin-left: 14px; }
.donut-host { position: relative; display: flex; flex-direction: column; align-items: center; }
.donut-wrap { position: relative; }
.donut-seg { transition: opacity .15s; cursor: pointer; outline: none; }
.donut-seg.is-dim { opacity: .25; }
.donut-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; text-align: center; padding: 30px; }
.donut-center b { font-size: 26px; font-weight: 500; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.donut-center span { font-size: 12.5px; color: var(--muted); line-height: 1.2; }
.donut-tip { top: 8px; right: 0; left: auto; min-width: 180px; }
.donut-extra { margin-top: 6px; padding-top: 6px; border-top: 1px solid #f0f0f2; color: var(--muted); font-size: 12.5px; }
.donut-extra .stack { margin-top: 4px; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 14px; justify-content: center; margin-top: 14px; max-width: 320px; }
.legend-item { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; border: 0; background: none; padding: 0; cursor: default; font-family: inherit; }
button.legend-item { cursor: pointer; }
button.legend-item:hover span { color: var(--text) !important; text-decoration: underline; }
.legend-item i { width: 8px; height: 8px; border-radius: 2px; }
.chart-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; padding: 0 16px 6px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--text-2); }
.chart-legend i { width: 12px; height: 3px; border-radius: 2px; }

/* ---------- KPIs ---------- */
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.kpi { border: 1px solid #ececef; border-radius: 12px; padding: 12px 14px; }
.kpi .l { color: var(--muted); font-size: 13px; display: flex; align-items: center; gap: 6px; }
.kpi .v { font-size: 24px; font-weight: 500; letter-spacing: -.02em; margin-top: 4px; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 8px; }

/* ---------- Chats ---------- */
.chat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.chat-card { border: 1px solid #ececef; border-radius: 12px; padding: 14px; cursor: pointer; background: #fff; text-align: left; display: flex; flex-direction: column; gap: 6px; font-family: inherit; transition: border-color .15s, box-shadow .15s; }
.chat-card:hover { border-color: #d4d4d8; box-shadow: 0 4px 16px rgba(0,0,0,.05); }
.chat-card .qline { display: flex; gap: 8px; align-items: flex-start; font-weight: 500; }
.chat-card .qline span { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.chat-card .snip { color: var(--muted); font-size: 13px; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; padding-left: 26px; }
.chat-card .meta { display: flex; align-items: center; gap: 8px; padding-left: 26px; margin-top: 4px; font-size: 13px; color: var(--muted); }
.chat-card .meta .grow { flex: 1; }
.chat-list .tbl td { padding: 9px 12px; }
.chat-list .snip1 { display: block; max-width: 900px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Marcas ---------- */
.brand-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.bcard { border: 1px solid #ececef; border-radius: 12px; overflow: hidden; background: #fff; position: relative; display: flex; flex-direction: column; }
.bcard .band { height: 46px; }
.bcard .logo-tile { position: absolute; top: 22px; left: 14px; width: 44px; height: 44px; border-radius: 10px; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.1); display: grid; place-items: center; }
.bcard .inner { padding: 30px 14px 12px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.bcard .name { font-weight: 600; font-size: 15px; display: flex; align-items: center; gap: 6px; }
.bcard .sub { color: var(--muted); font-size: 13px; }
.bcard .row-b { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 6px; }
.bcard .dom { font-size: 12.5px; background: #f4f4f5; padding: 2px 8px; border-radius: 6px; color: var(--text-2); max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bcard .you { position: absolute; top: 10px; right: 10px; font-size: 12px; background: #fff; border: 1px solid #ececef; padding: 1px 8px; border-radius: 6px; }
.bcard .mini { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 4px; }
.bcard .mini div { background: #fafafa; border-radius: 8px; padding: 6px 8px; }
.bcard .mini span { display: block; font-size: 11.5px; color: var(--muted); }
.bcard .mini b { font-weight: 500; font-variant-numeric: tabular-nums; }
.bcard.is-click { cursor: pointer; }
.bcard.is-click:hover { border-color: #d4d4d8; }

/* ---------- Menus, modais, drawer ---------- */
.menu-pop { position: fixed; z-index: 60; background: #fff; border: 1px solid #ececef; border-radius: 12px; box-shadow: 0 14px 40px rgba(0,0,0,.12); padding: 6px; min-width: 240px; max-height: 70vh; overflow-y: auto; }
.menu-pop .mh { display: flex; align-items: center; gap: 8px; padding: 8px 10px; font-size: 14px; color: var(--text-2); }
.menu-pop .mi-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 0; background: none; border-radius: 8px; cursor: pointer; font-size: 14px; text-align: left; font-family: inherit; color: var(--text); }
.menu-pop .mi-row:hover { background: #f4f4f5; }
.menu-pop .mi-row .check { margin-left: auto; color: var(--text); visibility: hidden; }
.menu-pop .mi-row.on .check { visibility: visible; }
.menu-pop hr { border: 0; border-top: 1px solid #f0f0f2; margin: 4px 0; }
.menu-pop .seg { margin: 4px 10px 6px; }
.menu-pop .seg .segmented button { height: 28px; font-size: 13px; }

.overlay { position: fixed; inset: 0; background: rgba(17,17,19,.35); z-index: 70; display: flex; align-items: center; justify-content: center; padding: 16px; animation: fadeIn .15s ease; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.modal { background: #fff; border-radius: 16px; box-shadow: 0 30px 80px rgba(0,0,0,.25); width: 560px; max-width: 100%; max-height: calc(100vh - 32px); overflow: auto; }
.modal.wide { width: 1180px; }
.modal-b { padding: 20px 24px 22px; }
.modal-f { display: flex; justify-content: flex-end; gap: 8px; padding: 0 24px 20px; }
.modal h3 { margin: 0 0 4px; font-size: 17px; font-weight: 600; }
.modal .desc { margin: 0 0 18px; color: var(--muted); }
.modal .field label { color: var(--text-2); font-weight: 500; display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 14px; }
.modal .field label span { color: var(--muted); font-weight: 400; }
.overlay-drawer { justify-content: flex-end; padding: 10px; align-items: stretch; }
.drawer { background: #fff; border-radius: 14px; width: 560px; max-width: 100%; overflow: auto; box-shadow: 0 30px 80px rgba(0,0,0,.25); display: flex; flex-direction: column; animation: slideIn .2s ease; }
@keyframes slideIn { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } }
.drawer .dh { background: #f4f4f5; height: 90px; position: relative; flex: 0 0 auto; }
.drawer .dh .logo-tile { position: absolute; left: 30px; bottom: -30px; width: 76px; height: 76px; background: #fff; border-radius: 16px; box-shadow: 0 2px 10px rgba(0,0,0,.1); display: grid; place-items: center; }
.drawer .dh .close { position: absolute; top: 12px; right: 12px; }
.drawer .db { padding: 48px 30px 20px; flex: 1; }
.drawer .df { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 30px 22px; border-top: 1px solid #f0f0f2; position: sticky; bottom: 0; background: #fff; }
.drawer .sec { padding: 20px 0; border-bottom: 1px solid #f0f0f2; }
.drawer .sec:last-child { border-bottom: 0; }
.drawer .sec h4 { margin: 0 0 4px; font-size: 15px; font-weight: 600; }
.drawer .sec p.h { margin: 0 0 12px; color: var(--muted); font-size: 13.5px; }
.drawer .line-input { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }
.drawer .mini-list { display: flex; flex-direction: column; }
.drawer .mini-list a, .drawer .mini-list button { display: flex; align-items: center; gap: 10px; padding: 9px 0; border: 0; border-bottom: 1px solid #f4f4f5; background: none; text-align: left; font-family: inherit; font-size: 14px; cursor: pointer; color: var(--text); width: 100%; }
.drawer .mini-list a:hover .t, .drawer .mini-list button:hover .t { text-decoration: underline; }
.drawer .mini-list .t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.drawer .kv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.drawer .kv div { background: #fafafa; border-radius: 10px; padding: 10px; }
.drawer .kv span { display: block; font-size: 12px; color: var(--muted); }
.drawer .kv b { font-size: 18px; font-weight: 500; }

/* Chat */
.chat-top { display: flex; align-items: center; gap: 8px; padding: 14px 18px; border-bottom: 1px solid #f0f0f2; flex-wrap: wrap; }
.chip-s { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px; border: 1px solid #ececef; border-radius: 8px; font-size: 13.5px; background: #fff; }
.chip-s.ok { color: #15803d; } .chip-s.ok::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #16a34a; }
.chat-body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; min-height: 520px; }
.chat-conv { padding: 22px 26px; border-right: 1px solid #f0f0f2; }
.bubble-user { display: flex; justify-content: flex-end; gap: 12px; align-items: center; margin-bottom: 22px; }
.bubble-user .b { background: #f4f4f5; border-radius: 14px; padding: 12px 16px; font-size: 15px; cursor: pointer; }
.bubble-user .b:hover { background: #ececef; }
.avatar-round { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 40px; }
.bubble-ai { display: flex; gap: 14px; }
.bubble-ai .content { background: #fafafa; border-radius: 14px; padding: 18px 20px; font-size: 15px; line-height: 1.65; color: #27272a; flex: 1; min-width: 0; }
.bubble-ai .content h5 { font-size: 16px; margin: 16px 0 4px; font-weight: 600; }
.bubble-ai .content ul { margin: 4px 0 8px; padding-left: 20px; }
.mention { display: inline-flex; align-items: center; gap: 4px; padding: 0 5px; border: 1.5px dashed #f59e0b; border-radius: 6px; background: #fffbeb; }
.mention.own { border-color: #1baf7a; background: #effbf6; }
.sent-dot { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; padding: 0 7px; border: 1px solid #ececef; border-radius: 99px; background: #fff; margin-left: 6px; vertical-align: 1px; }
.sent-dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #71717a; }
.cite { font-size: 11px; vertical-align: super; color: #2a78d6; margin-left: 1px; }
.chat-side { padding: 22px; }
.chat-side h6 { font-size: 14px; margin: 0 0 10px; font-weight: 500; color: var(--text-2); }
.chat-side .list a, .chat-side .list button { display: flex; align-items: center; gap: 10px; padding: 8px 8px; border-radius: 8px; border: 0; background: none; width: 100%; cursor: pointer; font-family: inherit; font-size: 14px; text-align: left; color: var(--text); }
.chat-side .list a:hover, .chat-side .list button:hover { background: #f4f4f5; }
.chat-side .list .t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.toast { left: auto; right: 24px; bottom: 24px; }

@media (max-width: 1200px) {
  .grid-ov, .grid-src-top { grid-template-columns: 1fr; }
  .chat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .dash { grid-template-columns: 1fr; }
  .d-side { position: fixed; inset: 0 auto 0 0; width: 260px; z-index: 50; box-shadow: 0 0 40px rgba(0,0,0,.2); transform: translateX(-105%); transition: transform .2s; }
  .dash.side-open .d-side { transform: none; visibility: visible; }
  .dash.side-collapsed .d-side { visibility: visible; }
  .d-menu-btn { display: grid; }
  .d-content { margin: 0 8px 8px; }
  .grid-src { grid-template-columns: 1fr; }
  .chat-grid { grid-template-columns: 1fr; }
  .chat-body { grid-template-columns: 1fr; }
  .chat-conv { border-right: 0; }
  .d-top { padding-left: 8px; align-items: flex-start; }
  .search input { width: 100%; }
}

/* ---------- Percepção de marca ---------- */
.perc-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); border: 1px solid #ececef; border-radius: 12px; overflow: hidden; background: #fff; }
.perc-summary > div { padding: 12px 16px; border-right: 1px solid #f2f2f4; }
.perc-summary > div:last-child { border-right: 0; }
.perc-summary .l { font-size: 12.5px; color: var(--muted); display: flex; align-items: center; gap: 5px; }
.perc-summary .v { font-size: 16px; font-weight: 500; margin-top: 4px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.perc-summary .v small { font-size: 12.5px; color: var(--muted); font-weight: 400; }
.perc-headline { font-size: 19px; font-weight: 500; letter-spacing: -.01em; line-height: 1.4; margin: 4px 0 14px; }
.perc-headline b { font-weight: 600; }
.assoc-row { display: grid; grid-template-columns: 1fr 44px; gap: 10px; align-items: center; padding: 5px 0; }
.assoc-bar { position: relative; height: 34px; border-radius: 8px; background: #f4f4f5; display: flex; align-items: center; overflow: hidden; }
.assoc-bar i { position: absolute; inset: 0 auto 0 0; background: #ececef; border-radius: 8px; }
.assoc-bar span { position: relative; padding: 0 12px; font-size: 14px; }
.assoc-row b { text-align: right; font-weight: 500; font-variant-numeric: tabular-nums; }
.radar-grid polygon, .radar-grid line { stroke-width: 1; }
.radar-label { fill: #52525b; font-size: 12.5px; font-family: var(--font); }
.heat td, .heat th { text-align: center; }
.heat th:first-child, .heat td:first-child { text-align: left; white-space: nowrap; }
.heat .cell { display: block; border-radius: 6px; padding: 7px 0; font-variant-numeric: tabular-nums; font-size: 13px; }
.heat .best { outline: 2px solid #111113; outline-offset: -2px; border-radius: 6px; }
.heat th { font-size: 12px; line-height: 1.25; white-space: normal; max-width: 92px; vertical-align: bottom; }
.scale { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.scale i { width: 60px; height: 8px; border-radius: 99px; background: linear-gradient(90deg, #eef4fd, #2a78d6); }
.attr-row td { cursor: pointer; }
.attr-src { background: #fafafa; }
.attr-src .tbl { background: transparent; }
.rank-pill { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 6px; background: #f1f1f3; font-size: 13px; font-variant-numeric: tabular-nums; }
.rank-pill.good { background: #e8f6ec; color: #15803d; }
.rank-pill.bad { background: #fdecec; color: #c62828; }
.fact-row { display: grid; grid-template-columns: 200px 1fr 1fr 120px; gap: 12px; padding: 14px 16px; border-bottom: 1px solid #f2f2f4; align-items: start; font-size: 14px; }
.fact-row:last-child { border-bottom: 0; }
.fact-row .k { color: var(--muted); }
.obj-row { display: grid; grid-template-columns: 1fr 180px 120px; gap: 14px; align-items: center; padding: 14px 16px; border-bottom: 1px solid #f2f2f4; }
.obj-row:last-child { border-bottom: 0; }
.obj-bar { height: 8px; border-radius: 99px; background: #f1f1f3; overflow: hidden; }
.obj-bar i { display: block; height: 100%; background: #eb6834; border-radius: 99px; }
@media (max-width: 900px) { .fact-row, .obj-row { grid-template-columns: 1fr; } }

/* ---------- Insights ---------- */
.rank-cell { display: flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 8px; background: #fafafa; font-size: 13px; max-width: 150px; }
.rank-cell.is-you { background: #fff4e6; border: 1px solid #fcd9a8; font-weight: 500; }
.rank-cell b { font-size: 11px; color: #b45309; font-weight: 500; }
.tbl .heat .cell { min-width: 62px; }
.card-h .tabs button { height: 26px; font-size: 13px; padding: 0 9px; }
.kpis .kpi .v { font-size: 21px; }
@media (max-width: 1300px) { .kpis { grid-template-columns: repeat(3, minmax(0,1fr)) !important; } }


/* ---------------- Empresas ---------------- */
.co-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.co-card { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 16px; display: flex; flex-direction: column; gap: 12px; cursor: pointer; transition: box-shadow .15s, border-color .15s, transform .15s; }
.co-card:hover { border-color: #d7d7dd; box-shadow: 0 6px 20px rgba(16,16,20,.07); transform: translateY(-1px); }
.co-card.is-current { border-color: var(--focus); box-shadow: 0 0 0 3px var(--focus-ring); }
.co-top { display: flex; align-items: center; gap: 12px; min-width: 0; }
.co-top .logo, .co-top img, .co-top .avatar { flex: 0 0 auto; }
.co-id { min-width: 0; flex: 1; }
.co-id b { display: block; font-weight: 600; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.co-id span { display: block; color: var(--muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.co-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px; }
.co-meta div { display: flex; flex-direction: column; gap: 2px; }
.co-meta span { color: var(--muted); font-size: 11.5px; text-transform: uppercase; letter-spacing: .03em; }
.co-meta b { font-weight: 500; font-size: 13.5px; }
.co-foot { display: flex; align-items: center; gap: 8px; border-top: 1px solid #f2f2f4; padding-top: 11px; margin-top: auto; }
.co-foot > .small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.co-foot .right { margin-left: auto; display: flex; gap: 6px; }
.co-new { border: 1px dashed #d4d4da; background: #fcfcfd; align-items: center; justify-content: center; text-align: center; color: var(--muted); min-height: 190px; gap: 8px; }
.co-new:hover { border-color: var(--focus); color: var(--text); }
.co-more { flex: 0 0 auto; margin-left: auto; opacity: 0; transition: opacity .12s; }
.co-card:hover .co-more, .co-more:focus-visible, .co-card:focus-within .co-more { opacity: 1; }
.mi-row.is-off { color: var(--label); cursor: default; }
.mi-row.danger { color: #dc2626; }
.mi-row.danger:hover { background: #fef2f2; }
.co-new .plus { width: 40px; height: 40px; border-radius: 12px; background: #f1f1f4; display: grid; place-items: center; color: var(--text); }


/* ---------------- Ações (insights SEO/AEO e GEO) ---------------- */
.ins-top { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-bottom: 14px; }
.ins-stats { display: flex; gap: 8px; flex-wrap: wrap; }
.ins-stat { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 9px 16px 8px; cursor: pointer; min-width: 104px; text-align: left; font: inherit; transition: border-color .12s, box-shadow .12s; }
.ins-stat b { font-size: 21px; font-weight: 600; line-height: 1.1; }
.ins-stat span { font-size: 12px; color: var(--muted); }
.ins-stat:hover { border-color: #d4d4d8; }
.ins-stat.is-on { border-color: var(--text); box-shadow: 0 0 0 1px var(--text); }
.ins-stat.tone-green b { color: #16a34a; } .ins-stat.tone-blue b { color: #2563eb; }
.ins-stat.tone-yellow b { color: #b45309; } .ins-stat.tone-gray b { color: var(--muted); }
.ins-prog { display: flex; flex-direction: column; gap: 5px; min-width: 200px; flex: 1; max-width: 340px; }
.ins-prog .bar { height: 7px; border-radius: 4px; background: #ececef; overflow: hidden; }
.ins-prog .bar i { display: block; height: 100%; background: #16a34a; border-radius: 4px; transition: width .3s; }
.ins-models { margin: 0 0 14px; gap: 6px; }

.ins-grid { display: grid; gap: 12px; margin-bottom: 20px; }
.ins { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 15px 17px; }
.ins h4 { margin: 9px 0 6px; font-size: 16.5px; font-weight: 600; line-height: 1.35; }
.ins-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ins-h .right { margin-left: auto; }
.ins-why { margin: 0 0 11px; color: var(--text-2); font-size: 14px; line-height: 1.5; }
.ins-model { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; background: #f4f4f5; border-radius: 20px; padding: 3px 9px 3px 4px; }
.ins-steps { border-top: 1px solid #f2f2f4; padding-top: 9px; }
.ins-steps summary { cursor: pointer; font-size: 13.5px; font-weight: 500; list-style: none; display: flex; align-items: center; gap: 6px; }
.ins-steps summary::-webkit-details-marker { display: none; }
.ins-steps summary::before { content: "▸"; color: var(--muted); }
.ins-steps[open] summary::before { content: "▾"; }
.ins-steps ol { margin: 10px 0 4px; padding-left: 20px; display: flex; flex-direction: column; gap: 7px; }
.ins-steps li { font-size: 14px; line-height: 1.5; color: var(--text-2); }
.ins-steps li.has-code { list-style: none; margin-left: -20px; }
.codebox { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: #fbfbfd; margin: 4px 0; }
.codebox-h { display: flex; align-items: center; gap: 8px; padding: 7px 10px; background: #f4f4f5; border-bottom: 1px solid var(--border); font-size: 12px; color: var(--muted); }
.codebox-h .btn { margin-left: auto; }
.codebox pre { margin: 0; padding: 11px 13px; overflow-x: auto; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; line-height: 1.55; white-space: pre; color: #1f2937; }
.ins-helps { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; border-top: 1px solid #f2f2f4; margin-top: 11px; padding-top: 10px; }
.ins-helps .lbl { font-size: 12px; color: var(--muted); }
.ins-shared { font-size: 12px; color: var(--muted); margin-left: 2px; }
.ins-help { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; background: #f6f6f7; border: 1px solid var(--border); border-radius: 20px; padding: 3px 10px; max-width: 380px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ins-f { display: flex; align-items: center; gap: 8px; margin-top: 11px; }
.ins-f .right { margin-left: auto; display: flex; gap: 6px; flex-wrap: wrap; }
.ins.st-done { background: #fafdfb; border-color: #cfe9d8; }
.ins.st-done h4 { color: var(--muted); text-decoration: line-through; text-decoration-color: #cfe9d8; }
.ins.st-dropped, .ins.st-snoozed { background: #fcfcfd; }
.ins.st-dropped h4 { color: var(--muted); }

/* ---------------- Conexão ---------------- */
.conn-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(380px, 1fr)); gap: 14px; }
.conn.is-on { border-color: #cfe9d8; }
.conn-gives { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.conn-gives li { display: flex; align-items: center; gap: 7px; font-size: 13.5px; color: var(--text-2); }
.conn-gives svg { color: #16a34a; flex: 0 0 auto; }
.conn-f { display: flex; align-items: center; gap: 8px; border-top: 1px solid #f2f2f4; padding-top: 12px; margin-top: 12px; }
.conn-f .btn:last-child { margin-left: auto; }
.conn-f .muted + .btn { margin-left: auto; }
.conn-how { margin: 10px 0 12px; padding-left: 20px; display: flex; flex-direction: column; gap: 7px; font-size: 14px; color: var(--text-2); line-height: 1.5; }
@media (max-width: 720px) { .conn-grid { grid-template-columns: 1fr; } }


/* ---------------- Ficha da empresa ---------------- */
.sheet .sheet-bar { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 10px; background: #f6f6f7; padding: 2px 0 12px; }
.sheet .sheet-bar .right { margin-left: auto; display: flex; gap: 6px; }
.sheet-bar.is-dirty .muted { color: #b45309; }
.sheet-card { margin-bottom: 14px; }
.sheet-card .card-b { padding: 16px 18px; }
.sheet-card .card-b.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.sheet-card .field { margin-bottom: 14px; }
.sheet-card .field:last-child { margin-bottom: 0; }
.sheet-card .field > label { display: block; font-size: 13px; color: var(--label); margin-bottom: 6px; }
.sheet-card .hint { display: block; font-size: 12px; color: var(--muted); margin-top: 5px; }
.sheet-list { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.sheet-row { display: flex; gap: 8px; width: 100%; align-items: center; }
.sheet-row.two { display: grid; grid-template-columns: 1fr 1fr auto; }
.sheet-models { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; }
.sheet-models .mdl, .us-comps .mdl, .mdl { position: relative; display: flex; align-items: center; gap: 9px; border: 1px solid var(--border); border-radius: 10px; padding: 9px 12px; cursor: pointer; background: #fff; }
.sheet-models .mdl.is-on, .us-comps .mdl.is-on, .mdl.is-on { border-color: var(--text); }
.mdl input { accent-color: #111113; }
.mdl > span:last-child { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; flex: 1; }
.mdl .avatar, .mdl img, .mdl svg { flex: 0 0 auto; }
.mdl b { display: block; font-weight: 500; font-size: 13.5px; }
.mdl i { display: block; font-style: normal; font-size: 11.5px; color: var(--muted); }
.sheet-freq { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.sheet-freq .frq, .frq { position: relative; display: flex; flex-direction: column; gap: 2px; border: 1px solid var(--border); border-radius: 10px; padding: 10px 13px; cursor: pointer; background: #fff; }
.sheet-freq .frq.is-on, .frq.is-on { border-color: var(--text); box-shadow: 0 0 0 1px var(--text); }
.frq input { position: absolute; opacity: 0; pointer-events: none; }
.frq b { display: block; font-weight: 500; font-size: 14px; }
.frq i { display: block; font-style: normal; font-size: 12px; color: var(--muted); }
.sheet-credits { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.sheet-credits .bar { height: 7px; border-radius: 4px; background: #ececef; overflow: hidden; max-width: 460px; }
.sheet-credits .bar i { display: block; height: 100%; background: #111113; }
.danger-card .card-b { display: flex; align-items: center; gap: 14px; }
.danger-card .card-b > div { flex: 1; }
@media (max-width: 760px) { .sheet-card .card-b.grid2 { grid-template-columns: 1fr; } }

/* ---------------- Conexão (passos e campos) ---------------- */
.conn-steps { border-top: 1px solid #f2f2f4; margin-top: 4px; padding-top: 10px; }
.conn-steps summary { cursor: pointer; font-size: 13.5px; font-weight: 500; list-style: none; display: flex; align-items: center; gap: 6px; }
.conn-steps summary::-webkit-details-marker { display: none; }
.conn-steps summary::before { content: "▸"; color: var(--muted); }
.conn-steps[open] summary::before { content: "▾"; }
.conn-steps ol { margin: 10px 0 6px; padding-left: 20px; display: flex; flex-direction: column; gap: 9px; font-size: 13.5px; color: var(--text-2); line-height: 1.5; }
.conn-steps code { background: #f4f4f5; border-radius: 4px; padding: 1px 5px; font-size: 12px; }
.conn-fields { display: grid; grid-template-columns: 1fr; gap: 12px; border-top: 1px solid #f2f2f4; margin-top: 12px; padding-top: 14px; }
.conn-fields label { display: block; font-size: 13px; color: var(--label); margin-bottom: 6px; }
.conn-fields .hint { display: block; font-size: 12px; color: var(--muted); margin-top: 5px; }
.conn-err { margin: 10px 0 0; display: flex; align-items: center; gap: 6px; font-size: 13px; color: #dc2626; }
.key-shown { display: flex; align-items: center; gap: 10px; background: #f6f6f7; border: 1px solid var(--border); border-radius: 8px; padding: 9px 12px; }
.key-shown code { font-size: 13px; letter-spacing: .5px; }
.tab .n { margin-left: 7px; color: var(--muted); font-size: 12px; background: #f1f1f4; border-radius: 20px; padding: 1px 7px; }
.tab.is-active .n { background: #ececef; color: var(--text); }


/* ---------------- Login ---------------- */
.login { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; padding: 24px; background: #f6f6f7; }
.login-box { width: 100%; max-width: 380px; background: #fff; border: 1px solid var(--border); border-radius: 16px; padding: 30px 30px 26px; box-shadow: 0 18px 50px -30px rgba(17,17,19,.25); }
.login-box .brand-mark { display: flex; align-items: center; gap: 9px; margin-bottom: 22px; }
.login-box .brand-name { font-weight: 600; font-size: 17px; }
.login-box h1 { margin: 0 0 4px; font-size: 22px; font-weight: 600; }
.login-sub { margin: 0 0 22px; color: var(--muted); font-size: 13.5px; }
.login-box .field { margin-bottom: 14px; }
.login-box label { display: block; font-size: 13px; color: var(--label); margin-bottom: 6px; }
.login-box .btn-primary { width: 100%; justify-content: center; height: 42px; margin-top: 6px; }
.login-err { display: flex; align-items: center; gap: 6px; background: #fef2f2; border: 1px solid #f6d5d5; color: #b91c1c; font-size: 13px; border-radius: 8px; padding: 9px 12px; margin: 0 0 12px; }
.login-foot { margin: 16px 0 0; text-align: center; font-size: 12.5px; color: var(--muted); }
.login-legal { color: var(--muted); font-size: 12px; }
.login-foot a { color: var(--ink, #111113); font-weight: 500; }
.login-box .field-hint { margin: 6px 0 0; font-size: 12px; color: var(--muted); }
.login-box .check { display: flex; align-items: flex-start; gap: 9px; margin: 4px 0 2px; font-size: 12.5px; color: var(--label); line-height: 1.5; cursor: pointer; }
.login-box .check input { margin-top: 2px; flex: 0 0 auto; }
.login-box .check a { color: var(--ink, #111113); }
.login-box .btn-primary[disabled] { opacity: .6; cursor: default; }

/* ---------------- Pessoas ---------------- */
.tbl tr.is-off td { opacity: .55; }
.us-comps { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; max-height: 260px; overflow: auto; padding: 2px; }
.us-comps .mdl i { font-style: normal; font-size: 11.5px; color: var(--muted); }
.side-user { display: flex; align-items: center; gap: 9px; border-top: 1px solid var(--border); padding: 11px 12px; margin-top: auto; }
.side-user .who { min-width: 0; flex: 1; line-height: 1.25; }
.side-user .who b { display: block; font-weight: 500; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.side-user .who span { font-size: 11.5px; color: var(--muted); }
@media (max-width: 640px) { .us-comps { grid-template-columns: 1fr; } }


/* ---------------- Amostra, ruído e evidência ---------------- */
.kpi { text-align: left; font: inherit; background: #fff; cursor: pointer; transition: border-color .12s, box-shadow .12s; }
.kpi:hover { border-color: #d4d4d8; box-shadow: 0 4px 14px rgba(16,16,20,.06); }
.kpi:hover .kpi-n { color: var(--text-2); }
.kpi-n { margin-top: 6px; font-size: 11.5px; color: var(--muted); line-height: 1.35; }
.delta.is-noise { color: #a1a1aa; font-size: 15px; line-height: 1; cursor: help; }
.chart-note { display: flex; align-items: center; gap: 6px; margin: 8px 16px 14px; font-size: 12px; color: var(--muted); line-height: 1.4; }
.chart-note svg { flex: 0 0 auto; }
.ev-h { display: flex; align-items: center; gap: 9px; padding: 16px 18px; border-bottom: 1px solid var(--border); font-size: 15px; }
.ev-h .close { margin-left: auto; }
.chat-grid.one { grid-template-columns: 1fr; }


/* Marcadores de ação concluída no gráfico */
.chart-ev-line { stroke: #9ca3af; stroke-dasharray: 4 3; stroke-width: 1; }
.chart-ev-dot { fill: #111113; stroke: #fff; stroke-width: 2; cursor: help; }
.chart-note .ev-key { width: 14px; height: 0; border-top: 1px dashed #9ca3af; display: inline-block; flex: 0 0 auto; }

/* Efeito da ação concluída */
.ins-effect { display: flex; align-items: flex-start; gap: 7px; margin-top: 11px; padding: 9px 11px; border-radius: 9px; font-size: 13px; line-height: 1.45; background: #f6f6f7; color: var(--text-2); }
.ins-effect.up { background: #eefbf3; color: #14663c; }
.ins-effect.down { background: #fef2f2; color: #9f1239; }
.ins-effect.wait { background: #fbfbfd; color: var(--muted); }
.ins-effect svg { flex: 0 0 auto; margin-top: 1px; }


/* ---------------- Relatórios ---------------- */
.rp-doc { max-width: 940px; }
.rp-head { display: flex; align-items: flex-start; gap: 18px; background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 20px 22px; margin-bottom: 14px; }
.rp-brand { display: flex; align-items: center; gap: 12px; }
.rp-brand b { display: block; font-size: 16px; font-weight: 600; }
.rp-brand span { font-size: 12.5px; color: var(--muted); }
.rp-meta { margin-left: auto; text-align: right; display: flex; flex-direction: column; gap: 2px; }
.rp-meta b { font-size: 14px; font-weight: 600; }
.rp-meta span { font-size: 12.5px; color: var(--text-2); }
.rp-sec { background: #fff; border: 1px solid var(--border); border-radius: 14px; padding: 18px 22px 20px; margin-bottom: 14px; }
.rp-sec h3 { margin: 0 0 12px; font-size: 15px; font-weight: 600; }
.rp-h4 { margin: 14px 0 8px; font-size: 13px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.rp-sum p { margin: 0 0 8px; font-size: 14.5px; line-height: 1.6; color: var(--text-2); }
.rp-sum b { color: var(--text); font-weight: 600; }
.rp-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 16px; }
.rp-kpi { border: 1px solid var(--border); border-radius: 11px; padding: 11px 13px; display: flex; flex-direction: column; gap: 3px; }
.rp-kpi .l { font-size: 12px; color: var(--muted); }
.rp-kpi .v { font-size: 23px; font-weight: 500; font-variant-numeric: tabular-nums; }
.rp-kpi .p { font-size: 12px; display: flex; align-items: center; gap: 6px; }
.rp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.rp-bars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.rp-bars li { display: flex; align-items: center; gap: 10px; font-size: 13.5px; }
.rp-bars .n { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-2); }
.rp-bars .bar { width: 120px; height: 7px; border-radius: 4px; background: #ececef; overflow: hidden; flex: 0 0 auto; }
.rp-bars .bar i { display: block; height: 100%; background: #2a78d6; }
.rp-bars b { width: 44px; text-align: right; font-variant-numeric: tabular-nums; font-weight: 500; }
.rp-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rp-list li { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; line-height: 1.5; color: var(--text-2); }
.rp-list svg { flex: 0 0 auto; margin-top: 3px; color: #16a34a; }
.rp-list b.up { color: #16a34a; } .rp-list b.down { color: #dc2626; }
.rp-method p { margin: 0; font-size: 13px; line-height: 1.6; }
.rp-foot { text-align: center; color: var(--muted); font-size: 12px; padding: 6px 0 24px; }
.tbl tr.is-own td { background: #f8fbff; }
body.mode-report .dash { grid-template-columns: 1fr; }
body.mode-report .d-side, body.mode-report .d-top { display: none; }
body.mode-report .d-content { margin: 14px; padding-top: 22px; }
body.mode-report .rp-doc { margin: 0 auto; }
@media (max-width: 760px) { .rp-cols { grid-template-columns: 1fr; } .rp-head { flex-direction: column; } .rp-meta { margin-left: 0; text-align: left; } }

@media print {
  .dash { grid-template-columns: 1fr !important; height: auto !important; overflow: visible !important; }
  .d-main, .d-content { height: auto !important; overflow: visible !important; margin: 0 !important; border: 0 !important; }
  .d-side, .d-top, .v-head, .toast, .menu-pop, .overlay, .chart-note { display: none !important; }
  body, body.mode-dash { background: #fff; }
  .d-content, .v-body { padding: 0 !important; overflow: visible !important; }
  .rp-doc { max-width: none; }
  .rp-sec, .rp-head { break-inside: avoid; border-color: #ddd; box-shadow: none; }
  .rp-cols { grid-template-columns: 1fr 1fr; }
}


/* ---------------- Faixa de primeira coleta ---------------- */
#banner:not([hidden]) { padding: 0 14px 12px 0; }
.banner { position: relative; display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid #d8e6f8; border-radius: 12px; padding: 12px 16px 14px; overflow: hidden; }
.banner.run { background: linear-gradient(180deg, #f7fbff, #fff); }
.bn-txt { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.bn-txt b { font-size: 14px; font-weight: 600; }
.bn-txt span { font-size: 12.5px; color: var(--muted); line-height: 1.4; }
.bn-models { display: flex; gap: 6px; flex: 0 0 auto; }
.bn-m { opacity: .35; filter: grayscale(1); display: inline-flex; }
.bn-m.ok { opacity: 1; filter: none; }
.bn-act { flex: 0 0 auto; }
.bn-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: #e8eef6; }
.bn-bar i { display: block; height: 100%; background: #2a78d6; transition: width .6s; }
.spin { width: 16px; height: 16px; border-radius: 50%; border: 2px solid #cfe0f5; border-top-color: #2a78d6; animation: spin 1s linear infinite; flex: 0 0 auto; }
@keyframes spin { to { transform: rotate(360deg); } }
.guide-list { list-style: none; margin: 14px 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.guide-list li { display: flex; align-items: flex-start; gap: 9px; font-size: 14px; line-height: 1.5; color: var(--text-2); }
.guide-list svg { flex: 0 0 auto; margin-top: 2px; color: var(--muted); }

/* ---------------- Esqueleto de carregamento ---------------- */
.skel-wrap { padding: 22px 22px 0; display: flex; flex-direction: column; gap: 14px; }
.skel { background: linear-gradient(90deg, #f1f1f4 25%, #e9e9ee 37%, #f1f1f4 63%); background-size: 400% 100%; animation: shimmer 1.4s ease infinite; border-radius: 10px; height: 16px; }
.skel-head { height: 26px; width: 240px; }
.skel-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.skel-row > div { height: 84px; border-radius: 12px; background: linear-gradient(90deg, #f1f1f4 25%, #e9e9ee 37%, #f1f1f4 63%); background-size: 400% 100%; animation: shimmer 1.4s ease infinite; }
@keyframes shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

.toast { display: flex; align-items: center; gap: 14px; }
.toast-undo { background: transparent; border: 0; color: #93c5fd; font: inherit; font-weight: 600; cursor: pointer; padding: 0; text-decoration: underline; }
.mi-empty { padding: 10px 12px; font-size: 12.5px; color: var(--muted); line-height: 1.45; max-width: 260px; }
.mi-row .check[data-del-view] { cursor: pointer; opacity: .5; }
.mi-row .check[data-del-view]:hover { opacity: 1; color: #dc2626; }


/* ---------------- Paleta de comandos ---------------- */
.plt-overlay { align-items: flex-start; justify-content: center; padding-top: 12vh; background: rgba(17,17,19,.32); }
.plt { width: 620px; max-width: 94vw; background: #fff; border-radius: 14px; box-shadow: 0 30px 80px rgba(0,0,0,.28); display: flex; flex-direction: column; overflow: hidden; animation: slideIn .14s ease; }
.plt-h { display: flex; align-items: center; gap: 10px; padding: 13px 15px; border-bottom: 1px solid var(--border); color: var(--muted); }
.plt-h input { flex: 1; border: 0; outline: none; font: inherit; font-size: 15px; color: var(--text); background: transparent; }
.plt-h .kbd { font-size: 11px; color: var(--muted); border: 1px solid var(--border); border-radius: 5px; padding: 2px 6px; }
.plt-list { max-height: 54vh; overflow-y: auto; padding: 6px; }
.plt-g { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--label); padding: 10px 10px 5px; }
.plt-row { display: flex; align-items: center; gap: 10px; width: 100%; background: transparent; border: 0; border-radius: 9px; padding: 8px 10px; cursor: pointer; text-align: left; font: inherit; }
.plt-row.is-sel { background: #f4f4f5; }
.plt-row .ic { width: 20px; display: inline-flex; justify-content: center; color: var(--muted); flex: 0 0 auto; }
.plt-row .tx { min-width: 0; flex: 1; display: flex; flex-direction: column; line-height: 1.3; }
.plt-row .tx b { font-weight: 500; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plt-row .tx span { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plt-row .k { font-size: 11px; color: var(--muted); opacity: 0; flex: 0 0 auto; }
.plt-row.is-sel .k { opacity: 1; }
.plt-f { display: flex; align-items: center; gap: 7px; padding: 9px 15px; border-top: 1px solid var(--border); font-size: 11.5px; color: var(--muted); background: #fbfbfd; }

/* ---------------- Responsivo: Visão geral e Ações ---------------- */
@media (max-width: 720px) {
  .kpis { grid-template-columns: 1fr 1fr; }
  .ins-top { flex-direction: column; align-items: stretch; gap: 10px; }
  .ins-prog { max-width: none; }
  .ins-stats { display: grid; grid-template-columns: 1fr 1fr; }
  .ins-stat { min-width: 0; }
  .ins-f { flex-wrap: wrap; }
  .ins-f .right { width: 100%; }
  .ins-f .right .btn { flex: 1; justify-content: center; }
  .banner { flex-wrap: wrap; }
  .bn-models, .bn-act { order: 3; }
  .rp-kpis { grid-template-columns: 1fr 1fr; }
  .plt-overlay { padding-top: 6vh; }
}
@media (max-width: 720px) {
  .v-head { flex-wrap: wrap; row-gap: 3px; padding-bottom: 12px; }
  .v-head .crumb, .v-head .right { flex-basis: 100%; margin-left: 0; text-align: left; font-size: 12.5px; }
  .ins h4, .ins-why, .ins-steps li, .rp-sum p { overflow-wrap: anywhere; }
  .ins, .ins-grid, .card, .tbl-box { min-width: 0; }
  .codebox pre { white-space: pre-wrap; word-break: break-word; }
  .ins-steps ol { padding-left: 18px; }
  .ins-help { max-width: 100%; }
  .d-content { margin: 0 8px 8px 0; }
  .v-body { padding-left: 14px; padding-right: 14px; }
  .section-h { flex-wrap: wrap; }
}
@media (max-width: 460px) {
  .kpis { grid-template-columns: 1fr; }
  .ins-h { gap: 5px; }
  .ins h4 { font-size: 15.5px; }
  .codebox pre { font-size: 11.5px; }
}


/* Relatório: citações por território */
.rp-lead { margin: -4px 0 14px; font-size: 13.5px; color: var(--muted); line-height: 1.55; }
.rp-cap { margin: 4px 0 16px; font-size: 12px; color: var(--muted); }
.wb { width: 100%; max-width: 660px; height: auto; display: block; margin: 0 auto; }
.wb .wb-g { stroke: #ececef; stroke-width: 1; }
.wb .wb-l { font-size: 10px; fill: #8b8b93; }
.wb .wb-v { font-size: 10.5px; fill: #52525b; font-weight: 500; }
.spk { width: 74px; height: 22px; display: block; }
.rp-cit td { vertical-align: middle; }
.rp-cit b.up { color: #16a34a; } .rp-cit b.down { color: #dc2626; }
.rp-total td { background: #fafafa; font-weight: 500; border-top: 1px solid var(--border); }


/* Faixa: estados de conexão pendente e pronta */
.banner.todo { border-color: #f5e3c0; background: linear-gradient(180deg, #fffcf5, #fff); }
.banner.ready { border-color: #cfe9d8; background: linear-gradient(180deg, #f6fdf9, #fff); }
.banner .bn-ic { display: inline-flex; flex: 0 0 auto; }
.banner.todo .bn-ic { color: #b45309; }
.banner.ready .bn-ic { color: #16a34a; }
.banner.todo .bn-bar i { background: #eab308; }
.banner.ready .bn-bar i { background: #16a34a; }
.guide-check { list-style: none; margin: 14px 0 6px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.guide-check li { display: flex; align-items: center; gap: 9px; font-size: 14px; color: var(--text-2); }
.guide-check li svg { flex: 0 0 auto; color: #dc2626; }
.guide-check li.ok svg { color: #16a34a; }
.guide-check li.sub { margin: -4px 0 4px 24px; font-size: 12.5px; color: var(--muted); }