:root { --blue: #2582c2; --accent: #5cb7ea; --fill: #110c17; --bg: #f0f0f2; --text: #1e2a3a; --muted: #5d6d82; --rosu: #c0392b; --galben: #b7791f; --verde: #1e8449; }
* { box-sizing: border-box; }
body { margin: 0; font-family: Arial, sans-serif; background: var(--bg); color: var(--text); padding-bottom: 120px; }
.antet { background: var(--blue); color: #fff; padding: 16px; }
.antet h1 { margin: 0 0 6px; font-size: 22px; }
.antet p { margin: 4px 0; }
.stare { font-weight: 700; }
main { max-width: 860px; margin: 0 auto; padding: 16px; }
.piesa { background: #fff; border-radius: 12px; padding: 16px; margin-bottom: 18px; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.piesa.respins { opacity: .5; }
.piesa h2 { font-size: 17px; margin: 0 0 12px; display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.articol-cadru { width: 100%; height: 520px; border: 1px solid #ddd; border-radius: 8px; }
.fb { border: 1px solid #ddd; border-radius: 8px; padding: 12px; max-width: 500px; }
.fb-antet { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.fb-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--fill); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }
.fb-text { margin: 6px 0; white-space: pre-wrap; }
.fb-tags { color: var(--blue); margin: 6px 0; }
.fb-img { width: 100%; border-radius: 6px; margin-top: 8px; }
.fb-link { font-size: 13px; color: var(--muted); word-break: break-all; }
.verificari { list-style: none; padding: 0; margin: 12px 0 0; }
.verificari li { padding: 4px 0; }
.eroare { color: var(--rosu); font-weight: 700; }
.avertisment { color: var(--galben); }
.verificari-ok { color: var(--verde); margin: 12px 0 0; }
.actiuni { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.buton { border: 0; border-radius: 8px; padding: 10px 16px; font-size: 15px; cursor: pointer; background: #e3e3e6; color: var(--text); }
.buton.principal { background: var(--blue); color: #fff; font-weight: 700; }
.buton:disabled { opacity: .5; cursor: not-allowed; }
form.editor { display: none; margin-top: 12px; }
form.editor.deschis { display: block; }
form.editor label { display: block; margin: 8px 0; font-size: 14px; color: var(--muted); }
form.editor input, form.editor textarea { width: 100%; font: inherit; padding: 8px; border: 1px solid #ccc; border-radius: 6px; margin-top: 4px; color: var(--text); }
.bara { position: fixed; left: 0; right: 0; bottom: 0; background: #fff; border-top: 1px solid #ddd; padding: 12px 16px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
#mesaj { flex: 1 1 260px; margin: 0; white-space: pre-wrap; }
