/* default (light mode) values */
:root {
  --bg-color: #ffffff;
  --text-color: #000000;
}

html.darkmode {
  --bg-color: #121212;
  --text-color: #e0e0e0;
}

body {
  background-color: var(--bg-color);
  color: var(--text-color);
  transition: background-color 2s, color 2.4s;
  font-family: 'Iosevka', 'Consolas', 'DejaVu Sans Mono', monospace;
  text-align: center;
  padding: 2rem;
}

/* dark mode overrides */
body.darkmode {
  --bg-color: #121212;
  --text-color: #e0e0e0;
}

/* Dark mode link styles */
html.darkmode a:link {
  color: #80bfff; /* lighter blue for visibility on dark bg */
}
html.darkmode a:visited {
  color: #d080ff;
}
html.darkmode a:hover {
  color: #ff9999;
}
html.darkmode a:active {
  color: #ffff66;
}
/* Animation cancelling */
.no-transition {
  transition: none;
}

.platform-art {
  font-family: 'Iosevka','Consolas', 'DejaVu Sans Mono', monospace;
  font-size: 1.8vw;
  text-align: center;
  white-space: pre;


  /* Center the entire <pre> block */
  margin: 0 auto;
  display: block;

  /* Optional aesthetic tweaks */
  line-height: 1;
  max-width: 100%;
}

  /* Autosizer */
@media (max-width: 800px) {
  .platform-art {
    font-size: 3vw;
  }
}

@media (max-width: 500px) {
  .platform-art {
    font-size: 3.6vw;
  }
}
@font-face {
  font-family: 'Iosevka';
  src: url('/_fonts/iosevka.woff2') format('woff2'); /* Modern browsers */
  font-weight: normal;
  font-style: normal;
}