/* Core Base Styles */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background-color: #202225;
    color: #dcddde;
    overflow: hidden;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* iOS Safe Area Support */
:root {
    --safe-area-top: env(safe-area-inset-top, 0px);
    --safe-area-bottom: env(safe-area-inset-bottom, 0px);
    --safe-area-left: env(safe-area-inset-left, 0px);
    --safe-area-right: env(safe-area-inset-right, 0px);
}

html {
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
}

/* iOS-specific touch optimizations */
@supports (-webkit-touch-callout: none) {
    body {
        -webkit-overflow-scrolling: touch;
    }
    
    /* Prevent iOS rubber-banding on main container */
    #root {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        overflow: hidden;
    }
}

/* Custom Scrollbar Styling */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #2f3136; }
::-webkit-scrollbar-thumb { background: #202225; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #40444b; }

/* Animations */
@keyframes levelUpPop {
    0% { transform: scale(0.5); opacity: 0; }
    50% { transform: scale(1.1); opacity: 1; }
    70% { transform: scale(0.95); }
    100% { transform: scale(1); opacity: 1; }
}

.animate-level-up {
    animation: levelUpPop 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

@keyframes comboShake {
    0% { transform: translate(0, 0) rotate(0deg); }
    25% { transform: translate(-2px, 2px) rotate(-2deg); }
    50% { transform: translate(2px, -2px) rotate(2deg); }
    75% { transform: translate(-2px, -2px) rotate(-2deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}

.animate-combo {
    animation: comboShake 0.3s ease-in-out;
    color: #FEE75C;
    text-shadow: 0 0 10px rgba(254, 231, 92, 0.5);
}

/* Performance Optimizations */
.hardware-accelerated {
    will-change: transform;
    transform: translate3d(0,0,0);
}

.dots-pattern {
    background-image: radial-gradient(#40444b 1px, transparent 1px);
    background-size: 20px 20px;
}

/* Form Element Resets */
input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
    opacity: 0.6;
}
input[type="date"]::-webkit-calendar-picker-indicator:hover {
    opacity: 1;
}

/* Toast Animation */
@keyframes slideUp {
    0% { transform: translateY(100%); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
}

.animate-slide-up {
    animation: slideUp 0.3s ease-out forwards;
}