/* ════════════════════════════════════════════════════════════════
       BRAND TOKENS — verde-floresta + dourado
    ════════════════════════════════════════════════════════════════ */
    :root {
      /* ── PALETA OFICIAL · Manual de Identidade v.1.0 ── */
      --forest:       #25492F;
      --forest-deep:  #143626;
      --gold:         #B8972A;
      --cream:        #F2EAD3;
      --paper:        #FBF6E8;

      /* aliases de retrocompatibilidade */
      --brand:        var(--forest);
      --brand-mid:    var(--forest-deep);
      --brand-light:  var(--forest);
      --brand-btn:    var(--forest);
      --brand-hover:  #256144;
      --gold-light:   #CDB255;
      --gold-dark:    #8A6D3B;
      --forest-mid:   var(--forest);   /* Verde Erva-Mate (nome canonico v3): corrige token referenciado e nao definido */
      --bg:           var(--cream);
      --bg-light:     var(--paper);
      --bg-card:      var(--cream);
      --border:       #D9D4C7;
      --text:         var(--forest-deep);
      --text-mid:     #4a4a42;
      --text-muted:   #7a7a72;
      --white:        #ffffff;
      --radius:       4px;            /* S4 — passo áureo base (mantido) */
      --radius-sm:    2px;
      --radius-lg:    9px;            /* S9 */
      --radius-pill:  999px;
      --paper-doc:    #F6F3EC;        /* superfície clara quente (substitui cinzas frios) */
      /* ── Semânticas de estado · Marca v4 — silêncio elegante, SEM vermelho de alarme ──
         agora/urgente→OURO(fill)+Araucária(texto) · falhou/perdeu→BRONZE · pago/recebido→ERVA-MATE */
      /* falha / perda / despesa / atraso grave / vencido → BRONZE (derivado ouro·araucária) */
      --danger:       #6E6B28;
      --danger-bg:    rgba(110,107,40,.10);
      --danger-border:rgba(110,107,40,.28);
      --state-negative-text:   var(--danger);
      --state-negative-bg:     var(--danger-bg);
      --state-negative-border: var(--danger-border);
      /* sucesso / pago / recebido / convertido / receita → ERVA-MATE */
      --success:      #25492F;
      --success-bg:   rgba(37,73,47,.10);
      --success-border:rgba(37,73,47,.22);
      --state-positive-text:   var(--success);
      --state-positive-bg:     var(--success-bg);
      --state-positive-border: var(--success-border);
      /* urgência / agora / hoje / prioridade alta / vence em breve → OURO no fill, ARAUCÁRIA no texto */
      --warning:      var(--gold);
      --warning-bg:   rgba(184,151,42,.12);
      --warning-border:rgba(184,151,42,.30);
      --state-attention-text:  #143626;
      --state-attention-fill:  var(--gold);
      --state-attention-bg:    rgba(184,151,42,.12);
      --state-attention-border:rgba(184,151,42,.30);
      --state-today-bg:        var(--gold);   /* chip SÓLIDO "hoje"/crítico */
      --state-today-text:      #143626;       /* texto Araucária sobre ouro sólido */
      /* info / neutro institucional → ARAUCÁRIA */
      --info:         var(--forest);
      --info-bg:      rgba(20,54,38,.06);
      --info-border:  rgba(20,54,38,.14);
      --state-info-text:   #143626;
      --state-info-bg:     var(--info-bg);
      --state-info-border: var(--info-border);
      /* ── Escala áurea S (√φ) e tipografia (entrelinha institucional φ) ── */
      --s-4:4px; --s-5:5px; --s-7:7px; --s-9:9px; --s-11:11px; --s-14:14px;
      --s-18:18px; --s-23:23px; --s-29:29px; --s-37:37px; --s-47:47px; --s-60:60px;
      --s-76:76px; --s-97:97px; --s-123:123px; --s-157:157px; --s-199:199px;
      --fs-cap:9px; --fs-sm:11px; --fs-base:14px; --fs-md:18px; --fs-lg:23px; --fs-xl:29px; --fs-2xl:37px;
      --lh-inst:1.618;
      /* gráficos (canvas lê por _cssv) */
      --chart-1:#143626; --chart-2:#B8972A; --chart-3:#6B8067; --chart-4:#DDCA8A; --chart-5:#6E6B28; --chart-6:#25492F; --chart-ink:#4a4a42; --chart-bg:#fff; --chart-font:'Inter',sans-serif;
      --funil-1:#143626; --funil-2:#2E482D; --funil-3:#495933; --funil-4:#636B3A; --funil-5:#7E7D41; --funil-6:#B3A04E; --funil-7:#CDB255; --funil-8:#6E6B28;
      /* cores secundárias (D2b): no host FSC valem o próprio hex */
      --x-0078d4:#0078D4; --x-031b14:#031B14; --x-038387:#038387; --x-06261d:#06261D; --x-071a13:#071A13; --x-081f18:#081F18; --x-08261d:#08261D; --x-0a2f24:#0A2F24; --x-0b2318:#0B2318; --x-0b382b:#0B382B; --x-0b3d20:#0B3D20; --x-0d0d1a:#0D0D1A; --x-0f1f17:#0F1F17; --x-0f2b1c:#0F2B1C; --x-107c10:#107C10; --x-122a20:#122A20; --x-128c4b:#128C4B; --x-143c28:#143C28; --x-155724:#155724; --x-15803d:#15803D; --x-166534:#166534; --x-184a32:#184A32; --x-198754:#198754; --x-1a6b3a:#1A6B3A; --x-1b3e2f:#1B3E2F; --x-1e9e6a:#1E9E6A; --x-1f5438:#1F5438; --x-1f6b3a:#1F6B3A; --x-22c55e:#22C55E; --x-2e482d:#2E482D; --x-2f7a45:#2F7A45; --x-495933:#495933; --x-636b3a:#636B3A; --x-6b5020:#6B5020; --x-7a3227:#7A3227; --x-7a5c2e:#7A5C2E; --x-7e7d41:#7E7D41; --x-7f0000:#7F0000; --x-856a00:#856A00; --x-8764b8:#8764B8; --x-8a5b00:#8A5B00; --x-8a5d00:#8A5D00; --x-8c3a2e:#8C3A2E; --x-94a3b8:#94A3B8; --x-988f48:#988F48; --x-9a3412:#9A3412; --x-9b1c1c:#9B1C1C; --x-9c3626:#9C3626; --x-a8c8a8:#A8C8A8; --x-b04a35:#B04A35; --x-b3a04e:#B3A04E; --x-b91c1c:#B91C1C; --x-bfdbfe:#BFDBFE; --x-c2410c:#C2410C; --x-c4a821:#C4A821; --x-c4a86a:#C4A86A; --x-c8a96b:#C8A96B; --x-c8a96e:#C8A96E; --x-c9a96b:#C9A96B; --x-c9a96e:#C9A96E; --x-ca5010:#CA5010; --x-d4a017:#D4A017; --x-d4edda:#D4EDDA; --x-d5d1c6:#D5D1C6; --x-d9d4c7:#D9D4C7; --x-dac190:#DAC190; --x-dc5050:#DC5050; --x-dcefe2:#DCEFE2; --x-dcf8c6:#DCF8C6; --x-ddca8a:#DDCA8A; --x-e0dbd0:#E0DBD0; --x-e3ded2:#E3DED2; --x-e4e0d8:#E4E0D8; --x-e8e0d0:#E8E0D0; --x-e8e2cf:#E8E2CF; --x-e8e5e0:#E8E5E0; --x-e8f0eb:#E8F0EB; --x-e8f5e8:#E8F5E8; --x-e8f5f0:#E8F5F0; --x-eae6dd:#EAE6DD; --x-ede8e0:#EDE8E0; --x-eef3f1:#EEF3F1; --x-ef4444:#EF4444; --x-efeadd:#EFEADD; --x-efeae2:#EFEAE2; --x-f0e8d8:#F0E8D8; --x-f0ede6:#F0EDE6; --x-f0fdf4:#F0FDF4; --x-f59e0b:#F59E0B; --x-f6dcd6:#F6DCD6; --x-f6ead0:#F6EAD0; --x-f6f3ec:#F6F3EC; --x-f6f3ed:#F6F3ED; --x-f7f5f2:#F7F5F2; --x-f8f6f0:#F8F6F0; --x-f8f7f4:#F8F7F4; --x-f97316:#F97316; --x-fed7aa:#FED7AA; --x-fee2e2:#FEE2E2; --x-fff7ed:#FFF7ED; --x-fff9ec:#FFF9EC;
      --sidebar-w:    248px;
      --sidebar-w-mini: 70px;
      --shadow-md:    0 4px 16px rgba(27,62,47,.08);
      --shadow-lg:    0 8px 24px rgba(27,62,47,.10);
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {
      font-family:var(--f-ui,'Inter',sans-serif);
      color: var(--text);
      overflow-x: clip; /* clip não cria scroll container, preserva position:sticky da sidebar */
    }
    h1,h2,h3,h4,.serif { font-family:var(--f-titulo,'Cormorant Garamond',serif); }
    a { text-decoration: none; color: inherit; }
    img { display: block; width: 100%; object-fit: cover; -webkit-user-drag: none; user-select: none; -webkit-user-select: none; }

    /* ── VIEW MANAGER ───────────────────────────────────────────── */
    .view { display: none; }
    .view.active { display: block; }
    #publicSite.active { display: block; }
    #loginView.active  { display: flex; }
    #appView.active    { display: flex; }

    /* ════════════════════════════════════════════════════════════════
       SITE PÚBLICO
    ════════════════════════════════════════════════════════════════ */
    #publicSite { background: var(--bg); }

    /* ── HEADER ─────────────────────────────────────────────────── */
    #site-header {
      position: fixed; top:0; left:0; right:0; z-index:1000;
      background: var(--forest-deep);
      padding: 0 5%;
      display: flex; align-items: center; justify-content: space-between;
      min-height: 72px;
      border-bottom: 1px solid rgba(201,169,110,.2);border-bottom: 1px solid color-mix(in srgb,var(--x-c9a96e) 20%,transparent);
      transition: background .3s;
    }
    .logo svg { height:270px; width:auto; }
    nav.pub-nav { display:flex; align-items:center; gap:2rem; }
    nav.pub-nav a {
      font-size:.85rem; font-weight:500; letter-spacing:.06em;
      color:rgba(255,255,255,.82); text-transform:uppercase; transition:color .2s;
    }
    nav.pub-nav a:hover { color:var(--gold); }
    .btn-pub {
      display:inline-block; padding:.6rem 1.4rem;
      border-radius:var(--radius); font-family:var(--f-ui,'Inter',sans-serif);
      font-size:.8rem; font-weight:600; letter-spacing:.06em;
      text-transform:uppercase; cursor:pointer; transition:background .2s,transform .15s; border:none;
    }
    .btn-primary-pub { background:var(--brand-btn); color:var(--white); }
    .btn-primary-pub:hover { background:var(--brand-hover); }
    .btn-login-pub {
      background:transparent; color:var(--gold);
      border:1.5px solid rgba(201,169,110,.5);border:1.5px solid color-mix(in srgb,var(--x-c9a96e) 50%,transparent);
    }
    .btn-login-pub:hover { border-color:var(--gold); background:rgba(201,169,110,.08);background:color-mix(in srgb,var(--x-c9a96e) 8%,transparent); }
    .btn-outline-pub { background:transparent; color:var(--white); border:1.5px solid var(--white); }
    .btn-outline-pub:hover { background:rgba(255,255,255,.12); }
    .hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; }
    .hamburger span { display:block; width:24px; height:2px; background:var(--white); border-radius:2px; }
    .mobile-menu {
      display:none; position:fixed; top:var(--header-h, 72px); left:0; right:0;
      background:var(--brand); padding:2rem 5%;
      flex-direction:column; gap:1.5rem; z-index:999;
      border-top:1px solid rgba(201,169,110,.2);border-top:1px solid color-mix(in srgb,var(--x-c9a96e) 20%,transparent);
    }
    .mobile-menu.open { display:flex; }
    .mobile-menu a { font-size:1.05rem; color:rgba(255,255,255,.85); font-weight:500; }

    /* ── HERO ───────────────────────────────────────────────────── */
    #hero {
      position:relative; min-height:100vh; display:flex; align-items:center;
      background:var(--forest-deep);
    }
    #hero::before { display:none; }
    .hero-content { position:relative; z-index:1; max-width:680px; padding:10rem 5% 6rem; }
    .hero-content h1 { font-size:clamp(2.4rem,5vw,3.8rem); color:var(--white); font-weight:600; margin-bottom:1.25rem; }
    .hero-content p  { font-size:1.05rem; color:rgba(255,255,255,.82); max-width:520px; margin-bottom:2rem; font-weight:300; line-height:1.7; }

    /* ── SECTIONS ───────────────────────────────────────────────── */
    .section { padding:6rem 5%; }
    .section-narrow { max-width:900px; margin:0 auto; text-align:center; }
    .section-title { font-size:clamp(1.9rem,3.5vw,2.8rem); color:var(--brand); margin-bottom:1rem; }
    .section-subtitle { font-size:.97rem; color:var(--text-mid); max-width:700px; margin:0 auto 3.5rem; line-height:1.8; }
    .gold-divider { width:48px; height:2px; background:var(--gold-fill,var(--gold)); margin:0 auto 1.5rem; }
    #atuacao { background:var(--white); }
    #areas   { background:var(--white); padding-top:0; }
    .areas-title { font-size:clamp(1.8rem,3vw,2.6rem); color:var(--brand); text-align:center; margin-bottom:3rem; }
    .areas-grid  { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; max-width:1200px; margin:0 auto; }
    .area-card { overflow:hidden; border-radius:2px; cursor:pointer; }
    .area-card img { height:280px; transition:transform .5s; }
    .area-card:hover img { transform:scale(1.04); }
    .area-card h3 { margin-top:1rem; font-size:1.3rem; color:var(--brand-btn); font-weight:600; border-bottom:1.5px solid var(--gold); padding-bottom:.5rem; transition:color .2s; }
    .area-card:hover h3 { color:var(--brand); }

    /* Visão Estratégica */
    #visao {
      position:relative;
      background:var(--forest);
      padding:7rem 5%; text-align:center;
    }
    #visao::before { display:none; }
    /* Parallax apenas em desktop com mouse (sem iOS Safari) */
    @media (hover: hover) and (pointer: fine) {
      /* #visao parallax removido — sem foto */
    }
    .visao-content { position:relative; z-index:1; max-width:780px; margin:0 auto; }
    #visao h2 { font-size:clamp(1.9rem,3.5vw,2.8rem); color:var(--white); font-style:italic; margin-bottom:2.5rem; }
    #visao p  { font-size:1.05rem; color:rgba(255,255,255,.88); font-style:italic; margin-bottom:1.4rem; line-height:1.9; }

    /* Atendimento */
    #atendimento { background:var(--bg-light); padding:0; }
    .atendimento-inner { display:grid; grid-template-columns:1fr 1fr; min-height:500px; }
    .atendimento-text { padding:5rem; display:flex; flex-direction:column; justify-content:center; }
    .atendimento-text h2 { font-size:clamp(1.8rem,3vw,2.6rem); color:var(--brand); margin-bottom:1.25rem; }
    .atendimento-text p  { font-size:.97rem; color:var(--text-mid); margin-bottom:2rem; line-height:1.85; }
    .atendimento-img { overflow:hidden; }
    .atendimento-img img { height:100%; min-height:420px; object-fit:cover; }

    /* Blog */
    #blog { background:var(--white); }
    .blog-header { text-align:left; margin-bottom:2.5rem; }
    .blog-header { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 1rem; margin-bottom: 3rem; max-width: 1200px; margin-left: auto; margin-right: auto; }
    .blog-header h2 { font-size:clamp(1.7rem,3vw,2.4rem); color:var(--brand); }
    .blog-carousel-wrapper { overflow:hidden; }
    .blog-track { display:flex; gap:1.75rem; transition:transform .4s ease; }
    .blog-card { flex:0 0 calc(33.333% - 1.2rem); background:var(--bg-light); border-radius:2px; overflow:hidden; display:flex; flex-direction:column; }
    .blog-card-img { height:200px; overflow:hidden; }
    .blog-card-img img { height:100%; transition:transform .4s; }
    .blog-card:hover .blog-card-img img { transform:scale(1.05); }
    .blog-card-body { padding:1.5rem; flex:1; display:flex; flex-direction:column; }
    .blog-meta { font-size:.75rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:.06em; margin-bottom:.6rem; }
    .blog-card h3 { font-size:1.15rem; color:var(--brand); margin-bottom:.75rem; line-height:1.35; }
    .blog-card p  { font-size:.88rem; color:var(--text-mid); flex:1; margin-bottom:1.25rem; }
    .btn-green-sm { display:inline-block; padding:.5rem 1.2rem; background:var(--brand-btn); color:var(--white); font-size:.78rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; border-radius:var(--radius); align-self:flex-start; transition:background .2s; }
    .btn-green-sm:hover { background:var(--brand-hover); }
    .btn-outline-dark { background:var(--bg-card); color:var(--brand); border:1px solid var(--border); box-shadow:0 4px 12px rgba(3,27,20,.03);box-shadow:0 4px 12px color-mix(in srgb,var(--x-031b14) 3%,transparent); transition:all .3s ease; }
    .btn-outline-dark:hover { border-color:var(--gold); box-shadow:0 2px 8px rgba(27,62,47,.06);box-shadow:0 2px 8px color-mix(in srgb,var(--x-1b3e2f) 6%,transparent); color:var(--brand); }
    .carousel-controls { display:flex; align-items:center; gap:1rem; margin-top:2rem; justify-content:center; }
    .carousel-btn { width:40px; height:40px; border-radius:50%; border:1.5px solid var(--brand-btn); background:transparent; color:var(--brand-btn); font-size:1.1rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s,color .2s; }
    .carousel-btn:hover { background:var(--brand-btn); color:var(--white); }
    .carousel-dots { display:flex; gap:.5rem; }
    .dot { width:8px; height:8px; border-radius:50%; background:#ccc; cursor:pointer; transition:background .2s; border:none; }
    .dot.active { background:var(--brand-btn); }

    /* CTA Banner */
    #cta-banner {
      position:relative;
      background:var(--forest-deep); padding:7rem 5%; text-align:center;
    }
    #cta-banner::before { display:none; }
    .cta-content { position:relative; z-index:1; }
    #cta-banner h2 { font-size:clamp(2rem,4vw,3.2rem); color:var(--white); font-weight:600; margin-bottom:1rem; }
    #cta-banner p  { font-size:1rem; color:rgba(255,255,255,.85); margin-bottom:2rem; }

    /* Footer */
    footer { background:var(--white); border-top:1px solid var(--x-e8e5e0); }
    .footer-nav { display:flex; justify-content:center; gap:2.5rem; padding:2.2rem 5%; border-bottom:1px solid var(--x-e8e5e0); flex-wrap:wrap; }
    .footer-nav a { font-size:.83rem; font-weight:500; letter-spacing:.05em; text-transform:uppercase; color:var(--text-muted); transition:color .2s; }
    .footer-nav a:hover, .footer-nav a.active { color:var(--brand-btn); }
    .footer-bottom { display:flex; align-items:center; justify-content:space-between; padding:1.5rem 5%; flex-wrap:wrap; gap:1rem; }
    .footer-info { font-size:.8rem; color:var(--text-muted); line-height:1.7; }
    .footer-links { display:flex; gap:2rem; }
    .footer-links a { font-size:.82rem; color:var(--brand-btn); font-weight:500; }

    /* WhatsApp */
    .whatsapp-float { position:fixed; bottom:1.8rem; right:1.8rem; z-index:999; background:#25D366; width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 16px rgba(0,0,0,.25); transition:transform .2s; }
    .whatsapp-float:hover { transform:scale(1.08); }
    .whatsapp-float svg { width:28px; height:28px; fill:#fff; }
    .back-top { position:fixed; bottom:1.8rem; right:5.8rem; z-index:999; background:var(--brand-btn); width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .3s; cursor:pointer; color:#fff; font-size:1rem; box-shadow:0 4px 12px rgba(0,0,0,.15); border:none; }
    .back-top.visible { opacity:1; pointer-events:auto; }

    /* Responsive público */
    @media(max-width:1024px) {
      .areas-grid { grid-template-columns:repeat(2,1fr); }
      .blog-card  { flex:0 0 calc(50% - .875rem); }
    }
    @media(max-width:768px) {
      nav.pub-nav .desktop-only { display:none; }
      .hamburger { display:flex; }
      .areas-grid { grid-template-columns:1fr; }
      .atendimento-inner { grid-template-columns:1fr; }
      .atendimento-img { display:none; }
      .atendimento-text { padding:3rem 1.5rem; }
      .blog-card { flex:0 0 85%; }
      .section { padding:4rem 5%; }
      .footer-bottom { flex-direction:column; align-items:flex-start; }
    }

    /* ════════════════════════════════════════════════════════════════
       BLOG POST VIEW
    ════════════════════════════════════════════════════════════════ */
    #blogPostView { background: var(--bg); min-height: 100vh; padding-bottom: 4rem; }
    .post-nav { position: sticky; top: 0; z-index: 100; background: rgba(247,245,242,.9);background: color-mix(in srgb,var(--x-f7f5f2) 90%,transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); padding: 1.5rem 5%; display: flex; justify-content: space-between; align-items: center; }
    .post-nav-back { background: none; border: none; color: var(--text-mid); font-weight: 500; font-size: .95rem; cursor: pointer; display: flex; align-items: center; gap: .5rem; transition: color .3s; }
    .post-nav-back:hover { color: var(--brand); }
    .post-nav-brand { font-family:var(--f-titulo,'Cormorant Garamond',serif); font-size: 1.5rem; font-weight: 600; color: var(--brand); }
    .post-article { max-width: 860px; margin: 5rem auto; padding: 0 5%; }
    .post-header-area { text-align: center; margin-bottom: 3.5rem; }
    .post-cat-badge { display: inline-block; padding: 0.4rem 1.2rem; border-radius:var(--radius); border: 1px solid rgba(200,169,107,.4);border: 1px solid color-mix(in srgb,var(--x-c8a96b) 40%,transparent); color: var(--gold-dark); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.1em; font-weight: 600; margin-bottom: 1.5rem; }
    .post-title { font-family:var(--f-titulo,'Cormorant Garamond',serif); font-size: clamp(2rem, 4.5vw, 3.5rem); color: var(--brand); font-weight: 600; line-height: 1.15; margin-bottom: 1.5rem; }
    .post-meta-info { font-size: 0.95rem; color: var(--text-muted); font-weight: 300; }
    .post-hero-image { width: 100%; height: auto; max-height: 500px; object-fit: cover; border-radius:var(--radius); box-shadow: 0 4px 12px rgba(27,62,47,.08);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-1b3e2f) 8%,transparent); margin-bottom: 4rem; }
    .post-body { font-size: 1.15rem; color: var(--text-mid); line-height: 1.85; font-weight: 300; }
    .post-body h2, .post-body h3 { color: var(--brand); font-family:var(--f-titulo,'Cormorant Garamond',serif); font-weight: 600; margin: 3rem 0 1.25rem; line-height: 1.3; }
    .post-body h2 { font-size: 2.2rem; }
    .post-body h3 { font-size: 1.8rem; }
    .post-body p { margin-bottom: 1.75rem; }
    .post-body ul, .post-body ol { margin-bottom: 1.75rem; padding-left: 1.5rem; }
    .post-body li { margin-bottom: 0.5rem; }
    .post-body a { color: var(--gold-dark); text-decoration: underline; text-underline-offset: 4px; }
    .post-body strong { font-weight: 600; color: var(--brand); }

    /* ════════════════════════════════════════════════════════════════
       LOGIN
    ════════════════════════════════════════════════════════════════ */
    #loginView {
      min-height:100vh; align-items:center; justify-content:center;
      background:var(--forest-deep);
    }
    .login-box {
      background:var(--cream); border-radius:var(--radius); padding:3rem 2.5rem; width:100%; max-width:420px;
      text-align:center; box-shadow:0 4px 16px rgba(27,62,47,.14);box-shadow:0 4px 16px color-mix(in srgb,var(--x-1b3e2f) 14%,transparent);
      position:relative;
    }
    .login-back {
      position:absolute; top:1.2rem; left:1.2rem;
      background:none; border:none; cursor:pointer;
      font-size:.82rem; color:var(--text-muted); display:flex; align-items:center; gap:.3rem; transition:color .2s;
    }
    .login-back:hover { color:var(--brand); }
    /* login-icon: regras base; estilo visual definido inline no HTML (monograma fsc) */
    .login-icon { display:flex; align-items:center; justify-content:center; margin:0 auto 1.25rem; }
    .login-box h1 { font-size:2rem; color:var(--brand); margin-bottom:.25rem; }
    .login-box .tagline { font-size:.75rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin-bottom:1rem; }
    .login-divider { width:48px; height:1px; background:var(--gold-fill,var(--gold)); margin:.75rem auto 1.75rem; opacity:.5; }
    .btn-ms { display:block; width:100%; padding:.85rem; border-radius:var(--radius); background:var(--brand); color:#fff; font-size:.9rem; font-weight:600; letter-spacing:.04em; cursor:pointer; border:none; transition:background .2s; margin-bottom:.75rem; }
    .btn-ms:hover { background:var(--brand-mid); }
    .btn-demo { display:block; width:100%; padding:.85rem; border-radius:var(--radius); background:var(--x-f0ede6); color:var(--text-mid); font-size:.9rem; font-weight:600; cursor:pointer; border:none; transition:background .2s; }
    .btn-demo:hover { background:var(--border); }
    .btn-visit-site { display:block; width:100%; padding:.85rem; border-radius:var(--radius); background:transparent; color:var(--forest-deep); font-size:.9rem; font-weight:500; letter-spacing:.06em; cursor:pointer; border:1px solid rgba(37,73,47,.45);border:1px solid color-mix(in srgb,var(--forest) 45%,transparent); transition:all .2s; }
    .btn-visit-site:hover { background:var(--forest-deep); color:var(--cream); border-color:var(--forest-deep); }
    .login-note { font-size:.72rem; color:var(--text-muted); margin-top:1.5rem; }
    #loginError { display:none; margin-top:1rem; color:var(--danger); font-size:.85rem; background:var(--danger-bg); border-radius:var(--radius); padding:.75rem 1rem; }


    /* ════════════════════════════════════════════════════════════════
       LOGIN ENTERPRISE v2 — single card, SSO primeiro, e-mail por
       divulgação progressiva. Superfícies sólidas, sem gradientes.
    ════════════════════════════════════════════════════════════════ */

    /* override: display correto para o loginView enterprise */
    #loginView.active {
      display: flex !important;
      min-height: 100vh;
      align-items: center;
      justify-content: center;
      background: var(--forest-deep);
      padding: 2rem 1.25rem;
    }
    /* neutralizar pseudoelementos anteriores */
    #loginView::before,
    #loginView::after { display: none !important; }

    /* wrapper centraliza o card */
    .lc-wrap {
      width: 100%;
      max-width: 400px;
      animation: lc-rise .45s cubic-bezier(.16,1,.3,1) both;
    }
    @keyframes lc-rise {
      from { opacity:0; transform:translateY(12px); }
      to   { opacity:1; transform:translateY(0); }
    }
    @media (prefers-reduced-motion: reduce) {
      .lc-wrap { animation: none; }
    }

    /* CARD — superfície sólida; régua dourada no topo = autoridade */
    /* ── Marca IVSTO por host (produto) · D1 — SÓ shell de login. Proibido verde+ouro FSC aqui (ver Marca IVSTO no vault). 4 tokens: Calcário #EAE6DD · Basalto #2B2A26 · Sombra #636057 · Rubrica #8C3A2E (1 gesto). ── */
    /* ── Marca IVSTO — remap dos tokens FSC no host do produto (D1 fase 1.1 · Apolo 20/07). Vira app+login p/ os 4 tokens; verde+ouro FSC some da camada-base. Rubrica = 1 papel (ação/alerta), nunca decoração. Estados: atenção/erro = Rubrica, ok = Sombra (IVSTO não tem verde+ouro). ── */
    /* ── Paleta B (gate visual do CEO, 20/09 · Apolo): mesma paleta, HIERARQUIA corrigida. O "triste" era
       superfície = fundo (card #EAE6DD sobre fundo #EAE6DD, sem relevo). Agora: fundo Calcário escurecido
       #E3DED2 · superfícies claras #F6F3ED · linhas #D5D1C6 · apagado #6b6659. Nenhum token novo de marca:
       são tons da própria Calcário/Sombra. Rubrica continua com 1 papel (ação/alerta). ── */
    html.ivsto-host {
      --forest:#2B2A26; --forest-deep:#2B2A26; --forest-mid:#2B2A26;
      --brand:#2B2A26; --brand-mid:#2B2A26; --brand-light:#2B2A26; --brand-btn:var(--x-8c3a2e); --brand-hover:var(--x-7a3227);
      --gold:#636057; --gold-light:#7d7a70; --gold-dark:#636057;
      --cream:var(--x-f6f3ed); --paper:var(--x-f6f3ed); --paper-doc:var(--x-f6f3ed); --ink:#2B2A26;
      --bg:var(--x-e3ded2); --bg-light:var(--x-eae6dd); --bg-card:var(--x-f6f3ed);
      --border:var(--x-d5d1c6); --text:#2B2A26; --text-mid:#4a463f; --text-muted:#6b6659;
      --danger:var(--x-8c3a2e); --danger-bg:rgba(140,58,46,.1);--danger-bg:color-mix(in srgb,var(--x-8c3a2e) 10%,transparent); --danger-border:rgba(140,58,46,.28);--danger-border:color-mix(in srgb,var(--x-8c3a2e) 28%,transparent);
      --success:#636057; --success-bg:rgba(99,96,87,.10); --success-border:rgba(99,96,87,.24);
      --warning:var(--x-8c3a2e); --warning-bg:rgba(140,58,46,.1);--warning-bg:color-mix(in srgb,var(--x-8c3a2e) 10%,transparent); --warning-border:rgba(140,58,46,.28);--warning-border:color-mix(in srgb,var(--x-8c3a2e) 28%,transparent);
      --state-attention-fill:var(--x-8c3a2e); --state-attention-text:#2B2A26; --state-attention-bg:rgba(140,58,46,.1);--state-attention-bg:color-mix(in srgb,var(--x-8c3a2e) 10%,transparent); --state-attention-border:rgba(140,58,46,.28);--state-attention-border:color-mix(in srgb,var(--x-8c3a2e) 28%,transparent);
      --state-today-bg:var(--x-8c3a2e); --state-today-text:var(--x-eae6dd);
      --info:#2B2A26; --info-bg:rgba(43,42,38,.06); --info-border:rgba(43,42,38,.14); --state-info-text:#2B2A26;
    }
    /* Texto do login em EB Garamond (tipo do produto) — corrige o Inter/FSC */
    .ivsto-host .lc-body, .ivsto-host .lc-context-desc, .ivsto-host .lc-btn-primary, .ivsto-host .lc-input, .ivsto-host .lc-email-toggle, .ivsto-host .lc-field-label, .ivsto-host .lc-link, .ivsto-host .lc-btn-sso { font-family:'EB Garamond', Georgia, serif; }
    .ivsto-host .lc-header { background: #2B2A26; border-bottom: 1px solid #636057; }
    .ivsto-host .lc-avatar { display: none; }
    .ivsto-host .lc-firm-name { font-family: 'Marcellus', serif; font-weight: 400; text-transform: none; color: #EAE6DD; letter-spacing: .30em; font-size: 1.55rem; }
    .ivsto-host .lc-product-sub { font-family: 'IBM Plex Mono', monospace; color: #9a968b; letter-spacing: .24em; }
    .ivsto-host .lc-trust { background: rgba(99,96,87,.06); border-bottom: 1px solid rgba(99,96,87,.12); }
    .ivsto-host .lc-trust-item { color: #636057; }
    .ivsto-host .lc-trust-item svg { fill: #636057; }
    .ivsto-host .lc-context-label { font-family: 'Marcellus', serif; color: #2B2A26; }
    .ivsto-host .lc-btn-primary { background: #8C3A2E; box-shadow: 0 2px 8px rgba(140,58,46,.20); }
    .ivsto-host .lc-btn-primary:hover { background: #7a3227; box-shadow: 0 4px 14px rgba(140,58,46,.28); }
    .ivsto-host .lc-link { color: #636057; }

    /* ── D1 fase 2 · interior autenticado por host — chrome IVSTO na sidebar + ações. Estados semânticos (sucesso/alerta/erro) NÃO mudam. FSC host intacto. ── */
    .ivsto-host .sidebar { background: #2B2A26; }
    .ivsto-host .sidebar-icon { background: rgba(234,230,221,.06); border-color: rgba(234,230,221,.20); color: #EAE6DD; font-family: 'Marcellus', serif; }
    .ivsto-host .sidebar-brand-name { font-family: 'Marcellus', serif; color: #EAE6DD; letter-spacing: .16em; font-weight: 400; }
    .ivsto-host .sidebar-brand-sub { font-family: 'IBM Plex Mono', monospace; color: #B9B4A6; letter-spacing: .22em; }
    .ivsto-host .btn-primary { background: #8C3A2E; }
    .ivsto-host .btn-primary:hover { background: #7a3227; }
    .ivsto-host .btn-crm-primary { background: #8C3A2E; }
    .ivsto-host .btn-crm-primary:hover { background: #7a3227; }
    /* nav ativo: 1 gesto Rubrica no filete lateral (tira o tint dourado FSC hardcoded) */
    .ivsto-host .nav-btn.active { background: rgba(140,58,46,.10); border-left-color: #8C3A2E; }

    .lc-card {
      width: 100%;
      background: var(--cream);
      border: 1px solid rgba(184,151,42,.22);border: 1px solid color-mix(in srgb,var(--gold) 22%,transparent);
      border-radius: 8px;
      overflow: hidden;
      box-shadow: 0 24px 64px rgba(0,0,0,0.42), 0 2px 6px rgba(0,0,0,0.20);
    }

    /* HEADER — branding em destaque, centralizado, com filete dourado */
    .lc-header {
      background: var(--forest-deep);
      padding: 1.85rem 2rem 1.55rem;
      text-align: center;
      border-bottom: 2px solid var(--gold);
    }
    .lc-brand-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: .8rem;
    }
    .lc-avatar {
      width: 48px;
      height: 48px;
      border-radius: 9px;
      background: rgba(184,151,42,.09);background: color-mix(in srgb,var(--gold) 9%,transparent);
      border: 1px solid rgba(184,151,42,.32);border: 1px solid color-mix(in srgb,var(--gold) 32%,transparent);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      font-family:var(--f-titulo,'Cormorant Garamond',serif);
      font-style: italic;
      font-weight: 400;
      font-size: 1.55rem;
      color: var(--gold);
      letter-spacing: -0.04em;
    }
    .lc-firm-name {
      font-family:var(--f-titulo,'Cinzel',serif);
      font-weight: 600;
      font-size: 1.05rem;
      letter-spacing: .11em;
      color: var(--gold);
      text-transform: uppercase;
      line-height: 1.15;
    }
    .lc-product-sub {
      font-family:var(--f-ui,'Inter',sans-serif);
      font-weight: 400;
      font-size: .67rem;
      color: rgba(242,234,211,.66);
      margin-top: .55rem;
      letter-spacing: .15em;
      text-transform: uppercase;
    }

    /* TRUST STRIP — indicadores de confiança elevados, logo abaixo do header */
    .lc-trust {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: .35rem 1.1rem;
      background: rgba(37,73,47,.055);background: color-mix(in srgb,var(--forest) 5.5%,transparent);
      border-bottom: 1px solid rgba(37,73,47,.09);border-bottom: 1px solid color-mix(in srgb,var(--forest) 9%,transparent);
      padding: .7rem 1.1rem;
    }
    .lc-trust-item {
      display: flex;
      align-items: center;
      gap: .35rem;
      font-size: .68rem;
      font-weight: 500;
      color: var(--forest);
      letter-spacing: .01em;
    }
    .lc-trust-item svg {
      width: 13px;
      height: 13px;
      flex-shrink: 0;
      fill: var(--success);
    }

    /* BODY — conteúdo principal */
    .lc-body {
      background: var(--cream);
      padding: 1.5rem 2rem 1.35rem;
    }

    /* framing copy */
    .lc-context {
      text-align: center;
      margin-bottom: 1.25rem;
    }
    .lc-context-label {
      font-family:var(--f-titulo,'Cinzel',serif);
      font-weight: 500;
      font-size: .66rem;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: var(--forest-deep);
      margin-bottom: .35rem;
    }
    .lc-context-desc {
      font-size: .8rem;
      line-height: 1.55;
      color: var(--text-mid);
    }

    /* botões SSO — peso visual equilibrado (nenhum provedor domina) */
    .lc-btn-sso {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: .6rem;
      width: 100%;
      padding: .8rem 1.25rem;
      border-radius: 6px;
      background: var(--white);
      color: var(--forest-deep);
      font-family:var(--f-ui,'Inter',sans-serif);
      font-size: .87rem;
      font-weight: 600;
      letter-spacing: .01em;
      cursor: pointer;
      border: 1px solid rgba(37,73,47,.22);border: 1px solid color-mix(in srgb,var(--forest) 22%,transparent);
      transition: background .18s, box-shadow .18s, border-color .18s, transform .05s;
    }
    .lc-btn-sso + .lc-btn-sso { margin-top: .6rem; }
    .lc-btn-sso:hover {
      background: #fcfbf6;
      border-color: rgba(37,73,47,.4);border-color: color-mix(in srgb,var(--forest) 40%,transparent);
      box-shadow: 0 2px 10px rgba(27,62,47,.1);box-shadow: 0 2px 10px color-mix(in srgb,var(--x-1b3e2f) 10%,transparent);
    }
    .lc-btn-sso:active { transform: translateY(1px); }
    .lc-btn-sso svg { width: 17px; height: 17px; flex-shrink: 0; }

    /* separador */
    .lc-sep {
      display: flex;
      align-items: center;
      gap: .75rem;
      margin: 1.15rem 0;
    }
    .lc-sep-line { flex: 1; height: 1px; background: rgba(37,73,47,.12);background: color-mix(in srgb,var(--forest) 12%,transparent); }
    .lc-sep-text {
      font-size: .68rem;
      font-weight: 500;
      color: var(--text-muted);
      letter-spacing: .1em;
      text-transform: uppercase;
    }

    /* divulgação progressiva — gatilho do login por e-mail (terciário) */
    .lc-email-toggle {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: .45rem;
      width: 100%;
      padding: .6rem 1rem;
      border-radius: 6px;
      border: 1px dashed rgba(37,73,47,.28);border: 1px dashed color-mix(in srgb,var(--forest) 28%,transparent);
      background: transparent;
      color: var(--forest-deep);
      font-family:var(--f-ui,'Inter',sans-serif);
      font-size: .82rem;
      font-weight: 500;
      cursor: pointer;
      transition: background .18s, border-color .18s;
    }
    .lc-email-toggle:hover {
      background: rgba(37,73,47,.05);background: color-mix(in srgb,var(--forest) 5%,transparent);
      border-color: rgba(37,73,47,.42);border-color: color-mix(in srgb,var(--forest) 42%,transparent);
    }
    .lc-email-toggle svg { width: 15px; height: 15px; flex-shrink: 0; fill: currentColor; }

    /* painel de e-mail/senha — oculto por padrão (progressive disclosure) */
    .lc-email-panel {
      display: none;
      flex-direction: column;
      gap: .7rem;
      text-align: left;
      animation: lc-fade .25s ease both;
    }
    .lc-email-panel.open { display: flex; }
    @keyframes lc-fade { from { opacity:0; } to { opacity:1; } }
    @media (prefers-reduced-motion: reduce) { .lc-email-panel { animation: none; } }

    .lc-field-label {
      font-size: .68rem;
      font-weight: 600;
      letter-spacing: .04em;
      text-transform: uppercase;
      color: var(--text-mid);
      display: block;
      margin-bottom: .3rem;
    }
    .lc-input {
      width: 100%;
      padding: .68rem .8rem;
      border: 1px solid rgba(37,73,47,.22);border: 1px solid color-mix(in srgb,var(--forest) 22%,transparent);
      border-radius: 6px;
      background: var(--white);
      color: var(--text);
      font-family:var(--f-ui,'Inter',sans-serif);
      font-size: .9rem;
      transition: border-color .15s, box-shadow .15s;
    }
    .lc-input::placeholder { color: #a8a89e; }
    .lc-input:hover { border-color: rgba(37,73,47,.38);border-color: color-mix(in srgb,var(--forest) 38%,transparent); }

    /* ação primária (dentro do painel de e-mail) */
    .lc-btn-primary {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: .5rem;
      width: 100%;
      padding: .8rem 1.25rem;
      border-radius: 6px;
      background: var(--forest);
      color: #fff;
      font-family:var(--f-ui,'Inter',sans-serif);
      font-size: .88rem;
      font-weight: 600;
      letter-spacing: .02em;
      cursor: pointer;
      border: none;
      transition: background .18s, box-shadow .18s, transform .05s;
      box-shadow: 0 2px 8px rgba(20,54,38,.2);box-shadow: 0 2px 8px color-mix(in srgb,var(--forest-deep) 20%,transparent);
    }
    .lc-btn-primary:hover { background: var(--brand-hover); box-shadow: 0 4px 14px rgba(20,54,38,.28);box-shadow: 0 4px 14px color-mix(in srgb,var(--forest-deep) 28%,transparent); }
    .lc-btn-primary:active { transform: translateY(1px); }

    .lc-link {
      font-size: .77rem;
      color: var(--gold-dark);
      text-align: center;
      text-decoration: none;
      font-weight: 500;
    }
    .lc-link:hover { text-decoration: underline; text-underline-offset: 3px; }

    /* link discreto p/ voltar ao site */
    .lc-back {
      display: block;
      text-align: center;
      margin-top: 1.1rem;
      font-size: .78rem;
      color: var(--text-mid);
      text-decoration: none;
      transition: color .15s;
    }
    .lc-back:hover { color: var(--forest); }

    /* botão secundário (retrocompat — usado em outras telas) */
    .lc-btn-secondary {
      display: block;
      width: 100%;
      padding: .78rem 1.5rem;
      border-radius: 6px;
      border: 1px solid rgba(37,73,47,.22);border: 1px solid color-mix(in srgb,var(--forest) 22%,transparent);
      background: transparent;
      color: var(--forest-deep);
      font-family:var(--f-ui,'Inter',sans-serif);
      font-size: .84rem;
      font-weight: 500;
      text-align: center;
      cursor: pointer;
      transition: background .18s, border-color .18s;
      text-decoration: none;
    }
    .lc-btn-secondary:hover { background: rgba(37,73,47,.05);background: color-mix(in srgb,var(--forest) 5%,transparent); border-color: rgba(37,73,47,.4);border-color: color-mix(in srgb,var(--forest) 40%,transparent); }

    /* FOOTER — contraste AA, legível */
    .lc-footer {
      background: rgba(37,73,47,.05);background: color-mix(in srgb,var(--forest) 5%,transparent);
      border-top: 1px solid rgba(37,73,47,.1);border-top: 1px solid color-mix(in srgb,var(--forest) 10%,transparent);
      padding: .85rem 2rem;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: .55rem;
      flex-wrap: wrap;
      font-size: .7rem;
      color: var(--text-mid);
      letter-spacing: .02em;
    }
    .lc-footer a {
      color: var(--forest);
      font-weight: 500;
      text-decoration: none;
      transition: color .15s;
    }
    .lc-footer a:hover { color: var(--forest-deep); text-decoration: underline; text-underline-offset: 2px; }
    .lc-footer .lc-foot-sep { color: rgba(37,73,47,.3);color: color-mix(in srgb,var(--forest) 30%,transparent); }

    /* ESTADOS DE FOCO — acessibilidade WCAG AA (visíveis no teclado) */
    .lc-btn-sso:focus-visible,
    .lc-btn-primary:focus-visible,
    .lc-btn-secondary:focus-visible,
    .lc-email-toggle:focus-visible,
    .lc-link:focus-visible,
    .lc-back:focus-visible,
    .lc-footer a:focus-visible {
      outline: 2px solid var(--gold-dark);
      outline-offset: 2px;
      border-radius: 4px;
    }
    .lc-input:focus-visible {
      outline: none;
      border-color: var(--forest);
      box-shadow: 0 0 0 3px rgba(138,109,59,.30);
    }


    /* ════════════════════════════════════════════════════════════════
       CRM APP
    ════════════════════════════════════════════════════════════════ */
    #appView { display:none; min-height:100vh; background:var(--bg); }

    /* Sidebar */
    .sidebar { width:var(--sidebar-w); background: var(--forest-deep); border-right: 1px solid rgba(255,255,255,0.05); display:flex; flex-direction:column; color:#fff; z-index:40; box-shadow: 4px 0 24px rgba(3,27,20,.15);box-shadow: 4px 0 24px color-mix(in srgb,var(--x-031b14) 15%,transparent); }
    .sidebar-logo { padding:1.5rem; border-bottom:1px solid rgba(255,255,255,0.05); display:flex; align-items:center; gap:.75rem; }
    .sidebar-icon {
      width:40px; height:40px; border-radius:6px;
      background:rgba(184,151,42,.06);background:color-mix(in srgb,var(--gold) 6%,transparent); border:1px solid rgba(184,151,42,.22);border:1px solid color-mix(in srgb,var(--gold) 22%,transparent);
      display:flex; align-items:center; justify-content:center;
      flex-shrink:0; box-shadow:0 4px 12px rgba(0,0,0,0.2);
      font-family:var(--f-titulo,'Cormorant Garamond',serif); font-style:italic; font-weight:400;
      font-size:26px; color:var(--gold); letter-spacing:-0.04em; line-height:1;
      text-rendering:optimizeLegibility;
    }
    .sidebar-brand-name { font-family:var(--f-titulo,'Cinzel',serif); font-size:.62rem; font-weight:500; color:var(--gold); letter-spacing:.26em; text-transform:uppercase; line-height:1.45; }
    .sidebar-brand-sub  { font-family:var(--f-titulo,'Cinzel',serif); font-size:.52rem; letter-spacing:.38em; text-transform:uppercase; color:var(--gold-light); font-weight:400; opacity:.85; margin-top:2px; }
    .sidebar-footer { margin-top:auto; padding:.75rem 1.5rem; border-top:1px solid rgba(255,255,255,0.05); }
    .sidebar-version { font-family:var(--f-titulo,'Cinzel',serif); font-size:.55rem; letter-spacing:.2em; color:rgba(255,255,255,0.35); text-transform:uppercase; }
    #appView.sidebar-collapsed .sidebar-footer { display:none; }
    html.ivsto-host #appView:not(.sidebar-collapsed) .sidebar-icon { display:none; }
    html.ivsto-host .sidebar-brand-block > div:first-child { display:none; }
    .sidebar-nav { flex:1; padding:1.25rem .75rem; overflow-y:auto; overflow-x:hidden; }
    .sidebar-nav-label { font-size:.6rem; padding:0 1rem; text-transform:uppercase; letter-spacing:.15em; color:rgba(255,255,255,0.4); margin-bottom:.75rem; font-weight: 600; }
    .nav-btn { display:flex; align-items:center; gap:.75rem; width:100%; padding:.75rem 1rem; border-radius:var(--radius); font-size:.875rem; font-weight:500; color:rgba(255,255,255,.7); background:none; border:none; cursor:pointer; transition:all .3s ease; text-align:left; margin-bottom: .25rem; }
    .nav-btn:hover { background:rgba(196,168,106,.08);background:color-mix(in srgb,var(--x-c4a86a) 8%,transparent); color:#fff; }
    .nav-btn.active { background:rgba(196,168,106,.1);background:color-mix(in srgb,var(--x-c4a86a) 10%,transparent); border-left:3px solid var(--gold); padding-left:calc(1rem - 3px); color:#fff; font-weight: 600; }
    .nav-btn .nav-count { margin-left:auto; font-size:.7rem; padding:.1rem .5rem; border-radius:var(--radius); background:rgba(200,169,107,.15);background:color-mix(in srgb,var(--x-c8a96b) 15%,transparent); border:1px solid rgba(200,169,107,.3);border:1px solid color-mix(in srgb,var(--x-c8a96b) 30%,transparent); color:var(--gold); font-weight:600; }
    .sidebar-divider { height:1px; background:rgba(255,255,255,0.05); margin:.5rem 1.5rem; }
    .sidebar-user { padding:1.25rem 1rem; }
    .sidebar-user-row { display:flex; align-items:center; gap:.75rem; margin-bottom:.75rem; }
    .user-avatar { width:36px; height:36px; border-radius:50%; background:rgba(196,168,106,.12);background:color-mix(in srgb,var(--x-c4a86a) 12%,transparent); border:1px solid rgba(200,169,107,.4);border:1px solid color-mix(in srgb,var(--x-c8a96b) 40%,transparent); display:flex; align-items:center; justify-content:center; font-size:.9rem; font-weight:600; color:var(--gold); flex-shrink:0; }
    .user-name  { font-size:.85rem; font-weight:500; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .user-email { font-size:.7rem; color:rgba(255,255,255,.45); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .btn-logout { background:none; border:none; cursor:pointer; font-size:var(--fs-sm); color:rgba(255,255,255,.4); transition:all .2s; padding:var(--s-11) var(--s-14); font-weight: 500; width:100%; display:flex; align-items:center; justify-content:flex-start; white-space:nowrap; overflow:hidden; border-top: 1px solid rgba(255,255,255,0.08); margin-top:var(--s-7); border-radius:var(--radius); min-height:var(--s-47); }
    .btn-logout:hover { color:var(--gold); background: rgba(255,255,255,0.05); }

    /* ── Seletor de organização (multi-tenant) ── */
    .org-switcher { margin-bottom:.85rem; }
    .org-switcher-label { display:block; font-size:.58rem; text-transform:uppercase; letter-spacing:.16em; color:rgba(255,255,255,.4); font-weight:600; margin-bottom:.35rem; padding-left:.1rem; }
    .org-select-wrap { position:relative; }
    .org-select-wrap::after { content:''; position:absolute; right:.7rem; top:50%; width:7px; height:7px; border-right:1.5px solid var(--gold); border-bottom:1.5px solid var(--gold); transform:translateY(-65%) rotate(45deg); pointer-events:none; opacity:.8; }
    #orgSelect {
      width:100%; appearance:none; -webkit-appearance:none;
      background:rgba(255,255,255,.04); color:#fff;
      border:1px solid rgba(200,169,107,.4);border:1px solid color-mix(in srgb,var(--x-c8a96b) 40%,transparent); border-radius:var(--radius);
      padding:.5rem 1.8rem .5rem .7rem; font-size:.8rem; font-weight:500;
      cursor:pointer; transition:border-color .2s, background .2s; min-height:40px;
    }
    #orgSelect:hover { border-color:var(--gold); background:rgba(255,255,255,.06); }
    #orgSelect:focus { outline:none; border-color:var(--gold); box-shadow:0 0 0 2px rgba(196,168,106,.2);box-shadow:0 0 0 2px color-mix(in srgb,var(--x-c4a86a) 20%,transparent); }
    #orgSelect:disabled { opacity:.55; cursor:wait; }
    #orgSelect option { background:var(--forest-deep); color:#fff; }
    /* No modo colapsado, esconde o seletor (sem espaço para o nome da org) */
    #appView.sidebar-collapsed #orgSwitcher { display:none !important; }

    /* ── LAYOUT ESTRUTURA ────────────────────────────────────── */
    #appView {
      display: none;
      min-height: 100vh;
      background: var(--bg);
    }

    #appView.active {
      display: grid;
      grid-template-columns: var(--sidebar-w) 1fr;
      grid-template-rows: auto 1fr;
      min-height: 100vh;
      gap: 0;
      transition: grid-template-columns 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      /* Garante que a coluna da sidebar sempre fique verde mesmo em páginas longas */
      background: linear-gradient(to right, var(--forest-deep) var(--sidebar-w), var(--bg) var(--sidebar-w));
    }

    @media (min-width: 1025px) {
    #appView.sidebar-collapsed.active {
      grid-template-columns: var(--sidebar-w-mini) 1fr;
      background: linear-gradient(to right, var(--forest-deep) var(--sidebar-w-mini), var(--bg) var(--sidebar-w-mini));
    }
    }

    /* Sidebar ocupa coluna 1, linhas 1-2 (top-bottom) */
    .sidebar {
      grid-column: 1;
      grid-row: 1 / -1;
      overflow-y: auto;
      overflow-x: clip; /* clip não cria scroll container, preserva position:sticky da sidebar */
      max-height: 100vh;
      position: sticky;
      top: 0;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      width: var(--sidebar-w);
    }

    #appView.sidebar-collapsed .sidebar {
      width: var(--sidebar-w-mini);
      min-width: var(--sidebar-w-mini);
    }

    #appView.sidebar-collapsed .sidebar-nav-label,
    #appView.sidebar-collapsed .sidebar-brand-sub,
    #appView.sidebar-collapsed .nav-btn span:not(.nav-count),
    #appView.sidebar-collapsed .nav-btn .nav-count,
    #appView.sidebar-collapsed .user-name,
    #appView.sidebar-collapsed .user-email,
    #appView.sidebar-collapsed .btn-logout span,
    #appView.sidebar-collapsed .sidebar-divider,
    #appView.sidebar-collapsed .sidebar-brand-name,
    #appView.sidebar-collapsed .sidebar-brand-block,
    #appView.sidebar-collapsed #sidebarPreviewBtn {
      display: none !important; /* inline styles (JS) não sobrescrevem */
    }

    #appView.sidebar-collapsed .sidebar-logo {
      justify-content: center;
      padding: 1.25rem 0.5rem;
    }

    #appView.sidebar-collapsed .sidebar-nav {
      padding: 0.75rem 0.5rem;
    }

    #appView.sidebar-collapsed .nav-btn {
      justify-content: center;
      font-size: 1.2rem;
      padding: 0.75rem 0.5rem;
      margin-bottom: 0.5rem;
    }

    #appView.sidebar-collapsed .sidebar-user {
      padding: 0.75rem 0.5rem;
      text-align: center;
    }

    #appView.sidebar-collapsed .user-avatar {
      margin: 0 auto 0.5rem;
    }

    /* Tooltip para items da sidebar colapsada */
    #appView.sidebar-collapsed .nav-btn {
      position: relative;
    }

    /* overflow-x: visible em modo colapsado permite tooltips escaparem da sidebar */
    #appView.sidebar-collapsed .sidebar { overflow-x: visible; }

    /* Ícones fixos da barra (Alertas + Configurações) — rodapé da sidebar */
    .sidebar-fixed-actions { display:flex; gap:8px; padding:10px 4px 4px; }
    .sidebar-fixed-btn { position:relative; flex:1; display:flex; align-items:center; justify-content:center; gap:7px; padding:9px 8px; border-radius:var(--radius); border:1px solid rgba(218,193,144,.28);border:1px solid color-mix(in srgb,var(--x-dac190) 28%,transparent); background:rgba(255,255,255,0.05); color:rgba(242,234,211,0.9); font-size:.74rem; font-weight:600; font-family:inherit; cursor:pointer; transition:all .18s; }
    .sidebar-fixed-btn:hover { background:rgba(218,193,144,.16);background:color-mix(in srgb,var(--x-dac190) 16%,transparent); color:#fff; border-color:rgba(218,193,144,.5);border-color:color-mix(in srgb,var(--x-dac190) 50%,transparent); }
    .sidebar-fixed-btn svg { width:16px; height:16px; flex-shrink:0; }
    .sidebar-fixed-badge { position:absolute; top:-5px; right:-5px; background:var(--gold-dark,var(--gold)); color:#fff; border-radius:9px; padding:0 5px; font-size:.62rem; font-weight:700; line-height:1.5; }
    #appView.sidebar-collapsed .sidebar-fixed-actions { flex-direction:column; gap:6px; }
    #appView.sidebar-collapsed .sfb-label { display:none; }

    #appView.sidebar-collapsed .nav-btn:hover::after {
      content: attr(aria-label);
      position: absolute;
      left: 100%;
      top: 50%;
      transform: translateY(-50%);
      margin-left: 10px;
      background: var(--forest-deep);
      color: #fff;
      padding: 0.4rem 0.75rem;
      border-radius: var(--radius);
      font-size: 0.78rem;
      font-weight: 500;
      white-space: nowrap;
      pointer-events: none;
      z-index: 100;
      box-shadow: 0 4px 12px rgba(3,27,20,.25);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-031b14) 25%,transparent);
    }

    /* Header e content na coluna 2 */
    .crm-header {
      grid-column: 2;
      grid-row: 1;
      background: var(--cream);
      min-height: 72px;
      padding: var(--s-23) var(--s-29); /* Apolo 27/06: respiro aureo - era 1.2rem 1.5rem (19,2/24, fora da escala S) -> 23/29 (S-23 vert, S-29 horiz) */
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: var(--s-23); /* Apolo 27/06: 24->23 (S-23), gap apos a saudacao na grade aurea */
      border-bottom: 1px solid rgba(3,27,20,.04);
      box-shadow: 0 4px 24px rgba(3,27,20,.02);box-shadow: 0 4px 24px color-mix(in srgb,var(--x-031b14) 2%,transparent);
      position: sticky;
      top: 0;
      z-index: 20;
    }

    .crm-header-title { display: flex; flex-direction: column; gap: 0.1rem; }
    .crm-header h2 {
      font-family:var(--f-titulo,'Cormorant Garamond',serif);
      font-size: clamp(1.1rem, 2vw, 1.4rem);
      font-weight: 600;
      color: var(--brand);
      margin: 0;
    }
    .crm-header-sub {
      font-size: 0.75rem;
      color: var(--text-muted);
      font-weight: 400;
      margin: 0;
    }

    .crm-content {
      grid-column: 2;
      grid-row: 2;
      overflow-y: auto;
      padding: clamp(1rem, 3vw, 2rem);
      max-width: 1600px;
      margin: 0 auto;
      width: 100%;
      background: var(--bg);
    }

    /* Botão sidebar toggle e ações */
    .sidebar-toggle {
      display: inline-flex;
      min-width: 48px;
      width: 48px;
      height: 48px;
      border-radius:var(--radius);
      border: 1px solid rgba(3,27,20,.08);border: 1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent);
      background: var(--bg-card);
      color: var(--brand);
      font-size: 1.1rem;
      cursor: pointer;
      transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      padding: 0;
    }

    .sidebar-toggle:hover {
      background: var(--brand);
      color: #fff;
      transform: translateY(-2px);
      box-shadow: 0 4px 12px rgba(3,27,20,.15);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-031b14) 15%,transparent);
    }

    .crm-header-actions {
      display: flex;
      align-items: center;
      gap: 0.75rem;
    }

    /* Backdrop para fechar sidebar em mobile */
    .sidebar-backdrop {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.4);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity 0.3s ease, visibility 0.3s ease;
      z-index: 35;
    }

    .sidebar-backdrop.visible {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    /* ────────────────────── TABLET (1024px) ────────────────────── */
    @media (max-width: 1024px) {
      /* Usar !important para vencer a regra desktop .sidebar-collapsed.active (F-01 fix) */
      #appView,
      #appView.sidebar-collapsed,
      #appView.sidebar-collapsed.active {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto 1fr;
      }

      .sidebar {
        grid-column: 1;
        grid-row: 1 / 3;
        position: fixed;
        left: 0;
        top: 0;
        height: 100vh;
        width: min(100%, 320px);
        max-width: 85vw;
        z-index: 40;
        transform: translateX(-100%);
        background: var(--forest-deep);
        box-shadow: 4px 0 24px rgba(3,27,20,.2);box-shadow: 4px 0 24px color-mix(in srgb,var(--x-031b14) 20%,transparent);
      }

      #appView.sidebar-open .sidebar {
        transform: translateX(0);
      }

      /* Em mobile colapsado: sidebar completamente fora da tela (F-01 fix) */
      #appView.sidebar-collapsed .sidebar {
        width: min(85vw, 300px);
        grid-column: auto;
        grid-row: auto;
        position: fixed;
        transform: translateX(-100%); /* sempre off-screen quando colapsado em mobile */
      }

      .crm-header {
        grid-column: 1;
        grid-row: 1;
        min-height: 64px;
        padding: 1.2rem 1rem;
        gap: 1rem;
      }

      .sidebar-toggle {
        display: inline-flex;
      }

      .crm-header h2 {
        font-size: clamp(1rem, 2vw, 1.2rem);
      }

      .crm-content {
        grid-column: 1 !important;
        grid-row: 3 !important;
        padding: 1.25rem;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
      }

      .crm-header {
        grid-column: 1 !important;
      }
    }

    /* ────────────────────── MOBILE (768px) ────────────────────── */
    @media (max-width: 768px) {
      /* Garantir full-width em mobile estreito — overriding .active (F-01 fix) */
      #appView,
      #appView.sidebar-collapsed,
      #appView.sidebar-collapsed.active {
        grid-template-columns: 1fr !important;
      }

      .crm-header {
        grid-template-columns: auto 1fr auto;
        min-height: 60px;
        padding: 1rem 0.9rem;
        gap: 0.9rem;
      }

      .crm-header h2 {
        font-size: 1rem;
        line-height: 1.2;
      }

      .crm-header-sub {
        display: none;
      }

      .crm-content {
        padding: 1rem 0.75rem;
      }

      .sidebar {
        /* Em mobile abre como overlay com largura razoável — herda do 1024px (min(100%,320px)) */
        width: min(85vw, 300px);
        max-width: 300px;
      }

      .sidebar-nav .nav-btn {
        font-size: 0.9rem;
        padding: 0.7rem 1rem;
      }
    }

    /* ────────────────────── SMALL MOBILE (480px) ────────────────────── */
    @media (max-width: 480px) {
      .crm-header {
        min-height: 56px;
        padding: 0.9rem 0.7rem;
        gap: 0.6rem;
      }

      .crm-header h2 {
        font-size: 0.95rem;
        font-weight:600;
      }

      .crm-content {
        padding: 0.75rem 0.5rem;
      }

      .sidebar-logo {
        padding: 1rem 0.8rem;
      }

      .sidebar-user {
        padding: 0.9rem 0.8rem;
      }
    }


    /* ────────────────────── WHATSAPP MOBILE (F-02) ─────────────────── */
    .wa-back-btn {
      display: none;
      align-items: center;
      gap: 6px;
      background: none;
      border: none;
      cursor: pointer;
      color: var(--brand);
      font-size: 13px;
      font-weight: 600;
      padding: 4px 8px 4px 0;
      margin-right: 8px;
      border-radius:var(--radius);
      transition: background .15s;
      flex-shrink: 0;
    }
    .wa-back-btn:hover { background: rgba(3,27,20,.05);background: color-mix(in srgb,var(--x-031b14) 5%,transparent); }
    .wa-back-btn svg { width: 18px; height: 18px; }

    @media (max-width: 768px) {
      .wa-layout {
        flex-direction: column;
        /* item 11 — antes 120px deixava ~28px de espaço morto abaixo do campo;
           o chrome real (header ~60px + padding do content ~32px) é ~92px */
        height: calc(100dvh - 92px);
        border-radius:var(--radius);
      }
      .wa-sidebar {
        width: 100%;
        max-width: 100%;
        border-right: none;
        border-bottom: 1px solid var(--border);
        flex-shrink: 0;
        max-height: 100%;
      }
      .wa-sidebar.wa-panel-hidden { display: none !important; }
      .wa-main {
        display: none;
        flex: 1;
        min-height: 0;
      }
      .wa-main.wa-panel-active { display: flex !important; }
      .wa-context { display: none !important; }
      .wa-back-btn { display: inline-flex; }
    }


    /* ────────────────────── TABELAS RESPONSIVE (F-03) ─────────────────── */
    .table-scroll-wrap {
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      /* Fade visual à direita indicando scroll */
      background:
        linear-gradient(to right, white 30%, rgba(255,255,255,0)) left,
        linear-gradient(to left, white 30%, rgba(255,255,255,0)) right,
        radial-gradient(farthest-side at 0 50%, rgba(3,27,20,.08), rgba(0,0,0,0)) left,
        radial-gradient(farthest-side at 100% 50%, rgba(3,27,20,.08), rgba(0,0,0,0)) right;
      background-repeat: no-repeat;
      background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
      background-attachment: local, local, scroll, scroll;
    }

    @media (max-width: 768px) {
      /* iOS Safari dá zoom forçado ao focar inputs com font-size < 16px (item 5) */
      input, select, textarea {
        font-size: 16px !important;
      }
      .col-hide-mobile { display: none !important; }
      .col-acoes {
        position: sticky;
        right: 0;
        background: white;
        z-index: 1;
        box-shadow: -2px 0 6px rgba(0,0,0,.04);
      }
      .table-scroll-wrap table {
        min-width: 480px;
      }
      /* Cards que seguram uma tabela passam a rolar horizontalmente no mobile
         em vez de clipar (item 2/3). O !important vence o style="overflow:hidden"
         inline desses cards (fin-tables, Publicações, transações, regras…). */
      .card:has(> table) {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
      }
      /* Touch targets mínimos para btn-action (F-09 antecipado) */
      .btn-icon {
        min-width: 40px;
        min-height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
      }
    }


    /* ── Andamentos Timeline (Pulso do Escritório) ──────────────────── */
.andamentos-timeline { display:flex;flex-direction:column;gap:0; }
.and-item { display:flex;gap:.75rem;padding:.65rem 0;border-bottom:1px solid var(--border);cursor:pointer;border-radius:var(--radius);transition:background .15s; }
.and-item:hover { background:rgba(20,60,40,.04);background:color-mix(in srgb,var(--x-143c28) 4%,transparent); }
.and-item:last-child { border-bottom:none; }
.and-dot { flex-shrink:0;width:1.6rem;display:flex;align-items:flex-start;justify-content:center;padding-top:.15rem; }
.and-body { flex:1;min-width:0; }
.and-header { display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;margin-bottom:.2rem;font-size:.875rem; }
.and-conteudo { font-size:.8rem;color:var(--text-secondary);line-height:1.45;margin-bottom:.25rem;white-space:pre-wrap;word-break:break-word; }
.and-meta { font-size:.72rem;color:var(--text-muted);display:flex;align-items:center;gap:.3rem;flex-wrap:wrap; }
.and-sep { opacity:.4; }
.and-area-tag { font-size:.68rem;background:rgba(20,60,40,.07);background:color-mix(in srgb,var(--x-143c28) 7%,transparent);color:var(--brand);padding:1px 7px;border-radius:var(--radius);font-weight:600;letter-spacing:.01em; }

/* ────────────────────── SKELETON LOADER KPI FINANCEIRO (F-05) ──── */
    @keyframes shimmer {
      0%   { background-position: 200% 0; }
      100% { background-position: -200% 0; }
    }
    .fin-kpi.loading .fin-kpi-val {
      background: linear-gradient(90deg, var(--x-e8e0d0) 25%, var(--x-f0e8d8) 50%, var(--x-e8e0d0) 75%);
      background-size: 200% 100%;
      animation: shimmer 1.5s infinite;
      border-radius: 4px;
      color: transparent !important;
      min-width: 100px;
      min-height: 28px;
      display: inline-block;
      user-select: none;
    }
    .fin-kpi.loading .fin-kpi-sub {
      opacity: 0;
    }
    /* Skeleton reutilizavel (compartilha @keyframes shimmer acima) */
    .skel-line {
      display: block;
      background: linear-gradient(90deg, var(--x-e8e0d0) 25%, var(--x-f0e8d8) 50%, var(--x-e8e0d0) 75%);
      background-size: 200% 100%;
      animation: shimmer 1.5s infinite;
      border-radius: 4px;
    }

    /* ────────────────────── SIDEBAR MICRO-LABELS (F-06) ────────────── */
    .nav-micro-label {
      display: none;
      font-size: 9px;
      text-align: center;
      opacity: 0.7;
      margin-top: 2px;
      line-height: 1;
      letter-spacing: .03em;
    }
    @media (max-width: 768px) {
      /* Mostrar micro-labels no modo colapsado (ícone apenas) */
      #appView.sidebar-collapsed .nav-micro-label {
        display: block;
      }
    }


    /* ────────────────────── FINANCEIRO TABS SCROLL (F-07) ──────────── */
    .fin-tabs-wrapper {
      position: relative;
    }
    .fin-tabs-wrapper::after {
      content: '';
      position: absolute;
      right: 0; top: 0; bottom: 2px;
      width: 48px;
      background: linear-gradient(to left, var(--bg-card, #fff), transparent);
      pointer-events: none;
      z-index: 1;
    }
    @media (max-width: 768px) {
      .fin-tabs-scroll {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
      }
      .fin-tabs-scroll::-webkit-scrollbar { display: none; }
    }


    /* ────────────────────── MODAL CONFIRMAÇÃO DELETE (F-09) ────────── */
    #modal-confirmar-delete {
      display: none;
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.45);
      z-index: 9000;
      align-items: center;
      justify-content: center;
      padding: 1rem;
    }
    #modal-confirmar-delete .modal-delete-box {
      background: var(--cream);
      border-radius:var(--radius);
      padding: 1.75rem 1.5rem 1.25rem;
      max-width: 380px;
      width: 100%;
      box-shadow: 0 8px 24px rgba(27,62,47,.18);box-shadow: 0 8px 24px color-mix(in srgb,var(--x-1b3e2f) 18%,transparent);
      animation: fade-in-scale .25s cubic-bezier(0.16,1,.3,1) forwards;
    }
    #modal-confirmar-delete .modal-delete-icon {
      font-size: 2rem;
      text-align: center;
      margin-bottom: .75rem;
    }
    #modal-confirmar-delete p {
      font-size: .94rem;
      color: var(--brand);
      text-align: center;
      line-height: 1.5;
    }
    #modal-confirmar-delete small {
      display: block;
      text-align: center;
      font-size: .78rem;
      color: var(--text-muted);
      margin-top: .3rem;
      margin-bottom: 1.25rem;
    }
    #modal-confirmar-delete .modal-delete-actions {
      display: flex;
      gap: .75rem;
      justify-content: center;
    }
    #modal-confirmar-delete .modal-delete-actions button {
      min-width: 120px;
      min-height: 44px;
      border-radius:var(--radius);
      font-size: .875rem;
      font-weight: 600;
      cursor: pointer;
      border: 1px solid transparent;
      transition: all .2s;
    }
    #modal-confirmar-delete .btn-cancel-delete {
      background: var(--bg);
      color: var(--text-mid);
      border-color: rgba(3,27,20,.1);border-color: color-mix(in srgb,var(--x-031b14) 10%,transparent);
    }
    #modal-confirmar-delete .btn-cancel-delete:hover { background: rgba(3,27,20,.05);background: color-mix(in srgb,var(--x-031b14) 5%,transparent); }
    #modal-confirmar-delete .btn-confirm-delete {
      background: var(--danger);
      color: #fff;
    }
    #modal-confirmar-delete .btn-confirm-delete:hover { background: var(--danger); }

    /* Touch targets mínimos para ações destrutivas (F-09) */
    @media (max-width: 768px) {
      .btn-action, .btn-icon {
        min-width: 44px !important;
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
      }
    }


    /* ────────────────────── EMPTY STATE (F-10) ─────────────────────── */
    .empty-state {
      padding: 2.5rem 1.5rem;
      text-align: center;
      color: var(--text-muted);
    }
    .empty-state .empty-icon { font-size: 2.5rem; margin-bottom: .75rem; opacity: 0.6; }
    .empty-state h3 { font-size: 1rem; font-weight:600; color: var(--brand); margin-bottom: .4rem; }
    .empty-state p { font-size: .85rem; line-height: 1.5; margin-bottom: 1rem; }
    .empty-state .empty-actions { display: flex; gap: .5rem; justify-content: center; flex-wrap: wrap; }
    .empty-state .empty-actions button {
      padding: .5rem 1rem;
      border-radius:var(--radius);
      font-size: .82rem;
      font-weight: 600;
      cursor: pointer;
      border: 1px solid rgba(3,27,20,.1);border: 1px solid color-mix(in srgb,var(--x-031b14) 10%,transparent);
      background: var(--bg);
      color: var(--brand);
      transition: all .2s;
      min-height: 36px;
    }
    .empty-state .empty-actions button:hover { background: var(--brand); color: #fff; }

    /* Cards CRM */
    .card { background:var(--bg-card); border-radius:var(--radius); box-shadow:0 4px 20px rgba(3,27,20,.03);box-shadow:0 4px 20px color-mix(in srgb,var(--x-031b14) 3%,transparent); border:1px solid rgba(3,27,20,.06);border:1px solid color-mix(in srgb,var(--x-031b14) 6%,transparent); transition: box-shadow .3s ease, transform .3s ease; }
    .card:hover { box-shadow:0 8px 32px rgba(3,27,20,.06);box-shadow:0 8px 32px color-mix(in srgb,var(--x-031b14) 6%,transparent); }
    .card-accent { border-top:4px solid var(--gold); }

    /* Badges CRM */
    .badge { display:inline-flex; align-items:center; padding:3px 12px; border-radius:999px; font-size:11.5px; font-weight:600; letter-spacing: 0.02em; }
    .badge-novo        { background:rgba(3,27,20,.05);background:color-mix(in srgb,var(--x-031b14) 5%,transparent); color:var(--text-mid); border: 1px solid rgba(3,27,20,.1);border: 1px solid color-mix(in srgb,var(--x-031b14) 10%,transparent); }
    .badge-contato     { background:rgba(200,169,107,.1);background:color-mix(in srgb,var(--x-c8a96b) 10%,transparent); color:var(--gold-dark); border: 1px solid rgba(200,169,107,.2);border: 1px solid color-mix(in srgb,var(--x-c8a96b) 20%,transparent); }
    .badge-proposta    { background:var(--info-bg); color:var(--brand); border: 1px solid var(--info-border); }
    .badge-convertido  { background:var(--success-bg); color:var(--success); border:1px solid var(--success-border); }
    .badge-finalizado  { background:rgba(11,35,24,.1);background:color-mix(in srgb,var(--x-0b2318) 10%,transparent); color:var(--brand); border: 1px solid rgba(11,35,24,.2);border: 1px solid color-mix(in srgb,var(--x-0b2318) 20%,transparent); }
    .badge-perdido     { background:var(--danger-bg); color:var(--danger); border:1px solid var(--danger-border); }
    .badge-triagem     { background:rgba(201,169,110,.15);background:color-mix(in srgb,var(--x-c9a96e) 15%,transparent); color:var(--gold-dark); border:1px solid rgba(201,169,110,.35);border:1px solid color-mix(in srgb,var(--x-c9a96e) 35%,transparent); }
    .badge-receita     { background:var(--success-bg); color:var(--success); }
    .badge-despesa     { background:var(--danger-bg); color:var(--danger); }
    .badge-pago        { background:var(--success-bg); color:var(--success); border:1px solid var(--success-border); }
    .badge-pendente    { background:rgba(200,169,107,.1);background:color-mix(in srgb,var(--x-c8a96b) 10%,transparent); color:var(--gold-dark); border: 1px solid rgba(200,169,107,.2);border: 1px solid color-mix(in srgb,var(--x-c8a96b) 20%,transparent); }
    .badge-inadimplente{ background:var(--danger-bg); color:var(--danger); border:1px solid var(--danger-border); }
    .badge-demo        { background:rgba(196,168,106,.1);background:color-mix(in srgb,var(--x-c4a86a) 10%,transparent); color:var(--gold-dark); font-size:.7rem; padding:.3rem .8rem; border-radius:var(--radius); font-weight:600; border: 1px solid rgba(200,169,107,.3);border: 1px solid color-mix(in srgb,var(--x-c8a96b) 30%,transparent); }


    /* ── MÓDULO DOCUMENTOS (acervo) — design system ─────────── */
    .ac-toolbar{display:flex;align-items:flex-end;gap:.6rem;flex-wrap:wrap;}
    .ac-field{display:flex;flex-direction:column;gap:3px;}
    .ac-field>label{font-size:.62rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);}
    .ac-select{font-size:13px;padding:7px 10px;border:1px solid var(--border);border-radius:var(--radius);background:#fff;color:var(--text);cursor:pointer;}
    .ac-search{flex:1;min-width:200px;}
    .ac-search .ac-select{cursor:text;width:100%;box-sizing:border-box;}
    .ac-modelos-btn{display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap;}
    /* o view-toggle reaproveita .fin-view-toggle / .fin-toggle-btn */
    .ac-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.7rem;}
    .ac-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.4rem;padding:1rem .6rem;border:1px solid var(--border);border-radius:var(--radius);background:#fff;cursor:pointer;transition:border-color .15s,box-shadow .15s;position:relative;min-width:0;}
    .ac-card:hover{border-color:var(--brand);box-shadow:0 2px 10px rgba(3,27,20,.08);box-shadow:0 2px 10px color-mix(in srgb,var(--x-031b14) 8%,transparent);}
    .ac-row{display:flex;align-items:center;gap:.6rem;padding:.6rem .4rem;border-bottom:1px solid var(--border);cursor:pointer;transition:background .12s;}
    .ac-row:hover{background:rgba(3,27,20,.03);background:color-mix(in srgb,var(--x-031b14) 3%,transparent);}
    .ac-ico{font-size:1.3rem;flex-shrink:0;line-height:1;}
    .ac-card .ac-ico{font-size:2rem;}
    .ac-nome{font-weight:600;font-size:13px;color:var(--text-main,var(--text));}
    .ac-row .ac-nome{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .ac-card .ac-nome{font-size:12.5px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;width:100%;}
    .ac-meta{font-size:11px;color:var(--text-muted);}
    .ac-card .ac-meta{font-size:10.5px;}
    .ac-del{background:none;border:none;cursor:pointer;color:var(--text-muted);opacity:.55;font-size:.95rem;padding:.2rem .35rem;border-radius:var(--radius);flex-shrink:0;line-height:1;}
    .ac-del:hover{opacity:1;color:var(--danger);background:var(--danger-bg);}
    .ac-preview-box{background:var(--bg-card);border-radius:var(--radius);width:min(960px,94vw);height:min(88vh,900px);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 18px 50px rgba(3,27,20,.35);box-shadow:0 18px 50px color-mix(in srgb,var(--x-031b14) 35%,transparent);}
    .ac-preview-head{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;border-bottom:1px solid var(--border);flex-shrink:0;}
    .ac-pv-nome{font-weight:600;font-size:14px;color:var(--text);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .ac-preview-body{flex:1;background:#525659;display:flex;align-items:center;justify-content:center;overflow:auto;min-height:0;}
    .ac-preview-body iframe{width:100%;height:100%;border:none;background:#fff;}
    .ac-preview-body img{max-width:100%;max-height:100%;object-fit:contain;}
    /* menu de contexto (⋯) */
    .ac-kebab{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:1.1rem;line-height:1;padding:.1rem .4rem;border-radius:var(--radius);flex-shrink:0;opacity:.55;}
    .ac-kebab:hover{opacity:1;background:rgba(3,27,20,.06);background:color-mix(in srgb,var(--x-031b14) 6%,transparent);color:var(--brand);}
    .ac-card .ac-kebab-tr{position:absolute;top:2px;right:2px;opacity:.4;}
    .ac-card:hover .ac-kebab-tr{opacity:1;}
    .ac-menu{position:fixed;z-index:60;min-width:190px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 10px 30px rgba(3,27,20,.18);box-shadow:0 10px 30px color-mix(in srgb,var(--x-031b14) 18%,transparent);padding:.3rem;}
    .ac-menu button{display:flex;align-items:center;gap:.55rem;width:100%;text-align:left;background:none;border:none;cursor:pointer;font-size:13px;color:var(--text);padding:.5rem .6rem;border-radius:var(--radius);}
    .ac-menu button:hover{background:rgba(3,27,20,.06);background:color-mix(in srgb,var(--x-031b14) 6%,transparent);}
    .ac-menu button.danger{color:var(--danger);}
    .ac-menu button.danger:hover{background:var(--danger-bg);}
    .ac-menu .sep{height:1px;background:var(--border);margin:.25rem .2rem;}
    /* diálogos (nova pasta / renomear / mover) */
    .ac-dialog-box{background:var(--bg-card);border-radius:var(--radius);width:min(460px,94vw);max-height:88vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 18px 50px rgba(3,27,20,.35);box-shadow:0 18px 50px color-mix(in srgb,var(--x-031b14) 35%,transparent);}
    .ac-dialog-head{padding:.9rem 1.1rem;border-bottom:1px solid var(--border);font-weight:600;font-size:14px;color:var(--text);}
    .ac-dialog-body{padding:1.1rem;overflow:auto;}
    .ac-dialog-foot{padding:.8rem 1.1rem;border-top:1px solid var(--border);display:flex;gap:.5rem;justify-content:flex-end;}
    .ac-dialog-body input[type=text]{width:100%;box-sizing:border-box;font-size:14px;padding:.55rem .7rem;border:1px solid var(--border);border-radius:var(--radius);}
    .ac-tree{border:1px solid var(--border);border-radius:var(--radius);max-height:300px;overflow:auto;}
    .ac-tree-item{display:flex;align-items:center;gap:.5rem;padding:.55rem .7rem;cursor:pointer;border-bottom:1px solid var(--border);font-size:13px;}
    .ac-tree-item:last-child{border-bottom:none;}
    .ac-tree-item:hover{background:rgba(3,27,20,.04);background:color-mix(in srgb,var(--x-031b14) 4%,transparent);}
    /* destaque da zona de drop */
    #acervoContainer.ac-drop{outline:2px dashed var(--brand);outline-offset:4px;background:rgba(3,27,20,.03);background:color-mix(in srgb,var(--x-031b14) 3%,transparent);border-radius:var(--radius);}
    /* painel de progresso de upload */
    .ac-uppanel{position:fixed;right:18px;bottom:18px;width:320px;max-width:92vw;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 12px 36px rgba(3,27,20,.22);box-shadow:0 12px 36px color-mix(in srgb,var(--x-031b14) 22%,transparent);z-index:70;overflow:hidden;}
    .ac-uppanel-head{display:flex;align-items:center;justify-content:space-between;padding:.6rem .8rem;border-bottom:1px solid var(--border);font-size:13px;font-weight:600;color:var(--text);}
    .ac-uppanel-list{max-height:260px;overflow:auto;}
    .ac-upitem{padding:.5rem .8rem;border-bottom:1px solid var(--border);font-size:12px;}
    .ac-upitem .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text);}
    .ac-upbar{height:5px;background:var(--border);border-radius:3px;margin-top:.35rem;overflow:hidden;}
    .ac-upbar > i{display:block;height:100%;width:0;background:var(--brand);transition:width .15s;}
    .ac-upitem.ok  .ac-upbar > i{background:var(--success);}
    .ac-upitem.err .ac-upbar > i{background:var(--danger);}
    .ac-upitem.err .nm{color:var(--danger);}
    /* seleção múltipla */
    .ac-chk{width:16px;height:16px;cursor:pointer;flex-shrink:0;accent-color:var(--brand);}
    .ac-card .ac-chk-tl{position:absolute;top:4px;left:4px;opacity:.5;}
    .ac-card:hover .ac-chk-tl,.ac-card.ac-selected .ac-chk-tl{opacity:1;}
    .ac-row.ac-selected,.ac-card.ac-selected{background:rgba(3,27,20,.07);background:color-mix(in srgb,var(--x-031b14) 7%,transparent);}
    .ac-card.ac-selected{border-color:var(--brand);}
    /* barra de ações em lote */
    .ac-bulkbar{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:65;display:flex;align-items:center;gap:.5rem;background:var(--forest-deep,var(--forest-deep));color:#fff;border-radius:var(--radius);box-shadow:0 12px 36px rgba(3,27,20,.35);box-shadow:0 12px 36px color-mix(in srgb,var(--x-031b14) 35%,transparent);padding:.5rem .7rem;max-width:94vw;flex-wrap:wrap;}
    .ac-bulkbar .ac-bb-count{font-size:12px;font-weight:600;padding-right:.4rem;}
    .ac-bulkbar button{background:rgba(255,255,255,.12);color:#fff;border:none;border-radius:var(--radius);font-size:12px;font-weight:500;cursor:pointer;padding:.4rem .7rem;}
    .ac-bulkbar button:hover{background:rgba(255,255,255,.22);}
    .ac-bulkbar button.danger{background:rgba(220,80,80,.85);background:color-mix(in srgb,var(--x-dc5050) 85%,transparent);}
    .ac-bulkbar button.ghost{background:none;color:var(--champ-light,var(--gold-light));}
    /* drawer de detalhes */
    .ac-drawer{position:fixed;top:0;right:0;height:100%;width:380px;max-width:92vw;background:var(--bg-card);border-left:1px solid var(--border);box-shadow:-12px 0 40px rgba(3,27,20,.2);box-shadow:-12px 0 40px color-mix(in srgb,var(--x-031b14) 20%,transparent);z-index:62;transform:translateX(100%);transition:transform .2s ease;display:flex;flex-direction:column;}
    .ac-drawer.open{transform:translateX(0);}
    .ac-drawer-head{display:flex;align-items:center;gap:.6rem;padding:.85rem 1rem;border-bottom:1px solid var(--border);}
    .ac-drawer-body{padding:1rem;overflow:auto;}
    .ac-meta-dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem .8rem;font-size:13px;margin:0;}
    .ac-meta-dl dt{color:var(--text-muted);}
    .ac-meta-dl dd{margin:0;color:var(--text);word-break:break-word;}
    .ac-vinc-res{display:none;position:absolute;z-index:5;left:0;right:0;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 22px rgba(3,27,20,.14);box-shadow:0 8px 22px color-mix(in srgb,var(--x-031b14) 14%,transparent);max-height:220px;overflow:auto;margin-top:2px;}
    .ac-vinc-item{padding:.5rem .6rem;font-size:13px;cursor:pointer;border-bottom:1px solid var(--border);}
    .ac-vinc-item:hover{background:rgba(3,27,20,.05);background:color-mix(in srgb,var(--x-031b14) 5%,transparent);}
    /* rolagem virtual (pastas grandes) */
    .ac-vp{overflow:auto;position:relative;border:1px solid var(--border);border-radius:var(--radius);}
    .ac-vp-sizer{position:relative;}
    .ac-vp-content{position:absolute;left:0;right:0;top:0;will-change:transform;}
    .ac-vp .ac-row{height:46px;box-sizing:border-box;}
    .ac-vp-grid .ac-card{height:128px;box-sizing:border-box;}
    .ac-vp-content .ac-grid{padding:2px;}
    /* destaque do termo buscado */
    mark.ac-hl{background:var(--gold-light,var(--gold-light));color:inherit;padding:0 1px;border-radius:2px;}
    @media(max-width:640px){ .ac-drawer{width:100vw;} .ac-bulkbar{left:8px;right:8px;transform:none;} }
    @media(max-width:640px){
      .ac-preview-box{width:100vw;height:100dvh;border-radius:0;}
      .ac-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.5rem;}
      .ac-toolbar .ac-field:not(.ac-search){flex:1;}
      .ac-select{width:100%;}
      .ac-uppanel{left:8px;right:8px;width:auto;bottom:8px;}
    }
    /* ── MÓDULO FINANCEIRO v2 — design system ─────────────── */
    /* View toggle Executiva / Operacional */
    .fin-view-toggle{display:flex;background:rgba(3,27,20,.05);background:color-mix(in srgb,var(--x-031b14) 5%,transparent);border-radius:var(--radius);padding:3px;gap:2px;}
    .fin-toggle-btn{display:flex;align-items:center;gap:6px;padding:6px 14px;border:none;border-radius:var(--radius);font-size:12px;font-weight:600;cursor:pointer;color:var(--text-muted);background:transparent;transition:all .2s;white-space:nowrap;}
    .fin-toggle-btn.active{background:#fff;color:var(--brand);box-shadow:0 1px 4px rgba(3,27,20,.12);box-shadow:0 1px 4px color-mix(in srgb,var(--x-031b14) 12%,transparent);}
    /* KPI cards executivo */
    .fin-kpi{padding:1rem 1.1rem !important;}
    .fin-kpi-label{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:.35rem;}
    .fin-kpi-val{font-size:1.35rem;font-weight:600;color:var(--brand);letter-spacing:-.02em;line-height:1;}
    .fin-kpi-sub{font-size:.73rem;color:var(--text-muted);margin-top:.3rem;}
    /* KPIs de gestão (Visão Executiva) */
    .fg-pilar-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--gold-dark);margin:.85rem 0 .4rem;padding-left:.15rem;}
    .fg-pilar-label:first-child{margin-top:0;}
    .fg-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.65rem;}
    .fg-kpi{padding:.95rem 1.1rem !important;cursor:pointer;transition:transform .12s,box-shadow .12s;position:relative;}
    .fg-kpi:hover{transform:translateY(-2px);box-shadow:0 6px 18px rgba(3,27,20,.1);box-shadow:0 6px 18px color-mix(in srgb,var(--x-031b14) 10%,transparent);}
    .fg-kpi::after{content:'›';position:absolute;top:.6rem;right:.8rem;color:var(--text-muted);opacity:0;font-size:1.1rem;transition:opacity .12s;}
    .fg-kpi:hover::after{opacity:.5;}
    .fg-bar-row.fg-clickable{cursor:pointer;border-radius:5px;padding:.1rem .25rem;margin-left:-.25rem;transition:background .12s;}
    .fg-bar-row.fg-clickable:hover{background:rgba(24,74,50,.05);background:color-mix(in srgb,var(--x-184a32) 5%,transparent);}
    .fg-proj-row.fg-clickable{cursor:pointer;}
    .fg-proj-row.fg-clickable:hover{background:rgba(24,74,50,.04);background:color-mix(in srgb,var(--x-184a32) 4%,transparent);}
    .fg-kpi-label{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);margin-bottom:.4rem;display:flex;align-items:center;gap:.4rem;}
    .fg-kpi-val{font-size:1.5rem;font-weight:600;color:var(--brand);letter-spacing:-.02em;line-height:1.05;}
    .fg-kpi-sub{font-size:.74rem;color:var(--text-muted);margin-top:.35rem;line-height:1.35;}
    .fg-delta-up{color:var(--success);font-weight:600;}
    .fg-delta-down{color:var(--danger);font-weight:600;}
    .fg-meta-chip{font-size:.62rem;font-weight:600;text-transform:none;letter-spacing:0;color:var(--gold-dark);background:rgba(200,169,107,.14);background:color-mix(in srgb,var(--x-c8a96b) 14%,transparent);border-radius:5px;padding:1px 6px;cursor:pointer;}
    .fg-cob-tag{font-size:.62rem;font-weight:600;color:var(--gold-dark);background:rgba(200,169,107,.12);background:color-mix(in srgb,var(--x-c8a96b) 12%,transparent);border-radius:5px;padding:1px 7px;}
    .fg-bar-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.45rem;font-size:.78rem;}
    .fg-bar-row .fg-bar-name{flex:0 0 38%;color:var(--text-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .fg-bar-track{flex:1;height:8px;background:rgba(3,27,20,.06);background:color-mix(in srgb,var(--x-031b14) 6%,transparent);border-radius:5px;overflow:hidden;}
    .fg-bar-fill{height:100%;border-radius:5px;background:var(--brand);}
    .fg-bar-val{flex:0 0 auto;color:var(--text-muted);font-variant-numeric:tabular-nums;}
    .fg-proj-row{display:flex;justify-content:space-between;align-items:baseline;padding:.4rem 0;border-bottom:1px dashed var(--border);font-size:.82rem;}
    .fg-proj-row:last-child{border-bottom:none;}
    .fg-proj-val{font-weight:600;font-variant-numeric:tabular-nums;}
    /* KPI pills operacional */
    .fin-kpi-pill{display:flex;align-items:center;gap:.45rem;background:var(--bg-card);border:1px solid rgba(3,27,20,.06);border:1px solid color-mix(in srgb,var(--x-031b14) 6%,transparent);border-radius:var(--radius);padding:.4rem .8rem;box-shadow:0 1px 3px rgba(3,27,20,.03);box-shadow:0 1px 3px color-mix(in srgb,var(--x-031b14) 3%,transparent);}
    .fin-kpi-pill-label{font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);}
    .fin-kpi-pill-val{font-size:.9rem;font-weight:600;color:var(--brand);}
    /* Tabs financeiro */
    .fin-tab-btn{padding:8px 16px;border:none;background:none;cursor:pointer;font-size:13px;font-weight:500;color:var(--text-muted);border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .15s;white-space:nowrap;}
    .fin-tab-btn:hover{color:var(--brand);}
    .fin-tab-btn[draggable="true"]{cursor:grab;}
    .fin-tab-btn[draggable="true"]:active{cursor:grabbing;}
    .fin-tab-dragging{opacity:.45;background:rgba(24,74,50,.06);background:color-mix(in srgb,var(--x-184a32) 6%,transparent);border-radius:6px 6px 0 0;}
    .fin-tab-active{color:var(--brand)!important;font-weight:600!important;border-bottom-color:var(--brand)!important;}
    /* Filter bar */
    .fin-filter-bar{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding:.65rem .85rem;background:var(--bg-card);border:1px solid rgba(3,27,20,.06);border:1px solid color-mix(in srgb,var(--x-031b14) 6%,transparent);border-radius:var(--radius);margin-bottom:.75rem;box-shadow:0 1px 3px rgba(3,27,20,.03);box-shadow:0 1px 3px color-mix(in srgb,var(--x-031b14) 3%,transparent);}
    .fin-filter-bar input,.fin-filter-bar select{border:1px solid rgba(3,27,20,.08);border:1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent);border-radius:var(--radius);padding:6px 11px;font-size:13px;background:#fff;min-width:0;transition:all .2s;}
    .fin-filter-bar input:focus,.fin-filter-bar select:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,169,107,.12);box-shadow:0 0 0 3px color-mix(in srgb,var(--x-c8a96b) 12%,transparent);outline:none;}
    .fin-search-wrap{position:relative;flex:1 1 240px;min-width:180px;max-width:none;}
    .fin-filter-bar select{flex:0 0 auto;min-width:150px;}
    .fin-search-wrap svg{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none;}
    .fin-search-wrap input{padding-left:30px;width:100%;}
    /* Compact table */
    .fin-table{width:100%;border-collapse:collapse;}
    .fin-table thead{position:sticky;top:0;z-index:2;}
    .fin-table thead th{background:#fff;padding:9px 14px;text-align:left;font-size:10.5px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.09em;border-bottom:2px solid rgba(3,27,20,.06);border-bottom:2px solid color-mix(in srgb,var(--x-031b14) 6%,transparent);white-space:nowrap;}
    .fin-table tbody tr{border-bottom:1px solid rgba(3,27,20,.04);border-bottom:1px solid color-mix(in srgb,var(--x-031b14) 4%,transparent);transition:background .12s;}
    .fin-table tbody tr:nth-child(odd):not(.fin-group-hdr):not(.fin-more-row){background:rgba(248,247,244,.5);background:color-mix(in srgb,var(--x-f8f7f4) 50%,transparent);}
    .fin-table tbody tr:hover:not(.fin-group-hdr):not(.fin-more-row){background:rgba(200,169,107,.07);background:color-mix(in srgb,var(--x-c8a96b) 7%,transparent);cursor:pointer;}
    .fin-table tbody td{padding:8px 14px;font-size:13px;color:var(--text-mid);vertical-align:middle;}
    /* Group headers */
    .fin-group-hdr{background:var(--bg)!important;border-bottom:none!important;cursor:pointer;}
    .fin-group-hdr:hover{background:rgba(3,27,20,.03)!important;background:color-mix(in srgb,var(--x-031b14) 3%,transparent)!important;}
    .fin-group-hdr td{padding:6px 14px!important;font-size:11.5px!important;font-weight:600!important;letter-spacing:.04em;}
    .fin-group-chevron{display:inline-block;transition:transform .2s;margin-right:4px;}
    /* Load more row */
    .fin-more-row{background:none!important;}
    .fin-more-row td{padding:6px 14px!important;text-align:center;}
    .fin-more-btn{background:none;border:1px solid var(--border);border-radius:var(--radius);padding:3px 14px;font-size:12px;color:var(--text-muted);cursor:pointer;transition:all .15s;}
    .fin-more-btn:hover{background:var(--bg);color:var(--brand);}
    /* Sortable column headers */
    .fin-th-sort{cursor:pointer;user-select:none;}
    .fin-th-sort:hover{color:var(--brand)!important;}
    .fin-th-sort .sort-arrow{display:inline-block;margin-left:3px;font-size:9px;vertical-align:middle;}
    .fin-th-sort:not(.sort-asc):not(.sort-desc) .sort-arrow::after{content:'⇅';opacity:.3;}
    .fin-th-sort.sort-asc .sort-arrow::after{content:'▲';color:var(--brand);}
    .fin-th-sort.sort-desc .sort-arrow::after{content:'▼';color:var(--brand);}
    /* Aging badges */
    .fin-aging{display:inline-flex;align-items:center;padding:2px 8px;border-radius:5px;font-size:11px;font-weight:600;}
    /* Alertas exec view */
    .fin-alerta{display:flex;align-items:center;justify-content:space-between;padding:.55rem .85rem;border-radius:var(--radius);border:1px solid;margin-bottom:.35rem;}
    .fin-alerta-label{font-size:.78rem;font-weight:600;}
    .fin-alerta-val{font-size:.82rem;font-weight:600;}
    /* ════ FSC componentes (Marca v4) — design-system reutilizável (Fase 3) ════ */
    .fsc-empty{text-align:center;padding:1.5rem;color:var(--text-muted);font-size:.85rem;}
    .fsc-error{text-align:center;padding:1.5rem;color:var(--danger);font-size:.85rem;}
    .fsc-badge{display:inline-flex;align-items:center;gap:.35rem;padding:2px 9px;border-radius:var(--radius-pill);font-size:var(--fs-sm);font-weight:600;line-height:1.5;}
    .fsc-badge--pos{color:var(--state-positive-text);background:var(--state-positive-bg);border:1px solid var(--state-positive-border);}
    .fsc-badge--neg{color:var(--state-negative-text);background:var(--state-negative-bg);border:1px solid var(--state-negative-border);}
    .fsc-badge--att{color:var(--state-attention-text);background:var(--state-attention-bg);border:1px solid var(--state-attention-border);}
    .fsc-badge--info{color:var(--state-info-text);background:var(--state-info-bg);border:1px solid var(--state-info-border);}
    .fsc-card{background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow-md);border:1px solid rgba(3,27,20,.06);border:1px solid color-mix(in srgb,var(--x-031b14) 6%,transparent);}
    .fsc-kpi{padding:1rem 1.1rem;}
    .fsc-pill{display:inline-flex;align-items:center;gap:.45rem;border-radius:var(--radius-pill);padding:.4rem .8rem;}
    .fsc-table{width:100%;border-collapse:collapse;}
    .fsc-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1rem;border-radius:var(--radius);font-size:var(--fs-base);font-weight:600;cursor:pointer;border:1px solid var(--brand);background:var(--brand);color:var(--white);transition:all .2s;}
    .fsc-btn--ghost{background:transparent;color:var(--brand);}
    .fsc-lead-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:.55rem .65rem;margin-bottom:.45rem;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.04);}
    .fsc-funil-col{background:var(--x-f6f3ec);border-radius:var(--radius);padding:.55rem;display:flex;flex-direction:column;}
    .fsc-col-head{display:flex;align-items:center;gap:.4rem;margin-bottom:.55rem;padding:0 .15rem;}
    .fsc-col-dot{width:8px;height:8px;border-radius:50%;}
    .fsc-col-title{font-size:.72rem;font-weight:700;color:var(--text);text-transform:uppercase;letter-spacing:.03em;}
    .fsc-col-count{margin-left:auto;font-size:.7rem;font-weight:600;border-radius:20px;padding:0 .45rem;}
    .fsc-urg-badge{font-size:.68rem;padding:2px 8px;border-radius:20px;background:var(--gold-fill,var(--gold));color:var(--forest-deep);font-weight:700;letter-spacing:.02em;display:inline-flex;align-items:center;gap:3px;}
    .fsc-urg-dot{width:6px;height:6px;border-radius:50%;background:var(--forest-deep);display:inline-block;}
    .fsc-meta{display:inline-flex;align-items:center;gap:4px;}
    /* Drawer lateral */
    /* ── CRM Drawer genérico (Leads, Casos, Pessoas) ─── */
    #crm-drawer-overlay{position:fixed;inset:0;background:rgba(3,27,20,.35);background:color-mix(in srgb,var(--x-031b14) 35%,transparent);backdrop-filter:blur(3px);z-index:200;}
    #crm-drawer{position:fixed;right:0;top:0;bottom:0;width:440px;max-width:96vw;background:#fff;box-shadow:-8px 0 48px rgba(3,27,20,.14);box-shadow:-8px 0 48px color-mix(in srgb,var(--x-031b14) 14%,transparent);z-index:201;overflow-y:auto;padding:1.75rem 1.5rem;animation:slideInRight .28s cubic-bezier(.16,1,.3,1);}
    .crm-drawer-lbl{font-size:.67rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.2rem;}
    .crm-drawer-val{font-size:.93rem;color:var(--brand);font-weight:500;word-break:break-word;}
    .crm-drawer-field{margin-bottom:.85rem;}
    .crm-drawer-sep{border:none;border-top:1px solid var(--border);margin:1.2rem 0;}
    .crm-drawer-section{font-size:.67rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.75rem;}
    .crm-drawer-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.25rem;}
    .crm-drawer-btn{flex:1;padding:.55rem 1rem;border-radius:var(--radius);font-size:.85rem;font-weight:600;cursor:pointer;border:none;transition:opacity .15s;}
    .crm-drawer-btn:hover{opacity:.85;}
    .crm-drawer-btn-primary{background:var(--brand);color:#fff;}
    .crm-drawer-btn-outline{background:transparent;color:var(--brand);border:1.5px solid var(--brand) !important;}
    .crm-drawer-btn-ghost{background:transparent;color:var(--text-muted);border:1.5px solid var(--border) !important;flex:0;}
    .crm-drawer-btn-danger{background:transparent;color:var(--danger);border:1.5px solid var(--danger) !important;flex:0;}
        #fin-drawer-overlay{position:fixed;inset:0;background:rgba(3,27,20,.35);background:color-mix(in srgb,var(--x-031b14) 35%,transparent);backdrop-filter:blur(3px);z-index:200;}
    #fin-drawer{position:fixed;right:0;top:0;bottom:0;width:420px;max-width:96vw;background:#fff;box-shadow:-8px 0 48px rgba(3,27,20,.14);box-shadow:-8px 0 48px color-mix(in srgb,var(--x-031b14) 14%,transparent);z-index:201;overflow-y:auto;padding:1.75rem 1.5rem;animation:slideInRight .28s cubic-bezier(.16,1,.3,1);}
    .fin-drawer-lbl{font-size:.67rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.2rem;}
    .fin-drawer-val{font-size:.95rem;color:var(--brand);font-weight:500;word-break:break-word;}
    .fin-drawer-field{margin-bottom:.9rem;}
    .fin-drawer-sep{border:none;border-top:1px solid var(--border);margin:1.25rem 0;}
    .fin-drawer-section-title{font-size:.67rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:.75rem;}
    /* ── END MÓDULO FINANCEIRO v2 ──────────────────────────── */
    /* Table */
    table { width:100%; border-collapse:collapse; }
    thead th { background:transparent; padding:14px 16px; text-align:left; font-size:11px; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:.1em; border-bottom:2px solid rgba(3,27,20,.05);border-bottom:2px solid color-mix(in srgb,var(--x-031b14) 5%,transparent); }
    tbody tr { border-bottom:1px solid rgba(3,27,20,.04);border-bottom:1px solid color-mix(in srgb,var(--x-031b14) 4%,transparent); transition:background .2s; }
    tbody tr:hover { background:rgba(247,245,242,.6);background:color-mix(in srgb,var(--x-f7f5f2) 60%,transparent); }
    tbody td { padding:14px 16px; font-size:14px; color:var(--text-mid); vertical-align:middle; }

    /* Forms CRM */
    /* — Label de formulário padrão — */
    .btn-modal-close { background:none; border:none; font-size:1.5rem; cursor:pointer; color:var(--text-muted); line-height:1; transition:color .2s; padding:2px; border-radius:var(--radius); }
    .btn-modal-close:hover { color:var(--brand); }
    .form-label { font-size:.75rem; font-weight:600; color:var(--text-mid); display:block; margin-bottom:.3rem; }
        input, select, textarea { border:1px solid rgba(3,27,20,.08);border:1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent); border-radius:var(--radius); padding:10px 14px; width:100%; font-size:14px; outline:none; transition:all .2s ease; background:var(--bg); color:var(--text); font-family:var(--f-ui,'Inter',sans-serif); }
    input:focus, select:focus, textarea:focus { border-color:var(--gold); box-shadow:0 0 0 4px rgba(200,169,107,.1);box-shadow:0 0 0 4px color-mix(in srgb,var(--x-c8a96b) 10%,transparent); background:#fff; }

    /* Buttons CRM */
    .btn-crm-primary   { background:var(--forest-deep); color:#fff; padding:10px 20px; border-radius:var(--radius); font-size:14px; font-weight:500; cursor:pointer; transition:all .3s cubic-bezier(0.16, 1, 0.3, 1); border:1px solid rgba(255,255,255,0.1); box-shadow: 0 4px 12px rgba(3,27,20,.15), inset 0 1px 0 rgba(255,255,255,0.1);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-031b14) 15%,transparent), inset 0 1px 0 rgba(255,255,255,0.1); }
    .btn-crm-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(3,27,20,.25), inset 0 1px 0 rgba(255,255,255,0.15);box-shadow: 0 8px 24px color-mix(in srgb,var(--x-031b14) 25%,transparent), inset 0 1px 0 rgba(255,255,255,0.15); background: var(--forest); }
    .btn-crm-gold      { background:var(--gold-fill,var(--gold)); color:var(--x-031b14); padding:10px 20px; border-radius:var(--radius); font-size:14px; font-weight:600; cursor:pointer; transition:all .3s ease; border:1px solid rgba(255,255,255,0.3); box-shadow: 0 4px 12px rgba(200,169,107,.2);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-c8a96b) 20%,transparent); text-shadow: 0 1px 0 rgba(255,255,255,0.2); }
    .btn-crm-gold:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(200,169,107,.4);box-shadow: 0 8px 20px color-mix(in srgb,var(--x-c8a96b) 40%,transparent); filter: brightness(1.05); }
    .btn-crm-secondary { background:var(--bg); color:var(--text-mid); padding:10px 20px; border-radius:var(--radius); font-size:14px; font-weight:500; cursor:pointer; transition:all .2s ease; border:1px solid rgba(3,27,20,.06);border:1px solid color-mix(in srgb,var(--x-031b14) 6%,transparent); }
    .btn-crm-secondary:hover { background:#fff; box-shadow: 0 4px 12px rgba(0,0,0,0.03); border-color: rgba(200,169,107,.3);border-color: color-mix(in srgb,var(--x-c8a96b) 30%,transparent); color: var(--brand); }
    .btn-icon { background:transparent; border:none; cursor:pointer; padding:6px 8px; border-radius:var(--radius); color:var(--text-muted); transition:all .2s; font-size:14px; }
    .btn-icon:hover { background:var(--bg); color:var(--brand); transform: scale(1.05); }
    /* ── aliases para btn-primary / btn-secondary (usados em todo o app) ── */
    .btn-primary   { background:var(--forest); color:#fff; padding:8px 18px; border-radius:var(--radius); font-size:13px; font-weight:500; cursor:pointer; transition:all .25s; border:1px solid rgba(255,255,255,0.1); box-shadow:0 2px 8px rgba(3,27,20,.15);box-shadow:0 2px 8px color-mix(in srgb,var(--x-031b14) 15%,transparent); }
    .btn-primary:hover { background:var(--forest); transform:translateY(-1px); box-shadow:0 4px 16px rgba(3,27,20,.2);box-shadow:0 4px 16px color-mix(in srgb,var(--x-031b14) 20%,transparent); }
    .btn-secondary { background:var(--bg); color:var(--text-mid); padding:8px 18px; border-radius:var(--radius); font-size:13px; font-weight:500; cursor:pointer; transition:all .2s; border:1px solid rgba(3,27,20,.1);border:1px solid color-mix(in srgb,var(--x-031b14) 10%,transparent); }
    .btn-secondary:hover { background:#fff; border-color:rgba(200,169,107,.4);border-color:color-mix(in srgb,var(--x-c8a96b) 40%,transparent); color:var(--brand); box-shadow:0 2px 8px rgba(0,0,0,0.05); }

    /* Modal */
    .modal-overlay { background:rgba(3,27,20,.6);background:color-mix(in srgb,var(--x-031b14) 60%,transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); position:fixed; inset:0; z-index:50; display:none; align-items:center; justify-content:center; }
    .modal-overlay.open { display:flex; }
    .modal-box { background:var(--cream); border-radius:var(--radius); width:540px; max-width:95vw; max-height:90vh; overflow-y:auto; box-shadow:0 8px 24px rgba(27,62,47,.18);box-shadow:0 8px 24px color-mix(in srgb,var(--x-1b3e2f) 18%,transparent); border: 1px solid var(--border); animation: fade-in-scale 0.4s ease forwards; }
    .modal-box::-webkit-scrollbar { width:6px; }
    .modal-box::-webkit-scrollbar-thumb { background:rgba(3,27,20,.1);background:color-mix(in srgb,var(--x-031b14) 10%,transparent); border-radius:3px; }

    /* Spinner */
    .spinner { display:inline-block; width:18px; height:18px; border:2px solid var(--border); border-top:2px solid var(--brand-mid); border-radius:50%; animation:spin .7s linear infinite; }
    @keyframes spin { to { transform:rotate(360deg); } }
    @keyframes slideInRight { from { transform:translateX(100%); opacity:0; } to { transform:translateX(0); opacity:1; } }
    .chart-wrap { position:relative; height:260px; }
    ::-webkit-scrollbar { width:6px; }
    ::-webkit-scrollbar-thumb { background:var(--border); border-radius:3px; }

    /* Grid helpers — responsivos */
    .grid-4 { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:1.25rem; margin-bottom:1.75rem; }
    .grid-3 { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:1.25rem; margin-bottom:1.75rem; }
    .grid-2 { display:grid; grid-template-columns:repeat(auto-fit, minmax(320px, 1fr)); gap:1.25rem; margin-bottom:1.75rem; }
    .grid-1 { display:grid; grid-template-columns:1fr; gap:1.25rem; margin-bottom:1.75rem; }
    @media(max-width:1024px) { .grid-4 { grid-template-columns:repeat(2,1fr); } .grid-3 { grid-template-columns:repeat(2,1fr); } }
    @media(max-width:768px) { .grid-4 { grid-template-columns:repeat(2,1fr); gap:.75rem; margin-bottom:.75rem; } .grid-3, .grid-2 { grid-template-columns:1fr; gap:1rem; margin-bottom:1rem; } }

    /* Publicações / Blog */
    .badge-publicado { background:var(--success-bg); color:var(--success); border:1px solid var(--success-border); }
    .badge-rascunho  { background:rgba(3,27,20,.05);background:color-mix(in srgb,var(--x-031b14) 5%,transparent); color:var(--text-mid); border: 1px solid rgba(3,27,20,.1);border: 1px solid color-mix(in srgb,var(--x-031b14) 10%,transparent); }
    .post-excerpt { font-size:.85rem; color:var(--text-muted); max-width:380px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .ql-toolbar.ql-snow { border:1px solid rgba(3,27,20,.08);border:1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent); border-top-left-radius:10px; border-top-right-radius:10px; background:var(--bg-card); font-family:var(--f-ui,'Inter',sans-serif); }
    .ql-container.ql-snow { border:1px solid rgba(3,27,20,.08);border:1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent); border-bottom-left-radius:10px; border-bottom-right-radius:10px; background:var(--bg); font-family:var(--f-ui,'Inter',sans-serif); font-size:14px; min-height:200px; transition:all .2s ease; }
    .ql-container.ql-snow.ql-active { background:#fff; border-color:var(--gold); box-shadow:0 0 0 4px rgba(200,169,107,.1);box-shadow:0 0 0 4px color-mix(in srgb,var(--x-c8a96b) 10%,transparent); }
    
    /* WhatsApp Module */
    .wa-layout { display:flex; height:calc(100vh - 4rem); background:var(--bg-card); border-radius:var(--radius); border:1px solid rgba(3,27,20,.06);border:1px solid color-mix(in srgb,var(--x-031b14) 6%,transparent); box-shadow:0 4px 20px rgba(3,27,20,.03);box-shadow:0 4px 20px color-mix(in srgb,var(--x-031b14) 3%,transparent); overflow:hidden; }
    .wa-sidebar { width:320px; border-right:1px solid var(--border); display:flex; flex-direction:column; background:#fcfcfb; }
    .wa-sidebar-header { padding:14px; border-bottom:1px solid var(--border); }
    .wa-chat-list { flex:1; overflow-y:auto; }
    .wa-contact { padding:14px; border-bottom:1px solid var(--x-f0ede6); cursor:pointer; display:flex; gap:12px; align-items:center; transition:background .2s; }
    .wa-contact:hover { background:var(--cream); }
    .wa-contact.active { background:var(--x-e8f0eb); border-left:3px solid var(--brand); padding-left:11px; }
    .wa-avatar { width:42px; height:42px; border-radius:50%; background:var(--border); display:flex; align-items:center; justify-content:center; font-weight:600; color:var(--text-muted); flex-shrink:0; }
    .wa-contact-info { flex:1; min-width:0; }
    .wa-contact-top { display:flex; justify-content:space-between; margin-bottom:4px; }
    .wa-contact-name { font-size:var(--fs-base); font-weight:600; color:var(--brand); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .wa-contact-time { font-size:var(--fs-sm); color:var(--text-muted); }
    .wa-contact-msg { font-size:var(--fs-base); color:var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    
    .wa-main { flex:1; display:flex; flex-direction:column; background:var(--x-efeae2); position:relative; }
    .wa-main-header { padding:14px 20px; background:var(--bg-card); border-bottom:1px solid var(--border); display:flex; align-items:center; gap:12px; }
    .wa-messages { flex:1; padding:20px; overflow-y:auto; display:flex; flex-direction:column; gap:8px; background-image:url('https://i.ibb.co/3s1f9b3/wa-bg.png'); background-size:cover; opacity:0.95; }
    .wa-bubble { max-width:75%; padding:8px 12px; border-radius:var(--radius); font-size:var(--fs-base); line-height:1.5; position:relative; box-shadow:0 1px 1px rgba(0,0,0,.05); }
    .wa-bubble.received { background:#fff; align-self:flex-start; border-top-left-radius:0; }
    .wa-bubble.sent { background:var(--x-dcf8c6); align-self:flex-end; border-top-right-radius:0; }
    .wa-msg-time { font-size:var(--fs-cap); color:rgba(0,0,0,.45); float:right; margin:8px 0 -4px 8px; }
    
    .wa-input-area { padding:12px 20px; background:#f0f0f0; border-top:1px solid var(--border); display:flex; gap:10px; align-items:center; }
    .wa-input-area input { flex:1; border:none; padding:12px 16px; border-radius:var(--radius); font-size:var(--fs-base); outline:none; box-shadow:0 1px 2px rgba(0,0,0,.05); }
    .wa-btn-send { width:42px; height:42px; border-radius:50%; background:var(--brand); color:#fff; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; }
    .wa-btn-send:hover { background:var(--brand-mid); }
    .wa-empty-state { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--text-muted); background:var(--bg-card); }
    .wa-empty-state svg { width:64px; height:64px; opacity:0.2; margin-bottom:16px; }
    /* WhatsApp Context Panel */
    .wa-context { width:260px; min-width:260px; border-left:1px solid var(--border); display:flex; flex-direction:column; background:#fcfcfb; overflow-y:auto; transition:all .2s; }
    .wa-ctx-section { padding:14px 16px; border-bottom:1px solid var(--x-f0ede6); }
    .wa-ctx-title { font-size:var(--fs-cap); font-weight:600; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); margin-bottom:10px; display:flex; align-items:center; gap:6px; }
    .wa-ctx-value { font-size:var(--fs-base); font-weight:600; color:var(--brand); margin-bottom:2px; }
    .wa-ctx-sub { font-size:var(--fs-sm); color:var(--text-muted); margin-bottom:8px; }
    .wa-ctx-badge { display:inline-block; padding:2px 8px; border-radius:var(--radius); font-size:var(--fs-cap); font-weight:600; background:var(--x-e8f0eb); color:var(--brand); margin-bottom:8px; }
    .wa-ctx-btn { width:100%; padding:8px 10px; border:1px solid var(--border); border-radius:var(--radius); background:#fff; font-size:var(--fs-sm); font-weight:600; cursor:pointer; color:var(--brand); transition:all .2s; margin-top:6px; text-align:left; display:flex; align-items:center; gap:6px; }
    .wa-ctx-btn:hover { background:var(--brand); color:#fff; border-color:var(--brand); }
    .wa-ctx-btn.danger { color:var(--danger); border-color:var(--danger-border); }
    .wa-ctx-btn.danger:hover { background:var(--danger); color:#fff; border-color:var(--danger); }
    .wa-ctx-btn.primary { background:var(--brand); color:#fff; border-color:var(--brand); }
    .wa-ctx-btn.primary:hover { background:var(--forest-deep); }
    .wa-ctx-search { width:100%; padding:7px 10px; border:1px solid var(--border); border-radius:var(--radius); font-size:var(--fs-sm); outline:none; margin-bottom:6px; background:#fff; box-sizing:border-box; }
    .wa-ctx-search:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,169,110,.15);box-shadow:0 0 0 3px color-mix(in srgb,var(--x-c9a96e) 15%,transparent); }
    .wa-ctx-results { max-height:160px; overflow-y:auto; border:1px solid var(--border); border-radius:var(--radius); background:#fff; }
    .wa-ctx-result { padding:8px 10px; cursor:pointer; font-size:var(--fs-sm); border-bottom:1px solid var(--cream); transition:background .15s; }
    .wa-ctx-result:last-child { border-bottom:none; }
    .wa-ctx-result:hover { background:var(--x-e8f0eb); color:var(--brand); }
    .wa-ctx-result-name { font-weight:600; color:var(--brand); }
    .wa-ctx-result-sub { font-size:var(--fs-sm); color:var(--text-muted); margin-top:1px; }
    .wa-ctx-fin-item { display:flex; justify-content:space-between; align-items:center; padding:6px 0; border-bottom:1px solid var(--cream); font-size:var(--fs-sm); }
    .wa-ctx-fin-item:last-child { border-bottom:none; }
    .wa-ctx-empty { font-size:var(--fs-sm); color:var(--text-muted); text-align:center; padding:12px 0; font-style:italic; }
    .wa-ctx-media-group { margin-bottom:12px; }
    .wa-ctx-media-label { font-size:var(--fs-cap); font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); margin-bottom:6px; }
    .wa-ctx-img-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:4px; }
    .wa-ctx-img-grid a img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:4px; display:block; cursor:pointer; }
    .wa-ctx-audio-item { margin-bottom:6px; }
    .wa-ctx-audio-time { font-size:var(--fs-cap); color:var(--text-muted); margin-top:2px; }
    .wa-ctx-doc-item { display:flex; align-items:center; gap:6px; padding:6px 8px; background:var(--cream); border-radius:var(--radius); font-size:var(--fs-sm); color:var(--brand); text-decoration:none; margin-bottom:4px; overflow:hidden; }
    .wa-ctx-doc-item:hover { background:var(--x-e8f0eb); }
    .wa-ctx-doc-item span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    /* WhatsApp Cockpit Clara */
    .wa-monitor-footer { padding:6px 16px; background:var(--x-ede8e0); border-top:1px solid var(--border); font-size:10px; color:var(--text-muted); text-align:center; letter-spacing:.06em; flex-shrink:0; }
    .wa-clara-badge { display:flex; align-items:center; gap:6px; padding:6px 10px; border-radius:var(--radius); font-size:12px; font-weight:600; width:100%; box-sizing:border-box; }
    .wa-clara-badge.ativa { background:var(--x-e8f5e8); color:var(--forest); border:1px solid var(--x-a8c8a8); }
    .wa-clara-badge.pausada { background:var(--x-fff9ec); color:var(--x-856a00); border:1px solid var(--gold); }
    .wa-clara-badge.reassumida { background:var(--x-e8f0eb); color:var(--brand); border:1px solid rgba(20,54,38,.2);border:1px solid color-mix(in srgb,var(--forest-deep) 20%,transparent); }
    .wa-cmd-grid { display:grid; grid-template-columns:1fr 1fr; gap:5px; margin-bottom:6px; }
    .wa-cmd-btn { padding:7px 4px; border:1px solid var(--border); border-radius:var(--radius); background:#fff; color:var(--brand); font-size:10px; cursor:pointer; text-align:center; display:flex; flex-direction:column; align-items:center; gap:3px; transition:all .15s; line-height:1.2; }
    .wa-cmd-btn:hover { background:var(--brand); color:#fff; border-color:var(--brand); }
    .wa-cmd-btn svg { flex-shrink:0; }
    .wa-cmd-btn.wide { grid-column:1/-1; flex-direction:row; justify-content:center; gap:6px; }
    .wa-cmd-expand { background:var(--x-f8f6f0); border:1px solid var(--border); border-radius:var(--radius); padding:10px; margin-top:2px; display:none; }
    .wa-cmd-expand.open { display:block; }
    .wa-cmd-checks { display:grid; grid-template-columns:1fr 1fr; gap:3px; margin-bottom:7px; }
    .wa-cmd-check-label { display:flex; align-items:center; gap:4px; font-size:10px; color:var(--text-mid); cursor:pointer; }
    .wa-cmd-textarea { width:100%; font-size:11px; border:1px solid var(--border); border-radius:var(--radius); padding:5px 7px; resize:vertical; min-height:55px; box-sizing:border-box; background:#fff; color:var(--text-main); }
    .wa-cmd-preview { font-size:10px; background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:7px; color:var(--text-mid); line-height:1.5; margin-bottom:7px; font-style:italic; }
    .wa-ob-task { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:8px; margin-bottom:5px; }
    .wa-ob-task-status { font-size:10px; font-weight:600; padding:2px 7px; border-radius:10px; display:inline-block; margin-bottom:4px; }
    .wa-ob-task-status.rascunho { background:var(--x-fff9ec); color:var(--x-856a00); border:1px solid var(--gold); }
    .wa-ob-task-status.aprovada { background:var(--x-e8f5e8); color:var(--forest); border:1px solid var(--x-a8c8a8); }
    .wa-ob-task-status.enviada { background:var(--x-e8f0eb); color:var(--brand); border:1px solid rgba(20,54,38,.2);border:1px solid color-mix(in srgb,var(--forest-deep) 20%,transparent); }

    /* Modern enterprise visual layer */
    :root {
      --brand-950: var(--x-031b14);
      --brand-900: var(--x-06261d);
      --brand-850: var(--x-0a2f24);
      --brand-800: var(--x-0b382b);
      --brand-glass: rgba(8,38,29,.68);--brand-glass: color-mix(in srgb,var(--x-08261d) 68%,transparent);
      --surface: rgba(255,255,255,0.74);
      --surface-strong: rgba(255,255,255,0.88);
      --surface-dark: rgba(8,31,24,.72);--surface-dark: color-mix(in srgb,var(--x-081f18) 72%,transparent);
      --line-soft: rgba(255,255,255,0.12);
      --line-dark: rgba(3,27,20,.08);--line-dark: color-mix(in srgb,var(--x-031b14) 8%,transparent);
      --gold-glow: rgba(201,169,110,.34);--gold-glow: color-mix(in srgb,var(--x-c9a96e) 34%,transparent);
      --green-glow: rgba(31,84,56,.32);--green-glow: color-mix(in srgb,var(--x-1f5438) 32%,transparent);
      --shadow-premium: 0 24px 80px rgba(3,27,20,.14);--shadow-premium: 0 24px 80px color-mix(in srgb,var(--x-031b14) 14%,transparent);
      --shadow-cinema: 0 12px 32px rgba(27,62,47,.14);--shadow-cinema: 0 12px 32px color-mix(in srgb,var(--x-1b3e2f) 14%,transparent);
    }

    body {
      background: var(--cream);
      letter-spacing: -0.01em;
    }

    .view {
      isolation: isolate;
    }

    #loginView {
      position: relative;
      overflow: hidden;
      gap: clamp(2rem, 5vw, 5rem);
      padding: clamp(1.25rem, 3vw, 3rem);
      background: var(--forest-deep);
    }

    #loginView::before,
    #loginView::after,
    #appView::before,
    #appView::after {
      content: "";
      position: fixed;
      pointer-events: none;
      z-index: -1;
    }

    #loginView::before {
      width: 48rem;
      height: 48rem;
      right: -18rem;
      top: -18rem;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(201,169,110,.2), rgba(201,169,110,.04) 44%, transparent 70%);background: radial-gradient(circle, color-mix(in srgb,var(--x-c9a96e) 20%,transparent), color-mix(in srgb,var(--x-c9a96e) 4%,transparent) 44%, transparent 70%);
      filter: blur(10px);
    }

    #loginView::after {
      /* grade decorativa removida — ornamento ausente per marca FSC v2 */
      display: none;
    }

    .login-image-side {
      position: relative;
      width: min(48vw, 620px);
      border: 1px solid rgba(184,151,42,.14);border: 1px solid color-mix(in srgb,var(--gold) 14%,transparent);
      border-radius: var(--radius);
      overflow: hidden;
      background: var(--forest-deep);
      box-shadow: var(--shadow-md);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: stretch;
      gap: 2rem;
      padding: 2.5rem 0;
    }
    .login-panel-top {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: .75rem;
      padding: 0 2.5rem;
    }
    .login-panel-filete {
      flex: 1;
      height: 0.5px;
      background: linear-gradient(to right, transparent, rgba(184,151,42,.35), transparent);background: linear-gradient(to right, transparent, color-mix(in srgb,var(--gold) 35%,transparent), transparent);
    }
    .login-panel-dot {
      width: 5px;
      height: 5px;
      border: 0.8px solid rgba(184,151,42,.45);border: 0.8px solid color-mix(in srgb,var(--gold) 45%,transparent);
      transform: rotate(45deg);
      flex-shrink: 0;
    }

    .login-image-side::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(135deg, rgba(255,255,255,0.13), transparent 30%),
        radial-gradient(circle at 70% 22%, rgba(201,169,110,.18), transparent 26rem);
      opacity: 0.95;
    }

    .login-image-side::after {
      content: "";
      position: absolute;
      left: 8%;
      right: 8%;
      bottom: 8%;
      height: 1px;
      background: var(--gold-fill,var(--gold));
      box-shadow: 0 0 32px var(--gold-glow);
    }

    .login-brand {
      position: relative;
      z-index: 1;
      padding: 2rem;
    }

    .login-brand svg {
      filter: drop-shadow(0 12px 32px rgba(201,169,110,.18));filter: drop-shadow(0 12px 32px color-mix(in srgb,var(--x-c9a96e) 18%,transparent));
    }

    .login-img-content {
      position: absolute;
      z-index: 1;
      left: 2rem;
      right: 2rem;
      bottom: 2rem;
      padding: 2rem;
      border: 1px solid rgba(255,255,255,0.12);
      border-radius:var(--radius);
      background: rgba(2,15,11,0.42);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }

    .login-img-content h2 {
      color: var(--champ-light, var(--gold-light));
      font-family:var(--f-titulo,'Cormorant Garamond',serif);
      font-style: italic;
      font-size: clamp(1.75rem, 3.5vw, 2.75rem);
      line-height: 1.15;
      font-weight: 400;
      letter-spacing: 0.01em;
      margin-bottom: 1rem;
    }

    .login-img-content p {
      max-width: 34rem;
      color: rgba(205,178,85,0.78);
      font-size: 0.88rem;
      line-height: 1.85;
      font-weight: 400;
      letter-spacing: 0.03em;
    }

    /* ── ATMOSFERA — painel esquerdo (ornamento sem marca duplicada) ─── */
    .login-brand-atmosphere {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: 2.5rem 2.5rem 0;
      position: relative;
      z-index: 1;
    }
    .login-atm-ornament {
      display: flex;
      align-items: center;
      gap: .6rem;
      margin-bottom: 1rem;
    }
    .login-atm-sub {
      font-family:var(--f-titulo,'Cinzel',serif);
      font-weight: 400;
      font-size: .6rem;
      letter-spacing: 0.38em;
      text-transform: uppercase;
      color: rgba(184,151,42,.48);color: color-mix(in srgb,var(--gold) 48%,transparent);
    }

    /* ── IDENTIDADE FSC — painel direito, composição limpa ─────────── */
    .fsc-identity {
      width: 100%;
      text-align: center;
      padding: .25rem 0;
      margin-bottom: 0;
    }
    .fsc-identity-mono {
      font-family:var(--f-titulo,'Cormorant Garamond',serif);
      font-style: italic;
      font-weight: 400;
      font-size: 3.75rem;
      line-height: 1;
      letter-spacing: -0.04em;
      color: var(--forest-deep);
      margin-bottom: .4rem;
    }
    .fsc-identity-line {
      width: 56px;
      height: 0.6px;
      background: var(--forest-mid, var(--forest));
      opacity: 0.40;
      margin: .7rem auto .7rem;
    }
    .fsc-identity-name {
      font-family:var(--f-titulo,'Cinzel',serif);
      font-weight: 500;
      font-size: .75rem;
      letter-spacing: 0.28em;
      color: var(--forest-deep);
      text-transform: uppercase;
      line-height: 1.6;
    }
    .fsc-identity-cred {
      font-family:var(--f-titulo,'Cinzel',serif);
      font-weight: 400;
      font-size: .6rem;
      letter-spacing: 0.40em;
      color: var(--forest);
      text-transform: uppercase;
      margin-top: .35rem;
    }

    /* ── TYPEWRITER — frases jurídicas ─────────────────────────────── */
    .login-typewriter-wrap {
      position: relative;
      z-index: 1;
      margin: 0 1.75rem;
      padding: 1.75rem 2rem;
      border: 1px solid rgba(184,151,42,.2);border: 1px solid color-mix(in srgb,var(--gold) 20%,transparent);
      border-radius: var(--radius);
      background: rgba(2,12,9,0.48);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
    }
    .login-tw-label {
      font-family:var(--f-titulo,'Cinzel',serif);
      font-weight: 400;
      font-size: 0.62rem;
      letter-spacing: 0.38em;
      text-transform: uppercase;
      color: rgba(184,151,42,.55);color: color-mix(in srgb,var(--gold) 55%,transparent);
      margin-bottom: 1rem;
    }
    .login-tw-text {
      font-family:var(--f-titulo,'Cormorant Garamond',serif);
      font-style: italic;
      font-weight: 400;
      font-size: clamp(1.3rem, 2.5vw, 1.72rem);
      line-height: 1.45;
      color: #fffaf1;
      letter-spacing: 0.01em;
      /* inline para cursor ficar na mesma linha */
      display: inline;
    }
    .login-tw-cursor {
      font-family:var(--f-titulo,'Cormorant Garamond',serif);
      font-style: italic;
      font-size: clamp(1.3rem, 2.5vw, 1.72rem);
      color: var(--gold);
      animation: tw-blink 0.75s step-end infinite;
    }
    @keyframes tw-blink { 0%,100%{opacity:1} 50%{opacity:0} }
    .login-tw-source {
      font-family:var(--f-titulo,'Cinzel',serif);
      font-weight: 400;
      font-size: 0.65rem;
      letter-spacing: 0.26em;
      color: rgba(184,151,42,.55);color: color-mix(in srgb,var(--gold) 55%,transparent);
      margin-top: .75rem;
      min-height: 1rem;
      text-transform: uppercase;
    }

    /* bookplate pesado removido — substituído por .fsc-identity */

    .login-form-side {
      width: min(92vw, 460px);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .login-box {
      max-width: 460px;
      padding: 2.75rem;
      /* creme — paleta oficial FSC; branco puro proibido em contexto institucional */
      border: 1px solid rgba(184,151,42,.35);
      border-radius:var(--radius);
      background:
        linear-gradient(180deg, rgba(242,234,211,0.97), rgba(242,234,211,0.90)),
        radial-gradient(circle at top left, rgba(201,169,110,.18), transparent 18rem);
      box-shadow: 0 28px 90px rgba(0,0,0,0.28), inset 0 1px 0 rgba(242,234,211,0.9);
      backdrop-filter: blur(24px);
      -webkit-backdrop-filter: blur(24px);
      transform: translateY(0);
      animation: premium-rise .6s cubic-bezier(0.16, 1, 0.3, 1) both;
    }

    .login-icon {
      width: 58px;
      height: 58px;
      border-radius: var(--radius);
      background: var(--forest);
      box-shadow: 0 4px 12px rgba(27,62,47,.2);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-1b3e2f) 20%,transparent);
    }

    .login-box h1 {
      /* Cinzel 500 — wordmark per marca FSC v2 */
      font-family:var(--f-titulo,'Cinzel',serif);
      font-style: normal;
      font-weight: 500;
      font-size: 1.02rem;
      letter-spacing: 0.26em;
      text-transform: uppercase;
      color: var(--forest-deep);
    }

    .login-box .tagline {
      /* Cinzel 400 — credencial per marca FSC v2 */
      font-family:var(--f-titulo,'Cinzel',serif);
      font-weight: 400;
      color: var(--forest);
      letter-spacing: 0.38em;
    }

    .login-divider {
      width: 64px;
      height: 1px;
      background: var(--gold-fill,var(--gold));
      opacity: 0.5;
    }

    .btn-ms,
    .btn-demo,
    .btn-crm-primary,
    .btn-crm-gold,
    .btn-crm-secondary,
    .btn-icon,
    .nav-btn,
    input,
    select,
    textarea,
    .card,
    .modal-box,
    .wa-layout {
      will-change: box-shadow, background;
    }

    .btn-ms {
      min-height: 48px;
      border-radius:var(--radius);
      background: var(--forest);
      box-shadow: 0 4px 12px rgba(27,62,47,.18);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-1b3e2f) 18%,transparent);
    }

    .btn-ms:hover {
      background: var(--brand-hover);
      box-shadow: 0 4px 12px rgba(27,62,47,.2);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-1b3e2f) 20%,transparent);
    }

    .btn-demo {
      min-height: 46px;
      border: 1px solid rgba(3,27,20,.08);border: 1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent);
      border-radius:var(--radius);
      background: rgba(255,255,255,0.52);
      color: rgba(7,26,19,.72);color: color-mix(in srgb,var(--x-071a13) 72%,transparent);
    }

    .btn-demo:hover {
      background: rgba(201,169,110,.12);background: color-mix(in srgb,var(--x-c9a96e) 12%,transparent);
      color: var(--brand-950);
      transform: translateY(-1px);
    }

    .login-security-badge {
      margin-top: 1.2rem;
      display: inline-flex;
      align-items: center;
      gap: 0.55rem;
      padding: 0.68rem 0.9rem;
      border: 1px solid rgba(3,27,20,.08);border: 1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent);
      border-radius: 999px;
      background: rgba(255,255,255,0.48);
      color: rgba(7,26,19,.62);color: color-mix(in srgb,var(--x-071a13) 62%,transparent);
      font-size: 0.72rem;
      font-weight: 600;
    }

    .login-security-badge svg {
      width: 15px;
      height: 15px;
      fill: var(--gold-dark);
    }

    #appView {
      position: relative;
      overflow-x: clip; /* clip não cria scroll container, preserva position:sticky da sidebar */
      background: var(--cream);
    }

    #appView::before {
      inset: 0;
      background-image:
        linear-gradient(rgba(3,27,20,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(3,27,20,.035) 1px, transparent 1px);
      background-size: 72px 72px;
      mask-image: linear-gradient(to bottom, rgba(0,0,0,0.45), transparent 62%);
    }

    #appView::after {
      width: 32rem;
      height: 32rem;
      right: -14rem;
      top: 8rem;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(201,169,110,.16), transparent 68%);background: radial-gradient(circle, color-mix(in srgb,var(--x-c9a96e) 16%,transparent), transparent 68%);
      filter: blur(8px);
    }

    .sidebar {
      background:
        radial-gradient(circle at 24% 0%, rgba(201,169,110,.18), transparent 18rem),
        linear-gradient(180deg, rgba(2,15,11,0.98), rgba(6,38,29,.96) 58%, rgba(3,27,20,.98));
      border-right: 1px solid rgba(255,255,255,0.1);
      box-shadow: 18px 0 70px rgba(3,27,20,.24);box-shadow: 18px 0 70px color-mix(in srgb,var(--x-031b14) 24%,transparent);
      backdrop-filter: blur(22px);
      -webkit-backdrop-filter: blur(22px);
    }

    .sidebar::after {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      width: 1px;
      background: linear-gradient(to bottom, transparent, rgba(201,169,110,.42), transparent);background: linear-gradient(to bottom, transparent, color-mix(in srgb,var(--x-c9a96e) 42%,transparent), transparent);
    }

    .sidebar-logo {
      padding: 1.45rem 1.15rem;
      border-bottom: 1px solid rgba(255,255,255,0.09);
    }

    .sidebar-icon {
      border-radius:6px;
      background: rgba(184,151,42,.06);background: color-mix(in srgb,var(--gold) 6%,transparent);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 14px 34px rgba(0,0,0,0.22);
    }

    .sidebar-brand-name {
      font-family:var(--f-titulo,'Cinzel',serif);
      letter-spacing: .26em;
    }

    .nav-btn {
      border: 1px solid transparent;
      border-radius:var(--radius);
      color: rgba(255,250,241,0.64);
    }

    .nav-btn:hover {
      background: rgba(255,255,255,0.06);
      border-color: rgba(255,255,255,0.08);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
    }

    .nav-btn.active {
      border-left: 0;
      padding-left: 1rem;
      background:
        linear-gradient(90deg, rgba(201,169,110,.22), rgba(255,255,255,0.055)),
        rgba(255,255,255,0.05);
      border-color: rgba(201,169,110,.22);border-color: color-mix(in srgb,var(--x-c9a96e) 22%,transparent);
      box-shadow: 0 12px 32px rgba(0,0,0,0.14), inset 0 1px 0 rgba(255,255,255,0.12);
    }

    .crm-main {
      position: relative;
      z-index: 1;
    }

    .crm-header {
      background: rgba(248,246,240,.76);background: color-mix(in srgb,var(--x-f8f6f0) 76%,transparent);
      border-bottom: 1px solid rgba(3,27,20,.08);border-bottom: 1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent);
      box-shadow: 0 16px 52px rgba(3,27,20,.05);box-shadow: 0 16px 52px color-mix(in srgb,var(--x-031b14) 5%,transparent);
      backdrop-filter: blur(22px) saturate(130%);
      -webkit-backdrop-filter: blur(22px) saturate(130%);
    }

    .crm-header h2 {
      font-family:var(--f-ui,'Inter',sans-serif);
      font-size: 1.42rem;
      letter-spacing: -0.04em;
      color: var(--x-071a13);
    }

    .crm-header-sub {
      color: rgba(7,26,19,.52);color: color-mix(in srgb,var(--x-071a13) 52%,transparent);
    }

    .crm-content {
      padding: 2rem;
    }

    .card,
    .wa-layout {
      border: 1px solid rgba(255,255,255,0.68);
      background:
        linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.58)),
        radial-gradient(circle at top left, rgba(201,169,110,.08), transparent 18rem);
      box-shadow: 0 18px 55px rgba(3,27,20,.075), inset 0 1px 0 rgba(255,255,255,0.8);box-shadow: 0 18px 55px color-mix(in srgb,var(--x-031b14) 7.5%,transparent), inset 0 1px 0 rgba(255,255,255,0.8);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .card {
      border-radius:var(--radius);
    }

    .card:hover {
      transform: translateY(-2px);
      box-shadow: 0 24px 72px rgba(3,27,20,.11), inset 0 1px 0 rgba(255,255,255,0.86);box-shadow: 0 24px 72px color-mix(in srgb,var(--x-031b14) 11%,transparent), inset 0 1px 0 rgba(255,255,255,0.86);
    }

    .card-accent {
      position: relative;
      border-top: 1px solid rgba(255,255,255,0.68);
      overflow: hidden;
    }

    .card-accent::before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      height: 2px;
      background: var(--gold-fill,var(--gold));
      box-shadow: 0 0 24px var(--gold-glow);
    }

    .card h3,
    .modal-box h3 {
      font-family:var(--f-ui,'Inter',sans-serif) !important;
      letter-spacing: -0.03em;
    }

    table {
      border-collapse: separate;
      border-spacing: 0;
    }

    thead th {
      background: rgba(255,255,255,0.34);
      color: rgba(7,26,19,.46);color: color-mix(in srgb,var(--x-071a13) 46%,transparent);
      border-bottom: 1px solid rgba(3,27,20,.06);border-bottom: 1px solid color-mix(in srgb,var(--x-031b14) 6%,transparent);
    }

    tbody tr {
      border-bottom: 1px solid rgba(3,27,20,.055);border-bottom: 1px solid color-mix(in srgb,var(--x-031b14) 5.5%,transparent);
    }

    tbody tr:hover {
      background: rgba(255,255,255,0.48);
    }

    input,
    select,
    textarea,
    .ql-container.ql-snow {
      border-color: rgba(3,27,20,.09);border-color: color-mix(in srgb,var(--x-031b14) 9%,transparent);
      border-radius:var(--radius);
      background: rgba(255,255,255,0.56);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.72);
    }

    input:focus,
    select:focus,
    textarea:focus,
    .ql-container.ql-snow.ql-active {
      border-color: rgba(201,169,110,.72);border-color: color-mix(in srgb,var(--x-c9a96e) 72%,transparent);
      background: rgba(255,255,255,0.88);
      box-shadow: 0 0 0 4px rgba(201,169,110,.13), 0 12px 30px rgba(3,27,20,.06);box-shadow: 0 0 0 4px color-mix(in srgb,var(--x-c9a96e) 13%,transparent), 0 12px 30px color-mix(in srgb,var(--x-031b14) 6%,transparent);
    }

    .btn-crm-primary {
      border-radius:var(--radius);
      background: var(--forest);
      box-shadow: 0 4px 12px rgba(27,62,47,.18);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-1b3e2f) 18%,transparent);
    }

    .btn-crm-gold {
      border-radius:var(--radius);
      background: var(--gold-fill,var(--gold));
      box-shadow: 0 4px 12px rgba(196,168,106,.2);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-c4a86a) 20%,transparent);
    }

    .btn-crm-secondary {
      border-radius:var(--radius);
      background: rgba(255,255,255,0.54);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    .badge {
      border-radius: 999px;
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.34);
    }

    .modal-overlay {
      background:
        radial-gradient(circle at 50% 20%, rgba(201,169,110,.14), transparent 28rem),
        rgba(2,15,11,0.68);
    }

    .modal-box {
      border-radius:var(--radius);
      border: 1px solid rgba(255,255,255,0.68);
      background:
        linear-gradient(180deg, rgba(255,255,255,0.92), rgba(255,255,255,0.78)),
        radial-gradient(circle at top left, rgba(201,169,110,.1), transparent 20rem);
      box-shadow: 0 42px 120px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.88);
      backdrop-filter: blur(24px);
      -webkit-backdrop-filter: blur(24px);
    }

    .wa-layout {
      border-radius:var(--radius);
      overflow: hidden;
    }

    .wa-sidebar,
    .wa-main-header,
    .wa-input-area,
    .wa-empty-state {
      background: rgba(255,255,255,0.52);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
    }

    .wa-main {
      background:
        radial-gradient(circle at 20% 10%, rgba(201,169,110,.14), transparent 18rem),
        linear-gradient(135deg, rgba(239,234,226,.72), rgba(228,224,216,.72));
    }

    .wa-messages {
      background-image:
        radial-gradient(circle at top right, rgba(201,169,110,.12), transparent 22rem),
        linear-gradient(135deg, rgba(255,255,255,0.22), rgba(255,255,255,0.04));
      opacity: 1;
    }

    .wa-bubble {
      border: 1px solid rgba(255,255,255,0.42);
      box-shadow: 0 10px 26px rgba(3,27,20,.08);box-shadow: 0 10px 26px color-mix(in srgb,var(--x-031b14) 8%,transparent);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
    }

    .wa-bubble.received { background: rgba(255,255,255,0.8); }
    .wa-bubble.sent { background: rgba(201,169,110,.24);background: color-mix(in srgb,var(--x-c9a96e) 24%,transparent); }

    .settings-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
      gap: 1.25rem;
    }

    .settings-stack {
      display: grid;
      gap: 1.25rem;
    }

    .settings-card {
      padding: 1.35rem;
    }

    .settings-card h3 {
      font-size: 1rem;
      color: var(--brand);
      margin-bottom: 0.35rem;
    }

    .settings-card p {
      color: var(--text-muted);
      font-size: 0.86rem;
      line-height: 1.65;
    }

    .settings-form-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 1rem;
      margin-top: 1.1rem;
    }

    .settings-form-grid label,
    .settings-field label {
      display: block;
      margin-bottom: 0.35rem;
      color: rgba(7,26,19,.62);color: color-mix(in srgb,var(--x-071a13) 62%,transparent);
      font-size: 0.74rem;
      font-weight:600;
      letter-spacing: 0.04em;
      text-transform: uppercase;
    }

    .settings-field {
      margin-top: 1rem;
    }

    .settings-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      padding: 1rem 0;
      border-bottom: 1px solid rgba(3,27,20,.07);border-bottom: 1px solid color-mix(in srgb,var(--x-031b14) 7%,transparent);
    }

    .settings-row:last-child {
      border-bottom: 0;
      padding-bottom: 0;
    }

    .settings-row strong {
      display: block;
      color: var(--brand);
      font-size: 0.92rem;
      margin-bottom: 0.2rem;
    }

    .settings-row span {
      display: block;
      color: var(--text-muted);
      font-size: 0.8rem;
      line-height: 1.5;
    }

    .toggle {
      position: relative;
      width: 46px;
      height: 26px;
      flex: 0 0 auto;
    }

    .toggle input {
      opacity: 0;
      width: 0;
      height: 0;
    }

    .toggle span {
      position: absolute;
      inset: 0;
      border-radius: 999px;
      background: rgba(3,27,20,.14);background: color-mix(in srgb,var(--x-031b14) 14%,transparent);
      border: 1px solid rgba(3,27,20,.08);border: 1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent);
      cursor: pointer;
      transition: all 0.2s ease;
    }

    .toggle span::before {
      content: "";
      position: absolute;
      width: 20px;
      height: 20px;
      left: 2px;
      top: 2px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 4px 12px rgba(3,27,20,.18);box-shadow: 0 4px 12px color-mix(in srgb,var(--x-031b14) 18%,transparent);
      transition: transform 0.2s ease;
    }

    .toggle input:checked + span {
      background: var(--forest);
      box-shadow: none;
    }

    .toggle input:checked + span::before {
      transform: translateX(20px);
    }

    .settings-status {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      padding: 1rem;
      border-radius:var(--radius);
      background: var(--success-bg);
      border: 1px solid var(--success-border);
      color: var(--success);
      font-size: 0.86rem;
      font-weight: 600;
    }

    .settings-status-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: var(--success);
      box-shadow: 0 0 0 6px rgba(37,73,47,.1);box-shadow: 0 0 0 6px color-mix(in srgb,var(--forest) 10%,transparent);
    }

    .spinner {
      border-color: rgba(201,169,110,.18);border-color: color-mix(in srgb,var(--x-c9a96e) 18%,transparent);
      border-top-color: var(--gold);
      box-shadow: 0 0 18px rgba(201,169,110,.2);box-shadow: 0 0 18px color-mix(in srgb,var(--x-c9a96e) 20%,transparent);
    }

    ::-webkit-scrollbar-thumb {
      background: rgba(11,35,24,.18);background: color-mix(in srgb,var(--x-0b2318) 18%,transparent);
    }

    @keyframes premium-rise {
      from { opacity: 0; transform: translateY(14px) scale(0.985); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    @keyframes fade-in-scale {
      from { opacity: 0; transform: translateY(14px) scale(0.96); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }

    @media(max-width:900px) {
      #loginView.active {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        padding-top: 2rem;
      }
      .login-image-side {
        width: min(92vw, 560px);
        min-height: 320px;
      }
      .login-img-content {
        left: 1rem;
        right: 1rem;
        bottom: 1rem;
        padding: 1.25rem;
      }
      .login-img-content h2 {
        font-size: 2rem;
      }
      .login-form-side {
        width: min(92vw, 460px);
      }
      /* NOTA: regras de .sidebar/.nav-btn/.crm-main removidas daqui — o drawer
         mobile é controlado pelos blocos @media 1024px/768px (F-01). O bloco
         legado de 82px sobrescrevia aquelas regras e quebrava a navegação. */
      .settings-grid {
        grid-template-columns: 1fr;
      }
      .settings-form-grid {
        grid-template-columns: 1fr;
      }
    }

    @media(max-width:640px) {
      .login-image-side {
        display: none;
      }
      #loginView.active {
        justify-content: center;
      }
      .login-box {
        padding: 2rem 1.4rem;
      }
      .crm-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.9rem;
      }
      .crm-content {
        padding-top: 1rem;
      }
    }

    /* ────── APP REFINEMENTS ────── */
    :root {
      --space-1: 4px;
      --space-2: 8px;
      --space-3: 12px;
      --space-4: 16px;
      --space-5: 24px;
      --space-6: 32px;
    }

    body, button, input, select, textarea {
      font-family:var(--f-ui,'Inter',sans-serif);
      transition: all .2s ease;
    }

    button, .btn-icon, .nav-btn {
      transition: box-shadow .2s ease, transform .2s ease, background .2s ease, color .2s ease;
    }

    button:focus-visible,
    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible {
      outline: 2px solid rgba(201,169,110,.35);outline: 2px solid color-mix(in srgb,var(--x-c9a96e) 35%,transparent);
      outline-offset: 2px;
    }

    input::placeholder,
    textarea::placeholder {
      color: rgba(26,26,23,0.38);
    }

    #appView {
      background: var(--cream);
    }

    .crm-content {
      padding: var(--space-5);
      max-width: 1440px;
      margin: 0 auto;
    }

    .crm-header {
      padding: var(--space-4) var(--space-4);
    }

    .crm-header-title h2 {
      font-size: clamp(1.4rem, 1.5vw, 1.65rem);
      letter-spacing: -0.03em;
    }

    .crm-header-sub {
      font-size: 0.92rem;
      color: rgba(7,26,19,.62);color: color-mix(in srgb,var(--x-071a13) 62%,transparent);
      max-width: 58ch;
    }

    .filter-panel {
      display: flex;
      flex-wrap: wrap;
      gap: var(--space-3);
      align-items: center;
      padding: var(--space-4);
      margin-bottom: var(--space-4);
      background: rgba(255,255,255,0.82);
      border: 1px solid rgba(3,27,20,.08);border: 1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.65);
    }

    .filter-panel input,
    .filter-panel select {
      min-width: 220px;
      max-width: 320px;
      border-radius:var(--radius);
      padding: 12px 14px;
      background: rgba(255,255,255,0.82);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.85);
    }

    .section-header {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: flex-start;
      gap: var(--space-4);
      margin-bottom: var(--space-4);
    }

    .section-header h3 {
      margin: 0;
      font-size: 1.05rem;
      color: var(--brand);
      letter-spacing: -0.02em;
    }

    .section-header .section-meta {
      color: rgba(7,26,19,.58);color: color-mix(in srgb,var(--x-071a13) 58%,transparent);
      font-size: 0.92rem;
      line-height: 1.6;
      max-width: 46ch;
    }

    .card {
      border-radius:var(--radius);
      overflow: hidden;
    }

    .card table {
      width: 100%;
      border-collapse: separate;
      border-spacing: 0;
      min-width: 720px;
    }

    .card table thead th {
      position: sticky;
      top: 0;
      z-index: 2;
      background: rgba(255,255,255,0.88);
      color: rgba(7,26,19,.65);color: color-mix(in srgb,var(--x-071a13) 65%,transparent);
    }

    .card table tbody tr {
      transition: background .2s ease, transform .2s ease;
    }

    .card table tbody tr:hover {
      background: rgba(200,169,110,.09);background: color-mix(in srgb,var(--x-c8a96e) 9%,transparent);
      transform: translateY(-1px);
    }

    .card table tbody td {
      padding: 12px 14px;
      vertical-align: middle;
      color: var(--text-mid);
      line-height: 1.45;
    }

    .card table tbody td:first-child {
      font-weight: 600;
      color: var(--brand);
    }

    .card table tbody tr:last-child td {
      border-bottom: none;
    }

    .nav-btn {
      padding: 0.95rem 1rem;
      font-size: 0.92rem;
      letter-spacing: -0.01em;
      color: rgba(255,255,255,0.8);
      border-radius:var(--radius);
      border: 1px solid transparent;
    }

    .nav-btn:hover {
      background: rgba(255,255,255,0.08);
      border-color: rgba(255,255,255,0.12);
      color: #fff;
    }

    .nav-btn.active {
      background: linear-gradient(90deg, rgba(201,169,110,.18), rgba(255,255,255,0.08));background: linear-gradient(90deg, color-mix(in srgb,var(--x-c9a96e) 18%,transparent), rgba(255,255,255,0.08));
      border-color: rgba(201,169,110,.22);border-color: color-mix(in srgb,var(--x-c9a96e) 22%,transparent);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
      color: #fff;
      font-weight: 600;
    }

    .nav-count {
      margin-left: auto;
      font-size: 0.72rem;
      padding: 0.2rem 0.65rem;
      border-radius: 999px;
    }

    .sidebar-logo {
      padding: 1.35rem 1.15rem;
    }

    .sidebar-brand-name {
      font-size: .62rem;
      letter-spacing: .26em;
    }

    .sidebar-brand-sub,
    .sidebar-nav-label,
    .user-email {
      color: rgba(255,255,255,0.58);
    }

    .crm-header-actions {
      gap: var(--space-3);
    }

    .btn-crm-primary,
    .btn-crm-gold,
    .btn-crm-secondary {
      min-height: 44px;
      border-radius:var(--radius);
      padding: 0 18px;
      font-size: 0.92rem;
    }

    .btn-icon {
      border-radius:var(--radius);
      padding: 0.65rem 0.75rem;
    }

    .modal-box {
      width: min(720px, calc(100vw - 40px));
      max-height: 92vh;
      padding: 28px;
    }

    .modal-box form {
      display: grid;
      gap: var(--space-4);
    }

    .modal-box label {
      font-size: 0.82rem;
      color: rgba(7,26,19,.72);color: color-mix(in srgb,var(--x-071a13) 72%,transparent);
      font-weight:600;
      margin-bottom: 0.35rem;
      display: block;
      letter-spacing: 0.01em;
      text-transform: uppercase;
    }

    .modal-box input,
    .modal-box select,
    .modal-box textarea {
      width: 100%;
      padding: 12px 14px;
      border-radius:var(--radius);
      background: rgba(255,255,255,0.9);
      border: 1px solid rgba(3,27,20,.08);border: 1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent);
    }

    .modal-box textarea {
      min-height: 100px;
      resize: vertical;
    }

    .card-accent {
      overflow: visible;
    }

    .card-accent::before {
      top: 0;
      height: 3px;
    }

    .card .section-header {
      margin-bottom: 1rem;
    }

    @media (max-width: 1024px) {
      .filter-panel {
        padding: 18px 16px;
      }
      .card table {
        min-width: 100%;
      }
    }

    /* ══════════════════════════════════════════════════════
       MOBILE FASE 2 — modais (item 4), abas de ficha (item 6),
       barras de filtro (item 7)
    ══════════════════════════════════════════════════════ */

    /* Item 7 — filtros em grid 2 colunas (busca ocupa a linha inteira) em vez
       de selects estreitos empilhados consumindo ~300px de altura. */
    @media (max-width: 768px) {
      .filter-panel {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: .6rem;
        align-items: stretch;
      }
      .filter-panel input,
      .filter-panel select {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100%;
      }
      .filter-panel input[type="text"],
      .filter-panel input[type="search"],
      .filter-panel input[id^="search"] {
        grid-column: 1 / -1;
      }

      .fin-filter-bar {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: .5rem;
      }
      .fin-filter-bar .fin-search-wrap { grid-column: 1 / -1; }
      .fin-filter-bar select { width: 100% !important; }
      .fin-filter-bar > button,
      .fin-filter-bar > span { grid-column: 1 / -1; margin-left: 0 !important; }

      /* Item 9 — Visão Executiva: gráfico + alertas empilham (1 coluna) para o
         card de alertas não espremer e o eixo X do gráfico ficar legível. */
      .fin-exec-charts { grid-template-columns: 1fr !important; }

      /* Item 8 — Kanbans (Quadro e Esteira) ganham scroll-snap + fade nas bordas
         indicando que há mais colunas para o lado. */
      .qd-board, #leadsEsteira {
        scroll-snap-type: x proximity;
        background:
          linear-gradient(to right, var(--cream) 30%, rgba(255,255,255,0)) left,
          linear-gradient(to left, var(--cream) 30%, rgba(255,255,255,0)) right,
          radial-gradient(farthest-side at 0 50%, rgba(3,27,20,.12), rgba(0,0,0,0)) left,
          radial-gradient(farthest-side at 100% 50%, rgba(3,27,20,.12), rgba(0,0,0,0)) right;
        background-repeat: no-repeat;
        background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%;
        background-attachment: local, local, scroll, scroll;
      }
      .qd-col, #leadsEsteira > div { scroll-snap-align: start; }

      /* Item 12 — nome da pessoa quebra em até 2 linhas em vez de truncar cedo
         com "…", aproveitando a largura livre ao lado do badge. */
      .pess-card-nome {
        white-space: normal !important;
        overflow: hidden !important;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        line-height: 1.25;
      }
    }

    /* Item 6 — barra de abas da ficha com fade à direita indicando scroll */
    .ficha-aba-wrap { position: relative; }
    .ficha-aba-wrap::after {
      content: '';
      position: absolute;
      right: 0; top: 0; bottom: 1px;
      width: 40px;
      background: linear-gradient(to left, #fff, transparent);
      pointer-events: none;
      z-index: 1;
    }
    .ficha-aba-scroll { scrollbar-width: none; }
    .ficha-aba-scroll::-webkit-scrollbar { display: none; }

    /* Item 4 — modais full-screen com formulários em 1 coluna no celular */
    @media (max-width: 640px) {
      .modal-box {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh;
        max-height: 100dvh !important;
        border-radius: 0 !important;
      }
      /* Grids inline de formulário (grid-template-columns:1fr 1fr…) → 1 coluna */
      .modal-box [style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
      }
      /* Botão fechar (×) com área de toque mínima de 44×44px */
      .modal-close,
      .btn-modal-close {
        min-width: 44px;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1.6rem;
      }
    }

    /* ══════════════════════════════════════════════════════
       PLATAFORMA JURÍDICA v3 — Enterprise Density & Clarity
    ══════════════════════════════════════════════════════ */

    /* — Density base — */
    .crm-content { padding: 1.25rem 1.5rem; max-width: 1440px; }

    .crm-header {
      min-height: 60px;
      padding: 0 1.25rem;
      display: flex;
      align-items: center;
    }

    .crm-header h2 {
      font-size: clamp(1.15rem, 1.4vw, 1.42rem);
      letter-spacing: -0.04em;
    }

    .crm-header-sub {
      font-size: 0.8rem;
      margin-top: 0.05rem;
    }

    /* — Cards — */
    .card { border-radius:var(--radius) !important; }

    .card:hover {
      transform: translateY(-1px);
      box-shadow: 0 20px 60px rgba(3,27,20,.09), inset 0 1px 0 rgba(255,255,255,0.86) !important;box-shadow: 0 20px 60px color-mix(in srgb,var(--x-031b14) 9%,transparent), inset 0 1px 0 rgba(255,255,255,0.86) !important;
    }

    /* — KPI Card Structure — */
    .kpi-card {
      padding: 1.1rem 1.2rem !important;
      display: flex !important;
      flex-direction: column;
      gap: 0.25rem;
      position: relative;
    }

    .kpi-icon {
      position: absolute;
      top: 1rem;
      right: 1rem;
      width: 32px;
      height: 32px;
      border-radius: 9px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(3,27,20,.05);background: color-mix(in srgb,var(--x-031b14) 5%,transparent);
    }

    .kpi-icon svg {
      width: 15px;
      height: 15px;
      stroke: var(--brand);
      opacity: 0.55;
      fill: none;
      stroke-width: 1.8;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .kpi-label {
      font-size: 9.5px !important;
      font-weight:600 !important;
      text-transform: uppercase !important;
      letter-spacing: 0.11em !important;
      color: rgba(7,26,19,.48) !important;color: color-mix(in srgb,var(--x-071a13) 48%,transparent) !important;
      margin-bottom: 0 !important;
    }

    .kpi-value {
      font-family:var(--f-ui,'Inter',sans-serif) !important;
      font-size: 1.85rem !important;
      font-weight:600 !important;
      letter-spacing: -0.05em !important;
      line-height: 1.05 !important;
      color: var(--brand) !important;
      margin: 0 !important;
    }

    .kpi-meta {
      font-size: 0.7rem !important;
      color: rgba(7,26,19,.44) !important;color: color-mix(in srgb,var(--x-071a13) 44%,transparent) !important;
      margin-top: 0.1rem !important;
      display: flex;
      align-items: center;
      gap: 0.45rem;
    }

    .kpi-pill {
      display: inline-flex;
      align-items: center;
      gap: 0.18rem;
      padding: 0.12rem 0.48rem;
      border-radius:var(--radius);
      font-size: 0.67rem;
      font-weight:600;
      line-height: 1.5;
      letter-spacing: 0.02em;
    }

    .kpi-pill.up     { background: var(--success-bg);   color: var(--success); }
    .kpi-pill.down   { background: var(--danger-bg);  color: var(--danger); }
    .kpi-pill.neutral{ background: rgba(201,169,110,.13);background: color-mix(in srgb,var(--x-c9a96e) 13%,transparent);color: var(--gold-dark); }

    /* — Tables — tighter & cleaner — */
    .card table thead th {
      padding: 9px 14px !important;
      font-size: 10px !important;
      letter-spacing: 0.09em;
      color: rgba(7,26,19,.44) !important;color: color-mix(in srgb,var(--x-071a13) 44%,transparent) !important;
      background: rgba(255,255,255,0.6) !important;
    }

    .card table tbody td {
      padding: 10px 14px !important;
      font-size: 13.5px !important;
      line-height: 1.4;
    }

    .card table tbody tr:hover {
      background: rgba(201,169,110,.065) !important;background: color-mix(in srgb,var(--x-c9a96e) 6.5%,transparent) !important;
      transform: none !important;
    }

    .card table tbody tr:hover td {
      transform: none !important;
    }

    /* — Filter / Toolbar panel — */
    .filter-panel {
      padding: 10px 14px !important;
      border-radius:var(--radius) !important;
      gap: 8px !important;
      margin-bottom: 10px !important;
      background: rgba(255,255,255,0.7) !important;
    }

    .filter-panel input,
    .filter-panel select {
      min-width: 160px !important;
      max-width: 240px !important;
      padding: 8px 11px !important;
      font-size: 13px !important;
      border-radius: 9px !important;
    }

    /* — Pill toggle para filtros — */
    .pill-filter-btn {
      display: inline-flex;
      align-items: center;
      gap: .3rem;
      padding: 6px 13px;
      border-radius:var(--radius);
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text-mid);
      font-size: 12px;
      font-weight: 500;
      cursor: pointer;
      white-space: nowrap;
      user-select: none;
      transition: all .18s ease;
      letter-spacing: .01em;
    }
    .pill-filter-btn:hover {
      border-color: var(--gold);
      color: var(--brand);
      background: rgba(201,169,110,.07);background: color-mix(in srgb,var(--x-c9a96e) 7%,transparent);
    }
    .pill-filter-btn.active {
      border-color: var(--gold);
      background: var(--gold-light);
      color: var(--brand);
      font-weight: 600;
    }
    .pill-filter-btn .pill-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      background: var(--border);
      transition: background .18s;
    }
    .pill-filter-btn.active .pill-dot {
      background: var(--gold-dark);
    }

    /* — Sidebar nav — refined & compact — */
    .sidebar-nav {
      padding: 0.85rem 0.6rem !important;
    }

    .sidebar-nav-label {
      font-size: 0.57rem !important;
      padding: 0 0.85rem !important;
      margin: 0.55rem 0 0.35rem !important;
      letter-spacing: 0.2em !important;
      color: rgba(255,255,255,0.26) !important;
    }

    .nav-btn {
      padding: 0.66rem 0.85rem !important;
      font-size: 0.855rem !important;
      border-radius:var(--radius) !important;
      gap: 0.62rem !important;
      margin-bottom: 0.12rem !important;
      letter-spacing: -0.01em;
    }

    .nav-btn svg {
      width: 15px !important;
      height: 15px !important;
      flex-shrink: 0;
      fill: none;
      stroke: currentColor;
      stroke-width: 1.75;
      stroke-linecap: round;
      stroke-linejoin: round;
      opacity: 0.7;
      transition: opacity 0.2s;
    }

    .nav-btn:hover svg,
    .nav-btn.active svg { opacity: 1; }

    .nav-btn.active {
      padding-left: 0.85rem !important;
      border-left: none !important;
    }

    .nav-count {
      font-size: 0.68rem !important;
      padding: 0.15rem 0.55rem !important;
    }

    /* Sidebar user section */
    .sidebar-user { padding: 0.85rem 0.85rem !important; }
    .sidebar-user-row { margin-bottom: 0.5rem !important; }
    .user-avatar { width: 30px !important; height: 30px !important; font-size: 0.76rem !important; }
    .user-name  { font-size: 0.79rem !important; }
    .user-email { font-size: 0.66rem !important; }
    .btn-logout { font-size: 0.71rem !important; }

    /* Sidebar logo area */
    .sidebar-logo { padding: 1.2rem 1rem !important; }

    /* — Botões — */
    .btn-crm-primary,
    .btn-crm-gold,
    .btn-crm-secondary {
      min-height: 40px !important;
      padding: 0 16px !important;
      font-size: 0.875rem !important;
      border-radius:var(--radius) !important;
    }

    .btn-icon {
      border-radius:var(--radius) !important;
      padding: 0.55rem 0.65rem !important;
      font-size: 13px !important;
    }

    .sidebar-toggle {
      width: 40px !important;
      height: 40px !important;
      min-width: 40px !important;
      border-radius:var(--radius) !important;
      /* item 10 — traço do ☰ mais grosso e contrastado (o .btn-icon, definido
         depois, deixava cinza-claro/14px) */
      color: var(--brand) !important;
      font-size: 1.5rem !important;
      font-weight: 700 !important;
      line-height: 1 !important;
    }

    /* — Modal — */
    .modal-box {
      border-radius:var(--radius) !important;
      padding: 24px !important;
    }

    .modal-box form { gap: 14px !important; }

    .modal-box input,
    .modal-box select,
    .modal-box textarea {
      padding: 10px 13px !important;
      border-radius:var(--radius) !important;
    }

    /* — Gráficos — */
    .chart-wrap { height: 210px !important; }

    /* — Section header inside cards — */
    .case-tasks-section .section-header {
      padding: 1rem 1.2rem !important;
    }

    /* ── Painel Switcher (visão admin) ──────────────────────────────── */
    .painel-ver-todos-btn {
      font-size:.75rem;font-weight:600;color:var(--gold-dark);background:none;
      border:1px solid rgba(201,169,110,.25);border:1px solid color-mix(in srgb,var(--x-c9a96e) 25%,transparent);cursor:pointer;
      padding:.3rem .7rem;border-radius:7px;transition:all .2s;font-family:inherit;
    }
    @media(max-width:768px) {
    }

    /* — Dashboard card padding refinement — */
    #tab-dashboard .grid-2 .card,
    #tab-dashboard .grid-1 .card,
    #tab-dashboard > .card {
      padding: var(--s-23) !important;
    }
    /* Espaçamento uniforme entre os quadros empilhados do Painel (não os de grid) */
    #painel-content .card { margin-bottom: var(--s-29); }
    #painel-content .grid-4 .card, #painel-content .grid-3 .card, #painel-content .grid-2 .card, #painel-content .grid-1 .card { margin-bottom: 0; }

    /* — Grid gap redução — */
    .grid-4, .grid-3, .grid-2, .grid-1 {
      gap: 1rem !important;
      margin-bottom: 1rem !important;
    }

    /* — Badge refinement — */
    .badge {
      padding: 2px 10px !important;
      font-size: 11px !important;
    }

    /* — Scrollbar — mais discreta — */
    ::-webkit-scrollbar { width: 5px !important; height: 5px !important; }
    ::-webkit-scrollbar-thumb { background: rgba(11,35,24,.13) !important;background: color-mix(in srgb,var(--x-0b2318) 13%,transparent) !important; border-radius: 3px !important; }
    ::-webkit-scrollbar-track { background: transparent !important; }

    /* — Settings — mais compacto — */
    .settings-card { padding: 1.2rem !important; }
    .settings-card h3 { font-size: 0.95rem !important; }

    /* — Publicações table — */
    .post-excerpt { font-size: 0.82rem !important; }

    /* — WhatsApp layout — */
    .wa-layout { border-radius:var(--radius) !important; }

    /* — Btn-icon SVG support — */
    .btn-icon svg { width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;vertical-align:middle;display:inline-block; }
    .btn-icon:hover svg { opacity:1; }
    .btn-icon.btn-danger { color:rgba(110,107,40,.55);color:color-mix(in srgb,var(--danger) 55%,transparent); }
    .btn-icon.btn-danger:hover { color:var(--danger); background:rgba(110,107,40,.07);background:color-mix(in srgb,var(--danger) 7%,transparent); }

    /* — Nome de cliente clicável nas tabelas — */
    td.td-nome-link { cursor:pointer; }
    td.td-nome-link:hover { text-decoration:underline; text-decoration-style:dotted; text-underline-offset:3px; color:var(--brand-mid) !important; }

    /* — Animações — mais discretas — */
    @keyframes fade-in-scale {
      from { opacity: 0; transform: translateY(10px) scale(0.98); }
      to   { opacity: 1; transform: translateY(0)   scale(1);    }
    }

    @keyframes premium-rise {
      from { opacity: 0; transform: translateY(10px) scale(0.985); }
      to   { opacity: 1; transform: translateY(0)    scale(1);     }
    }

  
    /* ─── VARIÁVEIS EXTRAS ─────────────────────────────────────────────────── */
    :root { --header-h: 76px; }

    /* ─── TOAST SYSTEM ─────────────────────────────────────────────────────── */
    #toast-container {
      position: fixed;
      bottom: 2rem;
      left: 50%;
      transform: translateX(-50%);
      z-index: 9999;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.5rem;
      pointer-events: none;
    }
    .toast {
      background: var(--forest-deep);
      color: #fff;
      padding: 0.75rem 1.5rem;
      border-radius:var(--radius);
      font-size: 0.875rem;
      font-weight: 500;
      display: flex;
      align-items: center;
      gap: 0.6rem;
      opacity: 0;
      transform: translateY(12px);
      transition: opacity 0.25s ease, transform 0.25s ease;
      box-shadow: 0 8px 24px rgba(11,35,24,.3);box-shadow: 0 8px 24px color-mix(in srgb,var(--x-0b2318) 30%,transparent);
      border: 1px solid rgba(201,169,110,.2);border: 1px solid color-mix(in srgb,var(--x-c9a96e) 20%,transparent);
      pointer-events: auto;
      white-space: normal;
      text-align: center;
      line-height: 1.4;
      max-width: 90vw;
    }
    .toast.toast-visible { opacity: 1; transform: translateY(0); }
    .toast-icon { font-size: 0.9rem; flex-shrink: 0; }
    .toast.toast-success .toast-icon { color: var(--gold-light); } /* Ouro Claro #CDB255 — glifo claro sobre toast escuro (paleta v4) */
    .toast.toast-warning  { border-color: var(--warning-border); }
    .toast.toast-warning .toast-icon { color: var(--gold); }
    .toast.toast-info .toast-icon    { color: var(--cream); } /* Papel #F2EAD3 — glifo claro sobre toast escuro (paleta v4) */
    .toast.toast-error {
      background: var(--danger);
      border-color: var(--danger-border);
    }
    .toast.toast-error .toast-icon { color: var(--paper); }

    /* ─── MODAL CONFIRMAÇÃO / AVISO UNIFICADO ──────────────────────────────── */
    /* Desfecho da janela (D1, 2026-08-13) — autocontido de proposito: reescrever os
       seletores do #app-modal-ask para valer nos dois arriscaria TODO dialogo do app. */
    #app-modal-desfecho { position: fixed; inset: 0; z-index: 10101; background: rgba(3,27,20,.5);background: color-mix(in srgb,var(--x-031b14) 50%,transparent); display: none; align-items: center; justify-content: center; padding: 1rem; }
    #app-modal-desfecho.open { display: flex; }
    #app-modal-desfecho .desf-box { background: #fff; border-radius: var(--radius); padding: 1.6rem; max-width: 440px; width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.25); }
    #app-modal-desfecho h3 { margin: 0 0 .4rem; font-size: 1.05rem; }
    #app-modal-desfecho .desf-msg { margin: 0 0 1rem; font-size: .86rem; color: var(--text-muted); line-height: 1.45; }
    #app-modal-desfecho .desf-opts { display: flex; flex-direction: column; gap: .5rem; }
    #app-modal-desfecho .desf-opt { text-align: left; padding: .7rem .9rem; border: 1px solid var(--border); border-radius: var(--radius); background: none; cursor: pointer; font-size: .9rem; font-weight: 600; }
    #app-modal-desfecho .desf-opt:hover { border-color: var(--accent, var(--danger)); background: rgba(110,107,40,.05);background: color-mix(in srgb,var(--danger) 5%,transparent); }
    #app-modal-desfecho .desf-opt small { display: block; font-weight: 400; font-size: .78rem; color: var(--text-muted); margin-top: .15rem; }
    #app-modal-desfecho .desf-actions { display: flex; justify-content: flex-end; margin-top: 1rem; }
    #app-modal-desfecho .desf-cancel { background: none; border: 1px solid var(--border); border-radius: var(--radius); padding: .45rem 1rem; font-size: .85rem; cursor: pointer; color: var(--text-muted); }
    #app-modal-ask { position: fixed; inset: 0; z-index: 10100; background: rgba(3,27,20,.5);background: color-mix(in srgb,var(--x-031b14) 50%,transparent); display: none; align-items: center; justify-content: center; padding: 1rem; }
    #app-modal-ask.open { display: flex; }
    #app-modal-ask .ask-box { background: #fff; border-radius: var(--radius); padding: 1.75rem; max-width: 420px; width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.25); text-align: center; animation: askIn .15s ease; }
    @keyframes askIn { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
    #app-modal-ask .ask-icon { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto .85rem; font-size: 1.3rem; font-weight: 700; }
    #app-modal-ask .ask-icon.info    { background: var(--info-bg); color: var(--info); }
    #app-modal-ask .ask-icon.success { background: var(--success-bg);  color: var(--success); }
    #app-modal-ask .ask-icon.warning { background: var(--warning-bg); color: var(--state-attention-text); }
    #app-modal-ask .ask-icon.danger  { background: var(--danger-bg);  color: var(--danger); }
    #app-modal-ask h3 { font-size: 1.02rem; font-weight: 600; color: var(--text); margin-bottom: .45rem; }
    #app-modal-ask p { font-size: .9rem; color: var(--text-mid); margin-bottom: 1.35rem; white-space: pre-line; line-height: 1.5; }
    #app-modal-ask .ask-actions { display: flex; gap: .6rem; justify-content: center; }
    #app-modal-ask .ask-actions button { padding: .55rem 1.3rem; border-radius: var(--radius); cursor: pointer; font-size: .88rem; font-weight: 600; border: none; }
    #app-modal-ask .ask-cancel { background: #fff; border: 1px solid #ddd; color: var(--text-mid); }
    #app-modal-ask .ask-cancel:hover { background: rgba(3,27,20,.05);background: color-mix(in srgb,var(--x-031b14) 5%,transparent); }
    #app-modal-ask .ask-ok { background: var(--brand); color: #fff; }
    #app-modal-ask .ask-ok.danger { background: var(--danger); }
    #app-modal-ask .ask-ok:hover { filter: brightness(1.08); }

    /* ─── SKELETON LOADERS ─────────────────────────────────────────────────── */
    @keyframes skelShimmer { 0% { background-position: -240px 0; } 100% { background-position: calc(240px + 100%) 0; } }
    .skel { display: inline-block; border-radius: 6px; background: #e9edec; background-image: linear-gradient(90deg, #e9edec 0, #f5f8f7 60px, #e9edec 120px); background-size: 240px 100%; background-repeat: no-repeat; animation: skelShimmer 1.2s ease-in-out infinite; }
    .skel-cell { height: .8rem; }
    .skel-line { height: .7rem; }
    .skel-card { padding: 1.25rem; display: flex; gap: 1rem; align-items: flex-start; }
    .skel-avatar { width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0; }
    tr.skel-row td { padding: .75rem .85rem; }
    /* ─── BUTTON SPINNER (ações em andamento) ──────────────────────────────── */
    .btn-spinner { display: inline-block; width: .82em; height: .82em; border: 2px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: spin .6s linear infinite; vertical-align: -1px; margin-right: .45rem; }

    /* ─── ACESSIBILIDADE: foco visível por teclado (Fase 4) ─────────────────── */
    a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
    textarea:focus-visible, [tabindex]:focus-visible, [role="button"]:focus-visible,
    .pill:focus-visible, tr[onclick]:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-radius: 4px; }
    /* Não mostra o anel ao clicar com o mouse (apenas navegação por teclado). */
    :focus:not(:focus-visible) { outline: none; }

    /* ─── SKIP LINK (acessibilidade) ──────────────────────────────────────── */
    .skip-link {
      position: absolute;
      top: -100%;
      left: 50%;
      transform: translateX(-50%);
      background: var(--brand, var(--forest));
      color: #fff;
      padding: 0.75rem 1.5rem;
      border-radius: 0 0 8px 8px;
      font-weight: 600;
      z-index: 10000;
      transition: top 0.2s;
      text-decoration: none;
      font-size: 0.9rem;
    }
    .skip-link:focus { top: 0; }

    /* ── MUTIRÃO ─────────────────────────────────────────────────────────── */
    .mutirao-banner {
      display: flex; align-items: center; justify-content: space-between;
      flex-wrap: wrap; gap: .75rem;
      padding: 1rem 1.25rem;
      background: var(--paper);
      border: 1px solid var(--gold); border-radius:var(--radius);
      margin-bottom: 1rem;
    }
    .mutirao-banner-hide { display: none !important; }
    .mutirao-banner-left { display: flex; align-items: center; gap: .75rem; }
    .mutirao-banner-icon { font-size: 1.5rem; line-height: 1; }
    .mutirao-banner-text strong { display: block; font-size: .88rem; font-weight:600; color: var(--gold-dark); }
    .mutirao-banner-text span { font-size: .78rem; color: var(--text-mid); }
    .mutirao-banner-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
    .mutirao-btn-auto {
      padding: 7px 14px; font-size: .78rem; font-weight: 600; cursor: pointer;
      border: 1px solid var(--gold); border-radius:var(--radius);
      background: transparent; color: var(--gold-dark); transition: background .15s;
    }
    .mutirao-btn-auto:hover { background: var(--warning-bg); }
    .mutirao-btn-open {
      padding: 7px 14px; font-size: .78rem; font-weight: 600; cursor: pointer;
      border: none; border-radius:var(--radius);
      background: var(--forest); color: #fff; transition: background .15s;
    }
    .mutirao-btn-open:hover { background: var(--forest-deep); }
    #mutiraoOverlay {
      position: fixed; inset: 0; background: rgba(3,27,20,.45);background: color-mix(in srgb,var(--x-031b14) 45%,transparent);
      z-index: 2000; display: none; align-items: center; justify-content: center;
    }
    #mutiraoOverlay.active { display: flex; }
    #mutiraoModal {
      background: var(--bg-card); border-radius:var(--radius);
      box-shadow: 0 24px 80px rgba(3,27,20,.18);box-shadow: 0 24px 80px color-mix(in srgb,var(--x-031b14) 18%,transparent);
      width: min(700px, 95vw); max-height: 90vh;
      display: flex; flex-direction: column; overflow: hidden;
    }
    #mutiraoModal .mm-header {
      padding: 1.25rem 1.5rem; border-bottom: 1px solid rgba(3,27,20,.07);border-bottom: 1px solid color-mix(in srgb,var(--x-031b14) 7%,transparent);
      display: flex; align-items: center; justify-content: space-between; flex-shrink: 0;
    }
    #mutiraoModal .mm-title { font-size: 1.05rem; font-weight:600; color: var(--brand); }
    #mutiraoModal .mm-sub { font-size: .75rem; color: var(--text-muted); margin-top: .15rem; }
    #mutiraoModal .mm-body { flex: 1; overflow-y: auto; padding: 1.25rem 1.5rem; }
    #mutiraoModal .mm-footer {
      padding: .9rem 1.5rem; border-top: 1px solid rgba(3,27,20,.07);border-top: 1px solid color-mix(in srgb,var(--x-031b14) 7%,transparent);
      display: flex; align-items: center; justify-content: space-between;
      flex-shrink: 0; flex-wrap: wrap; gap: .5rem;
    }
    .mm-caso-card {
      border: 1px solid rgba(3,27,20,.09);border: 1px solid color-mix(in srgb,var(--x-031b14) 9%,transparent); border-radius:var(--radius);
      padding: 1rem 1.1rem; margin-bottom: .75rem; background: var(--paper-doc);
    }
    .mm-caso-header { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; margin-bottom: .6rem; }
    .mm-caso-title { font-weight:600; font-size: .9rem; color: var(--brand); }
    .mm-caso-sub { font-size: .75rem; color: var(--text-muted); margin-top: .1rem; }
    .mm-caso-meta { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: .75rem; }
    .mm-tag { display: inline-flex; align-items: center; padding: 2px 9px; border-radius:var(--radius); font-size: .7rem; font-weight: 600; background: rgba(3,27,20,.07);background: color-mix(in srgb,var(--x-031b14) 7%,transparent); color: var(--brand); }
    .mm-vincular-row { display: flex; gap: .5rem; align-items: flex-end; flex-wrap: wrap; }
    .mm-vincular-row input { flex: 1; min-width: 180px; }
    .mm-vincular-row select { width: 140px; }
    .mm-sugestoes { margin-top: .4rem; }
    .mm-sugestao-item {
      padding: 5px 10px; font-size: .78rem; cursor: pointer; border-radius:var(--radius);
      color: var(--brand); border: 1px solid rgba(3,27,20,.1);border: 1px solid color-mix(in srgb,var(--x-031b14) 10%,transparent);
      background: #fff; display: inline-flex; align-items: center; gap: .35rem;
      margin: .2rem .2rem 0 0; transition: background .1s;
    }
    .mm-sugestao-item:hover { background: var(--paper-doc); }
    .mm-progress { font-size: .8rem; color: var(--text-muted); }
    .mm-progress strong { color: var(--brand); }
    .mm-vincular-btn {
      padding: 7px 16px; font-size: .8rem; font-weight: 600; cursor: pointer;
      border: none; border-radius:var(--radius); background: var(--brand); color: #fff;
      white-space: nowrap; transition: opacity .15s;
    }
    .mm-vincular-btn:disabled { opacity: .5; cursor: default; }
    .mm-vincular-btn:not(:disabled):hover { opacity: .85; }
    .mm-skip-btn {
      padding: 7px 14px; font-size: .78rem; font-weight: 500; cursor: pointer;
      border: 1px solid rgba(3,27,20,.12);border: 1px solid color-mix(in srgb,var(--x-031b14) 12%,transparent); border-radius:var(--radius);
      background: transparent; color: var(--text-muted);
    }
    .mm-skip-btn:hover { background: rgba(3,27,20,.04);background: color-mix(in srgb,var(--x-031b14) 4%,transparent); }
    .mm-empty { text-align: center; padding: 2.5rem 1rem; color: var(--text-muted); font-size: .9rem; }
    .mm-empty strong { display: block; font-size: 2rem; margin-bottom: .5rem; }
    .mm-search-results {
      border: 1px solid rgba(3,27,20,.08);border: 1px solid color-mix(in srgb,var(--x-031b14) 8%,transparent); border-radius:var(--radius);
      max-height: 140px; overflow-y: auto; background: #fff; margin-top: .3rem;
    }
    .mm-search-result-item {
      padding: 8px 12px; font-size: .82rem; cursor: pointer;
      border-bottom: 1px solid rgba(3,27,20,.05);border-bottom: 1px solid color-mix(in srgb,var(--x-031b14) 5%,transparent); display: flex; align-items: center; gap: .5rem;
    }
    .mm-search-result-item:last-child { border-bottom: none; }
    .mm-search-result-item:hover { background: var(--paper-doc); }

  /* ── Auth-check overlay ─────────────────────────────────────────── */
  #authCheckOverlay {
    position: fixed; inset: 0;
    background: var(--x-0d0d1a);
    display: flex; align-items: center; justify-content: center;
    z-index: 99999;
    transition: opacity 0.25s ease;
  }
  #authCheckOverlay.fade-out { opacity: 0; pointer-events: none; }
  #authCheckOverlay .auth-spinner {
    width: 40px; height: 40px;
    border: 3px solid rgba(201,169,110,.2);border: 3px solid color-mix(in srgb,var(--x-c9a96e) 20%,transparent);
    border-top-color: var(--x-c9a96b);
    border-radius: 50%;
    animation: auth-spin 0.7s linear infinite;
  }
  @keyframes auth-spin { to { transform: rotate(360deg); } }

  

