body {
    background-color: #f5f5f5;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.phone-frame {
    width: 375px;
    height: 812px;
    border: 1px solid #e0e0e0;
    border-radius: 40px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
    background-color: white;
}

.gradient-bg {
    background: linear-gradient(135deg, #FF9F43 0%, #FF7E5F 100%);
}

.btn-primary {
    background: linear-gradient(135deg, #FF9F43 0%, #FF7E5F 100%);
}

@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

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

@keyframes shine {
    0% { background-position: -100px; }
    100% { background-position: 200px; }
}

.animate-fadeIn {
    animation: fadeIn 1.5s ease-in-out;
}

.animate-scaleUp {
    animation: scaleUp 1.2s ease-out;
}

.shine-text {
    background: linear-gradient(to right, #FF9F43 0%, #FF7E5F 10%, #FF9F43 20%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-size: 200% 100%;
    animation: shine 2s infinite linear;
}

/* Logo 相关样式 */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .logo-image {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}

.drop-shadow-lg {
    filter: drop-shadow(0 10px 15px rgba(0, 0, 0, 0.1));
}

@keyframes imageLoad {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.image-load {
    animation: imageLoad 0.5s ease-out;
}