/* roulang page: index */
:root {
        --color-primary: #00FF88;
        --color-bg: #0A0D14;
        --color-panel: #161B26;
        --color-border: #2A3245;
        --color-text: #F8FAFC;
        --color-muted: #94A3B8;
      }
      * { box-sizing: border-box; }
      html { scroll-behavior: smooth; }
      body {
        background-color: var(--color-bg);
        color: var(--color-text);
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
        overflow-x: hidden;
      }
      .dock-glass {
        background: rgba(16, 22, 33, 0.85);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        border: 1px solid rgba(42, 50, 69, 0.8);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
      }
      .esports-card {
        background: #161B26;
        border: 1px solid #2A3245;
        transition: all 0.25s ease;
      }
      .esports-card:hover {
        border-color: rgba(0, 255, 136, 0.45);
        transform: translateY(-4px);
        box-shadow: 0 12px 32px rgba(0, 255, 136, 0.08);
      }
      .glow-btn {
        background: #00FF88;
        color: #0A0D14;
        font-weight: 700;
        transition: all 0.2s ease;
      }
      .glow-btn:hover {
        background: #05f082;
        box-shadow: 0 0 20px rgba(0, 255, 136, 0.45);
      }
      .hero-bg {
        background: linear-gradient(180deg, rgba(10, 13, 20, 0.8) 0%, rgba(10, 13, 20, 0.96) 100%),
                    url('/assets/images/90efc96a5e0d183d.jpg') center/cover no-repeat;
      }
      .tactics-bg {
        background: linear-gradient(180deg, rgba(10, 13, 20, 0.94) 0%, rgba(16, 20, 30, 0.98) 100%),
                    url('/assets/images/76529cb12e28daec.webp') center/cover no-repeat;
      }
      .badge-tag {
        background: rgba(0, 255, 136, 0.1);
        border: 1px solid rgba(0, 255, 136, 0.25);
        color: #00FF88;
      }