/* ============================================================
   Alixo — design plat, inspiré Google Docs / Drive
   Fonds unis, bordures fines, pas de dégradés ni de flou.
   ============================================================ */

:root {
  --font-ui: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif;
  --font-serif: "Iowan Old Style", Palatino, Georgia, "Times New Roman", serif;
  --font-math: "STIX Two Math", "Cambria Math", "Latin Modern Math", Georgia, serif;
  --font-mono: "SF Mono", ui-monospace, Consolas, monospace;

  --topbar-h: 56px;
  --toolbar-h: 44px;
  --tabbar-h: 0px;               /* 36px quand des séances sont ouvertes en onglets (body.has-tabs) */

  /* Mode clair */
  --bg: #f6f7f9;
  --surface: #ffffff;
  --border: #dadce0;
  --ink: #202124;
  --ink-2: #5f6368;
  --ink-3: #9198a1;
  --hover: rgba(32, 33, 36, .06);
  --paper: #ffffff;

  --tint: #33658a;               /* teinte du dossier courant (posée par le JS) */
  --tint-soft: color-mix(in srgb, var(--tint) 12%, transparent);

  --ok: #2e8b6a; --warn: #b3762a; --danger: #c04343;
  --c-demand: #b0483f; --c-supply: #2f7d68; --c-third: #3d6bb5;

  --r: 8px;
}

html[data-theme="dark"] {
  --bg: #141414;
  --surface: #1f1f1f;
  --border: #3c4043;
  --ink: #e8eaed;
  --ink-2: #bdc1c6;
  --ink-3: #80868b;
  --hover: rgba(255, 255, 255, .08);
  --paper: #1f1f1f;
  --tint-soft: color-mix(in srgb, var(--tint) 20%, transparent);
  --c-demand: #d8756b; --c-supply: #52ab90; --c-third: #6d95d8;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

[hidden] { display: none !important; }

html, body { height: 100%; }

body {
  font-family: var(--font-ui);
  color: var(--ink);
  background: var(--bg);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}

button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
input, textarea { font: inherit; color: inherit; }
svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
::selection { background: color-mix(in srgb, var(--tint) 25%, transparent); }

/* Ancien matériau « verre » → panneau plat */
.glass {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r);
}

/* ============================================================
   Barre supérieure — pleine largeur, collée en haut
   ============================================================ */
#topbar {
  position: fixed; top: 0; left: 0; right: 0;
  height: var(--topbar-h); z-index: 60;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 12px 0 8px;
  background: var(--surface);
  border: none; border-bottom: 1px solid var(--border);
  border-radius: 0;
}

.tb-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
.logo { display: flex; align-items: center; gap: 9px; padding: 5px 10px 5px 6px; border-radius: 6px; }
.logo:hover { background: var(--hover); }
.logo-mark {
  width: 30px; height: 30px; border-radius: 7px;
  display: grid; place-items: center;
  background: #33658a;      /* couleur fixe, indépendante du dossier courant */
  color: #fff; font-family: var(--font-serif); font-size: 18px; font-weight: 600;
}
.logo-name { font-weight: 600; letter-spacing: -.01em; font-size: 16px; }

.crumbs { display: flex; align-items: center; gap: 6px; color: var(--ink-2); font-size: 13.5px; white-space: nowrap; overflow: hidden; }
#tb-title {
  border: 1px solid transparent; background: none; outline: none;
  font-size: 14.5px; font-weight: 550; color: var(--ink);
  padding: 4px 8px; border-radius: 6px;
  field-sizing: content; min-width: 70px; max-width: 38vw;
}
#tb-title:hover { border-color: var(--border); }
#tb-title:focus { border-color: var(--tint); }
#tb-title::placeholder { color: var(--ink-3); }
.crumbs .sep { opacity: .45; }
.crumbs .crumb-root { padding: 3px 8px; border-radius: 6px; color: var(--ink-2); font-size: 13.5px; }
.crumbs .crumb-root:hover { background: var(--hover); color: var(--ink); }
.crumbs .chip {
  padding: 3px 10px; border-radius: 6px; font-weight: 550; font-size: 13.5px;
  background: var(--tint-soft);
  color: color-mix(in srgb, var(--tint) 75%, var(--ink));
}
.crumbs button.chip { cursor: pointer; }
.crumbs button.chip:hover { background: color-mix(in srgb, var(--tint) 22%, transparent); }

.tb-right { display: flex; align-items: center; gap: 4px; }
.tbtn {
  width: 38px; height: 38px; border-radius: 6px; display: grid; place-items: center;
  color: var(--ink-2); transition: background .12s, color .12s;
}
.tbtn:hover { background: var(--hover); color: var(--ink); }
.tbtn svg { width: 19px; height: 19px; }

/* ============================================================
   Barre d'outils de l'éditeur — sous la barre supérieure
   ============================================================ */
#toolbar {
  position: fixed; top: calc(var(--topbar-h) + var(--tabbar-h)); left: 0; right: 0;
  height: var(--toolbar-h); z-index: 50;
  display: flex; align-items: center; gap: 2px;
  padding: 0 14px;
  background: var(--surface);
  border: none; border-bottom: 1px solid var(--border);
  border-radius: 0;
}
#toolbar button {
  width: 36px; height: 34px; border-radius: 6px; display: grid; place-items: center;
  color: var(--ink-2); transition: background .12s, color .12s;
}
#toolbar button:hover { background: var(--hover); color: var(--ink); }
#toolbar button svg { width: 19px; height: 19px; }
#toolbar .tt { font-family: var(--font-serif); font-weight: 700; font-size: 14px; font-style: italic; }
#toolbar .tlabel { font-size: 14px; }
#toolbar b.tlabel, #toolbar i.tlabel, #toolbar u.tlabel, #toolbar s.tlabel { font-size: 14px; }
#toolbar [data-menu="size"] { width: auto; padding: 0 8px; display: flex; align-items: center; gap: 3px; }
#toolbar .tcaret { font-size: 9px; color: var(--ink-3); }
#toolbar .tb-sep { width: 1px; height: 20px; background: var(--border); margin: 0 7px; flex: none; }
#toolbar .color-ico { font-weight: 700; font-size: 14px; line-height: 1.1; border-bottom: 3px solid #c04343; padding: 0 1px; }
#toolbar .hl-swatch {
  padding: 0 5px; border-radius: 4px; font-size: 12.5px; font-weight: 600;
  background: rgba(233, 196, 106, .55); color: var(--ink);
}

/* ============================================================
   Bibliothèque
   ============================================================ */
#view-library {
  position: fixed; inset: calc(var(--topbar-h) + var(--tabbar-h)) 0 0 0;
  padding: 14px 16px 16px 8px;
  display: flex; gap: 14px; overflow: hidden;
}

#libnav {
  width: 250px; flex: none; padding: 6px 8px;
  display: flex; flex-direction: column; gap: 2px;
  overflow-y: auto;
  background: none; border: none; border-radius: 0;
}
.ln-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 8px 10px; }
.ln-title { font-size: 11.5px; text-transform: uppercase; letter-spacing: .09em; color: var(--ink-3); font-weight: 650; }
.ln-addbtn { width: 28px; height: 28px; border-radius: 6px; display: grid; place-items: center; color: var(--ink-3); }
.ln-addbtn:hover { background: var(--hover); color: var(--ink); }
.ln-addbtn svg { width: 16px; height: 16px; }

/* arbre de dossiers */
.tree-row { display: flex; align-items: center; border-radius: 6px; transition: background .1s; }
.tree-row:hover { background: var(--hover); }
.tree-row.active { background: var(--tint-soft); }
.tree-row.active .tree-name { color: var(--ink); font-weight: 600; }
.tree-row.drop-target { outline: 2px solid var(--tint); outline-offset: -2px; background: var(--tint-soft); }
.tree-caret {
  width: 22px; height: 30px; flex: none; display: grid; place-items: center;
  color: var(--ink-3); font-size: 9px; border-radius: 5px;
  transition: transform .15s;
}
.tree-caret.open { transform: rotate(90deg); }
.tree-caret.leaf { visibility: hidden; }
.tree-label {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px;
  padding: 6px 8px 6px 0; text-align: left; font-size: 13.5px; color: var(--ink-2);
}
.tree-label .ficon { width: 17px; height: 17px; flex: none; }
.tree-label .ficon path { fill: color-mix(in srgb, var(--mc, var(--tint)) 26%, transparent); stroke: var(--mc, var(--tint)); stroke-width: 1.6; }
.tree-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-count { margin-left: auto; padding-right: 8px; font-size: 11.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.tree-kids { margin-left: 15px; padding-left: 6px; border-left: 1px solid var(--border); }
.tree-row.doc .tree-label { font-size: 13px; color: var(--ink-2); }
.tree-label .dicon { width: 15px; height: 15px; flex: none; color: var(--ink-3); }
/* icônes SVG (js/icons.js) */
.ico { width: 1em; height: 1em; flex: none; }
.ficon-ico { width: 17px; height: 17px; color: var(--mc, var(--tint)); }
.ficon-ico.big { width: 40px; height: 40px; stroke-width: 1.5; }
.chip-ico { width: 13px; height: 13px; vertical-align: -2px; margin-right: 5px; }
.title-ico { width: 24px; height: 24px; vertical-align: -4px; margin-right: 8px; color: var(--tint); }

/* bascule grille / arbre */
.seg { display: inline-flex; border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; margin-right: 6px; }
.seg button { width: 36px; height: 36px; display: grid; place-items: center; color: var(--ink-3); }
.seg button + button { border-left: 1px solid var(--border); }
.seg button:hover { background: var(--hover); color: var(--ink); }
.seg button.on { background: var(--tint-soft); color: var(--tint); }
.seg button svg { width: 17px; height: 17px; }

/* vue arbre (façon Obsidian) : racine → dossiers → séances, reliés */
#lib-tree { flex: 1; overflow: auto; padding: 12px 10px 30px 4px; }
.tn-canvas { display: inline-block; min-width: 100%; }
.tn { display: flex; align-items: center; }
.tn-kids { display: flex; flex-direction: column; gap: 6px; margin-left: 30px; position: relative; }
.tn-kids > .tn { position: relative; padding-left: 24px; }
.tn-kids > .tn::before { content: ""; position: absolute; left: 0; top: 50%; width: 24px; border-top: 1.5px solid var(--border); }
.tn-kids > .tn::after { content: ""; position: absolute; left: 0; top: -3px; bottom: -3px; border-left: 1.5px solid var(--border); }
.tn-kids > .tn:first-child::after { top: 50%; }
.tn-kids > .tn:last-child::after { bottom: 50%; }
.tn-kids > .tn:only-child::after { display: none; }
.tn-card {
  position: relative; display: flex; align-items: center; gap: 8px; flex: none;
  padding: 7px 12px; border-radius: var(--r); font-size: 13.5px; white-space: nowrap;
  background: var(--surface); border: 1px solid var(--border);
  transition: background .12s, border-color .12s;
}
.tn-card:hover { background: var(--hover); border-color: var(--ink-3); }
.tn-card.has-kids::after { content: ""; position: absolute; right: -31px; top: 50%; width: 30px; border-top: 1.5px solid var(--border); }
.tn-card .ficon { width: 16px; height: 16px; flex: none; }
.tn-folder .ficon path { fill: color-mix(in srgb, var(--mc) 26%, transparent); stroke: var(--mc); stroke-width: 1.6; }
.tn-folder { border-left: 3px solid var(--mc); font-weight: 550; }
.tn-root { font-weight: 650; }
.tn-root .ficon { color: var(--ink-2); }
.tn-card.active { background: var(--tint-soft); border-color: var(--tint); }
.tn-count { font-size: 11.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.tn-doc { color: var(--ink-2); font-size: 13px; cursor: pointer; }
.tn-doc .dicon { width: 14px; height: 14px; color: var(--ink-3); }
.tn-doc.dragging { opacity: .4; }
.tn-card.drop-target { outline: 2px solid var(--tint); outline-offset: -2px; background: var(--tint-soft); }

#lib-main {
  flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden;
  background: var(--surface); border: 1px solid var(--border); border-radius: 12px;
  padding: 20px 22px 0;
}
.lib-head { display: flex; align-items: flex-end; justify-content: space-between; padding: 0 2px 16px; gap: 14px; }
.lib-path { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-size: 12.5px; color: var(--ink-3); min-height: 18px; margin-bottom: 3px; }
.lib-path button { color: var(--ink-3); padding: 1px 6px; border-radius: 5px; font-size: 12.5px; }
.lib-path button:hover { background: var(--hover); color: var(--ink); }
.lib-path .psep { opacity: .5; }
#lib-title { font-weight: 600; font-size: 24px; letter-spacing: -.01em; }
.lib-actions { display: flex; gap: 8px; align-items: center; flex: none; }
.cta {
  padding: 9px 16px; border-radius: var(--r); font-weight: 600; font-size: 14px; color: #fff;
  background: var(--tint);
  transition: filter .12s;
}
.cta:hover { filter: brightness(1.1); }
.cta.ghost {
  background: var(--surface); color: var(--ink);
  border: 1px solid var(--border);
}
.cta.ghost:hover { background: var(--hover); filter: none; }

#doc-grid {
  flex: 1; overflow-y: auto; padding: 2px 2px 26px;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 12px;
  align-content: start;
}
.doc-card {
  position: relative;
  border-radius: var(--r); padding: 14px 15px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  cursor: pointer; text-align: left;
  display: flex; flex-direction: column; gap: 8px; min-height: 158px;
  transition: background .12s, border-color .12s;
}
.doc-card:hover { background: var(--hover); border-color: var(--ink-3); }
.doc-card.dragging { opacity: .4; }
.doc-card .mat-chip {
  align-self: flex-start; font-size: 11.5px; font-weight: 650; padding: 3px 9px; border-radius: 6px;
  background: color-mix(in srgb, var(--mc) 14%, transparent); color: color-mix(in srgb, var(--mc) 75%, var(--ink));
}
.doc-card h3 { font-size: 15.5px; font-weight: 600; line-height: 1.3; letter-spacing: -.005em; }
.doc-card .preview { font-size: 12.5px; color: var(--ink-2); line-height: 1.45; flex: 1; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.doc-card .meta { font-size: 11.5px; color: var(--ink-3); display: flex; gap: 8px; align-items: center; }
.doc-card .pin-btn, .doc-card .del-btn {
  position: absolute; top: 9px; width: 28px; height: 28px; border-radius: 6px;
  display: grid; place-items: center; color: var(--ink-3); opacity: 0; transition: opacity .12s, background .12s;
}
.doc-card .pin-btn { right: 40px; } .doc-card .del-btn { right: 8px; }
.doc-card:hover .pin-btn, .doc-card:hover .del-btn, .doc-card .pin-btn.pinned { opacity: 1; }
.doc-card .pin-btn:hover, .doc-card .del-btn:hover { background: var(--hover); color: var(--ink); }
.doc-card .pin-btn.pinned { color: var(--tint); }
.doc-card svg { width: 15px; height: 15px; }

/* cartes de dossiers (explorateur) */
.folder-card {
  position: relative;
  border-radius: var(--r); padding: 14px 15px;
  background: var(--surface);
  border: 1px solid var(--border);
  cursor: pointer; text-align: left;
  display: flex; align-items: center; gap: 13px; min-height: 76px;
  transition: background .12s, border-color .12s;
}
.folder-card:hover { background: var(--hover); border-color: var(--ink-3); }
.folder-card.drop-target { outline: 2px solid var(--tint); outline-offset: -2px; background: var(--tint-soft); }
.folder-card.dragging, .tn-folder.dragging, .tree-row.dragging { opacity: .4; }
.lib-path button.drop-target { outline: 2px solid var(--tint); background: var(--tint-soft); color: var(--ink); }
.folder-card .fbig { width: 42px; height: 42px; flex: none; }
.folder-card .fbig path { fill: color-mix(in srgb, var(--mc) 28%, transparent); stroke: var(--mc); stroke-width: 1.5; }
.folder-card h3 { font-size: 15.5px; font-weight: 600; letter-spacing: -.005em; margin-bottom: 3px; }
.folder-card .meta { font-size: 12px; color: var(--ink-3); }
.folder-card .fc-act {
  position: absolute; top: 9px; width: 28px; height: 28px; border-radius: 6px;
  display: grid; place-items: center; color: var(--ink-3); opacity: 0; transition: opacity .12s, background .12s;
}
.folder-card .fc-act.ren { right: 40px; } .folder-card .fc-act.del { right: 8px; }
.folder-card:hover .fc-act { opacity: 1; }
.folder-card .fc-act:hover { background: var(--hover); color: var(--ink); }
.folder-card .fc-act svg { width: 15px; height: 15px; }
.grid-sect { grid-column: 1 / -1; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); padding: 8px 4px 0; }

.empty-state { grid-column: 1 / -1; text-align: center; padding: 70px 20px; color: var(--ink-3); }
.empty-state .big { margin-bottom: 12px; opacity: .6; }
.empty-state .big svg { width: 48px; height: 48px; stroke-width: 1.3; }
.empty-state p { font-size: 14.5px; }

/* ============================================================
   Éditeur
   ============================================================ */
#view-editor { position: fixed; inset: 0; }

#docwrap {
  position: absolute; inset: 0;
  overflow-y: auto; overscroll-behavior: contain;
  padding: calc(var(--topbar-h) + var(--toolbar-h) + var(--tabbar-h) + 22px) 28px 120px;
  scroll-behavior: smooth;
  transition: padding-left .25s ease, padding-right .25s ease;
}
#docwrap.no-anim { transition: none; scroll-behavior: auto; }
#view-editor.plan-open #docwrap { padding-left: 292px; }
#view-editor.math-open #docwrap { padding-right: 344px; }
/* Feuille au format A4 (794 × 1123 px à 96 dpi), marges ~2 cm — comme Google Docs */
#doc {
  width: min(794px, 100%); margin: 0 auto;
  background: var(--paper);
  border-radius: 2px;
  border: 1px solid var(--border);
  padding: 80px 75px;
  min-height: 1123px;
}

/* ---------- Blocs ---------- */
.block { position: relative; margin: 2px 0; border-radius: 6px; }
.block > .btxt { outline: none; min-height: 1.4em; }
.block > .btxt:focus:empty::before,
.block:first-child:last-child > .btxt:empty::before { content: attr(data-ph); color: var(--ink-3); opacity: .55; pointer-events: none; }

.bhandle {
  position: absolute; left: -34px; top: 3px; width: 24px; height: 24px;
  display: grid; place-items: center; border-radius: 6px;
  color: var(--ink-3); opacity: 0; cursor: grab; transition: opacity .12s;
  font-size: 15px; letter-spacing: -1px; user-select: none;
}
.block:hover .bhandle { opacity: .75; }
.bhandle:hover { background: var(--hover); opacity: 1 !important; }
.block.dragging { opacity: .35; }
.block.drop-before::before, .block.drop-after::after {
  content: ""; position: absolute; left: 0; right: 0; height: 3px; border-radius: 2px;
  background: var(--tint);
}
.block.drop-before::before { top: -3px; } .block.drop-after::after { bottom: -3px; }
.block.blocksel { outline: 2px solid var(--tint); outline-offset: 2px; background: var(--tint-soft); }

/* Paragraphe / texte */
.block.p .btxt { font-family: var(--font-serif); font-size: 16.5px; line-height: 1.62; color: var(--ink); padding: 3px 0; }
.block.li .btxt { font-family: var(--font-serif); font-size: 16.5px; line-height: 1.55; padding: 2px 0 2px 24px; position: relative; }
.block.li .btxt::after { content: "–"; position: absolute; left: 6px; top: 2px; color: var(--tint); font-weight: 600; }
.block.quote .btxt {
  font-family: var(--font-serif); font-style: italic; font-size: 16px; line-height: 1.6; color: var(--ink-2);
  border-left: 3px solid color-mix(in srgb, var(--tint) 55%, transparent); padding: 4px 0 4px 18px; margin: 6px 0;
}

/* Titres à numérotation juridique */
.block.h { display: flex; gap: 12px; align-items: baseline; margin-top: 14px; }
.block.h .hnum {
  flex: none; font-family: var(--font-serif); font-weight: 700; color: var(--tint);
  user-select: none; font-variant-numeric: tabular-nums;
}
.block.h .btxt { flex: 1; font-family: var(--font-serif); font-weight: 660; letter-spacing: -.012em; color: var(--ink); }
.block.h.l1 { margin-top: 30px; } .block.h.l1 .btxt, .block.h.l1 .hnum { font-size: 23px; }
.block.h.l2 { margin-left: 18px; } .block.h.l2 .btxt, .block.h.l2 .hnum { font-size: 19.5px; }
.block.h.l3 { margin-left: 36px; } .block.h.l3 .btxt, .block.h.l3 .hnum { font-size: 17px; }
.block.h.l4 { margin-left: 54px; } .block.h.l4 .btxt, .block.h.l4 .hnum { font-size: 16px; font-weight: 600; font-style: italic; }

