/* ===== STUWE Game - styles partages (direction artistique du cahier des charges) ===== */
:root{
  --navy:#00005D; --bg:#02022E; --bg-deep:#0A0A1C; --card:#080840;
  --line:#15154A; --line-soft:#1C1C4A; --gold:#F8CB00;
  --text:#FFFFFF; --muted:#CFCFCF; --muted2:#8A8AB0; --muted3:#6A6A92;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;height:100%;}
body{
  background:var(--bg-deep); color:var(--text);
  font-family:'Inter',-apple-system,'Segoe UI',sans-serif;
  -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent;
}
button{font-family:inherit;cursor:pointer;}
input,textarea{font-family:inherit;}
a{color:inherit;text-decoration:none;}
.tabular{font-variant-numeric:tabular-nums;}
.gold{color:var(--gold);}

/* boutons */
.btn{appearance:none;border:none;border-radius:12px;font-weight:700;font-size:15px;padding:13px 18px;transition:transform .08s, background .15s;}
.btn:active{transform:scale(0.98);}
.btn-gold{background:var(--gold);color:#02022E;box-shadow:0 6px 20px rgba(248,203,0,.28);}
.btn-ghost{background:#12123A;color:#fff;border:1px solid #20204A;font-weight:600;}
.btn:disabled{opacity:.45;cursor:not-allowed;}

.card{background:var(--card);border:1px solid var(--line);border-radius:16px;}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.18em;color:var(--gold);}

input[type=range]{accent-color:var(--gold);}
input[type=text],input[type=password],input[type=number],textarea{
  background:#02022E;border:1px solid var(--line-soft);border-radius:11px;
  padding:12px 14px;color:#fff;font-size:15px;outline:none;width:100%;
}
input:focus,textarea:focus{border-color:var(--gold);}

::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:#20204A;border-radius:6px;}

@keyframes pulseT{0%,100%{transform:scale(1);}50%{transform:scale(1.045);}}
@keyframes livedot{0%,100%{opacity:1;}50%{opacity:.25;}}
@keyframes revealPop{0%{transform:scale(.7);opacity:0;}60%{transform:scale(1.05);}100%{transform:scale(1);opacity:1;}}
@keyframes float3d{0%,100%{transform:translate(-50%,-50%) rotate(-2deg);}50%{transform:translate(-50%,-54%) rotate(2deg);}}

.livedot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);animation:livedot 1.6s ease-in-out infinite;}

/* bandeau hors-ligne / reconnexion */
#offline{
  position:fixed;top:0;left:0;right:0;z-index:9999;
  background:#3A1320;color:#FFD9D9;font-size:13px;font-weight:600;
  text-align:center;padding:8px 12px;display:none;border-bottom:1px solid #5A2030;
}
body.is-offline #offline{display:block;}
@media (prefers-reduced-motion: reduce){*{animation:none !important;transition:none !important;}}