/* roulang page: index */
:root {
      --bg-pitch: #0a0e14;
      --bg-surface: #0f172a;
      --bg-card: #131c26;
      --color-neon: #00e676;
      --color-score: #ff5722;
      --color-text: #f8fafc;
      --color-muted: #94a3b8;
    }
    body {
      background-color: var(--bg-pitch);
      color: var(--color-text);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      overflow-x: hidden;
    }
    .neon-glow {
      box-shadow: 0 0 20px rgba(0, 230, 118, 0.25);
    }
    .neon-border-glow:hover {
      border-color: #00e676;
      box-shadow: 0 0 15px rgba(0, 230, 118, 0.2);
    }
    .pitch-grid {
      background-image: linear-gradient(rgba(30, 41, 59, 0.35) 1px, transparent 1px),
                        linear-gradient(90deg, rgba(30, 41, 59, 0.35) 1px, transparent 1px);
      background-size: 40px 40px;
    }
    .hero-mask {
      background: linear-gradient(180deg, rgba(10,14,20,0.7) 0%, rgba(10,14,20,0.95) 85%, #0a0e14 100%);
    }
    .pulse-dot {
      animation: pulse-live 1.6s infinite ease-in-out;
    }
    @keyframes pulse-live {
      0% { transform: scale(0.95); opacity: 0.8; box-shadow: 0 0 0 0 rgba(0, 230, 118, 0.7); }
      70% { transform: scale(1.15); opacity: 1; box-shadow: 0 0 0 8px rgba(0, 230, 118, 0); }
      100% { transform: scale(0.95); opacity: 0.8; box-shadow: 0 0 0 0 rgba(0, 230, 118, 0); }
    }