/* Liseuse Dove AI Company : couleurs de Telegram, avec un rappel discret du teintier (onglets de teinte). */
:root {
  --fond: var(--tg-theme-bg-color, #f7f9f9);
  --texte: var(--tg-theme-text-color, #1d2a30);
  --doux: var(--tg-theme-hint-color, #66767d);
  --carte: var(--tg-theme-secondary-bg-color, #eef2f3);
  --lien: var(--tg-theme-link-color, #2f6f8f);
  --bouton: var(--tg-theme-button-color, #2f6f8f);
  --bouton-texte: var(--tg-theme-button-text-color, #ffffff);
  --teinte-relire: #e2c99a;   /* A3 : à relire */
  --teinte-fini: #d4e0d6;     /* B1 : terminé */
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--fond); color: var(--texte);
  font: 16px/1.55 -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  padding: 16px 16px calc(24px + env(safe-area-inset-bottom)); }
h1 { font-size: 1.45rem; line-height: 1.2; margin: 0 0 4px; letter-spacing: -0.01em; }
h2 { font-size: 1.1rem; margin: 1.4em 0 .4em; }
.sous { color: var(--doux); margin: 0 0 16px; font-size: .92rem; }
.tete { margin-bottom: 8px; }

.docs { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.docs button { all: unset; box-sizing: border-box; display: grid; grid-template-columns: 54px 1fr; width: 100%;
  background: var(--carte); border-radius: 14px; overflow: hidden; cursor: pointer; }
.docs button:focus-visible { outline: 2px solid var(--lien); outline-offset: 2px; }
.onglet { display: grid; place-items: center; font-weight: 700; font-size: .78rem; color: #2a2a22;
  border-radius: 0 0 22px 22px; margin: 0 8px 10px; padding: 12px 0 14px; writing-mode: vertical-rl;
  transform: rotate(180deg); letter-spacing: .04em; }
.onglet.relire { background: var(--teinte-relire); }
.onglet.fini { background: var(--teinte-fini); }
.infos { padding: 12px 14px 12px 4px; min-width: 0; }
.infos strong { display: block; font-size: 1rem; line-height: 1.3; }
.infos .etat { font-size: .8rem; color: var(--doux); }
.infos .resume { margin: 6px 0 0; font-size: .88rem; color: var(--texte); opacity: .85;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vide { color: var(--doux); padding: 24px 4px; }

.tete-doc { border-bottom: 3px solid var(--teinte-relire); padding-bottom: 12px; margin-bottom: 8px; }
.ident { color: var(--lien); font-weight: 700; font-size: .85rem; margin: 0 0 2px; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
button.action, .actions button { border: 0; border-radius: 10px; padding: 10px 14px; font: inherit; font-size: .9rem;
  background: var(--bouton); color: var(--bouton-texte); cursor: pointer; }
.decision { background: var(--carte); border-radius: 14px; padding: 4px 14px 14px; margin: 12px 0; border-left: 0; }
.decision h2 { margin-top: 12px; }
.actions button.secondaire { background: transparent; color: var(--lien); box-shadow: inset 0 0 0 1.5px var(--lien); }
.decision label { display: block; font-size: .88rem; margin: 12px 0 4px; }
.decision textarea { width: 100%; font: inherit; font-size: .95rem; padding: 10px; border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--doux) 50%, transparent); background: var(--fond); color: var(--texte); }
.decision textarea:focus-visible { outline: 2px solid var(--lien); }
#d-envoyer { margin-top: 8px; border: 0; border-radius: 10px; padding: 10px 14px; font: inherit; font-size: .9rem;
  background: var(--bouton); color: var(--bouton-texte); }
.erreur { color: #b3261e; font-size: .88rem; margin: 6px 0 0; }
.etat-decision { font-weight: 600; margin: 10px 0 0; }
.onglet.decider { background: #f0b27a; }
.pieces ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.pieces li { background: var(--carte); border-radius: 10px; padding: 10px 12px; }
.pieces img, .pieces video { display: block; max-width: 100%; border-radius: 8px; margin-bottom: 8px; }
.pieces audio { width: 100%; margin-bottom: 8px; }
.pieces .nom { font-size: .88rem; word-break: break-all; margin-bottom: 6px; }

.corps { overflow-wrap: anywhere; }
.corps h2.section { color: var(--lien); }
.corps table { border-collapse: collapse; display: block; overflow-x: auto; font-size: .88rem; margin: 10px 0; }
.corps th, .corps td { border: 1px solid color-mix(in srgb, var(--doux) 40%, transparent); padding: 6px 8px; text-align: left; vertical-align: top; }
.corps th { background: var(--carte); }
.corps pre { background: var(--carte); padding: 10px; border-radius: 8px; overflow-x: auto; font-size: .85rem; }
.corps blockquote { margin: 8px 0; padding-left: 12px; border-left: 3px solid var(--teinte-relire); color: var(--doux); }
.corps a { color: var(--lien); }
.corps img { max-width: 100%; }

.message { position: sticky; bottom: 12px; margin: 16px 0 0; padding: 10px 14px; border-radius: 10px;
  background: var(--texte); color: var(--fond); font-size: .9rem; }
@media (prefers-reduced-motion: no-preference) { .docs button { transition: transform .12s ease; } .docs button:active { transform: scale(.985); } }
[hidden] { display: none !important; }