/* roulang page: index */
:root {
      --bg-base: #F8F9FA;
      --bg-dark: #121316;
      --accent: #00E599;
      --text-main: #1F2329;
      --text-sub: #646A73;
      --border-color: #E5E6EB;
    }
    body {
      background-color: var(--bg-base);
      color: var(--text-main);
      -webkit-font-smoothing: antialiased;
    }
    .custom-scroll::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    .custom-scroll::-webkit-scrollbar-thumb {
      background: #cbd5e1;
      border-radius: 3px;
    }
    .glass-nav {
      background-color: rgba(255, 255, 255, 0.92);
      backdrop-filter: blur(12px);
    }
    .card-hover-effect {
      transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.18s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.18s ease;
    }
    .card-hover-effect:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 24px -10px rgba(0, 0, 0, 0.08);
      border-color: #00E599;
    }
    .code-mask {
      background: linear-gradient(180deg, rgba(30, 32, 37, 0) 0%, rgba(18, 19, 22, 0.95) 100%);
    }