/* === RESET & BASE === */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  transition: background-color 0.3s ease, color 0.3s ease;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
}

body {
  font-family: system-ui, sans-serif;
  display: flex;
  height: 100vh;
  width: 100vw;
  overflow-x: hidden;
  background-color: var(--bg-body);
  color: var(--text-main);
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* style.css */
#app-loader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: var(--background, #000);
  z-index: 9999;
  transition: none;
}

/* Optional fade-out when dismissed */
#app-loader.fade-out {
  animation: fadeOut 0.3s ease forwards;
}

@keyframes fadeOut {
  to {
    opacity: 0;
    visibility: hidden;
  }
}

#main {
  flex-grow: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.header-content {
  display: flex;
  flex-direction: column;
  gap: 1em;
}