val tiltXAnim = remember { Animatable(0f) }
val tiltYAnim = remember { Animatable(0f) }
val coroutineScope = rememberCoroutineScope()

// 자연스러운 탄성을 위한 감쇠 스프링 설정
val springSpec = remember {
    spring<Float>(
        dampingRatio = 0.55f, // 바운스 감쇠 비율 (0.55: 자연스러운 흔들림)
        stiffness = 300f      // 스프링 탄성 강도
    )
}

Modifier
    .pointerInput(Unit) {
        detectDragGestures(
            onDrag = { change, _ ->
                // 터치 좌표를 0.0 ~ 1.0 비율로 정규화
                val normX = (change.position.x / size.width).coerceIn(0f, 1f)
                val normY = (change.position.y / size.height).coerceIn(0f, 1f)
                // -1.0 ~ +1.0 사이의 틸트 비율 즉각 반영
                coroutineScope.launch {
                    tiltXAnim.snapTo((normX - 0.5f) * 2f)
                    tiltYAnim.snapTo((normY - 0.5f) * 2f)
                }
            },
            onDragEnd = {
                // 손을 떼면 스프링 물리 애니메이션으로 원점(0, 0) 복귀
                coroutineScope.launch {
                    launch { tiltXAnim.animateTo(0f, springSpec) }
                    launch { tiltYAnim.animateTo(0f, springSpec) }
                }
            }
        )
    }
    .graphicsLayer {
        // 손가락 위치나 센서 기울기에 맞춰 X축, Y축으로 3D 회전
        rotationX = -tiltYAnim.value * maxTiltDegrees
        rotationY = tiltXAnim.value * maxTiltDegrees
        // 카메라 거리(원근감) 설정: 값이 적절해야 자연스러운 원근감이 연출됨
        cameraDistance = 16f * density
    }

// 기울기(bgX)에 맞춰 한쪽은 왼쪽(-), 다른 쪽은 오른쪽(+)으로 역방향 이동
val forwardShift = -(bgX - 0.5f) * beamCycle * 2.0f
val counterShift = (bgX - 0.5f) * beamCycleAfter * 0.95f

// 1. 순방향 메인 빔 (Base Beam)
val forwardBeamBrush = Brush.linearGradient(
    *V_DIAGONAL_BEAM_STOPS,
    start = Offset(centerX - dirX * halfCycle + dirX * forwardShift, centerY - dirY * halfCycle + dirY * forwardShift),
    end = Offset(centerX + dirX * halfCycle + dirX * forwardShift, centerY + dirY * halfCycle + dirY * forwardShift),
    tileMode = TileMode.Repeated
)

// 2. 반대 방향 빔 (Counter Beam)
val counterBeamBrush = Brush.linearGradient(
    *V_DIAGONAL_BEAM_STOPS,
    start = Offset(centerX - dirX * halfCycleAfter + dirX * counterShift, centerY - dirY * halfCycleAfter + dirY * counterShift),
    end = Offset(centerX + dirX * halfCycleAfter + dirX * counterShift, centerY + dirY * halfCycleAfter + dirY * counterShift),
    tileMode = TileMode.Repeated
)

// 순방향 빔 위에 역방향 빔을 Softlight 모드로 합성
drawRect(brush = forwardBeamBrush)
drawRect(brush = counterBeamBrush, blendMode = BlendMode.Softlight, alpha = 0.85f)

// 세로 방향 순환 6색 무지개 그라디언트
val rainbowBrush = Brush.linearGradient(
    *SUNPILLAR_COLOR_STOPS,
    start = Offset(0f, sunpillarShiftY),
    end = Offset(0f, sunpillarShiftY - sunpillarCycle),
    tileMode = TileMode.Repeated
)

// 광선 위에 무지개 색조(Hue)만 덧입히기
drawRect(brush = rainbowBrush, blendMode = BlendMode.Hue)

// 미세한 메탈릭 노이즈 텍스처를 25% 투명도로 얹어줌
drawImage(
    image = grainBitmap,
    dstSize = IntSize(size.width.toInt(), size.height.toInt()),
    blendMode = BlendMode.Screen,
    alpha = 0.25f
)

