/* Redgameflow - Responsive Styles */
@media (max-width: 1024px) {
    .hero h1 { font-size: 2.5rem; }
    .tool-container { grid-template-columns: 1fr; }
    .footer-content { grid-template-columns: 1fr 1fr; gap: 30px; }
    .contact-container { grid-template-columns: 1fr; }
    .step-arrow { display: none; }
    .steps-container { gap: 30px; }
    
    /* 工具瀑布流 - 平板优化 */
    .tools-masonry {
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
    }
    
    .tool-tile.large {
        grid-column: span 2;
        grid-row: span 1;
    }
}

@media (max-width: 768px) {
    .container { padding: 0 16px; }
    
    /* Hero 区域优化 */
    .hero-banner { padding: 40px 0; }
    .hero-content { text-align: center; }
    .hero h1 { font-size: 2rem; line-height: 1.2; }
    .hero p { font-size: 1rem; }
    .hero-search { margin: 24px 0; }
    .hero-stats { 
        flex-direction: column; 
        gap: 12px;
        align-items: center;
    }
    .stat-item { 
        flex-direction: row; 
        gap: 8px;
        align-items: center;
    }
    
    /* 导航优化 */
    .nav-menu {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--bg-primary);
        flex-direction: column;
        padding: 20px;
        gap: 15px;
        border-bottom: 1px solid var(--border-color);
        box-shadow: var(--shadow-md);
    }
    .nav-menu.active { display: flex; }
    .mobile-menu-toggle { display: block; }
    
    /* 工具展示区域 */
    .tools-showcase { padding: 40px 0; }
    .section-header { margin-bottom: 24px; }
    .section-header h2 { font-size: 1.8rem; }
    
    /* 工具过滤器 */
    .tool-filters {
        flex-wrap: wrap;
        gap: 8px;
        justify-content: center;
    }
    .filter-btn {
        padding: 8px 16px;
        font-size: 0.9rem;
    }
    
    /* 工具瀑布流 - 移动端优化 */
    .tools-masonry {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    
    /* 重新定义卡片大小 */
    .tool-tile.large {
        grid-column: span 2;
        grid-row: span 1;
        min-height: 140px;
    }
    
    .tool-tile.large .tile-icon {
        width: 60px;
        height: 60px;
        margin-bottom: 12px;
    }
    
    .tool-tile.large .tile-content {
        padding: 16px;
    }
    
    .tool-tile.large .tile-content h3 {
        font-size: 1.1rem;
        margin-bottom: 6px;
    }
    
    .tool-tile.large .tile-content p {
        font-size: 0.85rem;
        line-height: 1.4;
    }
    
    .tool-tile.medium {
        grid-column: span 1;
        min-height: 120px;
    }
    
    .tool-tile.medium .tile-content {
        padding: 12px;
    }
    
    .tool-tile.medium .tile-content h3 {
        font-size: 0.95rem;
    }
    
    .tool-tile.medium .tile-content p {
        font-size: 0.8rem;
    }
    
    .tool-tile.small {
        grid-column: span 1;
        min-height: 100px;
        padding: 12px;
    }
    
    .tool-tile.small .tile-icon {
        width: 40px;
        height: 40px;
        margin-bottom: 8px;
    }
    
    .tool-tile.small h3 {
        font-size: 0.9rem;
    }
    
    /* 特性条带 */
    .features-strip { padding: 20px 0; }
    .features-scroll {
        gap: 12px;
        padding: 0 16px;
    }
    .feature-chip {
        padding: 8px 12px;
        font-size: 0.85rem;
        white-space: nowrap;
    }
    
    /* 快速指南 */
    .quick-guide { padding: 40px 0; }
    .guide-steps {
        flex-direction: column;
        gap: 16px;
        align-items: center;
    }
    .guide-step {
        flex-direction: row;
        gap: 12px;
        align-items: center;
    }
    .guide-arrow { display: none; }
    
    /* 页脚 */
    .footer-content { 
        grid-template-columns: 1fr; 
        text-align: center; 
        gap: 24px;
    }
    .social-links { justify-content: center; }
    
    /* 工具页面 */
    .tool-container { grid-template-columns: 1fr; gap: 20px; }
    .tool-panel { padding: 20px; }
    .tool-actions { 
        flex-direction: column; 
        gap: 12px;
    }
    .tool-actions .btn { 
        width: 100%; 
        justify-content: center; 
    }
    
    /* 结果网格 */
    .results-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    
    /* 上传区域 */
    .upload-area { 
        padding: 40px 20px; 
        margin: 16px 0;
    }
    .upload-area i { font-size: 2rem; }
}

