/* FONTS */
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('/fonts/IBM-Plex-Mono/ibmplexmono-regular-webfont.woff2') format('woff2'),
       url('/fonts/IBM-Plex-Mono/ibmplexmono-regular-webfont.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Barlow';
  src: url('/fonts/Barlow/barlow-regular-webfont.woff2') format('woff2'),
       url('/fonts/Barlow/barlow-regular-webfont.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}

/* COLORS */
:root {
  --bg-start: #4a331f;      /* warm amber-brown top */
  --bg-end: #2a221b;        /* darker bottom */
  --accent: #e6b36a;        /* glowing amber */
  --text: #e8e6d9;          /* light parchment */
  --green: #8fae9a;         /* retro green */
  --border: #2a221b;
}

/* BASE */
body {
  margin: 0;
  font-family: 'Barlow', sans-serif;
  color: var(--text);
  height: 100vh;
  background: linear-gradient(to bottom, var(--bg-start), var(--bg-end));
  display: flex;
  justify-content: center;
  align-items: center;
}

/* CENTERED MESSAGE */
.center-message {
  text-align: center;
  font-family: 'IBM Plex Mono', monospace;
  animation: fadeIn 2s ease forwards;
  opacity: 0;
}

.center-message h1 {
  margin: 0 0 20px 0;
  font-size: 3em;
  color: var(--accent);
  text-shadow: 0 0 10px rgba(230,179,106,0.8), 0 0 20px rgba(230,179,106,0.4);
}

.center-message p {
  margin: 0 0 40px 0;
  font-size: 1.5em;
  color: var(--text);
  text-shadow: 0 0 3px rgba(0,0,0,0.5);
}

/* ENTER BUTTON */
.enter-btn {
  font-family: 'IBM Plex Mono', monospace;
  color: var(--green);
  text-decoration: none;
  font-size: 1.3em;
  padding: 14px 28px;
  border: 2px solid var(--border);
  border-radius: 6px;
  background: transparent;
  transition: all 0.25s ease;
  display: inline-block;
}

.enter-btn:hover {
  color: var(--accent);
  border-color: var(--accent);
  text-shadow: 0 0 10px rgba(230,179,106,0.8), 0 0 15px rgba(230,179,106,0.5);
  transform: scale(1.1);
}

/* FADE IN */
@keyframes fadeIn {
  0% { opacity: 0; transform: translateY(15px); }
  100% { opacity: 1; transform: translateY(0); }
}