/* roulang page: index */
:root {
      --bg-main: #0B0C10;
      --card-bg: #14161D;
      --neon-accent: #66FCF1;
      --alert-accent: #FF2A54;
      --border-subtle: rgba(255, 255, 255, 0.08);
    }
    body {
      background-color: var(--bg-main);
      color: #C5C6C7;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
      overflow-x: hidden;
    }
    .console-panel {
      background-color: var(--card-bg);
      border: 1px solid var(--border-subtle);
      transition: all 0.3s ease;
    }
    .console-panel:hover {
      border-color: rgba(102, 252, 241, 0.4);
      box-shadow: 0 0 25px rgba(102, 252, 241, 0.08);
    }
    .grid-lines {
      background-size: 32px 32px;
      background-image: 
        linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    }
    @keyframes pulseDot {
      0%, 100% { opacity: 1; transform: scale(1); }
      50% { opacity: 0.4; transform: scale(0.8); }
    }
    .pulse-indicator {
      animation: pulseDot 2s infinite ease-in-out;
    }
    .hide-scrollbar::-webkit-scrollbar {
      display: none;
    }
    .hide-scrollbar {
      -ms-overflow-style: none;
      scrollbar-width: none;
    }

/* roulang page: category1 */
:root {
      --bg-main: #0B0C10;
      --card-bg: #14161D;
      --neon-accent: #66FCF1;
      --alert-accent: #FF2A54;
      --border-subtle: rgba(255, 255, 255, 0.08);
    }
    body {
      background-color: var(--bg-main);
      color: #C5C6C7;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
      overflow-x: hidden;
    }
    .grid-lines {
      background-size: 32px 32px;
      background-image: 
        linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    }
    .scrollbar-none::-webkit-scrollbar {
      display: none;
    }
    .scrollbar-none {
      -ms-overflow-style: none;
      scrollbar-width: none;
    }

/* roulang page: category2 */
:root {
      --bg-main: #0B0C10;
      --card-bg: #14161D;
      --neon-accent: #66FCF1;
      --alert-accent: #FF2A54;
      --border-subtle: rgba(255, 255, 255, 0.08);
    }
    body {
      background-color: var(--bg-main);
      color: #C5C6C7;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
      overflow-x: hidden;
    }
    .grid-lines {
      background-size: 32px 32px;
      background-image: 
        linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
    }
    .badge-chip {
      background: rgba(102, 252, 241, 0.08);
      border: 1px solid rgba(102, 252, 241, 0.3);
      color: #66FCF1;
    }
    .console-box {
      background: #14161D;
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: 4px;
    }
    .console-box:hover {
      border-color: rgba(102, 252, 241, 0.35);
      box-shadow: 0 0 24px rgba(0, 0, 0, 0.7);
    }
    .truncate-2 {
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }