/* Reset i bazowe ustawienia */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background-color: #000;
  color: #33ff33;
  font-family: 'Courier New', Courier, monospace;
  font-size: 16px;
  line-height: 1.6;
  padding: 40px 20px;
  text-align: left;
}

/* Kontener gry */
.container {
  max-width: 800px;
  margin: 0 auto;
  border: 1px solid #33ff33;
  padding: 30px;
  background-color: #000;
  box-shadow: 0 0 10px #33ff33;
}

/* Nagłówek gry */
h1, h2 {
  color: #33ff33;
  margin-bottom: 20px;
  text-transform: uppercase;
}

/* Przycisk w stylu terminala */
button {
  background-color: #000;
  color: #33ff33;
  border: 1px solid #33ff33;
  padding: 10px 20px;
  margin: 10px 5px 0 0;
  font-family: inherit;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s ease;
}

button:hover {
  background-color: #33ff33;
  color: #000;
}

/* Blok tekstowy/dialogowy */
.block {
  border-left: 4px solid #33ff33;
  padding-left: 15px;
  margin: 20px 0;
}

.npc {
  color: #99ff99;
  font-weight: bold;
}

.system {
  color: #ffcc00;
}

.player {
  color: #ffffff;
  font-weight: bold;
}

/* Podpowiedzi / metadane */
.hint {
  font-size: 0.85rem;
  color: #777;
  font-style: italic;
}

/* Efekt mrugania */
.blink {
  animation: blink 1s steps(2, start) infinite;
}

@keyframes blink {
  to {
    visibility: hidden;
  }
}



/* Efekt wpisywania tekstu litera po literze */
.typewriter-line {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  border-right: 1px solid #33ff33;
  animation: typing 3s steps(40, end), blink-caret 0.7s step-end infinite;
}

@keyframes typing {
  from { width: 0; }
  to { width: 100%; }
}

@keyframes blink-caret {
  50% { border-color: transparent; }
}