/* roulang page: index */
:root {
            --color-primary: #059669;
            --color-primary-dark: #064e3b;
            --color-accent: #10b981;
            --color-night: #0f172a;
            --color-bg-base: #f8fafc;
            --font-mono-code: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        }

        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
            background-color: var(--color-bg-base);
            color: #1e293b;
            overflow-x: hidden;
        }

        .code-font {
            font-family: var(--font-mono-code);
        }

        .hero-bg {
            background-image: linear-gradient(135deg, rgba(15, 23, 42, 0.94), rgba(6, 78, 59, 0.88)), url('/assets/images/0d2a4c031e255ae8.webp');
            background-size: cover;
            background-position: center;
        }

        .dark-section-bg {
            background-image: linear-gradient(180deg, rgba(11, 15, 25, 0.98), rgba(15, 23, 42, 0.95)), url('/assets/images/dc696c3db84846a4.webp');
            background-size: cover;
            background-position: center;
        }

        .pulse-dot {
            animation: pulseAnimation 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
        }

        @keyframes pulseAnimation {
            0%, 100% { opacity: 1; transform: scale(1); }
            50% { opacity: 0.4; transform: scale(1.15); }
        }

        details > summary {
            list-style: none;
        }
        details > summary::-webkit-details-marker {
            display: none;
        }