/* tokens/colors.css */
/* ZapData — color tokens. Base ramps first, semantic aliases after. */
:root{
/* Brand — Laranja ZapData */
--zd-orange-50:#FEF1EA;   /* fundo suave de seleção */
--zd-orange-100:#FDE0CF;  /* realce claro */
--zd-orange-200:#FBC3A3;  /* borda de seleção / faixa clara da hachura */
--zd-orange-500:#F25B00;  /* Laranja ZapData oficial (cor do ícone) — marca, ação principal, dados. 3,35:1 sobre branco */
--zd-orange-600:#DA5100;  /* hover da ação principal */
--zd-orange-700:#B03F00;  /* laranja escuro — texto laranja e fundos com texto branco (5,9:1) */
--zd-orange-800:#8C3200;  /* laranja pressionado */
--zd-orange-hatch:#FBC3A3;/* faixa clara do padrão hachurado */

/* Neutrals */
--zd-white:#FFFFFF;
--zd-gray-25:#F4F4F2;  /* fundo da aplicação e da sidebar (cinza neutro-quente) */
--zd-gray-50:#EFEFEC;  /* fundo secundário, trilhos, barras-fantasma */
--zd-gray-100:#E6E6E2; /* hover sobre fundo secundário */
--zd-gray-200:#E3E3DF; /* divisórias discretas */
--zd-gray-400:#A3A6A9; /* desabilitado (não-texto) */
--zd-gray-500:#8A8F94; /* borda de campo (3,3:1) */
--zd-gray-600:#62676D; /* texto auxiliar (5,0:1 no fundo secundário) */
--zd-gray-700:#50555B; /* texto secundário */
--zd-gray-900:#17191C; /* texto principal, botão escuro, controles ativos */

/* Semantic ramps */
--zd-green-700:#166534; --zd-green-50:#EAF6ED; --zd-green-200:#B7DFC2;
--zd-amber-700:#854D0E; --zd-amber-50:#FFF4D6; --zd-amber-200:#F2D48A;
--zd-red-700:#B42318;   --zd-red-50:#FEECEB;   --zd-red-200:#F5B9B4;
--zd-blue-700:#1E40AF;  --zd-blue-50:#EDF3FF;  --zd-blue-200:#BCD0F7;

/* ---- Semantic aliases ---- */
--brand:var(--zd-orange-500);
--brand-hover:var(--zd-orange-600);
--brand-mark:var(--zd-orange-600);      /* ícones, indicadores, barras de gráfico, controles marcados */
--brand-strong:var(--zd-orange-700);    /* texto laranja, links, foco */
--brand-pressed:var(--zd-orange-800);
--brand-subtle:var(--zd-orange-50);
--brand-highlight:var(--zd-orange-100);
--brand-border:var(--zd-orange-200);
--on-brand:var(--zd-gray-900);          /* texto sobre #F25B00 (5,3:1) — nunca branco pequeno */
--on-brand-strong:var(--zd-white);      /* texto sobre #B03F00 (5,9:1) */
--ink:var(--zd-gray-900);               /* controle ativo neutro: aba, período, botão escuro */
--on-ink:var(--zd-white);
--ink-hover:#2B2E33;

--bg-app:var(--zd-gray-25);
--surface:var(--zd-white);
--surface-2:var(--zd-gray-50);
--surface-hover:#F8F8F6;
--surface-2-hover:var(--zd-gray-100);
--surface-selected:var(--zd-orange-50);
--surface-inverse:var(--zd-gray-900);

--text-1:var(--zd-gray-900);
--text-2:var(--zd-gray-700);
--text-3:var(--zd-gray-600);
--text-disabled:var(--zd-gray-400);
--text-inverse:var(--zd-white);
--text-inverse-2:#B9BCC0;               /* secundário sobre --surface-inverse (9,6:1) */
--border-inverse:rgba(255,255,255,.12);
--text-link:var(--zd-orange-700);
--text-link-hover:var(--zd-orange-800);

--border-subtle:var(--zd-gray-200);
--border-field:var(--zd-gray-500);
--border-strong:var(--zd-gray-700);
--border-focus:var(--zd-orange-700);
--focus-ring:var(--zd-orange-700);

--success-fg:var(--zd-green-700); --success-bg:var(--zd-green-50); --success-border:var(--zd-green-200);
--warning-fg:var(--zd-amber-700); --warning-bg:var(--zd-amber-50); --warning-border:var(--zd-amber-200);
--danger-fg:var(--zd-red-700);    --danger-bg:var(--zd-red-50);    --danger-border:var(--zd-red-200);
--info-fg:var(--zd-blue-700);     --info-bg:var(--zd-blue-50);     --info-border:var(--zd-blue-200);

--overlay:rgba(23,25,28,.40);

/* Charts */
--chart-primary:var(--zd-orange-500);
--chart-ghost:var(--zd-gray-50);        /* barras fora de foco (estilo “fantasma”) */
--chart-primary-soft:var(--zd-orange-100);
--chart-compare:var(--zd-gray-500);
--chart-grid:var(--zd-gray-200);
--chart-axis:var(--zd-gray-600);
--avatar-bg:#E6EAED; --avatar-fg:#B3BDC5;
--surface-raised:#FFFFFF; --border-raised:rgba(24,32,38,.06);
}

/* Dark theme — cinza neutro para o preto (como o produto atual: fundo 7%, cards 10%, secundário 14%, bordas 18%), sem tom azul. Laranja mantido. Opt-in via :is([data-theme="dark"],.dark). */
:is([data-theme="dark"],.dark){
--zd-gray-25:#141414; --zd-gray-50:#242424; --zd-gray-100:#2E2E2E; --zd-gray-200:#333333; --zd-gray-400:#5E5E5E; --zd-gray-500:#7A7A7A; --zd-gray-600:#9A9A9A; --zd-gray-700:#B5B5B5; --zd-gray-900:#F5F5F5;
--brand:#F25B00; --brand-hover:#FF6E1A; --brand-mark:#FF7A33; --brand-strong:#FF8A4D; --brand-pressed:#FFB07F;
--ink:#F2F2F2; --on-ink:#141414; --ink-hover:#FFFFFF; --text-inverse-2:#C2B6AB; --border-inverse:rgba(255,255,255,.10);
--brand-subtle:#2B1D12; --brand-highlight:#3A2414; --brand-border:#6B3A14;
--on-brand:#141414; --on-brand-strong:#141414;
--bg-app:#121212; --surface:#1A1A1A; --surface-2:#242424; --surface-hover:#202020; --surface-2-hover:#2E2E2E; --surface-selected:#2B1D12; --surface-inverse:#24170D;
--text-1:#F5F5F5; --text-2:#B5B5B5; --text-3:#9A9A9A; --text-disabled:#5E5E5E; --text-inverse:#F5F5F5; --text-link:#FF8A4D; --text-link-hover:#FFB27A;
--border-subtle:#2E2E2E; --border-field:#6E6E6E; --border-strong:#A3A3A3; --border-focus:#FF8A4D; --focus-ring:#FF8A4D;
--success-fg:#7ED69A; --success-bg:#14231A; --success-border:#26472F;
--warning-fg:#F2C462; --warning-bg:#28200F; --warning-border:#52421C;
--danger-fg:#FF9C93; --danger-bg:#2B1715; --danger-border:#5A2823;
--info-fg:#9DB8FF; --info-bg:#161D2E; --info-border:#2B3B5F;
--overlay:rgba(0,0,0,.45);
--chart-primary:#FF7A33; --chart-primary-soft:#3A2414; --chart-ghost:#2A2A2A; --zd-orange-500:#F25B00; --zd-orange-200:#6B3A14; --chart-compare:#B5B5B5; --chart-grid:#2E2E2E; --chart-axis:#9A9A9A;
--shadow-xs:0 1px 2px rgba(0,0,0,.4);
--shadow-sm:0 1px 3px rgba(0,0,0,.45),0 1px 2px rgba(0,0,0,.3);
--shadow-menu:0 12px 32px -8px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.03);
--shadow-modal:0 24px 64px -12px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.04);
--shadow-panel:-16px 0 48px -16px rgba(0,0,0,.75);
--shadow-drag:0 16px 36px -8px rgba(0,0,0,.7);
--avatar-bg:#2A2A2A; --avatar-fg:#5A5A5A;
--surface-raised:#262626; --border-raised:rgba(255,255,255,.09);
}

/* tokens/typography.css */
:root{
--font-sans:"Figtree",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--font-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace; /* só para IDs técnicos e código */

--weight-regular:400; --weight-medium:500; --weight-semibold:600;

/* Scale: size / line-height. Números grandes e finos (400) com espaçamento negativo: a assinatura do v2. */
--fs-metric:40px;  --lh-metric:48px;  --ls-metric:-0.035em;
--fs-page:30px;    --lh-page:38px;    --ls-page:-0.025em;
--fs-section:20px; --lh-section:28px; --ls-section:-0.015em;
--fs-component:16px; --lh-component:24px; --ls-component:-0.005em;
--fs-body:14px;    --lh-body:20px;
--fs-message:15px; --lh-message:24px;
--fs-meta:12px;    --lh-meta:16px;
--fs-input-mobile:16px;
--fs-label-caps:12px; /* rótulos de grupo da sidebar (sem caixa-alta) */
--ls-label-caps:0em; /* @kind font */

/* Semantic shorthands (font) */
--type-metric:400 40px/48px var(--font-sans);
--type-metric-sm:400 28px/36px var(--font-sans);
--type-page-title:500 30px/38px var(--font-sans);
--type-section-title:500 20px/28px var(--font-sans);
--type-component-title:500 16px/24px var(--font-sans);
--type-body:400 14px/20px var(--font-sans);
--type-body-strong:600 14px/20px var(--font-sans);
--type-control:500 14px/20px var(--font-sans);
--type-message:400 15px/24px var(--font-sans);
--type-meta:400 12px/16px var(--font-sans);
--type-meta-strong:500 12px/16px var(--font-sans);
}

/* tokens/spacing.css */
:root{
--space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px;
--space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px;

--page-padding:24px; --page-padding-mobile:16px;

/* Layout dimensions */
--sidebar-width:232px; --sidebar-width-collapsed:64px;
--nav-item-height:40px; --topbar-height:64px;
--control-height:40px; --control-height-sm:32px; --control-height-lg:44px;
--touch-target:44px;
--row-height:48px; --row-height-compact:40px;
--panel-width:440px; --conversation-list-width:340px; --contact-details-width:320px;
--icon-size:20px; --icon-size-sm:16px;
--bp-desktop:1280px; /* @kind other */
--bp-tablet:1024px; /* @kind other */
--bp-mobile:640px; /* @kind other */
}

