/* ============================================================ ARQUIVO GERADO — NÃO EDITE. Origem: comum/core.css Gerado por: build.mjs Qualquer alteração aqui é perdida no próximo build. Edite a origem. ============================================================ */ /* ===================================================== VALORA — core.css v2.0 · Direção B (Precisão) ----------------------------------------------------- Design system da plataforma Valora Labs. Identidade: azul-noite + dourado + marfim, dois temas. Tipografia: Outfit (interface) + Spline Sans Mono (dados). Regra: módulos importam este arquivo; a maior parte do visual vem dos tokens abaixo — trocar tokens propaga para todos os componentes. Nomes de classes/variáveis preservados da v1 (não quebrar HTML/JS existentes). Aliases mantidos no fim do bloco. ===================================================== */ @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Spline+Sans+Mono:wght@400;500;600&display=swap'); /* ---------- TOKENS · TEMA CLARO (padrão) ---------- */ *{box-sizing:border-box;margin:0;padding:0} :root{ /* superfícies */ --bg:#F5F3EE; /* marfim — respiro */ --surface:#FFFFFF; /* cards */ --surface-2:#FAF9F5; /* inputs, zebra */ --border:#E4E0D6; /* azul — comanda */ --noite:#14243B; --profundo:#1E3A5F; --vivo:#3E6FA3; --accent:#14243B; /* alias principal (cabeçalhos, resultado) */ --accent-hover:#1E3A5F; --accent-vivo:#3E6FA3; /* dourado — destaca */ --ouro:#C8A96E; --ouro-hover:#d4b578; --ouro-escuro:#9C8244; --accent2:#C8A96E; /* alias dourado */ --accent2-hover:#d4b578; /* texto */ --text:#14243B; --muted:#6B6860; --muted-2:#8a8780; /* status — só funcional */ --danger:#B84040; --success:#1F8F6A; --info:#3E6FA3; --verde:#1F8F6A; --ambar:#C8A96E; --laranja:#C06A2A; --rubro:#B84040; /* forma */ --radius:12px; --radius-sm:8px; --shadow:0 4px 20px rgba(20,36,59,0.06); --shadow-hover:0 8px 28px rgba(20,36,59,0.10); /* texto de destaque — NÃO confundir com --accent. --accent = cor de SUPERFÍCIE (cabeçalho, botão preenchido) --accent-text = cor de TEXTO de destaque (título de card, aba ativa) No tema claro os dois coincidem; no escuro --accent vira superfície (igual a --surface) e usar ele como cor de texto some com o conteúdo. */ --accent-text:#14243B; /* placeholder é exemplo, não conteúdo — precisa recuar do texto digitado */ --placeholder:#B4B0A6; /* superfície de sobreposição (tooltip, toast, assistente). No claro coincide com --noite; no escuro NÃO pode coincidir, senão a sobreposição fica mais escura que a página e desaparece. */ --overlay:#14243B; /* DESTAQUE EM DOURADO — token próprio, separado de --alerta-*. Antes o card dourado reaproveitava o par de ALERTA, que é discreto de propósito para não competir com o conteúdo. Destaque herdava a timidez de um aviso. São coisas diferentes: alerta chama atenção para um problema, destaque valoriza uma informação. Para calibrar a intensidade, mexer só nestes três valores. */ --destaque-bg:#FAF0D5; --destaque-borda:#C8A96E; --destaque-fg:#6B4E12; /* pares de fundo/texto pra selo e alerta (substituem hex fixo no HTML) */ --sucesso-bg:#E4F0E9; --sucesso-fg:#1F6E52; --alerta-bg:#F7EFDC; --alerta-fg:#7A4F00; --perigo-bg:#F6E3E3; --perigo-fg:#8E3232; /* tipografia */ --font-display:'Outfit',system-ui,sans-serif; --font-body:'Outfit',system-ui,sans-serif; --font-mono:'Spline Sans Mono',monospace; } /* ---------- TOKENS · TEMA ESCURO ---------- */ /* ===================== MODO ESCURO — direção B (15/08/2026) ===================== POR QUE MUDOU O escuro anterior falhava por COLISÃO DE TOKEN, não por paleta feia: · `--noite` nunca era redefinido, então valia #14243B — exatamente o `--bg` do escuro. E `--noite` é o fundo do CABEÇALHO, dos botões primários, dos cabeçalhos de tabela, da métrica em destaque, dos tooltips e do assistente. Seis componentes estruturais sumiam no fundo. · `--accent` (#1E3A5F) era idêntico a `--surface`, então o que usava accent como fundo desaparecia dentro do card. O QUE A DIREÇÃO B FAZ Recua o fundo para um azul bem mais escuro e menos saturado, o que faz os cards subirem de verdade, e separa as camadas: --noite (#080F16) < --bg (#0D1620) < --surface < --surface-2 Mantém o azul-noite como presença de marca, sem cansar numa tela cheia de formulário como a de avaliação. REGRA QUE FICA Cor de SUPERFÍCIE e cor de TEXTO são tokens diferentes, e nenhuma superfície pode ter o mesmo valor da superfície que está atrás dela. Ao acrescentar token novo, conferir o par claro E o escuro. */ body.dark{ --bg:#0D1620; /* azul profundo dessaturado — a página recua */ --surface:#182838; /* card sobe com clareza sobre o fundo */ --surface-2:#213347; /* input, zebra — mais um degrau acima */ --border:rgba(240,238,233,0.13); /* AQUI ESTAVA O BUG: --noite precisa de valor próprio no escuro, senão iguala o fundo. É a cor do cabeçalho e do — a camada mais funda. */ --noite:#080F16; --profundo:#1E3A5F; /* Sobreposição flutuante (tooltip, toast, assistente). No claro é escura sobre fundo claro; no escuro precisa ser MAIS CLARA que a página, senão some — elevação no escuro é luz, não sombra. */ --overlay:#243850; /* Destaque no escuro: fundo com mais corpo que o alerta (0,16 contra 0,18 de um matiz mais apagado), borda no dourado claro da direção B. */ --destaque-bg:rgba(208,180,120,0.16); --destaque-borda:#D0B478; --destaque-fg:#EAD5A4; --accent:#3E6FA3; /* azul-vivo: distinto de --surface, legível */ --accent-hover:#5A87BA; --accent-vivo:#8FB0D6; --ouro:#D0B478; --ouro-hover:#dcc38c; --accent2:#D0B478; --text:#F0EEE9; --muted:rgba(240,238,233,0.60); --muted-2:rgba(240,238,233,0.42); --danger:#E08585; --success:#3FBF95; --info:#6E95C2; --verde:#3FBF95; --rubro:#E08585; --accent-text:#8FB0D6; /* azul CLARO: legível sobre --surface escuro */ --placeholder:rgba(240,238,233,0.30); --sucesso-bg:rgba(63,191,149,0.16); --sucesso-fg:#7FD9BC; --alerta-bg:rgba(200,169,110,0.18); --alerta-fg:#E0C48D; --perigo-bg:rgba(224,133,133,0.16); --perigo-fg:#EFA9A9; --shadow:0 4px 20px rgba(0,0,0,0.28); --shadow-hover:0 8px 28px rgba(0,0,0,0.36); } body{ font-family:var(--font-body); background:var(--bg); color:var(--text); min-height:100vh; font-size:15px; line-height:1.55; transition:background .4s ease,color .4s ease; } body.dark input,body.dark select,body.dark textarea{background:#16294269;color:var(--text);border-color:var(--border)} body.dark input[readonly]{background:rgba(0,0,0,0.15)} body.dark tr:hover td{background:rgba(245,243,238,0.04)} @media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}} /* ---------- HEADER GLOBAL ---------- */ .app-header{background:var(--noite);padding:0 2rem;display:flex;align-items:center;justify-content:space-between;height:60px;position:sticky;top:0;z-index:100;border-bottom:1px solid rgba(245,243,238,0.08)} .app-logo{font-family:var(--font-display);color:#F5F3EE;font-size:1.3rem;letter-spacing:0.01em;font-weight:500;text-decoration:none} .app-logo span{color:var(--ouro)} .app-header-sub{font-size:12px;color:rgba(245,243,238,0.45);font-weight:300;margin-left:0.75rem;letter-spacing:0.03em} .app-header-right{display:flex;align-items:center;gap:1rem} .app-header-user{font-size:12px;color:rgba(245,243,238,0.5);font-weight:500} .btn-header{background:transparent;border:1px solid rgba(245,243,238,0.22);color:rgba(245,243,238,0.65);padding:5px 13px;border-radius:var(--radius-sm);font-family:var(--font-body);font-size:12px;cursor:pointer;transition:all 0.15s;text-decoration:none;display:inline-flex;align-items:center} .btn-header:hover{border-color:var(--ouro);color:var(--ouro)} .dark-toggle{background:none;border:1px solid rgba(245,243,238,0.22);color:rgba(245,243,238,0.75);border-radius:20px;padding:4px 13px;font-size:12px;font-family:var(--font-body);cursor:pointer;display:flex;align-items:center;gap:5px;transition:all 0.2s} .dark-toggle:hover{background:rgba(245,243,238,0.1);border-color:var(--ouro)} /* ---------- LAYOUT ---------- */ main.app-main{max-width:1100px;margin:0 auto;padding:2.25rem 2rem} @media(max-width:600px){main.app-main{padding:1.25rem}} /* ---------- CARDS ---------- */ .card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.6rem 1.75rem;box-shadow:var(--shadow);margin-bottom:1.25rem} .card-title{font-family:var(--font-display);font-size:0.95rem;font-weight:500;color:var(--profundo);margin-bottom:1.25rem;display:flex;align-items:center;gap:0.6rem;letter-spacing:0.01em} body.dark .card-title{color:var(--accent-vivo)} .card-title::before{content:'';width:3px;height:1.05em;background:var(--ouro);border-radius:2px;display:inline-block} /* ---------- CARDS COLAPSÁVEIS (initColapsaveis, core.js) ---------- */ [data-colapsavel] .card-title{cursor:pointer;user-select:none} [data-colapsavel] .card-title:focus-visible{outline:2px solid var(--vivo);outline-offset:2px;border-radius:4px} .colapsavel-seta{margin-left:auto;font-size:12px;color:var(--muted);transition:transform 0.15s ease;flex-shrink:0} /* ---------- FORM ---------- */ .form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.15rem} .form-grid.wide{grid-template-columns:1fr 1fr} .field{display:flex;flex-direction:column;gap:6px} .field.full{grid-column:1/-1} label{font-size:10.5px;font-weight:500;color:var(--muted-2);text-transform:uppercase;letter-spacing:0.06em} input,select,textarea{font-family:var(--font-body);font-size:14px;padding:10px 13px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--text);transition:border 0.15s,box-shadow 0.15s;outline:none;width:100%} input:focus,select:focus,textarea:focus{border-color:var(--vivo);box-shadow:0 0 0 3px rgba(62,111,163,0.12)} input[readonly]{background:var(--bg);color:var(--muted)} textarea{resize:vertical;min-height:70px} .tip{font-size:11px;color:var(--muted);margin-top:4px} /* ---------- BUTTONS ---------- */ .btn{font-family:var(--font-body);font-size:13.5px;font-weight:500;padding:10px 20px;border-radius:var(--radius-sm);cursor:pointer;border:1px solid transparent;display:inline-flex;align-items:center;gap:6px;transition:transform 0.15s,background 0.15s,box-shadow 0.2s,border-color 0.15s} .btn:disabled{opacity:0.5;cursor:not-allowed} .btn-primary{background:var(--accent);color:#F5F3EE} .btn-primary:hover{background:var(--profundo);transform:translateY(-1px)} body.dark .btn-primary{background:var(--vivo)} body.dark .btn-primary:hover{background:var(--accent-vivo)} .btn-ghost{background:transparent;color:var(--muted);border-color:var(--border)} .btn-ghost:hover{background:var(--surface-2);color:var(--text);border-color:var(--muted-2)} .btn-danger{background:transparent;color:var(--danger);border-color:rgba(184,64,64,0.4)} .btn-danger:hover{background:rgba(184,64,64,0.06)} .btn-gold{background:var(--ouro);color:var(--noite);font-weight:600} .btn-gold:hover{background:var(--ouro-hover);transform:translateY(-1px);box-shadow:0 8px 22px rgba(200,169,110,0.28)} .btn-bar{display:flex;gap:10px;flex-wrap:wrap;margin-top:1.25rem} .btn-icon{background:none;border:none;cursor:pointer;color:var(--muted-2);font-size:16px;padding:4px 6px;border-radius:6px;transition:all 0.1s} .btn-icon:hover{color:var(--danger);background:rgba(184,64,64,0.08)} /* ---------- TABLE ---------- */ .tbl-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius)} table{width:100%;border-collapse:collapse;font-size:13px} th{background:var(--noite);color:#F5F3EE;padding:10px 14px;text-align:left;font-weight:500;font-size:10.5px;text-transform:uppercase;letter-spacing:0.05em;white-space:nowrap} td{padding:10px 14px;border-bottom:1px solid var(--border);vertical-align:middle} tr:last-child td{border-bottom:none} tr:nth-child(even) td{background:var(--surface-2)} tr:hover td{background:rgba(62,111,163,0.05)} .badge{display:inline-block;font-size:11px;font-weight:600;padding:3px 9px;border-radius:20px;letter-spacing:0.03em} .badge-ok{background:rgba(31,143,106,0.14);color:#166b4f} .badge-out{background:rgba(192,106,42,0.14);color:#8a4510} .badge-alvo{background:rgba(62,111,163,0.14);color:#1E3A5F} /* ---------- METRIC CARDS ---------- */ .metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-top:1.25rem} .metric{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.15rem 1.35rem} .metric-label{font-size:10.5px;font-weight:500;text-transform:uppercase;letter-spacing:0.07em;color:var(--muted-2);margin-bottom:7px} .metric-value{font-family:var(--font-mono);font-size:1.5rem;font-weight:400;color:var(--text);letter-spacing:-0.01em} .metric.highlight{background:var(--accent);border-color:var(--accent)} .metric.highlight .metric-label{color:rgba(200,169,110,0.85)} .metric.highlight .metric-value{color:#F5F3EE} .metric.gold{background:#FBF6EA;border-color:#e8d5a3} .metric.gold .metric-label{color:var(--ouro-escuro)} .metric.gold .metric-value{color:#7a4f00} body.dark .metric.gold{background:rgba(200,169,110,0.12);border-color:rgba(200,169,110,0.4)} body.dark .metric.gold .metric-value{color:var(--ouro)} /* ---------- ALERTAS INLINE ---------- */ .alert{border-radius:var(--radius-sm);padding:11px 15px;font-size:13px;margin:0.85rem 0;border:1px solid transparent} .alert-info{background:rgba(62,111,163,0.10);border-color:rgba(62,111,163,0.3);color:#1E3A5F} .alert-success{background:rgba(31,143,106,0.10);border-color:rgba(31,143,106,0.3);color:#166b4f} .alert-warning{background:#FBF6EA;border-color:#e8d5a3;color:#7a4f00} .alert-danger{background:rgba(184,64,64,0.08);border-color:rgba(184,64,64,0.3);color:#8a1c1c} body.dark .alert-info{background:rgba(110,149,194,0.14);border-color:rgba(110,149,194,0.4);color:#a9c5e6} body.dark .alert-success{background:rgba(63,191,149,0.12);border-color:rgba(63,191,149,0.35);color:#8ad9bd} body.dark .alert-warning{background:rgba(200,169,110,0.12);border-color:rgba(200,169,110,0.4);color:#dcc08a} body.dark .alert-danger{background:rgba(224,133,133,0.12);border-color:rgba(224,133,133,0.4);color:#eaa8a8} /* ---------- TOOLTIP ---------- */ .info-icon{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:var(--border);color:var(--muted);font-size:9px;font-weight:700;cursor:default;margin-left:5px;vertical-align:middle;flex-shrink:0;transition:background 0.15s;position:relative} .info-icon:hover{background:var(--profundo);color:#F5F3EE} .tooltip-box{position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);background:var(--overlay);color:#F5F3EE;font-size:11.5px;font-weight:400;line-height:1.5;padding:9px 13px;border-radius:var(--radius-sm);white-space:normal;width:240px;text-align:left;pointer-events:none;opacity:0;transition:opacity 0.15s;z-index:500;box-shadow:0 6px 20px rgba(0,0,0,0.24)} .tooltip-box::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--overlay)} .info-icon:hover .tooltip-box,.info-icon:focus .tooltip-box{opacity:1} /* ---------- TOAST ---------- */ #toast-container{position:fixed;bottom:1.5rem;right:1.5rem;z-index:99999;display:flex;flex-direction:column;gap:8px;pointer-events:none} .toast{background:var(--overlay);color:#F5F3EE;padding:12px 19px;border-radius:var(--radius);font-size:13.5px;font-weight:500;display:flex;align-items:center;gap:8px;box-shadow:0 6px 24px rgba(0,0,0,0.24);opacity:0;transform:translateY(12px);transition:all 0.25s ease;pointer-events:none;max-width:320px} .toast.show{opacity:1;transform:translateY(0)} .toast.toast-success{border-left:4px solid var(--verde)} .toast.toast-error{border-left:4px solid var(--rubro)} .toast.toast-info{border-left:4px solid var(--ouro)} .toast-icon{font-size:15px;flex-shrink:0} /* ---------- AVISO DE CONEXÃO ---------- */ .aviso-conexao{display:none;align-items:flex-start;gap:9px;margin:0 0 1rem;padding:12px 14px;border:1px solid rgba(184,64,64,.4);border-radius:var(--radius-sm);background:rgba(184,64,64,.08);color:#8a1c1c;font-size:12.5px;line-height:1.5} body.dark .aviso-conexao{border-color:rgba(224,133,133,.4);background:rgba(224,133,133,.10);color:#eaa8a8} .aviso-conexao.show{display:flex} .stale{opacity:.45;filter:saturate(.4);transition:opacity .2s} /* ---------- EMPTY STATE ---------- */ .empty{text-align:center;padding:3rem 1rem;color:var(--muted)} .empty-icon{font-size:2.5rem;margin-bottom:0.75rem;opacity:0.3} .empty p{font-size:14px;margin-top:6px} /* ---------- LANDING / LOGIN ---------- */ .screen{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem} .auth-box{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:2.5rem 2rem;box-shadow:0 12px 40px rgba(20,36,59,0.12);width:100%;max-width:380px} .auth-logo{font-family:var(--font-display);font-weight:400;color:var(--accent-text);font-size:2rem;text-align:center;margin-bottom:0.25rem} body.dark .auth-logo{color:#F5F3EE} .auth-logo span{color:var(--ouro)} .auth-sub{font-size:12px;color:var(--muted);margin-bottom:2rem;letter-spacing:0.04em;text-align:center} .auth-field{text-align:left;margin-bottom:1rem} .auth-field label{display:block;margin-bottom:6px} .auth-btn{width:100%;padding:12px;background:var(--ouro);color:var(--noite);border:none;border-radius:var(--radius-sm);font-family:var(--font-body);font-size:14px;font-weight:600;cursor:pointer;margin-top:0.5rem;transition:background 0.15s,transform 0.15s;letter-spacing:0.02em} .auth-btn:hover{background:var(--ouro-hover);transform:translateY(-1px)} .auth-btn:disabled{opacity:0.6;cursor:wait} .auth-error{color:var(--danger);font-size:12.5px;margin-top:0.75rem;min-height:18px;text-align:center} .auth-back{background:none;border:none;color:var(--muted);font-size:13px;cursor:pointer;margin-top:1rem;display:block;width:100%;text-align:center;padding:6px} .auth-back:hover{color:var(--ouro)} .landing-divider{width:40px;height:2px;background:var(--ouro);margin:0 auto 2rem} /* ---------- HUB DE MÓDULOS ---------- v1.1: grade fixa em 5 colunas (não mais auto-fill) — desde que o Dashboard virou uma faixa própria fora desta grade (ver .dash-hero em hub.html), os 5 módulos restantes cabem numa linha só, do mesmo tamanho, sem sobra. Breakpoints reduzem a contagem de colunas em telas menores em vez de deixar o auto-fill decidir sozinho (evita 4+1 esquisito no meio do caminho). */ .hub-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-top:1.5rem} .hub-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem 1.15rem;cursor:pointer;transition:transform 0.18s,box-shadow 0.18s,border-color 0.18s;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:0.4rem;text-decoration:none;color:var(--text);position:relative} .hub-card:hover{border-color:var(--ouro);transform:translateY(-3px);box-shadow:var(--shadow-hover)} .hub-card-icon{width:38px;height:38px;border-radius:10px;background:rgba(62,111,163,0.10);display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:0.3rem} body.dark .hub-card-icon{background:rgba(110,149,194,0.14)} .hub-card-title{font-family:var(--font-display);font-size:0.96rem;font-weight:500;color:var(--text);line-height:1.3} .hub-card-desc{font-size:11.5px;color:var(--muted);line-height:1.5;flex:1} .hub-card-cta{font-size:11px;font-weight:600;color:var(--ouro-escuro);letter-spacing:0.04em;margin-top:0.4rem} body.dark .hub-card-cta{color:var(--ouro)} .hub-card.em-breve{opacity:0.5;cursor:default;pointer-events:none} .hub-card.em-breve .hub-card-icon{background:var(--surface-2)} .hub-card .badge-breve{position:absolute;top:14px;right:14px;font-size:10px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;background:var(--surface-2);color:var(--muted-2);border-radius:20px;padding:3px 10px;border:1px solid var(--border)} @media (max-width:900px){ .hub-grid{grid-template-columns:repeat(3,1fr)} } @media (max-width:620px){ .hub-grid{grid-template-columns:repeat(2,1fr)} } /* ---------- NÚMEROS MONO ---------- */ .mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums} /* ---------- DIVIDER ---------- */ .divider{border:none;border-top:1px solid var(--border);margin:1.5rem 0} /* ---------- ASSISTENTE IA (widget flutuante, initAssistente — core.js) ---------- */ .assistente-widget{position:fixed;bottom:22px;right:22px;z-index:998} .assistente-btn{width:52px;height:52px;border-radius:50%;background:var(--accent);color:#F5F3EE;border:none;font-size:22px;cursor:pointer;box-shadow:0 6px 20px rgba(20,36,59,0.28);display:flex;align-items:center;justify-content:center;transition:transform 0.15s,background 0.15s} .assistente-btn:hover{background:var(--profundo);transform:scale(1.06)} body.dark .assistente-btn{background:var(--vivo)} body.dark .assistente-btn:hover{background:var(--accent-vivo)} .assistente-painel{position:fixed;bottom:84px;right:22px;width:340px;max-width:calc(100vw - 32px);height:460px;max-height:calc(100vh - 120px);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 10px 36px rgba(20,36,59,0.22);display:flex;flex-direction:column;overflow:hidden} .assistente-painel[hidden]{display:none} .assistente-header{background:var(--overlay);color:#F5F3EE;padding:11px 15px;display:flex;align-items:center;justify-content:space-between;font-family:var(--font-display);font-weight:500;font-size:13.5px} .assistente-fechar{background:none;border:none;color:#F5F3EE;cursor:pointer;font-size:13px;opacity:0.75;padding:2px 4px} .assistente-fechar:hover{opacity:1} .assistente-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:9px;font-size:13.5px} .assistente-msg{max-width:85%;padding:8px 12px;border-radius:12px;line-height:1.45;white-space:pre-wrap} .assistente-msg-bot{background:var(--surface-2);color:var(--text);align-self:flex-start;border-bottom-left-radius:4px} .assistente-msg-user{background:var(--accent);color:#F5F3EE;align-self:flex-end;border-bottom-right-radius:4px} body.dark .assistente-msg-user{background:var(--vivo)} .assistente-msg-erro{background:rgba(184,64,64,0.1);color:var(--danger);align-self:flex-start;font-size:12.5px} .assistente-input-bar{display:flex;gap:7px;padding:11px;border-top:1px solid var(--border)} .assistente-input-bar input{flex:1;padding:9px 11px;font-size:13.5px;margin:0} .assistente-aviso{font-size:10.5px;color:var(--muted-2);text-align:center;padding:0 10px 9px} /* ===================================================== ALIASES DE COMPATIBILIDADE (v1 → v2) Mantêm nomes antigos de variáveis funcionando caso algum módulo ainda os referencie diretamente. ===================================================== */ :root{--accent-hover:var(--profundo)} /* ---------- ÍCONES SVG (substituem os emojis — ver ICONES em core.js) ---------- Regra: todo ícone é traço monocromático com currentColor. Quem define a cor é o contexto, não o ícone — por isso funcionam nos dois temas sem variante escura própria. Só o tamanho é ajustado por componente. */ .ico{display:inline-block;vertical-align:middle;flex-shrink:0} /* card de módulo no hub */ .hub-card-icon{color:var(--vivo)} .hub-card-icon .ico{width:19px;height:19px} body.dark .hub-card-icon{color:#8FB0D6} /* faixa do Dashboard (fundo azul-noite: ícone em dourado claro) */ .dash-icon{color:#E4CF9F} .dash-icon .ico{width:23px;height:23px} /* estado vazio de tabela/lista */ .empty-icon{line-height:0} .empty-icon .ico{width:40px;height:40px} /* rótulos com ícone (métricas, chips) */ .metric-label,.dash-chip-label{display:inline-flex;align-items:center;gap:6px} .metric-label .ico,.dash-chip-label .ico{width:13px;height:13px;opacity:.75} /* botões: .btn e .btn-header já são inline-flex com gap */ .btn .ico{width:15px;height:15px} .btn-header{gap:6px} .btn-header .ico{width:14px;height:14px} .dark-toggle .ico{width:14px;height:14px} /* assistente flutuante */ .assistente-btn .ico{width:22px;height:22px} .assistente-fechar .ico{width:15px;height:15px} /* selos de status inline (substituem ✅/❌) */ .status-ico{display:inline-flex;align-items:center;gap:5px} .status-ico .ico{width:14px;height:14px} /* ---------- PLACEHOLDER ---------- Regra: placeholder é exemplo do formato esperado, não rótulo. Todo campo da plataforma tem