@media (max-width: 480px) {
    .container { padding: 0 12px; }
    
    /* Hero 进一步优化 */
    .hero-banner { padding: 30px 0; }
    .hero h1 { 
        font-size: 1.75rem; 
        line-height: 1.1;
    }
    .hero-desc {
        font-size: 0.9rem;
        margin: 16px 0;
    }
    .hero-search input {
        font-size: 16px; /* 防止 iOS 缩放 */
    }
    
    /* 页面标题 */
    .section-title { font-size: 1.5rem; }
    .page-header h1 { 
        font-size: 1.5rem; 
        flex-direction: column;
        gap: 8px;
    }
    
    /* 按钮优化 */
    .btn { 
        padding: 12px 20px; 
        font-size: 0.9rem;
        min-height: 44px; /* 触摸友好 */
    }
    
    /* 工具瀑布流 - 小屏优化 */
    .tools-masonry {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .tool-tile.large,
    .tool-tile.medium,
    .tool-tile.small {
        grid-column: span 1;
        min-height: 100px;
        padding: 16px;
        display: flex;
        align-items: center;
        gap: 16px;
    }
    
    .tool-tile .tile-icon {
        width: 50px !important;
        height: 50px !important;
        margin: 0 !important;
        flex-shrink: 0;
    }
    
    .tool-tile .tile-content {
        padding: 0 !important;
        flex: 1;
    }
    
    .tool-tile .tile-content h3 {
        font-size: 1rem !important;
        margin-bottom: 4px !important;
    }
    
    .tool-tile .tile-content p {
        font-size: 0.85rem !important;
        line-height: 1.3 !important;
    }
    
    .tile-tag {
        font-size: 0.75rem;
        padding: 2px 8px;
    }
    
    /* 工具过滤器 */
    .tool-filters {
        gap: 6px;
    }
    .filter-btn {
        padding: 6px 12px;
        font-size: 0.85rem;
    }
    
    /* 特性条带 */
    .feature-chip {
        padding: 6px 10px;
        font-size: 0.8rem;
    }
    
    /* 表单优化 */
    .form-control {
        font-size: 16px; /* 防止 iOS 缩放 */
        padding: 12px;
        min-height: 44px;
    }
    
    /* 工具页面 */
    .tool-panel {
        padding: 16px;
        margin-bottom: 16px;
    }
    
    .page-header {
        padding: 20px 0;
        text-align: center;
    }
    
    /* 结果网格 */
    .results-grid { 
        grid-template-columns: 1fr; 
        gap: 12px; 
    }
    
    /* 上传区域 */
    .upload-area { 
        padding: 30px 16px;
        margin: 12px 0;
    }
    .upload-area i { font-size: 1.8rem; }
    .upload-area h3 { font-size: 1.1rem; }
    .upload-area p { font-size: 0.9rem; }
}

/* 触摸设备优化 */
@media (hover: none) and (pointer: coarse) {
    .tool-tile:hover {
        transform: none;
        box-shadow: var(--shadow-md);
    }
    
    .tool-tile:active {
        transform: scale(0.98);
        transition: transform 0.1s ease;
    }
    
    .btn:hover {
        transform: none;
    }
    
    .btn:active {
        transform: scale(0.98);
    }
}

/* 高对比度模式支持 */
@media (prefers-contrast: high) {
    .tool-tile {
        border: 2px solid var(--border-color);
    }
    
    .btn {
        border: 2px solid currentColor;
    }
}

/* 减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}