/* 이음보 띠 수호 줄: 어두운 구획 아래 끝에서 머리를 내미는 털 캐릭터들 */
.guardians-section {
  position: relative;
  overflow: hidden;
  background: #111;
  color: #f4f4f4;
}

.guardians-row {
  position: relative;
  width: 100%;
  height: clamp(220px, 30vw, 440px);
  overflow: hidden;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.guardians-row canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  cursor: pointer;
}

/* 대체 화면: 움직임 줄이기·WebGL 불가·저전력일 때 정적 그림 */
.guardians-fallback {
  position: absolute;
  inset: 0;
  display: none;
  align-items: flex-end;
  justify-content: center;
}

.guardians-row.is-static .guardians-fallback {
  display: flex;
}

.guardians-row.is-static canvas {
  display: none;
}

.guardians-fallback img {
  width: min(19vw, 230px);
  height: auto;
  margin: 0 -2.2vw;
  /* 아래 30% 가 구획 밖으로 잘리게 */
  transform: translateY(30%);
  user-select: none;
  pointer-events: none;
}

@media (max-width: 640px) {
  .guardians-fallback img {
    width: 28vw;
    margin: 0 -3vw;
  }
}