/* ── Anamneza (Chestionarul Bunatatii Personale) ──────────────────────────────
   Sectiune SEPARATA de Credinte (decizie Marian 24.07). Tot continutul metodologic
   vine din window.ANAMNEZA (generat din Excelul lui Petre) - NIMIC hardcodat aici.
   Scoringul = window.AnamnezaScoring (port 1:1 al sheet-ului MOTOR, golden-testat).
   Fisier autonom fata de app.jsx: nu foloseste functii/constante de acolo. */

const IcAnamneza = (p) => (
  <svg width={p && p.size || 17} height={p && p.size || 17} viewBox="0 0 24 24" fill="none"
    stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
    <path d="M9 4h6v3H9z" />
    <path d="M15 5h3a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h3" />
    <path d="M8.5 12l2.2 2.2 4.6-4.6" />
    <path d="M8.5 17.5h7" />
  </svg>
);
window.IcAnamneza = IcAnamneza;

/* data locala ISO (autonom; identic cu fmtISO din app.jsx) */
function anmISO(d) {
  const p = (n) => String(n).padStart(2, "0");
  return d.getFullYear() + "-" + p(d.getMonth() + 1) + "-" + p(d.getDate());
}

/* ── acces la raspunsuri in store.anamneza[credinta][m] ── */
function anmRasp(store, cred, m) {
  return (store.anamneza && store.anamneza[cred] && store.anamneza[cred][m]) || {};
}
function anmSetRasp(set, cred, m, gind, scor) {
  set((s) => {
    const an = { ...(s.anamneza || {}) };
    const c = { ...(an[cred] || {}) };
    const rasp = { ...(c[m] || {}) };
    rasp[gind] = scor;
    c[m] = rasp;
    /* data completarii: fixata la prima atingere a totalului (50 la B, 150 la formatul A) */
    const banca = window.ANAMNEZA.credinte[cred];
    const n = banca.itemi.filter((it) => rasp[it.gind] >= 1 && rasp[it.gind] <= 6).length;
    if (n === banca.itemi.length && !c[m + "_data"]) c[m + "_data"] = anmISO(new Date());
    an[cred] = c;
    return { ...s, anamneza: an };
  });
}
function anmProgres(banca, rasp) {
  return banca.itemi.filter((it) => rasp[it.gind] >= 1 && rasp[it.gind] <= 6).length;
}

/* exportul anamnezei pentru consultant: raspunsuri + rezultate calculate la momentul exportului.
   SELF-CONTAINED (analizabil fara Excel/banca, inclusiv de un LLM): fiecare masurare completa
   include per item aria, indicatorul, scala aleasa si TEXTUL afirmatiei alese.
   Apelat de exportStore din app.jsx (montaj T8); rezultatele NU se persista - se recalculeaza. */
function anamnezaExport(store) {
  const S = window.AnamnezaScoring;
  const rezultate = {};
  const detaliuItemi = (banca, raw) => banca.itemi.map((it) => {
    const scor = raw[it.gind];
    const a = scor >= 1 && scor <= 6 ? it.afirmatii.find((x) => x.scor === scor) : null;
    return {
      gind: it.gind, aria: banca.arii[it.aria - 1].nume, indicator: it.indicator,
      scor: scor || null, scala: scor ? banca.scale[scor - 1].nume : null,
      alegere: a ? (a.textRaw || a.text) : null,
    };
  });
  Object.keys(window.ANAMNEZA.credinte).forEach((cred) => {
    const banca = window.ANAMNEZA.credinte[cred];
    const raw1 = anmRasp(store, cred, "p1");
    const raw2 = anmRasp(store, cred, "p2");
    /* credintele cu motor "profiluri" (Recunostinta, Smerenia) NU trec prin motorul
       Bunatatii - export prin scoringul propriu (montaj 001, coord 24.07) */
    if (banca.motor === "profiluri" && window.AnamnezaPlus) {
      const fa = (raw, dataM) => {
        const n = banca.itemi.filter((it) => raw[it.gind] >= 1 && raw[it.gind] <= 6).length;
        if (n !== banca.itemi.length) return null;
        return { ...window.AnamnezaPlus.rezultatExport(banca, raw), data: dataM || null,
                 itemi: detaliuItemi(banca, raw) };
      };
      const anP = (store.anamneza || {})[cred] || {};
      rezultate[cred] = {
        _instrument: banca.titlu, _sursa: banca.sursa || null,
        p1: fa(raw1, anP.p1_data), p2: fa(raw2, anP.p2_data), comparatie: null,
      };
      return;
    }
    const r1 = S.evalueaza(banca, raw1);
    const r2 = S.evalueaza(banca, raw2);
    const imbraca = (r, raw, dataM) => ({
      ...r,
      stadiuNume: r.stadiuGlobal ? banca.scale[r.stadiuGlobal - 1].stadiu : null,
      verdict: S.verdict(banca, r),
      data: dataM || null,
      itemi: detaliuItemi(banca, raw),
    });
    const an = (store.anamneza || {})[cred] || {};
    rezultate[cred] = {
      _instrument: banca.titlu,
      _sursa: banca.sursa || null,
      p1: r1.nCompletate === 50 ? imbraca(r1, raw1, an.p1_data) : null,
      p2: r2.nCompletate === 50 ? imbraca(r2, raw2, an.p2_data) : null,
      comparatie: r1.nCompletate === 50 && r2.nCompletate === 50
        ? S.comparatie(banca, r1, r2, raw1, raw2) : null,
    };
  });
  return { anamneza: store.anamneza || {}, anamneza_rezultate: rezultate };
}
window.anamnezaExport = anamnezaExport;

/* itemul dupa gind + textul brut al afirmatiei alese (pt. alerte) */
function anmItem(banca, gind) { return banca.itemi[gind - 1]; }
function anmTextAles(banca, rasp, gind) {
  const it = anmItem(banca, gind);
  const a = it.afirmatii.find((x) => x.scor === rasp[gind]);
  return a ? a.textRaw : "";
}

/* eticheta "ARIA 0X · nume · n/total" - totalul ariei vine din banca (5 la B, 15 la A) */
function anmAriaHead(banca, ariaIdx, rasp) {
  const aiAriei = banca.itemi.filter((it) => it.aria === ariaIdx);
  const n = aiAriei.filter((it) => rasp[it.gind] >= 1).length;
  return { text: "ARIA " + String(ariaIdx).padStart(2, "0") + "  ·  " + banca.arii[ariaIdx - 1].nume,
           progres: n + " / " + aiAriei.length + (n === aiAriei.length ? " ✓" : "") };
}

