/*
 * Habillage « autocollants » : surcharge visuelle uniquement (aucune fonctionnalité modifiée).
 * Chargé entre lh-base.css et lh.css / lh-night.css. Mode nuit = classe body.mode-nuit.
 */
:root { --st-navy: #16194D; --st-ring: #fff; --st-fond: #F4F6FB; }
body.mode-nuit { --st-navy: #F1F2FF; --st-ring: #1B1E4A; --st-fond: #0E1030; }
@font-face { font-family: "Poppins"; font-weight: 600 800; src: local("Poppins SemiBold"), local("Poppins-SemiBold"), local("Poppins ExtraBold"), local("Poppins-ExtraBold"); }
:root { --st-titre: Poppins, "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }

/* icône autocollant : contour blanc + ombre douce */
.st { width: 100%; height: 100%; overflow: visible; display: block;
	filter: drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(0 5px 6px rgba(22,25,77,.25)); }

/* ---------- Accueil ---------- */
.accueil-bandeau { display: none; }
.accueil-appnom { font-family: var(--st-titre); font-size: .9em; font-weight: 600; letter-spacing: 0; text-transform: none; }
.accueil .accueil-date { font-family: var(--st-titre)!important; font-size: 1.85em!important; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.accueil-section, .accueil .accueil-section {
	font-family: var(--st-titre); font-weight: 800; font-size: 1.02em !important; letter-spacing: 0 !important;
	text-transform: none !important; border-left: 0 !important; padding-left: 0 !important; margin: 30px 8px 12px;
}
.accueil-section::before, .accueil-section::after { content: none !important; display: none !important; }

.tuiles { grid-template-columns: 1fr 1fr; gap: 20px 18px; padding: 6px; }
.tuile, .tuile--large {
	grid-column: auto; position: relative; flex-direction: column; align-items: center; justify-content: flex-start;
	gap: 0; min-height: 150px; height: 150px; padding: 12px 10px 10px; border-radius: 28px; text-align: center;
	background: linear-gradient(180deg, var(--t1, #E7E3FB), var(--t2, #C1B8F4)); color: var(--tc, #16194D);
	box-shadow: 0 0 0 7px var(--st-ring), 0 12px 24px rgba(22,25,77,.10);
}
.tuiles[aria-label="Ressources"] .tuile--large { grid-column: span 2; height: 110px; min-height: 110px; }
.tuile .pastille, .tuile--large .pastille { width: 72px; height: 72px; background: transparent; color: inherit; margin-top: 4px; transform: rotate(-4deg); }
.tuile .pastille .st { width: 100%; height: 100%; }
.tuile-nom { position: absolute; left: 10px; right: 10px; bottom: 10px; background: rgba(255,255,255,.84); border-radius: 99px; padding: 7px 4px;
	font-family: var(--st-titre); font-weight: 800; font-size: .95em; text-align: center; line-height: 1.15; color: var(--tc, #16194D); }
.tuile-sous { display: none; }
.tuile[data-office="messe"]    { --t1:#FBE3E7; --t2:#EBB1BB; --tc:#8E2434; }
.tuile[data-office="lectures"] { --t1:#DDF2F0; --t2:#A9D9D5; --tc:#1E6B67; }
.tuile[data-office="laudes"]   { --t1:#FFF0C9; --t2:#F7D37A; --tc:#8A5A00; }
.tuile[data-office="milieu"]   { --t1:#DDEBFB; --t2:#A8C8F0; --tc:#1F5A99; }
.tuile[data-office="vepres"]   { --t1:#FFE6D4; --t2:#F8B98F; --tc:#A24716; }
.tuile[data-office="complies"] { --t1:#E7E3FB; --t2:#C1B8F4; --tc:#4A3CB4; }
.tuiles[aria-label="Ressources"] .tuile { --t1:#E4EAFF; --t2:#BFCBFA; --tc:#2C3E9E; }
body.mode-nuit .tuile { background: linear-gradient(180deg, var(--d1, #2A2E66), var(--d2, #1F2255)); --tc: #fff; box-shadow: 0 0 0 7px var(--st-ring); }
body.mode-nuit .tuile-nom { background: rgba(14,16,48,.55); }
body.mode-nuit .tuile[data-office="messe"]    { --d1:#5A1A27; --d2:#3E1019; }
body.mode-nuit .tuile[data-office="lectures"] { --d1:#164B49; --d2:#0F3433; }
body.mode-nuit .tuile[data-office="laudes"]   { --d1:#6E4A00; --d2:#4A3000; }
body.mode-nuit .tuile[data-office="milieu"]   { --d1:#1B3F70; --d2:#112A4C; }
body.mode-nuit .tuile[data-office="vepres"]   { --d1:#74340F; --d2:#4C220A; }
body.mode-nuit .tuile[data-office="complies"] { --d1:#3A2F85; --d2:#261E5C; }
.tuile--now { outline: 3px solid #F2A413; outline-offset: 9px; }
.tuile-badge { top: 8px; right: 8px; font-size: .62em; background: #F2A413; color: #16194D; }
.accueil .choix-carte, .accueil-temps { font-family: var(--st-titre); }

/* ---------- Pages d'office : en-tête gardé + grosse icône, cartes blanches arrondies ---------- */
:is(ons-page.page#laudes,ons-page.page#lectures,ons-page.page#milieu,ons-page.page#vepres,ons-page.page#complies,ons-page.page#messe) .entete { position: relative; border-radius: 0 0 40px 40px !important; padding-right: 110px !important; }
.st-entete { position: absolute; right: 18px; top: 16px; width: 84px; height: 84px; transform: rotate(6deg); z-index: 1; pointer-events: none; }
:is(ons-page.page#laudes,ons-page.page#lectures,ons-page.page#milieu,ons-page.page#vepres,ons-page.page#complies,ons-page.page#messe) .entete [id$="_titre_principal"] h1 {
	font-family: var(--st-titre)!important; font-weight: 800; font-size: 1.7rem!important; letter-spacing: -.02em; }
:is(ons-page.page#laudes,ons-page.page#lectures,ons-page.page#milieu,ons-page.page#vepres,ons-page.page#complies,ons-page.page#messe) .cadre .partie {
	background: var(--lh-surface); border-radius: 28px; padding: 6px 6px 12px; margin-top: 14px; margin-bottom: 0;
	box-shadow: 0 8px 20px rgba(22,25,77,.07);
}
:is(ons-page.page#laudes,ons-page.page#lectures,ons-page.page#milieu,ons-page.page#vepres,ons-page.page#complies,ons-page.page#messe) .cadre .partie > h2 {
	font-family: var(--st-titre); font-weight: 800; font-style: normal; text-transform: none; letter-spacing: 0; font-size: 1rem !important; }

/* ---------- Page « Plus » ---------- */
.plus { padding: 12px 16px 130px; font-family: var(--st-titre); }
.plus-titre { font-size: 2.3rem; font-weight: 800; letter-spacing: -.02em; margin: 22px 6px 14px; text-align: left; }
.plus-section { font-weight: 800; font-size: .92rem; color: var(--lh-muted); margin: 20px 8px 8px; text-align: left; text-transform: none; letter-spacing: 0; }
.plus-liste { background: var(--lh-surface); border-radius: 30px; box-shadow: 0 8px 20px rgba(22,25,77,.07); overflow: hidden; }
.pl-ligne { display: flex; align-items: center; gap: 14px; width: 100%; padding: 10px 18px 10px 14px; border: 0; border-top: 1px solid var(--lh-border); background: transparent; color: var(--lh-text); font: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.pl-ligne:first-child { border-top: 0; }
.pl-ligne:active { background: var(--lh-surface-2); }
.pl-ic { flex: none; width: 44px; height: 44px; }
.pl-nom { flex: 1; font-weight: 800; font-size: 1rem; }
.pl-nom small { display: block; font-weight: 500; color: var(--lh-muted); font-size: .8rem; }
.pl-fl { color: var(--lh-muted); font-weight: 800; font-size: 1.4rem; }

/* ---------- Barre flottante ---------- */
#barre-flottante { display: none; position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(20px + env(safe-area-inset-bottom, 0px));
	background: var(--st-ring); border-radius: 99px; padding: 8px; gap: 6px; box-shadow: 0 14px 34px rgba(22,25,77,.18); z-index: 20; }
body[data-pg="accueil"] #barre-flottante, body[data-pg="calendrier"] #barre-flottante, body[data-pg="psaumes"] #barre-flottante, body[data-pg="plus"] #barre-flottante { display: flex; }
#barre-flottante button { width: 58px; height: 50px; border: 0; border-radius: 99px; background: transparent; color: var(--st-navy); display: flex; align-items: center; justify-content: center; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.bf-i { width: 26px; height: 26px; stroke: var(--st-navy); }
#barre-flottante .bf-i[fill="currentColor"] { stroke: none; fill: var(--st-navy); }
body[data-pg="accueil"] #bf-accueil, body[data-pg="calendrier"] #bf-calendrier, body[data-pg="psaumes"] #bf-psaumes, body[data-pg="plus"] #bf-plus { background: rgba(22,25,77,.09); }
body.mode-nuit[data-pg="accueil"] #bf-accueil, body.mode-nuit[data-pg="calendrier"] #bf-calendrier, body.mode-nuit[data-pg="psaumes"] #bf-psaumes, body.mode-nuit[data-pg="plus"] #bf-plus { background: rgba(255,255,255,.14); }
body[data-pg="accueil"] ons-page#accueil .page__content, body[data-pg="calendrier"] ons-page#calendrier .page__content, body[data-pg="psaumes"] ons-page#psaumes .page__content { padding-bottom: 110px; }
.plus .plus-titre { font-family: var(--st-titre) !important; font-size: 2.3rem !important; font-weight: 800 !important; margin: 22px 6px 14px; }
.plus .plus-section { text-transform: none !important; letter-spacing: 0 !important; border-left: 0 !important; padding-left: 0 !important; font-size: .95rem !important; font-weight: 800; color: var(--lh-muted); }
.plus .plus-section::before, .plus .plus-section::after { content: none !important; display: none !important; }

:is(ons-page.page#laudes,ons-page.page#lectures,ons-page.page#milieu,ons-page.page#vepres,ons-page.page#complies,ons-page.page#messe) .cadre .partie > h2 { display: flex !important; align-items: center; gap: 12px; }
.st-partie { flex: none; width: 40px; height: 40px; }

/* ---------- Accueil : même mise en page que la maquette ---------- */
ons-page#accueil { background-color: var(--st-fond); }
ons-page#accueil .page__content { background-color: var(--st-fond) !important;
	background-image: radial-gradient(circle, rgba(22,25,77,.09) 1.5px, transparent 1.6px); background-size: 26px 26px; }
body.mode-nuit ons-page#accueil .page__content { background-image: radial-gradient(circle, rgba(255,255,255,.07) 1.5px, transparent 1.6px); }
.accueil { padding-top: 30px; }
.accueil-entete-texte { display: flex; flex-direction: column; align-items: flex-start; }
.accueil-appnom { display: none; }
.accueil .accueil-date { order: 1; font-family: var(--st-titre); font-size: .95rem !important; font-weight: 600; color: var(--lh-muted); margin: 0; text-transform: none; }
.accueil .accueil-date::first-letter { text-transform: uppercase; }
.accueil-bonjour { order: 2; font-family: var(--st-titre) !important; font-size: 1.95rem !important; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; margin: 2px 0 0; text-align: left; color: var(--lh-text); }
.accueil-temps { order: 3; margin: 14px 0 0; background: var(--st-ring); border-radius: 99px; padding: 9px 18px 9px 14px; box-shadow: 0 6px 16px rgba(22,25,77,.08); max-width: 100%; }
.accueil-temps p { font-style: normal !important; font-weight: 700; font-size: .85rem; color: var(--lh-text); }
.accueil-temps p * { font-style: normal !important; }
.accueil-date-ligne { order: 4; margin-top: 12px; }
.accueil-saint { order: 5; }
.accueil-entete { margin-bottom: 18px; }
.tuile--now { outline: none; }
.accueil .choix-carte { margin: 0 6px 6px; }
.accueil .choix-carte .accueil-section { margin-top: 6px; }
.accueil .accueil-bonjour { font-weight: 800 !important; font-size: 1.85rem !important; }
.accueil { padding-top: 22px; }
.accueil-entete { margin: 0 4px 10px; }
.accueil-temps { margin-top: 10px; }
.accueil-temps p { font-size: .8rem; line-height: 1.3; }
.accueil-date-ligne { margin: 8px 0 0; }
.accueil .choix-carte { margin: 6px 6px 22px; }
.accueil .choix-carte .accueil-section { margin: 4px 2px 8px; }
.accueil .tuiles { margin-top: 4px; }

/* ---------- Accueil : proportions de la maquette (tout tient sur un écran) ---------- */
.accueil { display: flex; flex-direction: column; padding: 26px 16px 120px; }
.accueil-entete { order: 1; margin: 0 6px 18px; position: relative; }
.accueil .tuiles { order: 2; margin: 0; padding: 7px; gap: 26px 26px; }
.accueil .choix-carte { order: 3; margin: 26px 6px 0; }
.accueil .accueil-date { font-size: .95rem !important; color: #6A6F9A; }
body.mode-nuit .accueil .accueil-date { color: #A4A8D6; }
.accueil .accueil-bonjour { font-size: 1.95rem !important; color: var(--st-navy); }
.accueil .tuile, .accueil .tuile--large { height: 140px; min-height: 140px; }
.accueil .tuile .pastille { width: 70px; height: 70px; margin-top: 6px; }
/* « Changer de date » : bouton rond en haut à droite */
.accueil-date-ligne { position: absolute; right: 0; top: -4px; margin: 0; flex-direction: column; align-items: flex-end; gap: 6px; }
.accueil-date-ligne .bouton_date { font-size: 0 !important; width: 44px; height: 44px; padding: 0 !important; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--st-ring); box-shadow: 0 6px 16px rgba(22,25,77,.10); }
.accueil-date-ligne .bouton_date::before { font-size: 1.3rem; margin: 0 !important; }
.accueil-aujourdhui { background: var(--st-ring); border: 0; box-shadow: 0 6px 16px rgba(22,25,77,.10); font-weight: 700; color: var(--st-navy); }
.accueil-saint { display: none; }

/* ---------- Accueil : carte « Ce soir / premières vêpres » et choix de célébration, au-dessus des tuiles ---------- */
.accueil .choix-carte { order: 2; margin: 0 6px 22px; display: flex; flex-direction: column; gap: 14px; }
.accueil .tuiles { order: 3; }
.accueil .choix-carte > .accueil-section { display: none !important; }
.accueil .choix-soir { position: relative; display: flex; flex-direction: column; gap: 2px; min-height: 64px; justify-content: center;
	padding: 12px 16px 12px 76px; border: 0 !important; border-radius: 26px;
	background: linear-gradient(135deg, #FFE6D4, #F8B98F); color: #A24716;
	box-shadow: 0 0 0 6px var(--st-ring), 0 10px 22px rgba(22,25,77,.08); margin: 6px 6px 0; }
.accueil .choix-soir::before { content: ""; position: absolute; left: 12px; top: 50%; width: 52px; height: 52px; transform: translateY(-50%) rotate(-5deg);
	background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Cpath%20d%3D%22M16%2062a34%2034%200%200%201%2068%200z%22%20fill%3D%22%23FF8A4C%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22%20stroke-linejoin%3D%22round%22/%3E%3Cpath%20d%3D%22M8%2062h84%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M20%2074h60M32%2086h36%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22/%3E%3Cpath%20d%3D%22M50%2018v8M22%2032l6%206M78%2032l-6%206%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22/%3E%3C/svg%3E") center/contain no-repeat;
	filter: drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(0 4px 5px rgba(22,25,77,.25)); }
.accueil .choix-soir-titre { font-family: var(--st-titre); font-weight: 800; font-size: .95rem; line-height: 1.25; color: #A24716; }
.accueil .choix-soir-sous { font-family: var(--st-titre); font-weight: 600; font-size: .78rem; color: #A24716; opacity: .85; }
body.mode-nuit .accueil .choix-soir { background: linear-gradient(135deg, #74340F, #4C220A); }
body.mode-nuit .accueil .choix-soir-titre, body.mode-nuit .accueil .choix-soir-sous { color: #fff; }
.accueil .choix-mini-accueil { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--st-ring); border-radius: 26px; padding: 10px 10px 10px 16px; box-shadow: 0 8px 20px rgba(22,25,77,.07); }
.accueil .choix-mini-texte { font-family: var(--st-titre); font-weight: 700; font-size: .88rem; color: var(--lh-text); }
.accueil .choix-changer { background: #16194D; color: #fff; border: 0; border-radius: 99px; padding: .55em 1.2em; font: 700 .8rem var(--st-titre); }
body.mode-nuit .accueil .choix-changer { background: #F2A413; color: #16194D; }
.choix-liste { gap: 14px; }
.choix-liste .choix-option { position: relative; display: flex; align-items: center; gap: 14px; padding: 12px 14px 12px 12px !important; border-radius: 26px !important; border: 0 !important;
	background: linear-gradient(135deg, var(--c1, #E7E3FB), var(--c2, #C1B8F4)) !important; color: #16194D !important;
	box-shadow: 0 0 0 6px var(--st-ring), 0 10px 22px rgba(22,25,77,.08); margin: 6px 6px 0; width: calc(100% - 12px); }
.choix-liste .choix-option.choix-t-temps { --c1: #E7E3FB; --c2: #C1B8F4; }
.choix-liste .choix-option.choix-t-saint { --c1: #FFF0C9; --c2: #F7D37A; }
.choix-liste .choix-option.choix-t-local { --c1: #FBE3E7; --c2: #EBB1BB; }
.choix-liste .choix-option[aria-checked="true"] { outline: 3px solid #F2A413; outline-offset: 8px; }
.choix-liste .choix-radio { display: none !important; }
.choix-liste .choix-st { flex: none; width: 46px; height: 46px; transform: rotate(-5deg); }
.choix-liste .choix-texte { flex: 1; text-align: left; }
.choix-liste .choix-titre { font-family: var(--st-titre); font-weight: 800; font-size: .95rem; color: #16194D !important; }
.choix-liste .choix-sous { font-family: var(--st-titre); font-weight: 600; font-size: .78rem; color: #16194D !important; opacity: .75; }
.choix-liste .choix-defaut { background: rgba(255,255,255,.75); color: #16194D; border-radius: 99px; padding: 3px 10px; font: 700 .7rem var(--st-titre); }
.choix-liste .choix-valider { margin: 12px 6px 0; width: calc(100% - 12px); border: 0; border-radius: 99px; padding: 15px; background: #16194D; color: #fff; font: 800 1rem var(--st-titre); }
body.mode-nuit .choix-liste .choix-valider { background: #F2A413; color: #16194D; }
body.mode-nuit .choix-liste .choix-option { --c1: #3A2F85; --c2: #261E5C; color: #fff !important; }
body.mode-nuit .choix-liste .choix-option.choix-t-saint { --c1: #6E4A00; --c2: #4A3000; }
body.mode-nuit .choix-liste .choix-option.choix-t-local { --c1: #5A1A27; --c2: #3E1019; }
body.mode-nuit .choix-liste .choix-titre, body.mode-nuit .choix-liste .choix-sous { color: #fff !important; }
.choix-sheet { border-radius: 34px 34px 0 0 !important; padding-bottom: 28px; }
.choix-sheet h3 { font-family: var(--st-titre) !important; font-weight: 800 !important; font-size: 1.25rem !important; letter-spacing: -.01em; text-align: left; margin: 6px 8px 14px; }

/* ---------- Bouton « changer la date » : icône calendrier autocollant ---------- */
.accueil-date-ligne .bouton_date { width: 56px; height: 56px; background: var(--st-ring) !important; box-shadow: 0 8px 18px rgba(22,25,77,.12); }
.accueil-date-ligne .bouton_date::before { content: "" !important; display: block !important; position: static !important; width: 38px; height: 38px; margin: 0 !important; font-size: 0;
	-webkit-mask: none; mask: none; background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Crect%20x%3D%2214%22%20y%3D%2220%22%20width%3D%2272%22%20height%3D%2266%22%20rx%3D%2214%22%20fill%3D%22%23fff%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22/%3E%3Cpath%20d%3D%22M14%2040h72%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22/%3E%3Cpath%20d%3D%22M14%2034a14%2014%200%200%201%2014-14h44a14%2014%200%200%201%2014%2014v6H14z%22%20fill%3D%22%23FF6B6B%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22%20stroke-linejoin%3D%22round%22/%3E%3Cpath%20d%3D%22M32%2012v14M68%2012v14%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%226%22%20stroke-linecap%3D%22round%22/%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2264%22%20r%3D%228%22%20fill%3D%22%23FFC83D%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%224%22/%3E%3C/svg%3E") center/contain no-repeat !important; transform: rotate(-5deg);
	filter: drop-shadow(0 3px 4px rgba(22,25,77,.25)); }
ons-toolbar.barre-office .bouton_date::before { content: "" !important; display: inline-block !important; width: 22px; height: 22px; margin-right: 6px; vertical-align: middle;
	-webkit-mask: none; mask: none; background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20100%20100%22%3E%3Crect%20x%3D%2214%22%20y%3D%2220%22%20width%3D%2272%22%20height%3D%2266%22%20rx%3D%2214%22%20fill%3D%22%23fff%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22/%3E%3Cpath%20d%3D%22M14%2040h72%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22/%3E%3Cpath%20d%3D%22M14%2034a14%2014%200%200%201%2014-14h44a14%2014%200%200%201%2014%2014v6H14z%22%20fill%3D%22%23FF6B6B%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%225%22%20stroke-linejoin%3D%22round%22/%3E%3Cpath%20d%3D%22M32%2012v14M68%2012v14%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%226%22%20stroke-linecap%3D%22round%22/%3E%3Ccircle%20cx%3D%2250%22%20cy%3D%2264%22%20r%3D%228%22%20fill%3D%22%23FFC83D%22%20stroke%3D%22%2316194D%22%20stroke-width%3D%224%22/%3E%3C/svg%3E") center/contain no-repeat !important; }

/* ---------- Page de maintenance ---------- */
.maint-ecran { background-color: var(--st-fond); background-image: radial-gradient(circle, rgba(22,25,77,.09) 1.5px, transparent 1.6px); background-size: 26px 26px; font-family: var(--st-titre); }
body.mode-nuit .maint-ecran { background-image: radial-gradient(circle, rgba(255,255,255,.07) 1.5px, transparent 1.6px); }
.maint-carte { border: 0; border-radius: 40px; padding: 38px 26px 28px; box-shadow: 0 0 0 8px var(--st-ring), 0 18px 40px rgba(22,25,77,.14); background: linear-gradient(180deg, var(--lh-surface), var(--lh-surface)); }
.maint-logo { display: inline-block; width: 96px; height: 96px; margin-bottom: 18px; transform: rotate(-5deg); }
.maint-carte h1 { font-family: var(--st-titre); font-weight: 800; font-size: 1.75rem; letter-spacing: -.02em; }
.maint-message { font-weight: 500; }
.maint-retour { display: inline-block; background: #FFF0C9; color: #8A5A00; border-radius: 99px; padding: 9px 20px; font-weight: 800; font-size: .92rem; margin: 4px 0 8px; }
body.mode-nuit .maint-retour { background: #4A3000; color: #FFD27A; }
.maint-bouton { border-radius: 99px; background: #16194D; color: #fff; font-weight: 800; }
body.mode-nuit .maint-bouton { background: #F2A413; color: #16194D; }
.maint-bouton--sec { background: transparent; color: var(--lh-text); box-shadow: inset 0 0 0 2px var(--lh-border); }

/* ---------- Notifications ---------- */
body[data-pg="notifications"] #barre-flottante { display: flex; }
#barre-flottante button { width: 52px; position: relative; }
body[data-pg="notifications"] #bf-notifs { background: rgba(22,25,77,.09); }
body.mode-nuit[data-pg="notifications"] #bf-notifs { background: rgba(255,255,255,.14); }
.bf-pastille { display: none; position: absolute; top: 3px; right: 6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: #E5484D; color: #fff; font-size: .68rem; font-weight: 800; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--st-ring); }
body:not([data-notifs="0"])[data-notifs] .bf-pastille { display: block; }
.pl-badge { min-width: 22px; height: 22px; padding: 0 7px; border-radius: 99px; background: #E5484D; color: #fff; font-size: .78rem; font-weight: 800; line-height: 22px; text-align: center; }

.notifs { padding: 8px 16px 120px; max-width: 640px; margin: 0 auto; }
.notifs .notifs-titre { font-family: var(--st-titre) !important; font-size: 2.3rem !important; font-weight: 800 !important; margin: 22px 6px 16px; }
.notifs-liste { display: flex; flex-direction: column; gap: 12px; }
.notif-carte { position: relative; display: flex; align-items: center; gap: 14px; width: 100%; padding: 14px 16px 14px 14px; border: 0; border-radius: 22px; background: var(--lh-surface); color: var(--lh-text); font: inherit; text-align: left; cursor: pointer; box-shadow: 0 6px 18px rgba(22,25,77,.08); -webkit-tap-highlight-color: transparent; }
.notif-carte:active { transform: scale(.985); }
.notif-ic { flex: none; width: 56px; height: 56px; border-radius: 18px; background: linear-gradient(160deg, #FFF0C9, #F7D37A); display: flex; align-items: center; justify-content: center; }
.notif-ic .st, .notif-vide-ic .st { width: 36px; height: 36px; }
.notif-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.notif-titre { font-size: 1rem; font-weight: 800; line-height: 1.25; }
.notif-sous { font-size: .82rem; color: var(--lh-muted); }
.notif-fl { flex: none; font-size: 1.6rem; color: var(--lh-muted); line-height: 1; }
.notif-non-lue .notif-titre::after { content: ""; display: inline-block; width: 9px; height: 9px; margin-left: 8px; border-radius: 50%; background: #E5484D; vertical-align: middle; }
.notif-vide { text-align: center; padding: 48px 24px; color: var(--lh-muted); }
.notif-vide-ic { display: inline-flex; width: 84px; height: 84px; border-radius: 26px; background: linear-gradient(160deg, #FFF0C9, #F7D37A); align-items: center; justify-content: center; margin-bottom: 14px; }
.notif-vide-ic .st { width: 54px; height: 54px; }

.notif-fond { position: fixed; inset: 0; z-index: 10000; background: rgba(22,25,77,0); display: flex; align-items: flex-end; justify-content: center; transition: background .2s; }
.notif-fond.notif-ouverte { background: rgba(22,25,77,.45); }
.notif-feuille { position: relative; width: 100%; max-width: 560px; max-height: 88vh; overflow-y: auto; background: var(--lh-surface); color: var(--lh-text); border-radius: 30px 30px 0 0; padding: 12px 24px calc(28px + env(safe-area-inset-bottom, 0px)); text-align: center; transform: translateY(100%); transition: transform .22s ease-out; }
.notif-ouverte .notif-feuille { transform: none; }
.notif-poignee { display: block; width: 44px; height: 5px; border-radius: 99px; background: var(--lh-border); margin: 0 auto 8px; }
.notif-x { position: absolute; top: 16px; right: 16px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--lh-surface-2); color: var(--lh-text); font-size: 1rem; font-weight: 800; cursor: pointer; }
.notif-grand { position: relative; width: 112px; height: 112px; margin: 14px auto 12px; border-radius: 34px; background: linear-gradient(160deg, #FFF0C9, #F7D37A); display: flex; align-items: center; justify-content: center; }
.notif-grand .st { width: 76px; height: 76px; }
.notif-etincelle::before, .notif-etincelle::after { content: "✦"; position: absolute; color: #F2A413; font-size: 1.3rem; }
.notif-etincelle::before { top: -8px; right: -14px; }
.notif-etincelle::after { bottom: 2px; left: -16px; font-size: .9rem; }
.notif-pastille { display: inline-block; padding: 5px 14px; border-radius: 99px; background: #FFF0C9; color: #8A5A00; font-size: .8rem; font-weight: 800; }
.notif-feuille h2 { font-family: var(--st-titre) !important; font-size: 1.5rem !important; font-weight: 800 !important; margin: 12px 0 10px; line-height: 1.2; }
.notif-corps p { margin: 0 0 10px; line-height: 1.5; color: var(--lh-text); }
.notif-bouton { display: block; width: 100%; margin-top: 18px; padding: 15px; border: 0; border-radius: 99px; background: #16194D; color: #fff; font: inherit; font-weight: 800; cursor: pointer; }

body.mode-nuit .notif-carte { box-shadow: none; }
body.mode-nuit .notif-ic, body.mode-nuit .notif-grand, body.mode-nuit .notif-vide-ic { background: linear-gradient(160deg, #4A3A10, #7A5C12); }
body.mode-nuit .notif-pastille { background: #4A3000; color: #FFD27A; }
body.mode-nuit .notif-bouton { background: #F2A413; color: #16194D; }
@media (prefers-reduced-motion: reduce) { .notif-feuille, .notif-fond { transition: none; } }

/* ---------- Pages secondaires ---------- */
.st-ban { display: flex; align-items: center; gap: 16px; margin: 16px 14px 4px; padding: 18px; border-radius: 28px; background: linear-gradient(160deg, var(--b1), var(--b2)); color: #16194D; }
.st-ban--jaune { --b1: #FFF0C9; --b2: #F7D37A; } .st-ban--bleu { --b1: #DDEBFB; --b2: #A8C8F0; } .st-ban--menthe { --b1: #DDF2F0; --b2: #A9D9D5; }
.st-ban--rose { --b1: #FBE3E7; --b2: #EBB1BB; } .st-ban--violet { --b1: #E7E3FB; --b2: #C1B8F4; }
.st-ban-ic { flex: none; width: 76px; height: 76px; border-radius: 24px; background: rgba(255,255,255,.55); display: flex; align-items: center; justify-content: center; }
.st-ban-ic .st { width: 54px; height: 54px; }
.st-ban h1 { margin: 0; font-family: var(--st-titre) !important; font-size: 1.55rem !important; font-weight: 800 !important; line-height: 1.15; color: #16194D !important; }
.st-ban p { margin: 4px 0 0; font-family: var(--st-corps, inherit) !important; font-size: .88rem; line-height: 1.35; color: #16194D !important; opacity: .8; }
body.mode-nuit .st-ban { background: linear-gradient(160deg, #2A2D6B, #1E2050); color: #fff; }
body.mode-nuit .st-ban h1, body.mode-nuit .st-ban p { color: #fff !important; }
body.mode-nuit .st-ban-ic { background: rgba(255,255,255,.12); }
ons-page:is(#parametres,#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) .bandeau,
ons-page:is(#parametres,#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) img.ban-clair,
ons-page:is(#parametres,#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) img.ban-sombre { display: none !important; }
ons-page:is(#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) ons-card.cadre { margin: 12px 14px 120px; padding: 6px 20px 22px; border-radius: 28px; box-shadow: 0 6px 18px rgba(22,25,77,.08); }
ons-page:is(#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) .cadre,
ons-page:is(#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) .cadre p,
ons-page:is(#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) .cadre li { font-family: var(--st-corps, system-ui, sans-serif) !important; line-height: 1.55; }
ons-page:is(#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) .cadre h2 { font-family: var(--st-titre) !important; text-transform: none !important; letter-spacing: 0 !important; border-left: 0 !important; padding-left: 0 !important; font-size: 1.2rem !important; font-weight: 800 !important; margin: 26px 0 8px !important; color: var(--lh-text); }
body.mode-nuit ons-page:is(#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) ons-card.cadre { box-shadow: none; }
ons-page:is(#parametres) details.par-carte { margin: 12px 14px; border-radius: 26px; box-shadow: 0 6px 18px rgba(22,25,77,.08); }
body.mode-nuit ons-page#parametres details.par-carte { box-shadow: none; }
ons-page#parametres details.par-carte > summary h2 { font-family: var(--st-titre) !important; text-transform: none !important; letter-spacing: 0 !important; border-left: 0 !important; padding-left: 0 !important; font-size: 1.15rem !important; }
ons-page#parametres .par-ico { width: 42px; height: 42px; padding: 9px; border-radius: 14px; background: linear-gradient(160deg, #FFF0C9, #F7D37A); color: #16194D; }
body.mode-nuit ons-page#parametres .par-ico { background: linear-gradient(160deg, #4A3A10, #7A5C12); color: #FFD27A; }
ons-page#parametres #pg-padding, ons-page#parametres details.par-carte:last-of-type { margin-bottom: 120px; }
ons-page:is(#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) .cadre > :first-child, ons-page:is(#apropos,#nouveautes,#suggestions,#reseaux,#credits,#conditions,#confidentialite) .cadre > h2:first-child { margin-top: 12px !important; }
ons-page#confidentialite .cadre em, ons-page#conditions .cadre em { font-style: normal; color: var(--lh-muted); font-size: .88rem; }
ons-page#communs .cadre h2, ons-page#communs .partie > h2 { font-family: var(--st-titre) !important; text-transform: none !important; letter-spacing: 0 !important; border-left: 0 !important; padding-left: 0 !important; font-size: 1.15rem !important; font-weight: 800 !important; }
ons-page#communs .cadre { border-radius: 28px; }
ons-page#psaumes .cadre, ons-page#calendrier .cadre { border-radius: 28px; }