html {
  min-height: 100%;
  background: var(--ui_color_page_base);
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}

[hidden] {
  display: none !important;
}

body {
  min-height: 100vh;
  padding: var(--ui_surface_gap) 0 1px;
  background: var(--ui_page_background);
  background-attachment: fixed;
  color: var(--ui_color_text_soft);
  font: 400 15px/1.45 var(--ui_font);
}

@media (max-width: 899px) {
  body {
    background-attachment: scroll;
  }
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  color: inherit;
  border: none;
  background: transparent;
}

.ui_scope {
  color: var(--ui_color_text);
  font-family: var(--ui_font);
}

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

.ui_scope button,
.ui_scope input,
.ui_scope select,
.ui_scope textarea {
  font: inherit;
}

.ui_title {
  margin-bottom: 20px;
  color: var(--ui_color_text);
  line-height: 1.15;
}

.ui_text_muted {
  color: var(--ui_color_text_muted);
  margin-bottom: 20px;
}

.ui_error_action {
  margin-top: 15px;
}

.ui_link {
  color: var(--ui_color_text_muted);
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 3px;
  transition: color var(--ui_transition_fast), text-decoration-color var(--ui_transition_fast);
}

.ui_link:hover,
.ui_link:focus-visible {
  color: var(--ui_color_text);
  text-decoration-color: currentColor;
}

[data_copy] {
  padding: 2px 5px;
  margin-left: 3px;
  border-radius: var(--ui_radius_sm);
  cursor: copy;
  transition: background var(--ui_transition_fast);
}

[data_copy]:hover,
[data_copy]:focus-visible {
  outline: 0;
  background: var(--ui_color_surface_hover);
}