/* DEV222 — Démarrage d'une nouvelle personne. Tout est limité à html.demarrage222 (#app.d222) et à #feuille222. */
:root{--d-vert:#1d5a51;--d-vert-fonce:#123f37;--d-vert-clair:#e5f0e8;--d-fond:#f5f7f2;--d-bord:#dbe3db;--d-texte:#1f332e;--d-doux:#5d6d66;--d-ambre:#8a5208;--d-ambre-clair:#fdf0dc;--d-rouge:#9b3127}
html.demarrage222,html.demarrage222 body{background:var(--d-fond)}
html.demarrage222 .testbar{display:none}
html.demarrage222 #device{max-width:none;width:100%;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:var(--d-fond);min-height:100dvh}
#app.d222{min-height:100dvh;color:var(--d-texte);font-size:16px;line-height:1.45;padding:0;max-width:none}
#app.d222 :is(h1,h2,h3,p){margin-top:0}
#app.d222 button,#feuille222 button{font:inherit;margin:0;width:auto;min-height:0;box-shadow:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
#app.d222 svg,#feuille222 svg{flex:none}

/* Boutons */
#app.d222 .d222-principal,#feuille222 .d222-principal{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 22px;border:0;border-radius:14px;background:var(--d-vert);color:#fff;font-weight:700;font-size:17px;text-align:center}
#app.d222 .d222-principal:hover,#feuille222 .d222-principal:hover{background:var(--d-vert-fonce)}
#app.d222 .d222-secondaire,#feuille222 .d222-secondaire{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 18px;border:1.5px solid var(--d-bord);border-radius:14px;background:#fff;color:var(--d-texte);font-weight:600;font-size:16px;text-align:center}
#app.d222 .d222-secondaire:hover,#feuille222 .d222-secondaire:hover{background:#f0f4ef}
#app.d222 .d222-secondaire svg,#feuille222 .d222-secondaire svg{width:20px;height:20px;color:var(--d-vert)}
#app.d222 .d222-large,#feuille222 .d222-large{display:flex;width:100%;margin-top:16px}
#feuille222 .d222-danger{color:var(--d-rouge)}
#app.d222 .d222-lien{display:inline;padding:0;border:0;background:none;color:var(--d-vert);font-weight:700;text-decoration:underline;text-underline-offset:3px}
#app.d222 .d222-bouton-icone,#feuille222 .d222-bouton-icone{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--d-texte)}
#app.d222 .d222-bouton-icone:hover,#feuille222 .d222-bouton-icone:hover{background:rgba(29,90,81,.08)}
#app.d222 .d222-bouton-icone svg,#feuille222 .d222-bouton-icone svg{width:24px;height:24px}

/* Gabarit d'une étape : en-tête mince, contenu qui défile, pied avec une seule action principale. */
#app.d222 .d222-page{display:flex;flex-direction:column;height:100dvh}
#app.d222 .d222-entete{flex:none;display:flex;align-items:center;gap:4px;padding:max(6px,env(safe-area-inset-top)) 6px 6px;background:var(--d-fond)}
#app.d222 .d222-progres{flex:1;min-width:0;text-align:center;font-size:13px;color:var(--d-doux);line-height:1.2}
#app.d222 .d222-progres b{color:var(--d-texte)}
#app.d222 .d222-barre{display:flex;gap:4px;max-width:220px;margin:7px auto 0}
#app.d222 .d222-barre i{flex:1;height:4px;border-radius:2px;background:#d9e1da}
#app.d222 .d222-barre i.fait{background:var(--d-vert)}
#app.d222 .d222-contenu{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;outline:none;padding:4px 0 28px}
#app.d222 .d222-colonne{max-width:760px;margin:0 auto;padding:0 16px}
#app.d222 .d222-pied{flex:none;padding:10px 0 max(10px,env(safe-area-inset-bottom));background:rgba(245,247,242,.94);border-top:1px solid var(--d-bord);backdrop-filter:blur(10px)}
#app.d222 .d222-pied .d222-colonne{display:flex;align-items:center;gap:12px}
#app.d222 .d222-pied .d222-principal{flex:1}
#app.d222 .d222-compte{flex:1;margin:0;font-size:14px;line-height:1.3;color:var(--d-doux)}
#app.d222 .d222-compte+.d222-principal{flex:0 0 auto;min-width:46%}

/* Textes */
#app.d222 .d222-titre{margin:6px 0 6px;font-size:28px;line-height:1.15;font-weight:800;letter-spacing:-.01em;color:var(--d-vert-fonce)}
#app.d222 .d222-sous{margin:0 0 18px;color:var(--d-doux)}
#app.d222 .d222-note{margin:8px 0 0;font-size:14px;color:var(--d-doux)}
#app.d222 .d222-vide{padding:24px 0;color:var(--d-doux);text-align:center}
#app.d222 .d222-facultatif{display:inline-block;vertical-align:.25em;margin-left:6px;padding:3px 9px;border-radius:999px;background:var(--d-vert-clair);color:var(--d-vert);font-size:12px;font-weight:700;letter-spacing:.02em}
#app.d222 .d222-erreur,#feuille222 .d222-erreur{margin:12px 0;padding:10px 14px;border-radius:12px;background:#fbe9e6;color:#86281e;font-size:15px}
#app.d222 .d222-erreur[hidden]{display:none}

/* Étape 1 : Propriété */
#app.d222 .d222-question{margin:0 0 24px;padding:0;border:0;min-width:0}
#app.d222 .d222-question legend,#app.d222 .d222-legende{display:block;margin:0 0 10px;padding:0;font-weight:700;font-size:15px;color:var(--d-texte)}
#app.d222 .d222-deux{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#app.d222 .d222-carte{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:14px;width:100%;min-height:112px;padding:16px;border:1.5px solid var(--d-bord);border-radius:18px;background:#fff;color:var(--d-texte);font-weight:700;font-size:16px;text-align:left}
#app.d222 .d222-carte-icone svg{width:32px;height:32px;color:var(--d-vert)}
#app.d222 .d222-carte[aria-pressed=true]{border-color:var(--d-vert);background:var(--d-vert-clair);box-shadow:inset 0 0 0 1px var(--d-vert)}
#app.d222 .d222-coche{position:absolute;top:8px;right:8px;display:none;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--d-vert);color:#fff}
#app.d222 .d222-coche svg{width:15px;height:15px;stroke-width:3}
#app.d222 [aria-pressed=true]>.d222-coche{display:grid}
#app.d222 .d222-segment{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:14px;background:#e6ece6}
#app.d222 .d222-segment button{min-height:46px;border:0;border-radius:11px;background:transparent;color:var(--d-doux);font-weight:700;font-size:16px}
#app.d222 .d222-segment button[aria-pressed=true]{background:#fff;color:var(--d-vert-fonce);box-shadow:0 1px 3px rgba(18,63,55,.16)}
#app.d222 .d222-ville [data-location-picker]{display:block}
#app.d222 .d222-pays{margin:0 0 8px;font-size:14px;color:var(--d-doux)}
#app.d222 .d222-ville label.field{display:block;margin:0 0 8px;font-weight:600;font-size:14px}
#app.d222 .d222-ville label.field[hidden]{display:none}
#app.d222 .d222-ville :is(input,select){min-height:52px;margin:4px 0 0;padding:0 14px;border:1.5px solid var(--d-bord);border-radius:14px;background:#fff;font-size:17px}
#app.d222 .d222-ville input:focus{border-color:var(--d-vert);outline:none;box-shadow:0 0 0 3px rgba(29,90,81,.15)}
#app.d222 .d222-ville .city-choice-hint158{margin:6px 0 0;font-size:13px;color:var(--d-doux)}
#app.d222 .d222-ville [data-city-confirmed]:empty{display:none}
#app.d222 .d222-ville [data-city-confirmed]{display:flex;align-items:center;gap:8px;margin:10px 0 0;padding:10px 14px;border-radius:12px;background:var(--d-vert-clair);color:var(--d-vert-fonce);font-weight:700;font-size:15px}
#app.d222 .d222-ville [data-city-confirmed]::before{content:"✓";display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--d-vert);color:#fff;font-size:13px}
#app.d222 .d222-ville [data-city-confirmed]:not(:empty)~[data-city-results]:empty,#app.d222 .d222-ville [data-location-picker]:has([data-city-confirmed]:not(:empty)) .city-choice-hint158{display:none}
#app.d222 [data-field-obligation]{display:none}
#app.d222 .d222-ville [data-city-results]{padding:0;background:none;font-size:14px;color:var(--d-doux)}
#app.d222 .d222-ville [data-city-results]:not(:empty){margin-top:8px}
#app.d222 .d222-ville [data-choose-city]{display:flex;flex-direction:column;align-items:flex-start;width:100%;margin:0 0 8px;padding:12px 16px;border:1.5px solid var(--d-bord);border-radius:14px;background:#fff;color:var(--d-texte);text-align:left}
#app.d222 .d222-ville [data-choose-city] strong{font-size:16px}
#app.d222 .d222-ville [data-choose-city] span{font-size:13px;color:var(--d-doux)}

/* Tuiles (biens et quotidien) */
#app.d222 .d222-recherche{display:flex;align-items:center;gap:8px;margin:0;padding:0 14px;border:1.5px solid var(--d-bord);border-radius:14px;background:#fff}
#app.d222 .d222-recherche:focus-within{border-color:var(--d-vert);box-shadow:0 0 0 3px rgba(29,90,81,.15)}
#app.d222 .d222-recherche svg{width:20px;height:20px;color:var(--d-doux)}
#app.d222 .d222-recherche input{flex:1;min-width:0;min-height:48px;margin:0;padding:0;border:0;background:transparent;font-size:16px;outline:none;box-shadow:none}
#app.d222 .d222-famille h2{margin:22px 0 10px;font-size:15px;font-weight:700;color:var(--d-doux)}
#app.d222 .d222-tuiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#app.d222 .d222-tuile{position:relative;display:flex;flex-direction:column;min-width:0;border:1.5px solid var(--d-bord);border-radius:16px;background:#fff;overflow:hidden;transition:border-color .15s,background-color .15s}
#app.d222 .d222-tuile.choisie{border-color:var(--d-vert);background:var(--d-vert-clair)}
#app.d222 .d222-tuile-choix{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;min-height:96px;padding:14px 6px 10px;border:0;border-radius:0;background:transparent;color:var(--d-texte);font-size:14px;line-height:1.2;text-align:center}
#app.d222 .d222-tuile-choix:hover{background:rgba(29,90,81,.05)}
#app.d222 .d222-pictogramme svg,#feuille222 .d222-pictogramme svg{width:30px;height:30px;color:var(--d-vert)}
#app.d222 .d222-tuile-nom{overflow-wrap:anywhere;hyphens:auto}
#app.d222 .d222-tuile .d222-coche{top:6px;right:6px;width:22px;height:22px}
#app.d222 .d222-tuile-detail{display:flex;align-items:center;justify-content:center;gap:2px;width:100%;min-height:36px;padding:0 4px;border:0;border-top:1px solid rgba(29,90,81,.18);border-radius:0;background:rgba(255,255,255,.6);color:var(--d-vert);font-size:12.5px;font-weight:700}
#app.d222 .d222-tuile-detail svg{width:14px;height:14px}
#app.d222 .d222-tuile-detail.attention{background:var(--d-ambre-clair);color:var(--d-ambre)}

/* Étape 3 : Disponibilités */
#app.d222 .d222-suggestion{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;margin:0 0 14px;padding:12px 16px;border:1.5px dashed #94b8a6;border-radius:14px;background:#fff;color:var(--d-texte);text-align:left}
#app.d222 .d222-suggestion b{color:var(--d-vert);font-size:12.5px;text-transform:uppercase;letter-spacing:.05em}
#app.d222 .d222-jour{margin:0 0 8px;padding:0 14px;border:1.5px solid var(--d-bord);border-radius:14px;background:#fff}
#app.d222 .d222-jour.actif{border-color:#a9c7b6}
#app.d222 .d222-heures{display:flex;align-items:center;gap:10px;padding:0 0 12px}
#app.d222 .d222-heures input{flex:1;min-width:0;min-height:44px;margin:0;padding:0 8px;border:1.5px solid var(--d-bord);border-radius:10px;background:#f8faf7;font-size:16px;text-align:center}
#app.d222 .d222-heures span{color:var(--d-doux)}
#app.d222 .d222-vacances h2{margin:26px 0 2px;font-size:18px}
#app.d222 .d222-vacance{display:grid;grid-template-columns:1fr 1fr 44px;gap:8px;align-items:end;margin:12px 0 0}
#app.d222 .d222-vacance label{margin:0;font-size:13px;font-weight:700;color:var(--d-doux)}
#app.d222 .d222-vacance input{min-height:44px;margin:4px 0 0;padding:0 8px;border:1.5px solid var(--d-bord);border-radius:10px;font-size:15px}
#app.d222 .d222-vacance .d222-bouton-icone{color:var(--d-rouge)}

/* Interrupteurs (jours, tâches d'un bien) */
:is(#app.d222,#feuille222) .d222-interrupteur{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;margin:0;padding:8px 0;border:0;border-bottom:1px solid #e8eee8;border-radius:0;background:none;outline:none;cursor:pointer}
:is(#app.d222,#feuille222) .d222-jour .d222-interrupteur{border-bottom:0}
:is(#app.d222,#feuille222) .d222-interrupteur>span{min-width:0}
:is(#app.d222,#feuille222) .d222-interrupteur b{display:block;font-weight:600;font-size:16px}
:is(#app.d222,#feuille222) .d222-interrupteur small{display:block;margin-top:2px;font-size:13px;line-height:1.35;color:var(--d-doux)}
:is(#app.d222,#feuille222) input[role=switch]{appearance:none;-webkit-appearance:none;position:relative;flex:none;width:50px;height:30px;min-height:0;margin:0;padding:0;border:0;border-radius:15px;background:#c9d3cb;cursor:pointer;transition:background-color .18s}
:is(#app.d222,#feuille222) input[role=switch]::before{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .18s}
:is(#app.d222,#feuille222) input[role=switch]:checked{background:var(--d-vert)}
:is(#app.d222,#feuille222) input[role=switch]:checked::before{transform:translateX(20px)}
:is(#app.d222,#feuille222) input[role=switch]:focus-visible{outline:3px solid #ca8b38;outline-offset:2px}

/* Étape 4 : Quotidien */
#app.d222 .d222-puces{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
#app.d222 .d222-puces>span{width:100%;font-size:14px;font-weight:700;color:var(--d-doux)}
#app.d222 .d222-puces button{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1.5px solid var(--d-bord);border-radius:999px;background:#fff;color:var(--d-texte);font-weight:600;font-size:14.5px}
#app.d222 .d222-puces button[aria-pressed=true]{border-color:var(--d-vert);background:var(--d-vert);color:#fff}
#app.d222 .d222-puces svg{width:16px;height:16px;stroke-width:3}

/* Feuille : panneau du bas sur téléphone, panneau latéral sur grand écran. */
#feuille222{position:fixed;inset:auto 0 0 0;width:100%;max-width:none;height:auto;max-height:none;margin:0;padding:0;border:0;background:transparent;color:var(--d-texte);overflow:visible}
#feuille222::backdrop{background:rgba(18,40,35,.4)}
#feuille222 .d222-feuille{display:flex;flex-direction:column;width:min(100%,640px);max-height:88dvh;margin:0 auto;padding:0 0 max(12px,env(safe-area-inset-bottom));border-radius:22px 22px 0 0;background:#fff;box-shadow:0 -8px 30px rgba(0,0,0,.14)}
#feuille222 .d222-feuille-poignee{width:40px;height:5px;margin:8px auto 0;border-radius:3px;background:#d3dbd4}
#feuille222 .d222-feuille-tete{display:flex;align-items:center;gap:8px;padding:6px 10px 4px 20px}
#feuille222 .d222-feuille-tete h2{flex:1;display:flex;align-items:center;gap:10px;margin:0;font-size:19px;line-height:1.25}
#feuille222 .d222-feuille-corps{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 20px 14px}
#feuille222 .d222-feuille-pied{display:flex;gap:10px;padding:12px 20px 0;border-top:1px solid #e8eee8}
#feuille222 .d222-feuille-pied>*{flex:1}
#feuille222 .d222-petit-titre{margin:16px 0 0;font-size:15px}
#feuille222 .d222-note{margin:2px 0 4px;font-size:14px;color:var(--d-doux)}
#feuille222 .d222-exemplaire h3:not(.d222-petit-titre){margin:18px 0 0;font-size:16px}
#feuille222 .d222-aide{margin:4px 0 8px;padding-left:20px}
#feuille222 .d222-aide li{margin:0 0 12px}
#feuille222 :is(select,input:not([type=checkbox]):not([type=radio])){min-height:48px;border-radius:12px;font-size:16px}
#feuille222 .variant-choice138{margin:12px 0 0}
#feuille222 fieldset.variant-choice138{padding:12px 14px;border:1.5px solid var(--d-bord);border-radius:14px}
#feuille222 .multiple-names{margin:8px 0 0}
#feuille222 .d222-cache{display:none!important}
#feuille222 .d222-champ{display:block;min-width:0;margin:14px 0 0;padding:0;border:0;font-weight:700;font-size:15px}
#feuille222 .d222-champ[hidden],#feuille222 [data-perso-dates][hidden]{display:none}
#feuille222 .d222-champ legend{margin:0 0 8px;padding:0}
#feuille222 .d222-champ>input{display:block;width:100%;margin:6px 0 0;padding:0 14px;border:1.5px solid var(--d-bord);border-radius:12px;background:#fff;font-weight:400}
#feuille222 .d222-champ>input[name=count]{width:110px;margin:0 0 10px}
#feuille222 #d222-perso>.d222-interrupteur{margin-top:6px}
#feuille222 .d222-choix-puces{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#feuille222 .d222-choix-puces label{display:block;margin:0;padding:0;border:0;background:none;outline:none}
#feuille222 .d222-choix-puces input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
#feuille222 .d222-choix-puces span{display:flex;align-items:center;justify-content:center;min-height:46px;padding:6px 10px;border:1.5px solid var(--d-bord);border-radius:12px;background:#fff;font-weight:600;font-size:15px;line-height:1.2;text-align:center;cursor:pointer}
#feuille222 .d222-choix-puces input:checked+span{border-color:var(--d-vert);background:var(--d-vert);color:#fff}
#feuille222 .d222-choix-puces input:focus-visible+span{outline:3px solid #ca8b38;outline-offset:2px}
#feuille222 .d222-resume:empty{display:none}
#feuille222 .d222-resume{margin:14px 0 0;padding:10px 14px;border-radius:12px;background:var(--d-vert-clair);color:var(--d-vert-fonce);font-size:14px}
#feuille222 .d222-liste{margin:0;padding:0;list-style:none}
#feuille222 .d222-liste li{display:flex;align-items:center;gap:8px;padding:12px 0;border-bottom:1px solid #e8eee8}
#feuille222 .d222-liste li>span{flex:1;min-width:0}
#feuille222 .d222-liste b{display:block}
#feuille222 .d222-liste small{display:block;color:var(--d-doux);font-size:13px}
#feuille222 .d222-liste .d222-secondaire{min-height:40px;padding:0 12px;font-size:14px}

/* Accueil */
#app.d222 .d222-accueil{display:flex;flex-direction:column;gap:18px;min-height:100dvh;max-width:1120px;margin:0 auto;padding:max(28px,env(safe-area-inset-top)) 20px max(16px,env(safe-area-inset-bottom))}
#app.d222 .d222-accueil-cadre{display:contents}
#app.d222 .d222-marque{display:flex;align-items:center;gap:10px;margin:0;font-weight:800;font-size:16px;color:var(--d-vert-fonce)}
#app.d222 .d222-marque>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--d-vert);color:#fff}
#app.d222 .d222-marque svg{width:20px;height:20px}
#app.d222 .d222-accueil h1{margin:18px 0 8px;font-size:clamp(30px,8vw,52px);line-height:1.08;font-weight:800;letter-spacing:-.02em;color:var(--d-vert-fonce)}
#app.d222 .d222-accroche{margin:0;font-size:18px;color:var(--d-doux)}
#app.d222 .d222-piliers{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#app.d222 .d222-piliers figure{margin:0;padding:10px 10px 14px;border:1px solid #e3eae1;border-radius:22px;background:#f8fbf5;text-align:center;box-shadow:0 6px 18px rgba(18,63,55,.06)}
#app.d222 .d222-piliers img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}
#app.d222 .d222-piliers figcaption{margin-top:4px;font-weight:700;font-size:15px;line-height:1.25;color:var(--d-vert-fonce)}
#app.d222 .d222-accueil-texte,#app.d222 .d222-accueil-action{margin-top:auto}
#app.d222 .d222-accueil-action .d222-principal{width:100%;min-height:56px;font-size:18px}
#app.d222 .d222-accueil-action p{margin:10px 0 0;text-align:center;font-size:14px;color:var(--d-doux)}
#app.d222 .d222-origine{margin:0;text-align:center;font-size:12.5px;color:#84928a}

/* Fin */
#app.d222 .d222-fin{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100dvh;max-width:520px;margin:0 auto;padding:32px 20px max(20px,env(safe-area-inset-bottom));text-align:center}
#app.d222 .d222-fin-icone{display:grid;place-items:center;width:76px;height:76px;margin-bottom:18px;border-radius:50%;background:var(--d-vert-clair);color:var(--d-vert);animation:d222-apparition .45s ease-out both}
#app.d222 .d222-fin-icone svg{width:40px;height:40px;stroke-width:2.6}
#app.d222 .d222-fin h1{margin:0 0 4px;font-size:28px;color:var(--d-vert-fonce)}
#app.d222 .d222-bilan{display:grid;gap:8px;width:100%;margin:18px 0 28px;padding:0;list-style:none}
#app.d222 .d222-bilan li{display:flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid var(--d-bord);border-radius:14px;background:#fff;text-align:left}
#app.d222 .d222-bilan b{min-width:34px;font-size:22px;color:var(--d-vert)}
#app.d222 .d222-fin-actions{display:grid;gap:10px;width:100%}
@keyframes d222-apparition{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){#app.d222 .d222-fin-icone{animation:none}#app.d222 .d222-tuile,:is(#app.d222,#feuille222) input[role=switch],:is(#app.d222,#feuille222) input[role=switch]::before{transition:none}}

/* Petits téléphones */
@media (max-width:359px){#app.d222 .d222-tuiles{gap:8px}#app.d222 .d222-tuile-choix{min-height:88px;font-size:13px}#app.d222 .d222-titre{font-size:25px}#app.d222 .d222-colonne{padding:0 12px}}
/* Tablettes et ordinateurs */
@media (min-width:600px){
 #app.d222 .d222-tuiles{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
 #app.d222 .d222-tuile-choix{min-height:112px;font-size:15px}
 #app.d222 .d222-titre{font-size:32px}
 #app.d222 .d222-pied .d222-colonne{justify-content:flex-end}
 #app.d222 .d222-pied .d222-principal{flex:0 0 auto;min-width:240px}
 #app.d222 .d222-compte+.d222-principal{min-width:240px}
 #app.d222 .d222-entete{padding:10px 16px}
 #app.d222 .d222-barre{max-width:320px}
 #app.d222 .d222-jours{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}
 #app.d222 .d222-deux .d222-carte{min-height:128px}
}
@media (min-width:900px){
 #feuille222{inset:0 0 0 auto;width:440px;height:100dvh}
 #feuille222 .d222-feuille{width:100%;height:100%;max-height:none;border-radius:22px 0 0 22px;box-shadow:-8px 0 30px rgba(0,0,0,.14)}
 #feuille222 .d222-feuille-poignee{display:none}
 #feuille222 .d222-feuille-tete{padding-top:16px}
 #app.d222 .d222-accueil{padding:40px}
 #app.d222 .d222-accueil-cadre{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-areas:"texte piliers" "action piliers";align-content:center;align-items:end;column-gap:64px;row-gap:28px;flex:1}
 #app.d222 .d222-accueil-texte{grid-area:texte;margin-top:0}
 #app.d222 .d222-accueil-action{grid-area:action;align-self:start;margin-top:0}
 #app.d222 .d222-accueil-action .d222-principal{width:auto;min-width:280px}
 #app.d222 .d222-accueil-action p{text-align:left}
 #app.d222 .d222-piliers{grid-area:piliers;align-self:center;gap:18px}
 #app.d222 .d222-origine{text-align:left}
}