/* global React */
/* ===========================================================
   VOLTLAB · MÓDULO DE ILUMINAÇÃO
   Dimensionamento pelo Método dos Lúmens (NBR ISO/CIE 8995-1)
   Cálculo de circuitos de iluminação conforme NBR 5410.
   
   Funcionalidades:
   ─ Cálculo de fluxo luminoso total e número de luminárias
   ─ Fator de utilização (FU) por tipo de ambiente e teto
   ─ Fator de depreciação (Fd) configurável
   ─ Dimensionamento do circuito elétrico (cabo, disjuntor)
   ─ Memória de cálculo passo-a-passo
   ─ Gerenciador de múltiplos ambientes por projeto
   ─ Exportação JSON/CSV
=========================================================== */
const { useState, useMemo, useEffect, useCallback, useRef } = React;

const usePersist = (key, initial) => {
  if (window.useLocalStorage) return window.useLocalStorage(key, initial);
  return React.useState(initial);
};

/* ===========================================================
   DADOS TÉCNICOS
=========================================================== */
const IL_DATA = {
  /* Iluminâncias recomendadas NBR ISO/CIE 8995-1 (lux) */
  ambientes: [
    { id: "escritorio",      label: "Escritório / Sala de trabalho",  E: 500,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 1.25 },
    { id: "sala_reuniao",    label: "Sala de reunião / Conferência",  E: 500,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 1.25 },
    { id: "corredor",        label: "Corredor / Circulação",          E: 100,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 0.80 },
    { id: "banheiro",        label: "Banheiro / Vestiário",           E: 200,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 0.80 },
    { id: "cozinha",         label: "Cozinha / Copa",                 E: 300,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 1.00 },
    { id: "sala_estar",      label: "Sala de estar / Recepção",       E: 200,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 1.00 },
    { id: "dormitorio",      label: "Dormitório / Quarto",            E: 150,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 0.80 },
    { id: "garagem",         label: "Garagem / Estacionamento",       E: 75,   rho_teto: 0.50, rho_parede: 0.30, k_ref: 0.75 },
    { id: "deposito",        label: "Depósito / Almoxarifado",        E: 100,  rho_teto: 0.50, rho_parede: 0.30, k_ref: 0.80 },
    { id: "fabrica_grossa",  label: "Fabricação — trabalho grosso",   E: 200,  rho_teto: 0.50, rho_parede: 0.30, k_ref: 0.90 },
    { id: "fabrica_media",   label: "Fabricação — trabalho médio",    E: 500,  rho_teto: 0.50, rho_parede: 0.30, k_ref: 1.00 },
    { id: "fabrica_fina",    label: "Fabricação — trabalho fino",     E: 750,  rho_teto: 0.50, rho_parede: 0.30, k_ref: 1.25 },
    { id: "laboratorio",     label: "Laboratório / Sala técnica",     E: 750,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 1.25 },
    { id: "sala_aula",       label: "Sala de aula / Treinamento",     E: 500,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 1.25 },
    { id: "biblioteca",      label: "Biblioteca / Arquivo",           E: 500,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 1.25 },
    { id: "area_externa",    label: "Área externa / Pátio",           E: 50,   rho_teto: 0.10, rho_parede: 0.10, k_ref: 0.60 },
    { id: "personalizado",   label: "Personalizado…",                 E: 500,  rho_teto: 0.70, rho_parede: 0.50, k_ref: 1.00 },
  ],

  /* Lâmpadas / luminárias típicas */
  lampadas: [
    { id: "led_tubular_18w",   label: "LED Tubular 18W / 120cm",   P: 18,  Fl: 2000,  fp: 0.92 },
    { id: "led_tubular_36w",   label: "LED Tubular 36W / 120cm",   P: 36,  Fl: 4000,  fp: 0.92 },
    { id: "led_painel_25w",    label: "LED Painel 25W / 60×60cm",  P: 25,  Fl: 2500,  fp: 0.95 },
    { id: "led_painel_36w",    label: "LED Painel 36W / 60×60cm",  P: 36,  Fl: 3600,  fp: 0.95 },
    { id: "led_downlight_9w",  label: "LED Downlight 9W",          P: 9,   Fl: 800,   fp: 0.90 },
    { id: "led_downlight_15w", label: "LED Downlight 15W",         P: 15,  Fl: 1500,  fp: 0.92 },
    { id: "led_highbay_100w",  label: "LED HighBay 100W (industrial)", P: 100, Fl: 14000, fp: 0.95 },
    { id: "led_highbay_150w",  label: "LED HighBay 150W (industrial)", P: 150, Fl: 21000, fp: 0.95 },
    { id: "led_highbay_200w",  label: "LED HighBay 200W (industrial)", P: 200, Fl: 28000, fp: 0.95 },
    { id: "led_spot_7w",       label: "LED Spot 7W (GU10)",        P: 7,   Fl: 600,   fp: 0.85 },
    { id: "led_spot_12w",      label: "LED Spot 12W (GU10)",       P: 12,  Fl: 1050,  fp: 0.88 },
    { id: "fluoresc_hf_32w",   label: "Fluoresc. HF 2×32W",        P: 64,  Fl: 5200,  fp: 0.92 },
    { id: "fluoresc_hf_54w",   label: "Fluoresc. HF 2×54W",        P: 108, Fl: 9800,  fp: 0.92 },
    { id: "sodio_250w",        label: "Vapor Sódio 250W",          P: 275, Fl: 27500, fp: 0.85 },
    { id: "sodio_400w",        label: "Vapor Sódio 400W",          P: 440, Fl: 48000, fp: 0.85 },
    { id: "personalizado_lam", label: "Personalizado…",            P: 36,  Fl: 3600,  fp: 0.92 },
  ],

  /* Fator de depreciação */
  fd_opcoes: [
    { value: "0.80", label: "0,80 — Manutenção regular (recomendado)" },
    { value: "0.75", label: "0,75 — Manutenção periódica" },
    { value: "0.70", label: "0,70 — Manutenção esporádica" },
    { value: "0.65", label: "0,65 — Ambiente agressivo / poeirento" },
    { value: "0.60", label: "0,60 — Sem manutenção programada" },
  ],

  /* Refletâncias de teto */
  rho_teto_opcoes: [
    { value: "0.80", label: "0,80 — Branco puro" },
    { value: "0.70", label: "0,70 — Branco / creme" },
    { value: "0.50", label: "0,50 — Cinza claro / bege" },
    { value: "0.30", label: "0,30 — Cinza médio / cor" },
    { value: "0.10", label: "0,10 — Escuro / concreto aparente" },
  ],

  /* Seções comerciais de cabos */
  secoes: [1.5, 2.5, 4, 6, 10, 16, 25],
  
  /* Ampacidade tabela B1 embutido (A) para cabo PVC bifásico */
  ampacity_pvc_2: { 1.5: 17, 2.5: 22, 4: 30, 6: 38, 10: 52, 16: 71, 25: 93 },

  /* Disjuntores comerciais (A) */
  disjuntores: [6, 10, 16, 20, 25, 32, 40, 50, 63],
};

