/* ─────────────────────────────────────────────────────────────────
   GlobalSupportWave — 사이트 전반 응원 물결 백드롭
   ───────────────────────────────────────────────────────────────── */

.gw-layer {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;             /* hero 본문 (z-index 2) 보다 아래, 본문 background 위 */
  overflow: hidden;
}

/* ── chip track ──────────────────────────────────────────────── */
.gw-chips {
  position: absolute;
  inset: 0;
}
.gw-chip {
  position: absolute;
  left: -50vw;             /* 시작점 — viewport 왼쪽 바깥 */
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 6px 8px;
  border-radius: 999px;
  background: rgba(11, 31, 58, 0.7);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.78);
  font-family: var(--font-sans);
  font-weight: 500;
  letter-spacing: -0.005em;
  white-space: nowrap;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation-name: gw-flow;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  will-change: transform;
}
[data-dark="1"] .gw-chip {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
  color: rgba(241, 245, 249, 0.7);
}
.gw-chip-emoji {
  font-size: 1.05em;
  filter: saturate(0.8);
}
.gw-chip-text {
  font-style: italic;
  font-weight: 600;
}
.gw-chip-meta {
  font-family: var(--font-mono);
  font-size: 0.78em;
  font-weight: 600;
  opacity: 0.55;
  letter-spacing: 0.04em;
}

@keyframes gw-flow {
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(100vw + 50vw)); }
}

/* light-mode override — 흰 배경에서는 어두운 chip이 너무 진하게 보임 */
[data-dark="0"] .gw-chip,
:root:not([data-dark="1"]) .gw-chip {
  background: rgba(11, 31, 58, 0.06);
  border-color: rgba(11, 31, 58, 0.08);
  color: rgba(11, 31, 58, 0.55);
}

/* ── click burst 이모지 ─────────────────────────────────────── */
.gw-bursts {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.gw-burst {
  position: absolute;
  transform: translate(-50%, -50%);
  animation: gw-burst 1.2s cubic-bezier(.2, .7, .3, 1) forwards;
  filter: drop-shadow(0 4px 8px rgba(11, 31, 58, 0.3));
  pointer-events: none;
  user-select: none;
}
@keyframes gw-burst {
  0% {
    transform: translate(-50%, -50%) scale(0.4) rotate(0);
    opacity: 0;
  }
  20% {
    opacity: 1;
    transform: translate(calc(-50% + var(--dx) * 0.3), calc(-50% + var(--dy) * 0.3)) scale(1.2) rotate(calc(var(--rot) * 0.3));
  }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1) rotate(var(--rot));
  }
}

/* ── 모바일 ─────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .gw-chip {
    padding: 5px 11px 5px 7px;
    gap: 6px;
  }
  .gw-chip-meta { display: none; }
  .gw-chip-text { max-width: 240px; overflow: hidden; text-overflow: ellipsis; }
}

/* ── 인쇄 시 숨김 ───────────────────────────────────────────── */
@media print {
  .gw-layer { display: none !important; }
}