/* tokens/effects.css */
:root{
/* Radii */
--radius-xs:4px;       /* checkbox */
--radius-sm:8px;       /* itens de menu, tags */
--radius-control:12px; /* campos, itens de navegação */
--radius-button:999px; /* botões e botões de ícone: pílula */
--radius-card:20px;    /* cards, tabelas, painéis */
--radius-popover:16px; /* menus, toasts, popovers */
--radius-modal:24px;   /* modais */
--radius-pill:999px;   /* chips, controles segmentados, badges */
--radius-bubble:12px 12px 12px 4px;    /* assinatura: canto de balão (do logotipo) */
--radius-bubble-out:12px 12px 4px 12px;
--radius-bubble-sm:8px 8px 8px 2px;

/* Borders */
--border-width:1px; --focus-width:2px; --focus-offset:2px;

/* Shadows — discretas, neutras, sem brilho laranja */
--shadow-xs:0 1px 2px rgba(23,25,28,.06);
--shadow-sm:0 1px 2px rgba(23,25,28,.06),0 2px 6px -2px rgba(23,25,28,.06);
--shadow-card:0 0 0 1px rgba(23,25,28,.03),0 1px 2px rgba(23,25,28,.04),0 6px 20px -10px rgba(23,25,28,.10); /* cards sem borda */
--shadow-menu:0 0 0 1px rgba(23,25,28,.05),0 12px 32px -10px rgba(23,25,28,.22);
--shadow-modal:0 24px 56px -12px rgba(23,25,28,.28),0 4px 12px rgba(23,25,28,.06);
--shadow-panel:-16px 0 40px -16px rgba(23,25,28,.20);
--shadow-drag:0 16px 32px -8px rgba(23,25,28,.22);

/* Signature pattern — "Faixa Zap": hachura laranja para o item em foco num gráfico/progresso */
--pattern-hatch:var(--brand); /* antes: listras; agora cor sólida */
--pattern-hatch-neutral:var(--zd-gray-200);

/* Motion — curtas e funcionais */
--dur-fast:120ms; /* @kind other */
--dur-base:180ms; /* @kind other */
--dur-slow:240ms; /* @kind other */
--ease-standard:cubic-bezier(.2,0,0,1); /* @kind other */
--ease-enter:cubic-bezier(0,0,.2,1); /* @kind other */
--ease-exit:cubic-bezier(.4,0,1,1); /* @kind other */

/* Z-index */
--z-sticky:10; /* @kind other */
--z-sidebar:30; /* @kind other */
--z-panel:40; /* @kind other */
--z-overlay:50; /* @kind other */
--z-modal:60; /* @kind other */
--z-popover:70; /* @kind other */
--z-toast:80; /* @kind other */
--z-tooltip:90; /* @kind other */
}
@media (prefers-reduced-motion:reduce){:root{
--dur-fast:0ms; /* @kind other */
--dur-base:0ms; /* @kind other */
--dur-slow:0ms; /* @kind other */
}}

/* tokens/brand.css */
/* Elemento gráfico da marca: o Z do símbolo e o "traço Zap" (a cauda do Z). Usados como máscara CSS — a cor vem de background. Fonte: assets/logo/zapdata-z.svg e assets/brand/traco-zap.svg. */
:root{
--zd-mark-z:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='244 236 899 791'><path d='M257 269L250 283L245 305L250 338L265 362L279 373L295 380L311 383L673 384L278 897L265 926L262 959L271 989L280 1002L294 1014L311 1022L329 1026L811 1026L838 1022L883 1008L912 992L936 971L968 933L1000 901L1041 870L1088 846L1122 835L1142 832L1103 827L1061 827L1025 831L956 848L871 879L817 889L489 890L502 870L893 374L907 350L914 327L915 304L910 281L902 266L888 251L870 241L848 237L314 237L282 246L270 254Z'/></svg>"); /* @kind other */
--zd-mark-traco:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='640 826 503 201' preserveAspectRatio='none'><path d='M640 958L780 889L817 889L871 879L956 848L1025 831L1061 827L1103 827L1142 832L1122 835L1088 846L1041 870L1000 901L968 933L936 971L912 992L883 1008L838 1022L811 1026L780 1026Z'/></svg>"); /* @kind other */
--zd-mark-z-ratio:899/791; /* @kind other */
--zd-mark-traco-ratio:503/201; /* @kind other */
}

/* styles/reset.css */
/* Reset de elementos HTML do ZapData DS. Só para páginas standalone (design-system/styles.css → reference/).
   O app NÃO importa este arquivo: o preflight do Tailwind já faz o reset, e `a{}` global mudaria os links do app. */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:var(--type-body);color:var(--text-1);background:var(--bg-app);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p{margin:0}
a{color:var(--text-link);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
a:hover{color:var(--text-link-hover)}

/* styles/base.css */
:focus-visible{outline:var(--focus-width) solid var(--focus-ring);outline-offset:var(--focus-offset)}
::selection{background:var(--brand-highlight);color:var(--text-1)}
.zd-num,.zd-tabular{font-variant-numeric:tabular-nums}
.zd-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.zd-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.zd-scroll{scrollbar-width:thin;scrollbar-color:var(--zd-gray-200) transparent}
.zd-scroll::-webkit-scrollbar{width:8px;height:8px}.zd-scroll::-webkit-scrollbar-thumb{background:var(--zd-gray-200);border-radius:8px}
.zd-icon{display:inline-flex;flex:none;line-height:0}
.zd-icon svg{display:block}
.zd-kbd{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border:1px solid var(--border-subtle);border-radius:var(--radius-xs);background:var(--surface-2);font:var(--type-meta-strong);color:var(--text-2)}
.zd-text-meta{font:var(--type-meta);color:var(--text-3)}
.zd-text-2{color:var(--text-2)}
.zd-empty-value{color:var(--text-3)}
@keyframes zd-spin{to{transform:rotate(360deg)}}
@keyframes zd-shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@keyframes zd-fade-in{from{opacity:0}to{opacity:1}}
@keyframes zd-pop-in{from{opacity:0;transform:translateY(4px) scale(.98)}to{opacity:1;transform:none}}
@keyframes zd-slide-in-right{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
@keyframes zd-slide-up{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}.zd-spinner{animation-duration:1.4s!important;animation-iteration-count:infinite!important}}

/* styles/controls.css */
/* Buttons */
.zd-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);height:var(--control-height);padding:0 var(--space-4);border:1px solid transparent;border-radius:var(--radius-button);font:var(--type-control);font-weight:var(--weight-semibold);white-space:nowrap;cursor:pointer;user-select:none;text-decoration:none;transition:background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard)}
.zd-btn--sm{height:var(--control-height-sm);padding:0 14px;gap:6px}
.zd-btn--lg{height:var(--control-height-lg);padding:0 var(--space-5)}
.zd-btn--block{width:100%}
.zd-btn--icon{width:var(--control-height);padding:0}
.zd-btn--icon.zd-btn--sm{width:var(--control-height-sm)}
.zd-btn--icon.zd-btn--lg{width:var(--control-height-lg)}
.zd-btn--primary{background:var(--brand);color:var(--on-brand)}
.zd-btn--primary:hover{background:var(--brand-hover)}
.zd-btn--primary:active{background:var(--brand-pressed);color:var(--on-brand-strong)}
.zd-btn--secondary{background:var(--surface);color:var(--text-1);border-color:var(--border-subtle)}
.zd-btn--secondary:hover{background:var(--surface-hover);border-color:var(--zd-gray-400)}
.zd-btn--secondary:active{background:var(--surface-2);box-shadow:none}
.zd-btn--ghost{background:transparent;color:var(--text-1)}
.zd-btn--ghost:hover{background:var(--surface-2)}
.zd-btn--ghost:active{background:var(--surface-2-hover)}
.zd-btn--danger{background:var(--danger-fg);color:#fff}
.zd-btn--danger:hover{background:#951D13}
.zd-btn--inverse{background:var(--border-inverse);color:var(--text-inverse)}.zd-btn--inverse:hover{background:rgba(255,255,255,.2)}:is([data-theme="dark"],.dark) .zd-btn--inverse:hover{background:rgba(0,0,0,.16)}
.zd-btn--dark{background:var(--ink);color:var(--on-ink)}.zd-btn--dark:hover{background:var(--ink-hover)}.zd-btn--dark:active{background:var(--ink);box-shadow:inset 0 2px 0 rgba(0,0,0,.25)}
.zd-btn--danger:active{background:#7F1810}
.zd-btn--danger-ghost{background:transparent;color:var(--danger-fg)}
.zd-btn--danger-ghost:hover{background:var(--danger-bg)}
.zd-btn--link{height:auto;padding:0;border:0;background:none;color:var(--text-link);font-weight:var(--weight-semibold);text-decoration:underline;text-underline-offset:2px}
.zd-btn--link:hover{color:var(--text-link-hover)}
.zd-btn:disabled,.zd-btn[aria-disabled="true"]{background:var(--surface-2);color:var(--text-disabled);border-color:transparent;box-shadow:none;cursor:not-allowed}
.zd-btn--ghost:disabled,.zd-btn--ghost[aria-disabled="true"],.zd-btn--link:disabled{background:transparent}
.zd-btn[aria-busy="true"]{cursor:progress}
.zd-btn__count{min-width:20px;height:20px;padding:0 6px;border-radius:var(--radius-pill);background:var(--text-1);color:var(--surface);font:600 12px/20px var(--font-sans)}
.zd-spinner{display:inline-block;width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:zd-spin .7s linear infinite;flex:none}
@media (pointer:coarse){.zd-btn{min-height:var(--touch-target)}.zd-btn--icon{min-width:var(--touch-target)}}
/* Toque (celular/tablet): abas e chips sobem de 32 px para a altura de controle (40 px), item de segmented para 36 px
   (com o trilho, 44 px, igual ao botão);
   checkbox (DS e shadcn) e switch do shadcn ganham área de toque invisível de 44 px sem mudar o desenho.
   Fora: lista e composer de Conversas, que têm medidas próprias. */
@media (pointer:coarse){:is(.zd-tab,.zd-int__tab,.zd-chip):not(.zd-inbox *,.zd-listhead *,.zd-composer *){min-height:var(--control-height)}.zd-segmented__item:not(.zd-inbox *,.zd-listhead *,.zd-composer *){min-height:calc(var(--touch-target) - var(--space-2))}button:is([role=checkbox],[role=switch]){position:relative}:is(button:is([role=checkbox],[role=switch]),.zd-check)::before{content:"";position:absolute;inset:min(0px,calc((100% - var(--touch-target)) / 2))}}

/* Field wrapper */
.zd-field{display:flex;flex-direction:column;gap:var(--space-2);min-width:0}
.zd-label{font:var(--type-control);color:var(--text-1)}
.zd-label__optional{font-weight:var(--weight-regular);color:var(--text-3)}
.zd-label__required{color:var(--danger-fg)}
.zd-help{font:var(--type-body);color:var(--text-2)}
.zd-field-error{display:flex;align-items:flex-start;gap:6px;font:var(--type-body);font-weight:var(--weight-medium);color:var(--danger-fg)}
.zd-field-error .zd-icon{margin-top:2px}
.zd-counter{font:var(--type-meta);color:var(--text-3);text-align:right}

/* Inputs */
.zd-input{display:flex;align-items:center;gap:var(--space-2);height:var(--control-height);padding:0 var(--space-3);background:var(--surface);border:1px solid var(--border-field);border-radius:var(--radius-control);transition:border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard);min-width:0}
.zd-input:hover{border-color:var(--border-strong)}
.zd-input:focus-within{border-color:var(--border-focus);box-shadow:0 0 0 1px var(--border-focus)}
.zd-input input,.zd-input textarea{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;font:var(--type-body);color:var(--text-1);padding:0}
.zd-input input::placeholder,.zd-input textarea::placeholder{color:var(--text-3)}
.zd-input__icon{display:flex;color:var(--text-3)}
.zd-input__affix{display:flex;align-items:center;gap:6px;color:var(--text-2);font:var(--type-control);white-space:nowrap}
.zd-input__divider{width:1px;align-self:stretch;margin:8px 0;background:var(--border-subtle)}
.zd-input__clear{display:grid;place-items:center;width:24px;height:24px;border:0;border-radius:var(--radius-sm);background:none;color:var(--text-3);cursor:pointer}
.zd-input__clear:hover{background:var(--surface-2);color:var(--text-1)}
.zd-input--sm{height:var(--control-height-sm)}
.zd-input--error{border-color:var(--danger-fg)}
.zd-input--error:focus-within{border-color:var(--danger-fg);box-shadow:0 0 0 1px var(--danger-fg)}
.zd-input--disabled{background:var(--surface-2);border-color:var(--border-subtle);cursor:not-allowed}
.zd-input--disabled input,.zd-input--disabled textarea{color:var(--text-disabled);cursor:not-allowed}
.zd-input--textarea{height:auto;align-items:stretch;padding:10px var(--space-3)}
.zd-input--textarea textarea{resize:vertical;min-height:80px;line-height:20px}
.zd-input--search{background:var(--surface-2);border-color:transparent}
.zd-input--search:hover{border-color:var(--border-field)}
.zd-input--search:focus-within{background:var(--surface)}
@media (max-width:640px){.zd-input input,.zd-input textarea,.zd-select__trigger{font-size:var(--fs-input-mobile)}.zd-input,.zd-select__trigger{min-height:var(--touch-target)}}
/* iOS dá zoom ao focar campo com fonte < 16px. Em tela de toque todo campo de texto fica com 16px, inclusive
   o chat de suporte do Crisp (DOM de terceiro com CSS !important em cadeia de classes, por isso o !important e o #crisp-chatbox).
   Não mexe no meta viewport: o zoom de acessibilidade (pinça) continua livre. */
@media (hover:none) and (pointer:coarse){:is(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=button],[type=submit],[type=reset],[type=image],[type=hidden]),textarea,select){font-size:max(var(--fs-input-mobile),1em)!important}#crisp-chatbox :is(textarea,input:not([type=file])){font-size:var(--fs-input-mobile)!important}}

/* Select / multiselect */
.zd-select{position:relative;min-width:0}
.zd-select__trigger{display:flex;align-items:center;gap:var(--space-2);width:100%;height:var(--control-height);padding:0 10px 0 var(--space-3);background:var(--surface);border:1px solid var(--border-field);border-radius:var(--radius-control);font:var(--type-body);color:var(--text-1);text-align:left;cursor:pointer;transition:border-color var(--dur-fast) var(--ease-standard)}
.zd-select__trigger:hover{border-color:var(--border-strong)}
.zd-select__trigger:focus-visible,.zd-select__trigger[aria-expanded="true"]{outline:0;border-color:var(--border-focus);box-shadow:0 0 0 1px var(--border-focus)}
.zd-select__trigger--sm{height:var(--control-height-sm)}
.zd-select__value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zd-select__placeholder{color:var(--text-3)}
.zd-select__chev{display:flex;color:var(--text-2);transition:transform var(--dur-fast) var(--ease-standard)}
.zd-select__trigger[aria-expanded="true"] .zd-select__chev{transform:rotate(180deg)}
.zd-select__trigger:disabled{background:var(--surface-2);border-color:var(--border-subtle);color:var(--text-disabled);cursor:not-allowed}
.zd-select--error .zd-select__trigger{border-color:var(--danger-fg)}
.zd-listbox{position:absolute;z-index:var(--z-popover);top:calc(100% + 4px);left:0;min-width:100%;max-height:280px;overflow:auto;padding:4px;background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--radius-card);box-shadow:var(--shadow-menu);animation:zd-pop-in var(--dur-base) var(--ease-enter)}
.zd-listbox__search{padding:4px 4px 8px}
.zd-option{display:flex;align-items:center;gap:var(--space-2);width:100%;min-height:36px;padding:0 var(--space-2);border:0;border-radius:var(--radius-control);background:none;font:var(--type-body);color:var(--text-1);text-align:left;cursor:pointer}
.zd-option:hover,.zd-option[data-active="true"]{background:var(--surface-2)}
.zd-option[aria-selected="true"]{font-weight:var(--weight-semibold)}
.zd-option__check{margin-left:auto;color:var(--brand-strong);display:flex}
.zd-option__meta{margin-left:auto;font:var(--type-meta);color:var(--text-3)}
.zd-option[aria-disabled="true"]{color:var(--text-disabled);cursor:not-allowed}
.zd-multi-chips{display:flex;gap:4px;flex-wrap:nowrap;overflow:hidden;flex:1;min-width:0}
.zd-listbox__footer{display:flex;justify-content:space-between;gap:8px;padding:8px 4px 4px;margin-top:4px;border-top:1px solid var(--border-subtle)}

