@font-face { font-family: "Manrope"; font-weight: 200 800; font-display: swap; src: url("/web/polices/manrope-latin-wght-normal.woff2") format("woff2"); }

/* mêmes valeurs que Site/src/styles/global.css */
:root {
  --brun-950: #1f150f; --brun-900: #2e2119; --brun-800: #3d2d22; --brun-700: #4e3b2e; --brun-600: #66503f; --brun-500: #7a5c40; --brun-400: #a58b74; --brun-300: #c4af9b;
  --sable-300: #d3ccc3; --sable-200: #e5d8ca; --sable-150: #ece1d5; --sable-100: #f1e8de; --sable-50: #faf6f1; --blanc: #fff;
  --fond: var(--sable-50); --surface: var(--blanc); --surface-2: var(--sable-100);
  --texte: var(--brun-900); --texte-2: #574739; --texte-3: #75634f;
  --trait: var(--sable-300); --trait-doux: #e8dfd5; --trait-fort: #94826e;
  --sur-sombre: var(--sable-50); --sur-sombre-2: #cdbba8;
  --succes: #2f6b4a; --succes-t: #e6f0e9; --alerte: #8a5a0b; --alerte-t: #f6ecd9; --erreur: #a63a2b; --erreur-t: #f8e7e3; --info: #2f5d8a; --info-t: #e6edf4;
  --r-s: 8px; --r-m: 14px; --r-l: 22px;
  --ombre-1: 0 1px 2px rgba(46, 33, 25, .05), 0 6px 20px rgba(46, 33, 25, .06);
  --ombre-2: 0 2px 6px rgba(46, 33, 25, .06), 0 22px 56px rgba(46, 33, 25, .14);
  --vite: 160ms;
  --sortie: cubic-bezier(.22, 1, .36, 1);
  --courbe: cubic-bezier(.4, 0, .2, 1);
  --haut: 72px;
}

* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; }
body { background: var(--fond); color: var(--texte); font: 500 15.5px/1.55 "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h1, h2, h3, h4, p, dl, dd { margin: 0; }
h1, h2, h3 { font-weight: 600; line-height: 1.1; letter-spacing: -.03em; text-wrap: balance; }
p { text-wrap: pretty; }
b, strong { font-weight: 650; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
[hidden] { display: none !important; }
::selection { background: var(--sable-200); color: var(--brun-900); }
:focus-visible { outline: 2px solid var(--brun-500); outline-offset: 3px; border-radius: 4px; }
.chiffres { font-variant-numeric: tabular-nums; }
.seulement-petit { display: none; }
.sur { display: block; font-size: 12.5px; font-weight: 650; text-transform: uppercase; letter-spacing: .1em; color: var(--brun-500); }

/* boutons */
.bt { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 0 20px; border-radius: 999px; border: 1.5px solid var(--brun-400); background: transparent; color: var(--brun-900); font-weight: 600; font-size: 14.5px; white-space: nowrap; transition: background-color var(--vite) var(--courbe), color var(--vite) var(--courbe), border-color var(--vite) var(--courbe), box-shadow var(--vite) var(--courbe), transform var(--vite) var(--sortie); }
.bt:active { transform: scale(.975); }
.bt.plein { background: var(--brun-900); border-color: var(--brun-900); color: var(--sable-50); }
.bt.discret { border-color: transparent; color: var(--texte-2); }
.bt.danger { color: var(--erreur); border-color: var(--erreur); }
.bt.petit { min-height: 34px; padding: 0 14px; font-size: 13.5px; }
.bt.large { min-height: 52px; padding: 0 28px; font-size: 16px; }
.bt.icone { width: 42px; padding: 0; }
.bt[disabled] { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.lien { background: none; border: 0; padding: 0; font-weight: 600; font-size: 14.5px; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; text-decoration-color: var(--brun-400); }
@media (hover: hover) and (pointer: fine) {
  .bt:hover { background: var(--brun-900); border-color: var(--brun-900); color: var(--sable-50); }
  .bt.plein:hover { background: var(--brun-700); border-color: var(--brun-700); box-shadow: 0 8px 22px rgba(46, 33, 25, .18); }
  .bt.discret:hover { background: var(--sable-100); border-color: transparent; color: var(--brun-900); }
  .bt.danger:hover { background: var(--erreur); border-color: var(--erreur); color: var(--blanc); }
  .lien:hover { text-decoration-color: currentColor; }
}

/* connexion */
.connexion { min-height: 100dvh; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.vitrine { background: var(--brun-900); color: var(--sur-sombre); padding: clamp(28px, 3.4vw, 56px) clamp(28px, 4.4vw, 72px) 0; display: flex; flex-direction: column; gap: clamp(28px, 5vh, 64px); overflow: hidden; min-height: 100dvh; min-width: 0; }
.marque-ligne { display: flex; align-items: center; gap: 12px; font-weight: 650; font-size: 21px; letter-spacing: -.02em; }
.marque-ligne img { width: 32px; height: 36px; }
.vitrine-texte { display: grid; gap: 18px; max-width: 620px; }
.vitrine .sur { color: var(--brun-300); }
.vitrine h1 { font-size: clamp(34px, 3.9vw, 56px); letter-spacing: -.036em; line-height: 1.06; }
.vitrine .chapo { font-size: clamp(16.5px, 1.3vw, 19px); line-height: 1.55; color: var(--sur-sombre-2); max-width: 52ch; }
.vitrine-chiffres { display: flex; flex-wrap: wrap; gap: 14px clamp(24px, 3vw, 44px); padding-top: 22px; border-top: 1px solid #54402f; margin-top: 6px; }
.vitrine-chiffres dt { font-weight: 600; font-size: 18px; letter-spacing: -.02em; color: var(--sur-sombre); }
.vitrine-chiffres dd { font-size: 13.5px; color: var(--sur-sombre-2); }
.pile { position: relative; flex: 1; min-height: 0; margin-inline: calc(-1 * clamp(28px, 4.4vw, 72px)); }
.pile img { position: absolute; left: 50%; width: clamp(270px, 28vw, 440px); height: auto; border-radius: 10px; box-shadow: 0 22px 56px rgba(0, 0, 0, .4); }
.pile img:nth-child(1) { top: 34px; transform: translateX(-92%) rotate(-4deg); }
.pile img:nth-child(2) { top: 6px; transform: translateX(-50%) rotate(1.5deg); }
.pile img:nth-child(3) { top: 42px; transform: translateX(-8%) rotate(6deg); }
.acces { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: clamp(32px, 6vw, 72px) clamp(20px, 4vw, 56px); }
.acces form { width: min(400px, 100%); display: grid; gap: 22px; }
.acces h2 { font-size: clamp(28px, 2.6vw, 36px); letter-spacing: -.034em; }
.acces .chapo { color: var(--texte-2); margin-top: 8px; }
.acces .bt { width: 100%; }
.acces .note { font-size: 14px; color: var(--texte-3); text-align: center; }
.bloc-champ { display: grid; gap: 6px; }
.bloc-champ span { font-size: 13.5px; font-weight: 600; color: var(--texte-2); }
.bloc-champ input { width: 100%; height: 52px; padding: 0 16px; border: 1px solid var(--sable-300); border-radius: var(--r-m); background: var(--surface); }
.erreur-txt { color: var(--erreur); font-weight: 600; font-size: 14.5px; }
.erreur-txt:empty { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .apparait { animation: monte 640ms var(--sortie) both; animation-delay: calc(var(--i, 0) * 70ms); }
  @keyframes monte { from { opacity: 0; translate: 0 14px; } }
}

/* barre haute */
.barre { height: var(--haut); display: flex; align-items: center; gap: 16px; padding: 0 clamp(16px, 2.4vw, 32px); background: rgba(250, 246, 241, .94); backdrop-filter: saturate(1.4) blur(14px); border-bottom: 1px solid var(--trait-doux); position: sticky; top: 0; z-index: 20; }
.barre .logo { width: 28px; height: 32px; flex: none; display: block; }
.barre .marque { font-weight: 650; font-size: 19px; letter-spacing: -.02em; }
.barre .espace { flex: 1; min-width: 8px; }
.compte { position: relative; }
.pastille { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--trait); background: var(--sable-100); font-weight: 700; font-size: 13px; letter-spacing: .02em; }
.menu { position: absolute; right: 0; top: calc(100% + 8px); min-width: 240px; background: var(--surface); border: 1px solid var(--trait-doux); border-radius: var(--r-m); box-shadow: var(--ombre-2); padding: 8px; display: grid; z-index: 40; transform-origin: top right; transition: opacity 140ms ease, transform 140ms var(--sortie); }
.menu.haut { top: auto; bottom: calc(100% + 8px); transform-origin: bottom right; }
@starting-style { .menu { opacity: 0; transform: scale(.97); } }
.menu button { text-align: left; background: none; border: 0; padding: 10px 12px; border-radius: var(--r-s); font-weight: 600; font-size: 14.5px; }
.menu button.danger { color: var(--erreur); }
.menu .tete { padding: 8px 12px 12px; color: var(--texte-3); font-size: 13.5px; border-bottom: 1px solid var(--trait-doux); margin-bottom: 6px; overflow-wrap: anywhere; }
.menu .tete b { display: block; color: var(--texte); font-size: 15px; }
@media (hover: hover) { .menu button:hover { background: var(--sable-100); } }

/* forfait */
.forfait { display: grid; gap: 6px; width: 190px; font-size: 13px; color: var(--texte-3); font-weight: 600; }
.forfait .jauge { height: 6px; border-radius: 999px; background: var(--sable-200); overflow: hidden; }
.forfait .jauge i { display: block; height: 100%; background: var(--brun-900); border-radius: inherit; transition: width 320ms var(--sortie); }
.forfait.plein .jauge i { background: var(--erreur); }

/* liste des dossiers */
.page-liste { max-width: 1160px; margin: 0 auto; padding: clamp(32px, 4.4vw, 56px) clamp(16px, 2.4vw, 32px) 96px; display: grid; gap: 26px; }
.tete-liste { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 6px; }
.tete-liste h1 { font-size: clamp(32px, 3.6vw, 46px); letter-spacing: -.036em; }
.tete-liste p { color: var(--texte-2); font-size: 17px; margin-top: 8px; }
.recherche { position: relative; }
.recherche input { width: 100%; height: 58px; padding: 0 22px 0 54px; border: 1px solid var(--trait-doux); border-radius: 999px; background: var(--surface); font-size: 16.5px; box-shadow: var(--ombre-1); }
.recherche input::placeholder { color: var(--texte-3); }
.recherche svg { position: absolute; left: 22px; top: 20px; width: 18px; height: 18px; color: var(--texte-3); }
.outils-liste { display: flex; gap: 10px 14px; flex-wrap: wrap; align-items: center; }
.outils-liste .espace { flex: 1; }
.statuts { display: flex; gap: 6px; flex-wrap: wrap; }
.statuts button { border: 0; background: none; padding: 7px 14px; border-radius: 999px; font-weight: 600; font-size: 14.5px; color: var(--texte-2); display: inline-flex; gap: 7px; align-items: center; transition: background-color var(--vite) var(--courbe), color var(--vite) var(--courbe); }
.statuts button small { font-size: 13px; color: var(--texte-3); font-weight: 600; }
.statuts button[aria-pressed="true"] { background: var(--brun-900); color: var(--sable-50); }
.statuts button[aria-pressed="true"] small { color: var(--sur-sombre-2); }
@media (hover: hover) { .statuts button[aria-pressed="false"]:hover { background: var(--sable-100); } }
.segments { display: inline-flex; background: var(--sable-100); padding: 4px; border-radius: 999px; gap: 2px; }
.segments button { border: 0; background: none; padding: 5px 14px; border-radius: 999px; font-weight: 600; font-size: 14px; color: var(--texte-2); min-height: 32px; white-space: nowrap; }
.segments button[aria-pressed="true"] { background: var(--surface); color: var(--texte); box-shadow: 0 1px 2px rgba(46, 33, 25, .1); }
select.filtre { height: 40px; border: 1px solid var(--sable-300); border-radius: 999px; padding: 0 12px; background: var(--surface); font-weight: 600; font-size: 14px; color: var(--texte-2); }
.tableau-dossiers { background: var(--surface); border: 1px solid var(--trait-doux); border-radius: var(--r-l); box-shadow: var(--ombre-1); }
.rangee { display: grid; grid-template-columns: minmax(0, 1fr) 150px 130px 112px 104px 44px; gap: 18px; align-items: center; padding: 20px 20px 20px 28px; border-top: 1px solid var(--trait-doux); color: inherit; transition: background-color var(--vite) var(--courbe); }
.rangee:first-child { border-top: 0; border-top-left-radius: var(--r-l); border-top-right-radius: var(--r-l); }
.rangee:last-child { border-bottom-left-radius: var(--r-l); border-bottom-right-radius: var(--r-l); }
.rangee .nom { font-weight: 650; font-size: 17px; letter-spacing: -.012em; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rangee .bien { color: var(--texte-2); font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rangee .sous { color: var(--texte-3); font-size: 13.5px; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rangee .montant { text-align: right; font-weight: 650; font-size: 16px; letter-spacing: -.01em; }
.rangee .montant small { display: block; font-weight: 500; font-size: 12.5px; letter-spacing: 0; color: var(--texte-3); }
@media (hover: hover) { a.rangee:hover { background: var(--sable-50); } }
.badge { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 650; background: var(--sable-100); color: var(--texte-2); white-space: nowrap; }
.badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.badge.nu::before { display: none; }
.badge.finalise { background: var(--succes-t); color: var(--succes); }
.badge.en_cours { background: var(--sable-100); color: var(--brun-600); }
.badge.archive { background: var(--sable-150); color: var(--texte-3); }
.vide { padding: 72px 24px; text-align: center; color: var(--texte-2); display: grid; gap: 12px; justify-items: center; }
.vide h2 { font-size: 26px; color: var(--texte); }
.vide .bt { margin-top: 10px; }
.astuce { text-align: center; font-size: 14px; color: var(--texte-3); }

/* modales */
.voile { position: fixed; inset: 0; background: rgba(31, 21, 15, .42); display: grid; place-items: center; padding: 16px; z-index: 60; transition: opacity 180ms ease; }
@starting-style { .voile { opacity: 0; } }
.modale { width: min(560px, 100%); max-height: calc(100dvh - 32px); overflow: auto; background: var(--surface); border-radius: var(--r-l); box-shadow: var(--ombre-2); padding: clamp(22px, 3vw, 34px); display: grid; gap: 20px; transition: transform 200ms var(--sortie), opacity 200ms ease; }
@starting-style { .modale { transform: scale(.97); opacity: 0; } }
.modale.large { width: min(760px, 100%); }
.modale h2 { font-size: 27px; letter-spacing: -.03em; }
.modale .pied { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.modale p { color: var(--texte-2); }
.modale h3 { font-size: 16px; letter-spacing: -.012em; font-weight: 650; }
.choix-parcours { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.choix-parcours button { text-align: left; padding: 20px 22px; border: 1px solid var(--trait-doux); border-radius: var(--r-m); background: var(--surface); display: grid; gap: 4px; transition: transform 160ms var(--sortie), border-color var(--vite) ease, box-shadow var(--vite) ease; }
.choix-parcours button:active { transform: scale(.98); }
.choix-parcours b { font-size: 17px; font-weight: 650; letter-spacing: -.015em; }
.choix-parcours span { color: var(--texte-3); font-size: 14px; line-height: 1.4; }
@media (hover: hover) { .choix-parcours button:hover { border-color: var(--sable-300); box-shadow: var(--ombre-1); } }
.liste-simple { display: grid; }
.ligne-simple { display: flex; align-items: center; gap: 12px; padding: 14px 2px; border-top: 1px solid var(--trait-doux); min-width: 0; color: inherit; }
.ligne-simple:first-child { border-top: 0; }
.ligne-simple .quoi { flex: 1; min-width: 0; }
.ligne-simple .quoi b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ligne-simple .quoi span { color: var(--texte-3); font-size: 13.5px; overflow-wrap: anywhere; }
.bloc-lien { padding: 12px 16px; border-radius: var(--r-m); background: var(--sable-100); font-size: 14px; overflow-wrap: anywhere; }
.bloc { display: grid; gap: 10px; }
.deux-champs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.modale .bloc input:not([type="file"]) { width: 100%; height: 46px; padding: 0 14px; border: 1px solid var(--sable-300); border-radius: 10px; background: var(--surface); }

/* éditeur */
.editeur { height: 100dvh; display: grid; grid-template-rows: var(--haut) auto 1fr; }
.editeur .barre { position: static; background: var(--surface); }
.fil { display: grid; min-width: 0; flex: 0 1 auto; }
.fil b { font-weight: 650; font-size: 17px; letter-spacing: -.012em; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fil span { font-size: 13.5px; color: var(--texte-3); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.etat-save { font-size: 13.5px; color: var(--texte-3); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.etat-save.ok { color: var(--succes); }
.bandeau { display: flex; gap: clamp(24px, 3.2vw, 48px); padding: 14px clamp(16px, 2.4vw, 32px); background: var(--fond); border-bottom: 1px solid var(--trait-doux); overflow-x: auto; scrollbar-width: none; min-height: 72px; align-items: center; }
.tuile { flex: none; display: grid; gap: 1px; border-radius: var(--r-s); transition: background-color 600ms ease; box-shadow: 0 0 0 6px transparent; }
.tuile span { font-size: 12.5px; color: var(--texte-3); font-weight: 600; white-space: nowrap; }
.tuile b { font-size: 19px; font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; letter-spacing: -.02em; line-height: 1.25; }
.tuile.mauvais b { color: var(--erreur); }
.tuile.bouge { background: var(--sable-200); box-shadow: 0 0 0 6px var(--sable-200); transition-duration: 0ms; }
.bandeau .attente { color: var(--texte-3); }
.corps-editeur { display: grid; grid-row: 3; grid-template-columns: minmax(400px, 468px) 1fr; min-height: 0; }
.volet { display: grid; grid-template-rows: auto 1fr auto; min-height: 0; background: var(--surface); border-right: 1px solid var(--trait-doux); }
.onglets { display: flex; gap: 4px; padding: 10px 14px 0; border-bottom: 1px solid var(--trait-doux); overflow-x: auto; scrollbar-width: none; }
.onglets button { border: 0; background: none; padding: 10px 8px 12px; font-weight: 600; font-size: 14.5px; color: var(--texte-3); border-bottom: 2px solid transparent; margin-bottom: -1px; display: inline-flex; gap: 7px; align-items: center; white-space: nowrap; transition: color var(--vite) var(--courbe); }
.onglets button[aria-selected="true"] { color: var(--texte); border-bottom-color: var(--brun-900); }
.onglets .no { width: 21px; height: 21px; border-radius: 50%; background: var(--sable-150); color: var(--texte-2); font-size: 12px; font-weight: 700; display: inline-grid; place-items: center; flex: none; }
.onglets [aria-selected="true"] .no { background: var(--brun-900); color: var(--sable-50); }
.onglets .no.fait { background: var(--succes-t); color: var(--succes); }
.onglets .nb { background: var(--erreur-t); color: var(--erreur); border-radius: 999px; padding: 0 7px; font-size: 12px; min-width: 20px; text-align: center; }
.onglets .assistant { margin-left: auto; }
.onglets .apercu-mobile { display: none; }
.contenu-volet { overflow: auto; padding: 20px 22px 28px; min-height: 0; display: grid; gap: 14px; align-content: start; }
.pied-volet { padding: 14px 22px; border-top: 1px solid var(--trait-doux); background: var(--sable-50); display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 66px; }
.pied-volet p { font-size: 14.5px; font-weight: 600; color: var(--texte-2); line-height: 1.35; }
.apercu { position: relative; background: var(--sable-100); min-width: 0; min-height: 0; display: grid; grid-template-rows: 58px 1fr; }
.apercu-tete { display: flex; align-items: center; gap: 10px; padding: 0 16px; min-width: 0; }
.apercu-tete .segments { flex: none; background: var(--sable-150); }
.apercu-tete .segments button { font-size: 13.5px; }
.apercu-tete select { height: 38px; flex: 1; min-width: 0; max-width: 300px; margin-left: auto; border: 1px solid var(--trait-doux); border-radius: 999px; background: var(--surface); font-size: 13.5px; font-weight: 600; padding: 0 10px; color: var(--texte-2); }
.cadres { position: relative; min-height: 0; grid-row: 2; }
.cadres iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: var(--sable-100); }
.cadres iframe.cache { visibility: hidden; }
.a-completer { position: absolute; inset: 0; display: grid; place-items: center; padding: 24px; text-align: center; color: var(--texte-2); background: var(--sable-100); }
.a-completer div { max-width: 380px; display: grid; gap: 10px; }
.a-completer b { color: var(--texte); font-size: 24px; font-weight: 600; letter-spacing: -.03em; line-height: 1.15; }

/* formulaire */
.formulaire { display: grid; }
.section { border-bottom: 1px solid var(--trait-doux); }
.section > button { width: 100%; display: flex; align-items: center; gap: 12px; padding: 17px 2px; background: none; border: 0; font-weight: 650; font-size: 16px; letter-spacing: -.012em; text-align: left; }
.section > button .nb { margin-left: auto; font-size: 12.5px; font-weight: 650; letter-spacing: 0; color: var(--erreur); background: var(--erreur-t); padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.section > button svg { width: 15px; height: 15px; color: var(--texte-3); transition: transform 160ms var(--sortie); flex: none; }
.section.ouverte > button svg { transform: rotate(90deg); }
.section .champs { display: none; grid-template-columns: 1fr 1fr; gap: 18px 12px; padding: 4px 2px 26px; }
.section.ouverte .champs { display: grid; }
.champ { display: grid; gap: 5px; grid-column: span 2; min-width: 0; align-content: start; }
.champ.demi { grid-column: span 1; }
.champ > span.lib { font-size: 13.5px; color: var(--texte-2); font-weight: 600; line-height: 1.3; }
.saisie { position: relative; display: flex; align-items: center; }
.saisie input, .saisie select, .champ textarea { width: 100%; min-height: 46px; padding: 10px 13px; border: 1px solid var(--sable-300); border-radius: 10px; background: var(--surface); transition: border-color var(--vite) ease, box-shadow var(--vite) ease; }
.saisie select { padding-right: 6px; }
.saisie input.nombre { text-align: right; font-variant-numeric: tabular-nums; padding-right: 36px; }
.saisie i { position: absolute; right: 13px; font-style: normal; color: var(--texte-3); font-size: 14px; pointer-events: none; }
.champ textarea { resize: vertical; min-height: 104px; line-height: 1.55; }
.saisie input:focus, .saisie select:focus, .champ textarea:focus, .rang-tableau textarea:focus, .bloc-champ input:focus, .recherche input:focus, .modale .bloc input:focus, .zone-message textarea:focus { outline: none; border-color: var(--brun-500); box-shadow: 0 0 0 3px var(--sable-150); }
.insiste .champ.manquant input, .insiste .champ.manquant select, .insiste .champ.manquant textarea { border-color: #d9a79d; background: #fdf6f4; }
.formulaire:not(.insiste) .section > button .nb { color: var(--texte-3); background: var(--sable-100); }
.champ [aria-invalid="true"] { border-color: var(--erreur); }
.champ .source { font-size: 12.5px; color: var(--texte-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.champ .source.faible { color: var(--alerte); font-weight: 600; }
.champ .aide { font-size: 12.5px; color: var(--texte-3); line-height: 1.4; }
.champ.eclair { animation: eclair 1.1s var(--sortie); border-radius: 10px; }
@keyframes eclair { 0%, 40% { box-shadow: 0 0 0 6px var(--sable-200); } 100% { box-shadow: 0 0 0 6px transparent; } }
.avance { grid-column: span 2; }
.avance > summary { cursor: pointer; font-size: 13.5px; color: var(--texte-3); font-weight: 600; padding: 4px 0; }
.avance .sous-champs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 12px; margin-top: 12px; }
.groupe { grid-column: span 2; display: grid; gap: 10px; min-width: 0; }
.groupe > h4 { margin: 0; font-size: 13.5px; color: var(--texte-2); font-weight: 600; }
.groupe > .bt { justify-self: start; }
.carte-ligne { border-radius: var(--r-m); padding: 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 10px; background: var(--sable-50); min-width: 0; }
.carte-ligne > .entete-ligne { grid-column: span 2; display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-weight: 650; color: var(--texte); min-height: 24px; }
.rang-tableau { display: grid; gap: 8px; border-radius: var(--r-m); padding: 12px; background: var(--sable-50); }
.rang-tableau textarea { min-height: 44px; border: 1px solid var(--sable-300); border-radius: 10px; padding: 10px 12px; width: 100%; resize: vertical; background: var(--surface); }
.rang-tableau select { height: 42px; border: 1px solid var(--sable-300); border-radius: 10px; background: var(--surface); padding: 0 8px; width: 100%; }
.rang-tableau .bas { display: flex; justify-content: flex-end; }
.rang-niveaux { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.x { border: 0; background: none; color: var(--texte-3); font-size: 13.5px; font-weight: 600; padding: 2px 4px; border-radius: 6px; }
@media (hover: hover) { .x:hover { color: var(--erreur); } }

/* pièces */
.depot { border: 1.5px dashed var(--sable-300); border-radius: var(--r-l); padding: 44px 24px; text-align: center; display: grid; gap: 8px; justify-items: center; background: var(--sable-50); cursor: pointer; transition: border-color var(--vite) ease, background-color var(--vite) ease; }
.depot h3 { font-size: 22px; line-height: 1.2; }
.depot span { color: var(--texte-3); font-size: 14.5px; }
.depot.compact { padding: 20px 20px; }
.depot.compact h3 { font-size: 16.5px; letter-spacing: -.012em; font-weight: 650; }
@media (hover: hover) { .depot:hover { border-color: var(--brun-400); background: var(--sable-100); } }
.ou-saisir { text-align: center; }
.liste-pieces { display: grid; }
.piece { display: grid; grid-template-columns: 1fr auto; gap: 0 10px; align-items: center; padding: 11px 2px; border-top: 1px solid var(--trait-doux); min-width: 0; }
.piece:first-child { border-top: 0; }
.piece .nom { font-weight: 600; font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.piece select { grid-column: 1; border: 0; background: none; font-size: 13.5px; font-weight: 500; color: var(--texte-3); padding: 0; min-width: 0; margin-left: -3px; }
.piece.illisible .nom { color: var(--erreur); }
.piece small { grid-column: 1 / -1; color: var(--erreur); font-size: 13px; }
.piece.envoi { color: var(--texte-3); }
.titre-groupe { font-size: 12.5px; font-weight: 650; text-transform: uppercase; letter-spacing: .09em; color: var(--texte-3); margin-top: 10px; }
.manquante { display: flex; gap: 10px; font-size: 14.5px; color: var(--texte-2); padding: 3px 0; }
.manquante::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--erreur); margin-top: 9px; flex: none; }
.manquante.facultative::before { background: var(--sable-300); }
.appel { display: grid; gap: 10px; padding: 18px; border-radius: var(--r-m); background: var(--sable-100); }
.appel small { color: var(--texte-3); font-size: 13px; line-height: 1.45; }
.appel .bt { width: 100%; }
.appel textarea { width: 100%; min-height: 84px; padding: 11px 13px; border: 1px solid var(--sable-300); border-radius: 10px; background: var(--surface); resize: vertical; line-height: 1.5; }
.notice { padding: 13px 16px; border-radius: var(--r-m); background: var(--alerte-t); color: #5f3e06; font-size: 14.5px; }
.lecture { display: flex; gap: 12px; align-items: center; padding: 14px 16px; border-radius: var(--r-m); background: var(--sable-100); color: var(--texte-2); font-weight: 600; }
.toupie { width: 17px; height: 17px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: tour .6s linear infinite; flex: none; }
@keyframes tour { to { transform: rotate(360deg); } }
.glisser { position: fixed; inset: 0; z-index: 80; background: rgba(31, 21, 15, .55); display: grid; place-items: center; pointer-events: none; opacity: 0; transition: opacity 120ms ease; }
.glisser.actif { opacity: 1; }
.glisser div { background: var(--surface); padding: 32px 48px; border-radius: var(--r-l); text-align: center; display: grid; gap: 6px; box-shadow: var(--ombre-2); }
.glisser b { font-size: 24px; font-weight: 600; letter-spacing: -.03em; }

/* à traiter */
.reco { border: 1px solid var(--trait-doux); border-radius: var(--r-m); padding: 16px 18px; display: grid; gap: 7px; background: var(--surface); }
.reco h4 { margin: 0; font-size: 15px; font-weight: 650; letter-spacing: -.01em; line-height: 1.35; display: flex; gap: 9px; }
.reco.important h4::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--erreur); margin-top: 7px; flex: none; }
.reco p { color: var(--texte-2); font-size: 14px; }
.reco .action { display: grid; gap: 5px; padding-top: 6px; justify-items: start; }
.reco .action small { color: var(--texte-3); font-size: 13px; }
.reco .boutons { display: flex; gap: 8px; flex-wrap: wrap; padding-top: 4px; }
.manque-ligne { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 10px; text-align: left; background: none; border: 0; border-top: 1px solid var(--trait-doux); padding: 12px 2px; font-weight: 600; font-size: 14.5px; }
.manque-ligne svg { color: var(--texte-3); flex: none; transition: transform var(--vite) var(--sortie); }
@media (hover: hover) { .manque-ligne:hover svg { transform: translateX(3px); } }
.liste-manques { display: grid; }
.liste-manques .manque-ligne:first-child { border-top: 0; }
.pret { padding: 14px 16px; border-radius: var(--r-m); background: var(--succes-t); color: #1f4d34; font-weight: 600; }

/* assistant */
.volet-assistant { display: grid; grid-template-rows: 1fr auto; min-height: 0; height: 100%; padding: 0 !important; gap: 0 !important; overflow: hidden !important; align-content: stretch !important; }
.fil-assistant { overflow: auto; padding: 22px; display: grid; gap: 12px; align-content: start; min-height: 0; }
.bulle { padding: 11px 15px; border-radius: 16px; max-width: 90%; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14.5px; }
.bulle.courtier { justify-self: end; background: var(--brun-900); color: var(--sable-50); border-bottom-right-radius: 5px; }
.bulle.assistant { justify-self: start; background: var(--sable-100); border-bottom-left-radius: 5px; }
.pistes { display: flex; flex-wrap: wrap; gap: 8px; }
.pistes button { border: 1px solid var(--trait); background: var(--surface); border-radius: 999px; padding: 7px 14px; font-size: 13.5px; font-weight: 600; color: var(--texte-2); }
.zone-message { border-top: 1px solid var(--trait-doux); padding: 14px; display: flex; gap: 8px; align-items: flex-end; background: var(--surface); }
.zone-message textarea { flex: 1; min-height: 44px; max-height: 140px; border: 1px solid var(--sable-300); border-radius: 22px; padding: 10px 16px; resize: none; }

/* toasts */
#toasts { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); display: grid; gap: 8px; z-index: 90; width: min(460px, calc(100% - 32px)); }
.toast { background: var(--brun-900); color: var(--sable-50); padding: 12px 18px; border-radius: var(--r-m); box-shadow: var(--ombre-2); display: flex; align-items: center; gap: 14px; font-weight: 600; font-size: 14.5px; transition: transform 220ms var(--sortie), opacity 220ms ease; }
@starting-style { .toast { opacity: 0; transform: translateY(10px); } }
.toast.erreur { background: var(--erreur); }
.toast span { flex: 1; }
.toast button { background: none; border: 0; color: var(--sable-200); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; padding: 0; }

@media (max-width: 1080px) {
  .connexion { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .pile img:nth-child(1) { display: none; }
  .pile img:nth-child(2) { transform: translateX(-80%) rotate(-2deg); }
  .pile img:nth-child(3) { transform: translateX(-20%) rotate(4deg); }
  .rangee { grid-template-columns: minmax(0, 1fr) 130px 112px 44px; }
  .rangee .col-type, .rangee .col-date { display: none; }
}
@media (max-width: 860px) {
  .connexion { grid-template-columns: 1fr; }
  .vitrine { min-height: 0; padding-bottom: 32px; gap: 28px; }
  .pile, .vitrine-chiffres { display: none; }
  .acces { justify-content: flex-start; padding-top: 36px; padding-bottom: 48px; }
  .corps-editeur { grid-template-columns: 1fr; }
  .onglets .apercu-mobile { display: inline-flex; }
  .apercu { display: none; }
  .apercu.visible { display: grid; }
  .volet { border-right: 0; }
  .corps-editeur:has(.apercu.visible) { grid-template-rows: auto 1fr; }
  .corps-editeur:has(.apercu.visible) .volet { grid-template-rows: auto; }
  .corps-editeur:has(.apercu.visible) .contenu-volet, .corps-editeur:has(.apercu.visible) .pied-volet { display: none; }
  .etat-save, .forfait { display: none; }
  .barre { gap: 10px; padding: 0 14px; }
  .onglets .assistant { margin-left: 0; }
}
@media (max-width: 640px) {
  .seulement-large { display: none; }
  .seulement-petit { display: inline; }
  .menu button.seulement-petit { display: block; }
  .rangee { grid-template-columns: minmax(0, 1fr) auto 36px; gap: 4px 6px; padding: 16px 8px 16px 18px; }
  .rangee .col-menu { grid-column: 3; grid-row: 1 / span 2; align-self: center; }
  .rangee .col-menu .bt.icone { width: 36px; }
  .rangee .col-statut { grid-column: 2; grid-row: 2; justify-self: end; }
  .rangee .montant { grid-column: 2; grid-row: 1; }
  .rangee .bloc-nom { grid-row: 1 / span 2; }
  .choix-parcours { grid-template-columns: 1fr; }
  .barre .marque { display: none; }
  .deux-champs { grid-template-columns: 1fr; }
  .tete-liste .bt { width: 100%; }
  .outils-liste .espace { display: none; }
  .apercu-tete { flex-wrap: wrap; height: auto; padding: 10px 12px; }
  .apercu { grid-template-rows: auto 1fr; }
  .apercu-tete select { max-width: none; flex-basis: 100%; }
  .apercu-tete .segments { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .apercu-tete .segments button { padding: 5px 10px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .toupie { animation-duration: 1.2s !important; }
}

/* nouvelle offre : marque cliquable, export, fiches marché, adresses, aide */
.barre .accueil { display: inline-flex; align-items: center; gap: 16px; color: inherit; text-decoration: none; }
.actions-tete { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.recherche-fiche { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; }
.adresse { display: grid; gap: 8px; padding: 14px 0; border-bottom: 1px solid var(--trait-doux); }
.adresse input, .bloc input { min-width: 0; }
.actions-ligne { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.ligne-simple select.filtre { max-width: 220px; }
.page-aide { max-width: 860px; }
.sommaire-aide { display: flex; flex-wrap: wrap; gap: 8px 18px; font-weight: 600; font-size: 14.5px; }
.sommaire-aide a { color: var(--texte); text-underline-offset: 4px; text-decoration-color: var(--brun-400); }
.fiche-aide { border-top: 1px solid var(--trait-doux); padding-top: 22px; scroll-margin-top: calc(var(--haut) + 16px); }
.fiche-aide h2 { font-size: 22px; letter-spacing: -.02em; margin-bottom: 12px; }
.fiche-aide ol { display: grid; gap: 8px; padding-left: 22px; color: var(--texte-2); line-height: 1.55; }
.videos-aide { display: grid; gap: 16px; }
.videos-aide figure { margin: 0; display: grid; gap: 8px; }
.videos-aide video { width: 100%; border-radius: var(--r-m); border: 1px solid var(--trait-doux); background: var(--sable-100); }
.videos-aide figcaption { font-weight: 600; font-size: 14.5px; }
@media (max-width: 640px) {
  .recherche-fiche { grid-template-columns: 1fr; }
  .actions-tete { width: 100%; }
  .actions-tete .bt { flex: 1; }
}