/* ===== Traitement de texte façon Word — liquid + ===== */

.app { height: 100vh; display: flex; flex-direction: column; overflow: hidden; }

/* Les deux bandes de l'éditeur peuvent être repliées indépendamment. Le
   chevron reste présent dans une petite poignée afin de pouvoir les rouvrir. */
.topbar-wrap, .ribbon-wrap { position: relative; flex: none; }
.topbar-wrap.is-collapsed, .ribbon-wrap.is-collapsed { height: 20px; }
.topbar-wrap.is-collapsed .topbar, .ribbon-wrap.is-collapsed .ribbon { display: none; }
.chrome-toggle {
  position: absolute; z-index: 5; top: 50%; right: 10px; transform: translateY(-50%);
  width: 30px; height: 20px; padding: 0; border: 0; border-radius: 6px;
  background: transparent; color: #08090c; cursor: pointer; font: 700 17px/20px Arial, sans-serif;
  transition: color .12s ease, background .12s ease;
}
.chrome-toggle:hover { background: transparent; }
.topbar-wrap:not(.is-collapsed) .chrome-toggle--topbar { color: #08090c; }
:root[data-theme="dark"] .topbar-wrap .chrome-toggle--topbar { color: #fff; }
.topbar-wrap.is-collapsed .chrome-toggle--topbar { color: #08090c; }
.ribbon-wrap .chrome-toggle--ribbon { color: #08090c; }

/* ---------- Top bar ---------- */
/* Padding symetrique : le hamburger de droite garde le meme ecart au bord que
   le contenu de gauche. Seul l'editeur reserve plus d'espace a droite pour la
   fleche de repli (.chrome-toggle), via .topbar-wrap ci-dessous. */
.topbar { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 20px; height: 56px; padding: 0 20px; background: #0a0a0a; border-bottom: 1px solid #222; }
.topbar-wrap .topbar { padding-right: 54px; }
.topbar__left { display: flex; align-items: center; gap: 16px; min-width: 0; }
.topbar .brand { font-size: 18px; color: #fff; display: flex; align-items: center; gap: 0; }
.topbar .brand__plus { color: #fff; }
.topbar .brand__logo { display: block; flex: none; }
.topbar__doc { font-family: 'Archivo', sans-serif; font-size: 13px; font-weight: 500; color: #fff; padding-left: 16px; border-left: 1px solid #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar__actions { display: flex; gap: 8px; align-items: center; flex: none; }
.ai-access-toggle { display:inline-flex; align-items:center; gap:7px; height:34px; padding:0 11px; border:1px solid #52525b; border-radius:8px; background:transparent; color:#e4e4e7; font:600 12px 'Archivo',sans-serif; cursor:pointer; white-space:nowrap; }
.ai-access-toggle:hover { border-color:#a1a1aa; background:#18181b; }
.ai-access-toggle__dot { width:8px; height:8px; border-radius:50%; background:#71717a; box-shadow:0 0 0 3px rgba(113,113,122,.16); }
.ai-access-toggle.is-on { color:#fff; border-color:#16a34a; background:#15803d; }
.ai-access-toggle.is-on:hover { background:#166534; }
.ai-access-toggle.is-on .ai-access-toggle__dot { background:#bbf7d0; box-shadow:0 0 0 3px rgba(187,247,208,.2); }
:root[data-theme="paper"] .topbar .ai-access-toggle { color:#52525b; border-color:#d4d4d8; background:#fff; }
:root[data-theme="paper"] .topbar .ai-access-toggle:hover { border-color:#a1a1aa; background:#f4f4f5; }
:root[data-theme="paper"] .topbar .ai-access-toggle.is-on { color:#fff; border-color:#16a34a; background:#15803d; }
.app.ai-disabled #analyze-btn,
.app.ai-disabled [data-aimax-toggle],
.app.ai-disabled #chat-explain,
.app.ai-disabled #chat-attach,
.app.ai-disabled #chat-input,
.app.ai-disabled #chat-send,
.app.ai-disabled #selx-btn,
.app.ai-disabled .advitem__apply,
.app.ai-disabled #autofill-btn { opacity:.42; pointer-events:none; }
.topbar .btn { padding: 8px 14px; font-size: 13px; color: #fff; border-color: #444; }
.topbar .btn:hover { border-color: #888; background: #1a1a1a; }
.topbar .btn--primary { background: #fff; border-color: #fff; color: #0a0a0a; }
.topbar .btn--primary:hover { background: #e5e5e5; border-color: #e5e5e5; }
.topbar .btn--white { background: #fff; border-color: #444; color: #0a0a0a; }
.topbar .btn--white:hover { background: #e5e5e5; border-color: #888; }

/* Menu Exporter : un seul bouton, choix PDF ou Word */
.export-menu { position: relative; display: inline-flex; }
.export-menu__toggle::after { content: ''; display: inline-block; margin-left: 8px; vertical-align: middle; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; transition: transform .15s ease; }
.export-menu.open .export-menu__toggle::after { transform: rotate(180deg); }
.export-menu__list { position: absolute; top: calc(100% + 6px); right: 0; z-index: 60; min-width: 170px; display: flex; flex-direction: column; gap: 2px; padding: 6px; background: #0f0f0f; border: 1px solid #333; border-radius: 10px; box-shadow: 0 12px 32px rgba(0, 0, 0, .5); }
.export-menu__list[hidden] { display: none; }
.export-menu__item { display: block; width: 100%; text-align: left; padding: 9px 12px; font: inherit; font-size: 13px; color: #fff; background: transparent; border: 0; border-radius: 7px; cursor: pointer; }
.export-menu__item:hover { background: #1e1e1e; }
.export-menu__item:disabled { opacity: .5; cursor: default; }
.export-menu__sep { height: 1px; margin: 5px 4px; background: rgba(255,255,255,0.18); }

/* ---------- Ribbon (barre d'outils) ---------- */
.ribbon { flex: none; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 8px 54px 8px 16px; background: var(--card); border-bottom: 1px solid var(--line); }
.tgroup { display: flex; align-items: center; gap: 3px; }
.tdiv { width: 1px; height: 22px; background: var(--line); margin: 0 6px; }

.tbtn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 32px; height: 32px; padding: 0 7px; border: 1px solid transparent; border-radius: 7px;
  background: transparent; cursor: pointer; color: var(--text);
  font-family: 'Libre Franklin', serif; font-size: 15px; line-height: 1; transition: background .12s ease, border-color .12s ease;
}
.tbtn:hover { background: #f0eee9; }
.tbtn.is-active { background: #e7e4de; border-color: #cfcbc2; color: var(--dark); }
.tbtn--text { width: auto; gap: 4px; padding: 0 12px; font-size: 12.5px; font-weight: 700; color: var(--blue); border-color: var(--line); }
.tbtn--text:hover { background: #eef4ff; }
.tbtn b { font-weight: 800; }
.tbtn i { font-style: italic; font-family: Georgia, serif; }
.tbtn u { text-decoration: underline; }
.tbtn s { text-decoration: line-through; }
.tbtn__icon { width: 18px; height: 18px; display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }

.tsel {
  height: 32px; border: 1px solid var(--line); border-radius: 7px; background: var(--card);
  font-family: 'Archivo', sans-serif; font-size: 13px; color: var(--text); padding: 0 28px 0 10px; cursor: pointer;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5L5 6.5L8 3.5' stroke='%236b6b78' stroke-width='1.4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 9px center;
}
.tsel:hover { border-color: #c9c6bf; }
.tsel--style { width: 130px; }
.tsel--font  { width: 150px; }
.tsel--size  { width: 64px; padding-right: 24px; }

.tcolor { position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 7px; cursor: pointer; }
.tcolor:hover { background: #f0eee9; }
.tcolor span { font-size: 14px; line-height: 1; pointer-events: none; }
.tcolor .bar { width: 18px; height: 3px; border-radius: 2px; margin-top: 2px; }
.tcolor input[type=color] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

/* ---------- Workspace ---------- */
.workspace { flex: 1; display: grid; grid-template-columns: var(--lib-w, 290px) 10px minmax(0, 1fr) 10px var(--panel-w, 400px); min-height: 0; }
/* Les comptes avocats voient uniquement le document : les panneaux
   d'assistance de gauche et de droite sont masqués. */
.app.is-lawyer .workspace { grid-template-columns: var(--lib-w, 320px) 10px minmax(0, 1fr); }
.app.is-lawyer .library,
.app.is-lawyer #gutter-right,
.app.is-lawyer .panel,
.app.is-lawyer #analyze-btn,
.app.is-lawyer #selx-btn,
.app.is-lawyer #selx-pop { display: none !important; }
/* Chaque zone est épinglée à SA colonne : sans cela, masquer la bibliothèque
   (repli à gauche, display:none) décalait tous les enfants d'une colonne —
   le document tombait dans la piste de 6px et la poignée droite s'étalait
   sur 1fr (le « grand carré bleu » plein écran). */
.library       { grid-row: 1; grid-column: 1; }
#gutter-left   { grid-row: 1; grid-column: 2; }
.editor-canvas { grid-row: 1; grid-column: 3; }
#gutter-right  { grid-row: 1; grid-column: 4; }
.panel         { grid-row: 1; grid-column: 5; }
.lawyer-work   { display: none; }
.app.is-lawyer .lawyer-work { display: flex; grid-row: 1; grid-column: 1; min-width: 0; min-height: 0; flex-direction: column; overflow: hidden; border-right: 1px solid var(--line); background: var(--bg-2); }
.app.is-lawyer #gutter-left { grid-row: 1; grid-column: 2; }
.app.is-lawyer .editor-canvas { grid-row: 1; grid-column: 3; }

.lawyer-work__head { padding: 20px 18px 16px; border-bottom: 1px solid var(--line); }
.lawyer-work__eyebrow { font: 700 10px/1.2 'Archivo', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--text-3); }
.lawyer-work__title { margin-top: 6px; font-size: 19px; line-height: 1.2; }
.lawyer-work__sub { margin-top: 7px; font-size: 12px; line-height: 1.45; color: var(--text-2); }
.lawyer-work__body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px; }
.lawyer-work__empty { padding: 30px 10px; text-align: center; color: var(--text-3); font-size: 13px; line-height: 1.5; }
.lawyer-client { padding: 5px 2px 13px; }
.lawyer-client + .lawyer-client { padding-top: 16px; border-top: 1px solid var(--line); }
.lawyer-client__name { font: 700 13px/1.3 'Archivo', sans-serif; color: var(--navy); }
.lawyer-client__meta { margin-top: 2px; font-size: 11px; color: var(--text-3); }
.lawyer-mission { display: block; margin-top: 9px; padding: 12px; color: inherit; text-decoration: none; background: var(--card); border: 1px solid var(--line); border-radius: 11px; transition: border-color .15s, transform .15s; }
.lawyer-mission:hover { border-color: rgba(15,23,42,.35); transform: translateY(-1px); }
.lawyer-mission__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.lawyer-mission__name { font-weight: 700; font-size: 13px; line-height: 1.35; }
.lawyer-mission__status { flex: none; padding: 3px 7px; border-radius: 99px; background: #eef2ff; color: #3730a3; font: 700 9px/1.2 'Archivo', sans-serif; text-transform: uppercase; }
.lawyer-mission__detail { margin-top: 7px; font-size: 11.5px; line-height: 1.45; color: var(--text-2); }
.lawyer-mission__due { margin-top: 8px; font: 600 10.5px/1.3 'Archivo', sans-serif; color: #b45309; }
.lawyer-section { padding: 14px 0; border-bottom: 1px solid var(--line); }
.lawyer-section:first-child { padding-top: 2px; }
.lawyer-section__label { margin-bottom: 7px; font: 700 10px/1.2 'Archivo', sans-serif; letter-spacing: .09em; text-transform: uppercase; color: var(--text-3); }
.lawyer-section__value { font-size: 12.5px; line-height: 1.55; color: var(--text); white-space: pre-wrap; }
.lawyer-doc-link { display: flex; justify-content: space-between; gap: 8px; margin-top: 8px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--navy); background: var(--card); text-decoration: none; font-size: 11.5px; font-weight: 700; }
.lawyer-task { display: flex; gap: 8px; padding: 5px 0; font-size: 12px; line-height: 1.4; }
.lawyer-task::before { content: '□'; color: var(--text-3); }

/* Poignées de redimensionnement (colonnes gauche / droite). La zone de prise
   fait 10 px pour rester facile à attraper, le trait visible reste fin. */
.gutter { position: relative; background: transparent; cursor: col-resize; touch-action: none; outline: none; }
.gutter::before { content: ''; position: absolute; inset-block: 0; left: 50%; width: 1px; transform: translateX(-50%); background: var(--line); transition: background .12s ease, width .12s ease; }
.gutter:hover::before, .gutter.is-drag::before, .gutter:focus-visible::before { background: var(--up); width: 2px; }
.gutter:focus-visible { box-shadow: inset 0 0 0 1px rgba(22,163,74,.45); }

/* Colonnes repliées (glissées sous le seuil) : contenu masqué, poignée conservée pour rouvrir. */
.workspace.is-collapsed-left .library,
.workspace.is-collapsed-right .panel { display: none; }
.gutter.is-collapsed::before { background: var(--up); }

/* ---------- Bibliothèque de clauses (gauche) ---------- */
.library { border-right: 1px solid var(--line); background: var(--bg-2); display: flex; flex-direction: column; min-height: 0; min-width: 0; overflow: hidden; }

/* Onglets Bibliothèque / Conseil */
.lib-tabs { flex: none; display: flex; border-bottom: 1px solid var(--line); }
.lib-tab { flex: 1; font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; color: var(--text-3); background: var(--bg-2); border: 0; border-bottom: 2px solid transparent; padding: 11px 4px; cursor: pointer; transition: color .15s ease, border-color .15s ease, background .15s ease; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lib-tab:hover { color: var(--text); }
.lib-tab.is-active { color: var(--navy); border-bottom-color: var(--navy); background: var(--bg); }
.lib-view { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.lib-view[hidden] { display: none; }

/* Fiches « Conseil » : points à négocier par priorité */
.advitem { background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--line); border-radius: 12px; padding: 14px; }
.advitem__top { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.advitem__rank { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--navy); color: #fff; font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 800; flex: none; }
.advitem__pri { font-family: 'Archivo', sans-serif; font-size: 10px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.advitem__group { margin-left: auto; font-family: 'Archivo', sans-serif; font-size: 9.5px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-3); }
.advitem__label { font-weight: 700; font-size: 14px; letter-spacing: -0.01em; margin-bottom: 6px; }
.advitem__watch { font-size: 12.5px; color: var(--text); line-height: 1.55; margin-bottom: 12px; }
.advitem__go { width: 100%; font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 600; color: var(--dark); background: transparent; border: 1.5px solid var(--dark); border-radius: 8px; padding: 8px; cursor: pointer; transition: background .15s ease, color .15s ease; }
.advitem__go:hover { background: var(--dark); color: #fff; }

/* Bouton « Appliquer le conseil » : laisse l'IA modifier la clause concernée */
.advitem__actions { display: flex; flex-direction: column; gap: 8px; }
.advitem__apply { display: inline-flex; align-items: center; justify-content: center; gap: 7px; width: 100%; font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 700; color: #fff; background: #0f172a; border: none; border-radius: 8px; padding: 9px 10px; cursor: pointer; transition: background .15s ease, opacity .15s ease; }
.advitem__apply:hover { background: #1e293b; }
.advitem__apply:disabled { cursor: default; }
.advitem__apply.is-busy { opacity: 0.7; }
.advitem__apply.is-done { background: #15803d; }
.advitem__apply-ico { color: #ffd27a; font-size: 13px; line-height: 1; }
.advitem__apply.is-done .advitem__apply-ico { color: #fff; }
.advitem__apply.is-busy .advitem__apply-ico { animation: af-spin .8s linear infinite; }
.advitem__result { margin-top: 10px; font-size: 12px; line-height: 1.5; border-radius: 8px; padding: 9px 11px; }
.advitem__result[hidden] { display: none; }
.advitem__result--ok  { background: rgba(21,128,61,0.08); border: 1px solid rgba(21,128,61,0.25); color: #14532d; }
.advitem__result--info { background: #fef3c7; border: 1px solid rgba(217,119,6,0.3); color: #92400e; }
.advitem__result--err { background: rgba(220,38,38,0.07); border: 1px solid rgba(220,38,38,0.3); color: #b91c1c; }
#next-field-wrap { padding: 14px 14px 0; }
.next-ph-btn { display: block; width: 100%; font-family: 'Archivo', sans-serif; font-size: 13px; font-weight: 700; color: #fff; background: var(--dark); border: none; border-radius: 10px; padding: 11px 14px; cursor: pointer; text-align: left; transition: background .15s; }
.next-ph-btn:hover { background: #1a1d24; }
.next-ph-btn__count { font-weight: 500; opacity: 0.55; font-size: 12px; float: right; padding-top: 1px; }
#fill-next-wrap { padding: 12px 14px 0; }
.fill-next-btn { display: flex; align-items: center; justify-content: space-between; width: 100%; font-family: 'Archivo', sans-serif; font-size: 13px; font-weight: 700; color: #15803d; background: rgba(34,197,94,0.20); border: none; border-radius: 10px; padding: 12px 16px; cursor: pointer; transition: background .15s; }
.fill-next-btn:hover { background: rgba(34,197,94,0.28); }
.fill-next-btn__label { flex: 1; text-align: left; }
.fill-next-btn__count { font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 700; background: rgba(255,255,255,0.2); border-radius: 99px; padding: 2px 9px; white-space: nowrap; }
.fill-next--done { font-family: 'Archivo', sans-serif; font-size: 12.5px; font-weight: 600; color: #16a34a; background: rgba(22,163,74,0.1); border-radius: 10px; padding: 11px 16px; text-align: center; }

/* ── Remplissage automatique depuis les documents importés ── */
#autofill-wrap { padding: 12px 14px 0; display: flex; flex-direction: column; gap: 10px; }
#autofill-wrap:empty { display: none; }
.af-btn { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: rgba(34,197,94,0.20); color: #15803d; border: none; border-radius: 10px; padding: 11px 14px; cursor: pointer; transition: background .15s; }
.af-btn:hover { background: rgba(34,197,94,0.28); }
.af-btn__txt { display: flex; flex-direction: column; gap: 1px; }
.af-btn__txt strong { font-family: 'Archivo', sans-serif; font-size: 13px; font-weight: 700; }
.af-btn__txt small { font-size: 11.5px; color: #16a34a; }
.af-box--busy { display: flex; align-items: center; gap: 10px; font-family: 'Archivo', sans-serif; font-size: 12.5px; font-weight: 600; color: var(--text-2, #6b6b78); background: #f6f9ff; border: 1px solid rgba(59,130,246,0.25); border-radius: 10px; padding: 11px 14px; }
.af-spin { width: 14px; height: 14px; flex: none; border: 2px solid rgba(59,130,246,0.25); border-top-color: #3b82f6; border-radius: 50%; animation: af-spin .8s linear infinite; }
@keyframes af-spin { to { transform: rotate(360deg); } }
.af-note { font-size: 12.5px; line-height: 1.45; color: #92400e; background: #fef3c7; border-radius: 10px; padding: 10px 12px; }
.af-box--recap { border: 1px solid rgba(22,163,74,0.3); background: rgba(22,163,74,0.06); border-radius: 10px; padding: 10px 12px; }
.af-recap__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-family: 'Archivo', sans-serif; font-size: 12.5px; font-weight: 700; color: #15803d; margin-bottom: 6px; }
.af-undo { border: 1px solid rgba(8,9,12,0.15); background: #fff; border-radius: 8px; font-size: 11.5px; font-weight: 600; color: var(--text-2, #6b6b78); padding: 3px 10px; cursor: pointer; }
.af-undo:hover { color: #b91c1c; border-color: rgba(185,28,28,0.4); }
.af-recap__row { padding: 6px 0; border-top: 1px solid rgba(8,9,12,0.07); }
.af-recap__field { font-size: 11px; color: var(--text-3, #a8a8b3); }
.af-recap__val { font-size: 12.5px; font-weight: 600; color: var(--text, #08090c); }
.af-recap__src { font-size: 11px; color: #15803d; }
/* Valeur fraîchement insérée dans le document : surlignage qui s'estompe. */
.page .af-flash { animation: af-flash 3s ease forwards; border-radius: 3px; }
@keyframes af-flash { 0% { background: #bbf7d0; } 70% { background: #bbf7d0; } 100% { background: transparent; } }
.library__head { flex: none; padding: 18px 20px 14px; border-bottom: 1px solid var(--line); }
.library__eyebrow { font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-3); }
.library__title { font-size: 18px; letter-spacing: -0.02em; margin-top: 6px; }
.library__sub { font-family: 'Archivo', sans-serif; font-size: 12px; color: var(--text); margin-top: 4px; }
.library__list {
  flex: 1;
  overflow-y: auto;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  direction: rtl;
}
.library__list > * { direction: ltr; }
.library__empty { font-size: 13px; color: var(--text-3); text-align: center; padding: 30px 16px; line-height: 1.6; }

.libitem { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 14px; }
.libitem__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 9px; }
.libitem__group { font-family: 'Archivo', sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--text-3); }
.libitem__label { font-weight: 700; font-size: 14px; letter-spacing: -0.01em; margin-bottom: 5px; }
.libitem__desc { font-size: 12.5px; color: var(--text); line-height: 1.55; margin-bottom: 12px; }
.libitem__add { width: 100%; font-family: 'Archivo', sans-serif; font-size: 12.5px; font-weight: 600; color: #fff; background: var(--dark); border: 0; border-radius: 8px; padding: 9px; cursor: pointer; transition: background .15s ease; }
.libitem__add:hover { background: var(--dark-muted); }
.libitem__add--see { background: transparent; color: var(--dark); border: 1.5px solid var(--dark); }
.libitem__add--see:hover { background: var(--dark); color: #fff; }
.lib-sep { font-family: 'Archivo', sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-3); padding: 14px 0 8px; border-bottom: 1px solid var(--line); margin-bottom: 10px; }
.libitem .risk { font-size: 9px; padding: 4px 8px; }

/* Saisie directe des champs dans « À remplir » */
.fill-row { display: flex; gap: 6px; margin-top: 10px; }
.fill-row__input { flex: 1; min-width: 0; font-family: 'Archivo', sans-serif; font-size: 12.5px; color: var(--dark); background: #fff; border: 1.5px solid var(--line); border-radius: 8px; padding: 8px 10px; transition: border-color .15s ease; }
.fill-row__input::placeholder { color: var(--text-3); }
.fill-row__input:focus { outline: none; border-color: var(--dark); }
.fill-row__ok { flex: none; font-family: 'Archivo', sans-serif; font-size: 12.5px; font-weight: 600; color: #fff; background: var(--dark); border: 0; border-radius: 8px; padding: 0 14px; cursor: pointer; transition: background .15s ease; }
.fill-row__ok:hover { background: var(--dark-muted); }
.fill-see { flex: none; font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 600; color: var(--text-3); background: none; border: 0; padding: 0; cursor: pointer; white-space: nowrap; transition: color .15s ease; }
.fill-see:hover { color: var(--dark); text-decoration: underline; }

/* Action « Retirer » dans le décrypteur */
.clause-remove { font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 600; color: #dc2626; background: rgba(220,38,38,0.06); border: 1px solid rgba(220,38,38,0.2); border-radius: 8px; padding: 7px 11px; cursor: pointer; transition: background .15s ease; }
.clause-remove:hover { background: rgba(220,38,38,0.12); }
.clause-essential { font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 600; color: var(--text-3); }

/* Canevas gris + page blanche */
.editor-canvas { overflow-y: auto; background: #e9e7e2; padding: 36px 24px 80px; }
/* Retour en arrière : petit chevron flottant en haut à gauche du canevas.
   Le conteneur collant est de hauteur nulle : il ne décale jamais la page et
   reste épinglé en haut au défilement ; le bouton est positionné à l'intérieur. */
.editor-back-wrap { position: sticky; top: 0; z-index: 6; height: 0; }
.editor-back { position: absolute; top: 8px; left: 4px; width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #000; cursor: pointer; box-shadow: none; opacity: 1; transition: transform .15s ease; }
.editor-back:hover { background: transparent; transform: translateX(-1px); }
.editor-back:focus-visible { outline: 2px solid rgba(0,0,0,0.45); outline-offset: 2px; }
.editor-back svg { width: 18px; height: 18px; display: block; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
/* Informations du document, placées juste au-dessus de la feuille. */
.document-meta {
  width: 820px; max-width: 100%; min-height: 24px; margin: 0 auto 8px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  font-family: 'Archivo', sans-serif; font-size: 11px; color: #6b6b78;
}
.document-meta__saved { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.document-meta__actions { display: flex; align-items: center; gap: 8px; }
.document-meta__placement {
  min-height: 28px; padding: 5px 10px; border: 1px solid rgba(8,9,12,0.14);
  border-radius: 8px; background: #fff; color: #30303a;
  font: 600 11px/1.2 'Archivo', sans-serif; cursor: pointer;
}
.document-meta__placement:hover { border-color: rgba(8,9,12,0.3); background: #f8f8fa; }
.document-meta__placement:focus-visible { outline: 2px solid rgba(59,130,246,.45); outline-offset: 2px; }
.document-meta__placement:disabled { cursor: wait; opacity: .55; }
.document-meta__close {
  flex: none; width: 24px; height: 24px; display: grid; place-items: center;
  padding: 0; border: 0; border-radius: 6px; background: transparent; color: #52525f;
  font: 400 20px/1 Arial, sans-serif; cursor: pointer;
  transition: color .15s ease, background .15s ease;
}
.document-meta__close:hover { color: #08090c; background: rgba(8,9,12,0.08); }
.document-meta__close:focus-visible { outline: 2px solid rgba(8,9,12,0.45); outline-offset: 2px; }
.document-meta__close:disabled { cursor: wait; opacity: .45; }
/* Conteneur paginé : pile de feuilles A4 + zone éditable au-dessus */
.paper { position: relative; width: 820px; max-width: 100%; margin: 0 auto; }

/* Calque des feuilles (dessiné derrière le texte, non cliquable) */
.sheet-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.sheet {
  position: absolute; left: 0; right: 0; background: #fff;
  border: 1px solid rgba(8,9,12,0.07); border-radius: 2px;
  box-shadow: 0 1px 3px rgba(8,9,12,0.08), 0 14px 40px -20px rgba(8,9,12,0.25);
}
.sheet__num {
  position: absolute; left: 0; right: 0; text-align: center;
  font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 600;
  letter-spacing: 0.04em; color: var(--text-3);
}

/* Zone éditable : transparente, posée par-dessus les feuilles */
.page {
  position: relative; z-index: 1;
  width: 100%; max-width: none; min-height: 1160px; margin: 0; background: transparent;
  border: 0; border-radius: 0; box-shadow: none;
  padding: 76px 80px; outline: none;
  font-family: 'Libre Franklin', sans-serif; font-size: 15px; line-height: 1.7; color: var(--text);
}
.page:focus { box-shadow: none; }

/* Styles du contenu */
.page h1.doc-title { text-align: center; font-size: 22px; letter-spacing: 0.04em; margin: 0 0 2px; }
.page .doc-sub { text-align: center; font-weight: 700; letter-spacing: 0.06em; margin: 0 0 20px; }
.page .doc-preamble { font-style: italic; color: var(--text); margin: 0 0 8px; text-align: justify; }
.page p { margin: 0 0 11px; }
.page ol, .page ul { margin: 6px 0 11px; padding-left: 24px; }
.page li { margin-bottom: 5px; }
.page blockquote { margin: 0 0 14px; padding: 8px 16px; border-left: 3px solid var(--blue); color: var(--text); background: #f8fafd; }
.page hr { border: 0; border-top: 1px solid var(--line); margin: 16px 0 22px; }

/* ── État vide : éditeur ouvert sans aucun document ─────────────────────────
   Affiché quand l'éditeur est ouvert « à blanc » (menu → Éditeur). La feuille
   est masquée et l'on propose d'importer un document ou de créer une page
   blanche. ── */
.editor-canvas.is-empty .paper { display: none; }
.editor-canvas.is-empty .document-meta { display: none; }
.editor-empty {
  display: flex; align-items: center; justify-content: center;
  min-height: calc(100vh - 240px); padding: 20px 16px;
}
.editor-empty[hidden] { display: none; }
.editor-empty__card {
  width: 100%; max-width: 460px; text-align: center;
  background: var(--card, #fff); border: 1px solid var(--line, rgba(8,9,12,0.08));
  border-radius: 16px; padding: 40px 32px;
  box-shadow: 0 1px 3px rgba(8,9,12,0.06), 0 18px 50px -28px rgba(8,9,12,0.28);
}
.editor-empty__icon {
  width: 56px; height: 56px; margin: 0 auto 18px; display: grid; place-items: center;
  border-radius: 14px; background: #e7f4ea; color: #66b97f;
}
.editor-empty__icon svg { width: 28px; height: 28px; display: block; }
.editor-empty__title {
  margin: 0 0 8px; font-family: 'Archivo', sans-serif; font-size: 20px;
  font-weight: 700; color: var(--text, #08090c);
}
.editor-empty__sub {
  margin: 0 auto 26px; max-width: 340px; font-size: 14px; line-height: 1.6;
  color: var(--text-2, #6b6b78);
}
.editor-empty__actions { display: flex; flex-direction: column; gap: 10px; }
.editor-empty__btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; box-sizing: border-box; padding: 12px 18px;
  font-family: 'Archivo', sans-serif; font-size: 14px; font-weight: 700;
  border-radius: 11px; cursor: pointer;
  border: 1px solid var(--line, rgba(8,9,12,0.18)); background: var(--card, #fff);
  color: var(--text, #08090c); transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.editor-empty__btn svg { width: 17px; height: 17px; display: block; }
.editor-empty__btn:hover { border-color: #66b97f; color: #66b97f; background: #f3faf5; }
.editor-empty__btn--primary { background: #08090c; border-color: #08090c; color: #fff; }
.editor-empty__btn--primary:hover { background: #1d1f26; border-color: #1d1f26; color: #fff; }

/* Bibliothèque de documents ouverte au premier plan. */
.open-doc-modal { position: fixed; inset: 0; z-index: 1450; display: none; align-items: center; justify-content: center; padding: 24px; }
.open-doc-modal.is-open { display: flex; }
.open-doc-modal__backdrop { position: absolute; inset: 0; background: rgba(8,9,12,.5); backdrop-filter: blur(3px); }
.open-doc-modal__dialog { position: relative; width: min(760px, 100%); max-height: min(82vh, 760px); display: flex; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid rgba(8,9,12,.08); border-radius: 18px; box-shadow: 0 28px 80px rgba(8,9,12,.3); }
.open-doc-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 22px 24px 18px; border-bottom: 1px solid rgba(8,9,12,.08); }
.open-doc-modal__title { margin: 0; font: 700 19px/1.25 'Archivo', sans-serif; color: #08090c; }
.open-doc-modal__sub { margin: 5px 0 0; font-size: 13px; color: #6b6b78; }
.open-doc-modal__close { flex: none; width: 32px; height: 32px; display: grid; place-items: center; border: 0; border-radius: 9px; background: transparent; color: #6b6b78; font-size: 22px; cursor: pointer; }
.open-doc-modal__close:hover { background: #f4f2ee; color: #08090c; }
.open-doc-modal__search { position: relative; margin: 18px 24px 0; }
.open-doc-modal__search svg { position: absolute; top: 50%; left: 13px; width: 17px; height: 17px; transform: translateY(-50%); fill: none; stroke: #8d8d98; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; }
.open-doc-modal__search input { width: 100%; box-sizing: border-box; padding: 11px 14px 11px 40px; border: 1px solid rgba(8,9,12,.16); border-radius: 11px; background: #fff; color: #08090c; font: 500 14px/1.2 'Libre Franklin', sans-serif; outline: none; }
.open-doc-modal__search input:focus { border-color: #66b97f; box-shadow: 0 0 0 3px rgba(102,185,127,.12); }
.open-doc-modal__body { min-height: 180px; padding: 20px 24px 24px; overflow-y: auto; }
.open-doc-modal__state { padding: 54px 20px; text-align: center; color: #777783; font-size: 14px; line-height: 1.5; }
.open-doc-modal__state--error { color: #b91c1c; }
.open-doc-group + .open-doc-group { margin-top: 24px; }
.open-doc-group__head { display: flex; align-items: baseline; gap: 9px; padding-bottom: 9px; border-bottom: 1px solid rgba(8,9,12,.08); }
.open-doc-group__name { font: 700 14px/1.3 'Archivo', sans-serif; color: #08090c; }
.open-doc-group__count { font-size: 12px; color: #93939e; }
.open-doc-group__list { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; }
.open-doc-row { width: 100%; display: flex; align-items: center; gap: 13px; padding: 12px 13px; border: 1px solid rgba(8,9,12,.09); border-radius: 12px; background: #fff; color: #08090c; text-align: left; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.open-doc-row:hover { border-color: rgba(102,185,127,.52); background: #f3faf5; }
.open-doc-row:disabled { opacity: .58; cursor: wait; }
.open-doc-row__icon { flex: none; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: #e7f4ea; color: #66b97f; }
.open-doc-row__icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.open-doc-row__main { flex: 1; min-width: 0; }
.open-doc-row__name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 650 14px/1.35 'Libre Franklin', sans-serif; }
.open-doc-row__meta { display: block; margin-top: 3px; font-size: 12px; color: #858590; }
.open-doc-row__go { flex: none; font-size: 18px; color: #8d8d98; }
body.open-doc-modal-open { overflow: hidden; }
@media (max-width: 620px) {
  .open-doc-modal { padding: 12px; }
  .open-doc-modal__dialog { max-height: calc(100dvh - 24px); }
  .open-doc-modal__head { padding: 18px 18px 15px; }
  .open-doc-modal__search { margin: 15px 18px 0; }
  .open-doc-modal__body { padding: 16px 18px 20px; }
}

/* ── Galerie « Générer un modèle » (modale avec recherche) ─────────────────── */
.tplmodal { position: fixed; inset: 0; z-index: 1400; display: none; align-items: center; justify-content: center; padding: 24px; }
.tplmodal.is-open { display: flex; }
.tplmodal__backdrop { position: absolute; inset: 0; background: rgba(8,9,12,0.45); backdrop-filter: blur(2px); }
.tplmodal__dialog {
  position: relative; width: 100%; max-width: 560px; max-height: min(80vh, 720px);
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--card, #fff); border: 1px solid var(--line, rgba(8,9,12,0.08));
  border-radius: 16px; box-shadow: 0 24px 60px rgba(8,9,12,0.32);
  animation: tplmodal-in .18s ease;
}
@keyframes tplmodal-in { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } }
.tplmodal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 20px 14px; border-bottom: 1px solid var(--line, rgba(8,9,12,0.08)); }
.tplmodal__eyebrow { font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-3, #a8a8b3); }
.tplmodal__title { margin: 3px 0 0; font-family: 'Archivo', sans-serif; font-size: 18px; font-weight: 700; color: var(--text, #08090c); }
.tplmodal__close { border: 0; background: none; font-size: 24px; line-height: 1; cursor: pointer; color: var(--text-2, #6b6b78); padding: 0 4px; border-radius: 8px; }
.tplmodal__close:hover { color: var(--text, #08090c); }
.tplmodal__search { position: relative; display: flex; align-items: center; padding: 12px 20px; border-bottom: 1px solid var(--line, rgba(8,9,12,0.08)); }
.tplmodal__search svg { position: absolute; left: 32px; width: 17px; height: 17px; color: var(--text-3, #a8a8b3); pointer-events: none; }
.tplmodal__input {
  width: 100%; box-sizing: border-box; padding: 11px 12px 11px 38px;
  font-family: 'Libre Franklin', sans-serif; font-size: 14px; color: var(--text, #08090c);
  background: var(--bg, #f4f2ee); border: 1px solid var(--line, rgba(8,9,12,0.12)); border-radius: 10px;
}
.tplmodal__input:focus { outline: none; border-color: #66b97f; background: var(--card, #fff); }
.tplmodal__input::placeholder { color: var(--text-3, #a8a8b3); }
.tplmodal__list {
  flex: 1 1 auto; min-height: 0; overflow-y: scroll; padding: 10px 14px 24px;
  overscroll-behavior: contain; -webkit-overflow-scrolling: touch; scrollbar-gutter: stable;
  scrollbar-width: auto; scrollbar-color: rgba(8,9,12,.32) transparent;
}
.tplmodal__list::-webkit-scrollbar { width: 10px; }
.tplmodal__list::-webkit-scrollbar-track { background: transparent; }
.tplmodal__list::-webkit-scrollbar-thumb { background: rgba(8,9,12,.28); border: 3px solid transparent; border-radius: 999px; background-clip: padding-box; }
.tplmodal__list::-webkit-scrollbar-thumb:hover { background: rgba(8,9,12,.45); background-clip: padding-box; }
.tplmodal__group { font-family: 'Archivo', sans-serif; font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-3, #a8a8b3); padding: 14px 6px 6px; }
.tplitem {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%;
  text-align: left; padding: 11px 12px; margin: 2px 0; border: 1px solid transparent; border-radius: 10px;
  background: transparent; cursor: pointer; transition: background .12s ease, border-color .12s ease;
}
.tplitem:hover { background: #f3faf5; border-color: rgba(102,185,127,0.32); }
.tplitem__label { font-family: 'Libre Franklin', sans-serif; font-size: 14px; font-weight: 500; color: var(--text, #08090c); line-height: 1.4; }
.tplitem__go { flex: none; font-size: 16px; color: var(--text-3, #a8a8b3); transition: color .12s ease, transform .12s ease; }
.tplitem:hover .tplitem__go { color: #66b97f; transform: translateX(2px); }
.tplitem.is-loading { opacity: .55; pointer-events: none; }
.tplmodal__empty { padding: 28px 16px; text-align: center; font-size: 13.5px; color: var(--text-3, #a8a8b3); line-height: 1.6; }
body.tplmodal-open { overflow: hidden; }

/* Accents des fenetres d'import et de rangement ouvertes depuis l'etat vide. */
body .docmodal__drop:hover { border-color: #66b97f; background: rgba(102,185,127,.06); }
body .docmodal__drop.is-drag { border-color: #66b97f; background: rgba(102,185,127,.11); }
body .docmodal__dest-select:focus { outline: none; border-color: #66b97f; }
body .docmodal input[type="checkbox"] { accent-color: #66b97f; }

@media (max-width: 600px) {
  .tplmodal { padding: 12px; }
  .tplmodal__dialog { max-height: calc(100dvh - 24px); }
  .tplmodal__list { padding-bottom: 28px; }
}

/* En-tête de groupe */
.page .ts-group { font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--navy); margin: 32px 0 8px; padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.page .ts-group:first-of-type { margin-top: 8px; }

/* Clause en deux colonnes (façon term sheet) */
.page .ts-clause { display: grid; grid-template-columns: 172px 1fr; gap: 24px; padding: 13px 12px; margin: 0 -12px; border-radius: 8px; transition: background .15s ease, box-shadow .15s ease; }
.page .ts-clause + .ts-clause { border-top: 1px solid rgba(8,9,12,0.05); }
.page .ts-clause.is-active { background: #f6f9ff; box-shadow: inset 3px 0 0 var(--blue); }
/* Clause scindée sur deux feuilles par la pagination : son fond peindrait la gouttière. */
.page .ts-clause.is-active[data-pgsplit] { background: transparent; box-shadow: none; }
@keyframes clause-flash {
  0%   { background: #fef9c3; box-shadow: inset 3px 0 0 #eab308; }
  60%  { background: #fef9c3; box-shadow: inset 3px 0 0 #eab308; }
  100% { background: #f6f9ff; box-shadow: inset 3px 0 0 var(--blue); }
}
.page .ts-clause.is-highlight { animation: clause-flash 1.4s ease forwards; }
.page .ts-label { font-weight: 700; font-size: 14px; line-height: 1.45; }
.page .ts-added-tag { display: inline-block; font-family: 'Archivo', sans-serif; font-size: 9px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--up); background: rgba(22,163,74,0.1); padding: 2px 6px; border-radius: 5px; margin-top: 7px; }
.page .ts-content { font-size: 14px; }
.page .ts-content > *:last-child { margin-bottom: 0; }

/* Clause « import » (voir clauseBlock, server.js) : la grille à colonne d'étiquette
   fixe ci-dessus reformaterait tout document importé en tableau label/contenu et
   casserait sa mise en page d'origine. On garde juste un repère discret — un liseré
   coloré — et l'étiquette n'apparaît qu'au survol/à la sélection, sans jamais réserver
   de largeur dans le flux du texte (qui garde ainsi ses propres police/espacements). */
.page .ts-clause--imported { display: block; grid-template-columns: none; gap: 0; padding: 10px 14px; border-left: 3px solid transparent; }
.page .ts-clause--imported.is-active,
.page .ts-clause--imported:hover { border-left-color: var(--blue); }
.page .ts-clause--imported.is-active[data-pgsplit] { border-left-color: transparent; }
.page .ts-clause--imported .ts-label {
  display: inline-block; margin-bottom: 2px; font-size: 10.5px; font-weight: 700;
  letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-3);
  opacity: 0; transform: translateY(2px); pointer-events: none;
  transition: opacity .12s ease, transform .12s ease;
}
.page .ts-clause--imported:hover .ts-label,
.page .ts-clause--imported:focus-within .ts-label,
.page .ts-clause--imported.is-active .ts-label { opacity: 1; transform: translateY(0); pointer-events: auto; }

/* Le document importé arrive avec SES styles en ligne (police, corps, alignement,
   retraits), relevés sur le fichier d'origine. Les règles de l'éditeur ci-dessus
   passeraient devant sur tout ce qu'un style en ligne ne couvre pas — corps de
   texte, marges de paragraphe, filet entre clauses — et le document ne
   ressemblerait plus à celui que l'utilisateur a reçu. On les neutralise donc
   ici : la mise en page du fichier importé fait autorité, l'éditeur n'ajoute que
   ses repères de sélection. */
.page .ts-clause--imported + .ts-clause--imported { border-top: 0; }
.page .ts-clause--imported .ts-content { font-size: inherit; }
.page .ts-clause--imported .ts-content p,
.page .ts-clause--imported .ts-content ol,
.page .ts-clause--imported .ts-content ul,
.page .ts-clause--imported .ts-content li,
.page .ts-clause--imported .ts-content blockquote { margin: revert; padding: revert; }
.page .ts-clause--imported .ts-content blockquote { border-left: 0; background: none; }
/* Une image du document d'origine ne doit jamais déborder de la feuille. */
.page .ts-clause--imported .ts-content img { max-width: 100%; height: auto; }

/* Signatures */
.page .ts-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; margin-top: 40px; }
.page .ts-sign .box { font-size: 13px; }
.page .ts-sign .line { margin-top: 50px; border-top: 1px solid var(--text); padding-top: 6px; color: var(--text); font-size: 12px; }

/* Annexe : table de capitalisation */
.page .ts-annexe { margin-top: 46px; }
.page table.captable { width: 100%; border-collapse: collapse; font-size: 12.5px; margin-top: 12px; }
.page table.captable th, .page table.captable td { border: 1px solid var(--line); padding: 7px 10px; text-align: left; }
.page table.captable th { background: #f5f4f0; font-family: 'Archivo', sans-serif; font-weight: 700; font-size: 11px; letter-spacing: 0.04em; text-transform: uppercase; }
.page table.captable td.num { text-align: right; font-variant-numeric: tabular-nums; }
.page table.captable tr.total td { font-weight: 700; background: #faf9f6; }

@media (max-width: 560px) {
  .page .ts-clause { grid-template-columns: 1fr; gap: 4px; }
}

/* ---------- Statusbar ---------- */
.statusbar { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 30px; padding: 0 18px; background: var(--bg); border-top: 1px solid var(--line); font-family: 'Archivo', sans-serif; font-size: 12px; color: var(--text); }
.statusbar__right { display: flex; gap: 18px; }

/* ---------- Panneau d'explication ---------- */
.panel { border-left: 1px solid var(--line); background: var(--bg-2); display: flex; flex-direction: column; min-height: 0; min-width: 0; overflow: hidden; }
.panel__head { flex: none; padding: 18px 24px 16px; border-bottom: 1px solid var(--line); }
.panel__eyebrow { font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-3); }
.panel__title { font-size: 19px; letter-spacing: -0.02em; margin-top: 7px; }
.panel__actions { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 24px; border-bottom: 1px solid var(--line); background: var(--bg-2); }
.panel__actions .btn { padding: 7px 14px; font-size: 13px; border-radius: 9px; }
.panel__result { flex: none; padding: 14px 24px; border-bottom: 1px solid var(--line); }
.panel__body { flex: 1; padding: 22px 24px; overflow-y: auto; }

.block { margin-bottom: 22px; }
.block__h { display: flex; align-items: center; gap: 8px; font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text); margin-bottom: 9px; }
.block p { font-size: 14.5px; line-height: 1.65; color: var(--text); }
.block--why p { color: var(--text); }
.block--simple { background: rgba(139,92,246,0.06); border: 1px solid rgba(139,92,246,0.18); border-radius: 11px; padding: 13px 15px; }
.block--simple .block__h { color: #7c3aed; }
.block--simple p { font-size: 14px; line-height: 1.65; color: var(--text); }
.cond-tpl__simple { font-size: 11.5px; line-height: 1.5; color: var(--text); background: rgba(139,92,246,0.05); border-radius: 6px; padding: 6px 9px; margin: 4px 0 8px; }

.callout { padding: 13px 15px; border-radius: 11px; font-size: 13.5px; line-height: 1.6; }
.callout--watch { background: rgba(220,38,38,0.06); border: 1px solid rgba(220,38,38,0.18); }
.callout--watch .block__h { color: #dc2626; }
.callout--tip { background: rgba(22,163,74,0.07); border: 1px solid rgba(22,163,74,0.2); margin-bottom: 20px; }
.callout--tip .block__h { color: var(--up); }

/* Jauge d'avantage investisseurs (5 points) */
.biasmeter { margin-top: 2px; }
.biasmeter__track { position: relative; display: flex; align-items: center; justify-content: space-between; padding: 10px 6px; }
.biasmeter__track::before { content: ''; position: absolute; left: 10px; right: 10px; top: 50%; transform: translateY(-50%); height: 2px; background: var(--line); }
.biasmeter__pt { position: relative; width: 11px; height: 11px; border-radius: 50%; background: #fff; border: 2px solid #d4d2cc; transition: .15s ease; }
.biasmeter__pt.is-on { width: 20px; height: 20px; border: 2px solid #fff; }
.biasmeter__legend { display: flex; justify-content: space-between; font-family: 'Archivo', sans-serif; font-size: 10px; color: var(--text-3); margin-top: 2px; padding: 0 2px; }
.biasmeter__label { font-family: 'Archivo', sans-serif; font-size: 12.5px; font-weight: 700; margin-top: 9px; }

/* Conseil côté fondateur */
.callout--advice { background: rgba(22,163,74,0.07); border: 1px solid rgba(22,163,74,0.22); padding: 13px 15px; border-radius: 11px; font-size: 13.5px; line-height: 1.6; }
.callout--advice .block__h { color: var(--up); }

/* Exemple chiffré avec graphique */
.example__chart { background: var(--card); border: 1px solid var(--line); border-radius: 11px; padding: 12px 12px 8px; }
.example__chart svg { display: block; width: 100%; height: auto; }
.example__cap { font-size: 12px; color: var(--text); margin-top: 8px; line-height: 1.5; }
.example__cap strong { color: var(--text); }

.risk { display: inline-flex; align-items: center; gap: 6px; font-family: 'Archivo', sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 5px 10px; border-radius: 999px; }
.risk .d { width: 6px; height: 6px; border-radius: 50%; }
.risk--low  { background: rgba(22,163,74,0.08); color: var(--up); } .risk--low .d { background: var(--up); }
.risk--mid  { background: rgba(217,119,6,0.1); color: #b45309; } .risk--mid .d { background: #d97706; }
.risk--high { background: rgba(220,38,38,0.08); color: #dc2626; } .risk--high .d { background: #dc2626; }

.panel__empty { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; text-align: center; color: var(--text-3); gap: 12px; padding: 40px; }
.panel__empty p { font-size: 14px; max-width: 230px; line-height: 1.6; }

/* ---------- Assistant IA (chat Claude) ---------- */
.gutter-h { position: relative; flex: none; height: 6px; cursor: row-resize; background: transparent; border: 0; touch-action: none; }
.gutter-h::before { content: ''; position: absolute; inset: auto 0; top: 50%; width: auto; height: 1px; transform: translateY(-50%); background: var(--line); transition: background .12s ease, height .12s ease; }
.gutter-h:hover::before, .gutter-h.is-drag::before, .gutter-h:focus-visible::before { width: auto; height: 2px; background: var(--up); }
.gutter-h:focus-visible { box-shadow: none; }
.chat { flex: none; display: flex; flex-direction: column; border-top: 1px solid var(--line); background: var(--card); max-height: 46%; }
/* En-tête du chat, robuste aux panneaux étroits : le titre occupe sa propre ligne,
   les boutons occupent la ligne suivante et se partagent la largeur. Les boutons
   PEUVENT rétrécir (flex-shrink + min-width:0) : quand la place manque, leur libellé
   passe à la ligne au lieu d'être rogné par le panneau (overflow:hidden). */
.chat__head { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 16px 8px; }
.chat__title { flex: 1 1 100%; font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--navy); }
.chat__tools { flex: 1 1 100%; display: flex; flex-wrap: wrap; align-items: stretch; gap: 6px 8px; }
.chat__tools .chat__attach,
.chat__tools .chat__explain { flex: 1 1 auto; min-width: 0; justify-content: center; text-align: center; white-space: normal; }
.chat__explain { flex: none; font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; color: var(--dark); background: rgba(8,9,12,0.06); border: 1px solid rgba(8,9,12,0.18); border-radius: 7px; padding: 5px 10px; cursor: pointer; transition: background .15s ease, color .15s ease; }
.chat__explain:hover { background: var(--dark); color: #fff; }
.chat__explain:disabled { opacity: .5; cursor: default; }
.chat__explain[hidden] { display: none; }
.chat__attach { flex: none; display: inline-flex; align-items: center; gap: 5px; font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; color: var(--dark); background: rgba(8,9,12,0.06); border: 1px solid rgba(8,9,12,0.18); border-radius: 7px; padding: 5px 10px; cursor: pointer; transition: background .15s ease, color .15s ease, border-color .15s ease; }
.chat__attach svg { display: block; }
.chat__attach:hover { background: rgba(8,9,12,0.12); }
.chat__attach.is-on { background: var(--blue); border-color: var(--blue); color: #fff; }
.chat__attach.is-on:hover { filter: brightness(0.95); }
.chat__log { flex: 1; min-height: 64px; overflow-y: auto; padding: 4px 24px 8px; display: flex; flex-direction: column; gap: 8px; }
.chat__empty { font-size: 12.5px; color: var(--text-3); line-height: 1.5; margin: 4px 0; }
.chat__msg { font-size: 13.5px; line-height: 1.55; padding: 8px 11px; border-radius: 11px; max-width: 92%; white-space: pre-wrap; word-wrap: break-word; }
.chat__msg--user { align-self: flex-end; background: var(--navy); color: var(--on-dark); border-bottom-right-radius: 4px; }
.chat__msg--bot { align-self: flex-start; background: #f0eee9; color: var(--text); border-bottom-left-radius: 4px; }
.chat__msg--err { align-self: flex-start; background: rgba(220,38,38,0.08); color: #dc2626; border: 1px solid rgba(220,38,38,0.18); }
.chat__apply { align-self: flex-start; margin-top: 2px; font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 600; color: #fff; background: var(--up); border: none; border-radius: 8px; padding: 7px 12px; cursor: pointer; transition: filter .15s ease; }
.chat__apply:hover { filter: brightness(0.94); }
.chat__apply:disabled { opacity: 0.55; cursor: default; }
.chat__form { flex: none; display: flex; gap: 8px; padding: 10px 24px 14px; border-top: 1px solid var(--line); }
.chat__input { flex: 1; height: 38px; border: 1px solid var(--line); border-radius: 9px; background: var(--bg); padding: 0 12px; font-family: inherit; font-size: 13.5px; color: var(--text); outline: none; transition: border-color .15s ease; }
.chat__input:focus { border-color: var(--blue); background: #fff; }
.chat__input:disabled { opacity: 0.55; cursor: default; }
.chat__send { flex: none; width: 38px; height: 38px; border: none; border-radius: 9px; background: var(--dark); color: #fff; font-size: 17px; cursor: pointer; transition: background .15s ease; }
.chat__send:hover { background: var(--dark-muted); }
.chat__send:disabled { opacity: 0.5; cursor: default; }

/* ---------- Responsive ----------
   Les deux panneaux restent redimensionnables sur les écrans de bureau, y
   compris entre 820 et 1040 px. Les largeurs enregistrées sont plafonnées par
   le JavaScript pour toujours laisser une zone de document utilisable. */
@media (max-width: 1280px) {
  .workspace { grid-template-columns: var(--lib-w, 240px) 10px minmax(0, 1fr) 10px var(--panel-w, 330px); }
}
@media (max-width: 1040px) {
  .workspace { grid-template-columns: var(--lib-w, 200px) 10px minmax(0, 1fr) 10px var(--panel-w, 260px); }
  .page { padding: 48px 40px 60px; }
}
@media (max-width: 820px) {
  .workspace { grid-template-columns: var(--lib-w, 180px) 10px minmax(0, 1fr); }
  .panel, #gutter-right { display: none; }
}
@media (max-width: 700px) {
  .workspace { grid-template-columns: var(--lib-w, 180px) 10px minmax(0, 1fr); }
  .editor-canvas { padding: 20px 12px 60px; }
  .page { padding: 40px 24px 50px; }
}

/* ---------- Conditions pré-écrites (panneau + document) ---------- */
.cond-section { margin-top: 22px; border-top: 1px solid var(--line); padding-top: 18px; }
.cond-section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.cond-section__title { font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text); }
.cond-section__hint { font-family: 'Archivo', sans-serif; font-size: 10.5px; color: var(--text-3); font-style: italic; }

.cond-tpl-list { display: flex; flex-direction: column; gap: 9px; }
.cond-empty { font-size: 12.5px; color: var(--text-3); text-align: center; padding: 14px 10px; background: var(--card); border: 1px dashed var(--line); border-radius: 9px; line-height: 1.55; margin: 0; }

/* ---------- Bouton Analyser + callout résultat (panneau droit) ---------- */
.verify-btn { font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 600; color: var(--on-dark, #fff); background: var(--dark, #0c0d10); border: 1px solid transparent; border-radius: 8px; padding: 7px 11px; cursor: pointer; transition: opacity .15s; white-space: nowrap; }
.verify-btn:hover { opacity: .85; }
.verify-btn:disabled { opacity: .5; cursor: default; }
.callout--claude { background: rgba(12,13,16,0.05); border: 1px solid rgba(12,13,16,0.12); border-radius: 11px; padding: 13px 15px; margin-bottom: 20px; }
.callout--claude .block__h { color: var(--text); }
.verify-result__text { font-family: 'Libre Franklin', sans-serif; font-size: 14px; line-height: 1.65; color: var(--text); margin: 0; }
.verify-result__loading { font-family: 'Libre Franklin', sans-serif; font-size: 13px; color: var(--text-3); margin: 0; }
.verify-result__err { font-family: 'Libre Franklin', sans-serif; font-size: 13px; color: #dc2626; margin: 0; }

/* Carte de condition (panneau) */
.cond-tpl { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; transition: border-color .12s; }
.cond-tpl:hover { border-color: #c9c6bf; }
.cond-tpl--added { opacity: 0.6; }
.cond-tpl__head { margin-bottom: 5px; }
.cond-tpl__badge { font-family: 'Archivo', sans-serif; font-size: 10px; font-weight: 700; color: #fff; padding: 2px 7px; border-radius: 5px; letter-spacing: 0.02em; }
.cond-tpl__label { font-weight: 700; font-size: 13px; letter-spacing: -0.01em; margin: 6px 0 4px; color: var(--text); }
.cond-tpl__preview { font-size: 11.5px; color: var(--text); line-height: 1.5; margin: 0 0 10px; }
.cond-tpl__add { width: 100%; font-family: 'Archivo', sans-serif; font-size: 12.5px; font-weight: 700; color: var(--dark); background: transparent; border: 1.5px solid var(--dark); border-radius: 8px; padding: 7px; cursor: pointer; transition: background .12s, color .12s; }
.cond-tpl__add:hover { background: var(--dark); color: #fff; }
.cond-tpl__done { font-family: 'Archivo', sans-serif; font-size: 11.5px; font-weight: 700; color: var(--up); display: block; text-align: center; padding: 4px 0; }

/* Bloc de condition inséré dans le document.
   La condition pré-écrite doit être INDISSOCIABLE du reste de la clause : même
   police, même corps et même interligne que le texte alentour, sans encadré, fond
   ni étiquette qui la trahiraient (y compris à l'impression). Les contrôles (badge +
   bouton retirer) et un liseré-repère n'apparaissent qu'au survol/à la sélection et
   ne réservent aucune place dans le flux — via ::before et un head en absolu. */
.clause-cond { position: relative; margin: 0; }
.clause-cond::before {
  content: ''; position: absolute; left: -14px; top: 0; bottom: 0; width: 3px;
  border-radius: 2px; background: transparent; transition: background .12s ease;
}
.clause-cond:hover::before,
.clause-cond:focus-within::before { background: rgba(59,130,246,0.35); }
.clause-cond__head {
  position: absolute; top: -12px; right: 0; z-index: 2;
  display: flex; align-items: center; gap: 8px; padding: 3px 8px;
  background: #fff; border: 1px solid rgba(59,130,246,0.2); border-radius: 6px;
  box-shadow: 0 1px 6px rgba(0,24,57,0.14);
  opacity: 0; transform: translateY(2px); pointer-events: none;
  transition: opacity .12s ease, transform .12s ease;
}
.clause-cond:hover .clause-cond__head,
.clause-cond:focus-within .clause-cond__head { opacity: 1; transform: translateY(0); pointer-events: auto; }
.clause-cond__badge { font-family: 'Archivo', sans-serif; font-size: 9.5px; font-weight: 700; color: #fff; padding: 2px 7px; border-radius: 4px; flex: none; }
.clause-cond__tip { font-family: 'Archivo', sans-serif; font-size: 10px; color: rgba(0,24,57,0.5); font-style: italic; flex: none; }
.clause-cond__del { flex: none; font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 600; color: var(--text-3); background: transparent; border: 1px solid rgba(0,0,0,0.12); border-radius: 5px; padding: 2px 8px; cursor: pointer; transition: color .12s, border-color .12s; }
.clause-cond__del:hover { color: #dc2626; border-color: rgba(220,38,38,0.4); }
/* font/interligne hérités de .ts-content : le texte se fond dans la clause. */
.clause-cond__text { font-size: inherit; line-height: inherit; }
.clause-cond__text > *:last-child { margin-bottom: 0; }

/* Valeurs modifiables surlignées en jaune */
mark.cond-val { background: rgba(251,191,36,0.38); border-radius: 3px; padding: 0 3px; font-weight: 700; font-style: normal; cursor: text; border-bottom: 1.5px dashed #d97706; }

/* En-tête / pied de page d'impression : masqués (l'aperçu n'en comporte pas) */
.print-head, .print-foot { display: none !important; }

/* ---------- Bouton flottant « Expliquer la sélection » + popover ---------- */
.selx-btn {
  position: fixed; z-index: 60;
  display: inline-flex; align-items: center; gap: 6px;
  font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 700;
  color: #fff; background: var(--dark); border: 1px solid var(--dark-muted);
  border-radius: 8px; padding: 6px 11px; cursor: pointer;
  box-shadow: 0 6px 18px rgba(0,0,0,0.22); transition: background .15s, transform .1s;
}
.selx-btn:hover { background: #1a1d24; }
.selx-btn:active { transform: translateY(1px); }
.selx-btn[hidden] { display: none; }

.selx-pop {
  position: fixed; z-index: 61; width: 360px; max-width: calc(100vw - 32px);
  max-height: min(480px, calc(100vh - 24px));
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 18px 50px rgba(0,0,0,0.22); overflow: hidden;
  font-family: 'Libre Franklin', sans-serif;
}
.selx-pop[hidden] { display: none; }
.selx-pop__head {
  flex: none;
  display: flex; align-items: center; justify-content: space-between;
  padding: 9px 12px; background: var(--card); border-bottom: 1px solid var(--line);
}
.selx-pop__title { font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-2); }
.selx-pop__close { background: transparent; border: 0; font-size: 20px; line-height: 1; color: var(--text-3); cursor: pointer; padding: 0 2px; }
.selx-pop__close:hover { color: var(--text); }
.selx-pop__quote {
  flex: none;
  padding: 10px 14px 0; font-size: 12.5px; line-height: 1.55; color: var(--text-2);
  font-style: italic; border-left: 3px solid var(--blue); margin: 0 14px;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.selx-pop__body {
  flex: 1 1 auto; min-height: 0; overflow-y: auto;
  padding: 11px 14px 14px; font-size: 13.5px; line-height: 1.65; color: var(--text);
}
.selx-pop__body p { margin: 0; }
.selx-pop__body .selx-loading { color: var(--text-3); }
.selx-pop__body .selx-err { color: #dc2626; }

/* ---------- Barre de progression de l'analyse ----------
   Bandeau intégré à l'éditeur, entre la barre d'outils et le document : il
   ne recouvre rien et laisse la navigation libre pendant l'analyse. */
.azm {
  flex: none;
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 16px;
  padding: 8px 18px; background: var(--card); border-bottom: 1px solid var(--line);
  font-family: 'Libre Franklin', sans-serif;
}
.azm[hidden] { display: none; }
.azm__title { font-family: 'Archivo', sans-serif; font-size: 12.5px; font-weight: 700; color: var(--text); white-space: nowrap; }
.azm__bar { flex: 0 0 130px; height: 5px; background: var(--line); border-radius: 99px; overflow: hidden; }
.azm__bar-fill { height: 100%; width: 0; background: var(--blue); border-radius: 99px; transition: width .35s ease; }
.azm__rows {
  list-style: none; margin: 0; padding: 0;
  flex: 1; min-width: 0;
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px;
}
.azm__row { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; white-space: nowrap; }
.azm__dot {
  width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto;
  background: var(--text-3); opacity: .4;
}
.azm__row.is-progress .azm__dot { background: var(--blue); opacity: 1; animation: azm-pulse 1s ease-in-out infinite; }
.azm__row.is-done .azm__dot { background: #16a34a; opacity: 1; }
.azm__row.is-error .azm__dot { background: #dc2626; opacity: 1; }
.azm__row.is-cancelled .azm__dot { background: var(--text-3); opacity: .8; }
.azm__label { color: var(--text-2); }
.azm__row.is-done .azm__label { color: var(--text); }
.azm__val { font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; color: var(--text-3); }
.azm__row.is-progress .azm__val { color: var(--blue); }
.azm__row.is-done .azm__val { color: #16a34a; }
.azm__row.is-error .azm__val { color: #dc2626; }
.azm__row.is-cancelled .azm__val { color: var(--text-3); }
@keyframes azm-pulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.35); opacity: .55; } }
.azm__cancel {
  font-family: 'Archivo', sans-serif; font-size: 11.5px; font-weight: 600;
  color: #dc2626; background: transparent; border: 1px solid rgba(220,38,38,0.35);
  border-radius: 8px; padding: 5px 10px; cursor: pointer; transition: background .15s;
  white-space: nowrap;
}
.azm__cancel:hover { background: rgba(220,38,38,0.08); }
.azm__cancel:disabled { opacity: .55; cursor: default; }
.azm__cancel[hidden] { display: none; }
.azm__close { background: transparent; border: 0; font-size: 20px; line-height: 1; color: var(--text-3); cursor: pointer; padding: 0 2px; }
.azm__close:hover { color: var(--text); }
@media print { .azm { display: none !important; } }

/* ---------- Bouton « Annuler » d'une requête IA en cours ---------- */
.ai-cancel {
  display: inline-block; margin-top: 8px;
  font-family: 'Archivo', sans-serif; font-size: 12px; font-weight: 600;
  color: #dc2626; background: transparent; border: 1px solid rgba(220,38,38,0.35);
  border-radius: 8px; padding: 5px 10px; cursor: pointer; transition: background .15s;
}
.ai-cancel:hover { background: rgba(220,38,38,0.08); }
.ai-cancel--inline { margin: 0 0 0 8px; padding: 2px 8px; font-size: 11px; }

/* Bouton d'envoi du chat transformé en « stop » pendant la requête */
.chat__send--stop { background: #dc2626; font-size: 13px; }
.chat__send--stop:hover { background: #b91c1c; }

@media print { .selx-btn, .selx-pop, .sign-modal { display: none !important; } }

/* ---------- Impression / Export PDF — STRICTEMENT identique à l'aperçu ----------
   La page PDF a exactement la taille d'une feuille de l'aperçu (820×1160 px). La
   marge @page est 0 → le navigateur N'AJOUTE PAS ses en-têtes/pieds (date, URL,
   titre, n° de page). La marge haute de chaque page est recréée par un élément
   espaceur inséré par la pagination JS avant chaque saut. Le navigateur reproduit
   ainsi EXACTEMENT la répartition de l'aperçu, sans réécrire aucun style. */
@page { size: 820px 1160px; margin: 0; }

/* Espaceur de marge haute en tête de chaque page imprimée (invisible, sans fond). */
.pgspacer { display: block; width: 100%; background: none; border: 0; }

@media print {
  /* Conserver tous les fonds/couleurs (encadrés, surlignages, filets, tableau). */
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

  html, body { margin: 0 !important; padding: 0 !important; background: #fff !important; }

  /* Interface d'édition et aides à l'écran masquées. */
  .topbar, .ribbon, .chrome-toggle, .statusbar, .panel, .library, .document-meta,
  .clause-cond__head { display: none !important; }

  /* Conteneurs neutralisés pour que .page démarre tout en haut de la page PDF. */
  .app { height: auto; display: block; overflow: visible; }
  .workspace { display: block; }
  .editor-canvas { overflow: visible; background: #fff; padding: 0; margin: 0; }
  .sheet-bg { display: none !important; }
  .paper { width: 820px; max-width: none; height: auto !important; margin: 0; }

  /* La page garde EXACTEMENT son rendu d'écran. La marge haute de la 1re page est
     portée par le padding-top (76px) ; celle des pages suivantes par l'espaceur. */
  .page {
    width: 820px; max-width: none; min-height: 0 !important; margin: 0;
    border: 0; border-radius: 0; box-shadow: none;
    padding: 76px 80px 0;
  }
  .page:focus { box-shadow: none; }

  /* La clause sélectionnée ne doit pas apparaître surlignée dans le PDF. */
  .page .ts-clause.is-active { background: transparent !important; box-shadow: none !important; }

  /* Valeurs modifiables : le surlignage jaune et son liseré tireté sont une aide
     d'édition à l'écran. À l'export, la valeur doit passer pour du texte classique. */
  .page mark.cond-val {
    background: transparent !important; border: 0 !important; border-radius: 0 !important;
    padding: 0 !important; font-weight: inherit !important; color: inherit !important;
  }

  /* Sécurité : ne jamais scinder ces éléments au milieu d'une page. */
  .ts-clause, .clause-cond, .ts-sign, table.captable,
  .page p, .page li, .page ol, .page ul { break-inside: avoid; page-break-inside: avoid; }
}

/* ---------- Signature manuscrite (fenêtre de tracé à la souris) ---------- */
.sign-img { display: inline-block; vertical-align: bottom; max-width: 100%; height: 56px; }

.sign-modal { position: fixed; inset: 0; z-index: 120; display: flex; align-items: center; justify-content: center; padding: 20px; }
.sign-modal[hidden] { display: none; }
.sign-modal__backdrop { position: absolute; inset: 0; background: rgba(8,9,12,0.55); backdrop-filter: blur(2px); }
.sign-modal__panel {
  position: relative; width: 640px; max-width: calc(100vw - 32px);
  background: var(--card); border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 24px 60px rgba(8,9,12,0.35); padding: 22px; animation: signpop .18s ease;
}
@keyframes signpop { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
.sign-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 6px; }
.sign-modal__eyebrow { font-family: 'Archivo', sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-2); }
.sign-modal__title { font-family: 'Archivo', sans-serif; font-size: 20px; font-weight: 700; color: var(--text); margin: 2px 0 0; }
.sign-modal__close { background: transparent; border: 0; font-size: 26px; line-height: 1; color: var(--text-3); cursor: pointer; padding: 0 2px; }
.sign-modal__close:hover { color: var(--text); }
.sign-modal__hint { font-size: 13px; color: var(--text-2); margin: 4px 0 14px; }

.sign-pad-wrap { position: relative; border: 1.5px dashed #cbc9c2; border-radius: 12px; background: #faf9f6; overflow: hidden; }
.sign-pad { display: block; width: 100%; height: 220px; touch-action: none; cursor: crosshair; }
.sign-pad__baseline { position: absolute; left: 8%; right: 8%; bottom: 46px; height: 0; border-top: 1.5px solid #d7d4cc; pointer-events: none; }
.sign-pad__ph {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: 'Archivo', sans-serif; font-size: 18px; letter-spacing: 0.04em; color: #c3c0b8;
  pointer-events: none; transition: opacity .15s;
}
.sign-pad-wrap.is-drawn .sign-pad__ph { opacity: 0; }

.sign-modal__tools { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 12px 0 4px; }
.sign-ink { display: flex; align-items: center; gap: 8px; }
.sign-ink__dot {
  width: 24px; height: 24px; border-radius: 50%; border: 2px solid transparent; background: var(--ink);
  cursor: pointer; padding: 0; box-shadow: 0 0 0 1px rgba(8,9,12,0.12) inset;
}
.sign-ink__dot.is-active { border-color: var(--ink); box-shadow: 0 0 0 2px var(--card), 0 0 0 4px var(--ink); }
.sign-clear { background: transparent; border: 1px solid var(--line); border-radius: 8px; padding: 6px 14px; font-family: 'Archivo', sans-serif; font-size: 13px; color: var(--text-2); cursor: pointer; transition: background .12s, border-color .12s; }
.sign-clear:hover { background: #f0eee9; border-color: #c9c6bf; color: var(--text); }

.sign-modal__actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.sign-modal__actions .btn { padding: 9px 18px; font-size: 14px; }
.sign-modal__actions .btn--primary { background: var(--dark); border-color: var(--dark); color: #fff; }
.sign-modal__actions .btn--primary:hover:not(:disabled) { background: #000; }
.sign-modal__actions .btn--primary:disabled { opacity: 0.45; cursor: not-allowed; }

/* ============================================================
   Animations & micro-interactions
   Objectif : rendre l'édition plus fluide et vivante sans gêner
   la saisie. Tout est neutralisé si l'utilisateur a demandé à
   réduire les animations (prefers-reduced-motion, tout en bas).
   ============================================================ */

@keyframes ed-fade-up      { from { opacity: 0; transform: translateY(9px);  } to { opacity: 1; transform: none; } }
@keyframes ed-fade-in      { from { opacity: 0; } to { opacity: 1; } }
@keyframes ed-pop-in       { 0% { opacity: 0; transform: translateY(7px) scale(.97); } 100% { opacity: 1; transform: none; } }
@keyframes ed-clause-enter { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes ed-typing       { 0%, 60%, 100% { transform: translateY(0); opacity: .35; } 30% { transform: translateY(-4px); opacity: 1; } }

/* Apparition douce de toute l'interface au chargement */
.app.ready { animation: ed-fade-in .45s ease; }

/* Décrypteur (panneau droit) : les blocs entrent en cascade à chaque
   clause ouverte. panelBody.innerHTML étant réécrit à chaque sélection,
   l'animation rejoue naturellement à chaque changement de clause. */
.panel__body > .block,
.panel__body > .callout,
.panel__body > .cond-section,
.panel__body > .panel__empty {
  animation: ed-fade-up .36s cubic-bezier(.22,.61,.36,1) both;
}
.panel__body > *:nth-child(1)   { animation-delay: .02s; }
.panel__body > *:nth-child(2)   { animation-delay: .07s; }
.panel__body > *:nth-child(3)   { animation-delay: .12s; }
.panel__body > *:nth-child(4)   { animation-delay: .17s; }
.panel__body > *:nth-child(5)   { animation-delay: .22s; }
.panel__body > *:nth-child(n+6) { animation-delay: .27s; }

/* Changement d'onglet de la bibliothèque : glissé-fondu de la vue affichée */
.lib-view:not([hidden]) { animation: ed-fade-up .3s cubic-bezier(.22,.61,.36,1) both; }

/* Listes (bibliothèque / à vérifier / conditions) : légère cascade à l'apparition */
.library__list > .libitem,
#advice-list > .advitem,
.cond-tpl-list > .cond-tpl {
  animation: ed-fade-up .32s cubic-bezier(.22,.61,.36,1) both;
}
.library__list > *:nth-child(1), #advice-list > *:nth-child(1), .cond-tpl-list > *:nth-child(1) { animation-delay: .03s; }
.library__list > *:nth-child(2), #advice-list > *:nth-child(2), .cond-tpl-list > *:nth-child(2) { animation-delay: .08s; }
.library__list > *:nth-child(3), #advice-list > *:nth-child(3), .cond-tpl-list > *:nth-child(3) { animation-delay: .13s; }
.library__list > *:nth-child(4), #advice-list > *:nth-child(4), .cond-tpl-list > *:nth-child(4) { animation-delay: .18s; }
.library__list > *:nth-child(5), #advice-list > *:nth-child(5), .cond-tpl-list > *:nth-child(5) { animation-delay: .23s; }
.library__list > *:nth-child(n+6), #advice-list > *:nth-child(n+6), .cond-tpl-list > *:nth-child(n+6) { animation-delay: .27s; }

/* Assistant IA : chaque nouveau message et bouton d'action « pop » à l'arrivée.
   La relecture de l'historique (renderChatLog, scroll=false) ne reçoit PAS la
   classe --in : pas de rejeu clignotant quand on change de clause. */
.chat__msg--in { animation: ed-pop-in .3s cubic-bezier(.22,.61,.36,1); }
.chat__apply   { animation: ed-pop-in .3s cubic-bezier(.22,.61,.36,1); }

/* Indicateur « l'assistant réfléchit » : trois points qui rebondissent */
.chat__msg--typing { display: inline-flex; align-items: center; gap: 5px; padding: 11px 14px; }
.chat__msg--typing span { width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .5; animation: ed-typing 1.1s ease-in-out infinite; }
.chat__msg--typing span:nth-child(2) { animation-delay: .18s; }
.chat__msg--typing span:nth-child(3) { animation-delay: .36s; }

/* Clause fraîchement ajoutée au contrat : glisse en place dans le document */
.page .ts-clause--enter { animation: ed-clause-enter .42s cubic-bezier(.22,.61,.36,1) both; }
/* Survol d'une clause : léger fond pour signaler qu'elle est cliquable */
.page .ts-clause:hover:not(.is-active) { background: rgba(8,9,12,0.025); }

/* Bouton flottant « Expliquer », popover et panneau Versions : entrée en fondu-échelle */
.selx-btn:not([hidden]) { animation: ed-pop-in .18s ease; }
.selx-pop:not([hidden]) { animation: ed-pop-in .22s cubic-bezier(.22,.61,.36,1); transform-origin: top center; }
.verpanel:not([hidden]) { animation: ed-pop-in .2s cubic-bezier(.22,.61,.36,1); transform-origin: top right; }

/* Retour tactile à l'appui (boutons de la barre d'outils, du bandeau, des cartes) */
.tbtn { transition: background .12s ease, border-color .12s ease, transform .06s ease; }
.tbtn:active { transform: translateY(1px); }
.topbar .btn:active,
.libitem__add:active, .libitem__add--see:active,
.advitem__go:active, .advitem__apply:active,
.cond-tpl__add:active, .fill-row__ok:active,
.chat__apply:active, .chat__send:active,
.next-ph-btn:active, .fill-next-btn:active, .af-btn:active,
.verify-btn:active { transform: translateY(1px); }

/* Respect du réglage système « réduire les animations » */
@media (prefers-reduced-motion: reduce) {
  .app.ready,
  .panel__body > *, .lib-view:not([hidden]),
  .library__list > *, #advice-list > *, .cond-tpl-list > *,
  .chat__msg--in, .chat__apply, .page .ts-clause--enter,
  .selx-btn:not([hidden]), .selx-pop:not([hidden]), .verpanel:not([hidden]) { animation: none !important; }
  .chat__msg--typing span { animation: none !important; opacity: .55; }
  .tbtn:active, .topbar .btn:active { transform: none; }
}

/* ---------- Redline (fidélité différentielle de la contreproposition) ---------- */
/* Encre du diff : insertions soulignées vertes, suppressions barrées rouges. */
.page ins.rl-ins { color: #15803d; background: #d1fae5; text-decoration: underline; text-underline-offset: 2px; }
.page del.rl-del { color: #b91c1c; background: #fee2e2; text-decoration: line-through; }

/* Statut de la clause : filet coloré dans la marge gauche. */
.page .ts-clause[data-rl="modified"] { box-shadow: inset 3px 0 0 #f59e0b; }
.page .ts-clause[data-rl="added"]    { box-shadow: inset 3px 0 0 #15803d; }
.page .ts-clause[data-rl="removed"]  { box-shadow: inset 3px 0 0 #b91c1c; }

/* Annexe « Récapitulatif des modifications » (fin du document redline). */
.page .rl-annex { margin-top: 34px; padding-top: 18px; border-top: 2px solid #d7d7de; }
.page .rl-annex__title { font-size: 17px; font-weight: 700; margin: 0 0 8px; }
.page .rl-annex__intro, .page .rl-annex__rest, .page .rl-annex__empty { font-size: 13px; color: #3f3f49; line-height: 1.55; }
.page .rl-annex__table { border-collapse: collapse; width: 100%; margin: 12px 0 6px; }
.page .rl-annex__table th, .page .rl-annex__table td { border: 1px solid #c9c9d2; padding: 6px 9px; font-size: 12.5px; text-align: left; vertical-align: top; }
.page .rl-annex__table th { background: #f2f2f5; font-family: 'Archivo', sans-serif; font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }
.page .rl-annex__was { color: #6b6b78; font-size: 11.5px; }

/* Lecture seule pendant le redline : curseur normal, pas de halo d'édition. */
.page[contenteditable="false"] { caret-color: transparent; }

@media print {
  /* Le bandeau et le panneau du mode redline ne s'impriment jamais ; le contenu
     redline de la page s'imprime, lui, avec ses couleurs (color-adjust ci-dessus). */
  .rl-banner, .rlpanel { display: none !important; }
  .page .ts-clause[data-rl] { box-shadow: none !important; }
  .page .rl-annex { break-before: page; page-break-before: always; }
}