/* Checkbox / radio */
.zd-check{display:inline-flex;align-items:flex-start;gap:10px;cursor:pointer;position:relative;min-height:20px}
.zd-check input{position:absolute;opacity:0;width:18px;height:18px;margin:1px 0 0;cursor:pointer}
.zd-check__box{flex:none;display:grid;place-items:center;width:18px;height:18px;margin-top:1px;border:1px solid var(--border-field);border-radius:var(--radius-xs);background:var(--surface);color:#fff;transition:background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
.zd-check--radio .zd-check__box{border-radius:50%}
.zd-check:hover .zd-check__box{border-color:var(--border-strong)}
.zd-check input:checked+.zd-check__box,.zd-check input:indeterminate+.zd-check__box{background:var(--brand-mark);border-color:var(--brand-mark)}
.zd-check--radio input:checked+.zd-check__box{background:var(--surface);border:5px solid var(--brand-mark)}
.zd-check input:focus-visible+.zd-check__box{outline:var(--focus-width) solid var(--focus-ring);outline-offset:2px}
.zd-check input:disabled+.zd-check__box{background:var(--surface-2);border-color:var(--border-subtle)}
.zd-check input:disabled:checked+.zd-check__box{background:var(--zd-gray-400);border-color:var(--zd-gray-400)}
.zd-check--disabled{cursor:not-allowed}
.zd-check--disabled .zd-check__label{color:var(--text-disabled)}
.zd-check--error .zd-check__box{border-color:var(--danger-fg)}
.zd-check__text{display:flex;flex-direction:column;gap:2px}
.zd-check__label{font:var(--type-body);color:var(--text-1)}
.zd-check__desc{font:var(--type-body);color:var(--text-2)}
.zd-check__icon{display:none;line-height:0}
.zd-check input:checked+.zd-check__box .zd-check__icon--on,.zd-check input:indeterminate+.zd-check__box .zd-check__icon--mixed{display:block}
.zd-check input:indeterminate+.zd-check__box .zd-check__icon--on{display:none}
.zd-check--radio .zd-check__icon{display:none!important}
.zd-check--bare{min-height:0}

/* Switch */
.zd-switch{display:inline-flex;align-items:flex-start;gap:12px;cursor:pointer;position:relative}
.zd-switch input{position:absolute;opacity:0;width:36px;height:20px;margin:0;cursor:pointer}
.zd-switch__track{flex:none;position:relative;width:36px;height:20px;border-radius:var(--radius-pill);background:var(--border-field);transition:background-color var(--dur-base) var(--ease-standard)}
.zd-switch__thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(24,32,38,.25);transition:transform var(--dur-base) var(--ease-standard);display:grid;place-items:center;color:var(--brand-mark)}
.zd-switch__thumb .zd-icon{opacity:0;transition:opacity var(--dur-fast)}
.zd-switch input:checked+.zd-switch__track{background:var(--brand-mark)}
.zd-switch input:checked+.zd-switch__track .zd-switch__thumb{transform:translateX(16px)}
.zd-switch input:checked+.zd-switch__track .zd-switch__thumb .zd-icon{opacity:1}
.zd-switch input:focus-visible+.zd-switch__track{outline:var(--focus-width) solid var(--focus-ring);outline-offset:2px}
.zd-switch input:disabled+.zd-switch__track{background:var(--zd-gray-200)}
.zd-switch input:disabled:checked+.zd-switch__track{background:var(--zd-gray-400)}
.zd-switch--disabled{cursor:not-allowed}
.zd-switch--disabled .zd-check__label{color:var(--text-disabled)}

/* Segmented control */
.zd-segmented{display:inline-flex;align-items:center;gap:2px;padding:4px;background:var(--surface-2);border-radius:var(--radius-pill);max-width:100%;overflow-x:auto;scrollbar-width:none}
.zd-segmented__item{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 14px;border:0;border-radius:var(--radius-pill);background:transparent;font:var(--type-control);color:var(--text-2);white-space:nowrap;cursor:pointer;transition:background-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.zd-segmented__item:hover{color:var(--text-1)}
.zd-segmented__item[aria-pressed="true"],.zd-segmented__item[aria-checked="true"]{background:var(--surface);color:var(--text-1);font-weight:var(--weight-medium);box-shadow:var(--shadow-sm)}
.zd-segmented__item:disabled{color:var(--text-disabled);cursor:not-allowed}
.zd-segmented--sm .zd-segmented__item{height:28px;padding:0 10px}
.zd-segmented--sm{padding:2px}
.zd-segmented--fill{display:flex;width:100%}.zd-segmented--fill .zd-segmented__item{flex:1 1 auto;min-width:0;justify-content:center;padding:0 8px}
.zd-segmented__count{font:var(--type-meta);color:var(--text-3)}

/* Slider */
.zd-slider{gap:6px}
.zd-slider__head{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.zd-slider__val{font:var(--type-meta-strong);color:var(--text-2);font-variant-numeric:tabular-nums}
.zd-slider__input{-webkit-appearance:none;appearance:none;width:100%;height:20px;margin:0;background:transparent;cursor:pointer}
.zd-slider__input::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--brand) var(--p),var(--surface-2-hover) var(--p))}
.zd-slider__input::-moz-range-track{height:4px;border-radius:2px;background:var(--surface-2-hover)}
.zd-slider__input::-moz-range-progress{height:4px;border-radius:2px;background:var(--brand)}
.zd-slider__input::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7px;border-radius:50%;background:var(--surface);border:2px solid var(--brand);box-shadow:var(--shadow-xs);transition:transform var(--dur-fast,120ms)}
.zd-slider__input::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--surface);border:2px solid var(--brand)}
.zd-slider__input:hover::-webkit-slider-thumb{transform:scale(1.1)}
.zd-slider__input:focus-visible{outline:none}
.zd-slider__input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--focus-ring)}
.zd-slider.is-disabled{opacity:.5}.zd-slider.is-disabled .zd-slider__input{cursor:not-allowed}
.zd-slider__help{font:var(--type-meta);color:var(--text-2);text-wrap:pretty}
.zd-input--search input::-webkit-search-cancel-button,.zd-input--search input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}
/* Opção com foto/logo e segunda linha (filtro de conexões e canais). */
.zd-option__lead{display:inline-flex;flex:none;align-items:center;justify-content:center;width:32px;height:32px}
.zd-option__text{display:flex;flex-direction:column;min-width:0;padding:var(--space-1) 0}
.zd-option__label,.zd-option__desc{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.zd-option__desc{font:var(--type-meta);color:var(--text-3)}
.zd-option__desc[data-tone=danger]{color:var(--danger-fg)}
.zd-option__desc[data-tone=warning]{color:var(--warning-fg)}

/* styles/display.css */
/* Chips (filtros) */
.zd-chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-pill);background:var(--surface);font:var(--type-control);color:var(--text-1);white-space:nowrap;cursor:pointer;transition:background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
.zd-chip:hover{border-color:var(--zd-gray-400);background:var(--surface-hover)}
.zd-chip__label{color:var(--text-2);font-weight:var(--weight-regular)}
.zd-chip__value{font-weight:var(--weight-semibold);color:var(--text-1)}
.zd-chip--active{background:var(--brand-subtle);border-color:var(--brand-border)}
.zd-chip--active:hover{background:var(--brand-highlight);border-color:var(--brand-border)}
.zd-chip--active .zd-chip__value{color:var(--brand-strong)}
.zd-chip--add{border-style:dashed;border-color:var(--border-field);color:var(--text-2)}
.zd-chip__remove{display:grid;place-items:center;width:20px;height:20px;margin-right:-6px;border:0;border-radius:50%;background:none;color:var(--text-2);cursor:pointer}
.zd-chip__remove:hover{background:var(--brand-highlight);color:var(--text-1)}
.zd-chip:disabled{color:var(--text-disabled);cursor:not-allowed;background:var(--surface-2)}

