/* Éditeur PDF de ressources.online : page d'accueil de l'outil, puis éditeur en plein écran.
   Les couleurs suivent la palette du site (variables du thème). */

/* ---------- accueil de l'outil ---------- */
.bloc {
  margin: 28px auto 0; max-width: 1100px; background: var(--surface); border: 1px solid var(--ligne); border-radius: 22px;
  box-shadow: var(--ombre); padding: 22px 20px;
}
.depot {
  border: 2px dashed var(--ligne); border-radius: 18px; padding: 34px 18px 26px; text-align: center;
  background: var(--surface-2); transition: border-color .15s, background .15s;
}
.depot.survol { border-color: var(--orange); background: color-mix(in srgb, var(--orange) 8%, var(--surface-2)); }
.depot svg.grand { color: var(--orange); margin-bottom: 8px; }
.depot p { margin: 10px 0 0; color: var(--doux); font-size: .92rem; }
.vierges { margin-top: 20px; padding-top: 18px; border-top: 1px dashed var(--ligne); display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; justify-content: center; }
.vierges > span { color: var(--doux); font-size: .92rem; }
.vierges .btn { min-height: 42px; padding: 0 18px; font-size: .92rem; }
/* accueil : deux départs de même poids (ouvrir un fichier, partir d'une page vierge) */
.depart-deux { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 16px; padding: 16px; text-align: left; }
.depart-choix { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 22px; border-radius: 16px; background: var(--surface); border: 1px solid var(--ligne); }
.depart-choix h2 { margin: 0; font-size: 1.2rem; display: flex; align-items: center; gap: 10px; }
.depart-choix h2 svg { color: var(--orange); flex: none; }
.depart-choix > p { margin: 0; color: var(--doux); font-size: .95rem; }
.depart-choix > p.ed-depot-aide { font-size: .88rem; }
.depart-choix .vierges { width: 100%; margin-top: 2px; padding-top: 0; border-top: 0; justify-content: flex-start; }
.depart-choix .vierges .btn { flex: none; width: auto; max-width: 100%; }
.reprise {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; padding: 14px 16px; margin-bottom: 16px; border-radius: 16px;
  border: 1px solid color-mix(in srgb, var(--orange) 45%, var(--ligne)); background: color-mix(in srgb, var(--orange) 7%, var(--surface));
}
.reprise svg { color: var(--orange); flex: none; }
.reprise div { flex: 1 1 220px; min-width: 0; }
.reprise strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reprise small { color: var(--doux); }
.reprise .btn { min-height: 42px; padding: 0 20px; }
.btn-lien { font: inherit; font-size: .9rem; background: none; border: 0; color: var(--doux); text-decoration: underline; cursor: pointer; padding: 8px 4px; }
.prive { display: flex; gap: 10px; align-items: flex-start; margin: 18px 0 0; padding: 12px 14px; border-radius: 12px; background: var(--surface-2); font-size: .9rem; color: var(--doux); }
.prive svg { flex: none; color: var(--vert); margin-top: 2px; }
.atouts { list-style: none; max-width: 1100px; margin: 34px auto 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; }
.atouts li { background: var(--surface); border: 1px solid var(--ligne); border-radius: 18px; padding: 18px; }
.atouts svg { color: var(--orange); }
.atouts strong { display: block; margin: 8px 0 4px; }
.atouts span { color: var(--doux); font-size: .92rem; line-height: 1.5; display: block; }
.touches { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 6px 18px; list-style: none; padding: 0; margin: 0 0 14px; font-size: .92rem; }
.touches kbd, .ed kbd { font: inherit; font-size: .82em; padding: 1px 6px; border: 1px solid var(--ligne); border-radius: 6px; background: var(--surface-2); white-space: nowrap; }
.sur-mesure {
  max-width: 1100px; margin: 34px auto 0; padding: clamp(20px, 3vw, 32px); border-radius: 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px;
  border: 1px solid color-mix(in srgb, var(--orange) 45%, var(--ligne)); background: linear-gradient(135deg, color-mix(in srgb, var(--orange) 10%, var(--surface)), var(--surface) 65%); box-shadow: var(--ombre);
}
.sur-mesure > div { flex: 1 1 420px; min-width: 0; }
.sur-mesure h2 { margin: 0 0 10px; font-size: clamp(1.2rem, 1.8vw, 1.5rem); }
.sur-mesure p { margin: 0 0 8px; color: var(--doux); }
.sur-mesure p:last-child { margin-bottom: 0; color: var(--texte); font-weight: 600; }
.sur-mesure .sm-sur { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--orange); margin-bottom: 6px; }
.sur-mesure .btn { flex: none; }

