/* Oratorio — styles.
   Direction artistique : la joie de saint Philippe et la Rome baroque. Rouge vif de sa chasuble, ocre doré des façades,
   bleu du ciel peint de la Chiesa Nuova, sur un fond clair et lumineux. Titres en Fraunces (arrondie), texte en Alegreya.
   Couleurs : tokens clairs dans :root, sombres dans les deux blocs dark. */
:root{
  --ground:#FFF8F3; --paper:#FFFFFF; --ink:#231C35; --muted:#6E6682; --line:#F0E2D8;
  --red:#D42A45; --red-ink:#FFFFFF; --gold:#A85F00; --soft:#FFE8E2;
  --sun:#F7B32B; --sun-ink:#2A1A00; --sun-soft:#FFF1CF; --sky:#2F6FD1; --sky-soft:#E4EEFC; --mint:#16876A; --mint-soft:#DDF4EC; --lilac:#6C4BC4; --lilac-soft:#EEE7FB;
  --r:10px; --r-sm:6px;
  --shadow:0 1px 2px rgba(60,20,40,.06),0 16px 36px -20px rgba(140,40,70,.32);
  --display:"Fraunces", "Iowan Old Style", Georgia, serif;
  --sc:"Alegreya Sans SC", "Alegreya Sans", system-ui, sans-serif;
  --body:"Alegreya", "Iowan Old Style", Georgia, serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --ground:#161225; --paper:#221C36; --ink:#F4EEF9; --muted:#B0A7C6; --line:#3A3155;
    --red:#FF5C74; --red-ink:#2A0A12; --gold:#F4B64A; --soft:#3A2238;
    --sun:#F7B32B; --sun-ink:#2A1A00; --sun-soft:#3A2F1A; --sky:#86B4FF; --sky-soft:#1E2A48; --mint:#5FD3AE; --mint-soft:#15332C; --lilac:#B9A2FF; --lilac-soft:#2B2446;
    --shadow:0 1px 2px rgba(0,0,0,.3),0 18px 40px -22px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --ground:#161225; --paper:#221C36; --ink:#F4EEF9; --muted:#B0A7C6; --line:#3A3155;
  --red:#FF5C74; --red-ink:#2A0A12; --gold:#F4B64A; --soft:#3A2238;
  --sun:#F7B32B; --sun-ink:#2A1A00; --sun-soft:#3A2F1A; --sky:#86B4FF; --sky-soft:#1E2A48; --mint:#5FD3AE; --mint-soft:#15332C; --lilac:#B9A2FF; --lilac-soft:#2B2446;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 18px 40px -22px rgba(0,0,0,.7);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-padding-top:80px}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--body);font-size:17.5px;line-height:1.58;padding-inline:clamp(16px,3vw,48px);padding-block:0 56px;overflow-x:clip;font-variation-settings:"SOFT" 100}
.wrap{max-width:none;margin:0 auto;display:flex;flex-direction:column;gap:24px}
.eyebrow{font-family:var(--sc);font-weight:700;letter-spacing:.12em;font-size:13px;color:var(--gold)}
h1,h2{font-variation-settings:"SOFT" 100,"WONK" 1}

/* ---------- maxime et tableau du jour : un seul bloc ---------- */
.today-card{position:relative;background:var(--paper);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
.today-art{position:relative;aspect-ratio:5/4;background:var(--sun-soft)}
.today-img{appearance:none;border:0;padding:0;margin:0;display:block;width:100%;height:100%;cursor:zoom-in;background:none}
.today-img img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;display:block}
.today-img:focus-visible{outline:3px solid var(--sun);outline-offset:-3px}
.today-art::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to top,rgba(24,8,22,.78) 0%,rgba(24,8,22,.25) 38%,transparent 60%)}
.today-date{position:absolute;left:0;right:0;bottom:0;z-index:1;display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:10px;padding:16px;color:#fff;pointer-events:none}
.today-date > *{pointer-events:auto}
.date{text-align:center;display:flex;flex-direction:column;align-items:center;line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.35)}
.date .wd{font-family:var(--sc);font-weight:700;letter-spacing:.18em;font-size:14px}
.date .day{font-family:var(--display);font-weight:700;font-size:74px;line-height:.9;margin-top:4px;font-variant-numeric:lining-nums;color:#fff}
.date .mo{font-family:var(--sc);font-weight:700;letter-spacing:.2em;font-size:16px;margin-top:6px;color:var(--sun)}
.nav{appearance:none;border:1.5px solid rgba(255,255,255,.6);background:rgba(255,255,255,.14);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#fff;width:44px;height:44px;border-radius:50%;font-size:24px;cursor:pointer;font-family:var(--display);display:grid;place-items:center;margin-bottom:6px}
.nav:hover{background:rgba(255,255,255,.28)}
.nav:focus-visible,.btn:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.body{padding:22px clamp(20px,6vw,36px) 22px;display:flex;flex-direction:column;gap:14px}
.today-label{font-family:var(--sc);font-weight:700;letter-spacing:.14em;font-size:13px;color:var(--red)}
blockquote{margin:0;font-family:var(--display);font-weight:500;font-size:clamp(23px,5vw,28px);line-height:1.34;text-wrap:pretty;position:relative}
blockquote::first-letter{color:var(--red)}
blockquote.long{font-size:clamp(19px,4vw,22px)}
.who{font-family:var(--sc);font-weight:700;letter-spacing:.1em;color:var(--muted);font-size:14px}
.kid{margin:0;padding:12px 16px;border-radius:var(--r-sm);background:var(--sky-soft);color:var(--ink);font-size:17px;line-height:1.5}
.kid::before{content:"Pour les enfants";display:block;font-family:var(--sc);font-weight:700;letter-spacing:.1em;font-size:12.5px;color:var(--sky);margin-bottom:2px}
.kid-btn[aria-pressed="true"]{background:var(--sky-soft);border-color:var(--sky);color:var(--sky)}
.today-caption{margin:2px 0 0;padding-top:12px;border-top:1.5px dashed var(--line);font-size:14.5px;line-height:1.45;color:var(--muted)}
.today-caption span:first-child{display:block;font-family:var(--sc);font-weight:700;letter-spacing:.12em;font-size:12.5px;color:var(--gold)}
.today-caption b{color:var(--ink);font-weight:700}
.today-place::before{content:" · "}
.today-place:empty::before{content:none}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.btn{appearance:none;border:1.5px solid var(--line);background:var(--paper);color:var(--ink);font:inherit;font-weight:700;font-size:14.5px;padding:8px 15px;border-radius:999px;cursor:pointer;transition:transform .15s ease,border-color .15s ease,background .15s ease}
.btn:hover{border-color:var(--red);color:var(--red)}
.btn:active{transform:scale(.97)}
.btn.primary{background:var(--red);border-color:var(--red);color:var(--red-ink)}
.btn.primary:hover{color:var(--red-ink);filter:brightness(1.07)}
.btn.sun{background:var(--sun);border-color:var(--sun);color:var(--sun-ink)}
.btn.sun:hover{color:var(--sun-ink);filter:brightness(1.05)}
.note{margin:0;font-size:15px;color:var(--muted);font-style:italic;background:var(--sun-soft);padding:10px 14px;border-radius:var(--r-sm)}

details.method{font-size:15.5px;color:var(--muted)}
details.method summary{cursor:pointer;font-family:var(--sc);font-weight:700;letter-spacing:.1em;color:var(--ink);font-size:14px}
details.method p{margin:10px 0 0;max-width:62ch}
.notif{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;font-size:15.5px}
.notif input{font:inherit;color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r-sm);padding:4px 8px;font-variant-numeric:tabular-nums}
footer{text-align:center;font-size:13px;color:var(--muted)}
.toast{position:fixed;z-index:80;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:10px 18px;border-radius:999px;font-size:14.5px;font-weight:700;box-shadow:var(--shadow)}
@keyframes fade{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  .today-card.turn .body{animation:fade .45s ease}
  .today-card.turn .today-img img{animation:fade .6s ease}
}
@media (max-width:420px){ .date .day{font-size:62px} .nav{width:40px;height:40px} }

/* ---------- en-tête et onglets ---------- */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-inline:calc(-1 * clamp(16px,3vw,48px));padding:10px clamp(16px,3vw,48px);background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:linear-gradient(90deg,var(--red) 0 33%,var(--sun) 33% 66%,var(--sky) 66%)}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;min-width:0;margin-right:auto;padding-top:6px}
/* Le logo : le mot « Oratorio », dont le point du i est une flamme */
.logo{font-family:var(--display);font-style:italic;font-weight:700;font-size:30px;line-height:1;letter-spacing:-.01em;color:var(--ink);white-space:nowrap;font-variation-settings:"SOFT" 100,"WONK" 1}
.logo-i{position:relative;color:var(--red)}
.logo-i svg{position:absolute;left:50%;bottom:.62em;width:.42em;height:.62em;transform:translateX(-38%)}
.logo-i .fl{fill:var(--sun)}
.logo-i .fl-in{fill:var(--red)}
@media (prefers-reduced-motion:no-preference){ .logo-i svg{transform-origin:50% 100%;animation:flamme 2.6s ease-in-out infinite} @keyframes flamme{0%,100%{transform:translateX(-38%) scale(1,1) rotate(0)}50%{transform:translateX(-38%) scale(.94,1.06) rotate(3deg)}} }
.menu-btn{appearance:none;display:flex;align-items:center;gap:6px;font-family:var(--sc);font-weight:700;letter-spacing:.06em;font-size:15px;color:var(--red-ink);background:var(--red);border:0;border-radius:999px;padding:8px 12px 8px 16px;cursor:pointer;white-space:nowrap;flex:none}
.menu-btn span{overflow:hidden;text-overflow:ellipsis}
.menu-btn svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.menu-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.menu-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.menu{position:absolute;top:calc(100% + 6px);right:16px;width:min(320px,calc(100vw - 32px));max-height:calc(100dvh - 90px);overflow-y:auto;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 24px 48px -20px rgba(30,15,30,.45);padding:8px;display:flex;flex-direction:column;gap:4px}
.menu a{display:block;padding:9px 12px;border-radius:var(--r-sm);color:var(--ink);text-decoration:none;font-size:16.5px}
.menu a:hover{background:var(--soft)}
.menu a:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.menu a[aria-current="page"]{background:var(--red);color:var(--red-ink);font-weight:700}
.menu-group{display:flex;flex-direction:column;gap:2px;padding-top:6px;border-top:1px solid var(--line)}
.menu-title{font-family:var(--sc);font-weight:700;letter-spacing:.12em;font-size:12.5px;color:var(--gold);padding:4px 12px 2px}
.brand img{width:40px;height:40px;flex:none;border-radius:50%;border:2.5px solid var(--sun);box-shadow:0 0 0 2px var(--red);object-fit:cover}
.brand .name{font-family:var(--display);font-weight:700;font-size:clamp(20px,5.4vw,26px);line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variation-settings:"SOFT" 100,"WONK" 1}
.small-foot{margin:0;text-align:center;font-size:13px;color:var(--muted)}
.saint-du-jour{margin:0;font-size:15.5px;color:var(--muted)}
.saint-du-jour a{color:var(--red)}
body > .wrap{max-width:none}
main.view > .wrap,main.view.wide > .wrap{max-width:none;width:100%;margin:0}
.brand .tag{font-family:var(--sc);letter-spacing:.12em;font-size:12.5px;color:var(--gold);display:block;margin-top:3px}
.feast{margin:0;text-align:center;font-family:var(--sc);font-weight:700;letter-spacing:.08em;color:var(--sun-ink);background:var(--sun);border-radius:999px;padding:8px 16px}

