/* Volet « Rapport » (panneau 5) — édition markdown + rendu instantané.
   Entièrement stylé via les tokens de thème de l'app (--bg --panel --panel2 --input
   --line --txt --txt2 --mut --acc --on-acc --focus --ok/--bad/--warn --shadow
   --overlay) : aucune couleur en dur (règle n°3). Miroir de scan.css/collection.css.
   Z-index : volet 3000, plein écran 3300, menu ⋮ / pop-over « Ouvrir » 3060, modal
   de clause 3950 (sous le dialogue confirm/prompt 4100). */

/* ---- bouton bascule (header) ---- */
#rp-toggle{
  position:static;z-index:3000;
  background:var(--acc);color:var(--on-acc);border:none;border-radius:24px;
  padding:11px 16px;font:700 14px/1 system-ui,Segoe UI,Roboto,sans-serif;
  cursor:pointer;box-shadow:0 6px 20px var(--shadow);display:inline-flex;gap:7px;align-items:center;
}
#rp-toggle:hover{filter:brightness(1.08)}
#rp-toggle .rp-tg-nm{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---- volet coulissant (depuis la droite) ---- */
/* Plus large que les autres volets : deux colonnes (éditeur + rendu) y cohabitent. */
#rp-panel{
  position:fixed;top:0;right:0;height:100vh;width:min(1080px,100vw);z-index:3000;
  background:var(--panel);border-left:1px solid var(--line);color:var(--txt);
  display:flex;flex-direction:column;transform:translateX(102%);
  transition:transform .22s ease;box-shadow:-8px 0 32px var(--shadow);
  font:14px/1.5 system-ui,Segoe UI,Roboto,sans-serif;
}
#rp-panel.open{transform:translateX(0)}
#rp-panel.full{width:100vw;z-index:3300}

/* ---- en-tête ---- */
.rp-head{padding:10px 14px;border-bottom:1px solid var(--line);flex:0 0 auto;display:flex;flex-direction:column;gap:8px;position:relative}
.rp-headtop{display:flex;gap:8px;align-items:center}
#rp-name{
  flex:1;min-width:0;background:var(--input);color:var(--txt);border:1px solid var(--line);
  border-radius:8px;padding:7px 10px;font:600 14px/1.2 inherit;
}
#rp-name:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--focus)}
.rp-hbtn{background:none;border:none;color:var(--mut);cursor:pointer;line-height:1;padding:0 5px;font-size:18px}
.rp-hbtn:hover{color:var(--txt)}
#rp-close{font-size:24px}
/* L'état « non enregistré » est porté par le badge PARTAGÉ `.mds-badge`
   (docstate.css), pas par un signal propre à ce volet : un seul signal dans toute
   l'app, appris une fois. */
.rp-headrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.rp-scope-lbl{font-size:12px;color:var(--mut);text-transform:uppercase;letter-spacing:.04em}
#rp-scope-kind,#rp-scope-ref{
  background:var(--input);color:var(--txt);border:1px solid var(--line);border-radius:8px;
  padding:5px 8px;font:13px/1.2 inherit;max-width:260px;
}
#rp-scope-ref[hidden]{display:none}
.rp-modes{margin-left:auto;display:inline-flex;gap:4px}
.rp-mbtn{
  background:var(--input);color:var(--mut);border:1px solid var(--line);border-radius:7px;
  padding:4px 9px;cursor:pointer;font-size:14px;line-height:1;
}
.rp-mbtn.on{background:var(--acc);color:var(--on-acc);border-color:var(--acc)}
.rp-status{color:var(--acc);font-size:12px;min-height:15px}

/* ---- menu ⋮ ---- */
.rp-menu{
  position:absolute;top:52px;right:12px;z-index:3060;background:var(--panel2);
  border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px var(--shadow);
  min-width:220px;overflow:hidden;
}
.rp-menu[hidden]{display:none}
.rp-menu-list{display:flex;flex-direction:column;padding:5px}
.rp-menu-item{
  display:flex;gap:10px;align-items:center;background:none;border:none;color:var(--txt);
  padding:9px 11px;border-radius:8px;cursor:pointer;font:14px/1.2 inherit;text-align:left;
}
.rp-menu-item:hover{background:var(--input)}
.rp-menu-item.prim{color:var(--acc);font-weight:600}
.rp-menu-item.rp-menu-danger{color:var(--bad)}
.rp-menu-ic{width:18px;text-align:center;flex:0 0 auto}

/* ---- corps : éditeur | rendu ---- */
.rp-body{flex:1 1 auto;min-height:0;display:flex;gap:0}
.rp-editcol{flex:1 1 50%;min-width:0;display:flex;flex-direction:column;border-right:1px solid var(--line)}
.rp-previewcol{flex:1 1 50%;min-width:0;overflow-y:auto;background:var(--bg)}
#rp-panel.rp-mode-edit .rp-previewcol{display:none}
#rp-panel.rp-mode-edit .rp-editcol{flex:1 1 100%;border-right:none}
#rp-panel.rp-mode-preview .rp-editcol{display:none}
#rp-panel.rp-mode-preview .rp-previewcol{flex:1 1 100%}

