/* Custom Glassmorphism & Animations */

@keyframes pulseGlow {
    0%, 100% { opacity: 0.4; transform: scale(1); }
    50% { opacity: 0.8; transform: scale(1.05); }
}

@keyframes shakeError {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-8px); }
    40%, 80% { transform: translateX(8px); }
}

@keyframes popIn {
    0% { transform: scale(0.8); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

.animate-pop {
    animation: popIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.shake-animation {
    animation: shakeError 0.4s ease-in-out;
}

/* Touch & UI Fixes */
button, input, div {
    -webkit-tap-highlight-color: transparent;
}

.screen-view {
    transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out;
}

.screen-view.hidden {
    display: none !important;
}

/* Neon Glow Utilities */
.neon-glow-cyan {
    box-shadow: 0 0 20px rgba(6, 182, 212, 0.4);
}

.neon-glow-pink {
    box-shadow: 0 0 20px rgba(236, 72, 153, 0.4);
}

.neon-glow-gold {
    box-shadow: 0 0 20px rgba(245, 158, 11, 0.4);
}

.neon-glow-green {
    box-shadow: 0 0 20px rgba(16, 185, 129, 0.4);
}

/* Safe Area Insets for Mobile WebViews */
.pt-safe {
    padding-top: calc(8px + env(safe-area-inset-top));
}
.pb-safe {
    padding-bottom: calc(8px + env(safe-area-inset-bottom));
}

/* Pipe/Circuit Node Lines */
.pipe-line {
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* Draggable Touch Smoothness */
.draggable-item {
    touch-action: none;
    user-select: none;
}