/* ============================================
   人生K线图 · 移动端响应式
   ============================================ */

@media (max-width: 768px) {
    .header-inner {
        height: auto;
        padding: 10px 15px;
        flex-wrap: wrap;
        gap: 10px;
    }
    .logo { font-size: 16px; }
    .logo-icon { font-size: 20px; }

    .mobile-menu-btn { display: block; }

    .main-nav {
        display: none;
        width: 100%;
        flex-direction: column;
        gap: 2px;
        order: 10;
    }
    .main-nav.active { display: flex; }
    .main-nav a {
        padding: 12px 16px;
        font-size: 15px;
        border-radius: 0;
        border-bottom: 1px solid var(--border);
    }

    .user-area { margin-left: 0; }
    .user-btn .user-name { display: none; }

    .site-main { padding: 12px; }

    .card { padding: 16px; }

    .form-grid { grid-template-columns: 1fr; }

    .plan-grid { grid-template-columns: 1fr; }
    .business-grid { grid-template-columns: 1fr; }

    .profile-grid {
        grid-template-columns: 1fr;
    }

    .admin-layout {
        grid-template-columns: 1fr;
    }
    .admin-sidebar {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        padding: 8px;
    }
    .admin-sidebar a {
        padding: 8px 12px;
        font-size: 13px;
        margin-bottom: 0;
    }

    .stats-grid { grid-template-columns: repeat(2, 1fr); }

    table { font-size: 12px; }
    table th, table td { padding: 8px 10px; }

    .modal-dialog { padding: 20px; width: 95%; }

    .dayun-rainbow-grid { grid-template-columns: repeat(auto-fill, minmax(60px, 1fr)); }
    .dayun-cell { font-size: 10px; padding: 4px 2px; }

    .footer-links { gap: 12px; }
}

@media (max-width: 480px) {
    .stats-grid { grid-template-columns: 1fr; }
    .btn-lg { padding: 12px 20px; font-size: 14px; }
    .plan-price { font-size: 24px; }
}