.rp-tools{display:flex;gap:6px;padding:8px 10px;border-bottom:1px solid var(--line);flex-wrap:wrap;flex:0 0 auto}
.rp-tool{
  background:var(--input);color:var(--txt);border:1px solid var(--line);border-radius:8px;
  padding:5px 10px;cursor:pointer;font:13px/1.2 inherit;display:inline-flex;gap:5px;align-items:center;
}
.rp-tool:hover{border-color:var(--acc)}
.rp-tool.prim{background:var(--acc);color:var(--on-acc);border-color:var(--acc)}
#rp-editor{
  flex:1 1 auto;min-height:0;width:100%;box-sizing:border-box;resize:none;
  background:var(--input);color:var(--txt);border:none;padding:12px 14px;
  font:13px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;
}
#rp-editor:focus{outline:none}

/* ---- rendu ---- */
.rp-preview{padding:16px 20px 48px}
.rp-empty{color:var(--mut);font-style:italic;padding:24px 4px}
.rp-md-h{line-height:1.25;margin:1.3em 0 .5em}
.rp-preview h1.rp-md-h{font-size:24px;border-bottom:1px solid var(--line);padding-bottom:6px}
.rp-preview h2.rp-md-h{font-size:20px;color:var(--acc)}
.rp-preview h3.rp-md-h{font-size:17px}
.rp-md-p{margin:.7em 0}
.rp-md-list{margin:.6em 0;padding-left:1.4em}
.rp-md-quote{border-left:3px solid var(--line);margin:.8em 0;padding:2px 0 2px 12px;color:var(--txt2)}
.rp-md-hr{border:none;border-top:1px solid var(--line);margin:1.4em 0}
.rp-md-img{max-width:100%;border-radius:8px}
.rp-preview code{background:var(--input);border-radius:4px;padding:1px 5px;font:12px/1.4 ui-monospace,Consolas,monospace}
.rp-code{background:var(--input);border:1px solid var(--line);border-radius:8px;padding:10px 12px;overflow-x:auto}
.rp-md-table{border-collapse:collapse;margin:.9em 0;font-size:13px}
.rp-md-table th,.rp-md-table td{border:1px solid var(--line);padding:4px 9px;text-align:left}
.rp-md-table th{background:var(--panel2)}

/* ---- clause de portée ---- */
.rp-scopechip{
  display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0;
  background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:5px 10px;font-size:12px;
}
.rp-scopechip.rp-missing{border-color:var(--warn)}
.rp-sc-lbl{color:var(--mut);text-transform:uppercase;letter-spacing:.04em}
.rp-sc-val{font-weight:700}
.rp-sc-warn{color:var(--warn)}

/* ---- clause de cartes ---- */
.rp-cards{margin:14px 0;border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--panel)}
.rp-cards.rp-bad{border-color:var(--bad)}
.rp-cards-hd{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--mut);margin-bottom:8px}
.rp-cards-title{font-size:15px;font-weight:700;color:var(--txt)}
.rp-cards-q{background:var(--input);border-radius:4px;padding:2px 6px;font:12px/1.4 ui-monospace,Consolas,monospace;color:var(--txt2)}
.rp-cards-scope{color:var(--acc)}
.rp-cards-n{margin-left:auto}
.rp-blk-msg{color:var(--mut);font-style:italic;padding:6px 2px}
.rp-names{margin:2px 0;color:var(--txt2)}

/* Grille de cartes : la LARGEUR de colonne porte la « forme de sortie »
   (large / medium / small) — même balisage, un seul paramètre CSS change. */