/* ── Agenda chips ─────────────────────────────────────────── */
.agenda-chip {
  font-size: .72rem;
  font-weight: 600;
  padding: 4px 11px;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: var(--bg-card);
  color: var(--text-muted);
  cursor: pointer;
  transition: all .15s;
  line-height: 1.3;
}
.agenda-chip:hover { background: var(--hover); color: var(--text); }
.agenda-chip.ativo {
  background: var(--gold-fill,var(--gold));
  color: var(--forest-deep);
  border-color: var(--gold);
  font-weight: 700;
}

/* ════════════════════════════════════════════════════════════════════════
   SIDEBAR · REDESENHO v4 (Ouro · Proporção Áurea)
   Silêncio elegante: menos elementos, mais respiro, hierarquia óbvia.
   Reorganização de espaço na escala áurea S — NÃO introduz cor nova.
   Última camada do cascade: consolida sobre as camadas anteriores da barra.
   ════════════════════════════════════════════════════════════════════════ */

/* — Coluna: Araucária garantido até o rodapé (canto nunca vaza creme) — */
.sidebar { background-color: var(--forest-deep); }
@supports (height: 100dvh) {
  #appView.active { min-height: 100dvh; }
  .sidebar { max-height: 100dvh; }
}

/* — ZONA 1 · Topo (monograma fsc + wordmark) — */
.sidebar-logo {
  padding: var(--s-23) var(--s-23) !important;
  border-bottom: 1px solid rgba(184,151,42,.2) !important;border-bottom: 1px solid color-mix(in srgb,var(--gold) 20%,transparent) !important;   /* filete de OURO fraco (era branco 0.05) */
}

