/* Rooftop Rivals pro gameplay refinements */
.game-wind-chip {
    transition:
        transform .28s cubic-bezier(.2,.85,.2,1),
        border-color .24s ease,
        background .24s ease,
        box-shadow .24s ease;
}

.game-wind-chip.wind-left .game-wind-arrow,
.game-wind-chip.wind-right .game-wind-arrow {
    color: var(--game-cyan, #37d8ff);
    text-shadow: 0 0 14px rgba(55, 216, 255, .45);
}

.game-wind-chip.is-shifting {
    animation: rooftopWindShift .62s cubic-bezier(.2,.85,.2,1);
    border-color: rgba(55, 216, 255, .42);
    box-shadow: 0 10px 28px rgba(55, 216, 255, .12);
}

.game-wind-chip.is-shifting .game-wind-arrow {
    animation: rooftopWindArrow .62s cubic-bezier(.2,.85,.2,1);
}

.game-player-card.is-turn-change {
    animation: rooftopTurnPulse .5s cubic-bezier(.2,.85,.2,1);
}

.game-stage canvas {
    image-rendering: auto;
    transform: translateZ(0);
    will-change: contents;
}

.game-hint.is-visible,
.game-turn-chip.is-visible {
    animation: rooftopChipIn .26s cubic-bezier(.2,.85,.2,1);
}

@keyframes rooftopWindShift {
    0% { transform: translateY(0) scale(1); }
    38% { transform: translateY(-3px) scale(1.04); }
    100% { transform: translateY(0) scale(1); }
}

@keyframes rooftopWindArrow {
    0% { transform: translateX(0) scale(.82); opacity: .55; }
    45% { transform: translateX(var(--wind-kick, 0)) scale(1.18); opacity: 1; }
    100% { transform: translateX(0) scale(1); opacity: 1; }
}

.game-wind-chip.wind-left { --wind-kick: -7px; }
.game-wind-chip.wind-right { --wind-kick: 7px; }
.game-wind-chip.wind-calm { --wind-kick: 0; }

@keyframes rooftopTurnPulse {
    0% { transform: scale(1); }
    44% { transform: scale(1.025); }
    100% { transform: scale(1); }
}

@keyframes rooftopChipIn {
    from { opacity: 0; transform: translateY(5px) scale(.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 767px) {
    .game-wind-chip.is-shifting {
        box-shadow: 0 8px 22px rgba(55, 216, 255, .1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .game-wind-chip,
    .game-wind-chip.is-shifting,
    .game-wind-chip.is-shifting .game-wind-arrow,
    .game-player-card.is-turn-change,
    .game-hint.is-visible,
    .game-turn-chip.is-visible {
        animation: none !important;
        transition: none !important;
    }
}
