/* BRUTAL.IO REBORN V0.2.20 – Touch-Bedienung, nur mobile Geräte */
#dw-touch-controls { display: none !important; }
body.dw-touch-enabled.dw-touch-playing #dw-touch-controls {
  display: block !important;
  position: fixed;
  inset: 0;
  z-index: 1500;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}
body.dw-touch-enabled.dw-touch-playing { overscroll-behavior: none; }
body.dw-touch-enabled.dw-touch-playing #canvas { touch-action: none; }
#dw-touch-controls .dw-stick {
  position: absolute;
  bottom: calc(17px + env(safe-area-inset-bottom, 0px));
  left: calc(17px + env(safe-area-inset-left, 0px));
  width: clamp(104px, 18vmin, 148px);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 2px solid rgba(66, 236, 255, .84);
  background: radial-gradient(circle, rgba(6,65,83,.30), rgba(1,24,40,.65));
  box-shadow: inset 0 0 27px #00d5ef33, 0 0 15px #00d5ef33;
  touch-action: none;
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
}
#dw-touch-controls .dw-stick::after {
  content: ''; position: absolute; top:50%; left:50%;
  width: 18%; height: 18%; transform:translate(-50%,-50%);
  border-radius:50%; background:#5cedfccc; box-shadow:0 0 10px #28e4ff88;
  pointer-events:none;
}
#dw-touch-controls .dw-knob {
  position: absolute; top: 50%; left: 50%;
  width: 43%; height: 43%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle at 35% 28%, #9bf4ffdf, #119eb4de 76%);
  border: 2px solid #c9fbff;
  box-shadow:0 0 12px #00c9ffb7, inset 0 2px 6px #eaffff80;
  pointer-events:none;
}
#dw-touch-controls .dw-action {
  position: absolute;
  right: calc(23px + env(safe-area-inset-right, 0px));
  bottom: calc(24px + env(safe-area-inset-bottom, 0px));
  width: clamp(85px, 15vmin, 114px);
  aspect-ratio:1;
  border-radius:50%;
  border: 2px solid #f5d89c;
  color:#fff7db;
  background: radial-gradient(circle at 36% 30%, #df6731, #a82a20 80%);
  box-shadow: 0 0 22px #ff725c77, inset 0 1px 12px #ffe1a155;
  font: 800 clamp(11px, 2.4vmin, 14px)/1.2 system-ui,sans-serif;
  letter-spacing: .025em;
  text-align:center;
  touch-action: none;
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
  user-select:none;
  -webkit-user-select:none;
  padding:0;
  margin:0;
}
#dw-touch-controls .dw-action[aria-pressed="true"] {
  background:radial-gradient(circle at 40% 30%, #ffbe7f, #de4426 75%);
  box-shadow:0 0 28px #ff6935, inset 0 0 10px #ffe4b7;
  transform: scale(.94);
}
#dw-touch-controls .dw-action-label { display:block; pointer-events:none; }
#dw-touch-controls .dw-help {
  position:absolute; left:50%; transform:translateX(-50%);
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  color: #c1f5ff; font: 600 11px/1.3 system-ui,sans-serif;
  text-shadow:0 1px 5px #000; opacity:.7;
  white-space:nowrap;
  pointer-events:none;
}
@media (orientation: portrait) {
  #dw-touch-controls .dw-help { bottom:calc(140px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-height: 370px) {
  #dw-touch-controls .dw-stick { width: 92px; bottom: 8px; }
  #dw-touch-controls .dw-action { width: 76px; bottom: 12px; }
  #dw-touch-controls .dw-help { display:none; }
}