/* — ZONA 2 · Meio (menu) — gap/padding em passo S, ícone+label alinhados — */
.sidebar-nav { padding: var(--s-11) var(--s-9) !important; }
.sidebar-nav-label {
  padding: 0 var(--s-11) !important;
  margin: var(--s-7) 0 var(--s-9) !important;
  letter-spacing: .2em !important;
  color: rgba(255,255,255,0.30) !important;
}
.nav-btn {
  gap: var(--s-11) !important;
  padding: var(--s-11) var(--s-11) !important;
  margin-bottom: var(--s-4) !important;
}
.nav-btn:hover { background: rgba(184,151,42,.08) !important;background: color-mix(in srgb,var(--gold) 8%,transparent) !important; border-color: transparent !important; box-shadow: none !important; }
/* Ativo: filete OURO à esquerda, fundo Araucária realçado, texto claro (nunca branco sobre ouro) */
.nav-btn.active {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid transparent !important;
  border-left: 3px solid var(--gold) !important;
  padding-left: calc(var(--s-11) - 3px) !important;
  box-shadow: none !important;
  color: #fff !important;
  font-weight: 600 !important;
}
.nav-btn .nav-count { padding: var(--s-4) var(--s-9) !important; }

/* — ZONA 3 · Rodapé — Alertas+Config · divisor OURO · org · usuário · sair · ver como — */
.sidebar-fixed-actions { padding: var(--s-9) var(--s-9) var(--s-4) !important; gap: var(--s-9) !important; }
.sidebar-fixed-btn { min-height: var(--s-37); }
.sidebar-divider {                                  /* agora abaixo dos ícones fixos, em OURO fraco */
  height: 1px !important;
  background: rgba(184,151,42,.22) !important;background: color-mix(in srgb,var(--gold) 22%,transparent) !important;
  margin: var(--s-7) var(--s-14) !important;
}
.sidebar-user { padding: var(--s-14) var(--s-11) !important; }
.org-switcher { margin-bottom: var(--s-11); }
.sidebar-user-row { margin-bottom: var(--s-11) !important; }
.user-name  { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-email { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.btn-logout { min-height: var(--s-37) !important; }

/* ════════════════════════════════════════════════════════════════════════
   HEADER COCKPIT v4 + PERFIL popover (marca · escala aurea · sem cor nova)
   ════════════════════════════════════════════════════════════════════════ */
.crm-header-left{display:flex;flex-direction:column;justify-content:center;flex:1 1 auto;min-width:0;}
.cockpit-greet{display:flex;flex-direction:column;gap:var(--s-5);min-width:0;padding-top:var(--s-18);/* 05/08: respiro de uma linha acima da saudacao (token on-scale) */}
.cockpit-hello{font-family:var(--f-titulo,'Cormorant Garamond',serif);font-weight:600;font-size:var(--fs-2xl);line-height:1.12;color:var(--forest-deep);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cockpit-context{display:flex;align-items:center;gap:var(--s-11);flex-wrap:wrap;color:var(--text-mid);font-size:var(--fs-sm);margin-top:var(--s-4);margin-bottom:var(--s-11);/* respiro antes do bloco seguinte (Painel) — token on-scale */}
.cockpit-context b{color:var(--forest-deep);font-weight:700;}
.cockpit-context b.u-gold{color:var(--gold-dark);}
.cockpit-sep{width:1px;height:13px;background:rgba(20,54,38,.16);background:color-mix(in srgb,var(--forest-deep) 16%,transparent);flex-shrink:0;}
.crm-header-actions{flex-shrink:0;}
.cockpit-search{position:relative;}
.busca-global-dropdown{position:absolute;top:calc(100% + var(--s-5));right:0;left:0;min-width:280px;max-height:min(60vh,420px);overflow-y:auto;background:var(--paper,#fff);border:1px solid rgba(20,54,38,.14);border:1px solid color-mix(in srgb,var(--forest-deep) 14%,transparent);border-radius:var(--radius);box-shadow:0 8px 28px rgba(20,54,38,.16);box-shadow:0 8px 28px color-mix(in srgb,var(--forest-deep) 16%,transparent);z-index:60;padding:var(--s-4) 0;}
.busca-global-grupo{padding:var(--s-4) var(--s-11) 2px;font-size:.66rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);}
.busca-global-item{display:flex;flex-direction:column;gap:1px;padding:var(--s-5) var(--s-11);cursor:pointer;border:0;background:none;width:100%;text-align:left;}
.busca-global-item:hover,.busca-global-item.is-ativo{background:rgba(20,54,38,.06);background:color-mix(in srgb,var(--forest-deep) 6%,transparent);}
.busca-global-item .bg-titulo{font-size:var(--fs-sm);color:var(--forest-deep);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.busca-global-item .bg-sub{font-size:.72rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.busca-global-vazio{padding:var(--s-11);font-size:var(--fs-sm);color:var(--text-muted);text-align:center;}
.cockpit-search input{width:236px;max-width:26vw;height:var(--s-37);border:1px solid var(--border);border-radius:var(--radius);background:var(--paper);padding:0 var(--s-11) 0 var(--s-37);font-size:var(--fs-sm);color:var(--forest-deep);font-family:inherit;}
.cockpit-search input::placeholder{color:var(--text-muted);}
.cockpit-search input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 2px rgba(184,151,42,.18);box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 18%,transparent);background:#fff;}
.cockpit-search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);width:15px;height:15px;stroke:var(--text-muted);fill:none;stroke-width:1.8;}
.cockpit-icon-btn{position:relative;width:var(--s-37);height:var(--s-37);display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);border-radius:var(--radius);background:var(--paper);cursor:pointer;color:var(--forest-deep);transition:all .18s;}
.cockpit-icon-btn:hover{border-color:var(--gold);background:rgba(184,151,42,.07);background:color-mix(in srgb,var(--gold) 7%,transparent);}
.cockpit-icon-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.cockpit-bell-badge{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:var(--gold-fill,var(--gold));color:var(--forest-deep);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;}
/* Conta no header (padrão SaaS) — avatar topo-direito → popover */
.acct{position:relative;}
.acct-trigger{display:flex;align-items:center;gap:6px;padding:3px 7px 3px 3px;border:1px solid var(--border);border-radius:var(--radius-pill);background:var(--paper);cursor:pointer;transition:all .18s;}
.acct-trigger:hover,.acct-trigger[aria-expanded="true"]{border-color:var(--gold);background:rgba(184,151,42,.06);background:color-mix(in srgb,var(--gold) 6%,transparent);}
.acct-av{width:30px;height:30px;border-radius:50%;background:var(--forest-deep);color:var(--gold);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.8rem;flex-shrink:0;}
.acct-trigger .pp-caret{width:13px;height:13px;stroke:var(--text-muted);fill:none;stroke-width:2;transition:transform .18s;}
.acct-trigger[aria-expanded="true"] .pp-caret{transform:rotate(180deg);}
.prof-pop{position:absolute;top:calc(100% + 8px);right:0;width:260px;background:var(--cream);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:var(--s-7);z-index:60;display:none;}
.prof-pop.open{display:block;}
.prof-pop .pp-head{padding:var(--s-7) var(--s-9) var(--s-9);border-bottom:1px solid rgba(20,54,38,.1);border-bottom:1px solid color-mix(in srgb,var(--forest-deep) 10%,transparent);margin-bottom:var(--s-4);}
.prof-pop .pp-name{font-weight:600;color:var(--forest-deep);font-size:var(--fs-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.prof-pop .pp-email{font-size:var(--fs-cap);color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.prof-pop .pp-item{display:flex;align-items:center;gap:var(--s-11);width:100%;padding:var(--s-9);border-radius:var(--radius);font-size:var(--fs-sm);color:var(--forest-deep);background:none;border:none;cursor:pointer;text-align:left;font-family:inherit;}
.prof-pop .pp-item:hover{background:rgba(184,151,42,.08);background:color-mix(in srgb,var(--gold) 8%,transparent);}
.prof-pop .pp-item svg{width:15px;height:15px;stroke:var(--forest);fill:none;stroke-width:1.8;flex-shrink:0;}
.prof-pop .pp-sep{height:1px;background:rgba(184,151,42,.2);background:color-mix(in srgb,var(--gold) 20%,transparent);margin:var(--s-4);}
.prof-pop .org-switcher{margin:var(--s-4) 0 var(--s-7);}
.prof-pop .org-switcher-label{color:var(--text-muted);}
.prof-pop #orgSelect{background:#fff;color:var(--forest-deep);border-color:var(--border);}
.prof-pop .org-select-wrap::after{border-color:var(--gold-dark);}
.prof-pop #sidebarPreviewBtn{margin-top:0 !important;}
@media(max-width:480px){.acct-trigger .pp-caret{display:none;}.prof-pop{width:240px;}}
@media(max-width:768px){.cockpit-context{display:none;}.cockpit-search input{width:140px;}.cockpit-hello{font-size:var(--fs-lg);}}
/* vence o legado @media 640 que punha .crm-header em coluna — mantém o cockpit em linha */
@media(max-width:640px){.crm-header{flex-direction:row !important;align-items:center !important;flex-wrap:nowrap !important;gap:var(--s-9) !important;}.crm-header-left{flex:1 1 auto;min-width:0;}.crm-header-title h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.crm-header-actions{gap:var(--s-7);}}
@media(max-width:480px){.cockpit-search{display:none;}}