/* EFWeOS — BIBLIOTHÈQUE D'ÉLÉMENTS, version SITE (générée depuis admin/_biblio.src.css : ne pas modifier à la main).
 * Une seule bibliothèque pour l'admin et le site ; ici les éléments utiles au site public. Réglages : Style → Pages (php/site_style.php),
 * qui écrit les variables dans chaque page. Valeurs ci-dessous = « Standard du site », au cas où une page ne les écrirait pas. */
:root{--bg:#111111;--bg-2:#181818;--bg-3:color-mix(in srgb, #181818 93%, #f2f0eb);--efx-texte:#f2f0eb;--efx-texte-2:#a8a39a;--efx-texte-3:color-mix(in srgb, #a8a39a 75%, #111111);--efx-trait:rgba(184,154,114,0.22);--efx-trait-2:color-mix(in srgb, #f2f0eb 18%, transparent);--efx-survol:color-mix(in srgb, #f2f0eb 5%, transparent);--efx-trait-case:color-mix(in srgb, #f2f0eb 38%, transparent);--ui-or:#B89A72;--ui-or-h:color-mix(in srgb, #B89A72 82%, #fff);--accent:#B89A72;--ui-font:'Poppins', sans-serif;--efx-titre:'Playfair Display', Georgia, serif;--ui-gap:16px;--ui-pad:18px;--efx-l-gap:6px;--efx-l-bw:1px;--efx-l-r:var(--ui-r);--efx-l-bg:transparent;--efx-obj-pad:0px;--efx-med-r:50%;--ui-r:0px;--ui-r-carte:0px;--efx-bt-bg:var(--ui-or);--efx-bt-c:#111;--efx-bt-bd:var(--ui-or);--efx-bt-r:var(--ui-r);--efx-bt-tt:uppercase;--efx-bt-ls:.1em;--efx-bt-fs:12px;--efx-bt-pad:10px 20px;--efx-sur-ls:.2em;--efx-sur-fw:500;--efx-sur-fs:12px;--efx-sep-w:60px;--efx-sep-h:1px;--efx-sep-bg:var(--ui-or);--efx-carte-bg:transparent;--efx-carte-bd:var(--efx-trait-2);--efx-carte-ombre:none;--efx-carte-flou:none;--efx-ph-r:0px;--efx-in-bw:1px;--efx-in-r:var(--ui-r);--efx-in-bg:rgba(0,0,0,.22);--efx-in-px:12px;--efx-in-focus:none;--efx-tag-r:999px;--efx-tag-bg:14%;--efx-tag-bd:0px;--efx-case-r:min(var(--ui-r), 5px);--efx-choix-bg:rgba(0,0,0,.25);--efx-choix-bd:1px;--efx-choix-pad:3px;--efx-choix-gap:2px;--efx-choix-it-bd:0px;--efx-choix-on-bg:var(--ui-or);--efx-choix-on-c:#141414;--efx-choix-on-bd:var(--ui-or);}
html:root:not(#efx) body .efx-pli { border: 1px solid var(--efx-trait); border-radius: var(--ui-r-carte, 8px); background: var(--bg-2); margin: 0 0 var(--ui-gap, 12px); }
html:root:not(#efx) body .efx-pli > summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 14px 18px; cursor: pointer; font: 600 14px var(--ui-font); color: var(--efx-texte); }
html:root:not(#efx) body .efx-pli > summary::-webkit-details-marker { display: none; }
html:root:not(#efx) body .efx-pli > summary::after { content: ''; margin-left: auto; width: 8px; height: 8px; border: solid var(--efx-texte-2); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg) translateY(-2px); transition: transform .2s; }
html:root:not(#efx) body .efx-pli[open] > summary::after { transform: rotate(225deg) translateY(-2px); }
html:root:not(#efx) body .efx-pli > summary small { font-weight: 400; color: var(--efx-texte-3); font-size: 12.5px; }
html:root:not(#efx) body .efx-pli > summary:hover { background: var(--efx-survol); }
html:root:not(#efx) body .efx-choix { display: inline-flex; flex-wrap: wrap; gap: var(--efx-choix-gap); padding: var(--efx-choix-pad); background: var(--efx-choix-bg); border: var(--efx-choix-bd) solid var(--efx-trait); border-radius: calc(var(--ui-r, 4px) * 1.75); }
html:root:not(#efx) body .efx-choix > :is(a, button, label) { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 32px; padding: 0 12px; border: var(--efx-choix-it-bd) solid var(--efx-trait-2); border-radius: var(--ui-r, 4px); background: none; color: var(--efx-texte-2); font: 500 13px var(--ui-font); white-space: nowrap; text-decoration: none; cursor: pointer; transition: background .15s, color .15s; }
html:root:not(#efx) body .efx-choix > :is(a, button, label) input { position: absolute; opacity: 0; pointer-events: none; }
html:root:not(#efx) body .efx-choix > :is(a, button, label):hover { color: var(--efx-texte); background: var(--efx-survol); }
html:root:not(#efx) body .efx-choix > :is(.on, :has(input:checked)), html:root:not(#efx) body .efx-choix > :is(.on, :has(input:checked)):hover { background: var(--efx-choix-on-bg); color: var(--efx-choix-on-c); border-color: var(--efx-choix-on-bd); }
html:root:not(#efx) body .efx-choix > :is(a, button, label):focus-visible, html:root:not(#efx) body .efx-choix > label:has(input:focus-visible) { outline: 2px solid var(--ui-or); outline-offset: 1px; }
html:root:not(#efx) body .efx-choix svg { width: 15px; height: 15px; }
html:root:not(#efx) body .efx-choix.plein { display: flex; flex-wrap: nowrap; } html:root:not(#efx) body .efx-choix.plein > * { flex: 1 1 auto; min-width: 0; white-space: normal; text-align: center; line-height: 1.25; padding-top: 6px; padding-bottom: 6px; }
html:root:not(#efx) body .efx-menu { position: relative; display: inline-block; }
html:root:not(#efx) body .efx-menu > summary { list-style: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(17,17,17,.72); color: #fff; font: 700 16px/1 var(--ui-font); cursor: pointer; border: 1px solid transparent; }
html:root:not(#efx) body .efx-menu > summary::-webkit-details-marker { display: none; }
html:root:not(#efx) body .efx-menu > summary:hover, html:root:not(#efx) body .efx-menu[open] > summary { border-color: var(--efx-trait-2); }
html:root:not(#efx) body .efx-menu > div { position: absolute; right: 0; top: 40px; z-index: 20; min-width: 210px; padding: 6px; background: var(--bg-3, #222); border: 1px solid var(--efx-trait-2); border-radius: var(--ui-r-carte, 8px); box-shadow: 0 14px 34px rgba(0,0,0,.5); display: flex; flex-direction: column; }
html:root:not(#efx) body .efx-menu > div :is(a, button) { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 12px; border: 0; border-radius: var(--ui-r, 4px); background: none; color: var(--efx-texte); font: 400 13px var(--ui-font); text-align: left; text-decoration: none; cursor: pointer; }
html:root:not(#efx) body .efx-menu > div :is(a, button):hover { background: color-mix(in srgb, var(--ui-or) 15%, transparent); }
html:root:not(#efx) body .efx-menu > div .danger { color: var(--ui-rouge, #e8958a); }
html:root:not(#efx) body .efx-menu > div hr { border: 0; border-top: 1px solid var(--efx-trait); margin: 5px 4px; }
html:root:not(#efx) body .efx-menu > div .off { color: var(--efx-texte-3); font-size: 12px; padding: 8px 12px; }
html:root:not(#efx) body .efx-menu.gauche > div { right: auto; left: 0; }
html:root:not(#efx) body .efx-f { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px; }
html:root:not(#efx) body .efx-f > label, html:root:not(#efx) body .efx-f > .efx-f-l { font: 500 13px var(--ui-font); color: var(--efx-texte); }
html:root:not(#efx) body .efx-f > small, html:root:not(#efx) body .efx-reg small { display: block; font-size: 12px; line-height: 1.5; color: var(--efx-texte-3); }
html:root:not(#efx) body .efx-cl { display: inline-flex; align-items: center; gap: 9px; font: 400 13.5px var(--ui-font); color: var(--efx-texte); cursor: pointer; }
html:root:not(#efx) body .efx-tag { --e: var(--efx-texte-2); display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: var(--efx-tag-r); border: var(--efx-tag-bd) solid color-mix(in srgb, var(--e) 55%, transparent); background: color-mix(in srgb, var(--e) var(--efx-tag-bg), transparent); color: color-mix(in srgb, var(--e) 70%, var(--efx-texte)); font: 500 12px/1.6 var(--ui-font); white-space: nowrap; text-decoration: none; }
html:root:not(#efx) body .efx-tag.p::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--e); flex: none; }
html:root:not(#efx) body .efx-tag.or { --e: var(--ui-or); } html:root:not(#efx) body .efx-tag.ok { --e: #8fd19e; } html:root:not(#efx) body .efx-tag.todo { --e: #f0a75a; } html:root:not(#efx) body .efx-tag.info { --e: #8ab8ea; } html:root:not(#efx) body .efx-tag.rouge { --e: #e8958a; } html:root:not(#efx) body .efx-tag.off { --e: #8a857d; }
html:root:not(#efx) body .efx-tag.maj { text-transform: uppercase; letter-spacing: .1em; font-size: 10.5px; }
html:root:not(#efx) body .efx-tags { display: flex; flex-wrap: wrap; gap: 6px; }
html:root:not(#efx) body .efx-nbs { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--ui-gap, 12px); margin: 0 0 var(--ui-gap, 12px); }
html:root:not(#efx) body .efx-nb { padding: 14px 16px; background: var(--bg-2); border: 1px solid var(--efx-trait); border-radius: var(--ui-r-carte, 8px); font-family: var(--ui-font); }
html:root:not(#efx) body .efx-nb b { display: block; font: 600 26px/1.15 var(--ui-font); color: var(--efx-texte); }
html:root:not(#efx) body .efx-nb span { display: block; margin-top: 4px; font-size: 12px; color: var(--efx-texte-3); }
html:root:not(#efx) body .efx-nb.or b { color: var(--ui-or); }
html:root:not(#efx) body .efx-objs { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--ui-gap, 12px); margin: 0 0 var(--ui-gap, 12px); }
html:root:not(#efx) body .efx-obj { position: relative; display: flex; flex-direction: column; background: var(--bg-2); border: 1px solid var(--efx-trait); border-radius: var(--ui-r-carte, 8px); color: var(--efx-texte); font-family: var(--ui-font); text-decoration: none; transition: border-color .15s, transform .15s; }
html:root:not(#efx) body .efx-obj:hover { border-color: color-mix(in srgb, var(--ui-or) 45%, transparent); }
html:root:not(#efx) body .efx-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--efx-l-gap); }
html:root:not(#efx) body .efx-liste > li { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 12px; background: var(--efx-l-bg); border: 0 solid var(--efx-trait); border-width: var(--efx-l-bw); border-radius: var(--efx-l-r); font: 400 13.5px var(--ui-font); color: var(--efx-texte); }
html:root:not(#efx) body .efx-liste > li:hover { background: var(--efx-survol); }
html:root:not(#efx) body .efx-liste > li.off { opacity: .55; }
html:root:not(#efx) body .efx-liste .efx-poignee { cursor: grab; color: var(--efx-texte-3); font-size: 15px; letter-spacing: -2px; user-select: none; }
html:root:not(#efx) body .efx-med { --s: 40px; flex: none; display: inline-grid; place-items: center; width: var(--s); height: var(--s); overflow: hidden; border-radius: var(--efx-med-r); background: #1d1c1a; border: 1px solid var(--efx-trait); color: var(--ui-or); font: 400 calc(var(--s) * .4) 'Cormorant Garamond', 'Playfair Display', Georgia, serif; }
html:root:not(#efx) body .efx-med img { width: 100%; height: 100%; object-fit: cover; }
html:root:not(#efx) body .efx-msg { --e: #8ab8ea; display: flex; align-items: flex-start; gap: 12px; margin: 0 0 var(--ui-gap, 12px); padding: 12px 16px; background: var(--bg-2); border: 1px solid var(--efx-trait); border-left: 3px solid var(--e); border-radius: var(--ui-r-carte, 8px); font: 400 13.5px/1.55 var(--ui-font); color: var(--efx-texte-2); }
html:root:not(#efx) body .efx-msg > i { flex: none; font-style: normal; color: var(--e); font-weight: 600; }
html:root:not(#efx) body .efx-msg b { color: var(--efx-texte); font-weight: 500; }
html:root:not(#efx) body .efx-msg.ok { --e: #8fd19e; } html:root:not(#efx) body .efx-msg.attention { --e: #f0a75a; } html:root:not(#efx) body .efx-msg.erreur { --e: #e8958a; }
html:root:not(#efx) body .efx-vide { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 28px 20px; text-align: center; border: 1px dashed var(--efx-trait-2); border-radius: var(--ui-r-carte, 8px); color: var(--efx-texte-3); font: 400 13.5px/1.6 var(--ui-font); }
html:root:not(#efx) body .efx-vide b { color: var(--efx-texte-2); font-weight: 500; }
html:root:not(#efx) body .efx-fen { position: fixed; inset: 0; z-index: 900; display: flex; padding: 24px 16px; overflow-y: auto; background: rgba(0,0,0,.62); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
html:root:not(#efx) body .efx-fen[hidden] { display: none; }
html:root:not(#efx) body .efx-x { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid var(--efx-trait-2); border-radius: 50%; background: none; color: var(--efx-texte); font-size: 15px; cursor: pointer; }
html:root:not(#efx) body .efx-x:hover { border-color: var(--ui-or); }
html:root:not(#efx) body .efx-prog { display: block; height: 8px; overflow: hidden; border-radius: min(var(--ui-r, 4px), 4px); background: rgba(242,240,235,.08); }
html:root:not(#efx) body .efx-prog > i { display: block; height: 100%; width: var(--p, 0%); background: var(--ui-or); border-radius: inherit; transition: width .3s; }
html:root:not(#efx) body .efx-prog.ok > i { background: #8fd19e; }
html:root:not(#efx) body .efx-etapes { counter-reset: efx-e; list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
html:root:not(#efx) body .efx-etapes > li { counter-increment: efx-e; display: flex; gap: 12px; align-items: flex-start; font: 400 13.5px/1.55 var(--ui-font); color: var(--efx-texte-2); }
html:root:not(#efx) body .efx-etapes > li::before { content: counter(efx-e); flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--ui-or); color: var(--ui-or); font-size: 12px; }
html:root:not(#efx) body .efx-etapes > li.fait::before { content: '✓'; background: var(--ui-or); color: #141414; }
html:root:not(#efx) body .efx-pli.nu { border: 0; background: none; margin: 4px 0; }
html:root:not(#efx) body .efx-pli.nu > summary { padding: 8px 0; font-weight: 500; }
html:root:not(#efx) body .efx-pli.nu > summary:hover { background: none; color: var(--ui-or); }
html:root:not(#efx) body .efx-pli.nu > summary::after { margin-left: 10px; }
html:root:not(#efx) body .efx-pli.nu .efx-pli-c, html:root:not(#efx) body .efx-pli.nu > :not(summary) { padding-left: 0; }
/* ====================================================================================================
 * 1.0.231 — ÉLÉMENTS DU SITE PUBLIC (bibliothèque unique, réglages « Style → Pages », php/site_style.php).
 * Même source, même préfixe ; ces éléments sont aussi dans admin/_biblio.css (aperçus de l'admin) et dans assets/css/ef-biblio.css
 * (fichier du site, avec les éléments partagés : étiquettes, messages, fenêtres, zones qui se déplient, chiffres, étapes, champs,
 * cases, choix, menus, listes, zones vides, cartes d'objet, médaillons).
 * Variables propres au site : --efx-titre (police des titres), --efx-bt-* (boutons), --efx-sur-* (sur-titres), --efx-sep-* (séparateurs),
 * --efx-carte-* (cartes), --efx-ph-r (photos). Les autres (--ui-r, --ui-or, --bg…, --efx-in-*, --efx-tag-*…) sont celles de l'admin.
 */
html:root:not(#efx) body .efx-site { background: var(--bg); color: var(--efx-texte-2); font: 400 15px/1.7 var(--ui-font); }
html:root:not(#efx) body .efx-titre { margin: 0 0 .45em; font-family: var(--efx-titre) !important; font-weight: 400 !important; line-height: 1.2; letter-spacing: 0; color: var(--efx-texte); }
html:root:not(#efx) body h1.efx-titre { font-size: clamp(34px, 5vw, 64px); }
html:root:not(#efx) body h2.efx-titre { font-size: clamp(26px, 3.4vw, 40px); }
html:root:not(#efx) body h3.efx-titre { font-size: 22px; }
html:root:not(#efx) body .efx-sur { display: block; margin: 0 0 14px; font-family: var(--ui-font); font-size: var(--efx-sur-fs); font-weight: var(--efx-sur-fw); line-height: 1.5; letter-spacing: var(--efx-sur-ls); text-transform: uppercase; color: var(--ui-or); }
html:root:not(#efx) body .efx-sep { display: block; width: var(--efx-sep-w); max-width: 100%; height: var(--efx-sep-h); margin: 22px 0; border: 0; background: var(--efx-sep-bg); }
html:root:not(#efx) body .efx-sect { margin: 0 0 34px; }
html:root:not(#efx) body .efx-sect.centre { text-align: center; }
html:root:not(#efx) body .efx-sect.centre .efx-sep { margin-left: auto; margin-right: auto; }
html:root:not(#efx) body .efx-texte { margin: 0 0 1em; font: 400 15px/1.8 var(--ui-font); color: var(--efx-texte-2); }
html:root:not(#efx) body .efx-bt { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; box-sizing: border-box; padding: var(--efx-bt-pad); border: 2px solid var(--efx-bt-bd); border-radius: var(--efx-bt-r); background: var(--efx-bt-bg); color: var(--efx-bt-c); font: 500 var(--efx-bt-fs)/1.4 var(--ui-font); letter-spacing: var(--efx-bt-ls); text-transform: var(--efx-bt-tt); text-decoration: none; cursor: pointer; transition: filter .2s, background-color .2s, color .2s, border-color .2s; }
html:root:not(#efx) body .efx-bt:hover { filter: brightness(1.08); color: var(--efx-bt-c); }
html:root:not(#efx) body .efx-bt:focus-visible, html:root:not(#efx) body .efx-lien:focus-visible, html:root:not(#efx) body .efx-rond:focus-visible { outline: 2px solid var(--ui-or); outline-offset: 3px; }
html:root:not(#efx) body .efx-bt.plein { --efx-bt-bg: var(--ui-or); --efx-bt-c: #111; --efx-bt-bd: var(--ui-or); }
html:root:not(#efx) body .efx-bt.contour { --efx-bt-bg: transparent; --efx-bt-c: var(--efx-texte); --efx-bt-bd: var(--efx-texte); }
html:root:not(#efx) body .efx-bt.contour:hover { --efx-bt-c: var(--ui-or); --efx-bt-bd: var(--ui-or); filter: none; }
html:root:not(#efx) body .efx-bt.clair { --efx-bt-bg: #FAF8F5; --efx-bt-c: #2b2622; --efx-bt-bd: #FAF8F5; }
html:root:not(#efx) body .efx-bt.arrondi, html:root:not(#efx) body .efx-bt.arrondi-contour { --efx-bt-r: 30px; --efx-bt-tt: none; --efx-bt-ls: .02em; --efx-bt-fs: 14px; --efx-bt-pad: 11px 28px; }
html:root:not(#efx) body .efx-bt.arrondi { --efx-bt-bg: var(--ui-or); --efx-bt-c: #fff; --efx-bt-bd: var(--ui-or); }
html:root:not(#efx) body .efx-bt.arrondi-contour { --efx-bt-bg: transparent; --efx-bt-c: var(--efx-texte); --efx-bt-bd: var(--efx-texte); }
html:root:not(#efx) body .efx-lien { display: inline-flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid currentColor; color: var(--ui-or); font: 500 12px/1.4 var(--ui-font); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; }
html:root:not(#efx) body .efx-lien::after { content: '→'; letter-spacing: 0; transition: transform .2s; }
html:root:not(#efx) body .efx-lien:hover { color: var(--ui-or-h, var(--ui-or)); }
html:root:not(#efx) body .efx-lien:hover::after { transform: translateX(3px); }
html:root:not(#efx) body .efx-rond { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--efx-trait-2); border-radius: 50%; background: color-mix(in srgb, var(--bg) 70%, transparent); color: var(--efx-texte); font: 400 18px/1 var(--ui-font); cursor: pointer; transition: border-color .2s, color .2s; }
html:root:not(#efx) body .efx-rond:hover { border-color: var(--ui-or); color: var(--ui-or); }
html:root:not(#efx) body .efx-rond svg { width: 18px; height: 18px; }
html:root:not(#efx) body .efx-carte { box-sizing: border-box; padding: 26px; border: 1px solid var(--efx-carte-bd); border-radius: var(--ui-r-carte); background: var(--efx-carte-bg); box-shadow: var(--efx-carte-ombre); -webkit-backdrop-filter: var(--efx-carte-flou); backdrop-filter: var(--efx-carte-flou); color: var(--efx-texte-2); }
html:root:not(#efx) body .efx-carte > :last-child { margin-bottom: 0; }
html:root:not(#efx) body .efx-carte .efx-titre { margin-bottom: .35em; }
html:root:not(#efx) body .efx-faq { border-top: 1px solid var(--efx-trait-2); }
html:root:not(#efx) body .efx-faq > details { border-bottom: 1px solid var(--efx-trait-2); }
html:root:not(#efx) body .efx-faq summary { display: flex; align-items: center; gap: 14px; padding: 18px 2px; list-style: none; cursor: pointer; font: 500 15px/1.5 var(--ui-font); color: var(--efx-texte); }
html:root:not(#efx) body .efx-faq summary::-webkit-details-marker { display: none; }
html:root:not(#efx) body .efx-faq summary::after { content: ''; flex: none; margin-left: auto; width: 9px; height: 9px; border: solid var(--ui-or); border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-3px); transition: transform .25s; }
html:root:not(#efx) body .efx-faq details[open] summary::after { transform: rotate(225deg) translateY(-1px); }
html:root:not(#efx) body .efx-faq details > :not(summary) { padding: 0 2px 18px; }
html:root:not(#efx) body .efx-grille { display: grid; grid-template-columns: repeat(var(--efx-g-col, 3), minmax(0, 1fr)); gap: var(--efx-g-gap, 10px); }
html:root:not(#efx) body .efx-grille img, html:root:not(#efx) body .efx-ph { display: block; width: 100%; height: auto; border-radius: var(--efx-ph-r); }
