/* ============================================================ Campanhas — TOKENS compartilhados (indice iframe + pagina interna) Fonte canonica dos valores: docs/mockups/campanhas/campanhas.css (o indice e a referencia visual; estes tokens espelham ele). Prefixo --cg- para nao colidir com os tokens locais do mockup. Temas: o iframe (preview.html) alterna via [data-theme] no . O index.html trava , entao no app principal o escuro so liga onde um container marcar [data-cg-theme="dark"] (a pagina interna da campanha faz isso a partir da escolha salva pelo botao de lua do indice — localStorage "campanhas-theme"). ============================================================ */ :root{ /* tipo */ --cg-font-sans:"Poppins",ui-sans-serif,system-ui,sans-serif; --cg-font-mono:"JetBrains Mono",ui-monospace,Consolas,monospace; --cg-fs-title:20px; --cg-fs-block:15px; --cg-fs-body:13px; --cg-fs-control:12px; --cg-fs-caption:11px; /* espaco (grid de 8px) */ --cg-sp-1:4px; --cg-sp-2:8px; --cg-sp-3:12px; --cg-sp-4:16px; --cg-sp-5:20px; --cg-sp-6:32px; /* forma */ --cg-r-card:12px; --cg-r-control:8px; --cg-r-pill:999px; --cg-bd-w:.5px; --cg-bd:rgba(0,0,0,.10); --cg-bd-strong:rgba(0,0,0,.18); /* cor — claro (canonico) */ --cg-surface-page:#F7F6F4; --cg-surface-card:#FFFFFF; --cg-surface-muted:#F1EFEC; --cg-text-1:#1C1B1A; --cg-text-2:#6B6A67; --cg-text-3:#9B9A96; --cg-brand:#993556; --cg-brand-on:#FBEAF0; --cg-brand-soft:#F4E4EA; --cg-live:#0E8F63; --cg-danger:#DC2626; --cg-danger-soft:#FEF2F2; /* progresso (um so componente: mesma altura/raio/cores nos dois docs) */ --cg-progress-h:3px; --cg-progress-r:2px; --cg-progress-track:var(--cg-surface-muted); --cg-progress-fill:var(--cg-text-1); /* movimento */ --cg-motion-fast:160ms; /* sombra so para camadas flutuantes (menu/toast/modal). Card: NUNCA. */ --cg-shadow-pop:0 12px 32px rgba(27,23,32,.12); } :root[data-theme="dark"],[data-cg-theme="dark"]{ --cg-bd:rgba(255,255,255,.12); --cg-bd-strong:rgba(255,255,255,.22); --cg-surface-page:#131117; --cg-surface-card:#1C1922; --cg-surface-muted:#262130; --cg-text-1:#ECE7F0; --cg-text-2:#A79FB2; --cg-text-3:#81778D; --cg-brand-on:#FBEAF0; --cg-brand-soft:#2B1D26; --cg-live:#5CC59B; --cg-danger:#F2B8B5; --cg-danger-soft:#3A2326; --cg-shadow-pop:0 12px 32px rgba(0,0,0,.4); } @media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){ --cg-bd:rgba(255,255,255,.12); --cg-bd-strong:rgba(255,255,255,.22); --cg-surface-page:#131117; --cg-surface-card:#1C1922; --cg-surface-muted:#262130; --cg-text-1:#ECE7F0; --cg-text-2:#A79FB2; --cg-text-3:#81778D; --cg-brand-on:#FBEAF0; --cg-brand-soft:#2B1D26; --cg-live:#5CC59B; --cg-danger:#F2B8B5; --cg-danger-soft:#3A2326; --cg-shadow-pop:0 12px 32px rgba(0,0,0,.4); } }