/* Tags (etiquetas do usuário) */
.zd-tag{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;border-radius:var(--radius-sm);background:var(--surface-2);font:var(--type-meta-strong);color:var(--text-1);white-space:nowrap;max-width:100%}
.zd-tag__dot{width:8px;height:8px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(24,32,38,.12)}
.zd-tag__remove{display:grid;place-items:center;width:16px;height:16px;margin-right:-4px;border:0;border-radius:4px;background:none;color:var(--text-2);cursor:pointer}
.zd-tag__remove:hover{background:var(--surface-2-hover);color:var(--text-1)}
.zd-tag--outline{background:var(--surface);box-shadow:inset 0 0 0 1px var(--border-subtle)}

/* Badges (status) */
.zd-badge{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border:1px solid transparent;border-radius:var(--radius-pill);font:var(--type-meta-strong);white-space:nowrap}
.zd-badge__dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.zd-badge--neutral{background:var(--surface-2);color:var(--text-2);border-color:var(--border-subtle)}
.zd-badge--brand{background:var(--brand-subtle);color:var(--brand-strong);border-color:var(--brand-border)}
.zd-badge--success{background:var(--success-bg);color:var(--success-fg);border-color:var(--success-border)}
.zd-badge--warning{background:var(--warning-bg);color:var(--warning-fg);border-color:var(--warning-border)}
.zd-badge--danger{background:var(--danger-bg);color:var(--danger-fg);border-color:var(--danger-border)}
.zd-badge--info{background:var(--info-bg);color:var(--info-fg);border-color:var(--info-border)}
.zd-badge--solid.zd-badge--brand{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.zd-count{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:var(--radius-pill);background:var(--brand-strong);color:var(--on-brand-strong);font:600 12px/1 var(--font-sans);font-variant-numeric:tabular-nums}
.zd-count--neutral{background:var(--surface-2);color:var(--text-2)}
.zd-count--brand{background:var(--brand);color:var(--on-brand)}

/* Avatar */
.zd-avatar{position:relative;flex:none;display:inline-grid;place-items:center;width:var(--zd-avatar-size,40px);height:var(--zd-avatar-size,40px);border-radius:50%;background:var(--surface-2);color:var(--text-2);font-weight:var(--weight-semibold);font-size:calc(var(--zd-avatar-size,40px) * .36);line-height:1;letter-spacing:.01em;user-select:none}
.zd-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}
.zd-avatar--brand{background:var(--brand-subtle);color:var(--brand-strong)}
.zd-avatar__channel{position:absolute;right:-3px;bottom:-3px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--surface);color:var(--text-1);box-shadow:0 0 0 1px var(--border-subtle)}
.zd-avatar__presence{position:absolute;right:0;bottom:0;width:10px;height:10px;border-radius:50%;border:2px solid var(--surface);background:var(--success-fg)}
.zd-avatar-group{display:inline-flex}
.zd-avatar-group .zd-avatar{box-shadow:0 0 0 2px var(--surface)}
.zd-avatar-group .zd-avatar+.zd-avatar{margin-left:-8px}

/* Tabs */
.zd-tabs{display:flex;align-items:center;gap:var(--space-1);overflow-x:auto;scrollbar-width:none}
.zd-tab{position:relative;display:inline-flex;align-items:center;gap:var(--space-2);height:32px;padding:0 var(--space-3);border:0;border-radius:var(--radius-pill);background:transparent;font:var(--type-control);color:var(--text-2);white-space:nowrap;cursor:pointer;transition:background-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.zd-tab:hover{color:var(--text-1);background:var(--surface-hover)}
.zd-tab[aria-selected="true"]{background:var(--surface-2);color:var(--text-1);font-weight:500}
.zd-tab[aria-selected="true"]::after{content:none}
.zd-tab:focus-visible{outline-offset:2px;border-radius:var(--radius-pill)}
.zd-tab:disabled{color:var(--text-disabled);cursor:not-allowed}
.zd-tab__count{font:var(--type-meta-strong);color:var(--text-3);font-variant-numeric:tabular-nums}
.zd-tab[aria-selected="true"] .zd-tab__count{color:var(--text-2)}

/* Local navigation (configurações) */
.zd-localnav{display:flex;flex-direction:column;gap:2px}
.zd-localnav__item{flex:none;display:flex;align-items:center;gap:var(--space-3);height:var(--nav-item-height);padding:0 var(--space-3);border:0;border-radius:var(--radius-control);background:none;font:var(--type-control);color:var(--text-2);text-align:left;cursor:pointer;width:100%}
.zd-localnav__item:hover{background:var(--surface-2);color:var(--text-1)}
.zd-localnav__item[aria-current="page"]{background:var(--brand-subtle);color:var(--brand-strong);font-weight:var(--weight-semibold)}

/* Card */
.zd-card{background:var(--surface);border-radius:var(--radius-card);box-shadow:var(--shadow-card);min-width:0}
.zd-card--padded{padding:var(--space-5)}
.zd-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);padding:var(--space-5) var(--space-5) 0}
.zd-card--inverse{background:var(--surface-inverse);color:var(--text-inverse);box-shadow:none}.zd-card--inverse .zd-card__title{color:var(--text-inverse)}.zd-card--inverse .zd-card__desc,.zd-card--inverse .zd-metric__foot,.zd-card--inverse [role="img"]{color:var(--text-inverse-2)}
.zd-card__title{font:var(--type-component-title);letter-spacing:var(--ls-component);color:var(--text-1)}
.zd-card__desc{font:var(--type-body);color:var(--text-2);margin-top:2px}
.zd-card__actions{display:flex;align-items:center;gap:var(--space-2);flex:none}
.zd-card__body{padding:var(--space-4) var(--space-6) var(--space-6)}
.zd-card__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-top:1px solid var(--border-subtle)}
.zd-divider{height:1px;background:var(--border-subtle);border:0;margin:0}

/* Metric cards */
.zd-metric{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-5) var(--space-6) var(--space-6);background:var(--surface);border:0;border-radius:var(--radius-card);box-shadow:var(--shadow-card);text-align:left;min-width:0;font:inherit;color:inherit}
button.zd-metric{cursor:pointer;transition:border-color var(--dur-fast) var(--ease-standard)}
button.zd-metric:hover{border-color:var(--zd-gray-400)}
.zd-metric--selected,button.zd-metric--selected:hover{border-color:var(--brand-mark);box-shadow:inset 0 0 0 1px var(--brand-mark)}
.zd-metric__head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-4)}
.zd-metric__label{display:flex;align-items:center;gap:var(--space-2);font:var(--type-control);color:var(--text-2)}
.zd-metric__period{font:var(--type-meta);color:var(--text-3);white-space:nowrap}
.zd-metric__value{display:flex;align-items:baseline;gap:var(--space-2);flex-wrap:wrap;font:var(--type-metric);letter-spacing:var(--ls-metric);font-variant-numeric:tabular-nums;color:var(--text-1)}
.zd-metric__unit{font:400 16px/24px var(--font-sans);color:var(--text-2);letter-spacing:0}
.zd-metric__value--empty{color:var(--text-3)}
.zd-metric__delta{display:inline-flex;align-items:center;gap:2px;height:24px;padding:0 8px 0 6px;border:1px solid currentColor;border-radius:var(--radius-pill);font:var(--type-meta-strong);font-variant-numeric:tabular-nums}
.zd-metric__icon{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--border-subtle);color:var(--text-2);flex:none}
.zd-metric__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}
.zd-metric__foot{font:var(--type-meta);color:var(--text-3)}
.zd-metric__swatch{width:12px;height:12px;border-radius:3px;background:var(--pattern-hatch);flex:none}
.zd-metric-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--radius-card)}
.zd-metric-strip .zd-metric{border:0;border-radius:0;background:none}
.zd-metric-strip .zd-metric+.zd-metric{box-shadow:inset 1px 0 0 var(--border-subtle)}

