/* =========================================================================
   B2AI Academy — Sistema Visual Único (v6)
   Fonte de verdade de tokens para TODAS as páginas (aulas, mapas, ponte, cruz,
   diagnóstico). Light = padrão; dark (noturno) via html[data-theme="noturno"].
   Regras duras:
   - Dark canônico = #080C14 (navy). Aposenta #10161F.
   - LIME (#A8F04B) NUNCA como texto sobre claro (falha contraste AA).
     Texto-acento no claro usa --accent-ink (verde escuro). No escuro, lime é ok.
   - Three.js lê os tokens --three-* via getComputedStyle e troca no toggle.
   ========================================================================= */

:root{
  /* ---- superfície (LIGHT, padrão) ---- */
  --bg:        #FAFAFA;   /* bone */
  --bg2:       #FFFFFF;
  --panel:     rgba(10,31,61,.035);
  --panel2:    rgba(10,31,61,.06);
  --line:      rgba(10,31,61,.10);
  --line2:     rgba(10,31,61,.17);

  /* ---- texto ---- */
  --ink:       #0A1F3D;   /* azul-tinta */
  --mut:       #5A6B82;
  --link:      #2B4A73;

  /* ---- marca / acento ---- */
  --lime:      #A8F04B;   /* fill / CTA / glow / borda — NUNCA texto no claro */
  --lime-deep: #7BC22F;
  --accent-ink:#41691A;   /* verde escuro: texto-acento seguro no claro */
  --gold:      #D4AF37;   /* RESERVADO: "horas humanas devolvidas". Não usar como decoração */
  --cta-bg:    #A8F04B;
  --cta-ink:   #0A1505;

  /* ---- semânticos ---- */
  --success:   #3F8E5B;
  --warn:      #C2611F;
  --danger:    #C0392B;

  /* ---- tipografia ---- */
  --font-display: 'Archivo', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;
  --fs-scale: 1;   /* controle A− / A+ multiplica isto */

  /* ---- raios / sombra ---- */
  --r-sm: 8px; --r-md: 12px; --r-lg: 18px;
  --shadow: 0 8px 30px rgba(10,31,61,.08);

  /* ---- tokens 3D (three.js lê via getComputedStyle) ---- */
  --three-bg:     #EEF1F6;
  --three-ground: #DDE3EC;
  --three-model:  #FFFFFF;
  --three-model2: #EEF1F6;
  --three-edge:   #9AA6B6;
  --three-accent: #A8F04B;
  --three-grid1:  #C4CCD8;
  --three-grid2:  #DDE3EC;

  /* ---- wires SVG (diagramas) ---- */
  --wire-neutral: #9AA6B6;
  --wire-blue:    #2B4A73;
  --wire-green:   #41691A;
  --wire-exec:    #7BC22F;
}

html[data-theme="noturno"]{
  --bg:        #080C14;   /* navy canônico */
  --bg2:       #0E1118;
  --panel:     rgba(255,255,255,.028);
  --panel2:    rgba(255,255,255,.055);
  --line:      rgba(255,255,255,.08);
  --line2:     rgba(255,255,255,.14);

  --ink:       #EAEDF2;
  --mut:       #828B9A;
  --link:      #8FB4E0;

  --lime:      #A8F04B;
  --lime-deep: #7BC22F;
  --accent-ink:#A8F04B;   /* no escuro, lime É seguro como texto */
  --cta-bg:    #A8F04B;
  --cta-ink:   #0A1505;

  --success:   #5BC98C;
  --warn:      #E07B4B;
  --danger:    #E5604D;

  --shadow: 0 10px 40px rgba(0,0,0,.45);

  --three-bg:     #080C14;
  --three-ground: #0E1118;
  --three-model:  #AFB7C4;
  --three-model2: #C8CFDA;
  --three-edge:   #2B3340;
  --three-accent: #A8F04B;
  --three-grid1:  #333B49;
  --three-grid2:  #1B212B;

  --wire-neutral: #9AA6B6;
  --wire-blue:    #6FA8E0;
  --wire-green:   #A8F04B;
  --wire-exec:    #7BC22F;
}

/* ---------- base opcional (páginas podem aderir) ---------- */
.b2-base{
  background:var(--bg); color:var(--ink);
  font-family:var(--font-body);
  font-size:calc(16px * var(--fs-scale));
  -webkit-font-smoothing:antialiased;
}
.b2-base h1,.b2-base h2,.b2-base h3{font-family:var(--font-display);letter-spacing:-.02em;}
.b2-base code,.b2-base kbd,.b2-base .mono{font-family:var(--font-mono);}
.b2-base a{color:var(--link);}

/* acento de texto seguro: usa SEMPRE var(--accent-ink), nunca var(--lime) cru */
.b2-accent{color:var(--accent-ink);}

/* CTA padrão */
.b2-cta{background:var(--cta-bg);color:var(--cta-ink);font-family:var(--font-display);
  font-weight:700;border:none;border-radius:var(--r-md);padding:11px 20px;cursor:pointer;}
.b2-cta:hover{filter:brightness(1.06);}

/* controle de fonte A− / A+ (a barra usa utils/theme.js para mexer em --fs-scale) */
.b2-fontctl{display:inline-flex;gap:2px;align-items:center;}
.b2-fontctl button{font-family:var(--font-mono);background:var(--panel);border:1px solid var(--line);
  color:var(--mut);border-radius:var(--r-sm);width:28px;height:28px;cursor:pointer;}
.b2-fontctl button:hover{color:var(--ink);border-color:var(--line2);}

@media (prefers-reduced-motion:reduce){ *{transition:none!important;animation:none!important;} }