:root{color-scheme:light;--fond:#fff;--cote:#f9f9f9;--carte:#fff;--texte:#0d0d0d;--doux:#6b6b6b;--second:#424242;--trait:#e8e8e8;
--bulle:#f2f2f2;--survol:#ececec;--accent:#0055a4;--accent-fond:#e8f0fa;--rouge:#ef4135;--rouge-texte:#c2321f;--bleu:#0055a4;--marine:#0b1f44;--bleu-fonce:#00438a;--champ:#8f8f8f;
--ombre:0 1px 3px rgba(0,0,0,.06),0 8px 24px rgba(0,0,0,.06);--sur-accent:#fff;
--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;--courbe:cubic-bezier(.22,1,.36,1);
--police:ui-sans-serif,-apple-system,system-ui,"Segoe UI","Noto Sans","Noto Sans Arabic","Noto Sans JP","PingFang SC",sans-serif}
*{box-sizing:border-box}[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;background:var(--fond);color:var(--texte);font:15px/1.6 var(--police);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}
.logo{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--marine);font-weight:600;font-size:17px;letter-spacing:-.01em}
.logo b{color:var(--bleu);font-weight:600}.logo.grand{font-size:26px;gap:12px}
.bouton{background:var(--bleu);color:#fff;border:0;border-radius:10px;padding:10px 18px;font-weight:500;font-size:14px;cursor:pointer;transition:background-color .15s,transform .12s var(--courbe)}
.bouton:active{transform:scale(.98)}.bouton.gris{background:var(--bulle);color:var(--texte)}.bouton.large{width:100%}
:focus-visible{outline:2px solid var(--bleu);outline-offset:2px}
.lien{background:none;border:0;color:var(--doux);cursor:pointer;text-decoration:underline;padding:0}
.icone{background:none;border:0;border-radius:8px;width:36px;height:36px;display:grid;place-items:center;cursor:pointer;color:var(--second)}
.icone:hover{background:var(--survol)}
.erreur{color:#c2321f;min-height:1.5em;margin:12px 0 0;font-size:14px}

/* Connexion */
.accueil{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px 16px}
.accroche{margin:0 0 8px;color:var(--second);font-size:17px;text-align:center}
.carte-connexion{width:100%;max-width:380px}
.onglets{display:flex;gap:4px;background:var(--bulle);border-radius:12px;padding:4px;margin-bottom:20px}
.onglets button{flex:1;border:0;background:none;border-radius:8px;padding:8px;font-weight:500;font-size:14px;color:var(--doux);cursor:pointer}
.onglets button.actif{background:#fff;color:var(--texte);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.carte-connexion label{display:block;margin-bottom:12px;font-size:14px;color:var(--second)}
.carte-connexion input{display:block;width:100%;margin-top:4px;padding:12px 14px;border:1px solid var(--champ);border-radius:12px;background:#fff;font-size:15px}
.carte-connexion input:focus{border-color:var(--bleu);outline:0;box-shadow:0 0 0 3px var(--accent-fond)}
.carte-connexion .bouton{width:100%;margin-top:8px;padding:13px}
.invitation{background:var(--accent-fond);border-radius:12px;padding:10px 12px;margin:0 0 16px;font-size:13px;color:var(--marine)}
.note-ext{background:var(--accent-fond);border-radius:12px;padding:10px 12px;margin:0 0 16px;font-size:14px}
.choix-langue{border:1px solid var(--champ);border-radius:10px;padding:6px 12px;background:#fff;font-size:13px;color:var(--second)}

/* Espace */
.espace{display:grid;grid-template-columns:268px 1fr;height:100vh}
.cote{background:var(--cote);display:flex;flex-direction:column;gap:2px;padding:16px 12px 12px;min-height:0;border-inline-end:1px solid #f0f0f0}
.cote-haut{display:flex;align-items:center;justify-content:space-between;padding:4px 8px 12px}
.cote-haut .icone{display:none}
.entree{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;border-radius:8px;padding:8px 10px;min-height:36px;font-size:14px;cursor:pointer;text-align:start}
.entree:hover,.entree.actif{background:var(--survol)}
.entree em{margin-inline-start:auto;font:12px/16px var(--mono);font-style:normal;color:#c2321f}
.section{margin-top:24px;min-height:0;display:flex;flex-direction:column}.section.remplit{flex:1}
.section h2{font-size:12px;font-weight:500;color:var(--doux);margin:0 0 8px;padding:0 10px}
.liste{list-style:none;margin:0;padding:0;overflow-y:auto}
.liste li{display:flex;gap:8px;align-items:center;padding:8px 10px;border-radius:8px;font-size:14px;cursor:pointer;min-height:36px}
.liste li:hover,.liste li.actif{background:var(--survol)}
.liste .txt{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.liste .date{color:var(--doux);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
.liste .date.urgent{color:#c2321f;font-weight:500}
.point{width:7px;height:7px;border-radius:50%;flex:none;background:#c4c4c4}
.point.terminee{background:#1a7f4b}.point.en_cours{background:#d08a1c}.point.erreur,.point.interrompue{background:var(--rouge)}
.cote-bas{position:relative;border-top:1px solid var(--trait);padding-top:8px;margin-top:8px}
.moi{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;border-radius:10px;padding:8px;cursor:pointer;text-align:start}
.moi:hover{background:var(--survol)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--marine);color:#fff;display:grid;place-items:center;font-weight:600;font-size:13px;flex:none}
.moi-txt{display:flex;flex-direction:column;min-width:0;line-height:1.3}.moi-txt b{font-weight:500;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.moi-txt small{color:var(--doux);font-size:12px}
.menu{position:absolute;bottom:56px;inset-inline:0;background:#fff;border:1px solid var(--trait);border-radius:16px;box-shadow:var(--ombre);padding:6px;display:flex;flex-direction:column;gap:2px;z-index:20}
.menu>button{border:0;background:none;text-align:start;padding:9px 10px;border-radius:10px;cursor:pointer;font-size:14px}.menu>button:hover{background:var(--survol)}
.menu-langue{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;font-size:14px}
.menu-langue select{border:1px solid var(--champ);border-radius:8px;padding:4px 6px;background:#fff;font-size:13px}
.menu-email{font-size:12px;color:var(--doux);padding:6px 10px 2px;overflow:hidden;text-overflow:ellipsis}
.mails{display:flex;flex-direction:column;gap:4px;padding:8px 10px;font-size:13px;color:var(--doux)}
.mails strong{font-weight:500;color:var(--texte);font-size:14px}
#mails-liste{display:flex;flex-direction:column;gap:6px}#mails-liste:empty{display:none}
#mails-liste a.bouton{display:block;text-align:center;text-decoration:none;padding:7px 12px;font-size:13px}
.mail-boite{display:flex;align-items:center;gap:8px;color:var(--texte)}.mail-boite span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.abonne{display:flex;gap:8px;align-items:center;padding:4px 10px;font-size:13px;color:var(--second)}.abonne span{flex:1}
.offre{display:flex;flex-direction:column;gap:2px;padding:12px;border-radius:14px;background:#fff;border:1px solid var(--trait);margin:0 0 8px;font-size:13px;color:var(--doux)}
.offre strong{font-weight:500;color:var(--texte);font-size:14px}.offre .bouton{margin-top:8px}

.centre{display:flex;flex-direction:column;min-width:0;height:100vh}
.barre{display:flex;align-items:center;gap:8px;height:56px;padding:0 16px;flex:none}
.barre #ouvrir-cote{display:none}
#titre-tache{flex:1;font-weight:500;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--second)}
.pastille{font-size:12px;padding:4px 10px;border-radius:999px;background:var(--bulle);color:var(--doux);white-space:nowrap}
.pastille.ok{background:#e7f5ec;color:#1a7f4b}.pastille a{color:inherit}
.vue-chat{flex:1;display:flex;flex-direction:column;min-height:0}
.zone{flex:1;display:flex;min-height:0}
.fil{flex:1;overflow-y:auto;padding:16px 16px 24px;display:flex;flex-direction:column;gap:14px}
.fil>*{width:100%;max-width:760px;margin-inline:auto}
.ecran{width:40%;max-width:540px;margin:0;padding:16px 16px 16px 0;display:flex;flex-direction:column;gap:8px}
.ecran img{width:100%;border:1px solid var(--trait);border-radius:12px;box-shadow:var(--ombre)}
.ecran figcaption{font-size:12px;color:var(--doux)}
.msg{white-space:pre-wrap;word-wrap:break-word}
/* Mode invité : questions sans compte ; la connexion vient quand il faut agir */
.invite-seul{display:none}.espace.invite .invite-seul{display:block}
.espace.invite :is(#voir-plan,#voir-docs,.section,#offre,#ouvrir-menu,#menu,#pastille){display:none!important}
.actions-invite{display:flex;flex-wrap:wrap;gap:8px;padding-inline-start:42px}
.actions-invite .bouton{width:auto}
.msg.lui a{color:var(--bleu)}
.msg.moi{display:flex;justify-content:flex-end}
.msg.moi>span{background:var(--bulle);border-radius:20px;padding:10px 16px;max-width:75%}
.msg.lui{display:grid;grid-template-columns:28px 1fr;gap:14px;align-items:start}
.msg.lui::before{content:"";width:28px;height:28px;border-radius:50%;background:#fff url(/app/logo.svg) center/20px no-repeat;border:1px solid var(--trait)}
.msg.etape{color:var(--doux);font-size:13px;padding-inline-start:42px;display:flex;gap:8px;align-items:center}
.msg.etape::before{content:"";width:5px;height:5px;border-radius:50%;background:#c4c4c4;flex:none}
.msg.parole{padding-inline-start:42px;font-size:14px}.msg.parole>span{display:block;border-inline-start:2px solid var(--bleu);padding:2px 12px}
.msg.parole.organisme>span{border-color:#c4c4c4;color:var(--second)}
.msg.question>span{display:block;margin-inline-start:42px;background:#fff;border:1px solid var(--trait);border-inline-start:3px solid var(--bleu);border-radius:12px;padding:12px 14px}
.msg.erreur{color:#c2321f;padding-inline-start:42px;font-size:14px}
.msg img{display:block;max-width:260px;border-radius:10px;margin-top:8px;border:1px solid var(--trait);cursor:zoom-in}
.vide{margin:auto 0;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding-bottom:4vh}
.vide h1{font-size:28px;font-weight:500;letter-spacing:-.02em;margin:0;color:var(--texte)}
.vide p{margin:0 0 10px;color:var(--doux);font-size:14px;max-width:520px}
.suggestions{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;margin-top:18px}
.suggestions button{border:1px solid var(--trait);background:#fff;border-radius:14px;padding:12px 14px;font-size:14px;cursor:pointer;text-align:start;color:var(--second);transition:background-color .15s}
.suggestions button:hover{background:var(--cote)}
.suggestions button small{display:block;color:var(--doux);font-size:12px;margin-top:2px}
.suggestions button.urgent small{color:#c2321f}
.pied{padding:0 16px 10px;flex:none}
.question{display:flex;gap:8px;max-width:760px;margin:0 auto 10px}
.saisie{max-width:760px;margin:0 auto;display:flex;align-items:flex-end;gap:8px;background:#fff;border:1px solid var(--champ);border-radius:18px;padding:10px 10px 10px 20px;box-shadow:0 2px 12px rgba(0,0,0,.05)}
[dir=rtl] .saisie{padding:10px 20px 10px 10px}
.saisie:focus-within{border-color:var(--bleu);box-shadow:0 2px 16px rgba(0,0,0,.08)}
.saisie textarea{flex:1;resize:none;border:0;outline:0;padding:7px 0;background:none;font-size:16px;line-height:1.5;max-height:200px}
.rond{width:36px;height:36px;border-radius:10px;border:0;background:var(--bleu);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none;transition:opacity .15s}
.rond:disabled{opacity:.25;cursor:default}.rond.gris{background:var(--bulle);color:var(--texte)}.rond svg{stroke-width:2.2}
#arreter svg{fill:currentColor;stroke:none}
.avertissement{text-align:center;font-size:12px;color:var(--doux);margin:8px 0 0}

/* Mes démarches */
.vue-plan{flex:1;overflow-y:auto;padding:8px 16px 48px}
.plan{max-width:760px;margin:0 auto}
.plan h1{font-size:28px;font-weight:500;letter-spacing:-.02em;margin:12px 0 4px}
.plan-intro{color:var(--doux);margin:0 0 20px}
.form-echeance{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap}
.form-echeance input{flex:1;min-width:180px;border:1px solid var(--champ);border-radius:12px;padding:10px 12px;background:#fff}
.form-echeance input[type=date]{flex:none;min-width:0}
.groupe{margin-bottom:24px}.groupe h2{font-size:13px;font-weight:500;color:var(--doux);margin:0 0 8px;display:flex;gap:8px;align-items:center}
.groupe.retard h2{color:#c2321f}
.echeance{display:grid;grid-template-columns:22px 1fr auto;gap:12px;align-items:start;padding:14px 16px;border:1px solid var(--trait);border-radius:16px;margin-bottom:8px;background:#fff}
.echeance.faite{opacity:.55}.echeance.faite .e-titre{text-decoration:line-through}
.coche{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--champ);background:#fff;cursor:pointer;margin-top:2px;display:grid;place-items:center;padding:0}
.coche:hover{border-color:#1a7f4b}.faite .coche{background:#1a7f4b;border-color:#1a7f4b;color:#fff}.coche svg{width:12px;height:12px;stroke-width:3}
.e-titre{font-weight:500}.e-detail{color:var(--doux);font-size:13px;margin-top:2px}
.e-date{font-size:12px;color:var(--second);background:var(--bulle);border-radius:999px;padding:2px 8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.retard .e-date{background:#fdecea;color:#c2321f}
.e-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;align-items:center}
.e-actions .bouton{padding:7px 14px;font-size:13px}.e-actions .lien{font-size:13px}
.plan-vide{color:var(--doux);text-align:center;padding:32px 0}

/* Questionnaire */
.questionnaire{border:0;padding:0;border-radius:24px;width:min(560px,calc(100vw - 24px));max-height:calc(100vh - 24px);box-shadow:0 24px 64px rgba(0,0,0,.18);overflow:auto}
.questionnaire::backdrop{background:rgba(255,255,255,.7);backdrop-filter:blur(6px)}
.q-progres{height:4px;background:var(--bulle)}
.q-progres span{display:block;height:100%;width:25%;transform-origin:left;background:var(--marine);transition:transform .3s var(--courbe)}
#form-profil{padding:28px 28px 20px}
.q-etape h2{font-size:24px;font-weight:500;letter-spacing:-.02em;margin:12px 0 4px}
.q-etape>p{color:var(--doux);margin:0 0 8px}
.q-etape h3{font-size:15px;font-weight:500;margin:20px 0 10px}
.pastilles{display:flex;flex-wrap:wrap;gap:8px}
.pastilles label,.cartes-choix label{position:relative;cursor:pointer}
.pastilles input,.cartes-choix input{position:absolute;opacity:0;pointer-events:none}
.pastilles span{display:block;border:1px solid var(--trait);border-radius:10px;padding:8px 14px;font-size:14px;transition:background-color .12s,border-color .12s}
.pastilles label:hover span{background:var(--cote)}
.pastilles input:checked+span{background:var(--marine);border-color:var(--marine);color:#fff}
.pastilles input:focus-visible+span,.cartes-choix input:focus-visible+span{outline:2px solid var(--bleu);outline-offset:2px}
.cartes-choix{display:flex;flex-direction:column;gap:8px}
.cartes-choix span{display:block;border:1px solid var(--trait);border-radius:14px;padding:14px 16px}
.cartes-choix input:checked+span{border-color:var(--marine);box-shadow:0 0 0 1px var(--marine);background:var(--accent-fond)}
.champ{display:flex;flex-direction:column;gap:6px;margin-top:16px;font-size:14px;color:var(--second)}
.champ input{border:1px solid var(--champ);border-radius:12px;padding:10px 12px;font-size:15px;background:#fff;color:var(--texte)}
.q-boutons{display:grid;grid-template-columns:auto 1fr auto auto;gap:8px;align-items:center;margin-top:28px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--marine);color:#fff;border-radius:14px;padding:12px 16px;font-size:14px;box-shadow:var(--ombre);z-index:70;display:flex;gap:12px;align-items:center;max-width:calc(100vw - 32px)}
.toast button{background:#fff;color:var(--marine);border:0;border-radius:10px;padding:5px 12px;font-weight:500;cursor:pointer}

@media (max-width:860px){
.espace{grid-template-columns:1fr}
.cote{position:fixed;inset-block:0;inset-inline-start:0;width:min(300px,86vw);z-index:40;transform:translateX(-102%);transition:transform .25s var(--courbe);box-shadow:var(--ombre)}
[dir=rtl] .cote{transform:translateX(102%)}
.espace.cote-ouvert .cote{transform:none}.cote-haut .icone{display:grid}.barre #ouvrir-cote{display:grid}
.ecran{display:none!important}.msg.moi>span{max-width:88%}.suggestions{grid-template-columns:1fr}.vide h1{font-size:24px}}

/* Abonnement (fenêtre) */
.abonnement{border:0;padding:0;border-radius:20px;width:min(920px,calc(100vw - 32px));max-height:calc(100vh - 32px);background:var(--fond);
color:var(--texte);box-shadow:0 24px 64px rgba(31,27,22,.18);overflow:auto}
.abonnement[open]{display:grid;grid-template-columns:1fr 1fr;animation:entree .32s var(--courbe)}
.abonnement::backdrop{background:rgba(31,27,22,.32)}
@keyframes entree{from{opacity:0;transform:translateY(8px)}}
.fermer{position:absolute;top:16px;right:16px;width:32px;height:32px;border:0;border-radius:8px;background:none;color:var(--doux);
cursor:pointer;display:grid;place-items:center;transition:background-color .15s var(--courbe)}.fermer:hover{background:var(--bulle)}
.abo-gauche{padding:48px 40px;display:flex;flex-direction:column;gap:24px}
.abo-gauche h2{font:400 32px/1.12 "Iowan Old Style","Charter","Georgia",serif;margin:0;letter-spacing:-.01em}
.abo-chapeau{margin:0;color:var(--second);font-size:15px}
.inclus{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.inclus li{display:grid;grid-template-columns:20px 1fr;gap:12px;font-size:14px;color:var(--second);line-height:1.5}
.inclus svg{width:18px;height:18px;margin-top:2px;fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.inclus b{display:block;font-weight:500;color:var(--texte)}
.abo-droite{background:var(--bulle);padding:56px 40px 40px;display:flex;flex-direction:column;gap:20px;border-left:1px solid var(--trait)}
.recu{background:#fffdf8;border-radius:4px;padding:20px 20px 16px;font:12px/1.5 var(--mono);color:#5e554a;position:relative;
-webkit-mask:radial-gradient(circle 5px at 50% 100%,#0000 98%,#000) 0 0/14px 100%;mask:radial-gradient(circle 5px at 50% 100%,#0000 98%,#000) 0 0/14px 100%}
.recu-ombre{filter:drop-shadow(0 1px 1px rgba(40,30,15,.06)) drop-shadow(0 10px 24px rgba(40,30,15,.10));transform:rotate(-.6deg)}
.recu-haut{display:flex;justify-content:space-between;color:#7b7266;border-bottom:1px dashed #e2d9c9;padding-bottom:12px;margin-bottom:12px}
.recu-haut span:first-child{font:500 14px/1 system-ui,sans-serif;color:#1f1b16}
.recu-ligne{display:flex;justify-content:space-between;font-variant-numeric:tabular-nums}.recu-ligne.doux{color:#9a9184}
.recu-total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px dashed #e2d9c9;margin-top:12px;padding-top:12px}
.recu-total strong{font:400 30px/1 "Iowan Old Style","Charter","Georgia",serif;color:#1f1b16;font-variant-numeric:tabular-nums}
.recu-pied{margin-top:8px;color:#9a9184;font-size:11px;padding-bottom:6px}
.form-paiement{display:flex;flex-direction:column;gap:16px}
.element-paiement:empty{min-height:0}
.paiement-essai{margin:0;padding:12px;border-radius:8px;border:1px dashed color-mix(in srgb,var(--accent) 45%,transparent);font-size:13px;color:var(--second)}
.accord{display:grid;grid-template-columns:18px 1fr;gap:8px;font-size:13px;color:var(--second);line-height:1.45;cursor:pointer}
.accord input{margin:2px 0 0;accent-color:var(--accent);width:16px;height:16px}.accord a{color:var(--texte)}
.payer{padding:14px 16px;font-size:15px}.payer:disabled{opacity:.6;cursor:default}
.securise{margin:-4px 0 0;display:flex;gap:8px;align-items:center;justify-content:center;font-size:12px;color:var(--doux)}
.form-paiement .erreur{margin:0;min-height:0;font-size:13px}
.paiement-ok{display:flex;flex-direction:column;align-items:flex-start;gap:8px;color:var(--accent);padding:8px 0}
.paiement-ok h3{margin:4px 0 0;font:400 24px/1.2 "Iowan Old Style","Charter","Georgia",serif;color:var(--texte)}
.paiement-ok p{margin:0 0 8px;color:var(--second)}
@media (max-width:760px){.abonnement[open]{grid-template-columns:1fr}.abo-gauche{padding:40px 24px 24px}.abo-droite{padding:24px;border-left:0;border-top:1px solid var(--trait)}
.abo-gauche h2{font-size:26px}}

/* Mes documents */
.depot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;border:1px dashed #cfcfcf;border-radius:16px;padding:16px;margin-bottom:24px;cursor:pointer}
.depot.survol{border-color:var(--bleu);background:var(--accent-fond)}
.depot input{position:absolute;opacity:0;width:1px;height:1px}
.depot:focus-within{outline:2px solid var(--bleu);outline-offset:2px}
.depot small{color:var(--doux);font-size:13px}
.doc{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;width:100%;text-align:start;padding:12px 16px;border:1px solid var(--trait);border-radius:16px;margin-bottom:8px;background:#fff;cursor:pointer;font:inherit;color:inherit}
.doc:hover{background:var(--cote)}
.doc-type{font:500 11px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--doux);border:1px solid var(--trait);border-radius:8px;padding:8px 0;text-align:center}
.doc-nom{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc-meta{font-size:12px;color:var(--second);background:var(--bulle);border-radius:999px;padding:2px 8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.doc-meta.urgent{background:#fdecea;color:#c2321f}
.visionneuse{border:0;padding:0;border-radius:20px;width:min(880px,calc(100vw - 24px));height:min(860px,calc(100vh - 24px));box-shadow:0 24px 64px rgba(0,0,0,.18);overflow:hidden}
.visionneuse[open]{display:flex;flex-direction:column}
.visionneuse::backdrop{background:rgba(0,0,0,.4)}
.visionneuse header{display:flex;gap:8px;align-items:center;padding:12px 12px 12px 20px;border-bottom:1px solid var(--trait)}
.visionneuse header input{flex:1;border:0;font:500 16px inherit;padding:6px 0;background:none;min-width:0}
.visionneuse header input:focus{outline:0;box-shadow:inset 0 -1px var(--bleu)}
.v-apercu{flex:1;min-height:0;background:var(--bulle);display:grid;place-items:center}
.v-apercu iframe{width:100%;height:100%;border:0;background:#fff}
.v-apercu img{max-width:100%;max-height:100%;object-fit:contain}
.visionneuse footer{display:flex;gap:16px;align-items:end;flex-wrap:wrap;padding:16px 20px;border-top:1px solid var(--trait)}
.visionneuse footer label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--doux)}
.visionneuse footer select,.visionneuse footer input{border:1px solid var(--champ);border-radius:10px;padding:8px 10px;background:#fff;font-size:14px;color:var(--texte)}
.v-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-inline-start:auto}
.v-actions .bouton{padding:8px 14px;font-size:14px}.v-actions .lien{font-size:14px}
.lien.rouge{color:#c2321f}
@media (max-width:640px){.v-actions{margin-inline-start:0}.visionneuse{height:calc(100vh - 24px)}}
[dir=rtl] .q-progres span{transform-origin:right}

/* États : survol (appareils à souris), appui, animations réduites */
@media (hover:hover){
.bouton:hover{background:var(--bleu-fonce)}.bouton.gris:hover{background:var(--survol)}
.rond:not(:disabled):hover{background:var(--bleu-fonce)}.rond.gris:not(:disabled):hover{background:var(--survol)}
.lien:hover{color:var(--texte)}.lien.rouge:hover{color:#9e2618}
.cartes-choix label:hover span{border-color:var(--champ)}
.echeance:hover{border-color:#d4d4d4}}
.rond:not(:disabled):active,.coche:active,.doc:active,.entree:active{transform:scale(.97)}
.rond,.coche,.doc,.entree{transition:background-color .15s,transform .12s var(--courbe)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}