/* ===========================================================
   LÓGICA DE CÁLCULO
=========================================================== */
function calcularKr(comprimento, largura, hm) {
  // Índice do local (k) = (C × L) / (hm × (C + L))
  const area = comprimento * largura;
  const perimetro = comprimento + largura;
  if (!hm || !perimetro) return 0;
  return area / (hm * perimetro);
}

function calcularFU(kr, rho_teto, rho_parede, tipoLuminaria) {
  // Aproximação por polinômio calibrado por tipo de teto e luminária
  // Baseado em tabelas de FU típicas (luminária direta embutida)
  const rho_t = parseFloat(rho_teto);
  const rho_p = parseFloat(rho_parede);
  
  // Peso das refletâncias
  const rflex = (rho_t * 0.55 + rho_p * 0.30 + 0.15 * 0.20);
  
  // FU base pela curva do índice k
  let fu_base;
  const k = Math.min(Math.max(kr, 0.5), 5);
  if (k < 1) fu_base = 0.28 + 0.18 * (k - 0.5) / 0.5;
  else if (k < 2) fu_base = 0.46 + 0.14 * (k - 1);
  else if (k < 3) fu_base = 0.60 + 0.07 * (k - 2);
  else if (k < 4) fu_base = 0.67 + 0.04 * (k - 3);
  else fu_base = 0.71 + 0.02 * (k - 4);
  
  // Ajuste por refletância
  const fu = fu_base * (0.65 + 0.35 * rflex * 1.8);
  return Math.min(Math.max(fu, 0.20), 0.85);
}

function calcularAmbiente(params) {
  const {
    comprimento, largura, alturaTotal, alturaPE,
    E_alvo, fd, rho_teto, rho_parede,
    lamp_P, lamp_Fl, lamp_fp,
    tensao, sistema,
  } = params;

  const C = parseFloat(comprimento);
  const L = parseFloat(largura);
  const hTotal = parseFloat(alturaTotal);
  const hPE = parseFloat(alturaPE); // altura do plano de trabalho
  const E = parseFloat(E_alvo);
  const Fd = parseFloat(fd);
  const Fl = parseFloat(lamp_Fl);
  const P_lam = parseFloat(lamp_P);
  const fp = parseFloat(lamp_fp);
  const V = parseFloat(tensao);

  if (!C || !L || !hTotal || !E || !Fd || !Fl || !P_lam) return null;

  const area = C * L;
  // hm = altura das luminárias sobre o plano de trabalho
  const hm = hTotal - hPE;
  if (hm <= 0) return null;

  // Índice do local
  const kr = calcularKr(C, L, hm);

  // Fator de utilização
  const fu = calcularFU(kr, rho_teto, rho_parede);

  // Fluxo total necessário: Φtotal = (E × A) / (FU × Fd)
  const phi_total = (E * area) / (fu * Fd);

  // Número de luminárias
  const n_float = phi_total / Fl;
  const n_min = Math.ceil(n_float);

  // Iluminância resultante com n_min luminárias
  const E_result = (n_min * Fl * fu * Fd) / area;

  // Potência total instalada
  const P_total = n_min * P_lam; // W

  // Densidade de potência (W/m²)
  const DPI = P_total / area;

  // ── Dimensionamento elétrico ──────────────────────────────
  // Corrente de projeto
  let I_proj;
  const isMono = sistema === "monofasico";
  if (isMono) {
    I_proj = P_total / (V * fp);
  } else {
    I_proj = P_total / (V * Math.sqrt(3) * fp);
  }

  // Corrente de dimensionamento = Ib (sem fatores de correção por simplicidade;
  // o usuário pode usar o módulo de cabos para cálculo rigoroso)
  const I_dim = I_proj * 1.25; // fator de segurança 125% para circuito de iluminação

  // Seção mínima por ampacidade
  let secao_cabo = 1.5;
  for (const s of IL_DATA.secoes) {
    const amp = IL_DATA.ampacity_pvc_2[s];
    if (amp >= I_dim) { secao_cabo = s; break; }
    secao_cabo = s;
  }

  // Disjuntor mínimo
  let disj = IL_DATA.disjuntores[IL_DATA.disjuntores.length - 1];
  for (const d of IL_DATA.disjuntores) {
    if (d >= I_proj * 1.0) { disj = d; break; }
  }

  // Queda de tensão estimada (sem comprimento aqui — cálculo simplificado)
  const rho_cu = 0.0175; // Ω·mm²/m

  return {
    C, L, area, hm, kr, fu, Fd, phi_total,
    n_float, n_min, E_result, E_alvo: E,
    P_total, DPI,
    I_proj, I_dim, secao_cabo, disj,
    lamp_P: P_lam, lamp_Fl: Fl, lamp_fp: fp,
    status_E: E_result >= E * 0.95 ? "ok" : "warn",
    status_dpi: DPI <= 15 ? "ok" : DPI <= 25 ? "warn" : "danger",
  };
}

