/* GÉNÉRÉE par scripts/don-appli-css.py depuis src/app/don/don.css et scene/scene.css :
   ne pas modifier à la main. La page des dons de l'appli (popotam-don-ui.js), classes dj-. */
.dj{--d-bg: var(--bg, #FBF6EC);--d-bg2: #FFE7BE;--d-card: #FFFFFF;--d-cream: #FBF3E0;--d-cream2: #FCEFD9;--d-ink: #2A211B;--d-ink2: #5A4D3F;--d-muted: #9C8B79;--d-line: #F0E5CF;--d-line2: #EBDDC0;--d-orange: #F0682F;--d-orange-d: #DA541E;--d-orange-bg: #FCE3D8;--d-green: #33A15B;--d-green-d: #2C8B4E;--d-green-lbl: #3E9B5F;--d-green-bg: #E6F3E9;--d-sun: #FFC53D;--d-sun-d: #F6A609;--d-sun-bg: #FFF1D2;--d-r: 12px;--d-r2: 18px;--d-r3: 24px;--d-pill: 999px;--d-sh-sm: 0 1px 2px rgba(90,60,20,.05);--d-sh: 0 2px 4px rgba(90,60,20,.05), 0 16px 36px -22px rgba(150,90,30,.26);--d-sh-lg: 0 30px 64px -28px rgba(120,70,25,.4);--d-fd: "Bricolage Grotesque", system-ui, sans-serif;--d-fb: "Hanken Grotesk", system-ui, sans-serif;--d-fm: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--d-fh: "Caveat", cursive;--d-maxw: 1200px;--d-reading: 720px;--encre:var(--d-ink)}
.dj .dj-pot{ --spring: cubic-bezier(.3, 1.5, .4, 1); }.dj .dj-pot .tongue{ transform-box: fill-box; transform-origin: 50% 100%; animation: dj-mm-flk 1s ease-in-out infinite alternate; }@keyframes dj-mm-flk{0%{ transform: scaleY(.8) scaleX(1.06) skewX(4deg); }45%{ transform: scaleY(1.08) scaleX(.95) skewX(-5deg); }100%{ transform: scaleY(.92) scaleX(1.02) skewX(3deg); }
}.dj .dj-pot .glow{ transform-box: fill-box; transform-origin: 50% 50%; animation: dj-mm-glow 1.6s ease-in-out infinite alternate; }@keyframes dj-mm-glow{from{ opacity: .22; transform: scale(.94); }to{ opacity: .42; transform: scale(1.06); } }.dj .dj-pot .wisp{ fill: none; stroke: #D9C7A8; stroke-width: 7; stroke-linecap: round; stroke-dasharray: 60 200; animation: dj-mm-wisp 3.4s ease-in-out infinite; opacity: 0; }.dj .dj-pot .wisp:nth-child(2){ animation-delay: -1.1s; }.dj .dj-pot .wisp:nth-child(3){ animation-delay: -2.2s; }@keyframes dj-mm-wisp{0%{ stroke-dashoffset: 60; opacity: 0; transform: translateY(10px); }25%{ opacity: var(--st, .6); }100%{ stroke-dashoffset: -150; opacity: 0; transform: translateY(-26px); }
}.dj .dj-pot .curr{ animation: dj-mm-curr 7s linear infinite; }.dj .dj-pot .curr.c2{ animation-duration: 5s; animation-direction: reverse; }@keyframes dj-mm-curr{to{ stroke-dashoffset: -384; } }.dj .dj-pot .bob{ animation: dj-mm-bob 2.6s ease-in-out infinite alternate; }@keyframes dj-mm-bob{from{ transform: translateY(-1.5px) rotate(-4deg); }to{ transform: translateY(1.5px) rotate(4deg); } }.dj .dj-pot .mm .body{ transition: transform .5s var(--spring); transform-origin: 210px 330px; }.dj .dj-pot .mm:hover .body{ transform: scale(1.015); }.dj .dj-pot .mm:active .body{ transform: scale(.985); }.dj .dj-pot .mm .jig.boil{ animation: dj-mm-jig .32s ease-in-out infinite alternate; transform-origin: 210px 330px; }@keyframes dj-mm-jig{from{ transform: rotate(-.7deg) translateY(0); }to{ transform: rotate(.7deg) translateY(-1.5px); } }@media (prefers-reduced-motion: reduce){.dj .dj-pot .tongue,.dj .dj-pot .glow,.dj .dj-pot .wisp,.dj .dj-pot .bob,.dj .dj-pot .curr,.dj .dj-pot .mm .jig.boil{ animation: none; }.dj .dj-pot .wisp{ opacity: .4; }
}
.dj{
  --encre: var(--d-ink);
  max-width: 1080px;
  margin: 0 auto;
  padding: 36px 16px 64px;
}@media (min-width: 900px){.dj{ padding-top: 56px; } }.dj .dj-marmite-jeu{
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(0, 1fr);
}.dj .dj-haut{
  display: grid;
  gap: 28px;
  grid-template-columns: minmax(0, 1fr);
}@media (min-width: 900px){.dj .dj-haut{
    grid-template-columns: 1.1fr 1fr;
    column-gap: 40px;
    align-items: start;
  }.dj .dj-inventaire{ position: sticky; top: 92px; }
}.dj .dj-scene h1{
  margin: 0;
  font: 800 clamp(34px, 7vw, 54px)/1.02 var(--d-fd);
  letter-spacing: -0.02em;
  color: var(--d-ink);
}.dj .dj-chapeau{
  margin: 10px 0 0;
  max-width: 34em;
  font: 400 17px/1.55 var(--d-fb);
  color: var(--d-ink2);
}.dj .dj-scene-texte{ position: relative; z-index: 2; }.dj .dj-scene-visuel{
  --spring: cubic-bezier(.3, 1.5, .4, 1);
  --pop: 178px;
  position: relative;
  z-index: 1;
  margin-top: -56px;
  height: 452px;
}@media (max-width: 860px){.dj .dj-scene-visuel{ margin-top: -40px; height: 420px; } }.dj .dj-scene-visuel .dj-pot{
  position: absolute;
  right: 0;
  bottom: 6px;
  width: min(400px, calc(100% - var(--pop) + 12px));
  overflow: visible;
  -webkit-tap-highlight-color: transparent;
}.dj .dj-scene-visuel .dj-pot svg{ width: 100%; height: auto; display: block; }.dj .dj-scene-visuel .dj-pop{
  position: absolute;
  left: 0;
  bottom: 0;
  width: var(--pop);
  z-index: 2;
  transition: transform .5s var(--spring);
}.dj .dj-scene-visuel .dj-pop svg{ width: 100%; height: auto; display: block; }.dj .dj-scene-visuel button.dj-pop{
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}.dj .dj-scene-visuel button.dj-pop:focus-visible{ outline: 3px solid var(--d-orange); outline-offset: 4px; border-radius: 24px; }.dj .dj-scene-visuel .dj-pop.hop{ transform: translateY(-14px) rotate(-4deg); }.dj .dj-scene-visuel .dj-bub{
  position: absolute;
  left: 4px;
  bottom: calc(var(--pop) * 268 / 240 - 2px);
  z-index: 3;
  max-width: min(172px, calc(var(--pop) + 8px));
  padding: 10px 15px;
  border: 2px solid var(--encre);
  border-radius: 18px;
  background: var(--d-card);
  box-shadow: 0 4px 0 var(--encre);
  font: 700 21px/1.15 var(--d-fh);
  color: var(--d-ink);
  transform-origin: 24px 100%;
  transition: transform .45s var(--spring);
}.dj .dj-scene-visuel .dj-bub::after{
  content: "";
  position: absolute;
  left: 44px;
  bottom: -11px;
  width: 16px;
  height: 16px;
  background: var(--d-card);
  border: 2px solid var(--encre);
  border-top: 0;
  border-left: 0;
  transform: rotate(45deg);
}.dj .dj-scene-visuel .dj-bub{ cursor: pointer; }.dj .dj-scene-visuel .dj-bub-plein{ visibility: hidden; }.dj .dj-scene-visuel .dj-bub-ecrit{ position: absolute; top: 10px; left: 15px; right: 15px; }.dj .dj-scene-visuel .dj-bub-suite{
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 6px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid var(--d-orange-d);
  vertical-align: middle;
  animation: dj-bulle-suite .9s ease-in-out infinite;
}@keyframes dj-bulle-suite{0%, 100%{ transform: translateY(-2px); opacity: 1; }50%{ transform: translateY(3px); opacity: .45; } }.dj .dj-scene-visuel .dj-pop.attend svg{ transform-origin: 50% 100%; animation: dj-pop-dandine 1.6s ease-in-out infinite; }@keyframes dj-pop-dandine{0%, 100%{ transform: rotate(0) translateY(0); }25%{ transform: rotate(-3deg) translateY(-3px); }50%{ transform: rotate(0) translateY(0); }75%{ transform: rotate(3deg) translateY(-3px); }
}.dj .dj-lecteur{ position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }.dj .dj-scene-visuel .dj-bub.pulse{ animation: dj-bulle-pulse .45s var(--spring); }.dj .dj-scene-visuel .dj-bub b{ color: var(--d-orange-d); }@keyframes dj-bulle-pulse{50%{ transform: scale(1.08) rotate(-2deg); } }@media (max-width: 480px){.dj .dj-scene-visuel{
    --pop: 128px;
    margin-top: 16px;
    height: calc((100vw - 32px - 116px) * 448 / 420 + 8px);
    max-height: 400px;
  }.dj .dj-scene-visuel .dj-pot{ width: calc(100% - 116px); }.dj .dj-scene-visuel .dj-bub{ font-size: 19px; max-width: 200px; }
}.dj .dj-inventaire h2{ margin: 0 0 14px; font: 800 24px/1.15 var(--d-fd); color: var(--d-ink); }.dj .dj-inventaire{
  padding: 20px;
  border: 3px solid var(--encre);
  border-radius: var(--d-r3);
  background: var(--d-card);
  box-shadow: 0 6px 0 var(--encre);
}.dj .dj-cartes{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}.dj .dj-carte{
  display: grid;
  justify-items: center;
  gap: 2px;
  min-height: 118px;
  padding: 12px 8px 10px;
  border: 2.5px solid var(--encre);
  border-radius: var(--d-r2);
  background: var(--d-cream);
  box-shadow: 0 4px 0 var(--encre);
  font: inherit;
  color: var(--d-ink);
  cursor: pointer;
  transition: transform .08s ease, box-shadow .08s ease, background .15s ease;
}.dj .dj-carte:active{ transform: translateY(3px); box-shadow: 0 1px 0 var(--encre); }.dj .dj-carte.choisie{ background: var(--d-sun-bg); border-color: var(--d-orange-d); box-shadow: 0 4px 0 var(--d-orange-d); }.dj .dj-carte.choisie svg{ animation: dj-sautille .45s cubic-bezier(.3, 1.6, .5, 1); }.dj .dj-carte:focus-visible,.dj .dj-cta-don:focus-visible,.dj .dj-libre input:focus-visible{
  outline: 3px solid var(--d-orange);
  outline-offset: 3px;
}.dj .dj-carte svg{ overflow: visible; }.dj .dj-carte-nom{ font: 700 15px/1.2 var(--d-fb); }.dj .dj-carte-prix{ font: 800 18px/1.1 var(--d-fd); }@keyframes dj-sautille{0%{ transform: translateY(0); }40%{ transform: translateY(-8px); }100%{ transform: translateY(0); } }.dj .dj-libre{
  display: grid;
  gap: 6px;
  margin-top: 14px;
  font: 600 15px/1.3 var(--d-fb);
  color: var(--d-ink2);
}.dj .dj-libre input{
  width: 100%;
  max-width: 180px;
  min-height: 48px;
  padding: 8px 12px;
  border: 2.5px solid var(--encre);
  border-radius: var(--d-r);
  font: 800 22px/1 var(--d-fd);
  color: var(--d-ink);
  background: var(--d-bg);
}.dj .dj-impact{
  margin: 24px 0 0;
  font: 400 17px/1.5 var(--d-fb);
  color: var(--d-ink2);
}.dj .dj-impact strong{ color: var(--d-ink); }.dj .dj-cta-don{
  display: block;
  margin-top: 16px;
  padding: 16px 20px;
  border: 3px solid var(--encre);
  border-radius: var(--d-pill);
  background: var(--d-orange);
  box-shadow: 0 5px 0 var(--encre);
  font: 800 19px/1.2 var(--d-fd);
  text-align: center;
  text-decoration: none;
  color: #fff;
  transition: transform .08s ease, box-shadow .08s ease, background .15s ease;
}.dj .dj-cta-don:hover{ background: var(--d-orange-d); }.dj .dj-cta-don:active{ transform: translateY(4px); box-shadow: 0 1px 0 var(--encre); }.dj .dj-cta-don[aria-disabled="true"]{ pointer-events: none; opacity: .5; }.dj .dj-apres-cta{ margin: 16px 0 0; font: 400 14px/1.4 var(--d-fb); color: var(--d-muted); text-align: center; }.dj .dj-quete{ --spring: cubic-bezier(.3, 1.5, .4, 1); margin-top: 28px; }.dj .dj-quete .dj-sh{ display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-bottom: 22px; }.dj .dj-quete .dj-sh h2{ font: 800 32px/1.05 var(--d-fd); letter-spacing: -.02em; margin: 0; color: var(--d-ink); }.dj .dj-quete .dj-sh p{ margin: 6px 0 0; color: var(--d-ink2); font: 400 15px/1.5 var(--d-fb); max-width: 52ch; text-wrap: pretty; }.dj .dj-quete .dj-tot{ display: flex; align-items: baseline; gap: 8px; padding: 10px 18px; border-radius: var(--d-pill); background: var(--d-card); border: 2px solid var(--encre); box-shadow: 0 3px 0 var(--encre); }.dj .dj-quete .dj-tot b{ font: 800 24px/1 var(--d-fd); font-variant-numeric: tabular-nums; color: var(--d-ink); }.dj .dj-quete .dj-tot span{ color: var(--d-ink2); font: 400 14px/1.3 var(--d-fb); }.dj .dj-quete .dj-tix{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }.dj .dj-quete .dj-tk{ position: relative; display: flex; flex-direction: column; background: var(--d-card); border: 2px solid var(--encre); border-radius: 20px; box-shadow: 0 5px 0 var(--encre); transition: transform .45s var(--spring), box-shadow .3s; }.dj .dj-quete .dj-tk.cur{ transform: translateY(-6px); box-shadow: 0 11px 0 var(--encre); }.dj .dj-quete .dj-top{ padding: 18px 18px 16px; display: flex; flex-direction: column; gap: 12px; flex: 1; }.dj .dj-quete .dj-row{ display: flex; align-items: center; justify-content: space-between; gap: 10px; }.dj .dj-quete .dj-no{ font: 700 11.5px/1.2 var(--d-fd); letter-spacing: .14em; text-transform: uppercase; color: var(--d-muted); }.dj .dj-quete .dj-chip{ font: 800 12px/1.2 var(--d-fd); padding: 4px 10px; border-radius: var(--d-pill); white-space: nowrap; }.dj .dj-quete .dj-tk.cur .dj-chip{ background: var(--d-orange-bg); color: var(--d-orange-d); }.dj .dj-quete .dj-tk.wait .dj-chip{ background: var(--d-cream2); color: var(--d-ink2); }.dj .dj-quete .dj-tk.paid .dj-chip{ background: var(--d-green-bg); color: var(--d-green-d); }.dj .dj-quete .dj-tile{ flex: none; width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; transform: rotate(-4deg); border: 2px solid var(--encre); }.dj .dj-quete .dj-tk:nth-child(2) .dj-tile{ transform: rotate(3deg); }.dj .dj-quete .dj-tile svg{ width: 26px; height: 26px; }.dj .dj-quete .dj-t-sun{ background: var(--d-sun); color: #5A3A05; }.dj .dj-quete .dj-t-green{ background: #8BC89E; color: #10402a; }.dj .dj-quete .dj-t-tang{ background: var(--d-orange); color: #fff; }.dj .dj-quete .dj-tk h3{ font: 800 18px/1.2 var(--d-fd); margin: 0; color: var(--d-ink); }.dj .dj-quete .dj-tk .dj-d{ margin: 3px 0 0; font: 400 13.5px/1.45 var(--d-fb); color: var(--d-ink2); text-wrap: pretty; }.dj .dj-quete .dj-amt{ margin-top: auto; font: 800 30px/1 var(--d-fd); letter-spacing: -.02em; color: var(--d-ink); }.dj .dj-quete .dj-amt small{ font-size: 15px; font-weight: 700; color: var(--d-ink2); margin-right: 4px; }.dj .dj-quete .dj-stub{ position: relative; border-top: 2px dashed var(--d-line2); padding: 14px 18px 16px; display: flex; flex-direction: column; gap: 8px; }.dj .dj-quete .dj-stub::before,.dj .dj-quete .dj-stub::after{ content: ""; position: absolute; top: -11px; width: 20px; height: 20px; border-radius: 50%; background: var(--d-bg); border: 2px solid var(--encre); }.dj .dj-quete .dj-stub::before{ left: -12px; clip-path: inset(0 0 0 50%); }.dj .dj-quete .dj-stub::after{ right: -12px; clip-path: inset(0 50% 0 0); }.dj .dj-quete .dj-bar{ height: 10px; border-radius: 5px; background: var(--d-cream2); overflow: hidden; }.dj .dj-quete .dj-bar i{ display: block; height: 100%; border-radius: 5px; background: var(--d-orange); }.dj .dj-quete .dj-tk.paid .dj-bar i{ background: var(--d-green); }.dj .dj-quete .dj-lb{ display: flex; justify-content: space-between; gap: 8px; font: 400 13px/1.35 var(--d-fb); color: var(--d-ink2); }.dj .dj-quete .dj-lb b{ color: var(--d-ink); font-variant-numeric: tabular-nums; }.dj .dj-quete .dj-stamp{ position: absolute; right: 14px; top: 58px; padding: 5px 12px 3px; border: 3px solid var(--d-green-d); border-radius: 10px; color: var(--d-green-d); font: 800 19px/1.1 var(--d-fd); letter-spacing: .12em; background: rgba(255, 255, 255, .85); transform: rotate(-12deg) scale(0); opacity: 0; pointer-events: none; }.dj .dj-quete .dj-tk.paid .dj-stamp{ animation: dj-tampon .5s var(--spring) forwards; }.dj .dj-quete .dj-tk.paid.still .dj-stamp{ animation: none; transform: rotate(-12deg); opacity: 1; }@keyframes dj-tampon{0%{ transform: rotate(-20deg) scale(2.2); opacity: 0; }60%{ opacity: 1; }100%{ transform: rotate(-12deg) scale(1); opacity: 1; } }.dj .dj-merci-carte{ text-align: center; perspective: 900px; }.dj .dj-merci-carte .dj-merci-corps{ display: grid; justify-items: center; gap: 10px; animation: dj-merci-bascule .55s cubic-bezier(.3, 1.4, .5, 1) both; }@keyframes dj-merci-bascule{from{ transform: rotateX(-70deg); opacity: 0; }to{ transform: none; opacity: 1; } }.dj .dj-merci-carte h2{ margin: 4px 0 0; font: 800 24px/1.2 var(--d-fd); color: var(--d-ink); text-wrap: balance; }.dj .dj-merci-carte .dj-merci-effet{ margin: 0; font: 500 17px/1.45 var(--d-fb); color: var(--d-ink2); }.dj .dj-merci-carte .dj-merci-effet b{ color: var(--d-green-d); }.dj .dj-merci-carte .dj-merci-note{ margin: 0; max-width: 36ch; font: 400 15px/1.5 var(--d-fb); color: var(--d-muted); }.dj .dj-merci-carte .dj-cta-don{ align-self: stretch; margin-top: 10px; }.dj .dj-merci-carte .dj-merci-lien{ font: 700 15px/1.3 var(--d-fb); color: var(--d-orange-d); }.dj .dj-merci-carte .dj-merci-essai{ padding: 4px 12px; border-radius: var(--d-pill); background: var(--d-orange-bg); color: var(--d-orange-d); font: 800 12px/1.3 var(--d-fd); }.dj .dj-merci-coche svg{ width: 84px; height: 84px; }.dj .dj-merci-coche circle{ fill: var(--d-green-bg); stroke: var(--d-green); stroke-width: 3.5; stroke-dasharray: 150; stroke-dashoffset: 150; animation: dj-merci-trait .6s ease-out .15s forwards; }.dj .dj-merci-coche path{ fill: none; stroke: var(--d-green-d); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 40; stroke-dashoffset: 40; animation: dj-merci-trait .35s ease-out .65s forwards; }@keyframes dj-merci-trait{to{ stroke-dashoffset: 0; } }.dj .dj-merci-attente{ display: inline-flex; gap: 8px; margin: 8px 0 4px; }.dj .dj-merci-attente i{ width: 14px; height: 14px; border-radius: 50%; background: var(--d-sun); border: 2px solid var(--encre); animation: dj-merci-point 1s ease-in-out infinite; }.dj .dj-merci-attente i:nth-child(2){ animation-delay: .15s; }.dj .dj-merci-attente i:nth-child(3){ animation-delay: .3s; }@keyframes dj-merci-point{0%, 100%{ transform: translateY(0); }50%{ transform: translateY(-9px); } }.dj .dj-quete{ position: relative; }.dj .dj-quete .dj-stamp-mois{
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 296px;
  padding: 10px 26px 6px;
  border: 5px solid var(--d-green-d);
  border-radius: 16px;
  background: rgba(255, 255, 255, .88);
  color: var(--d-green-d);
  font: 800 clamp(28px, 5vw, 42px)/1 var(--d-fd);
  letter-spacing: .12em;
  white-space: nowrap;
  pointer-events: none;
  transform: translateX(-50%) rotate(-8deg);
}.dj .dj-quete.fete .dj-stamp-mois{ animation: dj-tampon-mois .7s var(--spring) both; }@keyframes dj-tampon-mois{0%{ transform: translateX(-50%) rotate(-16deg) scale(2.4); opacity: 0; }60%{ opacity: 1; }100%{ transform: translateX(-50%) rotate(-8deg) scale(1); opacity: 1; }
}@media (max-width: 860px){.dj .dj-quete .dj-stamp-mois{ top: 270px; } }.dj .dj-quete .dj-tk.bonus{ margin-top: 22px; }.dj .dj-quete.fete .dj-tk.bonus{ animation: dj-bonus-arrive .6s var(--spring) .45s both; }@keyframes dj-bonus-arrive{from{ transform: translateY(18px); opacity: 0; }to{ transform: none; opacity: 1; } }.dj .dj-quete .dj-tk.bonus .dj-chip{ background: var(--d-green-bg); color: var(--d-green-d); }.dj .dj-quete .dj-tk.bonus h3{ font-size: 22px; }.dj .dj-quete .dj-tk.bonus .dj-d{ font-size: 15px; max-width: 70ch; }.dj .dj-quete .dj-tk.bonus .dj-d a{ color: var(--d-orange-d); font-weight: 700; }.dj .dj-quete .dj-bonus-stubs{ display: grid; grid-template-columns: 1fr 1.4fr; gap: 22px; }@media (max-width: 860px){.dj .dj-quete .dj-bonus-stubs{ grid-template-columns: 1fr; } }.dj .dj-quete .dj-bonus-part{ display: grid; gap: 10px; align-content: start; }.dj .dj-quete .dj-tk.bonus .dj-bar i{ background: var(--d-green); }.dj .dj-quete .dj-projets{ list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }@media (max-width: 520px){.dj .dj-quete .dj-projets{ grid-template-columns: 1fr; } }.dj .dj-quete .dj-projets li{ display: grid; gap: 2px; padding: 10px 12px; border-radius: 12px; background: var(--d-cream); }.dj .dj-quete .dj-projets b{ font: 800 14px/1.25 var(--d-fd); color: var(--d-ink); }.dj .dj-quete .dj-projets span{ font: 400 13px/1.4 var(--d-fb); color: var(--d-ink2); }.dj .dj-scene-visuel .dj-pop.danse svg{ transform-origin: 50% 100%; animation: dj-pop-danse .8s ease-in-out 4; }@keyframes dj-pop-danse{0%, 100%{ transform: translateY(0) rotate(0); }20%{ transform: translateY(-18px) rotate(-8deg); }40%{ transform: translateY(0) rotate(0) scaleY(.94); }60%{ transform: translateY(-18px) rotate(8deg); }80%{ transform: translateY(0) rotate(0) scaleY(.94); }
}.dj .dj-prom{ --spring: cubic-bezier(.3, 1.5, .4, 1); margin-top: 16px; background: var(--d-card); border: 2px solid var(--encre); border-radius: 24px; box-shadow: 0 5px 0 var(--encre); padding: 24px 24px 20px; }.dj .dj-prom .dj-hd{ display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }.dj .dj-prom .dj-hand{ display: inline-block; font: 700 28px/1 var(--d-fh); color: var(--d-orange-d); transform: rotate(-3deg); }.dj .dj-prom h2{ font: 800 22px/1.2 var(--d-fd); margin: 0; letter-spacing: -.01em; color: var(--d-ink); }.dj .dj-prom .dj-pl{ list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }.dj .dj-prom .dj-pl li{ display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 16px; background: var(--d-cream); }.dj .dj-prom .dj-ic{ width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--d-card); border: 2px solid var(--encre); color: var(--d-ink); }.dj .dj-prom .dj-ic svg{ width: 21px; height: 21px; }.dj .dj-prom .dj-pl b{ display: block; font: 800 15.5px/1.25 var(--d-fd); color: var(--d-ink); }.dj .dj-prom .dj-pl span span{ font: 400 13.5px/1.45 var(--d-fb); color: var(--d-ink2); text-wrap: pretty; }.dj .dj-prom .dj-pf{ margin-top: 18px; padding-top: 16px; border-top: 2px dashed var(--d-line2); display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }.dj .dj-prom .dj-pf p{ margin: 0; color: var(--d-ink2); font: 400 14.5px/1.45 var(--d-fb); }.dj .dj-prom .dj-more{ display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: var(--d-pill); border: 2px solid var(--encre); background: var(--d-card); color: var(--d-ink); text-decoration: none; font: 800 14.5px/1 var(--d-fd); box-shadow: 0 3px 0 var(--encre); transition: transform .3s var(--spring); }.dj .dj-prom .dj-more:hover{ color: var(--d-ink); transform: translateY(-2px); }.dj .dj-prom .dj-more:focus-visible{ outline: 3px solid var(--d-orange); outline-offset: 3px; }.dj .dj-prom .dj-more svg{ width: 17px; height: 17px; transition: transform .3s var(--spring); }.dj .dj-prom .dj-more:hover svg{ transform: translateX(3px); }@media (max-width: 860px){.dj .dj-quete .dj-tix{ grid-template-columns: 1fr; }.dj .dj-quete .dj-tk.cur{ transform: none; box-shadow: 0 5px 0 var(--encre); }.dj .dj-prom .dj-pl{ grid-template-columns: 1fr 1fr; }
}@media (max-width: 520px){.dj .dj-prom .dj-pl{ grid-template-columns: 1fr; } }@media (prefers-reduced-motion: reduce){.dj .dj-quete .dj-tk,.dj .dj-prom .dj-more,.dj .dj-prom .dj-more svg{ transition: none; }.dj .dj-quete .dj-tk.paid .dj-stamp{ animation: none; transform: rotate(-12deg); opacity: 1; }.dj .dj-quete.fete .dj-stamp-mois,.dj .dj-quete.fete .dj-tk.bonus,.dj .dj-scene-visuel .dj-pop.danse svg{ animation: none; }.dj .dj-merci-carte .dj-merci-corps,.dj .dj-merci-attente i{ animation: none; }.dj .dj-merci-coche circle,.dj .dj-merci-coche path{ animation: none; stroke-dashoffset: 0; }.dj .dj-pot .tongue,.dj .dj-pot .glow,.dj .dj-pot .wisp,.dj .dj-pot .bob,.dj .dj-pot .curr,.dj .dj-pot .mm .jig.boil,.dj .dj-scene-visuel .dj-bub.pulse,.dj .dj-carte.choisie svg,.dj .dj-scene-visuel .dj-pop.attend svg,.dj .dj-scene-visuel .dj-bub-suite{ animation: none; }.dj .dj-pot .wisp{ opacity: .4; }.dj .dj-carte,.dj .dj-cta-don,.dj .dj-scene-visuel .dj-pop,.dj .dj-scene-visuel .dj-bub{ transition: none; }
}
/* ---------- propres à l'appli (scripts/don-appli-css.py, EXTRA) ---------- */
.dj{color:var(--d-ink);font-family:var(--d-fb);line-height:1.5;padding:8px 0 40px}
.dj p,.dj h1,.dj h2,.dj h3{margin:0}
.dj h1,.dj h2,.dj h3{font-family:var(--d-fd);letter-spacing:-.02em}
.dj button{font:inherit}
.dj a{color:inherit}
/* Le choix de l'ingrédient colle sous la barre du haut de l'appli, pas sous l'en-tête du site. */
@media (min-width:900px){.dj .dj-inventaire{top:84px}}
.dj .dj-moi-retour{margin-bottom:6px}
/* Le CTA est un bouton dans l'appli (Google Play paie sans quitter l'écran). */
.dj button.dj-cta-don{width:100%;cursor:pointer}
.dj button.dj-cta-don:disabled{opacity:.6;cursor:default}
.dj .dj-cta-don.dj-attente{background:var(--d-orange-d)}
/* Le montant libre : le champ de /don, avec un − et un + pour le pouce. */
.dj .dj-libre-l{display:flex;gap:8px;align-items:center}
.dj .dj-pas{flex:none;width:48px;height:48px;border:2.5px solid var(--encre);border-radius:var(--d-r);background:var(--d-card);box-shadow:0 3px 0 var(--encre);font:800 22px/1 var(--d-fd);color:var(--d-ink);cursor:pointer}
.dj .dj-pas:active{transform:translateY(2px);box-shadow:0 1px 0 var(--encre)}
.dj .dj-libre input{max-width:140px;text-align:center}
.dj .dj-libre small{font:400 13px/1.3 var(--d-fb);color:var(--d-muted)}
/* « Retourner à mes menus » de la carte merci est un bouton : même allure que le lien de /don. */
.dj .dj-merci-carte button.dj-merci-lien{border:0;background:none;padding:0;cursor:pointer}
@media (max-width:600px){.dj .dj-scene h1{font-size:34px}.dj .dj-quete .dj-sh h2{font-size:26px}}