/* Encadrés typés */
.block.callout {
  margin: 12px 0; padding: 13px 16px 13px 46px; border-radius: var(--r);
  background: color-mix(in srgb, var(--cc) 8%, var(--paper));
  border: 1px solid color-mix(in srgb, var(--cc) 25%, transparent);
}
.block.callout .cico { position: absolute; left: 14px; top: 13px; width: 18px; height: 18px; color: var(--cc); }
.block.callout .cico svg { width: 18px; height: 18px; }
.block.callout .ctitle { font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; color: var(--cc); margin-bottom: 3px; user-select: none; }
.block.callout .btxt { font-family: var(--font-serif); font-size: 15.5px; line-height: 1.55; }
.block.callout[data-ct="definition"]  { --cc: #3d6bb5; }
.block.callout[data-ct="arret"]       { --cc: #8c4351; }
.block.callout[data-ct="controverse"] { --cc: #7a6852; }
.block.callout[data-ct="retenir"]     { --cc: #b3762a; }
.block.callout[data-ct="exemple"]     { --cc: #2e8b6a; }
html[data-theme="dark"] .block.callout[data-ct="definition"]  { --cc: #7fa4dc; }
html[data-theme="dark"] .block.callout[data-ct="arret"]       { --cc: #c98795; }
html[data-theme="dark"] .block.callout[data-ct="controverse"] { --cc: #b3a186; }
html[data-theme="dark"] .block.callout[data-ct="retenir"]     { --cc: #d3a05e; }
html[data-theme="dark"] .block.callout[data-ct="exemple"]     { --cc: #5cb896; }

/* Fiche d'arrêt */
.block.juris {
  margin: 14px 0; border-radius: var(--r); overflow: hidden;
  border: 1px solid color-mix(in srgb, #8c4351 30%, transparent);
  background: color-mix(in srgb, #8c4351 5%, var(--paper));
}
.juris-head {
  display: flex; align-items: center; gap: 10px; padding: 10px 16px;
  background: color-mix(in srgb, #8c4351 12%, transparent);
  font-weight: 650; font-size: 14px; color: color-mix(in srgb, #8c4351 60%, var(--ink));
}
.juris-head .jico { display: inline-flex; width: 16px; height: 16px; }
.juris-head .jico svg { width: 16px; height: 16px; }
.juris-head .jref { outline: none; flex: 1; font-family: var(--font-serif); }
.juris-head .jref:empty::before { content: "Cass. civ. 1re, 12 juill. 2023, n° 22-14.081"; opacity: .45; }
.juris-grid { display: grid; grid-template-columns: 108px 1fr; }
.juris-grid > div { padding: 7px 14px; font-size: 14px; border-top: 1px solid color-mix(in srgb, #8c4351 12%, transparent); }
.juris-grid .jlabel { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: color-mix(in srgb, #8c4351 55%, var(--ink-2)); padding-top: 10px; user-select: none; }
.juris-grid .jval { font-family: var(--font-serif); line-height: 1.5; outline: none; }
.juris-grid .jval:empty::before { content: "…"; opacity: .35; }

/* Référence d'article (inline) */
.refart {
  display: inline-block; padding: 1px 8px 2px; border-radius: 6px; text-decoration: none;
  font-family: var(--font-ui); font-size: .86em; font-weight: 600;
  background: var(--tint-soft);
  color: color-mix(in srgb, var(--tint) 75%, var(--ink));
  border: 1px solid color-mix(in srgb, var(--tint) 22%, transparent);
  white-space: nowrap; cursor: pointer;
}
.refart:hover { background: color-mix(in srgb, var(--tint) 20%, transparent); }

/* Formules */
.block.formula { margin: 10px 0; padding: 12px 16px; border-radius: var(--r); transition: background .12s; }
.block.formula:hover { background: var(--hover); }
.block.formula .frender {
  font-family: var(--font-math); font-size: 19px; text-align: center; cursor: text;
  min-height: 30px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
}
.block.formula .fsrc {
  width: 100%; border: none; outline: none; background: none; text-align: center;
  font-family: var(--font-mono); font-size: 14.5px; color: var(--ink);
  border-bottom: 2px solid var(--tint); padding: 6px 4px;
}
.block.formula .fhint { text-align: center; font-size: 11px; color: var(--ink-3); margin-top: 6px; }
.block.formula.empty .frender { color: var(--ink-3); font-size: 15px; font-family: var(--font-ui); }

/* Rendu mathématique */
.m { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0; }
.m i { font-style: italic; padding: 0 .5px; }
.m .mi { font-style: italic; }
.m .mfn { font-style: normal; padding: 0 1px; }
.m .mo { padding: 0 .28em; font-style: normal; }
.m .mop-tight { padding: 0 .08em; }
.m sup, .m sub { font-size: .68em; }
.mfrac { display: inline-flex; flex-direction: column; align-items: center; vertical-align: -0.6em; margin: 0 .18em; }
.mfrac .mnum { padding: 0 .3em 1px; line-height: 1.15; }
.mfrac .mden { padding: 1px .3em 0; border-top: 1.3px solid currentColor; line-height: 1.15; }
.mfrac .mfrac { font-size: .92em; }
.mbig { display: inline-flex; flex-direction: column; align-items: center; margin: 0 .15em; line-height: 1; vertical-align: middle; }
.mbig .mbigop { font-size: 1.55em; line-height: 1.05; }
.mbig .mover, .mbig .munder { font-size: .62em; line-height: 1.2; }
.msqrt { display: inline-flex; align-items: stretch; margin: 0 .1em; }
.msqrt .mradsym { align-self: flex-end; font-size: 1.15em; line-height: 1; }
.msqrt .mradcontent { border-top: 1.3px solid currentColor; padding: 1px .25em 0 .15em; }
.mparen { font-size: 1.12em; font-style: normal; padding: 0 1px; }
/* 1.12 : mots, exposant + indice empilés, accents, matrices, systèmes, lignes */
.m .mtext { font-style: normal; white-space: pre; }
.m .msp { display: inline-block; width: .18em; }
.m .mop-sep { padding: 0 .3em 0 .04em; }
/* exposants / indices : éléments d'une ligne flex → en haut / en bas de la ligne (les règles #blocks sup/sub ne s'appliquent pas ici) */
#blocks .m sup, .m sup, #blocks .m sub, .m sub { font-size: .66em; line-height: 1.1; vertical-align: baseline; }
.m .mscr { display: inline-flex; align-items: center; align-self: center; }
#blocks .m sup, .m sup { align-self: flex-start; margin-top: -.12em; }
#blocks .m sub, .m sub { align-self: flex-end; margin-bottom: -.18em; }
.m .mnum, .m .mden, .m .mradcontent, .m .mcell, .m .mover, .m .munder, .m .mbinom > span, .m .macc-base, .m .mrootidx, .m .mfence { display: inline-flex; align-items: center; justify-content: center; flex-wrap: wrap; }
#blocks .m .msubsup, .m .msubsup { display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; align-self: center; vertical-align: middle; line-height: 1; margin: 0 0 0 1px; }
#blocks .m .msubsup sup, .m .msubsup sup, #blocks .m .msubsup sub, .m .msubsup sub { align-self: flex-start; margin: 0; line-height: 1.05; }
#blocks .m .msubsup sup, .m .msubsup sup { margin-bottom: .1em; }
.m .macc { display: inline-flex; flex-direction: column; align-items: center; vertical-align: baseline; line-height: 1; }
.m .macc .macc-sym { font-size: .72em; line-height: .8; height: .55em; margin-bottom: .02em; font-style: normal; }
.m .macc-bar .macc-sym { height: .3em; line-height: .3; font-size: .9em; letter-spacing: -.05em; }
.m .macc-bar { border-top: 1.2px solid currentColor; padding-top: 1px; }
.m .macc-bar .macc-sym { display: none; }
.m .macc-vec .macc-sym { font-size: .78em; }
.m .macc .macc-base { line-height: 1.15; }
.m .munderline { text-decoration: underline; text-underline-offset: 2px; }
.m .mcancel { position: relative; }
.m .mcancel::after { content: ""; position: absolute; left: -2px; right: -2px; top: 50%; border-top: 1.4px solid currentColor; transform: rotate(-18deg); }
.m .mbold { font-weight: 700; }
.m .mbb { font-family: "Cambria Math", "STIX Two Math", serif; font-weight: 700; font-style: normal; }
.m .mtall { font-size: 1.35em; line-height: 1; vertical-align: middle; }
.m .mfence { display: inline-flex; align-items: center; }
.m .mbinom { display: inline-flex; flex-direction: column; align-items: center; vertical-align: middle; font-size: .92em; line-height: 1.15; padding: 0 .1em; }
.m .msqrt.mroot .mrootidx { font-size: .6em; align-self: flex-start; margin-right: -.35em; margin-top: -.15em; }
.m .mbigtxt { font-size: 1em; font-style: normal; }
.m .mmat { display: inline-flex; align-items: stretch; vertical-align: middle; margin: 0 .12em; }
.m .mmat .mbrace { display: flex; align-items: center; font-size: 1.05em; line-height: 1; font-style: normal; transform: scaleY(var(--mby, 1)); }
.m .mmat .mgrid { display: inline-grid; gap: .1em .55em; align-items: center; justify-items: center; padding: .1em .25em; }
.m .mmat .mcell { display: inline-flex; align-items: center; justify-content: center; }
.m .mmat .mgrid:has(.mcell:nth-child(n+3)) ~ .mbrace, .m .mmat .mbrace { --mby: 1.6; }
.m .mcases .mgrid { justify-items: start; gap: .1em 1em; padding-left: .35em; }
.m .mcases .mbrace { --mby: 1.8; font-size: 1.15em; }
.m.mmulti { flex-direction: column; align-items: center; gap: .35em; }
.m .mline { display: inline-flex; align-items: center; flex-wrap: wrap; }
.block.formula .frender .m.mmulti { display: inline-flex; }

/* Graphiques */
.block.graph { margin: 14px 0; }
.graph-card {
  border-radius: var(--r); border: 1px solid var(--border); overflow: hidden;
  background: var(--paper);
}
.graph-card svg { display: block; width: 100%; height: auto; stroke: none; }
.graph-controls {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  padding: 8px 12px; border-top: 1px solid var(--border); font-size: 12px;
}
.graph-controls .gc-label { color: var(--ink-3); font-weight: 600; margin-right: 2px; }
.gcbtn {
  padding: 4px 11px; border-radius: 6px; font-size: 12px; font-weight: 600;
  background: var(--tint-soft); color: color-mix(in srgb, var(--tint) 75%, var(--ink));
}
.gcbtn:hover { filter: brightness(1.05); }
.gcbtn.on { background: var(--tint); color: #fff; }
.graph-controls input {
  border: 1px solid var(--border); background: var(--paper); border-radius: 6px;
  padding: 4px 8px; font-family: var(--font-mono); font-size: 12px; width: 150px; outline: none;
}
.graph-controls input:focus { border-color: var(--tint); }
.graph-hint { font-size: 11px; color: var(--ink-3); margin-left: auto; }

.gcurve { cursor: ns-resize; }

/* flash de bloc (navigation plan / recherche) */
.block.flash { animation: bflash 1.4s ease-out; }
@keyframes bflash {
  0% { background: color-mix(in srgb, var(--tint) 22%, transparent); }
  100% { background: transparent; }
}

/* Surlignage */
mark, .hl { background: color-mix(in srgb, #e9c46a 55%, transparent); border-radius: 3px; padding: 0 1px; color: inherit; }

/* ============================================================
   Volet plan
   ============================================================ */
#planpanel {
  position: fixed; left: 0; top: calc(var(--topbar-h) + var(--toolbar-h) + var(--tabbar-h) + 2px); bottom: 0; width: 268px; z-index: 40;
  display: flex; flex-direction: column;
  background: none; border: none; border-radius: 0;
  transition: transform .25s ease, opacity .2s;
}
#planpanel.collapsed { transform: translateX(-290px); opacity: 0; pointer-events: none; }
.pp-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 16px 8px; }
.pp-title { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--ink-3); }
#pp-collapse { width: 26px; height: 26px; border-radius: 6px; color: var(--ink-3); font-size: 16px; }
#pp-collapse:hover { background: var(--hover); color: var(--ink); }
#plan-progress { height: 3px; margin: 0 16px 8px; border-radius: 2px; background: var(--border); overflow: hidden; }
#plan-progress-bar { height: 100%; width: 0; border-radius: 2px; background: var(--tint); transition: width .2s; }
#plan-tree { flex: 1; overflow-y: auto; padding: 4px 8px 14px; }
.pt-item {
  display: flex; gap: 8px; align-items: baseline; width: 100%; text-align: left;
  padding: 5px 9px; border-radius: 6px; font-size: 13px; line-height: 1.35; color: var(--ink-2);
  transition: background .1s;
}
.pt-item:hover { background: var(--hover); color: var(--ink); }
.pt-item.current { background: var(--tint-soft); color: var(--ink); font-weight: 600; }
.pt-item .ptnum { flex: none; font-weight: 700; color: var(--tint); font-variant-numeric: tabular-nums; }
.pt-item.pl2 { padding-left: 22px; } .pt-item.pl3 { padding-left: 36px; font-size: 12.5px; } .pt-item.pl4 { padding-left: 50px; font-size: 12.5px; font-style: italic; }
.pt-empty { padding: 18px 14px; font-size: 12.5px; color: var(--ink-3); line-height: 1.5; }

#pp-pill {
  position: fixed; left: 10px; top: calc(var(--topbar-h) + var(--toolbar-h) + var(--tabbar-h) + 12px); z-index: 40;
  width: 36px; height: 36px; border-radius: 6px; display: grid; place-items: center; color: var(--ink-2);
  background: var(--surface); border: 1px solid var(--border);
}
#pp-pill svg { width: 18px; height: 18px; }
#pp-pill:hover { background: var(--hover); color: var(--ink); }

/* ============================================================
   Palette mathématique
   ============================================================ */
#mathpanel {
  position: fixed; right: 0; top: calc(var(--topbar-h) + var(--toolbar-h) + var(--tabbar-h) + 2px); bottom: 0; width: 322px; z-index: 40;
  display: flex; flex-direction: column;
  background: var(--surface);
  border: none; border-left: 1px solid var(--border); border-radius: 0;
}
.mp-tabs { display: flex; gap: 2px; padding: 10px 10px 6px; align-items: center; }
.mp-tab {
  padding: 6px 12px; border-radius: 6px; font-size: 12.5px; font-weight: 600; color: var(--ink-2);
}
.mp-tab:hover { background: var(--hover); }
.mp-tab.active { background: var(--tint); color: #fff; }
#mp-close { margin-left: auto; width: 26px; height: 26px; border-radius: 6px; color: var(--ink-3); font-size: 12px; }
#mp-close:hover { background: var(--hover); color: var(--ink); }
#mp-body { flex: 1; overflow-y: auto; padding: 6px 12px 16px; }

.sym-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 4px; margin-bottom: 12px; }
.sym-grid button {
  height: 40px; border-radius: 6px; font-family: var(--font-math); font-size: 17px;
  display: grid; place-items: center; transition: background .1s;
}
.sym-grid button:hover { background: var(--hover); }
.mp-sect { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); padding: 10px 4px 7px; }
.mod-item {
  width: 100%; text-align: left; padding: 9px 11px; border-radius: 6px; margin-bottom: 3px;
  transition: background .1s;
}
.mod-item:hover { background: var(--hover); }
.mod-item .mod-name { font-size: 12px; font-weight: 620; color: var(--ink-2); margin-bottom: 3px; }
.mod-item .mod-prev { font-family: var(--font-math); font-size: 14.5px; overflow: hidden; white-space: nowrap; }
.gra-item {
  width: 100%; display: flex; align-items: center; gap: 11px; text-align: left;
  padding: 9px 11px; border-radius: 6px; margin-bottom: 3px; font-size: 13.5px; font-weight: 550;
}
.gra-item:hover { background: var(--hover); }
.gra-item .gthumb { width: 46px; height: 34px; flex: none; border-radius: 5px; border: 1px solid var(--border); background: var(--paper); overflow: hidden; }
.gra-item .gthumb svg { width: 100%; height: 100%; }

/* ============================================================
   Recherche universelle
   ============================================================ */
#searchov {
  position: fixed; inset: 0; z-index: 90;
  background: rgba(0, 0, 0, .35);
  display: flex; justify-content: center; align-items: flex-start; padding-top: 12vh;
}
#searchbox {
  width: min(640px, calc(100vw - 40px)); max-height: 64vh; display: flex; flex-direction: column; overflow: hidden;
  background: var(--surface); border: 1px solid var(--border); border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .25);
}
.sb-row { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--border); }
.sb-ico { width: 19px; height: 19px; color: var(--ink-3); flex: none; }
#search-input { flex: 1; border: none; outline: none; background: none; font-size: 16.5px; }
.sb-row kbd { font-family: var(--font-ui); font-size: 10.5px; color: var(--ink-3); border: 1px solid var(--border); border-radius: 5px; padding: 2px 6px; }
#search-results { overflow-y: auto; padding: 6px 8px 10px; }
.sr-item { display: block; width: 100%; text-align: left; padding: 10px 12px; border-radius: 6px; }
.sr-item:hover, .sr-item.sel { background: var(--hover); }
.sr-item .sr-top { display: flex; align-items: center; gap: 8px; margin-bottom: 3px; }
.sr-item .mat-chip { font-size: 10.5px; font-weight: 650; padding: 2px 8px; border-radius: 5px; background: color-mix(in srgb, var(--mc) 14%, transparent); color: color-mix(in srgb, var(--mc) 75%, var(--ink)); }
.sr-item .sr-doc { font-size: 13px; font-weight: 620; }
.sr-item .sr-snippet { font-size: 12.5px; color: var(--ink-2); line-height: 1.45; font-family: var(--font-serif); }
.sr-item .sr-snippet mark { background: color-mix(in srgb, var(--tint) 25%, transparent); }
.sr-empty { padding: 24px; text-align: center; color: var(--ink-3); font-size: 13.5px; }

/* ============================================================
   Menu « / » et pop-overs
   ============================================================ */
#slashmenu {
  position: fixed; z-index: 95; width: 296px; max-height: 380px; overflow-y: auto; padding: 6px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}
.sm-sect { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); padding: 8px 10px 4px; }
.sm-item {
  width: 100%; display: flex; align-items: center; gap: 11px; text-align: left;
  padding: 7px 9px; border-radius: 6px; font-size: 13.5px; font-weight: 540;
}
.sm-item:hover, .sm-item.sel { background: var(--hover); }
.sm-item .sm-ico {
  width: 30px; height: 30px; flex: none; border-radius: 6px; display: grid; place-items: center;
  background: var(--bg); border: 1px solid var(--border); font-size: 14px;
  font-family: var(--font-serif);
}
.sm-item .sm-ico svg { width: 16px; height: 16px; color: var(--ink-2); }
.sm-item .sm-sub { display: block; font-size: 11px; color: var(--ink-3); font-weight: 400; margin-top: 1px; }

/* références d'articles et résultats de calcul : atomes non éditables */
.refart::selection, .calc-res::selection { background: color-mix(in srgb, var(--tint) 35%, transparent); }
.calc-res {
  display: inline-block; padding: 0 7px; border-radius: 5px; white-space: nowrap;
  font-family: var(--font-ui); font-size: .9em; font-weight: 600;
  background: var(--tint-soft); color: color-mix(in srgb, var(--tint) 75%, var(--ink));
  border: 1px solid color-mix(in srgb, var(--tint) 22%, transparent);
  cursor: default;
}
.calc-res.stale { opacity: .45; text-decoration: line-through; }
#calc-ghost {
  position: fixed; z-index: 70; pointer-events: none;
  display: inline-flex; align-items: center; gap: 6px; padding: 0 6px;
  font-family: var(--font-serif); color: var(--ink-3); white-space: pre;
  background: var(--tint-soft); border-radius: 5px;
}
#calc-ghost .cg-val { color: color-mix(in srgb, var(--tint) 75%, var(--ink)); font-weight: 600; }
#calc-ghost kbd { font-family: var(--font-ui); font-size: 10px; line-height: 1; color: var(--ink-3); border: 1px solid var(--border); border-radius: 4px; padding: 2px 4px; background: var(--surface); }

#popover {
  position: fixed; z-index: 96; padding: 14px; width: 320px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}
:is(#popover, .po-scope) h4 { font-size: 13px; font-weight: 650; margin-bottom: 9px; }
:is(#popover, .po-scope) .po-row { display: flex; gap: 6px; }
:is(#popover, .po-scope) input {
  flex: 1; border: 1px solid var(--border); background: var(--bg); border-radius: 6px;
  padding: 8px 11px; outline: none; font-size: 14px;
}
:is(#popover, .po-scope) input:focus { border-color: var(--tint); }
:is(#popover, .po-scope) .po-hint { font-size: 11px; color: var(--ink-3); margin-top: 8px; line-height: 1.45; }
:is(#popover, .po-scope) .po-result { font-family: var(--font-math); font-size: 17px; text-align: center; padding: 10px 0 2px; min-height: 20px; }
:is(#popover, .po-scope) .pobtn {
  padding: 8px 13px; border-radius: 6px; background: var(--tint); color: #fff; font-weight: 600; font-size: 13px;
}
:is(#popover, .po-scope) .pobtn:hover { filter: brightness(1.1); }
:is(#popover, .po-scope) .pobtn.danger { background: var(--danger); }
:is(#popover, .po-scope) .po-confirm-text { font-size: 12.5px; color: var(--ink-2); line-height: 1.45; }
/* liste de dossiers (Déplacer vers…) */
:is(#popover, .po-scope) .po-move { max-height: 300px; overflow-y: auto; }
:is(#popover, .po-scope) .po-move button { display: flex; align-items: center; gap: 8px; }
:is(#popover, .po-scope) .po-move button.cur { background: var(--tint-soft); }
:is(#popover, .po-scope) .po-move .ficon, :is(#popover, .po-scope) .po-move .ficon-ico { width: 16px; height: 16px; flex: none; }
:is(#popover, .po-scope) .po-move .ficon path { fill: color-mix(in srgb, var(--mc, var(--tint)) 26%, transparent); stroke: var(--mc, var(--tint)); stroke-width: 1.6; }
:is(#popover, .po-scope) .po-list button { width: 100%; text-align: left; padding: 7px 10px; border-radius: 6px; font-size: 13.5px; }
:is(#popover, .po-scope) .po-list button:hover { background: var(--hover); }
:is(#popover, .po-scope) .po-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); margin: 12px 0 6px; }
:is(#popover, .po-scope) .po-colors { display: grid; grid-template-columns: repeat(8, 1fr); gap: 6px; }
:is(#popover, .po-scope) .po-colors button { width: 100%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(0,0,0,.08); }
:is(#popover, .po-scope) .po-colors button.sel { outline: 2px solid var(--ink); outline-offset: 2px; }
:is(#popover, .po-scope) .po-icons {
  display: grid; grid-template-columns: repeat(8, 1fr); gap: 3px;
  max-height: 172px; overflow-y: auto; padding: 2px; border: 1px solid var(--border); border-radius: 6px;
}
:is(#popover, .po-scope) .po-icons-sect { grid-column: 1 / -1; font-size: 10.5px; font-weight: 650; color: var(--ink-3); padding: 6px 4px 2px; }
:is(#popover, .po-scope) .po-icons button { height: 32px; border-radius: 6px; display: grid; place-items: center; color: var(--ink-2); }
:is(#popover, .po-scope) .po-icons button svg { width: 18px; height: 18px; }
:is(#popover, .po-scope) .po-icons button:hover { background: var(--hover); color: var(--ink); }
:is(#popover, .po-scope) .po-list .po-ico { width: 16px; height: 16px; vertical-align: -3px; margin-right: 8px; color: var(--ink-2); }
:is(#popover, .po-scope) .po-icons button.sel { background: var(--tint-soft); outline: 1.5px solid var(--tint); }
:is(#popover, .po-scope) .po-icons button.none svg { width: 18px; height: 18px; color: var(--ink-2); }
:is(#popover, .po-scope) .po-icons button.none svg path { fill: color-mix(in srgb, var(--ink-3) 25%, transparent); }
:is(#popover, .po-scope) .po-radios { display: flex; flex-direction: column; gap: 6px; }
:is(#popover, .po-scope) .po-radios label { display: flex; align-items: center; gap: 8px; font-size: 13.5px; padding: 6px 8px; border-radius: 6px; cursor: pointer; }
:is(#popover, .po-scope) .po-radios label:hover { background: var(--hover); }
:is(#popover, .po-scope) .po-radios input { accent-color: var(--tint); }
:is(#popover, .po-scope) .swatches { display: flex; gap: 7px; flex-wrap: wrap; }
:is(#popover, .po-scope) .swatches button {
  width: 27px; height: 27px; border-radius: 50%;
  border: 1px solid var(--border);
}
:is(#popover, .po-scope) .swatches button:hover { outline: 2px solid var(--tint); outline-offset: 1px; }
:is(#popover, .po-scope) .swatches button.none {
  background: var(--surface); color: var(--ink-2);
  display: grid; place-items: center; font-size: 13px; font-weight: 600;
}

/* ============================================================
   Menu contextuel des dossiers
   ============================================================ */
#ctxmenu {
  position: fixed; z-index: 97; min-width: 200px; padding: 5px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}
#ctxmenu .cm-title {
  padding: 6px 10px 7px; font-size: 12px; font-weight: 650; color: var(--ink-3);
  border-bottom: 1px solid var(--border); margin-bottom: 4px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 240px;
}
#ctxmenu button {
  width: 100%; display: flex; align-items: center; gap: 10px; text-align: left;
  padding: 7px 10px; border-radius: 6px; font-size: 13.5px; color: var(--ink);
}
#ctxmenu button:hover { background: var(--hover); }
#ctxmenu button svg { width: 16px; height: 16px; color: var(--ink-2); flex: none; }
#ctxmenu button.danger { color: var(--danger); }
#ctxmenu button.danger svg { color: var(--danger); }

/* ============================================================
   Toast
   ============================================================ */
#toast {
  position: fixed; bottom: 24px; left: 24px; z-index: 99;
  background: var(--ink);
  color: var(--surface);
  border-radius: var(--r);
  padding: 10px 18px; font-size: 13.5px; font-weight: 550;
  box-shadow: 0 4px 16px rgba(0, 0, 0, .2);
  display: flex; align-items: center; gap: 14px; max-width: min(560px, calc(100vw - 48px));
}
#toast .toast-act {
  flex: none; color: inherit; font-weight: 700; font-size: 12.5px;
  padding: 4px 10px; border-radius: 6px;
  background: color-mix(in srgb, var(--surface) 18%, transparent);
}
#toast .toast-act:hover { background: color-mix(in srgb, var(--surface) 30%, transparent); }

.only-editor { display: none; }
body.mode-editor .only-editor { display: flex; }
body.mode-editor .tbtn.only-editor { display: grid; }

/* Scrollbars discrètes */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--ink-3) 35%, transparent); border-radius: 5px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-track { background: transparent; }

/* Réductions demandées par le système */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  #docwrap { scroll-behavior: auto; }
}

/* ============================================================
   Impression / export PDF
   ============================================================ */
#print-summary, #print-head { display: none; }
@media print {
  /* thème clair forcé à l'impression, même si l'app est en mode sombre */
  :root, :root[data-theme="dark"] {
    --bg: #fff; --surface: #fff; --paper: #fff; --border: #c9ccd1;
    --ink: #1a1a1a; --ink-2: #46494e; --ink-3: #85898f; --hover: transparent;
    --c-demand: #b0483f; --c-supply: #2f7d68; --c-third: #3d6bb5;
  }
  html[data-theme="dark"] .block.callout[data-ct="definition"]  { --cc: #3d6bb5; }
  html[data-theme="dark"] .block.callout[data-ct="arret"]       { --cc: #8c4351; }
  html[data-theme="dark"] .block.callout[data-ct="controverse"] { --cc: #7a6852; }
  html[data-theme="dark"] .block.callout[data-ct="retenir"]     { --cc: #b3762a; }
  html[data-theme="dark"] .block.callout[data-ct="exemple"]     { --cc: #2e8b6a; }
  /* imprimer les fonds et couleurs (encadrés, surlignages, graphiques) */
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  @page { size: A4; margin: 18mm 16mm; }
  html, body { height: auto; background: #fff; overflow: visible; }
  #topbar, #planpanel, #pp-pill, #toolbar, #mathpanel, #searchov, #slashmenu, #popover, #ctxmenu, #toast, #calc-ghost, #view-library { display: none !important; }
  #view-editor, #docwrap { position: static; overflow: visible; padding: 0; }
  #view-editor #docwrap { padding: 0 !important; }
  #doc-meta, .ai-sug, #lib-agenda { display: none !important; }
  #print-head { display: block; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid #c9ccd1; }
  #print-head .ph-title { font-family: var(--font-serif); font-size: 26px; font-weight: 700; letter-spacing: -.01em; color: #1a1a1a; line-height: 1.2; }
  #print-head .ph-sub { font-family: var(--font-ui); font-size: 11.5px; color: #46494e; margin-top: 6px; }
  /* neutralise le décalage dû aux volets ouverts (plan / palette maths) */
  #view-editor.plan-open #docwrap, #view-editor.math-open #docwrap { padding: 0; }
  #doc { box-shadow: none; border: none; width: auto; max-width: none; padding: 0; border-radius: 0; min-height: 0; }
  .block.blocksel { outline: none; background: transparent; }
  /* sommaire en tête du document, sans saut de page forcé (un cours d'une page tenait sur deux) */
  #print-summary { display: block; padding: 0 0 18px; margin-bottom: 22px; border-bottom: 1px solid #c9ccd1; }
  #print-summary:empty { display: none; }
  #print-summary h2 { font-family: var(--font-serif); font-size: 18px; margin-bottom: 10px; }
  #print-summary .ps-item { display: flex; gap: 10px; padding: 4px 0; font-family: var(--font-serif); font-size: 14px; }
  #print-summary .ps-item .ptnum { font-weight: 700; }
  #print-summary .pl2 { padding-left: 24px; } #print-summary .pl3 { padding-left: 48px; } #print-summary .pl4 { padding-left: 72px; }
  .bhandle { display: none; }
  .block.h { page-break-after: avoid; }
  .block.callout, .block.juris, .graph-card { page-break-inside: avoid; border-color: #ccc; }
  .graph-controls { display: none; }
}

/* ============================================================
   Écran de connexion (comptes en ligne)
   ============================================================ */
#authov {
  position: fixed; inset: 0; z-index: 2000;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg);
  padding: 24px;
}
.auth-card {
  width: 400px; max-width: 94vw; max-height: 94vh; overflow-y: auto;
  background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
  padding: 30px 32px 22px;
  text-align: center;
}
.auth-logo .logo-mark {
  display: inline-flex; align-items: center; justify-content: center;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--tint); color: #fff;
  font-family: var(--font-serif); font-size: 30px; font-weight: 700;
}
.auth-title { font-family: var(--font-serif); font-size: 24px; margin: 12px 0 4px; color: var(--ink); }
.auth-sub { font-size: 13px; color: var(--ink-2); margin: 0 0 16px; }
.auth-error {
  font-size: 12.5px; color: var(--danger);
  background: color-mix(in srgb, var(--danger) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--danger) 35%, transparent);
  border-radius: var(--r); padding: 8px 10px; margin-bottom: 12px; text-align: left;
}
.auth-providers { display: flex; flex-direction: column; gap: 8px; }
.auth-pbtn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; padding: 9px 12px;
  font: inherit; font-size: 13.5px; font-weight: 500; color: var(--ink);
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r);
  cursor: pointer;
}
.auth-pbtn:hover { background: var(--hover); }
.auth-pbtn .gicon, .auth-pbtn .aicon { width: 18px; height: 18px; flex: none; }
.auth-or {
  display: flex; align-items: center; gap: 10px;
  color: var(--ink-3); font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em;
  margin: 16px 0 12px;
}
.auth-or::before, .auth-or::after { content: ""; flex: 1; border-top: 1px solid var(--border); }
#auth-form { display: flex; flex-direction: column; gap: 8px; }
.auth-in {
  width: 100%; padding: 9px 12px;
  font: inherit; font-size: 13.5px; color: var(--ink);
  background: var(--bg); border: 1px solid var(--border); border-radius: var(--r);
  outline: none;
}
.auth-in:focus { border-color: var(--tint); }
.auth-cta { width: 100%; padding: 10px 12px; margin-top: 2px; }
.auth-links { display: flex; justify-content: space-between; margin-top: 12px; }
.auth-link {
  background: none; border: none; padding: 4px 0; cursor: pointer;
  font: inherit; font-size: 12.5px; color: var(--tint);
}
.auth-link:hover { text-decoration: underline; }
.auth-link.subtle { color: var(--ink-3); }
.auth-foot { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
#authov .busy, .auth-card.busy { opacity: .96; }
.auth-card.busy button { pointer-events: none; opacity: .6; }

/* ============================================================
   Paramètres : compte + raccourcis de frappe
   ============================================================ */
#popover { max-height: min(560px, calc(100vh - 90px)); overflow-y: auto; }
.po-avatar {
  width: 34px; height: 34px; border-radius: 50%; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: var(--tint); color: #fff; font-weight: 600; font-size: 15px;
}
.po-accinfo { flex: 1; min-width: 0; text-align: left; }
.po-accname { font-size: 13px; font-weight: 600; color: var(--ink); }
.po-accmail { font-size: 12px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; }
.po-accsync { font-size: 11px; color: var(--ink-3); }
.cta.small { padding: 5px 10px; font-size: 12px; flex: none; }
.po-sniprow {
  display: flex; align-items: center; gap: 6px;
  margin: 4px 0;
}
:is(#popover, .po-scope) .po-snipk, :is(#popover, .po-scope) .po-snipv {
  font: inherit; font-size: 12.5px; color: var(--ink);
  background: var(--bg); border: 1px solid var(--border); border-radius: 6px;
  padding: 5px 8px; outline: none; min-width: 0;
}
:is(#popover, .po-scope) .po-snipk { width: 74px; flex: 0 0 74px; font-family: var(--font-mono); }
:is(#popover, .po-scope) .po-snipk:focus, :is(#popover, .po-scope) .po-snipv:focus { border-color: var(--tint); }
:is(#popover, .po-scope) .po-snipv { flex: 1; }
.po-sniparrow { color: var(--ink-3); flex: none; }
.po-snipdel {
  background: none; border: none; cursor: pointer; flex: none;
  color: var(--ink-3); font-size: 13px; padding: 3px 5px; border-radius: 5px;
}
.po-snipdel:hover { color: var(--danger); background: var(--hover); }
#po-snipadd { margin: 6px 0 2px; }
:is(#popover, .po-scope) .po-radios input { flex: none; }

/* ============================================================
   Questionnaire de bienvenue (niveau + spécialités)
   ============================================================ */
#obov {
  position: fixed; inset: 0; z-index: 1900;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg); padding: 24px;
}
.ob-card {
  width: 520px; max-width: 96vw; max-height: 94vh; overflow-y: auto;
  background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
  padding: 30px 34px 24px;
}
.ob-step { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--tint); margin-bottom: 6px; }
.ob-title { font-family: var(--font-serif); font-size: 23px; color: var(--ink); margin: 0 0 4px; }
.ob-sub { font-size: 13px; color: var(--ink-2); margin: 0 0 18px; }
.ob-levels { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ob-level {
  padding: 13px 14px; text-align: left; cursor: pointer;
  font: inherit; font-size: 13.5px; font-weight: 550; color: var(--ink);
  background: var(--bg); border: 1.5px solid var(--border); border-radius: 10px;
}
.ob-level:hover { border-color: var(--ink-3); }
.ob-level.sel { border-color: var(--tint); background: var(--tint-soft); color: var(--ink); }
.ob-other-input {
  width: 100%; margin-top: 10px; padding: 9px 12px; display: none;
  font: inherit; font-size: 13.5px; color: var(--ink);
  background: var(--bg); border: 1px solid var(--border); border-radius: var(--r); outline: none;
}
.ob-other-input.on { display: block; }
.ob-other-input:focus { border-color: var(--tint); }
.ob-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ob-chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 8px 13px; cursor: pointer;
  font: inherit; font-size: 13px; font-weight: 550; color: var(--ink);
  background: var(--bg); border: 1.5px solid var(--border); border-radius: 999px;
}
.ob-chip .dot { width: 9px; height: 9px; border-radius: 50%; background: var(--chip-c, var(--tint)); }
.ob-chip:hover { border-color: var(--ink-3); }
.ob-chip.sel { border-color: var(--chip-c, var(--tint)); background: color-mix(in srgb, var(--chip-c, var(--tint)) 12%, transparent); }
.ob-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 22px; }
.ob-back { background: none; border: none; cursor: pointer; font: inherit; font-size: 13px; color: var(--ink-2); padding: 6px 0; }
.ob-back:hover { color: var(--ink); }
.ob-next { padding: 9px 22px; }
.ob-next:disabled { opacity: .45; cursor: default; }
.ob-hint { font-size: 11.5px; color: var(--ink-3); margin-top: 10px; }

/* ============================================================
   1.5.1 — indicateur d’enregistrement, professeur, tableaux,
   journal par jour, corrections IA, panneau TI-83
   ============================================================ */
#save-status { font-size: 11.5px; color: var(--ink-3); margin-right: 8px; white-space: nowrap; align-items: center; gap: 6px; }
#save-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ok); flex: none; }
#save-status[data-st="saving"]::before { background: var(--warn); }
#save-status:empty { display: none; }

/* professeur (en-tête de la feuille) */
#doc-meta { display: flex; align-items: center; gap: 8px; margin: -30px 0 26px; font-size: 12.5px; color: var(--ink-3); }
#doc-meta .dm-label { text-transform: uppercase; letter-spacing: .07em; font-size: 10.5px; font-weight: 700; }
#doc-prof { flex: 1; min-width: 0; border: 1px solid transparent; background: none; outline: none; border-radius: 6px; padding: 3px 8px; font-size: 13px; color: var(--ink-2); font-family: var(--font-ui); }
#doc-prof:hover { border-color: var(--border); }
#doc-prof:focus { border-color: var(--tint); color: var(--ink); }
#doc-prof::placeholder { color: var(--ink-3); opacity: .7; }
.card-prof { color: var(--ink-2); }

/* tableaux */
.block.table { margin: 12px 0; }
.tbl-wrap { overflow-x: auto; }
.tbl { width: 100%; border-collapse: collapse; font-family: var(--font-serif); font-size: 15px; line-height: 1.45; table-layout: fixed; }
.tbl > tbody > tr > td { border: 1px solid var(--border); padding: 0; vertical-align: top; min-width: 60px; }
.tbl .tcell { min-height: 1.6em; padding: 6px 9px; outline: none; }
.tbl .tcell:focus { box-shadow: inset 0 0 0 2px var(--tint); border-radius: 2px; }
.tbl.has-head > tbody > tr:first-child > td > .tcell { font-weight: 650; }
.tbl.has-head > tbody > tr:first-child > td:not([style]) { background: color-mix(in srgb, var(--tint) 8%, var(--paper)); }
.tbl-tools { display: none; align-items: center; gap: 4px; flex-wrap: wrap; margin-bottom: 6px; font-size: 12px; }
.block.table:focus-within .tbl-tools, .block.table.blocksel .tbl-tools { display: flex; }
.tbl-tools button { padding: 3px 9px; border-radius: 6px; font-size: 12px; font-weight: 600; background: var(--tint-soft); color: color-mix(in srgb, var(--tint) 75%, var(--ink)); font-family: var(--font-ui); }
.tbl-tools button:hover { filter: brightness(1.05); }
.tbl-tools button.on { background: var(--tint); color: #fff; }
.tbl-tools button.danger { background: color-mix(in srgb, var(--danger) 12%, transparent); color: var(--danger); margin-left: auto; }

/* plan / journal */
.pp-tabs { display: flex; gap: 2px; }
.pp-tab { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--ink-3); padding: 3px 7px; border-radius: 5px; }
.pp-tab:hover { background: var(--hover); color: var(--ink); }
.pp-tab.active { color: var(--tint); }
#day-list { flex: 1; overflow-y: auto; padding: 4px 8px 14px; }
.dl-item { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 6px 9px; border-radius: 6px; font-size: 13px; color: var(--ink-2); }
.dl-item:hover { background: var(--hover); color: var(--ink); }
.dl-item.current { background: var(--tint-soft); color: var(--ink); font-weight: 600; }
.dl-item .dl-n { margin-left: auto; font-size: 11.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
#day-banner { width: min(794px, 100%); margin: 0 auto 10px; padding: 8px 14px; border-radius: var(--r); background: var(--tint-soft); font-size: 13px; color: var(--ink); display: flex; align-items: center; gap: 12px; }
#day-banner button { margin-left: auto; font-weight: 600; color: var(--tint); padding: 3px 9px; border-radius: 6px; }
#day-banner button:hover { background: var(--hover); }
.block.day-hidden { display: none; }

/* corrections IA */
/* mot qui vient d'être corrigé : surlignage temporaire (CSS Highlight API) — aucune balise dans le texte */
::highlight(alixo-corr) { background-color: rgba(46, 158, 107, .20); text-decoration: underline; text-decoration-color: #2e9e6b; }
.corr-notes { margin: 4px 0 2px; font-family: var(--font-ui); }
.corr-note { display: flex; align-items: flex-start; gap: 7px; font-size: 12px; color: var(--ink-2); padding: 3px 8px; border-left: 2px solid var(--ok); background: color-mix(in srgb, var(--ok) 6%, transparent); border-radius: 0 6px 6px 0; margin-top: 3px; line-height: 1.4; }
.corr-note .cn-ico { color: var(--ok); font-weight: 700; flex: none; }
.corr-note .cn-txt { flex: 1; }
.corr-note .cn-x { margin-left: auto; color: var(--ink-3); flex: none; padding: 0 4px; border-radius: 4px; }
.corr-note .cn-x:hover { color: var(--danger); background: var(--hover); }

/* panneaux droits (maths, IA, TI-83) */
#aipanel, #calcpanel, #dictpanel, #calpanel {
  position: fixed; right: 0; top: calc(var(--topbar-h) + var(--toolbar-h) + var(--tabbar-h) + 2px); bottom: 0; width: 322px; z-index: 40;
  display: flex; flex-direction: column;
  background: var(--surface);
  border: none; border-left: 1px solid var(--border); border-radius: 0;
}
#calcpanel { width: 380px; }
#view-editor.calc-open #docwrap { padding-right: 402px; }
.rp-title { font-size: 12.5px; font-weight: 700; color: var(--ink-2); padding: 6px 4px; }
.rp-close { margin-left: auto; width: 26px; height: 26px; border-radius: 6px; color: var(--ink-3); }
.rp-close:hover { background: var(--hover); color: var(--ink); }
.rp-close svg { width: 14px; height: 14px; }
.rp-link { margin-left: auto; color: var(--ink-3); text-decoration: none; font-size: 15px; padding: 2px 8px; border-radius: 6px; }
.rp-link:hover { background: var(--hover); color: var(--ink); }
.rp-link + .rp-close { margin-left: 2px; }
#ai-body { flex: 1; overflow-y: auto; padding: 6px 12px 16px; font-size: 13px; }
.ai-empty { padding: 14px 4px; color: var(--ink-3); font-size: 12.5px; line-height: 1.5; }
.ai-empty.ai-err { color: var(--danger); }
.ai-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 2px 10px; font-size: 12px; color: var(--ink-2); font-weight: 600; }
.ai-item { padding: 9px 10px; border: 1px solid var(--border); border-radius: var(--r); margin-bottom: 8px; }
.ai-item.done { opacity: .55; }
.ai-diff { font-family: var(--font-serif); font-size: 14px; line-height: 1.4; }
.ai-diff s { color: var(--danger); }
.ai-diff b { color: var(--ok); }
.ai-rule { font-size: 12px; color: var(--ink-2); margin-top: 5px; line-height: 1.45; padding-left: 8px; border-left: 2px solid var(--border); }
.ai-actions { display: flex; gap: 6px; margin-top: 8px; }
.ai-actions .pobtn { padding: 5px 11px; border-radius: 6px; background: var(--tint); color: #fff; font-weight: 600; font-size: 12px; }
.ai-status { font-size: 11.5px; color: var(--ink-3); margin-top: 6px; }
.ai-foot { padding: 6px 0; }
.ai-empty a { color: var(--tint); }
#calc-body { flex: 1; display: flex; }
#calc-body webview, #calc-body iframe { flex: 1; width: 100%; height: 100%; border: none; background: #fff; }
/* l'émulateur masqué reste chargé (visibility, pas display : un <webview> en display:none perd son contenu) */
#calc-body { position: relative; }
#calc-body .off { position: absolute; inset: 0; visibility: hidden; pointer-events: none; }
.calc-seg { display: inline-flex; background: var(--hover); border-radius: 8px; padding: 2px; gap: 2px; }
.calc-seg button { font-size: 12px; font-weight: 600; padding: 4px 11px; border-radius: 6px; color: var(--ink-2); }
.calc-seg button.on { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgba(0,0,0,.12); }
/* ---------- onglets des séances ouvertes ---------- */
body.has-tabs { --tabbar-h: 36px; }
#tabbar {
  position: fixed; top: var(--topbar-h); left: 0; right: 0; height: 36px; z-index: 56;
  display: flex; align-items: flex-end; gap: 2px; padding: 5px 10px 0;
  background: var(--bg); border-bottom: 1px solid var(--border);
  /* 1.19 : plus de défilement (la barre de défilement apparaissait en bande claire sous les onglets) :
     les onglets se serrent pour tenir sur une ligne, le bouton « ▾ » liste tous les onglets */
  overflow: hidden;
}
.tab {
  display: flex; align-items: center; gap: 6px; flex: 0 1 auto; min-width: 0; max-width: 230px;
  padding: 5px 6px 6px 12px; border-radius: 7px 7px 0 0; font-size: 12.5px; color: var(--ink-2);
  border: 1px solid transparent; border-bottom: none; white-space: nowrap; cursor: pointer;
}
.tab:hover { background: var(--hover); color: var(--ink); }
.tab.active { background: var(--surface); border-color: var(--border); color: var(--ink); font-weight: 600; position: relative; top: 1px; }
.tab .tab-name { overflow: hidden; text-overflow: ellipsis; }
.tab .tab-ico { width: 14px; height: 14px; flex: none; color: var(--ink-3); }
.tab .tab-x { width: 18px; height: 18px; border-radius: 4px; display: grid; place-items: center; color: var(--ink-3); font-size: 11px; flex: none; margin-left: 2px; }
.tab .tab-x:hover { background: var(--hover); color: var(--danger); }
.tab.lib { padding-right: 12px; flex: none; }
.tab.active { flex-shrink: 0; }
#tabbar.crowded .tab:not(.active) { padding-left: 8px; }
#tabbar.crowded .tab:not(.active) .tab-name { min-width: 0; }
.tab-more { flex: none; display: inline-flex; align-items: center; gap: 4px; margin-left: 4px; margin-bottom: 4px; padding: 3px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 650; color: var(--ink-2); background: var(--surface); border: 1px solid var(--border); }
.tab-more:hover { color: var(--ink); background: var(--hover); }
.po-tabs { max-height: 50vh; overflow-y: auto; }
.po-tabs button { display: flex; align-items: center; gap: 8px; }
.po-tabs button.on { background: var(--tint-soft); }
.po-tabs button span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.po-tabs button svg { width: 14px; height: 14px; flex: none; color: var(--ink-3); }
.po-tabx { flex: none; width: 18px; height: 18px; border-radius: 4px; display: grid; place-items: center; font-style: normal; font-size: 11px; color: var(--ink-3); }
.po-tabx:hover { background: var(--hover); color: var(--danger); }
.tab.lib .tab-name { font-weight: 600; }
@media print { #tabbar { display: none !important; } body.has-tabs { --tabbar-h: 0px; } }

/* ============================================================
   1.6.0 — liens, dictionnaire, agenda, document à côté, tableaux
   ============================================================ */
/* lien inséré : bouton cliquable */
.lnk {
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 10px 3px; border-radius: 999px; text-decoration: none;
  font-family: var(--font-ui); font-size: .84em; font-weight: 600; white-space: nowrap; cursor: pointer;
  background: var(--tint); color: #fff; border: 1px solid transparent; vertical-align: 1px;
}
.lnk::before { content: "↗"; font-size: .9em; opacity: .85; }
.lnk:hover { filter: brightness(1.12); }
.lnk::selection { background: color-mix(in srgb, #fff 35%, transparent); }
.lnk-print { display: none; }
:is(#popover, .po-scope) .po-link input { width: 100%; }
:is(#popover, .po-scope) .po-link .po-row + .po-row { margin-top: 6px; }

/* dictionnaire */
.dict-search { padding: 4px 12px 8px; }
.dict-search input { width: 100%; border: 1px solid var(--border); background: var(--bg); border-radius: 6px; padding: 8px 11px; outline: none; font-size: 13.5px; color: var(--ink); }
.dict-search input:focus { border-color: var(--tint); }
#dict-body { flex: 1; overflow-y: auto; padding: 0 12px 16px; }
.dict-item { display: block; width: 100%; text-align: left; padding: 9px 10px; border-radius: var(--r); border: 1px solid var(--border); margin-bottom: 7px; }
.dict-item:hover { background: var(--hover); border-color: var(--ink-3); }
.dict-term { font-family: var(--font-serif); font-weight: 700; font-size: 14.5px; color: var(--ink); }
.dict-def { font-family: var(--font-serif); font-size: 13px; color: var(--ink-2); line-height: 1.45; margin-top: 3px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.dict-src { display: flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 11.5px; color: var(--ink-3); }
.dict-src .mat-chip { font-size: 10.5px; font-weight: 650; padding: 2px 8px; border-radius: 5px; background: color-mix(in srgb, var(--mc) 14%, transparent); color: color-mix(in srgb, var(--mc) 75%, var(--ink)); }
.dict-item mark { background: color-mix(in srgb, var(--tint) 25%, transparent); border-radius: 3px; }
.dict-empty { padding: 14px 4px; color: var(--ink-3); font-size: 12.5px; line-height: 1.5; }
.dict-count { font-size: 11px; color: var(--ink-3); padding: 2px 4px 8px; text-transform: uppercase; letter-spacing: .07em; font-weight: 700; }

/* agenda */
.cal-now {
  display: inline-flex; align-items: center; gap: 7px; max-width: 320px; margin-right: 6px;
  padding: 5px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--ink-2);
  background: var(--bg); border: 1px solid var(--border); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cal-now:hover { background: var(--hover); color: var(--ink); }
.cal-now::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--ink-3); flex: none; }
.cal-now.live { color: var(--ink); border-color: color-mix(in srgb, var(--ok) 50%, var(--border)); }
.cal-now.live::before { background: var(--ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 25%, transparent); }
.cal-now .cn-left { color: var(--ink-3); font-weight: 500; }
#calpanel .mp-tabs .cta.small { margin-left: auto; }
#cal-body { flex: 1; overflow-y: auto; padding: 4px 12px 16px; }
.cal-nav { display: flex; align-items: center; gap: 4px; padding: 4px 0 10px; }
.cal-nav button { width: 28px; height: 28px; border-radius: 6px; color: var(--ink-2); display: grid; place-items: center; }
.cal-nav button:hover { background: var(--hover); color: var(--ink); }
.cal-nav .cal-range { flex: 1; text-align: center; font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.cal-nav .cal-today { width: auto; padding: 0 9px; font-size: 12px; font-weight: 600; }
.cal-day { margin-bottom: 10px; }
.cal-dayhead { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); padding: 4px 2px; display: flex; gap: 6px; align-items: baseline; }
.cal-dayhead.today { color: var(--tint); }
.cal-dayhead .cal-dnum { font-size: 14px; font-family: var(--font-serif); color: var(--ink); }
.cal-ev { display: flex; gap: 10px; align-items: flex-start; padding: 7px 9px; border-radius: var(--r); border: 1px solid var(--border); margin-bottom: 5px; border-left: 3px solid var(--ec, var(--tint)); }
.cal-ev.now { background: color-mix(in srgb, var(--ok) 8%, transparent); border-color: color-mix(in srgb, var(--ok) 40%, var(--border)); border-left-color: var(--ok); }
.cal-ev.past { opacity: .55; }
.cal-ev .cal-time { font-variant-numeric: tabular-nums; font-size: 12px; color: var(--ink-2); flex: none; width: 74px; line-height: 1.4; }
.cal-ev .cal-main { flex: 1; min-width: 0; }
.cal-ev .cal-title { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.cal-ev .cal-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.cal-ev .cal-sub button { color: var(--tint); font-weight: 600; padding: 0 4px; border-radius: 4px; }
.cal-ev .cal-sub button:hover { background: var(--hover); }
.cal-ev .cal-acts { display: flex; gap: 2px; flex: none; }
.cal-ev .cal-acts button { width: 24px; height: 24px; border-radius: 5px; color: var(--ink-3); display: grid; place-items: center; font-size: 12px; }
.cal-ev .cal-acts button:hover { background: var(--hover); color: var(--ink); }
.cal-ev .cal-acts button.del:hover { color: var(--danger); }
.cal-empty { font-size: 12px; color: var(--ink-3); padding: 2px 4px 6px; }
:is(#popover, .po-scope) .po-cal .po-row { gap: 6px; margin-top: 6px; }
:is(#popover, .po-scope) .po-cal label { font-size: 11.5px; color: var(--ink-3); display: flex; flex-direction: column; gap: 3px; flex: 1; }
:is(#popover, .po-scope) .po-cal select { flex: 1; border: 1px solid var(--border); background: var(--bg); border-radius: 6px; padding: 7px 9px; font: inherit; font-size: 13px; color: var(--ink); }
:is(#popover, .po-scope) .po-cal .po-check { flex-direction: row; align-items: center; font-size: 12.5px; color: var(--ink-2); gap: 6px; }
:is(#popover, .po-scope) .po-cal input[type="checkbox"] { accent-color: var(--tint); flex: none; }
:is(#popover, .po-scope) .po-cal .po-colors { grid-template-columns: repeat(8, 1fr); }

/* document affiché à côté du cours */
:root { --viewer-w: 46vw; }
#viewpanel {
  position: fixed; right: 0; top: calc(var(--topbar-h) + var(--toolbar-h) + var(--tabbar-h) + 2px); bottom: 0; width: var(--viewer-w); z-index: 40;
  display: flex; flex-direction: column; min-width: 320px;
  background: var(--surface); border-left: 1px solid var(--border);
}
#view-editor.view-open #docwrap { padding-right: calc(var(--viewer-w) + 20px); }
#viewpanel .vw-head { border-bottom: 1px solid var(--border); padding: 8px 10px; gap: 8px; }
#viewpanel .vw-head .rp-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#viewpanel .vw-head .cta.small { flex: none; }
#viewpanel .vw-head .rp-close { margin-left: 0; }
.vw-resizer { position: absolute; left: -4px; top: 0; bottom: 0; width: 8px; cursor: col-resize; z-index: 2; }
.vw-resizer:hover, .vw-resizer.on { background: color-mix(in srgb, var(--tint) 35%, transparent); }
#vw-body { flex: 1; overflow: auto; display: flex; flex-direction: column; background: var(--bg); }
#vw-body iframe { flex: 1; width: 100%; height: 100%; border: none; background: #525659; }
#vw-body img.vw-img { max-width: 100%; height: auto; margin: 14px auto; display: block; border-radius: 4px; }
.vw-doc { padding: 26px 32px; background: var(--paper); margin: 14px; border: 1px solid var(--border); border-radius: 4px; font-family: var(--font-serif); font-size: 14.5px; line-height: 1.55; color: var(--ink); }
.vw-doc h1, .vw-doc h2, .vw-doc h3 { margin: 16px 0 6px; line-height: 1.25; }
.vw-doc p { margin: 0 0 8px; }
.vw-doc img { max-width: 100%; height: auto; }
.vw-doc table { border-collapse: collapse; margin: 8px 0; }
.vw-doc td, .vw-doc th { border: 1px solid var(--border); padding: 4px 8px; }
.vw-doc ul, .vw-doc ol { padding-left: 22px; margin: 0 0 8px; }
.vw-slide { margin: 12px 14px 0; padding: 16px 20px; background: var(--paper); border: 1px solid var(--border); border-radius: 6px; font-family: var(--font-ui); }
.vw-slide .vw-sn { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); margin-bottom: 6px; }
.vw-slide h4 { font-size: 16px; margin: 0 0 8px; line-height: 1.3; }
.vw-slide p { font-size: 13.5px; line-height: 1.5; margin: 0 0 5px; color: var(--ink-2); }
.vw-slide p.vw-li { padding-left: 14px; position: relative; }
.vw-slide p.vw-li::before { content: "•"; position: absolute; left: 2px; color: var(--tint); }
.vw-slide img { max-width: 100%; height: auto; margin-top: 8px; border-radius: 4px; }
.vw-slide .vw-notes { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--border); font-size: 12px; color: var(--ink-3); }
.vw-pre { white-space: pre-wrap; font-family: var(--font-mono); font-size: 12.5px; padding: 18px 22px; line-height: 1.5; }
.vw-empty { padding: 30px 24px; color: var(--ink-3); font-size: 13px; line-height: 1.6; text-align: center; }
.vw-empty .cta { margin: 12px auto 0; display: inline-block; }
.vw-recent { text-align: left; margin-top: 18px; }
.vw-recent .vw-rtitle { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); margin-bottom: 6px; }
.vw-recent button { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 7px 10px; border-radius: 6px; font-size: 13px; color: var(--ink-2); }
.vw-recent button:hover { background: var(--hover); color: var(--ink); }
.vw-recent button .vw-rx { margin-left: auto; color: var(--ink-3); }
.vw-recent button .vw-rx:hover { color: var(--danger); }
.vw-drop { outline: 2px dashed var(--tint); outline-offset: -8px; }

/* tableaux : colonnes redimensionnables, menu contextuel */
.tbl > tbody > tr > td { position: relative; }
.tbl .tbl-rz { position: absolute; top: 0; bottom: 0; right: -4px; width: 8px; cursor: col-resize; z-index: 2; }
.tbl .tbl-rz:hover, .tbl .tbl-rz.on { background: color-mix(in srgb, var(--tint) 45%, transparent); }
.tbl col.sel { background: var(--tint-soft); }
body.tbl-resizing, body.tbl-resizing * { cursor: col-resize !important; user-select: none; }

@media print {
  .lnk { background: #e8eef3 !important; color: #2a4a63 !important; border-color: #c5d2dc !important; }
  .lnk-print { display: flex !important; flex-wrap: wrap; gap: 10px 22px; margin: 6px 0 4px; }
  .lnk-print .lq { display: flex; align-items: center; gap: 8px; font-family: var(--font-ui); font-size: 10.5px; color: #46494e; max-width: 46%; }
  .lnk-print .lq svg { width: 58px; height: 58px; flex: none; }
  .lnk-print .lq b { display: block; color: #1a1a1a; font-size: 11px; }
  .lnk-print .lq span { word-break: break-all; }
  #dictpanel, #calpanel, #viewpanel, .cal-now, .tbl-rz { display: none !important; }
  #view-editor.view-open #docwrap { padding: 0; }
  /* textes d'aide (« Écrivez, ou tapez / », « Titre… », champs de fiche…) : jamais dans le PDF */
  #blocks [data-ph]::before, #blocks .jref::before, #blocks .jval::before, #blocks figcaption::before, #blocks .qcite::before { content: none !important; }
}
/* idem pendant la préparation du PDF (version PC) et dans l'export HTML */
body.printing #blocks [data-ph]::before, body.printing #blocks .jref::before, body.printing #blocks .jval::before, body.printing #blocks figcaption::before, body.printing #blocks .qcite::before { content: none !important; }

/* ---------------- séparateur (« -- » + Entrée, /séparateur) ---------------- */
.block.hr { margin: 6px 0; padding: 10px 0; cursor: pointer; }
.block.hr hr { border: 0; border-top: 1.5px solid var(--border); margin: 0; }
.block.hr.objsel { outline: none; }
.block.hr.objsel hr { border-top-color: var(--tint); border-top-width: 2px; }
@media print { .block.hr hr { border-top-color: #c9ccd1; } }

/* ---------------- cartes : 3 par ligne, titre + texte ---------------- */
.block.cards { margin: 12px 0; }
.cards-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.card-item { border: 1px solid var(--border); border-left: 3px solid var(--tint); border-radius: 10px; padding: 10px 12px 11px; background: color-mix(in srgb, var(--tint) 4%, var(--paper)); min-height: 74px; display: flex; flex-direction: column; gap: 4px; transition: box-shadow .12s, border-color .12s; }
.card-item:focus-within { border-color: color-mix(in srgb, var(--tint) 45%, var(--border)); box-shadow: 0 2px 10px color-mix(in srgb, var(--tint) 14%, transparent); }
.card-item .cd-t { font-family: var(--font-ui); font-weight: 700; font-size: 13.5px; color: var(--ink); outline: none; min-height: 1.3em; position: relative; }
.card-item .cd-x { font-size: 14px; line-height: 1.45; color: var(--ink-2); outline: none; min-height: 1.4em; flex: 1; position: relative; }
.card-item .cd-t:has(> br:only-child)::before, .card-item .cd-x:has(> br:only-child)::before, .card-item .cd-t:empty::before, .card-item .cd-x:empty::before { content: attr(data-ph); position: absolute; left: 0; top: 0; color: var(--ink-3); opacity: .5; pointer-events: none; white-space: nowrap; }
.cards-tools { display: flex; gap: 4px; margin-top: 6px; opacity: 0; transition: opacity .15s; }
.block.cards:hover .cards-tools, .block.cards:focus-within .cards-tools { opacity: 1; }
.cards-tools button { font-family: var(--font-ui); font-size: 11.5px; padding: 3px 9px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface); color: var(--ink-2); }
.cards-tools button:hover { background: var(--hover); color: var(--ink); }
.cards-tools button.danger:hover { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 40%, var(--border)); }
@media (max-width: 700px) { .cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media print {
  .cards-tools { display: none !important; }
  .card-item { break-inside: avoid; border-color: #c9ccd1; }
  .block.cards { page-break-inside: avoid; }
}
body.printing .cards-tools { display: none !important; }

/* configuration guidée de la clé API (panneau IA et Paramètres) */
.ai-setuptitle { font-size: 14px; font-weight: 700; padding: 8px 2px 4px; }
.ai-keystate { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-2); padding: 6px 8px; border-radius: 6px; background: var(--bg); margin: 4px 0 8px; line-height: 1.4; }
.ai-keystate .ai-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ink-3); flex: none; }
.ai-keystate.ok { color: var(--ok); }
.ai-keystate.ok .ai-dot { background: var(--ok); }
.ai-steps { margin: 4px 0 10px 18px; padding: 0; font-size: 12.5px; color: var(--ink-2); line-height: 1.5; }
.ai-steps li { margin-bottom: 6px; }
.ai-steps li::marker { font-weight: 700; color: var(--tint); }
.ai-steps a, .ai-keymsg a { color: var(--tint); }
.ai-steps code { font-family: var(--font-mono); font-size: 11.5px; background: var(--bg); padding: 0 4px; border-radius: 4px; }
.ai-keyrow { display: flex; gap: 6px; }
.ai-keyinput { flex: 1; min-width: 0; border: 1px solid var(--border); background: var(--bg); border-radius: 6px; padding: 8px 10px; outline: none; font-family: var(--font-mono); font-size: 12.5px; color: var(--ink); }
.ai-keyinput:focus { border-color: var(--tint); }
.ai-keyeye { width: 36px; border: 1px solid var(--border); border-radius: 6px; background: var(--bg); font-size: 14px; }
.ai-keyeye:hover { background: var(--hover); }
.ai-keybtns { display: flex; gap: 6px; margin-top: 8px; align-items: center; }
.ai-keybtns .pobtn { padding: 7px 12px; border-radius: 6px; background: var(--tint); color: #fff; font-weight: 600; font-size: 12.5px; }
.ai-keybtns .pobtn:disabled { opacity: .6; cursor: default; }
.ai-keymsg { font-size: 12.5px; margin-top: 8px; line-height: 1.45; min-height: 1em; color: var(--ink-2); }
.ai-keymsg.ok { color: var(--ok); font-weight: 600; }
.ai-keymsg.err { color: var(--danger); }
.ai-keymsg:empty { display: none; }

/* impression : fonds opaques (les transparences sortaient en noir dans certains PDF) */
@media print {
  .refart, .calc-res { background: #e8eef3 !important; border-color: #c5d2dc !important; color: #2a4a63 !important; }
  mark, .hl { background: #f5e6b3 !important; }
  ::selection { background: transparent; }
  .block.callout { background: color-mix(in srgb, var(--cc) 8%, #fff) !important; border-color: color-mix(in srgb, var(--cc) 30%, #fff) !important; }
  .block.quote .btxt { border-left-color: color-mix(in srgb, var(--tint) 55%, #fff) !important; }
  .block.juris { border-color: color-mix(in srgb, #8c4351 30%, #fff) !important; background: color-mix(in srgb, #8c4351 5%, #fff) !important; }
  .juris-head { background: color-mix(in srgb, #8c4351 12%, #fff) !important; }
  .juris-grid > div { border-top-color: color-mix(in srgb, #8c4351 12%, #fff) !important; }
  .tbl.has-head > tbody > tr:first-child > td:not([style]) { background: #eef2f6 !important; }
  .tbl td, .nb-tbl td { border-color: #b9bec6 !important; }
  .tbl .tcell:focus { box-shadow: none !important; }
  .block.formula, .block.table, .block.graph { page-break-inside: avoid; }
  .block.formula:hover { background: transparent !important; }
  ::highlight(alixo-corr) { background-color: transparent; text-decoration: none; }
  .corr-notes, .tbl-tools, #day-banner, #aipanel, #calcpanel, #save-status { display: none !important; }
  #view-editor.calc-open #docwrap { padding: 0; }
  #view-editor, #docwrap, #doc { background: #fff !important; }
  #doc-meta { margin: 0 0 18px; color: #46494e; }
  #doc-prof { border: none; padding: 0; color: #1a1a1a; }
  #doc-meta:has(#doc-prof:placeholder-shown) { display: none; }
}

/* ============================================================
   1.6.1 — agenda (vue mois), sélection et couleurs de cases, listes
   dans les tableaux, suggestions de mise en forme par IA
   ============================================================ */
/* entrée « Agenda » de l'explorateur */
.ln-agenda { display: flex; align-items: center; gap: 9px; width: 100%; padding: 6px 8px; border-radius: 6px; margin-bottom: 6px; font-size: 13.5px; font-weight: 550; color: var(--ink-2); text-align: left; }
.ln-agenda:hover { background: var(--hover); color: var(--ink); }
.ln-agenda.active { background: var(--tint-soft); color: var(--ink); font-weight: 600; }
.ln-agenda .ln-cal { width: 26px; height: 28px; flex: none; border-radius: 6px; border: 1.5px solid var(--danger); display: flex; flex-direction: column; align-items: center; overflow: hidden; background: var(--surface); }
.ln-agenda .ln-cal b { display: block; width: 100%; font-size: 7px; line-height: 9px; text-align: center; background: var(--danger); color: #fff; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.ln-agenda .ln-cal span { font-size: 13px; line-height: 17px; font-weight: 700; color: var(--ink); }
.ln-agenda .ln-next { margin-left: auto; font-size: 11px; color: var(--ink-3); font-weight: 600; max-width: 84px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ln-agenda .ln-next.live { color: var(--ok); }
body.lib-agenda .lib-head { display: none; }
#lib-agenda { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.ag-head { display: flex; align-items: center; gap: 10px; padding: 0 2px 12px; }
.ag-month { font-size: 26px; font-weight: 650; letter-spacing: -.01em; }
.ag-month b { color: var(--danger); font-weight: 650; }
.ag-nav { display: inline-flex; border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; margin-left: 6px; background: var(--surface); }
.ag-nav button { height: 32px; min-width: 34px; padding: 0 10px; display: grid; place-items: center; color: var(--ink-2); font-size: 13px; font-weight: 600; }
.ag-nav button + button { border-left: 1px solid var(--border); }
.ag-nav button:hover { background: var(--hover); color: var(--ink); }
.ag-head .cta { margin-left: auto; }
.ag-body { flex: 1; display: flex; gap: 14px; min-height: 0; }
.ag-grid { flex: 1; display: grid; grid-template-columns: repeat(7, 1fr); grid-template-rows: 28px; grid-auto-rows: minmax(0, 1fr); border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; background: var(--surface); min-height: 0; }
.ag-dow { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); text-align: right; padding: 7px 8px 0; border-bottom: 1px solid var(--border); }
.ag-cell { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 4px 5px 4px; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: 2px; position: relative; }
.ag-grid > :nth-child(7n) { border-right: none; }
.ag-cell.other { background: color-mix(in srgb, var(--bg) 70%, var(--surface)); }
.ag-cell.other .ag-dnum { color: var(--ink-3); }
.ag-cell.we:not(.other) { background: color-mix(in srgb, var(--bg) 40%, var(--surface)); }
.ag-cell:hover { background: var(--hover); }
.ag-cell.sel { box-shadow: inset 0 0 0 2px var(--tint); }
.ag-dnum { align-self: flex-end; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 600; color: var(--ink); }
.ag-cell.today .ag-dnum { background: var(--danger); color: #fff; }
.ag-ev { display: flex; align-items: center; gap: 5px; width: 100%; padding: 1px 5px; border-radius: 4px; font-size: 11.5px; color: var(--ink); text-align: left; overflow: hidden; white-space: nowrap; background: color-mix(in srgb, var(--ec) 14%, transparent); }
.ag-ev:hover { background: color-mix(in srgb, var(--ec) 28%, transparent); }
.ag-ev .ag-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ec); flex: none; }
.ag-ev .ag-t { color: var(--ink-3); font-variant-numeric: tabular-nums; flex: none; }
.ag-ev .ag-title { overflow: hidden; text-overflow: ellipsis; font-weight: 550; }
.ag-ev.now { outline: 1.5px solid var(--ok); outline-offset: -1px; }
.ag-ev.past { opacity: .6; }
.ag-more { font-size: 11px; color: var(--ink-3); padding: 0 5px; }
.ag-side { width: 300px; flex: none; display: flex; flex-direction: column; gap: 8px; overflow-y: auto; border: 1px solid var(--border); border-radius: var(--r); background: var(--surface); padding: 14px 14px 18px; }
.ag-sdate { font-size: 11.5px; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); font-weight: 700; margin-bottom: 4px; }
.ag-sdate b { display: block; font-size: 22px; font-weight: 650; color: var(--ink); text-transform: none; letter-spacing: -.01em; font-family: var(--font-serif); margin-top: 2px; }
.ag-sdate.today b { color: var(--danger); }
.ag-side .cal-ev { margin-bottom: 0; }
.ag-side .ag-add { align-self: flex-start; margin-top: 2px; }
.ag-stitle { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); margin-top: 12px; }
.ag-up { display: flex; gap: 8px; align-items: center; padding: 6px 0; font-size: 12.5px; color: var(--ink-2); border-top: 1px solid var(--border); cursor: pointer; }
.ag-up:hover { color: var(--ink); }
.ag-up .ag-ud { width: 58px; flex: none; font-weight: 600; color: var(--ink-3); font-size: 11.5px; }
.ag-up .ag-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ec); flex: none; }
.ag-up span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(#popover, .po-scope) .po-colors button.fcol { outline: 2px dashed color-mix(in srgb, var(--ink) 35%, transparent); outline-offset: 1px; }

/* tableaux : sélection de cases, couleur de fond, listes */
.tbl td.tsel { box-shadow: inset 0 0 0 200px color-mix(in srgb, var(--tint) 22%, transparent); }
.block.table.tselecting, .block.table.tselecting .tcell { user-select: none; }
.tbl td[style] .tcell, .tbl td[style] .tcell a.lnk, .tbl td[style] .tcell .refart { color: #202124; }
.tbl td[style] .tcell a.lnk, .tbl td[style] .tcell .refart { background: rgba(255, 255, 255, .55); }
.tcell ul, .tcell ol { margin: 2px 0; padding-left: 20px; }
.tcell li { margin: 1px 0; }
#ctxmenu .cm-colors { display: flex; gap: 6px; padding: 6px 10px 9px; border-bottom: 1px solid var(--border); margin-bottom: 4px; }
#ctxmenu .cm-colors button { width: 22px; height: 22px; padding: 0; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .18); display: grid; place-items: center; font-size: 11px; color: var(--ink-3); transition: transform .1s; }
#ctxmenu .cm-colors button:hover { transform: scale(1.15); background-color: inherit; }
#ctxmenu .cm-colors button.none { background: var(--surface); }

/* suggestion de mise en forme (IA) sous un paragraphe */
.ai-sug { display: flex; align-items: center; gap: 8px; margin: 4px 0 2px; padding: 5px 9px; border-radius: 6px; font-family: var(--font-ui); font-size: 12px; color: var(--ink-2); background: color-mix(in srgb, var(--tint) 8%, transparent); border: 1px dashed color-mix(in srgb, var(--tint) 45%, transparent); user-select: none; }
.ai-sug .as-txt { flex: 1; min-width: 0; }
.ai-sug .as-txt b { color: var(--ink); }
.ai-sug kbd { font: 600 10.5px var(--font-ui); padding: 1px 5px; border: 1px solid var(--border); border-bottom-width: 2px; border-radius: 4px; background: var(--surface); color: var(--ink-2); }
.ai-sug .as-keys { color: var(--ink-3); white-space: nowrap; }
.ai-sug button { padding: 3px 9px; border-radius: 5px; font-size: 12px; font-weight: 600; }
.ai-sug .as-ok { background: var(--tint); color: #fff; }
.ai-sug .as-no { color: var(--ink-3); }
.ai-sug .as-no:hover { background: var(--hover); color: var(--danger); }
.ai-toggle { display: flex; align-items: flex-start; gap: 7px; font-size: 12.5px; color: var(--ink-2); margin-top: 8px; cursor: pointer; line-height: 1.4; }
.ai-toggle input { accent-color: var(--tint); margin-top: 2px; flex: none; }
.ai-exc { color: var(--ink-2); font-weight: 400; }

/* proposition IA : plusieurs lignes (corrections + mise en forme) */
.ai-sug { flex-direction: column; align-items: stretch; gap: 3px; }
.ai-sug .as-row { display: flex; align-items: center; gap: 8px; }
.ai-sug .as-item { display: flex; align-items: center; gap: 6px; padding-left: 22px; }
.ai-sug .as-item .as-txt s { color: var(--danger); text-decoration-color: color-mix(in srgb, var(--danger) 70%, transparent); }
.ai-sug .as-item .as-txt b { color: var(--ok); }
.ai-sug .as-rule { color: var(--ink-3); }
.ai-sug .as-mini { width: 22px; height: 22px; padding: 0; border-radius: 5px; display: grid; place-items: center; font-size: 12px; color: var(--ink-3); flex: none; }
.ai-sug .as-fixok:hover, .ai-sug .as-styleok:hover { background: var(--ok); color: #fff; }
.ai-sug .as-fixno:hover, .ai-sug .as-styleno:hover { background: var(--hover); color: var(--danger); }

/* ============================================================
   2.0 — éditeur continu (une seule zone d'écriture, façon Google Docs),
   listes, taille de police libre, exposant / indice, images
   ============================================================ */
#blocks { outline: none; min-height: 40vh; }
#blocks:focus { outline: none; }
/* les blocs ne sont plus des zones séparées : pas de poignée, pas de cadre */
.bhandle { display: none !important; }
.block { margin: 0; border-radius: 0; }
.block > .btxt { outline: none; min-height: 1.4em; }
.block > .btxt:empty::before,
.block.p > .btxt:empty::before { content: ""; }
/* aide-mémoire visible seulement quand le paragraphe vide est le seul du cours ou porte le curseur */
.block.p.cur > .btxt:empty::before, .block.p:only-child > .btxt:empty::before { content: attr(data-ph); color: var(--ink-3); opacity: .55; pointer-events: none; }
.block.h.cur > .btxt:empty::before, .block.callout.cur > .btxt:empty::before { content: attr(data-ph); color: var(--ink-3); opacity: .55; pointer-events: none; }
.block.p .btxt { padding: 2px 0; }

/* titres : le numéro est dessiné par CSS (hors du texte éditable) */
.block.h::before {
  content: attr(data-num); flex: none; font-family: var(--font-serif); font-weight: 700; color: var(--tint);
  user-select: none; font-variant-numeric: tabular-nums; margin-right: 12px;
}
.block.h { gap: 0; }
.block.h .hnum { display: none; }
.block.h.l1::before { font-size: 23px; } .block.h.l2::before { font-size: 19.5px; } .block.h.l3::before { font-size: 17px; } .block.h.l4::before { font-size: 16px; font-style: italic; font-weight: 600; }

/* listes : puces, numéros, cases à cocher, 4 niveaux de retrait */
.block.li { display: flex; align-items: flex-start; gap: 0; }
.block.li .btxt { flex: 1; padding: 2px 0; position: static; }
.block.li .btxt::after { content: none; }
.block.li::before { content: "•"; flex: none; width: 24px; padding-left: 6px; color: var(--tint); font-weight: 700; font-family: var(--font-serif); font-size: 16.5px; line-height: 1.55; user-select: none; }
.block.li.ind1::before { content: "◦"; }
.block.li.ind2::before { content: "▪"; font-size: 12px; line-height: 2.1; }
.block.li.ind3::before { content: "•"; }
.block.li.ol::before { content: attr(data-num); width: auto; min-width: 24px; padding-right: 6px; font-variant-numeric: tabular-nums; font-weight: 650; }
.block.li.ind1 { margin-left: 28px; } .block.li.ind2 { margin-left: 56px; } .block.li.ind3 { margin-left: 84px; }
.block.li.cl::before { content: none; }
.block.li.cl .cbox {
  flex: none; width: 17px; height: 17px; margin: 6px 9px 0 3px; border-radius: 4px; cursor: pointer;
  border: 1.6px solid var(--ink-3); background: var(--paper); display: grid; place-items: center; user-select: none;
}
.block.li.cl .cbox::after { content: ""; width: 9px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: translateY(-1px) rotate(-45deg); opacity: 0; }
.block.li.cl.done .cbox { background: var(--tint); border-color: var(--tint); }
.block.li.cl.done .cbox::after { opacity: 1; }
.block.li.cl.done .btxt { color: var(--ink-3); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--ink-3) 60%, transparent); }

/* exposant / indice */
#blocks sup, #blocks sub { font-size: .72em; line-height: 0; }
#blocks sup { vertical-align: .45em; } #blocks sub { vertical-align: -.25em; }

/* objets non éditables dans le flux : sélection visible */
.block.formula, .block.graph, .block.table, .block.img { position: relative; }
.block.objsel { outline: 2px solid var(--tint); outline-offset: 3px; border-radius: 4px; }
.block.objsel .graph-card, .block.objsel .frender { background: var(--tint-soft); }
.block.formula::selection, .block.graph::selection, .block.graph *::selection { background: transparent; }
/* poignée de déplacement des objets (glisser pour déplacer) */
.mv-handle {
  position: absolute; left: -30px; top: 6px; width: 22px; height: 22px; border-radius: 6px; z-index: 3;
  display: grid; place-items: center; color: var(--ink-3); opacity: 0; cursor: grab; user-select: none; font-size: 14px; letter-spacing: -1px;
  background: var(--surface); border: 1px solid var(--border);
}
.block:hover > .mv-handle, .block.objsel > .mv-handle { opacity: 1; }
.mv-handle:active { cursor: grabbing; }
.block.drop-before::before, .block.drop-after::after {
  content: ""; position: absolute; left: 0; right: 0; height: 3px; border-radius: 2px; background: var(--tint); z-index: 5;
}
.block.drop-before::before { top: -4px; } .block.drop-after::after { bottom: -4px; }
.block.h.drop-before::before { content: ""; margin: 0; font-size: 0; }
#drag-ghost { position: fixed; z-index: 120; pointer-events: none; opacity: .85; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); padding: 4px; max-width: 220px; max-height: 160px; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,.2); }
#drag-ghost img { display: block; max-width: 100%; max-height: 150px; }
body.blk-dragging, body.blk-dragging * { cursor: grabbing !important; user-select: none !important; }

/* images */
.block.img { margin: 10px 0; --w: 60%; }
.block.img.al-center { display: flow-root; text-align: center; clear: both; }
.block.img.al-center .imgbox { margin: 0 auto; }
.block.img.al-left { float: left; width: var(--w); margin: 4px 22px 8px 0; }
.block.img.al-right { float: right; width: var(--w); margin: 4px 0 8px 22px; }
.block.img.al-left .imgbox, .block.img.al-right .imgbox { width: 100%; }
.block.img .imgbox { position: relative; width: var(--w); max-width: 100%; overflow: hidden; border-radius: 4px; background: var(--hover); aspect-ratio: var(--ar, 4 / 3); }
.block.img .imgbox img { display: block; width: var(--iw, 100%); max-width: none; height: auto; transform: translate(var(--tx, 0), var(--ty, 0)); transform-origin: 0 0; user-select: none; -webkit-user-drag: none; }
.block.img .imgbox.loading::after { content: "Chargement de l’image…"; position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--font-ui); font-size: 12.5px; color: var(--ink-3); }
.block.img .imgbox.missing::after { content: "Image non disponible sur cet appareil"; position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--font-ui); font-size: 12.5px; color: var(--ink-3); }
.block.img figcaption { font-family: var(--font-ui); font-size: 12.5px; color: var(--ink-2); text-align: center; padding: 5px 8px 0; outline: none; width: var(--w); max-width: 100%; margin: 0 auto; }
.block.img.al-left figcaption, .block.img.al-right figcaption { width: 100%; }
.block.img figcaption:empty::before { content: "Légende…"; color: var(--ink-3); opacity: .6; }
.block.img.objsel { outline: none; }
.block.img.objsel .imgbox { box-shadow: 0 0 0 2px var(--tint); }
.block.img .rz { position: absolute; width: 11px; height: 11px; border-radius: 50%; background: var(--surface); border: 2px solid var(--tint); z-index: 4; display: none; }
.block.img.objsel .rz { display: block; }
.block.img .rz.nw { left: -5px; top: -5px; cursor: nwse-resize; } .block.img .rz.ne { right: -5px; top: -5px; cursor: nesw-resize; }
.block.img .rz.sw { left: -5px; bottom: -5px; cursor: nesw-resize; } .block.img .rz.se { right: -5px; bottom: -5px; cursor: nwse-resize; }
.block.img .rz.e { right: -5px; top: calc(50% - 5px); cursor: ew-resize; } .block.img .rz.w { left: -5px; top: calc(50% - 5px); cursor: ew-resize; }
body.img-resizing, body.img-resizing * { user-select: none !important; }
.block.img .imgbox img { cursor: default; }
.block.img.objsel .imgbox img { cursor: move; }
/* recadrage */
.block.img.cropping .imgbox { overflow: visible; aspect-ratio: var(--nar); background: none; }
.block.img.cropping .imgbox img { --iw: 100%; --tx: 0; --ty: 0; transform: none; opacity: .55; cursor: default; }
.block.img.cropping .rz { display: none; }
.crop-rect { position: absolute; box-sizing: border-box; border: 1.5px solid #fff; box-shadow: 0 0 0 1px var(--tint), 0 0 0 9999px rgba(0, 0, 0, .35); cursor: move; z-index: 5; overflow: visible; }
.crop-rect .cimg { position: absolute; left: 0; top: 0; overflow: hidden; width: 100%; height: 100%; pointer-events: none; }
.crop-rect .cimg img { position: absolute; display: block; max-width: none; opacity: 1 !important; transform: none !important; }
.crop-rect .ch { position: absolute; width: 12px; height: 12px; background: #fff; border: 1.5px solid var(--tint); border-radius: 2px; z-index: 6; }
.crop-rect .ch.nw { left: -7px; top: -7px; cursor: nwse-resize; } .crop-rect .ch.ne { right: -7px; top: -7px; cursor: nesw-resize; }
.crop-rect .ch.sw { left: -7px; bottom: -7px; cursor: nesw-resize; } .crop-rect .ch.se { right: -7px; bottom: -7px; cursor: nwse-resize; }
.crop-rect .ch.n { left: calc(50% - 6px); top: -7px; cursor: ns-resize; } .crop-rect .ch.s { left: calc(50% - 6px); bottom: -7px; cursor: ns-resize; }
.crop-rect .ch.e { right: -7px; top: calc(50% - 6px); cursor: ew-resize; } .crop-rect .ch.w { left: -7px; top: calc(50% - 6px); cursor: ew-resize; }
.crop-bar { display: flex; gap: 6px; justify-content: center; padding: 8px 0 0; font-family: var(--font-ui); }
.crop-bar button { padding: 5px 12px; border-radius: 6px; font-size: 12.5px; font-weight: 600; background: var(--surface); border: 1px solid var(--border); color: var(--ink); }
.crop-bar button.ok { background: var(--tint); color: #fff; border-color: transparent; }
.crop-bar button:hover { filter: brightness(1.06); }
/* barre flottante de l'image */
#imgbar {
  position: fixed; z-index: 94; display: flex; align-items: center; gap: 2px; padding: 4px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r); box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}
#imgbar button { width: 32px; height: 30px; border-radius: 6px; display: grid; place-items: center; color: var(--ink-2); }
#imgbar button:hover { background: var(--hover); color: var(--ink); }
#imgbar button.on { background: var(--tint-soft); color: var(--tint); }
#imgbar button.danger:hover { color: var(--danger); }
#imgbar button svg { width: 17px; height: 17px; }
#imgbar .tb-sep { width: 1px; height: 18px; background: var(--border); margin: 0 4px; }
#docwrap.img-drop #doc { outline: 2px dashed var(--tint); outline-offset: -6px; }

/* barre d'outils : taille de police */
#toolbar .fsize { display: flex; align-items: center; gap: 0; border: 1px solid var(--border); border-radius: 6px; height: 30px; overflow: hidden; }
#toolbar .fsize button { width: 26px; height: 28px; border-radius: 0; font-size: 15px; }
#toolbar .fsize input { width: 38px; height: 28px; border: none; border-left: 1px solid var(--border); border-right: 1px solid var(--border); background: none; text-align: center; font-size: 13px; font-weight: 600; outline: none; color: var(--ink); }
#toolbar .fsize input:focus { background: var(--tint-soft); }
#toolbar button.on { background: var(--tint-soft); color: var(--tint); }
#toolbar .tlabel sup, #toolbar .tlabel sub { font-size: .7em; }
#toolbar [data-list] svg circle { stroke: none; }

/* impression */
@media print {
  .block.img { page-break-inside: avoid; }
  .block.img .rz, .mv-handle, #imgbar, #drag-ghost, .crop-bar, .block.li.cl .cbox { display: none !important; }
  .block.li.cl::before { content: "☐"; width: 24px; }
  .block.li.cl.done::before { content: "☑"; }
  .block.objsel { outline: none; }
  .block.objsel .imgbox { box-shadow: none; }
  .block.h::before { color: #33658a; }
}

/* taille de base : 16 px (affichée dans la barre d'outils) */
.block.p .btxt, .block.li .btxt { font-size: 16px; }
.block.callout .btxt { font-size: 15.5px; }

/* paragraphes vides : un <br> porte le curseur ; l'aide-mémoire s'affiche quand même */
.block.p.cur > .btxt:has(> br:only-child)::before, .block.p:only-child > .btxt:has(> br:only-child)::before,
.block.h.cur > .btxt:has(> br:only-child)::before, .block.callout.cur > .btxt:has(> br:only-child)::before { content: attr(data-ph); color: var(--ink-3); opacity: .55; pointer-events: none; }
.juris-head .jref:has(> br:only-child)::before { content: "Cass. civ. 1re, 12 juill. 2023, n° 22-14.081"; opacity: .45; }
.juris-grid .jval:has(> br:only-child)::before { content: "…"; opacity: .35; }

/* ============================================================
   2.1 — encadré Bilan, alignement, palette, dessin, images (barre,
   taille), notes éphémères, heures de l'agenda, onglets déplaçables
   ============================================================ */
/* encadré Bilan : synthèse de fin de partie */
.block.callout[data-ct="bilan"] { --cc: #2e8b8b; border-width: 1.5px; border-style: solid; background: color-mix(in srgb, var(--cc) 6%, var(--paper)); padding-top: 15px; }
html[data-theme="dark"] .block.callout[data-ct="bilan"] { --cc: #5cc0c0; }
.block.callout .ctitle .csub { margin-left: 8px; font-weight: 500; text-transform: none; letter-spacing: 0; opacity: .7; font-size: 11px; }
.block.callout[data-ct="bilan"] .btxt { font-size: 15.5px; line-height: 1.6; }
@media print { html[data-theme="dark"] .block.callout[data-ct="bilan"] { --cc: #2e8b8b; } }

/* alignement du texte (blocs) et des cases */
.block.al-center > .btxt { text-align: center; }
.block.al-right > .btxt { text-align: right; }
.block.al-justify > .btxt { text-align: justify; }
.block.h.al-center { justify-content: center; }
.block.h.al-right { justify-content: flex-end; }
.block.h.al-center > .btxt, .block.h.al-right > .btxt { flex: 0 1 auto; }
.tbl td[style] .tcell, .tbl td[style] .tcell a.lnk, .tbl td[style] .tcell .refart { color: inherit; }
.tbl td[style] .tcell a.lnk { color: #202124; }
.tcell ul { list-style: disc; } .tcell ol { list-style: decimal; }
#ctxmenu .cm-aligns { display: flex; gap: 4px; padding: 4px 8px 8px; border-bottom: 1px solid var(--border); margin-bottom: 4px; }
#ctxmenu .cm-aligns button { width: 32px; height: 28px; padding: 0; display: grid; place-items: center; border-radius: 6px; color: var(--ink-2); }
#ctxmenu .cm-aligns button.on { background: var(--tint-soft); color: var(--tint); }
#ctxmenu .cm-aligns button svg { width: 16px; height: 16px; }
#ctxmenu .cm-sizes button { width: auto; padding: 0 9px; font-size: 12px; font-weight: 600; }
#ctxmenu .cm-colors button.more { background: var(--surface); font-weight: 700; color: var(--ink-2); }

/* palette de couleurs (texte, surlignage, cases, dessin) */
:is(#popover, .po-scope) .pal-quick { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; }
:is(#popover, .po-scope) .pal-quick button, :is(#popover, .po-scope) .pal-grid button { width: 22px; height: 22px; border-radius: 4px; border: 1px solid rgba(0, 0, 0, .14); padding: 0; transition: transform .08s; }
:is(#popover, .po-scope) .pal-quick button:hover, :is(#popover, .po-scope) .pal-grid button:hover { transform: scale(1.18); outline: 1px solid var(--ink); z-index: 1; position: relative; }
:is(#popover, .po-scope) .pal-quick button.sel, :is(#popover, .po-scope) .pal-grid button.sel { outline: 2px solid var(--ink); outline-offset: 1px; }
:is(#popover, .po-scope) .pal-quick button.none { background: var(--surface); color: var(--ink-2); display: grid; place-items: center; font-size: 13px; font-weight: 600; width: auto; padding: 0 8px; }
:is(#popover, .po-scope) .pal-grid { display: grid; grid-template-columns: repeat(10, 22px); gap: 4px; }
:is(#popover, .po-scope) .pal-custom { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: 12px; color: var(--ink-2); }
:is(#popover, .po-scope) .pal-custom label { display: flex; align-items: center; gap: 8px; }
:is(#popover, .po-scope) .pal-custom input[type="color"] { width: 34px; height: 26px; padding: 0; border: 1px solid var(--border); border-radius: 5px; background: none; flex: none; cursor: pointer; }
:is(#popover, .po-scope) .img-presets button { width: auto; padding: 0 9px; font-size: 12px; font-weight: 600; background: var(--bg); color: var(--ink); height: 26px; }
:is(#popover, .po-scope) .img-presets button.sel { background: var(--tint-soft); color: var(--tint); outline: none; }
:is(#popover, .po-scope) .img-size label { font-size: 11.5px; color: var(--ink-3); display: flex; flex-direction: column; gap: 3px; flex: 1; }

/* images : barre sous l'image, bouton de taille ; les encadrés / tableaux évitent les images flottantes */
#imgbar .ib-size { width: auto; padding: 0 9px; font-size: 12px; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.block.callout, .block.quote, .block.juris, .block.table, .block.formula, .block.graph, .block.draw { display: flow-root; }
.block.h { display: flex; }

/* notes de correction : disparaissent en fondu */
.corr-notes { transition: opacity .45s ease; }
.corr-notes.fade { opacity: 0; pointer-events: none; }

/* propositions de l'IA : corrections (vert) et mise en forme (teinte) séparées */
.ai-sug.fixes { border-color: color-mix(in srgb, var(--ok) 50%, transparent); background: color-mix(in srgb, var(--ok) 7%, transparent); }
.ai-sug.fixes .as-ico { color: var(--ok); font-weight: 700; }
.ai-sug.fixes .as-ok { background: var(--ok); }
.ai-sug + .ai-sug { margin-top: 2px; }

/* agenda : champs d'heure */
#popover:has(.po-cal) { width: 380px; }
:is(#popover, .po-scope) .po-cal .ev-time { text-align: center; font-variant-numeric: tabular-nums; }
/* les champs Date / Début / Fin se partagent la ligne : sans min-width:0, la largeur intrinsèque des <input> (≈ 20 caractères)
   poussait « Fin » hors du pop-over */
:is(#popover, .po-scope) .po-cal label { min-width: 0; }
:is(#popover, .po-scope) .po-cal label > input, :is(#popover, .po-scope) .po-cal input[type="date"] { min-width: 0; width: 100%; box-sizing: border-box; }
:is(#popover, .po-scope) .po-cal .po-row > label:has(.ev-time) { flex: 0 0 88px; }

/* onglets : glisser-déposer */
.tab.dragging { opacity: .4; }
.tab.drop-l { box-shadow: -3px 0 0 0 var(--tint); }
.tab.drop-r { box-shadow: 3px 0 0 0 var(--tint); }

/* ---------- 1.9.1 : textes d'aide hors du flux (le curseur reste au début), volet plan, barre épurée ---------- */
.block > .btxt, .juris-head .jref, .juris-grid .jval, .block.img figcaption { position: relative; }
.block > .btxt::before, .juris-head .jref::before, .juris-grid .jval::before, .block.img figcaption::before { position: absolute; left: 0; top: 2px; right: 0; pointer-events: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; user-select: none; }
.block.callout > .btxt::before { top: 0; }
.juris-head .jref::before { top: 0; }
.juris-grid .jval::before { top: 7px; left: 14px; }
.block.img figcaption::before { top: 5px; text-align: center; }
#toolbar .tb-hint { font-size: 11px; color: var(--ink-3); padding: 0 6px; white-space: nowrap; user-select: none; cursor: default; font-family: var(--font-ui); }
.pp-tools { display: flex; flex-direction: column; gap: 3px; padding: 2px 8px 8px; border-bottom: 1px solid var(--border); margin-bottom: 4px; }
.pp-tools button { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 6px 9px; border-radius: 6px; font-size: 12.5px; color: var(--ink-2); }
.pp-tools button:hover { background: var(--hover); color: var(--ink); }
.pp-tools button .tt { font-family: var(--font-serif); font-weight: 700; font-size: 14px; font-style: italic; color: var(--tint); width: 14px; text-align: center; }
#vw-recent { width: 30px; height: 30px; flex: none; }
#vw-recent svg { width: 17px; height: 17px; }
:is(#popover, .po-scope) .vw-hist button { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 7px 9px; border-radius: 6px; font-size: 13px; color: var(--ink); }
:is(#popover, .po-scope) .vw-hist button:hover { background: var(--hover); }
:is(#popover, .po-scope) .vw-hist button:disabled { opacity: .5; cursor: default; }
:is(#popover, .po-scope) .vw-hist .vw-hname { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(#popover, .po-scope) .vw-hist .vw-hdoc { font-size: 11px; color: var(--ink-3); flex: none; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(#popover, .po-scope) .vw-hist .vw-rx { color: var(--ink-3); flex: none; padding: 0 4px; border-radius: 4px; }
:is(#popover, .po-scope) .vw-hist .vw-rx:hover { color: var(--danger); background: var(--hover); }
:is(#popover, .po-scope) .vw-hist svg { width: 15px; height: 15px; color: var(--ink-3); flex: none; }

/* ---------- 1.9.1 : cartes d'événements (agenda du cours et vue mois) ---------- */
.cal-ev { display: block; padding: 9px 12px 9px 13px; border-radius: 10px; border: 1px solid color-mix(in srgb, var(--ec, var(--tint)) 22%, var(--border)); border-left: 4px solid var(--ec, var(--tint)); background: color-mix(in srgb, var(--ec, var(--tint)) 5%, var(--surface)); margin-bottom: 7px; position: relative; transition: background .12s, border-color .12s; }
.cal-ev:hover { background: color-mix(in srgb, var(--ec, var(--tint)) 10%, var(--surface)); }
.cal-ev.now { border-color: color-mix(in srgb, var(--ok) 45%, var(--border)); border-left-color: var(--ok); background: color-mix(in srgb, var(--ok) 8%, var(--surface)); }
.cal-ev.past { opacity: .55; }
.cal-ev .cal-top { display: flex; align-items: center; gap: 8px; min-height: 22px; }
.cal-ev .cal-time { width: auto; flex: none; font-family: var(--font-ui); font-size: 12px; font-weight: 700; letter-spacing: .02em; color: var(--ink-2); font-variant-numeric: tabular-nums; line-height: 1; }
.cal-ev .cal-live { font-size: 11px; font-weight: 700; color: var(--ok); padding: 2px 8px; border-radius: 999px; background: color-mix(in srgb, var(--ok) 14%, transparent); white-space: nowrap; }
.cal-ev .cal-acts { margin-left: auto; display: flex; gap: 2px; flex: none; opacity: 0; transition: opacity .12s; }
.cal-ev:hover .cal-acts, .cal-ev:focus-within .cal-acts { opacity: 1; }
.cal-ev .cal-acts button { width: 24px; height: 24px; border-radius: 5px; color: var(--ink-3); display: grid; place-items: center; font-size: 12px; }
.cal-ev .cal-acts button:hover { background: var(--hover); color: var(--ink); }
.cal-ev .cal-acts button.del:hover { color: var(--danger); }
.cal-ev .cal-main { margin-top: 3px; }
.cal-ev .cal-title { font-family: var(--font-serif); font-size: 15px; font-weight: 650; color: var(--ink); line-height: 1.3; }
.cal-ev .cal-sub { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; align-items: center; font-size: 11.5px; color: var(--ink-2); }
.cal-ev .cal-sub .cal-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; background: color-mix(in srgb, var(--ink-3) 14%, transparent); color: var(--ink-2); font-weight: 500; }
.cal-ev .cal-sub .cal-chip svg { width: 12px; height: 12px; }
.cal-ev .cal-sub button { padding: 2px 9px; border-radius: 999px; font-weight: 600; font-size: 11.5px; color: var(--ec, var(--tint)); background: color-mix(in srgb, var(--ec, var(--tint)) 12%, transparent); }
.cal-ev .cal-sub button:hover { background: color-mix(in srgb, var(--ec, var(--tint)) 22%, transparent); }
.cal-ev .cal-sub button.cal-new { color: var(--ink-2); background: var(--hover); }
.cal-dayhead { padding: 6px 2px 6px; }
.cal-day { margin-bottom: 14px; }
.ag-side .cal-ev { margin-bottom: 0; }

/* ---------- bloc Dessin ---------- */
.block.draw { margin: 12px 0; position: relative; }
/* 1.21 : barre d'outils du dessin rafraîchie — groupes en pastilles, boutons 28 px, trois rangées (outils, trait & fond, texte & disposition) */
.block.draw .draw-tools { display: none; flex-direction: column; gap: 4px; margin-bottom: 8px; padding: 6px 8px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); box-shadow: 0 4px 18px rgba(0, 0, 0, .06); font-family: var(--font-ui); font-size: 12px; user-select: none; }
.block.draw.objsel .draw-tools { display: flex; }
.block.draw .draw-tools .dt-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.block.draw .draw-tools .dt-group { display: inline-flex; gap: 1px; padding: 2px; border-radius: 9px; background: color-mix(in srgb, var(--ink) 5%, transparent); }
.block.draw .draw-tools button { height: 28px; min-width: 28px; padding: 0 5px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; gap: 4px; color: var(--ink-2); font-size: 11.5px; font-weight: 600; transition: background .12s, color .12s, transform .08s; }
.block.draw .draw-tools button:hover { background: var(--paper); color: var(--ink); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.block.draw .draw-tools button:active { transform: scale(.94); }
.block.draw .draw-tools button:focus-visible { outline: 2px solid var(--tint); outline-offset: 1px; }
.block.draw .draw-tools button.on { background: var(--tint); color: #fff; box-shadow: 0 1px 4px color-mix(in srgb, var(--tint) 40%, transparent); }
.block.draw .draw-tools button:disabled { opacity: .35; cursor: default; box-shadow: none; }
.block.draw .draw-tools button:disabled:hover { background: none; }
.block.draw .draw-tools [data-ddel], .block.draw .draw-tools [data-dclear] { color: var(--danger); }
.block.draw .draw-tools button svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.block.draw .draw-tools .dt-sw { width: 16px; height: 16px; border-radius: 5px; border: 1px solid rgba(0, 0, 0, .25); background-clip: padding-box; }
.block.draw .draw-tools .dt-sw.none { background-image: linear-gradient(45deg, transparent 46%, #c04343 46%, #c04343 54%, transparent 54%) !important; }
.block.draw .draw-tools .dt-lab { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); padding: 0 2px 0 4px; }
.block.draw .draw-tools .dt-quick button { min-width: 24px; width: 24px; padding: 0; }
.block.draw .draw-tools .dt-quick .dt-sw { width: 14px; height: 14px; }
.block.draw .draw-tools .dt-quick button.on { background: none; box-shadow: none; }
.block.draw .draw-tools .dt-quick button.on .dt-sw { outline: 2px solid var(--tint); outline-offset: 1px; }
.block.draw .draw-tools button b { font-family: var(--font-serif); font-size: 13px; }
.block.draw .draw-tools .dt-widths i { display: block; width: 16px; background: currentColor; border-radius: 2px; }
.block.draw .draw-tools .dt-op { font-variant-numeric: tabular-nums; font-size: 11px; }
.block.draw .draw-tools .dt-hint { margin-left: auto; font-size: 10.5px; color: var(--ink-3); white-space: nowrap; }
.block.draw .draw-wrap { position: relative; background: #fff; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .02); }
.block.draw.objsel .draw-wrap { border-color: color-mix(in srgb, var(--tint) 55%, var(--border)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--tint) 14%, transparent); }
.block.draw .draw-wrap svg { display: block; width: 100%; height: auto; stroke: none; fill: none; }
.block.draw .draw-wrap svg text { user-select: none; }
.block.draw .draw-wrap .dgrid { pointer-events: none; }
.block.draw .draw-wrap .dsel { fill: none; stroke: var(--tint, #33658a); stroke-width: 1.2; stroke-dasharray: 5 3; pointer-events: none; }
.block.draw .draw-wrap .dh { fill: #fff; stroke: var(--tint, #33658a); stroke-width: 1.4; }
.block.draw .draw-wrap .dh:hover { fill: var(--tint, #33658a); }
.block.draw.empty .draw-wrap::after { content: "Dessin — choisissez une forme ci-dessus et glissez sur la feuille (un simple clic pose une forme standard, double-clic : zone de texte, double-clic sur une forme : texte dedans)"; position: absolute; inset: 0; display: grid; place-items: center; color: #9198a1; font-family: var(--font-ui); font-size: 12.5px; pointer-events: none; text-align: center; padding: 0 30px; line-height: 1.5; }
.block.draw:not(.tool-select):not(.tool-pen) .draw-wrap { cursor: crosshair; }
.block.draw.tool-pen .draw-wrap { cursor: cell; }
.block.draw.tool-select .draw-wrap [data-sid] { cursor: move; }
.block.draw .draw-hrz { height: 8px; margin-top: 3px; border-radius: 4px; cursor: ns-resize; opacity: 0; background: color-mix(in srgb, var(--tint) 45%, transparent); transition: opacity .12s; }
.block.draw:hover .draw-hrz, .block.draw.objsel .draw-hrz { opacity: .6; }
.block.draw .draw-hrz:hover { opacity: 1; }
.block.draw .draw-textedit { position: absolute; box-sizing: border-box; resize: none; overflow: hidden; padding: 6px; border: 1.5px dashed var(--tint, #33658a); border-radius: 4px; outline: none; font-family: Arial, Helvetica, sans-serif; background: #fff; color: #202124; z-index: 3; }
.block.draw .draw-textedit.label { display: flex; align-items: center; }
body.draw-dragging, body.draw-dragging * { user-select: none !important; }
@media print {
  .block.draw { page-break-inside: avoid; }
  .block.draw .draw-tools, .block.draw .draw-hrz, .block.draw .dh, .block.draw .dsel, .block.draw .dgrid, .block.draw .draw-textedit { display: none !important; }
  .block.draw .draw-wrap { border-color: #ddd; }
}

/* ============================================================
   1.9.2 — citation avec auteur, fiches Santé, rangs, items,
   graphiques de données, scores, calculateurs, minuteurs, partage
   ============================================================ */
/* citation : ligne auteur / source */
.block.quote .qcite { font-family: var(--font-serif); font-size: 13.5px; color: var(--ink-3); padding: 0 0 4px 18px; margin-top: -4px; border-left: 3px solid color-mix(in srgb, var(--tint) 55%, transparent); outline: none; position: relative; }
.block.quote .qcite:empty, .block.quote .qcite:has(> br:only-child) { min-height: 1.5em; }
.block.quote .qcite:empty::before, .block.quote .qcite:has(> br:only-child)::before { content: attr(data-ph); position: absolute; left: 18px; top: 0; color: var(--ink-3); opacity: 0; pointer-events: none; white-space: nowrap; transition: opacity .15s; }
.block.quote.cur .qcite:empty::before, .block.quote:hover .qcite:empty::before, .block.quote.cur .qcite:has(> br:only-child)::before, .block.quote:hover .qcite:has(> br:only-child)::before { opacity: .55; }
.block.quote .qcite:not(:empty):not(:has(> br:only-child)) { color: var(--ink-2); }
body.printing .block.quote .qcite:empty, body.printing .block.quote .qcite:has(> br:only-child) { display: none; }

/* encadrés avec couleur propre (Santé) */
.block.callout[style*="--cc-light"] { --cc: var(--cc-light); }
html[data-theme="dark"] .block.callout[style*="--cc-light"] { --cc: var(--cc-dark); }

/* fiches Santé : même gabarit que la fiche d'arrêt, couleur par type (--fc) */
.block.fiche { border-color: color-mix(in srgb, var(--fc) 30%, transparent); background: color-mix(in srgb, var(--fc) 5%, var(--paper)); }
.block.fiche .juris-head { background: color-mix(in srgb, var(--fc) 12%, transparent); color: color-mix(in srgb, var(--fc) 60%, var(--ink)); }
.block.fiche .juris-grid > div { border-top-color: color-mix(in srgb, var(--fc) 12%, transparent); }
.block.fiche .juris-grid .jlabel { color: color-mix(in srgb, var(--fc) 55%, var(--ink-2)); }
.juris-head .jkind { font-size: 10.5px; font-weight: 750; text-transform: uppercase; letter-spacing: .07em; opacity: .8; flex: none; user-select: none; }
.juris-head .jref { position: relative; }
.juris-head .jref:empty::before, .juris-head .jref:has(> br:only-child)::before { content: attr(data-ph); opacity: .45; position: absolute; left: 0; top: 0; pointer-events: none; white-space: nowrap; overflow: hidden; max-width: 100%; text-overflow: ellipsis; }
.juris-head .jbadge { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 2px 7px; border-radius: 999px; background: color-mix(in srgb, var(--warn) 18%, transparent); color: var(--warn); flex: none; }
.juris-head .jtimer { font-size: 11.5px; font-weight: 650; padding: 3px 9px; border-radius: 6px; background: color-mix(in srgb, var(--fc, var(--tint)) 16%, transparent); color: color-mix(in srgb, var(--fc, var(--tint)) 70%, var(--ink)); flex: none; font-family: var(--font-ui); }
.juris-head .jtimer:hover { filter: brightness(1.08); }

/* rang de connaissance (A / B) et item LiSA */
.rtag { display: inline-block; min-width: 18px; padding: 0 5px; margin: 0 1px; border-radius: 5px; font-family: var(--font-ui); font-size: .72em; font-weight: 800; line-height: 1.55; text-align: center; vertical-align: 2px; color: #fff; background: #2e8b6a; cursor: pointer; user-select: none; }
.rtag.b { background: #b3762a; }
.rtag::selection { background: color-mix(in srgb, #fff 35%, transparent); }
.refart.item { background: color-mix(in srgb, #c04343 12%, transparent); color: color-mix(in srgb, #c04343 70%, var(--ink)); border-color: color-mix(in srgb, #c04343 25%, transparent); }
.refart.item:hover { background: color-mix(in srgb, #c04343 20%, transparent); }
.only-health { display: none !important; }
body.health .only-health { display: inline-flex !important; }
#pp-rang.on { background: var(--tint-soft); color: var(--tint); }

/* menu « / » : insertions en ligne */
.sm-item.inline .sm-ico { border-style: dashed; }
.sm-item .sm-ico { white-space: nowrap; }
:is(#popover, .po-scope) .po-scores button { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; }
:is(#popover, .po-scope) .po-scores { max-height: 320px; overflow-y: auto; }
:is(#popover, .po-scope) .po-charts button { display: flex; align-items: center; }
:is(#popover, .po-scope) .cswatch { display: inline-block; width: 14px; height: 14px; border-radius: 4px; margin-right: 8px; flex: none; vertical-align: -2px; }
:is(#popover, .po-scope) .po-check { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; flex-direction: row; color: var(--ink); }
:is(#popover, .po-scope) .cd-data { width: 100%; margin-top: 8px; font-family: var(--font-mono); font-size: 12.5px; line-height: 1.5; border: 1px solid var(--border); background: var(--bg); color: var(--ink); border-radius: 6px; padding: 8px 10px; outline: none; resize: vertical; white-space: pre; overflow: auto; tab-size: 8; }
:is(#popover, .po-scope) .cd-data:focus { border-color: var(--tint); }

/* graphiques de données */
.block.chart { margin: 14px 0; display: flow-root; }
.chart-card { border: 1px solid var(--border); border-radius: var(--r); background: var(--paper); padding: 10px 12px 8px; }
.chart-card .cwrap svg { display: block; width: 100%; height: auto; }
.chart-tools { display: none; align-items: center; gap: 4px; flex-wrap: wrap; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--border); font-size: 12px; }
.block.chart:hover .chart-tools, .block.chart.objsel .chart-tools { display: flex; }
.chart-tools button { padding: 3px 8px; border-radius: 6px; font-size: 12px; font-weight: 600; background: var(--bg); color: var(--ink-2); font-family: var(--font-ui); display: inline-flex; align-items: center; gap: 4px; }
.chart-tools button svg { width: 15px; height: 15px; }
.chart-tools button:hover { background: var(--hover); color: var(--ink); }
.chart-tools button.on { background: var(--tint-soft); color: var(--tint); }
.chart-tools button.primary { background: var(--tint); color: #fff; }
.chart-tools button.danger { background: color-mix(in srgb, var(--danger) 12%, transparent); color: var(--danger); margin-left: auto; }
.chart-tools .tb-sep { width: 1px; height: 18px; background: var(--border); margin: 0 3px; }

/* scores cliniques et calculateurs */
.block.score, .block.mcalc { margin: 12px 0; display: flow-root; }
.score-card { border: 1px solid color-mix(in srgb, #c04343 30%, transparent); border-radius: var(--r); background: color-mix(in srgb, #c04343 4%, var(--paper)); overflow: hidden; font-family: var(--font-ui); }
.score-head { display: flex; align-items: baseline; gap: 10px; padding: 9px 14px; background: color-mix(in srgb, #c04343 10%, transparent); }
.score-name { font-weight: 700; font-size: 14px; color: color-mix(in srgb, #c04343 60%, var(--ink)); }
.score-sub { font-size: 12px; color: var(--ink-3); }
.score-items { padding: 6px 10px; display: flex; flex-direction: column; }
.score-row { display: flex; align-items: center; gap: 9px; padding: 5px 4px; border-radius: 6px; font-size: 13.5px; cursor: pointer; }
.score-row:hover { background: var(--hover); }
.score-row input[type="checkbox"] { accent-color: #c04343; width: 15px; height: 15px; flex: none; }
.score-row .score-l { flex: 1; }
.score-row .score-p { font-variant-numeric: tabular-nums; color: var(--ink-3); font-weight: 600; font-size: 12px; }
.score-row select, .mcalc-in select, .mcalc-in input { font: inherit; font-size: 13px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 4px 8px; outline: none; }
.score-row select:focus, .mcalc-in select:focus, .mcalc-in input:focus { border-color: var(--tint); }
.score-total { display: flex; align-items: center; gap: 12px; padding: 9px 14px; border-top: 1px solid color-mix(in srgb, #c04343 15%, transparent); font-size: 13px; color: var(--ink-2); }
.score-total b { font-size: 20px; color: var(--ink); font-variant-numeric: tabular-nums; }
.score-interp { font-size: 12.5px; font-weight: 600; color: color-mix(in srgb, #c04343 70%, var(--ink)); }
.mcalc-in { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px 12px; padding: 10px 14px; }
.mcalc-in label { display: flex; flex-direction: column; gap: 3px; font-size: 11.5px; color: var(--ink-2); }
.mcalc-in label em { font-style: normal; color: var(--ink-3); }
.mcalc-in input { width: 100%; }
.mcalc-out { display: flex; flex-wrap: wrap; gap: 6px 18px; padding: 8px 14px 10px; border-top: 1px solid color-mix(in srgb, #c04343 15%, transparent); }
.mcalc-res { display: flex; align-items: baseline; gap: 6px; font-size: 13px; color: var(--ink-2); }
.mcalc-res b { font-size: 17px; color: var(--ink); font-variant-numeric: tabular-nums; }
.mcalc-res .mcalc-u { color: var(--ink-3); font-size: 12px; }

/* minuteurs */
.block.timer { margin: 10px 0; display: flow-root; }
.timer-card { display: inline-flex; align-items: center; gap: 10px; padding: 8px 12px 8px 14px; border: 1px solid var(--border); border-radius: 999px; background: var(--paper); font-family: var(--font-ui); }
.timer-card .timer-ico { font-size: 15px; }
.timer-card .timer-label { font-size: 13px; color: var(--ink-2); max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.timer-card .timer-digits { font-family: var(--font-mono); font-size: 22px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; min-width: 72px; text-align: center; }
.timer-card button { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; background: var(--bg); color: var(--ink-2); }
.timer-card button:hover { background: var(--hover); color: var(--ink); }
.block.timer.running .timer-card { border-color: color-mix(in srgb, var(--ok) 50%, var(--border)); }
.block.timer.running .timer-digits { color: var(--ok); }
.block.timer.over .timer-card { border-color: var(--danger); animation: tblink 1s ease-in-out 4; }
.block.timer.over .timer-digits { color: var(--danger); }
@keyframes tblink { 50% { background: color-mix(in srgb, var(--danger) 15%, transparent); } }
#timerpanel { position: fixed; right: 0; top: calc(var(--topbar-h) + var(--toolbar-h) + var(--tabbar-h) + 2px); bottom: 0; width: 322px; z-index: 40; display: flex; flex-direction: column; background: var(--surface); border: none; border-left: 1px solid var(--border); border-radius: 0; }
#timer-body { flex: 1; overflow-y: auto; padding: 8px 12px 16px; }
.tp-card { border: 1px solid var(--border); border-radius: var(--r); padding: 12px 14px; margin-bottom: 10px; text-align: center; }
.tp-card.over { border-color: var(--danger); background: color-mix(in srgb, var(--danger) 6%, transparent); }
.tp-title { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); text-align: left; }
.tp-title .tp-label { text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--ink-2); }
.tp-digits { font-family: var(--font-mono); font-size: 42px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; padding: 10px 0 8px; letter-spacing: .02em; }
.tp-card.over .tp-digits { color: var(--danger); }
.tp-btns { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; }
.tp-btns button:disabled { opacity: .45; }
.tp-laps { margin-top: 10px; border-top: 1px solid var(--border); padding-top: 6px; max-height: 160px; overflow-y: auto; font-size: 12.5px; }
.tp-laps > div { display: flex; align-items: center; gap: 8px; padding: 3px 4px; color: var(--ink-2); }
.tp-laps b { margin-left: auto; font-family: var(--font-mono); color: var(--ink); }
.tp-laps .tp-lapd { font-family: var(--font-mono); color: var(--ink-3); width: 68px; text-align: right; }
.tp-presets { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; align-items: center; margin-bottom: 10px; }
.tp-presets button { min-width: 32px; padding: 3px 7px; border-radius: 6px; font-size: 12px; font-weight: 600; background: var(--bg); color: var(--ink-2); }
.tp-presets button:hover { background: var(--hover); color: var(--ink); }
.tp-presets button.on { background: var(--tint-soft); color: var(--tint); }
.tp-presets button:disabled { opacity: .5; }
.tp-custom { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--ink-3); margin-left: 6px; }
.tp-custom input { width: 46px; font: inherit; font-size: 12.5px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 3px 6px; outline: none; text-align: center; }
.cal-now.timer-now { font-family: var(--font-mono); }
.cal-now.timer-now.over { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 50%, var(--border)); animation: tblink 1s ease-in-out infinite; }
.cal-now.timer-now::before { display: none; }

/* dictionnaire : abréviations médicales */
.dict-abbr { display: flex; gap: 10px; align-items: baseline; padding: 5px 6px; border-radius: 6px; font-size: 13px; }
.dict-abbr b { flex: none; min-width: 52px; font-family: var(--font-mono); color: var(--tint); }
.dict-abbr span { color: var(--ink-2); }
.dict-abbr:hover { background: var(--hover); }

/* impression */
@media print {
  .chart-tools, .timer-card button, .jtimer, .score-row .score-p { display: none !important; }
  .block.quote .qcite:empty, .block.quote .qcite:has(> br:only-child) { display: none; }
  .score-card, .chart-card { border-color: #ccc; page-break-inside: avoid; }
}

/* ---------- Alixo Share ---------- */
.ln-shared { position: relative; }
.ln-shared svg { width: 18px; height: 18px; flex: none; color: var(--ink-2); }
.ln-shared .ln-next { margin-left: auto; }
#lib-shared { flex: 1; overflow-y: auto; padding: 4px 2px 30px; }
.sh-section { margin-bottom: 22px; }
.sh-stitle { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); padding: 4px 4px 10px; display: flex; align-items: center; gap: 8px; }
.sh-invite { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--tint) 35%, var(--border)); background: var(--tint-soft); border-radius: var(--r); margin-bottom: 8px; }
.sh-invite .sh-ico { width: 34px; height: 34px; border-radius: 50%; background: var(--tint); color: #fff; display: grid; place-items: center; font-weight: 700; flex: none; }
.sh-invite .sh-txt { flex: 1; min-width: 0; font-size: 13.5px; }
.sh-invite .sh-txt b { display: block; }
.sh-invite .sh-txt span { color: var(--ink-2); font-size: 12.5px; }
.sh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.sh-card { text-align: left; padding: 14px; border: 1px solid var(--border); border-radius: var(--r); background: var(--paper); display: flex; flex-direction: column; gap: 6px; position: relative; border-left: 3px solid var(--mc, var(--tint)); }
.sh-card:hover { background: var(--hover); border-color: var(--ink-3); }
.sh-card h3 { font-size: 15px; font-weight: 600; line-height: 1.3; }
.sh-card .meta { font-size: 11.5px; color: var(--ink-3); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.sh-role { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 1px 7px; border-radius: 999px; background: var(--tint-soft); color: var(--tint); }
.sh-role.write { background: color-mix(in srgb, var(--ok) 15%, transparent); color: var(--ok); }
.sh-folder { border: 1px solid var(--border); border-radius: var(--r); padding: 12px 14px; margin-bottom: 12px; }
.sh-folder .sh-fhead { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font-weight: 600; }
.sh-folder .sh-fhead .ficon-ico, .sh-folder .sh-fhead .ficon { width: 20px; height: 20px; }
.sh-folder .sh-sub { font-size: 12px; color: var(--ink-3); font-weight: 400; margin-left: auto; }
.sh-tree { display: flex; flex-direction: column; gap: 2px; }
.sh-tree button { display: flex; align-items: center; gap: 8px; text-align: left; padding: 5px 8px; border-radius: 6px; font-size: 13.5px; color: var(--ink-2); }
.sh-tree button:hover { background: var(--hover); color: var(--ink); }
.sh-tree .dicon { width: 15px; height: 15px; color: var(--ink-3); }
.sh-tree .sh-sf { font-weight: 600; color: var(--ink); }
.sh-owner { font-size: 12px; color: var(--ink-3); }
.sh-empty { padding: 50px 20px; text-align: center; color: var(--ink-3); font-size: 14px; line-height: 1.55; }
.sh-members { display: flex; flex-direction: column; gap: 4px; margin: 4px 0; }
.sh-member { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 6px; font-size: 13px; border: 1px solid var(--border); }
.sh-member .sh-av { width: 26px; height: 26px; border-radius: 50%; background: var(--tint); color: #fff; display: grid; place-items: center; font-size: 12px; font-weight: 700; flex: none; }
.sh-member .sh-mi { flex: 1; min-width: 0; }
.sh-member .sh-mi b { display: block; font-size: 13px; }
.sh-member .sh-mi span { display: block; font-size: 11.5px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-member select { font: inherit; font-size: 12px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 3px 6px; outline: none; }
.sh-member .sh-rm { width: 24px; height: 24px; border-radius: 5px; color: var(--ink-3); display: grid; place-items: center; font-size: 12px; }
.sh-member .sh-rm:hover { background: var(--hover); color: var(--danger); }
.sh-member.pending { border-style: dashed; }
:is(#popover, .po-scope) .sh-inv { display: flex; gap: 6px; align-items: center; }
:is(#popover, .po-scope) .sh-inv select { font: inherit; font-size: 12.5px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 7px 8px; outline: none; }
.sh-log { max-height: 220px; overflow-y: auto; margin-top: 4px; font-size: 12.5px; }
.sh-log > div { display: flex; gap: 8px; padding: 4px 6px; border-bottom: 1px solid var(--border); color: var(--ink-2); }
.sh-log .sh-lt { color: var(--ink-3); flex: none; width: 92px; font-variant-numeric: tabular-nums; }
.sh-log b { color: var(--ink); }
.sh-content { max-height: 240px; overflow-y: auto; margin: 4px 0; }
.sh-content label { display: flex; align-items: center; gap: 8px; padding: 4px 6px; font-size: 13px; color: var(--ink); cursor: pointer; border-radius: 6px; flex-direction: row; }
.sh-content label:hover { background: var(--hover); }
.sh-content label.sf { font-weight: 600; }
.sh-content label.excl { color: var(--ink-3); text-decoration: line-through; }
.sh-content input { accent-color: var(--tint); flex: none; }
.sh-content .dicon { width: 14px; height: 14px; color: var(--ink-3); }
.sh-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--tint-soft); color: var(--tint); }
body.readonly #toolbar button[data-cmd], body.readonly #toolbar button[data-menu], body.readonly #toolbar button[data-list], body.readonly #toolbar button[data-align], body.readonly #toolbar [data-act="ai"], body.readonly #toolbar [data-act="link"], body.readonly #toolbar [data-act="refart"], body.readonly #toolbar .fsize, body.readonly .pp-tools, body.readonly #doc-prof { opacity: .4; pointer-events: none; }
#ro-banner { width: min(794px, 100%); margin: 0 auto 10px; padding: 8px 14px; border-radius: var(--r); background: var(--tint-soft); font-size: 13px; color: var(--ink); display: flex; align-items: center; gap: 12px; }
#ro-banner button { margin-left: auto; font-weight: 600; color: var(--tint); padding: 3px 9px; border-radius: 6px; }
#ro-banner button:hover { background: var(--hover); }
.tab .tab-sh { width: 12px; height: 12px; flex: none; color: var(--ink-3); }

/* ---------- sélecteur de dossier (agenda) : liste déroulante maison ---------- */
:is(#popover, .po-scope) .po-field { font-size: 11.5px; color: var(--ink-3); display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }
.fpick { position: relative; font-size: 13px; color: var(--ink); }
.fpick-btn { width: 100%; display: flex; align-items: center; gap: 8px; border: 1px solid var(--border); background: var(--bg); border-radius: 6px; padding: 7px 9px; font: inherit; font-size: 13px; color: var(--ink); text-align: left; cursor: pointer; }
.fpick.open .fpick-btn, .fpick-btn:focus-visible { border-color: var(--tint); outline: none; }
.fpick-lab { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fpick-caret { color: var(--ink-3); font-size: 11px; flex: none; }
.fpick-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; box-shadow: inset 0 0 0 1px rgba(128,128,128,.35); }
.fpick-list { margin-top: 4px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); box-shadow: 0 6px 18px rgba(0,0,0,.12); padding: 4px; }
:is(#popover, .po-scope) .fpick-q { width: 100%; box-sizing: border-box; padding: 6px 9px; font-size: 12.5px; margin-bottom: 4px; }
.fpick-items { max-height: 176px; overflow-y: auto; display: flex; flex-direction: column; }
.fpick-items button { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 6px 8px; border-radius: 6px; font-size: 13px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: none; }
.fpick-items button:hover, .fpick-items button:focus-visible { background: var(--hover); outline: none; }
.fpick-items button.sel { background: var(--tint-soft); font-weight: 600; }
.fpick-items button[hidden] { display: none; }
/* Alixo Share : envoi de l'e-mail d'invitation, état de la réception */
.sh-mailbtn { font-size: 11.5px; font-weight: 600; padding: 4px 9px; border-radius: 6px; border: 1px solid var(--border); color: var(--ink-2); flex: none; }
.sh-mailbtn:hover { background: var(--hover); color: var(--ink); border-color: var(--tint); }
.sh-err { color: var(--danger) !important; }
.sh-err button { margin-left: 6px; }

/* ---------- blocs dans des blocs (js/nest.js) : tableau, citation, encadré imbriqués ---------- */
.nb { font-style: normal; font-weight: 400; text-align: left; }
.nb-tbl { width: 100%; border-collapse: collapse; table-layout: fixed; margin: 6px 0; font-family: var(--font-serif); font-size: .95em; line-height: 1.45; background: var(--paper); color: var(--ink); }
.nb-tbl > tbody > tr > td { border: 1px solid var(--border); padding: 5px 8px; vertical-align: top; min-width: 40px; min-height: 1.5em; position: static; overflow-wrap: anywhere; }
.nb-tbl.has-head > tbody > tr:first-child > td { font-weight: 650; background: color-mix(in srgb, var(--tint) 8%, var(--paper)); }
.nb-tbl td:focus { outline: none; }
.nb-quote { margin: 6px 0; padding: 3px 0 3px 14px; border-left: 3px solid color-mix(in srgb, var(--tint) 55%, transparent); font-family: var(--font-serif); font-style: italic; color: var(--ink-2); min-height: 1.5em; }
.nb-call { --cc: var(--cc-light, var(--tint)); margin: 6px 0; padding: 8px 12px 9px; border-radius: 8px; background: color-mix(in srgb, var(--cc) 9%, var(--paper)); border: 1px solid color-mix(in srgb, var(--cc) 28%, transparent); color: var(--ink); }
html[data-theme="dark"] .nb-call { --cc: var(--cc-dark, var(--tint)); }
.nb-call > .nb-title { font-family: var(--font-ui); font-size: 10.5px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; color: var(--cc); margin-bottom: 2px; user-select: none; cursor: default; }
.nb-call > .nb-body { font-family: var(--font-serif); min-height: 1.5em; }
.tcell .nb:first-child, .btxt .nb:first-child { margin-top: 2px; }
.tbl-tools { flex-wrap: wrap; }
@media print {
  html[data-theme="dark"] .nb-call { --cc: var(--cc-light, #33658a); }
  .nb-tbl, .nb-call { break-inside: avoid; }
  .nb-tbl.has-head > tbody > tr:first-child > td { background: #eef2f6 !important; }
}

/* ---------- fichiers dans les dossiers (js/files.js) ---------- */
.file-ico { position: relative; display: inline-grid; place-items: center; width: 34px; height: 40px; flex: none; color: var(--fc, var(--ink-3)); }
.file-ico svg { width: 100%; height: 100%; fill: color-mix(in srgb, var(--fc, var(--ink-3)) 12%, var(--surface)); stroke: currentColor; stroke-width: 1.3; stroke-linejoin: round; }
.file-ico .file-ext { position: absolute; left: 50%; bottom: 7px; transform: translateX(-50%); font-family: var(--font-ui); font-size: 8px; font-weight: 800; letter-spacing: .02em; color: #fff; background: var(--fc, var(--ink-3)); padding: 1px 3px; border-radius: 3px; line-height: 1.25; }
.file-ico.big { width: 40px; height: 48px; }
.file-ico.big .file-ext { font-size: 8.5px; bottom: 9px; }
.file-ico.mini { width: 16px; height: 19px; }
.file-ico.mini .file-ext { display: none; }
.file-card { position: relative; display: flex; align-items: center; gap: 13px; text-align: left; padding: 12px 40px 12px 14px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--border); cursor: pointer; min-height: 72px; transition: background .12s, border-color .12s; }
.file-card:hover { border-color: color-mix(in srgb, var(--mc) 55%, var(--border)); background: color-mix(in srgb, var(--mc) 4%, var(--surface)); }
.file-card.dragging { opacity: .45; }
.file-card .file-info { min-width: 0; flex: 1; }
.file-card h3 { font-size: 13.5px; font-weight: 600; line-height: 1.3; color: var(--ink); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.file-card .meta { font-size: 11.5px; color: var(--ink-3); margin-top: 3px; }
.file-card .del-btn { position: absolute; top: 8px; right: 8px; width: 26px; height: 26px; border-radius: 6px; display: grid; place-items: center; color: var(--ink-3); opacity: 0; transition: opacity .12s; }
.file-card .del-btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.file-card:hover .del-btn, .file-card:focus-within .del-btn { opacity: 1; }
.file-card .del-btn:hover { background: var(--hover); color: var(--danger); }
.file-cloud { margin-left: 4px; font-size: 12px; }
.file-cloud.ok { color: var(--ok); } .file-cloud.wait { color: var(--ink-3); opacity: .6; } .file-cloud.off { color: var(--ink-3); }
.tree-row.file .tree-name { color: var(--ink-2); }
#view-library.files-over #doc-grid, #view-library.files-over #lib-tree { outline: 2px dashed color-mix(in srgb, var(--tint) 60%, transparent); outline-offset: -6px; border-radius: 12px; background: color-mix(in srgb, var(--tint) 4%, transparent); }
.fl-extlab { align-self: center; color: var(--ink-3); font-size: 13px; }
/* visionneuse plein écran */
#fileov { position: fixed; inset: 0; z-index: 120; background: rgba(10, 14, 20, .55); backdrop-filter: blur(3px); display: grid; place-items: center; padding: 3vh 3vw; }
#fileov[hidden] { display: none; }
.fv-win { width: min(1180px, 100%); height: 100%; display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; box-shadow: 0 24px 70px rgba(0, 0, 0, .4); }
.fv-head { display: flex; align-items: center; gap: 8px; padding: 9px 10px 9px 14px; border-bottom: 1px solid var(--border); flex: none; }
.fv-head .fv-tt { flex: 1; min-width: 0; }
.fv-name { font-size: 14px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fv-meta { font-size: 11.5px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fv-head .cta.small { flex: none; }
.fv-close { width: 32px; height: 32px; border-radius: 8px; display: grid; place-items: center; color: var(--ink-2); flex: none; }
.fv-close:hover { background: var(--hover); color: var(--ink); }
.fv-close svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.fv-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; background: var(--bg); }
.fv-body iframe { flex: 1; width: 100%; min-height: 0; border: none; background: #525659; }
.fv-body .vw-doc { max-width: 860px; width: calc(100% - 28px); margin: 18px auto; box-sizing: border-box; }
.fv-body .fv-sheet { max-width: none; overflow-x: auto; font-family: var(--font-ui); font-size: 12.5px; }
.fv-sheet h3 { margin: 0 0 10px; font-size: 13px; }
.fv-sheet td { white-space: nowrap; max-width: 340px; overflow: hidden; text-overflow: ellipsis; }
.fv-note { font-size: 11.5px; color: var(--ink-3); margin-top: 8px; }
.fv-slides { max-width: 900px; width: 100%; margin: 0 auto; }
.fv-imgwrap { flex: 1; display: grid; place-items: center; padding: 16px; }
.fv-imgwrap img.vw-img { max-width: 100%; max-height: 100%; margin: 0; object-fit: contain; }
.fv-media { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 24px; }
.fv-media video { max-width: 100%; max-height: 100%; border-radius: 8px; background: #000; }
.fv-media audio { width: min(520px, 100%); }
.fv-medianame { font-size: 14px; color: var(--ink-2); }
.fv-prog { width: 220px; height: 4px; border-radius: 3px; background: var(--hover); margin: 14px auto 0; overflow: hidden; }
.fv-prog span { display: block; height: 100%; width: 0; background: var(--tint); transition: width .2s; }
@media print { #fileov { display: none !important; } }

/* ============================================================
   1.11 — professeurs (+N), onglets dans une séance, stockage,
   tâches, notifications, bilan de la semaine
   ============================================================ */
/* « Prof +1 » : d'autres professeurs dans les sous-dossiers */
.prof-more { display: inline-block; margin-left: 5px; padding: 0 6px; border-radius: 999px; font-size: 10.5px; font-weight: 700; line-height: 16px; background: var(--tint-soft); color: var(--tint); vertical-align: 1px; cursor: help; }

/* onglets d'une séance (façon Google Docs) */
#page-tabs { display: flex; align-items: flex-end; gap: 2px; width: min(794px, 100%); margin: 0 auto -1px; padding: 0 6px; position: relative; z-index: 1; }
#page-tabs .pg-label { font-family: var(--font-ui); font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); padding: 0 8px 9px 2px; }
#page-tabs .pg-tab { font-family: var(--font-ui); font-size: 12.5px; font-weight: 550; color: var(--ink-2); padding: 7px 14px 8px; border: 1px solid transparent; border-bottom: none; border-radius: 9px 9px 0 0; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: color-mix(in srgb, var(--surface) 60%, transparent); transition: background .12s, color .12s; }
#page-tabs .pg-tab:hover { background: var(--hover); color: var(--ink); }
#page-tabs .pg-tab.active { background: var(--paper); color: var(--ink); font-weight: 650; border-color: var(--border); position: relative; }
#page-tabs .pg-tab.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--paper); }
#page-tabs .pg-tab.active::before { content: ""; position: absolute; left: 10px; right: 10px; top: 0; height: 2px; border-radius: 0 0 2px 2px; background: var(--tint); }
#page-tabs .pg-add { width: 30px; height: 30px; margin: 0 0 2px 4px; border-radius: 8px; color: var(--ink-3); font-size: 16px; display: grid; place-items: center; }
#page-tabs .pg-add:hover { background: var(--hover); color: var(--ink); }
body.has-pages #doc { border-top-left-radius: 0; }
.print-pgtitle { display: none; }
@media print {
  #page-tabs { display: none !important; }
  .print-pgtitle { display: block; font-family: var(--font-ui); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #46494e; padding: 0 0 6px; margin: 0 0 14px; border-bottom: 1px solid #c9ccd1; }
  .print-pgbreak { page-break-before: always; padding-top: 4px; }
}
body.printing .print-pgtitle { display: block; }

/* stockage (Paramètres › Compte) */
.po-storage { font-size: 12px; color: var(--ink-2); }
.po-stor-main b { font-size: 15px; color: var(--ink); }
.po-stor-sub { color: var(--ink-3); font-size: 11px; }
.po-stor-bar { display: flex; height: 8px; border-radius: 999px; overflow: hidden; background: var(--bg); margin: 8px 0 6px; border: 1px solid var(--border); }
.po-stor-bar span { display: block; height: 100%; }
.po-stor-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 11px; color: var(--ink-3); }
.po-stor-legend i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; vertical-align: 0; }

/* cloche + pastille */
#btn-notif { position: relative; }
.nbadge { position: absolute; top: 5px; right: 4px; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: var(--danger); color: #fff; font-size: 10px; font-weight: 700; line-height: 16px; text-align: center; font-family: var(--font-ui); box-shadow: 0 0 0 2px var(--surface); }
.nt-count { display: inline-block; min-width: 18px; padding: 0 5px; border-radius: 999px; background: var(--danger); color: #fff; font-size: 11px; line-height: 18px; text-align: center; margin-left: 6px; vertical-align: 2px; }
#popover:has(.nt-list) { width: 360px; }
.nt-list { display: flex; flex-direction: column; gap: 3px; max-height: 380px; overflow-y: auto; margin: 4px -4px 0; padding: 0 4px; }
.nt-item { display: flex; gap: 10px; align-items: flex-start; width: 100%; text-align: left; padding: 9px 8px 9px 10px; border-radius: 9px; border: 1px solid transparent; position: relative; }
.nt-item:hover { background: var(--hover); }
.nt-item.unread { background: color-mix(in srgb, var(--nc, var(--tint)) 7%, transparent); border-color: color-mix(in srgb, var(--nc, var(--tint)) 22%, transparent); }
.nt-item.unread::before { content: ""; position: absolute; left: 3px; top: 14px; width: 5px; height: 5px; border-radius: 50%; background: var(--nc, var(--tint)); }
.nt-ico { width: 28px; height: 28px; border-radius: 8px; flex: none; display: grid; place-items: center; background: color-mix(in srgb, var(--nc, var(--tint)) 14%, transparent); color: var(--nc, var(--tint)); }
.nt-ico svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nt-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.nt-title { font-size: 13px; font-weight: 600; color: var(--ink); line-height: 1.3; }
.nt-item:not(.unread) .nt-title { font-weight: 550; color: var(--ink-2); }
.nt-text { font-size: 12px; color: var(--ink-2); line-height: 1.4; white-space: pre-line; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nt-meta { font-size: 10.5px; color: var(--ink-3); }
.nt-x { width: 20px; height: 20px; border-radius: 5px; display: grid; place-items: center; color: var(--ink-3); font-size: 10px; flex: none; opacity: 0; }
.nt-item:hover .nt-x { opacity: 1; }
.nt-x:hover { background: var(--hover); color: var(--danger); }

/* tâches (Bibliothèque › Tâches) */
.ln-todo svg { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ln-todo .ln-next { margin-left: auto; }
.ln-todo .ln-next.late { color: var(--danger); }
#lib-todo { flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.td-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; padding: 0 2px 14px; flex-wrap: wrap; }
.td-title { font-weight: 600; font-size: 24px; letter-spacing: -.01em; }
.td-sub { font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
.td-sub .late { color: var(--danger); }
.td-tools { display: flex; gap: 8px; align-items: center; }
.td-seg button { width: auto; height: 32px; padding: 0 12px; font-size: 12.5px; font-weight: 550; }
.td-seg button.on { background: var(--tint-soft); color: var(--ink); }
.td-body { flex: 1; min-height: 0; display: flex; gap: 14px; }
.td-cats { width: 220px; flex: none; display: flex; flex-direction: column; gap: 2px; overflow-y: auto; padding: 4px 4px 12px 0; }
.td-catbtn { display: flex; align-items: center; gap: 9px; width: 100%; padding: 7px 8px; border-radius: 7px; font-size: 13px; color: var(--ink-2); text-align: left; position: relative; }
.td-catbtn i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.td-catbtn span:not(.td-catpen) { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.td-catbtn em { font-style: normal; font-size: 11px; color: var(--ink-3); font-weight: 600; }
.td-catbtn:hover { background: var(--hover); color: var(--ink); }
.td-catbtn.on { background: var(--tint-soft); color: var(--ink); font-weight: 600; }
.td-catbtn.drop { outline: 2px solid var(--tint); outline-offset: -2px; }
.td-catpen { display: none; font-size: 11px; color: var(--ink-3); padding: 0 3px; }
.td-catbtn:hover .td-catpen { display: inline; }
.td-cathint { font-size: 11px; color: var(--ink-3); line-height: 1.45; padding: 10px 8px 0; }
.td-lists { flex: 1; min-width: 0; overflow-y: auto; padding: 2px 4px 30px 0; }
.td-add { display: flex; gap: 6px; align-items: center; margin-bottom: 14px; padding: 8px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg); }
.td-add input, .td-add select { font: inherit; font-size: 13.5px; color: var(--ink); background: var(--surface); border: 1px solid var(--border); border-radius: 7px; padding: 8px 10px; outline: none; }
.td-add input:focus, .td-add select:focus { border-color: var(--tint); }
.td-addinput { flex: 1; min-width: 0; }
.td-adddue { width: 150px; flex: none; }
.td-addcat { max-width: 170px; flex: none; }
.td-group { margin-bottom: 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); overflow: hidden; }
.td-ghead { display: flex; align-items: center; gap: 8px; padding: 9px 12px; font-size: 13px; font-weight: 650; color: var(--ink); background: color-mix(in srgb, var(--cc) 7%, var(--surface)); border-bottom: 1px solid color-mix(in srgb, var(--cc) 18%, var(--border)); }
.td-ghead i { width: 10px; height: 10px; border-radius: 50%; background: var(--cc); flex: none; }
.td-ghead em { font-style: normal; font-size: 11.5px; color: var(--ink-3); font-weight: 500; margin-left: 2px; }
.td-gedit { margin-left: auto; font-size: 12px; color: var(--ink-3); padding: 2px 6px; border-radius: 5px; }
.td-gedit:hover { background: var(--hover); color: var(--ink); }
.td-item { display: flex; align-items: flex-start; gap: 10px; padding: 8px 8px 8px 12px; border-top: 1px solid var(--border); cursor: grab; }
.td-item:first-of-type { border-top: none; }
.td-item:hover { background: var(--hover); }
.td-check { width: 20px; height: 20px; margin-top: 1px; border-radius: 6px; border: 1.6px solid var(--ink-3); flex: none; display: grid; place-items: center; background: var(--surface); transition: background .12s, border-color .12s; }
.td-check svg { width: 13px; height: 13px; fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.td-item.prio1 .td-check { border-color: #b3762a; }
.td-item.prio2 .td-check { border-color: var(--danger); }
.td-item.done .td-check { background: var(--ok); border-color: var(--ok); }
.td-main { flex: 1; min-width: 0; cursor: pointer; }
.td-text { font-size: 14px; color: var(--ink); line-height: 1.4; }
.td-item.done .td-text { text-decoration: line-through; color: var(--ink-3); }
.td-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 3px; font-size: 11px; color: var(--ink-3); }
.td-meta > span { display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px; border-radius: 999px; background: color-mix(in srgb, var(--ink-3) 12%, transparent); }
.td-due { font-weight: 600; }
.td-item.late .td-due { background: color-mix(in srgb, var(--danger) 14%, transparent); color: var(--danger); }
.td-prio { color: #b3762a; background: color-mix(in srgb, #b3762a 14%, transparent) !important; font-weight: 700; }
.td-item.prio2 .td-prio { color: var(--danger); background: color-mix(in srgb, var(--danger) 14%, transparent) !important; }
.td-cat i { width: 7px; height: 7px; border-radius: 50%; background: var(--cc); }
.td-x { width: 24px; height: 24px; border-radius: 6px; color: var(--ink-3); font-size: 11px; display: grid; place-items: center; flex: none; opacity: 0; }
.td-item:hover .td-x { opacity: 1; }
.td-x:hover { background: var(--hover); color: var(--danger); }
.td-empty { padding: 14px 12px; font-size: 12.5px; color: var(--ink-3); }
@media (max-width: 900px) { .td-cats { display: none; } }

/* bilan de la semaine */
#wkov, #suspov, #msgov { position: fixed; inset: 0; z-index: 1850; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter: blur(8px); padding: 24px; animation: wkin .18s ease-out; }
@keyframes wkin { from { opacity: 0; } to { opacity: 1; } }
.wk-card { width: 560px; max-width: 96vw; max-height: 94vh; overflow-y: auto; position: relative; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 28px 30px 22px; box-shadow: 0 24px 60px rgba(0, 0, 0, .18); }
.wk-x { position: absolute; top: 12px; right: 12px; width: 30px; height: 30px; border-radius: 8px; color: var(--ink-3); font-size: 12px; display: grid; place-items: center; }
.wk-x:hover { background: var(--hover); color: var(--ink); }
.wk-hello { font-family: var(--font-serif); font-size: 26px; font-weight: 650; color: var(--ink); letter-spacing: -.01em; }
.wk-wave { display: inline-block; animation: wkwave 1.6s ease-in-out 1; transform-origin: 70% 70%; }
@keyframes wkwave { 0%, 100% { transform: rotate(0); } 20% { transform: rotate(16deg); } 40% { transform: rotate(-8deg); } 60% { transform: rotate(12deg); } 80% { transform: rotate(-4deg); } }
.wk-sub { font-size: 13px; color: var(--ink-2); margin: 4px 0 16px; }
.wk-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.wk-tile { border: 1px solid var(--border); border-radius: 12px; padding: 12px 12px 10px; background: var(--bg); display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.wk-tile b { font-family: var(--font-serif); font-size: 26px; font-weight: 700; color: var(--tint); line-height: 1.1; letter-spacing: -.02em; }
.wk-tile > span { font-size: 12px; color: var(--ink-2); line-height: 1.3; }
.wk-tile.warn b { color: var(--danger); }
.wk-trend { font-size: 10.5px !important; color: var(--ink-3) !important; margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wk-trend.up { color: var(--ok) !important; font-weight: 600; }
.wk-trend.down { color: var(--danger) !important; font-weight: 600; }
.wk-chart { margin-top: 14px; padding: 12px 14px 8px; border: 1px solid var(--border); border-radius: 12px; }
.wk-ctitle { font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 8px; }
.wk-bars { display: flex; align-items: flex-end; gap: 8px; height: 90px; }
.wk-bar { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 5px; height: 100%; }
.wk-bar i { display: block; width: 100%; max-width: 40px; border-radius: 6px 6px 2px 2px; background: color-mix(in srgb, var(--tint) 55%, transparent); transition: height .3s; }
.wk-bar.today i { background: var(--tint); }
.wk-bar.future i { background: var(--border); }
.wk-bar span { font-size: 10.5px; color: var(--ink-3); }
.wk-bar.today span { color: var(--tint); font-weight: 700; }
.wk-next { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 9px 12px; border-radius: 10px; background: var(--tint-soft); font-size: 12.5px; color: var(--ink); }
.wk-next svg { width: 16px; height: 16px; flex: none; fill: none; stroke: var(--tint); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.wk-msg { margin-top: 12px; font-size: 13px; color: var(--ink-2); font-style: italic; }
.wk-streak { display: inline-block; font-style: normal; font-weight: 700; color: #d06a3a; margin-left: 6px; }
.wk-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; flex-wrap: wrap; }
.wk-off { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink-3); cursor: pointer; }
.wk-off input { accent-color: var(--tint); }
.wk-actions { display: flex; gap: 8px; align-items: center; }
.wk-go { padding: 9px 22px; }
@media (max-width: 640px) { .wk-tiles { grid-template-columns: 1fr 1fr; } }

/* Message direct de l'administrateur (1.12) : fenêtre à fermer */
#msgov .msg-card { max-width: 560px; }
#msgov .msg-text { white-space: pre-line; }
#msgov .msg-when { font-size: 12px; color: var(--ink-3); align-self: center; }
/* 1.18 : fenêtre de mise à jour (au-dessus de tout, y compris des Paramètres) */
#updov { position: fixed; inset: 0; z-index: 2400; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter: blur(8px); padding: 24px; animation: wkin .18s ease-out; }
#updov .upd-card { max-width: 540px; }
#updov .upd-note { white-space: pre-line; line-height: 1.5; }

/* ============================================================
   1.13.0 — icône d'accueil toujours bleue, Paramètres en fenêtre,
   vue Galaxie, présentations (diapositives)
   ============================================================ */

/* --- icône d'accueil « Mes cours » : bleu Alixo fixe, quel que soit le dossier affiché avant --- */
.home-ico, .tree-row.root .tree-label .home-ico, .tn-root .home-ico, .tab.lib .home-ico, :is(#popover, .po-scope) .po-move .home-ico { color: #33658a; stroke: #33658a; }
.tree-row.root .tree-label .home-ico path, .tn-root .home-ico path, :is(#popover, .po-scope) .po-move .home-ico path { fill: rgba(51, 101, 138, .2); stroke: #33658a; stroke-width: 1.6; }
.tab.lib .home-ico { color: #33658a; }
html[data-theme="dark"] .home-ico, html[data-theme="dark"] .tab.lib .home-ico { color: #6fa3cc; stroke: #6fa3cc; }
html[data-theme="dark"] .tree-row.root .tree-label .home-ico path, html[data-theme="dark"] .tn-root .home-ico path { fill: rgba(111, 163, 204, .22); stroke: #6fa3cc; }

/* --- barre supérieure en mode présentation : export + état d'enregistrement --- */
body.mode-slides #btn-export, body.mode-slides #save-status { display: flex; }
body.mode-slides #btn-export { display: grid; }

/* ============================================================
   Paramètres — fenêtre centrale à catégories
   ============================================================ */
#setov {
  position: fixed; inset: 0; z-index: 1500;
  display: flex; align-items: center; justify-content: center;
  background: rgba(10, 12, 18, .46); padding: 24px;
  animation: setfade .16s ease;
}
@keyframes setfade { from { opacity: 0; } to { opacity: 1; } }
@keyframes setpop { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }
.set-card {
  width: min(1060px, 94vw); height: min(740px, 90vh);
  display: flex; overflow: hidden;
  background: var(--surface); border: 1px solid var(--border); border-radius: 16px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .3);
  animation: setpop .2s ease;
}
.set-nav {
  width: 236px; flex: none; display: flex; flex-direction: column; gap: 2px;
  padding: 18px 12px 14px; background: var(--bg); border-right: 1px solid var(--border);
}
.set-navtitle { font-family: var(--font-serif); font-size: 22px; font-weight: 650; letter-spacing: -.01em; padding: 2px 10px 14px; }
.set-navbtn { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 8px; text-align: left; font-size: 13.5px; font-weight: 550; color: var(--ink-2); }
.set-navbtn svg { width: 18px; height: 18px; flex: none; }
.set-navbtn:hover { background: var(--hover); color: var(--ink); }
.set-navbtn.on { background: var(--tint-soft); color: var(--tint); font-weight: 650; }
.set-navfoot { margin-top: auto; padding: 8px 10px 0; font-size: 11px; color: var(--ink-3); }
.set-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.set-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 24px 28px 14px; border-bottom: 1px solid var(--border); }
.set-htitle { font-family: var(--font-serif); font-size: 24px; font-weight: 650; letter-spacing: -.01em; }
.set-hsub { font-size: 13px; color: var(--ink-2); margin-top: 3px; }
.set-x { width: 34px; height: 34px; border-radius: 8px; color: var(--ink-3); display: grid; place-items: center; flex: none; }
.set-x svg { width: 18px; height: 18px; }
.set-x:hover { background: var(--hover); color: var(--ink); }
.set-body { flex: 1; overflow-y: auto; padding: 6px 28px 28px; }
.set-sect { padding: 16px 0 18px; border-bottom: 1px solid var(--border); }
.set-sect:last-child { border-bottom: none; }
.set-body .po-label { margin-top: 4px; }
.set-body input:not([type="checkbox"]):not([type="radio"]) { max-width: 440px; }
.set-body .po-hint { font-size: 12px; max-width: 640px; }
.set-body .po-radios { max-width: 520px; }
.set-body #po-snips { max-width: 560px; }
.set-body .po-snipv { flex: 1; }
.set-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; max-width: 640px; }
.set-tile { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 12px; text-align: left; background: var(--bg); border: 1.5px solid var(--border); border-radius: 10px; font-size: 12px; color: var(--ink-2); cursor: pointer; }
.set-tile b { font-size: 13.5px; color: var(--ink); }
.set-tile:hover { border-color: var(--ink-3); }
.set-tile.on { border-color: var(--tint); background: var(--tint-soft); }
.set-tile-prev { display: block; width: 100%; height: 58px; border-radius: 7px; margin-bottom: 7px; position: relative; overflow: hidden; border: 1px solid var(--border); }
.set-tile-prev i { position: absolute; display: block; border-radius: 3px; }
.set-tile-prev.th-light { background: #fff; } .set-tile-prev.th-light i { background: #dadce0; }
.set-tile-prev.th-dark { background: #1f1f1f; } .set-tile-prev.th-dark i { background: #3c4043; }
.set-tile-prev.th-auto { background: linear-gradient(100deg, #fff 50%, #1f1f1f 50%); } .set-tile-prev.th-auto i { background: #9198a1; }
.set-tile-prev.th-light i:nth-child(1), .set-tile-prev.th-dark i:nth-child(1), .set-tile-prev.th-auto i:nth-child(1) { left: 8px; top: 8px; width: 40%; height: 6px; }
.set-tile-prev.th-light i:nth-child(2), .set-tile-prev.th-dark i:nth-child(2), .set-tile-prev.th-auto i:nth-child(2) { left: 8px; top: 20px; width: 70%; height: 6px; }
.set-tile-prev.th-light i:nth-child(3), .set-tile-prev.th-dark i:nth-child(3), .set-tile-prev.th-auto i:nth-child(3) { left: 8px; top: 32px; width: 55%; height: 6px; }
.set-tile-prev[class*="vw-"] { background: var(--surface); }
.set-tile-prev.vw-grid i { background: var(--tint-soft); border: 1px solid color-mix(in srgb, var(--tint) 45%, transparent); width: 38%; height: 18px; }
.set-tile-prev.vw-grid i:nth-child(1) { left: 8%; top: 8px; } .set-tile-prev.vw-grid i:nth-child(2) { left: 54%; top: 8px; } .set-tile-prev.vw-grid i:nth-child(3) { left: 8%; top: 32px; } .set-tile-prev.vw-grid i:nth-child(4) { left: 54%; top: 32px; }
.set-tile-prev.vw-tree i { background: var(--tint-soft); border: 1px solid color-mix(in srgb, var(--tint) 45%, transparent); height: 12px; }
.set-tile-prev.vw-tree i:nth-child(1) { left: 8%; top: 22px; width: 24%; } .set-tile-prev.vw-tree i:nth-child(2) { left: 46%; top: 6px; width: 40%; } .set-tile-prev.vw-tree i:nth-child(3) { left: 46%; top: 22px; width: 40%; } .set-tile-prev.vw-tree i:nth-child(4) { left: 46%; top: 38px; width: 40%; }
.set-tile-prev.vw-galaxy { background: radial-gradient(circle at 50% 50%, #1a2438, #0b0e15); }
.set-tile-prev.vw-galaxy i { border-radius: 50%; }
.set-tile-prev.vw-galaxy i:nth-child(1) { left: 44%; top: 20px; width: 16px; height: 16px; background: #33658a; box-shadow: 0 0 12px #33658a; }
.set-tile-prev.vw-galaxy i:nth-child(2) { left: 18%; top: 10px; width: 9px; height: 9px; background: #8c4351; }
.set-tile-prev.vw-galaxy i:nth-child(3) { left: 72%; top: 34px; width: 9px; height: 9px; background: #2f7d68; }
.set-tile-prev.vw-galaxy i:nth-child(4) { left: 26%; top: 40px; width: 4px; height: 4px; background: #fff; }
.set-about { display: flex; align-items: center; gap: 14px; }
.set-about .logo-mark { width: 44px; height: 44px; font-size: 26px; border-radius: 10px; }
.set-abname { font-family: var(--font-serif); font-size: 20px; font-weight: 650; }
.set-abname span { font-family: var(--font-ui); font-size: 13px; font-weight: 600; color: var(--ink-2); margin-left: 6px; }
.set-keys { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 6px 18px; max-width: 760px; }
.set-keys div { display: flex; align-items: center; gap: 10px; font-size: 12.5px; color: var(--ink-2); padding: 3px 0; }
.set-keys kbd { font-family: var(--font-ui); font-size: 11px; font-weight: 600; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-bottom-width: 2px; border-radius: 5px; padding: 2px 7px; white-space: nowrap; flex: none; min-width: 64px; text-align: center; }
@media (max-width: 760px) { .set-nav { width: 64px; } .set-navbtn span, .set-navtitle, .set-navfoot { display: none; } .set-navbtn { justify-content: center; } .set-tiles { grid-template-columns: 1fr; } }

/* ============================================================
   Vue Galaxie (bibliothèque) — js/galaxy.js
   ============================================================ */
#lib-galaxy { flex: 1; position: relative; min-height: 0; overflow: hidden; border-radius: 12px; margin: 0 0 16px; border: 1px solid var(--border); }
.gx-canvas { position: absolute; inset: 0; display: block; touch-action: none; user-select: none; }
.gx-hud { position: absolute; left: 12px; right: 12px; top: 10px; display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; pointer-events: none; }
.gx-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 11.5px; color: var(--ink-2); background: color-mix(in srgb, var(--surface) 78%, transparent); border: 1px solid var(--border); border-radius: 8px; padding: 6px 10px; pointer-events: auto; backdrop-filter: blur(4px); }
.gx-legend span { display: inline-flex; align-items: center; gap: 6px; }
.gx-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--tint); }
.gx-legend .gx-sun { width: 13px; height: 13px; box-shadow: 0 0 8px var(--tint); }
.gx-legend .gx-planet { background: #2f7d68; }
.gx-legend .gx-star { width: 7px; height: 7px; background: var(--ink); }
.gx-legend .gx-diamond { width: 8px; height: 8px; border-radius: 1px; transform: rotate(45deg); background: var(--ink); }
.gx-legend .gx-file { width: 7px; height: 7px; border-radius: 1.5px; background: var(--ink-3); }
.gx-btns { display: flex; gap: 6px; pointer-events: auto; }
.gx-btns button { font-size: 12px; font-weight: 600; color: var(--ink-2); padding: 6px 10px; border-radius: 7px; background: color-mix(in srgb, var(--surface) 82%, transparent); border: 1px solid var(--border); backdrop-filter: blur(4px); }
.gx-btns button:hover { background: var(--surface); color: var(--ink); border-color: var(--ink-3); }
.gx-hint { position: absolute; left: 12px; right: 12px; bottom: 10px; text-align: center; font-size: 11px; color: var(--ink-3); pointer-events: none; }
html[data-theme="dark"] .gx-legend, html[data-theme="dark"] .gx-btns button { background: rgba(20, 26, 40, .78); }
#view-library.files-over #lib-galaxy { outline: 2px dashed color-mix(in srgb, var(--tint) 60%, transparent); outline-offset: -6px; }

/* ============================================================
   Présentations — cartes de la bibliothèque
   ============================================================ */
.doc-card.slides-card .mat-chip { display: inline-flex; align-items: center; gap: 5px; }
.doc-card.slides-card .mat-chip .dicon { width: 13px; height: 13px; }
.doc-card .preview.slides-prev { display: block; -webkit-line-clamp: unset; overflow: hidden; }
.sp-box { position: relative; width: 100%; overflow: hidden; border-radius: 6px; border: 1px solid var(--border); background: var(--bg); aspect-ratio: 16 / 9; }
.sp-in { position: absolute; left: 0; top: 0; width: 1280px; height: 720px; transform-origin: 0 0; pointer-events: none; }
.sp-empty { font-size: 12.5px; color: var(--ink-3); }
.tn-doc .dicon, .tree-label .dicon { flex: none; }

/* ============================================================
   Présentations — éditeur (js/slides.js)
   ============================================================ */
#view-slides { position: fixed; inset: calc(var(--topbar-h) + var(--tabbar-h)) 0 0 0; display: grid; grid-template-columns: 212px 1fr 280px; grid-template-rows: 46px 1fr; grid-template-areas: "bar bar bar" "strip stage side"; background: var(--bg); }
.sl-bar { grid-area: bar; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 0 12px; background: var(--surface); border-bottom: 1px solid var(--border); overflow-x: auto; scrollbar-width: none; }
.sl-barl, .sl-barr { display: flex; align-items: center; gap: 3px; flex: none; }
.sl-bar button:not(.cta) { min-width: 30px; height: 30px; padding: 0 7px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 13px; color: var(--ink-2); }
.sl-bar button:not(.cta):hover { background: var(--hover); color: var(--ink); }
.sl-bar button.on { background: var(--tint-soft); color: var(--tint); }
.sl-bar button:disabled { opacity: .4; pointer-events: none; }
.sl-bar button.danger:hover { color: var(--danger); }
.sl-bar button svg { width: 16px; height: 16px; }
.sl-bar .cta svg { width: 14px; height: 14px; margin-right: 4px; }
.sl-bar .cta.small { height: 30px; display: inline-flex; align-items: center; }
.sl-bar .sl-txtbtn { font-size: 12.5px !important; font-weight: 600; }
.sl-bar select { height: 30px; font: inherit; font-size: 12.5px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 0 8px; outline: none; max-width: 190px; }
.sl-sep { width: 1px; height: 22px; background: var(--border); margin: 0 6px; flex: none; }
.sl-barlabel { font-size: 12px; font-weight: 650; color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; margin-right: 6px; white-space: nowrap; }
.sl-swatch { display: inline-block; width: 14px; height: 14px; border-radius: 4px; border: 1px solid rgba(0, 0, 0, .15); }

/* vignettes */
.sl-strip { grid-area: strip; overflow-y: auto; padding: 14px 12px 24px 14px; display: flex; flex-direction: column; gap: 10px; background: var(--bg); border-right: 1px solid var(--border); }
.sl-thumb { position: relative; display: flex; gap: 6px; align-items: flex-start; cursor: pointer; border-radius: 8px; padding: 4px; }
.sl-thumb .sl-tnum { font-size: 11px; font-weight: 650; color: var(--ink-3); width: 14px; flex: none; text-align: right; padding-top: 2px; }
.sl-tbox { position: relative; width: 176px; height: 99px; overflow: hidden; border-radius: 6px; border: 1.5px solid var(--border); background: var(--surface); box-shadow: 0 1px 3px rgba(0, 0, 0, .08); transition: border-color .12s, box-shadow .12s; }
.sl-tin { position: absolute; left: 0; top: 0; width: 1280px; height: 720px; transform-origin: 0 0; pointer-events: none; }
.sl-thumb:hover .sl-tbox { border-color: var(--ink-3); }
.sl-thumb.on .sl-tbox { border-color: var(--tint); box-shadow: 0 0 0 2px var(--tint-soft); }
.sl-thumb.on .sl-tnum { color: var(--tint); }
.sl-thumb.dragging { opacity: .4; }
.sl-thumb.over .sl-tbox { outline: 2px dashed var(--tint); outline-offset: 2px; }
.sl-tadd { display: flex; align-items: center; justify-content: center; gap: 6px; margin-left: 20px; width: 176px; height: 44px; border: 1.5px dashed var(--border); border-radius: 6px; color: var(--ink-3); font-size: 12.5px; font-weight: 600; }
.sl-tadd svg { width: 15px; height: 15px; }
.sl-tadd:hover { border-color: var(--tint); color: var(--tint); background: var(--tint-soft); }

/* scène */
.sl-stage { grid-area: stage; position: relative; overflow: hidden; background: var(--bg); background-image: radial-gradient(color-mix(in srgb, var(--ink-3) 28%, transparent) 1px, transparent 1px); background-size: 22px 22px; }
.sl-canvas { position: absolute; left: 0; top: 0; width: 1280px; height: 720px; transform-origin: 0 0; box-shadow: 0 12px 40px rgba(0, 0, 0, .18); border-radius: 4px; }
.sl-canvas.drop-ready { outline: 3px dashed color-mix(in srgb, var(--tint) 55%, transparent); outline-offset: 6px; }
.sl-canvas.drop-over { outline-color: var(--tint); }

/* une diapositive (partout : scène, vignette, présentation, PDF) */
.sl-slide { position: relative; width: 1280px; height: 720px; overflow: hidden; font-family: var(--font-ui); color: #202124; background: #fff; --acc: #33658a; --sl-ink: #202124; --sl-ink2: #5f6368; --sl-paper: #fff; --sl-line: #dadce0; }
.sl-slide.bg-soft { background: color-mix(in srgb, var(--acc) 9%, #fff); }
.sl-slide.bg-tint { background: linear-gradient(135deg, var(--acc), color-mix(in srgb, var(--acc) 70%, #000)); color: #fff; --sl-ink: #fff; --sl-ink2: rgba(255, 255, 255, .78); --sl-paper: rgba(255, 255, 255, .12); --sl-line: rgba(255, 255, 255, .45); }
.sl-slide.bg-dark { background: #1a1d24; color: #e8eaed; --sl-ink: #e8eaed; --sl-ink2: #bdc1c6; --sl-paper: #262a33; --sl-line: #3c4043; }
.sl-slide::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 8px; background: var(--acc); }
.sl-slide.bg-tint::before { background: rgba(255, 255, 255, .35); }
.sl-el { position: absolute; box-sizing: border-box; padding: 10px 14px; --fs: 1; }
.sl-el .sl-text { outline: none; min-height: 1em; word-wrap: break-word; }
.sl-el .sl-text:empty::before { content: "Texte…"; color: color-mix(in srgb, var(--sl-ink2) 60%, transparent); }
.t-title .sl-text { font-family: var(--font-serif); font-size: calc(56px * var(--fs)); font-weight: 650; line-height: 1.12; letter-spacing: -.01em; color: var(--elc, var(--sl-ink)); }
.t-text .sl-text { font-size: calc(28px * var(--fs)); line-height: 1.45; color: var(--sl-ink); }
.t-list .sl-text { font-size: calc(28px * var(--fs)); line-height: 1.45; }
.t-list ul, .t-list ol { padding-left: 1.1em; margin: 0; }
.t-list li { margin: .18em 0; padding-left: .2em; }
.t-list li::marker { color: var(--elc, var(--acc)); }
.sl-el.t-callout { --cc: var(--elc, #3d6bb5); background: color-mix(in srgb, var(--cc) 9%, var(--sl-paper)); border-left: 7px solid var(--cc); border-radius: 0 12px 12px 0; padding: 14px 20px 16px 22px; }
.sl-el.ct-definition { --cc: var(--elc, #3d6bb5); } .sl-el.ct-arret { --cc: var(--elc, #8c4351); } .sl-el.ct-controverse { --cc: var(--elc, #7a6852); } .sl-el.ct-retenir { --cc: var(--elc, #b3762a); } .sl-el.ct-exemple { --cc: var(--elc, #2e8b6a); } .sl-el.ct-bilan { --cc: var(--elc, #2e8b8b); } .sl-el.ct-drapeau { --cc: var(--elc, #c04343); } .sl-el.ct-reflexe { --cc: var(--elc, #d06a3a); } .sl-el.ct-mnemo { --cc: var(--elc, #7a5ca8); } .sl-el.ct-objectifs { --cc: var(--elc, #33658a); }
.sl-ctitle { display: flex; align-items: center; gap: 8px; font-size: calc(17px * var(--fs)); font-weight: 750; text-transform: uppercase; letter-spacing: .08em; color: var(--cc); margin-bottom: 8px; pointer-events: none; }
.sl-ctitle svg { width: calc(20px * var(--fs)); height: calc(20px * var(--fs)); }
.t-callout .sl-text { font-size: calc(24px * var(--fs)); line-height: 1.45; color: var(--sl-ink); }
.sl-el.t-quote { border-left: 5px solid var(--elc, var(--acc)); padding-left: 24px; }
.t-quote .sl-q { font-family: var(--font-serif); font-style: italic; font-size: calc(30px * var(--fs)); line-height: 1.35; color: var(--sl-ink); }
.t-quote .sl-cite { font-size: calc(18px * var(--fs)); color: var(--sl-ink2); margin-top: 10px; }
.t-quote .sl-cite::before { content: "— "; }
.sl-el.t-image { padding: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 10px; }
.t-image img { width: 100%; height: 100%; object-fit: contain; display: block; }
.sl-imgph { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; background: color-mix(in srgb, var(--sl-ink2) 10%, transparent); border: 2px dashed color-mix(in srgb, var(--sl-ink2) 45%, transparent); border-radius: 10px; color: var(--sl-ink2); font-size: 18px; text-align: center; padding: 12px; }
.sl-imgph svg { width: 44px; height: 44px; }
.sl-el.t-formula { display: flex; align-items: center; justify-content: center; font-family: var(--font-math); font-size: calc(44px * var(--fs)); color: var(--elc, var(--sl-ink)); }
.sl-formula .m { font-size: inherit; }
.sl-ph { color: var(--sl-ink2); font-family: var(--font-ui); font-size: 22px; }
.t-table .sl-text { font-size: calc(22px * var(--fs)); }
.t-table table { width: 100%; border-collapse: collapse; }
.t-table td, .t-table th { border: 1.5px solid var(--sl-line); padding: 8px 12px; vertical-align: top; min-width: 40px; }
.t-table tr:first-child td { background: color-mix(in srgb, var(--elc, var(--acc)) 14%, transparent); font-weight: 650; }
.sl-el.t-stat { display: flex; flex-direction: column; justify-content: center; text-align: center; background: var(--sl-paper); border: 1.5px solid var(--sl-line); border-radius: 14px; padding: 18px; }
.sl-slide.bg-paper .t-stat { background: color-mix(in srgb, var(--elc, var(--acc)) 6%, #fff); }
.t-stat .sl-num { font-family: var(--font-serif); font-size: calc(76px * var(--fs)); font-weight: 700; line-height: 1.05; color: var(--elc, var(--acc)); letter-spacing: -.02em; }
.t-stat .sl-lab { font-size: calc(20px * var(--fs)); color: var(--sl-ink2); margin-top: 8px; }
.sl-el.t-shape { padding: 0; display: flex; align-items: center; justify-content: center; }
.t-shape .sl-shape { position: absolute; inset: 0; background: var(--elc, var(--acc)); border-radius: 12px; opacity: .92; }
.t-shape.sh-pill .sl-shape { border-radius: 999px; }
.t-shape.sh-circle .sl-shape { border-radius: 50%; }
.t-shape.sh-outline .sl-shape { background: transparent; border: 4px solid var(--elc, var(--acc)); opacity: 1; }
.t-shape .sl-shlabel { position: relative; font-size: calc(24px * var(--fs)); font-weight: 650; color: #fff; text-align: center; padding: 10px 16px; }
.t-shape.sh-outline .sl-shlabel { color: var(--elc, var(--acc)); }
.t-shape .sl-shlabel:empty::before { content: ""; }
.sl-el.t-divider { padding: 0; display: flex; align-items: center; }
.sl-divider { width: 100%; height: 4px; border-radius: 2px; background: var(--elc, var(--acc)); }

/* état d'édition (scène uniquement) */
#sl-canvas .sl-el { cursor: move; }
#sl-canvas .sl-el:hover { outline: 1.5px dashed color-mix(in srgb, var(--acc) 55%, transparent); outline-offset: 2px; }
#sl-canvas .sl-el.sel { outline: 2px solid var(--acc); outline-offset: 2px; }
#sl-canvas .sl-el.editing { cursor: text; }
#sl-canvas .sl-el:not(.editing) .sl-text { pointer-events: none; user-select: none; }
#sl-canvas .sl-el.editing .sl-text { pointer-events: auto; user-select: text; }
#sl-canvas .sl-el .sl-h { display: none; position: absolute; width: 14px; height: 14px; background: #fff; border: 2px solid var(--acc); border-radius: 50%; z-index: 5; }
#sl-canvas .sl-el.sel .sl-h { display: block; }
.sl-h[data-h="nw"] { left: -8px; top: -8px; cursor: nwse-resize; } .sl-h[data-h="ne"] { right: -8px; top: -8px; cursor: nesw-resize; }
.sl-h[data-h="sw"] { left: -8px; bottom: -8px; cursor: nesw-resize; } .sl-h[data-h="se"] { right: -8px; bottom: -8px; cursor: nwse-resize; }
.sl-h[data-h="n"] { left: calc(50% - 7px); top: -8px; cursor: ns-resize; } .sl-h[data-h="s"] { left: calc(50% - 7px); bottom: -8px; cursor: ns-resize; }
.sl-h[data-h="w"] { left: -8px; top: calc(50% - 7px); cursor: ew-resize; } .sl-h[data-h="e"] { right: -8px; top: calc(50% - 7px); cursor: ew-resize; }
#sl-canvas .sl-el .sl-grip { display: none; position: absolute; left: 50%; top: -30px; transform: translateX(-50%); width: 46px; height: 18px; border-radius: 9px; background: var(--acc); cursor: move; z-index: 5; }
#sl-canvas .sl-el .sl-grip::before { content: ""; position: absolute; left: 12px; right: 12px; top: 7px; height: 4px; border-radius: 2px; background: repeating-linear-gradient(90deg, #fff 0 3px, transparent 3px 6px); }
#sl-canvas .sl-el.sel.editing .sl-grip { display: block; }

/* volet de droite : palette de blocs + notes */
.sl-side { grid-area: side; overflow-y: auto; display: flex; flex-direction: column; background: var(--surface); border-left: 1px solid var(--border); }
.sl-sidehead { font-size: 11.5px; text-transform: uppercase; letter-spacing: .09em; color: var(--ink-3); font-weight: 650; padding: 16px 16px 8px; display: flex; flex-direction: column; gap: 2px; }
.sl-sidehead span { text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 11.5px; }
.sl-pal { display: flex; flex-direction: column; gap: 4px; padding: 0 12px 12px; }
.sl-pitem { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; text-align: left; cursor: grab; border: 1px solid transparent; }
.sl-pitem:hover { background: var(--hover); border-color: var(--border); }
.sl-pitem:active { cursor: grabbing; }
.sl-pitem > svg { width: 20px; height: 20px; flex: none; color: var(--tint); }
.sl-pitem span { display: flex; flex-direction: column; min-width: 0; }
.sl-pitem b { font-size: 13px; font-weight: 600; color: var(--ink); }
.sl-pitem small { font-size: 11px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#sl-notes { margin: 0 12px 16px; min-height: 110px; flex: none; resize: vertical; font: inherit; font-size: 13px; line-height: 1.5; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: 9px 11px; outline: none; }
#sl-notes:focus { border-color: var(--tint); }

/* menu « nouvelle diapositive » */
.sl-layouts button { display: flex; align-items: center; gap: 10px; }
.sl-laypv { display: inline-block; position: relative; width: 44px; height: 25px; border-radius: 3px; border: 1px solid var(--border); background: var(--surface); flex: none; overflow: hidden; }
.sl-laypv i { position: absolute; display: block; background: var(--ink-3); border-radius: 1px; opacity: .55; }
.sl-laypv.lay-title i:nth-child(1) { left: 8px; right: 8px; top: 8px; height: 4px; background: var(--tint); opacity: 1; } .sl-laypv.lay-title i:nth-child(2) { left: 12px; right: 12px; top: 15px; height: 2px; } .sl-laypv.lay-title i:nth-child(3) { display: none; }
.sl-laypv.lay-content i:nth-child(1), .sl-laypv.lay-bullets i:nth-child(1), .sl-laypv.lay-two i:nth-child(1), .sl-laypv.lay-stats i:nth-child(1) { left: 4px; right: 4px; top: 4px; height: 3px; background: var(--tint); opacity: 1; }
.sl-laypv.lay-content i:nth-child(2) { left: 4px; right: 4px; top: 10px; bottom: 4px; } .sl-laypv.lay-content i:nth-child(3) { display: none; }
.sl-laypv.lay-bullets i:nth-child(2) { left: 6px; width: 24px; top: 11px; height: 2px; } .sl-laypv.lay-bullets i:nth-child(3) { left: 6px; width: 18px; top: 16px; height: 2px; }
.sl-laypv.lay-two i:nth-child(2) { left: 4px; width: 16px; top: 10px; bottom: 4px; } .sl-laypv.lay-two i:nth-child(3) { right: 4px; width: 16px; top: 10px; bottom: 4px; }
.sl-laypv.lay-section { background: var(--tint); } .sl-laypv.lay-section i { background: #fff; opacity: .9; } .sl-laypv.lay-section i:nth-child(1) { left: 8px; right: 8px; top: 9px; height: 4px; } .sl-laypv.lay-section i:nth-child(2), .sl-laypv.lay-section i:nth-child(3) { display: none; }
.sl-laypv.lay-stats i:nth-child(2) { left: 4px; width: 16px; top: 10px; bottom: 4px; border-radius: 2px; } .sl-laypv.lay-stats i:nth-child(3) { right: 4px; width: 16px; top: 10px; bottom: 4px; border-radius: 2px; }
.sl-laypv.lay-blank i { display: none; }

/* mode présentation */
#sl-present { position: fixed; inset: 0; z-index: 2500; background: #000; display: flex; flex-direction: column; }
.sl-pstage { position: relative; flex: 1; overflow: hidden; cursor: pointer; }
.sl-pin { position: absolute; left: 50%; top: 50%; width: 1280px; height: 720px; transform-origin: center; transform: translate(-50%, -50%); }
.sl-pnav { position: absolute; right: 16px; bottom: 14px; display: flex; align-items: center; gap: 4px; padding: 4px 6px; border-radius: 10px; background: rgba(0, 0, 0, .5); color: #fff; opacity: .25; transition: opacity .15s; }
#sl-present:hover .sl-pnav { opacity: 1; }
.sl-pnav button { width: 30px; height: 30px; border-radius: 7px; color: #fff; font-size: 20px; display: grid; place-items: center; }
.sl-pnav button svg { width: 16px; height: 16px; }
.sl-pnav button:hover { background: rgba(255, 255, 255, .18); }
.sl-pcount { font-size: 12.5px; font-variant-numeric: tabular-nums; padding: 0 6px; }
.sl-pnotes { position: absolute; left: 16px; bottom: 14px; max-width: 42vw; max-height: 30vh; overflow: auto; padding: 10px 14px; border-radius: 10px; background: rgba(0, 0, 0, .62); color: #fff; font-size: 14px; line-height: 1.5; white-space: pre-wrap; }

/* impression : une page 16:9 par diapositive */
#sl-print { display: none; }
body.printing-slides #sl-print { display: block; }
.sl-page { width: 1280px; height: 720px; overflow: hidden; page-break-after: always; break-after: page; }
@media print {
  body.printing-slides { --tabbar-h: 0px; }
  body.printing-slides #topbar, body.printing-slides #tabbar, body.printing-slides #view-slides, body.printing-slides #view-editor, body.printing-slides #view-library, body.printing-slides #toolbar, body.printing-slides #toast, body.printing-slides #print-summary, body.printing-slides #print-head { display: none !important; }
  body.printing-slides { overflow: visible; background: #fff; }
  body.printing-slides #sl-print { display: block; position: static; }
  body.printing-slides .sl-page:last-child { page-break-after: auto; break-after: auto; }
  @page slides { size: 13.333in 7.5in; margin: 0; }
  body.printing-slides .sl-page { page: slides; }
}
@media (max-width: 1100px) { #view-slides { grid-template-columns: 150px 1fr 230px; } .sl-tbox { width: 118px; height: 66px; } .sl-tadd { width: 118px; } }

/* ============================================================
   1.14.0 — logo, thèmes de couleurs, police des cours, Paramètres toujours bleus
   ============================================================ */
/* logo : image (le « A » dégradé), plus de fond coloré */
.logo-mark { background: none; padding: 0; }
.logo-mark img { width: 32px; height: 32px; display: block; object-fit: contain; }
.auth-logo .logo-mark { background: none; }
.auth-logo .logo-mark img { width: 56px; height: 56px; }
.set-about .logo-mark { width: 52px; height: 52px; }
.set-about .logo-mark img { width: 52px; height: 52px; }

/* la fenêtre Paramètres garde l'accent bleu d'Alixo, quel que soit le dossier affiché derrière */
#setov { --tint: #33658a; --tint-soft: rgba(51, 101, 138, .14); }
html[data-theme="dark"] #setov { --tint: #6fa3cc; --tint-soft: rgba(111, 163, 204, .2); }

/* thèmes de couleurs (Paramètres › Apparence). Base clair/sombre = html[data-theme], jeu de couleurs = html[data-skin] */
html[data-skin="galaxy"] { --bg: #0a0f1f; --surface: #121a30; --border: #26304f; --ink: #e7ecff; --ink-2: #aab5db; --ink-3: #7784ae; --hover: rgba(140, 160, 255, .1); --paper: #121a30; }
html[data-skin="ink"] { --bg: #14110e; --surface: #1d1915; --border: #3b332b; --ink: #f1e9dc; --ink-2: #c6b9a6; --ink-3: #8f8474; --hover: rgba(255, 230, 190, .08); --paper: #1d1915; }
html[data-skin="forest"] { --bg: #0e1913; --surface: #152219; --border: #2a3b31; --ink: #e5f0e8; --ink-2: #aac0b1; --ink-3: #7a9384; --hover: rgba(170, 220, 190, .09); --paper: #152219; }
html[data-skin="slate"] { --bg: #191c22; --surface: #22262e; --border: #383e49; --ink: #e7e9ee; --ink-2: #b4bac6; --ink-3: #818996; --hover: rgba(255, 255, 255, .07); --paper: #22262e; }
html[data-skin="azure"] { --bg: #e9f2fb; --surface: #ffffff; --border: #c7dbec; --ink: #0f2438; --ink-2: #48627a; --ink-3: #7e95ab; --hover: rgba(30, 90, 150, .07); --paper: #ffffff; }
html[data-skin="sage"] { --bg: #edf3ee; --surface: #fafcf9; --border: #c9d8cc; --ink: #1d2a22; --ink-2: #4e6355; --ink-3: #7f9186; --hover: rgba(40, 100, 60, .07); --paper: #fafcf9; }
html[data-skin="rose"] { --bg: #fbeff3; --surface: #fffbfc; --border: #ebd0da; --ink: #3a2430; --ink-2: #6f5060; --ink-3: #a2848f; --hover: rgba(190, 80, 120, .07); --paper: #fffbfc; }
html[data-skin="sand"] { --bg: #f4eee3; --surface: #fdfaf3; --border: #e0d5c1; --ink: #2c251c; --ink-2: #675947; --ink-3: #988a76; --hover: rgba(140, 100, 40, .07); --paper: #fdfaf3; }
html[data-skin="lavender"] { --bg: #f1eefa; --surface: #fcfbff; --border: #d8d0eb; --ink: #292340; --ink-2: #5d5479; --ink-3: #908aa8; --hover: rgba(100, 80, 180, .07); --paper: #fcfbff; }
/* 1.18 : thèmes sombres colorés (Alixo+). --skin-acc : accent du thème, repris par les boutons, liens et cases actives */
html[data-skin="amber"] { --bg: #17130b; --surface: #231c10; --border: #45391f; --ink: #f7ecd2; --ink-2: #d2c4a2; --ink-3: #9a8c6a; --hover: rgba(233, 185, 73, .1); --paper: #231c10; --skin-acc: #e9b949; }
html[data-skin="candy"] { --bg: #1a0e15; --surface: #26141f; --border: #4a2a3c; --ink: #fde8f1; --ink-2: #dcb7c9; --ink-3: #a5819a; --hover: rgba(255, 111, 174, .1); --paper: #26141f; --skin-acc: #ff6fae; }
html[data-skin="violet"] { --bg: #120d1f; --surface: #1b1430; --border: #37295a; --ink: #eee8fb; --ink-2: #c3b8dd; --ink-3: #8d82a8; --hover: rgba(179, 136, 255, .1); --paper: #1b1430; --skin-acc: #b388ff; }
html[data-skin="ocean"] { --bg: #061418; --surface: #0d1f24; --border: #1f3c44; --ink: #e2f4f5; --ink-2: #a8cfd2; --ink-3: #6f9a9f; --hover: rgba(42, 212, 200, .1); --paper: #0d1f24; --skin-acc: #2ad4c8; }
html[data-skin="ember"] { --bg: #1a0d0a; --surface: #261512; --border: #4a2a24; --ink: #fbe9e3; --ink-2: #d9b5aa; --ink-3: #a0807a; --hover: rgba(255, 122, 69, .1); --paper: #261512; --skin-acc: #ff7a45; }
/* l'accent du thème colore ce qui n'appartient pas à un dossier : boutons principaux, liens, cases cochées */
html[data-skin="amber"] .cta:not(.ghost), html[data-skin="candy"] .cta:not(.ghost), html[data-skin="violet"] .cta:not(.ghost), html[data-skin="ocean"] .cta:not(.ghost), html[data-skin="ember"] .cta:not(.ghost) { background: var(--skin-acc); border-color: var(--skin-acc); color: #1a1408; }
html[data-skin="amber"] a, html[data-skin="candy"] a, html[data-skin="violet"] a, html[data-skin="ocean"] a, html[data-skin="ember"] a { color: var(--skin-acc); }
html[data-skin="amber"] input[type="checkbox"], html[data-skin="candy"] input[type="checkbox"], html[data-skin="violet"] input[type="checkbox"], html[data-skin="ocean"] input[type="checkbox"], html[data-skin="ember"] input[type="checkbox"],
html[data-skin="amber"] input[type="radio"], html[data-skin="candy"] input[type="radio"], html[data-skin="violet"] input[type="radio"], html[data-skin="ocean"] input[type="radio"], html[data-skin="ember"] input[type="radio"],
html[data-skin="amber"] input[type="range"], html[data-skin="candy"] input[type="range"], html[data-skin="violet"] input[type="range"], html[data-skin="ocean"] input[type="range"], html[data-skin="ember"] input[type="range"] { accent-color: var(--skin-acc); }
@media print { html[data-skin] { --bg: #fff; --surface: #fff; --paper: #fff; --border: #c9ccd1; --ink: #1a1a1a; --ink-2: #46494e; --ink-3: #85898f; } }

/* vignettes des thèmes et des polices */
.set-tiles4 { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 860px; }
.set-skin { background: var(--p0); }
.set-skin i { background: var(--p2); opacity: .55; }
.set-skin i:nth-child(1) { left: 8px; top: 8px; width: 40%; height: 6px; opacity: .9; }
.set-skin i:nth-child(2) { left: 8px; top: 20px; width: 70%; height: 6px; }
.set-skin i:nth-child(3) { left: 8px; top: 32px; width: 55%; height: 6px; }
.set-skin::after { content: ""; position: absolute; right: 8px; top: 8px; bottom: 8px; width: 34%; border-radius: 5px; background: var(--p1); border: 1px solid color-mix(in srgb, var(--p2) 18%, transparent); }
.set-skin em { position: absolute; right: 14px; bottom: 13px; width: 10px; height: 10px; border-radius: 50%; background: var(--p3); z-index: 1; }
/* carte « Automatique » : moitié claire / moitié sombre. Les lignes de texte factices prennent la couleur
   de leur moitié (avant 1.18 elles étaient sombres sur les deux, donc invisibles à droite, et le petit
   panneau de droite reprenait un dégradé décalé par rapport à la coupure) */
.set-skin.th-auto { background: linear-gradient(100deg, #f6f7f9 50%, #141414 50%); }
.set-skin.th-auto i { background: #fff; mix-blend-mode: difference; opacity: .82; }
.set-skin.th-auto i:nth-child(1) { opacity: .95; }
.set-skin.th-auto::after { background: #1f1f1f; border-color: #3c4043; }
.set-skin.th-auto em { background: #6fa3cc; }
.set-fonts .set-tile { gap: 2px; }
.set-fontprev { display: block; width: 100%; height: 58px; border-radius: 7px; margin-bottom: 7px; background: var(--paper); border: 1px solid var(--border); color: var(--ink); font-size: 24px; line-height: 56px; padding: 0 10px; white-space: nowrap; overflow: hidden; }
.set-fontprev small { font-size: 12.5px; color: var(--ink-2); margin-left: 6px; }
.set-inline { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-2); }
.set-inline select { font: inherit; font-size: 13px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 6px 9px; outline: none; }
@media (max-width: 1000px) { .set-tiles4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* police et taille des cours (Paramètres › Écriture) : --doc-font / --doc-font-head / --doc-scale posés par le JS */
:root { --font-serif-base: "Iowan Old Style", Palatino, Georgia, "Times New Roman", serif; }
#doc { --font-serif: var(--doc-font, var(--font-serif-base)); zoom: var(--doc-scale, 1); }
#doc .block.h .btxt, #doc .block.h .hnum { font-family: var(--doc-font-head, var(--font-serif)); }
#print-head, #print-summary { --font-serif: var(--doc-font, var(--font-serif-base)); }

/* ============================================================
   1.14.0 — présentations : thèmes (polices), vignettes, sélection multiple, nouveaux blocs, palette
   ============================================================ */
/* polices du thème : titres / corps (posées par slideHTML) */
.sl-slide { font-family: var(--font-body, var(--font-ui)); background: var(--sl-paper, #fff); color: var(--sl-ink, #202124); --sl-line: color-mix(in srgb, var(--sl-ink) 18%, transparent); }
.sl-slide.bg-paper { background: var(--sl-paper); }
.sl-slide.bg-soft { background: color-mix(in srgb, var(--acc) 10%, var(--sl-paper)); }
.sl-slide.th-dark.bg-soft { background: color-mix(in srgb, var(--acc) 16%, var(--sl-paper)); }
.sl-slide.bg-dark { background: #1a1d24; color: #e8eaed; --sl-ink: #e8eaed; --sl-ink2: #bdc1c6; --sl-paper: #262a33; }
.t-title .sl-text, .t-subtitle .sl-text, .t-stat .sl-num, .t-kpis .sl-num, .t-quote .sl-q { font-family: var(--font-head, var(--font-serif)); }
/* vignettes : largeur du volet, plus de rognage */
.sl-thumb .sl-tbox { flex: 1; min-width: 0; width: auto; height: auto; aspect-ratio: 16 / 9; }
.sl-strip { padding-right: 14px; }
.sl-tadd { width: auto; margin-left: 20px; margin-right: 0; align-self: stretch; }
/* rectangle de sélection */
.sl-marquee { position: absolute; border: 2px dashed var(--acc, #33658a); background: color-mix(in srgb, var(--acc, #33658a) 10%, transparent); pointer-events: none; z-index: 999; }
/* palette : recherche + catégories */
.sl-palsearch { padding: 0 12px 8px; }
.sl-palsearch input { width: 100%; font: inherit; font-size: 12.5px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 7px; padding: 7px 10px; outline: none; }
.sl-palsearch input:focus { border-color: var(--tint); }
.sl-paltabs { display: flex; gap: 4px; padding: 0 12px 8px; }
.sl-paltabs button { flex: 1; font-size: 12px; font-weight: 600; color: var(--ink-2); padding: 5px 0; border-radius: 6px; border: 1px solid var(--border); background: var(--bg); }
.sl-paltabs button.on { background: var(--tint-soft); color: var(--tint); border-color: color-mix(in srgb, var(--tint) 40%, transparent); }
.sl-palempty { font-size: 12px; color: var(--ink-3); padding: 8px 10px; }
.sl-inl { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-2); }
.sl-inl input[type="range"] { width: 90px; accent-color: var(--tint); }
/* choix du thème */
.sl-themes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; max-height: 380px; overflow-y: auto; padding: 2px; }
.sl-themes button { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 6px; border-radius: 8px; border: 1.5px solid var(--border); text-align: left; background: var(--surface); }
.sl-themes button:hover { border-color: var(--ink-3); }
.sl-themes button.on { border-color: var(--tint); background: var(--tint-soft); }
.sl-thprev { display: block; position: relative; width: 100%; height: 44px; border-radius: 5px; background: var(--tp); border: 1px solid rgba(0, 0, 0, .1); overflow: hidden; }
.sl-thprev b { position: absolute; left: 8px; top: 4px; font-family: var(--th); font-size: 22px; color: var(--ti); font-weight: 700; }
.sl-thprev i { position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background: var(--ta); }
.sl-thname { font-size: 12.5px; font-weight: 650; color: var(--ink); }
.sl-themes small { font-size: 10.5px; color: var(--ink-3); line-height: 1.25; }
:is(#popover, .po-scope):has(.sl-themes) { width: 440px; }
.sl-graphs button { display: flex; align-items: center; gap: 10px; }
.sl-gthumb { display: inline-block; width: 64px; height: 44px; flex: none; border: 1px solid var(--border); border-radius: 4px; overflow: hidden; background: #fff; }
.sl-gthumb svg { width: 100%; height: 100%; }
/* --- nouveaux blocs --- */
.t-subtitle .sl-text { font-size: calc(34px * var(--fs)); font-weight: 500; line-height: 1.25; color: var(--elc, var(--sl-ink2)); }
.t-kicker .sl-text { font-size: calc(18px * var(--fs)); font-weight: 750; letter-spacing: .14em; text-transform: uppercase; color: var(--elc, var(--acc)); }
.t-olist .sl-text, .t-checklist .sl-text, .t-agenda .sl-text { font-size: calc(28px * var(--fs)); line-height: 1.45; }
.t-olist ol { padding-left: 1.3em; margin: 0; } .t-olist li { margin: .18em 0; padding-left: .2em; } .t-olist li::marker { color: var(--elc, var(--acc)); font-weight: 700; }
.t-checklist ul { list-style: none; padding: 0; margin: 0; }
.t-checklist li { position: relative; padding-left: 1.5em; margin: .25em 0; }
.t-checklist li::before { content: ""; position: absolute; left: 0; top: .18em; width: .95em; height: .95em; border: 2.5px solid var(--elc, var(--acc)); border-radius: .25em; }
.t-checklist li::after { content: ""; position: absolute; left: .32em; top: .22em; width: .3em; height: .55em; border: solid var(--elc, var(--acc)); border-width: 0 3px 3px 0; transform: rotate(45deg); opacity: .9; }
.t-agenda ol { list-style: none; counter-reset: ag; padding: 0; margin: 0; }
.t-agenda li { counter-increment: ag; display: flex; align-items: baseline; gap: .6em; margin: .35em 0; font-size: calc(30px * var(--fs)); font-weight: 550; }
.t-agenda li::before { content: counter(ag, upper-roman) "."; font-family: var(--font-head, var(--font-serif)); font-weight: 750; font-size: 1.3em; color: var(--elc, var(--acc)); min-width: 1.6em; }
.t-code .sl-text { font-family: "Cascadia Code", Consolas, "Courier New", monospace; font-size: calc(22px * var(--fs)); line-height: 1.5; white-space: pre-wrap; background: color-mix(in srgb, var(--sl-ink) 7%, transparent); border-radius: 10px; padding: 14px 18px; color: var(--sl-ink); }
.t-session .sl-text { font-size: calc(22px * var(--fs)); color: var(--sl-ink2); }
.sl-el.t-definition { display: flex; gap: 22px; align-items: baseline; border-bottom: 3px solid var(--elc, var(--acc)); padding-bottom: 10px; }
.t-definition .sl-term { font-family: var(--font-head, var(--font-serif)); font-size: calc(32px * var(--fs)); font-weight: 700; color: var(--elc, var(--acc)); flex: 0 0 auto; max-width: 40%; }
.t-definition .sl-def { font-size: calc(24px * var(--fs)); line-height: 1.4; flex: 1; color: var(--sl-ink); }
.sl-el.t-juris { background: var(--sl-paper); border: 1.5px solid var(--sl-line); border-left: 8px solid var(--elc, #8c4351); border-radius: 0 12px 12px 0; padding: 14px 20px; display: flex; flex-direction: column; gap: 10px; }
.sl-jhead { display: flex; align-items: center; gap: 10px; color: var(--elc, #8c4351); }
.sl-jhead svg { width: calc(26px * var(--fs)); height: calc(26px * var(--fs)); flex: none; }
.sl-jhead .sl-jref { font-family: var(--font-head, var(--font-serif)); font-size: calc(24px * var(--fs)); font-weight: 700; color: var(--elc, #8c4351); flex: 1; }
.sl-jgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 22px; flex: 1; }
.sl-jcell b { display: block; font-size: calc(14px * var(--fs)); text-transform: uppercase; letter-spacing: .1em; color: var(--sl-ink2); margin-bottom: 3px; }
.sl-jcell .sl-text { font-size: calc(19px * var(--fs)); line-height: 1.4; color: var(--sl-ink); }
.sl-el.t-kpis { display: flex; gap: 16px; padding: 0; }
.sl-kpi { flex: 1; display: flex; flex-direction: column; justify-content: center; text-align: center; background: var(--sl-paper); border: 1.5px solid var(--sl-line); border-radius: 14px; padding: 16px 12px; }
.sl-slide.bg-paper .sl-kpi { background: color-mix(in srgb, var(--elc, var(--acc)) 6%, var(--sl-paper)); }
.sl-kpi .sl-num { font-size: calc(58px * var(--fs)); font-weight: 700; line-height: 1.05; color: var(--elc, var(--acc)); letter-spacing: -.02em; }
.sl-kpi .sl-lab { font-size: calc(18px * var(--fs)); color: var(--sl-ink2); margin-top: 6px; }
.sl-el.t-question { display: flex; flex-direction: column; gap: 12px; }
.t-question .sl-qq { font-family: var(--font-head, var(--font-serif)); font-size: calc(30px * var(--fs)); font-weight: 650; line-height: 1.25; color: var(--sl-ink); }
.sl-answers { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; }
.sl-ans { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 2px solid var(--sl-line); border-radius: 12px; font-size: calc(22px * var(--fs)); background: var(--sl-paper); }
.sl-ans .sl-text { flex: 1; }
.sl-ansl { flex: none; width: calc(36px * var(--fs)); height: calc(36px * var(--fs)); border-radius: 50%; display: grid; place-items: center; font-weight: 750; font-size: calc(18px * var(--fs)); background: color-mix(in srgb, var(--sl-ink) 10%, transparent); color: var(--sl-ink2); cursor: pointer; }
.sl-ans.ok { border-color: var(--elc, #2e8b6a); background: color-mix(in srgb, var(--elc, #2e8b6a) 10%, var(--sl-paper)); }
.sl-ans.ok .sl-ansl { background: var(--elc, #2e8b6a); color: #fff; }
.sl-el.t-steps { padding: 0; }
.sl-steps { display: flex; align-items: flex-start; height: 100%; position: relative; }
.sl-steps::before { content: ""; position: absolute; left: 8%; right: 8%; top: calc(22px * var(--fs)); height: 4px; background: color-mix(in srgb, var(--elc, var(--acc)) 35%, transparent); border-radius: 2px; }
.sl-step { flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; position: relative; padding: 0 6px; }
.sl-stepn { width: calc(46px * var(--fs)); height: calc(46px * var(--fs)); border-radius: 50%; background: var(--elc, var(--acc)); color: #fff; display: grid; place-items: center; font-weight: 750; font-size: calc(22px * var(--fs)); box-shadow: 0 0 0 6px var(--sl-paper); }
.sl-step .sl-text { font-size: calc(20px * var(--fs)); line-height: 1.3; color: var(--sl-ink); }
.sl-el.t-compare { display: flex; gap: 18px; padding: 0; }
.sl-col { flex: 1; display: flex; flex-direction: column; background: var(--sl-paper); border: 1.5px solid var(--sl-line); border-radius: 14px; overflow: hidden; }
.sl-col .sl-colt { font-family: var(--font-head, var(--font-serif)); font-size: calc(26px * var(--fs)); font-weight: 700; padding: 10px 18px; background: var(--elc, var(--acc)); color: #fff; }
.sl-col + .sl-col .sl-colt { background: color-mix(in srgb, var(--elc, var(--acc)) 55%, var(--sl-ink)); }
.sl-col .sl-colb { padding: 12px 18px; font-size: calc(22px * var(--fs)); line-height: 1.45; flex: 1; color: var(--sl-ink); }
.sl-col ul { padding-left: 1.1em; margin: 0; } .sl-col li::marker { color: var(--elc, var(--acc)); }
.sl-el.t-icon { padding: 0; display: flex; align-items: center; justify-content: center; color: var(--elc, var(--acc)); }
.sl-icon, .sl-icon svg { width: 100%; height: 100%; }
.sl-icon svg { stroke-width: 1.5; }
.sl-el.t-arrow { padding: 0; color: var(--elc, var(--acc)); }
.sl-arrow { width: 100%; height: 100%; display: block; }
.t-arrow.dir-left .sl-arrow { transform: scaleX(-1); }
.t-arrow.dir-down .sl-arrow { transform: rotate(90deg); }
.t-arrow.dir-up .sl-arrow { transform: rotate(-90deg); }
.t-shape.sh-diamond .sl-shape { border-radius: 8px; transform: rotate(45deg) scale(.72); }
.t-shape.sh-tri .sl-shape { border-radius: 0; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.sl-el.t-sticky { background: #fff3a8; color: #4a4222; transform: rotate(-2deg); box-shadow: 3px 5px 14px rgba(0, 0, 0, .18); padding: 18px 20px; font-family: "Segoe Print", "Comic Sans MS", "Trebuchet MS", sans-serif; }
.t-sticky .sl-text { font-size: calc(24px * var(--fs)); line-height: 1.35; color: #4a4222; }
.sl-el.t-sticky[style*="--elc"] { background: color-mix(in srgb, var(--elc) 35%, #fff); }
.sl-el.t-bubble { background: var(--sl-paper); border: 3px solid var(--elc, var(--acc)); border-radius: 22px; padding: 16px 22px; display: flex; align-items: center; }
.sl-el.t-bubble::after { content: ""; position: absolute; left: 34px; bottom: -18px; width: 22px; height: 22px; background: var(--sl-paper); border-right: 3px solid var(--elc, var(--acc)); border-bottom: 3px solid var(--elc, var(--acc)); transform: skewX(20deg) rotate(45deg); }
.t-bubble .sl-text { font-size: calc(24px * var(--fs)); line-height: 1.35; color: var(--sl-ink); }
.sl-el.t-badge { padding: 0; display: flex; align-items: center; justify-content: center; background: var(--elc, var(--acc)); color: #fff; border-radius: 999px; }
.t-badge .sl-text { font-size: calc(18px * var(--fs)); font-weight: 750; letter-spacing: .06em; text-transform: uppercase; padding: 4px 18px; white-space: nowrap; }
.sl-el.t-progress { display: flex; flex-direction: column; justify-content: center; gap: 8px; }
.sl-prog { height: 18px; border-radius: 9px; background: color-mix(in srgb, var(--sl-ink) 10%, transparent); overflow: hidden; }
.sl-progbar { height: 100%; border-radius: 9px; background: var(--elc, var(--acc)); }
.sl-progrow { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: calc(20px * var(--fs)); color: var(--sl-ink2); }
.sl-progpct { font-weight: 750; color: var(--elc, var(--acc)); }
.sl-el.t-chart, .sl-el.t-graph { padding: 8px; background: var(--sl-paper); border-radius: 12px; }
.sl-chart, .sl-chart svg { width: 100%; height: 100%; }
.sl-slide .sl-chart svg { --ink: var(--sl-ink); --ink-2: var(--sl-ink2); --border: var(--sl-line); --paper: var(--sl-paper); --font-ui: var(--font-body); }
.sl-el.t-qr { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--sl-ink); }
.sl-qr { flex: 1; min-height: 0; aspect-ratio: 1; background: #fff; padding: 10px; border-radius: 10px; color: #111; }
.sl-qr svg { width: 100%; height: 100%; display: block; }
.t-qr .sl-lab { font-size: calc(18px * var(--fs)); color: var(--sl-ink2); text-align: center; }
.sl-el.t-pagenum { padding: 0; display: flex; align-items: center; justify-content: flex-end; }
.sl-pagenum { font-size: calc(18px * var(--fs)); font-weight: 600; color: var(--sl-ink2); font-variant-numeric: tabular-nums; }
#sl-canvas .sl-el.editing .sl-answers .sl-ansl { pointer-events: auto; }

/* --- galaxie 3D (three.js) --- */
.gx-3d { position: absolute; inset: 0; }
.gx-3d canvas { display: block; touch-action: none; user-select: none; }
.gx-labels { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.gx-label { position: absolute; left: 0; top: 0; white-space: nowrap; font-size: 12.5px; font-weight: 600; color: var(--ink); background: color-mix(in srgb, var(--surface) 82%, transparent); border: 1px solid color-mix(in srgb, var(--border) 60%, transparent); border-radius: 6px; padding: 3px 8px; transition: opacity .15s; will-change: transform; }
.gx-label.root { font-size: 14px; font-weight: 650; }
.gx-label.doc, .gx-label.slides, .gx-label.file { font-size: 11.5px; font-weight: 500; color: var(--ink-2); }
.gx-label.hover { color: var(--ink); font-weight: 650; border-color: var(--ink-3); }
html[data-theme="dark"] .gx-label { background: rgba(10, 13, 20, .78); }
.sl-qr svg { stroke: none; }
.sl-qr svg path { fill: currentColor; stroke: none; }

/* ============================================================
   1.15.0 — partage en direct : accès, présence, dossiers partagés dans la bibliothèque ; réglages IA
   ============================================================ */
/* qui a accès (barre supérieure, séance ouverte) */
.access-chips { display: none; align-items: center; gap: 0; padding: 3px 8px 3px 4px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); margin-right: 4px; cursor: pointer; }
body.mode-editor .access-chips:not([hidden]), body.mode-slides .access-chips:not([hidden]) { display: inline-flex; }
.access-chips:hover { background: var(--hover); border-color: var(--ink-3); }
.acc-av { width: 24px; height: 24px; border-radius: 50%; background: var(--pc, var(--tint)); color: #fff; font-size: 11px; font-weight: 700; display: grid; place-items: center; border: 2px solid var(--surface); margin-left: -6px; position: relative; }
.acc-av:first-child { margin-left: 0; }
.acc-av.owner { box-shadow: 0 0 0 1.5px var(--pc, var(--tint)); }
.acc-av.here::after { content: ""; position: absolute; right: -2px; bottom: -2px; width: 8px; height: 8px; border-radius: 50%; background: var(--ok); border: 1.5px solid var(--surface); }
.acc-more { font-size: 11px; font-weight: 700; color: var(--ink-2); margin-left: 4px; }
.acc-lbl { font-size: 12px; font-weight: 600; color: var(--ink-2); margin-left: 8px; white-space: nowrap; }
/* blocs modifiés par d'autres en ce moment */
#blocks .block[data-peer] { box-shadow: -3px 0 0 0 var(--peer, var(--tint)); border-radius: 2px; }
#blocks .block[data-peer]::before { content: attr(data-peer); position: absolute; right: 0; top: -9px; font-size: 10px; font-weight: 700; letter-spacing: .04em; color: #fff; background: var(--peer, var(--tint)); padding: 1px 7px; border-radius: 4px; z-index: 3; pointer-events: none; font-family: var(--font-ui); }
#blocks .block { position: relative; }
#blocks .block.peer-flash { animation: peerflash 1.8s ease; }
@keyframes peerflash { 0% { background: color-mix(in srgb, var(--tint) 22%, transparent); } 100% { background: transparent; } }
.peer-live { color: var(--ok); font-weight: 600; }
/* bibliothèque : partagés avec moi */
.grid-sect-shared { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.grid-sect-shared .dicon { width: 14px; height: 14px; }
.sh-pending { font-size: 11.5px; font-weight: 600; color: var(--tint); background: var(--tint-soft); border-radius: 999px; padding: 2px 9px; text-transform: none; letter-spacing: 0; }
.doc-card.shared-card .mat-chip, .folder-card.shared-card .meta { display: inline-flex; align-items: center; gap: 5px; }
.doc-card.shared-card .mat-chip .dicon, .folder-card.shared-card .meta .dicon { width: 12px; height: 12px; }
.doc-card.shared-card, .folder-card.shared-card { border-style: dashed; }
.doc-card.shared-card .pin-btn, .doc-card.shared-card .del-btn { display: none; }
.title-shared { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 500; color: var(--ink-3); margin-left: 12px; vertical-align: middle; }
.title-shared .dicon { width: 14px; height: 14px; }
.tree-shared { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); }
.tree-shtitle { display: flex; align-items: center; gap: 6px; padding: 2px 8px 8px; }
.tree-shtitle .dicon { width: 13px; height: 13px; }
.sh-card h3 .dicon { width: 14px; height: 14px; margin-right: 5px; vertical-align: -2px; }
/* présentation partagée en lecture seule */
.sl-ro { font-size: 12.5px; color: var(--ink-2); margin-left: 8px; white-space: nowrap; }
body.readonly #sl-canvas .sl-el { cursor: default; }
body.readonly #sl-canvas .sl-el:hover { outline: none; }
body.readonly .sl-side .sl-pal, body.readonly .sl-side .sl-palsearch, body.readonly .sl-side .sl-paltabs, body.readonly .sl-side .sl-sidehead:first-child, body.readonly .sl-side #sl-notes, body.readonly .sl-tadd { display: none; }
/* réglages IA */
.set-checks { display: flex; flex-direction: column; gap: 8px; max-width: 640px; }
.set-checks label { display: flex; align-items: flex-start; gap: 10px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg); cursor: pointer; }
.set-checks label:hover { border-color: var(--ink-3); }
.set-checks input { accent-color: var(--tint); margin-top: 3px; flex: none; }
.set-checks span { display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
.set-checks small { font-size: 11.5px; color: var(--ink-3); line-height: 1.35; }
#set-ailevel { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 640px; }
#set-ailevel .set-tile { gap: 4px; }

/* ============================================================
   1.16 — fenêtres centrales (partage, événement, Alixo+), Alixo+
   ============================================================ */
/* cases à cocher et boutons radio dans les pop-overs et les Paramètres : jamais étirés par la règle
   générique des champs (les réglages IA et « Chaque semaine » s'affichaient décalés) */
:is(#popover, .po-scope) input[type="checkbox"], :is(#popover, .po-scope) input[type="radio"] { flex: none; width: auto; padding: 0; border: none; background: none; border-radius: 0; accent-color: var(--tint); }
.dlgov {
  position: fixed; inset: 0; z-index: 1550;
  display: flex; align-items: center; justify-content: center;
  background: rgba(10, 12, 18, .46); padding: 24px;
  animation: setfade .16s ease;
}
.dlg-card { width: min(860px, 94vw); height: auto; max-height: min(780px, 92vh); }
.dlg-card.narrow { width: min(600px, 94vw); }
.dlg-card.wide { width: min(1000px, 94vw); }
.dlg-card .set-head { padding: 22px 26px 14px; }
.dlg-htxt { min-width: 0; }
.dlg-eyebrow { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--tint); margin-bottom: 4px; }
.dlg-body { padding: 10px 26px 22px; }
.dlg-body .po-hint { max-width: none; }
.dlg-foot { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 12px 26px 16px; border-top: 1px solid var(--border); flex-wrap: wrap; }
.dlg-spacer { flex: 1; }
.dlg-nav { width: 210px; }
.dlg-nav .set-navtitle { font-size: 18px; padding-bottom: 10px; }
.dlg-chip { display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 2px 8px; border-radius: 999px; background: var(--tint-soft); color: var(--tint); vertical-align: 3px; margin-left: 8px; }
body.has-dlg #popover, body.has-dlg #ctxmenu { z-index: 1600; }
.linklike { background: none; border: none; padding: 0; font: inherit; color: var(--tint); text-decoration: underline; cursor: pointer; }

/* --- événement --- */
.ev-form { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(220px, 1fr); gap: 26px; align-items: start; }
.ev-main { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ev-field { display: flex; flex-direction: column; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--ink-3); text-transform: uppercase; letter-spacing: .05em; min-width: 0; }
.ev-field > input, .ev-field > .fpick { text-transform: none; letter-spacing: 0; font-weight: 400; }
:is(#popover, .po-scope) .ev-field input { width: 100%; max-width: none; }
:is(#popover, .po-scope) .ev-titlein { font-size: 17px; font-weight: 600; padding: 11px 13px; font-family: var(--font-serif); }
.ev-help { display: block; font-size: 11.5px; color: var(--ink-3); text-transform: none; letter-spacing: 0; font-weight: 400; line-height: 1.4; margin-top: 2px; }
.ev-grid3 { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 10px; }
.ev-grid2 { display: grid; grid-template-columns: 1.5fr 1fr; gap: 10px; align-items: end; }
/* case à cocher alignée sur la ligne du titre (« Chaque semaine »), pas sur le haut du bloc :
   hauteur de ligne fixe pour le titre, case centrée sur cette même hauteur */
.ev-check { display: flex; align-items: flex-start; gap: 10px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg); cursor: pointer; }
.ev-check span { display: flex; flex-direction: column; gap: 1px; font-size: 13px; }
.ev-check b { display: block; line-height: 18px; }
.ev-check small { font-size: 11.5px; color: var(--ink-3); line-height: 1.35; }
.ev-check input { width: 15px; height: 15px; flex: none; margin: 0; align-self: flex-start; transform: translateY(1.5px); }
.ev-side { display: flex; flex-direction: column; gap: 6px; }
.ev-preview { border: 1px solid var(--border); border-radius: 10px; background: var(--bg); padding: 12px; margin-bottom: 10px; }
.ev-pday { font-size: 11.5px; color: var(--ink-3); margin-bottom: 8px; text-transform: capitalize; }
.ev-pcard { display: flex; gap: 10px; background: var(--paper); border: 1px solid var(--border); border-radius: 8px; padding: 9px 11px 9px 8px; box-shadow: inset 4px 0 0 var(--ec, var(--tint)); }
.ev-pcard > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ev-pcard b { font-size: 13.5px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; }
.ev-pcard span { font-size: 12px; color: var(--ink-2); }
.ev-pcard span:empty { display: none; }
.ev-pbar { display: none; }
:is(#popover, .po-scope) .ev-colors { grid-template-columns: repeat(6, 1fr); max-width: 240px; }
:is(#popover, .po-scope) .ev-colors button { width: 30px; height: 30px; }
.ev-danger { color: var(--danger); }
@media (max-width: 720px) { .ev-form { grid-template-columns: 1fr; } .ev-grid3, .ev-grid2 { grid-template-columns: 1fr 1fr; } .ev-grid3 > :first-child { grid-column: 1 / -1; } }

/* --- partage --- */
.sh-dlg2 { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(220px, 1fr); gap: 26px; align-items: start; }
.sh-dlg-side { display: flex; flex-direction: column; gap: 12px; }
.sh-how { border: 1px solid var(--border); border-radius: 10px; background: var(--bg); padding: 12px 14px; font-size: 12.5px; color: var(--ink-2); line-height: 1.45; }
.sh-how b { display: block; color: var(--ink); margin-bottom: 6px; font-size: 13px; }
.sh-how ol { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 4px; }
.sh-how li::marker { color: var(--tint); font-weight: 700; }
.sh-roles { display: flex; flex-direction: column; gap: 6px; }
.sh-roles > div { display: flex; flex-direction: column; gap: 1px; padding: 8px 12px; border: 1px solid var(--border); border-radius: 9px; font-size: 12.5px; color: var(--ink-2); }
.sh-roles b { color: var(--ink); font-size: 13px; }
.share-dlg .sh-members { gap: 6px; }
.share-dlg .sh-member { padding: 8px 10px; font-size: 13.5px; }
.share-dlg .sh-member .sh-av { width: 30px; height: 30px; font-size: 13px; }
.share-dlg .sh-inv { display: flex; gap: 6px; margin-top: 6px; }
:is(#popover, .po-scope) .share-dlg .sh-inv input, .share-dlg .sh-inv input { flex: 1; max-width: none; }
.share-dlg .sh-inv select { border: 1px solid var(--border); background: var(--bg); border-radius: 6px; padding: 7px 9px; font: inherit; font-size: 13px; color: var(--ink); }
.share-dlg .sh-content { max-height: 360px; }
.share-dlg .sh-log { max-height: 420px; overflow-y: auto; }
.share-dlg .sh-link { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12.5px; color: var(--ink-2); margin-top: 10px; }
.share-dlg .sh-link code { font-family: var(--font-mono); font-size: 12px; background: var(--bg); border: 1px solid var(--border); padding: 3px 8px; border-radius: 6px; color: var(--ink); }
.sh-ownercard { display: flex; align-items: center; gap: 14px; padding: 14px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg); }
.sh-ownercard .po-avatar { width: 44px; height: 44px; font-size: 18px; }
@media (max-width: 720px) { .sh-dlg2 { grid-template-columns: 1fr; } }

/* --- Alixo+ --- */
.plus-badge { display: inline-flex; align-items: center; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 1px 7px; border-radius: 999px; background: linear-gradient(120deg, #b3762a, #d9a441); color: #fff; margin-left: 7px; vertical-align: 2px; line-height: 1.5; }
.set-tile.locked { opacity: .78; }
.set-tile.locked:hover { opacity: 1; }
.set-tile.locked .set-tile-prev, .set-tile.locked .set-fontprev { filter: saturate(.6); }
.plus-state { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid color-mix(in srgb, #d9a441 45%, var(--border)); border-radius: 12px; background: color-mix(in srgb, #d9a441 9%, var(--surface)); margin-bottom: 14px; flex-wrap: wrap; }
.plus-state > svg { width: 30px; height: 30px; color: #c8892e; fill: color-mix(in srgb, #d9a441 35%, transparent); stroke: currentColor; stroke-width: 1.6; flex: none; }
.plus-state > div { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: 3px; }
.plus-state b { font-size: 15px; color: var(--ink); }
.plus-state span { font-size: 12.5px; color: var(--ink-2); line-height: 1.45; }
.plus-cta { background: linear-gradient(120deg, #b3762a, #d9a441); color: #fff; }
.plus-lock { display: flex; align-items: flex-start; gap: 14px; padding: 4px 0 14px; }
.plus-lock > svg { width: 34px; height: 34px; color: #c8892e; stroke: currentColor; stroke-width: 1.5; fill: none; flex: none; }
.plus-lock > div { display: flex; flex-direction: column; gap: 4px; }
.plus-lock b { font-size: 15px; color: var(--ink); }
.plus-lock span { font-size: 13px; color: var(--ink-2); line-height: 1.5; max-width: 640px; }
.plus-table { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }
.plus-row { display: grid; grid-template-columns: minmax(0, 1fr) 150px 160px; align-items: center; border-top: 1px solid var(--border); }
.plus-row:first-child { border-top: none; }
.plus-row > span { padding: 11px 14px; font-size: 13px; }
.plus-row.plus-head { background: var(--bg); }
.plus-row.plus-head > span { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); padding: 9px 14px; }
.plus-row.plus-head .plus-badge { margin: 0; }
.plus-row.on { background: color-mix(in srgb, #d9a441 10%, transparent); }
.plus-fname { display: grid; grid-template-columns: 22px 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center; }
.plus-fname svg { width: 20px; height: 20px; grid-row: 1 / 3; color: var(--tint); stroke: currentColor; stroke-width: 1.7; fill: none; }
.plus-fname b { font-size: 13.5px; color: var(--ink); }
.plus-fname small { font-size: 11.5px; color: var(--ink-3); line-height: 1.4; }
.plus-free { color: var(--ink-3); }
.plus-plus { font-weight: 650; color: #b07322; }
.plus-dlg .plus-table { margin-bottom: 12px; }
.po-stor-quota { height: 6px; border-radius: 999px; background: var(--bg); border: 1px solid var(--border); overflow: hidden; margin-top: 8px; }
.po-stor-quota i { display: block; height: 100%; background: var(--tint); border-radius: 999px; }
.po-stor-quota i.warn { background: var(--warn); }
.po-stor-quota.plus { height: auto; border: none; background: none; font-size: 12px; color: var(--ink-2); margin-top: 6px; }
.po-stor-qtxt { font-size: 12px; color: var(--ink-2); margin-top: 5px; }
.ln-agenda.plus-locked::after { content: "+"; width: 16px; height: 16px; line-height: 16px; text-align: center; font-size: 12px; font-weight: 800; border-radius: 50%; background: linear-gradient(120deg, #b3762a, #d9a441); color: #fff; margin-left: auto; flex: none; }
.ln-agenda.plus-locked { color: var(--ink-3); }
@media (max-width: 720px) { .plus-row { grid-template-columns: minmax(0, 1fr) 90px 100px; } .plus-row > span { padding: 9px 10px; font-size: 12.5px; } }
:is(#popover, .po-scope) .po-cal .ev-check { flex-direction: row; align-items: flex-start; font-size: 13px; color: var(--ink); }
:is(#popover, .po-scope) .po-cal .ev-check > span { color: var(--ink); }
:is(#popover, .po-scope) .po-cal .ev-check input { width: 15px; height: 15px; flex: none; margin: 0; align-self: flex-start; transform: translateY(1.5px); }
.share-dlg .sh-content svg, .share-dlg .sh-content .ficon-ico, .share-dlg .sh-content .ficon { width: 16px; height: 16px; flex: none; }
.share-dlg .sh-content .ficon path { fill: color-mix(in srgb, var(--mc, var(--tint)) 26%, transparent); stroke: var(--mc, var(--tint)); stroke-width: 1.6; }

/* ============================================================
   1.17 — Paramètres › Compte : cartes (identité, stockage, pseudo)
   ============================================================ */
.acc-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
  padding: 16px 18px; max-width: 640px; margin: 2px 0 4px;
}
.acc-card.plus { border-color: color-mix(in srgb, #d9a441 45%, var(--border)); background: linear-gradient(180deg, color-mix(in srgb, #d9a441 6%, var(--surface)), var(--surface) 62%); }
.acc-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.acc-avatar {
  width: 52px; height: 52px; border-radius: 50%; flex: none;
  display: grid; place-items: center; font-size: 21px; font-weight: 600; color: #fff;
  background: linear-gradient(140deg, color-mix(in srgb, var(--tint) 82%, #fff), var(--tint));
  box-shadow: 0 2px 8px color-mix(in srgb, var(--tint) 28%, transparent);
}
.acc-card.plus .acc-avatar { background: linear-gradient(140deg, #f7a12b, #e8541d); box-shadow: 0 2px 8px rgba(232, 84, 29, .3); }
.acc-avatar.off { background: var(--ink-3); box-shadow: none; }
.acc-id { flex: 1; min-width: 160px; text-align: left; }
.acc-name { font-family: var(--font-serif); font-size: 18px; font-weight: 650; color: var(--ink); letter-spacing: -.01em; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.acc-mail { font-size: 12.5px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; }
.acc-btns { display: flex; gap: 8px; flex-wrap: wrap; flex: none; }
.acc-facts {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px;
  margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--border);
}
.acc-fact { min-width: 0; }
.acc-fact > span { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.acc-fact > b { display: block; font-size: 13px; font-weight: 600; color: var(--ink); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; }
.acc-dot { display: flex; align-items: center; gap: 6px; }
.acc-dot::before { content: ""; width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--ink-3); }
.acc-dot.ok::before { background: var(--ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 20%, transparent); }
.acc-dot.wait::before { background: var(--warn); }
.acc-dot.bad::before { background: var(--danger); }
.acc-pseudo .po-row { margin: 0 0 8px; max-width: 420px; }
:is(#popover, .po-scope) .acc-pseudo .po-row input { flex: 1; }
.set-body .acc-card .po-hint { max-width: none; }
/* stockage : titre, légende chiffrée, repères */
.po-stor-main { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.po-stor-main b { font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.po-stor-main > span { font-size: 12.5px; color: var(--ink-2); }
.po-stor-sub { margin-left: auto; font-size: 11.5px; color: var(--ink-3); }
.po-stor-bar { height: 10px; margin: 10px 0 8px; }
.po-stor-legend { gap: 6px 16px; font-size: 11.5px; }
.po-stor-legend span { display: inline-flex; align-items: center; gap: 4px; }
.po-stor-legend b { color: var(--ink); font-weight: 600; }
.po-stor-facts { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 10px; padding-top: 9px; border-top: 1px solid var(--border); font-size: 12px; color: var(--ink-3); }
.po-stor-facts b { color: var(--ink); font-weight: 650; }
@media (max-width: 640px) { .acc-btns { width: 100%; } .acc-btns .cta { flex: 1; justify-content: center; } .acc-facts { grid-template-columns: 1fr; } }

/* ============================================================
   1.17 — fichiers partagés (Alixo Share) : cartes et listes
   ============================================================ */
.file-card.shared-card { padding-right: 14px; }
.file-card.shared-card::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 3px;
  border-radius: var(--r) 0 0 var(--r); background: var(--mc, var(--tint)); opacity: .65;
}
.sh-filecard h3 { display: flex; align-items: center; gap: 8px; font-size: 14px; overflow-wrap: anywhere; }
.sh-filecard .file-ico { flex: none; }
/* fichiers dans l'arbre d'un dossier partagé (« Partagés avec moi ») */
.sh-tree [data-shfile] { display: flex; align-items: center; gap: 7px; width: 100%; text-align: left; padding: 4px 8px; border-radius: 7px; font-size: 13px; color: var(--ink-2); }
.sh-tree [data-shfile]:hover { background: var(--hover); color: var(--ink); }
.sh-tree [data-shfile] .file-ico { width: 18px; height: 22px; flex: none; }

/* ============================================================
   1.17 — Tableurs (js/sheets.js) : barre, ligne de formule, grille
   ============================================================ */
#view-sheet {
  position: fixed; inset: calc(var(--topbar-h) + var(--tabbar-h)) 0 0 0;
  display: grid; grid-template-rows: 46px 38px 1fr auto auto;
  background: var(--bg); min-width: 0;
}
.sh-bar { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 0 12px; background: var(--surface); border-bottom: 1px solid var(--border); overflow-x: auto; scrollbar-width: none; }
.sh-bar::-webkit-scrollbar { height: 0; display: none; }
.sh-barl, .sh-barr { display: flex; align-items: center; gap: 3px; flex: none; }
.sh-bar button { min-width: 30px; height: 30px; padding: 0 7px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 13px; color: var(--ink-2); }
.sh-bar button:hover { background: var(--hover); color: var(--ink); }
.sh-bar button.on { background: var(--tint-soft); color: var(--tint); }
.sh-bar button:disabled { opacity: .4; pointer-events: none; }
.sh-bar button svg { width: 16px; height: 16px; }
.sh-bar select { height: 30px; font: inherit; font-size: 12.5px; color: var(--ink); background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 0 8px; outline: none; max-width: 160px; }
.sh-sep { width: 1px; height: 22px; background: var(--border); margin: 0 6px; flex: none; }
.sh-barlabel { font-size: 12px; font-weight: 650; color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; margin-right: 6px; white-space: nowrap; }
.sh-ro { font-size: 12px; color: var(--ink-3); margin-left: 10px; }
.sh-swatch { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 4px; border: 1px solid rgba(128, 128, 128, .35); font-size: 10px; font-weight: 700; color: #fff; background: var(--ink); }
.sh-swatch.fill { background-image: linear-gradient(45deg, rgba(128,128,128,.18) 25%, transparent 25%, transparent 75%, rgba(128,128,128,.18) 75%); background-size: 8px 8px; }

/* ligne de formule */
.sh-fxrow { display: flex; align-items: center; gap: 0; background: var(--surface); border-bottom: 1px solid var(--border); padding: 0 12px; }
.sh-name { flex: none; width: 92px; font-family: var(--font-mono); font-size: 12.5px; font-weight: 600; color: var(--ink-2); padding: 0 8px; border-right: 1px solid var(--border); }
.sh-fxico { flex: none; height: 30px; font-family: var(--font-serif); font-style: italic; font-size: 14px; color: var(--ink-3); padding: 0 12px; border-right: 1px solid var(--border); border-radius: 0; }
.sh-fxico:hover, .sh-fxguide:hover { color: var(--tint); background: var(--hover); }
.sh-fxguide { flex: none; width: 26px; height: 22px; margin-left: 6px; border-radius: 6px; border: 1px solid var(--border); font-size: 12.5px; font-weight: 700; color: var(--ink-3); font-family: var(--font-ui); }
.sh-fx { flex: 1; min-width: 0; height: 30px; border: none; background: none; outline: none; font: inherit; font-size: 13px; color: var(--ink); padding: 0 12px; font-family: var(--font-mono); }
.sh-fx::placeholder { color: var(--ink-3); font-family: var(--font-ui); }

/* grille */
.sh-main { display: flex; min-height: 0; min-width: 0; position: relative; }
.sh-grid { flex: 1; min-width: 0; overflow: auto; outline: none; background: var(--paper); position: relative; }
.sh-grid::-webkit-scrollbar { width: 12px; height: 12px; }
.sh-grid::-webkit-scrollbar-track { background: var(--bg); }
.sh-grid::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--ink-3) 45%, transparent); border-radius: 999px; border: 3px solid transparent; background-clip: content-box; }
.sh-table { border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 13px; font-variant-numeric: tabular-nums; }
.sh-table th, .sh-table td { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 0; }
.sh-table thead th { position: sticky; top: 0; z-index: 3; height: 24px; background: var(--surface); color: var(--ink-3); font-size: 11px; font-weight: 600; letter-spacing: .04em; text-align: center; user-select: none; }
.sh-table thead th.on { background: var(--tint-soft); color: var(--tint); }
.sh-corner { position: sticky; left: 0; top: 0; z-index: 5 !important; width: 46px; min-width: 46px; background: var(--surface); cursor: pointer; }
.sh-rh { position: sticky; left: 0; z-index: 2; width: 46px; min-width: 46px; background: var(--surface); color: var(--ink-3); font-size: 11px; font-weight: 500; text-align: center; user-select: none; cursor: pointer; }
.sh-rh.on { background: var(--tint-soft); color: var(--tint); }
.sh-ch { cursor: pointer; position: relative; }
.sh-res { position: absolute; top: 0; right: -3px; width: 7px; height: 100%; cursor: col-resize; z-index: 4; }
.sh-resr { position: absolute; left: 0; bottom: -3px; width: 100%; height: 7px; cursor: row-resize; z-index: 4; }
.sh-c { padding: 2px 6px; overflow: hidden; white-space: nowrap; text-overflow: clip; color: var(--ink); cursor: cell; vertical-align: middle; }
.sh-c.w { white-space: normal; overflow-wrap: anywhere; }
.sh-c.b { font-weight: 700; }
.sh-c.i { font-style: italic; }
.sh-c.u { text-decoration: underline; }
.sh-c.al-left { text-align: left; }
.sh-c.al-center { text-align: center; }
.sh-c.al-right { text-align: right; }
.sh-c.err { color: var(--danger); font-weight: 600; }
.sh-c.sel { background: color-mix(in srgb, var(--tint) 11%, transparent); }
.sh-c.active { outline: 2px solid var(--tint); outline-offset: -2px; background: var(--paper); position: relative; z-index: 1; }
.sh-c.sel.active { background: var(--paper); }
.sh-c.frozr, .sh-c.frozc { background-image: linear-gradient(0deg, color-mix(in srgb, var(--tint) 4%, transparent), color-mix(in srgb, var(--tint) 4%, transparent)); }
.sh-edit { width: 100%; height: 100%; border: none; outline: none; background: var(--paper); font: inherit; font-size: 13px; color: var(--ink); padding: 2px 5px; font-family: var(--font-mono); }
body.readonly .sh-c { cursor: default; }

/* panneau latéral : graphique */
.sh-side { width: 320px; flex: none; border-left: 1px solid var(--border); background: var(--surface); overflow-y: auto; padding: 0 0 14px; }
.sh-sidehead { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid var(--border); font-size: 13px; }
.sh-sidex { width: 26px; height: 26px; border-radius: 6px; color: var(--ink-3); display: grid; place-items: center; }
.sh-sidex:hover { background: var(--hover); color: var(--ink); }
.sh-chartbox { padding: 12px 12px 6px; }
.sh-chartbox svg { width: 100%; height: auto; display: block; }
.sh-chartopts { display: flex; flex-wrap: wrap; gap: 5px; padding: 6px 12px 10px; }
.sh-chartopts button { font-size: 12px; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--border); color: var(--ink-2); background: var(--bg); }
.sh-chartopts button.on { background: var(--tint); border-color: var(--tint); color: #fff; }
.sh-side .po-hint { padding: 0 14px; }

/* onglets des feuilles + barre d'état */
.sh-tabs { display: flex; align-items: flex-end; gap: 2px; padding: 5px 12px 0; background: var(--bg); border-top: 1px solid var(--border); overflow-x: auto; scrollbar-width: none; }
.sh-tabs::-webkit-scrollbar { height: 0; display: none; }
.sh-tab { flex: none; max-width: 200px; padding: 5px 12px 6px; border-radius: 7px 7px 0 0; font-size: 12.5px; color: var(--ink-2); border: 1px solid transparent; border-bottom: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-tab:hover { background: var(--hover); color: var(--ink); }
.sh-tab.active { background: var(--surface); border-color: var(--border); color: var(--ink); font-weight: 600; }
.sh-tab.add { color: var(--ink-3); font-size: 15px; padding: 3px 10px 5px; }
.sh-status { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 6px 14px; background: var(--surface); border-top: 1px solid var(--border); font-size: 12px; color: var(--ink-2); min-height: 30px; }
.sh-status b { color: var(--ink); font-weight: 650; }
.sh-stdim { color: var(--ink-3); }
.sh-colors button.none { display: grid; place-items: center; color: var(--ink-3); font-size: 12px; border: 1px dashed var(--border); }

/* liste des fonctions (fenêtre « Insérer une fonction ») */
.sh-fnlist { display: flex; flex-direction: column; gap: 2px; max-height: 52vh; overflow-y: auto; }
.sh-fnlist button { display: grid; grid-template-columns: minmax(150px, 38%) 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: baseline; width: 100%; text-align: left; padding: 7px 10px; border-radius: 8px; }
.sh-fnlist button:hover { background: var(--hover); }
.sh-fnlist code { font-family: var(--font-mono); font-size: 12px; color: var(--tint); grid-row: 1 / 3; overflow-wrap: anywhere; }
.sh-fnlist span { font-size: 12px; color: var(--ink-2); }
.sh-fnlist small { font-size: 11px; color: var(--ink-3); font-family: var(--font-mono); }
.sh-fncat { font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); padding: 10px 10px 4px; }
.sh-fncat:first-child { padding-top: 2px; }

/* assistant de formules (1.18) : sous la cellule en cours de saisie */
.sh-fxhelp { position: absolute; z-index: 20; width: 400px; max-width: calc(100% - 24px); background: var(--surface); border: 1px solid var(--border); border-radius: 10px; box-shadow: 0 10px 28px rgba(0, 0, 0, .16); font-size: 12.5px; color: var(--ink-2); overflow: hidden; font-family: var(--font-ui); }
.sh-fxhelp .fh-sig { padding: 8px 12px; font-family: var(--font-mono); font-size: 12.5px; color: var(--ink); border-bottom: 1px solid var(--border); background: var(--bg); overflow-wrap: anywhere; }
.sh-fxhelp .fh-sig b { color: var(--tint); background: var(--tint-soft); border-radius: 4px; padding: 0 3px; }
.sh-fxhelp .fh-desc { padding: 8px 12px; line-height: 1.45; }
.sh-fxhelp .fh-desc code { font-family: var(--font-mono); font-size: 12px; color: var(--tint); }
.sh-fxhelp .fh-arg { display: block; margin-top: 3px; color: var(--ink-3); }
.sh-fxhelp .fh-arg b { color: var(--ink); }
.sh-fxhelp .fh-ex { margin-top: 4px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-3); }
.sh-fxhelp .fh-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.sh-fxhelp .fh-chips button { font-size: 11.5px; font-family: var(--font-mono); padding: 3px 8px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg); color: var(--tint); }
.sh-fxhelp .fh-chips button:hover { background: var(--tint-soft); }
.sh-fxhelp .fh-chips button[data-fnall], .sh-fxhelp .fh-chips button[data-fnguide] { font-family: var(--font-ui); color: var(--ink-2); }
.sh-fxhelp .fh-list { display: flex; flex-direction: column; padding: 4px 0; max-height: 240px; overflow-y: auto; }
.sh-fxhelp .fh-list button { display: flex; gap: 10px; width: 100%; text-align: left; padding: 6px 12px; align-items: baseline; }
.sh-fxhelp .fh-list button.on, .sh-fxhelp .fh-list button:hover { background: var(--tint-soft); }
.sh-fxhelp .fh-list code { font-family: var(--font-mono); font-size: 12.5px; color: var(--tint); flex: none; }
.sh-fxhelp .fh-list code small { color: var(--ink-3); font-size: 11px; }
.sh-fxhelp .fh-list span { color: var(--ink-3); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-fxhelp .fh-prev { padding: 7px 12px; border-top: 1px solid var(--border); font-family: var(--font-mono); font-size: 12.5px; color: var(--ink); background: var(--bg); overflow-wrap: anywhere; }
.sh-fxhelp .fh-prev.err { color: var(--danger); font-family: var(--font-ui); }
.sh-fxhelp .fh-keys { padding: 5px 12px 7px; font-size: 11px; color: var(--ink-3); border-top: 1px solid var(--border); }
.sh-fxhelp kbd { font: inherit; font-size: 10.5px; border: 1px solid var(--border); border-radius: 4px; padding: 0 4px; background: var(--surface); }
/* cellules citées par la formule en cours de saisie */
.sh-c.sh-ref0 { box-shadow: inset 0 0 0 2px #33658a; background-color: rgba(51, 101, 138, .12); }
.sh-c.sh-ref1 { box-shadow: inset 0 0 0 2px #c04343; background-color: rgba(192, 67, 67, .12); }
.sh-c.sh-ref2 { box-shadow: inset 0 0 0 2px #2f7d68; background-color: rgba(47, 125, 104, .12); }
.sh-c.sh-ref3 { box-shadow: inset 0 0 0 2px #b3762a; background-color: rgba(179, 118, 42, .14); }
.sh-c.sh-ref4 { box-shadow: inset 0 0 0 2px #7a5ca8; background-color: rgba(122, 92, 168, .12); }
.sh-c.sh-ref5 { box-shadow: inset 0 0 0 2px #2e8b8b; background-color: rgba(46, 139, 139, .12); }
.sh-sterr { color: var(--danger); }
.sh-sterr b { color: var(--danger); }
/* guide des formules */
.sh-guide section { margin-bottom: 16px; }
.sh-guide h4 { font-size: 13.5px; margin: 0 0 6px; color: var(--ink); }
.sh-guide p { font-size: 13px; line-height: 1.5; color: var(--ink-2); margin: 0 0 8px; }
.sh-guide code { font-family: var(--font-mono); font-size: 12px; color: var(--tint); background: var(--tint-soft); border-radius: 4px; padding: 0 4px; }
.sh-guide kbd { font: inherit; font-size: 11px; border: 1px solid var(--border); border-radius: 4px; padding: 0 5px; background: var(--bg); }
.sh-guide table { width: 100%; border-collapse: collapse; font-size: 12.5px; margin-bottom: 6px; }
.sh-guide td { padding: 4px 8px 4px 0; vertical-align: top; border-bottom: 1px solid var(--border); color: var(--ink-2); }
.sh-guide td:first-child { white-space: nowrap; width: 36%; }
.sh-guide td:first-child code { background: none; padding: 0; }

/* aperçu d'un tableur dans la bibliothèque */
.sheet-card .preview { padding: 0; }
.shprev { border: 1px solid var(--border); border-radius: 6px; overflow: hidden; background: var(--paper); }
.shprev table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 10.5px; font-variant-numeric: tabular-nums; }
.shprev td { border: 1px solid var(--border); padding: 2px 4px; height: 17px; color: var(--ink-2); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.shprev td.b { font-weight: 700; color: var(--ink); }

/* export PDF d'un tableur */
#sh-print { display: none; }
body.printing-sheet #sh-print { display: block; }
body.printing-sheet #topbar, body.printing-sheet #tabbar, body.printing-sheet #view-sheet,
body.printing-sheet #view-editor, body.printing-sheet #view-library, body.printing-sheet #toolbar,
body.printing-sheet #toast, body.printing-sheet #print-summary, body.printing-sheet #print-head { display: none !important; }
#sh-print .shp-sheet { page-break-after: always; padding: 0 0 14px; }
#sh-print .shp-sheet:last-child { page-break-after: auto; }
#sh-print h2 { font-family: var(--font-serif); font-size: 16px; margin: 0 0 10px; color: #1f2226; }
#sh-print table { width: 100%; border-collapse: collapse; font-size: 10.5px; font-variant-numeric: tabular-nums; }
#sh-print td { border: 1px solid #c9ccd1; padding: 3px 5px; color: #1f2226; }
@media print {
  body.printing-sheet #sh-print { display: block; }
}
@media (max-width: 900px) { .sh-side { display: none; } .sh-name { width: 70px; } }
/* champ de capture du clavier du tableur : invisible, toujours au même endroit */
.sh-capture { position: absolute; left: -9999px; top: 0; width: 1px; height: 1px; opacity: 0; border: none; padding: 0; }

/* ============================================================
   1.20 — bloc « Arbre »
   ============================================================ */
.block.tree { padding: 6px 0 4px; }
.tree-wrap { overflow-x: auto; padding: 4px 0 2px; }
.tr, .tr ul { display: flex; justify-content: center; align-items: flex-start; list-style: none; margin: 0; padding: 0; position: relative; }
.tr ul { padding-top: 18px; }
.tr ul::before { content: ""; position: absolute; top: 0; left: 50%; width: 2px; height: 18px; margin-left: -1px; background: var(--border); }
.tr li { position: relative; padding: 18px 6px 0; text-align: center; display: flex; flex-direction: column; align-items: center; }
.tr > li { padding-top: 0; }
.tr li::before, .tr li::after { content: ""; position: absolute; top: 0; right: 50%; width: 50%; height: 18px; border-top: 2px solid var(--border); }
.tr li::after { right: auto; left: 50%; border-left: 2px solid var(--border); }
.tr > li::before, .tr > li::after { display: none; }
.tr li:only-child::before, .tr li:only-child::after { border-top: 0; }
.tr li:only-child::after { border-left: 2px solid var(--border); }
.tr li:first-child::before { border: 0; }
.tr li:last-child::after { border-top: 0; }
.tr li:first-child::after { border-radius: 6px 0 0 0; }
.tr li:last-child::before { border-right: 2px solid var(--border); border-radius: 0 6px 0 0; }
.tr-node { position: relative; display: inline-block; min-width: 90px; max-width: 260px; padding: 6px 12px 7px; border: 1.5px solid color-mix(in srgb, var(--tint) 55%, var(--border)); border-radius: 9px; background: color-mix(in srgb, var(--tint) 5%, var(--paper)); font-family: var(--font-ui); font-size: 13px; line-height: 1.35; color: var(--ink); text-align: center; }
.tr-node.d0 { background: var(--tint); border-color: var(--tint); color: #fff; font-weight: 650; }
.tr-node.d0 .tr-t[data-ph]:has(> br:only-child)::before, .tr-node.d0 .tr-t:empty::before { color: rgba(255, 255, 255, .7); }
.tr-t { outline: none; min-height: 1.3em; white-space: normal; overflow-wrap: break-word; hyphens: manual; position: relative; cursor: text; }
.tr-t:has(> br:only-child)::before, .tr-t:empty::before { content: attr(data-ph); color: var(--ink-3); pointer-events: none; }
.tr-tools { position: absolute; left: 50%; top: 100%; transform: translateX(-50%); display: none; gap: 3px; padding: 3px; margin-top: 2px; white-space: nowrap; background: var(--surface); border: 1px solid var(--border); border-radius: 7px; box-shadow: 0 4px 12px rgba(0, 0, 0, .12); z-index: 5; }
.tr-node:hover .tr-tools, .tr-node:focus-within .tr-tools { display: inline-flex; }
.tr-tools button { font-size: 11px; padding: 2px 7px; border-radius: 5px; color: var(--ink-2); }
.tr-tools button:hover { background: var(--hover); color: var(--ink); }
.tr-tools button.danger:hover { color: var(--danger); }
.tree-tools { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 6px; font-family: var(--font-ui); }
.tree-hint { font-size: 11px; color: var(--ink-3); }
.tree-tools button { font-size: 11.5px; color: var(--ink-3); padding: 3px 8px; border-radius: 6px; opacity: 0; }
.block.tree:hover .tree-tools button, .block.tree:focus-within .tree-tools button { opacity: 1; }
.tree-tools button:hover { background: var(--hover); color: var(--danger); }
.block.tree.objsel { outline: 2px solid var(--tint); outline-offset: 2px; border-radius: 6px; }
@media print { .tr-tools, .tree-tools { display: none !important; } .tree-wrap { overflow: visible; } }