/* Cartea de contabilitate — site de citit. Fisier EXTERN, nu <style> inline:
   CSP-ul aplicatiei e `style-src 'self'`, deci un <style> in pagina e refuzat de
   browser (verificat: HTML-ul cu stil inline se vedea in Times New Roman, cu zero
   foi de stil aplicate). Regula, pentru orice pagina noua din public/: CSS si JS in
   fisiere proprii, niciodata in linie. */

:root {
  --paper:#FCFDFB; --panou:#F2F6F0; --card:#F5F8F3; --bar:#EBF1E8;
  --ink:#16211D; --ink-2:#55645C; --ink-3:#7C8A83;
  --rule:#D6E0D6; --rule-2:#B6C7B8; --verde:#2C5B44; --rosu:#9E2A20;
  --umbra:0 1px 2px rgba(22,33,29,.05), 0 8px 24px rgba(22,33,29,.06);
  --lat-nav:19.5rem;
}
@media (prefers-color-scheme: dark) { :root:not([data-tema="light"]) {
  --paper:#0F1512; --panou:#131A16; --card:#18211C; --bar:#161E19;
  --ink:#DFE7DF; --ink-2:#9BAAA1; --ink-3:#74837B;
  --rule:#28332B; --rule-2:#3D4C42; --verde:#8FC0A4; --rosu:#D97A6C;
  --umbra:0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35); } }
:root[data-tema="dark"] {
  --paper:#0F1512; --panou:#131A16; --card:#18211C; --bar:#161E19;
  --ink:#DFE7DF; --ink-2:#9BAAA1; --ink-3:#74837B;
  --rule:#28332B; --rule-2:#3D4C42; --verde:#8FC0A4; --rosu:#D97A6C;
  --umbra:0 1px 2px rgba(0,0,0,.3), 0 8px 24px rgba(0,0,0,.35); }

*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after{ transition:none!important; animation:none!important; } }

body { margin:0; background:var(--paper); color:var(--ink);
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Charter,Georgia,serif;
  font-size:1.0625rem; line-height:1.62; -webkit-font-smoothing:antialiased; }
.ui { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif; }

/* ── Structura: nav fix la stanga, textul la dreapta ─────────────────────── */
.cadru { display:grid; grid-template-columns:var(--lat-nav) minmax(0,1fr); min-height:100vh; }

.nav { position:sticky; top:0; height:100vh; overflow-y:auto; overscroll-behavior:contain;
  background:var(--panou); border-right:1px solid var(--rule); padding:0 0 3rem; }
/* Antetul nav-ului sta LIPIT sus: cuprinsul se deruleaza la capitolul activ, iar titlul,
   cautarea si legatura de intoarcere ar fi iesit din ecran exact cand ai nevoie de ele. */
.nav-cap { position:sticky; top:0; z-index:2; background:var(--panou);
  padding:1.15rem 1.15rem 1rem; border-bottom:1px solid var(--rule); margin-bottom:.85rem; }
.nav-titlu { font-size:.94rem; font-weight:600; margin:0 0 .15rem; line-height:1.3; letter-spacing:-.01em; }
.nav-sub { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.68rem; letter-spacing:.11em; text-transform:uppercase; color:var(--ink-3); margin:0 0 .5rem; }
/* Legatura de intoarcere in aplicatie. Sta in antetul nav-ului, deci e vizibila din orice
   capitol, nu doar de pe coperta. NU e un link cu diez, deci nu trece prin ruterul din site.js. */
.inapoi { display:inline-block; margin:0 0 .75rem; color:var(--verde); text-decoration:none;
  font-weight:600; white-space:nowrap;
  font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.82rem; }
.inapoi:hover { text-decoration:underline; }
.inapoi:focus-visible { outline:2px solid var(--verde); outline-offset:2px; border-radius:.15rem; }

.cauta { width:100%; padding:.42rem .6rem; border:1px solid var(--rule-2); border-radius:.3rem;
  background:var(--paper); color:var(--ink); font:inherit; font-size:.83rem;
  font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; }
.cauta::placeholder { color:var(--ink-3); }
.cauta:focus-visible { outline:2px solid var(--verde); outline-offset:1px; border-color:var(--verde); }

.grup { margin:0 0 .2rem; }
.grup-cap { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.64rem; letter-spacing:.13em; text-transform:uppercase; color:var(--verde);
  font-weight:700; margin:.95rem 0 .3rem; padding:0 1.15rem; }
