/* GÉNÉRÉE par scripts/reception-gardee-css.py depuis Refontes/design_handoff_reception_gardee : ne pas modifier à la main. */
/* Popotam — « Ton réveillon est noté ! » : la fenêtre qui garde une réception (préfixe rg-).
   Saison : [data-saison="noel"] sur <html>. Pas de thème sombre. */
.rg-racine{
  --rg-bg:#FFF9EE;--rg-paper:#FFFDF4;--rg-paper2:#FBF3DE;--rg-cream:#FFF8EA;--rg-cream2:#FCEFD9;--rg-card:#fff;
  --rg-ink:#2A211B;--rg-ink2:#5C4A3A;--rg-muted:#8A7458;--rg-line:#E7D9BE;--rg-line2:#DCCBA9;--rg-edge:#2A211B;
  --rg-tang:#F0682F;--rg-tang-d:#C2410C;--rg-tang-bg:#FCE3D8;--rg-green:#33A15B;--rg-green-d:#2C8B4E;--rg-green-bg:#E6F3E9;
  --rg-sun:#FFC53D;--rg-sun-bg:#FFF1D2;--rg-dark:#33261B;
  --rg-hero:#FCE3D8;--rg-hero-ink:#C2410C;--rg-hero-art:none;
  --rg-fd:"Bricolage Grotesque",system-ui,sans-serif;--rg-fb:"Hanken Grotesk",system-ui,sans-serif;--rg-fh:"Caveat",cursive;
  --rg-spring:cubic-bezier(.3,1.35,.45,1)}
.rg-racine.noel{--rg-tang:#C8323A;--rg-tang-d:#A2242B;--rg-tang-bg:#FBE1E1;--rg-green:#2E6B47;--rg-green-d:#245A3B;--rg-green-bg:#E3F0E7;
  --rg-hero:#C8323A;--rg-hero-ink:#fff;
  --rg-hero-art:radial-gradient(circle at 12% 30%,rgba(255,255,255,.55) 0 2px,transparent 3px),radial-gradient(circle at 70% 20%,rgba(255,255,255,.5) 0 1.5px,transparent 2.5px),radial-gradient(circle at 88% 70%,rgba(255,255,255,.45) 0 2px,transparent 3px),radial-gradient(circle at 34% 80%,rgba(255,255,255,.4) 0 1.5px,transparent 2.5px)}

