/* Camera Povestilor v1 - design-tokens din album-viu-mock-v2 (foaia B10, pas 2)
   Lora + DM Sans · bordo #743244 · hartie #F2EADB · fila #FBF7ED.
   Publicul principal: varstnici pe telefon - butoane late, fonturi mari. */

:root{
  --bordo:#743244; --bordo-adanc:#5A2635; --cerneala:#2B2024;
  --hartie:#F2EADB; --fila:#FBF7ED; --stins:#8A7A72; --aurar:#B98A2F;
  --jar:#A34C62;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none !important}
body{
  background:var(--hartie);
  background-image:radial-gradient(ellipse at 50% 0%, #F7F0E2 0%, var(--hartie) 70%);
  font-family:'DM Sans',sans-serif; color:var(--cerneala);
  min-height:100vh;
}
.ecran{
  width:min(520px, 100%); margin:0 auto; padding:18px 16px 40px;
  display:flex; flex-direction:column; gap:16px;
}
.antet{display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding:4px 2px}
.sigla{font-family:'Lora',serif; font-weight:600; letter-spacing:.18em;
  color:var(--bordo); font-size:15px}
.antet-sub{font-size:14px; color:var(--stins); text-align:right}
.progres-discret{font-size:13px; color:var(--stins); text-align:right}

.fila{
  background:var(--fila); border-radius:8px;
  box-shadow:0 1px 2px rgba(43,32,36,.10), 0 10px 30px rgba(43,32,36,.12);
  padding:22px 20px; position:relative;
}
.titlu-fila{
  font-family:'Lora',serif; font-style:italic; font-weight:600;
  font-size:24px; line-height:1.3; color:var(--bordo-adanc); margin-bottom:14px;
}
.subtitlu{font-family:'Lora',serif; font-size:19px; color:var(--bordo-adanc); margin-bottom:8px}
.optional{font-family:'DM Sans',sans-serif; font-size:13px; color:var(--stins); font-weight:400}

.incarcare-text{font-size:17px; color:var(--stins); text-align:center; padding:30px 8px}

/* consimtamant (2.1) */
.consimtamant-intro{font-size:17px; margin-bottom:12px}
.consimtamant-lista{list-style:none; margin-bottom:22px}
.consimtamant-lista li{
  font-size:17px; line-height:1.55; margin-bottom:12px; padding-left:22px; position:relative;
}
.consimtamant-lista li::before{content:"•"; position:absolute; left:4px; color:var(--bordo); font-weight:700}
.link-mic{display:block; text-align:center; margin-top:14px; font-size:14px; color:var(--stins)}

/* butoane - mari, late, cu tinta de deget generoasa */
button{font-family:'DM Sans',sans-serif; cursor:pointer; border:none}
.buton-urias{
  width:100%; padding:22px 18px; border-radius:14px;
  background:var(--bordo); color:#F6EDDF; font-size:22px; font-weight:700;
  display:flex; align-items:center; justify-content:center; gap:12px;
  box-shadow:0 6px 16px rgba(116,50,68,.35); transition:transform .15s ease;
}
.buton-urias:active{transform:scale(.97)}
.buton-urias svg{width:26px; height:26px; fill:currentColor; flex:0 0 auto}
.buton-urias.inregistreaza{background:var(--jar); animation:puls 1.6s ease-in-out infinite}
@keyframes puls{0%,100%{box-shadow:0 6px 14px rgba(163,76,98,.35)} 50%{box-shadow:0 6px 24px rgba(163,76,98,.6)}}
.buton-mare{
  width:100%; padding:16px; border-radius:12px; margin-top:10px;
  background:var(--bordo); color:#F6EDDF; font-size:18px; font-weight:700;
  display:flex; align-items:center; justify-content:center; gap:10px;
}
.buton-mare svg{width:20px; height:20px; fill:currentColor}
.buton-mare.secundar{background:transparent; color:var(--bordo); border:2px solid var(--bordo)}
.buton-mare.spontan{background:transparent; color:var(--bordo-adanc);
  border:2px dashed var(--bordo); font-weight:500}
.butoane-duble{display:flex; flex-direction:column}

/* intrebarea curenta */
.intrebare-cine{font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--bordo); font-weight:700; margin-bottom:10px}
.intrebare-text{font-family:'Lora',serif; font-style:italic;
  font-size:24px; line-height:1.45; margin-bottom:14px}

/* inregistrare */
.zona-inregistrare{text-align:center}
.stare-inregistrare{font-size:16px; color:var(--stins); min-height:22px; margin-bottom:10px}
.stare-inregistrare.eroare{color:#8f1f1f; font-weight:700}
.timer{font-size:44px; font-variant-numeric:tabular-nums; color:var(--bordo-adanc);
  font-weight:700; margin:8px 0 14px}
.mesaj-trimis{
  background:rgba(46,125,50,.12); border:1px solid rgba(46,125,50,.4);
  color:#1b5e20; border-radius:10px; padding:14px; font-size:17px; margin-top:12px;
}
.eroare-globala{
  background:#8f1f1f; color:#fff; font-size:16px; padding:12px 16px;
  position:sticky; top:0; z-index:50; text-align:center;
}

/* mesaje de la Dora */
.mesaj-dora{background:rgba(116,50,68,.06); border:1px solid rgba(116,50,68,.18);
  border-radius:12px; padding:14px 16px; margin-bottom:4px}
.mesaj-dora .de-la{font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--bordo); font-weight:700; margin-bottom:6px}
.mesaj-dora .text{font-family:'Lora',serif; font-style:italic; font-size:18px; line-height:1.5}
.mesaj-dora audio{width:100%; margin-top:8px}

/* eticheta obligatorie pe orice audio sintetic viitor (2.2) */
.voce-generata{display:inline-block; font-size:11px; letter-spacing:.08em;
  text-transform:uppercase; background:var(--cerneala); color:#E9DFCB;
  border-radius:8px; padding:2px 8px; margin-left:8px}

/* ---- ARHIVA (2.2): fila de poveste pe layout-ul album-viu-mock-v2 ---- */
.capitol-titlu{
  display:flex; align-items:center; gap:12px; margin:18px 2px 10px;
  font-size:11px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--aurar); font-weight:700;
}
.capitol-titlu::before,.capitol-titlu::after{content:""; height:1px; background:var(--aurar); opacity:.45; flex:1}
.fila-poveste{margin-bottom:20px; padding:26px 22px}
.fila-poveste h1{
  font-family:'Lora',serif; font-style:italic; font-weight:600;
  font-size:26px; line-height:1.2; color:var(--bordo-adanc);
  text-align:center; margin-bottom:6px;
}
.fila-poveste .meta{text-align:center; font-size:12.5px; color:var(--stins); margin-bottom:18px}
.fila-poveste .meta b{color:var(--cerneala); font-weight:500}

