/* ============================================================ AIDA11 — Design Tokens (fonte única da verdade) Redesign 2026 · Rajdhani + JetBrains Mono Carregar ANTES dos outros CSS. Use as variáveis, não hex solto. RESPEITA o sistema existente: - Tema por perfil: theme-manager.js seta data-theme="dark|light" no e . Default: dark. Tokens abaixo trocam junto. - Accent por perfil: profile.js injeta --profile-accent / --profile-accent-strong inline. O accent aqui DEFERE a eles; o violeta #9D70EB é só fallback da marca AIDA11. ============================================================ */ :root { /* ---- Marca / Accent (defere ao accent do perfil) ---- */ --a11-accent: var(--profile-accent, #9D70EB); --a11-accent-deep: var(--profile-accent-strong, #41148F); --a11-accent-hover: color-mix(in srgb, var(--a11-accent) 78%, #fff); --a11-accent-soft: color-mix(in srgb, var(--a11-accent) 14%, transparent); --a11-ring: color-mix(in srgb, var(--a11-accent) 50%, transparent); --a11-grad: linear-gradient(135deg, var(--a11-accent) 0%, var(--a11-accent-deep) 100%); --a11-grad-soft: linear-gradient(135deg, var(--a11-accent) 0%, color-mix(in srgb, var(--a11-accent) 70%, #000) 100%); /* ---- Tipografia (independente de tema) ---- */ --a11-font-display: 'Rajdhani', system-ui, sans-serif; --a11-font-ui: 'Rajdhani', system-ui, sans-serif; --a11-font-mono: 'JetBrains Mono', ui-monospace, 'Courier New', monospace; /* Aliases --font-* definidos AQUI também (literal Rajdhani), não só no 01-base-tokens: garante que var(--font-d/b/m) resolva em QUALQUER página que carregue este arquivo, sem depender do bundle do dashboard. Nunca mais "--font-d is not defined". */ --font-d: 'Rajdhani', system-ui, sans-serif; --font-b: 'Rajdhani', system-ui, sans-serif; --font-m: 'JetBrains Mono', ui-monospace, 'Courier New', monospace; /* ---- Raio ---- */ --a11-r-sm: 10px; --a11-r: 14px; --a11-r-lg: 18px; --a11-r-pill: 999px; /* ---- Espaçamento (escala 4px) ---- */ --a11-sp-1: 4px; --a11-sp-2: 8px; --a11-sp-3: 12px; --a11-sp-4: 16px; --a11-sp-5: 20px; --a11-sp-6: 24px; --a11-sp-8: 32px; /* ---- Semânticas (separadas do accent) ---- */ --a11-good: #10B981; --a11-warn: #EAB308; --a11-crit: #EF4444; /* ---- Movimento ---- */ --a11-ease: cubic-bezier(.22, .61, .36, 1); --a11-ease-pop: cubic-bezier(.34, 1.35, .50, 1); --a11-dur: .28s; --a11-sweep-dur: .85s; --a11-sheen: rgba(255, 255, 255, .78); /* ---- Neutros: DARK (default do site) ---- */ --a11-bg: #050505; --a11-bg-2: #0A0A0A; --a11-surface: #0D0D0D; --a11-surface-2: #141414; --a11-border: rgba(255, 255, 255, .07); --a11-border-2: rgba(255, 255, 255, .13); --a11-text: #FFFFFF; --a11-muted: rgba(255, 255, 255, .60); --a11-faint: rgba(255, 255, 255, .40); --a11-rail: #080808; --a11-rail-item: #1B1B1B; --a11-chan: #0B0B0B; --a11-shadow-card: 0 2px 12px rgba(0, 0, 0, .50); --a11-shadow-lift: 0 24px 54px -14px rgba(0, 0, 0, .75); } /* ---- Neutros: LIGHT (quando o perfil escolhe tema claro) ---- */ :root[data-theme="light"] { --a11-bg: #F1EEF9; --a11-bg-2: #E7E2F3; --a11-surface: #FFFFFF; --a11-surface-2: #F7F5FC; --a11-border: rgba(20, 12, 40, .10); --a11-border-2: rgba(20, 12, 40, .17); --a11-text: #140E22; --a11-muted: rgba(20, 14, 34, .62); --a11-faint: rgba(20, 14, 34, .42); --a11-rail: #EDE9F6; --a11-rail-item: #FFFFFF; --a11-chan: #F4F1FA; --a11-sheen: rgba(255, 255, 255, .92); --a11-shadow-card: 0 2px 10px rgba(52, 20, 143, .08); --a11-shadow-lift: 0 22px 46px -14px rgba(52, 20, 143, .28); } /* ============================================================ Aliases retrocompatíveis — nomes já usados no código atual. Late-bound: acompanham tema e accent do perfil automaticamente. Nova manutenção: prefira os --a11-*. NÃO sobrescrevem o inline do profile.js (inline vence :root). ============================================================ */ :root { --accent: var(--a11-accent); --primary-color: var(--a11-accent); --accent-hover: var(--a11-accent-hover); --accent-deep: var(--a11-accent-deep); --accent-glow: var(--a11-accent-soft); --primary-gradient: var(--a11-grad); --aida11-gradient: var(--a11-grad); --gradient: var(--a11-grad); --bg-primary: var(--a11-bg); --bg-secondary: var(--a11-bg-2); --bg-card: var(--a11-surface); --bg-elevated: var(--a11-surface-2); --text-primary: var(--a11-text); --text-secondary: var(--a11-muted); --text-muted: var(--a11-faint); --border-hover: var(--a11-border-2); --success: var(--a11-good); --danger: var(--a11-crit); } @media (prefers-reduced-motion: reduce) { :root { --a11-dur: 0s; --a11-sweep-dur: 0s; } }