.nav a { display:grid; grid-template-columns:1.9rem 1fr; gap:.45rem; align-items:baseline;
  padding:.3rem 1.15rem .3rem .9rem; color:var(--ink-2); text-decoration:none;
  font-size:.845rem; line-height:1.35; border-left:2px solid transparent; }
.nav a .n { font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace; font-size:.72rem;
  color:var(--ink-3); text-align:right; font-variant-numeric:tabular-nums; }
.nav a:hover { background:var(--bar); color:var(--ink); }
.nav a:focus-visible { outline:2px solid var(--verde); outline-offset:-2px; }
.nav a.activ { background:var(--bar); color:var(--ink); font-weight:600; border-left-color:var(--verde); }
.nav a[hidden] { display:none; }
.gol { padding:.8rem 1.15rem; color:var(--ink-3); font-size:.82rem;
  font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; }

/* ── Panoul de text ─────────────────────────────────────────────────────── */
.text { padding:0 2.5rem 6rem; min-width:0; }
.bara { position:sticky; top:0; z-index:5; display:flex; align-items:center; gap:.6rem;
  padding:.6rem 0; margin-bottom:1.2rem; border-bottom:1px solid var(--rule);
  background:var(--paper); /* rezerva, pentru motoarele fara color-mix */
  background:color-mix(in srgb, var(--paper) 92%, transparent); backdrop-filter:blur(6px); }
.bara .drum { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3);
  flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.buton { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.78rem;
  padding:.3rem .6rem; border:1px solid var(--rule-2); border-radius:.3rem; background:var(--paper);
  color:var(--ink-2); cursor:pointer; line-height:1.2; }
.buton:hover { background:var(--bar); color:var(--ink); }
.buton:focus-visible { outline:2px solid var(--verde); outline-offset:1px; }
.meniu-buton { display:none; }

/* `scroll-margin-top`: deschiderea directa a unui link cu diez (#anexa-B) face browserul
   sa deruleze NATIV la sectiune, iar bara lipicioasa acoperea primele doua randuri. */
.capitol { max-width:40rem; margin:0 auto; scroll-margin-top:4rem; }
.capitol[hidden] { display:none; }
.cap-parte { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.68rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--verde); font-weight:700; margin:1.6rem 0 .35rem; }
.cap-nr { font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace; font-size:.76rem;
  color:var(--ink-3); margin:0 0 .5rem; }
.cap-titlu { font-size:2.05rem; line-height:1.12; margin:0 0 1.6rem; font-weight:600;
  letter-spacing:-.018em; text-wrap:balance; }
.capitol h3 { font-size:1.16rem; margin:2.1rem 0 .6rem; font-weight:600; letter-spacing:-.008em;
  text-wrap:balance; }
.capitol p { margin:0 0 .95rem; text-wrap:pretty; }
.cheie { border-left:3px solid var(--verde); background:var(--card); padding:.85rem 1.1rem;
  margin:1.5rem 0 !important; font-style:italic; font-size:1.02rem; }

/* Selectorii de mai jos urmeaza MARCAJUL REAL produs de `blocuriHtml()`:
   <aside class="contabil"><h4>…</h4><p>…</p></aside>
   <aside class="recap"><h4>…</h4><ul><li>…</li></ul></aside>
   <figure class="tab"><figcaption>…</figcaption><table>…</table><p class="tab-nota">…</p></figure>
   Prima versiune a acestui fisier fusese scrisa pe un marcaj PRESUPUS (.contabil-t, .recap-t,
   .tab-titlu, .tab ca tabel) — regulile nu prindeau nimic, iar `figure` isi pastra marginea
   implicita de 40px a browserului, deci tabelele ieseau indentate si mai inguste. Masurat in
   browser, nu presupus: figure.tab avea `margin: 14.72px 40px` si tabelul 551px in loc de 640. */
.contabil { border:1px solid var(--rule); background:var(--card); border-radius:.35rem;
  padding:1rem 1.2rem; margin:1.8rem 0 1.5rem; }
.contabil h4 { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.68rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--verde); font-weight:700; margin:0 0 .5rem; }
.contabil p { margin:0 !important; font-size:.95rem; color:var(--ink-2); }

.recap { border-top:2px solid var(--verde); padding:1rem 0 0; margin:2.6rem 0 0; }
.recap h4 { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.68rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3); font-weight:700; margin:0 0 .6rem; }
.recap ul { margin:0; padding-left:1.15rem; }
.recap li { margin:0 0 .5rem; font-size:.96rem; }
.recap li::marker { color:var(--verde); }