/* Charts */
.zd-chart{position:relative;width:100%}
.zd-chart svg{display:block;overflow:visible}
.zd-chart-tag{position:absolute;transform:translateX(-50%);display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:var(--radius-pill);background:var(--brand);color:var(--on-brand);font:var(--type-meta-strong);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;box-shadow:var(--shadow-sm)}
.zd-chart__bar{transition:fill var(--dur-fast) var(--ease-standard)}
.zd-legend{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;font:var(--type-meta);color:var(--text-2)}
.zd-legend__item{display:inline-flex;align-items:center;gap:6px}
.zd-legend__swatch{width:10px;height:10px;border-radius:3px;flex:none}
.zd-legend__line{width:14px;height:2px;border-radius:2px;flex:none}
.zd-legend__value{font:var(--type-body-strong);color:var(--text-1);font-variant-numeric:tabular-nums}
.zd-chart-tooltip{position:absolute;z-index:5;min-width:200px;padding:var(--space-3);background:var(--surface);border-radius:var(--radius-popover);box-shadow:var(--shadow-menu);pointer-events:none;font:var(--type-body)}
.zd-chart-tooltip__title{font:var(--type-body-strong);margin-bottom:var(--space-2)}
.zd-chart-tooltip__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);color:var(--text-2)}
.zd-chart-tooltip__row strong{color:var(--text-1);font-variant-numeric:tabular-nums;font-weight:600}
.zd-hbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center}
.zd-hbar__label{font:var(--type-body);color:var(--text-1);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zd-hbar__value{font:var(--type-body-strong);font-variant-numeric:tabular-nums;text-align:right}
.zd-hbar__track{grid-column:1/-1;height:10px;border-radius:var(--radius-pill);background:var(--chart-ghost);overflow:hidden;margin-bottom:8px}
.zd-hbar__fill{height:100%;border-radius:var(--radius-pill);background:var(--zd-orange-200)}
.zd-hbar__fill--hatch{background:var(--pattern-hatch)}
.zd-progress{height:8px;border-radius:var(--radius-pill);background:var(--surface-2);overflow:hidden}
.zd-progress__fill{height:100%;border-radius:var(--radius-pill);background:var(--pattern-hatch);transition:width var(--dur-slow) var(--ease-standard)}
.zd-avatar{overflow:visible;background:var(--avatar-bg);color:var(--avatar-fg)}
.zd-avatar__sil{width:100%;height:100%;border-radius:50%;fill:currentColor;overflow:hidden;clip-path:circle(50%)}
.zd-avatar--brand{background:var(--brand-subtle);color:color-mix(in oklab,var(--brand) 45%,var(--brand-subtle))}
.zd-avatar{aspect-ratio:1;min-width:var(--zd-avatar-size,40px);min-height:var(--zd-avatar-size,40px);max-width:var(--zd-avatar-size,40px);max-height:var(--zd-avatar-size,40px)}
.zd-avatar img{display:block;width:var(--zd-avatar-size,40px);height:var(--zd-avatar-size,40px);aspect-ratio:1;object-fit:cover;object-position:50% 30%;max-width:none}

/* styles/overlays.css */
/* Menu / dropdown */
.zd-menu{min-width:200px;max-width:320px;padding:6px;background:var(--surface);border:0;border-radius:var(--radius-popover);box-shadow:var(--shadow-menu);animation:zd-pop-in var(--dur-base) var(--ease-enter);z-index:var(--z-popover)}
.zd-menu__item{display:flex;align-items:center;gap:var(--space-2);width:100%;min-height:36px;padding:0 var(--space-2);border:0;border-radius:var(--radius-control);background:none;font:var(--type-body);color:var(--text-1);text-align:left;cursor:pointer;text-decoration:none}
.zd-menu__item:hover,.zd-menu__item:focus-visible,.zd-menu__item[data-active="true"]{background:var(--surface-2);outline:0}
.zd-menu__item:focus-visible{box-shadow:inset 0 0 0 2px var(--focus-ring)}
.zd-menu__item .zd-icon{color:var(--text-2)}
.zd-menu__item--danger,.zd-menu__item--danger .zd-icon{color:var(--danger-fg)}
.zd-menu__item--danger:hover{background:var(--danger-bg)}
.zd-menu__item[aria-disabled="true"]{color:var(--text-disabled);cursor:not-allowed;background:none}
.zd-menu__item[aria-disabled="true"] .zd-icon{color:var(--text-disabled)}
.zd-menu__item[aria-checked="true"]{font-weight:var(--weight-semibold)}
.zd-menu__hint{margin-left:auto;font:var(--type-meta);color:var(--text-3);padding-left:var(--space-3)}
.zd-menu__label{padding:8px 8px 4px;font:var(--type-meta-strong);color:var(--text-3)}
.zd-menu__sep{height:1px;margin:4px -4px;background:var(--border-subtle)}
@media (pointer:coarse){.zd-menu__item{min-height:var(--touch-target)}}
.zd-anchor{position:relative;display:inline-flex}
.zd-float{position:absolute;z-index:var(--z-popover)}

/* Tooltip */
.zd-tooltip{position:absolute;z-index:var(--z-tooltip);max-width:240px;padding:6px 10px;background:var(--surface-inverse);color:var(--text-inverse);font:var(--type-meta-strong);border-radius:var(--radius-bubble-sm);box-shadow:var(--shadow-sm);pointer-events:none;white-space:normal;width:max-content;animation:zd-fade-in var(--dur-fast) var(--ease-enter)}
.zd-tooltip{animation:zd-tt-in 80ms var(--ease-standard,ease-out)}
@keyframes zd-tt-in{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.zd-tooltip{animation:none}}
.zd-tooltip kbd{font:inherit;opacity:.72;margin-left:6px}

/* Popover */
.zd-popover{position:absolute;z-index:var(--z-popover);width:320px;max-width:calc(100vw - 32px);padding:var(--space-4);background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--radius-popover);box-shadow:var(--shadow-menu);animation:zd-pop-in var(--dur-base) var(--ease-enter)}
.zd-popover__title{font:var(--type-body-strong);margin-bottom:var(--space-1)}
.zd-popover__footer{display:flex;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-4)}

/* Modal */
.zd-overlay{position:fixed;inset:0;z-index:var(--z-modal);display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding:var(--space-6);background:var(--overlay);animation:zd-fade-in var(--dur-base) var(--ease-enter)}
.zd-modal{position:relative;display:flex;flex-direction:column;width:min(100%,520px);min-width:0;max-height:calc(100vh - 48px);background:var(--surface);border-radius:var(--radius-modal);box-shadow:var(--shadow-modal);animation:zd-pop-in var(--dur-slow) var(--ease-enter)}
.zd-modal--lg{width:min(100%,720px)}
.zd-modal--sm{width:min(100%,420px)}
.zd-modal__header{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-6) var(--space-6) 0}
.zd-modal__icon{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%}
.zd-modal__title{font:var(--type-section-title);letter-spacing:var(--ls-section)}
.zd-modal__desc{font:var(--type-body);color:var(--text-2);margin-top:var(--space-1)}
.zd-modal__close{margin:-8px -8px 0 auto}
.zd-modal__body{padding:var(--space-5) var(--space-6);overflow:auto;display:flex;flex-direction:column;gap:var(--space-4)}
.zd-modal__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-2);padding:0 var(--space-6) var(--space-6)}
.zd-modal__footer-start{margin-right:auto}
@media (max-width:640px){.zd-overlay{place-items:end stretch;padding:0}.zd-modal{width:100%;max-height:92vh;border-radius:var(--radius-modal) var(--radius-modal) 0 0}.zd-modal__footer{flex-direction:column-reverse;align-items:stretch}}

/* Side panel (detalhe contextual) */
.zd-panel{display:flex;flex-direction:column;width:var(--panel-width);max-width:100%;height:100%;background:var(--surface);border-left:1px solid var(--border-subtle);min-height:0}
.zd-panel--overlay{position:fixed;top:0;right:0;bottom:0;z-index:var(--z-panel);box-shadow:var(--shadow-panel);border-left:0;animation:zd-slide-in-right var(--dur-slow) var(--ease-enter)}
.zd-panel-backdrop{position:fixed;inset:0;z-index:calc(var(--z-panel) - 1);background:var(--overlay);animation:zd-fade-in var(--dur-base) var(--ease-enter)}
.zd-panel__header{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-subtle)}
.zd-panel__eyebrow{font:var(--type-meta-strong);color:var(--text-3);text-transform:uppercase;letter-spacing:.04em}
.zd-panel__title{font:var(--type-section-title);letter-spacing:var(--ls-section);margin-top:2px}
.zd-panel__subtitle{font:var(--type-body);color:var(--text-2);margin-top:2px}
.zd-panel__actions{display:flex;gap:4px;margin-left:auto;flex:none}
.zd-panel__body{flex:1;overflow:auto;padding:var(--space-5);display:flex;flex-direction:column;gap:var(--space-6);min-height:0}
.zd-panel__footer{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-5);border-top:1px solid var(--border-subtle)}
.zd-panel__footer-end{margin-left:auto;display:flex;gap:var(--space-2)}
.zd-panel-section__title{font:var(--type-body-strong);margin-bottom:var(--space-3);display:flex;align-items:center;justify-content:space-between}
.zd-dl{display:grid;grid-template-columns:minmax(110px,auto) 1fr;gap:10px var(--space-4);font:var(--type-body)}
.zd-dl dt{color:var(--text-2)}
.zd-dl dd{margin:0;color:var(--text-1);min-width:0;overflow-wrap:anywhere}
@media (max-width:640px){.zd-panel--overlay{width:100%}}

/* Toast */
.zd-toast-region{position:fixed;right:var(--space-6);bottom:var(--space-6);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--space-2);width:min(400px,calc(100vw - 32px))}
.zd-toast{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-3) var(--space-3) var(--space-4);background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--radius-popover);box-shadow:var(--shadow-menu);animation:zd-slide-up var(--dur-slow) var(--ease-enter)}
.zd-toast__icon{display:flex;margin-top:2px}
.zd-toast__body{flex:1;min-width:0}
.zd-toast__title{font:var(--type-body-strong)}
.zd-toast__desc{font:var(--type-body);color:var(--text-2);margin-top:2px}
.zd-toast__actions{display:flex;gap:var(--space-2);margin-top:var(--space-2)}
.zd-toast__actions .zd-btn{height:32px;padding:0 12px;border:1px solid var(--border-strong);background:var(--surface-2);color:var(--text-1);font:var(--type-control);font-weight:600}
.zd-toast__actions .zd-btn:hover{background:var(--surface-2-hover);border-color:var(--text-2)}
.zd-toast__actions .zd-btn:active{transform:translateY(1px)}
.zd-toast--success .zd-toast__icon{color:var(--success-fg)}
.zd-toast--danger .zd-toast__icon{color:var(--danger-fg)}
.zd-toast--warning .zd-toast__icon{color:var(--warning-fg)}
.zd-toast--info .zd-toast__icon{color:var(--info-fg)}
@media (max-width:640px){.zd-toast-region{left:16px;right:16px;bottom:16px;width:auto}}

/* Banner */
.zd-banner{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) var(--space-4);border:1px solid;border-radius:var(--radius-card);font:var(--type-body);color:var(--text-1)}
.zd-banner__icon{display:flex;margin-top:2px}
.zd-banner__body{flex:1;min-width:0}
.zd-banner__title{font:var(--type-body-strong)}
.zd-banner__actions{display:flex;align-items:center;gap:var(--space-2);flex:none;flex-wrap:wrap}
.zd-banner--info{background:var(--info-bg);border-color:var(--info-border)}.zd-banner--info .zd-banner__icon{color:var(--info-fg)}
.zd-banner--success{background:var(--success-bg);border-color:var(--success-border)}.zd-banner--success .zd-banner__icon{color:var(--success-fg)}
.zd-banner--warning{background:var(--warning-bg);border-color:var(--warning-border)}.zd-banner--warning .zd-banner__icon{color:var(--warning-fg)}
.zd-banner--danger{background:var(--danger-bg);border-color:var(--danger-border)}.zd-banner--danger .zd-banner__icon{color:var(--danger-fg)}
.zd-banner--neutral{background:var(--surface-2);border-color:var(--border-subtle)}.zd-banner--neutral .zd-banner__icon{color:var(--text-2)}
.zd-banner--page{border-radius:0;border-width:0 0 1px;padding:var(--space-3) var(--space-6);align-items:center}
@media (max-width:640px){.zd-banner{flex-wrap:wrap}.zd-banner__actions{width:100%;padding-left:32px}.zd-banner--page{padding:var(--space-3) var(--space-4)}}

/* Skeleton */
.zd-skeleton{position:relative;overflow:hidden;display:block;background:var(--surface-2);border-radius:var(--radius-sm)}
.zd-skeleton::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);transform:translateX(-100%);animation:zd-shimmer 1.4s var(--ease-standard) infinite}
.zd-skeleton--circle{border-radius:50%}
@media (prefers-reduced-motion:reduce){.zd-skeleton::after{display:none}}