/* ===========================================================
   COMPONENTES ATOMS (seguindo padrão VoltLab)
=========================================================== */
const IL_Icon = ({ name, size = 18 }) => {
  const p = { width: size, height: size, viewBox: "0 0 24 24", fill: "none",
    stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round" };
  const icons = {
    bulb:     <><path d="M9 21h6"/><path d="M10 18h4"/><path d="M12 3a6 6 0 00-4 10.5c1 1 1.5 2 1.5 3.5h5c0-1.5.5-2.5 1.5-3.5A6 6 0 0012 3z"/></>,
    room:     <><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18M9 21V9"/></>,
    plus:     <><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></>,
    trash:    <><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 01-2 2H8a2 2 0 01-2-2L5 6"/><path d="M10 11v6M14 11v6"/></>,
    check:    <polyline points="20 6 9 17 4 12"/>,
    warn:     <><path d="M10.3 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></>,
    info:     <><circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/></>,
    download: <><path d="M12 3v12"/><polyline points="7 10 12 15 17 10"/><line x1="4" y1="21" x2="20" y2="21"/></>,
    refresh:  <><path d="M21 12a9 9 0 11-3-6.7L21 8"/><path d="M21 3v5h-5"/></>,
    copy:     <><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1"/></>,
    lux:      <><path d="M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8"/></>,
    bolt:     <path d="M13 2L4 14h7l-2 8 9-12h-7z"/>,
    arrow:    <><line x1="5" y1="12" x2="19" y2="12"/><polyline points="13 6 19 12 13 18"/></>,
  };
  return <svg {...p}>{icons[name] || null}</svg>;
};

const IL_ResultBig = ({ label, value, unit, status }) => (
  <div className={"vl-result-big " + (status ? "vl-result-" + status : "")}>
    <div className="vl-result-corner vl-result-corner-tl"/>
    <div className="vl-result-corner vl-result-corner-tr"/>
    <div className="vl-result-corner vl-result-corner-bl"/>
    <div className="vl-result-corner vl-result-corner-br"/>
    <div className="vl-result-label">{label}</div>
    <div className="vl-result-row">
      <span className="readout vl-result-val">{value}</span>
      <em>{unit}</em>
    </div>
  </div>
);

const IL_MetricCell = ({ label, value, unit, status }) => (
  <div className={"vl-metric " + (status ? "vl-metric-" + status : "")}>
    <div className="vl-metric-label">{label}</div>
    <div className="vl-metric-value">
      <span className="readout">{value}</span>
      {unit && <em>{unit}</em>}
    </div>
  </div>
);

const IL_StatusBanner = ({ kind, children }) => (
  <div className={"vl-banner vl-banner-" + kind}>
    <IL_Icon name={kind === "ok" ? "check" : "warn"} size={16}/>
    <span>{children}</span>
  </div>
);

const IL_MemoryStep = ({ n, title, children, isFormula }) => (
  <div className="vl-mem-step">
    <div className="vl-mem-step-head">
      <span className="vl-mem-step-n">{String(n).padStart(2, "0")}</span>
      <span className="vl-mem-step-title">{title}</span>
    </div>
    <div className={"vl-mem-step-body " + (isFormula ? "is-formula" : "")}>{children}</div>
  </div>
);

const IL_FieldBlock = ({ label, hint, children }) => (
  <div className="vl-field">
    <label className="vl-field-label">
      <span>{label}</span>
      {hint && <span className="vl-field-hint">{hint}</span>}
    </label>
    {children}
  </div>
);

const IL_NumberInput = ({ value, onChange, suffix, step, min }) => (
  <div className="vl-input">
    <input type="number" value={value}
      onChange={e => onChange(e.target.value)}
      step={step ?? "0.1"} min={min ?? "0"} placeholder="0"/>
    {suffix && <span className="vl-input-suffix">{suffix}</span>}
  </div>
);

const IL_Select = ({ value, onChange, options }) => {
  if (window.Dropdown_VL) {
    return <window.Dropdown_VL value={value} onChange={onChange} options={options}/>;
  }
  return (
    <div className="vl-input">
      <select value={value} onChange={e => onChange(e.target.value)}>
        {options.map(o => <option key={o.value} value={o.value}>{o.label}</option>)}
      </select>
    </div>
  );
};

const IL_Seg = ({ value, onChange, options }) => (
  <div className="seg">
    {options.map(o => (
      <button key={o.value} className={value === o.value ? "is-active" : ""}
        onClick={() => onChange(o.value)}>{o.label}</button>
    ))}
  </div>
);

/* ===========================================================
   VISUALIZADOR DE PLANTA BAIXA (mini canvas)
=========================================================== */
const PlantaBaixa = ({ comprimento, largura, n_luminarias }) => {
  const W = 260, H = 180;
  const C = parseFloat(comprimento) || 0;
  const L = parseFloat(largura) || 0;
  if (!C || !L) return null;

  const PAD = 24;
  const scaleX = (W - PAD * 2) / C;
  const scaleY = (H - PAD * 2) / L;
  const scale = Math.min(scaleX, scaleY);
  const rW = C * scale, rH = L * scale;
  const ox = (W - rW) / 2, oy = (H - rH) / 2;

  // Grid de luminárias
  const n = parseInt(n_luminarias) || 0;
  const cols = Math.max(1, Math.ceil(Math.sqrt(n * C / L)));
  const rows = Math.ceil(n / cols);
  const lumPos = [];
  for (let r = 0; r < rows; r++) {
    for (let c = 0; c < cols; c++) {
      if (lumPos.length >= n) break;
      const lx = ox + (rW / cols) * (c + 0.5);
      const ly = oy + (rH / rows) * (r + 0.5);
      lumPos.push([lx, ly]);
    }
  }

  return (
    <svg viewBox={`0 0 ${W} ${H}`} style={{ width: "100%", maxHeight: 180, display: "block" }}>
      {/* Room outline */}
      <rect x={ox} y={oy} width={rW} height={rH}
        fill="var(--bg-3)" stroke="var(--border-3)" strokeWidth="1.5" rx="2"/>
      {/* Dimension labels */}
      <text x={ox + rW/2} y={oy - 8} textAnchor="middle" fontSize="9"
        fontFamily="JetBrains Mono" fill="var(--fg-mute)">{C.toFixed(1)}m</text>
      <text x={ox - 8} y={oy + rH/2} textAnchor="middle" fontSize="9"
        fontFamily="JetBrains Mono" fill="var(--fg-mute)" transform={`rotate(-90,${ox-8},${oy+rH/2})`}>{L.toFixed(1)}m</text>
      {/* Luminárias */}
      {lumPos.map(([lx, ly], i) => (
        <g key={i}>
          <circle cx={lx} cy={ly} r={7} fill="var(--accent-soft)" stroke="var(--accent)" strokeWidth="1.2"/>
          <circle cx={lx} cy={ly} r={2.5} fill="var(--accent)" opacity="0.9"/>
          {/* luz irradiada */}
          {[0,45,90,135,180,225,270,315].map(a => {
            const rad = a * Math.PI / 180;
            return <line key={a} x1={lx + Math.cos(rad)*3} y1={ly + Math.sin(rad)*3}
              x2={lx + Math.cos(rad)*9} y2={ly + Math.sin(rad)*9}
              stroke="var(--accent)" strokeWidth="0.8" opacity="0.5"/>;
          })}
        </g>
      ))}
      {/* Badge */}
      {n > 0 && (
        <text x={W - 4} y={H - 6} textAnchor="end" fontSize="8"
          fontFamily="JetBrains Mono" fill="var(--fg-faint)">{n} luminária{n !== 1 ? "s" : ""}</text>
      )}
    </svg>
  );
};

/* ===========================================================
   CARD DE AMBIENTE (na lista de projetos)
=========================================================== */
const AmbienteCard = ({ amb, index, isSelected, onSelect, onRemove, result, canRemove = true }) => (
  <div
    className={"il-amb-card" + (isSelected ? " is-selected" : "")}
    onClick={onSelect}
  >
    <div className="il-amb-top">
      <div className="il-amb-ic"><IL_Icon name="room" size={15}/></div>
      {result && (
        <span className={"il-amb-status " + (result.status_E === "ok" ? "is-ok" : "is-warn")}/>
      )}
      {canRemove && (
        <button
          className="il-amb-del"
          onClick={e => { e.stopPropagation(); onRemove(); }}
          title="Remover ambiente"
        >
          <IL_Icon name="trash" size={12}/>
        </button>
      )}
    </div>
    <div className="il-amb-name">{amb.nome || `Ambiente ${index + 1}`}</div>
    {result ? (
      <div className="il-amb-stats">
        <span><b className="readout">{result.n_min}</b> lum</span>
        <span><b className="readout">{result.E_result.toFixed(0)}</b> lx</span>
        <span><b className="readout">{result.P_total.toFixed(0)}</b> W</span>
      </div>
    ) : (
      <div className="il-amb-empty">Preencha os dados</div>
    )}
  </div>
);

/* ===========================================================
   FORMULÁRIO DE UM AMBIENTE
=========================================================== */
const AmbienteForm = ({ amb, onChange }) => {
  const update = (key, val) => onChange({ ...amb, [key]: val });

  const ambSel = IL_DATA.ambientes.find(a => a.id === amb.tipoAmbiente);
  const lampSel = IL_DATA.lampadas.find(l => l.id === amb.tipoLampada);

  // Sincroniza defaults ao mudar tipo de ambiente
  const onAmbChange = (id) => {
    const a = IL_DATA.ambientes.find(x => x.id === id);
    if (a && id !== "personalizado") {
      onChange({ ...amb, tipoAmbiente: id, E_alvo: String(a.E), rho_teto: String(a.rho_teto), rho_parede: String(a.rho_parede) });
    } else {
      update("tipoAmbiente", id);
    }
  };

  // Sincroniza defaults ao mudar lâmpada
  const onLampChange = (id) => {
    const l = IL_DATA.lampadas.find(x => x.id === id);
    if (l && id !== "personalizado_lam") {
      onChange({ ...amb, tipoLampada: id, lamp_P: String(l.P), lamp_Fl: String(l.Fl), lamp_fp: String(l.fp) });
    } else {
      update("tipoLampada", id);
    }
  };

  const isPersonalAmb = amb.tipoAmbiente === "personalizado";
  const isPersonalLam = amb.tipoLampada === "personalizado_lam";

  return (
    <div style={{ display: "flex", flexDirection: "column", gap: 20 }}>
      {/* Nome */}
      <IL_FieldBlock label="Nome do ambiente">
        <div className="vl-input">
          <input type="text" value={amb.nome || ""} placeholder="Ex: Escritório Térreo"
            onChange={e => update("nome", e.target.value)}/>
        </div>
      </IL_FieldBlock>

      {/* Tipo de ambiente */}
      <IL_FieldBlock label="Tipo de ambiente" hint="NBR ISO/CIE 8995-1">
        <IL_Select
          value={amb.tipoAmbiente}
          onChange={onAmbChange}
          options={IL_DATA.ambientes.map(a => ({ value: a.id, label: a.label }))}
        />
      </IL_FieldBlock>

      {/* Iluminância */}
      <div className="form-row form-row-2">
        <IL_FieldBlock label="Iluminância alvo" hint="lux">
          <IL_NumberInput value={amb.E_alvo} onChange={v => update("E_alvo", v)} suffix="lx" step="25" min="25"/>
        </IL_FieldBlock>
        <IL_FieldBlock label="Fator de depreciação" hint="Fd">
          <IL_Select
            value={amb.fd}
            onChange={v => update("fd", v)}
            options={IL_DATA.fd_opcoes}
          />
        </IL_FieldBlock>
      </div>

      {/* Dimensões */}
      <div className="panel-eyebrow" style={{ marginBottom: -8 }}>DIMENSÕES DO AMBIENTE</div>
      <div className="form-row form-row-2">
        <IL_FieldBlock label="Comprimento">
          <IL_NumberInput value={amb.comprimento} onChange={v => update("comprimento", v)} suffix="m" step="0.1"/>
        </IL_FieldBlock>
        <IL_FieldBlock label="Largura">
          <IL_NumberInput value={amb.largura} onChange={v => update("largura", v)} suffix="m" step="0.1"/>
        </IL_FieldBlock>
      </div>
      <div className="form-row form-row-2">
        <IL_FieldBlock label="Pé-direito (total)" hint="altura do teto">
          <IL_NumberInput value={amb.alturaTotal} onChange={v => update("alturaTotal", v)} suffix="m" step="0.05"/>
        </IL_FieldBlock>
        <IL_FieldBlock label="Plano de trabalho" hint="altura da mesa/bancada">
          <IL_NumberInput value={amb.alturaPE} onChange={v => update("alturaPE", v)} suffix="m" step="0.05"/>
        </IL_FieldBlock>
      </div>

      {/* Refletâncias */}
      <div className="panel-eyebrow" style={{ marginBottom: -8 }}>REFLETÂNCIAS DA SUPERFÍCIE</div>
      <div className="form-row form-row-2">
        <IL_FieldBlock label="Teto (ρ)">
          <IL_Select
            value={amb.rho_teto}
            onChange={v => update("rho_teto", v)}
            options={IL_DATA.rho_teto_opcoes}
          />
        </IL_FieldBlock>
        <IL_FieldBlock label="Parede (ρ)">
          <IL_Select
            value={amb.rho_parede}
            onChange={v => update("rho_parede", v)}
            options={[
              { value: "0.70", label: "0,70 — Branco / creme" },
              { value: "0.50", label: "0,50 — Claro / bege" },
              { value: "0.30", label: "0,30 — Cinza médio / cor" },
              { value: "0.10", label: "0,10 — Escuro" },
            ]}
          />
        </IL_FieldBlock>
      </div>

      {/* Luminária */}
      <div className="panel-eyebrow" style={{ marginBottom: -8 }}>LUMINÁRIA / LÂMPADA</div>
      <IL_FieldBlock label="Tipo de luminária">
        <IL_Select
          value={amb.tipoLampada}
          onChange={onLampChange}
          options={IL_DATA.lampadas.map(l => ({ value: l.id, label: l.label }))}
        />
      </IL_FieldBlock>

      {isPersonalLam && (
        <div className="form-row form-row-2">
          <IL_FieldBlock label="Potência (W)">
            <IL_NumberInput value={amb.lamp_P} onChange={v => update("lamp_P", v)} suffix="W" step="1"/>
          </IL_FieldBlock>
          <IL_FieldBlock label="Fluxo luminoso">
            <IL_NumberInput value={amb.lamp_Fl} onChange={v => update("lamp_Fl", v)} suffix="lm" step="100"/>
          </IL_FieldBlock>
        </div>
      )}

      {/* Dados elétricos */}
      <div className="panel-eyebrow" style={{ marginBottom: -8 }}>CIRCUITO ELÉTRICO</div>
      <div className="form-row form-row-2">
        <IL_FieldBlock label="Tensão">
          <IL_Select
            value={amb.tensao}
            onChange={v => update("tensao", v)}
            options={[
              { value: "127", label: "127 V (monofásico)" },
              { value: "220", label: "220 V (monofásico)" },
              { value: "380", label: "380 V (trifásico)" },
            ]}
          />
        </IL_FieldBlock>
        <IL_FieldBlock label="Sistema">
          <IL_Seg
            value={amb.sistema}
            onChange={v => update("sistema", v)}
            options={[{ value: "monofasico", label: "Monof." }, { value: "trifasico", label: "Trifás." }]}
          />
        </IL_FieldBlock>
      </div>

      {/* Comprimento do circuito para queda de tensão */}
      <IL_FieldBlock label="Comprimento do circuito" hint="para queda de tensão">
        <IL_NumberInput value={amb.comp_circuito} onChange={v => update("comp_circuito", v)} suffix="m" step="1"/>
      </IL_FieldBlock>
    </div>
  );
};

/* ===========================================================
   PAINEL DE RESULTADOS
=========================================================== */
const ResultPanel = ({ result, amb }) => {
  if (!result) {
    return (
      <div style={{ padding: "24px 0" }}>
        <IL_StatusBanner kind="info">Preencha os dados do ambiente para calcular.</IL_StatusBanner>
      </div>
    );
  }

  const { C, L, area, hm, kr, fu, Fd, phi_total, n_float, n_min, E_result, E_alvo,
          P_total, DPI, I_proj, I_dim, secao_cabo, disj, status_E, status_dpi } = result;

  // Queda de tensão (com comprimento do circuito se informado)
  const L_circ = parseFloat(amb.comp_circuito) || 0;
  let quedaV = null, quedaPct = null, statusQueda = "info";
  if (L_circ > 0 && secao_cabo) {
    const rho = 0.0175;
    const V = parseFloat(amb.tensao) || 220;
    quedaV = (2 * rho * L_circ * I_proj) / secao_cabo;
    quedaPct = (quedaV / V) * 100;
    statusQueda = quedaPct > 4 ? "danger" : quedaPct > 3 ? "warn" : "ok";
  }

  return (
    <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>

      {/* Resultado principal */}
      <IL_ResultBig
        label="NÚMERO DE LUMINÁRIAS"
        value={n_min}
        unit="un."
        status={status_E}
      />

      <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 10 }}>
        <IL_MetricCell label="Iluminância resultante" value={E_result.toFixed(0)} unit="lx" status={status_E}/>
        <IL_MetricCell label="Fluxo total necessário" value={(phi_total / 1000).toFixed(1)} unit="klm"/>
        <IL_MetricCell label="Potência instalada" value={P_total.toFixed(0)} unit="W"/>
        <IL_MetricCell label="DPI (densidade)" value={DPI.toFixed(1)} unit="W/m²" status={status_dpi}/>
      </div>

      {status_E === "ok"
        ? <IL_StatusBanner kind="ok">Iluminância de {E_result.toFixed(0)} lx ≥ {E_alvo} lx mínimo (NBR 8995-1)</IL_StatusBanner>
        : <IL_StatusBanner kind="warn">Verifique os parâmetros — iluminância pode estar abaixo do mínimo</IL_StatusBanner>
      }

      {status_dpi === "ok"
        ? <IL_StatusBanner kind="ok">DPI dentro do limite de eficiência energética (≤ 15 W/m²)</IL_StatusBanner>
        : status_dpi === "warn"
          ? <IL_StatusBanner kind="warn">DPI elevado — considere luminárias mais eficientes</IL_StatusBanner>
          : <IL_StatusBanner kind="warn">DPI crítico — luminárias LED de maior eficácia recomendadas</IL_StatusBanner>
      }

      {/* Visualização da planta baixa */}
      <div style={{ background: "var(--bg-1)", borderRadius: 8, border: "1px solid var(--border)", overflow: "hidden" }}>
        <div style={{ padding: "10px 14px 6px", fontSize: 10, letterSpacing: "0.08em", color: "var(--fg-mute)", fontFamily: "var(--ff-mono)" }}>
          LAYOUT ESTIMADO · PLANTA BAIXA
        </div>
        <div style={{ padding: "4px 14px 12px" }}>
          <PlantaBaixa comprimento={amb.comprimento} largura={amb.largura} n_luminarias={n_min}/>
        </div>
      </div>

      {/* Circuito elétrico */}
      <div className="panel" style={{ padding: "16px", background: "var(--bg-1)", border: "1px solid var(--border)" }}>
        <div className="panel-eyebrow" style={{ marginBottom: 12 }}>DIMENSIONAMENTO DO CIRCUITO · NBR 5410</div>
        <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr 1fr", gap: 10 }}>
          <IL_MetricCell label="Corrente de projeto" value={I_proj.toFixed(2)} unit="A"/>
          <IL_MetricCell label="Corrente dim. (125%)" value={I_dim.toFixed(2)} unit="A"/>
          <IL_MetricCell label="Seção mínima" value={secao_cabo} unit="mm²"/>
          <IL_MetricCell label="Disjuntor" value={disj} unit="A"/>
          <IL_MetricCell label="Potência total" value={P_total.toFixed(0)} unit="W"/>
          <IL_MetricCell label="FP" value={(parseFloat(amb.lamp_fp)||0.92).toFixed(2)}/>
        </div>

        {quedaV !== null && (
          <div style={{ marginTop: 12 }}>
            <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 10 }}>
              <IL_MetricCell label="Queda de tensão" value={quedaV.toFixed(2)} unit="V" status={statusQueda}/>
              <IL_MetricCell label="Queda percentual" value={quedaPct.toFixed(2)} unit="%" status={statusQueda}/>
            </div>
            {statusQueda !== "ok" && (
              <div style={{ marginTop: 8 }}>
                <IL_StatusBanner kind="warn">Queda de tensão {quedaPct.toFixed(2)}% — limite NBR 5410 ≤ 4%</IL_StatusBanner>
              </div>
            )}
          </div>
        )}
      </div>

      {/* Memória de cálculo */}
      <div className="vl-memory">
        <div className="vl-memory-head">
          <div className="vl-memory-eyebrow">MEMÓRIA DE CÁLCULO · MÉTODO DOS LÚMENS</div>
        </div>

        <IL_MemoryStep n={1} title="Área do ambiente">
          A = {C.toFixed(1)} m × {L.toFixed(1)} m = <b className="readout">{area.toFixed(2)} m²</b>
        </IL_MemoryStep>

        <IL_MemoryStep n={2} title="Altura de montagem">
          h_m = h_teto − h_plano = {(parseFloat(amb.alturaTotal)||0).toFixed(2)} − {(parseFloat(amb.alturaPE)||0).toFixed(2)} = <b className="readout">{hm.toFixed(2)} m</b>
        </IL_MemoryStep>

        <IL_MemoryStep n={3} title="Índice do local (k)" isFormula>
          k = (C × L) / (h_m × (C + L)) = ({C.toFixed(1)} × {L.toFixed(1)}) / ({hm.toFixed(2)} × {(C+L).toFixed(1)}) = <b className="readout">{kr.toFixed(3)}</b>
        </IL_MemoryStep>

        <IL_MemoryStep n={4} title="Fator de utilização (FU)">
          FU estimado para k = {kr.toFixed(2)}, ρ_teto = {(parseFloat(amb.rho_teto)||0.7).toFixed(2)}, ρ_parede = {(parseFloat(amb.rho_parede)||0.5).toFixed(2)}: <b className="readout">{fu.toFixed(3)}</b>
        </IL_MemoryStep>

        <IL_MemoryStep n={5} title="Fluxo luminoso total necessário" isFormula>
          Φ_total = (E × A) / (FU × Fd) = ({parseFloat(amb.E_alvo).toFixed(0)} × {area.toFixed(2)}) / ({fu.toFixed(3)} × {Fd.toFixed(2)}) = <b className="readout">{phi_total.toFixed(0)} lm</b>
        </IL_MemoryStep>

        <IL_MemoryStep n={6} title="Número de luminárias" isFormula>
          N = Φ_total / Φ_luminária = {phi_total.toFixed(0)} / {(parseFloat(amb.lamp_Fl)||0).toFixed(0)} = {n_float.toFixed(2)} → <b className="readout">arredondar = {n_min} und.</b>
        </IL_MemoryStep>

        <IL_MemoryStep n={7} title="Verificação da iluminância">
          E_real = (N × Φ_lum × FU × Fd) / A = ({n_min} × {(parseFloat(amb.lamp_Fl)||0).toFixed(0)} × {fu.toFixed(3)} × {Fd.toFixed(2)}) / {area.toFixed(2)} = <b className="readout">{E_result.toFixed(1)} lx</b>
        </IL_MemoryStep>

        <IL_MemoryStep n={8} title="Corrente de projeto">
          I_b = P_total / (V × FP) = {P_total.toFixed(0)} / ({parseFloat(amb.tensao)||220} × {(parseFloat(amb.lamp_fp)||0.92).toFixed(2)}) = <b className="readout">{I_proj.toFixed(2)} A</b>
        </IL_MemoryStep>

        <IL_MemoryStep n={9} title="Seção mínima por ampacidade">
          I_dim = 1,25 × I_b = 1,25 × {I_proj.toFixed(2)} = {I_dim.toFixed(2)} A → cabo <b className="readout">{secao_cabo} mm²</b> (ampacidade = {IL_DATA.ampacity_pvc_2[secao_cabo]} A)
        </IL_MemoryStep>
      </div>
    </div>
  );
};