/* ---------- page Saint Philippe ---------- */
.prose{background:var(--paper);border-radius:var(--r);box-shadow:var(--shadow);padding:26px clamp(20px,5vw,36px);display:flex;flex-direction:column;gap:14px}
.prose h2{font-family:var(--display);font-weight:700;font-size:clamp(26px,6vw,32px);margin:0;line-height:1.15;text-wrap:balance}
.prose h3{font-family:var(--sc);font-weight:700;letter-spacing:.12em;font-size:15px;color:var(--gold);margin:8px 0 0}
.prose p{margin:0;max-width:62ch}
.dates{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:auto 1fr;gap:8px 16px}
.dates b{font-family:var(--display);font-weight:700;color:var(--red);font-size:19px;font-variant-numeric:lining-nums tabular-nums}
.sayings{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.sayings li{font-family:var(--display);font-size:20px;line-height:1.35}
.sayings small{display:block;font-family:var(--body);font-size:14px;color:var(--muted)}
.countdown{font-family:var(--sc);font-weight:700;letter-spacing:.06em;color:var(--muted);font-size:14.5px}

/* ---------- page Prier ---------- */
.prayers{display:flex;flex-direction:column;gap:10px}
.prayer{background:var(--paper);border-radius:var(--r);box-shadow:var(--shadow)}
.prayer summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px clamp(18px,4vw,26px);font-family:var(--display);font-weight:600;font-size:20px;line-height:1.25}
.prayer summary::-webkit-details-marker{display:none}
.prayer summary::after{content:"›";flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--soft);color:var(--red);font-size:22px;line-height:1;transition:transform .2s}
.prayer[open] summary::after{transform:rotate(90deg)}
.prayer summary:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.prayer-body{padding:0 clamp(16px,4vw,24px);display:flex;flex-direction:column;gap:12px;font-size:17.5px;line-height:1.6}
.prayer-body p{margin:0;max-width:62ch}
.prayer-body .pr{font-family:var(--display);font-size:19px;line-height:1.5}
.prayer-body .src{font-size:14px;color:var(--muted);line-height:1.5}
.prayer-body ol.jac{margin:0;padding-left:1.6em;display:flex;flex-direction:column;gap:8px}
.prayer-body ol.jac li::marker{color:var(--red);font-variant-numeric:tabular-nums}
.prayer-foot{padding:14px clamp(16px,4vw,24px) 18px;display:flex;justify-content:flex-end}

/* ---------- lien vers un autre site ---------- */
.linkcard{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);color:var(--ink);text-decoration:none;background:var(--ground)}
.linkcard:hover{border-color:var(--red)}
.linkcard:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.linkcard b{display:block;font-family:var(--display);font-weight:600;font-size:19px;color:var(--red)}
.linkcard small{display:block;font-size:14px;color:var(--muted);margin-top:2px}
.linkcard > span:last-child{font-size:20px;color:var(--red)}