/* Empty state */
.zd-empty{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);max-width:440px;margin:0 auto;padding:var(--space-12) var(--space-6);text-align:center}
.zd-empty__icon{display:grid;place-items:center;width:56px;height:56px;border-radius:var(--radius-bubble);background:var(--surface-2);color:var(--text-2);margin-bottom:var(--space-1)}
.zd-empty__icon--brand{background:var(--brand-subtle);color:var(--brand-strong)}
.zd-empty__title{font:var(--type-component-title)}
.zd-empty__desc{font:var(--type-body);color:var(--text-2);text-wrap:pretty}
.zd-empty__actions{display:flex;gap:var(--space-2);flex-wrap:wrap;justify-content:center;margin-top:var(--space-2)}
.zd-empty--compact{padding:var(--space-8) var(--space-4)}

/* Date range picker: atalhos + 2 meses lado a lado (1 no celular). Fora do modo inline, o componente posiciona o popup (fixed). */
.zd-daterange{position:absolute;z-index:var(--z-popover);display:grid;grid-template-columns:168px auto;max-width:calc(100vw - 16px);background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--radius-popover);box-shadow:var(--shadow-menu);animation:zd-pop-in var(--dur-base) var(--ease-enter);overflow:hidden}
.zd-daterange__presets{display:flex;flex-direction:column;gap:2px;padding:8px;border-right:1px solid var(--border-subtle);background:inherit}
.zd-daterange__cal{padding:var(--space-4);min-width:0}
.zd-daterange__months{display:flex;gap:var(--space-6)}
.zd-daterange__mo{flex:none;width:252px}
.zd-daterange--one .zd-daterange__mo{flex:1;width:auto;min-width:0}
.zd-daterange__nav{display:grid;grid-template-columns:32px minmax(0,1fr) 32px;align-items:center;min-height:32px;margin-bottom:var(--space-2)}
.zd-daterange__month{font:var(--type-body-strong);text-align:center}.zd-daterange__month::first-letter{text-transform:uppercase}
.zd-cal{display:grid;grid-template-columns:repeat(7,1fr);row-gap:2px}
.zd-cal__row,.zd-cal__cell{display:contents}
.zd-cal__blank{height:36px}
.zd-cal__wd{height:28px;display:grid;place-items:center;font:var(--type-meta-strong);color:var(--text-3);text-transform:lowercase}
.zd-cal__day{position:relative;width:100%;height:36px;padding:0;border:0;background:none;font:var(--type-body);font-variant-numeric:tabular-nums;color:var(--text-1);cursor:pointer;border-radius:var(--radius-control);transition:background-color var(--dur-fast) var(--ease-standard)}
.zd-cal__day:hover{background:var(--surface-2)}
.zd-cal__day:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;z-index:1}
.zd-cal__day--today{font-weight:var(--weight-semibold);box-shadow:inset 0 0 0 1px var(--border-field)}
.zd-cal__day--range{background:var(--brand-subtle);color:var(--brand-strong);border-radius:0}
.zd-cal__day--range:hover{background:var(--brand-highlight)}
.zd-cal__day--start,.zd-cal__day--end{background:var(--brand);color:var(--on-brand);font-weight:var(--weight-semibold);box-shadow:none}
.zd-cal__day--start:hover,.zd-cal__day--end:hover{background:var(--brand-hover)}
.zd-cal__day--start{border-radius:var(--radius-control) 0 0 var(--radius-control)}
.zd-cal__day--end{border-radius:0 var(--radius-control) var(--radius-control) 0}
.zd-cal__day--start.zd-cal__day--end{border-radius:var(--radius-control)}
.zd-cal__day:disabled{color:var(--text-disabled);cursor:not-allowed;background:none}
.zd-daterange__footer{grid-column:1/-1;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-top:1px solid var(--border-subtle)}
.zd-daterange__summary{margin-right:auto;min-width:0;font:var(--type-body);color:var(--text-2);font-variant-numeric:tabular-nums}
@media (max-width:899px){.zd-daterange{grid-template-columns:minmax(0,1fr)}.zd-daterange__presets{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--border-subtle)}.zd-daterange__presets .zd-menu__item{flex:none;width:auto;white-space:nowrap}}
@media (max-width:639px){.zd-daterange{width:calc(100vw - 16px)}}
@media (prefers-reduced-motion:reduce){.zd-daterange{animation:none}.zd-cal__day{transition:none}}
.zd-menu__item{position:relative}
.zd-menu__item>.zd-icon:last-child{color:var(--text-3)}
.zd-menu--sub{position:absolute;top:-5px;min-width:180px;width:max-content;z-index:1;cursor:default}
.zd-menu--sub .zd-menu__item{cursor:pointer}
.zd-menu,.zd-popover,.zd-toast,.zd-daterange{background:var(--surface-raised);box-shadow:0 0 0 1px var(--border-raised),var(--shadow-menu)}
.zd-menu [role^="menuitem"]:hover,.zd-menu [role^="menuitem"]:focus-visible,.zd-menu [aria-expanded="true"]{background:color-mix(in oklab,var(--text-1) 7%,transparent)}

