/* Habillage de Noël : actif seulement avec <html class="xmas"> (posé par noel.js du 28 novembre au 6 janvier) */
html.xmas{--xred:#b5223a;--xgrn:#14533c;--xsnow:#f4f8ff}
/* guirlande lumineuse (fixée en haut de la page) */
.xg{position:fixed;left:0;right:0;top:0;height:22px;z-index:30;pointer-events:none;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='12' viewBox='0 0 120 12'%3E%3Cpath d='M0 1Q30 11 60 1T120 1' fill='none' stroke='%23123a2b' stroke-width='1.6'/%3E%3C/svg%3E") 0 0/120px 12px repeat-x}
.xg i{position:absolute;top:2px;width:8px;height:11px;border-radius:50% 50% 55% 55%;background:var(--c);box-shadow:0 0 9px 2px var(--c);animation:xtw 2.2s infinite;animation-delay:var(--d)}
.xg i::before{content:"";position:absolute;left:2px;top:-3px;width:4px;height:4px;background:#2a3a33;border-radius:1px}
@keyframes xtw{0%,100%{opacity:1}50%{opacity:.4}}
/* bonnet de Père Noël sur le logo (site et page de connexion de l'app) */
html.xmas .top .logo,html.xmas .brand{position:relative}
html.xmas .top .logo::after{content:"";position:absolute;left:-6px;top:-14px;width:34px;height:28px;transform:rotate(-14deg);background:var(--hat) center/contain no-repeat;pointer-events:none}
html.xmas .brand::after{content:"";position:absolute;left:calc(50% - 112px);top:-6px;width:64px;height:52px;transform:rotate(-14deg);background:var(--hat) center/contain no-repeat;pointer-events:none}
html.xmas{--hat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 28'%3E%3Cpath d='M3 24C4 12 12 3 24 3c3 0 5 1 6 3-5 0-8 3-9 7l11 11z' fill='%23c4172c'/%3E%3Cpath d='M2 22h30v5H2z' fill='%23f4f8ff'/%3E%3Ccircle cx='28' cy='5' r='4' fill='%23f4f8ff'/%3E%3C/svg%3E")}
/* bandeau de fêtes */
.xb{display:flex;align-items:center;gap:10px;background:linear-gradient(90deg,#8e1329,#b5223a 50%,#8e1329);color:#fff;padding:7px 14px;font:600 14px/1.3 system-ui,"Segoe UI",sans-serif;border-bottom:2px solid #e8b94f}
.xb span{flex:1;text-align:center}.xb button{background:#ffffff22;border:1px solid #ffffff55;color:#fff;border-radius:8px;padding:2px 9px;font:inherit;cursor:pointer}
/* neige */
.xs{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:29}
/* bouton pour couper le décor */
.xoff{position:fixed;left:10px;bottom:10px;z-index:31;width:34px;height:34px;border-radius:50%;border:1px solid #ffffff40;background:#0a2219d9;color:#cfe8ff;font-size:16px;cursor:pointer;display:grid;place-items:center;opacity:.75}
.xoff:hover,.xoff:focus-visible{opacity:1}
html.xmas:has(#app.ing) .xoff,html.xmas:has(#app.ing) .xg{display:none}
/* ---------- site ---------- */
html.xmas .gc{position:relative}
html.xmas .gc::before{content:"";position:absolute;left:12%;right:12%;top:-6px;height:12px;border-radius:12px 12px 6px 6px;z-index:3;pointer-events:none;
 background:radial-gradient(circle at 18% 70%,var(--xsnow) 0 6px,transparent 7px),radial-gradient(circle at 52% 58%,var(--xsnow) 0 8px,transparent 9px),radial-gradient(circle at 86% 70%,var(--xsnow) 0 6px,transparent 7px),linear-gradient(var(--xsnow),var(--xsnow));box-shadow:0 2px 3px #0005}
html.xmas .ph{box-shadow:inset 0 -70px 90px -70px #b5223a55}
html.xmas .ph h1::after{content:" 🎄"}
html.xmas footer{border-top:4px solid transparent;border-image:repeating-linear-gradient(45deg,#b5223a 0 14px,#f4efe0 14px 28px,#14533c 28px 42px) 4}
html.xmas .btn.gold{box-shadow:0 0 0 2px #b5223a55,0 6px 18px #b5223a40}
/* ---------- application ---------- */
html.xmas .felt,html.xmas .brov{position:relative}
html.xmas .felt::after,html.xmas .brov::after{content:"";position:absolute;left:14%;right:14%;top:-2px;height:12px;pointer-events:none;z-index:4;
 background:radial-gradient(circle,#ff4d6d 0 4px,transparent 5px) 0 0/84px 12px repeat-x,radial-gradient(circle,#ffd166 0 4px,transparent 5px) 28px 0/84px 12px repeat-x,radial-gradient(circle,#6ee7a0 0 4px,transparent 5px) 56px 0/84px 12px repeat-x;
 filter:drop-shadow(0 0 5px #ffffffaa);animation:xtw 2.4s infinite}
html.xmas #lobby>.xb{border-radius:12px;margin:0 0 10px;border:1px solid #e8b94f}
html.xmas .tc,html.xmas .rt{border-color:#b5223a66}
@media(prefers-reduced-motion:reduce){.xg i,html.xmas .felt::after,html.xmas .brov::after{animation:none}.xs{display:none}}

/* ===== décor supplémentaire ===== */
/* dos de cartes de Noël (le fichier cartes/fr/dos-noel.webp est relatif à cette feuille de style) */
html.xmas .bks i,html.xmas .bks.fr i,html.xmas .brbk i,html.xmas .rfan i,html.xmas .rc.back{background:url("cartes/fr/dos-noel.webp") center/100% 100% no-repeat,#9c1730;border:0}
html.xmas .sc .dk,html.xmas .sc .dl,html.xmas .sc .fan i{background:url("cartes/fr/dos-noel.webp") center/100% 100%}
/* boules de Noël posées dans la guirlande */
.xg b{position:absolute;top:2px;width:0;height:0;animation:xsw 3.4s ease-in-out infinite;animation-delay:var(--d)}
.xg b::after{content:"";position:absolute;left:-7px;top:0;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fffa 0 12%,transparent 14%),radial-gradient(circle at 50% 55%,var(--c),color-mix(in srgb,var(--c) 55%,#000));box-shadow:0 1px 3px #0008,inset -1px -2px 3px #0004}
.xg b::before{content:"";position:absolute;left:-3px;top:-3px;width:6px;height:4px;background:#e3b95c;border-radius:2px 2px 0 0;z-index:1}
@keyframes xsw{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
/* bonnets sur les avatars des joueurs */
html.xmas .seat .avw{position:relative}
html.xmas .seat .avw::after{content:"";position:absolute;right:-9px;top:-14px;width:30px;height:25px;transform:rotate(16deg);background:var(--hat) center/contain no-repeat;pointer-events:none;z-index:5}
/* sapin et cadeaux au coin de la table (PC) */
html.xmas .felt::before{content:"";position:absolute;left:8px;bottom:6px;width:112px;height:76px;pointer-events:none;z-index:2;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 64'%3E%3Crect x='21' y='52' width='6' height='10' fill='%236b3f1d'/%3E%3Cpath d='M24 3 38 22H31L42 38H33L46 54H2L15 38H6L17 22H10z' fill='%23177a52'/%3E%3Cpath d='M24 3 30 12 24 10 18 12zM17 22 24 25 31 22 29 27 24 25 19 27zM15 38 24 41 33 38 31 43 24 41 17 43z' fill='%23f4f8ff'/%3E%3Ccircle cx='24' cy='30' r='2.4' fill='%23ff4d6d'/%3E%3Ccircle cx='16' cy='47' r='2.4' fill='%23ffd166'/%3E%3Ccircle cx='32' cy='46' r='2.4' fill='%237fd0ff'/%3E%3Cpath d='M24 0l1.6 3.4L29 4l-3 2.4.9 3.6L24 8l-2.9 2 .9-3.6L19 4l3.4-.6z' fill='%23ffd166'/%3E%3C/svg%3E") 0 100%/46px 62px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='3' y='15' width='34' height='23' rx='2' fill='%23b5223a'/%3E%3Crect x='1' y='10' width='38' height='8' rx='2' fill='%23d6304c'/%3E%3Crect x='17' y='10' width='6' height='28' fill='%23f6d98a'/%3E%3Cpath d='M20 10C12 0 4 4 9 9c3 3 8 1 11 1zM20 10c8-10 16-6 11-1-3 3-8 1-11 1z' fill='%23f6d98a'/%3E%3C/svg%3E") 38px 100%/30px 30px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='3' y='15' width='34' height='23' rx='2' fill='%23177a52'/%3E%3Crect x='1' y='10' width='38' height='8' rx='2' fill='%231f9c68'/%3E%3Crect x='17' y='10' width='6' height='28' fill='%23f4f8ff'/%3E%3Cpath d='M20 10C12 0 4 4 9 9c3 3 8 1 11 1zM20 10c8-10 16-6 11-1-3 3-8 1-11 1z' fill='%23f4f8ff'/%3E%3C/svg%3E") 66px 100%/24px 24px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='3' y='15' width='34' height='23' rx='2' fill='%23b5223a'/%3E%3Crect x='1' y='10' width='38' height='8' rx='2' fill='%23d6304c'/%3E%3Crect x='17' y='10' width='6' height='28' fill='%23f6d98a'/%3E%3Cpath d='M20 10C12 0 4 4 9 9c3 3 8 1 11 1zM20 10c8-10 16-6 11-1-3 3-8 1-11 1z' fill='%23f6d98a'/%3E%3C/svg%3E") 86px 100%/20px 20px no-repeat;filter:drop-shadow(0 3px 3px #0008)}
@media(max-width:800px){html.xmas .felt::before{display:none}}
/* étoiles qui scintillent près des titres du site */
html.xmas .gsh::before{content:"✦";color:#e8b94f;margin-right:.45em;font-size:.7em;vertical-align:.12em;animation:xtw 2.6s infinite}
html.xmas .gsh::after{content:" ❄";color:#9fd6ff;font-size:.7em}
/* pied de page : bord de neige et sapins */
html.xmas footer{position:relative;margin-top:46px}
html.xmas footer::before{content:"";position:absolute;left:0;right:0;top:-24px;height:24px;pointer-events:none;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='24' viewBox='0 0 90 24'%3E%3Cpath d='M0 24V12Q11 2 22 12T45 12 67 12 90 12V24z' fill='%23f4f8ff'/%3E%3C/svg%3E") 0 100%/90px 24px repeat-x}
html.xmas footer::after{content:"";position:absolute;right:4%;top:-86px;width:150px;height:72px;pointer-events:none;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 64'%3E%3Crect x='21' y='52' width='6' height='10' fill='%236b3f1d'/%3E%3Cpath d='M24 3 38 22H31L42 38H33L46 54H2L15 38H6L17 22H10z' fill='%23177a52'/%3E%3Cpath d='M24 3 30 12 24 10 18 12zM17 22 24 25 31 22 29 27 24 25 19 27zM15 38 24 41 33 38 31 43 24 41 17 43z' fill='%23f4f8ff'/%3E%3Ccircle cx='24' cy='30' r='2.4' fill='%23ff4d6d'/%3E%3Ccircle cx='16' cy='47' r='2.4' fill='%23ffd166'/%3E%3Ccircle cx='32' cy='46' r='2.4' fill='%237fd0ff'/%3E%3Cpath d='M24 0l1.6 3.4L29 4l-3 2.4.9 3.6L24 8l-2.9 2 .9-3.6L19 4l3.4-.6z' fill='%23ffd166'/%3E%3C/svg%3E") 0 100%/44px 60px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 64'%3E%3Crect x='21' y='52' width='6' height='10' fill='%236b3f1d'/%3E%3Cpath d='M24 3 38 22H31L42 38H33L46 54H2L15 38H6L17 22H10z' fill='%23177a52'/%3E%3Cpath d='M24 3 30 12 24 10 18 12zM17 22 24 25 31 22 29 27 24 25 19 27zM15 38 24 41 33 38 31 43 24 41 17 43z' fill='%23f4f8ff'/%3E%3Ccircle cx='24' cy='30' r='2.4' fill='%23ff4d6d'/%3E%3Ccircle cx='16' cy='47' r='2.4' fill='%23ffd166'/%3E%3Ccircle cx='32' cy='46' r='2.4' fill='%237fd0ff'/%3E%3Cpath d='M24 0l1.6 3.4L29 4l-3 2.4.9 3.6L24 8l-2.9 2 .9-3.6L19 4l3.4-.6z' fill='%23ffd166'/%3E%3C/svg%3E") 38px 100%/58px 72px no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect x='3' y='15' width='34' height='23' rx='2' fill='%23b5223a'/%3E%3Crect x='1' y='10' width='38' height='8' rx='2' fill='%23d6304c'/%3E%3Crect x='17' y='10' width='6' height='28' fill='%23f6d98a'/%3E%3Cpath d='M20 10C12 0 4 4 9 9c3 3 8 1 11 1zM20 10c8-10 16-6 11-1-3 3-8 1-11 1z' fill='%23f6d98a'/%3E%3C/svg%3E") 100px 100%/30px 30px no-repeat;filter:drop-shadow(0 3px 3px #0008)}
@media(max-width:700px){html.xmas footer::after{display:none}}
/* bandeau de la page d'appel à l'action */
html.xmas .cta-band{border-color:#b5223a88;background-image:linear-gradient(90deg,#b5223a22,transparent 40%,transparent 60%,#14533c44)}
/* cartes du salon (application) : neige sur le dessus */
html.xmas .tc{position:relative}
html.xmas .tc::before{content:"";position:absolute;left:10%;right:10%;top:-4px;height:8px;border-radius:8px;background:var(--xsnow);opacity:.92;pointer-events:none;box-shadow:0 2px 2px #0004}
@media(prefers-reduced-motion:reduce){.xg b,html.xmas .gsh::before{animation:none}}