@keyframes va-pop { 
  0% { opacity: 0; transform: translateY(-4px); }
  100% { opacity: 1; transform: none; }
}
@keyframes v5-feuille-pose { 
  0% { opacity: 0; filter: blur(6px); transform: scale(0.985); }
}
.porte { --porte-fond: #FFFFFF; --porte-encre: #18181B; --porte-encre-2: #52525B; --porte-doux: #71717A; --porte-pale: #A1A1AA; --porte-champ: #F4F5F8; --porte-champ-focus: #FFFFFF; --porte-anneau: #4190F9; --porte-lien: #2D6FF4; --porte-bouton: #18181B; --porte-bouton-texte: #FFFFFF; --porte-trait: #E4E4E7; --porte-carte: #F4F5F8; --porte-segment: #E8E9ED; --porte-curseur: #FFFFFF; --porte-filet: #E6E7EB; --porte-non: #C4C4CC; --porte-courbe: cubic-bezier(0.22, 1, 0.36, 1); --porte-erreur-fond: #FDECEC; --porte-erreur: #B42318; --porte-fait-fond: #E7F6EE; --porte-fait: #12A150; --porte-fournisseur-fond: #FFFFFF; --porte-fournisseur-filet: #DADCE0; position: fixed; inset: 0px; display: grid; grid-template-columns: clamp(360px, 44.45vw, 860px) minmax(0px, 1fr); padding: 12px; overflow-y: auto; background: var(--porte-fond); color: var(--porte-encre); font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; font-synthesis: none; -webkit-font-smoothing: antialiased; }
.porte-panneau { position: sticky; top: 0px; height: calc(100dvh - 24px); border-radius: 28px; overflow: hidden; background: url("img/verre.jpg") center center / cover no-repeat rgb(5, 6, 8); }
.porte-verre { position: absolute; inset: 0px; border-radius: inherit; }
.porte-cote { display: flex; flex-direction: column; min-height: calc(100dvh - 24px); padding: 52px 52px 40px 84px; }
.porte-haut { display: flex; align-items: center; justify-content: space-between; min-height: 20px; }
.porte-retour { display: inline-flex; align-items: center; gap: 8px; padding: 0px; border: 0px; background: none; font-style: inherit; font-variant: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 500; font-size: 16px; line-height: 20px; color: var(--porte-encre); text-decoration: none; cursor: pointer; transition: opacity 0.15s; }
.porte-retour:hover { opacity: 0.7; }
.porte-marque { width: 71px; height: 17px; background: var(--porte-encre); mask: url("/brand/klintt-lockup-black.svg") center center / contain no-repeat; }
.porte-centre { flex: 1 1 0%; display: flex; align-items: center; padding: 64px 0px 40px; }
.porte-centre.is-haut { align-items: flex-start; padding-top: 62px; }
.porte-colonne { width: min(560px, 100%); }
.porte-colonne.is-large { width: min(640px, 100%); }
.porte-etapes { display: flex; gap: 6px; margin-bottom: 22px; }
.porte-etapes span { width: 36px; height: 4px; border-radius: 2px; background: var(--porte-trait); }
.porte-etapes span[data-fait] { background: var(--porte-encre); }
.porte-amorce { margin: 0px 0px 10px; font-size: 24px; line-height: 30px; letter-spacing: -0.015em; font-weight: 400; }
.porte-titre { margin: 0px 0px 48px; font-size: 56px; line-height: 62px; letter-spacing: -0.04em; font-weight: 400; text-wrap: balance; }
.porte-texte { margin: -22px 0px 24px; max-width: 470px; font-size: 15px; line-height: 22px; color: var(--porte-doux); }
.porte-champs { display: grid; gap: 12px; }
.porte-champ { position: relative; }
.porte-libelle { position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.porte-saisie { width: 100%; height: 54px; padding: 0px 18px; border: 0px; border-radius: 12px; background: var(--porte-champ); color: var(--porte-encre); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 16px; letter-spacing: -0.005em; outline: none; box-sizing: border-box; transition: background 0.15s, box-shadow 0.15s; }
.porte-saisie::placeholder { color: var(--porte-pale); }
.porte-saisie:focus {
  background: var(--porte-champ-focus); box-shadow: 0 0 0 1.5px var(--porte-anneau), 0 0 0 5px var(--porte-anneau);
  @supports (color: color-mix(in lab, red, red)) {
  box-shadow: 0 0 0 1.5px var(--porte-anneau), 0 0 0 5px color-mix(in srgb, var(--porte-anneau) 16%, transparent);
}
}
.porte-saisie.is-code { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 20px; font-weight: 500; letter-spacing: 0.3em; }
.porte-oubli { display: flex; justify-content: flex-end; margin-top: 14px; }
.porte-oubli-indice { justify-content: space-between; align-items: baseline; gap: 12px; }
.porte-oubli-indice > span { min-width: 0px; font-size: 14px; line-height: 18px; color: var(--porte-doux); }
.porte-formulaire > .porte-bouton { margin-top: 28px; }
.porte-oubli + .porte-bouton { margin-top: 20px; }
.porte-bouton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 54px; padding: 0px 20px; border: 0px; border-radius: 12px; background: var(--porte-bouton); color: var(--porte-bouton-texte); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 500; font-size: 16px; letter-spacing: -0.008em; text-decoration: none; box-shadow: rgba(24, 24, 27, 0.18) 0px 6px 16px -4px; cursor: pointer; transition: filter 0.15s, opacity 0.15s, transform 0.12s; }
.porte-bouton:hover:not(:disabled) { filter: brightness(1.15); }
.porte-bouton:active:not(:disabled) { transform: scale(0.985); }
.porte-bouton:disabled { opacity: 0.42; cursor: not-allowed; }
.porte-bouton.is-clair { background: var(--porte-champ); color: var(--porte-encre); box-shadow: none; }
.porte-bouton.is-clair:hover { filter: brightness(0.97); }
.porte-bouton.is-fait { background: var(--porte-fait-fond); color: var(--porte-fait); }
.porte-actions { display: grid; gap: 10px; }
.porte-erreur + .porte-actions { margin-top: 16px; }
.porte-lien { padding: 0px; border: 0px; background: none; font-style: inherit; font-variant: inherit; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 500; color: var(--porte-lien); cursor: pointer; }
.porte-lien:hover { text-decoration: underline; }
.porte-lien.is-discret { font-size: 14px; line-height: 18px; color: var(--porte-doux); }
.porte-bas { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin: 26px 0px 0px; padding-left: 18px; font-size: 15px; line-height: 20px; color: var(--porte-doux); }
.porte-erreur { display: flex; align-items: flex-start; gap: 8px; margin-top: 14px; padding: 12px 14px; border-radius: 12px; background: var(--porte-erreur-fond); color: var(--porte-erreur); font-size: 14px; line-height: 20px; }
.porte-erreur svg { flex: 0 0 auto; margin-top: 2px; }
.porte-rappel { display: flex; align-items: center; gap: 12px; min-height: 56px; margin: -4px 0px 24px; padding: 0px 18px; border-radius: 14px; background: var(--porte-carte); font-size: 15px; line-height: 20px; color: var(--porte-doux); }
.porte-rappel strong { font-weight: 600; color: var(--porte-encre); }
.porte-rappel > span { margin-left: auto; }
.porte-rappel .porte-lien { font-size: 14px; }
.porte-rappel.is-adresse > .porte-rappel-texte { margin-left: 0px; min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.porte-rappel.is-adresse > .porte-lien { flex: 0 0 auto; margin-left: auto; }
.porte-etats { display: grid; gap: 12px; margin: 24px 0px 0px; padding: 0px; list-style: none; }
.porte-rappel + .porte-etats { margin-top: 24px; }
.porte-etat { display: flex; align-items: center; gap: 12px; padding-left: 1px; font-size: 14px; line-height: 20px; color: var(--porte-encre-2); }
.porte-etat svg { flex: 0 0 auto; width: 16px; height: 16px; margin-right: 1px; }
.porte-etat.is-fait svg { color: var(--porte-fait); }
.porte-colonne .porte-etats + .porte-bouton { margin-top: 24px; }
.porte-code { display: grid; place-items: center; height: 76px; margin: 0px 0px 22px; border-radius: 14px; background: var(--porte-carte); font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 30px; font-weight: 500; letter-spacing: 0.28em; text-indent: 0.28em; user-select: all; }
.porte-code6 { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)) 32px repeat(3, minmax(0px, 1fr)); column-gap: 12px; margin-top: 24px; }
.porte-code6-champ { position: absolute; inset: 0px; z-index: 1; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; font-size: 16px; cursor: text; }
.porte-code6-champ:disabled { cursor: not-allowed; }
.porte-code6-case { display: grid; place-items: center; height: 80px; border-radius: 14px; background: var(--porte-champ); color: var(--porte-encre); font-size: 34px; line-height: 40px; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; transition: background 0.15s, box-shadow 0.15s, opacity 0.15s; }
.porte-code6-case[data-actif] {
  background: var(--porte-champ-focus); box-shadow: 0 0 0 1.5px var(--porte-anneau), 0 0 0 5px var(--porte-anneau);
  @supports (color: color-mix(in lab, red, red)) {
  box-shadow: 0 0 0 1.5px var(--porte-anneau), 0 0 0 5px color-mix(in srgb, var(--porte-anneau) 16%, transparent);
}
}
.porte-code6[data-erreur] .porte-code6-case { box-shadow: 0 0 0 1.5px var(--porte-erreur); }
.porte-code6[data-pale] .porte-code6-case { opacity: 0.45; }
.porte-code6-tiret { place-self: center; width: 12px; height: 2px; border-radius: 1px; background: var(--porte-pale); }
.porte-code6-curseur { width: 2px; height: 34px; border-radius: 1px; background: var(--porte-encre); animation: 1.1s steps(1) 0s infinite normal none running porte-clignote; }
@keyframes porte-clignote { 
  50% { opacity: 0; }
}
.porte-code6 + .porte-erreur { margin-top: 14px; }
.porte-formulaire > .porte-code6 + .porte-bouton { margin-top: 28px; }
.porte-renvoye { display: inline-flex; align-items: center; gap: 6px; align-self: center; font-weight: 500; color: var(--porte-fait); }
.porte-attente { color: var(--porte-pale); font-variant-numeric: tabular-nums; }
.porte-roue { animation: 0.85s linear 0s infinite normal none running porte-roue; }
@keyframes porte-roue { 
  100% { rotate: 360deg; }
}
.porte-offres { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 16px; }
.porte-offre { display: flex; flex-direction: column; padding: 24px; border-radius: 24px; background: var(--porte-carte); }
.porte-offre-haut { display: flex; align-items: center; min-height: 38px; }
.porte-offre-nom { margin: 0px; font-size: 17px; font-weight: 500; letter-spacing: -0.01em; color: var(--porte-encre-2); }
.porte-segment { position: relative; display: inline-flex; padding: 3px; border-radius: 12px; background: var(--porte-segment); isolation: isolate; }
.porte-segment-curseur { position: absolute; z-index: -1; top: 3px; bottom: 3px; left: 0px; border-radius: 9px; background: var(--porte-curseur); box-shadow: rgba(24, 24, 27, 0.08) 0px 1px 2px, rgba(24, 24, 27, 0.06) 0px 2px 8px; transition: transform 0.45s var(--porte-courbe), width 0.45s var(--porte-courbe); }
.porte-segment button { height: 32px; padding: 0px 14px; border: 0px; border-radius: 9px; background: transparent; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 500; font-size: 14px; color: var(--porte-doux); cursor: pointer; transition: color 0.25s; }
.porte-segment button[aria-checked="true"] { color: var(--porte-encre); }
.porte-segment button:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: 1px; }
.porte-offre-profil { margin: 10px 0px 0px; font-size: 15px; line-height: 22px; color: var(--porte-doux); }
.porte-offre-profil span, .porte-offre-cta { display: inline-block; transition: opacity 0.16s, transform 0.16s; }
.porte-offre-profil span.is-sortant, .porte-offre-cta.is-sortant { opacity: 0; transform: translateY(4px); }
.porte-offre-prix { display: flex; align-items: baseline; gap: 10px; min-height: 53px; margin: 22px 0px 0px; }
.porte-offre-montant { font-size: 44px; line-height: 53px; font-weight: 600; letter-spacing: -0.035em; color: var(--porte-encre); }
.porte-offre-montant.is-vide { color: var(--porte-pale); }
.porte-offre-periode { font-size: 16px; color: var(--porte-doux); }
.porte-offre-note { margin: 8px 0px 0px; font-size: 14px; color: var(--porte-pale); }
.porte-offre .porte-bouton { height: 50px; margin-top: 28px; }
.porte-offre-inclus { margin: 32px 0px 0px; font-size: 15px; font-weight: 500; color: var(--porte-encre); }
.porte-offre-liste { display: grid; gap: 12px; margin: 14px 0px 0px; padding: 0px; list-style: none; }
.porte-offre-liste li { display: flex; align-items: flex-start; gap: 10px; font-size: 15.5px; line-height: 22px; color: var(--porte-encre-2); }
.porte-offre-liste svg { flex: 0 0 auto; margin-top: 2px; color: var(--porte-pale); }
.porte-offre-liste svg.is-fort { color: var(--porte-lien); }
.porte-offre-plus { transition: opacity 0.3s, transform 0.45s var(--porte-courbe); }
.porte-offre-plus:not(.is-la) { opacity: 0; transform: translateY(4px); }
.porte-roule { display: inline-flex; font-variant-numeric: tabular-nums; white-space: nowrap; }
.porte-roule-interne { display: inline-flex; }
.porte-roule-lu { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.porte-roule-chiffre { position: relative; display: inline-block; height: 1.2em; overflow: hidden; transition: width 0.6s var(--porte-courbe), opacity 0.45s; mask-image: linear-gradient(transparent 0px, rgb(0, 0, 0) 16%, rgb(0, 0, 0) 84%, transparent 100%); }
.porte-roule-colonne { display: flex; flex-direction: column; transition: transform 0.75s cubic-bezier(0.25, 1.15, 0.4, 1); }
.porte-roule-colonne > span { display: block; height: 1.2em; line-height: 1.2em; text-align: center; }
.porte-roule-signe { display: inline-block; height: 1.2em; line-height: 1.2em; white-space: pre; overflow: hidden; transition: width 0.6s var(--porte-courbe), opacity 0.45s; }
.porte-offre-liste .porte-roule { vertical-align: top; }
.porte-offre-liste .porte-roule-chiffre, .porte-offre-liste .porte-roule-signe, .porte-offre-liste .porte-roule-colonne > span { height: 22px; line-height: 22px; }
.porte-offre-montant.porte-roule .porte-roule-chiffre, .porte-offre-montant.porte-roule .porte-roule-signe, .porte-offre-montant.porte-roule .porte-roule-colonne > span { height: 53px; line-height: 53px; }
.porte-comparatif { margin-top: 20px; display: flex; flex-direction: column; align-items: center; }
.porte-comparatif-bouton { appearance: none; display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0px 14px; border: 0px; border-radius: 10px; background: none; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 500; font-size: 15px; color: var(--porte-encre-2); cursor: pointer; transition: color 0.2s, background-color 0.2s; }
.porte-comparatif-bouton:hover { color: var(--porte-encre); background: var(--porte-carte); }
.porte-comparatif-bouton:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: 2px; }
.porte-comparatif-bouton svg { width: 18px; height: 18px; transition: transform 0.3s var(--porte-courbe); }
.porte-comparatif.is-ouvert .porte-comparatif-bouton svg { transform: rotate(180deg); }
.porte-comparatif-corps { width: 100%; display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.4s var(--porte-courbe); }
.porte-comparatif.is-ouvert .porte-comparatif-corps { grid-template-rows: 1fr; }
.porte-comparatif-corps > div { overflow: clip; min-height: 0px; }
.porte-comparatif-defile { margin-top: 12px; padding: 0px 24px 12px; border-radius: 24px; background: var(--porte-carte); }
.porte-comparatif-table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 22px; }
.porte-comparatif-table th, .porte-comparatif-table td { padding: 14px 10px; text-align: center; border-top: 1px solid var(--porte-filet); }
.porte-comparatif-table thead th, .porte-comparatif-table thead td { position: sticky; z-index: 1; top: -12px; padding-top: 20px; border-top: 0px; background: var(--porte-carte); box-shadow: 0 1px 0 var(--porte-filet); font-weight: 500; color: var(--porte-encre); }
.porte-comparatif-table tbody th { padding-left: 0px; text-align: left; font-weight: 400; color: var(--porte-encre-2); }
.porte-comparatif-table td { width: 14%; color: var(--porte-encre); font-variant-numeric: tabular-nums; }
.porte-comparatif-table .porte-comparatif-groupe th { padding-top: 30px; padding-bottom: 10px; border-top: 0px; font-weight: 600; font-size: 14px; letter-spacing: -0.005em; color: var(--porte-encre); }
.porte-comparatif-table tbody tr:first-child.porte-comparatif-groupe th { padding-top: 18px; }
.porte-comparatif-detail { display: block; margin-top: 2px; font-size: 13px; line-height: 18px; color: var(--porte-pale); }
.porte-comparatif-oui { display: inline-block; width: 18px; height: 18px; vertical-align: -4px; color: var(--porte-encre); }
.porte-comparatif-non { color: var(--porte-non); }
.porte-comparatif-texte { font-size: 14px; color: var(--porte-encre-2); }
.porte-comparatif-bientot { display: inline-flex; align-items: center; height: 20px; margin-left: 8px; padding: 0px 7px; border-radius: 999px; background: var(--porte-segment); font-weight: 500; font-size: 12px; letter-spacing: 0px; color: var(--porte-doux); vertical-align: 1px; }
@media (prefers-reduced-motion: reduce){
.porte-roue { animation-duration: 2.4s; }
.porte-saisie, .porte-bouton, .porte-retour, .porte-segment button, .porte-code6-case { transition: none; }
.porte-code6-curseur { animation: auto ease 0s 1 normal none running none; }
.porte-roule-colonne, .porte-roule-chiffre, .porte-roule-signe, .porte-segment-curseur, .porte-offre-cta, .porte-offre-profil span, .porte-offre-plus, .porte-comparatif-corps, .porte-comparatif-bouton svg { transition: none !important; }
}
@media (max-width: 1180px){
.porte-cote { padding: 44px 32px 32px 56px; }
.porte-titre { font-size: 48px; line-height: 54px; }
}
@media (max-width: 900px){
.porte { display: block; padding: 8px; }
.porte-panneau { position: relative; height: 180px; border-radius: 22px; }
.porte-cote { min-height: 0px; padding: 22px 16px 40px; }
.porte-centre, .porte-centre.is-haut { padding: 30px 0px 0px; align-items: flex-start; }
.porte-amorce { font-size: 20px; line-height: 26px; margin-bottom: 8px; }
.porte-titre { font-size: 38px; line-height: 44px; margin-bottom: 30px; }
.porte-texte { margin-top: -14px; }
.porte-offres { grid-template-columns: minmax(0px, 1fr); }
.porte-comparatif-defile { padding: 0px 14px 8px; border-radius: 20px; }
.porte-comparatif-table { font-size: 13.5px; line-height: 19px; }
.porte-comparatif-table th, .porte-comparatif-table td { padding: 12px 4px; }
.porte-comparatif-table td { width: 19%; }
.porte-comparatif-table thead th, .porte-comparatif-table thead td { top: -8px; padding-top: 14px; font-size: 13px; }
.porte-comparatif-table .porte-comparatif-groupe th { padding-top: 24px; font-size: 13.5px; }
.porte-comparatif-texte { font-size: 12.5px; }
.porte-comparatif-detail { font-size: 12px; line-height: 16px; }
.porte-bas { padding-left: 0px; }
.porte-rappel { flex-wrap: wrap; padding: 14px 16px; row-gap: 4px; }
.porte-code { font-size: 24px; letter-spacing: 0.16em; text-indent: 0.16em; }
.porte-rappel.is-adresse { flex-wrap: nowrap; }
.porte-code6 { grid-template-columns: repeat(3, minmax(0px, 1fr)) 14px repeat(3, minmax(0px, 1fr)); column-gap: 8px; }
.porte-code6-case { height: 60px; border-radius: 12px; font-size: 28px; line-height: 34px; }
.porte-code6-curseur { height: 26px; }
}
label.porte-champ { display: block; }
.porte-texte.is-accueil { max-width: 560px; text-wrap: pretty; }
.porte-suite { margin-top: 24px; }
.porte-rangees { display: grid; gap: 8px; }
.porte-ligne + .porte-rangees, .porte-rangees + .porte-ligne { margin-top: 12px; }
.porte-bloc { margin-top: 24px; }
.porte-etiquette { margin: 0px 0px 10px; font-size: 14px; line-height: 20px; color: var(--porte-doux); }
.porte-champ + .porte-ligne, .porte-bloc + .porte-ligne { margin-top: 24px; }
.porte-methodes { display: flex; width: fit-content; margin: -22px 0px 24px; }
.porte-methodes + .porte-texte { margin-top: 0px; }
.porte-texte + .porte-note { margin-top: 0px; }
.porte-choix { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 58px; padding: 9px 18px; border: 0px; border-radius: 12px; background: var(--porte-carte); color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background 0.15s, box-shadow 0.15s; }
.porte-choix:hover { filter: brightness(0.985); }
.porte-choix[data-choisi] { background: var(--porte-fond); box-shadow: inset 0 0 0 1.5px var(--porte-encre); }
.porte-choix:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: 2px; }
.porte-case, .porte-radio { flex: 0 0 auto; width: 18px; height: 18px; background: var(--porte-fond); box-shadow: inset 0 0 0 1.5px var(--porte-non); }
.porte-case { display: grid; place-items: center; border-radius: 5px; color: var(--porte-bouton-texte); }
.porte-radio { width: 20px; height: 20px; border-radius: 50%; }
.porte-choix[data-choisi] .porte-case { background: var(--porte-encre); box-shadow: none; }
.porte-choix[data-choisi] .porte-radio { box-shadow: inset 0 0 0 6px var(--porte-encre); }
.porte-choix-textes { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; gap: 1px; }
.porte-choix-titre { font-size: 15px; line-height: 20px; font-weight: 500; color: var(--porte-encre); }
.porte-choix-sous { font-size: 13px; line-height: 18px; color: var(--porte-doux); }
.porte-choix-fin { flex: 0 0 auto; margin-left: auto; font-size: 15px; line-height: 20px; font-weight: 500; color: var(--porte-encre); font-variant-numeric: tabular-nums; white-space: nowrap; }
.porte-chevron { flex: 0 0 auto; color: var(--porte-pale); }
.porte-ligne { display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 0px 18px; border-radius: 14px; background: var(--porte-carte); font-size: 15px; line-height: 20px; color: var(--porte-doux); }
.porte-ligne strong { font-weight: 600; color: var(--porte-encre); white-space: nowrap; }
.porte-ligne-doux { min-width: 0px; }
.porte-ligne-fin { margin-left: auto; display: inline-flex; align-items: center; gap: 14px; white-space: nowrap; }
.porte-ligne .porte-lien { font-size: 15px; }
.porte-connecte { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; color: var(--porte-fait); }
.porte-photo-vignette { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }
.porte-fiabilite { display: inline-flex; align-items: center; gap: 10px; }
.porte-fiabilite strong { font-variant-numeric: tabular-nums; }
.porte-gain { padding: 2px 8px; border-radius: 999px; background: var(--porte-fait-fond); color: var(--porte-fait); font-size: 12px; line-height: 16px; font-weight: 600; }
.porte-plus { display: flex; align-items: baseline; gap: 8px; margin: 12px 0px 0px; padding-left: 18px; font-size: 15px; line-height: 20px; }
.porte-plus span { font-size: 14px; color: var(--porte-pale); }
.porte-champ.a-unite .porte-saisie { padding-right: 44px; }
.porte-unite { position: absolute; top: 50%; right: 18px; transform: translateY(-50%); font-size: 16px; color: var(--porte-pale); pointer-events: none; }
.porte-teintes { display: flex; flex-wrap: wrap; gap: 12px; }
.porte-teintes button { width: 32px; height: 32px; padding: 0px; border: 0px; border-radius: 50%; cursor: pointer; box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 1px inset; transition: box-shadow 0.15s; }
.porte-teintes button[aria-checked="true"] { box-shadow: inset 0 0 0 3px var(--porte-fond), 0 0 0 1.5px var(--porte-encre); }
.porte-teintes button:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: 3px; }
.porte-note { margin-top: 14px; padding: 12px 14px; border-radius: 12px; font-size: 14px; line-height: 20px; background: var(--porte-carte); color: var(--porte-encre-2); }
.porte-note[data-ton="info"] {
  background: var(--porte-anneau);
  @supports (color: color-mix(in lab, red, red)) {
  background: color-mix(in srgb, var(--porte-anneau) 10%, var(--porte-fond));
}
  color: var(--porte-encre);
}
.porte-note[data-ton="fait"] { background: var(--porte-fait-fond); color: var(--porte-fait); }
.porte-bilan { margin: 0px; padding: 6px 18px; border-radius: 14px; background: var(--porte-carte); }
.porte-bilan-ligne { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; }
.porte-bilan-ligne + .porte-bilan-ligne { border-top: 1px solid var(--porte-trait); }
.porte-bilan dt { font-size: 15px; line-height: 20px; color: var(--porte-encre-2); }
.porte-bilan dd { margin: 0px; font-size: 15px; line-height: 20px; font-weight: 500; color: var(--porte-encre); font-variant-numeric: tabular-nums; }
.porte-bilan-ligne[data-fort] dt { font-weight: 500; color: var(--porte-encre); }
.porte-bilan-ligne[data-fort] dd { font-weight: 600; }
@keyframes porte-tourne { 
  100% { --porte-angle: 360deg; }
}
.porte-scene { --tuile: 88px; --rayon-tuile: 22px; padding: 28px 16px 22px; border-radius: 20px; background: var(--porte-carte); }
.porte-scene.is-petite { --tuile: 72px; --rayon-tuile: 18px; }
.porte-scene-tuiles { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); margin: 0px; padding: 0px; list-style: none; }
.porte-scene-etape { position: relative; display: flex; flex-direction: column; align-items: center; min-width: 0px; text-align: center; }
.porte-scene-etape[data-lien]::after { content: ""; position: absolute; top: calc(var(--tuile) / 2 - 1px); left: calc(50% + var(--tuile) / 2 + 8px); width: calc(100% - var(--tuile) - 16px); height: 2px; border-radius: 1px; background: var(--porte-encre); }
.porte-scene-etape[data-lien="pointille"]::after { background: repeating-linear-gradient(90deg, var(--porte-non) 0 3px, transparent 3px 8px); }
.porte-tuile { position: relative; display: grid; place-items: center; width: var(--tuile); height: var(--tuile); border-radius: var(--rayon-tuile); background: var(--porte-fond); box-shadow: rgba(0, 0, 0, 0.06) 0px 1px 3px; color: var(--porte-encre); transition: background 0.3s, box-shadow 0.3s, color 0.3s; }
.porte-tuile svg { width: calc(var(--tuile) * 0.32); height: calc(var(--tuile) * 0.32); }
.porte-scene-etape[data-etat="a_venir"] .porte-tuile { background: transparent; box-shadow: none; outline: 1.5px dashed var(--porte-non); outline-offset: -1.5px; color: var(--porte-pale); }
.porte-scene-etape[data-etat="en_cours"] .porte-tuile { border: 2px solid transparent; background: linear-gradient(var(--porte-fond), var(--porte-fond)) padding-box,
    conic-gradient(from var(--porte-angle), #4190F9, #A9CDFF, #EAF2FF, #4190F9, #2F6FD6, #BFDBFF, #4190F9) border-box; box-shadow: rgba(65, 144, 249, 0.28) 0px 4px 18px; animation: 6s linear 0s infinite normal none running porte-tourne; }
.porte-scene-etape[data-etat="echec"] .porte-tuile { box-shadow: inset 0 0 0 1.5px var(--porte-erreur); color: var(--porte-erreur); }
.porte-tuile-fait { position: absolute; top: -6px; right: -6px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: rgb(18, 161, 80); color: rgb(255, 255, 255); box-shadow: 0 0 0 2px var(--porte-carte); }
.porte-scene-nom { max-width: 100%; margin-top: 12px; font-size: 14px; line-height: 18px; font-weight: 500; color: var(--porte-encre); }
.porte-scene.is-petite .porte-scene-nom { font-size: 13px; }
.porte-scene-etape[data-etat="a_venir"] .porte-scene-nom { color: var(--porte-pale); }
.porte-scene-valeur { margin-top: 2px; font-size: 12px; line-height: 16px; color: var(--porte-doux); font-variant-numeric: tabular-nums; }
.porte-scene-barre { height: 4px; margin: 22px 8px 0px; border-radius: 2px; background: var(--porte-trait); overflow: hidden; }
.porte-scene-barre span { display: block; height: 100%; border-radius: inherit; background: var(--porte-encre); transition: width 0.6s var(--porte-courbe); }
.porte-scene-statut { display: flex; align-items: center; gap: 8px; margin: 14px 8px 0px; font-size: 14px; line-height: 20px; color: var(--porte-encre-2); }
.porte-scene-statut svg { flex: 0 0 auto; color: rgb(65, 144, 249); }
.porte-scene-statut[data-ton="orange"] { font-weight: 500; color: rgb(217, 119, 6); }
.porte-scene-point { flex: 0 0 auto; width: 8px; height: 8px; margin: 0px 3px; border-radius: 50%; background: rgb(217, 119, 6); }
.porte-consignes { margin: -14px 0px 24px; padding-left: 20px; list-style: decimal; font-size: 15px; line-height: 24px; color: var(--porte-doux); }
.porte-statut { display: flex; align-items: center; gap: 10px; margin: 0px; font-size: 15px; line-height: 22px; color: var(--porte-encre-2); }
.porte-statut svg { flex: 0 0 auto; color: rgb(65, 144, 249); }
.porte-liens { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px 18px; margin: 14px 0px 0px; font-size: 15px; line-height: 20px; }
.porte-statut + .porte-liens { justify-content: flex-start; margin-top: 22px; }
.porte-liens .porte-lien { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.porte-liens .porte-lien:hover { text-decoration: underline; }
.porte-fenetre { position: absolute; inset: 0px; z-index: 1; border-radius: inherit; background: rgb(15, 15, 18); }
.porte-fenetre[hidden] { display: none; }
.porte-fenetre-interieur { position: absolute; inset: 0px; display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 20px; }
.porte-fenetre-adresse { display: inline-flex; align-items: center; gap: 6px; height: 28px; margin: 0px; padding: 0px 12px; border-radius: 14px; background: rgba(255, 255, 255, 0.07); font-size: 13px; font-weight: 500; color: rgb(161, 161, 170); }
.porte-fenetre-ecran { position: relative; flex: 1 1 0%; width: 100%; min-height: 0px; border-radius: 14px; overflow: hidden; background: rgb(246, 246, 247); }
.porte-fenetre-ecran .cnx-ecran { border-radius: 0px; }
.porte-fenetre-cadre { display: block; width: 100%; height: 100%; border: 0px; }
.porte-fenetre-vide { margin: auto; padding: 0px 24px; font-size: 14px; line-height: 20px; text-align: center; color: rgb(161, 161, 170); }
.porte.is-fenetre { grid-template-columns: minmax(0px, 1fr) clamp(360px, 30vw, 460px); }
.porte.is-fenetre .porte-cote { padding: 52px 40px 40px 48px; }
.porte-gestes { display: grid; gap: 8px; margin: 0px; padding: 0px; list-style: none; }
.porte-geste { display: flex; align-items: center; gap: 14px; min-height: 62px; padding: 10px 18px; border-radius: 14px; background: var(--porte-carte); }
.porte-geste-numero { flex: 0 0 auto; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; font-size: 12px; font-weight: 600; background: var(--porte-encre); color: var(--porte-bouton-texte); }
.porte-geste-numero[data-etat="a-venir"] { background: var(--porte-fond); color: var(--porte-doux); box-shadow: inset 0 0 0 1.5px var(--porte-non); }
.porte-geste-numero[data-etat="faite"] { background: var(--porte-fait); color: rgb(255, 255, 255); }
.porte-geste-textes { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; gap: 2px; }
.porte-geste-titre { font-size: 15px; line-height: 20px; font-weight: 500; color: var(--porte-encre); }
.porte-geste-sous { font-size: 13px; line-height: 18px; color: var(--porte-doux); overflow-wrap: anywhere; }
.porte-geste .porte-lien, .porte-geste-attente { flex: 0 0 auto; white-space: nowrap; }
.porte-geste-attente { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; color: var(--porte-doux); }
.porte-gestes + .porte-boites { margin-top: 8px; }
.porte-boite svg { flex: 0 0 auto; color: var(--porte-doux); }
.porte-boite-adresse { min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--porte-encre); }
.porte-mot { flex: 0 0 auto; padding: 2px 8px; border-radius: 999px; font-size: 12px; line-height: 16px; font-weight: 500; background: var(--porte-segment); color: var(--porte-doux); }
.porte-mot[data-ton="orange"] { background: rgb(254, 243, 199); color: rgb(146, 64, 14); }
.porte-mot[data-ton="vert"] { background: var(--porte-fait-fond); color: var(--porte-fait); }
@media (prefers-reduced-motion: reduce){
.porte-scene-etape[data-etat="en_cours"] .porte-tuile { animation: auto ease 0s 1 normal none running none; }
.porte-choix, .porte-tuile, .porte-scene-barre span, .porte-teintes button { transition: none; }
}
.porte-champ.a-oeil .porte-saisie { padding-right: 52px; }
.porte-oeil { position: absolute; top: 50%; right: 8px; display: grid; place-items: center; width: 38px; height: 38px; border: 0px; border-radius: 10px; background: none; color: var(--porte-pale); cursor: pointer; transform: translateY(-50%); transition: color 0.15s; }
.porte-oeil:hover { color: var(--porte-encre-2); }
.porte-oeil:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: -2px; }
@media (pointer: coarse){
.porte-oeil::after { content: ""; position: absolute; inset: -3px; }
}
.porte-saisie[aria-invalid="true"], .porte-saisie[aria-invalid="true"]:focus {
  background: var(--porte-champ-focus); box-shadow: 0 0 0 1.5px var(--porte-erreur), 0 0 0 5px var(--porte-erreur);
  @supports (color: color-mix(in lab, red, red)) {
  box-shadow: 0 0 0 1.5px var(--porte-erreur), 0 0 0 5px color-mix(in srgb, var(--porte-erreur) 16%, transparent);
}
}
.porte-ou { display: flex; align-items: center; gap: 14px; margin: 24px 0px; font-size: 14px; line-height: 18px; color: var(--porte-pale); }
.porte-ou::before, .porte-ou::after { content: ""; flex: 1 1 0%; height: 1px; background: var(--porte-filet); }
.porte-fournisseurs { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; }
.porte-fournisseur { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 0px; height: 54px; padding: 0px 10px; border: 1px solid var(--porte-fournisseur-filet); border-radius: 12px; background: var(--porte-fournisseur-fond); color: var(--porte-encre); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 16px; font-weight: 500; letter-spacing: -0.008em; white-space: nowrap; cursor: pointer; transition: background 0.15s, transform 0.12s; }
.porte-fournisseur:hover { background: var(--porte-champ); }
.porte-fournisseur:active { transform: scale(0.985); }
.porte-fournisseur:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: 2px; }
.porte-fournisseur svg { flex: 0 0 auto; width: auto; height: 20px; }
.porte-confiance { align-items: center; }
.porte-confiance svg { flex: 0 0 auto; color: var(--porte-doux); }
.porte-bas + .porte-bas { margin-top: 10px; }
.porte-bloc-ip + .porte-champs { margin-top: 12px; }
@media (prefers-reduced-motion: reduce){
.porte-oeil, .porte-fournisseur { transition: none; }
}
@media (max-width: 900px){
.porte-fournisseurs { gap: 8px; }
.porte-fournisseur { gap: 7px; padding: 0px 6px; font-size: 14px; }
.porte-fournisseur svg { height: 18px; }
.porte-scene { --tuile: 56px; --rayon-tuile: 16px; padding: 22px 6px 18px; }
.porte-scene.is-petite { --tuile: 46px; --rayon-tuile: 14px; }
.porte-scene-nom, .porte-scene.is-petite .porte-scene-nom { font-size: 12px; line-height: 16px; }
.porte-scene-valeur { font-size: 11px; }
.porte-tuile-fait { top: -5px; right: -5px; width: 18px; height: 18px; }
.porte-methodes { margin-top: -14px; }
.porte.is-fenetre .porte-panneau { height: min(640px, 76dvh); }
.porte.is-fenetre .porte-cote { padding: 22px 16px 40px; }
.porte-fenetre-interieur { padding: 10px; gap: 10px; }
.porte-ligne { flex-wrap: wrap; padding: 12px 16px; }
.porte-ligne strong { white-space: normal; }
}
@keyframes dv4-tourne { 
  100% { transform: rotate(360deg); }
}
.dv4-tourne { animation: 0.8s linear 0s infinite normal none running dv4-tourne; }
@keyframes v5-pj-entree { 
  0% { opacity: 0; filter: blur(4px); transform: scale(0.8); }
  100% { opacity: 1; filter: none; transform: none; }
}
@keyframes v5-pj-vague { 
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
@keyframes v5-miroite { 
  0% { background-position: 200% center; }
  100% { background-position: -100% center; }
}
@keyframes v5-lever { 
  0% { opacity: 0; filter: blur(6px); transform: translateY(4px); clip-path: inset(0px 0px 100%); }
  100% { opacity: 1; filter: none; transform: none; clip-path: inset(-4px 0px -6px); }
}
@keyframes v5-rail-coude { 
  0% { stroke-dasharray: 0, 1; }
  100% { stroke-dasharray: 1, 1; }
}
@keyframes v5-rail-ligne { 
  0% { transform: scaleY(0); }
  100% { transform: scaleY(1); }
}
@keyframes v5-selecteur-entree { 
  0% { opacity: 0; transform: scale(0.95); filter: blur(2px); }
  100% { opacity: 1; transform: none; filter: none; }
}
@keyframes v5-etoile { 
  0%, 100% { opacity: 0; transform: scale(0); }
  40% { opacity: 1; transform: scale(1); }
  60% { opacity: 0.9; transform: scale(0.8); }
}
@keyframes v5-point { 
  0% { opacity: 1; }
  30% { opacity: 0.12; }
  66% { opacity: 0.12; }
  100% { opacity: 1; }
}
@keyframes v5-gen-deplier { 
  0% { opacity: 0; filter: blur(6px); clip-path: inset(0px 0px 100% round 20px); }
  100% { opacity: 1; filter: none; clip-path: inset(0px round 20px); }
}
@keyframes v5-goutte { 
  0%, 37% { opacity: 0.04; }
  50% { opacity: 0.9; }
  63%, 100% { opacity: 0.04; }
}
@keyframes v5-flap-rise { 
  0% { filter: brightness(0.86); transform: perspective(70px) rotateX(90deg); }
  70% { transform: perspective(70px) rotateX(-9deg); }
  86% { transform: perspective(70px) rotateX(4deg); }
  100% { filter: brightness(1); transform: perspective(70px) rotateX(0deg); }
}
@keyframes v5-gen-reveal { 
  0% { --v5-reveal: 0%; opacity: 0; filter: blur(10px); }
  45% { opacity: 1; filter: none; }
  100% { --v5-reveal: 132%; opacity: 1; filter: none; }
}
@keyframes v5-filet { 
  0% { transform: translateX(-100%); }
  100% { transform: translateX(300%); }
}
@keyframes v5-relais-entre { 
  0% { opacity: 0; transform: translate(var(--v5-relais-x, 0), var(--v5-relais-y, 0)); }
}
@keyframes v5-reflet-attente { 
  100% { transform: translateX(100%); }
}
@keyframes v5-chev-ouvre { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(180deg); }
}
@keyframes v5-chev-ferme { 
  0% { transform: rotate(180deg); }
  100% { transform: rotate(0deg); }
}
@keyframes v5-depli-entre { 
  0% { opacity: 0; transform: translateY(-7px); }
  100% { opacity: 1; transform: none; }
}
@keyframes v5-barre2-entre { 
  0% { opacity: 0; translate: 0px 10px; }
  100% { opacity: 1; translate: 0px; }
}
@keyframes v5-barre2-piece { 
  0% { opacity: 0; translate: 0px 5px; }
  100% { opacity: 1; translate: 0px; }
}
@keyframes v5-bulle-entre { 
  0% { opacity: 0; transform: translate(-50%, 0px) scale(0.94); }
}
@keyframes v5-bulle-entre-haut { 
  0% { opacity: 0; transform: translate(-50%, -100%) scale(0.94); }
}
.v5-bulle-file { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px 6px 9px; border-radius: 8px; background: rgb(31, 31, 36); color: rgb(255, 255, 255); font-family: "SF Pro Text", "SF Pro Display", "SF Pro", Inter, system-ui, sans-serif; font-size: 12.5px; font-weight: 500; line-height: 15px; letter-spacing: -0.005em; font-variant-numeric: tabular-nums; white-space: nowrap; box-shadow: rgba(16, 17, 28, 0.18) 0px 6px 18px; transform: translateY(-50%); animation: 260ms cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal both running v5-bulle-file-entre; }
.v5-bulle-file-point { flex: 0 0 auto; width: 6px; height: 6px; border-radius: 3px; background: rgb(220, 112, 67); }
.v5-bulle-file-texte { animation: 180ms ease 0s 1 normal both running v5-bulle-file-texte; }
.v5-bulle-file.v5-bulle-file-sort { animation: 220ms cubic-bezier(0.4, 0, 0.6, 1) 0s 1 normal both running v5-bulle-file-sort; }
@keyframes v5-bulle-file-entre { 
  0% { opacity: 0; transform: translate(-8px, -50%); }
}
@keyframes v5-bulle-file-sort { 
  100% { opacity: 0; }
}
@keyframes v5-bulle-file-texte { 
  0% { opacity: 0.35; }
}
.brc-pastille { position: fixed; right: 16px; bottom: 56px; z-index: 2147483001; text-decoration: none; }
@media (min-width: 768px){
.brc-pastille { inset: 30px 0px auto; width: fit-content; margin: 0px auto; }
}
body[data-feuille] .brc-pastille { z-index: 1; }
@keyframes v5-otto-respire { 
  0%, 100% { opacity: 0.28; transform: scale(0.78); }
  45% { opacity: 1; transform: scale(1); }
}
@keyframes v5-tourne { 
  100% { --v5-angle: 360deg; }
}
@keyframes v5-menu-apparait { 
  0% { opacity: 0; transform: translateY(-12px) scale(0.94); }
  100% { opacity: 1; transform: none; }
}
@keyframes v5-menu-sortie { 
  0% { opacity: 1; transform: none; }
  100% { opacity: 0; transform: translateY(-8px) scale(0.96); }
}
@keyframes v5-sec-apparait { 
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: none; }
}
@keyframes v5-os { 
  0%, 100% { opacity: 1; }
  50% { opacity: 0.55; }
}
@keyframes v5m-feuille-monte { 
  0% { transform: translateY(100%); }
}
@keyframes v5-otto-point { 
  0%, 80%, 100% { opacity: 0.3; transform: none; }
  40% { opacity: 1; transform: translateY(calc(var(--k) * -3px)); }
}
@keyframes v5-otto-tourne { 
  100% { transform: rotate(360deg); }
}
@keyframes v5-apparait { 
  0% { opacity: 0; transform: translateY(-6px); }
  100% { opacity: 1; transform: none; }
}
@keyframes v5-prix-maj { 
  0%, 71% { background-color: rgb(234, 241, 254); box-shadow: rgb(234, 241, 254) 0px 0px 0px 6px; }
  100% { background-color: rgba(234, 241, 254, 0); box-shadow: rgba(234, 241, 254, 0) 0px 0px 0px 6px; }
}
@keyframes v5-prix-maj-sombre { 
  0%, 71% { background-color: rgb(31, 63, 110); box-shadow: rgb(31, 63, 110) 0px 0px 0px 6px; }
  100% { background-color: rgba(31, 63, 110, 0); box-shadow: rgba(31, 63, 110, 0) 0px 0px 0px 6px; }
}
:root { --pop-feuille-fond: #FAFAFA; --pop-feuille-trait: #E4E4E7; --pop-feuille-voile: rgba(17, 17, 21, 0.30); --pop-feuille-filet: #F0F0F2; --pop-panneau-fond: #FFFFFF; --pop-panneau-trait: #ECECEF; --pop-encre-principale: #18181B; --pop-encre-seconde: #71717A; --pop-encre-faible: #909099; --pop-encre-inverse: #FFFFFF; --pop-encre-sur-couleur: #FFFFFF; --pop-champ-fond: #FFFFFF; --pop-champ-trait: #E4E4E7; --pop-champ-focus: #18181B; --pop-champ-anneau: rgba(24, 24, 27, 0.10); --pop-champ-tiret: #D4D4D8; --pop-champ-desactive: #F4F4F5; --pop-pastille-fond: #F2F2F5; --pop-rangee-survol: #F4F4F5; --pop-action-encre: #18181B; --pop-action-bleu: #2475DC; --pop-action-danger: #D34531; --pop-action-verre: rgba(178, 178, 178, 0.20); --pop-action-selection: rgba(65, 144, 249, 0.10); --pop-segment-encre: #6A6A73; --pop-ton-neutre-fond: #F2F2F5; --pop-ton-neutre-encre: #6E6E77; --pop-ton-vert-fond: #E7F5ED; --pop-ton-vert-encre: #007F3C; --pop-ton-orange-fond: #FDF3E0; --pop-ton-orange-encre: #A06105; --pop-ton-rouge-fond: #FDF0EF; --pop-ton-rouge-encre: #C93C28; --pop-ton-bleu-fond: #E8EFFD; --pop-ton-bleu-encre: #166AD0; --pop-media-fond: #0B0D10; --pop-media-surface: #26282D; --pop-media-verre: rgba(255, 255, 255, 0.14); --pop-media-encre: #FFFFFF; --pop-code-fond: #FFFFFF; --pop-code-encre: #000000; --pop-rayon-carte: 27px; --pop-rayon-panneau: 21px; --pop-rayon-tuile: 12px; --pop-rayon-zone: 10px; --pop-rayon-champ: 9px; --pop-rayon-vignette: 8px; --pop-rayon-pastille: 6px; --pop-rayon-case: 5px; --pop-rayon-pilule: 999px; --pop-espace-panneau: 6px; --pop-espace-pied: 20px; --pop-espace-sections: 20px; --pop-espace-entete: 12px; --pop-espace-libelle: 6px; --pop-espace-colonnes: 16px; --pop-espace-boutons: 8px; --pop-espace-champ: 14px; --pop-espace-rangee: 12px; --pop-espace-bouton: 20px; --pop-espace-icone: 8px; --pop-hauteur-champ: 40px; --pop-hauteur-bouton: 38px; --pop-hauteur-rangee: 44px; --pop-hauteur-rangee-double: 52px; --pop-largeur-petite: 440px; --pop-largeur-moyenne: 560px; --pop-largeur-grande: 720px; --pop-largeur-double: 1040px; --pop-ombre-feuille: 0 16px 40px -8px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.04); --pop-ombre-bouton: 0 1px 2px rgba(0, 0, 0, 0.05); --pop-verre-arete: inset 0 0 0 1px rgba(0, 0, 0, 0.08), inset 1px 1px 0 0 rgba(255, 255, 255, 0.85); --pop-verre-creux: inset 2px 2px 5px rgba(0, 0, 0, 0.05); --pop-verre-lisere: inset 0 0 3px 1px rgba(255, 255, 255, 0.39); }
.pop-voile { background: var(--pop-feuille-voile); animation: 160ms ease-out 0s 1 normal both running dv4-voile-entre; }
.pop-feuille { box-sizing: border-box; display: flex; flex-direction: column; background: var(--pop-feuille-fond); border: 1px solid var(--pop-feuille-trait); border-radius: var(--pop-rayon-carte); box-shadow: var(--pop-ombre-feuille); color: var(--pop-encre-principale); scrollbar-width: thin; transform: scale(var(--k, 1)); animation: 190ms cubic-bezier(0.16, 1, 0.3, 1) 0s 1 normal both running dv4-feuille-entre; }
@media (prefers-reduced-motion: reduce){
.pop-feuille, .pop-voile { animation: auto ease 0s 1 normal none running none; }
}
.pop-tiroir-voile { position: fixed; inset: 0px; z-index: 230; opacity: 0; transition: opacity 260ms ease-out; animation: auto ease 0s 1 normal none running none; }
.pop-tiroir-voile[data-entre] { opacity: 1; }
.pop-feuille.pop-tiroir { position: fixed; top: 14px; right: 14px; z-index: 231; height: calc((100vh - 28px) / var(--k, 1)); max-height: none; overflow: hidden; transform-origin: right top; animation: auto ease 0s 1 normal none running none; transform: translateX(calc(100% + 40px)) scale(var(--k, 1)); transition: transform 420ms cubic-bezier(0.32, 0.72, 0, 1); }
.pop-feuille.pop-tiroir[data-entre] { transform: scale(var(--k, 1)); }
.pop-tiroir .pop-tiroir-zone { flex: 1 1 auto; min-height: 0px; overflow-y: auto; scrollbar-width: thin; display: flex; flex-direction: column; gap: var(--pop-espace-panneau); }
.pop-tiroir .pop-tiroir-zone > .pop-panneau { flex: 0 0 auto; }
.pop-tiroir .pop-tiroir-zone > .pop-panneau:last-child { flex: 1 0 auto; }
.pop-tiroir[data-sans-pied] .pop-tiroir-zone { padding-bottom: var(--pop-espace-panneau); }
@media (prefers-reduced-motion: reduce){
.pop-feuille.pop-tiroir, .pop-tiroir-voile { transition: none; }
}
html.v5-mobile .pop-feuille.pop-tiroir { top: calc(8px + env(safe-area-inset-top, 0px)); bottom: calc(8px + env(safe-area-inset-bottom, 0px)); left: 8px; right: 8px; height: auto; border-radius: 20px; transform: translateX(calc(100% + 16px)); transform-origin: center center; width: auto !important; }
html.v5-mobile .pop-feuille.pop-tiroir[data-entre] { transform: none; }
.pop-tete { padding: 18px var(--pop-espace-pied) 14px; flex: 0 0 auto; }
.pop-zone { padding: 0 var(--pop-espace-panneau); flex: 0 0 auto; }
.pop-zone-sections { display: flex; flex-direction: column; gap: var(--pop-espace-panneau); }
.pop-zone-colonnes { display: flex; align-items: flex-start; gap: var(--pop-espace-panneau); }
.pop-colonne { display: flex; flex-direction: column; gap: var(--pop-espace-panneau); flex: 1 1 0px; min-width: 0px; }
.pop-colonne > .pop-panneau { display: flex; flex-direction: column; gap: var(--pop-espace-sections); }
html.v5-mobile .pop-zone-colonnes { flex-direction: column; align-items: stretch; }
html.v5-mobile .pop-zone-colonnes > .pop-colonne { flex: 1 1 auto !important; }
.pop-bascules { display: flex; flex-wrap: wrap; gap: 6px; }
.pop-bascule { display: inline-flex; align-items: center; height: 32px; padding: 0px 12px; box-sizing: border-box; border: 1px solid var(--pop-champ-trait); border-radius: var(--pop-rayon-pastille); background: var(--pop-champ-fond); font-style: inherit; font-variant: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; font-weight: 500; line-height: 16px; color: var(--pop-encre-principale); cursor: pointer; }
.pop-bascule[aria-pressed="true"] { background: var(--pop-action-bleu); border-color: transparent; color: var(--pop-encre-sur-couleur); }
.pop-bascule:disabled { cursor: default; color: var(--pop-encre-faible); background: transparent; }
.pop-bascule-bientot { margin-left: 6px; font-size: 11px; color: var(--pop-encre-faible); }
.pop-regle { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr) minmax(0px, 1fr) 32px; gap: 12px; align-items: center; }
.pop-regle-retirer { width: 32px; height: 32px; display: grid; place-items: center; border: 0px; border-radius: 8px; background: transparent; color: var(--pop-encre-seconde); cursor: pointer; }
.pop-regle-retirer:hover { background: var(--pop-rangee-survol); }
html.v5-mobile .pop-regle { grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr) 32px; }
html.v5-mobile .pop-regle > :first-child { grid-column: 1 / -1; }
.pop-otto-ligne { display: flex; align-items: center; gap: 10px; height: 52px; padding: 0px 7px 0px 12px; box-sizing: border-box; border: 1px solid var(--pop-champ-trait); border-radius: 14px; background: var(--pop-champ-fond); }
.pop-otto-ligne input { flex: 1 1 0%; min-width: 0px; border: 0px; outline: none; background: transparent; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 16px; color: var(--pop-encre-principale); }
.pop-otto-envoyer { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border: 0px; border-radius: 19px; background: var(--pop-action-encre); color: var(--pop-encre-inverse); cursor: pointer; }
.pop-otto-envoyer:disabled { opacity: 0.4; cursor: default; }
.pop-otto-reponse { margin-top: 12px; padding: 0px 4px; font-size: 14px; line-height: 20px; color: var(--pop-encre-seconde); }
.pop-section-titre { font-size: 16px; font-weight: 500; line-height: 20px; color: var(--pop-encre-principale); }
.pop-feuille[data-confirmation] .pop-zone { padding-top: var(--pop-espace-panneau); }
.pop-feuille[data-sans-pied] .pop-zone { padding-bottom: var(--pop-espace-panneau); }
.pop-panneau { display: flex; flex-direction: column; gap: var(--pop-espace-sections); padding: var(--pop-espace-sections); background: var(--pop-panneau-fond); border: 1px solid var(--pop-panneau-trait); border-radius: var(--pop-rayon-panneau); min-width: 0px; }
.pop-entete { display: flex; align-items: flex-start; gap: var(--pop-espace-entete); }
.pop-entete-textes { flex: 1 1 0%; min-width: 0px; min-height: 40px; display: flex; flex-direction: column; justify-content: center; gap: 3px; }
.pop-titre { font-size: 17px; font-weight: 500; line-height: 22px; color: var(--pop-encre-principale); }
.pop-sous { font-size: 14px; font-weight: 500; line-height: 20px; color: var(--pop-encre-seconde); }
.pop-pastille-entete { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: var(--pop-rayon-tuile); color: var(--pop-encre-principale); background: var(--pop-action-verre); box-shadow: var(--pop-verre-creux), var(--pop-verre-arete); }
.pop-pastille-entete[data-danger] { background: var(--pop-ton-rouge-fond); color: var(--pop-ton-rouge-encre); box-shadow: var(--pop-verre-lisere), var(--pop-verre-arete); }
.pop-pastille-entete svg { width: 16px; height: 16px; }
.pop-fermer { width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; padding: 0px; border: 0px; border-radius: 9px; cursor: pointer; color: var(--pop-encre-principale); background: var(--pop-action-verre); box-shadow: var(--pop-verre-creux), var(--pop-verre-arete); transition: filter 0.15s, transform 0.1s; }
.pop-fermer:not(:disabled):hover { filter: brightness(0.97); }
.pop-fermer:not(:disabled):active { transform: scale(0.96); }
.pop-fermer:disabled { opacity: 0.5; cursor: default; }
.pop-pied { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; flex: 0 0 auto; gap: var(--pop-espace-boutons); padding: 14px var(--pop-espace-pied) 16px; }
.pop-feuille[data-editeur] > .pop-pied { position: sticky; bottom: 0px; z-index: 2; background: var(--pop-feuille-fond); }
.pop-pied-aide { margin-right: auto; display: inline-flex; align-items: center; gap: 8px; min-width: 0px; font-size: 13px; line-height: 16px; color: var(--pop-encre-seconde); }
.pop-btn { height: var(--pop-hauteur-bouton); padding: 0 var(--pop-espace-bouton); display: inline-flex; align-items: center; justify-content: center; gap: var(--pop-espace-icone); border: 0px; border-radius: var(--pop-rayon-champ); font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; white-space: nowrap; cursor: pointer; box-sizing: border-box; transition: filter 0.15s, transform 0.1s, opacity 0.15s; }
.pop-btn svg { width: 16px; height: 16px; flex: 0 0 auto; }
.pop-btn:not(:disabled):active { transform: scale(0.98); }
.pop-btn:disabled { opacity: 0.5; cursor: default; }
.pop-btn-encre { background: var(--pop-action-encre); color: var(--pop-encre-inverse); box-shadow: var(--pop-verre-lisere), var(--pop-verre-arete); }
.pop-btn-bleu { background: var(--pop-action-bleu); color: var(--pop-encre-sur-couleur); box-shadow: var(--pop-verre-lisere), var(--pop-verre-arete); }
.pop-btn-danger { background: var(--pop-action-danger); color: var(--pop-encre-sur-couleur); box-shadow: var(--pop-verre-lisere), var(--pop-verre-arete); }
.pop-btn-verre { background: var(--pop-action-verre); color: var(--pop-encre-principale); box-shadow: var(--pop-verre-creux), var(--pop-verre-arete); }
.pop-btn-discret { background: transparent; color: var(--pop-encre-seconde); }
.pop-btn-encre:not(:disabled):hover, .pop-btn-bleu:not(:disabled):hover, .pop-btn-danger:not(:disabled):hover { filter: brightness(1.08); }
.pop-btn-verre:not(:disabled):hover { filter: brightness(0.97); }
.pop-btn-discret:not(:disabled):hover { background: var(--pop-rangee-survol); color: var(--pop-encre-principale); }
.pop-feuille .dv4-btn-neutre:not(.pop-btn) { background: var(--pop-action-verre) !important; border-color: transparent !important; color: var(--pop-encre-principale) !important; box-shadow: var(--pop-verre-creux), var(--pop-verre-arete) !important; }
.pop-feuille .dv4-btn-primaire:not(.pop-btn), .pop-feuille .dv4-btn-encre:not(.pop-btn) { background: var(--pop-action-encre) !important; border-color: transparent !important; color: var(--pop-encre-inverse) !important; box-shadow: var(--pop-verre-lisere), var(--pop-verre-arete) !important; }
.pop-feuille .dv4-btn-danger:not(.pop-btn) { background: var(--pop-action-danger) !important; border-color: transparent !important; color: var(--pop-encre-sur-couleur) !important; box-shadow: var(--pop-verre-lisere), var(--pop-verre-arete) !important; }
.pop-feuille .dv4-btn-neutre:not(.pop-btn):not(:disabled):hover { filter: brightness(0.97); }
.pop-feuille .dv4-btn-primaire:not(.pop-btn):not(:disabled):hover, .pop-feuille .dv4-btn-encre:not(.pop-btn):not(:disabled):hover, .pop-feuille .dv4-btn-danger:not(.pop-btn):not(:disabled):hover { filter: brightness(1.08); }
.pop-champ { display: flex; flex-direction: column; gap: var(--pop-espace-libelle); min-width: 0px; }
.pop-lib { display: flex; gap: 3px; font-size: 13px; font-weight: 500; line-height: 16px; color: var(--pop-encre-seconde); }
.pop-lib-requis { color: var(--pop-ton-rouge-encre); }
.pop-recap { display: flex; flex-direction: column; }
.pop-recap-ligne { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 32px; }
.pop-recap-lib { flex: 0 0 auto; font-size: 14px; font-weight: 500; line-height: 20px; color: var(--pop-encre-seconde); }
.pop-recap-val { min-width: 0px; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); text-align: right; overflow-wrap: anywhere; }
.pop-recap-ligne[data-accent] .pop-recap-val { font-size: 22px; font-weight: 600; line-height: 28px; }
.pop-texte { margin: 0px; font-size: 14px; font-weight: 500; line-height: 20px; color: var(--pop-encre-seconde); }
.pop-aide { font-size: 13px; line-height: 16px; color: var(--pop-encre-seconde); }
.pop-aide[data-erreur] { color: var(--pop-ton-rouge-encre); }
.pop-aide-bouton { padding: 0px; border: 0px; background: none; font: inherit; color: var(--pop-encre-principale); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.pop-saisie { width: 100%; height: var(--pop-hauteur-champ); box-sizing: border-box; padding: 0 var(--pop-espace-champ); background: var(--pop-champ-fond); color: var(--pop-encre-principale); border: 1px solid var(--pop-champ-trait); border-radius: var(--pop-rayon-champ); font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; outline: none; transition: border-color 0.15s, box-shadow 0.15s; }
.pop-saisie::placeholder { color: var(--pop-encre-faible); font-weight: 400; }
.pop-saisie:focus, .pop-saisie:focus-within { border-color: var(--pop-champ-focus); box-shadow: 0 0 0 3px var(--pop-champ-anneau); }
.pop-recherche-champ, .pop-saisie-interne { flex: 1 1 0%; min-width: 0px; height: 100%; padding: 0px; border: 0px; outline: none; background: transparent; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); }
.pop-recherche-champ::placeholder, .pop-saisie-interne::placeholder { color: var(--pop-encre-faible); font-weight: 400; }
.pop-saisie-unite { display: flex; align-items: center; gap: 8px; cursor: text; }
.pop-unite { flex: 0 0 auto; font-size: 15px; line-height: 18px; font-weight: 500; color: var(--pop-encre-seconde); pointer-events: none; }
.pop-saisie-unite[data-desactive] { background: var(--pop-champ-desactive); cursor: not-allowed; }
.pop-saisie-unite[data-desactive] .pop-unite, .pop-saisie-unite[data-desactive] .pop-saisie-interne { color: var(--pop-encre-faible); }
.pop-saisie-unite[data-erreur] { border-color: var(--pop-ton-rouge-encre); }
.pop-saisie:disabled { background: var(--pop-champ-desactive); color: var(--pop-encre-faible); }
.pop-saisie[aria-invalid="true"] { border-color: var(--pop-ton-rouge-encre); }
textarea.pop-saisie { height: auto; min-height: 96px; padding: 10px var(--pop-espace-champ); resize: vertical; }
select.pop-saisie { appearance: none; cursor: pointer; padding-right: 38px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2371717A' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 9.00005C18 9.00005 13.5811 15 12 15C10.4188 15 6 9 6 9'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 16px 16px; }
.pop-feuille input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not(.pop-saisie):not(.pop-recherche-champ):not(.pop-saisie-interne):not(.pop-titre-champ), .pop-feuille textarea:not(.pop-saisie), .pop-feuille select:not(.pop-saisie) { background-color: var(--pop-champ-fond) !important; border-color: var(--pop-champ-trait) !important; color: var(--pop-encre-principale) !important; }
.pop-feuille input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not(.pop-saisie):not(.pop-recherche-champ):not(.pop-saisie-interne):not(.pop-titre-champ):focus, .pop-feuille textarea:not(.pop-saisie):focus, .pop-feuille select:not(.pop-saisie):focus { border-color: var(--pop-champ-focus) !important; box-shadow: 0 0 0 3px var(--pop-champ-anneau) !important; }
.pop-feuille input::placeholder, .pop-feuille textarea::placeholder { color: var(--pop-encre-faible); }
.pop-feuille input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not(.pop-saisie):not(.pop-recherche-champ):not(.pop-saisie-interne):not(.pop-titre-champ):disabled, .pop-feuille textarea:not(.pop-saisie):disabled, .pop-feuille select:not(.pop-saisie):disabled { cursor: not-allowed; background-color: var(--pop-champ-desactive) !important; color: var(--pop-encre-faible) !important; }
.pop-feuille [aria-busy="true"] { pointer-events: none; }
.pop-seg { position: relative; display: inline-flex; gap: 2px; padding: 3px; border-radius: var(--pop-rayon-zone); background: var(--pop-action-verre); box-shadow: var(--pop-verre-creux), var(--pop-verre-arete); }
.pop-seg:not([data-plein]) { align-self: flex-start; max-width: 100%; }
.pop-seg[data-plein] { display: flex; width: 100%; box-sizing: border-box; }
.pop-seg-pastille { position: absolute; top: 3px; height: 30px; border-radius: var(--pop-rayon-vignette); background: var(--pop-action-bleu); transition: left 0.26s cubic-bezier(0.32, 0.72, 0, 1), width 0.26s cubic-bezier(0.32, 0.72, 0, 1); }
.pop-seg-item { position: relative; z-index: 1; height: 30px; padding: 0px 14px; border: 0px; background: transparent; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; white-space: nowrap; cursor: pointer; color: var(--pop-segment-encre); transition: color 0.2s; }
.pop-seg[data-plein] .pop-seg-item { flex: 1 1 0%; }
.pop-seg-item[data-actif] { color: var(--pop-encre-sur-couleur); }
.pop-note { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border-radius: var(--pop-rayon-zone); background: var(--pop-ton-neutre-fond); color: var(--pop-ton-neutre-encre); font-size: 13px; line-height: 16px; }
.pop-note svg { width: 16px; height: 16px; flex: 0 0 auto; }
.pop-note[data-ton="info"] { background: var(--pop-ton-bleu-fond); color: var(--pop-ton-bleu-encre); }
.pop-note[data-ton="danger"] { background: var(--pop-ton-rouge-fond); color: var(--pop-ton-rouge-encre); }
.pop-ton { display: inline-flex; align-items: center; height: 22px; padding: 0px 8px; border-radius: var(--pop-rayon-pastille); font-size: 12px; font-weight: 500; line-height: 16px; white-space: nowrap; background: var(--pop-ton-neutre-fond); color: var(--pop-ton-neutre-encre); }
.pop-ton[data-ton="vert"] { background: var(--pop-ton-vert-fond); color: var(--pop-ton-vert-encre); }
.pop-ton[data-ton="orange"] { background: var(--pop-ton-orange-fond); color: var(--pop-ton-orange-encre); }
.pop-ton[data-ton="rouge"] { background: var(--pop-ton-rouge-fond); color: var(--pop-ton-rouge-encre); }
.pop-ton[data-ton="bleu"] { background: var(--pop-ton-bleu-fond); color: var(--pop-ton-bleu-encre); }
.pop-paire { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 12px; }
.pop-paire-cadre { position: relative; aspect-ratio: 1 / 1; border-radius: 12px; overflow: hidden; background: var(--pop-ton-neutre-fond); }
.pop-paire-cadre img, .pop-paire-sans { display: block; width: 100%; height: 100%; object-fit: cover; }
.pop-paire-etiq { position: absolute; top: 10px; left: 10px; display: inline-flex; align-items: center; height: 24px; padding: 0px 9px; border-radius: 7px; background: rgb(255, 255, 255); color: rgb(24, 24, 27); font-size: 12px; font-weight: 500; line-height: 16px; box-shadow: rgba(0, 0, 0, 0.08) 0px 1px 2px; }
.pop-paire-sous { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 10px; }
.pop-paire-sous b { font-size: 16px; font-weight: 500; line-height: 20px; color: var(--pop-encre-principale); font-variant-numeric: tabular-nums; }
.pop-paire-sous span { font-size: 13px; line-height: 16px; color: var(--pop-encre-faible); white-space: nowrap; }
.pop-raisons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.pop-raison { display: inline-flex; align-items: center; gap: 6px; height: 29px; padding: 0px 12px 0px 10px; border-radius: 15px; font-size: 13px; font-weight: 500; line-height: 16px; white-space: nowrap; background: var(--pop-ton-neutre-fond); color: var(--pop-ton-neutre-encre); }
.pop-raison[data-ok="oui"] { background: var(--pop-ton-vert-fond); color: var(--pop-ton-vert-encre); }
.pop-raison[data-ok="non"] { background: var(--pop-ton-orange-fond); color: var(--pop-ton-orange-encre); }
.pop-paire-plustard { margin-right: auto; }
html.v5-mobile .pop-feuille .dv4-pied.pop-pied > .pop-paire-plustard { order: 3; flex: 1 0 100%; margin-right: 0px; }
.pop-filet { height: 1px; background: var(--pop-feuille-filet); border: 0px; margin: 0px; }
.pop-btn-petit { height: 30px; }
.pop-lecture { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px 14px; border-radius: var(--pop-rayon-zone); background: var(--pop-ton-neutre-fond); }
.pop-lecture-haut { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 16px; }
.pop-lecture-texte { font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); white-space: pre-wrap; overflow-wrap: anywhere; }
.pop-liste { display: flex; flex-direction: column; gap: 2px; max-height: 340px; overflow-y: auto; }
.pop-rangee { display: flex; align-items: center; gap: var(--pop-espace-rangee); width: 100%; box-sizing: border-box; min-height: var(--pop-hauteur-rangee); padding: 6px 12px 6px 10px; border: 0px; border-radius: var(--pop-rayon-zone); background: transparent; text-align: left; cursor: pointer; font-family: inherit; color: var(--pop-encre-seconde); font-size: 15px; font-weight: 500; line-height: 18px; }
.pop-rangee:hover, .pop-rangee[data-actif] { color: var(--pop-encre-principale); }
.pop-rangee-vignette { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; object-fit: cover; border-radius: var(--pop-rayon-vignette); background: var(--pop-pastille-fond); color: var(--pop-encre-faible); }
.pop-rangee-textes { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; gap: 2px; }
.pop-rangee-titre { font-size: 16px; font-weight: 500; line-height: 20px; color: inherit; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pop-rangee-sous { font-size: 13px; font-weight: 400; line-height: 16px; color: var(--pop-encre-seconde); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pop-rangee-fin { flex: 0 0 auto; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-seconde); }
.pop-rangee:has(.pop-rangee-sous), .pop-rangee:has(.pop-rangee-vignette) { min-height: var(--pop-hauteur-rangee-double); }
.pop-rangee[data-exclue], .pop-rangee[data-exclue] .pop-rangee-sous, .pop-rangee[data-exclue] .pop-rangee-fin { color: var(--pop-encre-faible); }
.pop-rangee[data-fixe] { cursor: default; color: var(--pop-encre-principale); }
html .v5-credits-ligne:hover { background: var(--pop-rangee-survol) !important; }
html .v5-credits-btn:hover { background: var(--pop-rangee-survol) !important; }
html .v5-credits-lien:hover { color: var(--pop-encre-principale) !important; }
.pop-rangee[data-lien] { color: var(--pop-encre-principale); }
.pop-liste[data-filets] { gap: 0px; }
.pop-liste[data-filets] > .pop-rangee + .pop-rangee { border-top: 1px solid var(--pop-feuille-filet); border-radius: 0px; }
.pop-case { width: 16px; height: 16px; flex: 0 0 auto; box-sizing: border-box; display: grid; place-items: center; border-radius: var(--pop-rayon-case); border: 1px solid var(--pop-champ-tiret); background: var(--pop-champ-fond); color: var(--pop-encre-sur-couleur); }
.pop-case[data-coche] { background: var(--pop-action-bleu); border-color: transparent; }
.pop-coches { display: flex; flex-direction: column; gap: 2px; }
.pop-coche { display: flex; align-items: center; gap: 10px; min-height: 28px; padding: 0px; border: 0px; background: transparent; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-seconde); cursor: pointer; text-align: left; }
.pop-coche[data-coche] { color: var(--pop-encre-principale); }
.pop-coche:disabled { cursor: default; opacity: 0.6; }
.pop-puces { display: flex; flex-wrap: wrap; gap: 8px; }
.pop-puce { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0px 8px 0px 10px; border: 0px; border-radius: var(--pop-rayon-pastille); background: var(--pop-pastille-fond); color: var(--pop-encre-principale); font-family: inherit; font-size: 13px; font-weight: 500; line-height: 16px; cursor: pointer; }
.pop-puce svg { color: var(--pop-encre-seconde); }
.pop-deroulant { position: absolute; top: calc(100% + 4px); left: 0px; right: 0px; z-index: 40; max-height: 230px; overflow-y: auto; padding: 4px; background: var(--pop-panneau-fond); border: 1px solid var(--pop-panneau-trait); border-radius: var(--pop-rayon-zone); box-shadow: var(--pop-ombre-feuille); }
.pop-deroulant-item { display: block; width: 100%; box-sizing: border-box; padding: 9px 10px; border: 0px; border-radius: 8px; background: transparent; text-align: left; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); cursor: pointer; }
.pop-deroulant-item:hover { background: var(--pop-rangee-survol); }
.pop-ou { display: flex; align-items: center; gap: 12px; font-size: 13px; line-height: 16px; color: var(--pop-encre-faible); }
.pop-ou::before, .pop-ou::after { content: ""; flex: 1 1 0%; height: 1px; background: var(--pop-feuille-filet); }
.pop-feuille .dv4-liste, .pop-feuille [data-liste] { backdrop-filter: none; border-radius: var(--pop-rayon-zone); box-shadow: none; background: transparent !important; }
.pop-feuille .v5-feuille-ligne { border-radius: var(--pop-rayon-zone); }
.pop-feuille .v5-feuille-ligne:hover { background: var(--pop-rangee-survol) !important; }
.pop-feuille .v5-feuille-ligne[data-actif] { background: var(--pop-action-selection) !important; }
.pop-rangee:hover { background: var(--pop-rangee-survol); }
.pop-rangee[data-actif] { background: var(--pop-action-selection); }
.pop-rangee[data-actif] .pop-rangee-sous, .pop-rangee[data-actif] .pop-rangee-fin { color: var(--pop-ton-neutre-encre); }
.pop-rangee[data-fixe], .pop-rangee[data-fixe]:hover { background: transparent; }
html.v5-mobile .dv4-feuille.pop-feuille { border-bottom: 0px; padding: 0px !important; border-radius: 20px 20px 0px 0px !important; }
html.v5-mobile .pop-feuille .pop-tete { padding: 16px 16px 12px; }
html.v5-mobile .pop-feuille .dv4-pied.pop-pied { bottom: 0px; margin: 0px !important; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)) !important; background: var(--pop-feuille-fond) !important; }
html.v5-mobile .pop-feuille .dv4-pied.pop-pied > .pop-btn { flex: 1 1 auto; min-height: 44px; }
html.v5-mobile .pop-feuille .dv4-pied.pop-pied { flex-wrap: wrap; }
html.v5-mobile .pop-feuille .pop-pied-aide { flex: 1 0 100%; margin-right: 0px; }
html.v5-mobile .pop-feuille .pop-saisie, html.v5-mobile .pop-feuille .pop-recherche-champ, html.v5-mobile .pop-feuille .pop-saisie-interne { font-size: 16px; }
.pop-champ-choix { display: flex; align-items: center; gap: 8px; text-align: left; cursor: pointer; }
.pop-champ-choix:disabled { cursor: not-allowed; background: var(--pop-champ-desactive); color: var(--pop-encre-faible); }
.pop-champ-choix-valeur { flex: 1 1 0%; min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pop-champ-choix[data-sans-valeur] .pop-champ-choix-valeur { color: var(--pop-encre-faible); font-weight: 400; }
.pop-champ-choix svg { color: var(--pop-encre-seconde); }
.pop-champ-choix[aria-expanded="true"]:not(.pop-champ-en-ligne) { border-color: var(--pop-champ-focus); box-shadow: 0 0 0 3px var(--pop-champ-anneau); }
.pop-champ-en-ligne { border: 0px; border-radius: 6px; background: transparent; font-family: inherit; outline: none; white-space: nowrap; }
.pop-champ-en-ligne:hover, .pop-champ-en-ligne[aria-expanded="true"] { color: var(--pop-encre-principale) !important; }
.pop-champ-en-ligne:focus-visible { box-shadow: 0 0 0 2px var(--pop-champ-anneau); }
.pop-champ-choix:focus:not(:focus-visible):not([aria-expanded="true"]) { border-color: var(--pop-champ-trait); box-shadow: none; }
.pop-calendrier { z-index: 10050; width: 322px; box-sizing: border-box; padding: 14px 14px 8px; background: var(--pop-panneau-fond); border: 1px solid var(--pop-panneau-trait); border-radius: 16px; box-shadow: var(--pop-ombre-feuille); color: var(--pop-encre-principale); font-family: inherit; animation: 160ms cubic-bezier(0.16, 1, 0.3, 1) 0s 1 normal both running dv4-feuille-entre; }
.pop-calendrier-tete { display: flex; align-items: center; gap: 4px; height: 32px; padding-left: 6px; }
.pop-calendrier-titre { flex: 1 1 0%; font-size: 16px; font-weight: 600; line-height: 20px; letter-spacing: -0.01em; }
button.pop-calendrier-titre { display: flex; align-items: center; gap: 4px; flex: 1 1 0%; height: 32px; margin-left: -6px; padding: 0px 6px; border: 0px; border-radius: 9px; background: transparent; color: var(--pop-encre-principale); font-family: inherit; text-align: left; cursor: pointer; }
button.pop-calendrier-titre:hover { background: var(--pop-rangee-survol); }
button.pop-calendrier-titre > svg { color: var(--pop-encre-seconde); transition: transform 0.18s; }
button.pop-calendrier-titre[aria-expanded="true"] > svg { transform: rotate(180deg); }
.pop-calendrier-mois { display: grid; grid-template-columns: repeat(3, 1fr); width: 294px; margin-top: 10px; }
.pop-calendrier-mois-choix { height: 48px; border: 0px; padding: 0px; background: transparent; cursor: pointer; font-family: inherit; color: var(--pop-encre-principale); }
.pop-calendrier-mois-choix > span { display: inline-grid; place-items: center; min-width: 84px; height: 36px; padding: 0px 10px; border-radius: 999px; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; }
.pop-calendrier-mois-choix:hover:not(:disabled) > span { background: var(--pop-rangee-survol); }
.pop-calendrier-mois-choix[data-aujourdhui] > span { color: var(--pop-ton-bleu-encre); font-weight: 600; }
.pop-calendrier-mois-choix[data-choisi] > span, .pop-calendrier-mois-choix[data-choisi]:hover > span { background: var(--pop-action-bleu); color: var(--pop-encre-sur-couleur); font-weight: 600; }
.pop-calendrier-mois-choix:disabled { cursor: default; }
.pop-calendrier-mois-choix:disabled > span { color: var(--pop-encre-faible); opacity: 0.55; }
.pop-calendrier-fleche { width: 32px; height: 32px; border: 0px; border-radius: 9px; background: transparent; color: var(--pop-encre-principale); display: grid; place-items: center; cursor: pointer; padding: 0px; }
.pop-calendrier-fleche:hover:not(:disabled) { background: var(--pop-rangee-survol); }
.pop-calendrier-fleche:disabled { color: var(--pop-encre-faible); cursor: default; }
.pop-calendrier-grille { position: relative; width: 294px; margin-top: 10px; }
.pop-calendrier-lettre { position: absolute; top: 0px; width: 42px; text-align: center; font-size: 12px; font-weight: 500; line-height: 16px; color: var(--pop-encre-seconde); }
.pop-calendrier-jour { position: absolute; width: 42px; height: 40px; border: 0px; padding: 0px; background: transparent; cursor: pointer; font-family: inherit; display: grid; place-items: center; color: var(--pop-encre-principale); }
.pop-calendrier-jour > span { display: grid; place-items: center; border-radius: 999px; font-size: 15px; font-weight: 500; letter-spacing: -0.01em; transition: background 120ms, color 120ms; }
.pop-calendrier-jour:hover:not(:disabled) > span { background: var(--pop-rangee-survol); }
.pop-calendrier-jour[data-aujourdhui] > span { color: var(--pop-ton-bleu-encre); font-weight: 600; }
.pop-calendrier-jour[data-choisi] > span, .pop-calendrier-jour[data-choisi]:hover > span { background: var(--pop-action-bleu); color: var(--pop-encre-sur-couleur); font-weight: 600; }
.pop-calendrier-jour:disabled { cursor: default; }
.pop-calendrier-jour:disabled > span { color: var(--pop-encre-faible); opacity: 0.55; }
.pop-calendrier-pied { display: flex; align-items: center; gap: 8px; margin-top: 4px; padding-top: 8px; border-top: 1px solid var(--pop-feuille-filet); }
.pop-calendrier-pied .pop-btn { padding: 0px 10px; }
.pop-phrase-zone { display: flex; flex-direction: column; gap: 18px; padding: 6px 4px 2px; }
.pop-phrase { margin: 0px; font-size: 24px; font-weight: 400; line-height: 1.75; letter-spacing: -0.012em; color: var(--pop-encre-principale); text-wrap: pretty; }
.pop-jeton { display: inline; margin: 0px 1px; padding: 2px 8px; border: 0px; border-radius: 8px; cursor: pointer; font-style: inherit; font-variant: inherit; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-weight: 500; color: var(--pop-ton-bleu-encre); background: var(--pop-ton-bleu-fond); -webkit-box-decoration-break: clone; box-decoration-break: clone; white-space: nowrap; transition: background-color 140ms, color 140ms; }
.pop-jeton:hover { background: color-mix(in srgb, var(--pop-ton-bleu-encre) 16%, var(--pop-panneau-fond)); }
.pop-jeton[aria-pressed="true"] { background: var(--pop-action-bleu); color: var(--pop-encre-sur-couleur); }
.pop-jeton:focus-visible { outline: 2px solid var(--pop-action-bleu); outline-offset: 2px; }
.pop-jeton-chevron { display: inline-block; width: 0.62em; height: 0.62em; margin-left: 0.28em; vertical-align: 0.02em; opacity: 0.8; transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1), opacity 140ms; }
.pop-jeton:hover .pop-jeton-chevron { opacity: 1; }
.pop-jeton[aria-pressed="true"] .pop-jeton-chevron { transform: rotate(180deg); opacity: 1; }
.pop-phrase-ajouts { display: flex; gap: var(--pop-espace-boutons); }
.v5-otto-auto .pop-phrase { line-height: calc(var(--k) * 30px); letter-spacing: -0.006em; }
.v5-otto-auto .pop-jeton { padding: calc(var(--k) * 2px) calc(var(--k) * 7px); border-radius: calc(var(--k) * 7px); }
.pop-titre-champ { width: 100%; margin: -2px -6px; border: 0px; border-radius: 6px; outline: none; background: transparent; font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 17px; font-weight: 500; color: var(--pop-encre-principale); transition: background-color 120ms, box-shadow 120ms; padding: 2px 6px !important; }
.pop-titre-champ:hover { background: var(--pop-rangee-survol); }
.pop-titre-champ:focus { background: var(--pop-champ-fond); box-shadow: 0 0 0 3px var(--pop-champ-anneau); }
.pop-message { min-height: 96px; padding: 12px 14px; box-sizing: border-box; border: 1px solid var(--pop-champ-trait); border-radius: var(--pop-rayon-champ); background: var(--pop-champ-fond); font-size: 16px; line-height: 26px; color: var(--pop-encre-principale); outline: none; }
.pop-message:focus { border-color: var(--pop-champ-focus); box-shadow: 0 0 0 3px var(--pop-champ-anneau); }
.pop-variable { display: inline; padding: 2px 7px; border-radius: var(--pop-rayon-pastille); background: var(--pop-pastille-fond); font-weight: 500; color: var(--pop-encre-principale); white-space: nowrap; }
.pop-variables { display: flex; flex-wrap: wrap; gap: 6px; }
.pop-entre { display: grid; grid-template-columns: minmax(0px, 1fr) auto minmax(0px, 1fr); align-items: center; gap: 10px; }
.pop-journal-chiffres { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: var(--pop-espace-colonnes); }
.pop-journal-chiffre { display: flex; flex-direction: column; gap: 2px; }
.pop-journal-v { font-size: 26px; font-weight: 600; line-height: 32px; letter-spacing: -0.02em; color: var(--pop-encre-principale); }
.pop-journal-chiffre[data-ton="vert"] .pop-journal-v { color: var(--pop-ton-vert-encre); }
.pop-journal-chiffre[data-ton="rouge"] .pop-journal-v { color: var(--pop-ton-rouge-encre); }
.pop-journal-jour { display: flex; flex-direction: column; gap: 8px; }
.pop-journal-quoi { flex: 0 0 auto; font-size: 14px; font-weight: 500; color: var(--pop-encre-principale); margin-right: 10px; }
.pop-journal-vide { display: flex; flex-direction: column; gap: 4px; padding: 6px 0px 4px; }
.pop-palier { display: flex; align-items: center; gap: 16px; }
.pop-palier-textes { flex: 1 1 0%; min-width: 0px; display: flex; flex-direction: column; gap: 2px; }
.pop-palier-titre { font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); }
.pop-liste.pop-consignes { max-height: none; }
.pop-consigne { min-height: 44px; padding: 4px 4px 4px 2px; font-weight: 400; }
.pop-consigne-texte { flex: 1 1 0%; min-width: 0px; font-size: 15px; line-height: 20px; color: var(--pop-encre-principale); }
.pop-consigne-retirer { width: 30px; height: 30px; flex: 0 0 auto; display: grid; place-items: center; border: 0px; border-radius: 8px; background: transparent; color: var(--pop-encre-faible); cursor: pointer; }
.pop-consigne-retirer:hover { background: var(--pop-rangee-survol); color: var(--pop-encre-principale); }
.pop-echange { display: flex; flex-direction: column; gap: 6px; }
.pop-echange + .pop-echange { padding-top: 14px; border-top: 1px solid var(--pop-feuille-filet); }
.pop-echange > .pop-rangee { padding-left: 0px; padding-right: 0px; }
.pop-bulle { align-self: flex-start; max-width: 86%; padding: 8px 12px; box-sizing: border-box; border-radius: 16px; background: var(--pop-pastille-fond); font-size: 15px; line-height: 21px; color: var(--pop-encre-principale); }
.pop-bulle[data-moi] { align-self: flex-end; background: var(--pop-action-bleu); color: var(--pop-encre-sur-couleur); }
.pop-otto-ligne.pop-otto-ligne-grande { height: 56px; }
.pop-liste.pop-modeles { max-height: none; }
.pop-modele { gap: 14px; padding: 8px 12px 8px 8px; color: var(--pop-encre-principale); }
.pop-modele-tuile { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 11px; background: var(--pop-pastille-fond); color: var(--pop-encre-seconde); }
.pop-modele .pop-phrase { flex: 1 1 0%; min-width: 0px; line-height: 1.6; }
.pop-modele-fleche { flex: 0 0 auto; display: grid; place-items: center; color: var(--pop-encre-faible); }
.pop-modele:hover .pop-modele-fleche { color: var(--pop-encre-principale); }
.pop-jeton[data-statique] { cursor: inherit; padding: 1px 6px; border-radius: 6px; }
.pop-jeton[data-statique]:hover { background: var(--pop-ton-bleu-fond); }
.pop-section-bloc { display: flex; flex-direction: column; gap: var(--pop-espace-sections); scroll-margin: 24px; }
.pop-messages { display: flex; flex-direction: column; gap: 14px; }
.pop-message-favori { display: flex; flex-direction: column; gap: 10px; padding-top: 14px; border-top: 1px solid var(--pop-feuille-filet); }
.pop-message-favori:first-child { padding-top: 0px; border-top: 0px; }
.pop-message-favori[data-eteint] textarea { color: var(--pop-encre-faible); }
.pop-message-tete { display: flex; align-items: center; gap: 10px; }
.pop-message-tete > .pop-section-titre { flex: 1 1 0%; min-width: 0px; font-size: 15px; }
.pop-texte-variables { display: flex; flex-direction: column; gap: 8px; }
.pop-texte-variables textarea { min-height: 72px; resize: vertical; line-height: 22px; }
.pop-aide.pop-aide-alerte { color: var(--pop-ton-rouge-encre); }
html.v5-mobile .pop-phrase-zone .pop-phrase { font-size: 19px !important; line-height: 1.6; }
html.v5-mobile .pop-phrase-zone .pop-jeton { display: inline-block; max-width: 100%; box-sizing: border-box; white-space: normal; line-height: 1.35; padding: 3px 8px; margin: 2px 1px; }
.pop-journal-quoi-mobile { display: none; }
html.v5-mobile .pop-journal-quoi, html.v5-mobile .pop-journal-qui { display: none; }
html.v5-mobile .pop-journal-quoi-mobile { display: inline; }
.pop-etapes { display: flex; align-items: center; gap: 10px; min-width: 0px; margin: 0px; padding: 0px; list-style: none; }
.pop-etape { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.pop-etape + .pop-etape::before { content: ""; width: 18px; height: 1px; margin-right: 2px; background: var(--pop-feuille-filet); }
.pop-etape-rond { width: 22px; height: 22px; flex: 0 0 auto; box-sizing: border-box; display: grid; place-items: center; border-radius: 11px; font-size: 12px; font-weight: 500; line-height: 16px; font-variant-numeric: tabular-nums; background: var(--pop-ton-neutre-fond); color: var(--pop-ton-neutre-encre); }
.pop-etape[data-etat="courante"] .pop-etape-rond { background: var(--pop-action-bleu); color: var(--pop-encre-sur-couleur); }
.pop-etape[data-etat="faite"] .pop-etape-rond { background: var(--pop-action-encre); color: var(--pop-encre-inverse); }
.pop-etape-lib { font-size: 13px; font-weight: 400; line-height: 16px; white-space: nowrap; color: var(--pop-encre-seconde); }
.pop-etape[data-etat="courante"] .pop-etape-lib { color: var(--pop-encre-principale); }
html.v5-mobile .pop-etape:not([data-etat="courante"]) .pop-etape-lib { display: none; }
.pop-depot { display: flex; align-items: center; gap: 16px; width: 100%; min-width: 0px; padding: 0px; border: 0px; background: transparent; color: inherit; font-family: inherit; text-align: left; cursor: pointer; }
.pop-depot:disabled { cursor: default; }
.pop-depot-case { width: 64px; height: 64px; flex: 0 0 auto; box-sizing: border-box; display: grid; place-items: center; border: 1px dashed var(--pop-champ-tiret); border-radius: var(--pop-rayon-zone); color: var(--pop-encre-seconde); transition: border-color 0.15s, background-color 0.15s, box-shadow 0.15s; }
.pop-depot:not(:disabled):hover .pop-depot-case { border-color: var(--pop-encre-faible); }
.pop-depot[data-survol] .pop-depot-case { border-color: var(--pop-champ-focus); background: var(--pop-rangee-survol); }
.pop-depot:focus-visible { outline: none; }
.pop-depot:focus-visible .pop-depot-case { border-color: var(--pop-champ-focus); box-shadow: 0 0 0 3px var(--pop-champ-anneau); }
.pop-depot-textes { display: flex; flex-direction: column; gap: 4px; min-width: 0px; }
.pop-depot-titre { font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); }
.pop-depot-aide { font-size: 13px; font-weight: 400; line-height: 16px; color: var(--pop-encre-seconde); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pop-rangee[data-fixe][data-lue] { color: var(--pop-encre-seconde); }
.pop-rangee-lien { flex: 0 0 auto; padding: 0px; border: 0px; border-radius: 6px; background: transparent; cursor: pointer; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-seconde); }
.pop-rangee-lien:hover { color: var(--pop-encre-principale); }
.pop-rangee-lien:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--pop-champ-anneau); }
.pop-import-grille { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: var(--pop-espace-sections) var(--pop-espace-colonnes); }
html.v5-mobile .pop-import-grille { grid-template-columns: minmax(0px, 1fr); }
.pop-import-grille .pop-lib, .pop-import-grille .pop-aide { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pop-import-onglets { flex: 0 0 auto; max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.pop-import-onglets::-webkit-scrollbar { display: none; }
.pop-import-onglets > .pop-seg { max-width: none; }
.pop-import-lignes { display: flex; flex-direction: column; gap: 4px; min-width: 0px; }
.pop-import-lignes > .pop-coche { align-self: flex-start; padding-left: 10px; }
.pop-import-lignes .pop-rangee:disabled { cursor: default; }
.pop-import-lignes .pop-rangee:disabled:hover { background: transparent; }
.pop-feuille:has(.brouillon-colonnes) > .pop-pied, .pop-feuille:has(.republier-colonnes) > .pop-pied { position: sticky; bottom: 0px; z-index: 2; background: var(--pop-feuille-fond); }
.pop-champ-choix.brouillon-choix .brouillon-choix-valeur { display: flex; align-items: center; gap: 8px; }
.pop-champ-choix.brouillon-choix[data-etat="requis"] .pop-champ-choix-valeur, .pop-champ-choix.brouillon-choix[data-etat="invalide"] .pop-champ-choix-valeur { color: var(--pop-ton-orange-encre); }
.pop-deroulant.brouillon-deroulant { position: fixed; inset: auto; z-index: 10050; max-height: none; overflow: hidden; box-sizing: border-box; display: flex; flex-direction: column; gap: 4px; font-family: inherit; color: var(--pop-encre-principale); outline: none; }
.pop-deroulant-item.brouillon-option { display: flex; align-items: center; gap: 10px; min-height: 36px; }
.pop-deroulant-item.brouillon-option[data-choisie] { background: var(--pop-action-selection); }
.pop-deroulant-item.brouillon-option:disabled { cursor: default; color: var(--pop-encre-faible); background: transparent; }
.pop-deroulant-item.brouillon-option:focus-visible { outline: 2px solid var(--pop-champ-focus); outline-offset: -2px; }
.pop-deroulant-item.brouillon-option > svg { flex: 0 0 auto; color: var(--pop-encre-seconde); }
textarea.pop-saisie.brouillon-description { resize: none; overflow: hidden; }
.brouillon-prix[data-vide] .pop-saisie.pop-saisie-unite:not(:focus-within) { border-color: var(--pop-ton-orange-encre); }
.pop-pied-aide.brouillon-statut { border: 0px; background: transparent; padding: 4px 8px; margin-left: -8px; border-radius: 8px; font-family: inherit; text-align: left; cursor: pointer; }
.pop-pied-aide.brouillon-statut:hover:not(:disabled) { background: var(--pop-rangee-survol); color: var(--pop-encre-principale); }
.pop-pied-aide.brouillon-statut:disabled { cursor: default; }
.pop-pied-aide.brouillon-statut:focus-visible { outline: 2px solid var(--pop-champ-focus); outline-offset: 0px; }
.pop-feuille .pop-panneau:has(> .republier-colonnes) { padding: 0px; gap: 0px; background: transparent; border: 0px; border-radius: 0px; }
.republier-boutique > .pop-ton { display: block; min-width: 0px; overflow: hidden; text-overflow: ellipsis; line-height: 22px; }
html.klintt-shopify .pop-voile:has(.rp10) { padding: 16px !important; }
html.klintt-shopify .pop-feuille:has(.rp10) { position: relative; height: calc(-32px + 100vh); border: 0px; border-radius: 24px; corner-shape: round; background-color: rgb(245, 245, 245); background-image: radial-gradient(circle, rgba(0, 0, 0, 0.11) 1px, transparent 1.2px); background-size: 18px 18px; background-position: 9px 9px; box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 1px, rgba(0, 0, 0, 0.12) 0px 32px 48px -8px; width: calc(-32px + 100vw) !important; max-height: none !important; overflow: hidden !important; }
html.klintt-shopify .pop-tete:has(> .rp10-sans-tete) { display: none; }
html.klintt-shopify .pop-feuille:has(.rp10) > .pop-zone { position: absolute; inset: 0px; padding: 0px; }
html.klintt-shopify .pop-feuille:has(.rp10) > .pop-zone > .pop-panneau { position: absolute; inset: 0px; padding: 0px; gap: 0px; background: transparent; border: 0px; border-radius: 0px; box-shadow: none; }
.rp10-edition .pop-saisie, .rp10-edition textarea { margin: 12px 0px; width: 100%; }
.pop-grille-champs { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: var(--pop-espace-sections) var(--pop-espace-colonnes); }
.pop-grille-champs > .pop-plein { grid-column: 1 / -1; }
html.v5-mobile .pop-grille-champs { grid-template-columns: minmax(0px, 1fr); }
.pop-zone-photo { display: flex; align-items: center; gap: 16px; min-width: 0px; }
.pop-zone-photo-case { width: 64px; height: 64px; flex: 0 0 auto; box-sizing: border-box; display: grid; place-items: center; padding: 0px; border: 1px dashed var(--pop-champ-tiret); border-radius: var(--pop-rayon-zone); background: transparent; color: var(--pop-encre-seconde); cursor: pointer; transition: border-color 0.15s, color 0.15s; }
.pop-zone-photo-case:hover { border-color: var(--pop-encre-seconde); color: var(--pop-encre-principale); }
.pop-zone-photo-apercu { position: relative; width: 64px; height: 64px; flex: 0 0 auto; box-sizing: border-box; overflow: hidden; border: 1px solid var(--pop-champ-trait); border-radius: var(--pop-rayon-zone); background: var(--pop-pastille-fond); }
.pop-zone-photo-apercu img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pop-zone-photo-retirer { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; padding: 0px; border: 0px; border-radius: var(--pop-rayon-pastille); display: grid; place-items: center; cursor: pointer; background: color-mix(in srgb, var(--pop-media-fond) 64%, transparent); color: var(--pop-media-encre); }
.pop-zone-photo-textes { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0px; }
.pop-zone-photo-titre { padding: 0px; border: 0px; background: transparent; cursor: pointer; text-align: left; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); }
.pop-marque { position: relative; }
.pop-marque-champ { position: relative; display: flex; align-items: center; }
.pop-marque-champ .pop-saisie { padding-right: 40px; }
.pop-marque-ok { position: absolute; top: 50%; right: 12px; transform: translateY(-50%); width: 18px; height: 18px; border-radius: var(--pop-rayon-pilule); display: grid; place-items: center; pointer-events: none; background: var(--pop-ton-vert-fond); color: var(--pop-ton-vert-encre); }
.selm-panneau.pop-marque-panneau { display: block; box-sizing: border-box; }
.pop-marque-panneau .pop-deroulant-item { flex: 0 0 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pop-marque-panneau .pop-deroulant-item[aria-selected="true"] { background: var(--pop-action-selection); }
.pop-marque-panneau .pop-marque-libre { white-space: normal; }
.pop-marque-note { display: block; margin-top: 2px; font-size: 13px; font-weight: 400; line-height: 16px; color: var(--pop-ton-neutre-encre); }
.pop-marque-panneau .pop-filet { margin: 4px 6px; }
.pop-marque-info { padding: 9px 10px; font-size: 13px; line-height: 16px; color: var(--pop-encre-seconde); }
.pop-lot-pieces { display: flex; flex-direction: column; gap: 8px; }
.pop-lot-piece { display: flex; align-items: center; gap: 10px; }
.pop-lot-rang { flex: 0 0 auto; text-align: center; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-seconde); font-variant-numeric: tabular-nums; }
.pop-lot-pieces[data-deux-chiffres] .pop-lot-rang { min-width: 2ch; }
.pop-lot-nom { flex: 1 1 auto; min-width: 0px; }
.pop-lot-prix { flex: 0 0 110px; min-width: 0px; }
.pop-lot-retirer { width: 24px; height: 24px; margin: 0px -4px; flex: 0 0 auto; display: grid; place-items: center; padding: 0px; border: 0px; border-radius: var(--pop-rayon-pastille); background: transparent; color: var(--pop-encre-seconde); cursor: pointer; }
.pop-lot-retirer:not(:disabled):hover { background: var(--pop-rangee-survol); color: var(--pop-encre-principale); }
.pop-lot-retirer:disabled { color: var(--pop-encre-faible); cursor: default; }
.pop-lot-compteur { display: flex; align-items: center; gap: 8px; }
.pop-lot-somme { display: flex; flex-direction: column; gap: 2px; flex: 1 1 auto; min-width: 0px; }
.pop-lot-total { font-size: 17px; font-weight: 500; line-height: 22px; font-variant-numeric: tabular-nums; }
.pop-lot-total[data-ton="vert"] { color: var(--pop-ton-vert-encre); }
.pop-lot-total[data-ton="rouge"] { color: var(--pop-ton-rouge-encre); }
.pop-partage-corps { display: flex; flex-direction: column; gap: var(--pop-espace-sections); }
.pop-partage-scene { position: relative; isolation: isolate; display: grid; place-items: center; height: 452px; overflow: hidden; border-radius: var(--pop-rayon-tuile); background: radial-gradient(56% 52% at 50% 40%, rgba(255, 255, 255, 0.085), rgba(255, 255, 255, 0) 72%),
    radial-gradient(90% 40% at 50% 104%, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0) 70%),
    var(--pop-media-fond); }