// 1. 임시 레이어(오프스크린 버퍼) 생성
drawIntoCanvas { canvas ->
    canvas.saveLayer(layerRect, layerPaint) // layerPaint blendMode = ColorDodge

    // ① 두 줄기 광선 + 무지개(Hue) + 그레인(Screen) 그리기
    drawRect(brush = forwardBeamBrush)
    drawRect(brush = rainbowBrush, blendMode = BlendMode.Hue)
    drawRect(brush = counterBeamBrush, blendMode = BlendMode.Softlight, alpha = 0.85f)
    drawImage(grainBitmap, dstSize = dstSize, blendMode = BlendMode.Screen, alpha = 0.25f)

    // ② 마스크로 캐릭터 영역 뚫어내기
    drawImage(maskBitmap, dstSize = dstSize, blendMode = BlendMode.DstIn)

    // 2. 임시 레이어를 닫고 원본 카드 위에 ColorDodge로 빛 합성
    canvas.restore()
}

// 1. 수직 6색 무지개 그라디언트 색상 구간
val SUNPILLAR_COLOR_STOPS = arrayOf(
    0.0000f to Color(0xFFFF7575),
    0.1667f to Color(0xFFF2E86E),
    0.3333f to Color(0xFFA8ED6E),
    0.5000f to Color(0xFF85F7F0),
    0.6667f to Color(0xFF7A9EFF),
    0.8333f to Color(0xFFE275FF),
    1.0000f to Color(0xFFFF7575)
)

// 2. 루기아 V 대각선 광선 그라디언트 색상 구간
val V_DIAGONAL_BEAM_STOPS = arrayOf(
    0.000f to Color(0xFF0E152E),
    0.316f to Color(0xFF90A3A3),
    0.375f to Color(0xFF90BFBF),
    0.433f to Color(0xFF90A3A3),
    0.833f to Color(0xFF0E152E),
    1.000f to Color(0xFF0E152E)
)

