:root {
  color-scheme: dark;
  --graphite: #0c0f12;
  --porcelain: #f1efe9;
  --silver: #a6aeb7;
  --edge: #606d79;
  font-family: system-ui, sans-serif;
  background: var(--graphite);
  color: var(--porcelain);
}

*, *::before, *::after {
  box-sizing: border-box;
}

body {
  margin: 0;
}

.holding {
  display: grid;
  min-block-size: 100vh;
  min-block-size: 100svh;
  place-items: center;
  padding: clamp(1.5rem, 6vw, 5rem);
}

.identity {
  inline-size: min(100%, 38rem);
  text-align: center;
}

.wordmark {
  position: relative;
  margin: 0;
}

.wordmark img {
  display: block;
  inline-size: 100%;
  block-size: auto;
  filter: brightness(0) invert(1);
}

@supports (mask: url("assets/czarina-folded-lockup.svg") center / contain no-repeat) {
  .wordmark img {
    opacity: 0;
  }

  .wordmark::after {
    position: absolute;
    inset: 0;
    background: currentColor;
    mask: url("assets/czarina-folded-lockup.svg") center / contain no-repeat;
    content: "";
  }
}

.status {
  margin: clamp(1.75rem, 5vw, 3rem) 0 0;
  color: var(--silver);
  font-size: clamp(0.875rem, 1.8vw, 1rem);
  line-height: 1.5;
  letter-spacing: 0.09em;
}

.status::before {
  display: block;
  inline-size: 1.5rem;
  block-size: 1px;
  margin: 0 auto 1.125rem;
  background: var(--edge);
  content: "";
}

@media (forced-colors: active) {
  .wordmark img {
    opacity: 1;
    filter: none;
    background: #fff;
    forced-color-adjust: none;
  }

  .wordmark::after {
    display: none;
  }
}