:root{
  --fundal:#f7f8fb; --hartie:#ffffff; --text:#1d2230; --text-2:#5b6478;
  --accent:#1c3f95; --accent-2:#e8edf9; --linie:#dfe3ec; --eroare:#b8322b;
  --bula-elev:#1c3f95; --bula-elev-text:#fff; --bula-mentor:#fff;
  --sus:env(safe-area-inset-top); --jos:env(safe-area-inset-bottom);
}
@media (prefers-color-scheme:dark){
  :root{ --fundal:#12151c; --hartie:#1b1f29; --text:#e8eaf0; --text-2:#9aa3b5; --accent:#8fb0ff; --accent-2:#22304f; --linie:#2b3242; --bula-elev:#2f57c4; --bula-mentor:#1b1f29; }
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;background:var(--fundal);color:var(--text);font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased}
.bara{display:flex;align-items:center;gap:12px;padding:calc(10px + var(--sus)) 16px 10px;background:var(--hartie);border-bottom:1px solid var(--linie);position:sticky;top:0;z-index:2}
.brand{font-weight:800;font-size:1.25rem;letter-spacing:-.02em}
.brand span{color:var(--accent)}
.stare{flex:1;color:var(--text-2);font-size:.9rem}
.btn-ghost{background:none;border:1px solid var(--linie);color:var(--text-2);border-radius:10px;padding:8px 12px;font-size:.9rem;min-height:44px}
.ecran{flex:1;display:flex;flex-direction:column;min-height:0}
.card{margin:auto;width:100%;max-width:440px;padding:24px;background:var(--hartie);border:1px solid var(--linie);border-radius:16px;display:flex;flex-direction:column;gap:14px}
@media (max-width:480px){.card{border:0;border-radius:0;margin:0;max-width:none;flex:1}}
h1{font-size:1.6rem;margin:0;letter-spacing:-.01em}
.sub{margin:0;color:var(--text-2)}
label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:.95rem}
input[type=text],input:not([type]),textarea{font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--linie);border-radius:12px;background:var(--fundal);color:var(--text);min-height:48px}
input:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:transparent}
.segment{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.segment input{position:absolute;opacity:0;width:0;height:0}
.segment label{display:flex;align-items:center;justify-content:center;min-height:48px;border:1px solid var(--linie);border-radius:12px;cursor:pointer;font-weight:600}
.segment input:checked+label{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn{font:inherit;font-weight:700;font-size:1.05rem;background:var(--accent);color:#fff;border:0;border-radius:12px;min-height:52px;padding:0 20px;cursor:pointer}
.btn:disabled{opacity:.6}
.eroare{color:var(--eroare);margin:0;font-size:.95rem}
.legal{margin:0;color:var(--text-2);font-size:.8rem;line-height:1.4}

.mesaje{flex:1;overflow-y:auto;padding:16px 12px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.bula{max-width:86%;padding:10px 14px;border-radius:16px;line-height:1.5;word-wrap:break-word;overflow-wrap:anywhere}
.bula p{margin:0 0 .6em}.bula p:last-child{margin-bottom:0}
.elev{align-self:flex-end;background:var(--bula-elev);color:var(--bula-elev-text);border-bottom-right-radius:4px}
.mentor{align-self:flex-start;background:var(--bula-mentor);border:1px solid var(--linie);border-bottom-left-radius:4px}
.mentor .katex-display{margin:.5em 0;overflow-x:auto;overflow-y:hidden}
.scrie{align-self:flex-start;color:var(--text-2);font-size:.9rem;padding:4px 14px}
.scrie::after{content:"…";animation:puncte 1.2s infinite}
@keyframes puncte{0%{content:"."}33%{content:".."}66%{content:"..."}}

.compunere{display:flex;gap:8px;align-items:flex-end;padding:10px 12px calc(10px + var(--jos));background:var(--hartie);border-top:1px solid var(--linie)}
.compunere textarea{flex:1;resize:none;max-height:140px;border-radius:14px}
.btn-trimite{width:48px;height:48px;border-radius:50%;border:0;background:var(--accent);color:#fff;font-size:1.2rem;cursor:pointer;flex:none}
.btn-trimite:disabled{opacity:.5}

/* ---- figuri interactive ---- */
.figura{align-self:flex-start;position:relative;background:var(--hartie);border:1px solid var(--linie);border-radius:16px;padding:10px 12px 8px;max-width:92%}
.figura.flash{animation:flash .9s ease-out}
@keyframes flash{0%{box-shadow:0 0 0 3px var(--accent)}100%{box-shadow:0 0 0 0 transparent}}
.fig-titlu{font-weight:600;font-size:.95rem;margin-bottom:4px}
.fig-titlu:empty{display:none}
.fig-svg{display:block;max-width:100%;height:auto;user-select:none;-webkit-user-select:none}
.fig-poligon{fill:var(--accent-2);stroke:none}
.fig-cerc{fill:var(--accent-2);stroke:var(--accent);stroke-width:2.5;cursor:pointer}
.fig-linie{stroke:var(--accent);stroke-width:2.5;stroke-linecap:round;pointer-events:none}
.fig-seg.punctat .fig-linie{stroke-dasharray:6 5;stroke-width:2}
.fig-hit,.fig-hit-punct,.fig-hit-unghi{stroke:transparent;fill:transparent;stroke-width:26;cursor:pointer}
.fig-hit-punct,.fig-hit-unghi{stroke:none}
.fig-arc{fill:none;stroke:var(--accent);stroke-width:1.8;pointer-events:none}
.fig-buline{fill:var(--accent);stroke:var(--hartie);stroke-width:2;pointer-events:none}
.fig-punct.trage .fig-hit-punct{cursor:grab}
.fig-text{font:600 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;fill:var(--text);paint-order:stroke;stroke:var(--hartie);stroke-width:4px;stroke-linejoin:round;pointer-events:none}
.fig-text.mic{font-size:12.5px}
.fig-text.nume{font-size:15px;font-weight:700}
.fig-text.ascuns{fill:var(--eroare);font-size:16px}
.fig-seg.activ .fig-linie,.fig-cerc.activ{stroke:#e0891f;stroke-width:4}
.fig-unghi.activ .fig-arc{stroke:#e0891f;stroke-width:3}
.fig-punct.activ .fig-buline{fill:#e0891f;r:7}
.fig-tooltip{position:absolute;z-index:3;background:var(--text);color:var(--hartie);border-radius:10px;padding:8px 10px;font-size:.9rem;max-width:230px;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.tt-titlu{font-weight:700}
.tt-val{font-size:1.05rem;margin-top:2px}
.tt-ind{margin-top:4px;opacity:.9}
.tt-btn{margin-top:8px;font:inherit;font-size:.85rem;background:var(--accent);color:#fff;border:0;border-radius:8px;padding:8px 10px;min-height:36px;cursor:pointer;width:100%}
.fig-ajutor{color:var(--text-2);font-size:.78rem;margin-top:4px}

/* ---- voce ---- */
.btn-rotund{width:48px;height:48px;border-radius:50%;border:1px solid var(--linie);background:var(--fundal);color:var(--accent);display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none;padding:0}
.btn-rotund.activ{background:var(--eroare);color:#fff;border-color:var(--eroare);animation:puls 1.2s infinite}
.btn-rotund.oprit{color:var(--text-2)}
@keyframes puls{0%{box-shadow:0 0 0 0 rgba(184,50,43,.45)}100%{box-shadow:0 0 0 12px rgba(184,50,43,0)}}
.voce-stare{padding:6px 16px;font-size:.85rem;color:var(--text-2);background:var(--hartie);border-top:1px solid var(--linie)}
.voce-stare.asculta{color:var(--eroare);font-weight:600}