@font-face {
  font-family: Geist;
  src: url("/assets/Geist-Regular.d8bce822db09.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Geist;
  src: url("/assets/Geist-Medium.b0a0867cda44.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: Geist;
  src: url("/assets/Geist-SemiBold.b1e6a1dd2122.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
:root {
  color-scheme: dark;
  --carbon: #0A0A0A;
  --green: #00B88A;
  --white: #FFFFFF;
  --mint: #D8F8EE;
  --interface-grey: #E8EBEF;
  font-family: Geist, sans-serif;
  color: var(--white);
  background: var(--carbon);
  font-synthesis: none;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  min-block-size: 100vh;
  min-block-size: 100svh;
  display: grid;
  grid-template-rows: 1fr auto;
}
main {
  display: grid;
  place-items: center;
  padding: max(4rem, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) 3rem max(24px, env(safe-area-inset-left));
}
.introduction { inline-size: 100%; max-inline-size: 48rem; text-align: center; }
.brand { display: block; inline-size: min(18rem, 100%); block-size: auto; margin: 0 auto 3rem; }
h1 { margin: 0; font-size: 2.5rem; line-height: 1.2; font-weight: 600; letter-spacing: -0.02em; overflow-wrap: anywhere; }
h1 span { display: block; }
.description { max-inline-size: 32rem; margin: 2rem auto 0; font-size: 1rem; line-height: 1.5; color: var(--mint); }
.status { margin: 3rem 0 0; font-size: .875rem; line-height: 1.428572; font-weight: 500; color: var(--green); }
footer { padding: 1rem 24px max(2rem, env(safe-area-inset-bottom)); text-align: center; color: var(--interface-grey); }
footer small { font-size: .875rem; line-height: 1.428572; }
::selection { background: var(--green); color: var(--carbon); }
a { color: var(--mint); text-underline-offset: .2em; }
a:focus-visible { outline: 2px solid var(--green); outline-offset: 4px; }
@media (min-width: 48rem) {
  main { padding-inline: 3rem; }
  h1 { font-size: 3rem; line-height: 1.166667; }
  .description { font-size: 1.25rem; line-height: 1.5; }
}
@media (min-width: 75rem) {
  h1 { font-size: 4rem; line-height: 1.125; }
}
@media (max-height: 32rem) {
  main { padding-block: 2rem; }
}
