/*
 * The id.coinductive.ai mark and title on their own. Colours, sizes and
 * the halo are lifted from authentik-theme/coinductive.css so the two pages
 * read as one place. Change them there first.
 */

@font-face {
  font-family: "Geist Pixel Square";
  src: url("/fonts/GeistPixel-Square.d06b08400598.woff2") format("woff2");
  font-weight: 400;
  font-display: block;
}

:root {
  color-scheme: dark;
  --crit-bg: #1d1b20;
  --crit-fg: #e6e1e5;
  --crit-pixel: "Geist Pixel Square", ui-monospace, monospace;
}

* {
  box-sizing: border-box;
  margin: 0;
}

html,
body {
  height: 100%;
}

body {
  display: grid;
  place-items: center;
  padding: 1rem;
  background:
    radial-gradient(ellipse 26rem 24rem at 50% 48%, rgba(63, 116, 224, 0.05), transparent 72%),
    var(--crit-bg);
  color: var(--crit-fg);
}

/* Sits 20px above true centre, same as the sign-in card. */
main {
  margin-bottom: 2.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.mark {
  display: block;
  width: 40px;
  height: 40px;
  margin-bottom: 1.25rem;
}

h1 {
  font-family: var(--crit-pixel);
  font-weight: 400;
  font-size: 26px;
  line-height: 1.2;
}