/* ============================================================================= AutomationsAI · formato-curso-v2 · learn.css Camada de aprendizagem + sistema de temas (DESIGN-SPEC §3). ARQUITETURA DE COR EM 3 NÍVEIS (web.dev): Nível 1 — PRIMITIVOS : canais HSL crus (--c-*-h/-s/-l). Nunca consumidos direto. Nível 2 — TOKENS/TEMA : por .dark / [data-theme], traduzem primitivos -> papéis. Nível 3 — SEMÂNTICOS : --bg --surface --surface-2 --text --text-muted --border --primary --accent --accent-2. >>> A PÁGINA CONSOME SÓ ESTE NÍVEL. <<< DOIS LAYERS ORTOGONAIS (decisão travada): Layer 1 (claro/escuro) = classe .dark do Tailwind (NÃO migrar root p/ data-theme). Layer 2 (variante leitura) = atributo data-theme no (sepia/foco/contraste). Este arquivo NÃO redefine utilitários Tailwind. Estiliza só: - os tokens semânticos (nível 3), - o wrapper de prosa .inema-prose (prefs de leitura), - os componentes NOVOS da camada de aprendizagem. ============================================================================= */ /* ============================================================================= 0. RESET MÍNIMO + ALVOS DE ÂNCORA (nav sticky obscurece foco — WCAG 2.4.11) ============================================================================= */ :where(html) { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } /* scroll-margin em TODO alvo de âncora: tópicos, blocos, headings, cards de módulo e qualquer elemento com id. Usa a altura do nav como offset. */ :where([id]), :where([data-inema-topic]), :where([data-inema-block]), :where([data-inema-module]) { scroll-margin-top: var(--inema-nav-h, 5rem); } html { scroll-behavior: smooth; } /* ============================================================================= 1. NÍVEL 1 — PRIMITIVOS (canais HSL crus, neutros à marca) Disponíveis a todos os temas; cada tema escolhe quais usar no nível 2. ============================================================================= */ :root { /* Âmbar / marca (primary) — base FACC15 */ --c-amber-h: 48; --c-amber-s: 96%; --c-amber-l: 53%; /* Ciano / acento-2 — base 38bdf8 */ --c-cyan-h: 199; --c-cyan-s: 92%; --c-cyan-l: 60%; /* Sky — links externos AutomationsAI */ --c-sky-h: 204; --c-sky-s: 94%; --c-sky-l: 58%; /* Famílias de trilha (slugs de --data-accent). HSL aproximando Tailwind. */ --c-emerald-h: 160; --c-emerald-s: 84%; --c-emerald-l: 39%; /* T1 */ --c-blue-h: 217; --c-blue-s: 91%; --c-blue-l: 60%; /* T2 */ --c-purple-h: 258; --c-purple-s: 90%; --c-purple-l: 66%; /* T3 */ --c-track-amber-h: 38; --c-track-amber-s: 92%; --c-track-amber-l: 50%; /* T4 */ --c-teal-h: 173; --c-teal-s: 80%; --c-teal-l: 40%; /* T5 */ --c-rose-h: 350; --c-rose-s: 89%; --c-rose-l: 60%; /* T6 */ /* Estados semânticos de anotação/feedback (independem de tema) */ --c-doubt-h: 25; --c-doubt-s: 95%; --c-doubt-l: 53%; /* dúvida (laranja) */ --c-ok-h: 142; --c-ok-s: 71%; --c-ok-l: 45%; /* acerto */ --c-warn-h: 0; --c-warn-s: 72%; --c-warn-l: 51%; /* erro/alerta */ /* === Variáveis de chassi (timing, raios) — neutras a tema === */ --inema-radius: 0.75rem; /* 12px = rounded-xl da baseline */ --inema-radius-sm: 0.5rem; --inema-radius-pill: 9999px; --inema-nav-h: 5rem; --inema-dur-fast: 120ms; --inema-dur: 180ms; --inema-dur-slow: 320ms; --inema-ease: cubic-bezier(0.4, 0, 0.2, 1); /* === ACENTO POR TRILHA (data-accent) — default emerald (T1) === O acento alimenta os componentes NOVOS e o