/* roulang page: index */
:root {
      --primary: #e11d48;
      --primary-dark: #0f172a;
      --card-bg: #1e293b;
      --text-main: #f8fafc;
      --text-muted: #94a3b8;
    }
    body {
      background-color: #0b0f19;
      color: #f1f5f9;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      overflow-x: hidden;
    }
    .custom-gradient-bg {
      background: radial-gradient(circle at 50% 20%, rgba(225, 29, 72, 0.15) 0%, rgba(15, 23, 42, 0.95) 80%);
    }
    .glow-border {
      position: relative;
      border: 1px solid rgba(225, 29, 72, 0.25);
      transition: all 0.3s ease;
    }
    .glow-border:hover {
      border-color: rgba(244, 63, 94, 0.8);
      box-shadow: 0 0 25px rgba(225, 29, 72, 0.35);
      transform: translateY(-2px);
    }
    .glass-nav {
      background: rgba(15, 23, 42, 0.85);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

/* roulang page: category2 */
:root {
            --primary: #e11d48;
            --primary-dark: #0f172a;
            --card-bg: #1e293b;
            --text-main: #f8fafc;
            --text-muted: #94a3b8;
        }
        body {
            background-color: #0b0f19;
            color: #f1f5f9;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            overflow-x: hidden;
        }
        .glow-border {
            position: relative;
            border: 1px solid rgba(225, 29, 72, 0.25);
            transition: all 0.3s ease;
        }
        .glow-border:hover {
            border-color: rgba(244, 63, 94, 0.8);
            box-shadow: 0 0 25px rgba(225, 29, 72, 0.35);
            transform: translateY(-2px);
        }
        .glass-nav {
            background: rgba(15, 23, 42, 0.85);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }

/* roulang page: category1 */
:root {
      --primary: #e11d48;
      --primary-dark: #0f172a;
      --card-bg: #1e293b;
      --text-main: #f8fafc;
      --text-muted: #94a3b8;
    }
    body {
      background-color: #0b0f19;
      color: #f1f5f9;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      overflow-x: hidden;
    }
    .glow-border {
      position: relative;
      border: 1px solid rgba(225, 29, 72, 0.25);
      transition: all 0.3s ease;
    }
    .glow-border:hover {
      border-color: rgba(244, 63, 94, 0.8);
      box-shadow: 0 0 25px rgba(225, 29, 72, 0.35);
      transform: translateY(-2px);
    }
    .glass-nav {
      background: rgba(15, 23, 42, 0.85);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }
    .clip-badge {
      clip-path: polygon(0 0, 92% 0, 100% 50%, 92% 100%, 0 100%);
    }
    .stat-scanline {
      background: linear-gradient(180deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0) 100%);
    }

/* roulang page: category3 */
:root {
      --primary: #e11d48;
      --primary-dark: #0f172a;
      --card-bg: #1e293b;
      --text-main: #f8fafc;
      --text-muted: #94a3b8;
    }
    body {
      background-color: #0b0f19;
      color: #f1f5f9;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      overflow-x: hidden;
    }
    .glow-border {
      position: relative;
      border: 1px solid rgba(225, 29, 72, 0.25);
      transition: all 0.3s ease;
    }
    .glow-border:hover {
      border-color: rgba(244, 63, 94, 0.8);
      box-shadow: 0 0 25px rgba(225, 29, 72, 0.35);
      transform: translateY(-2px);
    }
    .glass-nav {
      background: rgba(15, 23, 42, 0.85);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }
    .radial-overlay {
      background: radial-gradient(circle at 50% 30%, rgba(225, 29, 72, 0.15) 0%, rgba(11, 15, 25, 0.95) 75%);
    }

/* roulang page: category4 */
:root {
            --primary: #e11d48;
            --primary-dark: #0f172a;
            --card-bg: #1e293b;
            --text-main: #f8fafc;
            --text-muted: #94a3b8;
        }
        body {
            background-color: #0b0f19;
            color: #f1f5f9;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            overflow-x: hidden;
        }
        .glow-border {
            position: relative;
            border: 1px solid rgba(225, 29, 72, 0.25);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        .glow-border:hover {
            border-color: rgba(244, 63, 94, 0.8);
            box-shadow: 0 0 25px rgba(225, 29, 72, 0.35);
            transform: translateY(-2px);
        }
        .glass-nav {
            background: rgba(15, 23, 42, 0.88);
            backdrop-filter: blur(14px);
            -webkit-backdrop-filter: blur(14px);
        }
        .glass-card {
            background: rgba(30, 41, 59, 0.65);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.08);
        }
        .text-gradient {
            background: linear-gradient(135deg, #ffffff 0%, #cbd5e1 50%, #fda4af 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .countdown-item {
            background: rgba(15, 23, 42, 0.8);
            border: 1px solid rgba(225, 29, 72, 0.3);
        }
