/* Le corps opaque recouvre les tiges : aucun découpage horizontal de leur extrémité. */
.cadenas{position:relative;width:clamp(210px,26vw,290px);margin:-34px auto 26px;isolation:isolate}
.cadenas-objet{display:block;position:relative;width:100%;aspect-ratio:1;padding:0;border:0;background:none;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.cadenas-objet:focus-visible{outline:2px solid #526d22;outline-offset:10px;border-radius:40%}
.cadenas-volume,.cadenas-secours,.cadenas-corps{position:absolute;inset:0;pointer-events:none}
.cadenas img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none}
.cadenas-volume{width:100%;height:100%;z-index:1}
.cadenas-secours{display:none;clip-path:inset(0 0 50%);transform:translate(-.4%,11%);z-index:1}
.cadenas.sans-volume .cadenas-secours{display:block}
.cadenas-corps{z-index:2}
.cadenas-halo{position:absolute;inset:-18% -45% -44%;background:radial-gradient(ellipse,#e9ffb8 0%,#bbf877bd 23%,#8ee66375 40%,#9ade6226 57%,transparent 73%);filter:blur(18px);opacity:0;transform:scale(.7);z-index:0;pointer-events:none}
.cadenas-lueur{position:absolute;left:29%;top:52%;width:43%;height:45%;border-radius:50%;background:radial-gradient(ellipse,#eeffd7 0%,#c3ff8480 35%,transparent 72%);filter:blur(16px);mix-blend-mode:screen;opacity:0;z-index:4;pointer-events:none}
.cadenas.ferme .cadenas-corps{animation:cadenas-impact 9s ease-out both}
.cadenas.ferme .cadenas-halo{animation:cadenas-rayonne 9s linear both;will-change:transform,opacity}
.cadenas.ferme .cadenas-lueur{animation:cadenas-lumiere 9s ease-in-out both}
@keyframes cadenas-impact{0%,7.7%{transform:translateY(0)}8.1%{transform:translateY(1.2%)}9%{transform:translateY(-.3%)}10.3%,100%{transform:translateY(0)}}
@keyframes cadenas-rayonne{0%,7.7%{opacity:0;transform:scale(.65)}10.5%{opacity:1;transform:scale(.95)}28%{opacity:.86;transform:scale(1.17)}50%{opacity:.6;transform:scale(1.45)}72%{opacity:.28;transform:scale(1.73)}90%,100%{opacity:0;transform:scale(1.96)}}
@keyframes cadenas-lumiere{0%,7.7%{opacity:0}8.5%{opacity:1}14%{opacity:.55}62%{opacity:.3}85%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.cadenas .cadenas-corps,.cadenas .cadenas-halo,.cadenas .cadenas-lueur{animation:none!important}.cadenas .cadenas-halo{opacity:.18;transform:scale(1)}.cadenas-objet{cursor:default}}