/* roulang page: index */
:root {
      --bg-dark: #0A0F1D;
      --card-surface: #121A2D;
      --border-line: #1F2E4D;
      --glow-indigo: rgba(99, 102, 241, 0.25);
    }
    body {
      background-color: var(--bg-dark);
      color: #94A3B8;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    }
    .brand-gradient-text {
      background: linear-gradient(135deg, #FFFFFF 20%, #A5B4FC 60%, #38BDF8 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .brand-gradient-bg {
      background: linear-gradient(135deg, #6366F1 0%, #3B82F6 50%, #06B6D4 100%);
    }
    .card-hover-glow {
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .card-hover-glow:hover {
      transform: translateY(-4px);
      box-shadow: 0 20px 40px -15px var(--glow-indigo);
      border-color: rgba(99, 102, 241, 0.5);
    }
    .code-mask {
      background: linear-gradient(180deg, rgba(18,26,45,0.85) 0%, rgba(10,15,29,0.98) 100%);
    }