/* lista canonica a credintelor: window.PRP_CREDINTE din data.js (sursa unica, ordinea lui Petre);
   fallback defensiv doar pe bancile existente daca data.js lipseste */
function anmToateCredintele() {
  if (window.PRP_CREDINTE) return window.PRP_CREDINTE;
  return Object.keys(window.ANAMNEZA.credinte).map((slug) => ({ slug, nume: slug, titlu: slug }));
}

/* ── sub-ecrane: credinta | chestionar-p1|p2 | rezultat-p1|p2 | comparatie | dashboard ── */
const ANM_ECRANE = ["credinta", "chestionar-p1", "chestionar-p2", "rezultat-p1", "rezultat-p2", "comparatie", "dashboard"];

/* credinta implicita la intrare: prima cu banca de chestionar sosita */
function anmCredImplicita() {
  const cuBanca = anmToateCredintele().find((c) => window.ANAMNEZA.credinte[c.slug]);
  return cuBanca ? cuBanca.slug : anmToateCredintele()[0].slug;
}

/* restaurarea sub-ecranului din hash (#anamneza/<cred>/<ecran>) - la refresh sau deep-link */
function anmNavDinHash() {
  const m = (location.hash || "").match(/^#anamneza\/([a-z-]+)(?:\/([a-z0-9-]+))?$/);
  if (!m || !anmToateCredintele().some((c) => c.slug === m[1])) return null;
  const ecran = m[2] && ANM_ECRANE.includes(m[2]) && window.ANAMNEZA.credinte[m[1]] ? m[2] : "credinta";
  return { ecran, cred: m[1] };
}

/* meniul orizontal cu toate credintele - identic ca forma cu CredinteTabs din sectiunea Credinte
   (aceleasi clase .cred-tabs/.cred-tab); "lucru" = chestionarul credintei nu a sosit inca */
function AnmTabs({ nav, setNav }) {
  return (
    <div className="cred-tabs" role="tablist" aria-label="Credințele - chestionare">
      {anmToateCredintele().map((c) => {
        const are = !!window.ANAMNEZA.credinte[c.slug];
        return (
          <button key={c.slug} role="tab" aria-selected={nav.cred === c.slug}
            className={"cred-tab" + (nav.cred === c.slug ? " activ" : "") + (!are ? " lucru" : "")}
            title={are ? c.titlu : c.titlu + " - chestionar în pregătire la Dr. Petre"}
            onClick={() => setNav({ ecran: "credinta", cred: c.slug })}>
            {c.nume}
          </button>
        );
      })}
    </div>
  );
}

/* in interiorul unei credinte, meniul de sus devine meniul SECTIUNILOR ei (cerinta Marian 24.07):
   aceeasi bara vizuala, dar cu cele 6 sectiuni; gating-ul ramane (title explica de ce e blocata) */
function AnmSectiuniTabs({ banca, cred, nav, setNav, store }) {
  const n1 = anmProgres(banca, anmRasp(store, cred, "p1"));
  const n2 = anmProgres(banca, anmRasp(store, cred, "p2"));
  const nT = banca.itemi.length;
  const c = anmToateCredintele().find((x) => x.slug === cred) || {};
  const sectiuni = [
    { ecran: "chestionar-p1", nume: "Chestionar P1", blocat: false },
    { ecran: "chestionar-p2", nume: "Chestionar P2", blocat: false },
    { ecran: "rezultat-p1", nume: "Rezultat P1", blocat: n1 < nT, deCe: "Se activează la P1 complet (" + n1 + " / " + nT + ")" },
    { ecran: "rezultat-p2", nume: "Rezultat P2", blocat: n2 < nT, deCe: "Se activează la P2 complet (" + n2 + " / " + nT + ")" },
    { ecran: "comparatie", nume: "Comparație", blocat: n1 < nT || n2 < nT, deCe: "Cere ambele măsurări complete" },
    { ecran: "dashboard", nume: "Dashboard", blocat: n1 < nT && n2 < nT, deCe: "Cere cel puțin o măsurare completă" },
  ];
  return (
    <div className="cred-tabs" role="tablist" aria-label={"Chestionarele credinței - " + (c.nume || cred)}>
      <button className="cred-tab" title={"Înapoi la " + (c.titlu || "credință")}
        onClick={() => setNav({ ecran: "credinta", cred })}>
        {"←"} {c.nume || "Credința"}
      </button>
      {sectiuni.map((s) => (
        <button key={s.ecran} role="tab" aria-selected={nav.ecran === s.ecran} disabled={s.blocat}
          className={"cred-tab" + (nav.ecran === s.ecran ? " activ" : "") + (s.blocat ? " lucru" : "")}
          title={s.blocat ? s.deCe : s.nume}
          onClick={() => setNav({ ecran: s.ecran, cred })}>
          {s.nume}
        </button>
      ))}
    </div>
  );
}

function AnamnezaView({ store, set }) {
  const [nav, setNavRaw] = React.useState(() => anmNavDinHash() || { ecran: "credinta", cred: anmCredImplicita() });
  /* sub-navigarea intra in istoricul browserului, aliniat cu restul instrumentului:
     Back din chestionar -> credinta -> restul aplicatiei.
     Starea anmNav merge in history.state; App-ul isi pastreaza view="anamneza" in acelasi state. */
  const setNav = (n) => {
    setNavRaw(n);
    try {
      const hash = "#anamneza/" + n.cred + (n.ecran !== "credinta" ? "/" + n.ecran : "");
      history.pushState({ view: "anamneza", credinta: store.credinta, anmNav: n }, "", hash);
    } catch (e) { /* file:// restrictiv - navigarea ramane in state local */ }
  };
  React.useEffect(() => {
    const onPop = (e) => {
      if (e.state && e.state.anmNav) setNavRaw(e.state.anmNav);
      else if (e.state && e.state.view === "anamneza") setNavRaw({ ecran: "credinta", cred: anmCredImplicita() });
      /* alt view: App-ul comuta ecranul si componenta se demonteaza */
    };
    window.addEventListener("popstate", onPop);
    return () => window.removeEventListener("popstate", onPop);
  }, []);
  const ecran = nav.ecran;
  const cred = nav.cred;
  const banca = cred ? window.ANAMNEZA.credinte[cred] : null;
  const laCredinta = () => setNav({ ecran: "credinta", cred });

  let continut;
  if (!banca) {
    /* chestionarul credintei nu a sosit inca de la Petre - empty in limbajul sectiunii Credinte */
    const c = anmToateCredintele().find((x) => x.slug === cred) || {};
    continut = (
      <div className="panel empty">
        <div className="empty-title">Chestionarul este în pregătire la Dr. Petre</div>
        <div className="small" style={{ maxWidth: 460 }}>
          Chestionarul pentru {c.titlu || "această credință"} se activează imediat ce sosește de la Dr. Petre -
          pe modelul Bunătății: 50 de indicatori, câte șase afirmații fiecare, rezultat pe axa Răutate / Bunătate.
        </div>
      </div>
    );
  } else if (ecran === "chestionar-p1" || ecran === "chestionar-p2") {
    const m = ecran.endsWith("p1") ? "p1" : "p2";
    continut = <AnmChestionar banca={banca} cred={cred} m={m} store={store} set={set} onInapoi={laCredinta}
      spreRezultat={() => setNav({ ecran: "rezultat-" + m, cred })} />;
  } else if (ecran === "rezultat-p1" || ecran === "rezultat-p2") {
    const m = ecran.endsWith("p1") ? "p1" : "p2";
    /* credintele cu motor "profiluri" au raportul propriu (doc 4) - Bunatatea ramane pe AnmRezultat */
    const RezultatEcran = banca.motor === "profiluri" && window.AnamnezaPlus
      ? window.AnamnezaPlus.Rezultat : AnmRezultat;
    continut = <RezultatEcran banca={banca} cred={cred} m={m} store={store} onInapoi={laCredinta}
      spreChestionar={() => setNav({ ecran: "chestionar-" + m, cred })} />;
  } else if (ecran === "comparatie") {
    continut = banca.motor === "profiluri" && window.AnamnezaPlus
      ? <window.AnamnezaPlus.InPregatire titlu="Comparația P1 - P2" numeCredinta={banca.titlu} onInapoi={laCredinta} />
      : <AnmComparatie banca={banca} cred={cred} store={store} onInapoi={laCredinta} />;
  } else if (ecran === "dashboard") {
    continut = banca.motor === "profiluri" && window.AnamnezaPlus
      ? <window.AnamnezaPlus.InPregatire titlu="Dashboard" numeCredinta={banca.titlu} onInapoi={laCredinta} />
      : <AnmDashboard banca={banca} cred={cred} store={store} onInapoi={laCredinta} />;
  } else {
    continut = <AnmCredintaHub banca={banca} cred={cred} store={store} setNav={setNav} />;
  }

  /* bara de sus e contextuala: la nivel de credinte = taburile credintelor;
     in interiorul unei credinte (sub-ecrane) = meniul sectiunilor ei */
  const inSectiune = banca && ecran !== "credinta";
  return (
    <div className="page">
      {inSectiune
        ? <AnmSectiuniTabs banca={banca} cred={cred} nav={nav} setNav={setNav} store={store} />
        : <AnmTabs nav={nav} setNav={setNav} />}
      {continut}
    </div>
  );
}
window.AnamnezaView = AnamnezaView;

/* ── hub-ul unei credinte populate: progrese + cele 6 actiuni (navigarea intre credinte = taburile) ── */
function AnmCredintaHub({ banca, cred, store, setNav }) {
  const n1 = anmProgres(banca, anmRasp(store, cred, "p1"));
  const n2 = anmProgres(banca, anmRasp(store, cred, "p2"));
  const nT = banca.itemi.length;
  const pct1 = Math.round((n1 / nT) * 100), pct2 = Math.round((n2 / nT) * 100);
  const go = (ecran) => () => setNav({ ecran, cred });
  return (
    <div>
      <div className="anm-hub-card" style={{ marginBottom: 14 }}>
        <p className="anm-hub-titlu">{banca.titlu}</p>
        <div className="anm-progres" style={{ marginTop: 10 }}>
          <span className="chip">P1 · start</span>
          <div className="anm-bar"><i style={{ width: pct1 + "%" }} /></div>
          <span style={{ fontSize: "var(--m-fs-2)", color: "var(--m-muted)", minWidth: 52 }}>{n1} / {nT}</span>
        </div>
        <div className="anm-progres" style={{ marginTop: 8 }}>
          <span className="chip">P2 · 12 luni</span>
          <div className="anm-bar"><i style={{ width: pct2 + "%" }} /></div>
          <span style={{ fontSize: "var(--m-fs-2)", color: "var(--m-muted)", minWidth: 52 }}>{n2} / {nT}</span>
        </div>

        <div className="anm-actiuni">
          <button className="anm-actiune" onClick={go("chestionar-p1")}>
            <b>Chestionar P1 · START</b>
            <span>{n1 === 0 ? "neînceput" : n1 < nT ? "în lucru - " + n1 + " / " + nT : "complet"}</span>
          </button>
          <button className="anm-actiune" onClick={go("chestionar-p2")}>
            <b>Chestionar P2 · 12 LUNI</b>
            <span>{n2 === 0 ? "neînceput" : n2 < nT ? "în lucru - " + n2 + " / " + nT : "complet"}</span>
          </button>
          <button className="anm-actiune" disabled={n1 < nT}
            title={n1 < nT ? "Se activează la completarea integrală a chestionarului P1" : undefined}
            onClick={go("rezultat-p1")}>
            <b>Rezultat P1</b>
            <span>{n1 < nT ? "blocat - " + n1 + " / " + nT : "disponibil"}</span>
          </button>
          <button className="anm-actiune" disabled={n2 < nT}
            title={n2 < nT ? "Se activează la completarea integrală a chestionarului P2" : undefined}
            onClick={go("rezultat-p2")}>
            <b>Rezultat P2</b>
            <span>{n2 < nT ? "blocat - " + n2 + " / " + nT : "disponibil"}</span>
          </button>
          <button className="anm-actiune" disabled={n1 < nT || n2 < nT}
            title={n1 < nT || n2 < nT ? "Cere ambele măsurări complete" : undefined}
            onClick={go("comparatie")}>
            <b>Comparație P1 / P2</b>
            <span>{n1 < nT || n2 < nT ? "cere P1 și P2 complete" : "disponibilă"}</span>
          </button>
          <button className="anm-actiune" disabled={n1 < nT && n2 < nT}
            title={n1 < nT && n2 < nT ? "Cere cel puțin o măsurare completă" : undefined}
            onClick={go("dashboard")}>
            <b>Dashboard</b>
            <span>{n1 < nT && n2 < nT ? "cere o măsurare completă" : "disponibil"}</span>
          </button>
        </div>
      </div>

      <div className="anm-sect">
        <p className="anm-sect-titlu">{banca.texte.ghidCum}</p>
        <p style={{ margin: "0 0 8px", fontSize: "var(--m-fs-3)", color: "var(--m-muted)", lineHeight: 1.55 }}>
          {banca.texte.ghidInstructiune}
        </p>
        <ul className="anm-dec-lista" style={{ listStyle: "none", paddingLeft: 4 }}>
          {banca.texte.ghidPasi.map((p, i) => <li key={i}>{p}</li>)}
        </ul>
      </div>

      <p style={{ color: "var(--m-muted)", fontSize: "var(--m-fs-1)", textAlign: "center", marginTop: 14 }}>
        {banca.texte.footer}
      </p>
    </div>
  );
}

/* rand auxiliar sub bara de sectiuni (ex. selectorul P1/P2 din dashboard);
   intoarcerea la credinta traieste in bara de sectiuni, nu aici */
function AnmRand({ extra }) {
  if (!extra) return null;
  return (
    <div style={{ display: "flex", gap: 8, alignItems: "center", marginBottom: 12, flexWrap: "wrap" }}>
      {extra}
    </div>
  );
}

/* ── chestionarul P1 / P2 ── */
function AnmChestionar({ banca, cred, m, store, set, onInapoi, spreRezultat }) {
  const rasp = anmRasp(store, cred, m);
  const n = anmProgres(banca, rasp);
  const nT = banca.itemi.length;
  const titlu = m === "p1" ? banca.texte.chestTitluP1 : banca.texte.chestTitluP2;
  const instr = m === "p1" ? banca.texte.chestInstr : banca.texte.chestInstrP2;
  return (
    <div>
      <div className="anm-sticky">
        <div className="anm-sect" style={{ marginBottom: 0, padding: "12px 16px" }}>
          <p className="anm-sect-titlu" style={{ margin: 0 }}>{titlu}</p>
          <div className="anm-progres" style={{ marginTop: 8 }}>
            <div className="anm-bar"><i style={{ width: Math.round((n / nT) * 100) + "%" }} /></div>
            <b style={{ fontSize: "var(--m-fs-3)", minWidth: 52 }}>{n} / {nT}</b>
          </div>
        </div>
      </div>
      <p style={{ color: "var(--m-muted)", fontSize: "var(--m-fs-3)", lineHeight: 1.55, margin: "10px 2px 4px" }}>
        {instr}
      </p>

      {banca.arii.map((aria) => {
        const head = anmAriaHead(banca, aria.idx, rasp);
        return (
          <div key={aria.idx}>
            <div className="anm-aria-head">
              <span>{head.text}</span>
              <small>{head.progres}</small>
            </div>
            {banca.itemi.filter((it) => it.aria === aria.idx).map((it) => (
              <div key={it.gind} className="anm-item">
                <p className="anm-item-ind">{it.indicator}</p>
                <p className="anm-item-nucleu">{it.nucleu}</p>
                {it.afirmatii.map((a) => (
                  <label key={a.disp} className={"anm-radio" + (rasp[it.gind] === a.scor ? " aleasa" : "")}>
                    <input type="radio" name={"anm-" + m + "-" + it.gind}
                      checked={rasp[it.gind] === a.scor}
                      onChange={() => anmSetRasp(set, cred, m, it.gind, a.scor)} />
                    <span>{a.text}</span>
                  </label>
                ))}
              </div>
            ))}
          </div>
        );
      })}

      <div className="anm-sect" style={{ textAlign: "center" }}>
        {n < nT
          ? <p style={{ margin: 0, color: "var(--m-muted)" }}>Progres: <b>{n} / {nT}</b>. Raportul se activează la completarea integrală.</p>
          : <button className="btn" onClick={spreRezultat || onInapoi}>Chestionar complet - vezi rezultatul</button>}
      </div>
    </div>
  );
}

/* ── gating comun: raport cerut sub 50/50 ── */
function AnmGate({ n, onInapoi, spreChestionar }) {
  return (
    <div>
      <div className="anm-sect anm-gate">
        <b>Raportul se activează la completarea integrală a chestionarului.</b>
        <p>Progres curent: {n} / 50.</p>
        {spreChestionar && <button className="btn" onClick={spreChestionar}>Continuă chestionarul</button>}
      </div>
    </div>
  );
}

/* ── axa Rautate -> Prag zero -> Bunatate (refolosita in raport si dashboard) ── */
function AnmAxa({ banca, stadiu, prefix }) {
  const nume = stadiu ? banca.scale[stadiu - 1].stadiu : "";
  return (
    <div style={{ marginTop: 14 }}>
      <p style={{ fontSize: "var(--m-fs-2)", fontWeight: 600, margin: "0 0 16px", color: "var(--m-muted)" }}>
        {prefix}{stadiu ? stadiu + " / 6  ·  " + nume : ""}
      </p>
      <div className="anm-axa">
        {banca.scale.map((sc) => (
          <div key={sc.num}>
            <div className="anm-axa-seg" style={{ background: "#" + sc.culoare }}>
              {stadiu === sc.num && <span className="anm-axa-marcaj">{"▼"}</span>}
            </div>
            <div className="anm-axa-lbl">{banca.texte.axaEtichete[sc.num - 1]}</div>
          </div>
        ))}
      </div>
    </div>
  );
}

/* ── grafice SVG proprii (zero librarii; culorile scalelor vin din date) ── */
function anmPolar(cx, cy, r, deg) {
  const rad = (deg * Math.PI) / 180;
  return [cx + r * Math.cos(rad), cy - r * Math.sin(rad)];
}

/* radar pe cele 10 arii; a = seria principala (navy), b = optional (gold) */
function AnmRadar({ banca, a, b, max }) {
  const M = max || 30, cx = 150, cy = 132, R = 96;
  const pct = (v) => Math.max(0.04, Math.min(1, v / M));
  const punct = (i, v) => anmPolar(cx, cy, R * pct(v), 90 - i * 36);
  const poly = (serie) => serie.map((v, i) => punct(i, v).map((x) => x.toFixed(1)).join(",")).join(" ");
  const grid = [10, 20, 30].map((g) =>
    Array.from({ length: 10 }, (_, i) => punct(i, g).map((x) => x.toFixed(1)).join(",")).join(" "));
  return (
    <svg viewBox="0 0 300 265" role="img" aria-label="Profil pe cele 10 arii" style={{ width: "100%", maxWidth: 340 }}>
      {grid.map((p, k) => (
        <polygon key={k} points={p} fill="none" stroke="var(--m-border)" strokeWidth="1" />
      ))}
      {Array.from({ length: 10 }, (_, i) => {
        const [x, y] = punct(i, M);
        return <line key={i} x1={cx} y1={cy} x2={x} y2={y} stroke="var(--m-border)" strokeWidth="1" />;
      })}
      {b && <polygon points={poly(b)} fill="var(--m-gold)" fillOpacity="0.16" stroke="var(--m-gold)" strokeWidth="1.6" />}
      <polygon points={poly(a)} fill="var(--m-navy)" fillOpacity="0.16" stroke="var(--m-navy)" strokeWidth="1.8" />
      {Array.from({ length: 10 }, (_, i) => {
        const [x, y] = anmPolar(cx, cy, R + 15, 90 - i * 36);
        return (
          <text key={i} x={x} y={y + 3} textAnchor="middle"
            fontSize="10" fill="var(--m-muted)">A{i + 1}</text>
        );
      })}
    </svg>
  );
}

/* bare orizontale; rows = [{label, a, b?, culoare?}]; b apare ca bara secundara (gold) */
function AnmBars({ rows, max, sufix }) {
  const M = Math.max(max || 0, ...rows.map((r) => Math.max(r.a, r.b || 0)), 1);
  const are2 = rows.some((r) => typeof r.b === "number");
  const H = rows.length * (are2 ? 34 : 24) + 6;
  return (
    <svg viewBox={"0 0 320 " + H} role="img" style={{ width: "100%", maxWidth: 440, display: "block" }}>
      {rows.map((r, i) => {
        const y = i * (are2 ? 34 : 24) + 4;
        const w = (v) => Math.max(2, (v / M) * 180);
        return (
          <g key={i}>
            <text x="0" y={y + 10} fontSize="10" fill="var(--m-text)">{r.label}</text>
            <rect x="138" y={y + 2} width={w(r.a)} height="9" rx="3"
              fill={r.culoare ? "#" + r.culoare : "var(--m-navy)"} />
            <text x={142 + w(r.a)} y={y + 10} fontSize="10" fill="var(--m-muted)">{r.a}{sufix || ""}</text>
            {are2 && typeof r.b === "number" && (
              <g>
                <rect x="138" y={y + 14} width={w(r.b)} height="9" rx="3" fill="var(--m-gold)" />
                <text x={142 + w(r.b)} y={y + 22} fontSize="10" fill="var(--m-muted)">{r.b}{sufix || ""}</text>
              </g>
            )}
          </g>
        );
      })}
    </svg>
  );
}

/* vitezometrul bunatatii: semicerc din 6 sectoare (culorile scalelor) + ac pe stadiu */
function AnmGauge({ banca, stadiu }) {
  const cx = 150, cy = 140, R = 104;
  const arc = (from, to) => {
    const [x1, y1] = anmPolar(cx, cy, R, from);
    const [x2, y2] = anmPolar(cx, cy, R, to);
    return "M " + x1.toFixed(1) + " " + y1.toFixed(1) +
      " A " + R + " " + R + " 0 0 1 " + x2.toFixed(1) + " " + y2.toFixed(1);
  };
  const acDeg = 180 - (stadiu - 0.5) * 30;
  const [ax, ay] = anmPolar(cx, cy, R - 26, acDeg);
  return (
    <svg viewBox="0 0 300 158" role="img" aria-label="Vitezometrul bunatatii" style={{ width: "100%", maxWidth: 360 }}>
      {banca.scale.map((sc) => (
        <path key={sc.num} d={arc(180 - (sc.num - 1) * 30, 180 - sc.num * 30)}
          stroke={"#" + sc.culoare} strokeWidth="20" fill="none" strokeLinecap="butt" />
      ))}
      {[1, 2, 3, 4, 5, 6].map((n) => {
        const [tx, ty] = anmPolar(cx, cy, R + 17, 180 - (n - 0.5) * 30);
        return <text key={n} x={tx} y={ty + 3} textAnchor="middle" fontSize="10" fill="var(--m-muted)">{n}</text>;
      })}
      <line x1={cx} y1={cy} x2={ax} y2={ay} stroke="var(--m-text)" strokeWidth="3" strokeLinecap="round" />
      <circle cx={cx} cy={cy} r="6" fill="var(--m-text)" />
      <text x={cx} y={cy - 46} textAnchor="middle" fontSize="26" fontWeight="700" fill="var(--m-text)">{stadiu}</text>
      <text x={cx} y={cy - 30} textAnchor="middle" fontSize="10" fill="var(--m-muted)">/ 6</text>
    </svg>
  );
}

/* ── raportul P1 / P2: sectiunile A-E din Excel + certificatul ── */
function AnmRezultat({ banca, cred, m, store, onInapoi, spreChestionar }) {
  const rasp = anmRasp(store, cred, m);
  const n = anmProgres(banca, rasp);
  if (n < 50) return <AnmGate n={n} onInapoi={onInapoi} spreChestionar={spreChestionar} />;

  const S = window.AnamnezaScoring;
  const rez = S.evalueaza(banca, rasp);
  const verdictTxt = S.verdict(banca, rez);
  const t = banca.texte;
  const titlu = m === "p1" ? t.raportTitluP1 : t.raportTitluP2;
  const dataM = (store.anamneza[cred] || {})[m + "_data"] || "";
  const nume = (store.consola && store.consola.nume || "").trim();
  const stadiuNume = banca.scale[rez.stadiuGlobal - 1].stadiu;
  const maxScor = Math.max(...rez.scorArii);
  const minScor = Math.min(...rez.scorArii);
  const ariaMax = banca.arii[rez.scorArii.indexOf(maxScor)];
  const ariaMin = banca.arii[rez.scorArii.indexOf(minScor)];
  const alerteDef = [
    { titlu: t.alerteTitluri[0], ginduri: rez.alerte.cruzime, nr: rez.nCru },
    { titlu: t.alerteTitluri[1], ginduri: rez.alerte.malitiozitate, nr: rez.nMal },
    { titlu: t.alerteTitluri[2], ginduri: rez.alerte.rautate, nr: rez.nRau },
  ];
  const decMatrici = [
    banca.decodificare.stadiu, banca.decodificare.cauze, banca.decodificare.programe,
    banca.decodificare.impactPersonal, banca.decodificare.impactJur, banca.decodificare.directii,
  ];

  return (
    <div>
      <div className="anm-sect">
        <p className="anm-sect-titlu" style={{ marginBottom: 2 }}>{titlu}</p>
        <p style={{ margin: 0, color: "var(--m-muted)", fontSize: "var(--m-fs-3)" }}>
          Participant: <b style={{ color: "var(--m-text)" }}>{nume}</b>
          {dataM && <span>  ·  Data: {dataM}</span>}
        </p>
      </div>

      {/* A. rezultat global */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.sectA}</p>
        <div className="anm-kpi-rand">
          <div className="anm-kpi"><small>{t.lblScorGlobal}</small><b>{rez.total} / 300</b></div>
          <div className="anm-kpi"><small>{t.lblMedia}</small><b>{rez.media.toFixed(2)}</b></div>
          <div className="anm-kpi"><small>{t.lblStadiu}</small><b>{stadiuNume}</b></div>
        </div>
        <div className={"anm-verdict " + (rez.stadiuGlobal >= 5 ? "pozitiv" : "negativ")}>
          <b>{t.lblVerdict}.</b> {verdictTxt}
        </div>
        <p style={{ margin: "12px 0 0", fontSize: "var(--m-fs-2)", color: "var(--m-muted)", fontWeight: 600 }}>{t.lblDistrib}</p>
        <div className="anm-chipuri">
          {banca.scale.map((sc) => (
            <span key={sc.num} className="anm-chip-scala">
              <i style={{ background: "#" + sc.culoare }} />
              {sc.nume}: <b>{rez.distributie[sc.num]}</b>
            </span>
          ))}
        </div>
        <AnmAxa banca={banca} stadiu={rez.stadiuGlobal} prefix={t.axaPrefix} />
      </div>

      {/* B. harta celor 10 arii */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.sectB}</p>
        <div className="anm-scroll">
          <table className="anm-table">
            <thead><tr><th>Aria</th><th className="c-scor">Scor / 30</th><th className="c-stadiu">Stadiu</th></tr></thead>
            <tbody>
              {banca.arii.map((a, i) => (
                <tr key={a.idx}>
                  <td>{a.nume}</td>
                  <td className="nw"><b>{rez.scorArii[i]}</b> / 30</td>
                  <td>{rez.stadiiArii[i] ? banca.scale[rez.stadiiArii[i] - 1].stadiu : ""}</td>
                </tr>
              ))}
            </tbody>
          </table>
        </div>
        <div className="anm-kpi-rand" style={{ marginTop: 12 }}>
          <div className="anm-kpi" style={{ borderColor: "var(--m-good)" }}>
            <small>{t.steaTop}</small><b>{ariaMax.nume}</b>
            <span style={{ color: "var(--m-muted)", fontSize: "var(--m-fs-2)" }}> {maxScor} / 30</span>
          </div>
          <div className="anm-kpi" style={{ borderColor: "var(--m-warn)" }}>
            <small>{t.steagPrior}</small><b>{ariaMin.nume}</b>
            <span style={{ color: "var(--m-muted)", fontSize: "var(--m-fs-2)" }}> {minScor} / 30</span>
          </div>
        </div>
      </div>

      {/* C. alerte comportamentale */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.sectC}</p>
        {alerteDef.map((al, k) => (
          <div key={k} style={{ marginBottom: 12 }}>
            <p style={{ margin: "0 0 4px", fontWeight: 600, fontSize: "var(--m-fs-3)" }}>
              {al.titlu}{al.nr} selecții)
            </p>
            {al.ginduri.length === 0
              ? <p style={{ margin: 0, color: "var(--m-muted)", fontSize: "var(--m-fs-3)" }}>nicio selecție</p>
              : al.ginduri.map((gind) => {
                  const it = anmItem(banca, gind);
                  return (
                    <div key={gind} className="anm-alerta">
                      <small>{banca.arii[it.aria - 1].nume}  ·  Ind. {it.ind}</small>
                      {anmTextAles(banca, rasp, gind)}
                    </div>
                  );
                })}
          </div>
        ))}
      </div>

      {/* D. resurse dezvoltate */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.sectD}</p>
        <div className="anm-kpi-rand">
          {t.resurse.map((rr, i) => (
            <div key={i} className="anm-kpi"><small>{rr}</small><b>{rez.distributie[4 + i]} indicatori</b></div>
          ))}
        </div>
      </div>

      {/* E. decodificarea stadiului dominant */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.sectE}</p>
        <p style={{ fontWeight: 700, margin: "0 0 4px" }}>
          STADIUL: {stadiuNume}  ·  {banca.scale[rez.stadiuGlobal - 1].zona}
        </p>
        <p style={{ margin: "0 0 6px", fontSize: "var(--m-fs-3)", lineHeight: 1.55 }}>
          {banca.decodificare.definitie[rez.stadiuGlobal - 1]}
        </p>
        {t.decTitluri.map((dt, i) => (
          <div key={i}>
            <p className="anm-dec-titlu">{dt}</p>
            <ul className="anm-dec-lista">
              {decMatrici[i][rez.stadiuGlobal - 1].map((b, j) => <li key={j}>{b}</li>)}
            </ul>
          </div>
        ))}
      </div>

      {/* certificatul de profil personal */}
      <div className="anm-cert">
        <p className="rand1">{t.certificat.titlu}</p>
        <p className="mic" style={{ marginTop: 2 }}>{t.certificat.sub}</p>
        <p className="nume">{nume}</p>
        <p className="mic">{t.certificat.parcurs}</p>
        <p className="mic" style={{ marginTop: 10 }}>{t.certificat.lblStadiu}</p>
        <p className="stadiu">{banca.scale[rez.stadiuGlobal - 1].nume}</p>
        <p className="mic">{banca.decodificare.programe[rez.stadiuGlobal - 1][0]}</p>
        <p className="mic" style={{ marginTop: 10 }}>{t.certificat.dataPrefix}{dataM}</p>
        <p className="mic" style={{ marginTop: 12 }}>{t.certificat.footer}</p>
      </div>
    </div>
  );
}
/* semnal compact pentru delte numerice */
function anmDelta(d) {
  if (d > 0) return "▲ +" + d;
  if (d < 0) return "▼ " + d;
  return "= 0";
}