.rp-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.rp-view-large .rp-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.rp-view-small .rp-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:7px}
.rp-card{margin:0;cursor:pointer}
.rp-card img{width:100%;display:block;border-radius:8px;background:var(--input)}
.rp-card:hover img{outline:2px solid var(--acc)}
.rp-noimg{width:100%;aspect-ratio:63/88;border-radius:8px;background:var(--input);border:1px dashed var(--line)}
.rp-card-nm{font-size:11px;text-align:center;margin-top:3px;color:var(--txt2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-view-small .rp-card-nm{display:none}

/* ---- modes de visualisation du rendu (touche V) ----
   `simple` (défaut) = le DOCUMENT seul : la mécanique du filtre disparaît. Une
   pastille de portée n'a aucun sens dans un document rendu — elle est MASQUÉE, pas
   seulement discrète. `debug` = tout est montré (expression, portée, compteur,
   encadré du bloc), pour mettre au point ses clauses.
   Bascule 100 % CSS : le HTML est identique dans les deux modes. */
.rp-render-simple .rp-scopechip{display:none}
.rp-render-simple .rp-cards{border:none;background:none;padding:0}
.rp-render-simple .rp-cards-q,
.rp-render-simple .rp-cards-scope,
.rp-render-simple .rp-cards-n{display:none}
/* Bloc SANS titre → son en-tête ne contenait que de la mécanique : on la retire
   entièrement (sinon sa marge laisserait un trou). */
.rp-render-simple .rp-cards:not(.rp-has-title) .rp-cards-hd{display:none}
.rp-dbgbtn{font-size:13px}

.rp-table{width:100%;border-collapse:collapse;font-size:13px}
.rp-table th,.rp-table td{border-bottom:1px solid var(--line);padding:4px 8px;text-align:left}
.rp-table th{color:var(--mut);font-weight:600;text-transform:uppercase;font-size:11px;letter-spacing:.04em}
.rp-table tr.rp-row{cursor:pointer}
.rp-table tr.rp-row:hover td{background:var(--input)}

.rp-spin{
  display:inline-block;width:12px;height:12px;border:2px solid var(--line);
  border-top-color:var(--acc);border-radius:50%;animation:rp-spin .8s linear infinite;vertical-align:-2px;
}
@keyframes rp-spin{to{transform:rotate(360deg)}}

/* ---- pop-over « Ouvrir » ---- */
.rp-loadlist{
  position:absolute;top:96px;right:14px;z-index:3060;width:320px;max-height:60vh;overflow-y:auto;
  background:var(--panel2);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px var(--shadow);
}
.rp-loadlist[hidden]{display:none}
.rp-ll-hd{padding:9px 12px;border-bottom:1px solid var(--line);font-weight:700;font-size:13px}
.rp-ll-row{display:flex;align-items:stretch;border-bottom:1px solid var(--line)}
.rp-ll-open{flex:1;min-width:0;background:none;border:none;color:var(--txt);text-align:left;padding:8px 12px;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.rp-ll-open:hover{background:var(--input)}
.rp-ll-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-ll-meta{font-size:11px;color:var(--mut)}
.rp-ll-del{background:none;border:none;color:var(--mut);cursor:pointer;padding:0 11px;font-size:14px}
.rp-ll-del:hover{color:var(--bad)}
.rp-loadlist .rp-empty{padding:14px 12px;font-size:13px}
/* Analyses de référence : mêmes rangées que « Ouvrir », mais un résumé multi-ligne
   (nombre de chapitres + rôles couverts) — pas de troncature sur une seule ligne. */
.rp-refs{width:360px}
.rp-refs .rp-ll-meta{white-space:normal;line-height:1.35}

/* ---- modal de construction de clause ---- */
.rp-modal-overlay{
  position:fixed;inset:0;z-index:3950;background:var(--overlay);
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.rp-modal{
  background:var(--panel);border:1px solid var(--line);border-radius:12px;
  box-shadow:0 18px 50px var(--shadow);width:min(560px,100%);max-height:86vh;
  display:flex;flex-direction:column;color:var(--txt);
}
.rp-modal-hd{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);font-weight:700}
.rp-modal-x{margin-left:auto;background:none;border:none;color:var(--mut);font-size:22px;line-height:1;cursor:pointer}
.rp-modal-x:hover{color:var(--txt)}
.rp-modal-bd{padding:14px 16px;overflow-y:auto;display:flex;flex-direction:column;gap:10px}
.rp-modal-ft{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}
.rp-f{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--mut);flex:1;min-width:120px}
/* PIÈGE : `display:flex` (style AUTEUR) l'emporte sur le `[hidden]{display:none}` du
   navigateur (style UA). Sans cette règle, le sélecteur de deck/classeur restait
   AFFICHÉ et VIDE quand la portée est « toutes les cartes » — il paraissait cassé. */
.rp-f[hidden]{display:none}
.rp-f > input,.rp-f > select,.rp-f > textarea{
  background:var(--input);color:var(--txt);border:1px solid var(--line);border-radius:8px;
  padding:7px 9px;font:13px/1.4 inherit;width:100%;box-sizing:border-box;
}
.rp-f > textarea{font-family:ui-monospace,Consolas,monospace;resize:vertical}
.rp-f > input:focus,.rp-f > select:focus,.rp-f > textarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px var(--focus)}
.rp-f-row{display:flex;gap:10px;flex-wrap:wrap}
.rp-f-hint{font-size:11px;color:var(--mut);margin-top:-4px}
.rp-btn-ghost{background:var(--input);color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:7px 14px;cursor:pointer;font:13px/1.2 inherit}
.rp-btn-ghost:hover{border-color:var(--acc)}
.rp-btn-prim{background:var(--acc);color:var(--on-acc);border:1px solid var(--acc);border-radius:8px;padding:7px 16px;cursor:pointer;font:600 13px/1.2 inherit}
.rp-btn-prim:hover{filter:brightness(1.08)}

/* ---- étroit : les deux colonnes s'empilent ---- */
@media (max-width:820px){
  .rp-body{flex-direction:column}
  .rp-editcol{border-right:none;border-bottom:1px solid var(--line);flex:1 1 45%}
  .rp-previewcol{flex:1 1 55%}
}
