/* ============================================================ Alvesmaia — tokens (handoff v2) Dois eixos independentes: - tema: claro (padrão) e escuro, via data-tema no - acento: índigo #4F6BFF, escrito direto nas variáveis base para a página pintar índigo já no primeiro frame As cores de marca de origem (navy, neutros, semânticas) vêm de brand/tokens.css da identidade. O ciano #00A8E8 foi substituído por índigo como acento — os demais arquivos da marca ainda precisam ser regerados (favicon e símbolo deste repositório já estão). ============================================================ */ :root, [data-tema="claro"] { /* superfícies */ --bg: #FFFFFF; --bg-alt: #F6F9FC; --card: #FFFFFF; --card-2: #F1F7FC; /* linhas */ --rule: #D7E2EC; --rule-2: #B9C8D6; --rule-3: #EAF1F7; /* Borda de controle, nao de divisoria. O WCAG 1.4.11 pede 3:1 para o que delimita um componente de interface; --rule rende 1.31:1 sobre o fundo e serve so como linha decorativa. Este rende 3.60:1. */ --rule-forte: #77899B; /* tinta */ --ink: #102A43; --text: #0F1E2B; --muted: #5A7189; --faint: #4E6478; /* acento índigo */ --link: #3A4FD8; --cta: #3A4FD8; --cta-hover: #2E3FB8; --cta-ink: #FFFFFF; --acento: #4F6BFF; --chip: #EEF1FF; /* semânticas */ --ok: #0E7A54; --halo-ok: rgba(14, 122, 84, 0.10); --warn: #96600B; --danger: #B02E21; /* compostos */ --header: rgba(255, 255, 255, 0.86); --hero: radial-gradient(1800px 680px at 50% -22%, #E7ECFF 0%, #FFFFFF 72%); --shadow: 0 18px 44px rgba(16, 42, 67, 0.10); /* tipografia */ --fonte: "Nunito Sans", "Segoe UI", Helvetica, Arial, sans-serif; } /* Cinza-grafite, não azul-marinho: o escuro anterior pesava demais. */ [data-tema="escuro"] { --bg: #191919; --bg-alt: #1E1E1E; --card: #202020; --card-2: #272727; --rule: #2F2F2F; --rule-2: #3D3D3D; --rule-3: #252525; /* 3.30:1 sobre --bg e 3.06:1 sobre --card: passa nas duas superficies. */ --rule-forte: #6B6B6B; --ink: #FFFFFF; --text: #EDEDED; --muted: #A5A5A5; --faint: #9A9A9A; --link: #8FA3FF; --cta: #8FA3FF; --cta-hover: #AEBCFF; --cta-ink: #08122E; --acento: #4F6BFF; --chip: #232733; --ok: #4FC79A; --halo-ok: rgba(79, 199, 154, 0.14); --warn: #E0A661; --danger: #F08B7C; --header: rgba(25, 25, 25, 0.86); --hero: radial-gradient(1800px 680px at 50% -22%, #23283D 0%, #191919 72%); --shadow: 0 18px 44px rgba(0, 0, 0, 0.44); }