function AnmComparatie({ banca, cred, store, onInapoi }) {
  const S = window.AnamnezaScoring;
  const t = banca.texte;
  const raw1 = anmRasp(store, cred, "p1");
  const raw2 = anmRasp(store, cred, "p2");
  const n1 = anmProgres(banca, raw1), n2 = anmProgres(banca, raw2);
  if (n1 < 50 || n2 < 50) return <AnmGate n={Math.min(n1, n2)} onInapoi={onInapoi} />;

  const r1 = S.evalueaza(banca, raw1);
  const r2 = S.evalueaza(banca, raw2);
  const c = S.comparatie(banca, r1, r2, raw1, raw2);
  const an = store.anamneza[cred] || {};
  const nume = (store.consola && store.consola.nume || "").trim();
  const st = (x) => banca.scale[x - 1].stadiu;
  /* semnalele metodologice = textele EXACTE ale lui Petre (formulele F9/F13, extrase in banca) */
  const semnalPol = r1.stadiuGlobal >= 5
    ? (r2.stadiuGlobal >= 5 ? t.compSemnalPol[0] : t.compSemnalPol[1])
    : (r2.stadiuGlobal >= 5 ? t.compSemnalPol[2] : t.compSemnalPol[3]);
  const semnalVeto = r1.vetoActiv && !r2.vetoActiv ? t.compSemnalVeto[0]
    : !r1.vetoActiv && r2.vetoActiv ? t.compSemnalVeto[1]
    : r1.vetoActiv ? t.compSemnalVeto[2] : t.compSemnalVeto[3];
  /* B14: semnalul de idealizare, in toate cele 4 variante ale lui */
  const I = t.compIdealizare;
  const idealTxt = r1.idealizat && r2.idealizat
    ? I.ambele[0] + r1.nMax + I.ambele[1] + r2.nMax + I.ambele[2]
    : r2.idealizat ? I.doarP2[0] + r2.nMax + I.doarP2[1]
    : r1.idealizat ? I.doarP1[0]
    : I.fara[0];
  const idealPozitiv = !r1.idealizat && !r2.idealizat;
  const randuriA = [
    { lbl: t.compRanduriA[0], p1: r1.stadiuGlobal, p2: r2.stadiuGlobal, d: anmDelta(c.deltaStadiu) },
    { lbl: t.compRanduriA[1], p1: st(r1.stadiuGlobal), p2: st(r2.stadiuGlobal), d: semnalPol },
    { lbl: t.compRanduriA[2], p1: r1.total, p2: r2.total, d: anmDelta(c.deltaTotal) },
    { lbl: t.compRanduriA[3], p1: Math.round(r1.pctBunatateReala * 100) + "%",
      p2: Math.round(r2.pctBunatateReala * 100) + "%",
      d: anmDelta(Math.round(c.deltaPct * 100)) + " pp" },
    { lbl: t.compRanduriA[4], p1: r1.nNeg, p2: r2.nNeg, d: anmDelta(c.deltaNeg) },
    { lbl: t.compRanduriA[5], p1: r1.vetoActiv ? "DA" : "NU", p2: r2.vetoActiv ? "DA" : "NU",
      d: semnalVeto },
  ];
  return (
    <div>
      <div className="anm-sect">
        <p className="anm-sect-titlu" style={{ marginBottom: 2 }}>{t.compTitlu}</p>
        <p style={{ margin: 0, color: "var(--m-muted)", fontSize: "var(--m-fs-3)" }}>
          Participant: <b style={{ color: "var(--m-text)" }}>{nume}</b>
          <span>  ·  P1: {an.p1_data || ""}  ·  P2: {an.p2_data || ""}</span>
        </p>
      </div>

      {/* A. verdict comparativ */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.compA}</p>
        <div className="anm-scroll">
          <table className="anm-table">
            <thead><tr><th>Indicator de sinteză</th><th className="c-val">P1 · start</th>
              <th className="c-val">P2 · 12 luni</th><th className="c-semnal">Semnal</th></tr></thead>
            <tbody>
              {randuriA.map((r, i) => (
                <tr key={i}><td>{r.lbl}</td><td>{r.p1}</td>
                  <td>{r.p2}</td><td>{r.d}</td></tr>
              ))}
            </tbody>
          </table>
        </div>
        <div className={"anm-verdict " + (idealPozitiv ? "pozitiv" : "negativ")} style={{ marginTop: 10 }}>
          {idealTxt}
        </div>
        <p style={{ margin: "12px 0 0", fontWeight: 600, fontSize: "var(--m-fs-3)" }}>{t.compSinteza}</p>
        <p style={{ margin: "4px 0 0", fontSize: "var(--m-fs-3)", color: "var(--m-muted)" }}>
          {c.deltaStadiu === 0
            ? "Stadiul dominant a rămas " + st(r1.stadiuGlobal) + "."
            : "Stadiul dominant s-a mutat de la " + st(r1.stadiuGlobal) + " la " + st(r2.stadiuGlobal) + "."}
        </p>
      </div>

      {/* B. migrarea celor 50 de alegeri pe scale */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.compB}</p>
        <AnmBars rows={banca.scale.map((sc, i) => ({
          label: sc.nume, a: c.migrareScale[i].p1, b: c.migrareScale[i].p2, culoare: sc.culoare,
        }))} max={50} />
        <p style={{ margin: "6px 0 0", fontSize: "var(--m-fs-1)", color: "var(--m-muted)" }}>
          bară colorată = P1 · bară aurie = P2
        </p>
      </div>

      {/* C. harta ariilor comparativ */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.compC}</p>
        <div className="anm-scroll">
          <table className="anm-table">
            <thead><tr><th>Aria</th><th className="c-scor">Scor P1</th><th className="c-scor">Scor P2</th>
              <th className="c-delta">Δ</th><th className="c-semnal">Semnal</th></tr></thead>
            <tbody>
              {banca.arii.map((a, i) => {
                const ca = c.arii[i];
                const semn = ca.stadiu2 > ca.stadiu1 ? "▲ salt de stadiu"
                  : ca.stadiu2 < ca.stadiu1 ? "▼ regres de stadiu" : "= stadiu stabil";
                return (
                  <tr key={a.idx}><td>{a.nume}</td><td className="nw">{ca.scor1} / 30</td>
                    <td className="nw">{ca.scor2} / 30</td>
                    <td className="nw">{anmDelta(ca.scor2 - ca.scor1)}</td>
                    <td>{semn}</td></tr>
                );
              })}
            </tbody>
          </table>
        </div>
        <div style={{ display: "flex", justifyContent: "center", marginTop: 10 }}>
          <AnmRadar banca={banca} a={r1.scorArii} b={r2.scorArii} max={30} />
        </div>
        <p style={{ margin: 0, textAlign: "center", fontSize: "var(--m-fs-1)", color: "var(--m-muted)" }}>
          navy = P1 · auriu = P2
        </p>
      </div>

      {/* D. miscarea celor 50 de indicatori */}
      <div className="anm-sect">
        <p className="anm-sect-titlu">{t.compD}</p>
        <div className="anm-kpi-rand">
          <div className="anm-kpi"><small>{t.compMisc[0]}</small><b>{c.indicatori.progres}</b></div>
          <div className="anm-kpi"><small>{t.compMisc[1]}</small><b>{c.indicatori.stationari}</b></div>
          <div className="anm-kpi"><small>{t.compMisc[2]}</small><b>{c.indicatori.regres}</b></div>
          <div className="anm-kpi"><small>{t.compMisc[3]}</small><b>{c.indicatori.ramasiNegativ}</b></div>
          <div className="anm-kpi"><small>{t.compMisc[4]}</small><b>{Math.round(c.indicatori.rataProgres * 100)}%</b></div>
        </div>
      </div>
    </div>
  );
}