html.v5-mobile .pop-partage-scene { height: auto; padding: 36px 0px 44px; }
.pop-partage-carte { position: relative; width: 264px; overflow: hidden; border-radius: var(--pop-rayon-tuile); background: var(--pop-media-surface); }
.pop-partage-scene .carte-holo-corps { box-shadow: 0 calc(16px + var(--o) * 18px) calc(36px + var(--o) * 28px) rgba(0, 0, 0, 0.6), 0 2px 6px rgba(0, 0, 0, 0.45); }
.pop-partage-scene .carte-holo-halo { display: block; position: absolute; inset: -6% -24%; z-index: -1; border-radius: 50%; pointer-events: none; background: conic-gradient(rgb(90, 181, 246), rgb(189, 117, 240), rgb(244, 113, 168), rgb(246, 189, 90), rgb(82, 224, 153), rgb(90, 181, 246)); filter: blur(56px); opacity: calc(0.14 + var(--o) * 0.26); transform: translate(calc(var(--nx) * 48px), calc(var(--ny) * 48px)) rotate(var(--a)); }
.pop-partage-attente { position: absolute; inset: 0px; display: grid; place-items: center; color: var(--pop-encre-faible); }
.pop-partage-maj { position: absolute; left: 0px; right: 0px; bottom: 12px; display: flex; justify-content: center; pointer-events: none; }
.pop-partage-reglages { display: flex; flex-direction: column; gap: var(--pop-espace-sections); min-width: 0px; }
.pop-partage-reseaux { display: grid; grid-template-columns: repeat(8, minmax(0px, 1fr)); gap: 4px; }
html.v5-mobile .pop-partage-reseaux { grid-template-columns: repeat(4, minmax(0px, 1fr)); row-gap: 12px; }
.pop-partage-reseau { display: flex; flex-direction: column; align-items: center; gap: 8px; min-width: 0px; padding: 6px 0px; border: 0px; border-radius: var(--pop-rayon-zone); background: none; cursor: pointer; font-style: inherit; font-variant: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 12px; font-weight: 500; line-height: 16px; color: var(--pop-encre-seconde); white-space: nowrap; }
.pop-partage-reseau:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--pop-champ-anneau); }
.pop-partage-reseau:disabled { opacity: 0.45; cursor: default; }
.pop-partage-rond { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; transition: transform 160ms, box-shadow 160ms; }
.pop-partage-reseau:not(:disabled):hover .pop-partage-rond { transform: translateY(-2px); box-shadow: rgba(0, 0, 0, 0.14) 0px 6px 14px; }
.pop-partage-rond[data-neutre] { background: var(--pop-pastille-fond); color: var(--pop-encre-principale); }
.pop-partage-deplier { width: 100%; height: 40px; margin: -11px 0px; padding: 0px; border: 0px; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 10px; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); text-align: left; }
.pop-partage-chevron { display: grid; place-items: center; color: var(--pop-encre-faible); transition: transform 160ms; }
.pop-partage-deplier[aria-expanded="true"] .pop-partage-chevron { transform: rotate(180deg); }
.pop-partage-ligne { display: flex; align-items: center; gap: 12px; min-height: 26px; transition: opacity 160ms; }
.pop-partage-libelle { flex: 1 1 auto; min-width: 0px; font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); }
.pop-partage-ligne[data-eteinte] { opacity: 0.4; }
.pop-partage-valeur { flex: 0 0 auto; min-width: 3ch; text-align: right; font-size: 13px; line-height: 16px; color: var(--pop-encre-seconde); font-variant-numeric: tabular-nums; }
.pop-feuille input.pop-jauge[type="range"] { appearance: none; flex: 0 0 auto; width: 136px; height: 16px; margin: 0px; padding: 0px; border: 0px; background: transparent; cursor: pointer; }
.pop-feuille input.pop-jauge[type="range"]:focus-visible { outline: none; }
.pop-feuille input.pop-jauge[type="range"]:disabled { cursor: default; }
.pop-jauge::-webkit-slider-runnable-track { height: 4px; border-radius: 2px; background: linear-gradient(to right, var(--pop-action-bleu) calc(8px + (100% - 16px) * var(--p, 0.5)), var(--pop-ton-neutre-fond) 0); }
.pop-jauge::-webkit-slider-thumb { appearance: none; width: 16px; height: 16px; margin-top: -6px; box-sizing: border-box; border: 1px solid var(--pop-champ-trait); border-radius: 50%; background: var(--pop-panneau-fond); box-shadow: var(--pop-ombre-bouton); cursor: grab; }
.pop-jauge:focus-visible::-webkit-slider-thumb { border-color: var(--pop-champ-focus); box-shadow: 0 0 0 3px var(--pop-champ-anneau); }
.pop-jauge:not(:disabled):active::-webkit-slider-thumb { cursor: grabbing; }
.pop-jauge:disabled::-webkit-slider-thumb { cursor: default; }
.pop-favoris-liste .pop-rangee[data-actif] .pop-rangee-sous, .pop-favoris-liste .pop-rangee[data-actif] .pop-rangee-fin { color: var(--pop-ton-neutre-encre); }
.pop-favoris-edition { display: flex; flex-direction: column; gap: var(--pop-espace-sections); padding: 18px 0px; }
.pop-favoris-ligne { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.pop-favoris-signe { flex: 0 0 auto; min-width: 10px; text-align: center; font-size: 17px; font-weight: 500; line-height: 22px; color: var(--pop-encre-principale); }
.pop-favoris-montant { flex: 0 0 88px; min-width: 0px; }
.pop-favoris-detail { font-size: 15px; font-weight: 500; line-height: 18px; color: var(--pop-encre-principale); white-space: nowrap; }
.pop-favoris-detail[data-regle] { color: var(--pop-encre-seconde); }
.pop-favoris-arrondi { flex: 0 0 170px; min-width: 0px; }
html.v5-mobile .pop-favoris-edition .pop-seg-item { padding: 0px 10px; }
.pop-boutiques .pop-rangee { min-height: var(--pop-hauteur-rangee-double); }
.pop-rangee-vignette.pop-boutique-initiales { font-size: 15px; font-weight: 600; line-height: 1; color: var(--pop-ton-neutre-encre); }
.pop-plage-tete { position: relative; height: 32px; margin-bottom: 12px; }
.pop-plage-tete .pop-calendrier-fleche { position: absolute; top: 0px; }
.pop-plage-titres { display: flex; gap: 44px; }
.pop-plage-mois { width: 294px; flex: 0 0 auto; text-align: center; font-size: 16px; font-weight: 600; line-height: 32px; letter-spacing: -0.01em; color: var(--pop-encre-principale); }
.pop-plage-grilles { display: flex; gap: 44px; }
.pop-plage-grille { position: relative; width: 294px; flex: 0 0 auto; }
.pop-plage-bande { position: absolute; height: 36px; background: var(--pop-action-selection); pointer-events: none; }
.pop-plage-grille .pop-calendrier-jour[data-aujourdhui]:not([data-choisi]) > span { color: var(--pop-ton-bleu-encre); }
.pop-plage-pied { display: flex; align-items: center; gap: 14px; min-height: 74px; margin-top: 22px; border-top: 1px solid var(--pop-feuille-filet); }
.pop-plage-resume { flex: 1 1 auto; min-width: 0px; display: flex; align-items: baseline; gap: 14px; }
.pop-plage-plage { font-size: 16px; font-weight: 600; line-height: 20px; letter-spacing: -0.01em; color: var(--pop-encre-principale); white-space: nowrap; }
.pop-plage-duree { font-size: 15px; line-height: 18px; color: var(--pop-encre-seconde); white-space: nowrap; }
.pop-plage-pied[data-mobile] { flex-wrap: wrap; padding: 16px 0px 4px; }
.pop-plage-pied[data-mobile] .pop-plage-resume { flex: 1 0 100%; flex-direction: column; align-items: flex-start; gap: 4px; }
.pop-plage-pied[data-mobile] .pop-btn { flex: 1 1 0px; }
.v5-visionneuse.pop-visionneuse { position: fixed; inset: 0px; z-index: 1200; display: grid; place-items: center; background: var(--pop-media-fond); cursor: zoom-out; animation: 160ms ease-out 0s 1 normal none running pop-visionneuse-voile; }
.pop-visionneuse-photo { display: block; max-width: min(88vw, 1400px); max-height: 86vh; border-radius: 12px; background: var(--pop-media-surface); cursor: default; user-select: none; animation: 220ms cubic-bezier(0.2, 0.8, 0.2, 1) 0s 1 normal none running pop-visionneuse-zoom; }
.pop-visionneuse-btn { position: fixed; width: 44px; height: 44px; padding: 0px; border: 0px; border-radius: var(--pop-rayon-pilule); display: grid; place-items: center; cursor: pointer; background: var(--pop-media-verre); color: var(--pop-media-encre); }
.pop-visionneuse-btn:not(:disabled):hover { background-image: linear-gradient(var(--pop-media-verre), var(--pop-media-verre)); }
.pop-visionneuse-btn:disabled { opacity: 0.3; cursor: default; }
.pop-visionneuse-btn:focus-visible { outline: 2px solid var(--pop-media-encre); outline-offset: 2px; }
.pop-visionneuse-fermer { top: 20px; right: 20px; }
.pop-visionneuse-prec { left: 24px; top: 50%; transform: translateY(-50%); }
.pop-visionneuse-suiv { right: 24px; top: 50%; transform: translateY(-50%); }
.pop-visionneuse-tourner { right: 20px; bottom: max(16px, calc(env(safe-area-inset-bottom, 0px) + 8px)); }
.pop-visionneuse-compteur { position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%); padding: 6px 12px; border-radius: var(--pop-rayon-pilule); background: var(--pop-media-verre); color: var(--pop-media-encre); font-size: 12px; font-weight: 500; line-height: 16px; font-variant-numeric: tabular-nums; white-space: nowrap; }
@keyframes pop-visionneuse-voile { 
  0% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes pop-visionneuse-zoom { 
  0% { opacity: 0; transform: scale(0.94); }
  100% { opacity: 1; transform: scale(1); }
}
@media (prefers-reduced-motion: reduce){
.v5-visionneuse.pop-visionneuse, .pop-visionneuse-photo { animation: auto ease 0s 1 normal none running none; }
}
.pop-icones { display: flex; flex-direction: column; gap: 10px; min-width: 0px; }
.pop-icones-groupes { display: flex; flex-wrap: wrap; gap: 6px; }
.pop-icones-groupes .pop-puce { padding: 0px 10px; background: transparent; color: var(--pop-encre-seconde); }
.pop-icones-groupes .pop-puce[aria-selected="true"] { background: var(--pop-pastille-fond); color: var(--pop-encre-principale); }
.pop-icones-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(32px, 1fr)); gap: 2px; max-height: 208px; overflow-y: auto; }
.pop-icone { display: grid; place-items: center; height: 32px; padding: 0px; border: 0px; border-radius: var(--pop-rayon-champ); background: transparent; color: var(--pst-encre); cursor: pointer; }
.pop-icone svg { display: block; width: 20px; height: 20px; }
.pop-icone:hover { background: var(--pop-rangee-survol); }
.pop-icone[aria-selected="true"] { background: var(--pop-pastille-fond); box-shadow: inset 0 0 0 1.5px var(--pop-champ-focus); }
.pop-icone[data-vide]::after { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 1.5px dashed var(--pop-encre-faible); }
.pop-teintes { display: flex; flex-wrap: wrap; gap: 6px; }
.pop-teinte { width: 24px; height: 24px; padding: 0px; border: 0px; border-radius: 50%; background: var(--pop-teinte); cursor: pointer; }
.pop-teinte[aria-checked="true"] { box-shadow: 0 0 0 2px var(--pop-champ-fond), 0 0 0 3.5px var(--pop-champ-focus); }
.pop-teinte[data-vide] { background: transparent; box-shadow: inset 0 0 0 1.5px var(--pop-champ-tiret); }
.pop-teinte[data-vide][aria-checked="true"] { box-shadow: inset 0 0 0 1.5px var(--pop-champ-tiret), 0 0 0 2px var(--pop-champ-fond), 0 0 0 3.5px var(--pop-champ-focus); }
.pop-statut { display: flex; flex-direction: column; gap: 14px; min-width: 0px; }
.pop-statuts-liste { display: flex; flex-direction: column; }
.pop-statuts-ligne { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; }
.pop-statuts-ligne + .pop-statuts-ligne { border-top: 1px solid var(--pop-champ-trait); }
.pop-statuts-gestes { display: flex; gap: 6px; flex: 0 0 auto; }
.pop-depot-zone { display: block; width: 100%; padding: 0px; border: 0px; background: transparent; font-family: inherit; text-align: center; cursor: pointer; }
.pop-depot-photo { position: relative; height: 170px; overflow: hidden; border-radius: 12px; background: var(--pop-pastille-fond); }
.pop-depot-photo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.pop-depot-gestes { position: absolute; right: 8px; bottom: 8px; display: flex; gap: 6px; }
.pop-choix-visuel { display: inline-flex; align-items: center; gap: 8px; min-width: 0px; max-width: 100%; vertical-align: middle; }
.pop-choix-nom { min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pop-choix-tete { width: 20px; height: 20px; flex: 0 0 auto; border-radius: 50%; object-fit: cover; display: inline-grid; place-items: center; background: var(--pop-champ-tiret); color: rgb(255, 255, 255); font-size: 10px; font-weight: 600; line-height: 1; }
.pop-choix-logo { width: 20px; height: 20px; flex: 0 0 auto; border-radius: 6px; object-fit: contain; background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 0px 1px; }
a.pop-btn { text-decoration: none; }
.pop-note[data-ton="vert"] { background: var(--pop-ton-vert-fond); color: var(--pop-ton-vert-encre); }
.pop-note[data-ton="orange"] { background: var(--pop-ton-orange-fond); color: var(--pop-ton-orange-encre); }
.cnx-corps .pop-note[data-ton="neutre"], .cme .pop-note[data-ton="neutre"] { color: var(--pop-ton-neutre-encre); }
@keyframes reg-pouls { 
  50% { opacity: 0.3; }
}
.reg-rond { width: 22px; height: 22px; flex: 0 0 auto; box-sizing: border-box; display: grid; place-items: center; border-radius: 11px; font-size: 12px; font-weight: 500; line-height: 16px; font-variant-numeric: tabular-nums; background: var(--pop-ton-neutre-fond); color: var(--pop-ton-neutre-encre); }
.reg-rond[data-etat="courante"] { background: var(--pop-action-bleu); color: var(--pop-encre-sur-couleur); }
.reg-rond[data-etat="faite"] { background: var(--pop-action-encre); color: var(--pop-encre-inverse); }
.pop-voile:has(.cnx-entete) { z-index: 9999 !important; }
.pop-voile:has(.cnx-garde) { z-index: 10000 !important; }
.pop-feuille:has(> .pop-pied > .cnx-pied:empty) > .pop-pied { display: none; }
.pop-feuille:has(> .pop-pied > .cnx-pied:empty) > .pop-zone { padding-bottom: var(--pop-espace-panneau); }
html.v5-mobile .pop-feuille .pop-pied > .cnx-pied > .pop-btn { flex: 1 1 auto; min-height: 44px; }
.cnx-place { display: flex; flex-direction: column; min-width: 0px; margin: 0px; padding: 0px; list-style: none; }
.cnx-place-etape { position: relative; display: flex; align-items: center; gap: 8px; min-width: 0px; }
.cnx-place-etape + .cnx-place-etape { margin-top: 16px; }
.cnx-place-etape + .cnx-place-etape::before { content: ""; position: absolute; left: 10.5px; top: -12px; width: 1px; height: 8px; background: var(--pop-feuille-filet); }
.cnx-place-lib { min-width: 0px; font-size: 13px; font-weight: 400; line-height: 16px; color: var(--pop-encre-seconde); }
.cnx-place-etape[aria-current="step"] .cnx-place-lib { color: var(--pop-encre-principale); }
.cnx-place-etape[aria-current="step"] .reg-rond { animation: 1.6s ease-in-out 0s infinite normal none running cnx-place-pouls; }
@media (prefers-reduced-motion: reduce){
.cnx-place-etape[aria-current="step"] .reg-rond { animation: auto ease 0s 1 normal none running none; }
}
.cnx-mail-tete > .reg-rond { width: 20px; height: 20px; border-radius: 10px; font-size: 11px; }
.cnx-mail-corps > .pop-aide { margin: 0px; }
.cnx-boite > .pop-ton { flex: 0 0 auto; }
html.v5-mobile .cnx-boite > .pop-btn { margin-left: auto; }
.pop-voile:has(.tgm-cadre) { z-index: 10000 !important; }
.cme .pop-aide { margin: 0px; }
.cme .pop-aide b { font-weight: 500; color: var(--pop-encre-principale); }
.cme .pop-aide a { color: var(--pop-encre-principale); text-decoration: underline; text-underline-offset: 2px; }
.cme-ligne > .pop-saisie { flex: 1 1 240px; width: auto; min-width: 0px; }
.cme-bloc > .pop-liste { max-height: none; }
.cme-journal > .pop-aide, .cme-journal > [aria-busy] { padding: 12px; }
.pop-mdp { padding-right: 8px; }
.pop-oeil { position: relative; flex: 0 0 auto; display: grid; place-items: center; width: 26px; height: 26px; border: 0px; padding: 0px; border-radius: 8px; background: none; color: var(--pop-encre-faible); cursor: pointer; }
.pop-oeil:hover:not(:disabled) { color: var(--pop-encre-principale); background: var(--pop-rangee-survol); }
.pop-oeil:disabled { cursor: default; }
@media (pointer: coarse){
.pop-oeil::after { content: ""; position: absolute; inset: -9px; }
}
.pop-mdp[data-erreur] { border-color: var(--pop-ton-rouge-encre); }
html.klintt-shopify .pop-mdp[data-erreur] { box-shadow: rgba(0, 0, 0, 0.04) 0px 2px 3px -1px, rgba(0, 0, 0, 0.04) 0px 3px 4px -1.5px, rgb(229, 72, 77) 0px 0px 0px 1px; }
.cnx-options > .pop-champ { min-width: 0px; }
.pop-pied-aide.cnx-confiance { gap: 6px; font-size: 12px; line-height: 16px; color: var(--pop-encre-faible); }
.pop-pied-aide.cnx-lien { color: var(--pop-action-bleu); font-size: 13px; }
.pop-note.cnx-note { align-items: center; color: var(--pop-encre-principale); }
.cnx-guide .reg-rond, .cnx-place[data-courts] .reg-rond { width: 20px; height: 20px; border-radius: 10px; }
.cnx-place[data-courts] { border-radius: 12px; corner-shape: superellipse(1.333); box-shadow: 0 0 0 1px var(--pop-feuille-filet); overflow: hidden; }
.cnx-place[data-courts] .cnx-place-etape { min-height: 44px; padding: 0px 14px; gap: 10px; }
.cnx-place[data-courts] .cnx-place-etape + .cnx-place-etape { margin-top: 0px; box-shadow: inset 0 1px 0 var(--pop-feuille-filet); }
.cnx-place[data-courts] .cnx-place-etape + .cnx-place-etape::before { display: none; }
.cnx-place[data-courts] .cnx-place-lib { font-size: 13px; line-height: 20px; }
html.klintt-shopify .pop-feuille:has(.cnx-entete) > .pop-tete { position: relative; padding-right: 64px; }
html.klintt-shopify .cnx-entete .pop-entete-textes { min-height: 0px; justify-content: flex-start; }
html.klintt-shopify .cnx-entete .pop-fermer { position: absolute; top: 16px; right: 16px; }
html.klintt-shopify .pop-feuille:has(.cnx-entete) > .pop-zone { padding-left: 0px; padding-right: 0px; }
html.klintt-shopify .pop-feuille:has(.cnx-entete) > .pop-zone > .pop-panneau { padding-top: 12px; }
html.klintt-shopify .cnx-mail-etape:not([aria-current]) .cnx-mail-tete:has(.reg-rond:not([data-etat="faite"])) { color: var(--pop-encre-seconde); }
@keyframes ov-tourne { 
  100% { transform: rotate(360deg); }
}
html.fbt-ouverte .pop-deroulant { --pop-feuille-fond: #26262A; --pop-feuille-trait: #34343A; --pop-panneau-fond: #26262A; --pop-panneau-trait: #34343A; --pop-encre-principale: #E8E8EC; --pop-encre-seconde: #A9A9B0; --pop-encre-faible: #78787F; --pop-encre-inverse: #171717; --pop-champ-fond: #1C1C1F; --pop-champ-trait: #38383E; --pop-champ-focus: #E8E8EC; --pop-champ-anneau: rgba(232, 232, 236, 0.14); --pop-champ-tiret: #44444A; --pop-pastille-fond: #34343A; --pop-rangee-survol: #303035; --pop-action-encre: #F0F0F3; --pop-action-selection: rgba(65, 144, 249, 0.2); color-scheme: dark; }
.porte { --brc-tuile: #FFFFFF; --brc-ombre: 0 1px 3px rgba(0, 0, 0, 0.06); }
@media (max-width: 900px){
.porte.is-concentre .porte-panneau { display: none; }
.porte.is-concentre .porte-cote { padding-top: 18px; }
}
.brc-carte { padding: 20px; border-radius: 20px; background: var(--porte-carte); }
.brc-carte + .brc-carte { margin-top: 16px; }
.brc-carte-titre { display: flex; align-items: baseline; justify-content: space-between; margin: 0px 0px 14px; font-size: 15px; line-height: 20px; font-weight: 500; }
.brc-gros { font-size: 30px; line-height: 32px; font-weight: 600; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.brc-bas { margin: 16px 0px 0px; padding-left: 18px; font-size: 14px; line-height: 20px; color: var(--porte-doux); }
.brc-erreur { margin-top: 12px; }
.brc-message { position: fixed; left: calc(0.5 * (12px + 100vw + clamp(360px, 44.45vw, 860px))); bottom: calc(28px + env(safe-area-inset-bottom, 0px)); z-index: 50; display: inline-flex; align-items: center; gap: 8px; margin: 0px; padding: 10px 16px; border-radius: 12px; background: var(--porte-bouton); color: var(--porte-bouton-texte); font-size: 14px; font-weight: 500; white-space: nowrap; box-shadow: rgba(0, 0, 0, 0.2) 0px 10px 30px; transform: translateX(-50%); animation: brc-message 0.3s var(--porte-courbe) both; }
.brc-message svg { width: 14px; height: 14px; }
@keyframes brc-message { 
  0% { opacity: 0; transform: translate(-50%, 8px); }
}
.brc-radio { flex: 0 0 auto; width: 20px; height: 20px; border-radius: 50%; background: var(--porte-fond); box-shadow: inset 0 0 0 1.5px var(--porte-non); transition: box-shadow 0.15s; }
[aria-checked="true"] > .brc-radio { box-shadow: inset 0 0 0 6px var(--porte-encre); }
.brc-case { display: grid; place-items: center; flex: 0 0 auto; width: 20px; height: 20px; border-radius: 50%; background: var(--porte-fait); color: rgb(255, 255, 255); transition: background 0.15s, box-shadow 0.15s; }
.brc-case svg { width: 12px; height: 12px; }
[aria-checked="false"] > .brc-case { background: transparent; box-shadow: inset 0 0 0 1.5px var(--porte-non); color: transparent; }
.brc-choix { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 64px; padding: 10px 18px; border: 0px; border-radius: 12px; background: var(--porte-carte); color: inherit; font: inherit; text-align: left; cursor: pointer; transition: background 0.15s, box-shadow 0.15s; }
.brc-choix[aria-checked="true"] { background: var(--porte-fond); box-shadow: inset 0 0 0 1.5px var(--porte-encre); }
.brc-choix:focus-visible, .brc-boutique:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: 2px; }
.brc-choix-textes { display: grid; gap: 2px; min-width: 0px; }
.brc-choix-titre { font-size: 16px; line-height: 20px; font-weight: 500; }
.brc-choix-sous { font-size: 14px; line-height: 18px; color: var(--porte-doux); }
.brc-depot { display: flex; align-items: center; gap: 16px; width: 100%; min-width: 0px; padding: 0px; border: 0px; background: transparent; color: inherit; font-family: inherit; text-align: left; cursor: pointer; }
.brc-depot:disabled { cursor: default; }
.brc-depot-case { box-sizing: border-box; display: grid; place-items: center; flex: 0 0 auto; width: 64px; height: 64px; border: 1px dashed var(--porte-doux); border-radius: 12px; color: var(--porte-doux); transition: border-color 0.15s, background-color 0.15s, box-shadow 0.15s; }
.brc-depot:not(:disabled):hover .brc-depot-case { border-color: var(--porte-encre); }
.brc-depot[data-survol] .brc-depot-case { border-color: var(--porte-encre); background: var(--porte-carte); }
.brc-depot:focus-visible { outline: none; }
.brc-depot:focus-visible .brc-depot-case { border-color: var(--porte-anneau); box-shadow: 0 0 0 3px color-mix(in srgb, var(--porte-anneau) 24%, transparent); }
.brc-depot-textes { display: grid; gap: 2px; min-width: 0px; }
.brc-depot-titre { font-size: 16px; line-height: 20px; font-weight: 500; }
.brc-depot-aide { font-size: 14px; line-height: 18px; color: var(--porte-doux); }
.brc-suivi-depot { margin-top: 24px; }
.brc-choix-ouvert { border-radius: 12px; background: var(--porte-fond); box-shadow: inset 0 0 0 1.5px var(--porte-encre); }
.brc-choix-ouvert > .brc-choix { background: none; box-shadow: none; }
.brc-boutiques { margin: 0px 18px; padding: 6px 0px 8px; border-top: 1px solid var(--porte-filet); }
.brc-boutique { display: flex; align-items: center; gap: 12px; width: 100%; height: 44px; padding: 0px; border: 0px; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.brc-av { display: inline-grid; place-items: center; flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; background: var(--porte-trait); color: var(--porte-encre-2); font-size: 12px; font-weight: 600; object-fit: cover; }
.brc-boutique-nom { flex: 1 1 0%; min-width: 0px; font-size: 15px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brc-boutique[aria-checked="false"] .brc-boutique-nom { color: var(--porte-pale); }
.brc-boutique-sous { font-size: 13px; color: var(--porte-doux); white-space: nowrap; }
.brc-boutique-sous.is-bleu { color: var(--porte-lien); }
.brc-frise { position: relative; padding: 70px 28px 28px; border-radius: 20px; background: var(--porte-carte); }
.brc-piste { position: relative; height: 6px; border-radius: 3px; background: var(--porte-trait); cursor: pointer; touch-action: none; }
.brc-piste::before { content: ""; position: absolute; inset: -16px 0px; }
.brc-piste:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: 10px; }
.brc-periode { position: absolute; right: 0px; top: 0px; bottom: 0px; border-radius: 3px; background: var(--porte-encre); transition: left 0.5s var(--porte-courbe); }
.brc-poignee { position: absolute; top: 50%; width: 24px; height: 24px; border-radius: 50%; background: var(--porte-fond); box-shadow: 0 0 0 2px var(--porte-encre), 0 2px 6px rgba(0, 0, 0, 0.2); transform: translate(-50%, -50%); cursor: grab; transition: left 0.5s var(--porte-courbe); }
.brc-poignee::after { content: ""; position: absolute; inset: 7px 9px; border-left: 1.5px solid var(--porte-pale); border-right: 1.5px solid var(--porte-pale); }
.brc-bulle { position: absolute; top: 20px; padding: 6px 12px; border-radius: 10px; background: var(--porte-bouton); color: var(--porte-bouton-texte); font-size: 14px; font-weight: 500; white-space: nowrap; transform: translateX(-50%); transition: left 0.5s var(--porte-courbe); }
.brc-annees { position: relative; height: 34px; margin-top: 8px; font-size: 13px; color: var(--porte-doux); }
.brc-annees span { position: absolute; top: 12px; transform: translateX(-50%); }
.brc-annees span::before { content: ""; position: absolute; left: 50%; top: -12px; width: 2px; height: 8px; border-radius: 1px; background: var(--porte-non); }
.brc-annees .is-auj { right: 0px; transform: none; color: var(--porte-encre); font-weight: 500; left: auto !important; }
.brc-annees .is-auj::before { display: none; }
.brc-frise.is-tiree .brc-periode, .brc-frise.is-tiree .brc-poignee, .brc-frise.is-tiree .brc-bulle { transition: none; }
.brc-frise.is-tiree .brc-poignee { cursor: grabbing; transform: translate(-50%, -50%) scale(1.12); }
.brc-segment { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: 24px; padding: 4px; border-radius: 12px; background: var(--porte-segment); }
.brc-segment button { height: 38px; border: 0px; border-radius: 9px; background: none; color: var(--porte-doux); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 15px; font-weight: 500; cursor: pointer; transition: background 0.2s, color 0.2s; }
.brc-segment button[aria-pressed="true"] { background: var(--porte-curseur); color: var(--porte-encre); box-shadow: rgba(0, 0, 0, 0.08) 0px 1px 3px; }
.brc-zone-date { position: relative; margin-top: 12px; }
.brc-champ-date { display: flex; align-items: center; gap: 12px; width: 100%; height: 54px; padding: 0px 18px; border: 0px; border-radius: 12px; background: var(--porte-champ); color: var(--porte-encre); font: inherit; text-align: left; cursor: pointer; transition: background 0.2s, box-shadow 0.2s; }
.brc-champ-date > svg { flex: 0 0 auto; width: 20px; height: 20px; color: var(--porte-encre-2); }
.brc-champ-date span { font-size: 16px; color: var(--porte-doux); white-space: nowrap; }
.brc-champ-date b { flex: 1 1 0%; min-width: 0px; font-size: 16px; font-weight: 500; }
.brc-champ-date .brc-chev { color: var(--porte-pale); transition: transform 0.25s var(--porte-courbe); }
.brc-champ-date[aria-expanded="true"] { background: var(--porte-champ-focus); box-shadow: 0 0 0 1.5px var(--porte-anneau), 0 0 0 5px color-mix(in srgb, var(--porte-anneau) 16%, transparent); }
.brc-champ-date[aria-expanded="true"] .brc-chev { transform: rotate(180deg); }
.brc-cal { --cal-bouton: color-mix(in srgb, var(--porte-encre) 5%, transparent); --cal-survol: color-mix(in srgb, var(--porte-encre) 8%, transparent); position: absolute; left: 0px; top: calc(100% + 8px); z-index: 40; width: 332px; box-sizing: border-box; padding: 12px; border-radius: 20px; background: var(--porte-champ-focus); color: var(--porte-encre); box-shadow: rgba(0, 0, 0, 0.06) 0px 1px 3px, rgba(0, 0, 0, 0.14) 0px 12px 32px -6px; transform-origin: 40px 0px; animation: brc-cal-entree 0.22s var(--porte-courbe) both; }
@keyframes brc-cal-entree { 
  0% { opacity: 0; transform: translateY(-6px) scale(0.98); }
}
.brc-cal button { font: inherit; color: inherit; }
.brc-cal .porte-bouton { width: 100%; color: var(--porte-bouton-texte); }
.brc-cal-tete { display: flex; align-items: center; justify-content: space-between; height: 32px; }
.brc-cal-titre { display: inline-flex; align-items: center; gap: 4px; height: 32px; margin-left: -2px; padding: 0px 8px; border: 0px; border-radius: 10px; background: none; letter-spacing: -0.01em; cursor: pointer; font-size: 16px !important; font-weight: 600 !important; }
.brc-cal-titre svg { width: 18px; height: 18px; color: var(--porte-doux); transition: transform 0.25s var(--porte-courbe); }
.brc-cal-titre[aria-expanded="true"] svg { transform: rotate(180deg); }
.brc-cal-navs { display: flex; gap: 8px; }
.brc-cal-nav { display: grid; place-items: center; width: 32px; height: 32px; padding: 0px; border: 0px; border-radius: 50%; background: var(--cal-bouton); cursor: pointer; }
.brc-cal-nav svg { width: 18px; height: 18px; }
.brc-cal-nav:disabled { opacity: 0.35; cursor: default; }
.brc-cal-semaine, .brc-cal-grille { display: grid; grid-template-columns: repeat(7, 44px); }
.brc-cal-semaine { margin-top: 14px; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--porte-pale); text-align: center; }
.brc-cal-grille { margin-top: 8px; grid-auto-rows: 40px; }
.brc-cal-jour { display: grid; place-items: center; place-self: center; width: 36px; height: 36px; padding: 0px; border: 0px; border-radius: 50%; background: none; font-size: 15px; font-variant-numeric: tabular-nums; cursor: pointer; transition: background 0.15s; }
.brc-cal-jour.is-dehors, .brc-cal-jour:disabled { color: var(--porte-non); cursor: default; }
.brc-cal-jour.is-auj { box-shadow: inset 0 0 0 1.5px var(--porte-trait); font-weight: 600; }
.brc-cal-jour[aria-pressed="true"] { background: var(--porte-bouton); font-weight: 600; box-shadow: none; color: var(--porte-bouton-texte) !important; }
.brc-cal-mois { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 16px; }
.brc-cal-mois button { height: 44px; border: 0px; border-radius: 12px; background: var(--cal-bouton); font-size: 15px; cursor: pointer; transition: background 0.15s; }
.brc-cal-mois button[aria-pressed="true"] { background: var(--porte-bouton); font-weight: 600; color: var(--porte-bouton-texte) !important; }
.brc-cal-mois button:disabled { color: var(--porte-non); background: none; cursor: default; }
.brc-cal-titre:hover, .brc-cal-nav:hover:not(:disabled), button.brc-cal-jour:hover:not(:disabled):not([aria-pressed="true"]), .brc-cal-mois button:hover:not(:disabled):not([aria-pressed="true"]) { background: var(--cal-survol); }
.brc-cal-voile, .brc-cal-poignee, .brc-cal-valider { display: none !important; }
.brc-scene { margin-bottom: 16px; }
.brc-lignes { display: grid; gap: 6px; }
.brc-ligne { display: grid; grid-template-columns: auto minmax(0px, 1fr) auto; grid-template-areas: "ph nom gain" "ph prix gain"; column-gap: 14px; align-items: center; align-content: center; height: 56px; box-sizing: border-box; padding: 0px 14px 0px 10px; border-radius: 14px; background: var(--brc-tuile); box-shadow: var(--brc-ombre); animation: brc-entree 0.45s var(--porte-courbe) both; }
@keyframes brc-entree { 
  0% { opacity: 0; transform: translateY(8px); }
}
.brc-photos { grid-area: ph; display: flex; gap: 4px; min-width: 36px; }
.brc-photos img, .brc-photos .brc-sans-photo { display: block; width: 36px; height: 36px; border-radius: 9px; object-fit: cover; background: var(--porte-champ); }
.brc-photos .is-achat { filter: brightness(0.94) saturate(0.92); }
.brc-ligne-nom { grid-area: nom; font-size: 15px; line-height: 20px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brc-ligne-prix { grid-area: prix; display: flex; align-items: center; gap: 6px; font-size: 13px; line-height: 18px; color: var(--porte-doux); white-space: nowrap; font-variant-numeric: tabular-nums; }
.brc-ligne-prix svg { flex: 0 0 auto; width: 14px; height: 14px; color: var(--porte-pale); }
.brc-gain { grid-area: gain; font-size: 16px; line-height: 20px; font-weight: 600; color: var(--porte-fait); font-variant-numeric: tabular-nums; }
.brc-ligne.is-groupe { height: 52px; }
.brc-ligne.is-groupe .brc-photos { min-width: 76px; }
.brc-ligne.is-groupe .brc-gain { color: var(--porte-encre); }
.brc-groupes { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 16px; margin: 0px 0px 22px; }
.brc-groupe-nom { display: flex; align-items: center; gap: 3px; height: 16px; font-size: 13px; line-height: 16px; font-weight: 500; color: var(--porte-pale); white-space: nowrap; overflow: hidden; }
.brc-groupe[data-statut="courant"] .brc-groupe-nom { color: var(--porte-encre); }
.brc-groupe[data-statut="fait"] .brc-groupe-nom { color: var(--porte-encre-2); }
.brc-groupe-nom svg { flex: 0 0 auto; width: 14px; height: 14px; color: var(--porte-fait); }
.brc-groupe-cases { display: flex; gap: 3px; margin-top: 6px; }
.brc-groupe-cases i { flex: 1 1 0%; height: 4px; border-radius: 2px; background: var(--porte-trait); transition: background 0.3s; }
.brc-groupe-cases i.is-fait { background: var(--porte-encre); }
.brc-groupe-cases i.is-courant { background: var(--porte-anneau); }
.brc-groupe-cases i.is-arrivee { background: color-mix(in srgb, var(--porte-anneau) 40%, transparent); }
.brc-lot { display: grid; gap: 6px; padding: 12px; border-radius: 20px; background: var(--porte-carte); }
.brc-lot-ligne { border-radius: 14px; background: var(--brc-tuile); box-shadow: var(--brc-ombre); transition: box-shadow 0.15s; }
.brc-lot-ligne:hover { box-shadow: var(--brc-ombre), 0 0 0 1px var(--porte-filet); }
.brc-lot-tete { display: flex; align-items: center; height: 60px; padding-left: 14px; }
.brc-lot-case { display: grid; place-items: center; flex: 0 0 auto; padding: 0px; border: 0px; background: none; cursor: pointer; }
.brc-lot-case:focus-visible, .brc-lot-ouvrir:focus-visible { outline: 2px solid var(--porte-anneau); outline-offset: 2px; border-radius: 10px; }
.brc-lot-ouvrir { flex: 1 1 0%; min-width: 0px; display: grid; grid-template-columns: auto minmax(0px, 1fr) auto auto; grid-template-areas: "ph nom pct chev" "ph prix pct chev"; column-gap: 12px; align-items: center; align-content: center; height: 60px; padding: 0px 14px 0px 12px; border: 0px; border-radius: 0px 14px 14px 0px; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.brc-lot-ligne[data-coche="false"] .brc-lot-ouvrir > :not(.brc-chev):not(.is-ira) { opacity: 0.45; }
.brc-pct { grid-area: pct; padding: 3px 9px; border-radius: 12px; background: var(--porte-fait-fond); color: var(--porte-fait); font-size: 12px; line-height: 18px; font-weight: 600; white-space: nowrap; }
.brc-pct.is-ira { display: inline-flex; align-items: center; gap: 4px; background: var(--porte-champ); color: var(--porte-encre-2); }
.brc-pct.is-ira svg { width: 12px; height: 12px; color: var(--porte-doux); }
.brc-lot-ouvrir .brc-chev { grid-area: chev; width: 18px; height: 18px; color: var(--porte-pale); transition: transform 0.25s var(--porte-courbe); }
.brc-lot-ligne.is-ouverte .brc-chev { transform: rotate(180deg); }
.brc-detail { margin: 0px 14px; padding: 14px 0px; border-top: 1px solid var(--porte-filet); animation: brc-deplier 0.3s var(--porte-courbe) both; }
@keyframes brc-deplier { 
  0% { opacity: 0; transform: translateY(-4px); }
}
.brc-detail-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.brc-detail-photos .brc-cadre { height: 180px; aspect-ratio: auto; border-radius: 12px; }
.brc-petit { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; height: 40px; padding: 0px 14px; border: 0px; border-radius: 10px; background: var(--porte-champ); color: var(--porte-encre); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14px; font-weight: 500; cursor: pointer; }
.brc-petit:hover { background: var(--porte-segment); }
.brc-petit svg { width: 15px; height: 15px; color: var(--porte-fait); }
.brc-paire { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.brc-cote { min-width: 0px; }
.brc-cadre { position: relative; aspect-ratio: 272 / 250; border-radius: 18px; overflow: hidden; background: var(--porte-carte); }
.brc-cadre img { display: block; width: 100%; height: 100%; object-fit: cover; }
.brc-cadre .brc-sans-photo { display: grid; place-items: center; width: 100%; height: 100%; color: var(--porte-pale); font-size: 13px; }
.brc-etiq { position: absolute; left: 12px; top: 12px; padding: 5px 10px; border-radius: 9px; background: rgba(255, 255, 255, 0.94); color: rgb(24, 24, 27); font-size: 13px; font-weight: 500; }
.brc-sous-photo { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-top: 10px; padding: 0px 2px; }
.brc-sous-photo b { font-size: 20px; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.brc-sous-photo span { font-size: 14px; color: var(--porte-doux); white-space: nowrap; }
.brc-boutique-de { display: block; padding: 0px 2px; font-size: 13px; color: var(--porte-doux); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brc-detail-photos .brc-sous-photo b { font-size: 16px; }
.brc-detail-photos .brc-sous-photo span { font-size: 13px; }
.brc-detail-photos .brc-etiq { left: 10px; top: 10px; padding: 3px 8px; border-radius: 8px; font-size: 12px; }
.brc-jauge { position: absolute; left: 50%; top: calc(50% - 26px); width: 84px; height: 84px; border-radius: 50%; background: var(--porte-fond); box-shadow: rgba(0, 0, 0, 0.16) 0px 6px 20px; transform: translate(-50%, -50%); }
.brc-jauge svg { position: absolute; inset: 6px; width: 72px; height: 72px; transform: rotate(-90deg); }
.brc-jauge circle { fill: none; stroke-width: 6; }
.brc-jauge .is-fond { stroke: var(--porte-trait); }
.brc-jauge .is-arc { stroke-linecap: round; transition: stroke-dashoffset 0.9s var(--porte-courbe); }
.brc-jauge b { position: absolute; inset: 0px; display: grid; place-items: center; font-size: 18px; font-weight: 600; letter-spacing: -0.02em; }
.brc-puces { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.brc-puce { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0px 12px; border-radius: 15px; font-size: 14px; font-weight: 500; }
.brc-puce svg { width: 15px; height: 15px; }
.brc-puce[data-ton="fait"] { background: var(--porte-fait-fond); color: var(--porte-fait); }
.brc-puce[data-ton="neutre"] { background: var(--porte-champ); color: var(--porte-doux); }
.brc-puce[data-ton="non"] { background: var(--porte-erreur-fond); color: var(--porte-erreur); }
.brc-puce[data-ton="bleu"] { background: color-mix(in srgb, var(--porte-anneau) 12%, var(--porte-fond)); color: var(--porte-lien); }
.brc-detail .brc-puces { margin-top: 14px; }
.brc-detail .brc-puce { height: 28px; font-size: 13px; }
.brc-ligne-boutons { display: grid; grid-template-columns: 2fr 1fr; gap: 10px; margin-top: 24px; }
.brc-lienb { padding: 0px; border: 0px; background: none; color: var(--porte-lien); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 15px; font-weight: 500; cursor: pointer; }
.brc-lienb:hover { text-decoration: underline; }
.brc-vente { display: flex; align-items: center; gap: 16px; padding: 14px; border-radius: 18px; background: var(--porte-carte); }
.brc-vente img, .brc-vente .brc-sans-photo { width: 84px; height: 84px; border-radius: 12px; object-fit: cover; background: var(--porte-champ); flex: 0 0 auto; }
.brc-vente strong { display: block; font-size: 17px; font-weight: 600; }
.brc-vente span { display: block; margin-top: 4px; font-size: 15px; color: var(--porte-encre-2); }
.brc-vente small { display: block; margin-top: 2px; font-size: 13px; color: var(--porte-doux); }
.brc-origines { display: grid; gap: 10px; margin-top: 16px; }
.brc-ic { display: grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; border-radius: 10px; background: var(--porte-fond); }
.brc-ic svg { width: 20px; height: 20px; }
.brc-choix .brc-fin { margin-left: auto; font-size: 15px; font-weight: 500; color: var(--porte-encre-2); }
.brc-choix .brc-chev-d { margin-left: auto; width: 18px; height: 18px; color: var(--porte-pale); }
.brc-deplie { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: -10px; padding: 4px 18px 16px 68px; border-radius: 0px 0px 12px 12px; background: var(--porte-fond); box-shadow: inset 1.5px 0 0 var(--porte-encre), inset -1.5px 0 0 var(--porte-encre), inset 0 -1.5px 0 var(--porte-encre); }
.brc-mini { display: grid; gap: 4px; padding: 8px 12px; border-radius: 10px; background: var(--porte-champ); }
.brc-mini label { font-size: 12px; color: var(--porte-doux); }
.brc-mini input { width: 100%; padding: 0px; border: 0px; background: none; color: var(--porte-encre); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 16px; font-weight: 500; outline: none; }
.brc-mini:focus-within { background: var(--porte-champ-focus); box-shadow: 0 0 0 1.5px var(--porte-anneau); }
.brc-recherche { display: flex; align-items: center; gap: 10px; height: 50px; padding: 0px 16px; border-radius: 12px; background: var(--porte-champ); }
.brc-recherche svg { flex: 0 0 auto; width: 18px; height: 18px; color: var(--porte-doux); }
.brc-recherche input { flex: 1 1 0%; min-width: 0px; border: 0px; background: none; color: var(--porte-encre); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 16px; outline: none; }
.brc-liste { display: grid; gap: 6px; margin-top: 12px; max-height: 420px; overflow-y: auto; }
.brc-achat { display: flex; align-items: center; gap: 12px; width: 100%; padding: 8px 12px 8px 8px; border: 0px; border-radius: 12px; background: var(--porte-carte); color: inherit; font: inherit; text-align: left; cursor: pointer; }
.brc-achat:hover { filter: brightness(0.985); }
.brc-achat img, .brc-achat .brc-sans-photo { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 10px; object-fit: cover; background: var(--porte-champ); }
.brc-achat-txt { flex: 1 1 0%; min-width: 0px; }
.brc-achat-txt strong { display: block; font-size: 15px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brc-achat-txt small { display: block; font-size: 13px; color: var(--porte-doux); }
.brc-modules { display: grid; gap: 6px; }
.brc-module { display: grid; grid-template-columns: auto minmax(0px, 1fr) auto auto; align-items: center; column-gap: 14px; width: 100%; height: 64px; padding: 0px 14px 0px 12px; border: 0px; border-radius: 14px; background: var(--brc-tuile); box-shadow: var(--brc-ombre); color: inherit; font: inherit; text-align: left; text-decoration: none; cursor: pointer; transition: box-shadow 0.15s; }
.brc-module:hover { box-shadow: var(--brc-ombre), 0 0 0 1px var(--porte-filet); }
.brc-module .brc-ic { width: 40px; height: 40px; border-radius: 11px; background: var(--porte-champ); }
.brc-module strong { display: block; font-size: 15px; line-height: 20px; font-weight: 500; }
.brc-module small { display: block; font-size: 13px; line-height: 18px; color: var(--porte-doux); }
.brc-module-val { font-size: 18px; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.brc-module-val.is-vert { color: var(--porte-fait); }
.brc-module > svg:last-child { width: 18px; height: 18px; color: var(--porte-pale); }
.brc-recap { display: flex; align-items: center; gap: 12px; min-height: 56px; margin-top: 12px; padding: 0px 18px; border-radius: 14px; background: var(--porte-carte); font-size: 15px; }
.brc-recap svg { flex: 0 0 auto; width: 20px; height: 20px; color: var(--porte-encre-2); }
.brc-recap span { color: var(--porte-doux); }
@media (max-width: 900px){
.brc-message { left: 50%; }
.brc-carte { padding: 18px 16px; }
.brc-frise { padding: 66px 22px 24px; }
.brc-annees span:nth-child(2n):not(.is-auj) { display: none; }
.brc-champ-date span { display: none; }
.brc-cal { position: fixed; right: 0px; bottom: 0px; width: auto; padding: 30px 16px calc(16px + env(safe-area-inset-bottom, 0px)); border-radius: 28px 28px 0px 0px; animation: brc-feuille 0.34s var(--porte-courbe) both; left: 0px !important; top: auto !important; }
@keyframes brc-feuille { 
  0% { transform: translateY(100%); }
}
.brc-cal-poignee { position: absolute; left: 50%; top: 8px; width: 36px; height: 5px; margin-left: -18px; border-radius: 3px; background: var(--porte-non); display: block !important; }
.brc-cal-voile { position: fixed; inset: 0px; z-index: 39; background: rgba(0, 0, 0, 0.32); animation: 0.25s ease 0s 1 normal both running brc-voile; display: block !important; }
@keyframes brc-voile { 
  0% { opacity: 0; }
}
.brc-cal-semaine, .brc-cal-grille { grid-template-columns: repeat(7, minmax(0px, 1fr)); }
.brc-cal-grille { grid-auto-rows: 48px; }
.brc-cal-jour { width: 42px; height: 42px; }
.brc-cal-valider { display: flex !important; margin-top: 16px; }
.brc-ligne { grid-template-areas: "ph nom gain" "ph prix prix"; column-gap: 10px; padding: 0px 12px 0px 8px; }
.brc-ligne .brc-photos { gap: 3px; }
.brc-gain { align-self: end; }
.brc-groupes { gap: 10px; }
.brc-lot { padding: 8px; }
.brc-lot-tete { padding-left: 10px; }
.brc-lot-ouvrir { grid-template-areas: "ph nom pct chev" "ph prix prix prix"; column-gap: 8px; padding: 0px 12px 0px 10px; }
.brc-lot-ligne[data-coche="false"] .brc-lot-ouvrir { grid-template-areas: "ph nom nom chev" "ph pct pct pct"; }
.brc-lot-ligne[data-coche="false"] .brc-lot-ouvrir .brc-ligne-prix { display: none; }
.brc-lot-ligne[data-coche="false"] .brc-pct.is-ira { justify-self: start; margin-top: 2px; padding: 2px 8px; }
.brc-lot-ouvrir .brc-photos { gap: 3px; min-width: 0px; }
.brc-lot-ouvrir .brc-photos img, .brc-lot-ouvrir .brc-photos .brc-sans-photo { width: 32px; height: 32px; }
.brc-detail-photos { gap: 10px; }
.brc-detail-photos .brc-cadre { height: auto; aspect-ratio: 1 / 1; }
.brc-paire { gap: 12px; }
.brc-jauge { width: 66px; height: 66px; }
.brc-jauge svg { inset: 5px; width: 56px; height: 56px; }
.brc-jauge b { font-size: 15px; }
.brc-ligne-boutons { grid-template-columns: 1fr; }
.brc-deplie { padding-left: 18px; }
.brc-boutiques { margin: 0px 16px; }
}
@media (prefers-reduced-motion: reduce){
.brc-ligne, .brc-detail, .brc-cal, .brc-cal-voile { animation: auto ease 0s 1 normal none running none; }
.brc-periode, .brc-poignee, .brc-bulle, .brc-jauge .is-arc { transition: none; }
}