@Composable
fun PokemonVCard(
    cardImageRes: Int,
    maskResId: Int,
    modifier: Modifier = Modifier,
    maxTiltDegrees: Float = 14.3f
) {
    val cardBitmap = ImageBitmap.imageResource(id = cardImageRes)
    val maskBitmap = ImageBitmap.imageResource(id = maskResId)
    val grainBitmap = ImageBitmap.imageResource(id = R.drawable.v_grain)

    val coroutineScope = rememberCoroutineScope()
    val tiltXAnim = remember { Animatable(0f) }
    val tiltYAnim = remember { Animatable(0f) }
    val springSpec = remember {
        spring<Float>(
            dampingRatio = 0.55f, // 바운스 감쇠 비율
            stiffness = 300f      // 스프링 탄성 강도
        )
    }

    // 대각선 133도 방향 벡터
    val beamRad = (133.0 * Math.PI / 180.0).toFloat()
    val dirX = kotlin.math.sin(beamRad)
    val dirY = -kotlin.math.cos(beamRad)

    // 마스킹된 포일을 카드 원본에 빛 합성할 페인트
    val layerPaint = remember {
        Paint().apply {
            blendMode = BlendMode.ColorDodge
        }
    }

    Box(
        modifier = modifier
            .aspectRatio(0.718f) // 공식 포켓몬 카드 종횡비
            .clip(RoundedCornerShape(16.dp))
            .pointerInput(Unit) {
                detectDragGestures(
                    onDrag = { change, _ ->
                        val normX = (change.position.x / size.width).coerceIn(0f, 1f)
                        val normY = (change.position.y / size.height).coerceIn(0f, 1f)
                        coroutineScope.launch {
                            tiltXAnim.snapTo((normX - 0.5f) * 2f)
                            tiltYAnim.snapTo((normY - 0.5f) * 2f)
                        }
                    },
                    onDragEnd = {
                        coroutineScope.launch {
                            launch { tiltXAnim.animateTo(0f, springSpec) }
                            launch { tiltYAnim.animateTo(0f, springSpec) }
                        }
                    }
                )
            }
            .graphicsLayer {
                // Drawing 단계에서 상태를 읽어 불필요한 Recomposition 방지
                rotationX = -tiltYAnim.value * maxTiltDegrees
                rotationY = tiltXAnim.value * maxTiltDegrees
                cameraDistance = 16f * density
            }
            .drawWithCache {
                val w = size.width
                val h = size.height
                val diagonal = kotlin.math.hypot(w, h)
                val layerRect = Rect(0f, 0f, w, h)
                val dstSize = IntSize(w.toInt(), h.toInt())

                val beamCycle = diagonal * 0.2712f
                val beamCycleAfter = diagonal * 0.2049f
                val sunpillarCycle = h * 2.10f

                onDrawWithContent {
                    val normX = (tiltXAnim.value + 1f) * 0.5f
                    val normY = (tiltYAnim.value + 1f) * 0.5f

                    // 1. 카드 기본 일러스트 그리기
                    drawImage(cardBitmap, dstSize = dstSize)

                    // 2. 캐릭터 뒤편 배경에만 홀로그램 포일 합성
                    val bgX = 0.37f + 0.26f * normX
                    val bgY = 0.33f + 0.34f * normY

                    val forwardShift = -(bgX - 0.5f) * beamCycle * 2.0f
                    val counterShift = (bgX - 0.5f) * beamCycleAfter * 0.95f
                    val sunpillarShiftY = (7.0f - 6.0f * bgY) * h

                    // ① 순방향 & 반대 방향 두 광선 브러시
                    val forwardBeamBrush = Brush.linearGradient(
                        *V_DIAGONAL_BEAM_STOPS,
                        start = Offset(w * 0.5f - dirX * beamCycle * 0.5f + dirX * forwardShift, h * 0.5f - dirY * beamCycle * 0.5f + dirY * forwardShift),
                        end = Offset(w * 0.5f + dirX * beamCycle * 0.5f + dirX * forwardShift, h * 0.5f + dirY * beamCycle * 0.5f + dirY * forwardShift),
                        tileMode = TileMode.Repeated
                    )
                    val counterBeamBrush = Brush.linearGradient(
                        *V_DIAGONAL_BEAM_STOPS,
                        start = Offset(w * 0.5f - dirX * beamCycleAfter * 0.5f + dirX * counterShift, h * 0.5f - dirY * beamCycleAfter * 0.5f + dirY * counterShift),
                        end = Offset(w * 0.5f + dirX * beamCycleAfter * 0.5f + dirX * counterShift, h * 0.5f + dirY * beamCycleAfter * 0.5f + dirY * counterShift),
                        tileMode = TileMode.Repeated
                    )
                    // ② 수직 무지개 브러시
                    val rainbowBrush = Brush.linearGradient(
                        *SUNPILLAR_COLOR_STOPS,
                        start = Offset(0f, sunpillarShiftY),
                        end = Offset(0f, sunpillarShiftY - sunpillarCycle),
                        tileMode = TileMode.Repeated
                    )

                    // ③ 오프스크린 레이어에서 포일 합성 후 마스킹
                    drawIntoCanvas { canvas ->
                        canvas.saveLayer(layerRect, layerPaint)

                        // 두 줄기 광선 + 무지개 색조(Hue)
                        drawRect(brush = forwardBeamBrush)
                        drawRect(brush = rainbowBrush, blendMode = BlendMode.Hue)
                        drawRect(brush = counterBeamBrush, blendMode = BlendMode.Softlight, alpha = 0.85f)

                        // 금속 호일 노이즈(Screen)
                        drawImage(grainBitmap, dstSize = dstSize, blendMode = BlendMode.Screen, alpha = 0.25f)

                        // 캐릭터 실루엣 마스킹(DstIn: 캐릭터를 뚫고 배경 포일만 남김)
                        drawImage(maskBitmap, dstSize = dstSize, blendMode = BlendMode.DstIn)

                        canvas.restore()
                    }
                }
            }
    )
}