/* ---------- Accueil ---------- */
/* La « gloire » : rayons dorés derrière le titre, comme au-dessus des saints dans les tableaux baroques */
.home-hero{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:12px;text-align:center;padding:40px 0 8px}
.home-hero::before{content:"";position:absolute;z-index:-1;left:50%;top:-70px;width:560px;height:560px;transform:translateX(-50%);pointer-events:none;
  background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--sun) 34%,transparent) 0deg 5deg,transparent 5deg 13deg);
  -webkit-mask:radial-gradient(circle,#000 0,#000 22%,transparent 60%);mask:radial-gradient(circle,#000 0,#000 22%,transparent 60%)}
@media (prefers-reduced-motion:no-preference){ .home-hero::before{animation:gloire 90s linear infinite} @keyframes gloire{to{transform:translateX(-50%) rotate(360deg)}} }
.home-hero .eyebrow{margin:0;color:var(--red)}
.home-hero h1{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(34px,9vw,54px);line-height:1.02;letter-spacing:-.01em;text-wrap:balance}
.home-hero h1 em{font-style:italic;font-weight:700;color:var(--red)}
.home-hero p:last-child{margin:0 auto;max-width:48ch;color:var(--muted)}
.home-today{display:flex;flex-direction:column;gap:22px}
.home-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.home-grid a{display:flex;flex-direction:column;gap:6px;border-radius:var(--r);padding:16px 16px 18px;color:var(--ink);text-decoration:none;background:var(--soft);transition:transform .18s ease,box-shadow .18s ease}
.home-grid a:nth-child(5n+2){background:var(--sun-soft)}
.home-grid a:nth-child(5n+3){background:var(--sky-soft)}
.home-grid a:nth-child(5n+4){background:var(--mint-soft)}
.home-grid a:nth-child(5n+5){background:var(--lilac-soft)}
.home-grid a:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.home-grid a:focus-visible{outline:2px solid var(--sun);outline-offset:3px}
.home-grid b{font-family:var(--display);font-weight:700;font-size:21px;line-height:1.15;color:var(--red)}
.home-grid a:nth-child(5n+2) b{color:var(--gold)}
.home-grid a:nth-child(5n+3) b{color:var(--sky)}
.home-grid a:nth-child(5n+4) b{color:var(--mint)}
.home-grid a:nth-child(5n+5) b{color:var(--lilac)}
.home-grid span{font-size:14.5px;color:var(--muted);line-height:1.4}
.home-count{text-align:center;margin:0}

/* ---------- recherche ---------- */
.search-btn{appearance:none;flex:none;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer}
.search-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.search-btn[aria-expanded="true"]{border-color:var(--red);color:var(--red)}
.search-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.search{position:absolute;top:calc(100% + 6px);left:16px;right:16px;max-width:620px;margin-inline:auto;max-height:calc(100dvh - 90px);display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 24px 48px -20px rgba(30,15,30,.45);overflow:hidden}
.search input{font:inherit;font-size:17px;color:var(--ink);background:var(--ground);border:0;border-bottom:1px solid var(--line);padding:14px 16px;outline:none;width:100%}
.search input:focus-visible{box-shadow:inset 0 -2px 0 var(--red)}
.search-results{overflow-y:auto;padding:6px 8px 12px}
.search-hint,.search-count{margin:10px 8px;font-size:14.5px;color:var(--muted)}
.search-group h3{margin:12px 8px 4px;font-family:var(--sc);font-weight:400;letter-spacing:.1em;font-size:13px;color:var(--gold)}
.search-group h3 span{color:var(--muted)}
.search-group ul{list-style:none;margin:0;padding:0}
.search-group button{appearance:none;display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;background:none;border:0;border-radius:var(--r-sm);padding:8px;color:var(--ink);font:inherit;cursor:pointer}
.search-group button:hover{background:var(--soft)}
.search-group button:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.search-group b{font-weight:500;font-size:16px}
.search-group button span{font-size:14px;color:var(--muted);line-height:1.4}
.search-group mark{background:color-mix(in srgb,var(--gold) 30%,transparent);color:inherit;border-radius:2px}
.search-more{padding:2px 4px 6px}
.search-more button{appearance:none;background:none;border:0;font:inherit;font-size:14px;font-weight:700;color:var(--red);cursor:pointer;padding:6px 8px;border-radius:var(--r-sm)}
.search-more button:hover{background:var(--soft)}
.search-flash{outline:2px solid var(--gold);outline-offset:4px;border-radius:2px}

/* ---------- menu sur ordinateur : barre horizontale, rubriques dépliées au survol ---------- */
.menu-dd{display:flex;flex-direction:column;gap:2px}
@media (min-width: 1000px){
  .topbar{gap:18px}
  .menu-btn{display:none}
  .menu{order:2}
  .fav-link{order:3}
  .search-btn{order:4}
  .search{order:5}
  .menu{position:static;width:auto;max-height:none;overflow:visible;background:none;border:0;box-shadow:none;padding:0;flex-direction:row;align-items:center;gap:4px}
  .menu > a,.menu-title{padding:8px 14px;border-radius:999px;font-size:16px;font-family:var(--body);letter-spacing:0;color:var(--ink)}
  .menu > a[aria-current="page"]{background:var(--red);color:var(--red-ink)}
  .menu-group{position:relative;border-top:0;padding:0}
  .menu-title{display:flex;align-items:center;gap:8px;cursor:default}
  .menu-title::after{content:"";width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.6}
  .menu-group:hover .menu-title,.menu-group:focus-within .menu-title{background:var(--soft)}
  .menu-group:has(a[aria-current="page"]) .menu-title{color:var(--red)}
  /* panneau déroulant ; la marge invisible au-dessus garde le survol entre le titre et le panneau */
  .menu-dd{position:absolute;top:100%;left:0;min-width:260px;padding-top:8px;display:none}
  .menu-dd::before{content:"";position:absolute;inset:8px 0 0;background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:0 24px 48px -20px rgba(30,15,30,.45);z-index:-1}
  .menu-dd a{margin:0 8px}
  .menu-dd a:first-child{margin-top:8px}
  .menu-dd a:last-child{margin-bottom:8px}
  .menu-group:hover .menu-dd,.menu-group:focus-within .menu-dd{display:flex;z-index:30}
}

/* ---------- favoris ---------- */
.fav-btn span{margin-left:2px}
.fav-btn[aria-pressed="true"]{border-color:var(--gold);color:var(--gold)}
.fav-link{position:relative;flex:none;width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1.5px solid var(--line);background:var(--paper);color:var(--ink)}
.fav-link svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.fav-link:hover,.fav-link[aria-current="page"]{border-color:var(--sun);color:var(--gold)}
.fav-link[aria-current="page"] svg{fill:var(--sun);stroke:var(--gold)}
.fav-link:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.fav-count{position:absolute;top:-4px;right:-6px;min-width:19px;padding:0 5px;border-radius:999px;background:var(--red);color:var(--red-ink);font-family:var(--body);font-weight:700;font-size:11.5px;line-height:19px;text-align:center;font-variant-numeric:tabular-nums}
.saint-fav{margin:4px 0 8px}
.fav-empty{text-align:center;color:var(--muted);margin:8px 0}
.fav-group h3{margin:6px 0 8px;font-family:var(--sc);font-weight:400;letter-spacing:.1em;font-size:14px;color:var(--gold)}
.fav-group h3 span{color:var(--muted)}
.fav-group ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.fav-group li{display:flex;align-items:center;gap:8px;background:var(--paper);border-radius:var(--r-sm);box-shadow:var(--shadow);padding:6px 8px 6px 4px}
.fav-open{appearance:none;flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;text-align:left;background:none;border:0;padding:6px 8px;color:var(--ink);font:inherit;cursor:pointer;border-radius:var(--r-sm)}
.fav-open:hover b{color:var(--red)}
.fav-open:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.fav-open b{font-weight:500}
.fav-open span{font-size:14px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fav-remove span{display:none}

/* ---------- carte du jour à partager ---------- */
.carte-sheet{position:fixed;inset:0;z-index:60;background:rgba(15,10,18,.72);display:grid;place-items:center;padding:16px;padding-top:calc(16px + env(safe-area-inset-top,0px))}
.carte-box{display:flex;flex-direction:column;gap:12px;max-width:min(440px,100%);max-height:100%}
.carte-box img{width:100%;height:auto;max-height:calc(100dvh - 120px);object-fit:contain;border-radius:var(--r-sm);box-shadow:0 20px 50px -20px rgba(0,0,0,.6)}
.carte-actions{display:flex;justify-content:center;gap:10px}
.carte-actions .btn:not(.primary){background:var(--paper)}
html.carte-open{overflow:hidden}

@media (max-width:420px){
  .topbar{gap:8px}
  .brand{gap:8px}
  .logo{font-size:27px}
  .menu-btn{padding:8px 10px 8px 12px;font-size:14px}
  .search-btn,.fav-link{width:38px;height:38px}
}

/* ---------- neuvaine ---------- */
.nv-status{margin:0;font-family:var(--sc);letter-spacing:.05em;color:var(--muted)}
.nv-status.is-now{color:var(--red)}
.nv-days{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.nv-day details{background:var(--paper);border-radius:var(--r);box-shadow:var(--shadow);border:2px solid transparent}
.nv-day.is-today details{border-color:var(--red);box-shadow:0 0 0 1px var(--red)}
.nv-day summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:14px 16px}
.nv-day summary::-webkit-details-marker{display:none}
.nv-day summary:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.nv-num{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-family:var(--display);font-size:20px;background:var(--soft);color:var(--red);font-variant-numeric:lining-nums}
.nv-day.is-done .nv-num{background:var(--red);color:var(--red-ink)}
.nv-head{display:flex;flex-direction:column;font-family:var(--display);font-size:20px;line-height:1.2}
.nv-head small{font-family:var(--sc);font-size:12.5px;letter-spacing:.08em;color:var(--gold)}
.nv-body{padding:0 16px 16px;display:flex;flex-direction:column;gap:8px}
.nv-label{margin:6px 0 0;font-family:var(--sc);letter-spacing:.1em;font-size:13px;color:var(--muted)}
.nv-maxime{margin:0;font-family:var(--display);font-size:19px;line-height:1.45}
.nv-maxime::first-letter{all:unset}
.nv-invocation{margin:0;font-style:italic;font-size:17px}
.nv-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px;border-top:1px solid var(--line);padding-top:12px}
.nv-check{display:flex;align-items:center;gap:8px;font-size:15.5px;cursor:pointer}
.nv-check input{width:20px;height:20px;accent-color:var(--red)}
.nv-banner{margin:0}
.nv-banner a{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border-radius:var(--r);background:var(--sun-soft);border:2px solid var(--sun);color:var(--ink);text-decoration:none}
.nv-banner .eyebrow{color:var(--red)}
.nv-banner b{font-family:var(--display);font-weight:600;font-size:22px}
.nv-banner span:last-child{font-style:italic;color:var(--muted)}

/* ---------- une maxime pour… ---------- */
.besoin{display:flex;flex-direction:column;gap:10px;background:var(--paper);border-radius:var(--r);box-shadow:var(--shadow);padding:18px clamp(16px,4vw,24px)}
.besoin h3{margin:0;font-family:var(--display);font-weight:700;font-size:26px}
.besoin-intro{margin:0;color:var(--muted);font-size:15.5px}
.besoin-chips{display:flex;flex-wrap:wrap;gap:6px}
.besoin-chip{appearance:none;font:inherit;font-weight:700;font-size:14.5px;color:var(--ink);background:var(--sun-soft);border:1.5px solid transparent;border-radius:999px;padding:6px 12px;cursor:pointer}
.besoin-chip:hover{border-color:var(--red);color:var(--red)}
.besoin-chip[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:var(--red-ink)}
.besoin-chip:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.besoin-card{margin-top:6px;border-top:1px solid var(--line);padding-top:14px;display:flex;flex-direction:column;gap:8px}
.besoin-text{margin:0;font-family:var(--display);font-size:clamp(19px,4.4vw,22px);line-height:1.42}
.besoin-meta{margin:0;font-size:14px;color:var(--gold)}
.besoin-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
@media (prefers-reduced-motion:no-preference){ .besoin-card.turn{animation:fade .4s ease} }

/* ---------- Pippo Buono ---------- */
.pippo-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.pippo-ep{display:grid;grid-template-columns:84px 1fr;gap:14px;align-items:start;background:var(--paper);border-radius:var(--r);box-shadow:var(--shadow);padding:16px}
.pippo-ep img{width:84px;height:110px;object-fit:cover;border-radius:var(--r-sm);background:var(--soft)}
.pippo-num{width:84px;height:84px;display:grid;place-items:center;border-radius:50%;background:var(--soft);color:var(--red);font-family:var(--display);font-size:34px}
.pippo-ep h3{margin:0 0 4px;font-family:var(--display);font-weight:600;font-size:21px;line-height:1.2}
.pippo-ep p{margin:0}
.pippo-src{appearance:none;background:none;border:0;padding:6px 0 0;font:inherit;font-size:14px;color:var(--red);cursor:pointer;text-align:left}
.pippo-src:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.pippo-paroles blockquote{margin:0;font-family:var(--display);font-size:19px;line-height:1.45}
.pippo-paroles small{display:block;font-family:var(--body);font-size:13.5px;color:var(--gold);margin-top:2px}
@media (max-width:420px){ .pippo-ep{grid-template-columns:64px 1fr;gap:12px} .pippo-ep img{width:64px;height:86px} .pippo-num{width:64px;height:64px;font-size:28px} }
/* ---------- musique de l'Oratoire ---------- */
.musique-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.musique-list li{display:flex;flex-direction:column;gap:3px;border-top:1px solid var(--line);padding-top:12px}
.musique-list small{font-family:var(--sc);letter-spacing:.08em;color:var(--gold)}
.musique-list b{font-family:var(--display);font-weight:600;font-size:20px}
.musique-list a{color:var(--red);font-size:15px;align-self:flex-start}

/* ---------- jeux : Qui est-ce ?, Remets sa vie dans l'ordre, Maxime à trous, Qui a dit ça ? (js/jeux.js) ---------- */
.jx-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.jx-intro .btn,.jx-fin .btn{align-self:flex-start}
.jx-regle{font-size:15.5px;color:var(--muted)}
.jx-record{font-family:var(--sc);font-weight:700;letter-spacing:.06em;font-size:14px;color:var(--gold)}
.jx-niveaux{display:flex;flex-wrap:wrap;gap:8px}
.jx-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-family:var(--sc);font-weight:700;letter-spacing:.06em;font-size:13.5px;color:var(--muted)}
.jx-indices{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.jx-indices li{background:var(--sky-soft);border-radius:var(--r-sm);padding:10px 14px;line-height:1.45;overflow-wrap:anywhere}
.jx-indices li:focus{outline:none}
.jx-indices li:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.jx-ind-portrait img{display:block;margin-top:6px;width:120px;height:150px;border-radius:var(--r-sm);object-fit:cover;object-position:50% 20%}
.jx-flou{filter:blur(7px) grayscale(.4);transform:scale(1.02)}
@media (prefers-reduced-motion:no-preference){ .jx-flou{animation:jxNet 12s ease-out forwards} @keyframes jxNet{from{filter:blur(18px) grayscale(1)}to{filter:blur(5px) grayscale(.3)}} }
.jx-indices small{display:block;font-family:var(--sc);font-weight:700;letter-spacing:.1em;font-size:12px;color:var(--sky)}
@media (prefers-reduced-motion:no-preference){ .jx-indices li:last-child{animation:fade .4s ease} }
.jx-pts{margin:0;font-size:15px;color:var(--muted)}
.jx-pts b{color:var(--red)}
.jx-choix{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.jx-choix-3{grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){ .jx-choix-3{grid-template-columns:repeat(3,minmax(0,1fr))} }
.jx-c{appearance:none;font:inherit;font-weight:700;font-size:15.5px;text-align:left;color:var(--ink);background:var(--paper);border:2px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;cursor:pointer;line-height:1.3;min-width:0;overflow-wrap:anywhere}
.jx-c:hover:not([disabled]){border-color:var(--red)}
.jx-c:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.jx-c[disabled]{cursor:default;opacity:.7}
.jx-c.is-ok{opacity:1;border-color:var(--ok,#1E8E5A);background:var(--ok-soft,#DFF3E8)}
.jx-c.is-ko{opacity:1;border-color:var(--red);background:var(--soft)}
.jx-msg{margin:0;min-height:1.4em;overflow-wrap:anywhere}
.jx-theme{display:block;margin-top:6px;font-family:var(--sc);font-weight:700;letter-spacing:.06em;font-size:14px;color:var(--mint)}
.jx-outils{display:flex;flex-wrap:wrap;gap:8px}
.jx-outils .btn{font-size:14px;padding:7px 13px;border-color:var(--sky);color:var(--sky)}
.jx-outils .btn small{font-weight:400;color:var(--muted)}
.jx-outils .btn:disabled{opacity:.5;cursor:default;border-color:var(--line);color:var(--muted)}
.jx-msg:empty{display:none}
.jx-portrait{display:block;margin-top:12px;width:120px;height:150px;border-radius:var(--r-sm);object-fit:cover;object-position:50% 20%;box-shadow:var(--shadow)}
.jx-choix-qui .jx-c{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 8px}
.jx-visage{flex:none;width:44px;height:44px;border-radius:50%;object-fit:cover;object-position:50% 20%;background:var(--soft)}
.jx-ini{display:grid;place-items:center;font-family:var(--display);font-weight:700;font-size:17px;color:var(--red)}
.jx-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.jx-actions a.btn{text-decoration:none}
.jx-score{margin:0;font-family:var(--display);font-weight:800;font-size:64px;line-height:1;color:var(--red)}
.jx-score small{font-size:28px;color:var(--muted)}
.jx-ordre{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.jx-carte{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;background:var(--sun-soft);border:2px solid transparent;border-radius:var(--r-sm);padding:8px 8px 8px 6px;touch-action:manipulation}
.jx-carte.has-img{grid-template-columns:auto 44px minmax(0,1fr) auto}
.jx-carte.is-ok{background:var(--ok-soft,#DFF3E8);border-color:var(--ok,#1E8E5A)}
.jx-carte.is-pres{background:var(--sun-soft);border-color:var(--gold)}
.jx-carte.is-ko{background:var(--soft);border-color:var(--red)}
.jx-carte.is-drag{z-index:2;box-shadow:var(--shadow);border-color:var(--sun);transition:none}
.jx-ordre.is-dragging .jx-carte:not(.is-drag){transition:transform .15s ease}
.jx-rang{display:grid;place-items:center;min-width:40px;height:36px;padding:0 4px;border-radius:999px;background:var(--paper);font-family:var(--display);font-weight:700;font-size:15px;color:var(--gold);font-variant-numeric:lining-nums tabular-nums}
.jx-poignee{grid-auto-flow:column;gap:2px;height:auto;min-height:44px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.jx-poignee i{font-style:normal;color:var(--muted);font-size:14px}
.jx-carte.is-drag .jx-poignee{cursor:grabbing}
.jx-vignette{width:44px;height:58px;object-fit:cover;object-position:50% 30%;border-radius:6px;background:var(--paper);border:1px solid var(--line)}
.jx-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.jx-titre{font-weight:700;line-height:1.25;overflow-wrap:anywhere}
.jx-indice{font-size:13.5px;line-height:1.35;color:var(--muted);overflow-wrap:anywhere}
.jx-move{display:flex;flex-direction:column;gap:4px}
.jx-move button{appearance:none;width:38px;height:36px;border-radius:999px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink);font-size:17px;cursor:pointer}
.jx-move button:hover:not([disabled]){border-color:var(--red);color:var(--red)}
.jx-move button[disabled]{opacity:.35;cursor:default}
.jx-move button:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.jx-mark{font-size:20px;font-weight:700;padding:0 6px}
.jx-carte.is-ok .jx-mark{color:var(--ok,#1E8E5A)} .jx-carte.is-pres .jx-mark{color:var(--gold)} .jx-carte.is-ko .jx-mark{color:var(--red)}
/* bilan et petite frise du bon ordre */
.jx-bilan{display:flex;flex-direction:column;gap:10px;border-top:1.5px dashed var(--line);padding-top:14px}
.jx-bilan p{margin:0}
.jx-fin-h{margin:0!important;font-family:var(--sc)!important;font-weight:700!important;font-size:15px!important;letter-spacing:.14em;color:var(--gold)}
.jx-fin-h:focus{outline:none}
.jx-frisette{list-style:none;margin:0;padding:0 0 0 14px;border-left:3px solid var(--gold);display:flex;flex-direction:column;gap:8px}
.jx-frisette li{position:relative;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;padding-left:4px}
.jx-frisette li::before{content:"";position:absolute;left:-22px;top:.45em;width:11px;height:11px;border-radius:50%;background:var(--sun);border:2px solid var(--paper)}
.jx-frisette b{font-family:var(--display);color:var(--gold);font-variant-numeric:lining-nums tabular-nums}
.jx-frisette span{flex:1 1 150px;min-width:0}
.jx-frisette .jx-frise{grid-column:auto}
.jx-maxime{font-size:clamp(20px,4.6vw,24px)}
.jx-maxime::first-letter{color:inherit}
.jx-trou{display:inline-block;color:var(--red);letter-spacing:.08em}
.jx-mot{background:var(--sun-soft);color:var(--ink);border-radius:6px;padding:0 4px}
@media (prefers-reduced-motion:no-preference){ .shake{animation:shake .35s ease} @keyframes shake{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}} }

/* ---------- page « Tous les jeux » et « À revoir » ---------- */
.jx-hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.jx-hub-card{display:flex;flex-direction:column;gap:6px;padding:18px;border-radius:var(--r);background:var(--sun-soft);color:var(--ink);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease}
.jx-hub-card:nth-child(3n+2){background:var(--sky-soft)} .jx-hub-card:nth-child(3n){background:var(--soft)}
.jx-hub-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.jx-hub-card:focus-visible{outline:2px solid var(--sun);outline-offset:3px}
.jx-hub-card b{font-family:var(--display);font-weight:700;font-size:21px;line-height:1.2}
.jx-hub-card span{font-size:15px;color:var(--muted);line-height:1.4}
.jx-new{font-family:var(--sc);font-weight:700;letter-spacing:.06em;font-size:13px;color:var(--red)}
.jx-revoir{border-top:1.5px dashed var(--line);padding-top:12px}
.jx-revoir h3{margin:0 0 8px}
.jx-revoir ul{margin:0;padding-left:1.1em;display:flex;flex-direction:column;gap:8px;font-size:15.5px;line-height:1.45}
.jx-revoir small{display:block;color:var(--muted)}
.jx-revoir a{color:var(--red);white-space:nowrap}
.jx-frise{appearance:none;background:none;border:0;padding:4px 0;font:inherit;font-size:13.5px;color:var(--red);cursor:pointer}
.jx-frise:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.jx-fin{position:relative}
/* petite fête d'un sans-faute : confettis aux couleurs de l'appli (aussi utilisée par jeu.js et eglises.js) */
.jx-fete{position:fixed;left:50%;top:38%;width:0;height:0;pointer-events:none;z-index:60}
.jx-fete i{position:absolute;left:0;top:0;width:9px;height:14px;border-radius:2px;background:var(--sun);opacity:0}
.jx-fete i:nth-child(4n+1){background:var(--red)} .jx-fete i:nth-child(4n+2){background:var(--sky)} .jx-fete i:nth-child(4n+3){background:var(--mint)} .jx-fete i:nth-child(5n){background:var(--lilac);border-radius:50%;width:10px;height:10px}
.jx-fete i:nth-child(1){--x:-150px;--y:-170px;--r:320deg} .jx-fete i:nth-child(2){--x:-110px;--y:-220px;--r:-280deg} .jx-fete i:nth-child(3){--x:-60px;--y:-250px;--r:400deg} .jx-fete i:nth-child(4){--x:-10px;--y:-270px;--r:-360deg}
.jx-fete i:nth-child(5){--x:40px;--y:-250px;--r:300deg} .jx-fete i:nth-child(6){--x:95px;--y:-225px;--r:-420deg} .jx-fete i:nth-child(7){--x:145px;--y:-180px;--r:380deg} .jx-fete i:nth-child(8){--x:170px;--y:-110px;--r:-300deg}
.jx-fete i:nth-child(9){--x:-170px;--y:-100px;--r:260deg} .jx-fete i:nth-child(10){--x:-130px;--y:-40px;--r:-340deg} .jx-fete i:nth-child(11){--x:130px;--y:-50px;--r:340deg} .jx-fete i:nth-child(12){--x:-80px;--y:-140px;--r:-260deg}
.jx-fete i:nth-child(13){--x:75px;--y:-150px;--r:280deg} .jx-fete i:nth-child(14){--x:0px;--y:-190px;--r:-300deg} .jx-fete i:nth-child(15){--x:-40px;--y:-80px;--r:420deg} .jx-fete i:nth-child(16){--x:35px;--y:-90px;--r:-380deg}
@media (prefers-reduced-motion:no-preference){
  .jx-fete i{animation:jxConfetti 1.6s cubic-bezier(.2,.7,.4,1) forwards}
  .jx-fete i:nth-child(3n){animation-delay:.08s} .jx-fete i:nth-child(3n+1){animation-delay:.16s}
  @keyframes jxConfetti{0%{opacity:1;transform:translate(0,0) rotate(0)}40%{opacity:1;transform:translate(var(--x),var(--y)) rotate(calc(var(--r) * .5))}100%{opacity:0;transform:translate(calc(var(--x) * 1.25),calc(var(--y) + 320px)) rotate(var(--r))}}
}
@media (prefers-reduced-motion:reduce){ .jx-fete{display:none} }

/* ---------- mode d'emploi : visite guidée (js/visite.js) ---------- */
.menu-aide{color:var(--muted)!important;font-style:italic}
.tour-bloc{position:fixed;inset:0;z-index:89;background:transparent}
.tour-halo{position:fixed;z-index:90;pointer-events:none;border-radius:var(--r);box-shadow:0 0 0 4px var(--sun),0 0 0 9999px rgba(20,10,25,.62);transition:top .3s ease,left .3s ease,width .3s ease,height .3s ease}
.tour-halo.is-centre{top:50%;left:50%;width:0;height:0;box-shadow:0 0 0 9999px rgba(20,10,25,.62)}
.tour-bulle{position:fixed;z-index:91;max-width:calc(100vw - 32px);background:var(--paper);color:var(--ink);border-radius:var(--r);box-shadow:var(--shadow);padding:18px 18px 14px;display:flex;flex-direction:column;gap:8px}
.tour-bulle.is-centre{top:50%!important;left:50%!important;transform:translate(-50%,-50%);width:min(380px,calc(100vw - 32px))!important}
.tour-bulle h2{margin:0;font-family:var(--display);font-weight:700;font-size:22px;line-height:1.2}
.tour-bulle p{margin:0;font-size:16px;line-height:1.5}
.tour-num{font-family:var(--sc);font-weight:700;letter-spacing:.1em;font-size:12.5px;color:var(--gold)}
.tour-actions{display:flex;align-items:center;gap:8px;margin-top:6px}
.tour-actions > span{flex:1}
.tour-passer{border-color:transparent!important;color:var(--muted)}
@media (prefers-reduced-motion:reduce){ .tour-halo{transition:none} }
.tour-accueil{position:fixed;inset:0;z-index:95;background:rgba(20,10,25,.62);display:grid;place-items:center;padding:16px}
.tour-carte{width:min(420px,100%);background:var(--paper);border-radius:var(--r);box-shadow:var(--shadow);padding:28px 24px 20px;display:flex;flex-direction:column;gap:10px;text-align:center;position:relative;overflow:hidden;isolation:isolate}
.tour-carte::before{content:"";position:absolute;z-index:-1;left:50%;top:-150px;width:360px;height:360px;transform:translateX(-50%);background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--sun) 30%,transparent) 0deg 5deg,transparent 5deg 13deg);-webkit-mask:radial-gradient(circle,#000 0 20%,transparent 60%);mask:radial-gradient(circle,#000 0 20%,transparent 60%)}
.tour-carte .tour-logo{width:min(220px,60vw);height:auto;align-self:center;margin:4px 0 -6px;border-radius:var(--r-sm)}
.tour-carte h2{margin:0;font-family:var(--display);font-weight:800;font-size:28px}
.tour-carte p{margin:0;color:var(--muted)}
.tour-carte .tour-actions{justify-content:center}
@media (min-width:1000px){ .menu-group.tour-open .menu-dd{display:flex;z-index:30} .menu-aide{order:0} }

/* ---------- coloriages (js/coloriages.js) ---------- */
.colo-actions{display:flex;flex-wrap:wrap;gap:8px}
.colo-actions a.btn{text-decoration:none}
.colo-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.colo-card{appearance:none;width:100%;display:flex;flex-direction:column;gap:8px;padding:10px;border:0;border-radius:var(--r);background:var(--paper);box-shadow:var(--shadow);color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:transform .18s ease}
.colo-card:hover{transform:translateY(-3px)}
.colo-card:focus-visible{outline:2px solid var(--sun);outline-offset:3px}
.colo-card img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;border-radius:var(--r-sm);background:#fff}
.colo-card span{font-size:14.5px;line-height:1.3}
.colo-card b{color:var(--red);font-family:var(--display)}
.colo-feuille{position:fixed;inset:0;z-index:70;background:rgba(20,10,25,.7);display:grid;place-items:center;padding:12px;padding-top:calc(12px + env(safe-area-inset-top,0px))}
.colo-box{width:min(620px,100%);max-height:100%;overflow-y:auto;background:var(--paper);border-radius:var(--r);padding:14px 16px 16px;display:flex;flex-direction:column;gap:10px}
.colo-bar{display:flex;justify-content:space-between;align-items:center;font-family:var(--sc);font-weight:700;letter-spacing:.08em;font-size:13px;color:var(--gold)}
.colo-close{appearance:none;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line);background:var(--paper);color:var(--ink);font-size:17px;cursor:pointer}
.colo-box h2{margin:0;font-family:var(--display);font-weight:700;font-size:22px;line-height:1.2}
.colo-box img{width:100%;height:auto;max-height:60dvh;object-fit:contain;background:#fff;border-radius:var(--r-sm);border:1px solid var(--line)}
.colo-box p{margin:0;font-size:15.5px;color:var(--muted)}
html.colo-open{overflow:hidden}
/* Impression : seulement le coloriage ouvert, en pleine page */
@media print{
  html.colo-print body > *:not(.colo-feuille){display:none!important}
  html.colo-print .colo-feuille{position:static;background:none;padding:0;display:block}
  html.colo-print .colo-box{width:100%;box-shadow:none;padding:0;overflow:visible;max-height:none}
  html.colo-print .colo-bar,html.colo-print .colo-actions,html.colo-print .colo-box p{display:none!important}
  html.colo-print .colo-box h2{text-align:center;color:#000;margin-bottom:8mm}
  html.colo-print .colo-box img{max-height:none;border:0;width:100%}
  @page{size:A4 portrait;margin:12mm}
}

/* ---------- fêtes philippines (js/fetes.js) ---------- */
.fx-prochaine{display:flex;flex-direction:column;gap:2px;background:var(--sun-soft);border-radius:var(--r-sm);padding:12px 16px}
.fx-prochaine small{font-family:var(--sc);font-weight:700;letter-spacing:.1em;font-size:12.5px;color:var(--gold)}
.fx-prochaine b{font-family:var(--display);font-weight:700;font-size:20px}
.fx-mois h3{margin:6px 0 10px;font-family:var(--display);font-weight:700;font-size:24px;color:var(--red)}
.fx-mois ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.fx-item{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:start;background:var(--paper);border-radius:var(--r-sm);box-shadow:var(--shadow);padding:12px 14px;border:2px solid transparent}
.fx-item.is-fete{background:var(--sky-soft);box-shadow:none}
.fx-item.is-solennite{background:var(--soft);border-color:var(--red)}
.fx-item.is-today{border-color:var(--sun);box-shadow:0 0 0 3px color-mix(in srgb,var(--sun) 35%,transparent)}
.fx-date{display:grid;place-items:center;height:52px;border-radius:50%;background:var(--red);color:var(--red-ink);font-family:var(--display);font-weight:800;font-size:20px;font-variant-numeric:lining-nums}
.fx-item.is-fete .fx-date{background:var(--sky);color:#fff}
.fx-item b{display:block;font-family:var(--display);font-weight:700;font-size:18.5px;line-height:1.25}
.fx-item small{display:block;font-family:var(--sc);font-weight:700;letter-spacing:.06em;font-size:12.5px;color:var(--gold)}
.fx-item p{margin:4px 0;font-size:15.5px;line-height:1.45}
.fx-item a,.fx-jour a{color:var(--red);font-size:14.5px}
.fx-jour{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:var(--r);background:var(--sky-soft);border:2px solid var(--sky)}
.fx-jour .eyebrow{color:var(--sky)}
.fx-jour b{font-family:var(--display);font-weight:700;font-size:20px}

/* ---------- pleine largeur sur grand écran ---------- */
/* Les pages occupent toute la largeur ; les paragraphes gardent une longueur de ligne confortable */
@media (min-width:900px){
  .home-hero{padding-top:56px}
  .home-hero p:last-child{max-width:70ch}
  /* maxime et tableau du jour côte à côte */
  .today-card{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:stretch}
  .today-art{aspect-ratio:auto;min-height:460px}
  .today-card .body{padding:36px 40px;justify-content:center}
  blockquote{font-size:clamp(26px,2.3vw,34px)}
  .home-today{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:start;gap:24px}
  .home-today > .today-card{grid-column:1 / -1}
  .home-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
  .prose{padding:32px clamp(28px,3vw,48px)}
  .prayers,.nv-days,.pippo-list,.fx-mois ol{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:14px;align-items:start}
  .jx-hub{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
}

/* sous-rubriques du menu */
.menu-sub{display:block;padding:8px 12px 2px;font-family:var(--sc);font-weight:700;letter-spacing:.1em;font-size:11.5px;color:var(--muted);text-transform:none}
.menu-dd .menu-sub:first-child{padding-top:2px}
@media (min-width:1000px){ .menu-dd .menu-sub{margin:4px 8px 0} .menu-dd .menu-sub:first-child{margin-top:8px} .menu-dd a:first-child{margin-top:8px} }

/* ---------- Accueil : tuiles rangées par rubrique (comme le menu) ---------- */
.home-sections{display:flex;flex-direction:column;gap:28px}
.home-sec{display:flex;flex-direction:column;gap:12px}
.home-sec h2{margin:0;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;font-family:var(--display);font-weight:800;font-size:clamp(24px,5vw,30px);line-height:1.1}
.home-sec h2 small{font-family:var(--sc);font-weight:700;letter-spacing:.1em;font-size:13px;color:var(--muted)}
.home-sec .home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:700px){ .home-sec .home-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
.home-sec .home-grid a,.home-sec .home-grid a:nth-child(n){background:var(--sec-soft)}
.home-sec .home-grid b,.home-sec .home-grid a:nth-child(n) b{color:var(--sec)}
.home-sec h2 span{color:var(--sec)}
.hs-philippe{--sec:var(--red);--sec-soft:var(--soft)}
.hs-oratoire{--sec:var(--sky);--sec-soft:var(--sky-soft)}
.hs-prier{--sec:var(--gold);--sec-soft:var(--sun-soft)}
.hs-jouer{--sec:var(--mint);--sec-soft:var(--mint-soft)}
@media (min-width:1200px){ .home-sections{display:grid;grid-template-columns:1fr 1fr;gap:32px 40px} }

/* coloriages pas encore dessinés : bandeau « À venir » en diagonale, façon « top secret » */
.colo-card.is-soon{cursor:default}
.colo-card.is-soon:hover{transform:none}
.colo-cover{position:relative;display:block;overflow:hidden;border-radius:var(--r-sm)}
.colo-card.is-soon img{filter:grayscale(1) blur(2.5px);opacity:.45}
.colo-band{position:absolute;left:-20%;right:-20%;top:50%;transform:translateY(-50%) rotate(-28deg);background:var(--red);color:#fff;text-align:center;font-family:var(--sc);font-weight:700;font-size:clamp(15px,2.2vw,20px);letter-spacing:.24em;text-transform:uppercase;padding:6px 0;box-shadow:0 0 0 3px color-mix(in srgb,var(--red) 30%,transparent),0 6px 16px -6px rgba(0,0,0,.5);border-top:2px dashed rgba(255,255,255,.55);border-bottom:2px dashed rgba(255,255,255,.55)}

/* ================= Direction artistique : plus sérieuse, esprit pop art =================
   Formes plus nettes, cartes blanches cernées d'un trait fin, ombres décalées pleines (façon affiche),
   étiquettes de rubrique en couleur franche avec trame de points. */
:root{--trait:#231C35;--pop:4px}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){--trait:#F4EEF9} }
:root[data-theme="dark"]{--trait:#F4EEF9}

/* Accueil : titres de rubrique en étiquette */
.home-sec h2{gap:14px}
.home-sec h2 span{display:inline-block;padding:4px 14px 6px;background:var(--sec);color:#fff;border-radius:3px;
  background-image:radial-gradient(rgba(255,255,255,.22) 1.2px,transparent 1.4px);background-size:7px 7px;
  font-size:clamp(20px,4vw,26px);letter-spacing:.005em}
.home-sec h2 small{color:var(--muted)}

/* Accueil : tuiles blanches, trait fin, ombre décalée de la couleur de la rubrique */
.home-sec .home-grid{gap:14px}
.home-sec .home-grid a,.home-sec .home-grid a:nth-child(n){position:relative;background:var(--paper);border:1.5px solid var(--trait);border-radius:var(--r-sm);
  box-shadow:var(--pop) var(--pop) 0 var(--sec);padding:16px 16px 18px 16px;transition:transform .15s ease,box-shadow .15s ease}
.home-sec .home-grid a::before{content:"";position:absolute;top:14px;right:14px;width:10px;height:10px;background:var(--sec)}
.home-sec .home-grid a:hover{transform:translate(-2px,-2px);box-shadow:calc(var(--pop) + 2px) calc(var(--pop) + 2px) 0 var(--sec)}
.home-sec .home-grid a:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--sec)}
.home-sec .home-grid b,.home-sec .home-grid a:nth-child(n) b{color:var(--ink);font-size:20px;padding-right:18px}
.home-sec .home-grid span{color:var(--muted)}

/* Cartes et blocs : même langage (trait fin, ombre pleine discrète) */
.prose,.prayer,.besoin,.nv-day details,.pippo-ep,.today-card,.jx-hub-card,.colo-card,.fx-item{border:1.5px solid var(--trait);box-shadow:var(--pop) var(--pop) 0 color-mix(in srgb,var(--trait) 14%,transparent)}
.today-card{box-shadow:6px 6px 0 var(--red)}
.fx-item.is-fete,.fx-item.is-solennite{box-shadow:var(--pop) var(--pop) 0 color-mix(in srgb,var(--trait) 14%,transparent)}
.jx-hub-card,.jx-hub-card:nth-child(n){background:var(--paper)}
.jx-hub-card:hover,.colo-card:hover{transform:translate(-2px,-2px)}

/* Moins de rebond : l'Accueil garde sa « gloire », plus discrète */
.home-hero::before{opacity:.6}
.home-hero h1{font-weight:800;letter-spacing:-.015em}
.besoin-chip{background:var(--paper);border:1.5px solid var(--line)}
.besoin-chip[aria-pressed="true"]{border-color:var(--red)}


/* Maxime du jour : actions discrètes (petits liens, sans cadre ni ombre) */
#leaf .actions{gap:2px 16px;margin-top:6px}
#leaf .actions .btn:not(#today){background:none;border:0;box-shadow:none;padding:4px 0;min-height:0;font-family:var(--sc);font-size:13.5px;letter-spacing:.06em;font-weight:500;color:var(--muted,#7a6f66);text-decoration:none;transform:none}
#leaf .actions .btn:not(#today):hover,#leaf .actions .btn:not(#today):focus-visible{color:var(--red);text-decoration:underline;text-underline-offset:3px;background:none;box-shadow:none;transform:none}
#leaf .actions .fav-btn[aria-pressed="true"]{color:var(--gold)}
#leaf .actions .kid-btn[aria-pressed="true"]{color:var(--sky);background:none}

/* « Une maxime pour… » : catégories discrètes (mots en petites capitales, sans pastille) */
.besoin-chips{gap:2px 14px}
.besoin .besoin-chip{background:none;border:0;border-radius:0;padding:3px 0;font-family:var(--sc);font-weight:500;font-size:14px;letter-spacing:.06em;color:var(--muted);box-shadow:none}
.besoin .besoin-chip:hover{color:var(--red);text-decoration:underline;text-underline-offset:3px}
.besoin .besoin-chip[aria-pressed="true"]{background:none;color:var(--red);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}

/* Maxime du jour : tableau plus compact, pour que la carte tienne à l'écran */
.today-art{aspect-ratio:16/10}
@media (max-width:999px){ .today-art{max-height:36vh} }
@media (min-width:1000px){
  .today-card{grid-template-columns:minmax(0,.8fr) minmax(0,1fr)}
  .today-art{aspect-ratio:auto;min-height:0;height:auto}
  .today-art .today-img{position:absolute;inset:0}
  .today-card .quote,.today-card .body #q{font-size:clamp(20px,1.9vw,26px)}
  .today-card .body{padding:22px 32px}
}
@media (max-width:999px){ #q{font-size:clamp(19px,5.2vw,23px);line-height:1.4} .today-img img{object-position:50% 35%} }

/* Accueil : plus de titre ni de texte d'accroche, la carte du jour passe en premier */
.home-hero{padding:0;gap:0}
@media (min-width:1000px){ .home-hero{padding-top:0} }
.home-hero::before{top:0}
@media (max-width:999px){ .today-art{max-height:24vh;min-height:150px} }
@media (max-width:999px){ .today-art{aspect-ratio:auto;height:24vh;max-height:none;min-height:150px} }

/* Maxime du jour : plus de boutons sous la citation ; tableau un peu plus grand */
#leaf .actions .btn:not(#today){display:none}
#leaf .actions{margin-top:0}
@media (max-width:999px){ .today-art{aspect-ratio:4/3;height:auto;max-height:none;min-height:0} }
@media (min-width:1000px){ .today-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .today-art{min-height:400px} }
@media (min-width:1000px){ .today-card{grid-template-columns:minmax(0,.72fr) minmax(0,1fr)} .today-art{min-height:320px} .today-card .body{padding:26px 36px} }
@media (min-width:700px) and (max-width:999px){ .today-card{grid-template-columns:minmax(0,.8fr) minmax(0,1fr)} .today-art{min-height:300px} }

/* Accueil, ordinateur : le tableau est bien visible (grand, sans être écrasé par le texte) */
@media (min-width:1000px){
  .today-card{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
  .today-art{min-height:clamp(420px,56vh,560px)}
  .today-card .body{padding:30px 40px}
}
@media (min-width:700px) and (max-width:999px){ .today-art{min-height:340px} }

/* Tableau du jour : entier (jamais rogné) ; la date passe sur une bande sous le tableau */
.today-art{display:flex;flex-direction:column;aspect-ratio:auto!important;height:auto!important;max-height:none!important;min-height:0!important;background:#1d1511}
.today-art::after{display:none}
.today-art .today-img{position:relative;inset:auto;flex:1 1 auto;height:clamp(240px,42vh,420px);background:#1d1511}
.today-art .today-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center}
.today-date{position:static;flex:none;padding:8px 12px;align-items:center;background:#1d1511}
.date{flex-direction:row;gap:10px;align-items:baseline;text-shadow:none}
.date .day{font-size:34px;margin:0}
.date .wd,.date .mo{font-size:13px;margin:0}
.nav{width:38px;height:38px;font-size:22px}
@media (min-width:700px){ .today-art .today-img{height:clamp(380px,62vh,620px)} }

/* ---------- Mise en page : le logo au centre, le menu dessous ---------- */
.brand{flex-direction:column;gap:2px;margin:0}
.brand-tag{display:none;font-family:var(--sc);letter-spacing:.1em;font-size:13px;color:var(--muted);text-align:center;line-height:1.3}
/* Téléphone : logo centré dans la barre, recherche et favoris à gauche, Menu à droite */
@media (max-width:999px){
  .topbar{min-height:58px}
  .brand{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:0}
  .search-btn{order:1}
  .fav-link{order:2}
  .menu-btn{order:3;margin-left:auto}
  .search{order:5}
}
/* Ordinateur : grand logo centré avec sa phrase, le menu sur une ligne en dessous */
@media (min-width:1000px){
  .topbar{flex-direction:column;justify-content:center;gap:0;padding-top:16px;padding-bottom:6px;transition:padding .2s}
  .brand{padding:0}
  .logo{font-size:clamp(46px,5.2vw,68px);transition:font-size .2s}
  .brand-tag{display:block;margin-top:6px;max-height:40px;overflow:hidden;transition:max-height .2s,opacity .2s,margin .2s}
  .menu{order:2;width:100%;justify-content:center;margin-top:8px;padding-top:6px}
  .fav-link,.search-btn{position:absolute;top:18px}
  .search-btn{right:clamp(16px,3vw,48px)}
  .fav-link{right:calc(clamp(16px,3vw,48px) + 52px)}
  .search{top:calc(100% + 6px)}
  /* en défilant : barre compacte */
  html.is-scrolled .topbar{padding-top:8px;padding-bottom:2px}
  html.is-scrolled .logo{font-size:34px}
  html.is-scrolled .brand-tag{max-height:0;opacity:0;margin:0}
  html.is-scrolled .menu{margin-top:2px}
  html.is-scrolled .fav-link,html.is-scrolled .search-btn{top:10px}
}

/* ---------- Page « Ses maximes » ---------- */
.besoin{gap:18px;padding:clamp(18px,4vw,32px)}
.besoin-head{display:flex;flex-direction:column;gap:6px}
.besoin-head .eyebrow{margin:0;color:var(--red)}
.besoin .besoin-head h2{margin:0;font-family:var(--display);font-weight:800;font-size:clamp(30px,6vw,44px);line-height:1.05}
.besoin-layout{display:grid;gap:20px;align-items:start}
@media (min-width:900px){ .besoin-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:32px} .besoin-card,.besoin-vide{position:sticky;top:150px} }
.besoin-chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.besoin .besoin-chip{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;padding:12px 14px;min-height:0;background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r-sm);box-shadow:none;cursor:pointer;font-family:var(--body);letter-spacing:0;text-decoration:none;color:var(--ink)}
.besoin .besoin-chip b{font-family:var(--display);font-weight:700;font-size:17px;line-height:1.2;color:var(--ink)}
.besoin .besoin-chip small{font-size:14px;color:var(--muted);line-height:1.3}
.besoin .besoin-chip:hover{border-color:var(--red);text-decoration:none}
.besoin .besoin-chip[aria-pressed="true"]{background:var(--soft);border-color:var(--red);text-decoration:none;box-shadow:inset 4px 0 0 var(--red)}
.besoin .besoin-chip[aria-pressed="true"] b{color:var(--red)}
.besoin-card{margin:0;border:1.5px solid var(--trait);border-radius:var(--r);padding:clamp(18px,3vw,28px);background:var(--paper);box-shadow:6px 6px 0 var(--red);display:flex;flex-direction:column;gap:12px}
.besoin-theme{font-family:var(--sc);font-weight:700;letter-spacing:.14em;font-size:13px;color:var(--red)}
.besoin .besoin-text{font-size:clamp(22px,3.4vw,30px);line-height:1.38}
.besoin .besoin-text::first-letter{color:var(--red)}
.besoin .besoin-meta{font-family:var(--sc);letter-spacing:.08em;font-size:14px;color:var(--muted)}
.besoin-actions{justify-content:flex-start}
.besoin-vide{margin:0;padding:28px;border:1.5px dashed var(--line);border-radius:var(--r);color:var(--muted);text-align:center;font-style:italic}
.besoin-all{border-top:1px solid var(--line);padding-top:10px}
.besoin-all summary{cursor:pointer;font-family:var(--sc);letter-spacing:.08em;font-size:14px;color:var(--muted)}
.besoin-all ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:320px;overflow-y:auto}
.besoin-all li button{appearance:none;width:100%;text-align:left;font:inherit;font-size:16px;line-height:1.4;color:var(--ink);background:none;border:0;border-left:3px solid var(--line);padding:6px 10px;cursor:pointer}
.besoin-all li button:hover{border-left-color:var(--red);background:var(--soft)}

/* Maxime du jour : pas de navigation vers la veille ou le lendemain */
.today-date{grid-template-columns:1fr;justify-items:center}

/* ---------- Accueil : tuiles avec aperçu (carte des Oratoires, saints) ---------- */
.home-features{display:grid;gap:14px;margin-bottom:14px}
@media (min-width:760px){ .home-features{grid-template-columns:repeat(2,minmax(0,1fr))} }
.home-feature{display:flex;flex-direction:column;gap:10px;padding:12px 12px 16px;border-radius:var(--r);background:var(--soft);border:1.5px solid var(--trait)}
.hf-preview{display:block;border-radius:var(--r-sm);overflow:hidden;background:var(--paper);border:1.5px solid var(--line);color:inherit;text-decoration:none}
.hf-map{position:relative;height:clamp(190px,26vw,260px);background:#e9e7e1;cursor:pointer}
.hf-map:not(.is-leaflet) svg{width:100%;height:100%;display:block}
.hf-grat line{stroke:#cfcabf;stroke-width:.4}
.hf-pts circle{fill:var(--red);stroke:#fff;stroke-width:.6}
.hf-map.is-leaflet .leaflet-container{height:100%;width:100%;background:#e9e7e1}
.hf-mosaic{display:grid;grid-template-columns:repeat(auto-fill,minmax(54px,1fr));gap:4px;height:clamp(190px,26vw,260px);overflow:hidden;padding:4px;background:var(--paper);align-content:start}
.hf-mosaic img{width:100%;aspect-ratio:1;object-fit:cover;object-position:50% 20%;border-radius:6px;display:block;background:var(--soft)}
.hf-text{display:flex;flex-direction:column;gap:3px;padding:0 4px}
.hf-text b{font-family:var(--display);font-weight:700;font-size:21px;line-height:1.15;color:var(--red)}
.hf-text span{color:var(--muted);font-size:15.5px}
.home-feature .hf-btn{align-self:flex-start;margin:2px 4px 0;text-decoration:none}
.hf-saints .hf-text b{color:var(--sky)}

.next-fete{display:flex;align-items:center;gap:10px;margin-top:8px;padding:8px 10px;border-radius:var(--r-sm);background:var(--paper);border:1.5px solid var(--line)}
.nf-date{flex:none;display:flex;flex-direction:column;align-items:center;min-width:44px;padding:4px 6px;border-radius:6px;background:var(--red);color:var(--red-ink);font-family:var(--sc);font-size:12px;letter-spacing:.06em;line-height:1.1;text-transform:uppercase}
.nf-date b{font-family:var(--display);font-size:22px;color:inherit}
.nf-txt{display:flex;flex-direction:column;font-size:15px;line-height:1.25;color:var(--ink)}
.nf-txt small{font-family:var(--sc);letter-spacing:.06em;font-size:12.5px;color:var(--muted)}
.hf-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.hf-chips span{font-family:var(--sc);letter-spacing:.05em;font-size:13px;padding:3px 9px;border-radius:999px;background:var(--paper);border:1.5px solid var(--line);color:var(--ink)}

/* Notification du matin : dans la carte de la maxime du jour, discrète */
.today-card .notif{justify-content:flex-start;margin-top:2px;padding-top:12px;border-top:1px dashed var(--line);font-size:14.5px;color:var(--muted)}
.today-card .notif .btn{font-family:var(--sc);letter-spacing:.06em;font-size:13.5px;font-weight:600;padding:7px 14px;box-shadow:none}
.today-card #webpush .btn.primary{background:var(--paper);color:var(--red);border:1.5px solid var(--red)}
.today-card #webpush .btn.primary:hover{background:var(--red);color:var(--red-ink)}

.notif-etat{flex:1 1 100%;margin:0;font-size:14px;line-height:1.35}
.notif-etat.is-ok{color:var(--mint,#2b7a5b)}
.notif-etat.is-warn{color:var(--gold)}
.notif-etat.is-ko{color:var(--red);font-weight:600}

.pr-latin{margin:6px 0 4px;border-top:1px dashed var(--line);padding-top:8px}
.pr-latin > summary{cursor:pointer;font-family:var(--sc);letter-spacing:.1em;font-size:14px;color:var(--gold);padding:4px 0}
.pr-latin .latin{font-style:italic}
.pr-latin .latin p,.pr-latin .latin li{margin-top:.7em}