/* roulang page: index */
:root {
      --brand-cyan: #00f2fe;
      --brand-blue: #4facfe;
      --brand-glow: rgba(0, 242, 254, 0.35);
      --bg-deep: #030712;
      --card-bg: rgba(15, 23, 42, 0.65);
      --card-border: rgba(56, 189, 248, 0.2);
    }
    body {
      background-color: var(--bg-deep);
      color: #f8fafc;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      overflow-x: hidden;
    }
    .glass-card {
      background: var(--card-bg);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      border: 1px solid var(--card-border);
    }
    .glass-card:hover {
      border-color: rgba(0, 242, 254, 0.45);
      box-shadow: 0 10px 30px -10px var(--brand-glow);
    }
    .btn-glow {
      background: linear-gradient(135deg, var(--brand-cyan) 0%, var(--brand-blue) 100%);
      box-shadow: 0 0 25px var(--brand-glow);
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .btn-glow:hover {
      box-shadow: 0 0 35px rgba(0, 242, 254, 0.6);
      transform: translateY(-2px);
    }
    .no-scrollbar::-webkit-scrollbar {
      display: none;
    }
    .no-scrollbar {
      -ms-overflow-style: none;
      scrollbar-width: none;
    }
    .text-gradient {
      background: linear-gradient(135deg, #ffffff 20%, #38bdf8 70%, #00f2fe 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

/* roulang page: category1 */
:root {
  --brand-cyan: #00f2fe;
  --brand-blue: #4facfe;
  --brand-glow: rgba(0, 242, 254, 0.35);
  --bg-deep: #030712;
  --card-bg: rgba(15, 23, 42, 0.65);
  --card-border: rgba(56, 189, 248, 0.2);
}
body {
  background-color: var(--bg-deep);
  color: #f8fafc;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  overflow-x: hidden;
}
.glass-card {
  background: var(--card-bg);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid var(--card-border);
}
.glass-card:hover {
  border-color: rgba(0, 242, 254, 0.45);
  box-shadow: 0 10px 30px -10px var(--brand-glow);
}
.btn-glow {
  background: linear-gradient(135deg, var(--brand-cyan) 0%, var(--brand-blue) 100%);
  box-shadow: 0 0 25px var(--brand-glow);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-glow:hover {
  box-shadow: 0 0 35px rgba(0, 242, 254, 0.6);
  transform: translateY(-2px);
}
.text-gradient {
  background: linear-gradient(135deg, #ffffff 20%, #38bdf8 70%, #00f2fe 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}