html, body { height: 100%; }

html, body {
  margin: 0;
  padding: 0;
  /* FULL shorthand in one go so nothing gets wiped later */
  background:
    linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.55)),
    url('../img/anvilbg2.png') center / cover no-repeat fixed;
  background-color: var(--bg); /* fallback color behind image */
  color: var(--text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

.container {
    width: min(1120px, 92vw);
    margin-inline: auto;
}

.muted {
    color: var(--muted);
}

.small {
    font-size: .9rem;
}

.btn {
    display: inline-block;
    padding: 10px 16px;
    border: 1px solid #2a2f37;
    border-radius: 12px;
    box-shadow: var(--shadow);
}

.btn--small {
    padding: 6px 10px;
    border-radius: 10px;
}

.btn--primary {
    background: var(--primary);
    border-color: transparent;
    color: white;
}

.btn--ghost {
    background: transparent;
}