.visible { visibility: visible; }

.absolute { position: absolute; }
.fixed { position: fixed; }
.relative { position: relative; }
.static { position: static; }
.sticky { position: sticky; }

.container { width: 100%; }
@media (min-width: 40rem) { .container { max-width: 40rem; } }
@media (min-width: 48rem) { .container { max-width: 48rem; } }
@media (min-width: 64rem) { .container { max-width: 64rem; } }
@media (min-width: 80rem) { .container { max-width: 80rem; } }
@media (min-width: 96rem) { .container { max-width: 96rem; } }

.mt-2 { margin-top: 0.5rem; }
.mt-4 { margin-top: 1rem; }
.mb-4 { margin-bottom: 1rem; }

.block { display: block; }
.contents { display: contents; }
.flex { display: flex; }
.grid { display: grid; }
.hidden { display: none; }
.inline { display: inline; }

.w-40 { width: 10rem; }

.flex-1 { flex: 1; }

.transform { transform: none; }

.resize { resize: both; }

.flex-wrap { flex-wrap: wrap; }

.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-5 { gap: 1.25rem; }

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.border {
  border-style: solid;
  border-width: 1px;
}

.ring {
  box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000, 0 0 0 1px currentcolor, 0 0 #0000;
}

.blur { filter: blur(8px); }
.invert { filter: invert(100%); }
.filter { filter: none; }

.backdrop-filter {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.transition {
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --u-gradient-from, --u-gradient-via, --u-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.15s;
}

.ease-in { transition-timing-function: cubic-bezier(0.4, 0, 1, 1); }