/* roulang page: index */
:root {
            --primary: #059669;
            --primary-hover: #047857;
            --accent: #f59e0b;
            --bg-neutral: #f8fafc;
            --text-main: #0f172a;
            --text-body: #334155;
            --border-line: #e2e8f0;
            --shadow-subtle: 0 4px 20px -2px rgba(15, 23, 42, 0.06);
            --shadow-elevated: 0 20px 25px -5px rgba(15, 23, 42, 0.1), 0 8px 10px -6px rgba(15, 23, 42, 0.1);
        }

        body {
            font-family: system-ui, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
            color: var(--text-body);
            background-color: var(--bg-neutral);
            overflow-x: hidden;
        }

        .hero-pattern {
            background-color: #0f172a;
            background-image: radial-gradient(rgba(5, 150, 105, 0.25) 1px, transparent 1px);
            background-size: 24px 24px;
        }

        .radar-grid {
            background: linear-gradient(135deg, rgba(15,23,42,0.95), rgba(30,41,59,0.92));
        }

        .tab-btn.active {
            background-color: #059669;
            color: #ffffff;
            border-color: #059669;
        }

        .accordion-content {
            transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
            max-height: 0;
            overflow: hidden;
            opacity: 0;
        }
        .accordion-content.expanded {
            max-height: 240px;
            opacity: 1;
        }

        /* 移动端安全区域适配 */
        .safe-bottom {
            padding-bottom: env(safe-area-inset-bottom);
        }