* {
      box-sizing: border-box;
    }

    html, body {
      margin: 0;
      padding: 0;
      height: 100%;
      overflow: hidden;
      font-family: Arial, sans-serif;
      background: #000;
    }

    body {
      background: url('/img/fond_11zon.webp') no-repeat center center fixed;
      background-size: cover;
      touch-action: none;
    }

    #startScreen {
      position: absolute;
      inset: 0;
      background-color: rgba(0, 0, 0, 0.9);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      color: white;
      text-align: center;
      padding: 20px;
      z-index: 200;
    }

    #gameTitle {
      font-size: 2.5rem;
      margin-bottom: 15px;
      color: #FF5722;
      text-shadow: 0 0 10px rgba(255, 87, 34, 0.7);
      animation: fadeInDown 1s ease-out forwards;
    }

    #gameSubtitle {
      font-size: 1.2rem;
      margin-bottom: 15px;
      line-height: 1.5;
      animation: fadeInUp 1s ease-out forwards;
    }

    .control-info {
      font-size: 1rem;
      margin: 15px 0;
      animation: fadeIn 1.5s ease-out forwards;
    }

    .btn-container {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin-top: 20px;
      width: 100%;
      max-width: 220px;
    }

    .game-btn {
      padding: 12px 24px;
      font-size: 16px;
      background-color: #FF5722;
      color: white;
      border: none;
      border-radius: 25px;
      cursor: pointer;
      transition: transform 0.3s ease, background-color 0.3s ease;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
      animation: scaleIn 0.6s ease-out forwards;
    }

    .game-btn:hover,
    .game-btn:focus {
      background-color: #E64A19;
      outline: 2px solid #fff;
      transform: scale(1.05);
    }

    .normal-btn {
      animation-delay: 0.4s;
    }

    .accessibility-btn {
      animation-delay: 0.6s;
    }

    @keyframes fadeInDown {
      from {
        opacity: 0;
        transform: translateY(-50px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @keyframes fadeInUp {
      from {
        opacity: 0;
        transform: translateY(20px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @keyframes fadeIn {
      from {
        opacity: 0;
      }

      to {
        opacity: 1;
      }
    }

    @keyframes scaleIn {
      0% {
        transform: scale(0);
        opacity: 0;
      }

      80% {
        transform: scale(1.1);
        opacity: 0.8;
      }

      100% {
        transform: scale(1);
        opacity: 1;
      }
    }