.thunder-shooter-effect-2 {
  position: relative;
  flex: 1 1 220px;
  align-self: stretch;
  width: 100%;
  min-height: 220px;
  max-height: none;
  border: 1px solid rgba(57,53,82,.96);
  border-radius: 9px;
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(circle at 50% 104%, rgba(183,255,26,.12), transparent 36%),
    linear-gradient(180deg, #090a18 0%, #101026 52%, #070816 100%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.025), 0 14px 38px rgba(0,0,0,.18);
  cursor: none;
  touch-action: none;
  user-select: none;
}

.app-shell.thunder-resizing,
.app-shell.thunder-resizing * {
  cursor: ew-resize !important;
  user-select: none;
}

.thunder-shooter-effect-2 + .mini-map {
  margin-top: 0;
}

.thunder-shooter-effect-2::before,
.thunder-shooter-effect-2::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.thunder-shooter-effect-2::before {
  background:
    linear-gradient(90deg, rgba(52,235,255,.11), transparent 24%, transparent 76%, rgba(183,255,26,.1)),
    repeating-linear-gradient(180deg, transparent 0 5px, rgba(255,255,255,.028) 5px 6px);
  mix-blend-mode: screen;
}

.thunder-shooter-effect-2::after {
  border-radius: inherit;
  box-shadow: inset 0 0 22px rgba(44,232,255,.12), inset 0 0 34px rgba(183,255,26,.06);
}

.thunder-shooter-effect-2 canvas {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  cursor: none;
}

.thunder-shooter-effect-2.is-game-over,
.thunder-shooter-effect-2.is-game-over canvas {
  cursor: pointer;
}

.thunder-shooter-resize-handle {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
  width: 8px;
  cursor: ew-resize;
  background: linear-gradient(90deg, transparent, rgba(183,255,26,.16));
  opacity: 0;
  transition: opacity .12s linear;
}

.thunder-shooter-effect-2:hover .thunder-shooter-resize-handle,
.thunder-shooter-resize-handle.is-dragging {
  opacity: 1;
}

.thunder-rail-resize-handle {
  position: absolute;
  top: 0;
  right: -6px;
  bottom: 0;
  z-index: 40;
  width: 12px;
  cursor: ew-resize;
  touch-action: none;
  background: linear-gradient(90deg, transparent 0 34%, rgba(183,255,26,.22) 48%, transparent 66% 100%);
  opacity: 0;
  transition: opacity .12s linear;
}

.left-rail:hover .thunder-rail-resize-handle,
.thunder-rail-resize-handle:hover,
.thunder-rail-resize-handle.is-dragging {
  opacity: 1;
}

@media (max-height: 760px) {
  .thunder-shooter-effect-2 {
    min-height: 150px;
  }
}