/* styles/dark.css */
/* Ajustes de componentes no tema escuro (valores que não vêm de tokens). */
:is([data-theme="dark"],.dark){color-scheme:dark}
:is([data-theme="dark"],.dark) .zd-btn--danger{background:#C4271B;color:#fff}
:is([data-theme="dark"],.dark) .zd-btn--danger:hover{background:#D63A2E}
:is([data-theme="dark"],.dark) .zd-btn--danger:active{background:#A82017}
:is([data-theme="dark"],.dark) .zd-btn--primary:active{box-shadow:inset 0 2px 0 rgba(0,0,0,.35)}
:is([data-theme="dark"],.dark) .zd-btn--secondary{box-shadow:none}
:is([data-theme="dark"],.dark) .zd-skeleton::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent)}
:is([data-theme="dark"],.dark) .zd-msg__media{background:rgba(255,255,255,.05)}
:is([data-theme="dark"],.dark) .zd-tag__dot{box-shadow:none}
:is([data-theme="dark"],.dark) .zd-switch__thumb{box-shadow:0 1px 2px rgba(0,0,0,.5)}
:is([data-theme="dark"],.dark) .zd-check__box{color:#141414}
:is([data-theme="dark"],.dark) .zd-avatar img,:is([data-theme="dark"],.dark) img.zd-sidebar__mark{filter:none}
:is([data-theme="dark"],.dark) .zd-card,:is([data-theme="dark"],.dark) .zd-metric,:is([data-theme="dark"],.dark) .zd-table-card{box-shadow:0 0 0 1px var(--border-subtle)}
:is([data-theme="dark"],.dark) .zd-navitem[aria-current="page"]{background:var(--surface-2);box-shadow:none}

/* styles/v2.css */
/* Linguagem v2 aplicada às telas de trabalho: painéis como cards sobre o fundo cinza, sem divisórias de borda a borda. Carregado por último. */
/* Aviso de página: cápsula dentro do respiro da página, não faixa de borda a borda */
.zd-banner--page{margin:0 var(--page-padding) var(--space-2);border-width:1px;border-radius:var(--radius-popover);padding:10px 12px 10px 16px;align-items:center}
@media (max-width:640px){.zd-banner--page{margin:0 var(--page-padding-mobile) var(--space-2)}}
/* Inbox: três painéis como cards */
.zd-inbox{gap:var(--space-3);padding:0 var(--space-3) var(--space-3)}
.zd-inbox>*{background:var(--surface)!important;border:0!important;border-radius:var(--radius-card);box-shadow:var(--shadow-card);overflow:hidden;min-height:0}
.zd-inbox>section>header{border-bottom-color:var(--zd-gray-50)!important}
.zd-inbox .zd-thread{background:var(--surface)}
.zd-inbox .zd-panel{border-left:0;width:auto}
.zd-inbox .zd-panel__header{border-bottom-color:var(--zd-gray-50)}
.zd-convlist{padding:var(--space-2)}
.zd-convo{border-bottom:0;border-radius:var(--radius-control);margin-bottom:2px}
.zd-convo[aria-selected="true"]{background:var(--brand-subtle)}
.zd-convo[aria-selected="true"]::before{content:none}
/* Mensagens */
.zd-bubble{border:0;background:var(--surface-2)}
.zd-msg--out .zd-bubble{background:var(--brand-subtle);border:0}
.zd-msg--note .zd-bubble{background:var(--warning-bg);border:1px dashed var(--warning-border)}
.zd-msg--failed .zd-bubble{background:var(--danger-bg);border:1px solid var(--danger-border)}
.zd-thread__day{border:0;background:var(--surface-2)}
.zd-composer{border:1px solid var(--border-subtle);border-radius:var(--radius-card);box-shadow:var(--shadow-xs)}
.zd-composer:focus-within{border-color:var(--border-focus);box-shadow:0 0 0 1px var(--border-focus)}
.zd-composer--note{background:var(--warning-bg);border-color:var(--warning-border)}
.zd-composer__hint{margin-left:10px}
.zd-composer__modes .zd-segmented{flex:none}
.zd-composer--note .zd-composer__modes .zd-segmented{background:color-mix(in oklab,var(--warning-fg) 12%,transparent)}
.zd-ai{border:0;background:var(--surface-2);border-radius:var(--radius-popover)}
/* CRM */
.zd-kanban{gap:var(--space-3)}
.zd-kcol{background:var(--zd-gray-50);border-radius:var(--radius-card)}
/* 4px do respiro do cabeçalho passam para o topo da área rolável: o anel do card selecionado/arrastado não é cortado e a posição dos cards não muda. */
.zd-kcol__head{padding:var(--space-4) var(--space-4) var(--space-2)}
.zd-kcol__title{font:var(--type-control)}
.zd-kcol__body{padding:var(--space-1) var(--space-2) var(--space-2)}
.zd-opp{border:0;border-radius:var(--radius-popover);box-shadow:var(--shadow-card);padding:var(--space-4);transition:box-shadow var(--dur-fast) var(--ease-standard)}
.zd-opp:hover{box-shadow:0 0 0 1px var(--zd-gray-200),var(--shadow-card)}
.zd-opp[aria-selected="true"]{box-shadow:0 0 0 2px var(--brand),var(--shadow-card)}
.zd-opp__value{font:400 20px/28px var(--font-sans);letter-spacing:-.02em}
.zd-opp__foot{border-top-color:var(--zd-gray-50)}
/* Fluxos */
.zd-fnode{border:0;border-radius:var(--radius-popover);box-shadow:var(--shadow-card)}
.zd-fnode:hover{box-shadow:0 0 0 1px var(--zd-gray-200),var(--shadow-card)}
.zd-fnode[aria-selected="true"]{box-shadow:0 0 0 2px var(--brand),var(--shadow-card)}
.zd-fnode--error{box-shadow:0 0 0 2px var(--danger-fg),var(--shadow-card)}
.zd-fnode__icon{border-radius:50%}
.zd-fnode__branch{border:0;background:var(--surface-2)}
.zd-flow-toolbar{border:0;border-radius:var(--radius-pill);box-shadow:var(--shadow-menu)}
.zd-palette__item{border:0;background:var(--surface-2);border-radius:var(--radius-control)}
.zd-palette__item:hover{background:var(--surface-2-hover)}
/* Navegação local (Configurações) = mesma seleção da sidebar */
.zd-localnav__item[aria-current="page"]{background:var(--surface);color:var(--text-1);font-weight:var(--weight-medium);box-shadow:var(--shadow-sm)}
.zd-localnav__item[aria-current="page"] .zd-icon{color:var(--brand)}
/* Painel lateral */
.zd-panel__header,.zd-panel__footer{border-color:var(--zd-gray-50)}
.zd-panel--overlay{border-radius:var(--radius-card) 0 0 var(--radius-card)}
/* Data de período sem quebra */
/* Escuro */
:is([data-theme="dark"],.dark) .zd-inbox>*,:is([data-theme="dark"],.dark) .zd-opp,:is([data-theme="dark"],.dark) .zd-fnode{box-shadow:0 0 0 1px var(--border-subtle)}
:is([data-theme="dark"],.dark) .zd-opp[aria-selected="true"],:is([data-theme="dark"],.dark) .zd-fnode[aria-selected="true"]{box-shadow:0 0 0 2px var(--brand)}
:is([data-theme="dark"],.dark) .zd-kcol{background:var(--surface-2)}
:is([data-theme="dark"],.dark) .zd-localnav__item[aria-current="page"]{background:var(--surface-2);box-shadow:none}
:is([data-theme="dark"],.dark) .zd-card--inverse{box-shadow:0 0 0 1px #4A2E18}
:is([data-theme="dark"],.dark) .zd-card--inverse .zd-btn--inverse{background:rgba(255,255,255,.08);color:#F5F5F5}
:is([data-theme="dark"],.dark) .zd-card--inverse .zd-btn--inverse:hover{background:rgba(255,255,255,.14)}
:is([data-theme="dark"],.dark) .zd-banner--danger{background:#221312;border-color:#4A2420}
/* Tiles (Ferramentas) */
.zd-tile{display:flex;align-items:flex-start;gap:var(--space-4);width:100%;padding:var(--space-5);border:0;border-radius:var(--radius-card);background:var(--surface);box-shadow:var(--shadow-card);font:inherit;color:inherit;text-align:left;cursor:pointer;transition:box-shadow var(--dur-fast) var(--ease-standard)}
.zd-tile:hover:not(:disabled){box-shadow:0 0 0 1px var(--zd-gray-200),var(--shadow-card)}
.zd-tile:disabled{cursor:not-allowed}.zd-tile:disabled .zd-tile__icon,.zd-tile:disabled .zd-tile__desc{opacity:.6}
.zd-tile__icon{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--border-subtle);color:var(--text-1)}
.zd-tile:hover:not(:disabled) .zd-tile__icon{border-color:transparent;background:var(--brand-subtle);color:var(--brand-strong)}
.zd-tile__text{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.zd-tile__title{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font:var(--type-component-title);color:var(--text-1)}
.zd-tile__desc{font:var(--type-body);color:var(--text-2);text-wrap:pretty}
.zd-tile__go{flex:none;color:var(--text-3);margin-top:2px}
.zd-tile:hover .zd-tile__go{color:var(--text-1)}
/* Central de notificações */
.zd-notif__bell{position:relative}
.zd-notif__count{position:absolute;top:2px;right:0;min-width:18px;height:18px;padding:0 5px;border-radius:var(--radius-pill);background:var(--danger-fg);color:#fff;font:600 11px/18px var(--font-sans);text-align:center;box-shadow:0 0 0 2px var(--bg-app)}
.zd-notif{top:calc(100% + 8px);right:0;width:400px}
.zd-notif__head{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3)}
.zd-notif__list{max-height:min(520px,calc(100vh - 140px));overflow-y:auto;padding:0 var(--space-2) var(--space-2);display:flex;flex-direction:column;gap:2px}
.zd-notif__item{position:relative;display:flex;border-radius:var(--radius-control)}
.zd-notif__item:hover{background:var(--surface-2)}
.zd-notif__item[data-unread]::after{content:"";position:absolute;top:18px;right:12px;width:8px;height:8px;border-radius:50%;background:var(--brand)}
.zd-notif__main{flex:1;min-width:0;display:flex;gap:var(--space-3);padding:var(--space-3);padding-right:40px;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:pointer;border-radius:var(--radius-control)}
.zd-notif__main:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}
.zd-notif__icon{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--surface-2);color:var(--text-2)}
.zd-notif__icon[data-tone="success"]{background:var(--success-bg);color:var(--success-fg)}
.zd-notif__icon[data-tone="danger"]{background:var(--danger-bg);color:var(--danger-fg)}
.zd-notif__icon[data-tone="warning"]{background:var(--warning-bg);color:var(--warning-fg)}
.zd-notif__text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.zd-notif__cat{font:var(--type-meta-strong);color:var(--brand-strong)}
.zd-notif__title{display:flex;align-items:center;gap:6px;font:var(--type-body);font-weight:var(--weight-medium);color:var(--text-1)}
.zd-notif__times{flex:none;padding:0 6px;border-radius:var(--radius-pill);background:var(--warning-bg);color:var(--warning-fg);font:var(--type-meta-strong)}
.zd-notif__msg{font:var(--type-body);color:var(--text-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.zd-notif__ago{font:var(--type-meta);color:var(--text-3);margin-top:2px}
.zd-notif__del{position:absolute;right:6px;bottom:8px;display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:none;color:var(--text-3);cursor:pointer;opacity:0}
.zd-notif__item:hover .zd-notif__del,.zd-notif__del:focus-visible{opacity:1}.zd-notif__del:hover{background:var(--surface);color:var(--danger-fg)}
@media (pointer:coarse){.zd-notif__del{opacity:1}}
.zd-notif__empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:var(--space-8) var(--space-6);text-align:center}
@media (max-width:640px){.zd-notif{position:fixed;top:64px;left:8px;right:8px;width:auto}}
/* Login e cadastro */
.zd-auth{min-height:100vh;display:grid;place-items:center;padding:var(--space-10) var(--space-4);background:var(--bg-app)}
.zd-auth__col{width:100%;max-width:420px;display:flex;flex-direction:column;align-items:center;gap:var(--space-6)}
.zd-auth__logo{height:26px}
.zd-auth__card{width:100%;padding:var(--space-8);background:var(--surface);border-radius:var(--radius-modal);box-shadow:var(--shadow-card)}
@media (max-width:480px){.zd-auth__card{padding:var(--space-6) var(--space-5)}}
.zd-auth__title{margin:0;font:500 26px/34px var(--font-sans);letter-spacing:-.025em;color:var(--text-1)}
.zd-auth__sub{margin:4px 0 0;font:var(--type-body);color:var(--text-2)}
.zd-auth__tabs .zd-segmented{display:flex;width:100%}.zd-auth__tabs .zd-segmented__item{flex:1;justify-content:center}
.zd-auth__link{padding:2px 0;border:0;background:none;font:var(--type-control);color:var(--text-link);cursor:pointer;border-radius:4px}.zd-auth__link:hover{color:var(--text-link-hover);text-decoration:underline}@media (pointer:coarse){.zd-auth__link{min-height:var(--control-height)}}
.zd-auth__foot{font:var(--type-body);color:var(--text-2);display:flex;gap:4px;align-items:center}
.zd-auth__captcha{display:flex;align-items:center;gap:var(--space-3);height:56px;padding:0 var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-control);background:var(--surface-2);font:var(--type-body);color:var(--text-1)}
.zd-auth__captcha[data-error]{border-color:var(--danger-fg)}
.zd-auth__captcha-box{display:grid;place-items:center;width:28px;height:28px;border:2px solid var(--border-field);border-radius:6px;background:var(--surface);color:var(--success-fg);cursor:pointer}
.zd-auth__captcha[data-state="ok"] .zd-auth__captcha-box{border-color:var(--success-fg)}
.zd-auth__captcha>span:nth-child(2){flex:1;min-width:0}
.zd-auth__captcha-by{margin-left:auto;font:var(--type-meta);color:var(--text-3)}
:is([data-theme="dark"],.dark) .zd-tile{box-shadow:0 0 0 1px var(--border-subtle)}
:is([data-theme="dark"],.dark) .zd-auth__card{box-shadow:0 0 0 1px var(--border-subtle)}
.zd-input--search input::-webkit-search-cancel-button,.zd-input--search input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}
/* Ícones próprios: ponto Zap laranja no item selecionado */
.zd-ic-accent{fill:currentColor;stroke:currentColor}
.zd-navitem[aria-current="page"] .zd-ic-accent,.zd-localnav__item[aria-current="page"] .zd-ic-accent,.zd-tabs [aria-selected="true"] .zd-ic-accent,.zd-tile:hover:not(:disabled) .zd-ic-accent,.zd-newconn__opt:hover .zd-ic-accent{fill:var(--brand);stroke:var(--brand)}
.zd-navitem[aria-current="page"] .zd-icon--own{color:var(--text-1)}
/* Card laranja de destaque */
[data-card-tone="brand"]{--text-inverse:#17191C;--text-inverse-2:#3D1A00;--border-inverse:rgba(23,25,28,.14);--text-3:#3D1A00;--text-2:#3D1A00}
.zd-card--brand{background:var(--brand);color:#17191C;box-shadow:none}
.zd-card--brand .zd-btn--inverse{background:rgba(23,25,28,.12);color:#17191C}.zd-card--brand .zd-btn--inverse:hover{background:rgba(23,25,28,.2)}
.zd-card--brand .zd-btn--dark{background:#17191C;color:#fff}.zd-card--brand .zd-btn--dark:hover{background:#2B2E33}
:is([data-theme="dark"],.dark) .zd-card--brand{box-shadow:none;background:var(--brand)}
:is([data-theme="dark"],.dark) .zd-card--brand .zd-btn--inverse{background:rgba(23,25,28,.14);color:#17191C}
/* Gráficos v3: sem hachura nem tracejado */
.zd-chart__svg:focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px;border-radius:8px}
.zd-donut{display:flex;align-items:center;gap:var(--space-6);flex-wrap:wrap}
.zd-donut__ring{position:relative;flex:none}
.zd-donut__ring svg{display:block;overflow:visible}
.zd-donut__center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;padding:0 var(--zd-donut-pad,26px)}
.zd-donut__value{font:500 18px/24px var(--font-sans);white-space:nowrap;letter-spacing:-.02em;color:var(--text-1);font-variant-numeric:tabular-nums}
.zd-donut__label{font:var(--type-meta);color:var(--text-3);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zd-donut__legend{list-style:none;margin:0;padding:0;flex:1;min-width:240px;display:flex;flex-direction:column;gap:2px}
.zd-donut__legend li{display:grid;grid-template-columns:10px minmax(0,1fr) auto 44px;align-items:center;gap:10px;min-height:34px;padding:0 8px;border-radius:var(--radius-control);cursor:default;outline:none}
.zd-donut__legend li[data-active]{background:var(--surface-2)}
.zd-donut__legend li:focus-visible{box-shadow:0 0 0 2px var(--focus-ring)}
.zd-donut__sw{width:10px;height:10px;border-radius:3px}
.zd-donut__name{font:var(--type-body);color:var(--text-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zd-donut__num{font:var(--type-body);font-weight:var(--weight-medium);font-variant-numeric:tabular-nums;text-align:right}
.zd-donut__pct{font:var(--type-meta);color:var(--text-3);text-align:right;font-variant-numeric:tabular-nums}
.zd-hbar__fill{background:var(--zd-orange-200)}.zd-hbar__fill--hatch{background:var(--brand)}
/* Conexões */
.zd-conn__toolbar{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}
.zd-conn__plan{margin-left:auto;display:flex;align-items:center;gap:10px;font:var(--type-body);color:var(--text-2);white-space:nowrap}.zd-conn__plan .zd-progress{width:96px}.zd-conn__plan strong{color:var(--text-1);font-weight:600}
.zd-conn__bulk{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;min-height:44px;padding:4px var(--space-4);border-radius:var(--radius-popover)}
.zd-conn__bulk[data-active]{background:var(--brand-subtle)}
.zd-conn__bulkcount{margin-left:var(--space-2);font:var(--type-body);color:var(--text-1)}
.zd-conn{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-5)}
.zd-conn[data-selected]{box-shadow:0 0 0 2px var(--brand),var(--shadow-card)}
.zd-conn__head{display:flex;align-items:center;gap:var(--space-3);min-width:0}
.zd-conn__id{flex:1;min-width:0}
.zd-conn__name{margin:0;font:var(--type-component-title);letter-spacing:var(--ls-component);overflow-wrap:anywhere}
.zd-conn__sub{display:flex;flex-wrap:wrap;gap:4px 8px;font:var(--type-meta);color:var(--text-3);margin-top:2px}
.zd-conn__tools{display:flex;gap:2px;align-self:flex-start}
.zd-conn__chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.zd-conn__channel{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:var(--radius-pill);background:var(--surface-2);font:var(--type-meta-strong);color:var(--text-2)}
.zd-conn__channel>span{color:inherit!important;font:inherit}
.zd-conn__renew{padding:0;border:0;background:none;cursor:pointer;border-radius:var(--radius-pill)}.zd-conn__renew:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.zd-conn__alert{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:var(--radius-control);background:var(--danger-bg);color:var(--danger-fg);font:var(--type-body)}.zd-conn__alert .zd-icon{margin-top:2px;flex:none}
.zd-conn__note{margin:0;font:var(--type-body);color:var(--text-2);text-wrap:pretty}
.zd-conn__meta{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin:0}
.zd-conn__meta dt{font:var(--type-meta);color:var(--text-3)}.zd-conn__meta dd{margin:2px 0 0;font:var(--type-body);color:var(--text-1)}
.zd-conn__flows{border-radius:var(--radius-control);background:var(--surface-2)}
.zd-conn__flowsbtn{display:flex;align-items:center;gap:8px;width:100%;min-height:40px;padding:0 12px;border:0;background:none;font:var(--type-control);color:var(--text-1);cursor:pointer;border-radius:var(--radius-control);text-align:left}
.zd-conn__flowsbtn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px}
.zd-conn__flowlist{list-style:none;margin:0;padding:0 12px 10px;display:flex;flex-direction:column;gap:6px}
.zd-conn__flowlist li{display:flex;align-items:center;justify-content:space-between;gap:8px;font:var(--type-body)}
.zd-conn__toggles{display:flex;flex-direction:column;gap:10px;padding-top:var(--space-4);border-top:1px solid var(--zd-gray-50)}
.zd-conn__toggles .zd-check{width:100%}
.zd-conn__foot{margin-top:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:var(--space-4);border-top:1px solid var(--zd-gray-50)}
.zd-conn__foot:empty{display:none}
.zd-conn__hint{display:inline-flex;align-items:center;gap:6px;font:var(--type-meta);color:var(--text-3)}
.zd-conn__pop{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0;font:var(--type-body)}.zd-conn__pop dt{color:var(--text-3)}.zd-conn__pop dd{margin:0;color:var(--text-1)}
.zd-newconn{display:flex;flex-direction:column;gap:8px}
.zd-newconn__opt{display:flex;align-items:center;gap:var(--space-4);width:100%;padding:var(--space-3) var(--space-4);border:1px solid var(--border-subtle);border-radius:var(--radius-popover);background:var(--surface);font:inherit;color:inherit;text-align:left;cursor:pointer}
.zd-newconn__opt:hover{border-color:var(--brand-border);background:var(--brand-subtle)}
.zd-newconn__opt:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
:is([data-theme="dark"],.dark) .zd-conn{box-shadow:0 0 0 1px var(--border-subtle)}:is([data-theme="dark"],.dark) .zd-conn[data-selected]{box-shadow:0 0 0 2px var(--brand)}
.zd-chart-dot{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 2.5px var(--surface);pointer-events:none}
.zd-chart-dot--partial{background:var(--surface);box-shadow:inset 0 0 0 2.5px var(--brand),0 0 0 2px var(--surface)}
/* Mapa de calor */
.zd-heat{display:flex;flex-direction:column;gap:12px;min-width:0}
.zd-heat__scroll{overflow-x:auto;margin:0 -4px;padding:0 4px}
.zd-heat__grid{display:grid;gap:4px;min-width:560px;align-items:center}
.zd-heat__col{font:var(--type-meta);color:var(--text-3);text-align:center;font-variant-numeric:tabular-nums}
.zd-heat__row{font:var(--type-meta);color:var(--text-2);padding-right:8px;white-space:nowrap}
.zd-heat__cell,.zd-heat__swatch{display:block;height:24px;border-radius:6px;background:var(--surface-2);transition:box-shadow var(--dur-fast) var(--ease-standard)}
.zd-heat__swatch{width:14px;height:14px;border-radius:4px}
[data-l="1"].zd-heat__cell,[data-l="1"].zd-heat__swatch{background:color-mix(in oklab,var(--brand) 16%,var(--surface-2))}
[data-l="2"].zd-heat__cell,[data-l="2"].zd-heat__swatch{background:color-mix(in oklab,var(--brand) 34%,var(--surface-2))}
[data-l="3"].zd-heat__cell,[data-l="3"].zd-heat__swatch{background:color-mix(in oklab,var(--brand) 55%,var(--surface-2))}
[data-l="4"].zd-heat__cell,[data-l="4"].zd-heat__swatch{background:color-mix(in oklab,var(--brand) 78%,var(--surface-2))}
[data-l="5"].zd-heat__cell,[data-l="5"].zd-heat__swatch{background:var(--brand)}
.zd-heat__cell[data-on]{box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--text-1)}
.zd-heat__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.zd-heat__read{font:var(--type-body);color:var(--text-2);font-variant-numeric:tabular-nums}.zd-heat__read strong{color:var(--text-1);font-weight:var(--weight-medium)}
.zd-heat__legend{display:inline-flex;align-items:center;gap:4px;font:var(--type-meta);color:var(--text-3)}
/* Funil */
.zd-funnel{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.zd-funnel__step{display:flex;flex-direction:column;gap:6px}
.zd-funnel__conv{align-self:flex-start;display:inline-flex;white-space:nowrap;align-items:center;gap:4px;margin:2px 0 4px;padding:2px 8px;border-radius:var(--radius-pill);background:var(--surface-2);font:var(--type-meta-strong);color:var(--text-2);font-variant-numeric:tabular-nums}
.zd-funnel__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.zd-funnel__label{font:var(--type-body);color:var(--text-2)}
.zd-funnel__value{font:400 22px/28px var(--font-sans);letter-spacing:-.02em;color:var(--text-1);font-variant-numeric:tabular-nums}
.zd-funnel__track{height:14px;border-radius:var(--radius-pill);background:var(--chart-ghost);overflow:hidden}
.zd-funnel__bar{height:100%;border-radius:var(--radius-pill)}
/* Painel "Agora" */
.zd-now__stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.zd-now__stat{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:var(--radius-popover);background:var(--surface-2)}
.zd-now__stat b{font:400 30px/36px var(--font-sans);letter-spacing:-.03em;color:var(--text-1);font-variant-numeric:tabular-nums}
.zd-now__stat span{font:var(--type-body);color:var(--text-2)}
.zd-now__agent{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--zd-gray-50)}
.zd-now__agent:first-child{border-top:0}
.zd-composer__mode{white-space:nowrap}.zd-composer__hint{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zd-notif__foot{display:flex;align-items:center;gap:10px;padding:10px 12px 10px 16px;border-top:1px solid var(--border-subtle)}
.zd-notif__footic{display:flex;color:var(--text-2)}
.zd-notif__sound{flex:1;min-width:0}
/* Contador do sino: menor e deslocado para o canto, sem cobrir o contorno do ícone; mesmo laranja dos não lidos */
.zd-notif__count{top:3px;right:-1px;min-width:16px;height:16px;padding:0 4px;font:600 10px/16px var(--font-sans);background:var(--brand);color:var(--on-brand);box-shadow:0 0 0 2px var(--bg-app)}

/* styles/brand.css */
/* Elemento gráfico da marca — só em superfícies de marca (login, primeiros passos, card de destaque, materiais). Nunca em listas, tabelas, formulários ou atrás de texto corrido. */
.zd-brandmark{display:inline-block;flex:none;background:var(--brand);-webkit-mask:var(--zd-mark-z) center/contain no-repeat;mask:var(--zd-mark-z) center/contain no-repeat;aspect-ratio:var(--zd-mark-z-ratio);pointer-events:none}
.zd-brandmark--traco{-webkit-mask:var(--zd-mark-traco) 0 0/100% 100% no-repeat;mask:var(--zd-mark-traco) 0 0/100% 100% no-repeat;aspect-ratio:var(--zd-mark-traco-ratio)}
.zd-brandmark--soft{background:var(--brand-highlight)}
.zd-brandmark--ink{background:var(--text-1)}
.zd-brandmark--on-brand{background:rgba(110,36,0,.14)}
.zd-brandmark--current{background:currentColor}
/* Card de destaque com marca (opt-in: Card mark) — só quando o canto inferior direito fica vazio */
.zd-card--marked{position:relative;overflow:hidden;isolation:isolate}
.zd-card--marked::after{content:"";position:absolute;right:-28px;bottom:-40px;width:128px;aspect-ratio:var(--zd-mark-z-ratio);background:rgba(110,36,0,.12);-webkit-mask:var(--zd-mark-z) center/contain no-repeat;mask:var(--zd-mark-z) center/contain no-repeat;pointer-events:none;z-index:-1}
.zd-card--marked .zd-card__body,.zd-card--marked .zd-card__footer{padding-right:max(var(--space-5),112px)}
/* Título com traço Zap (onboarding, login, materiais) */
.zd-swoosh{position:relative;display:inline-block;z-index:0;white-space:nowrap}
.zd-swoosh::after{content:"";position:absolute;left:-1%;right:-7%;bottom:-.1em;height:.34em;background:var(--brand);-webkit-mask:var(--zd-mark-traco) 0 0/100% 100% no-repeat;mask:var(--zd-mark-traco) 0 0/100% 100% no-repeat;z-index:-1}
/* Login: Z grande cortado no canto */
.zd-auth{position:relative;overflow:hidden;isolation:isolate}
.zd-auth__mark{position:absolute;right:-90px;bottom:-150px;width:min(620px,58vw);z-index:-1}
@media (max-width:640px){.zd-auth__mark{width:300px;right:-90px;bottom:-80px}}
@media (prefers-reduced-motion:no-preference){.zd-auth__mark{animation:zd-mark-in 480ms var(--ease-enter) both}}
@keyframes zd-mark-in{from{opacity:0;transform:translate(24px,24px)}to{opacity:1;transform:none}}

