/* roulang page: index */
:root {
            --primary-glow: rgba(6, 182, 212, 0.35);
            --violet-glow: rgba(109, 40, 217, 0.4);
        }
        body {
            font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
            background-color: #f8fafc;
            color: #334155;
            overflow-x: hidden;
        }
        .code-container {
            background: #090d16;
            border: 1px solid #1e293b;
            font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
        }
        .text-gradient {
            background: linear-gradient(135deg, #06b6d4 0%, #a855f7 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .hero-bg {
            background-image: linear-gradient(to bottom, rgba(2, 6, 23, 0.88), rgba(15, 23, 42, 0.96)), url('/assets/images/67dd6438c9c7b729.png');
            background-size: cover;
            background-position: center;
        }
        .pattern-grid {
            background-size: 30px 30px;
            background-image: linear-gradient(to right, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
                              linear-gradient(to bottom, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
        }
        .accordion-content {
            transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
            max-height: 0;
            opacity: 0;
            overflow: hidden;
        }
        .accordion-content.active {
            max-height: 280px;
            opacity: 1;
        }