/* roulang page: index */
:root {
            --brand-gradient: linear-gradient(135deg, #581c87 0%, #7e22ce 50%, #312e81 100%);
            --cta-gradient: linear-gradient(90deg, #f43f5e 0%, #ec4899 100%);
            --cta-hover: linear-gradient(90deg, #e11d48 0%, #db2777 100%);
        }
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
            background-color: #f8fafc;
            color: #0f172a;
            scroll-behavior: smooth;
        }
        .hero-bg {
            background: radial-gradient(circle at 80% 20%, rgba(244, 63, 94, 0.15), transparent 45%),
                        radial-gradient(circle at 20% 80%, rgba(126, 34, 206, 0.25), transparent 50%),
                        linear-gradient(160deg, #1e1b4b 0%, #0f172a 100%);
        }
        .data-glass {
            background: rgba(255, 255, 255, 0.06);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.12);
        }
        .ranking-card {
            transition: all 0.25s ease-in-out;
        }
        .ranking-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 16px 30px -10px rgba(126, 34, 206, 0.15);
        }

/* roulang page: category1 */
:root {
      --brand-gradient: linear-gradient(135deg, #581c87 0%, #7e22ce 50%, #312e81 100%);
      --cta-gradient: linear-gradient(90deg, #f43f5e 0%, #ec4899 100%);
      --cta-hover: linear-gradient(90deg, #e11d48 0%, #db2777 100%);
    }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      background-color: #f8fafc;
      color: #0f172a;
      scroll-behavior: smooth;
    }
    .hero-bg {
      background: radial-gradient(circle at 80% 20%, rgba(244, 63, 94, 0.15), transparent 45%),
                  radial-gradient(circle at 20% 80%, rgba(126, 34, 206, 0.25), transparent 50%),
                  linear-gradient(160deg, #1e1b4b 0%, #0f172a 100%);
    }
    .data-glass {
      background: rgba(255, 255, 255, 0.06);
      backdrop-filter: blur(12px);
      border: 1px solid rgba(255, 255, 255, 0.12);
    }
    .ranking-card {
      transition: all 0.25s ease-in-out;
    }
    .ranking-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 16px 30px -10px rgba(126, 34, 206, 0.15);
    }
    .category-filter-btn.active {
      background: #7e22ce;
      color: #ffffff;
      border-color: #6b21a8;
    }