html{scroll-behavior:auto}
body{margin:0;background:#0d1021;font-family:'IBM Plex Mono',monospace;color:#b8c0e0;overflow-x:clip}
a{color:#7ea1ff}
a:hover{color:#ffd23e}
::selection{background:#e0392e;color:#fff}
@keyframes gdblink{0%,49%{opacity:1}50%,100%{opacity:.15}}
@keyframes gdbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes gdflame{from{transform:scaleY(1)}to{transform:scaleY(.55)}}
@keyframes gdswingl{0%,100%{transform:rotate(0deg)}50%{transform:rotate(12deg)}}
@keyframes gdswingr{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-12deg)}}
@keyframes gdspin{to{transform:rotate(360deg)}}
/* ---------- Responsive HUD : sur écran étroit la barre défile horizontalement au lieu de déborder ---------- */
#gd-hud::-webkit-scrollbar{height:0;display:none}
@media (max-width:900px){
  #gd-hud{gap:9px!important;padding:0 9px!important;overflow-x:auto!important;overflow-y:hidden!important;justify-content:flex-start!important;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  #gd-hud>*{flex-shrink:0!important}
  #gd-hud>*[style*="flex:1"]{display:none!important}
}
@media (max-width:600px){
  #gd-hud{gap:7px!important;padding:0 7px!important}
  #gd-hud img{height:26px!important}
  #gd-hud button{padding:7px 7px!important}
  #gd-hud>div>span:first-child{display:none}
}
/* Le personnage/plateformes restent proportionnels : rien à changer, le moteur relit les positions au redimensionnement. On garantit juste l'absence de scroll horizontal parasite. */
@media (max-width:600px){
  section[data-level]{padding-left:16px!important;padding-right:16px!important}
}