:root{
  --jz-control-bg:rgba(13,18,31,.86);
  --jz-control-bg-hover:rgba(23,29,46,.94);
  --jz-control-border:rgba(255,255,255,.16);
  --jz-control-border-hover:rgba(255,209,102,.58);
  --jz-control-text:#f7f8fc;
  --jz-control-accent:#ffd166;
  --jz-control-muted:#9aa6bb;
}

[data-jz-game-back],
[data-jz-game-sound]{
  position:fixed!important;
  z-index:300!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  height:44px!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid var(--jz-control-border)!important;
  border-radius:14px!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.075),transparent 46%),
    var(--jz-control-bg)!important;
  color:var(--jz-control-text)!important;
  box-shadow:
    0 12px 30px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.1)!important;
  font:700 13px/1 "Segoe UI",system-ui,-apple-system,sans-serif!important;
  text-decoration:none!important;
  text-shadow:none!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  opacity:1!important;
  visibility:visible!important;
  backdrop-filter:blur(16px) saturate(1.25)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.25)!important;
  transition:transform .16s ease,border-color .16s ease,background-color .16s ease,box-shadow .16s ease!important;
  -webkit-tap-highlight-color:transparent;
}

[data-jz-game-back]{
  top:max(14px,env(safe-area-inset-top))!important;
  left:max(14px,env(safe-area-inset-left))!important;
  width:44px!important;
  min-width:44px!important;
}

[data-jz-game-sound]{
  top:max(14px,env(safe-area-inset-top))!important;
  left:auto!important;
  right:max(14px,env(safe-area-inset-right))!important;
  bottom:auto!important;
  width:44px!important;
  min-width:44px!important;
}

[data-jz-game-back] svg,
[data-jz-game-sound] svg{
  display:block!important;
  width:16px!important;
  height:16px!important;
  flex:0 0 auto!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

[data-jz-game-sound] svg{
  width:17px!important;
  height:17px!important;
  color:var(--jz-control-accent)!important;
}

[data-jz-game-sound][data-jz-sound-state="muted"] svg{
  color:var(--jz-control-muted)!important;
}

[data-jz-game-back]:hover,
[data-jz-game-sound]:hover{
  transform:translateY(-1px)!important;
  border-color:var(--jz-control-border-hover)!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.1),transparent 48%),
    var(--jz-control-bg-hover)!important;
  box-shadow:
    0 14px 34px rgba(0,0,0,.4),
    0 0 22px rgba(255,209,102,.1),
    inset 0 1px 0 rgba(255,255,255,.13)!important;
}

[data-jz-game-back]:active,
[data-jz-game-sound]:active{
  transform:translateY(1px) scale(.97)!important;
}

[data-jz-game-back]:focus-visible,
[data-jz-game-sound]:focus-visible{
  outline:2px solid var(--jz-control-accent)!important;
  outline-offset:3px!important;
}

@media (max-width:520px){
  [data-jz-game-back],
  [data-jz-game-sound]{
    height:42px!important;
    border-radius:13px!important;
  }
  [data-jz-game-back]{
    top:max(10px,env(safe-area-inset-top))!important;
    left:max(10px,env(safe-area-inset-left))!important;
    width:42px!important;
    min-width:42px!important;
  }
  [data-jz-game-sound]{
    top:max(10px,env(safe-area-inset-top))!important;
    left:auto!important;
    right:max(10px,env(safe-area-inset-right))!important;
    bottom:auto!important;
    width:42px!important;
    min-width:42px!important;
  }
}

@media (prefers-reduced-motion:reduce){
  [data-jz-game-back],
  [data-jz-game-sound]{transition:none!important}
}
