:root{--illustration:url('/fond.jpg');--illustration-mobile:url('/fond-mobile.jpg')}
.ecran-connexion{background-image:var(--illustration)}
.coquille::before{background-image:linear-gradient(color-mix(in srgb,var(--fond) 45%,transparent),color-mix(in srgb,var(--fond) 62%,transparent)),var(--illustration);background-position:center 40%}
.heros{background-image:linear-gradient(100deg,rgba(64,38,190,.95),rgba(108,76,245,.86) 45%,rgba(108,76,245,.25)),var(--illustration)}
.galerie-fonds{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:16px}
.choix-fond{position:relative;padding:0;overflow:hidden;border:3px solid var(--trait);border-radius:20px;background:var(--carte);color:var(--encre);cursor:pointer;text-align:left;font:inherit;box-shadow:var(--ombre)}
.choix-fond img{display:block;width:100%;height:240px;object-fit:cover}.choix-fond>span{display:block;padding:12px;font-size:.9rem;font-weight:800}.choix-fond.actif,.choix-fond:hover{border-color:var(--violet)}
.choix-fond>b{display:none;position:absolute;right:8px;top:8px;width:30px;height:30px;border-radius:50%;background:var(--violet-f);color:white;text-align:center;line-height:30px}.choix-fond.actif>b{display:block}
button:focus-visible,a:focus-visible{outline:3px solid var(--violet);outline-offset:4px}.choix-theme{flex-wrap:wrap}.choix-theme .onglet{min-height:44px}
.budget-chiffres{margin:18px 0 10px}.budget-chiffres strong{display:block;font:800 clamp(1.5rem,3vw,2rem) var(--titre);margin-top:8px;overflow-wrap:anywhere}.budget-alerte{border-color:var(--corail)}
.budget-progress{width:100%;height:9px;accent-color:var(--violet);border:0}.budget-categorie+.budget-categorie{margin-top:14px}.budget-operation{display:flex;gap:12px;align-items:center}.budget-operation>div{flex:1;min-width:0;overflow-wrap:anywhere}.budget-operation>strong{white-space:nowrap}.budget-vide{text-align:center;padding:36px 20px}
.nav-mobile{overflow-x:auto}.nav-mobile a{min-width:60px}
:root[data-theme="dark"]{--encre-3:#AAA3CB;--violet:#B4A2FF}:root[data-theme="dark"] .btn:not(.fantome):not(.corail){--c:#6C4CF5;--cf:#4E2FD6}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--encre-3:#AAA3CB;--violet:#B4A2FF}:root:not([data-theme="light"]) .btn:not(.fantome):not(.corail){--c:#6C4CF5;--cf:#4E2FD6}}
@media(max-width:900px){.coquille::before{background-image:linear-gradient(color-mix(in srgb,var(--fond) 45%,transparent),color-mix(in srgb,var(--fond) 62%,transparent)),var(--illustration-mobile);background-position:center top}}
@media(max-width:820px){.ecran-connexion{background-image:var(--illustration-mobile);background-position:center top}}
@media(max-width:550px){.galerie-fonds{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.choix-fond img{height:220px}.budget-chiffres{grid-template-columns:1fr}.budget-operation{flex-wrap:wrap}.budget-operation>div{flex-basis:65%}}

.diapo-groupe{margin-bottom:20px}.live-slide{background:var(--fond-2);border-radius:18px;padding:clamp(18px,3vw,32px);margin:16px 0;max-height:60vh;overflow:auto}.live-slide h2{margin-top:10px}.live-slide li+li{margin-top:12px}

/* Le fond est entièrement visible : aucun agrandissement pour remplir l'écran.
   Une copie floutée remplit seulement les marges dues au format de l'écran. */
:root { --scene-image:var(--illustration); }
.coquille::after { content:'';position:fixed;inset:-24px;z-index:-2;pointer-events:none;background:var(--fond) var(--scene-image) center / cover no-repeat;filter:blur(20px); }
.coquille::before { background-image:linear-gradient(color-mix(in srgb,var(--fond) 45%,transparent),color-mix(in srgb,var(--fond) 62%,transparent)),var(--scene-image);background-size:100% 100%,contain;background-position:center,center;background-repeat:no-repeat; }
.ecran-connexion { background-color:var(--fond);background-image:var(--scene-image);background-size:contain;background-position:center;background-repeat:no-repeat;isolation:isolate; }
.ecran-connexion::before { content:'';position:absolute;inset:-24px;z-index:-1;pointer-events:none;background:var(--fond) var(--scene-image) center / cover no-repeat;filter:blur(20px); }
.heros { background-image:linear-gradient(100deg,rgba(64,38,190,.97),rgba(108,76,245,.84)); }
.choix-fond img { height:auto;aspect-ratio:9/16;object-fit:contain;background:var(--fond-2); }
@media(max-aspect-ratio:1/1) { :root { --scene-image:var(--illustration-mobile); } }
@media(min-width:1200px) and (max-width:1700px){.coquille:has(.heros,.galerie-fonds) .contenu{max-width:calc((100vw - 250px)*.64)}.coquille:has(.heros) .heros{grid-template-columns:1fr}.coquille:has(.heros) .carte-semaine{width:100%}}