.flex        { display: flex; }
.inline-flex { display: inline-flex; }
.grid        { display: grid; }
.hidden      { display: none; }

.flex-row     { flex-direction: row; }
.flex-col     { flex-direction: column; }
.flex-wrap    { flex-wrap: wrap; }
.flex-nowrap  { flex-wrap: nowrap; }

.flex-1       { flex: 1 1 0%; }
.flex-auto    { flex: 1 1 auto; }
.flex-none    { flex: none; }
.flex-shrink-0 { flex-shrink: 0; }

.justify-start   { justify-content: flex-start; }
.justify-center  { justify-content: center; }
.justify-end     { justify-content: flex-end; }
.justify-between { justify-content: space-between; }

.items-start    { align-items: flex-start; }
.items-center   { align-items: center; }
.items-end      { align-items: flex-end; }
.items-baseline { align-items: baseline; }
.items-stretch  { align-items: stretch; }

.self-start  { align-self: flex-start; }
.self-center { align-self: center; }
.self-end    { align-self: flex-end; }

.gap-0   { gap: 0; }
.gap-1   { gap: var(--space-1); }
.gap-2   { gap: var(--space-2); }
.gap-3   { gap: var(--space-3); }
.gap-4   { gap: var(--space-4); }
.gap-6   { gap: var(--space-6); }
.gap-8   { gap: var(--space-8); }

.mt-0  { margin-top: 0; }
.mt-1  { margin-top: var(--space-1); }
.mt-2  { margin-top: var(--space-2); }
.mt-3  { margin-top: var(--space-3); }
.mt-4  { margin-top: var(--space-4); }
.mt-6  { margin-top: var(--space-6); }
.mt-8  { margin-top: var(--space-8); }

.mb-0  { margin-bottom: 0; }
.mb-1  { margin-bottom: var(--space-1); }
.mb-2  { margin-bottom: var(--space-2); }
.mb-3  { margin-bottom: var(--space-3); }
.mb-4  { margin-bottom: var(--space-4); }
.mb-6  { margin-bottom: var(--space-6); }
.mb-8  { margin-bottom: var(--space-8); }

.mx-auto { margin-left: auto; margin-right: auto; }

.p-0  { padding: 0; }
.p-1  { padding: var(--space-1); }
.p-2  { padding: var(--space-2); }
.p-3  { padding: var(--space-3); }
.p-4  { padding: var(--space-4); }
.p-6  { padding: var(--space-6); }
.p-8  { padding: var(--space-8); }

.py-0  { padding-top: 0; padding-bottom: 0; }
.py-1  { padding-top: var(--space-1); padding-bottom: var(--space-1); }
.py-2  { padding-top: var(--space-2); padding-bottom: var(--space-2); }
.py-3  { padding-top: var(--space-3); padding-bottom: var(--space-3); }
.py-4  { padding-top: var(--space-4); padding-bottom: var(--space-4); }
.py-6  { padding-top: var(--space-6); padding-bottom: var(--space-6); }

.px-0  { padding-left: 0; padding-right: 0; }
.px-2  { padding-left: var(--space-2); padding-right: var(--space-2); }
.px-3  { padding-left: var(--space-3); padding-right: var(--space-3); }
.px-4  { padding-left: var(--space-4); padding-right: var(--space-4); }
.px-6  { padding-left: var(--space-6); padding-right: var(--space-6); }

.pt-0  { padding-top: 0; }
.pt-2  { padding-top: var(--space-2); }
.pt-4  { padding-top: var(--space-4); }
.pb-0  { padding-bottom: 0; }
.pb-2  { padding-bottom: var(--space-2); }
.pb-4  { padding-bottom: var(--space-4); }

.w-full { width: 100%; }
.w-auto { width: auto; }
.min-w-0 { min-width: 0; }
.max-w-sm  { max-width: 24rem; }
.max-w-md  { max-width: 28rem; }
.max-w-lg  { max-width: 32rem; }
.max-w-xl  { max-width: 36rem; }
.max-w-2xl { max-width: 42rem; }
.max-w-content { max-width: var(--content-max-width); }

.text-left   { text-align: left; }
.text-center { text-align: center; }
.text-right  { text-align: right; }

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

.sr-only {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.chain-page {
  display: contents;
}

turbo-frame.chain-page[src]:not([complete]) {
  display: block;
}

@media (min-width: 640px) {
  .sm\:flex      { display: flex; }
  .sm\:grid      { display: grid; }
  .sm\:hidden    { display: none; }
  .sm\:flex-row  { flex-direction: row; }
  .sm\:flex-col  { flex-direction: column; }
  .sm\:gap-3     { gap: var(--space-3); }
  .sm\:gap-4     { gap: var(--space-4); }
  .sm\:gap-6     { gap: var(--space-6); }
}

@media (min-width: 768px) {
  .md\:flex      { display: flex; }
  .md\:grid      { display: grid; }
  .md\:hidden    { display: none; }
  .md\:flex-row  { flex-direction: row; }
  .md\:flex-col  { flex-direction: column; }
  .md\:flex-wrap { flex-wrap: wrap; }
  .md\:gap-3     { gap: var(--space-3); }
  .md\:gap-4     { gap: var(--space-4); }
  .md\:gap-6     { gap: var(--space-6); }
  .md\:gap-8     { gap: var(--space-8); }
  .md\:items-center { align-items: center; }
  .md\:justify-between { justify-content: space-between; }
  .md\:mt-0      { margin-top: 0; }
  .md\:mb-0      { margin-bottom: 0; }
  .md\:p-6       { padding: var(--space-6); }
  .md\:px-6      { padding-left: var(--space-6); padding-right: var(--space-6); }
  .md\:text-left { text-align: left; }
}

@media (min-width: 1024px) {
  .lg\:flex      { display: flex; }
  .lg\:grid      { display: grid; }
  .lg\:hidden    { display: none; }
  .lg\:flex-row  { flex-direction: row; }
  .lg\:gap-4     { gap: var(--space-4); }
  .lg\:gap-6     { gap: var(--space-6); }
  .lg\:gap-8     { gap: var(--space-8); }
  .lg\:p-8       { padding: var(--space-8); }
}

@media (min-width: 1440px) {
  .xl\:gap-8     { gap: var(--space-8); }
  .xl\:p-8       { padding: var(--space-8); }
}

.app-page { width: 100%; }
