@keyframes flap {
	  0%,100% { background-position:   0   0; }
	  50%      { background-position: -64px 0; }
	}
	
	@keyframes bgPan {
	  from { background-position: 0 0; }
	  to   { background-position: 512px 512px; }
	}
		
	body {
      /*background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('grass.webp') center/cover no-repeat;*/
	  background: url('bg.jpg') center/cover no-repeat;
	  background-position:fixed;
	  /* animuj przesuwanie tła w pętli */
      font-family: 'Press Start 2P', cursive;
      color: #fff;
      margin: 0;
      display: flex;
      align-items: center;
      justify-content: center;
    }
	
    /* Alert animation */
    #mc-alert {
	  display: none;
      background: #5fa031;
      border: 4px solid #1a5900;
      padding: 1rem 2rem;
      box-shadow: inset -3px -3px 0 #2a2a2a, inset 3px 3px 0 #6c6c6c;
      font-family: 'Press Start 2P', cursive;
      color: #fff;
      opacity: 0;
      pointer-events: none;
      z-index: 3;
      border-radius: 0.5rem;
      animation: fadeInOut 5s ease forwards;
    }
	
	
    #mc-info {
      position: absolute;
      top: 20px; left: 50%; transform: translateX(-50%);
      background: #5fa031;
      border: 4px solid #1a5900;
      padding: 1rem 2rem;
      box-shadow: inset -3px -3px 0 #2a2a2a, inset 3px 3px 0 #6c6c6c;
      font-family: 'Press Start 2P', cursive;
      color: #fff;
      opacity: 0;
      pointer-events: none;
      z-index: 3;
      border-radius: 0.5rem;
      animation: fadeInOut 5s ease forwards;
    }
	
	
	.mc-style{
      background: #5fa031;
      border: 4px solid #1a5900;
      box-shadow: inset -3px -3px 0 #2a2a2a, inset 3px 3px 0 #6c6c6c;
      font-family: 'Press Start 2P', cursive;
      color: #fff;
      opacity: 0;
      pointer-events: none;
      border-radius: 0.5rem;		
	}
	
    @keyframes fadeInOut {
      0%   { opacity: 0; }
      10%  { opacity: 1; }
      90%  { opacity: 1; }
      100% { opacity: 0; }
    }
    /* Main content panel - Minecraft GUI style */
    .content {
      position: relative; z-index: 2;
      text-align: center;
      padding: 2rem;
      background: rgba(28,28,28,0.9);
      border: 8px solid #4c4c4c;
      box-shadow: inset -4px -4px 0 #1a1a1a, inset 4px 4px 0 #6c6c6c;
    }
    .content h1 { font-size: 1.2rem; margin-bottom: 0.5rem; }
    .content p { font-size: 0.8rem; margin-bottom: 1rem; }
    .content h2 { font-size: 1rem; margin-top: 0.5rem; }
    /* Countdown boxes */
    .countdown { display: flex; justify-content: center; gap: 0.3rem; margin: 1rem 0; }
    .countdown div {
      background: rgba(20,20,20,0.9);
      padding: 0.5rem;
      border: 4px solid #4c4c4c;
      box-shadow: inset -2px -2px 0 #1a1a1a, inset 2px 2px 0 #6c6c6c;
      font-size: 0.8rem;
    }
    /* Minecraft-style button */
    .mc-btn {
      display: inline-block; padding: 0.6rem 1.2rem;
      background: #5fa031; border: 4px solid #1a5900;
      text-transform: uppercase; text-shadow: 1px 1px #000;
      font-size: 0.8rem; box-shadow: inset -3px -3px 0 #2a2a2a, inset 3px 3px 0 #6c6c6c;
      cursor: pointer; margin-left: 0.5rem;
    }
    .mc-btn:hover { background: #7fcf4f; }
    /* Email input styling */
    .input-group .form-control {
      background: rgba(20,20,20,0.8);
      border: 4px solid #4c4c4c;
      box-shadow: inset -2px -2px 0 #1a1a1a, inset 2px 2px 0 #6c6c6c;
      color: #fff; font-size: 0.8rem; padding: 0.6rem;
    }
    .input-group .form-control:focus {
      outline: none;
      box-shadow: inset -2px -2px 0 #1a1a1a, inset 2px 2px 0 #6c6c6c;
    }
    /* Calc input styling */
    .calc-group {
      display: flex; justify-content: center; align-items: center; gap: 1rem; margin-top: 1rem;
    }
    .calc-group input {
      width: 120px;
      background: rgba(20,20,20,0.8);
      border: 4px solid #4c4c4c;
      box-shadow: inset -2px -2px 0 #1a1a1a, inset 2px 2px 0 #6c6c6c;
      color: #fff; font-size: 0.8rem; padding: 0.6rem;
      text-align: center;
    }