function AnmDashboard({ banca, cred, store, onInapoi }) {
  const S = window.AnamnezaScoring;
  const t = banca.texte;
  const raw1 = anmRasp(store, cred, "p1");
  const raw2 = anmRasp(store, cred, "p2");
  const n1 = anmProgres(banca, raw1), n2 = anmProgres(banca, raw2);
  const [sel, setSel] = React.useState(n2 === 50 ? "p2" : "p1");
  if (n1 < 50 && n2 < 50) return <AnmGate n={Math.max(n1, n2)} onInapoi={onInapoi} />;

  const raw = sel === "p1" ? raw1 : raw2;
  const nSel = sel === "p1" ? n1 : n2;
  const rez = nSel === 50 ? S.evalueaza(banca, raw) : null;
  return (
    <div>
      <AnmRand extra={
        <span className="anm-seg" role="group" aria-label={t.dashSelector}>
          <button className={sel === "p1" ? "activ" : ""} disabled={n1 < 50}
            title={n1 < 50 ? "P1 incomplet" : undefined} onClick={() => setSel("p1")}>P1</button>
          <button className={sel === "p2" ? "activ" : ""} disabled={n2 < 50}
            title={n2 < 50 ? "P2 incomplet" : undefined} onClick={() => setSel("p2")}>P2</button>
        </span>
      } />
      <div className="anm-sect">
        <p className="anm-sect-titlu" style={{ marginBottom: 2 }}>{t.dashTitlu}</p>
        <p style={{ margin: 0, color: "var(--m-muted)", fontSize: "var(--m-fs-3)" }}>
          {t.dashSelector} <b style={{ color: "var(--m-text)" }}>{sel.toUpperCase()}</b>
        </p>
      </div>
      {!rez ? (
        <div className="anm-sect anm-gate">
          <b>Măsurarea {sel.toUpperCase()} nu e completă.</b>
          <p>Progres: {nSel} / 50.</p>
        </div>
      ) : (
        <div>
          <div className="anm-sect">
            <div className="anm-kpi-rand">
              <div className="anm-kpi"><small>{t.dashStadiu}</small>
                <b>{banca.scale[rez.stadiuGlobal - 1].stadiu}</b></div>
              <div className="anm-kpi"><small>{t.dashScor}</small>
                <b>{rez.total} / 300</b>
                <span style={{ color: "var(--m-muted)", fontSize: "var(--m-fs-2)" }}>
                  {"  "}bunătate reală {Math.round(rez.pctBunatateReala * 100)}%</span></div>
            </div>
            <div className={"anm-verdict " + (rez.stadiuGlobal >= 5 ? "pozitiv" : "negativ")}>
              {S.verdict(banca, rez)}
            </div>
            <AnmAxa banca={banca} stadiu={rez.stadiuGlobal} prefix={t.dashAxaPrefix} />
          </div>

          <div className="anm-dash-grid">
            <div className="anm-sect" style={{ marginBottom: 0 }}>
              <p className="anm-sect-titlu">{t.dashVitezPrefix}{rez.stadiuGlobal} / 6</p>
              <AnmGauge banca={banca} stadiu={rez.stadiuGlobal} />
            </div>
            <div className="anm-sect" style={{ marginBottom: 0 }}>
              <p className="anm-sect-titlu">{t.dashTop}</p>
              <ol className="anm-lista-simpla">
                {rez.topArii.map((idx) => (
                  <li key={idx}>{banca.arii[idx - 1].nume} <b>{rez.scorArii[idx - 1]} / 30</b></li>
                ))}
              </ol>
              <p className="anm-sect-titlu" style={{ marginTop: 14 }}>{t.dashPrior}</p>
              <ol className="anm-lista-simpla">
                {rez.bottomArii.map((idx) => (
                  <li key={idx}>{banca.arii[idx - 1].nume} <b>{rez.scorArii[idx - 1]} / 30</b></li>
                ))}
              </ol>
            </div>
            <div className="anm-sect" style={{ marginBottom: 0 }}>
              <p className="anm-sect-titlu">Profil pe cele 10 arii (scor / 30)</p>
              <AnmRadar banca={banca} a={rez.scorArii} max={30} />
            </div>
            <div className="anm-sect" style={{ marginBottom: 0 }}>
              <p className="anm-sect-titlu">Distribuția celor 50 de alegeri pe cele 6 scale</p>
              <AnmBars rows={banca.scale.map((sc) => ({
                label: sc.nume, a: rez.distributie[sc.num], culoare: sc.culoare,
              }))} max={50} />
            </div>
          </div>
        </div>
      )}
    </div>
  );
}