/* Exercitiu: enuntul si rezolvarea, marcate distinct — se pot citi si sari. */
.ex { border-left:3px solid var(--rosu); background:var(--card); border-radius:0 .35rem .35rem 0;
  padding:.9rem 1.1rem; margin:1.8rem 0 1.5rem; }
.ex-t { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.68rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--rosu); font-weight:700; margin:0 0 .5rem !important; }
.ex-r { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.66rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3); font-weight:700;
  margin:.9rem 0 .4rem !important; }
.ex p { font-size:.96rem; margin:0 0 .55rem !important; }
.ex p:last-child { margin-bottom:0 !important; }

.tab { margin:1.6rem 0 1.8rem; overflow-x:auto; }
.tab figcaption { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.66rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3); font-weight:700; margin:0 0 .45rem; }
.tab table { border-collapse:collapse; width:100%; font-size:.93rem; }
.tab th, .tab td { border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  padding:.4rem .55rem; text-align:left; vertical-align:top; }
.tab th { background:var(--bar); font-weight:600; font-size:.87rem; }
.tab th.num, .tab td.num { text-align:right; }
.tab td.num { font-variant-numeric:tabular-nums; }
.tab tbody tr.total td { font-weight:600; }
.tab-nota { font-size:.87rem; color:var(--ink-2); font-style:italic; margin:.5rem 0 0 !important; }

/* ── Navigarea de la finalul capitolului ────────────────────────────────── */
.pasi { display:flex; gap:.8rem; margin:3rem auto 0; max-width:40rem; padding-top:1.3rem;
  border-top:1px solid var(--rule); }
.pasi a { flex:1 1 0; min-width:0; text-decoration:none; color:var(--ink-2); padding:.7rem .9rem;
  border:1px solid var(--rule); border-radius:.35rem; background:var(--card); }
.pasi a:hover { border-color:var(--rule-2); color:var(--ink); }
.pasi a:focus-visible { outline:2px solid var(--verde); outline-offset:1px; }
.pasi .et { display:block; font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); margin-bottom:.2rem; }
.pasi .tt { display:block; font-size:.92rem; line-height:1.3; }
.pasi .urm { text-align:right; }
.pasi a[hidden] { display:none; }

/* ── Coperta ────────────────────────────────────────────────────────────── */
.coperta { max-width:40rem; margin:0 auto; }
.coperta h1 { font-size:clamp(2rem,4.4vw,2.9rem); line-height:1.08; margin:1.5rem 0 .8rem;
  font-weight:600; letter-spacing:-.02em; text-wrap:balance; }
.coperta .subtitlu { font-size:1.1rem; color:var(--ink-2); margin:0 0 2rem; text-wrap:pretty; }
.coperta .teza p { margin:0 0 .8rem; }
.coperta .teza { border-left:3px solid var(--verde); padding-left:1.2rem; margin:0 0 2.2rem; }
.fise { display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:.9rem; margin:0 0 2.2rem; }
.fisa { border:1px solid var(--rule); background:var(--card); border-radius:.35rem; padding:.9rem 1rem; }
.fisa h3 { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.66rem;
  letter-spacing:.13em; text-transform:uppercase; color:var(--ink-3); margin:0 0 .35rem; font-weight:700; }
.fisa p { margin:0; font-size:.93rem; color:var(--ink-2); }
.desc { display:flex; flex-wrap:wrap; gap:.6rem; margin:0 0 2.5rem; }
.desc a { font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif; font-size:.82rem;
  text-decoration:none; color:var(--ink-2); border:1px solid var(--rule-2); border-radius:.3rem;
  padding:.4rem .75rem; background:var(--paper); }
.desc a:hover { background:var(--bar); color:var(--ink); }
.desc a:focus-visible { outline:2px solid var(--verde); outline-offset:1px; }

/* ── Ecrane inguste: nav-ul devine sertar ───────────────────────────────── */
@media (max-width:60rem) {
  .cadru { grid-template-columns:1fr; }
  .nav { position:fixed; inset:0 auto 0 0; width:min(var(--lat-nav),86vw); z-index:20;
    transform:translateX(-102%); transition:transform .18s ease; box-shadow:var(--umbra); }
  .nav.deschis { transform:none; }
  .meniu-buton { display:inline-block; }
  .text { padding:0 1.1rem 5rem; }
  .voal { position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:15; }
  .voal[hidden] { display:none; }
}
@media print {
  .nav, .bara, .pasi, .voal { display:none !important; }
  .cadru { display:block; }
  .capitol[hidden] { display:block !important; }
  .capitol { break-before:page; max-width:none; }
}
