@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&display=swap');

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      user-select: none;
    }

    body {
      background-color: #050510;
      color: #fff;
      font-family: 'Orbitron', sans-serif;
      overflow: hidden;
      width: 100vw;
      height: 100vh;
    }

    #game-canvas {
      display: block;
      width: 100%;
      height: 100%;
    }

    #ui-layer {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 100; /* 修复: 确保 UI 层在 Canvas 之上 */
      pointer-events: none; /* 让点击穿透到 Canvas，除了按钮 */
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
    }

    #ui-layer > * {
      pointer-events: auto;
    }

    #score-board {
      position: absolute;
      top: 20px;
      left: 20px;
      font-size: 1.5rem;
      color: #00f3ff;
      text-shadow: 0 0 10px #00f3ff;
    }

    .hidden {
      display: none !important;
    }

    h1 {
      font-size: 4rem;
      letter-spacing: 5px;
      color: #fff;
      text-shadow: 2px 2px 0px #ff0055, -2px -2px 0px #00f3ff;
      margin-bottom: 0.5rem;
    }

    h2 {
      font-size: 3rem;
      color: #ff0055;
      text-shadow: 0 0 20px #ff0055;
      margin-bottom: 1rem;
    }

    p {
      color: #aaa;
      margin-bottom: 2rem;
      font-size: 1.2rem;
    }

    button {
      background: transparent;
      border: 2px solid #00f3ff;
      color: #00f3ff;
      padding: 15px 40px;
      font-size: 1.5rem;
      font-family: 'Orbitron', sans-serif;
      cursor: pointer;
      text-transform: uppercase;
      transition: all 0.3s ease;
      box-shadow: 0 0 10px rgba(0, 243, 255, 0.2);
      pointer-events: auto; /* 明确指定按钮接收点击 */
    }

    button:hover {
      background: #00f3ff;
      color: #000;
      box-shadow: 0 0 30px rgba(0, 243, 255, 0.8);
    }

    .instructions {
      margin-top: 20px;
      font-size: 0.9rem;
      opacity: 0.7;
      color: #fff;
    }

    /* 简单的故障艺术效果动画 */
    @keyframes glitch {
      0% { transform: translate(0) }
      20% { transform: translate(-2px, 2px) }
      40% { transform: translate(-2px, -2px) }
      60% { transform: translate(2px, 2px) }
      80% { transform: translate(2px, -2px) }
      100% { transform: translate(0) }
    }

    .glitch:hover {
      animation: glitch 0.3s cubic-bezier(.25, .46, .45, .94) both infinite;
    }