/* roulang page: index */
:root {
            --bg-main: #0B0E14;
            --bg-card: #121721;
            --cyber-cyan: #00F2FE;
            --cyber-purple: #7F00FF;
            --cyber-red: #FF3B30;
            --text-main: #F8FAFC;
            --text-sub: #94A3B8;
            --border-line: rgba(255, 255, 255, 0.08);
        }
        * { box-sizing: border-box; margin: 0; padding: 0; }
        html { scroll-behavior: smooth; background-color: var(--bg-main); color: var(--text-main); font-family: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; }
        body { overflow-x: hidden; line-height: 1.75; }
        
        .glow-cyan { text-shadow: 0 0 15px rgba(0, 242, 254, 0.6); }
        .box-glow { box-shadow: 0 0 25px rgba(0, 242, 254, 0.15); }
        .cyber-glass { background: rgba(18, 23, 33, 0.75); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid var(--border-line); }
        .cyber-glass:hover { border-color: var(--cyber-cyan); box-shadow: 0 10px 30px -10px rgba(0, 242, 254, 0.2); }
        
        .gradient-border {
            position: relative;
            background: linear-gradient(135deg, rgba(0, 242, 254, 0.1), rgba(127, 0, 255, 0.05));
            border: 1px solid var(--border-line);
        }
        .bento-hero {
            background-image: radial-gradient(circle at 50% 20%, rgba(127, 0, 255, 0.15), transparent 60%),
                              radial-gradient(circle at 80% 80%, rgba(0, 242, 254, 0.1), transparent 50%);
        }
        .btn-glow {
            background: linear-gradient(90deg, #00F2FE, #4FACFE);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .btn-glow:hover {
            box-shadow: 0 0 20px rgba(0, 242, 254, 0.6);
            transform: translateY(-2px);
        }
        .custom-scrollbar::-webkit-scrollbar { width: 6px; }
        .custom-scrollbar::-webkit-scrollbar-track { background: #0B0E14; }
        .custom-scrollbar::-webkit-scrollbar-thumb { background: #1f293d; border-radius: 3px; }
        .custom-scrollbar::-webkit-scrollbar-thumb:hover { background: var(--cyber-cyan); }