/* ===========================================================
   RESUMO DO PROJETO (visão consolidada)
=========================================================== */
const ResumoProjeto = ({ ambientes, resultados }) => {
  const validos = ambientes.filter((_, i) => resultados[i]);
  if (validos.length === 0) return <IL_StatusBanner kind="info">Adicione e calcule ambientes para ver o resumo.</IL_StatusBanner>;

  const totalLuminarias = resultados.filter(Boolean).reduce((s, r) => s + r.n_min, 0);
  const totalPotencia   = resultados.filter(Boolean).reduce((s, r) => s + r.P_total, 0);
  const totalArea       = resultados.filter(Boolean).reduce((s, r) => s + r.area, 0);
  const dpiMedio        = totalPotencia / totalArea;

  return (
    <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
      <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr", gap: 10 }}>
        <IL_ResultBig label="TOTAL DE LUMINÁRIAS" value={totalLuminarias} unit="un." status="ok"/>
        <IL_ResultBig label="POTÊNCIA TOTAL" value={(totalPotencia / 1000).toFixed(2)} unit="kW" status="ok"/>
      </div>
      <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr 1fr", gap: 10 }}>
        <IL_MetricCell label="Área total" value={totalArea.toFixed(1)} unit="m²"/>
        <IL_MetricCell label="DPI médio" value={dpiMedio.toFixed(1)} unit="W/m²"/>
        <IL_MetricCell label="Ambientes" value={validos.length} unit="amb."/>
      </div>

      {/* Tabela por ambiente */}
      <div style={{ background: "var(--bg-1)", border: "1px solid var(--border)", borderRadius: 8, overflow: "hidden" }}>
        <div style={{ padding: "10px 16px", borderBottom: "1px solid var(--border)" }}>
          <div className="panel-eyebrow">TABELA DE ILUMINAÇÃO — QUADRO RESUMO</div>
        </div>
        <div style={{ overflowX: "auto" }}>
          <table style={{ width: "100%", borderCollapse: "collapse", fontSize: 12 }}>
            <thead>
              <tr style={{ borderBottom: "1px solid var(--border)", color: "var(--fg-mute)" }}>
                {["Ambiente", "Área", "E_alvo", "E_real", "FU", "Fd", "Lum.", "Pot.", "DPI"].map(h => (
                  <th key={h} style={{ padding: "8px 12px", textAlign: "left", fontWeight: 600, fontSize: 10, letterSpacing: "0.06em", whiteSpace: "nowrap" }}>{h}</th>
                ))}
              </tr>
            </thead>
            <tbody>
              {ambientes.map((a, i) => {
                const r = resultados[i];
                if (!r) return null;
                return (
                  <tr key={i} style={{ borderBottom: "1px solid var(--border)" }}>
                    <td style={{ padding: "8px 12px", fontWeight: 500 }}>{a.nome || `Amb. ${i+1}`}</td>
                    <td className="mono" style={{ padding: "8px 12px" }}>{r.area.toFixed(1)} m²</td>
                    <td className="mono" style={{ padding: "8px 12px" }}>{r.E_alvo} lx</td>
                    <td className="mono" style={{ padding: "8px 12px", color: r.status_E === "ok" ? "var(--ok)" : "var(--warn)" }}>{r.E_result.toFixed(0)} lx</td>
                    <td className="mono" style={{ padding: "8px 12px" }}>{r.fu.toFixed(2)}</td>
                    <td className="mono" style={{ padding: "8px 12px" }}>{r.Fd.toFixed(2)}</td>
                    <td className="mono" style={{ padding: "8px 12px", fontWeight: 700 }}>{r.n_min}</td>
                    <td className="mono" style={{ padding: "8px 12px" }}>{r.P_total.toFixed(0)} W</td>
                    <td className="mono" style={{ padding: "8px 12px", color: r.status_dpi === "ok" ? "var(--ok)" : "var(--warn)" }}>{r.DPI.toFixed(1)} W/m²</td>
                  </tr>
                );
              })}
            </tbody>
            <tfoot>
              <tr style={{ borderTop: "2px solid var(--border-2)", fontWeight: 700 }}>
                <td style={{ padding: "8px 12px" }}>TOTAL</td>
                <td className="mono" style={{ padding: "8px 12px" }}>{totalArea.toFixed(1)} m²</td>
                <td colSpan={5}/>
                <td className="mono" style={{ padding: "8px 12px", color: "var(--accent)" }}>{totalLuminarias} un.</td>
                <td className="mono" style={{ padding: "8px 12px", color: "var(--accent)" }}>{totalPotencia.toFixed(0)} W</td>
                <td className="mono" style={{ padding: "8px 12px" }}>{dpiMedio.toFixed(1)}</td>
              </tr>
            </tfoot>
          </table>
        </div>
      </div>
    </div>
  );
};

