/* Thème « porte de frigo » : la tête de chaque page est une porte émaillée. Un seul rendu, assumé clair. */
:root,:root:not([data-theme="light"]),:root[data-theme="dark"]{
  --ivoire:#eef2e4;--blanc:#fafbf6;--sauge:#dbe8cd;--foret:#1c2b2a;--encre:#1c2b2a;--doux:#4a5a54;--trait:#dfe5d6;--or:#b5381f;--bouton:#c93f25;--sur-bouton:#fff;
  --email:#c9dfb6;--email2:#b7d2a3;--papier:#fffef6;
  --porte:linear-gradient(90deg,var(--email),var(--email2));
  --titre:"Bricolage Grotesque","Trebuchet MS",sans-serif;--main:Caveat,"Segoe Print",cursive;
  color-scheme:light;
}
h1,h2{font-family:var(--titre);font-weight:700;letter-spacing:-.025em;line-height:1.03}
.logo{font:700 21px var(--titre);letter-spacing:-.02em}
.btn{border-radius:8px}.btn:hover{opacity:1;background:#ad3219}
.note{background:var(--encre);color:#e8efe2;font-size:13.5px}
.tete{background:var(--porte);border-bottom:0;box-shadow:inset 0 -7px 0 -0px transparent;position:relative;padding-bottom:18px;font-weight:500}
.tete::after{content:"";position:absolute;left:0;right:0;bottom:0;height:7px;background:linear-gradient(#94ab84,#dcebd0)}
.ariane{background:var(--porte);color:var(--encre);margin:0}.ariane a{color:var(--encre)}
.intro{color:var(--doux)}
main>.pg-une,.porte-h{position:relative;background:var(--porte);border-bottom:10px solid var(--encre)}
main>.pg-une{max-width:none;padding-inline:max(16px,calc((100% - 1240px)/2))}
main>.pg-une::after,.porte-h::after,.porte::after{content:"";position:absolute;right:14px;top:60px;height:300px;width:16px;border-radius:9px;background:linear-gradient(90deg,#8f9a95,#f6f8f6 40%,#a3ada8 75%,#6f7a75);box-shadow:4px 8px 12px rgba(28,43,42,.3);pointer-events:none}
.pg-une p{color:var(--encre)}
.pg-une .ph{border-radius:8px;box-shadow:.4em .7em 1.4em rgba(28,43,42,.3)}
.pg-une a:not(.btn){color:inherit}
.pg-mag{transform:rotate(-1.5deg)}
.regle{width:100%;border-top:2px solid var(--encre);position:relative;text-align:center;padding-top:6px;margin:20px auto 0;max-width:340px;font:600 22px/1 var(--main)}
.pg-une .regle{margin:20px auto 0;font-size:22px}
.regle::before,.regle::after{content:"";position:absolute;top:-7px;width:2px;height:12px;background:var(--encre)}
.regle::before{left:0}.regle::after{right:0}
.regle.fr{max-width:310px}
.resume{background:var(--ivoire);border-left:0;border-radius:6px}
.texte a{color:var(--or)}
.texte figure{margin:22px 0}.texte figure img{height:auto;border-radius:8px}
details{padding:14px 0}summary{font:600 18.5px/1.3 Figtree,sans-serif}
.mod h3{font:600 17px/1.25 Figtree,sans-serif}
.quatre li{border-top:2px solid var(--encre)}
.quatre li::before{font:700 34px/1 var(--titre);color:var(--bouton)}
.forfait{border-radius:8px}.forfait.fort{border:1px solid var(--trait)}
.liens a{border-radius:8px}.liens a:hover{border-color:var(--bouton)}
.sombre{background:var(--encre);color:#eef3e8}.sombre .intro{color:#c6d1c7}.sombre a{color:var(--email)}
.cadres{gap:clamp(14px,3vw,30px)}.mag-f{flex:1 1 200px;max-width:320px;width:auto}
/* porte de l'accueil */
.porte{position:relative;background:var(--porte);border-bottom:10px solid var(--encre);overflow:hidden;--k:1;--t:calc(63.5mm*var(--k));--tr:calc(58mm*var(--k))}
.porte-g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:32px;max-width:1240px;margin:0 auto;padding:44px max(16px,4vw) 54px}
.porte-g>div{min-width:0}
.porte h1{font-size:clamp(40px,5.2vw,74px)}
.chapo{font-size:19px;margin-top:18px;max-width:30em}
.feuille{position:relative;background:var(--papier);padding:30px 22px 22px;margin-top:30px;max-width:400px;transform:rotate(-1.4deg);box-shadow:3px 8px 16px rgba(28,43,42,.22)}
.feuille::before,.lot::before{content:"";position:absolute;top:-14px;left:50%;margin-left:-16px;width:32px;height:32px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ec7a5f,#c93f25 60%);box-shadow:2px 4px 6px rgba(28,43,42,.4)}
.feuille>p{font:600 25px/1.1 var(--main);margin-bottom:12px}
.feuille .duo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.feuille input{border-color:var(--encre);padding:9px;min-height:42px;font-size:16px}
.actions{display:flex;gap:16px;align-items:center;margin-top:24px;flex-wrap:wrap}
.porte small{display:block;margin-top:12px;font-size:15px}
.aimants{position:relative;min-height:calc(var(--t)*2.75)}
.indice{position:absolute;left:0;bottom:-14px;font:600 23px var(--main)}
.aim{position:absolute;display:block;width:var(--t);height:var(--t);font-size:calc(var(--t)/10);border-radius:.45em;overflow:hidden;background:#fff;color:var(--encre);transform:rotate(var(--r,0deg));box-shadow:0 1px 2px rgba(0,0,0,.35),.3em .6em .9em rgba(28,43,42,.32);cursor:grab;user-select:none;-webkit-user-select:none;animation:pose .5s cubic-bezier(.2,1.4,.5,1) backwards;animation-delay:var(--d,0s)}
.aim.rd{width:var(--tr);height:var(--tr);font-size:calc(var(--tr)/10);border-radius:50%;box-shadow:0 0 0 .13em #b9c0bd,0 1px 2px rgba(0,0,0,.35),.3em .6em .9em rgba(28,43,42,.32)}
.aim::after{content:"";position:absolute;inset:0;background:linear-gradient(130deg,rgba(255,255,255,.42),rgba(255,255,255,0) 34%);pointer-events:none}
.aim.tenu{cursor:grabbing;box-shadow:0 1px 2px rgba(0,0,0,.3),.7em 1.3em 1.7em rgba(28,43,42,.4)}
.aim i{position:absolute;inset:0;display:block;background-size:cover;background-position:center}
.aim .n{font:italic 400 1.02em/1.05 Newsreader,Georgia,serif;display:block}.aim .d{font:500 .52em/1.3 Figtree,sans-serif;display:block;margin-top:.15em}
.aim b{font-weight:400;position:absolute;left:0;right:0;bottom:0;padding:.5em .4em .55em;text-align:center}
.aim-plein b{color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.72));padding-top:1.6em}.rd.aim-plein b{padding-bottom:1.2em}
.aim-band i{bottom:29%}.aim-band b{background:#fffdf4;height:29%;padding-top:.45em}
.aim-kraft{background-color:#d3b58c;color:#33210f;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg id='f'%3E%3Cg fill='%23fffdf4'%3E%3Ccircle cx='18' cy='12' r='4'/%3E%3Ccircle cx='24' cy='17' r='4'/%3E%3Ccircle cx='22' cy='24' r='4'/%3E%3Ccircle cx='14' cy='24' r='4'/%3E%3Ccircle cx='12' cy='17' r='4'/%3E%3C/g%3E%3Ccircle cx='18' cy='18.500' r='3' fill='%23e0a92e'/%3E%3Cpath d='M29 11c6 4 10 9 12 16' stroke='%23566f49' stroke-width='1.200' fill='none' stroke-linecap='round'/%3E%3Cg fill='%23566f49'%3E%3Cellipse cx='36' cy='11.500' rx='3.600' ry='1.500' transform='rotate(-25 36 11.500)'/%3E%3Cellipse cx='41' cy='17' rx='3.600' ry='1.500' transform='rotate(-25 41 17)'/%3E%3Cellipse cx='30' cy='18' rx='3.600' ry='1.500' transform='rotate(35 30 18)'/%3E%3Cellipse cx='35' cy='24' rx='3.600' ry='1.500' transform='rotate(35 35 24)'/%3E%3C/g%3E%3C/g%3E%3Cg transform='rotate(180 50 50)'%3E%3Cg fill='%23fffdf4'%3E%3Ccircle cx='18' cy='12' r='4'/%3E%3Ccircle cx='24' cy='17' r='4'/%3E%3Ccircle cx='22' cy='24' r='4'/%3E%3Ccircle cx='14' cy='24' r='4'/%3E%3Ccircle cx='12' cy='17' r='4'/%3E%3C/g%3E%3Ccircle cx='18' cy='18.500' r='3' fill='%23e0a92e'/%3E%3Cpath d='M29 11c6 4 10 9 12 16' stroke='%23566f49' stroke-width='1.200' fill='none' stroke-linecap='round'/%3E%3Cg fill='%23566f49'%3E%3Cellipse cx='36' cy='11.500' rx='3.600' ry='1.500' transform='rotate(-25 36 11.500)'/%3E%3Cellipse cx='41' cy='17' rx='3.600' ry='1.500' transform='rotate(-25 41 17)'/%3E%3Cellipse cx='30' cy='18' rx='3.600' ry='1.500' transform='rotate(35 30 18)'/%3E%3Cellipse cx='35' cy='24' rx='3.600' ry='1.500' transform='rotate(35 35 24)'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");background-size:cover}.aim-kraft b{inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center}.aim-kraft .n{font:700 1.3em/1 Caveat,cursive}
@keyframes pose{from{transform:translateY(-22px) rotate(calc(var(--r,0deg) - 7deg)) scale(1.05)}}
/* catalogue */
.porte-h{padding-block:30px 44px;margin:0}
.cat-porte{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:36px;align-items:center}
.cat-porte img{height:auto;border-radius:8px;box-shadow:.4em .7em 1.4em rgba(28,43,42,.3)}
.cat-porte .intro{color:var(--encre)}
.reglages{margin-top:0;border-top:0}
#jeu{background:var(--porte);border-block:10px solid var(--encre)}
.frigo{background:none;border:0;padding:0}
.dos{background:var(--papier);box-shadow:1px 2px 3px rgba(0,0,0,.3),3px 6px 9px rgba(28,43,42,.22);display:flex;align-items:center;justify-content:center}
.dos::after{content:"m!";font:700 clamp(18px,2.6vw,28px) var(--main);color:var(--bouton)}
.carte.ok .m{box-shadow:0 0 0 3px var(--bouton),0 5px 10px rgba(0,0,0,.18)}
.carte:focus-visible{outline-color:var(--bouton)}
.score,#jeu .intro{color:var(--encre)}
.lot{position:relative;background:var(--papier);padding:34px 24px 24px;transform:rotate(1deg);box-shadow:3px 8px 16px rgba(28,43,42,.22);margin-top:14px}
.lien-rej{color:var(--encre)}
@media (max-width:1100px){.porte{--k:.8}}
@media (max-width:960px){.tete nav{order:3;padding-top:6px}}
@media (max-width:820px){
  .porte{--k:.62}.porte-g{grid-template-columns:minmax(0,1fr);padding-block:30px 44px;gap:28px}
  .aimants{min-height:calc(var(--t)*2.45)}
  .porte::after,.porte-h::after,main>.pg-une::after{display:none}
  .cat-porte{grid-template-columns:minmax(0,1fr)}
}
@media (hover:none){.indice{display:none}.aim{cursor:default}}
@media (prefers-reduced-motion:reduce){.aim{animation:none}}

.cat-porte h1{font-size:clamp(36px,4vw,58px)}
.pg-une .regle{max-width:340px}.pg-une .regle.fr{max-width:310px}
/* Mobile : les magnets passent juste sous le titre, le menu tient sans être coupé. */
@media (max-width:820px){
  .porte-g{row-gap:0}
  .porte-g>div:first-child{display:contents}
  .porte-g h1{order:1}
  .porte-g .aimants{order:2;margin:20px 0 6px;min-height:calc(var(--t)*2.2)}
  .porte-g>div:first-child>:not(h1){order:3}
  .tete nav{flex-wrap:wrap;overflow:visible;white-space:normal;gap:4px 14px;font-size:14px}
}
.forfait b{font:700 34px/1.1 var(--titre);margin-top:10px}
.pot{position:absolute!important;left:-9999px;width:1px;height:1px;opacity:0}.eagle-status:empty{display:none}.eagle-status{font-weight:500;margin-top:10px}
img{height:auto}
.pg-une .ph img{width:100%;height:100%;object-fit:cover}