.player{display:flex; align-items:center; gap:14px; margin-bottom:14px}
.buton-play{
  flex:0 0 auto; width:58px; height:58px; border-radius:50%;
  background:var(--bordo); color:#F6EDDF; display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 14px rgba(116,50,68,.35); transition:transform .15s ease;
}
.buton-play:active{transform:scale(.94)}
.buton-play.canta{animation:puls 1.6s ease-in-out infinite}
.buton-play svg{width:22px; height:22px; fill:currentColor}
.pista{flex:1}
.pista .actiune{font-size:12px; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--bordo); margin-bottom:7px}
.bara{height:3px; background:rgba(43,32,36,.14); border-radius:2px; overflow:hidden}
.bara i{display:block; height:100%; width:0%; background:var(--bordo); border-radius:2px}
.timp{font-size:11.5px; color:var(--stins); margin-top:6px; font-variant-numeric:tabular-nums}

.transcript{
  font-family:'Lora',serif; font-size:19px; line-height:1.75;
  color:rgba(43,32,36,.36); padding:4px 2px 2px;
}
.transcript.static{color:var(--cerneala)}
.transcript .c{transition:color .5s ease, background-color .8s ease;
  border-radius:4px; padding:0 1px}
.transcript .c.spus{color:var(--cerneala)}
.transcript .c.acum{color:var(--bordo-adanc); background:rgba(163,76,98,.15)}
@media (prefers-reduced-motion: reduce){
  .buton-play.canta,.buton-urias.inregistreaza{animation:none}
  .transcript .c{transition:none}
}

.separ{height:1px; background:rgba(43,32,36,.12); margin:18px 0 14px}
.borcan-titlu{font-size:14px; font-weight:700; color:var(--bordo); margin-bottom:8px}
.borcan-nume{width:100%; font-size:16px; padding:10px 12px; border:1px solid rgba(43,32,36,.25);
  border-radius:8px; background:#fff; font-family:'DM Sans',sans-serif; margin-bottom:8px}

/* ---- KEEPER (2.3) ---- */
.keeper-explicatie{font-size:15px; color:var(--stins); line-height:1.5; margin-bottom:12px}
.mesaj-keeper{
  font-family:'Lora',serif; font-style:italic; font-size:16.5px; line-height:1.6;
  background:rgba(116,50,68,.06); border-left:3px solid var(--bordo);
  border-radius:0 10px 10px 0; padding:14px 16px; margin-bottom:6px; word-break:break-word;
}
.lista-intrebari{list-style:none}
.lista-intrebari li{
  display:flex; align-items:flex-start; gap:10px; padding:12px 4px;
  border-bottom:1px solid rgba(43,32,36,.1); font-size:15.5px; line-height:1.45;
}
.lista-intrebari li.dezactivata .text-intrebare{color:var(--stins); text-decoration:line-through}
.lista-intrebari .capitol-mic{display:block; font-size:11px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--aurar); font-weight:700}
.lista-intrebari .sursa-familie{color:var(--bordo); font-weight:700; font-size:12px}
.lista-intrebari button{
  flex:0 0 auto; background:transparent; border:1.5px solid var(--stins);
  color:var(--stins); border-radius:8px; padding:7px 10px; font-size:13px;
}
.lista-intrebari li.dezactivata button{border-color:var(--bordo); color:var(--bordo)}
.text-intrebare{flex:1}