/* ===========================================================
   ESTADO PADRÃO DE UM AMBIENTE
=========================================================== */
const newAmbiente = () => ({
  nome: "",
  tipoAmbiente: "escritorio",
  E_alvo: "500",
  fd: "0.80",
  comprimento: "10",
  largura: "8",
  alturaTotal: "2.8",
  alturaPE: "0.75",
  rho_teto: "0.70",
  rho_parede: "0.50",
  tipoLampada: "led_painel_36w",
  lamp_P: "36",
  lamp_Fl: "3600",
  lamp_fp: "0.95",
  tensao: "220",
  sistema: "monofasico",
  comp_circuito: "",
});

/* ===========================================================
   COMPONENTE PRINCIPAL — Iluminação
=========================================================== */
const Iluminacao = () => {
  const [ambientes, setAmbientes] = usePersist("vl_iluminacao_ambientes", [newAmbiente()]);
  const [selectedIdx, setSelectedIdx] = usePersist("vl_iluminacao_selected", 0);
  const [tab, setTab] = useState("calc"); // calc | resumo

  // Garante índice válido
  const idx = Math.min(selectedIdx, ambientes.length - 1);
  const amb = ambientes[idx] || newAmbiente();

  // Calcular todos os ambientes
  const resultados = useMemo(() =>
    ambientes.map(a => {
      const lamp = IL_DATA.lampadas.find(l => l.id === a.tipoLampada);
      return calcularAmbiente({
        comprimento: a.comprimento, largura: a.largura,
        alturaTotal: a.alturaTotal, alturaPE: a.alturaPE,
        E_alvo: a.E_alvo, fd: a.fd,
        rho_teto: a.rho_teto, rho_parede: a.rho_parede,
        lamp_P: a.lamp_P || (lamp?.P ?? 36),
        lamp_Fl: a.lamp_Fl || (lamp?.Fl ?? 3600),
        lamp_fp: a.lamp_fp || (lamp?.fp ?? 0.92),
        tensao: a.tensao, sistema: a.sistema,
      });
    }),
  [ambientes]);

  const result = resultados[idx];

  // Exportação
  useEffect(() => {
    window._VL_lastExport = () => {
      if (!result) return null;
      return {
        modulo: "iluminacao",
        norma: "NBR ISO/CIE 8995-1 / NBR 5410",
        geradoEm: new Date().toLocaleString("pt-BR"),
        entradas: {
          ambiente: amb.tipoAmbiente,
          nome: amb.nome,
          comprimento_m: amb.comprimento,
          largura_m: amb.largura,
          pe_direito_m: amb.alturaTotal,
          plano_trabalho_m: amb.alturaPE,
          iluminancia_lx: amb.E_alvo,
          fd: amb.fd,
          rho_teto: amb.rho_teto,
          rho_parede: amb.rho_parede,
          lampada: amb.tipoLampada,
          potencia_lampada_W: amb.lamp_P,
          fluxo_lampada_lm: amb.lamp_Fl,
          tensao_V: amb.tensao,
          sistema: amb.sistema,
        },
        resultado: {
          area_m2: result.area.toFixed(2),
          indice_local_k: result.kr.toFixed(3),
          fator_utilizacao: result.fu.toFixed(3),
          fluxo_total_lm: result.phi_total.toFixed(0),
          numero_luminarias: result.n_min,
          iluminancia_resultante_lx: result.E_result.toFixed(1),
          potencia_total_W: result.P_total.toFixed(0),
          dpi_W_m2: result.DPI.toFixed(2),
          corrente_A: result.I_proj.toFixed(2),
          secao_cabo_mm2: result.secao_cabo,
          disjuntor_A: result.disj,
        },
      };
    };
    return () => { window._VL_lastExport = null; };
  }, [result, amb]);

  const addAmbiente = () => {
    const novo = newAmbiente();
    setAmbientes(prev => [...prev, novo]);
    setSelectedIdx(ambientes.length);
  };

  const removeAmbiente = (i) => {
    if (ambientes.length === 1) return;
    setAmbientes(prev => prev.filter((_, idx) => idx !== i));
    setSelectedIdx(Math.max(0, i - 1));
  };

  const updateAmbiente = (updated) => {
    setAmbientes(prev => prev.map((a, i) => i === idx ? updated : a));
  };

  const okCount = resultados.filter(r => r && r.status_E === "ok").length;

  return (
    <div className="eletroduto il-mod" style={{ maxWidth: "none" }}>

      {/* ── Abas principais (pill segmentado) ───────────────── */}
      <div className="il-tabs">
        <div className="il-tabs-seg">
          {[
            { id: "calc",   label: "Cálculo por ambiente", icon: "bulb" },
            { id: "resumo", label: "Resumo do projeto",    icon: "lux"  },
          ].map(t => (
            <button key={t.id}
              className={"il-tab " + (tab === t.id ? "is-active" : "")}
              onClick={() => setTab(t.id)}>
              <IL_Icon name={t.icon} size={15}/> {t.label}
            </button>
          ))}
        </div>
        <div className="il-tabs-meta">
          <span><b className="readout">{ambientes.length}</b> ambiente{ambientes.length !== 1 ? "s" : ""}</span>
          <span className="il-dot-sep">·</span>
          <span><b className="readout" style={{ color: "var(--ok)" }}>{okCount}</b> conforme{okCount !== 1 ? "s" : ""}</span>
        </div>
      </div>

      {tab === "resumo" ? (
        <ResumoProjeto ambientes={ambientes} resultados={resultados}/>
      ) : (
        <>
          {/* ── Trilho horizontal de ambientes ─────────────── */}
          <div className="il-rail">
            <div className="il-rail-track">
              {ambientes.map((a, i) => (
                <AmbienteCard
                  key={i}
                  amb={a}
                  index={i}
                  isSelected={i === idx}
                  result={resultados[i]}
                  onSelect={() => setSelectedIdx(i)}
                  onRemove={() => removeAmbiente(i)}
                  canRemove={ambientes.length > 1}
                />
              ))}
              <button className="il-add-card" onClick={addAmbiente}>
                <span className="il-add-icon"><IL_Icon name="plus" size={18}/></span>
                <span>Adicionar<br/>ambiente</span>
              </button>
            </div>
          </div>

          {/* ── 2 colunas amplas: formulário + resultados ──── */}
          <div className="il-grid">
            <section className="panel">
              <div className="panel-head">
                <div>
                  <div className="panel-eyebrow">CONFIGURAÇÃO · MÉTODO DOS LÚMENS</div>
                  <h3>{amb.nome || `Ambiente ${idx + 1}`}</h3>
                </div>
                <div className="status-chip">
                  <span className="status-dot status-ok"/>AUTO-CÁLCULO
                </div>
              </div>
              <AmbienteForm amb={amb} onChange={updateAmbiente}/>
            </section>

            <aside className="panel el-result">
              <div className="panel-head">
                <div>
                  <div className="panel-eyebrow">RESULTADO · DIMENSIONAMENTO</div>
                  <h3>Análise do ambiente</h3>
                </div>
              </div>
              <ResultPanel result={result} amb={amb}/>
            </aside>
          </div>
        </>
      )}
    </div>
  );
};

/* Exporta para o sistema global */
window.VL_Iluminacao = Iluminacao;