/* ---------- éditeur ---------- */
html.ed-ouvert, html.ed-ouvert body { overflow: hidden; }
html.ed-ouvert .toast { z-index: 7100; }
.ed {
  --ed-fond: #e7e9ee; --ed-fond: color-mix(in srgb, var(--primary) 8%, #e8eaee);
  --bleu: #2563eb;
  position: fixed; inset: 0; z-index: 6000; display: flex; flex-direction: column;
  background: var(--ed-fond); color: var(--texte); font-size: 14px; line-height: 1.4;
  -webkit-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent;
}
.ed button { font-family: inherit; }
.ed h2 { font: 700 11.5px/1.2 var(--font-body, inherit); text-transform: uppercase; letter-spacing: .06em; color: var(--doux); margin: 0 0 10px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ed :focus-visible { outline: 2px solid var(--bleu); outline-offset: 1px; }

/* barre du haut */
.ed-barre { display: flex; align-items: center; gap: 4px; padding: 6px 10px; min-height: 52px; background: var(--surface); border-bottom: 1px solid var(--ligne); position: relative; z-index: 12; }
.ed-b {
  width: 38px; height: 38px; border: 0; border-radius: 10px; background: transparent; color: var(--texte); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; flex: none; padding: 0;
}
.ed-b:hover { background: var(--surface-2); }
.ed-b:disabled { opacity: .32; cursor: default; background: transparent; }
.ed-b.actif { background: color-mix(in srgb, var(--orange) 20%, transparent); }
.ed-nom {
  font: inherit; font-weight: 700; font-size: 15px; border: 1px solid transparent; border-radius: 8px; padding: 6px 8px; background: transparent;
  color: var(--texte); width: 24ch; max-width: 28vw; min-width: 60px; text-overflow: ellipsis; -webkit-user-select: text; user-select: text;
}
.ed-nom:hover { border-color: var(--ligne); }
.ed-nom:focus { border-color: var(--orange); outline: none; background: var(--surface); }
.ed-etat { display: inline-flex; align-items: center; gap: 5px; color: var(--doux); font-size: 12px; white-space: nowrap; margin-left: 4px; }
.ed-etat[data-etat="ok"] svg { color: var(--vert); }
.ed-etat[data-etat="ko"] { color: var(--rouge); }
.ed-souple { flex: 1; min-width: 4px; }
.ed-sep { width: 1px; height: 24px; background: var(--ligne); margin: 0 4px; flex: none; }
.ed-zoom-val { width: auto; min-width: 58px; padding: 0 6px; font: inherit; font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ed .ed-telecharger { min-height: 40px; padding: 0 18px; font-size: 14px; margin-left: 6px; flex: none; }
.ed .ed-signer { min-height: 40px; padding: 0 14px; font-size: 14px; margin-left: 6px; flex: none; background: var(--surface); }
/* « Enregistrer » dans le fichier du disque (Chrome, Edge) ; la pastille : des changements pas encore écrits dans le fichier */
.ed .ed-disque { position: relative; min-height: 40px; padding: 0 14px; font-size: 14px; margin-left: 6px; flex: none; background: var(--surface); }
.ed .ed-disque[hidden] { display: none; }
.ed .ed-disque.a-faire::after { content: ""; position: absolute; top: 5px; right: 5px; width: 8px; height: 8px; border-radius: 50%; background: var(--orange); }
.ed-export-signature { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ligne); }
.ed-export-signature p { margin: 0 0 8px; font-size: 12.5px; font-weight: 700; color: var(--doux); }
.ed-export-signature .ed-demander { margin-top: 8px; }
/* menus de la barre : Fichier, Édition, Page, Affichage, et le « ? » des gestes de base */
.ed-menus { display: flex; align-items: center; gap: 1px; margin: 0 2px; flex: none; }
.ed-menus button { height: 34px; padding: 0 10px; border: 0; border-radius: 8px; background: transparent; color: var(--texte); font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.ed-menus button:hover, .ed-menus button[aria-expanded="true"] { background: var(--surface-2); }
.ed-menus .ed-b-gestes { width: 26px; height: 26px; padding: 0; margin-left: 6px; border: 1px solid var(--ligne); border-radius: 50%; color: var(--doux); font-weight: 800; font-size: 13px; }
.ed-menus .ed-b-gestes:hover { border-color: var(--orange); color: var(--orange); background: transparent; }
.ed-b-plus { display: none; }
.ed-alerte { display: flex; gap: 8px; align-items: center; padding: 8px 14px; font-size: 13px; background: color-mix(in srgb, var(--rouge) 12%, var(--surface)); color: var(--rouge); border-bottom: 1px solid var(--ligne); }

/* corps : pages | travail | côté */
.ed-corps { flex: 1; min-height: 0; display: flex; position: relative; }
.ed-pages { width: 150px; flex: none; background: var(--surface); border-right: 1px solid var(--ligne); display: flex; flex-direction: column; min-height: 0; }
/* deux vues du document : ses vignettes, ou son plan en texte (un titre par page, sur trois niveaux) */
.ed-pages-vues { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid var(--ligne); flex: none; }
.ed-pages-vues button { height: 36px; padding: 0 2px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--doux); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.ed-pages-vues button:hover { color: var(--texte); background: var(--surface-2); }
.ed-pages-vues button[aria-selected="true"] { color: var(--texte); border-bottom-color: var(--orange); }
.ed-pages.plan { width: 270px; }
.ed-pages.plan .ed-vignettes { display: none; }
.ed-plan { flex: 1; overflow-y: auto; padding: 8px 6px; }
.ed-plan[hidden] { display: none; }
.ed-plan-ligne { display: flex; align-items: center; gap: 2px; padding: 1px 2px 1px calc(2px + var(--nv, 0) * 16px); border: 1px solid transparent; border-radius: 8px; }
.ed-plan-ligne.actif { background: color-mix(in srgb, var(--orange) 14%, var(--surface)); border-color: color-mix(in srgb, var(--orange) 55%, transparent); }
.ed-plan-num { width: 26px; height: 30px; flex: none; border: 0; border-radius: 6px; background: none; color: var(--doux); font: inherit; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; cursor: pointer; padding: 0; }
.ed-plan-num:hover { background: var(--surface-2); color: var(--texte); }
.ed-plan-ligne input { flex: 1; min-width: 0; height: 30px; padding: 0 6px; border: 1px solid transparent; border-radius: 6px; background: none; color: var(--texte); font: inherit; font-size: 13px; font-weight: 600; text-overflow: ellipsis; -webkit-user-select: text; user-select: text; }
.ed-plan-ligne[style*="--nv:1"] input, .ed-plan-ligne[style*="--nv:2"] input { font-weight: 500; }
.ed-plan-ligne input::placeholder { color: var(--doux); font-weight: 400; opacity: .75; }
.ed-plan-ligne input:hover { border-color: var(--ligne); }
.ed-plan-ligne input:focus { border-color: var(--orange); background: var(--surface); outline: none; }
.ed-plan-ligne .ed-mini { width: 22px; height: 26px; opacity: 0; }
.ed-plan-ligne:hover .ed-mini, .ed-plan-ligne.actif .ed-mini, .ed-plan-ligne:focus-within .ed-mini { opacity: 1; }
.ed-plan-ligne .ed-mini:disabled { opacity: 0; }
.ed-plan-ligne:hover .ed-mini:disabled, .ed-plan-ligne.actif .ed-mini:disabled { opacity: .25; }
.ed-plan-aide { padding: 12px 6px 4px; }
.ed-vig-titre { display: block; font-size: 11px; line-height: 1.25; color: var(--doux); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed-vig-titre:empty { display: none; }
.ed-texte { font: inherit; font-size: 13px; height: 32px; width: 100%; padding: 0 8px; border: 1px solid var(--ligne); border-radius: 8px; background: var(--surface); color: var(--texte); -webkit-user-select: text; user-select: text; }
.ed-texte:focus { border-color: var(--orange); outline: none; }
.ed-vignettes { flex: 1; overflow-y: auto; padding: 14px 16px 6px; display: flex; flex-direction: column; gap: 10px; }
.ed-vig { cursor: pointer; position: relative; flex: none; }
.ed-vig-cadre { position: relative; background: #fff; border-radius: 3px; box-shadow: 0 0 0 1px var(--ligne), 0 2px 6px rgba(0, 0, 0, .08); overflow: hidden; }
.ed-vig-cadre canvas, .ed-vig-cadre svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
.ed-vig.actif .ed-vig-cadre { box-shadow: 0 0 0 2px var(--orange), 0 2px 8px rgba(0, 0, 0, .14); }
.ed-vig-pied { display: flex; align-items: center; gap: 1px; margin-top: 3px; height: 24px; }
.ed-vig-num { flex: 1; font-size: 12px; color: var(--doux); font-variant-numeric: tabular-nums; padding-left: 2px; }
.ed-vig.actif .ed-vig-num { color: var(--texte); font-weight: 700; }
.ed-vig-pied button { width: 24px; height: 24px; border: 0; background: none; border-radius: 6px; color: var(--doux); cursor: pointer; opacity: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.ed-vig:hover .ed-vig-pied button, .ed-vig.actif .ed-vig-pied button, .ed-vig-pied button:focus-visible { opacity: 1; }
.ed-vig-pied button:hover { background: var(--surface-2); color: var(--texte); }
.glisse { z-index: 3; opacity: .85; pointer-events: none; }
.ed-vig.avant::before, .ed-vig.apres::after, .ed-calque.avant::before, .ed-calque.apres::after {
  content: ""; position: absolute; left: 0; right: 0; height: 3px; border-radius: 2px; background: var(--orange); pointer-events: none;
}
.ed-vig.avant::before { top: -7px; } .ed-vig.apres::after { bottom: -7px; }
.ed-calque.avant::before { top: -3px; } .ed-calque.apres::after { bottom: -3px; }
.tri, .tri * { cursor: grabbing !important; }
.ed-pages-pied { padding: 10px; border-top: 1px solid var(--ligne); display: grid; gap: 6px; }
.ed-petit {
  font-size: 12.5px; font-weight: 600; border: 1px solid var(--ligne); background: var(--surface); color: var(--texte); border-radius: 9px;
  padding: 7px 8px; cursor: pointer; display: flex; align-items: center; gap: 6px; justify-content: center; line-height: 1.2;
}
.ed-petit:hover { border-color: var(--orange); }
.ed-petit:disabled { opacity: .4; cursor: default; border-color: var(--ligne); }

.ed-travail { flex: 1; min-width: 0; position: relative; display: flex; flex-direction: column; }
.ed-zone { flex: 1; overflow: auto; scrollbar-gutter: stable; position: relative; overscroll-behavior: contain; touch-action: pan-x pan-y pinch-zoom; }
.ed-pile {
  --z: 1; --fond: 1;
  display: flex; flex-direction: column; align-items: center; gap: 22px; padding: 26px 28px 64px;
  min-width: max-content; min-height: 100%; box-sizing: border-box; position: relative;
}
.ed-page { position: relative; background: #fff; flex: none; box-shadow: 0 1px 3px rgba(0, 0, 0, .18), 0 8px 24px rgba(0, 0, 0, .10); }
.ed-page.choisie { z-index: 1; }
.ed-page.deborde { z-index: 2; }
.ed-apercu { position: absolute; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; }
.ed-page.pret .ed-apercu { opacity: var(--fond); }
.ed-net { position: absolute; inset: 0; overflow: hidden; opacity: var(--fond); }
.ed-net canvas { position: absolute; display: block; }
.ed-objets { position: absolute; inset: 0; width: 100%; height: 100%; display: block; overflow: hidden; }
.ed-page.deborde .ed-objets, .ed-page.choisie .ed-objets { overflow: visible; }
.ed-objets text, .ed-vig-cadre text { white-space: pre; font-family: Arial, Helvetica, "Liberation Sans", sans-serif; }
.ed-pile.grille .ed-page::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(to right, rgba(37, 99, 235, .16) 1px, transparent 1px), linear-gradient(to bottom, rgba(37, 99, 235, .16) 1px, transparent 1px);
  background-size: var(--pas) var(--pas);
}

/* objets : zones de clic élargies, calques verrouillés, sélection */
.touche { stroke-width: calc(var(--ep, 0) * 1px + 12px / var(--z)); stroke-linecap: round; stroke-linejoin: round; }
.ed-vig-cadre .touche { display: none; }
.calque.verrou { pointer-events: none; }
.cadre { fill: none; stroke: var(--bleu); stroke-width: calc(1.2px / var(--z)); pointer-events: none; }
.tige { stroke: var(--bleu); stroke-width: calc(1.2px / var(--z)); pointer-events: none; }
.poignee { fill: #fff; stroke: var(--bleu); stroke-width: calc(1.6px / var(--z)); cursor: move; touch-action: none; }
.poignee[data-k="nw"], .poignee[data-k="se"] { cursor: nwse-resize; }
.poignee[data-k="ne"], .poignee[data-k="sw"] { cursor: nesw-resize; }
.poignee[data-k="n"], .poignee[data-k="s"] { cursor: ns-resize; }
.poignee[data-k="e"], .poignee[data-k="w"] { cursor: ew-resize; }
.poignee[data-k="rot"] { cursor: grab; fill: var(--bleu); }
.survol-texte { fill: rgba(37, 99, 235, .1); stroke: var(--bleu); stroke-width: calc(1px / var(--z)); pointer-events: none; }
.lasso { fill: rgba(37, 99, 235, .1); stroke: var(--bleu); stroke-width: calc(1px / var(--z)); }

.ed-pile.outil-select .objet { cursor: move; touch-action: none; }
.ed-pile.outil-main, .ed-pile.espace, .ed-pile.espace * { cursor: grab !important; }
.ed-zone.saisit, .ed-zone.saisit * { cursor: grabbing !important; }
.ed-pile.outil-texte .ed-page { cursor: text; }
.ed-pile.outil-gomme .ed-page { cursor: var(--gomme, crosshair) !important; }
.ed-pile:not(.outil-select):not(.outil-main):not(.outil-texte) .ed-page { cursor: crosshair; }
.ed-pile:not(.outil-select):not(.outil-main) .ed-page { touch-action: none; }

.ed-saisie {
  position: absolute; z-index: 4; margin: 0; padding: 0; border: 0; outline: 1.5px dashed var(--bleu); outline-offset: 3px;
  background: rgba(255, 255, 255, .65); resize: none; overflow: hidden; white-space: pre; transform-origin: 0 0;
  -webkit-user-select: text; user-select: text; box-sizing: content-box; min-width: 2ch; border-radius: 0;
}

/* les outils, par familles : une ligne sous les menus (sur un téléphone : la barre du bas, plus loin) */
.ed-outils {
  display: flex; align-items: stretch; justify-content: center; padding: 5px 10px 4px; background: var(--surface); border-bottom: 1px solid var(--ligne);
  position: relative; z-index: 11; flex: none;
}
.ed-groupe { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 0 10px; border-left: 1px solid var(--ligne); min-width: 0; }
.ed-groupe:first-child { border-left: 0; }
.ed-groupe-outils { display: flex; gap: 2px; }
.ed-groupe-nom { font-size: 10.5px; line-height: 1.2; color: var(--doux); white-space: nowrap; }
.ed-groupe-tete, .ed-outil-nom { display: none; }
.ed-outils button[data-outil] {
  width: 38px; height: 34px; border: 0; border-radius: 9px; background: transparent; color: var(--texte); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; flex: none; padding: 0; position: relative;
}
.ed-outils button[data-outil]:hover { background: var(--surface-2); }
.ed-outils button[data-outil].actif { background: var(--orange); color: #21160a; }
.ed-outils button[data-outil].fixe::after { content: ""; position: absolute; right: 4px; bottom: 4px; width: 6px; height: 6px; border-radius: 50%; background: #21160a; }
.ed-contexte { display: none; }

.ed-pied { position: absolute; left: 12px; right: 12px; bottom: 12px; display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; pointer-events: none; z-index: 5; }
.ed-aide, .ed-info {
  background: var(--surface); border: 1px solid var(--ligne); border-radius: 999px; padding: 5px 12px; font-size: 12.5px; color: var(--doux);
  box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
}
.ed-aide:empty { visibility: hidden; }
.ed-info { white-space: nowrap; font-variant-numeric: tabular-nums; margin-left: auto; }

/* panneau de droite */
.ed-cote { width: 320px; flex: none; background: var(--surface); border-left: 1px solid var(--ligne); display: flex; flex-direction: column; min-height: 0; }
.ed-cote-tete { display: flex; align-items: stretch; border-bottom: 1px solid var(--ligne); flex: none; }
.ed-cote-onglets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); flex: 1; min-width: 0; }
.ed-cote-onglets button {
  position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; height: 52px; padding: 0 2px; min-width: 0;
  border: 0; border-bottom: 2px solid transparent; background: none; color: var(--doux); font: inherit; font-size: 10.5px; font-weight: 600; cursor: pointer;
}
.ed-cote-onglets button span { letter-spacing: -.015em; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed-cote-onglets button:hover { color: var(--texte); background: var(--surface-2); }
.ed-cote-onglets button[aria-selected="true"] { color: var(--texte); border-bottom-color: var(--orange); }
.ed-cote-onglets button[aria-selected="true"] svg { color: var(--orange); }
.ed-compte {
  position: absolute; top: 5px; left: calc(50% + 5px); min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; background: var(--orange); color: #21160a;
  font-style: normal; font-size: 10px; font-weight: 800; line-height: 16px; text-align: center;
}
.ed-compte[hidden] { display: none; }
.ed-cote-tete .ed-volet-fermer { display: none; }
.ed-bloc { padding: 14px; }
.ed-cote > .ed-bloc { display: none; flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.ed-cote[data-onglet="props"] > #ed-props, .ed-cote[data-onglet="calques"] > #ed-calques, .ed-cote[data-onglet="symboles"] > #ed-biblio, .ed-cote[data-onglet="notes"] > #ed-notes { display: block; }
.ed-cote > .ed-bloc[hidden] { display: none; }
.ed-sel-outil { font-size: 11.5px; color: var(--doux); white-space: nowrap; }
/* propriétés : deux champs côte à côte, nombres, boutons à texte */
.ed-duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; margin-bottom: 12px; }
.ed-duo .ed-champ { margin: 0; }
.ed-duo .ed-taille input { flex: 1; width: 100%; min-width: 0; }
.ed-attributs button { font-family: Georgia, "Times New Roman", serif; font-size: 16px; }
.ed-attributs button s { font-size: 13px; }
.ed-mots button { font-size: 13px; font-weight: 600; }
.ed-champ > .ed-nb, .ed-champ > .ed-note { margin-top: 2px; }
.ed-sous-titre { margin: 18px 0 10px; padding-top: 14px; border-top: 1px solid var(--ligne); font: 700 11.5px/1.2 var(--font-body, inherit); text-transform: uppercase; letter-spacing: .06em; color: var(--doux); }
.ed-grille2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 10px; }
.ed-nb { display: flex; align-items: center; gap: 6px; height: 32px; padding: 0 8px; border: 1px solid var(--ligne); border-radius: 8px; background: var(--surface); min-width: 0; cursor: text; }
.ed-nb span { font-size: 12px; font-weight: 700; color: var(--doux); flex: none; }
.ed-nb input { flex: 1; width: 100%; min-width: 0; border: 0; background: none; padding: 0; font: inherit; font-size: 13px; color: var(--texte); text-align: right; font-variant-numeric: tabular-nums; -moz-appearance: textfield; appearance: textfield; -webkit-user-select: text; user-select: text; }
.ed-nb input::-webkit-outer-spin-button, .ed-nb input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ed-nb input:focus { outline: none; }
.ed-nb input:disabled { color: var(--doux); }
.ed-nb:focus-within { border-color: var(--orange); }
.ed-nb i { font-style: normal; font-size: 11.5px; color: var(--doux); flex: none; }
.ed-prop.actif { border-color: var(--bleu); background: rgba(37, 99, 235, .1); color: var(--bleu); }
.ed-rang { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
.ed-rang .ed-petit { min-height: 34px; }
.ed-petit.danger:hover:not(:disabled) { border-color: var(--rouge); color: var(--rouge); }
.ed-lien { display: block; width: 100%; margin-top: 2px; padding: 4px; border: 0; background: none; font: inherit; font-size: 12.5px; color: var(--doux); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; text-align: center; }
.ed-lien:hover { color: var(--orange); }
.ed-pp-format { margin: -8px 0 14px; color: var(--doux); font-size: 12.5px; }
#ed-props .ed-vide { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--ligne); }
.ed-bloc textarea {
  font: inherit; font-size: 13.5px; width: 100%; border: 1px solid var(--ligne); border-radius: 8px; padding: 7px 9px; background: var(--surface); color: var(--texte);
  line-height: 1.4; resize: vertical; -webkit-user-select: text; user-select: text;
}
.ed-bloc textarea:focus { border-color: var(--orange); outline: none; }
/* commentaires : la liste, une carte par pastille */
.ed-notes-liste { display: grid; gap: 8px; margin: 12px 0; }
.ed-note-carte { border: 1px solid var(--ligne); border-radius: 12px; padding: 8px; background: var(--surface); cursor: pointer; }
.ed-note-carte:hover { border-color: color-mix(in srgb, var(--orange) 55%, var(--ligne)); }
.ed-note-carte.actif { border-color: var(--orange); box-shadow: 0 0 0 2px color-mix(in srgb, var(--orange) 25%, transparent); }
.ed-note-carte.masque { opacity: .55; }
.ed-note-tete { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.ed-note-num { min-width: 22px; height: 22px; padding: 0 5px; border-radius: 11px; background: var(--c); color: var(--e); font-size: 11.5px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; flex: none; font-variant-numeric: tabular-nums; }
.ed-note-page { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: left; border: 0; background: none; font: inherit; font-size: 12px; color: var(--doux); cursor: pointer; padding: 2px 0; }
.ed-note-page:hover { color: var(--texte); text-decoration: underline; }
.ed-note-carte textarea { display: block; min-height: 40px; resize: none; overflow: hidden; }
.ed-sel { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; gap: 8px; min-height: 28px; }
.ed-sel strong { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ed-sel-actions { display: flex; gap: 2px; flex: none; }
.ed-mini { width: 28px; height: 28px; border: 0; background: none; border-radius: 7px; color: var(--doux); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; flex: none; }
.ed-mini:hover { background: var(--surface-2); color: var(--texte); }
.ed-mini.danger:hover { color: var(--rouge); }
.ed-mini.marque { color: var(--orange); }
.ed-mini:disabled { opacity: .3; cursor: default; background: none; }
.ed-vide, .ed-note { color: var(--doux); font-size: 12.5px; margin: 0; line-height: 1.5; }
.ed-champ { display: grid; gap: 6px; margin: 0 0 12px; }
.ed-champ:last-child { margin-bottom: 0; }
.ed-champ > span { font-size: 12.5px; color: var(--doux); display: flex; justify-content: space-between; gap: 8px; }
.ed-champ output { font-variant-numeric: tabular-nums; color: var(--texte); }
.ed-champ select, .ed-bloc select {
  font: inherit; font-size: 13px; height: 32px; border: 1px solid var(--ligne); border-radius: 8px; background: var(--surface); color: var(--texte); padding: 0 6px; width: 100%;
}
.ed input[type="range"] { width: 100%; accent-color: var(--orange); margin: 0; height: 18px; }
.ed-pastilles { display: flex; flex-wrap: wrap; gap: 6px; }
.ed-pastille { width: 24px; height: 24px; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .2); background: var(--c); cursor: pointer; padding: 0; position: relative; flex: none; }
.ed-pastille.actif { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--bleu); }
.ed-pastille.aucun { background: linear-gradient(to top right, #fff calc(50% - 1px), #e02424 calc(50% - 1px), #e02424 calc(50% + 1px), #fff calc(50% + 1px)); }
.ed-pastille.perso { background: conic-gradient(#f43f5e, #f59e0b, #84cc16, #06b6d4, #6366f1, #d946ef, #f43f5e); overflow: hidden; display: inline-block; }
.ed-pastille.perso.actif { background: var(--c); }
.ed-pastille.perso input { opacity: 0; position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; border: 0; padding: 0; }
.ed-choix { display: flex; gap: 4px; }
.ed-choix button, .ed-taille button {
  flex: 1; min-width: 0; height: 32px; border: 1px solid var(--ligne); background: var(--surface); border-radius: 8px; color: var(--texte); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; padding: 0; font-size: 15px;
}
.ed-choix button.actif, .ed-taille button.actif { border-color: var(--bleu); background: rgba(37, 99, 235, .1); color: var(--bleu); }
.ed-taille { display: flex; gap: 4px; align-items: center; }
.ed-taille button { flex: none; width: 32px; }
.ed-taille input { width: 62px; text-align: center; font: inherit; height: 32px; border: 1px solid var(--ligne); border-radius: 8px; background: var(--surface); color: var(--texte); -webkit-user-select: text; user-select: text; }

/* couleur de calque */
.ed-point { display: block; width: 14px; height: 14px; border-radius: 50%; background: var(--c); border: 1px solid rgba(0, 0, 0, .25); }
.ed-point.vide { background: none; border: 1.5px dashed var(--doux); }
.ed-palette {
  position: fixed; z-index: 30; width: 232px; padding: 12px; background: var(--surface); border: 1px solid var(--ligne);
  border-radius: 12px; box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
}
.ed-palette p { margin: 0 0 8px; font-size: 11.5px; font-weight: 700; color: var(--doux); text-transform: uppercase; letter-spacing: .05em; }
.ed-palette .ed-large { margin-top: 12px; }
.ed-pastille.calque { box-shadow: inset 0 0 0 3px var(--surface); border: 2px solid var(--c); }
.ed-pastille.calque.actif { box-shadow: inset 0 0 0 3px var(--surface), 0 0 0 2px var(--surface), 0 0 0 4px var(--bleu); }
.ed-coul-calque-note { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; }

/* calques */
.ed-liste-calques { display: grid; gap: 2px; position: relative; }
.ed-calque { display: flex; align-items: center; gap: 4px; padding: 3px 4px; border-radius: 9px; border: 1px solid transparent; cursor: pointer; position: relative; background: var(--surface); }
.ed-calque:hover { background: var(--surface-2); }
.ed-calque.actif { background: color-mix(in srgb, var(--orange) 14%, var(--surface)); border-color: color-mix(in srgb, var(--orange) 55%, transparent); }
.ed-calque.masque .ed-calque-nom { opacity: .5; }
.ed-calque-nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; font-size: 13px; }
.ed-calque-nb { font-size: 11px; color: var(--doux); min-width: 18px; text-align: right; font-variant-numeric: tabular-nums; }
.ed-calque-champ { flex: 1; min-width: 0; font: inherit; font-size: 13px; font-weight: 600; border: 1px solid var(--orange); border-radius: 6px; padding: 2px 6px; background: var(--surface); color: var(--texte); outline: none; -webkit-user-select: text; user-select: text; }
.ed-fond { margin-top: 6px; padding-top: 9px; border-top: 1px dashed var(--ligne); border-radius: 0; cursor: default; flex-wrap: wrap; background: none; }
.ed-fond:hover { background: none; }
.ed-fond .ed-calque-nom { font-weight: 500; color: var(--doux); }
.ed-fond-op { flex: 1 1 100%; display: flex; align-items: center; gap: 8px; padding: 2px 4px 0 32px; font-size: 11.5px; color: var(--doux); }
.ed-calques-pied { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: 12px; color: var(--doux); }
.ed-calques-pied label { flex: 1; display: flex; align-items: center; gap: 8px; min-width: 0; }
.ed-calques-pied output { min-width: 40px; text-align: right; font-variant-numeric: tabular-nums; }

/* symboles */
.ed-bibs { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; }
.ed-bibs:empty { display: none; }
.ed-bibs button { font: inherit; font-size: 11.5px; font-weight: 600; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--ligne); background: var(--surface); color: var(--doux); cursor: pointer; }
.ed-bibs button:hover { border-color: var(--orange); color: var(--texte); }
.ed-bibs button[aria-pressed="true"] { border-color: var(--orange); background: color-mix(in srgb, var(--orange) 16%, var(--surface)); color: var(--texte); }
.ed-bibs button[aria-pressed="mixed"] { border-color: var(--orange); border-style: dashed; color: var(--texte); }
.ed-symboles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }   /* minmax(0, …) : sans lui, Safari élargit les colonnes au-delà du panneau */
.ed-symboles-zone { margin-bottom: 10px; }
.ed-symboles-titre { margin: 10px 0 6px; font-size: 11.5px; color: var(--doux); font-weight: 700; }
.ed-symboles-zone.seule .ed-symboles-titre { display: none; }
.ed-large { width: 100%; }
.ed-bloc .ed-large { margin-bottom: 12px; }
.ed-bloc #ed-symboles-choisir { margin-bottom: 0; }
.ed-demander { display: block; margin-top: 10px; font-size: 12px; color: var(--doux); text-align: center; text-decoration: underline; text-underline-offset: 2px; }
.ed-demander:hover { color: var(--orange); }
.ed-reinit { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin-top: 8px; padding: 4px; border: 0; background: none; font: inherit; font-size: 12px; color: var(--doux); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.ed-reinit:hover { color: var(--orange); }
.ed-reinit[hidden] { display: none; }
.ed-dlg footer .ed-sy-reinit { margin-right: auto; }
.ed-symboles button { aspect-ratio: 1; min-width: 0; border: 1px solid var(--ligne); border-radius: 9px; background: var(--surface); color: var(--texte); cursor: pointer; padding: 7px; }
.ed-symboles button:hover { border-color: var(--orange); }
.ed-symboles button.actif { border-color: var(--orange); background: color-mix(in srgb, var(--orange) 16%, var(--surface)); }
.ed-symboles svg { width: 100%; height: 100%; overflow: visible; display: block; }

/* export, menu, attente */
.ed-export {
  position: absolute; right: 10px; top: 56px; width: min(350px, calc(100vw - 20px)); z-index: 20; padding: 16px;
  background: var(--surface); border: 1px solid var(--ligne); border-radius: 16px; box-shadow: 0 16px 40px rgba(0, 0, 0, .22);
}
.ed-export label { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--ligne); border-radius: 12px; margin-bottom: 8px; cursor: pointer; }
.ed-export .ed-export-liste[hidden] { display: none; }
.ed-export label:has(input:checked) { border-color: var(--orange); background: color-mix(in srgb, var(--orange) 8%, var(--surface)); }
.ed-export input { margin-top: 3px; accent-color: var(--orange); flex: none; }
.ed-export strong { display: block; font-size: 14px; }
.ed-export small { display: block; color: var(--doux); font-size: 12.5px; line-height: 1.45; }
.ed-export .ed-note { margin: 0 0 10px; color: var(--ambre); }
.ed-ocr { right: auto; left: 10px; }
.ed-ocr label { align-items: center; padding: 8px 12px; margin-bottom: 6px; }
.ed-ocr input { margin-top: 0; width: 18px; height: 18px; }
.ed-ocr-d { margin: 0 0 12px; color: var(--doux); font-size: 12.5px; line-height: 1.5; }
.ed-ocr-l { margin: 0 0 6px; font-size: 12.5px; font-weight: 700; }
.ed-occupe .btn { min-height: 42px; padding: 0 20px; margin-top: 4px; background: var(--surface); }
.ed-export .btn { width: 100%; min-height: 44px; font-size: 14px; margin-top: 4px; }
.ed-menu {
  position: fixed; z-index: 30; min-width: 210px; padding: 6px; background: var(--surface); border: 1px solid var(--ligne);
  border-radius: 12px; box-shadow: 0 12px 32px rgba(0, 0, 0, .22);
}
.ed-menu button { display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 18px; border: 0; background: none; font-size: 13.5px; color: var(--texte); padding: 7px 10px; border-radius: 8px; cursor: pointer; text-align: left; }
.ed-menu button:hover { background: var(--surface-2); }
.ed-menu button.danger { color: var(--rouge); }
.ed-menu button:disabled { opacity: .4; cursor: default; background: none; }
.ed-menu button > span { display: inline-flex; align-items: center; gap: 8px; }
.ed-menu .ed-coche { width: 16px; height: 15px; flex: none; display: inline-flex; color: var(--orange); }
.ed-menu kbd { border: 0; background: none; padding: 0; color: var(--doux); font-size: 11.5px; }
.ed-menu hr { border: 0; border-top: 1px solid var(--ligne); margin: 5px 0; }
.ed-menu p { margin: 6px 10px 3px; font-size: 11px; color: var(--doux); text-transform: uppercase; letter-spacing: .05em; }
.ed-occupe {
  position: fixed; inset: 0; z-index: 7000; background: rgba(255, 255, 255, .78); display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px; font-weight: 700; color: var(--texte);
}
.ed-occupe svg { color: var(--orange); animation: ed-tourne 1s linear infinite; }
@keyframes ed-tourne { to { transform: rotate(360deg); } }

/* dialogues : signature, tampon, choix des symboles */
.ed-dialogue { position: absolute; inset: 0; z-index: 40; background: rgba(10, 16, 32, .45); display: flex; align-items: center; justify-content: center; padding: 16px; }
.ed-dlg {
  width: min(560px, 100%); max-height: 100%; display: flex; flex-direction: column; background: var(--surface); border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35); overflow: hidden; -webkit-user-select: text; user-select: text;
}
.ed-dlg-large { width: min(900px, 100%); }
.ed-dlg > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px 12px 20px; border-bottom: 1px solid var(--ligne); }
.ed-dlg > header h2 { margin: 0; font-size: 15px; text-transform: none; letter-spacing: 0; color: var(--texte); }
.ed-dlg-corps { padding: 16px 20px; overflow-y: auto; flex: 1; min-height: 0; }
.ed-dlg > footer { display: flex; justify-content: flex-end; gap: 10px; padding: 12px 20px; border-top: 1px solid var(--ligne); background: var(--surface-2); }
.ed-dlg .btn { min-height: 42px; padding: 0 20px; font-size: 14px; }
.ed-dlg input[type="text"], .ed-dlg input[type="search"] {
  font: inherit; font-size: 15px; height: 40px; width: 100%; border: 1px solid var(--ligne); border-radius: 10px; padding: 0 12px;
  background: var(--surface); color: var(--texte);
}
.ed-dlg input:focus { border-color: var(--orange); outline: none; }
.ed-dlg .ed-note { margin: 8px 0 0; }
.ed-dlg .ed-champ > input[type="text"] { height: 38px; font-size: 14px; }
.ed-infos { display: grid; grid-template-columns: minmax(110px, auto) 1fr; gap: 6px 14px; margin: 14px 0 0; font-size: 13px; }
.ed-infos dt { color: var(--doux); }
.ed-infos dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.ed-infos-h { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--ligne); font-size: 13px; overflow-wrap: anywhere; }
.ed-onglets { display: flex; gap: 4px; padding: 4px; border-radius: 12px; background: var(--surface-2); margin-bottom: 12px; }
.ed-onglets button { flex: 1; height: 36px; border: 0; border-radius: 9px; background: none; color: var(--doux); font-weight: 700; font-size: 13.5px; cursor: pointer; }
.ed-onglets button[aria-selected="true"] { background: var(--surface); color: var(--texte); box-shadow: 0 1px 4px rgba(0, 0, 0, .12); }
#ed-sig-pad { display: block; width: 100%; aspect-ratio: 1200 / 440; border: 2px dashed var(--ligne); border-radius: 14px; background: #fff; touch-action: none; cursor: crosshair; }
#ed-sig-nom { height: 84px !important; font: 44px/1 Caveat, "Segoe Script", "Brush Script MT", cursive !important; color: #1a3fb3; text-align: center; }
#ed-sig-apercu { display: block; max-width: 100%; max-height: 150px; margin: 12px auto 0; background: #fff; border: 1px solid var(--ligne); border-radius: 10px; padding: 8px; }
.ed-sig-options { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 14px; font-size: 13px; color: var(--doux); }
.ed-case { display: flex; align-items: center; gap: 8px; cursor: pointer; margin-left: auto; color: var(--texte); }
.ed-case input { width: 18px; height: 18px; accent-color: var(--orange); }
.ed-sig-gardee { display: flex; align-items: center; gap: 14px; padding: 10px 12px; margin-bottom: 14px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--orange) 45%, var(--ligne)); background: color-mix(in srgb, var(--orange) 7%, var(--surface)); }
.ed-sig-gardee img { height: 54px; max-width: 170px; object-fit: contain; background: #fff; border-radius: 8px; padding: 4px; flex: none; }
.ed-sig-gardee div { display: grid; gap: 6px; font-size: 13px; }
.ed-sig-gardee .btn { min-height: 34px; padding: 0 16px; font-size: 13px; }
.btn-lien { font: inherit; font-size: 13px; background: none; border: 0; color: var(--doux); text-decoration: underline; cursor: pointer; padding: 4px; }
.ed-dlg-tp { width: min(640px, 100%); }
/* tampon : les réglages à gauche, l'aperçu à droite, qui reste en vue quand les réglages défilent */
.ed-tp { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.ed-tp-reglages { grid-column: 1; grid-row: 1; min-width: 0; }
.ed-tp-cote { grid-column: 2; grid-row: 1; position: sticky; top: 4px; display: grid; gap: 10px; min-width: 0; }
/* un quadrillage léger derrière l'aperçu, comme un plan : le fond blanc d'un tampon s'y voit */
.ed-tp-vue {
  background: linear-gradient(#e9edf3 1px, transparent 1px) -1px -1px / 14px 14px, linear-gradient(90deg, #e9edf3 1px, transparent 1px) -1px -1px / 14px 14px, #fff;
  border: 1px solid var(--ligne); border-radius: 14px; padding: 18px;
}
.ed-tp-vue svg { display: block; width: 100%; height: auto; max-height: 230px; overflow: visible; }
.ed-tp-garder { min-height: 36px; }
.ed-tp-garder-bas { display: none; }
/* « Mes tampons » : les tampons gardés sur l'appareil, à reprendre d'un clic */
.ed-tp-miens { margin: 0 0 16px; }
.ed-tp-sous { margin: 0 0 8px; font-size: 12.5px; color: var(--doux); display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.ed-tp-sous small { font-size: 12px; }
.ed-tp-sous small[hidden] { display: none; }
/* compte « plus » : une petite marque sur les tampons restés sur l'appareil, et le lien qui les met dans le compte */
.ed-tp-mien-ici { position: absolute; left: 5px; bottom: 5px; width: 20px; height: 18px; border-radius: 6px; border: 1px solid var(--ligne); background: var(--surface); color: var(--doux); display: inline-flex; align-items: center; justify-content: center; pointer-events: none; }
.ed-tp-monter { display: inline-flex; align-items: center; gap: 6px; text-align: left; }
.ed-tp-monter[hidden] { display: none; }
.ed-tp-monter svg { flex: none; }
.ed-tp-rang { display: flex; gap: 10px; overflow-x: auto; padding: 6px 6px 8px 2px; scrollbar-width: thin; }
.ed-tp-mien { position: relative; flex: none; }
.ed-tp-mien-b { display: block; width: 112px; height: 66px; padding: 7px; border: 1px solid var(--ligne); border-radius: 12px; background: #fff; cursor: pointer; }
.ed-tp-mien-b:hover, .ed-tp-mien-b:focus-visible { border-color: var(--orange); outline: none; box-shadow: 0 0 0 2px color-mix(in srgb, var(--orange) 30%, transparent); }
.ed-tp-mien-b svg { display: block; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.ed-tp-mien-x {
  position: absolute; top: -6px; right: -6px; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 12px; border: 1px solid var(--ligne); background: var(--surface);
  color: var(--doux); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; font: inherit; font-size: 12px; font-weight: 700; line-height: 1; white-space: nowrap;
}
.ed-tp-mien-x:hover, .ed-tp-mien-x.sur { color: #fff; background: var(--rouge); border-color: var(--rouge); }
/* « Personnaliser » : replié tant qu'on ne s'en sert pas */
.ed-tp-plus {
  display: flex; align-items: center; gap: 8px; width: 100%; margin-top: 16px; padding: 10px 12px; border: 1px solid var(--ligne); border-radius: 12px; background: var(--surface-2);
  color: var(--texte); font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; text-align: left;
}
.ed-tp-plus:hover { border-color: var(--orange); }
.ed-tp-plus svg:first-child { color: var(--orange); flex: none; }
.ed-tp-plus svg:last-child { margin-left: auto; flex: none; color: var(--doux); transition: transform .15s; }
.ed-tp-plus[aria-expanded="true"] svg:last-child { transform: rotate(180deg); }
.ed-tp-perso { padding: 14px 2px 0; }
.ed-tp-perso .ed-champ:last-child { margin-bottom: 12px; }
.ed-dlg textarea {
  font: inherit; font-size: 15px; width: 100%; min-height: 84px; border: 1px solid var(--ligne); border-radius: 10px; padding: 9px 12px; background: var(--surface); color: var(--texte);
  resize: vertical; line-height: 1.35; -webkit-user-select: text; user-select: text;
}
.ed-dlg textarea:focus { border-color: var(--orange); outline: none; }
.ed-tp-choix button { height: 38px; font-size: 16px; font-weight: 700; }
.ed-tp-choix svg { flex: none; }
.ed-dlg .ed-tp-rond-note { margin: 0; }
.ed-tp-logo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ed-tp-logo .ed-petit { min-height: 38px; padding: 0 12px; cursor: pointer; }
.ed-tp-teinte { margin: 4px 0 0; font-size: 13px; }
.ed-tp-teinte[hidden] { display: none; }
.ed-tp-fond { margin: 2px 0 12px; font-size: 13px; align-items: flex-start; line-height: 1.35; }
.ed-tp-fond input { flex: none; margin: 0; }
.ed-tp-note { display: grid; gap: 2px; justify-items: start; margin: 0 !important; padding-top: 10px; border-top: 1px solid var(--ligne); }
.ed-apercu-objet text { white-space: pre; font-family: Arial, Helvetica, "Liberation Sans", sans-serif; }
.ed-sy-barre { display: flex; align-items: center; gap: 14px; padding: 12px 20px; border-bottom: 1px solid var(--ligne); }
.ed-sy-barre input { flex: 1; }
.ed-sy-barre span { font-size: 13px; color: var(--doux); white-space: nowrap; }
.ed-sy-bib + .ed-sy-bib { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--ligne); }
.ed-sy-bib > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.ed-sy-bib h3 { margin: 0; font-size: 15px; }
.ed-sy-bib h3 small { font-weight: 500; color: var(--doux); font-size: 12.5px; margin-left: 6px; }
.ed-sy-bib > header span { display: flex; gap: 6px; }
.ed-sy-groupe { margin: 14px 0 8px; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--doux); }
.ed-sy-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; }
.ed-sy-grille button {
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 6px 8px; border: 1px solid var(--ligne); border-radius: 12px;
  background: var(--surface); color: var(--texte); cursor: pointer; position: relative; min-height: 92px;
}
.ed-sy-grille svg { width: 40px; height: 40px; overflow: visible; flex: none; }
.ed-sy-grille span { font-size: 11px; line-height: 1.25; text-align: center; color: var(--doux); }
.ed-sy-grille button:hover { border-color: var(--orange); }
.ed-sy-grille button[aria-pressed="true"] { border-color: var(--orange); background: color-mix(in srgb, var(--orange) 12%, var(--surface)); }
.ed-sy-grille button[aria-pressed="true"]::after {
  content: ""; position: absolute; top: 6px; right: 6px; width: 14px; height: 14px; border-radius: 50%; background: var(--orange)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2321160a' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L20 7'/%3E%3C/svg%3E") center / 10px no-repeat;
}
@media (max-width: 640px) {
  .ed-tp { grid-template-columns: 1fr; gap: 14px; }
  .ed-tp-reglages, .ed-tp-cote { grid-column: 1; grid-row: auto; }
  .ed-tp-cote { top: 0; z-index: 2; margin: 0 -20px; padding: 8px 20px; background: var(--surface); border-bottom: 1px solid var(--ligne); }
  .ed-tp-cote .ed-tp-garder { display: none; }
  .ed-tp-garder-bas { display: flex; margin-top: 16px; }
  .ed-tp-vue { padding: 10px; }
  .ed-tp-vue svg { max-height: 118px; }
}
@media (pointer: coarse) { .ed-tp-mien-x { min-width: 36px; height: 36px; top: -8px; right: -8px; border-radius: 18px; } .ed-tp-rang { padding-top: 10px; padding-right: 10px; } .ed-tp-choix button, .ed-tp-logo .ed-petit { height: 42px; min-height: 42px; } .ed-tp-plus { min-height: 46px; } .ed-tp-garder { min-height: 42px; } .ed-dlg > header .ed-mini { width: 40px; height: 40px; } .ed-dlg .btn-lien { min-height: 38px; padding: 8px 6px; } .ed-tp-fond, .ed-tp-teinte { min-height: 38px; align-items: center; } }

@media (min-width: 861px) {
  .ed.sans-pages .ed-pages, .ed.sans-cote .ed-cote { display: none; }
}
/* un écran large mais serré : la barre du haut se resserre avant de déborder */
@media (min-width: 861px) and (max-width: 1500px) {
  .ed-etat span { display: none; }
  .ed-etat { margin-left: 8px; }
}
@media (min-width: 861px) and (max-width: 1240px) {
  .ed-nom { width: 16ch; }
  .ed .ed-signer span, .ed .ed-disque span { display: none; }
  .ed .ed-signer, .ed .ed-disque { padding: 0 11px; }
  .ed-ajuster { display: none; }
  .ed-menus button { padding: 0 8px; }
}
@media (min-width: 861px) and (max-width: 1020px) {
  .ed-nom { width: 11ch; min-width: 0; }
  .ed .ed-telecharger span { display: none; }
  .ed .ed-telecharger { padding: 0 12px; }
  .ed-groupe { padding: 0 6px; }
  .ed-cote { width: 280px; }
  .ed-pages { width: 118px; }
}
/* « Les gestes de base » : la carte d'aide */
.ed-gestes { position: absolute; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(1, 18, 61, .45); }
.ed-gestes[hidden] { display: none; }
.ed-gestes-carte { width: min(460px, 100%); max-height: 100%; overflow-y: auto; background: var(--surface); border-radius: 20px; padding: 22px 24px; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); }
.ed-gestes-carte h2 { margin: 0 0 12px; font-size: 1.25rem; text-transform: none; letter-spacing: 0; color: var(--texte); }
.ed-gestes-carte ul { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 10px; }
.ed-gestes-carte li { padding-left: 14px; border-left: 3px solid var(--orange); line-height: 1.45; }
.ed-gestes-carte .btn { width: 100%; justify-content: center; }

/* ---------- téléphone et tablette debout ----------
   En haut : le nom, annuler, télécharger et le menu. En bas : une famille d'outils par bouton. Le volet (propriétés, calques,
   symboles, commentaires) monte du bas de l'écran et laisse la page visible au-dessus. */
@media (max-width: 860px) {
  .ed-menus, .ed-etat, .ed-souple, .ed-barre .ed-sep, .ed-ajuster, .ed-pied, .ed-groupe-nom { display: none; }
  .ed-b-plus { display: inline-flex; }
  .ed-barre { gap: 2px; padding: 6px; }
  .ed-barre .ed-b { width: 36px; height: 36px; }
  .ed-barre .ed-zoom-val { width: auto; min-width: 50px; }
  .ed-nom { flex: 1; width: auto; max-width: none; min-width: 40px; }
  .ed .ed-telecharger { padding: 0 12px; margin-left: 2px; }
  .ed .ed-telecharger span { display: none; }
  .ed .ed-signer, .ed .ed-disque { padding: 0 10px; margin-left: 2px; }
  .ed .ed-signer span, .ed .ed-disque span { display: none; }
  .ed-export, .ed-ocr { left: 10px; right: 10px; width: auto; }
  /* les pages : un volet à gauche, ouvert depuis le menu */
  .ed-pages { position: absolute; top: 0; bottom: 0; left: 0; z-index: 10; display: none; box-shadow: 0 0 40px rgba(0, 0, 0, .25); }
  .ed.avec-pages .ed-pages { display: flex; }
  .ed-vig-pied button { opacity: 1; width: 30px; height: 30px; }
  .ed-pile { padding: 20px 14px 86px; }
  /* la barre d'outils du bas */
  .ed-outils { order: 3; justify-content: stretch; align-items: stretch; padding: 4px 4px calc(4px + env(safe-area-inset-bottom, 0px)); border-bottom: 0; border-top: 1px solid var(--ligne); z-index: 12; }
  .ed-groupe { flex: 1 1 0; padding: 0; border: 0; position: static; display: block; }
  .ed-groupe-tete {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 100%; height: 52px; min-width: 0; padding: 0 2px; flex: 1 1 0;
    border: 0; border-radius: 12px; background: none; color: var(--texte); font: inherit; font-size: 10.5px; font-weight: 600; cursor: pointer;
  }
  .ed-groupe-tete > span:last-child { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--doux); }
  .ed-groupe-ic { display: inline-flex; }
  .ed-groupe-tete.actif { background: color-mix(in srgb, var(--orange) 20%, transparent); }
  .ed-groupe-tete.actif > span:last-child, .ed-groupe-tete[aria-expanded="true"] > span:last-child { color: var(--texte); }
  .ed-groupe-tete[aria-expanded="true"] { background: var(--surface-2); }
  .ed-b-symboles .ed-groupe-ic { color: var(--orange); }
  .ed-groupe-outils { display: none; }
  /* une famille dépliée : ses outils, avec leur nom, juste au-dessus de la barre */
  .ed-groupe.ouvert .ed-groupe-outils {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: 6px; position: absolute; left: 8px; right: 8px; bottom: calc(100% + 8px); padding: 8px;
    background: var(--surface); border: 1px solid var(--ligne); border-radius: 16px; box-shadow: 0 -8px 30px rgba(0, 0, 0, .22); z-index: 15;
  }
  .ed-outils .ed-groupe.ouvert button[data-outil] { width: auto; height: auto; min-height: 58px; flex-direction: column; gap: 4px; padding: 8px 4px; border: 1px solid var(--ligne); border-radius: 12px; }
  .ed-outils .ed-groupe.ouvert button[data-outil].actif { border-color: var(--orange); }
  .ed-outil-nom { display: block; font-size: 11.5px; font-weight: 600; line-height: 1.15; text-align: center; }
  /* ce qui se fait sur l'objet choisi, ou les réglages de l'outil en main */
  .ed-contexte {
    position: absolute; left: 50%; transform: translateX(-50%); bottom: 10px; z-index: 6; display: flex; align-items: center; gap: 2px; padding: 4px; max-width: calc(100% - 16px);
    background: var(--surface); border: 1px solid var(--ligne); border-radius: 999px; box-shadow: 0 8px 24px rgba(0, 0, 0, .2);
  }
  .ed-contexte[hidden] { display: none; }
  .ed-contexte button {
    height: 44px; min-width: 44px; padding: 0 10px; border: 0; border-radius: 999px; background: none; color: var(--texte); font: inherit; font-size: 13.5px; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; white-space: nowrap; min-height: 44px;
  }
  .ed-contexte .ed-ctx-principal { background: var(--orange); color: #21160a; padding: 0 16px; }
  .ed-contexte .ed-ctx-outil { padding: 0 16px; }
  .ed-contexte .ed-ctx-outil span { overflow: hidden; text-overflow: ellipsis; }
  .ed-contexte button.danger { color: var(--rouge); }
  /* le volet, en bas */
  .ed-cote {
    position: absolute; left: 0; right: 0; bottom: 0; top: auto; width: auto; height: min(46vh, 440px); z-index: 20; display: none;
    border-left: 0; border-top: 1px solid var(--ligne); border-radius: 18px 18px 0 0; box-shadow: 0 -12px 40px rgba(0, 0, 0, .28); overflow: hidden;
  }
  .ed-cote[data-onglet="symboles"] { height: min(64vh, 560px); }
  .ed.ed-volet .ed-cote { display: flex; }
  .ed.ed-volet .ed-outils { display: none; }
  .ed.ed-volet .ed-pile { padding-bottom: 66vh; }
  .ed-cote-onglets button { height: 54px; }
  .ed-cote-tete .ed-volet-fermer { display: inline-flex; width: 46px; height: auto; align-self: stretch; border-radius: 0; border-left: 1px solid var(--ligne); }
  #ed-style .ed-large[data-a="modifier"] { display: none; }   /* « Modifier le texte » est déjà dans la barre de l'objet */
  .ed-cote > .ed-bloc { padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); overflow-x: hidden; }
  .ed-cote .ed-symboles { grid-template-columns: repeat(auto-fill, minmax(50px, 1fr)); }   /* six à sept symboles par rang sur un téléphone */
  .ed-cote .ed-symboles button { padding: 6px; }
  /* le menu : une feuille qui monte du bas, avec les quatre menus à la suite */
  .ed-menu.feuille {
    left: 0 !important; right: 0; top: auto !important; bottom: 0; min-width: 0; max-height: 82vh; overflow-y: auto; overscroll-behavior: contain;
    padding: 10px 10px calc(14px + env(safe-area-inset-bottom, 0px)); border: 0; border-radius: 18px 18px 0 0; box-shadow: 0 0 0 100vmax rgba(1, 18, 61, .4), 0 -12px 40px rgba(0, 0, 0, .3);
  }
  .ed-menu.feuille button { min-height: 46px; font-size: 15px; padding: 8px 12px; }
  .ed-menu.feuille p { margin: 10px 12px 4px; font-size: 11.5px; }
  .ed-menu.feuille kbd { display: none; }
}
@media (max-width: 600px) {
  .ed-barre .ed-zoom-val, #ed-zoom-moins, #ed-zoom-plus { display: none; }   /* deux doigts écartés agrandissent ; le menu garde les commandes de zoom */
}
@media (max-width: 400px) {
  /* la barre tient dans l'écran : rétablir passe dans le menu, et le nom garde la place qui reste */
  .ed-barre #ed-retablir { display: none; }
  .ed-barre .ed-nom { min-width: 30px; padding: 6px 4px; }
  .ed-groupe-tete { font-size: 10px; }
}
/* au doigt : des commandes assez grandes dans le volet */
@media (pointer: coarse) {
  .ed-cote .ed-choix button, .ed-cote .ed-taille button, .ed-cote .ed-taille input, .ed-cote .ed-nb, .ed-cote select, .ed-rang .ed-petit, .ed-cote .ed-large { height: 44px; min-height: 44px; }
  .ed-cote .ed-taille button { width: 44px; }
  .ed-cote .ed-pastille { width: 34px; height: 34px; }
  .ed-plan-ligne input, .ed-plan-num, .ed-texte { height: 44px; font-size: 16px; }
  .ed-plan-num { width: 34px; font-size: 14px; }
  .ed-plan-ligne .ed-mini { width: 36px; height: 44px; opacity: 1; }
  .ed-pages-vues button { height: 44px; font-size: 13px; }
  .ed-pages.plan { width: min(330px, 88vw); }
  .ed-cote .ed-pastilles { gap: 8px; }
  .ed-cote .ed-mini { width: 44px; height: 44px; }
  .ed-cote input[type="range"] { height: 32px; }
  .ed-lien { padding: 12px 4px; }
  .ed-note-page { padding: 12px 0; }
  .ed-cote select, .ed-cote .ed-nb input, .ed-cote .ed-taille input, .ed-bloc textarea { font-size: 16px; }
}
@media (pointer: coarse) and (min-width: 861px) {
  .ed-outils button[data-outil] { width: 44px; height: 44px; }
  .ed-menus button { height: 44px; }
}
@media (pointer: coarse) { .ed-nom, .ed input[type="text"], .ed input[type="search"], .ed textarea { font-size: 16px; } }   /* sous 16 px, l'iPhone agrandit la page au toucher d'un champ */
@media print { .ed, .ed-occupe { display: none !important; } }