/* =====================================================================
   Adminitek — thème complet « Nocturne violet »
   Fond indigo très sombre, grand bandeau en pixels assombri, barre de navigation ardoise
   aux liens violets, boîtes ardoise à bandeau noir, champs blancs, boutons violets, pied de page ardoise.
   Chargé après app.css, seulement quand ce thème est choisi (Paramètres → Fond du site).
   ===================================================================== */
:root{
  --neon:#a95fd6;--neon-hi:#bf7ee6;--neon-d:#8c45bb;--neon-deep:#3a2552;--neon-soft:#d9b8f2;--neon-ink:#fff;--neon-rgb:169,95,214;
  --bg:#2b2a3e;--bg-rgb:43,42,62;
  --panel:#3d3b55;--panel2:#26253a;--field:#fff;--line:#4b4966;--line2:#5a5876;
  --text:#f1f0f7;--muted:#b9b6cc;--cream:#ffffff;
  --danger:#ff6b81;--warn:#ffb86b;
  --nc-band:#1d1c2b;--nc-card:#26253a;--nc-nav:#47465e;--nc-foot:#4a4862;--nc-link:#b88cf2;--nc-pill:#dcdbe4;
  --title:"Nunito","Quicksand",system-ui,sans-serif;
  --body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r:14px;--r-s:10px;
}
body{font-weight:500}
::selection{background:rgba(169,95,214,.55);color:#fff}
a{color:var(--nc-link)}
a:hover{color:#d4b2ff}
h1,h2,h3{font-family:var(--title);font-weight:800;letter-spacing:0}
h1{color:#fff}
h2{color:#fff}
h3{color:var(--nc-link)}
.muted,.meta,.hint{color:var(--muted)}

/* ---------------- En-tête : grand bandeau en pixels assombri + barre ardoise */
.topbar{position:relative;background:none;border-bottom:0;backdrop-filter:none;-webkit-backdrop-filter:none}
.topbar::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(29,27,46,.42),rgba(29,27,46,.62)),url('themes/nocturne-banner.png') 0 50%/auto 100% repeat-x,#2c3a30;
  image-rendering:pixelated}
.topbar-in{min-height:120px;padding:14px 0}
.topbar-in,.tabs-in,.wrap{width:min(100% - 28px,1200px)}
.brand span{color:#fff;font:900 34px/1 var(--title);letter-spacing:.02em;
  background:linear-gradient(180deg,#f3d9ff 0%,#c48cf0 45%,#8a3fc2 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 0 #3a1858) drop-shadow(2px 0 0 #3a1858) drop-shadow(-2px 0 0 #3a1858) drop-shadow(0 -2px 0 #3a1858) drop-shadow(0 4px 6px rgba(0,0,0,.5))}
.brand img{filter:drop-shadow(0 3px 6px rgba(0,0,0,.55))}
.tool,.me-chip{background:#2d2b42;border:0;border-radius:14px;color:#e9e6f6;box-shadow:0 3px 10px rgba(0,0,0,.28)}
.tool{width:44px;height:44px}
.tool:hover,.tool:focus-visible,.tool[aria-expanded="true"],.me-chip:hover{background:#38364f;color:var(--nc-link);border:0}
.me-name{color:#fff}
.me-name small{color:var(--nc-link)}
.home-btn{background:var(--neon);border:0;border-radius:12px;color:#fff;box-shadow:0 3px 10px rgba(0,0,0,.3)}
.home-btn:hover,.home-btn.on{background:var(--neon-hi);color:#fff;border:0}
.tool.tool-logout{background:#2d2b42;color:#e9e6f6;border:0}
.tool.tool-logout:hover{background:#4a2a3a;color:#ff9aa9}

.tabs{background:var(--nc-nav);border-top:0;border-bottom:0;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.tabs-in{gap:6px;justify-content:center}
.tabs a,.tabs .tab-off{position:relative;padding:20px 14px 18px;color:var(--nc-link);font:700 16px/1 var(--body);letter-spacing:0;border:0;background:none;text-shadow:none}
.tabs a:hover{color:#dcc2ff;background:none}
.tabs a.on{color:#d28cf5;background:none}
.tabs a.on::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:#c06ff0}
.tabs .tab-off{opacity:.55}
.tabs .tab-off small{border-color:rgba(184,140,242,.5);color:var(--nc-link)}
.badge{border:2px solid var(--nc-nav)}

/* ---------------- Boîtes : ardoise, coins ronds, bandeau noir */
.card,.md{background:var(--panel);border:0;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,.22)}
.card.glow{box-shadow:0 8px 24px rgba(0,0,0,.22)}
.card>h2:first-child,.card>.row:first-child,.card>.gift-head:first-child{margin:-16px -16px 6px;padding:12px 18px;background:var(--nc-band);border-radius:16px 16px 0 0}
.card>h2:first-child,.card>.row:first-child>h2,.card>.row:first-child h2,.card>.gift-head:first-child h2{color:#fff;font:800 19px/1.2 var(--title);text-transform:uppercase;letter-spacing:.03em}
.card>h2:first-child{text-align:center}
.card>.row:first-child .meta,.card>.gift-head:first-child .meta{color:var(--muted)}
.tile{background:var(--nc-card);border:0;border-radius:14px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.tile:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.32);border:0}
.post,.friend,.member,.badge-item,.ol-card,.hot-room{background:var(--nc-card);border:0;border-radius:14px}
.post:hover,.member:hover,.friend:hover,.ol-card:hover{box-shadow:0 0 0 2px rgba(169,95,214,.55)}
.empty{color:var(--muted)}
.chip{background:#2d2b42;border-color:transparent;color:#e9e6f6}
.flash{border-radius:12px}
.push-banner{background:var(--panel);border:0;border-radius:14px;color:var(--text);box-shadow:0 6px 18px rgba(0,0,0,.2)}
.push-banner b{color:var(--nc-link)}
.notice{background:#3a2f55;color:#efe4ff;border-top:0}

/* ---------------- Boutons : violets et arrondis */
button,.btn{border:0;border-radius:10px;background:#2d2b42;color:#fff;font:700 14px/1 var(--body);box-shadow:0 3px 10px rgba(0,0,0,.2)}
button:hover,.btn:hover{background:#38364f;color:#fff}
button[type=submit]:not(.ghost):not(.danger):not(.warn):not(.small):not(.mini):not(.swatch):not(.sw),.btn.primary{background:var(--neon);color:#fff}
button[type=submit]:not(.ghost):not(.danger):not(.warn):not(.small):not(.mini):not(.swatch):not(.sw):hover,.btn.primary:hover{background:var(--neon-hi);color:#fff}
.btn.ghost,button.ghost{background:#2d2b42;color:#fff;border:0}
.btn.ghost:hover,button.ghost:hover{background:#38364f;color:var(--nc-link)}
.btn.danger,button.danger{background:#4a2a3a;color:#ffb3c0}
.btn.warn,button.warn{background:#4a3a24;color:#ffd39a}
input[type=file]::file-selector-button{background:var(--neon);color:#fff;border:0;border-radius:8px}
.lb-kinds a{background:#2d2b42;border:0;color:#fff;border-radius:10px;font-weight:700}
.lb-kinds a.on{background:var(--neon);color:#fff}

/* ---------------- Champs : blancs, texte foncé */
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),textarea,select{background:#fff;color:#2b2a3e;border:2px solid transparent;border-radius:10px;font:600 14px/1.35 var(--body)}
input::placeholder,textarea::placeholder{color:#7d7a92}
input:focus,textarea:focus,select:focus{border-color:var(--neon);box-shadow:0 0 0 3px rgba(169,95,214,.3);outline:0}
select option{background:#fff;color:#2b2a3e}
label{color:#e9e6f6}

/* ---------------- Pied de page : bande ardoise pleine largeur */
.site-foot{width:100%;max-width:none;margin-top:40px;padding:26px max(14px,calc((100% - 1200px)/2));background:var(--nc-foot);border:0;border-radius:0;color:#e9e6f6;font-size:14px;line-height:1.7}
.site-foot b{color:#fff}
.site-foot a,.foot-install{color:#fff;font-weight:700}
.site-foot a:hover,.foot-install:hover{color:var(--nc-link)}
body{padding-bottom:0}

/* ---------------- Gros bouton « Entrer dans l'hôtel » : bandeau en pixels, bouton violet */
.enter-wrap .enter-hotel,.enter-hotel{border:0;border-radius:18px;color:#fff;
  background:linear-gradient(90deg,rgba(29,27,46,.92) 0%,rgba(29,27,46,.55) 55%,rgba(29,27,46,.25) 100%),url('themes/nocturne-banner.png') right center/auto 100% repeat-x,#2c3a30;
  image-rendering:pixelated;box-shadow:0 10px 26px rgba(0,0,0,.3);animation:none}
.enter-wrap .eh-bg,.enter-wrap .eh-city,.enter-hotel .eh-bg,.enter-hotel .eh-city,.eh-aura{display:none}
.eh-glow{background:radial-gradient(closest-side,rgba(169,95,214,.45),transparent);opacity:.6}
.eh-tx small{color:#e9e6f6;opacity:1}
.eh-tx b{display:inline-block;justify-self:start;padding:13px 24px;border-radius:12px;background:var(--neon);color:#fff;font:900 clamp(20px,3vw,30px)/1 var(--title);text-transform:uppercase;letter-spacing:.02em;box-shadow:0 6px 18px rgba(169,95,214,.45);image-rendering:auto;transition:transform .15s,background .15s}
.enter-hotel:hover .eh-tx b{background:var(--neon-hi);transform:translateY(-2px)}
.eh-go{background:var(--neon);border:0;color:#fff}
.eh-live{background:#2d2b42;color:#fff;border:0}
.eh-live b,.eh-live strong{color:var(--nc-link)}
a.btn[href^="jeu.php"]{background:var(--neon);color:#fff;text-transform:uppercase;font-weight:900}
a.btn[href^="jeu.php"]:hover{background:var(--neon-hi);color:#fff}
.join-btn{background:#2d2b42;color:#fff;border:0;border-radius:10px;font:700 15px/1.1 var(--body)}
.join-btn:hover{background:#38364f;color:#fff}

/* ---------------- Page de connexion */
.auth-tabs{background:var(--panel);border:0;border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.auth-tabs button{background:transparent;color:var(--muted);box-shadow:none;border:0}
.auth-tabs button.on{background:var(--neon);color:#fff}
.ui-auto,.login-text{color:var(--muted)}
.ui-auto a,.login-text a{color:var(--nc-link)}
.back-link{background:#2d2b42;border:0;color:#fff;border-radius:10px}

/* Aperçus des fonds (Paramètres) */
.swatch{border:2px solid #1d1c2b;padding:0}
.swatch.on{border-color:#c06ff0;box-shadow:0 0 0 2px #1d1c2b}
.swatch.on::after{background:#c06ff0;color:#fff}

/* ---------------- Version Smartphone */
.m-top{background:linear-gradient(180deg,rgba(29,27,46,.55),rgba(29,27,46,.8)),url('themes/nocturne-banner.png') 0 50%/auto 100% repeat-x,#2c3a30;image-rendering:pixelated;border-bottom:0}
.m-brand span{color:#fff;font-family:var(--title);font-weight:900}
.m-tabs{background:var(--nc-nav);border-top:0}
.m-tabs a{color:var(--nc-link)}
.m-tabs a.on{color:#fff}

/* ---------------- Détails : bandeau plus sombre, récompense du jour */
.topbar::before{background:linear-gradient(180deg,rgba(26,24,42,.55),rgba(26,24,42,.72)),url('themes/nocturne-banner.png') 0 50%/auto 100% repeat-x,#2c3a30}
.gift-btn:not(:disabled){background:var(--neon);color:#fff}
.gift-btn:not(:disabled):hover{background:var(--neon-hi)}
.gift-days li{background:var(--nc-pill);color:#2b2a3e;border:0;border-radius:12px;font-weight:800}
.gift-days li.done{background:var(--neon);color:#fff}
.gift-days li.today{box-shadow:0 0 0 3px rgba(169,95,214,.6)}

/* ---------------- Page Équipe : cartes verticales comme des fiches */
.team-box>.row:first-child{justify-content:center;position:relative}
.team-box>.row:first-child h2{flex:0 1 auto;text-align:center}
.team-box>.row:first-child>.meta{position:absolute;right:18px;top:50%;transform:translateY(-50%)}
.team-chip{background:none!important;border:0!important;padding:0!important;color:#fff!important;font:800 21px/1.2 var(--title)!important;text-transform:uppercase;letter-spacing:.04em;box-shadow:none!important}
.team-box>.hint{text-align:center}
.team-box .members{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.team-box .member{flex-direction:column;justify-content:flex-start;gap:10px;padding:20px 12px 0;text-align:center;overflow:hidden;background:var(--nc-card)}
.team-box .member .av{border-radius:50%;box-shadow:0 0 0 3px #8f63d8;background:#3a3854}
.team-box .member-tx{justify-items:center;gap:2px}
.team-box .member-tx b{font-size:16px}
.team-box .member-bio{font-size:12.5px;color:var(--muted)}
.team-box .member::after{content:"";align-self:stretch;height:44px;margin:6px -12px 0;background:var(--nc-band)}

/* ---------------- Page de connexion : bandeau en pixels, boîte avec image */
body.login{padding-top:0}
body.login>main::before{content:"";position:absolute;left:0;right:0;top:0;height:150px;z-index:-1;
  background:linear-gradient(180deg,rgba(26,24,42,.5),rgba(26,24,42,.7)),url('themes/nocturne-banner.png') 0 50%/auto 100% repeat-x,#2c3a30;image-rendering:pixelated;
  box-shadow:0 60px 0 0 var(--nc-nav)}
body.login>main{padding-top:24px}
body.login .logo{width:auto;height:150px;max-width:min(100%,320px);object-fit:contain;margin-bottom:60px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.55))}
body.login #loginBox,body.login #regBox,body.login .join-box{overflow:hidden;background:#46445e}
body.login #loginBox>h2:first-child,body.login #regBox>h2:first-child{padding-top:104px;background:linear-gradient(180deg,transparent 0,transparent 88px,var(--nc-band) 88px),url('themes/nocturne-banner.png') 50% 0/auto 88px repeat-x,#2c3a30;image-rendering:pixelated;text-transform:none;font-size:21px}
body.login .site-foot{width:100vw;margin-left:calc(50% - 50vw);margin-bottom:0}
body.login{place-items:start center;padding-top:0}
.gift-days li.next{color:#2b2a3e}

/* ---------------- Bandeau du haut : image du header, assombrie (effet d'opacité) */
.topbar::before{background:linear-gradient(180deg,rgba(26,24,42,.5),rgba(26,24,42,.7)),url('themes/nocturne-header.jpg') center 42%/cover no-repeat,#2b2a3e;image-rendering:auto}
.topbar-in{min-height:140px}
.m-top{background:linear-gradient(180deg,rgba(26,24,42,.55),rgba(26,24,42,.78)),url('themes/nocturne-header.jpg') center 42%/cover no-repeat,#2b2a3e;image-rendering:auto}
body.login>main::before{background:linear-gradient(180deg,rgba(26,24,42,.5),rgba(26,24,42,.7)),url('themes/nocturne-header.jpg') center 42%/cover no-repeat,#2b2a3e;image-rendering:auto}

/* ---------------- Bouton « Entrer dans l'hôtel » : la ville en pixels, assombrie, qui défile doucement */
.enter-wrap .enter-hotel,.enter-hotel{
  background:
    linear-gradient(90deg,rgba(26,24,42,.94) 0%,rgba(26,24,42,.72) 38%,rgba(26,24,42,.28) 72%,rgba(26,24,42,.5) 100%),
    linear-gradient(180deg,rgba(26,24,42,.15),rgba(26,24,42,.55)),
    url('themes/nocturne-enter.jpg') 50% 22%/cover no-repeat,#2b2a3e;
  image-rendering:auto;box-shadow:0 12px 30px rgba(0,0,0,.35),inset 0 0 0 1px rgba(192,111,240,.25);
  animation:ncPan 38s ease-in-out infinite alternate;transition:box-shadow .25s}
@keyframes ncPan{0%{background-position:0 0,0 0,30% 18%}100%{background-position:0 0,0 0,70% 30%}}
.enter-wrap .enter-hotel:hover,.enter-hotel:hover{box-shadow:0 14px 34px rgba(0,0,0,.4),0 0 0 2px rgba(192,111,240,.6),0 0 28px rgba(169,95,214,.35);transform:none}
.enter-hotel::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.10) 50%,transparent 60%) -150% 0/250% 100% no-repeat;animation:ncShine 6s ease-in-out infinite}
@keyframes ncShine{0%,60%{background-position:-150% 0}100%{background-position:150% 0}}
.eh-tx b{box-shadow:0 6px 18px rgba(169,95,214,.5),inset 0 1px 0 rgba(255,255,255,.25)}
@media (prefers-reduced-motion: reduce){.enter-wrap .enter-hotel,.enter-hotel,.enter-hotel::after{animation:none}}

/* ---------------- Boîtes Connexion / Rejoindre l'hôtel : plus d'image au-dessus du titre */
body.login #loginBox>h2:first-child,body.login #regBox>h2:first-child{padding-top:12px;background:var(--nc-band);image-rendering:auto}

/* ---------------- Logo : un peu plus gros partout, il brille et scintille au passage de la souris */
.brand img{width:58px;height:58px}
.brand.logo-only img{height:68px;max-width:min(330px,46vw)}
.m-brand img{transform:scale(1.15);transform-origin:left center}
.m-brand.logo-only img{height:44px!important;transform:none}
body.login .logo{height:185px;max-width:min(100%,380px);margin-bottom:40px}
.brand,.m-brand{position:relative;isolation:isolate}
.brand img,.m-brand img,body.login .logo{transition:transform .35s cubic-bezier(.3,1.5,.5,1),filter .35s;will-change:transform,filter}
.brand:hover img,.brand:focus-visible img,.m-brand:active img,body.login .logo:hover{transform:scale(1.08) rotate(-2deg);animation:ncLogoGlow 1.6s ease-in-out infinite}
.m-brand:active img{transform:scale(1.2)}
body.login .logo:hover{transform:scale(1.05) rotate(-1.5deg)}
@keyframes ncLogoGlow{
  0%,100%{filter:drop-shadow(0 0 4px rgba(255,255,255,.55)) drop-shadow(0 0 14px rgba(192,111,240,.75)) brightness(1.08)}
  50%{filter:drop-shadow(0 0 8px rgba(255,255,255,.9)) drop-shadow(0 0 26px rgba(192,111,240,1)) brightness(1.22) saturate(1.15)}}
/* étincelles autour du logo */
.brand::before,.brand::after,.m-brand::before{content:"";position:absolute;pointer-events:none;z-index:2;width:14px;height:14px;opacity:0;
  background:radial-gradient(circle,#fff 0 18%,transparent 22%),conic-gradient(from 0deg,transparent 0 40deg,#fff 45deg,transparent 50deg 130deg,#fff 135deg,transparent 140deg 220deg,#fff 225deg,transparent 230deg 310deg,#fff 315deg,transparent 320deg);
  filter:drop-shadow(0 0 4px #e3b8ff)}
.brand::before{left:2px;top:4px}
.brand::after{left:46px;top:auto;bottom:2px;width:10px;height:10px}
.m-brand::before{left:26px;top:-2px;width:10px;height:10px}
.brand:hover::before,.brand:focus-visible::before{animation:ncSpark 1.1s ease-in-out infinite}
.brand:hover::after,.brand:focus-visible::after{animation:ncSpark 1.1s ease-in-out .55s infinite}
.m-brand:active::before{animation:ncSpark .9s ease-in-out infinite}
@keyframes ncSpark{0%{opacity:0;transform:scale(.2) rotate(0)}40%{opacity:1;transform:scale(1.2) rotate(45deg)}100%{opacity:0;transform:scale(.3) rotate(90deg)}}
/* page de connexion : petites étincelles autour du grand logo (posées sur la boîte principale) */
body.login>main::after{content:"";position:absolute;left:50%;top:40px;width:240px;height:150px;margin-left:-120px;pointer-events:none;opacity:0;transition:opacity .3s;
  background:
    radial-gradient(circle,#fff 0 2px,transparent 3px) 12% 20%/24px 24px no-repeat,
    radial-gradient(circle,#f0d4ff 0 2px,transparent 3px) 88% 30%/24px 24px no-repeat,
    radial-gradient(circle,#fff 0 1.5px,transparent 2.5px) 20% 85%/20px 20px no-repeat,
    radial-gradient(circle,#e3b8ff 0 2px,transparent 3px) 80% 80%/24px 24px no-repeat,
    radial-gradient(circle,#fff 0 1.5px,transparent 2.5px) 50% 4%/20px 20px no-repeat;
  filter:drop-shadow(0 0 4px #c06ff0)}
body.login>main:has(.logo:hover)::after{opacity:1;animation:ncTwinkle 1.2s ease-in-out infinite}
@keyframes ncTwinkle{0%,100%{opacity:.25;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
@media (prefers-reduced-motion: reduce){.brand:hover img,body.login .logo:hover{animation:none;filter:drop-shadow(0 0 14px rgba(192,111,240,.8))}.brand::before,.brand::after,.m-brand::before,body.login>main::after{animation:none!important}}

/* ---------------- Connexion / inscription : logo aussi large que la boîte */
body.login .logo{width:100%;height:auto;max-width:100%;max-height:230px;object-fit:contain;margin:6px auto 28px}

/* Bouton Jouer de l'en-tête */
.tools .tool-play{background:linear-gradient(135deg,#c08cf0,#9b5bd1 55%,#6a3496)!important;color:#fff!important}