/* roulang page: index */
:root {
            --bg-main: #0B0E14;
            --bg-card: #121721;
            --color-neon: #00FF87;
            --color-cyan: #00E5FF;
            --color-alert: #FF4655;
            --border-glow: rgba(0, 255, 135, 0.25);
        }
        body {
            background-color: var(--bg-main);
            color: #F0F4F8;
            overflow-x: hidden;
        }
        .glow-neon:hover {
            box-shadow: 0 0 25px var(--border-glow);
            border-color: var(--color-neon);
        }
        .glow-accent {
            box-shadow: 0 0 20px rgba(255, 70, 85, 0.35);
        }
        .hero-pattern {
            background-image: radial-gradient(rgba(0, 229, 255, 0.08) 1px, transparent 1px), radial-gradient(rgba(0, 255, 135, 0.05) 1px, transparent 1px);
            background-size: 32px 32px;
            background-position: 0 0, 16px 16px;
        }
        .clip-slant {
            clip-path: polygon(0 0, 100% 0, 96% 100%, 0% 100%);
        }
        .hide-scrollbar::-webkit-scrollbar {
            display: none;
        }
        .hide-scrollbar {
            -ms-overflow-style: none;
            scrollbar-width: none;
        }