/* ---------- voile et fenêtre ---------- */
.rg-scrim{position:absolute;inset:0;z-index:20;background:rgba(51,38,27,.34);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.rg-win{position:absolute;z-index:21;left:0;right:0;bottom:0;max-height:94%;display:flex;flex-direction:column;border-radius:30px 30px 0 0;background:var(--rg-card);box-shadow:0 -24px 50px -26px rgba(60,30,10,.5);overflow:hidden;font-family:var(--rg-fb);color:var(--rg-ink)}
.rg-win::before{content:"";flex:none;display:block;width:44px;height:5px;margin:10px auto 0;border-radius:3px;background:var(--rg-line2)}
.rg-in{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:none;padding:8px 18px 18px}
.rg-in::-webkit-scrollbar{display:none}
.rg-racine.desk .rg-win{left:50%;top:50%;bottom:auto;right:auto;width:min(540px,calc(100% - 40px));max-height:calc(100% - 48px);translate:-50% -50%;border-radius:30px;border:2px solid var(--rg-edge);box-shadow:0 6px 0 var(--rg-edge),0 40px 80px -30px rgba(60,30,10,.55)}
.rg-racine.desk .rg-win::before{display:none}
.rg-racine.desk .rg-in{padding:24px 26px 22px}
.rg-x{position:absolute;right:12px;top:14px;z-index:3;width:44px;height:44px;border:0;border-radius:50%;background:var(--rg-cream2);display:grid;place-items:center;color:var(--rg-ink2);cursor:pointer;transition:transform .35s var(--rg-spring),background .2s}
.rg-x:hover{transform:rotate(90deg);background:var(--rg-line);color:var(--rg-ink)}
.rg-racine.desk .rg-x{top:16px;right:16px}
.rg-st{animation:rgUp .46s var(--rg-spring) both;animation-delay:calc(var(--i,0) * 45ms)}
@keyframes rgUp{from{opacity:0;transform:translateY(10px)}}

/* ---------- en-tête ---------- */
.rg-hd{display:flex;align-items:center;gap:12px;padding-right:46px}
.rg-pp{flex:none;width:60px;height:60px;border-radius:19px;overflow:hidden;background:var(--rg-sun-bg);border:2px solid var(--rg-edge);transform:rotate(-6deg)}
.rg-racine.noel .rg-pp{background:#FFE9E9}
.rg-pp svg{width:100%;height:100%}
.rg-hand{display:block;font:700 21px/1 var(--rg-fh);color:var(--rg-tang-d);transform:rotate(-2deg);transform-origin:left}
.rg-hd h2{margin:3px 0 0;font:800 24px/1.08 var(--rg-fd);letter-spacing:-.02em;text-wrap:balance}
.rg-racine.desk .rg-hd h2{font-size:27px}

/* ---------- le récapitulatif : un ticket ---------- */
.rg-rc{display:flex;align-items:stretch;margin-top:14px;border-radius:20px;background:var(--rg-paper);border:2px solid var(--rg-edge);box-shadow:0 4px 0 var(--rg-edge);overflow:hidden}
.rg-dt{flex:none;position:relative;width:78px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;background:var(--rg-hero);background-image:var(--rg-hero-art);color:var(--rg-hero-ink);border-right:2px dashed var(--rg-edge)}
.rg-dt small{font:800 10.5px var(--rg-fb);letter-spacing:.1em;text-transform:uppercase;opacity:.9}
.rg-dt b{font:800 32px/1 var(--rg-fd);letter-spacing:-.02em}
.rg-dt span{font:700 17px/1 var(--rg-fh)}
.rg-rb{flex:1;min-width:0;padding:11px 14px 12px}
.rg-rb b{display:block;font:800 16.5px/1.2 var(--rg-fd);text-wrap:pretty}
.rg-rb .mt{display:block;margin-top:2px;font:700 12.5px var(--rg-fb);color:var(--rg-ink2)}
.rg-rb .mn{display:block;margin-top:2px;font-size:12px;color:var(--rg-muted)}
.rg-ok{display:inline-flex;align-items:center;gap:5px;margin-top:7px;padding:3px 10px 3px 6px;border-radius:999px;background:var(--rg-green-bg);color:var(--rg-green-d);font:700 11.5px var(--rg-fb)}
.rg-ok i{width:16px;height:16px;border-radius:50%;background:var(--rg-green);color:#fff;display:grid;place-items:center}
.rg-rc.sm{margin-top:12px;box-shadow:0 3px 0 var(--rg-edge)}
.rg-rc.sm .rg-dt{width:58px}.rg-rc.sm .rg-dt b{font-size:24px}.rg-rc.sm .rg-dt span{font-size:14px}
.rg-rc.sm .rg-rb{padding:8px 12px}.rg-rc.sm .rg-rb b{font-size:14.5px}

/* ---------- textes ---------- */
.rg-ex{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:14px;line-height:1.45;color:var(--rg-ink2);text-wrap:pretty}
.rg-ex .ki{flex:none;width:30px;height:30px;border-radius:10px;background:var(--rg-sun-bg);color:#9A6400;display:grid;place-items:center;transform:rotate(-6deg)}
.rg-ex b{color:var(--rg-ink)}
.rg-ask{margin-top:14px;padding:14px;border-radius:20px;background:var(--rg-cream);border:1.5px solid var(--rg-line)}
.rg-ask p{margin:0 0 10px;font-size:14px;line-height:1.45;color:var(--rg-ink2);text-wrap:pretty}
.rg-ask p b{display:block;margin-bottom:2px;font:800 15px/1.3 var(--rg-fd);color:var(--rg-ink)}

/* ---------- champ ---------- */
.rg-f{position:relative}
.rg-f label{position:absolute;left:46px;top:7px;font:800 10.5px var(--rg-fb);letter-spacing:.08em;text-transform:uppercase;color:var(--rg-muted);pointer-events:none}
.rg-f .mi{position:absolute;left:14px;top:50%;translate:0 -50%;color:var(--rg-muted)}
.rg-f input{display:block;width:100%;height:56px;padding:18px 14px 4px 46px;border-radius:16px;border:2px solid var(--rg-line2);background:#fff;font:600 15.5px var(--rg-fb);color:var(--rg-ink);transition:border-color .2s,box-shadow .25s}
.rg-f input::placeholder{color:#BDAE98;font-weight:500}
.rg-f input:focus{outline:none;border-color:var(--rg-tang);box-shadow:0 0 0 4px var(--rg-tang-bg)}
.rg-f.bad input{border-color:var(--rg-tang-d);background:#FFF8F6}
.rg-f.bad .mi{color:var(--rg-tang-d)}
.rg-f.shake{animation:rgShake .42s}
@keyframes rgShake{20%{translate:-6px 0}40%{translate:5px 0}60%{translate:-3px 0}80%{translate:2px 0}}
.rg-err{display:flex;gap:7px;align-items:flex-start;margin:8px 2px 0;font:600 13px/1.4 var(--rg-fb);color:var(--rg-tang-d)}
.rg-err i{flex:none;width:18px;height:18px;margin-top:1px;border-radius:50%;background:var(--rg-tang-d);color:#fff;display:grid;place-items:center;font:800 12px/1 var(--rg-fb);font-style:normal}

/* option : le rappel 3 jours avant */
.rg-cb{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;margin-top:8px;padding:4px 2px;border:0;background:none;text-align:left;font:600 13.5px/1.35 var(--rg-fb);color:var(--rg-ink2);cursor:pointer}
.rg-cb .bx{flex:none;width:24px;height:24px;border-radius:8px;border:2px solid var(--rg-line2);background:#fff;display:grid;place-items:center;color:transparent;transition:all .3s var(--rg-spring)}
.rg-cb[aria-checked="true"] .bx{background:var(--rg-green);border-color:var(--rg-green);color:#fff;transform:rotate(-8deg)}
.rg-cb[aria-checked="true"]{color:var(--rg-ink)}

/* ---------- boutons ---------- */
.rg-go{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:56px;margin-top:12px;border:0;border-radius:18px;background:var(--rg-tang);color:#fff;font:800 16px var(--rg-fd);box-shadow:0 4px 0 var(--rg-tang-d);cursor:pointer;transition:transform .3s var(--rg-spring),box-shadow .2s}
.rg-go:hover{transform:translateY(-2px);box-shadow:0 6px 0 var(--rg-tang-d)}
.rg-go:active{transform:translateY(2px);box-shadow:0 1px 0 var(--rg-tang-d)}
.rg-go.busy{pointer-events:none;opacity:.85}
.rg-spin{width:17px;height:17px;border-radius:50%;border:2.5px solid rgba(255,255,255,.5);border-right-color:#fff;animation:rgSpin .7s linear infinite}
@keyframes rgSpin{to{transform:rotate(360deg)}}
.rg-sure{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin-top:10px;font:600 12px/1.35 var(--rg-fb);color:var(--rg-muted)}
.rg-sure span{display:inline-flex;align-items:center;gap:5px}
.rg-sure svg{color:var(--rg-green)}
.rg-two{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.rg-gh{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:48px;padding:0 12px;border:1.5px solid var(--rg-line2);border-radius:15px;background:#fff;font:700 14px var(--rg-fb);color:var(--rg-ink);cursor:pointer;transition:border-color .2s,background .3s,color .3s}
.rg-gh:hover{border-color:var(--rg-ink2)}
.rg-gh.ok{background:var(--rg-green-bg);border-color:var(--rg-green);color:var(--rg-green-d)}
.rg-gh .lb{display:inline-flex;align-items:center;gap:7px}
.rg-lk{display:block;margin:10px auto 0;min-height:44px;padding:0 12px;border:0;background:none;font:700 13.5px var(--rg-fb);color:var(--rg-tang-d);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.rg-foot{margin:14px 0 0;padding-top:12px;border-top:1.5px dashed var(--rg-line);text-align:center;font-size:12.5px;line-height:1.45;color:var(--rg-muted);text-wrap:balance}

/* ---------- états : envoyée, sans adresse ---------- */
.rg-mail{position:relative;display:grid;place-items:center;height:96px;margin-top:12px}
.rg-env{width:96px;height:66px;border-radius:12px;background:#fff;border:2px solid var(--rg-edge);box-shadow:0 4px 0 var(--rg-edge);position:relative;animation:rgEnv 1.6s var(--rg-spring) .2s both}
.rg-env::before{content:"";position:absolute;left:8px;right:8px;top:6px;height:34px;border-left:2px solid var(--rg-edge);border-bottom:2px solid var(--rg-edge);transform:skewY(0) rotate(-45deg) scale(.74);transform-origin:0 0;left:12px;top:4px;width:56px;height:56px;border-right:0;border-top:0;rotate:0deg}
.rg-env i{position:absolute;right:-10px;top:-10px;width:26px;height:26px;border-radius:50%;background:var(--rg-tang);border:2px solid var(--rg-edge);color:#fff;display:grid;place-items:center;font:800 13px/1 var(--rg-fb);font-style:normal;animation:rgPop .5s var(--rg-spring) .8s both}
@keyframes rgEnv{0%{transform:translate(-60px,20px) rotate(-18deg);opacity:0}60%{transform:translate(4px,-6px) rotate(4deg);opacity:1}100%{transform:none}}
@keyframes rgPop{from{transform:scale(0)}}
.rg-tx{margin:10px 0 0;font-size:14.5px;line-height:1.5;color:var(--rg-ink2);text-align:center;text-wrap:pretty}
.rg-tx b{color:var(--rg-ink);word-break:break-all}
.rg-li{display:flex;gap:10px;align-items:flex-start;margin-top:10px;padding:11px 13px;border-radius:16px;font-size:13.5px;line-height:1.45;text-wrap:pretty}
.rg-li .ic{flex:none;width:26px;height:26px;border-radius:9px;background:#fff;display:grid;place-items:center}
.rg-li.sp{background:var(--rg-sun-bg);color:#6B4A0E}
.rg-li.sp .ic{color:#9A6400}
.rg-li.rm{background:var(--rg-green-bg);color:var(--rg-green-d)}
.rg-li.rm .ic{color:var(--rg-green)}
.rg-li b{color:var(--rg-ink)}
.rg-url{display:flex;align-items:center;gap:8px;min-height:58px;margin-top:12px;padding:6px 6px 6px 14px;border-radius:16px;border:2px solid var(--rg-edge);background:var(--rg-paper);box-shadow:0 3px 0 var(--rg-edge)}
.rg-url .u{flex:1;min-width:0;font:700 14.5px var(--rg-fb);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rg-url .u small{color:var(--rg-muted);font-weight:600}
.rg-url .rg-gh{flex:none;min-height:44px}
.rg-tip{margin:8px 2px 0;padding:10px 12px;border-radius:14px;background:var(--rg-cream);font:600 13px/1.45 var(--rg-fb);color:var(--rg-ink2)}
.rg-tip kbd{display:inline-block;min-width:22px;padding:1px 6px;border-radius:6px;border:1.5px solid var(--rg-line2);background:#fff;font:700 12px var(--rg-fb);text-align:center;color:var(--rg-ink)}

/* ---------- confettis ---------- */
.rg-cf{position:absolute;z-index:30;width:8px;height:12px;border-radius:2px;pointer-events:none}

/* plus serré quand le contenu s'allonge (erreur + case rappel, ou anglais) */
.rg-win.tight .rg-in{padding-top:4px}
.rg-win.tight .rg-rc{margin-top:10px}
.rg-win.tight .rg-ex{margin-top:10px;font-size:13.5px}
.rg-win.tight .rg-ask{margin-top:10px;padding:12px}
.rg-win.tight .rg-ask p{margin-bottom:8px;font-size:13.5px}
.rg-win.tight .rg-go{margin-top:10px}
.rg-win.tight .rg-sure{margin-top:8px}
.rg-win.tight .rg-two{margin-top:10px}
.rg-win.tight .rg-foot{margin-top:10px;padding-top:10px}
@media (prefers-reduced-motion:reduce){.rg-win *,.rg-win{animation:none!important;transition-duration:.01ms!important}}

/* ---------- dans l'appli (reception-gardee-css.py) ---------- */
.rg-racine{position:fixed;inset:0;z-index:460}
.rg-racine .rg-win{padding-bottom:env(safe-area-inset-bottom)}
.rg-racine button{font-family:inherit}
/* Le titre reçoit le focus à chaque état (lecteurs d'écran) : pas de cadre pour autant. */
.rg-racine #rgT:focus{outline:none}
.rg-racine .rg-err.srv{margin-top:8px}
/* Le bloc « Garde ton réveillon » de la page du repas, sous « Au menu » (popotam-table-ui.js, garde4). Les
   classes passent par px4 : `rgb` devient `r4-rgb`. */
.r4 .r4-rgb{display:flex;gap:14px;align-items:flex-start;margin:22px 0 4px;padding:18px;border-radius:24px;background:#FFF8EA;border:2px solid #2A211B;box-shadow:0 5px 0 #2A211B;color:#2A211B}
.r4 .r4-rgb.r4-noel{background:#FFF1F0}
.r4 .r4-rgb-pp{flex:none;width:64px;height:64px;border-radius:20px;overflow:hidden;background:#FFF1D2;border:2px solid #2A211B;transform:rotate(-6deg)}
.r4 .r4-rgb.r4-noel .r4-rgb-pp{background:#FFE9E9}
.r4 .r4-rgb-pp svg{width:100%;height:100%}
.r4 .r4-rgb-x{flex:1;min-width:0}
.r4 .r4-rgb-hand{display:block;font:700 19px/1 "Caveat",cursive;color:#C2410C;transform:rotate(-2deg);transform-origin:left}
.r4 .r4-rgb.r4-noel .r4-rgb-hand{color:#A2242B}
.r4 .r4-rgb h3{margin:4px 0 6px;font:800 21px/1.15 "Bricolage Grotesque",system-ui,sans-serif;letter-spacing:-.01em}
.r4 .r4-rgb p{margin:0 0 12px;font-size:14.5px;line-height:1.5;color:#5C4A3A}
.r4 .r4-rgb .r4-rgb-go{display:inline-flex;align-items:center;gap:8px;min-height:50px;padding:0 20px;border:0;border-radius:16px;background:#F0682F;color:#fff;font:800 15.5px "Bricolage Grotesque",system-ui,sans-serif;box-shadow:0 4px 0 #C2410C;cursor:pointer}
.r4 .r4-rgb.r4-noel .r4-rgb-go{background:#C8323A;box-shadow:0 4px 0 #A2242B}
.r4 .r4-rgb .r4-rgb-go:active{transform:translateY(2px);box-shadow:0 1px 0 #A2242B}
/* Adresse envoyée : « Changer d'adresse » n'est plus l'action principale. */
.r4 .r4-rgb .r4-rgb-go.r4-gh,.r4 .r4-rgb.r4-noel .r4-rgb-go.r4-gh{background:#fff;color:#2A211B;border:1.5px solid #DCCBA9;box-shadow:none}
@media (max-width:600px){.r4 .r4-rgb{padding:16px;gap:12px}.r4 .r4-rgb-pp{width:54px;height:54px}.r4 .r4-rgb .r4-rgb-go{width:100%;justify-content:center}}