/* RW Orbit layout, Workspace line (approved preview, 17/10/2026).
   Everything is scoped to html.rw-layout, which rw-layout.js adds only in a browser that
   opened ?rw-layout=1. Without it the CRM looks exactly as before.
   Method: the Evo app paints every screen through its design tokens (Tailwind 4 + shadcn),
   so the tokens carry most of the change; the rest are targeted rules. No component,
   route or behaviour changes here. Inline colors are data or status and stay untouched:
   pipeline stage colors, the Concluir button (status color), labels, charts. */

@font-face{font-family:"DM Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(/rw-ui/fonts/dm-sans-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"DM Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(/rw-ui/fonts/dm-sans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* Tokens: light (proposal palette, with a little more contrast on secondary text) */
html.rw-layout{
  --font-sans:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
  --default-font-family:var(--font-sans);
  --background:#f2f6f3;
  --foreground:#1c2721;
  --card:#ffffff;
  --card-foreground:#1c2721;
  --popover:#ffffff;
  --popover-foreground:#1c2721;
  --primary:#087c5b;
  --primary-foreground:#ffffff;
  --secondary:#e8efea;
  --secondary-foreground:#1c2721;
  --muted:#edf2ee;
  --muted-foreground:#56645c;
  --accent:#d9f2e5;
  --accent-foreground:#146047;
  --border:#dde6df;
  --input:#d2ddd5;
  --ring:#087c5b;
  --radius:.875rem;
  --sidebar:#f2f6f3;
  --sidebar-foreground:#1c2721;
  --sidebar-primary:#087c5b;
  --sidebar-primary-foreground:#ffffff;
  --sidebar-accent:#d9f2e5;
  --sidebar-accent-foreground:#146047;
  --sidebar-border:#dde6df;
  --sidebar-ring:#087c5b;
  /* Font scale (Pedro, 22/10/2026: "aumente tbm a fonte do sistema, deixe um pouco maior"): one factor for the
     system text sizes and for every px size in this CSS. */
  --rw-fs:1.07;
  --text-xs:calc(.8125rem*var(--rw-fs));
  --text-xs--line-height:1.4;
  --text-sm:calc(.9375rem*var(--rw-fs));
  --text-sm--line-height:1.45;
  --text-base:calc(1rem*var(--rw-fs));
  --text-lg:calc(1.125rem*var(--rw-fs));
  --text-xl:calc(1.25rem*var(--rw-fs));
  --text-2xl:calc(1.5rem*var(--rw-fs));
  --rw-soft:#d9f2e5;
  --rw-soft-text:#146047;
  --rw-shadow:0 1px 2px rgb(20 40 30 / .05),0 2px 8px rgb(20 40 30 / .05);
}
/* Tokens: dark */
html.rw-layout.dark{
  --background:#161d19;
  --foreground:#e6eee8;
  --card:#212a24;
  --card-foreground:#e6eee8;
  --popover:#232d27;
  --popover-foreground:#e6eee8;
  --primary:#67ddb2;
  --primary-foreground:#11372b;
  --secondary:#28332c;
  --secondary-foreground:#e6eee8;
  --muted:#29342d;
  --muted-foreground:#a7b8ad;
  --accent:#2c493b;
  --accent-foreground:#9de9c6;
  --border:#334039;
  --input:#3a4840;
  --ring:#67ddb2;
  --sidebar:#161d19;
  --sidebar-foreground:#e6eee8;
  --sidebar-primary:#67ddb2;
  --sidebar-primary-foreground:#11372b;
  --sidebar-accent:#2c493b;
  --sidebar-accent-foreground:#9de9c6;
  --sidebar-border:#2c372f;
  --sidebar-ring:#67ddb2;
  --rw-soft:#2c493b;
  --rw-soft-text:#9de9c6;
  --rw-shadow:0 1px 2px rgb(0 0 0 / .25);
}
html.rw-layout body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}

/* Frame: one tinted surface for the whole app (top bar, menu and page), white blocks on it. */
html.rw-layout div.h-dvh:has(> div > main) > div.flex-shrink-0{background:transparent;border-bottom-color:transparent;box-shadow:none;padding-top:12px;padding-bottom:12px}
html.rw-layout div:has(> main) > div.bg-sidebar{background:transparent;border-right-color:transparent;width:15rem;overflow-y:auto;scrollbar-width:thin}
/* Legacy pilot used a fixed width even when native React collapsed to icons. */
html.rw-layout div:has(> main) > div.bg-sidebar.w-16{width:72px}
html.rw-layout div:has(> main) > main{background:transparent}

/* Menu: Gmail-like pills, active item in soft green. */
html.rw-layout div:has(> main) > div.bg-sidebar nav{flex:none;padding:4px 12px 10px}
html.rw-layout div:has(> main) > div.bg-sidebar nav > * + *{margin-top:2px}
html.rw-layout div:has(> main) > div.bg-sidebar nav a,
html.rw-layout div:has(> main) > div.bg-sidebar nav button{border-radius:999px;padding:8px 14px;color:var(--foreground)}
html.rw-layout div:has(> main) > div.bg-sidebar nav a:hover,
html.rw-layout div:has(> main) > div.bg-sidebar nav button:hover{background:color-mix(in oklab,var(--foreground) 6%,transparent)}
html.rw-layout div:has(> main) > div.bg-sidebar nav a.bg-primary\/15{background:var(--rw-soft);color:var(--rw-soft-text);font-weight:600;box-shadow:none}
html.rw-layout div:has(> main) > div.bg-sidebar nav a.bg-primary\/15 *{color:inherit}
html.rw-layout div:has(> main) > div.bg-sidebar nav a::before{display:none}

/* New: "Nova conversa" at the top of the menu (rw-layout.js). */
html.rw-layout .rw-l-new{display:flex;align-items:center;gap:10px;margin:2px 12px 10px;padding:13px 16px;border:0;border-radius:16px;background:var(--rw-soft);color:var(--rw-soft-text);font:600 calc(15px*var(--rw-fs))/1.2 var(--font-sans);box-shadow:var(--rw-shadow);cursor:pointer;transition:filter .15s,box-shadow .15s}
html.rw-layout .rw-l-new:hover{filter:brightness(.97);box-shadow:0 2px 10px rgb(20 40 30 / .12)}
html.rw-layout .rw-l-new svg{width:20px;height:20px}

/* New: user block above the credits at the bottom of the menu (rw-layout.js). */
html.rw-layout .rw-l-user{display:flex;align-items:center;gap:10px;width:calc(100% - 24px);margin:0 12px 10px;padding:10px 8px 0;border:0;border-top:1px solid var(--border);background:transparent;color:var(--foreground);text-align:left;cursor:pointer;font-family:var(--font-sans)}
html.rw-layout .rw-l-user .rw-l-avatar{position:relative;display:flex;align-items:center;justify-content:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--rw-soft);color:var(--rw-soft-text);font-weight:600;font-size:calc(14px*var(--rw-fs));overflow:hidden}
html.rw-layout .rw-l-user .rw-l-avatar img{width:100%;height:100%;object-fit:cover}
html.rw-layout .rw-l-user .rw-l-dot{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;border:2px solid var(--background);background:#9aa7a0}
html.rw-layout .rw-l-user .rw-l-dot[data-s=online]{background:#1fa971}
html.rw-layout .rw-l-user .rw-l-dot[data-s=busy]{background:#e0a21b}
html.rw-layout .rw-l-user b{display:block;font-size:calc(14px*var(--rw-fs));font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.rw-layout .rw-l-user small{display:block;font-size:calc(12.5px*var(--rw-fs));color:var(--muted-foreground);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.rw-layout .rw-l-user > span:last-child{min-width:0}

/* New: "Pesquisar no Orbit" in the top bar, Ctrl K (rw-layout.js). */
html.rw-layout .rw-l-search{display:flex;align-items:center;gap:10px;width:100%;max-width:720px;height:46px;margin:0 16px;padding:0 10px 0 16px;border:1px solid transparent;border-radius:999px;background:var(--card);color:var(--muted-foreground);font:calc(15px*var(--rw-fs)) var(--font-sans);box-shadow:var(--rw-shadow);cursor:text}
html.rw-layout .rw-l-search:hover{border-color:var(--border)}
html.rw-layout .rw-l-search svg{width:19px;height:19px;flex:none}
html.rw-layout .rw-l-search span{flex:1;text-align:left}
html.rw-layout .rw-l-pal .rw-l-close{flex:none;min-width:44px;height:32px;border:1px solid var(--border);border-radius:9px;background:var(--background);color:var(--muted-foreground);font:calc(12px*var(--rw-fs)) var(--font-sans);cursor:pointer}
html.rw-layout .rw-l-pal .rw-l-close:hover{color:var(--foreground);border-color:var(--muted-foreground)}
html.rw-layout .rw-l-search kbd,html.rw-layout .rw-l-pal kbd{font:calc(12px*var(--rw-fs)) var(--font-sans);padding:2px 7px;border:1px solid var(--border);border-radius:7px;color:var(--muted-foreground);background:var(--background)}
html.rw-layout .rw-l-overlay{position:fixed;inset:0;z-index:60;display:flex;justify-content:center;align-items:flex-start;padding:9vh 16px 16px;background:rgb(10 20 15 / .32)}
html.rw-layout .rw-l-pal{width:100%;max-width:640px;max-height:76vh;display:flex;flex-direction:column;border-radius:20px;background:var(--popover);color:var(--popover-foreground);box-shadow:0 18px 50px rgb(0 0 0 / .25);overflow:hidden;font-family:var(--font-sans)}
html.rw-layout .rw-l-pal header{display:flex;align-items:center;gap:10px;padding:0 14px 0 18px;border-bottom:1px solid var(--border)}
html.rw-layout .rw-l-pal header svg{width:20px;height:20px;color:var(--muted-foreground);flex:none}
html.rw-layout .rw-l-pal input{flex:1;min-width:0;height:58px;border:0;outline:0;background:transparent;color:var(--foreground);font:calc(16px*var(--rw-fs)) var(--font-sans)}
html.rw-layout .rw-l-pal .rw-l-title{padding:14px 18px 0;font-size:calc(13px*var(--rw-fs));font-weight:600;color:var(--muted-foreground)}
html.rw-layout .rw-l-results{overflow:auto;padding:6px 8px 10px}
html.rw-layout .rw-l-sec{padding:10px 10px 4px;font-size:calc(12px*var(--rw-fs));font-weight:650;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted-foreground)}
html.rw-layout .rw-l-item{display:flex;align-items:center;gap:12px;width:100%;padding:9px 10px;border:0;border-radius:12px;background:transparent;color:var(--foreground);text-align:left;font:calc(14.5px*var(--rw-fs)) var(--font-sans);cursor:pointer}
html.rw-layout .rw-l-item[aria-selected=true],html.rw-layout .rw-l-item:hover{background:var(--rw-soft);color:var(--rw-soft-text)}
html.rw-layout .rw-l-item .rw-l-ic{display:flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--muted);color:var(--muted-foreground);font-weight:600;font-size:calc(13px*var(--rw-fs))}
html.rw-layout .rw-l-item b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.rw-layout .rw-l-item small{display:block;font-size:calc(12.5px*var(--rw-fs));color:var(--muted-foreground);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.rw-layout .rw-l-item > span:last-child{min-width:0;flex:1}
html.rw-layout .rw-l-hint{padding:22px 18px;text-align:center;font-size:calc(14px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-l-foot{display:flex;gap:14px;padding:10px 18px;border-top:1px solid var(--border);font-size:calc(12.5px*var(--rw-fs));color:var(--muted-foreground)}

/* Page titles: small category label above a larger title (rw-layout.js sets --rw-eyebrow). */
/* Page titles get the label; titles that truncate inside a row (the pipeline name on the board)
   only grow a little, because a label outside their clipped box would be hidden. */
html.rw-layout main h1:not(.truncate){font-size:calc(28px*var(--rw-fs));line-height:1.2;font-weight:600;letter-spacing:-.6px}
html.rw-layout main h1:not(.truncate)::before{content:var(--rw-eyebrow,"");display:block;margin-bottom:6px;font-size:calc(11px*var(--rw-fs));line-height:1.2;font-weight:650;letter-spacing:1.6px;color:var(--muted-foreground)}
html.rw-layout main h1.truncate{font-size:calc(19px*var(--rw-fs));font-weight:600;letter-spacing:-.3px}

/* White blocks on the tinted page. */
html.rw-layout main .bg-card{box-shadow:var(--rw-shadow)}
html.rw-layout main .rounded-xl.border.bg-card,html.rw-layout main .rounded-lg.border.bg-card{border-color:transparent}

/* Primary buttons a bit softer and rounder, like the proposal. */
html.rw-layout main button.bg-primary,html.rw-layout main a.bg-primary{border-radius:12px}

/* Dashboard, as the proposal's "Visão geral": greeting, clean white cards, outline icons, big light numbers.
   Every metric of the Evo dashboard stays; the colored status badges (Atenção, Crítico...) stay too.
   The menu link keeps its name "Dashboard"; only the page greets by name (rw-layout.js sets --rw-hello). */
html.rw-layout[data-rw-page=dashboard] main h1:not(.truncate){font-size:0;letter-spacing:0;margin-bottom:6px}
html.rw-layout[data-rw-page=dashboard] main h1:not(.truncate)::before{content:"SEU DIA NO ORBIT"}
html.rw-layout[data-rw-page=dashboard] main h1:not(.truncate)::after{content:var(--rw-hello,"Dashboard");display:block;font-size:calc(28px*var(--rw-fs));line-height:1.2;font-weight:600;letter-spacing:-.6px;color:var(--foreground)}
html.rw-layout[data-rw-page=dashboard] main [data-slot=card]{background:var(--card);border-color:transparent;border-style:solid;border-radius:20px;box-shadow:var(--rw-shadow)}
html.rw-layout[data-rw-page=dashboard] main [data-slot=card-title]{font-size:calc(15px*var(--rw-fs));font-weight:600}
html.rw-layout[data-rw-page=dashboard] main [data-slot=card-header] .text-muted-foreground.font-medium{font-weight:500}
html.rw-layout[data-rw-page=dashboard] main .text-3xl.font-semibold{font-size:calc(34px*var(--rw-fs));font-weight:500;letter-spacing:-1px;line-height:1.15}
html.rw-layout[data-rw-page=dashboard] main [data-slot=card-header] > :last-child:not(:first-child):has(> svg){background:transparent;color:var(--muted-foreground);box-shadow:none}
html.rw-layout[data-rw-page=dashboard] main section > div:first-child h2{font-size:calc(18px*var(--rw-fs));font-weight:600;letter-spacing:-.2px}
html.rw-layout[data-rw-page=dashboard] main section{margin-top:8px}
/* Donut center label: "Participação" at 24px spilled over the ring (also in the original). */
html.rw-layout[data-rw-page=dashboard] main .absolute.top-1\/2.left-1\/2 .text-2xl{font-size:calc(16px*var(--rw-fs));line-height:1.2}
/* Period chip at the top right of the greeting, like the proposal's date selector. Desktop only: on a phone
   the side-by-side squeezed the greeting into two lines (seen on 18/10 after publishing). */
@media (min-width:768px){
  html.rw-layout[data-rw-page=dashboard] main .h-full.flex.flex-col.p-4.gap-6{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:16px}
  html.rw-layout[data-rw-page=dashboard] main .h-full.flex.flex-col.p-4.gap-6 > *{grid-column:1/-1}
  html.rw-layout[data-rw-page=dashboard] main .h-full.flex.flex-col.p-4.gap-6 > :first-child{grid-column:1;grid-row:1}
  html.rw-layout[data-rw-page=dashboard] main .h-full.flex.flex-col.p-4.gap-6 > .-mt-3.flex.justify-end{grid-column:2;grid-row:1;align-self:start;margin-top:24px}
}

/* 18/10: one navigation column, consistent expanded / rail widths. */
html.rw-layout div:has(> main) > div.rw-sidebar{width:264px;flex:0 0 264px;flex-direction:column;min-height:0;overflow:hidden;transition:width .18s ease,flex-basis .18s ease}
html.rw-layout div:has(> main) > .rw-sidebar[data-collapsed=true]{width:72px;flex-basis:72px}
html.rw-layout div.h-dvh > div.flex-shrink-0 .hidden.md\:flex > div.w-56{width:264px}
html.rw-layout div.h-dvh > div.flex-shrink-0 .hidden.md\:flex > div.w-16{width:72px}
html.rw-layout .rw-sidebar nav.rw-nav-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 10px 12px;scrollbar-width:thin;scrollbar-color:var(--input) transparent}
html.rw-layout .rw-nav-group+.rw-nav-group{margin-top:14px}
html.rw-layout .rw-nav-heading{padding:4px 14px 6px;color:var(--muted-foreground);font-size:calc(11px*var(--rw-fs));font-weight:650;letter-spacing:1px;text-transform:uppercase}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) :is(a,button).rw-nav-link{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;margin:2px 0;padding:10px 14px;border:0;border-radius:12px;background:transparent;color:var(--foreground);font:500 calc(15px*var(--rw-fs))/1.4 var(--font-sans);text-align:left;text-decoration:none}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link:hover{background:var(--secondary)}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link:focus-visible{outline:2px solid var(--ring);outline-offset:-2px}
html.rw-layout .rw-nav-link>svg{width:20px;height:20px;flex:none}
html.rw-layout .rw-nav-label{flex:1;min-width:0}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link.rw-nav-active{background:var(--rw-soft);color:var(--rw-soft-text);font-weight:650}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-parent-active{color:var(--primary)}
html.rw-layout .rw-nav-link>.rw-nav-chevron{width:16px;height:16px;transition:transform .15s}
html.rw-layout .rw-nav-link[aria-expanded=true]>.rw-nav-chevron{transform:rotate(90deg)}
html.rw-layout .rw-nav-sub{margin:4px 0 8px 13px;padding-left:9px;border-left:1px solid var(--border)}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link.rw-nav-child{font-size:calc(14px*var(--rw-fs));padding:9px 10px;gap:9px;min-height:44px}
html.rw-layout .rw-nav-child>svg{width:17px;height:17px}
html.rw-layout .rw-nav-subgroup+.rw-nav-subgroup{margin-top:12px}
html.rw-layout .rw-nav-subtitle{padding:9px 10px 4px;color:var(--muted-foreground);font-size:calc(12px*var(--rw-fs));font-weight:650}
html.rw-layout .rw-nav-settings-search{width:100%;min-width:0;height:44px;margin:4px 0 6px;padding:9px;border:1px solid var(--input);border-radius:10px;background:var(--card);color:var(--foreground);font:calc(13px*var(--rw-fs)) var(--font-sans)}
html.rw-layout .rw-nav-no-results{padding:8px;font-size:calc(13px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-nav-badge{border-radius:20px;padding:1px 7px;background:var(--primary);color:var(--primary-foreground);font-size:calc(12px*var(--rw-fs))}
html.rw-layout .rw-sidebar .rw-l-new{flex:none;min-height:48px;margin:4px 12px 12px;white-space:nowrap}
html.rw-layout .rw-sidebar .rw-l-user{flex:none;margin-bottom:8px}
html.rw-layout .rw-nav-footer{flex:none;padding:10px 20px 14px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:4px}
html.rw-layout .rw-nav-footer .rw-orbit-copyright{font-size:calc(11px*var(--rw-fs));margin-bottom:4px;color:var(--muted-foreground)}
html.rw-layout .rw-nav-footer a{font-size:calc(12px*var(--rw-fs));line-height:1.5;color:var(--muted-foreground);text-decoration:none}
html.rw-layout .rw-nav-footer a:hover{color:var(--primary);text-decoration:underline}
html.rw-layout .rw-sidebar[data-collapsed=true] :is(.rw-nav-label,.rw-nav-heading,.rw-nav-chevron,.rw-l-new>span,.rw-l-user>span:last-child,.rw-orbit-copyright){display:none}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-nav-group+.rw-nav-group{border-top:1px solid var(--border);padding-top:8px;margin-top:8px}
html.rw-layout .rw-sidebar[data-collapsed=true] nav .rw-nav-link{padding:0;justify-content:center;width:48px;height:44px;position:relative}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-nav-badge{position:absolute;right:-2px;top:-2px;padding:0 4px;font-size:calc(10px*var(--rw-fs))}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-l-new{padding:0;justify-content:center;width:48px;min-height:48px;border-radius:14px}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-l-user{padding:8px 0 0;justify-content:center}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-nav-footer{padding:4px 12px;gap:0}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-nav-footer a{display:flex;align-items:center;justify-content:center;width:48px;height:44px;font-size:0;border-radius:10px}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-nav-footer a::before{content:"?";font-size:calc(18px*var(--rw-fs))}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-nav-footer a:last-child::before{content:"↗"}
html.rw-layout .rw-mobile-nav{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:8px 12px 24px;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
html.rw-layout [role=dialog]:has(.rw-mobile-nav){display:flex;flex-direction:column;width:min(340px,calc(100vw - 28px));max-height:100dvh;gap:0}
html.rw-layout [role=dialog]:has(.rw-mobile-nav)>div:has(>h2){padding:16px 20px}
html.rw-layout [role=dialog]:has(.rw-mobile-nav)>.p-4{padding:8px 16px;flex:none}
html.rw-layout [role=dialog]:has(.rw-mobile-nav) input{font-size:calc(16px*var(--rw-fs))}

/* Pipeline: a persistent, contrasted native horizontal scrollbar. */
html.rw-layout [data-rw-board-host]{display:flex;flex-direction:column;min-height:0}
html.rw-layout [data-rw-board-host]>.overflow-x-auto.overflow-y-hidden{flex:1;min-height:0;height:auto}
html.rw-layout[data-rw-page=pipelines] main .overflow-x-auto.overflow-y-hidden:has(> .flex > div[style*="0 0 340px"]){scrollbar-width:auto;scrollbar-color:var(--primary) var(--input);padding-bottom:12px}
html.rw-layout[data-rw-page=pipelines] main .overflow-x-auto.overflow-y-hidden::-webkit-scrollbar{height:14px}
html.rw-layout[data-rw-page=pipelines] main .overflow-x-auto.overflow-y-hidden::-webkit-scrollbar-track{background:var(--input);border-radius:10px}
html.rw-layout[data-rw-page=pipelines] main .overflow-x-auto.overflow-y-hidden::-webkit-scrollbar-thumb{background:var(--primary);border:3px solid var(--input);border-radius:10px}
html.rw-layout .rw-board-navigation{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:4px 16px;background:var(--background);border-bottom:1px solid var(--border);flex:none}
html.rw-layout .rw-board-navigation[hidden]{display:none}
html.rw-layout .rw-board-navigation>span{margin-right:auto;color:var(--muted-foreground);font-size:calc(12px*var(--rw-fs))}
html.rw-layout .rw-board-navigation button{width:44px;height:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:10px;background:var(--card);color:var(--primary)}
html.rw-layout .rw-board-navigation button:disabled{opacity:.35}
html.rw-layout .rw-board-navigation svg{width:20px;height:20px}

/* Tools/MCP: creation has its own header slot; collection controls share a second row. */
html.rw-layout [data-rw-collection-header]{position:relative;padding-right:min(420px,46%);min-height:80px;padding-bottom:20px}
html.rw-layout [data-rw-collection-create]{position:absolute;right:34px;top:26px;margin:0}
html.rw-layout [data-rw-collection-create] button{min-height:44px;white-space:normal;text-align:center;line-height:1.3;max-width:385px}
html.rw-layout [data-rw-collection-toolbar]{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;margin:20px 0 16px;padding:14px;background:var(--card);border:1px solid var(--border);border-radius:16px}
html.rw-layout [data-rw-collection-toolbar]>[data-tour$="-header"]{margin:0;min-width:0}
html.rw-layout [data-rw-collection-toolbar] input{max-width:100%;height:44px}
html.rw-layout [data-rw-collection-toolbar] button{min-height:44px;min-width:44px}
html.rw-layout [data-rw-collection-view]{margin:0;padding-left:16px;border-left:1px solid var(--border)}
html.rw-layout [data-rw-collection-view] button[aria-pressed=true]{background:var(--rw-soft);color:var(--rw-soft-text)}
@media(min-width:768px) and (max-width:1100px){
  html.rw-layout [data-rw-collection-header]{padding-right:34px}
  html.rw-layout [data-rw-collection-create]{position:static;margin:14px 0 4px;display:flex;justify-content:flex-end}
  html.rw-layout [data-rw-collection-create] button{max-width:100%}
  html.rw-layout [data-rw-collection-header] [role=tablist]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;overflow:visible}
  html.rw-layout [data-rw-collection-header] [role=tab]{min-height:68px;height:100%;flex-direction:column;white-space:normal;padding:7px 4px;font-size:calc(13px*var(--rw-fs));line-height:1.25;text-align:center}
}
@media(max-width:767px){
  html.rw-layout .rw-board-navigation{display:none}
  html.rw-layout [data-rw-collection-header]{padding:18px 16px 12px}
  html.rw-layout [data-rw-collection-header]>p{font-size:calc(14px*var(--rw-fs))}
  html.rw-layout [data-rw-collection-header] [role=tablist]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;overflow:visible;padding-bottom:0}
  html.rw-layout [data-rw-collection-header] [role=tab]{min-height:68px;height:100%;align-self:stretch;flex-direction:column;white-space:normal;padding:7px 4px;font-size:calc(12px*var(--rw-fs));line-height:1.25;text-align:center;gap:5px}
  html.rw-layout [data-rw-collection-create]{position:static;margin:14px 0 4px;display:flex;justify-content:flex-end}
  html.rw-layout [data-rw-collection-create] button{max-width:100%;font-size:calc(14px*var(--rw-fs));padding:8px 12px}
  html.rw-layout [data-rw-collection-toolbar]{grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-top:14px;padding:10px}
  html.rw-layout [data-rw-collection-toolbar]>[data-tour$="-header"]{grid-column:1/-1}
  html.rw-layout [data-rw-collection-view]{grid-column:1/-1;padding:0;border-left:0;justify-self:end}
  html.rw-layout [data-rw-collection-page]{padding-left:16px;padding-right:16px}
}
@media(prefers-reduced-motion:reduce){html.rw-layout :is(.rw-sidebar,.rw-nav-chevron,.rw-nav-content){transition:none!important;animation:none!important}}
html.rw-layout[data-rw-page=dashboard] main .-mt-3.flex.justify-end > span{padding:9px 14px;border-radius:12px;border-color:var(--border);background:var(--card);font-size:calc(14px*var(--rw-fs));font-weight:500;box-shadow:var(--rw-shadow)}

/* Canais: compact cards, 4 per row on wide screens, equal heights, light actions at the bottom.
   Order (messaging first, WhatsApp leading, decided by Pedro on 17/10) comes from rw-layout.js. */
html.rw-layout[data-rw-page=channels] main .grid.lg\:grid-cols-3.items-start{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));align-items:stretch;gap:14px}
html.rw-layout[data-rw-page=channels] main .grid.lg\:grid-cols-3.items-start > div{border-color:transparent;border-radius:18px;box-shadow:var(--rw-shadow)}
html.rw-layout[data-rw-page=channels] main .grid.lg\:grid-cols-3.items-start > div > .flex.flex-col.gap-3.p-5{flex:1}
html.rw-layout[data-rw-page=channels] main .grid.lg\:grid-cols-3.items-start > div > .flex.flex-col.gap-3.p-5 > button:last-child{margin-top:auto;background:transparent;border:1px dashed var(--border);color:var(--primary);box-shadow:none}
html.rw-layout[data-rw-page=channels] main .grid.lg\:grid-cols-3.items-start > div > .flex.flex-col.gap-3.p-5 > button:last-child:hover:not(:disabled){border-style:solid;border-color:var(--primary);background:color-mix(in oklab,var(--primary) 8%,transparent)}

/* Secondary menu (Contatos > Ações Agendadas, Configurações, Agentes de IA): a white block beside the menu. */
html.rw-layout div:has(> main) > div.bg-sidebar.w-64{background:var(--card);border-radius:18px;margin:0 12px 12px 0;box-shadow:var(--rw-shadow);width:13.5rem}

/* Tables (contacts, settings lists...): white block, quieter header, roomier rows. */
html.rw-layout main div.rounded-lg.border.bg-sidebar:has(table){background:var(--card);border-radius:18px;box-shadow:var(--rw-shadow);padding:4px 10px}
html.rw-layout main table{font-size:calc(14.5px*var(--rw-fs))}
html.rw-layout main table thead tr{background:transparent}
html.rw-layout main table thead th{font-size:calc(13px*var(--rw-fs));font-weight:500;color:var(--muted-foreground)}
html.rw-layout main table tbody td{padding-top:12px;padding-bottom:12px}
html.rw-layout main table tbody tr{border-color:var(--border)}
/* 21/10: so com mouse; no toque o destaque ficava preso no cartao tocado e parecia selecao (print do Pedro em Tokens) */
@media(hover:hover){html.rw-layout main table tbody tr:hover{background:color-mix(in oklab,var(--primary) 5%,transparent)}}

/* Page search fields and toolbar buttons a bit taller and rounder, like the proposal. */
html.rw-layout main input.h-9{height:42px;border-radius:12px;background:var(--card);font-size:calc(15px*var(--rw-fs))}
html.rw-layout main button.h-9{height:40px;border-radius:12px}

/* Phone, all pages: no category label above the title (it cost a line), slightly smaller title. */
@media (max-width:767px){
  html.rw-layout main h1:not(.truncate)::before{display:none}
  html.rw-layout main h1:not(.truncate){font-size:calc(24px*var(--rw-fs))}
  html.rw-layout[data-rw-page=dashboard] main h1:not(.truncate)::after{font-size:calc(24px*var(--rw-fs))}
}

/* Contatos on a phone (measured 18/10: first contact at 341 px, a 971 px table in a 369 px screen, three
   rows visible at a time in an inner scroll box). Each row becomes a card; no column, sort, selection,
   export, import, filter, pagination or row action is removed. Empty cells ("—") hide on the phone only
   (rw-layout.js marks them with data-rw-empty). Desktop is untouched. */
@media (max-width:767px){
  /* Title and Novo Contato on one line; Exportar, Importar and Filtros on one line. */
  html.rw-layout[data-rw-page=contacts] main .space-y-4 > div:first-child{flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
  html.rw-layout[data-rw-page=contacts] main .space-y-4 > div:first-child h1{margin:0}
  html.rw-layout[data-rw-page=contacts] main .space-y-4 > div:first-child button{min-height:44px;padding:0 14px;flex:none}
  html.rw-layout[data-rw-page=contacts] main .space-y-4{margin-bottom:0}
  html.rw-layout[data-rw-page=contacts] main .space-y-4 > div + div button{min-height:44px}
  /* Reserve actual room for Filtros instead of painting it over Importar. */
  html.rw-layout[data-rw-page=contacts] main .space-y-4 > div + div > .flex.items-center.gap-2{width:calc(100% - 104px);gap:6px}
  html.rw-layout[data-rw-page=contacts] main .space-y-4 > div + div > .flex.items-center.gap-2 button{flex:1;min-width:0;padding-inline:6px;font-size:calc(13px*var(--rw-fs));gap:4px}
  html.rw-layout[data-rw-page=contacts] main .h-full.flex.flex-col > .flex.items-center.justify-end{margin:-44px 0 8px auto;width:max-content;position:relative}
  html.rw-layout[data-rw-page=contacts] main .h-full.flex.flex-col > .flex.items-center.justify-end button{min-height:44px}
  /* The page scrolls as a whole; the list is no longer an inner box of 354 px. */
  html.rw-layout[data-rw-page=contacts] main .h-full.flex.flex-col{height:auto;min-height:100%}
  html.rw-layout[data-rw-page=contacts] main .h-full.flex.flex-col > .flex-1.overflow-auto{flex:none;overflow:visible}
  html.rw-layout[data-rw-page=contacts] main div.rounded-lg.border.bg-sidebar:has(table),
  html.rw-layout[data-rw-page=contacts] main div.relative.w-full.overflow-x-auto:has(> table){overflow:visible;background:transparent;box-shadow:none;padding:0}
  html.rw-layout[data-rw-page=contacts] main table{display:block;width:100%;min-width:0}
  /* Sort and select-all stay, as a compact bar. Header cells that are only labels hide. */
  html.rw-layout[data-rw-page=contacts] main thead{display:block}
  html.rw-layout[data-rw-page=contacts] main thead tr{display:flex;align-items:center;gap:4px;flex-wrap:wrap;padding:0 4px 6px;border:0;background:transparent}
  html.rw-layout[data-rw-page=contacts] main thead th{display:block;width:auto !important;min-width:0;flex:none;height:auto;padding:0;border:0;background:transparent}
  html.rw-layout[data-rw-page=contacts] main thead th:nth-child(n+5){display:none}
  html.rw-layout[data-rw-page=contacts] main thead th:first-child{width:44px;display:flex;align-items:center;justify-content:center}
  html.rw-layout[data-rw-page=contacts] main thead th button{min-height:44px;padding:0 10px;border-radius:999px;font-size:calc(13px*var(--rw-fs))}
  html.rw-layout[data-rw-page=contacts] main input.h-9{height:44px}
  /* Rows as cards: line 1 selection, name, conversation and menu; then e-mail and phone; then the badges. */
  html.rw-layout[data-rw-page=contacts] main tbody{display:flex;flex-direction:column;gap:10px}
  html.rw-layout[data-rw-page=contacts] main tbody tr{display:flex;flex-wrap:wrap;align-items:center;row-gap:2px;padding:10px 6px 12px 0;background:var(--card);border:0;border-radius:16px;box-shadow:var(--rw-shadow)}
  html.rw-layout[data-rw-page=contacts] main tbody td{display:block;padding:0;border:0;white-space:normal;min-width:0}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(1){flex:0 0 44px;display:flex;align-items:center;justify-content:center;order:1}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(2){flex:1 1 0;order:2;overflow:hidden}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(9){flex:0 0 44px;order:3;display:flex;justify-content:center}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(10){flex:0 0 44px;order:4;display:flex;justify-content:center}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(3),
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(4){flex:0 0 100%;order:5;padding-left:44px;font-size:calc(14px*var(--rw-fs));color:var(--muted-foreground);overflow-wrap:anywhere}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(4){order:6}
  /* Forced line break before the badges: with e-mail and phone empty (hidden), the badges climbed to the
     first line and squeezed the name to zero width, letter by letter (seen in the test, 18/10). */
  html.rw-layout[data-rw-page=contacts] main tbody tr::after{content:"";flex:0 0 100%;order:6;height:0}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(2) *{min-width:0}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(n+5):nth-child(-n+8){order:7;margin-top:6px}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(5){margin-left:44px}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(n+6):nth-child(-n+8){margin-left:6px}
  html.rw-layout[data-rw-page=contacts] main tbody td[data-rw-empty]{display:none}
  html.rw-layout[data-rw-page=contacts] main tbody td button{min-width:44px;min-height:44px}
  /* The selection box keeps its look; its touch area grows to 44 px. */
  html.rw-layout[data-rw-page=contacts] main button[role=checkbox]{position:relative}
  html.rw-layout[data-rw-page=contacts] main button[role=checkbox]::after{content:"";position:absolute;inset:-14px}
  html.rw-layout[data-rw-page=contacts] main tbody td:nth-child(1) button[role=checkbox],
  html.rw-layout[data-rw-page=contacts] main thead th:first-child button[role=checkbox]{min-width:0;min-height:0}
}

/* Conversations: list and chat as two separate white blocks. */
@media (min-width:768px){
  html.rw-layout main > div > .h-full.w-full.flex.md\:flex-row{gap:12px;padding:0 12px 12px 0}
  html.rw-layout main > div > .h-full.w-full.flex.md\:flex-row > *{background:var(--card);border:0;border-radius:18px;box-shadow:var(--rw-shadow);overflow:hidden}
}

/* Pipelines board. Hook: each column wrapper carries the inline style flex:0 0 340px, and
   the generator adds --rw-stage (the stage color) to that same style. Every field of the
   Evo card stays; only the look changes. The stage color keeps its top bar and dot. */
html.rw-layout .overflow-x-auto.overflow-y-hidden > .flex.gap-6{gap:16px}
html.rw-layout div[style*="0 0 340px"] > div.rounded-xl.border{background:color-mix(in oklab,var(--rw-stage,var(--muted)) 7%,var(--muted));border-color:transparent;border-radius:18px}
html.rw-layout div[style*="0 0 340px"] > div > .border-t-\[3px\]{border-bottom-color:transparent;padding:14px 12px 6px 14px;align-items:flex-start}
html.rw-layout div[style*="0 0 340px"] > div > .border-t-\[3px\] > .min-w-0{flex-wrap:wrap;row-gap:6px}
html.rw-layout div[style*="0 0 340px"] > div > .border-t-\[3px\] > .min-w-0 > span:first-child{margin-top:6px;align-self:flex-start}
html.rw-layout div[style*="0 0 340px"] > div > .border-t-\[3px\] h3{flex:1 1 calc(100% - 20px);font-size:calc(15.5px*var(--rw-fs));line-height:1.35;white-space:normal;text-overflow:clip;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.rw-layout div[style*="0 0 340px"] > div > .border-t-\[3px\] h3 + span{margin-left:17px;padding:1px 9px;border-radius:999px;background:var(--card);color:var(--foreground);font-weight:600;font-size:calc(13px*var(--rw-fs))}
html.rw-layout div[style*="0 0 340px"] .group.relative.rounded-xl{background:var(--card);border-color:transparent;border-radius:14px;box-shadow:var(--rw-shadow)}
html.rw-layout div[style*="0 0 340px"] .group.relative.rounded-xl:hover{border-color:color-mix(in oklab,var(--primary) 35%,transparent);box-shadow:0 4px 14px rgb(20 40 30 / .12)}
html.rw-layout div[style*="0 0 340px"] .group.relative.rounded-xl h4{font-size:calc(15.5px*var(--rw-fs))}
html.rw-layout div[style*="0 0 340px"] .group.relative.rounded-xl .bg-muted\/50.rounded-lg{background:var(--muted);border-left:3px solid color-mix(in oklab,var(--rw-stage,var(--primary)) 70%,transparent);border-radius:4px 10px 10px 4px}
html.rw-layout div[style*="0 0 340px"] .group.relative.rounded-xl .font-bold.text-primary{font-size:calc(15px*var(--rw-fs))}
html.rw-layout div[style*="0 0 340px"] .group.relative.rounded-xl .flex-wrap > span{font-size:calc(12.5px*var(--rw-fs))}
html.rw-layout div[style*="0 0 340px"] .space-y-3 > button[type=button]:last-child{border:1.5px dashed color-mix(in oklab,var(--rw-stage,var(--border)) 35%,var(--border));color:var(--muted-foreground);background:transparent}
html.rw-layout div[style*="0 0 340px"] .space-y-3 > button[type=button]:last-child:hover{color:var(--primary);border-color:var(--primary);background:color-mix(in oklab,var(--primary) 8%,transparent)}
@media (max-width:767px){
  html.rw-layout[data-rw-page=pipelines] main .border-t > .flex.items-center.gap-3{min-width:0;gap:8px}
  html.rw-layout[data-rw-page=pipelines] main .border-t > .flex.items-center.gap-3 > .relative{width:auto;min-width:0;flex:1;flex-shrink:1}
  html.rw-layout[data-rw-page=pipelines] main .border-t > .flex.items-center.gap-3 > button{min-height:44px}
  html.rw-layout .overflow-x-auto.overflow-y-hidden:has(> .flex > div[style*="0 0 340px"]){scroll-snap-type:x mandatory;scroll-padding-inline:16px;padding-left:16px;padding-right:16px;overscroll-behavior-x:contain}
  html.rw-layout div[style*="0 0 340px"]{flex:0 0 calc(100vw - 56px) !important;scroll-snap-align:start;scroll-snap-stop:always}
  html.rw-layout div[style*="0 0 340px"] .overflow-y-auto{overscroll-behavior-y:contain;overscroll-behavior-x:auto}
}

/* Conversation list header: the larger type wrapped "17 conversas" into two lines. */
html.rw-layout .border-b.space-y-3 > .flex.items-center.justify-between > .text-sm.text-muted-foreground{white-space:nowrap}

/* Hard-coded sizes in the bundle (text-[13px] and friends) skip the tokens: same step up, 12px floor. */
html.rw-layout .text-\[10px\],html.rw-layout .text-\[11px\]{font-size:calc(12px*var(--rw-fs))}
html.rw-layout .text-\[11\.5px\]{font-size:calc(12.5px*var(--rw-fs))}
html.rw-layout .text-\[12px\]{font-size:calc(13px*var(--rw-fs))}
html.rw-layout .text-\[12\.5px\]{font-size:calc(13.5px*var(--rw-fs))}
html.rw-layout .text-\[13px\]{font-size:calc(14px*var(--rw-fs))}
html.rw-layout .text-\[13\.5px\]{font-size:calc(14.5px*var(--rw-fs))}
html.rw-layout .text-\[14\.5px\]{font-size:calc(15.5px*var(--rw-fs))}
html.rw-layout .text-\[15px\]{font-size:calc(16px*var(--rw-fs))}

/* Hand cursor on everything clickable. */
html.rw-layout :where(button:not(:disabled),[role=button],[role=tab],[role=menuitem],[role=menuitemcheckbox],[role=menuitemradio],[role=option],[role=switch],[role=checkbox],[role=radio],a[href],summary,label[for],select:not(:disabled)){cursor:pointer}
html.rw-layout :where(button:disabled,[aria-disabled=true]){cursor:not-allowed}

/* Mobile navigation uses the same native destinations and dialogs as desktop. */
html.rw-layout .rw-l-mobile{display:flex;gap:8px;padding:8px 16px 12px}
html.rw-layout .rw-l-mobile button{flex:1;min-height:44px;border:1px solid var(--border);border-radius:12px;background:var(--card);color:var(--foreground);font:500 calc(14px*var(--rw-fs)) var(--font-sans);display:flex;align-items:center;justify-content:center;gap:8px}
html.rw-layout .rw-l-mobile svg{width:18px;height:18px}
html.rw-layout .rw-l-mobile button:first-child{flex:0 0 44px}
html.rw-layout .rw-l-mobile button:first-child span{display:none}
@media (max-width:767px){
  /* An open conversation already has its own Back control: give its space to messages. */
  html.rw-layout[data-rw-chat-open] div.h-dvh:has(> div > main) > div.flex-shrink-0{display:none}
  html.rw-layout[data-rw-page=conversations] main button{min-height:44px;min-width:44px}
  html.rw-layout[data-rw-page=conversations] main [contenteditable=true]{font-size:calc(16px*var(--rw-fs))}
  html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex.items-center.justify-between{flex-wrap:wrap;gap:8px}
  html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .min-w-0{flex:1 1 100%}
  html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .min-w-0 > .min-w-0{flex:1}
  html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .flex.items-center.gap-2{margin-left:auto}
  /* Full-width writing field; native attachments, emoji, macros and audio all remain. */
  html.rw-layout[data-rw-chat-open] main .flex.items-center.gap-2.px-4.py-3.relative:has([contenteditable=true]){display:grid;grid-template-columns:44px 44px 44px minmax(0,1fr) 44px;padding:8px 12px}
  html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative > .flex-1:has([contenteditable=true]){grid-column:1/-1;grid-row:1}
  html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > .flex-shrink-0{grid-row:2}
  html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > button{grid-column:5;grid-row:2}
  html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > span{display:contents}
}
/* Channel management: one spacing scale and a clearly bounded editing surface. */
html.rw-layout .rw-wa-surface{background:var(--card);border:1px solid color-mix(in srgb,var(--foreground) 22%,var(--card));border-radius:18px;box-shadow:0 3px 12px #00000008;overflow:hidden}
html.rw-layout .rw-wa-toolbar{border-bottom:1px solid var(--border);padding:20px 24px}
html.rw-layout .rw-wa-table-wrap{padding:16px 24px 0}
html.rw-layout .rw-wa-table th{background:color-mix(in srgb,var(--foreground) 9%,var(--card));color:var(--foreground);font-weight:600;padding:14px 12px}
html.rw-layout .rw-wa-table td{padding:18px 12px;border-bottom:1px solid color-mix(in srgb,var(--foreground) 20%,var(--card))}
html.rw-layout .rw-wa-table tbody tr:nth-child(even){background:color-mix(in srgb,var(--foreground) 4%,var(--card))}
@media(hover:hover){html.rw-layout .rw-wa-table tbody tr:hover{background:color-mix(in srgb,var(--primary) 6%,var(--card))}}
html.rw-layout .rw-wa-dialog-foot{background:color-mix(in srgb,var(--foreground) 4%,var(--card));padding:16px 24px;gap:16px}
html.rw-layout .rw-wa-button{min-height:44px;padding:10px 16px;border-radius:10px;font-weight:600}
html.rw-layout .rw-wa-outline,html.rw-layout .rw-wa-dialog-foot .rw-wa-text{border:1px solid color-mix(in srgb,var(--foreground) 32%,var(--card));background:var(--card);color:var(--foreground);min-height:44px;padding:10px 16px;border-radius:10px;text-decoration:none}
html.rw-layout .rw-wa-dialog-foot .rw-wa-text:hover{background:var(--accent);border-color:var(--primary)}
html.rw-layout .rw-wa-muted{color:var(--muted-foreground)}
html.rw-layout main:has(.rw-channel-settings){overflow:hidden}
html.rw-layout .rw-channel-settings{height:calc(100% - 32px);margin:16px;border:1px solid color-mix(in srgb,var(--foreground) 20%,var(--card));border-radius:18px;overflow:hidden;background:var(--card);min-width:0}
html.rw-layout .rw-channel-settings-head{flex-shrink:0;padding:4px 4px 0;border-bottom:1px solid color-mix(in srgb,var(--foreground) 20%,var(--card))}
html.rw-layout .rw-channel-settings-head h1{white-space:normal;overflow-wrap:anywhere;line-height:1.4;font-size:calc(20px*var(--rw-fs))}
html.rw-layout .rw-channel-settings-head button{min-height:44px;gap:4px}
html.rw-layout .rw-channel-settings-scroll{min-height:0;overscroll-behavior-y:contain;background:var(--background);scrollbar-gutter:stable}
html.rw-layout .rw-channel-settings-scroll>div{padding:24px}
html.rw-layout .rw-channel-settings [role=tablist]{gap:6px;padding:0 0 12px;border-bottom:1px solid color-mix(in srgb,var(--foreground) 18%,var(--background));border-radius:0;scrollbar-width:thin;scrollbar-color:var(--primary) transparent}
html.rw-layout .rw-channel-settings [role=tab]{min-height:44px;flex-shrink:0}
html.rw-layout .rw-channel-settings [role=tabpanel]{min-width:0}
html.rw-layout .rw-channel-settings [data-slot=card]{padding-block:0;border:1px solid color-mix(in srgb,var(--foreground) 15%,var(--card));border-radius:16px;box-shadow:0 2px 5px #00000006}
html.rw-layout .rw-channel-settings [data-slot=card-content]{padding:24px}
html.rw-layout .rw-channel-settings-save{flex-shrink:0;padding:14px 24px;min-height:72px;border-top:1px solid color-mix(in srgb,var(--foreground) 22%,var(--card));box-shadow:0 -4px 12px #00000006;z-index:1}
html.rw-layout .rw-channel-settings-save button{min-height:44px}
html.rw-layout .rw-instance-disconnect{background:#b91c1c!important;color:#fff!important;border:1px solid #b91c1c!important;font-weight:600}
html.rw-layout .rw-instance-disconnect:hover{background:#991b1b!important;border-color:#991b1b!important}
html.rw-layout .rw-instance-connection-body{padding:24px}
html.rw-layout .rw-attendant-rows{display:grid;gap:10px}
html.rw-layout .rw-attendant-rows>[role=checkbox]{padding:16px;min-width:0;min-height:76px;outline-offset:3px}
html.rw-layout .rw-attendant-rows>[role=checkbox]:focus-visible{outline:2px solid var(--primary)}
html.rw-layout .rw-attendant-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:16px;margin-top:16px;border-top:1px solid var(--border);font-size:calc(13px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-attendant-pagination button{min-height:44px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--foreground) 28%,var(--card));border-radius:10px;background:var(--card);color:var(--foreground);font:inherit;font-weight:600;cursor:pointer}
html.rw-layout .rw-attendant-pagination button:hover:not(:disabled){background:var(--accent)}
html.rw-layout .rw-attendant-pagination button:disabled{opacity:.45;cursor:default}
html.rw-layout .rw-attendant-pages{display:flex;gap:8px}
html.rw-layout .rw-business-day{padding:16px;gap:16px;min-height:80px;background:var(--card)}
html.rw-layout .rw-business-day:nth-child(even){background:color-mix(in srgb,var(--foreground) 3%,var(--card))}
html.rw-layout .rw-business-day:last-child{border-bottom:0}
html.rw-layout .rw-business-day>div:nth-child(2){padding:0;min-width:130px}
html.rw-layout .rw-business-day>div:first-child{min-width:24px;min-height:44px;justify-content:center}
html.rw-layout .rw-business-day button[role=checkbox]{width:24px;height:24px}
html.rw-layout .rw-business-day [data-slot=select-trigger]{min-height:44px;width:136px;background:var(--card)}
html.rw-layout .rw-business-day>div:nth-child(3)>div:first-child{flex-wrap:wrap;gap:12px}
html.rw-layout .rw-agent-summary{padding:20px;background:color-mix(in srgb,var(--primary) 5%,var(--card))}
html.rw-layout .rw-agent-summary>div{gap:16px}
html.rw-layout .rw-agent-summary>div>div:first-child{align-items:flex-start;min-width:0;flex:1}
html.rw-layout .rw-agent-summary>div>div:first-child>div:first-child{flex-shrink:0}
html.rw-layout .rw-agent-summary h5{font-size:calc(16px*var(--rw-fs));line-height:1.5;overflow-wrap:anywhere;margin-bottom:6px}
html.rw-layout .rw-agent-summary p{line-height:1.6}
html.rw-layout .rw-agent-metadata{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
html.rw-layout .rw-agent-metadata>span{padding:7px 10px;border:1px solid color-mix(in srgb,var(--foreground) 20%,var(--card));border-radius:8px;background:var(--card);color:var(--foreground);overflow-wrap:anywhere;line-height:1.4}
html.rw-layout .rw-agent-select{width:min(100%,680px)!important;min-height:70px!important;height:auto!important;padding:12px 16px!important;background:var(--card)!important;text-align:left;white-space:normal!important}
html.rw-layout .rw-agent-select [data-slot=select-value]{display:block!important;min-width:0;overflow:visible!important;-webkit-line-clamp:unset!important;text-align:left}
html.rw-layout .rw-agent-select [data-slot=select-value]>div{align-items:flex-start;gap:12px}
html.rw-layout .rw-agent-select [data-slot=select-value]>div>div{min-width:0;line-height:1.5}
html.rw-layout .rw-agent-select [data-slot=select-value] .font-medium{overflow-wrap:anywhere;white-space:normal}
html.rw-layout .rw-agent-options{max-width:calc(100vw - 24px);width:var(--radix-select-trigger-width)}
html.rw-layout .rw-agent-options [role=option]{min-height:68px;padding:12px 36px 12px 12px;white-space:normal;overflow-wrap:anywhere}
html.rw-layout .rw-agent-options [data-slot=select-item-text]>div{align-items:flex-start;gap:12px}
html.rw-layout .rw-agent-options [data-slot=select-item-text]>div>div{min-width:0;text-align:left;line-height:1.5}
html.rw-layout .rw-agent-options .text-xs{margin-top:4px}
html.rw-layout .rw-agent-body>div:has(>.rw-agent-advanced-trigger){padding:0;border:1px solid color-mix(in srgb,var(--primary) 40%,var(--card));border-radius:12px;overflow:hidden}
html.rw-layout .rw-agent-advanced-trigger{min-height:64px;padding:18px 20px;background:color-mix(in srgb,var(--primary) 9%,var(--card));gap:16px;font-size:calc(15px*var(--rw-fs));cursor:pointer}
html.rw-layout .rw-agent-advanced-trigger:hover{background:var(--accent)}
html.rw-layout .rw-agent-advanced-trigger[aria-expanded=true]{border-bottom:1px solid var(--border)}
html.rw-layout .rw-agent-advanced-trigger>div{gap:12px}
html.rw-layout .rw-agent-advanced-trigger svg{color:var(--primary)}
html.rw-layout .rw-agent-advanced-content{padding:20px;margin-top:0}
@media(max-width:1100px){
 html.rw-layout .rw-business-day{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:12px}
 html.rw-layout .rw-business-day>div:nth-child(2){min-width:0}
 html.rw-layout .rw-business-day>div:nth-child(3){grid-column:1 / -1;grid-row:2}
 html.rw-layout .rw-business-day>div:last-child{grid-column:3;grid-row:1}
}
@media(max-width:640px){
 html.rw-layout .rw-channel-settings{height:100%;margin:0;border-radius:0;border:0}
 html.rw-layout .rw-channel-settings-head{padding:0}
 html.rw-layout .rw-channel-settings-head>div{padding-left:16px;padding-right:16px}
 html.rw-layout .rw-channel-settings-head h1{font-size:calc(16px*var(--rw-fs));line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 html.rw-layout .rw-channel-settings-scroll>div{padding:16px 12px}
 html.rw-layout .rw-channel-settings [data-slot=card-content]{padding:20px 16px}
 html.rw-layout .rw-channel-settings-save{padding:12px 16px;min-height:68px}
 html.rw-layout .rw-channel-settings-save button{width:100%;min-width:0;white-space:normal}
 html.rw-layout .rw-attendant-rows>[role=checkbox]{padding:12px;gap:10px}
 html.rw-layout .rw-attendant-rows h5+span{font-size:calc(10px*var(--rw-fs));padding:3px 6px}
 html.rw-layout .rw-attendant-rows .mt-1{flex-wrap:wrap;gap:4px}
 html.rw-layout .rw-attendant-rows .mt-1 p{max-width:100%;font-size:calc(12px*var(--rw-fs))}
 html.rw-layout .rw-business-day{padding:14px 12px}
 html.rw-layout .rw-business-day>div:nth-child(3)>div:first-child{display:grid;grid-template-columns:minmax(0,1fr) 16px minmax(0,1fr);gap:10px}
 html.rw-layout .rw-business-day>div:nth-child(3)>div:first-child>div:first-child{grid-column:1 / -1;min-height:36px}
 html.rw-layout .rw-business-day [data-slot=select-trigger]{width:100%;min-width:0;font-size:calc(13px*var(--rw-fs));padding:8px}
 html.rw-layout .rw-business-day>div:nth-child(3)>div:first-child>div.px-2{padding:0}
 html.rw-layout .rw-agent-summary{padding:16px}
 html.rw-layout .rw-agent-summary>div{flex-wrap:wrap}
 html.rw-layout .rw-agent-summary>div>div:first-child{flex-basis:100%}
 html.rw-layout .rw-agent-summary h5{font-size:calc(14px*var(--rw-fs))}
 html.rw-layout .rw-agent-body>div.space-y-4>div.flex{flex-wrap:wrap;gap:10px}
 html.rw-layout .rw-agent-body>div.space-y-4>div.flex button{width:100%;min-height:44px;white-space:normal}
 html.rw-layout .rw-agent-advanced-trigger{padding:16px;min-height:64px}
 html.rw-layout .rw-agent-advanced-content{padding:16px}
 html.rw-layout .rw-wa-table-wrap{padding:0 16px}
 html.rw-layout .rw-wa-table tbody tr{padding:18px 0;gap:12px}
 html.rw-layout .rw-wa-table td{padding:0;border:0}
 html.rw-layout .rw-wa-dialog-foot{padding:16px}
 html.rw-layout .rw-wa-dialog-foot .rw-wa-text{width:100%}
}

/* Third version: exact Workspace contrast palette from the approved local study. */
html.rw-layout,html.rw-login-workspace{
 --font-sans:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--default-font-family:var(--font-sans);
 --background:#e5ede7;--foreground:#202c25;--card:#fff;--card-foreground:#202c25;--popover:#fff;--popover-foreground:#202c25;
 --primary:#087c5b;--primary-foreground:#fff;--secondary:#f0f5f1;--secondary-foreground:#202c25;--muted:#f0f5f1;--muted-foreground:#54665b;
 --accent:#d9f2e5;--accent-foreground:#146047;--border:#ccd9cf;--input:#ccd9cf;--ring:#087c5b;
 --sidebar:#dce7df;--sidebar-foreground:#202c25;--sidebar-border:#ccd9cf;--rw-soft:#d9f2e5;--rw-soft-text:#146047;
 --rw-message-in:#fff;--rw-message-out:#dff4e7;--rw-shadow:0 1px 2px rgb(20 40 30 / .04);
}
html.rw-layout.dark,html.rw-login-workspace.dark{
 --background:#141e18;--foreground:#e8efe9;--card:#2b382f;--card-foreground:#e8efe9;--popover:#2b382f;--popover-foreground:#e8efe9;
 --primary:#67ddb2;--primary-foreground:#11372b;--secondary:#213027;--secondary-foreground:#e8efe9;--muted:#213027;--muted-foreground:#b8c8bd;
 --accent:#2c493b;--accent-foreground:#9de9c6;--border:#435749;--input:#435749;--ring:#67ddb2;
 --sidebar:#1b2820;--sidebar-foreground:#e8efe9;--sidebar-border:#435749;--rw-soft:#2c493b;--rw-soft-text:#9de9c6;
 --rw-message-in:#2b382f;--rw-message-out:#304e3d;--rw-shadow:0 1px 2px rgb(0 0 0 / .12);
}
html.rw-layout div:has(>main)>.rw-sidebar{background:var(--sidebar)}
html.rw-layout div.h-dvh:has(>div>main)>div.flex-shrink-0{background:var(--background)}
html.rw-layout[data-rw-page=dashboard] main [data-slot=card]{border:1px solid var(--border);box-shadow:var(--rw-shadow)}
/* Menu (Pedro, 23/10/2026): "Nova conversa" in the darker green of his print (#c0dbd2) and a menu hover that shows on
   the sidebar (the old one, --secondary, almost matched it). */
html.rw-layout,html.rw-login-workspace{--rw-new:#c0dbd2;--rw-new-hover:#b1d1c5;--rw-nav-hover:#d5e5dc}
html.rw-layout.dark,html.rw-login-workspace.dark{--rw-new:#2c493b;--rw-new-hover:#355747;--rw-nav-hover:#2a3b31}
html.rw-layout .rw-sidebar .rw-l-new{background:var(--rw-new)}
html.rw-layout .rw-sidebar .rw-l-new:hover{background:var(--rw-new-hover);filter:none}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link:not(.rw-nav-active):hover{background:var(--rw-nav-hover)}
/* Avatar menu (Pedro, 23/10/2026: ".com" cut against the edge): as wide as the name and e-mail need, between 16rem and
   20rem, with room on the right; longer ones end in "…" (full text on hover). */
html.rw-layout .rw-user-menu.w-56{width:max-content;min-width:16rem;max-width:min(20rem,calc(100vw - 24px))}
html.rw-layout .rw-user-head{padding:4px 8px 4px 0}
/* Brand in the top band, bigger (Pedro, 23/10/2026: "aumente mais a marca"). The app asks for h-8 max-w-32: 32px tall
   and at most 128px wide, symbol 27px, name 17px, "RESULTADOS WEB" 5.5px. Now 148x44 on the computer (the band keeps its
   71px) and 120x36 on the phone; the login page keeps its own size. */
html.rw-layout div.h-dvh > div.flex-shrink-0 .rw-orbit-brand.h-8{height:44px;max-width:none;gap:10px}
html.rw-layout div.h-dvh > div.flex-shrink-0 .rw-orbit-brand.h-8 .rw-orbit-symbol{height:40px}
html.rw-layout div.h-dvh > div.flex-shrink-0 .rw-orbit-brand.h-8 .rw-orbit-name{font-size:24px;letter-spacing:-.7px}
html.rw-layout div.h-dvh > div.flex-shrink-0 .rw-orbit-brand.h-8 .rw-orbit-family{font-size:8px;letter-spacing:1.75px;margin-top:5px}
@media (max-width:767px){
  html.rw-layout div.h-dvh > div.flex-shrink-0 .rw-orbit-brand.h-8{height:36px;gap:8px}
  html.rw-layout div.h-dvh > div.flex-shrink-0 .rw-orbit-brand.h-8 .rw-orbit-symbol{height:32px}
  html.rw-layout div.h-dvh > div.flex-shrink-0 .rw-orbit-brand.h-8 .rw-orbit-name{font-size:20px}
  html.rw-layout div.h-dvh > div.flex-shrink-0 .rw-orbit-brand.h-8 .rw-orbit-family{font-size:6.5px;letter-spacing:1.4px;margin-top:4px}
}
/* Avatar menu in blocks (rwUserMenuBody). */
html.rw-layout .rw-user-menu.w-56{padding:6px}
html.rw-layout .rw-um-who{display:flex;align-items:flex-start;gap:12px;padding:10px 12px 12px 8px}
html.rw-layout .rw-um-id{display:flex;flex-direction:column;min-width:0;flex:1}
html.rw-layout .rw-um-name{font-size:calc(15px*var(--rw-fs));font-weight:650;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.rw-layout .rw-um-mail{font-size:calc(13px*var(--rw-fs));color:var(--muted-foreground);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.rw-layout .rw-um-sec{display:flex;flex-direction:column;gap:2px;padding:8px 12px 10px 8px}
html.rw-layout .rw-um-cap{font-size:calc(12px*var(--rw-fs));font-weight:600;color:var(--muted-foreground)}
html.rw-layout .rw-um-acc{font-size:calc(14px*var(--rw-fs));font-weight:650}
html.rw-layout .rw-um-sub{font-size:calc(13px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-user-menu .rw-um-item{gap:10px;padding:9px 8px;font-size:calc(14px*var(--rw-fs));cursor:pointer}
html.rw-layout .rw-um-ext{width:13px;height:13px;margin-left:auto;color:var(--muted-foreground)}
html.rw-layout .rw-um-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:2px 0}
html.rw-layout .rw-user-menu .rw-um-link{padding:6px 8px;color:var(--primary);font-weight:600;font-size:calc(14px*var(--rw-fs));text-decoration:underline;text-underline-offset:3px;cursor:pointer;white-space:nowrap}
html.rw-layout .rw-user-menu .rw-um-profile{align-self:flex-start;margin:4px 0 0 -8px}
/* Top band: a line under it on the computer too (it was transparent; the phone already had one), and room between it and
   "Nova conversa", which sat 4px under it (Pedro, 23/10/2026). */
html.rw-layout div.h-dvh:has(>div>main)>div.flex-shrink-0{border-bottom:1px solid var(--border)}
html.rw-layout .rw-sidebar .rw-l-new{margin-top:16px}
/* Label/value rows of the contact sidebar (Pedro, 23/10/2026: "Email:" under the address). The value side did not shrink
   (the address is capped at 192px) and the label column fell to 28px. Label keeps at least its longest word, the value
   takes the rest and truncates; dates still fit. */
html.rw-layout .flex.items-center.justify-between.py-2.border-b{gap:12px}
html.rw-layout .flex.items-center.justify-between.py-2.border-b>.flex.items-center.gap-2.min-w-0.flex-1{flex:1 1 0;min-width:min-content}
html.rw-layout .flex.items-center.justify-between.py-2.border-b>.flex.items-center.gap-2.min-w-0.flex-1>svg{flex:none}
html.rw-layout .flex.items-center.justify-between.py-2.border-b>.flex.items-center.gap-2:last-child:not(.flex-1){flex:0 1 auto;min-width:0}
html.rw-layout .flex.items-center.justify-between.py-2.border-b>.flex.items-center.gap-2:last-child:not(.flex-1)>.truncate{min-width:0}
html.rw-layout .flex.items-center.justify-between.py-2.border-b>.flex.items-center.gap-2:last-child:not(.flex-1)>button{flex:none}

/* Native panes only. In particular, never paint the native fixed backdrop as a white pane. */
@media(min-width:768px){
 html.rw-layout[data-rw-page=conversations] main>div>.h-full.w-full.flex.md\:flex-row{gap:0;padding:0 16px 16px 0;border-radius:18px}
 html.rw-layout[data-rw-page=conversations] main>div>.h-full.w-full.flex.md\:flex-row>*{background:initial;border:initial;border-radius:0;box-shadow:none;overflow:initial}
 html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar]{background:var(--card)!important;border-radius:18px 0 0 18px!important;border-right:1px solid var(--border)!important;overflow:hidden!important;width:clamp(292px,var(--chat-sidebar-width,320px),350px);min-width:292px}
 html.rw-layout[data-rw-page=conversations] main [role=separator]{margin:0;width:5px;flex-shrink:0;background:var(--card)!important}
 html.rw-layout[data-rw-page=conversations] [data-tour=chat-main-area]{min-width:0;background:var(--card)!important;border-radius:0 18px 18px 0!important;overflow:hidden!important}
 html.rw-layout[data-rw-page=conversations] main>div>.h-full.w-full.flex.md\:flex-row>.fixed.bg-black\/50{background:rgb(0 0 0 / .5);border-radius:0}
}
html.rw-layout [data-tour=chat-conversations-list]{padding:6px}
html.rw-layout [data-tour=chat-conversations-list]>[data-slot=context-menu-trigger]{margin:0 0 4px;padding:14px 12px;border-radius:12px;box-shadow:none;border-color:transparent}
html.rw-layout [data-tour=chat-conversations-list]>[data-slot=context-menu-trigger].bg-primary\/10{background:var(--rw-soft);border-color:var(--border)}
html.rw-layout [data-tour=chat-sidebar]>.border-b{background:var(--card);padding:16px 14px 12px}
html.rw-layout [data-tour=chat-sidebar] [data-slot=input]{background:var(--secondary);box-shadow:none;border-color:transparent;height:44px}
html.rw-layout .rw-chat-header{display:flex;align-items:stretch;background:var(--card);border-bottom:1px solid var(--border);flex-shrink:0;min-width:0}
html.rw-layout .rw-chat-header>div{flex:1;min-width:0;border:0;background:var(--card)}
html.rw-layout .rw-contact-toggle{align-self:center;flex:0 0 44px;width:44px;height:44px;border-radius:12px;margin:0 10px 0 0;color:var(--primary);background:var(--rw-soft);border:1px solid var(--border);display:grid;place-items:center}
html.rw-layout .rw-contact-toggle svg{width:21px;height:21px}
html.rw-layout .rw-contact-floating{display:contents}
html.rw-layout [data-tour=chat-main-area] .flex-1.overflow-y-auto{background:var(--secondary)}
html.rw-layout [data-tour=chat-main-area] .flex-1.overflow-y-scroll{background:var(--secondary)}
html.rw-layout [data-tour=chat-main-area] .max-w-\[70\%\]>.rounded-lg{background:var(--rw-message-in);color:var(--foreground);border:1px solid var(--border);border-radius:16px 16px 16px 4px;padding:12px 14px}
html.rw-layout [data-tour=chat-main-area] .max-w-\[70\%\].ml-auto>.rounded-lg.bg-primary{background:var(--rw-message-out);color:var(--foreground);border-color:transparent;border-radius:16px 16px 4px 16px}
html.rw-layout [data-tour=chat-main-area] .max-w-\[70\%\] .text-primary-foreground\/70{color:var(--muted-foreground)}
html.rw-layout [data-tour=chat-main-area] .max-w-\[70\%\] .text-white\/70{color:var(--muted-foreground)}
html.rw-layout [data-tour=chat-main-area] .rich-content{font-size:calc(15.5px*var(--rw-fs));line-height:1.65}
html.rw-layout [data-tour=chat-main-area] .flex.items-center.gap-2.px-4.py-3.relative{background:var(--card);border-top:1px solid var(--border)}
html.rw-layout [data-tour=chat-main-area] .flex.items-center.gap-2.px-4.py-3.relative:has([contenteditable=true]){display:grid;grid-template-columns:44px 44px 44px minmax(0,1fr) 44px 44px;gap:6px;padding:10px 14px}
html.rw-layout [data-tour=chat-main-area] .px-4.py-3.relative>.flex-1:has([contenteditable=true]){grid-column:1/-1;grid-row:1}
html.rw-layout [data-tour=chat-main-area] .px-4.py-3.relative>.flex-shrink-0{grid-row:2}
html.rw-layout [data-tour=chat-main-area] .px-4.py-3.relative>span{display:contents}
html.rw-layout [data-tour=chat-main-area] .px-4.py-3.relative>button:nth-last-of-type(2){grid-column:5;grid-row:2}
html.rw-layout [data-tour=chat-main-area] .px-4.py-3.relative>button:last-of-type{grid-column:6;grid-row:2}
html.rw-layout [data-tour=chat-main-area] .px-4.py-3.relative .rounded-\[23px\]{border-radius:12px;background:var(--card);padding:10px 14px;min-height:66px}
html.rw-layout [data-tour=chat-main-area] .px-4.py-3.relative button{min-width:44px;min-height:44px}
/* Contact sidebar, "Atendimento" section (Pedro, 22/10/2026): same card, row and button classes as the native
   "Informações do Contato" card; edits open the native assignment modal. */
html.rw-layout .rw-about-host{display:block}
html.rw-layout .rw-about-body{display:grid;gap:20px}
html.rw-layout .rw-about>[data-slot=card-header]{padding-inline:16px}
html.rw-layout .rw-about>[data-slot=card-content]{padding-inline:16px}
html.rw-layout .rw-about-group{display:grid;gap:2px;min-width:0}
html.rw-layout .rw-about-group>h4{margin:0 0 6px;color:var(--foreground)}
html.rw-layout .rw-about-group>h4 svg{color:var(--muted-foreground)}
html.rw-layout .rw-about-row{min-height:46px}
html.rw-layout .rw-about-row svg{color:var(--muted-foreground)}
html.rw-layout .rw-about-row>div:last-child{flex:1 1 auto;min-width:0}
html.rw-layout .rw-about-row>div:last-child>*{min-width:0}
html.rw-layout .rw-about-stack{display:grid;justify-items:end;gap:2px;text-align:right;overflow-wrap:anywhere}
html.rw-layout .rw-about-pick{height:auto;min-height:36px;min-width:0;max-width:100%;padding:6px 10px;gap:6px;font-weight:600;color:var(--foreground);border-radius:8px}
html.rw-layout .rw-about-pick.is-empty{color:var(--muted-foreground);font-weight:500}
html.rw-layout .rw-about-pick svg{color:var(--muted-foreground)}
html.rw-layout .rw-about-pick:hover svg,html.rw-layout .rw-about-pick:focus-visible svg{color:var(--primary)}
html.rw-layout .rw-about-labels{display:grid;gap:0}
html.rw-layout .rw-about-chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px;padding:0;list-style:none}
html.rw-layout .rw-about-chip,html.rw-layout .rw-about-stage{--rw-chip:var(--primary);display:inline-flex;align-items:center;gap:6px;max-width:100%;min-width:0;border-radius:999px;font-size:var(--text-xs);font-weight:600;line-height:1.3;color:var(--foreground);background:color-mix(in srgb,var(--rw-chip) 13%,var(--card));border:1px solid color-mix(in srgb,var(--rw-chip) 38%,transparent)}
html.rw-layout .rw-about-chip{min-height:32px;padding:3px 4px 3px 12px}
html.rw-layout .rw-about-stage{min-height:28px;padding:3px 12px}
html.rw-layout :is(.rw-about-chip,.rw-about-stage)::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--rw-chip)}
html.rw-layout .rw-about-chip button{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:999px;color:var(--muted-foreground)}
html.rw-layout .rw-about-chip button:hover,html.rw-layout .rw-about-chip button:focus-visible{background:color-mix(in srgb,var(--rw-chip) 22%,var(--card));color:var(--foreground)}
html.rw-layout .rw-about-chip[aria-busy]{opacity:.55}
html.rw-layout .rw-about-empty{margin:8px 0 2px}
html.rw-layout .rw-about-pipe{display:grid;gap:8px;padding:14px 16px;margin-top:4px;border:1px solid var(--border);border-radius:12px;background:var(--background)}
html.rw-layout .rw-about-pipe>p{overflow-wrap:anywhere}
html.rw-layout .rw-about-stage-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
html.rw-layout .rw-about-link{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:8px;color:var(--muted-foreground)}
html.rw-layout .rw-about-link:hover,html.rw-layout .rw-about-link:focus-visible{background:var(--accent);color:var(--primary)}
@media(min-width:1380px){
 html.rw-layout [data-tour=chat-main-area]:has(~.rw-contact-column){border-radius:0!important}
 html.rw-layout .rw-contact-column{display:flex;flex:0 0 304px;flex-direction:column;min-width:0;min-height:0;height:100%;background:var(--card)!important;border-left:1px solid var(--border)!important;border-radius:0 18px 18px 0!important;overflow:hidden!important}
 html.rw-layout .rw-contact-column>.fixed.bg-black\/50{display:none}
 html.rw-layout .rw-contact-column>.fixed.border-l{display:contents}
 html.rw-layout .rw-contact-column>.fixed.border-l>.border-b{position:relative;order:1;background:var(--card);border:0;flex:none}
 html.rw-layout .rw-contact-column>.fixed.border-l>.border-b>.p-4{padding:20px 44px 8px 20px}
 html.rw-layout .rw-contact-column .border-b h2{font-size:calc(17px*var(--rw-fs));white-space:normal;overflow-wrap:anywhere}
 html.rw-layout .rw-contact-column [data-slot=avatar].h-16{width:48px;height:48px}
 html.rw-layout .rw-contact-column>.fixed.border-l>.overflow-y-auto{order:3;flex:1;min-height:0;overflow:auto;padding:0 12px 16px}
 html.rw-layout .rw-contact-column [data-slot=card]{border:0;border-bottom:1px solid var(--border);border-radius:0;box-shadow:none;padding:20px 0;gap:14px}
 html.rw-layout .rw-contact-column [data-slot=card-header]{padding:0 8px}
 html.rw-layout .rw-contact-column [data-slot=card-content]{padding:0 8px}
 html.rw-layout .rw-contact-column [data-slot=card-header] h3{white-space:normal}
 html.rw-layout .rw-contact-column [data-slot=card-header] p{white-space:normal;font-size:calc(12px*var(--rw-fs))}
}

/* Channels: equal-weight type cards; a separate real connection collection. */
html.rw-layout .rw-channel-overview{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--muted-foreground);font-size:calc(14px*var(--rw-fs));margin:0 0 14px}
html.rw-layout .rw-channel-attention{background:var(--card);border:1px solid var(--border);border-radius:8px;padding:6px 12px;color:var(--foreground)}
html.rw-layout .rw-channel-views{display:flex;gap:24px;border-bottom:1px solid var(--border);margin-bottom:20px}
html.rw-layout .rw-channel-views button{min-height:48px;padding:10px 4px;border-bottom:2px solid transparent;color:var(--muted-foreground);font-size:calc(14px*var(--rw-fs));white-space:nowrap}
html.rw-layout .rw-channel-views button[aria-selected=true]{border-color:var(--primary);color:var(--primary);font-weight:650}
html.rw-layout .rw-channel-type-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
html.rw-layout .rw-channel-type-grid:empty::before{content:"Nenhum canal encontrado com essa busca.";font-size:calc(14px*var(--rw-fs));color:var(--muted-foreground);padding:24px 0}
html.rw-layout .rw-channels-workspace [hidden]{display:none!important}
html.rw-layout .rw-channel-type-shell{position:relative;display:flex;min-width:0}
html.rw-layout .rw-channel-type-shell>[data-slot=card]{width:100%;background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:none}
html.rw-layout .rw-channel-type-shell>[data-slot=card]>[data-slot=card-content]{flex:1;gap:14px;padding:20px}
html.rw-layout .rw-channel-type-shell [data-slot=card-content]>div:first-child h3{font-size:calc(16px*var(--rw-fs));font-weight:600}
html.rw-layout .rw-channel-type-shell [data-slot=card-content]>div:first-child p{white-space:normal;overflow:visible;line-height:1.6;font-size:calc(12px*var(--rw-fs))}
html.rw-layout .rw-channel-type-shell [data-slot=card-content]>div:first-child>div:first-child{background:transparent}
html.rw-layout .rw-channel-type-shell [data-slot=card-content]>div:first-child>div:first-child img{width:32px;height:32px}
html.rw-layout .rw-channel-type-shell [data-slot=card-content]>.flex.flex-wrap span{font-size:calc(11px*var(--rw-fs));background:var(--secondary);color:var(--muted-foreground);border:0;border-radius:5px}
html.rw-layout .rw-channel-type-shell [data-slot=card-content]>button:last-child,html.rw-layout .rw-channel-type-shell [data-slot=card-content]>span:last-child{margin-top:auto;border:0;border-top:1px solid var(--border);border-radius:0;background:transparent;min-height:54px;padding-top:12px;padding-left:44%;justify-content:flex-end;color:var(--foreground);font-size:calc(12px*var(--rw-fs));white-space:normal;text-align:right;gap:6px}
html.rw-layout .rw-channel-type-shell [data-slot=card-content]>button:last-child svg{width:15px;height:15px}
html.rw-layout .rw-channel-view-connections{position:absolute;left:20px;bottom:20px;height:44px;font-size:calc(12px*var(--rw-fs));color:var(--foreground)}
html.rw-layout .rw-channel-view-connections:hover{color:var(--primary);text-decoration:underline}
html.rw-layout .rw-channel-type{padding:20px;background:var(--card);border:1px solid var(--border);border-radius:18px;display:flex;flex-direction:column;gap:12px;min-width:0}
html.rw-layout .rw-channel-type header{display:flex;gap:14px;align-items:center;min-width:0}
html.rw-layout .rw-channel-type header>div{min-width:0;flex:1}
html.rw-layout .rw-channel-type h3{font-size:calc(16px*var(--rw-fs));font-weight:600;line-height:1.4}
html.rw-layout .rw-channel-type header p{font-size:calc(12px*var(--rw-fs));color:var(--muted-foreground);margin-top:3px;line-height:1.5;overflow-wrap:anywhere}
html.rw-layout .rw-channel-count{height:36px;min-width:36px;border:1px solid var(--border);background:var(--secondary);border-radius:50%;font-size:calc(13px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-channel-count:disabled{opacity:.55}
html.rw-layout .rw-channel-health{font-size:calc(12px*var(--rw-fs));min-height:24px;color:var(--muted-foreground)}
html.rw-layout .rw-channel-health [data-slot=badge]{background:transparent;border:0;padding:0;font-size:calc(12px*var(--rw-fs))}
html.rw-layout .rw-channel-capabilities{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:4px}
html.rw-layout .rw-channel-capabilities span{font-size:calc(11px*var(--rw-fs));background:var(--secondary);padding:3px 7px;border-radius:5px;color:var(--muted-foreground)}
html.rw-layout .rw-channel-type footer{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--border);padding-top:10px;margin-top:auto}
html.rw-layout .rw-channel-type footer button{min-height:44px;font-size:calc(12px*var(--rw-fs));color:var(--foreground);text-align:left}
html.rw-layout .rw-channel-type footer button:hover:not(:disabled){color:var(--primary);text-decoration:underline}
html.rw-layout .rw-channel-type footer button:disabled{opacity:.5}
html.rw-layout .rw-channel-explainer{font-size:calc(12px*var(--rw-fs));color:var(--muted-foreground);line-height:1.6;margin-top:16px}
html.rw-layout .rw-connections-filters{display:flex;gap:12px;margin-bottom:16px}
html.rw-layout .rw-connections-filters :is(input,select){background:var(--card);border:1px solid var(--border);border-radius:10px;min-height:44px;padding:10px 12px;color:var(--foreground);font-size:calc(14px*var(--rw-fs));min-width:0}
html.rw-layout .rw-connections-filters input{flex:1}
html.rw-layout .rw-connections-list{background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden}
html.rw-layout .rw-connection-row{display:flex;align-items:center;gap:16px;padding:18px 20px;min-width:0}
html.rw-layout .rw-connection-row+.rw-connection-row{border-top:1px solid var(--border)}
html.rw-layout .rw-connection-name{flex:1;min-width:0}
html.rw-layout .rw-connection-name h3{font-size:calc(14px*var(--rw-fs));font-weight:600;overflow-wrap:anywhere}
html.rw-layout .rw-connection-name p{font-size:calc(12px*var(--rw-fs));color:var(--muted-foreground);margin-top:4px}
html.rw-layout .rw-connection-health{display:grid;gap:4px;min-width:150px;font-size:calc(13px*var(--rw-fs))}
html.rw-layout .rw-connection-health small{font-size:calc(11px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-connection-row button{min-height:44px;padding:8px 12px;border:1px solid var(--border);border-radius:10px;font-size:calc(13px*var(--rw-fs));color:var(--primary)}
html.rw-layout .rw-connection-row .rw-connection-options{font-size:calc(20px*var(--rw-fs));min-width:44px}
html.rw-layout .rw-connection-empty{padding:28px 20px;color:var(--muted-foreground);font-size:calc(14px*var(--rw-fs))}
html.rw-layout .rw-connections-list:has(>.rw-connection-row)>.rw-connection-empty{display:none}
html.rw-layout .rw-connections-list:not(:has(>.rw-connection-row))>.rw-connection-empty:empty::before{content:"Nenhuma conexão encontrada com esses filtros."}
html.rw-layout :is(.rw-channel-views button,.rw-channel-type button,.rw-connection-row button):focus-visible{outline:2px solid var(--ring);outline-offset:3px}
@media(max-width:767px){
 html.rw-layout .rw-channel-type-grid{grid-template-columns:1fr}
 html.rw-layout .rw-channel-views{gap:20px}
 html.rw-layout .rw-channel-type{padding:16px}
 html.rw-layout .rw-connections-filters{flex-wrap:wrap}
 html.rw-layout .rw-connections-filters :is(input,select){width:100%;flex:auto;font-size:calc(16px*var(--rw-fs))}
 html.rw-layout .rw-connection-row{display:grid;grid-template-columns:32px minmax(0,1fr) 44px;gap:12px;padding:16px}
 html.rw-layout .rw-connection-row>.rw-connection-health{grid-row:2;grid-column:2;min-width:0}
 html.rw-layout .rw-connection-row>button:not(.rw-connection-options){grid-row:3;grid-column:2}
 html.rw-layout .rw-connection-row>.rw-connection-options{grid-column:3;grid-row:1}
 html.rw-layout .rw-chat-header{display:contents}
 html.rw-layout .rw-contact-toggle{display:none}
}

/* Login: preserve the original React form, validation, recovery, language and reCAPTCHA. */
html.rw-login-workspace body{font-family:var(--font-sans);color:var(--foreground)}
html.rw-login-workspace #root>.min-h-screen{background:var(--card);min-height:100dvh}
html.rw-login-workspace .rw-login-stage{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,1fr);align-items:center;gap:80px;max-width:1200px;width:100%;margin:auto;padding:110px 48px 96px;position:relative}
html.rw-login-workspace.rw-orbit-entry-scroll #root>.min-h-screen>.rw-login-stage{padding-top:110px!important;padding-bottom:96px!important}
html.rw-login-workspace .rw-login-stage>.absolute{top:28px;right:48px}
html.rw-login-workspace .rw-login-native{max-width:420px;margin:0 auto;min-width:0}
html.rw-login-workspace .rw-login-native>.text-center{position:absolute;top:28px;left:48px;text-align:left}
html.rw-login-workspace .rw-login-native>.border{background:var(--background);border:1px solid var(--border);border-radius:24px;padding:32px;box-shadow:none;backdrop-filter:none}
html.rw-login-workspace .rw-login-native [role=tablist]{background:transparent;border-bottom:1px solid var(--border);border-radius:0;padding:0;height:44px;margin-bottom:4px}
html.rw-login-workspace .rw-login-native [role=tab]{background:transparent;box-shadow:none;border:0;border-bottom:2px solid transparent;border-radius:0;min-height:44px;color:var(--muted-foreground)}
html.rw-login-workspace .rw-login-native [role=tab][data-state=active]{color:var(--primary);border-color:var(--primary);font-weight:600}
html.rw-login-workspace .rw-login-native h2{font-size:calc(25px*var(--rw-fs));font-weight:500;letter-spacing:-.6px}
html.rw-login-workspace .rw-login-native [data-slot=tabs-content]>div>p{font-size:calc(14px*var(--rw-fs));line-height:1.7}
html.rw-login-workspace .rw-login-native input{background:var(--card);border:1px solid var(--border);height:48px;border-radius:10px;font-size:calc(16px*var(--rw-fs));padding:12px;box-shadow:none}
html.rw-login-workspace .rw-login-native form button[type=submit]{height:48px;border-radius:10px}
html.rw-login-workspace .rw-login-story{max-width:520px;min-width:0}
html.rw-login-workspace .rw-login-eyebrow{font-size:calc(10px*var(--rw-fs));letter-spacing:1.6px;line-height:1.8;color:var(--muted-foreground)}
html.rw-login-workspace .rw-login-story h1{font-size:clamp(32px,3.2vw,46px);font-weight:450;line-height:1.22;letter-spacing:-1.5px;margin:24px 0 18px}
html.rw-login-workspace .rw-login-story p{font-size:calc(15px*var(--rw-fs));line-height:1.8;color:var(--muted-foreground);max-width:350px}
html.rw-login-workspace .rw-login-orbit{position:relative;width:300px;height:230px;margin-top:35px;display:grid;place-items:center}
html.rw-login-workspace .rw-login-orbit i{position:absolute;width:270px;height:165px;border:1px solid var(--border);border-radius:50%;transform:rotate(-30deg)}
html.rw-login-workspace .rw-login-orbit i+i{transform:rotate(30deg);background:var(--secondary)}
html.rw-login-workspace .rw-login-orbit>span{position:relative;display:grid;place-items:center;width:90px;height:90px;background:var(--rw-soft);border-radius:26px;transform:rotate(-10deg)}
html.rw-login-workspace .rw-login-orbit img{width:58px;height:58px;object-fit:contain;transform:rotate(10deg)}
html.rw-login-workspace .rw-login-orbit b{position:absolute;top:25px;left:20px;padding:8px 14px;background:var(--card);border:1px solid var(--border);border-radius:14px;color:var(--primary);font-weight:400;font-size:calc(24px*var(--rw-fs));transform:rotate(-10deg)}
html.rw-login-workspace .rw-login-orbit b+b{left:auto;right:20px;top:auto;bottom:18px;transform:rotate(10deg)}
html.rw-login-workspace .rw-login-theme{position:absolute;top:28px;right:225px;width:44px;height:40px;border:1px solid var(--border);border-radius:12px;font-size:calc(22px*var(--rw-fs));cursor:pointer}
html.rw-login-workspace .rw-orbit-entry-footer{position:relative;bottom:auto;left:auto;right:auto;flex-direction:row;justify-content:center;flex-wrap:wrap;gap:12px 24px;padding:16px 24px 24px;font-size:calc(12px*var(--rw-fs))}
html.rw-login-workspace :is(button,a,select){cursor:pointer}
@media(max-width:850px){
 html.rw-login-workspace.rw-orbit-entry-scroll #root>.min-h-screen>.rw-login-stage{padding-top:105px!important;padding-bottom:32px!important}
 html.rw-login-workspace .rw-login-stage{grid-template-columns:1fr;gap:28px;padding:105px 24px 32px}
 html.rw-login-workspace .rw-login-story{display:none}
 html.rw-login-workspace .rw-login-stage>.absolute{top:26px;right:24px}
 html.rw-login-workspace .rw-login-native>.text-center{top:24px;left:24px}
 html.rw-login-workspace .rw-login-theme{right:194px;top:26px}
 html.rw-login-workspace .rw-login-native>.border{padding:24px}
}
@media(max-width:420px){
 html.rw-login-workspace.rw-orbit-entry-scroll #root>.min-h-screen>.rw-login-stage{padding-top:130px!important;padding-bottom:24px!important}
 html.rw-login-workspace .rw-login-stage{padding:130px 16px 24px}
 html.rw-login-workspace .rw-login-native>.text-center{top:24px;left:20px}
 html.rw-login-workspace .rw-login-stage>.absolute{top:78px;right:20px}
 html.rw-login-workspace .rw-login-theme{top:22px;right:20px}
 html.rw-login-workspace .rw-login-native>.border{padding:22px 18px}
}

/* Claude, 19/10/2026, aprovado pelo Pedro ("pode"). Testado na aba dele antes de publicar (claro, escuro, 1507 e 390 px).
   1. Lista de conversas: a linha de filtros quebra em vez de cortar "Filtros". */
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .flex.items-center.justify-between:has(>.flex.items-center.gap-2>button){flex-wrap:wrap;row-gap:8px}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .flex.items-center.justify-between>.flex.items-center.gap-2:has(>button){margin-left:auto}
/* 2. Item da lista: etapa do funil numa linha (cor mantida; nome completo na dica, rw-layout.js titleStages), dias e status ao lado. */
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .mt-1\.5.space-y-1{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .mt-1\.5.space-y-1>*{margin:0!important}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .mt-1\.5.space-y-1>.flex.items-center.gap-2{flex:0 1 auto;min-width:0;max-width:calc(100% - 28px)}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .mt-1\.5.space-y-1 .rounded-full.text-primary-foreground{min-width:0;max-width:100%;overflow:hidden}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .mt-1\.5.space-y-1 .rounded-full.text-primary-foreground>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .mt-1\.5.space-y-1>.flex.items-center.gap-2>:not(.rounded-full){white-space:nowrap;flex:none}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .mt-1\.5.space-y-1>.flex.items-center.gap-1.flex-wrap{flex:none}
/* 3. Cabecalho da conversa: nome da caixa visivel; selo de status inteiro, na cor do status, desce de linha se nao couber. */
html.rw-layout .rw-chat-header .flex.items-center.gap-2.text-sm.text-muted-foreground{flex-wrap:wrap;row-gap:4px}
html.rw-layout .rw-chat-header .flex.items-center.gap-2.text-sm.text-muted-foreground>span.min-w-0.truncate{min-width:6.5rem}
html.rw-layout .rw-chat-header .flex.items-center.gap-2.text-sm.text-muted-foreground>span.hidden{white-space:nowrap;flex:none}
html.rw-layout.dark .rw-chat-header .flex.items-center.gap-2.text-sm.text-muted-foreground>span:is(.hidden,.md\:hidden){background:color-mix(in srgb,currentColor 18%,transparent)!important}
/* 4. Canais: o ponto de estado dentro do selo voltava a cor do selo pela regra acima ("> .flex.flex-wrap span"). */
html.rw-layout .rw-channel-type-shell [data-slot="card-content"] > .flex.flex-wrap span span.rounded-full{background:revert-layer}

/* Conversas, todas as larguras (Pedro, 19/10, depois de usar): sem o telefone no item da lista; no cabecalho, sem o
   X (fechar conversa) e sem o botao "Sobre o contato": tocar na foto ou no nome abre e fecha os detalhes
   (rw-layout.js, clique na foto). */
html.rw-layout [data-tour=chat-sidebar] .min-w-0.flex-1 > p.text-xs.text-muted-foreground.truncate{display:none}
html.rw-layout .rw-contact-toggle{display:none}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .flex.items-center.gap-2 > button:has(.sr-only){display:none}

/* Paineis (filtros etc.): a area de rolagem do Radix usa display:table e crescia com um nome longo ("Live O Habito da
   Fluencia | Santo Andre" no filtro Pipeline): o conteudo passava 28 px da borda e cortava as setas (print do Pedro,
   19/10). A area fica com a largura do painel e o nome quebra de linha. */
html.rw-layout [data-radix-popper-content-wrapper] [data-radix-scroll-area-viewport] > div{display:block!important}
html.rw-layout [data-radix-popper-content-wrapper] [data-radix-scroll-area-viewport] .flex-1.truncate{white-space:normal;overflow-wrap:anywhere}

/* Celular, 19/10/2026 (Claude), a partir dos prints do Pedro e da auditoria de 393 x 700 px.
   Medidas antes/depois e motivo de cada item: verification/claude-mobile-20261019/README.md.
   Revisado depois da auditoria do Codex (F01 a F13). Dependem do rw-layout.js: M4 (classe rw-topo-oculto), o ajuste
   dos paineis de filtro (fitPopper), M12 (cardTables), M13 (data-rw-mais) e M19 (gridTabs). */
@media(max-width:767px){
/* M1 conversa aberta: o bloco do cabecalho nao cresce na altura (com .rw-chat-header em display:contents,
   a regra do desktop .rw-chat-header>div{flex:1} passava a valer na vertical: 362 px de cabecalho) */
html.rw-layout .rw-chat-header>div{flex:none}
/* M2 cabecalho da conversa no celular, uma linha (Pedro, 19/10, no aparelho: o telefone nao precisa aparecer, tocar
   na foto abre tudo; "melhore a disposicao do botao do estado e do nome do estado"). Voltar, foto, nome em cima e
   estado + caixa embaixo, Concluir e menu a direita. Substitui a versao em 2 linhas (M2b, 19/10), que deixava o
   Concluir entre as linhas. O texto do botao muda com o estado (Concluir, Reabrir), por isso continua texto. */
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm{padding:6px 6px 6px 2px}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex.items-center.justify-between{flex-wrap:nowrap;gap:6px}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .min-w-0{flex:1 1 auto;min-width:0;gap:8px}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .min-w-0 > .min-w-0{flex:1 1 auto;min-width:0}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .flex.items-center.gap-2{margin-left:0;gap:2px;flex:none}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm button{min-height:44px;min-width:40px}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm .h-10.w-10{width:36px;height:36px}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm .flex.items-center.gap-2.flex-wrap.min-w-0{flex-wrap:nowrap;column-gap:6px}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm .flex.items-center.gap-2.flex-wrap.min-w-0>h3{flex:1 1 auto;max-width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:calc(15.5px*var(--rw-fs));line-height:1.25}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm .flex.items-center.gap-2.flex-wrap.min-w-0>span{display:none}
/* estado primeiro, como selo; a caixa depois, cortada se faltar espaco */
html.rw-layout[data-rw-chat-open] .rw-chat-header .flex.items-center.gap-2.text-sm.text-muted-foreground{flex-wrap:nowrap;font-size:calc(12.5px*var(--rw-fs));gap:6px;margin-top:3px}
html.rw-layout[data-rw-chat-open] .rw-chat-header .flex.items-center.gap-2.text-sm.text-muted-foreground>span.min-w-0.truncate{min-width:0;order:2}
html.rw-layout[data-rw-chat-open] .rw-chat-header .flex.items-center.gap-2.text-sm.text-muted-foreground>span.md\:hidden{order:1;flex:none;padding:1px 8px;border:1px solid transparent;border-radius:999px;font-weight:600;background:color-mix(in srgb,currentColor 12%,transparent)}
/* cor do estado: a mesma do selo do desktop (estilo em linha do CRM: aberta azul, pendente ambar, concluida verde, pausada cinza) */
html.rw-layout[data-rw-chat-open] .rw-chat-header .text-muted-foreground:has(> span.hidden[style*="rgb(37, 99, 201)"])>span.md\:hidden{color:#2563C9;background:#E7EFFB;border-color:#8CAEE0}
html.rw-layout[data-rw-chat-open] .rw-chat-header .text-muted-foreground:has(> span.hidden[style*="rgb(199, 125, 20)"])>span.md\:hidden{color:#C77D14;background:#FDF3E3;border-color:#E7B45C}
html.rw-layout[data-rw-chat-open] .rw-chat-header .text-muted-foreground:has(> span.hidden[style*="rgb(53, 149, 88)"])>span.md\:hidden{color:#359558;background:#E6F3EA;border-color:#8FC5A2}
html.rw-layout[data-rw-chat-open] .rw-chat-header .text-muted-foreground:has(> span.hidden[style*="rgb(107, 114, 128)"])>span.md\:hidden{color:#6B7280;background:#EEF0F2;border-color:#B8BFC7}
html.rw-layout.dark[data-rw-chat-open] .rw-chat-header .text-muted-foreground>span.md\:hidden{background:color-mix(in srgb,currentColor 18%,transparent);border-color:transparent}
/* seletor de emoji (biblioteca com 350 px fixos, preso ao botao): a 393 px ia de 62 a 412 e cortava a direita, tambem
   no original. No celular ele se alinha a barra inteira, com 8 px de margem */
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > .relative.flex-shrink-0:has(> .absolute.bottom-full){position:static}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > .relative.flex-shrink-0 > .absolute.bottom-full{left:8px!important;right:8px!important;min-width:0!important;max-width:none!important}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > .relative.flex-shrink-0 > .absolute.bottom-full aside.EmojiPickerReact{width:100%!important}
/* barra do campo de mensagem: a regra antiga do celular (rw-layout.css) tem 5 colunas e manda todo botao para a 5a;
   com o microfone do v3, IA e microfone caiam no mesmo lugar (337 a 381 px a 393, tambem no publicado) */
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]){grid-template-columns:44px 44px 44px minmax(0,1fr) 44px 44px}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > button:nth-last-of-type(2){grid-column:5}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > button:last-of-type{grid-column:6}
/* Concluir compacto; o botao dividido usa estilo em linha (padding 9px 18px e 0 9px): sem !important nao pesa */
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .flex.items-center.gap-2 > .relative > div{min-height:40px}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .flex.items-center.gap-2 > .relative > div > span:first-child{padding-left:12px!important;padding-right:12px!important;font-size:calc(13.5px*var(--rw-fs))!important}
html.rw-layout[data-rw-chat-open] main .backdrop-blur-sm > .flex > .flex.items-center.gap-2 > .relative > div > span:last-child{padding-left:7px!important;padding-right:7px!important}
/* M3 barra do app mais baixa (65 -> 53 px) e M4 recolhida ao rolar para baixo, de volta ao rolar para cima */
html.rw-layout .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar{padding-top:6px;padding-bottom:6px;transition:margin-top .22s ease}
html.rw-layout.rw-topo-oculto .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar{margin-top:calc(-1 * var(--rw-topo-alt, 52px))}
/* M5 lista de conversas: busca, Ativas e a linha de contagem e filtros compactas, filtros numa linha */
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .p-4.border-b.space-y-3{padding:8px 12px}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .p-4.border-b.space-y-3>*+*{margin-top:6px!important}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .p-4.border-b.space-y-3>.relative input{height:40px}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .p-4.border-b.space-y-3>.border-b button{min-height:38px}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .flex.items-center.justify-between:has(>.flex.items-center.gap-2>button){flex-wrap:nowrap;gap:6px}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .flex.items-center.justify-between>.text-sm.text-muted-foreground{font-size:calc(12px*var(--rw-fs));flex:none}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .flex.items-center.justify-between>.flex.items-center.gap-2:has(>button){gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none}
html.rw-layout[data-rw-page=conversations] [data-tour=chat-sidebar] .flex.items-center.justify-between>.flex.items-center.gap-2>button{min-height:36px;padding-inline:8px;font-size:calc(12px*var(--rw-fs));flex:none}
/* M7 paginas nativas (Canais, Usuarios, Ferramentas...): a pagina inteira rola, cabecalho e filtros sobem com a
   lista; titulo e acao principal na mesma linha */
html.rw-layout main .h-full.flex.flex-col.p-4:has(> .space-y-4, > div > .space-y-4){height:auto;min-height:100%}
html.rw-layout main .h-full.flex.flex-col.p-4:has(> .space-y-4, > div > .space-y-4) > .flex-1.overflow-auto{overflow:visible;flex:none}
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3:has(h1){flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3:has(h1) > .flex-1{min-width:0}
/* titulo longo com acao longa (Perfil: "Duplicar como perfil personalizado"): o titulo nao encolhe a 48 px; a acao desce */
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3:has(h1) > .flex-1{flex:1 1 auto}
/* M8 paginas de colecao (Agentes: Ferramentas personalizadas, MCPs): mesma ideia */
html.rw-layout main :has(> [data-rw-collection-header]){height:auto;overflow:visible}
html.rw-layout main :has(> [data-rw-collection-header]) > .min-h-0.flex-1.overflow-y-auto{overflow:visible;flex:none}
html.rw-layout [data-rw-collection-page]{height:auto}
html.rw-layout [data-rw-collection-page] > .flex-1.overflow-auto{overflow:visible;flex:none}
/* M9 configuracoes do canal: caminho e nome rolam com o conteudo e ficam compactos; Atualizar fica no rodape */
html.rw-layout .rw-channel-settings{display:block;overflow-y:auto}
html.rw-layout .rw-channel-settings-scroll{overflow:visible}
html.rw-layout .rw-channel-settings-save{position:sticky;bottom:0;z-index:5}
/* a dica do rodape ("Use a acao de atualizacao dentro desta aba", em Moderacao) era empurrada para fora pela esquerda
   (-64 a 4 px a 320, tambem no publicado): ela quebra para a propria linha quando nao cabe ao lado do botao */
html.rw-layout .rw-channel-settings-save{flex-wrap:wrap;row-gap:4px}
html.rw-layout .rw-channel-settings-save > span{flex:1 1 12rem;min-width:0}
html.rw-layout .rw-channel-settings-save > button{margin-left:auto}
html.rw-layout .rw-channel-settings-head>.flex.items-center.gap-2{padding:10px 16px 0}
html.rw-layout .rw-channel-settings-head>.flex.items-center.gap-3{padding:6px 16px 10px}
html.rw-layout .rw-channel-settings-head :is(h1,h2){font-size:calc(18px*var(--rw-fs));line-height:1.3}
/* M10 avatar do canal: Enviar e Remover quebram de linha (Remover saia 28 px da tela); faixa de abas fica de fora */
html.rw-layout .rw-channel-settings .flex.gap-2:not([role=tablist]):has(> button){flex-wrap:wrap}
/* M11 grupos de busca e botoes quebram de linha em vez de sair da tela (Automacoes, Agentes); fora de Conversas e das faixas de abas */
html.rw-layout:not([data-rw-page=conversations]) main .flex.items-center.gap-2:not([role=tablist]):has(> button, > .flex-shrink-0 > button){flex-wrap:wrap}
html.rw-layout:not([data-rw-page=conversations]) main .flex.items-center.gap-2:has(> button) > .relative:has(input){flex:1 1 180px;min-width:0}
/* M12 tabelas que nao cabem (Pipelines, Tokens de acesso, Credenciais de IA, lista de Agentes): o mesmo padrao dos
   Contatos. Cada linha vira um cartao e cada campo mostra o nome da coluna (rw-layout.js cardTables: data-rw-cards,
   data-rw-label); ordenacao e selecionar todos ficam numa barra acima; nenhuma coluna ou acao sai da tela. */
html.rw-layout main :has(> [data-rw-cards]){overflow:visible}
html.rw-layout main div.rounded-lg.border:has(> div > table[data-rw-cards], > table[data-rw-cards]){background:transparent;border:0;box-shadow:none;padding:0}
html.rw-layout main [data-rw-cards]{display:block;width:100%;min-width:0;overflow:visible;background:transparent;border:0;box-shadow:none}
html.rw-layout main table[data-rw-cards] :is(thead,tbody){display:block}
html.rw-layout main [data-rw-cards-head]{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;min-width:0;padding:0 2px 8px;border:0;background:transparent}
html.rw-layout main [data-rw-cards-head] > *{display:block;flex:none;width:auto!important;min-width:0;height:auto;padding:0;border:0;background:transparent}
html.rw-layout main [data-rw-cards-head] > :not(:has(button,input,[role=checkbox])){display:none}
html.rw-layout main [data-rw-cards-head]:not(:has(button,input,[role=checkbox])){display:none}
html.rw-layout main [data-rw-cards-head] button:not([role=checkbox]){min-height:40px;padding:0 10px;border-radius:999px;font-size:calc(13px*var(--rw-fs))}
/* Cartao compacto (Pedro, 19/10, no aparelho: "o cartao listando a pipeline ficou gigante verticalmente; a versao
   anterior so precisava de ajustes"): titulo com icone e descricao em ate 2 linhas em cima; campos curtos lado a lado,
   rotulo pequeno antes do valor; campo longo (data-rw-wide, rw-layout.js) na linha inteira; Acoes no canto. */
html.rw-layout main [data-rw-cards-row]{display:flex;flex-wrap:wrap;align-items:center;column-gap:14px;row-gap:4px;position:relative;min-width:0;margin:0 0 8px;padding:10px 50px 11px 14px;background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--rw-shadow)}
html.rw-layout main [data-rw-cards-row]:has(> :first-child [role=checkbox]){padding-left:44px}
html.rw-layout main [data-rw-cards-row] > *{display:inline-flex;align-items:center;gap:5px;flex:0 1 auto;width:auto!important;min-width:0;max-width:100%;padding:0;border:0;white-space:normal;overflow-wrap:anywhere;text-align:left;font-size:calc(13.5px*var(--rw-fs));line-height:1.35}
html.rw-layout main [data-rw-cards-row] > *::before{content:attr(data-rw-label);font-size:calc(12px*var(--rw-fs));color:var(--muted-foreground);white-space:nowrap}
html.rw-layout main [data-rw-cards-row] > [data-rw-wide]{flex:1 1 100%;display:block}
html.rw-layout main [data-rw-cards-row] > [data-rw-wide]::before{margin-right:5px}
html.rw-layout main [data-rw-cards-row] > :is([data-rw-label=""],[data-rw-label="Ações"])::before{display:none}
html.rw-layout main [data-rw-cards-row] > [data-rw-label="Ações"]{position:absolute;top:6px;right:6px}
html.rw-layout main [data-rw-cards-row] > [data-rw-label="Ações"] button{min-width:40px;min-height:40px}
html.rw-layout main [data-rw-cards-row] > :first-child:has([role=checkbox]){position:absolute;left:14px;top:14px;padding:0}
html.rw-layout main [data-rw-cards-row] > * > *{min-width:0;max-width:100%}
html.rw-layout main [data-rw-cards-row] > * > :is(.justify-center,.justify-end){justify-content:flex-start}
html.rw-layout main [data-rw-cards-row] > * > :is(.mx-auto,.ml-auto){margin-inline:0}
/* a primeira coluna de dados (Nome) e o titulo: icone de 36 px ao lado do nome, descricao em ate 2 linhas */
html.rw-layout main [data-rw-cards-row] > :is(:first-child:not(:has([role=checkbox])),:first-child:has([role=checkbox]) + *){display:block;flex:1 1 100%;font-weight:600;font-size:calc(15px*var(--rw-fs))}
html.rw-layout main [data-rw-cards-row] > :is(:first-child:not(:has([role=checkbox])),:first-child:has([role=checkbox]) + *)::before{display:none}
html.rw-layout main [data-rw-cards-row] > :is(:first-child:not(:has([role=checkbox])),:first-child:has([role=checkbox]) + *) .flex{flex-wrap:nowrap;align-items:flex-start;gap:10px}
html.rw-layout main [data-rw-cards-row] > :is(:first-child:not(:has([role=checkbox])),:first-child:has([role=checkbox]) + *) :is(.h-12,.h-10,.h-11){width:36px;height:36px;flex:none}
html.rw-layout main [data-rw-cards-row] > * :is(.text-sm,.text-base){font-size:inherit}
html.rw-layout main [data-rw-cards-row] > :is(:first-child:not(:has([role=checkbox])),:first-child:has([role=checkbox]) + *) :is(.text-muted-foreground,.text-xs):not(.font-semibold):not([data-slot=avatar-fallback]){display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;font-weight:400;font-size:calc(13px*var(--rw-fs));margin-top:1px}
html.rw-layout main [data-rw-cards-row] > :is(:first-child:not(:has([role=checkbox])),:first-child:has([role=checkbox]) + *) :is(.truncate,.whitespace-nowrap){white-space:normal}
/* M13 menu do celular: cabecalho e rodape compactos (Sair ao lado do usuario); dica de que a lista continua */
html.rw-layout [role=dialog] > .flex.flex-col.gap-1\.5.border-b.p-6{padding:12px 16px}
html.rw-layout [role=dialog] > .p-4.border-t.border-sidebar-border{padding:6px 16px}
html.rw-layout [role=dialog] > .p-4.border-t.border-sidebar-border.bg-sidebar{padding:8px 16px;display:flex;align-items:center;gap:6px}
html.rw-layout [role=dialog] > .p-4.border-t.border-sidebar-border.bg-sidebar > .flex.items-center.gap-3{flex:1;min-width:0;padding:6px 8px}
html.rw-layout [role=dialog] > .p-4.border-t.border-sidebar-border.bg-sidebar > .mt-2.space-y-1{margin:0;flex:none}
html.rw-layout [role=dialog] > .p-4.border-t.border-sidebar-border.bg-sidebar > .mt-2.space-y-1 > button{padding:8px 10px;min-height:44px}
html.rw-layout [role=dialog] .rw-nav-scroll[data-rw-mais]{mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent)}
/* M14 Criar Canal, os 8 cartoes (com ou sem contador de conexoes): linha compacta com icone, nome e estado,
   descricao e contador quando existe */
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4{gap:12px}
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4 > .py-6:has(> .p-6.text-center){padding-block:0}
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4 > * > .p-6.text-center:has(> .flex.justify-center.mb-4){display:grid;grid-template-columns:44px minmax(0,1fr) auto;column-gap:12px;align-items:center;text-align:left;padding:12px 14px}
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4 > * > .p-6.text-center > .flex.justify-center.mb-4{display:contents}
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4 > * > .p-6.text-center > .flex.justify-center.mb-4 > div:first-child{grid-column:1;grid-row:1/3;width:44px;height:44px}
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4 > * > .p-6.text-center > .flex.justify-center.mb-4 > div:first-child svg{width:36px;height:36px}
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4 > * > .p-6.text-center > .flex.justify-center.mb-4 > button{grid-column:3;grid-row:1/3}
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4 > * > .p-6.text-center > h3{grid-column:2;margin:0;display:flex;flex-direction:row-reverse;justify-content:flex-end;align-items:center;gap:6px;flex-wrap:wrap}
html.rw-layout[data-rw-page=channels] main .grid.xl\:grid-cols-4 > * > .p-6.text-center > p{grid-column:2;margin:0}
/* M15 cabecalho com titulo e acoes (Templates, Credenciais de IA e de integracao): as acoes descem de linha quando
   nao cabem, inteiras, e o titulo nunca fica com menos de 9rem */
html.rw-layout main .flex.items-start.justify-between:has(> .flex.gap-2 > button, > button){flex-wrap:wrap;row-gap:12px}
html.rw-layout main .flex.items-start.justify-between:has(> .flex.gap-2 > button, > button) > :first-child:not(button){flex:1 1 0;min-width:min(100%,9rem)}
html.rw-layout main .flex.items-start.justify-between > .flex.gap-2:has(> button){flex-wrap:wrap;max-width:100%}
html.rw-layout main .flex.items-start.justify-between.p-6.border-b{padding:16px}
/* M16 Administracao (E-mail, Armazenamento, Canais, OpenAI, Integracoes, Evo Hub): a coluna lateral de 224 px
   deixava 25 a 45 px para o formulario; ela vira uma faixa de atalhos acima, e o formulario usa a largura toda */
html.rw-layout main .flex.h-full:has(> aside.w-56.shrink-0){flex-direction:column;height:auto;min-height:100%}
html.rw-layout main .flex.h-full > aside.w-56.shrink-0{width:auto;border-right-width:0;border-bottom-width:1px;padding:10px 16px}
html.rw-layout main .flex.h-full > aside.w-56.shrink-0 > h3{margin-bottom:6px}
html.rw-layout main .flex.h-full > aside.w-56.shrink-0 > nav{display:flex;flex-wrap:wrap;gap:6px}
html.rw-layout main .flex.h-full > aside.w-56.shrink-0 > nav > *{margin:0!important;min-height:40px}
html.rw-layout main .flex.h-full > aside.w-56.shrink-0 + main{flex:none;overflow:visible;padding:16px}
html.rw-layout main .flex.h-full > aside.w-56.shrink-0 + main .grid.grid-cols-2{grid-template-columns:minmax(0,1fr)}
html.rw-layout main .flex.h-full > aside.w-56.shrink-0 + main .flex:has(> button + button){flex-wrap:wrap}
html.rw-layout main .flex.h-full > aside.w-56.shrink-0 + main :is([data-slot=card-header],[data-slot=card-content],[data-slot=card-footer],.bg-card > .px-6){padding-inline:16px}
/* M17 Moderacao do canal: caixas de selecao, filtro de tipo e contagem quebram de linha (Todos os Tipos saia 53 px) */
html.rw-layout .rw-channel-settings [role=tabpanel] .flex.items-center.gap-4{flex-wrap:wrap;row-gap:8px}
/* M18 botao de texto longo dentro de cartao (Ativar Autenticacao de Dois Fatores): quebra a linha e cabe no cartao */
html.rw-layout main .bg-card > .px-6 > button.whitespace-nowrap{white-space:normal;max-width:100%;height:auto;min-height:40px;padding-block:8px;text-align:center}
/* e texto com botao na mesma linha do cartao (Dashboard: Mostrando 15 de 31 dias, Expandir periodo completo): o botao desce */
html.rw-layout main .bg-card > .px-6 .flex.items-center.justify-between:has(> button.whitespace-nowrap){flex-wrap:wrap;row-gap:8px}
/* M19 abas que nao cabem (Agentes, Perfil, categorias de Integracoes) em grade, como em Ferramentas e MCPs
   (rw-layout.js gridTabs: data-rw-tabs = numero de colunas) */
html.rw-layout main [role=tablist][data-rw-tabs]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;width:100%;height:auto;overflow:visible}
html.rw-layout main [role=tablist][data-rw-tabs="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
html.rw-layout main [role=tablist][data-rw-tabs=wrap]{display:flex;flex-wrap:wrap}
html.rw-layout main [role=tablist][data-rw-tabs] > [role=tab]{height:auto;min-height:40px;min-width:0;white-space:normal;line-height:1.25;padding:6px 8px;text-align:center;flex-wrap:wrap;gap:6px}
html.rw-layout main [role=tablist][data-rw-tabs=wrap] > [role=tab]{flex:1 1 auto;padding:6px;gap:4px;font-size:calc(13px*var(--rw-fs))}
html.rw-layout main [role=tablist][data-rw-tabs=wrap] > [role=tab] > span{padding-inline:6px}
html.rw-layout main [role=tablist][data-rw-tabs] > [role=tab] > span{margin:0}
html.rw-layout main [role=tablist][data-rw-tabs-icon] > [role=tab]{min-height:68px;flex-direction:column;flex-wrap:nowrap;gap:5px;padding:7px 4px;font-size:calc(12px*var(--rw-fs))}
/* M21 Dashboard (Insights de canais, Desempenho por Canal): nome de caixa sem espaco nao quebrava e empurrava o
   valor ate 538 px numa tela de 393 (a pagina arrastava de lado; tambem no publicado). O nome quebra dentro */
html.rw-layout[data-rw-page=dashboard] main .flex.items-center.justify-between.p-3.rounded-md > :first-child{min-width:0;overflow-wrap:anywhere}
/* M23 janelas centralizadas (Assistencia de IA, formularios): mais altas que a tela ficavam com titulo e fechar acima
   da borda (IA: -40 a 820 px numa tela de 780, tambem no original). No celular cabem na tela e rolam por dentro */
html.rw-layout [role=dialog].fixed.translate-y-\[-50\%\]{max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}
/* M22 Kanban do pipeline (Pedro, 19/10, no aparelho: topo grande empurrando os quadros, contraste ruim das colunas,
   toque ruim ao arrastar). Topo de 223 px (172 no original sem piloto) para ~140: voltar, icone, nome e lapis numa
   linha (a regra M11 quebrava essa linha); a descricao continua na lista de Pipelines; numeros numa linha; busca e
   filtros mais justos. Colunas com fundo de cartao e borda. Toque: a barra do topo nao se mexe mais com rolagem
   dentro do quadro (rw-layout.js mainScroller). Encaixe coluna a coluna mantido (decisao do Pedro, 17/10). */
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) > div{padding-left:12px;padding-right:12px}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.flex-col.gap-3{gap:6px;padding-top:6px;padding-bottom:4px}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.items-center.gap-3.min-w-0{gap:6px}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.items-center.gap-3.min-w-0 > button{min-width:40px;min-height:44px}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.items-center.gap-3.min-w-0 > .w-10.h-10{width:34px;height:34px}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.items-center.gap-3.min-w-0 > .min-w-0{flex:1 1 auto}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.items-center.gap-3.min-w-0 > .min-w-0 > .flex.items-center.gap-2{flex-wrap:nowrap;gap:2px}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.items-center.gap-3.min-w-0 > .min-w-0 > .flex.items-center.gap-2 > button:first-child{flex:1 1 auto;min-width:0}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.items-center.gap-3.min-w-0 > .min-w-0 > .flex.items-center.gap-2 > button:not(:first-child){flex:none;min-width:40px;min-height:40px}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.items-center.gap-3.min-w-0 > .min-w-0 > p{display:none}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.w-full.flex-wrap{flex-wrap:nowrap;align-items:center;gap:14px}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.w-full.flex-wrap > .text-center{display:flex;align-items:baseline;gap:4px;min-width:0;text-align:left}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .flex.w-full.flex-wrap > :last-child:not(.text-center){margin-left:auto}
html.rw-layout main .flex-shrink-0.border-b.shadow-sm:has(+ .flex-1.overflow-hidden) .border-t{padding-top:6px;padding-bottom:8px}
html.rw-layout[data-rw-page=pipelines] main div[style*="0 0 340px"] > div.rounded-xl.border{background:var(--card);border:1px solid var(--border);box-shadow:var(--rw-shadow)}
html.rw-layout[data-rw-page=pipelines] main div[style*="0 0 340px"] .group.relative.rounded-xl{border:1px solid var(--border)}
/* M20 lista de Agentes: titulo, abas e busca rolavam fixos (cerca de 190 px) acima da lista; agora rolam com ela,
   como em Ferramentas e MCPs (M8). Margens laterais de 34 px viram 16 px, como nas outras paginas */
html.rw-layout[data-rw-page=agents] main .flex.h-full.min-h-0.flex-col:has(> .flex-shrink-0.border-b + .min-h-0.flex-1.overflow-y-auto){height:auto;min-height:100%}
html.rw-layout[data-rw-page=agents] main .flex.h-full.min-h-0.flex-col > .flex-shrink-0.border-b + .min-h-0.flex-1.overflow-y-auto{overflow:visible;flex:none}
html.rw-layout[data-rw-page=agents] main :is(.flex-shrink-0.border-b,.flex-1).px-\[34px\]{padding-left:16px;padding-right:16px}
/* T1 topo do celular, padrao de todas as telas logadas (20/10, Pedro, proposta "Cartao organizado" do Codex):
   superficie neutra com linha fina embaixo; menu e marca a esquerda; tour, notificacoes e perfil a direita, alvos de
   44 px. A marca e os arquivos dela sao os mesmos, so mudam de lugar; a conversa aberta continua sem o topo */
html.rw-layout .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar{background:var(--card);border-bottom:1px solid var(--border);padding-top:8px;padding-bottom:8px}
html.rw-layout .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar > .md\:hidden{padding:0 6px;gap:2px}
html.rw-layout .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar > .md\:hidden > .flex-1:first-child{flex:none}
html.rw-layout .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar > .md\:hidden > .flex-1.justify-center{justify-content:flex-start;min-width:0;padding-left:2px}
html.rw-layout .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar > .md\:hidden > .flex-1.justify-end{flex:none;gap:0}
html.rw-layout .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar > .md\:hidden button{min-width:44px;min-height:44px}
html.rw-layout .flex.flex-col.h-dvh > div.flex-shrink-0.bg-sidebar > .md\:hidden :is(.flex-1:first-child,.justify-end) > button:not(:has(.rounded-full)){color:var(--muted-foreground)}
/* P1 Pipelines no celular (20/10, Pedro, "Cartao organizado" do Codex; rw-layout.js pipelineCards). So a lista de
   pipelines, sobre a tabela nativa (dados, busca, ordem, menu e permissoes continuam os dela): fundo neutro; titulo e
   "+ Novo"; busca em toda a largura; linha com a quantidade e a ordem; cada pipeline num cartao com estado, tipo e
   menu, nome, descricao em 2 linhas, Leads, Etapas e Ganhos, valor total e "Abrir pipeline" */
html.rw-layout{--rw-fundo-neutro:#f6f8f7}
html.rw-layout.dark{--rw-fundo-neutro:var(--background)}
html.rw-layout main:has([data-tour=pipelines-list]){background:var(--rw-fundo-neutro)}
html.rw-layout [data-tour=pipelines-header] h1{font-size:calc(25px*var(--rw-fs));line-height:1.2;letter-spacing:-.02em;font-weight:700}
html.rw-layout [data-tour=pipelines-header] [data-tour=pipelines-new-button] > button{min-height:44px;padding:0 14px;border-radius:11px;font-size:0;gap:0}
html.rw-layout [data-tour=pipelines-header] [data-tour=pipelines-new-button] > button > .mr-2{display:inline-flex;margin-right:6px}
html.rw-layout [data-tour=pipelines-header] [data-tour=pipelines-new-button] > button::after{content:"Novo";font-size:calc(14px*var(--rw-fs));font-weight:650}
html.rw-layout [data-tour=pipelines-header] .relative.flex-1.max-w-md{max-width:none}
html.rw-layout [data-tour=pipelines-header] .relative.flex-1.max-w-md input{height:46px;font-size:calc(16px*var(--rw-fs));border-radius:11px;background:var(--card);border:1px solid var(--border);padding-left:42px}
html.rw-layout [data-tour=pipelines-header] .relative.flex-1.max-w-md input:focus-visible{outline:2px solid var(--ring);outline-offset:2px;box-shadow:none}
html.rw-layout [data-tour=pipelines-header] .relative.flex-1.max-w-md > svg{left:14px;width:19px;height:19px;color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head]{justify-content:space-between;align-items:center;min-height:44px;padding:0 0 4px}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head]::before{content:attr(data-rw-count);font-size:calc(12.5px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head] > th:first-child{margin-left:auto}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head] th > .flex{position:relative;gap:4px;font-size:calc(12.5px*var(--rw-fs));font-weight:500;color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head] th button{position:static;min-height:44px;margin-left:0;padding:0;gap:4px;border-radius:8px;background:transparent;font-size:calc(12.5px*var(--rw-fs));font-weight:500;color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head] th button::before{content:"A-Z"}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head] th button:has(.lucide-arrow-down)::before{content:"Z-A"}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head] th button:has(.lucide-arrow-up-down)::before{content:none}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head] th button::after{content:"";position:absolute;inset:0}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-head] th button:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer){align-items:center;gap:0;margin:0 0 12px;padding:18px 18px 8px;border-radius:16px;background:var(--card);border:1px solid var(--border);box-shadow:none}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > *{display:block;flex:none;width:auto!important;padding:0;font-size:calc(13px*var(--rw-fs))}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > *::before{display:none}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(7){order:1}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(7) > span::before{content:"";width:5px;height:5px;margin-right:5px;border-radius:50%;background:currentColor}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(7) > span{font-size:calc(11px*var(--rw-fs));font-weight:650;padding:3px 8px;border-radius:6px}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(6){order:2;flex:1 1 auto;min-width:0;margin-left:8px}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(6) > span{font-size:calc(12px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(8){order:3;position:static;margin:-12px -10px -12px 0}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(8) button{min-width:44px;min-height:44px;color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(1){order:4;flex:1 1 100%;margin:12px 0 16px;font-weight:inherit;font-size:inherit}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(1) .w-11.h-11{display:none}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(1) .cursor-pointer{display:block;padding:0}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(1) .flex-wrap{flex-wrap:wrap;align-items:center;gap:6px}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(1) .font-semibold.truncate{font-size:calc(18px*var(--rw-fs));line-height:1.4;font-weight:650;letter-spacing:-.01em;white-space:normal;overflow:visible;overflow-wrap:anywhere;color:var(--foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(1) .text-xs.truncate{margin-top:6px;font-size:calc(13px*var(--rw-fs));line-height:1.6;color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :is(:nth-child(2),:nth-child(3),:nth-child(4)){display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:33.333%!important;padding:14px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(3){order:5}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(4){order:6}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(2){order:7}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :is(:nth-child(2),:nth-child(3),:nth-child(4))::before{display:block;content:attr(data-rw-label);font-size:calc(12px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :is(:nth-child(2),:nth-child(3),:nth-child(4)) > span,html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(2) > div > span:first-child{font-size:calc(22px*var(--rw-fs));line-height:1.2;font-weight:650;font-variant-numeric:tabular-nums;color:var(--foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(2) > div{align-items:flex-start}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(2) svg{display:none}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(2) > div > span + span{margin-top:2px;font-size:calc(11px*var(--rw-fs))}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(5){order:8;flex:1 1 100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;column-gap:12px;padding:12px 0 4px}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(5)::before{display:block;flex:1 1 100%;content:"Valor total";font-size:calc(11.5px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) > :nth-child(5) > span{white-space:nowrap;font-size:calc(16px*var(--rw-fs));font-weight:650;font-variant-numeric:tabular-nums;color:var(--foreground)}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) .rw-pipe-open{margin-left:auto;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 4px 0 10px;border:0;border-radius:10px;background:transparent;color:var(--primary);font-size:calc(13.5px*var(--rw-fs));font-weight:650;white-space:nowrap;cursor:pointer}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) .rw-pipe-open svg{width:16px;height:16px;flex:none}
html.rw-layout [data-tour=pipelines-list] [data-rw-cards-row]:has(> :first-child .cursor-pointer) .rw-pipe-open:focus-visible{outline:2px solid var(--ring);outline-offset:2px}
/* C1 campo de mensagem no celular (20/10, Pedro, com o WhatsApp de referencia; rw-layout.js wrapComposers):
   enviar (ou o microfone, sem texto) ao lado do texto e alinhado a base quando o texto cresce; anexar, emoji,
   respostas e IA na linha de baixo. A caixa comeca com 48 px (era 66) para sobrar conversa com o teclado aberto e
   cresce ate 120 px (limite nativo, depois rola). Enviar e microfone ficam no botao redondo cheio, como no WhatsApp */
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]){grid-template-columns:44px 44px 44px 44px minmax(0,1fr) 44px;align-items:end;row-gap:4px;padding:8px 10px}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative > .flex-1:has([contenteditable=true]){grid-column:1/6;grid-row:1}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > button:nth-last-of-type(2){grid-column:4;grid-row:2}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > button:last-of-type{grid-column:6;grid-row:1;margin-bottom:2px}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > button:last-of-type,html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) > button:last-of-type:hover{background:var(--primary);color:var(--primary-foreground);border-radius:999px}
html.rw-layout[data-rw-chat-open] main .px-4.py-3.relative:has([contenteditable=true]) .rounded-\[23px\]{min-height:48px;padding:10px 14px}
/* C2 teclado aberto onde o navegador ignora interactive-widget (iOS): o app fica com a altura da area visivel */
html.rw-layout.rw-teclado .flex.flex-col.h-dvh{height:var(--rw-visivel)}
}
/* Abas com icone em 3 colunas abaixo de 360 px: "Personalizadas" (12 px) passava da largura da aba */
@media(max-width:359px){
html.rw-layout main [role=tablist][data-rw-tabs-icon] > [role=tab],
html.rw-layout [data-rw-collection-header] [role=tab]{font-size:calc(11px*var(--rw-fs));padding-inline:2px}
}
@media(max-width:380px){
html.rw-layout [data-tour=pipelines-header] h1{font-size:calc(23px*var(--rw-fs))}
}
/* Botao fechar do painel de filtros das conversas (20/10, Pedro; rw-layout.js filterClose); "Abrir pipeline" so no celular */
html.rw-layout [data-radix-popper-content-wrapper] .border-b:has(> .rw-panel-close){justify-content:flex-start;gap:8px}
html.rw-layout .rw-panel-close{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;margin:-10px -12px -10px auto;padding:0;border:0;border-radius:10px;background:transparent;color:var(--muted-foreground);cursor:pointer}
html.rw-layout .rw-panel-close:hover{background:var(--accent);color:var(--foreground)}
html.rw-layout .rw-panel-close:focus-visible{outline:2px solid var(--ring);outline-offset:-2px}
html.rw-layout .rw-panel-close svg{width:18px;height:18px}
html.rw-layout .rw-pipe-open{display:none}
/* Seletor de emoji (20/10): os botoes dele ficam no tamanho da biblioteca (categorias 30 px, emojis 40 px). A regra de
   44 px da barra de mensagem e a grade de abas do celular (rw-layout.js gridTabs) quebravam a faixa de categorias em
   3 fileiras, com os icones cortados (desde a rodada 1; o original sem o piloto e limpo) */
html.rw-layout [data-tour=chat-main-area] .px-4.py-3.relative aside.EmojiPickerReact button{min-width:0;min-height:0}
/* N1 navegacao enxuta (20/10, Pedro; rw-navigation.js rwNav): a coluna fica so com o essencial (Dashboard,
   Conversas, Contatos, Pipelines, Canais); o resto abre em "Mais ferramentas", a gaveta do proprio sistema, aqui
   flutuando ao lado da coluna. Linha visual refinada com a revisao do Codex (20/10): linhas leves em duas colunas,
   sem caixas, agrupadas por tarefa, filtro de categoria, contador no rodape. No celular ocupa a tela, com seletor */
html.rw-layout .rw-nav-lean .rw-nav-divider{height:1px;margin:10px 14px;background:var(--border)}
html.rw-layout .rw-sidebar[data-collapsed=true] .rw-nav-lean .rw-nav-divider{margin:8px 12px}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link.rw-nav-more-active{color:var(--primary)}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link.rw-nav-more[aria-expanded=true]{background:var(--secondary)}
html.rw-layout [data-slot=sheet-content].rw-tools-sheet{top:12px;bottom:12px;left:276px;height:auto;width:min(800px,calc(100vw - 300px));max-width:none;padding:0;gap:0;display:flex;flex-direction:column;overflow:hidden;background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 50px rgb(0 0 0 / .16)}
html.rw-layout [data-slot=sheet-content].rw-tools-sheet.rw-tools-sheet-rail{left:84px;width:min(800px,calc(100vw - 108px))}
html.rw-layout [data-slot=sheet-content].rw-tools-sheet>button.absolute{display:none}
html.rw-layout .rw-tools-head{flex:none;padding:24px 26px 0;border-bottom:1px solid var(--border)}
html.rw-layout .rw-tools-titlebar{display:flex;align-items:center;justify-content:space-between;gap:12px}
html.rw-layout .rw-tools-title{margin:0;font-size:calc(24px*var(--rw-fs));line-height:1.2;font-weight:700;letter-spacing:-.02em;color:var(--foreground)}
html.rw-layout .rw-tools-close{display:inline-flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;margin:-8px -10px -8px 0;border:0;border-radius:12px;background:transparent;color:var(--muted-foreground);cursor:pointer}
html.rw-layout .rw-tools-close:hover{background:var(--secondary);color:var(--foreground)}
html.rw-layout .rw-tools-close:focus-visible{outline:2px solid var(--ring);outline-offset:-2px}
html.rw-layout .rw-tools-close svg{width:20px;height:20px}
html.rw-layout .rw-tools-lead{margin:4px 0 16px;font-size:calc(14px*var(--rw-fs));line-height:1.45;color:var(--muted-foreground)}
html.rw-layout .rw-tools-searchbox{position:relative;display:block}
html.rw-layout .rw-tools-search-icon{position:absolute;left:14px;top:50%;width:18px;height:18px;transform:translateY(-50%);color:var(--muted-foreground);pointer-events:none}
html.rw-layout .rw-tools-search{width:100%;height:46px;padding:0 14px 0 42px;border:1px solid var(--border);border-radius:12px;background:var(--background);color:var(--foreground);font:calc(15px*var(--rw-fs)) var(--font-sans)}
html.rw-layout .rw-tools-search::placeholder{color:var(--muted-foreground)}
html.rw-layout .rw-tools-search:focus-visible{outline:2px solid var(--ring);outline-offset:1px}
html.rw-layout .rw-tools-filter{display:flex;flex-wrap:wrap;gap:4px;margin:14px -4px 12px}
html.rw-layout .rw-tools-chip{height:36px;padding:0 13px;border:0;border-radius:999px;background:transparent;color:var(--muted-foreground);font:600 calc(13.5px*var(--rw-fs)) var(--font-sans);cursor:pointer}
html.rw-layout .rw-tools-chip:hover{background:var(--secondary);color:var(--foreground)}
html.rw-layout .rw-tools-chip[aria-pressed=true]{background:var(--rw-soft);color:var(--rw-soft-text)}
html.rw-layout .rw-tools-chip:focus-visible{outline:2px solid var(--ring);outline-offset:1px}
html.rw-layout .rw-tools-select{display:none}
html.rw-layout .rw-tools-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 26px 20px}
html.rw-layout .rw-tools-section{margin-top:22px}
html.rw-layout .rw-tools-heading{display:flex;align-items:baseline;gap:8px;margin:0 0 4px;font-size:calc(11.5px*var(--rw-fs));font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-foreground)}
html.rw-layout .rw-tools-count{font-weight:500;letter-spacing:0}
html.rw-layout .rw-tools-group+.rw-tools-group{margin-top:10px}
html.rw-layout .rw-tools-subheading{margin:10px 0 0;font-size:calc(12.5px*var(--rw-fs));font-weight:650;color:var(--foreground)}
html.rw-layout .rw-tools-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}
html.rw-layout a.rw-tool{display:grid;grid-template-columns:38px minmax(0,1fr) 16px;align-items:center;gap:14px;min-height:64px;padding:11px 8px;border-bottom:1px solid var(--border);color:var(--foreground);text-decoration:none;transition:background .12s}
html.rw-layout a.rw-tool:hover{background:var(--secondary);border-radius:12px;border-bottom-color:transparent}
html.rw-layout a.rw-tool:focus-visible{outline:2px solid var(--ring);outline-offset:-2px;border-radius:12px}
html.rw-layout a.rw-tool.rw-tool-active .rw-tool-name{color:var(--primary)}
html.rw-layout a.rw-tool.rw-tool-active .rw-tool-icon{background:var(--rw-soft);border-color:transparent;color:var(--primary)}
html.rw-layout .rw-tool-icon{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--border);border-radius:11px;background:var(--background);color:var(--foreground)}
html.rw-layout .rw-tool-icon svg{width:18px;height:18px}
html.rw-layout .rw-tool-text{display:flex;flex-direction:column;gap:2px;min-width:0}
html.rw-layout .rw-tool-name{font-size:calc(14.5px*var(--rw-fs));font-weight:650;line-height:1.3}
html.rw-layout .rw-tool-hint{font-size:calc(13px*var(--rw-fs));line-height:1.4;color:var(--muted-foreground)}
html.rw-layout .rw-tool-chevron{width:16px;height:16px;color:var(--muted-foreground)}
html.rw-layout .rw-tools-empty{margin-top:28px;font-size:calc(14px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-tools-foot{flex:none;display:flex;align-items:center;gap:8px;padding:12px 26px;border-top:1px solid var(--border);font-size:calc(12.5px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-tools-foot svg{width:16px;height:16px}
@media(prefers-reduced-motion:reduce){html.rw-layout a.rw-tool{transition:none}}
@media(max-width:767px){
html.rw-layout [data-slot=sheet-content].rw-tools-sheet,html.rw-layout [data-slot=sheet-content].rw-tools-sheet.rw-tools-sheet-rail{top:0;bottom:0;left:0;width:100vw;border:0;border-radius:0;box-shadow:none}
html.rw-layout .rw-tools-head{padding:18px 16px 0}
html.rw-layout .rw-tools-title{font-size:calc(22px*var(--rw-fs))}
html.rw-layout .rw-tools-search{font-size:calc(16px*var(--rw-fs))}
html.rw-layout .rw-tools-filter{display:none}
html.rw-layout .rw-tools-select{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;margin-top:6px;font-size:calc(14px*var(--rw-fs));color:var(--muted-foreground)}
html.rw-layout .rw-tools-select select{min-height:44px;padding:0 4px;border:0;background:transparent;color:var(--foreground);font:650 calc(15px*var(--rw-fs)) var(--font-sans);text-align:right}
html.rw-layout .rw-tools-select select:focus-visible{outline:2px solid var(--ring);outline-offset:2px;border-radius:8px}
html.rw-layout .rw-tools-body{padding:0 16px 18px}
html.rw-layout .rw-tools-grid{grid-template-columns:1fr}
html.rw-layout a.rw-tool{padding:12px 4px}
html.rw-layout .rw-tools-foot{padding:12px 16px}
}
/* N2 caminho de volta para "Mais ferramentas" nas telas de ferramenta (21/10, Pedro; rw-layout.js toolCrumb) */
html.rw-layout[data-rw-tool-cat] main h1:not(.truncate)::before{content:none;display:none}
html.rw-layout .rw-crumb{display:inline-flex;align-items:center;gap:6px;min-height:32px;margin:0 0 6px -8px;padding:0 10px 0 8px;border:0;border-radius:9px;background:transparent;color:var(--muted-foreground);font:600 calc(12.5px*var(--rw-fs)) var(--font-sans);cursor:pointer}
html.rw-layout .rw-crumb:hover{background:var(--secondary);color:var(--foreground)}
html.rw-layout .rw-crumb:focus-visible{outline:2px solid var(--ring);outline-offset:1px}
html.rw-layout .rw-crumb svg{width:15px;height:15px}
html.rw-layout .rw-crumb .rw-crumb-cat{color:var(--primary)}
html.rw-layout .rw-crumb .rw-crumb-sep{opacity:.6}
@media(max-width:767px){html.rw-layout .rw-crumb{min-height:40px;margin-bottom:2px}}
/* D1 revisao visual completa (21/10, Pedro: "quadros sem contraste com o fundo", "textos quebrando linhas", "margens
   desorganizadas", "o botao do menu ativo esta muito sorriso amarelo"). Regras por padrao, nao por tela: valem para
   todas as telas que usam a mesma peca. Revisao feita nas 33 telas a 393 px e nas principais a 1440 px. */
/* 1. Superficies: fundo mais claro e menos verde; a lateral um tom abaixo; quadros sempre brancos com borda */
html.rw-layout:not(.dark){--background:#eef3f0;--sidebar:#e3ebe5;--border:#d3ddd6;--input:#c9d5cc;--secondary:#e9f0eb}
html.rw-layout main .bg-sidebar{background:var(--card)}
html.rw-layout main :is(.border-sidebar-border){border-color:var(--border)}
/* 2. Item ativo do menu: cartao branco, texto e icone na cor da marca e uma barra de destaque; nada de verde sobre verde */
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link{position:relative}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link.rw-nav-active{background:var(--card);color:var(--primary);font-weight:650;box-shadow:0 1px 3px rgb(16 40 28 / .10),0 0 0 1px var(--border)}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link.rw-nav-active::before{content:"";display:block;position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--primary)}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link.rw-nav-active>svg{color:var(--primary)}
html.rw-layout :is(.rw-sidebar nav,.rw-mobile-nav) .rw-nav-link.rw-nav-more-active{background:transparent;box-shadow:none}
/* 3. Cartao de cadastro (Usuarios, Equipes, Integracoes): sem os 24 px vazios em cima e embaixo, fundo branco, dados em
   fonte normal; no toque, os botoes de editar e excluir aparecem (antes so com o mouse em cima, e ocupavam espaco vazio) */
html.rw-layout main .rounded-xl.border.py-6.shadow-sm.group:has(> .p-0){padding:0;gap:0;overflow:hidden;background:var(--card);border-color:var(--border);box-shadow:var(--rw-shadow)}
html.rw-layout main .rounded-xl.border.py-6.shadow-sm.group > .p-0 .flex.items-center.justify-between{gap:12px;min-width:0}
html.rw-layout main .rounded-xl.border.py-6.shadow-sm.group > .p-0 .flex.items-center.justify-between > span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right;color:var(--foreground)}
@media(hover:none){html.rw-layout main .opacity-0.group-hover\:opacity-100{opacity:1}}
/* rodape de acoes do cartao: sempre visivel (o espaco ja era reservado e ficava vazio sem o mouse em cima) */
html.rw-layout main .rounded-xl.border.group > .p-0 > .border-t.opacity-0.group-hover\:opacity-100{opacity:1}
html.rw-layout main .rounded-xl.border.group > .p-0 > .border-t.opacity-0 > button{color:var(--muted-foreground);height:44px;border-radius:0}
html.rw-layout main .rounded-xl.border.group > .p-0 > .border-t.opacity-0 > button:hover{color:var(--primary);background:var(--secondary)}
html.rw-layout main .rounded-xl.border.group > .p-0 > .border-t.opacity-0 > button.text-red-600:hover,html.rw-layout main .rounded-xl.border.group > .p-0 > .border-t.opacity-0 > button[class*=text-red]:hover{color:#b42318;background:#fdeceb}
html.rw-layout main .rounded-xl.border.group > .p-0 > .border-t.opacity-0{border-color:var(--border)}
html.rw-layout main .rounded-xl.border.group > .p-0 > .border-t.opacity-0 > .w-px{background:var(--border)}
/* 4. Fonte monoespacada so para codigo de verdade */
html.rw-layout main .font-mono:not(pre *,code *,textarea){font-family:var(--font-sans);font-variant-numeric:tabular-nums}
/* 5. Janelas de formulario: fundo branco e campos com borda visivel */
html.rw-layout [role=dialog]:not([data-slot=sheet-content]):not(.rw-l-pal){background:var(--card)}
html.rw-layout [role=dialog]:not([data-slot=sheet-content]) :is(input:not([type=checkbox]):not([type=radio]),textarea,button[role=combobox]){background:var(--card);border-color:var(--input)}
/* 6. Pares rotulo e valor que quebravam (Credenciais: "Em uso nesta conta") */
html.rw-layout main section.border.rounded-lg{background:var(--card);border-color:var(--border)}
@media(max-width:767px){
/* 7. Cabecalho com descricao visivel: titulo e descricao em toda a largura, acao embaixo (nada espremido ao lado) */
html.rw-layout main div.flex.justify-between:has(> div:first-child > :is(h1,h2):is(:first-child,.rw-crumb + *) + p:not(.hidden)){flex-wrap:wrap;align-items:flex-start;row-gap:12px}
html.rw-layout main div.flex.justify-between:has(> div:first-child > :is(h1,h2):is(:first-child,.rw-crumb + *) + p:not(.hidden)) > div:first-child{flex:1 1 100%;min-width:0}
html.rw-layout main div.flex.justify-between:has(> div:first-child > :is(h1,h2):is(:first-child,.rw-crumb + *) + p:not(.hidden)) > div.flex:last-child:has(> .relative){flex:1 1 100%}
html.rw-layout main div.flex.justify-between:has(> div:first-child > :is(h1,h2):is(:first-child,.rw-crumb + *) + p:not(.hidden)) > div.flex:last-child > .relative{flex:1;min-width:0}
html.rw-layout main div.flex.justify-between:has(> div:first-child > :is(h1,h2):is(:first-child,.rw-crumb + *) + p:not(.hidden)) > div.flex:last-child > .relative > input{width:100%}
/* dois ou mais botoes na acao do cabecalho (Templates): dividem a linha; se nao couberem, cada um ocupa a largura toda */
html.rw-layout main div.flex.justify-between:has(> div:first-child > :is(h1,h2):is(:first-child,.rw-crumb + *) + p:not(.hidden)) > div.flex:last-child:not(:has(> .relative)):has(> :is(button,a) + :is(button,a)){flex:1 1 100%;flex-wrap:wrap}
html.rw-layout main div.flex.justify-between:has(> div:first-child > :is(h1,h2):is(:first-child,.rw-crumb + *) + p:not(.hidden)) > div.flex:last-child:not(:has(> .relative)):has(> :is(button,a) + :is(button,a)) > :is(button,a){flex:1 1 auto}
/* 8. Barra de ferramentas: busca e filtros numa linha; botoes secundarios dividindo a outra, grade/lista no fim */
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3.md\:items-center.md\:justify-between > .flex.items-center.gap-2:not(:empty){display:flex;flex-wrap:wrap;gap:8px}
/* lado a lado e com a mesma largura quando o texto cabe; um embaixo do outro quando nao cabe (fonte maior no Android) */
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3.md\:items-center.md\:justify-between > .flex.items-center.gap-2 > :is(button,a,.flex-shrink-0){flex:1 1 0;min-width:max-content}
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3.md\:items-center.md\:justify-between > .flex.items-center.gap-2 > :is(:is(button,a).bg-primary,.flex-shrink-0:has(> .bg-primary)){order:-1}
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3.md\:items-center.md\:justify-between > .flex.items-center.gap-2 > :is(button,a,.flex-shrink-0 > button){height:40px;min-height:40px;padding:0 14px;font-size:calc(13.5px*var(--rw-fs))}
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3.md\:items-center.md\:justify-between > .flex.items-center.gap-2 > .flex-shrink-0 > button{width:100%}
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3.md\:items-center.md\:justify-between > .flex.items-center.gap-2 > div:not(.flex-shrink-0):last-child{flex:none;margin-left:auto}
html.rw-layout main .space-y-4 > .flex.flex-col.gap-3.md\:items-center.md\:justify-between > .flex.items-center.gap-2 > div:not(.flex-shrink-0):last-child button{min-width:36px;min-height:36px}
html.rw-layout main section.border.rounded-lg > div.flex.items-baseline{flex-wrap:wrap;row-gap:0;column-gap:6px}
html.rw-layout main section.border.rounded-lg > div.flex.items-baseline > span.text-muted-foreground:first-child{flex:1 1 100%;font-size:calc(12.5px*var(--rw-fs))}
/* 9. Respostas automaticas: a busca deixa de ficar espremida ao lado do botao */
html.rw-layout main div.flex.items-center.justify-between.gap-4:has(> .relative.flex-1.max-w-sm + button){flex-wrap:wrap;gap:10px}
html.rw-layout main div.flex.items-center.justify-between.gap-4:has(> .relative.flex-1.max-w-sm + button) > .relative{flex:1 1 100%;max-width:none}
}
/* 10. Paginacao: a pagina atual nao desbota quando e a unica (o botao fica desabilitado e herdava 50% de opacidade) */
html.rw-layout main button.bg-primary.min-w-9:disabled{opacity:1}
html.rw-layout main button.min-w-9.bg-sidebar{background:var(--card);border-color:var(--border)}
/* 11. Seletores e campos "transparentes" ficavam da cor do fundo da pagina (Modelos de Mensagem, Acao agendada) */
html.rw-layout:not(.dark) :is(main,[role=dialog]) :is([data-slot=select-trigger],[data-slot=input],[data-slot=textarea],input,textarea).bg-transparent{background:var(--card)}
/* 12. Abas ativas: cartao branco com texto da marca, como o item ativo do menu (o verde a 10% sumia no fundo verde) */
html.rw-layout:not(.dark) main [role=tab][data-state=active]{background:var(--card);border-color:var(--border);color:var(--primary);box-shadow:0 1px 2px rgb(16 40 28 / .08)}
/* 13. Formularios em janela: seletores na largura dos campos (antes cada um num tamanho) e botao de contorno branco */
html.rw-layout [role=dialog] .space-y-2 > [data-slot=select-trigger].w-fit{width:100%}
html.rw-layout:not(.dark) :is(main,[role=dialog]) :is(button,a).border.bg-background{background:var(--card);border-color:var(--input)}
html.rw-layout:not(.dark) :is(main,[role=dialog]) :is(button,a).border.bg-background:hover{background:var(--secondary)}
/* 14. Estado vazio em caixa tracejada: fundo branco (sem ele a caixa some no fundo da pagina) */
html.rw-layout:not(.dark) main .border.border-dashed:is(.rounded-md,.rounded-lg,.rounded-xl):not(button):not(label){background:var(--card)}
@media(max-width:767px){
/* 15. Produtos: busca em cima, os dois filtros lado a lado, Importar e Novo produto dividindo a linha */
html.rw-layout main .flex.flex-col.gap-3.md\:flex-row.md\:justify-between > .flex.flex-col.gap-2.md\:flex-row.md\:flex-1:has(> [data-slot=select-trigger]){display:grid;grid-template-columns:1fr 1fr;gap:8px}
html.rw-layout main .flex.flex-col.gap-3.md\:flex-row.md\:justify-between > .flex.flex-col.gap-2.md\:flex-row.md\:flex-1:has(> [data-slot=select-trigger]) > .relative{grid-column:1 / -1;max-width:none}
html.rw-layout main .flex.flex-col.gap-3.md\:flex-row.md\:justify-between > .flex.flex-col.gap-2.md\:flex-row.md\:flex-1:has(> [data-slot=select-trigger]) > [data-slot=select-trigger]{width:100%;min-width:0}
html.rw-layout main .flex.flex-col.gap-3.md\:flex-row.md\:justify-between > .flex.gap-2:last-child > :is(a,button){flex:1 1 0;min-width:0}
}
html.rw-layout main .mt-auto.pt-4.border-t:has(button.min-w-9){margin-top:16px;border-color:var(--border)}
/* paginacao no celular: ver regra 20 (vale com e sem o involucro) */
/* 16. Tabelas em caixa com borda (Perfis, listas em modo tabela): fundo branco e cabecalho num tom de apoio */
html.rw-layout:not(.dark) main :is(.rounded-md,.rounded-lg,.rounded-xl).border:has(> table){background:var(--card);border-color:var(--border)}
html.rw-layout:not(.dark) main :is(.rounded-md,.rounded-lg,.rounded-xl).border:has(> table) > table > thead > tr{background:var(--secondary)}
/* 17. Configuracoes da Conta: cada bloco vira um cartao (antes eram faixas soltas no fundo, separadas por linha) */
html.rw-layout main .max-w-5xl.w-full.mx-auto section.pt-8.pb-8{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px;margin-bottom:16px;box-shadow:var(--rw-shadow)}
html.rw-layout main .max-w-5xl.w-full.mx-auto section.pt-8.pb-8 > .grid.mb-5{margin-bottom:12px}
html.rw-layout main .max-w-5xl.w-full.mx-auto > .border-t.text-center{border-top:0}
@media(max-width:767px){html.rw-layout main .max-w-5xl.w-full.mx-auto section.pt-8.pb-8{padding:16px}
html.rw-layout main .max-w-5xl.w-full.mx-auto section.pt-8.pb-8 > .grid.grid-cols-4{grid-template-columns:minmax(0,1fr) auto;gap:12px}
html.rw-layout main .max-w-5xl.w-full.mx-auto section.pt-8.pb-8 > .grid.grid-cols-4 > *{grid-column:auto}}
/* 18. Dashboard no celular: periodo alinhado a esquerda, na mesma margem de "Filtros" (antes ficava solto na direita) */
@media(max-width:767px){html.rw-layout[data-rw-page=dashboard] main .-mt-3.flex.justify-end:has(> span.rounded-md.border){justify-content:flex-start}}
/* 19. Tokens de Acesso: etiqueta de escopos longa quebra dentro do cartao (antes passava da borda) */
html.rw-layout main td .flex.flex-wrap > span.whitespace-nowrap.rounded-md{white-space:normal;max-width:100%;overflow-wrap:anywhere;justify-content:flex-start;text-align:left}
html.rw-layout main .rw-crumb-row.rw-crumb-row.rw-crumb-row{padding-top:2px}
/* 20. Rodape de paginacao fora do involucro (Equipes): mesmo respiro, linha e arrumacao dos outros (21/10, print do Pedro) */
html.rw-layout main :not(.mt-auto) > .flex.flex-col.gap-4:has(> .flex.items-center.gap-1 > button.min-w-9){margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
@media(max-width:767px){
/* rodape de paginacao no celular: "Itens por pagina" e as paginas na mesma linha quando cabem (as paginas descem se
   o texto for maior); a contagem sempre embaixo, alinhada a esquerda. Antes era grade fixa e o rotulo quebrava. */
html.rw-layout main .flex.flex-col.gap-4:has(> .flex.items-center.gap-1 > button.min-w-9){display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px 12px}
html.rw-layout main .flex.flex-col.gap-4:has(> .flex.items-center.gap-1 > button.min-w-9) > :first-child{flex:0 0 auto;flex-wrap:nowrap}
html.rw-layout main .flex.flex-col.gap-4:has(> .flex.items-center.gap-1 > button.min-w-9) > :nth-child(2){order:3;flex:1 1 100%;justify-content:flex-start}
html.rw-layout main .flex.flex-col.gap-4:has(> .flex.items-center.gap-1 > button.min-w-9) > :nth-child(3){margin-left:auto}
html.rw-layout main .px-\[34px\]:has(> .flex.flex-col.gap-4 > .flex.items-center.gap-1 > button.min-w-9){padding-left:16px;padding-right:16px}
}
/* 21. Seletor grade/lista: respiro em relacao aos botoes de cima (antes 0 px) */
@media(max-width:767px){html.rw-layout main .flex.items-center.justify-end.mb-3:has(> .flex.border.rounded-lg > button){margin-top:12px}}
/* 22. Telas internas no celular (21/10, prints do Pedro na edicao do agente: pagina mais larga que a tela, "Voltar" sem
   margem, botoes desalinhados, abas quebrando com "Canais" sozinho, campos saindo da tela) */
@media(max-width:767px){
/* grade que so define colunas em tela grande: no celular virava uma coluna do tamanho do maior conteudo (417 px) */
html.rw-layout main .grid[class*="lg:grid-cols-"]:not([class*="md:grid-cols-"]):not([class*="sm:grid-cols-"]):not([class~=grid-cols-1]):not([class~=grid-cols-2]):not([class~=grid-cols-3]):not([class~=grid-cols-4]){grid-template-columns:minmax(0,1fr)}
/* cabecalho da edicao: Voltar, identidade e acoes, cada um numa linha, na margem de 16 px */
html.rw-layout main .flex.flex-shrink-0.flex-wrap.items-center.gap-2.border-b.bg-card.px-6:has(> div.flex.items-center.gap-\[14px\]){padding:10px 16px 14px;row-gap:10px;column-gap:0}
html.rw-layout main .flex.flex-shrink-0.flex-wrap.items-center.gap-2.border-b.bg-card.px-6:has(> div.flex.items-center.gap-\[14px\]) > button:first-child{flex:1 1 100%;justify-content:flex-start;padding:0;height:32px;margin-left:-2px}
html.rw-layout main .flex.flex-shrink-0.flex-wrap.items-center.gap-2.border-b.bg-card.px-6:has(> div.flex.items-center.gap-\[14px\]) > div.flex.min-w-0.items-center{flex:1 1 100%;padding:0}
html.rw-layout main .flex.flex-shrink-0.flex-wrap.items-center.gap-2.border-b.bg-card.px-6:has(> div.flex.items-center.gap-\[14px\]) > div.flex-1:empty{display:none}
html.rw-layout main .flex.flex-shrink-0.flex-wrap.items-center.gap-2.border-b.bg-card.px-6 > div.flex.items-center.gap-\[14px\]{flex:1 1 100%;gap:10px;flex-wrap:wrap}
html.rw-layout main .flex.flex-shrink-0.flex-wrap.items-center.gap-2.border-b.bg-card.px-6 > div.flex.items-center.gap-\[14px\] > button{flex:1 1 0;min-width:max-content;justify-content:center;min-height:42px}
/* recuos de 36 px viram a margem de 16 px do resto do app */
html.rw-layout main .flex-shrink-0.border-b.bg-card.px-9{padding-left:16px;padding-right:16px;padding-top:12px}
html.rw-layout main .overflow-y-auto.px-9{padding-left:16px;padding-right:16px;padding-top:20px}
/* 5 abas com icone numa linha so (rw-layout.js gridTabs) */
html.rw-layout main [role=tablist][data-rw-tabs="5"]{grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
html.rw-layout main [role=tablist][data-rw-tabs="5"][data-rw-tabs-icon] > [role=tab]{padding:7px 0;font-size:11px;min-height:62px} /* fora da escala de fonte: "Configuração" maior passava da aba (matriz de 22/10) */
/* rotulo com botoes ao lado (Comportamento + Revisar Prompt + Gerar com IA): rotulo em cima, botoes dividindo a linha */
html.rw-layout main div.flex.items-center.justify-between:has(> label + div.flex.gap-2 > button){flex-wrap:wrap;row-gap:8px}
html.rw-layout main div.flex.items-center.justify-between:has(> label + div.flex.gap-2 > button) > div.flex.gap-2{flex:1 1 100%;flex-wrap:wrap}
html.rw-layout main div.flex.items-center.justify-between:has(> label + div.flex.gap-2 > button) > div.flex.gap-2 > button{flex:1 1 0;min-width:max-content}
}
/* 23. Mais telas internas no celular (varredura de 21/10 nas telas que a matriz nao abria) */
@media(max-width:767px){
/* Detalhe de Perfil: tabela de permissoes com 5 colunas fixas (9rem + 3 x 4.5rem + extras) passava 116 px da tela;
   nome e as 3 caixas numa linha, os extras ("Read all inboxes") na linha de baixo */
html.rw-layout main .grid[class*="grid-cols-[minmax(9rem,18rem)_4.5rem_4.5rem_4.5rem_minmax(0,1fr)]"]{grid-template-columns:minmax(0,1fr) repeat(3,58px);column-gap:6px}
html.rw-layout main .grid[class*="grid-cols-[minmax(9rem,18rem)_4.5rem_4.5rem_4.5rem_minmax(0,1fr)]"] > :nth-child(5){grid-column:1 / -1}
html.rw-layout main .grid[class*="grid-cols-[minmax(9rem,18rem)_4.5rem_4.5rem_4.5rem_minmax(0,1fr)]"] > :nth-child(5):empty{display:none}
html.rw-layout main .grid[class*="grid-cols-[minmax(9rem,18rem)_4.5rem_4.5rem_4.5rem_minmax(0,1fr)]"] > :first-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
html.rw-layout main .grid[class*="grid-cols-[minmax(9rem,18rem)_4.5rem_4.5rem_4.5rem_minmax(0,1fr)]"][class*="uppercase"] > div{flex-direction:column;gap:2px;font-size:calc(10px*var(--rw-fs));letter-spacing:.02em}
/* Adicionar usuarios a equipe: contagem numa linha, "Selecionar todos" e "Salvar" dividindo a de baixo */
html.rw-layout main .flex.items-center.justify-between.p-4.rounded-lg:has(> .flex.items-center.gap-4 > button){flex-wrap:wrap;gap:10px}
html.rw-layout main .flex.items-center.justify-between.p-4.rounded-lg:has(> .flex.items-center.gap-4 > button) > .flex.items-center.gap-4{display:contents}
html.rw-layout main .flex.items-center.justify-between.p-4.rounded-lg:has(> .flex.items-center.gap-4 > button) > .flex.items-center.gap-4 > :not(button){flex:1 1 100%}
html.rw-layout main .flex.items-center.justify-between.p-4.rounded-lg:has(> .flex.items-center.gap-4 > button) :is(button){flex:1 1 0;min-width:max-content;min-height:40px}
}
/* cartao de tabela: a caixa de marcar nao leva rotulo ("Selecionar" ficava por cima da foto) */
html.rw-layout main [data-rw-cards-row] > :has(> [role=checkbox])::before{display:none}
@media(max-width:767px){
/* 24. Cabecalho de formulario com titulo e 2 acoes (Novo Segmento): titulo numa linha, acoes dividindo a de baixo */
html.rw-layout main .border-b.px-6.py-4:has(> div.flex.items-center.justify-between > div.flex.items-center.gap-2 > button + button){padding-left:16px;padding-right:16px}
html.rw-layout main .border-b.px-6.py-4 > div.flex.items-center.justify-between:has(> div.flex.items-center.gap-2 > button + button){flex-wrap:wrap;gap:10px}
html.rw-layout main .border-b.px-6.py-4 > div.flex.items-center.justify-between > div.flex.items-center.gap-2:has(> button + button){flex:1 1 100%;flex-wrap:wrap}
html.rw-layout main .border-b.px-6.py-4 > div.flex.items-center.justify-between > div.flex.items-center.gap-2:has(> button + button) > button{flex:1 1 0;min-width:max-content;min-height:40px}
}
@media(max-width:767px){
/* 25. Campo com dois botoes ao lado (Configuracoes do canal: Foto do Perfil com Atualizar e Remover): o campo ficava com 53 px */
html.rw-layout main div.flex.gap-2:has(> input + button + button){flex-wrap:wrap}
html.rw-layout main div.flex.gap-2:has(> input + button + button) > input{flex:1 1 100%;min-width:0}
html.rw-layout main div.flex.gap-2:has(> input + button + button) > button{flex:1 1 0;min-width:max-content}
}
/* 26. Painel: periodo clicavel e participacao por canal em ranking (21/10, rw-dashboard.js; so com o piloto) */
html.rw-layout .rw-periodo{position:relative;display:inline-block}
html.rw-layout .rw-periodo-botao{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 12px 0 14px;border:1px solid var(--border);border-radius:12px;background:var(--card);color:var(--foreground);font:600 calc(13.5px*var(--rw-fs)) var(--font-sans);cursor:pointer;box-shadow:var(--rw-shadow);transition:border-color .15s,box-shadow .15s}
html.rw-layout .rw-periodo-botao:hover{border-color:color-mix(in srgb,var(--primary) 45%,var(--border))}
html.rw-layout .rw-periodo-botao:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
html.rw-layout .rw-periodo-botao > svg:first-child{color:var(--primary)}
html.rw-layout .rw-periodo-dias{padding:2px 8px;border-radius:999px;background:var(--secondary);color:var(--muted-foreground);font-size:calc(12px*var(--rw-fs));font-weight:600}
html.rw-layout .rw-periodo-seta{color:var(--muted-foreground);transition:transform .15s}
html.rw-layout .rw-periodo-botao[aria-expanded=true] .rw-periodo-seta{transform:rotate(180deg)}
html.rw-layout .rw-periodo-painel{position:absolute;right:0;top:calc(100% + 8px);z-index:50;width:300px;max-width:calc(100vw - 32px);max-height:min(560px,calc(100dvh - 140px));overflow-y:auto;overscroll-behavior:contain;padding:8px;border:1px solid var(--border);border-radius:14px;background:var(--card);box-shadow:0 12px 32px rgb(16 40 28 / .16)}
html.rw-layout.dark .rw-periodo-painel{box-shadow:0 12px 32px rgb(0 0 0 / .45)}
html.rw-layout .rw-periodo-lista{display:grid;gap:2px}
html.rw-layout .rw-periodo-opcao{display:flex;align-items:center;justify-content:space-between;min-height:40px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:var(--foreground);font:500 calc(14px*var(--rw-fs)) var(--font-sans);text-align:left;cursor:pointer}
html.rw-layout .rw-periodo-opcao:hover{background:var(--secondary)}
html.rw-layout .rw-periodo-opcao.rw-ativo{background:color-mix(in srgb,var(--primary) 10%,var(--card));color:var(--primary);font-weight:650}
html.rw-layout .rw-periodo-custom{margin-top:8px;padding:12px 4px 4px;border-top:1px solid var(--border)}
html.rw-layout .rw-periodo-titulo{padding:0 8px 8px;color:var(--muted-foreground);font:600 calc(12px*var(--rw-fs)) var(--font-sans);text-transform:uppercase;letter-spacing:.04em}
html.rw-layout .rw-periodo-datas{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 4px}
html.rw-layout .rw-periodo-datas label{display:grid;gap:4px;min-width:0;color:var(--muted-foreground);font:500 calc(12px*var(--rw-fs)) var(--font-sans)}
html.rw-layout .rw-periodo-datas input{width:100%;min-width:0;height:40px;padding:0 8px;border:1px solid var(--input);border-radius:10px;background:var(--card);color:var(--foreground);font:500 calc(13px*var(--rw-fs)) var(--font-sans)}
html.rw-layout .rw-periodo-aplicar{width:calc(100% - 8px);margin:10px 4px 0;height:40px;border:0;border-radius:10px;background:var(--primary);color:var(--primary-foreground);font:600 calc(14px*var(--rw-fs)) var(--font-sans);cursor:pointer}
html.rw-layout .rw-periodo-aplicar:disabled{opacity:.5;cursor:default}
@media(max-width:767px){html.rw-layout .rw-periodo-painel{right:auto;left:0}}
html.rw-layout .rw-canais{display:grid;gap:14px}
html.rw-layout .rw-canal{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;align-items:start}
html.rw-layout .rw-canal-icone{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px}
html.rw-layout .rw-canal-texto{min-width:0}
html.rw-layout .rw-canal-linha{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
html.rw-layout .rw-canal-nome{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--foreground);font:600 calc(14px*var(--rw-fs)) var(--font-sans)}
html.rw-layout .rw-canal-pct{flex:none;color:var(--foreground);font:700 calc(15px*var(--rw-fs)) var(--font-sans);font-variant-numeric:tabular-nums}
html.rw-layout .rw-canal-barra{height:8px;margin:7px 0 6px;border-radius:999px;background:var(--secondary);overflow:hidden}
html.rw-layout .rw-canal-barra > span{display:block;height:100%;border-radius:inherit;background:color-mix(in srgb,var(--primary) 55%,var(--card))}
html.rw-layout .rw-canal-lider .rw-canal-barra > span{background:var(--primary)}
html.rw-layout .rw-canal-sub{color:var(--muted-foreground);font:500 calc(12.5px*var(--rw-fs)) var(--font-sans)}
html.rw-layout .rw-canais-mais{justify-self:start;min-height:36px;padding:0 4px;border:0;background:transparent;color:var(--primary);font:600 calc(13.5px*var(--rw-fs)) var(--font-sans);cursor:pointer}
html.rw-layout .rw-canais-vazio{color:var(--muted-foreground);font-size:calc(14px*var(--rw-fs))}
@media(max-width:767px){
/* periodo no celular: botao a esquerda, na margem de "Filtros", e o painel abre dentro da tela */
html.rw-layout main [data-tour=dashboard-period-badge]{justify-content:flex-start}
html.rw-layout .rw-periodo-painel{width:min(300px,calc(100vw - 32px))}
}
/* 27. Detalhe do contato: "Historico de eventos" vira cartao como o da esquerda (titulo e contagem estavam soltos e
   encostados na rolagem; filtros e lista com 11 px de folga). Pedro, 21/10: "sem praticamente padding, tudo encostado". */
html.rw-layout main .grid.lg\:grid-cols-2.gap-4 > .min-w-0:has(> .flex.flex-col.gap-3 > .flex.items-center.justify-between > h3){background:var(--card);border:1px solid var(--border);border-radius:18px;padding:22px 22px 20px;box-shadow:var(--rw-shadow)}
html.rw-layout.dark main .grid.lg\:grid-cols-2.gap-4 > .min-w-0:has(> .flex.flex-col.gap-3 > .flex.items-center.justify-between > h3){border-color:transparent}
html.rw-layout main .min-w-0 > .flex.flex-col.gap-3:has(> .flex.items-center.justify-between > h3){gap:16px}
html.rw-layout main .min-w-0 > .flex.flex-col.gap-3 > .flex.flex-wrap.items-end.gap-3.rounded-lg.border.p-3{padding:14px 16px;gap:12px 16px;border-color:var(--border)}
html.rw-layout main .min-w-0 > .flex.flex-col.gap-3 > .overflow-y-auto.rounded-lg.border{border:0;border-radius:0;margin:0 -4px;padding:0 4px}
html.rw-layout main .min-w-0 > .flex.flex-col.gap-3 > .overflow-y-auto.rounded-lg.border > .relative.p-3{padding:0}
html.rw-layout main .min-w-0 > .flex.flex-col.gap-3 > .overflow-y-auto.rounded-lg.border > .relative.p-3 > .absolute.px-3{padding-left:0;padding-right:0}
html.rw-layout main .min-w-0 > .flex.flex-col.gap-3 > .overflow-y-auto.rounded-lg.border > .relative > .absolute > .rounded-xl.border.bg-card{background:var(--secondary);border-color:transparent;box-shadow:none;padding-top:18px;padding-bottom:18px}
/* 28. Respiro interno (21/10, Pedro: "tudo encostado no limite"). Medido com o detector de texto encostado em 58 telas:
   as caixas internas do sistema usam 12 px (p-3) ou 10 px (p-2.5); passam a 14 a 16 px. */
html.rw-layout main :is(.rounded-md,.rounded-lg,.rounded-xl).border.p-3{padding:14px 16px}
html.rw-layout main .border.rounded-md.p-3,html.rw-layout main .border.rounded-lg.p-3{padding:14px 16px}
html.rw-layout main .rounded-lg.p-2\.5{padding:12px 16px}
html.rw-layout main .rounded-xl.border.p-3\.5{padding:14px 16px}
/* tabela de permissoes (Perfil): a linha de titulos ficava a 7 px do topo da caixa */
html.rw-layout main .rounded-md.border.px-3:has(> .grid[class*="grid-cols-[minmax(9rem,18rem)"]){padding:6px 16px}
/* tabelas em caixa (computador; Contatos e tabelas que viram cartao no celular ficam de fora): primeira e ultima coluna a 16 px */
@media(min-width:768px){
html.rw-layout:not([data-rw-page=contacts]) main :is(.rounded-md,.rounded-lg,.rounded-xl).border > table:not([data-rw-cards]) :is(th,td):first-child,html.rw-layout:not([data-rw-page=contacts]) main :is(.rounded-md,.rounded-lg,.rounded-xl).border > div > table:not([data-rw-cards]) :is(th,td):first-child{padding-left:16px}
html.rw-layout:not([data-rw-page=contacts]) main :is(.rounded-md,.rounded-lg,.rounded-xl).border > table:not([data-rw-cards]) :is(th,td):last-child,html.rw-layout:not([data-rw-page=contacts]) main :is(.rounded-md,.rounded-lg,.rounded-xl).border > div > table:not([data-rw-cards]) :is(th,td):last-child{padding-right:16px}
}
/* no computador, a area que rola nao deixa o conteudo colado na barra de rolagem ("6 eventos", "3 etapas") */
@media(min-width:768px){html.rw-layout main .h-full.flex.flex-col.p-4 .flex-1.overflow-auto:is(.pt-4,.pt-5),html.rw-layout main .flex-1.overflow-auto.pt-4{padding-right:14px}}
/* aviso de lista vazia em caixa tracejada: o texto quebrava a 11 px da borda no celular */
html.rw-layout main .text-center.py-10.border-dashed{padding-left:20px;padding-right:20px}
/* Escala de fonte (22/10): no celular, botao de rotulo longo que nao quebrava linha ("Duplicar como perfil personalizado",
   fonte do aparelho em 118%) passava da tela; quebra a linha so quando nao cabe */
@media(max-width:767px){
html.rw-layout main .flex-shrink-0:has(> button.h-8.whitespace-nowrap){max-width:100%;min-width:0}
html.rw-layout main .flex-shrink-0 > button.h-8.whitespace-nowrap{white-space:normal;max-width:100%;height:auto;min-height:2rem;padding-block:6px;line-height:1.25;text-align:center}
}
/* Lista de conversas (Pedro, 23/10): responsavel ao lado do status, nao embaixo; quebra para a linha de baixo so se nao couber */
html.rw-layout [data-tour=chat-sidebar] .min-w-0.flex-1 > div.flex.items-center.gap-1.mt-1\.5.flex-wrap:has(+ div.flex.items-center.gap-1\.5.mt-1){display:inline-flex;vertical-align:middle;margin-right:8px}
html.rw-layout [data-tour=chat-sidebar] .min-w-0.flex-1 > div.flex.items-center.gap-1\.5.mt-1{display:inline-flex;vertical-align:middle;margin-top:6px}
/* Conversas (Pedro, 23/10): o robo como atendente na lista, o filtro em palavras, o estado como seletor, uma acao principal
   e o campo de mensagem explicando por que ainda nao da para responder */
html.rw-layout .rw-bot{display:none!important}
html.rw-layout [data-tour=chat-filter-button] > span.absolute{display:none}
html.rw-layout [data-tour=chat-sidebar] .flex.items-center.justify-between:has(> span.text-sm.text-muted-foreground){flex-wrap:nowrap;gap:8px}
html.rw-layout [data-tour=chat-sidebar] .flex.items-center.justify-between:has(> span.text-sm.text-muted-foreground) > div{flex:none;min-width:0}
html.rw-layout [data-tour=chat-sidebar] .min-w-0.flex-1 > div.flex.items-center.gap-1.mt-1\.5.flex-wrap:empty{display:none}
html.rw-layout .rw-filter-chip{display:inline-flex;align-items:center;gap:2px;max-width:150px;height:28px;padding:0 3px 0 10px;border-radius:999px;background:var(--rw-soft);color:var(--rw-soft-text);font-size:var(--text-xs);font-weight:600}
html.rw-layout .rw-filter-chip button{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:999px}
html.rw-layout .rw-filter-chip button:hover,html.rw-layout .rw-filter-chip button:focus-visible{background:color-mix(in srgb,var(--primary) 18%,transparent)}
html.rw-layout .rw-owner-robo{background:color-mix(in srgb,#7c3aed 12%,transparent);color:#6d28d9}
html.rw-layout.dark .rw-owner-robo{color:#c4b5fd;background:color-mix(in srgb,#7c3aed 24%,transparent)}
html.rw-layout .rw-owner-wait{background:color-mix(in srgb,#d97706 13%,transparent);color:#b45309}
html.rw-layout.dark .rw-owner-wait{color:#fbbf24;background:color-mix(in srgb,#d97706 22%,transparent)}
html.rw-layout .rw-owner-person{background:color-mix(in srgb,var(--primary) 10%,transparent);color:var(--primary)}
html.rw-layout .rw-owner svg{flex:none}
html.rw-layout .rw-st{position:relative;display:inline-flex;min-width:0;max-width:100%}
html.rw-layout .rw-st-pill{display:inline-flex;align-items:center;gap:7px;min-width:0;max-width:220px;height:30px;padding:0 9px 0 11px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--foreground);font-size:var(--text-xs);font-weight:600;line-height:1;cursor:pointer}
html.rw-layout .rw-st-pill:hover,html.rw-layout .rw-st-pill[aria-expanded=true]{border-color:color-mix(in srgb,var(--primary) 45%,var(--border));background:var(--accent)}
html.rw-layout .rw-st-pill i,html.rw-layout .rw-st-item i{flex:none;width:8px;height:8px;border-radius:50%}
html.rw-layout .rw-st-pill svg{flex:none;color:var(--muted-foreground)}
html.rw-layout .rw-st-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:70;width:max-content;min-width:250px;max-width:min(300px,calc(100vw - 32px));padding:6px;border-radius:12px;border:1px solid var(--border);background:var(--popover);color:var(--popover-foreground);box-shadow:0 12px 32px rgb(0 0 0 / .18)}
html.rw-layout .rw-st-item{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;padding:8px 12px;border-radius:8px;font-size:var(--text-sm);text-align:left}
html.rw-layout .rw-st-item:hover,html.rw-layout .rw-st-item:focus-visible{background:var(--accent)}
html.rw-layout .rw-st-item.is-on{background:var(--accent);font-weight:600}
html.rw-layout .rw-st-item small{margin-left:auto;color:var(--muted-foreground);font-size:var(--text-xs)}
html.rw-layout .rw-st-sec{padding:10px 12px 4px;color:var(--muted-foreground);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
html.rw-layout .rw-st-nota{padding:2px 12px 8px;color:var(--muted-foreground);font-size:var(--text-xs);line-height:1.35}
html.rw-layout .rw-st-menu hr{border:0;border-top:1px solid var(--border);margin:4px 0}
html.rw-layout .rw-st-main{height:36px;padding:0 18px;border-radius:10px;font-weight:600}
html.rw-layout .rw-pending-bar{display:flex;align-items:center;gap:14px;padding:10px 16px;background:var(--background);text-align:left}
html.rw-layout .rw-pending-bar.is-robo{background:color-mix(in srgb,#7c3aed 7%,var(--background))}
html.rw-layout .rw-pending-ico{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,#d97706 14%,var(--card));color:#b45309}
html.rw-layout .rw-pending-bar.is-robo .rw-pending-ico{background:color-mix(in srgb,#7c3aed 15%,var(--card));color:#6d28d9}
html.rw-layout.dark .rw-pending-bar.is-robo .rw-pending-ico{color:#c4b5fd}
html.rw-layout .rw-pending-tx{flex:1;min-width:0;display:grid;gap:2px}
html.rw-layout .rw-pending-tx b{font-size:var(--text-sm);font-weight:600}
html.rw-layout .rw-pending-tx span{font-size:var(--text-xs);color:var(--muted-foreground)}
html.rw-layout .rw-pending-btn{flex:none;height:38px;padding:0 16px;border-radius:10px;font-weight:600}
/* painel "Atendimento": coluna de grade com largura minima zero (origem com link longo estourava a coluna, 23/10) */
html.rw-layout .rw-about-body,html.rw-layout .rw-about-group{grid-template-columns:minmax(0,1fr)}
@media(max-width:480px){html.rw-layout .rw-pending-bar{gap:10px;padding:8px 12px}html.rw-layout .rw-pending-tx span{display:none}html.rw-layout .rw-st-pill{max-width:160px}}