.blueprint__main,
.blueprint__side {
  display: contents;
}

.blueprint__checks {
  order: 1;
}

.blueprint__editor-block {
  order: 2;
}

.blueprint__preview {
  order: 3;
  min-inline-size: 0;
}

.blueprint__editor,
.blueprint__list,
.blueprint__items,
.blueprint__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-inline-size: 0;
}

.blueprint__editor {
  gap: var(--space-toolbar);
}

.blueprint__body {
  gap: var(--space-field);
}

.blueprint__body--card {
  padding: var(--space-card);
}

.blueprint__items {
  gap: var(--space-field);
}

.blueprint__item-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-inline-size: 0;
}

.blueprint__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-field);
  align-items: start;
}

.blueprint__item {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-field);
  padding-block-start: var(--space-field);
  border-block-start: 1px solid var(--color-border-light);
  min-inline-size: 0;
}

.blueprint__warns:empty,
.blueprint__body > .blueprint__badges:empty,
.blueprint__item [data-read]:empty,
.blueprint__item .shell__note:empty {
  display: none;
}

.blueprint__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

.blueprint__actions:not(:has(> :not([hidden]))) {
  display: none;
}

.blueprint__more {
  display: flex;
  margin-inline-start: auto;
}

.blueprint__warns {
  display: grid;
  gap: var(--space-1);
}

.blueprint__open {
  color: var(--color-warning);
  font-weight: var(--weight-semibold);
}

.blueprint__lines {
  display: grid;
  gap: var(--space-check);
  margin: 0;
  padding: 0;
  list-style: none;
}

.blueprint__lines {
  padding-inline-start: var(--space-4);
  list-style: disc;
}

@media (min-width: 1280px) {
  .blueprint {
    grid-template-columns: minmax(0, var(--content-narrow)) 20rem;
    justify-content: center;
    column-gap: var(--space-section);
  }

  .blueprint--start {
    grid-template-columns: minmax(0, var(--content-narrow));
    justify-content: center;
  }

  .blueprint > .page-head {
    grid-column: 1 / -1;
  }

  .blueprint__main {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: var(--space-section);
  }

  .blueprint__side {
    position: sticky;
    inset-block-start: var(--space-4);
    display: grid;
    align-content: start;
    gap: var(--space-grid);
    max-block-size: calc(100dvh - var(--space-8));
    margin-inline: calc(var(--space-3) * -1);
    padding-inline: var(--space-3);
    overflow-y: auto;
  }
}

@media (max-width: 768px) {
  .blueprint__row {
    grid-template-columns: minmax(0, 1fr);
  }
}

.blueprint__badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.blueprint__list {
  gap: var(--space-grid);
}

.blueprint__heading {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: var(--space-2);
}

.blueprint__heading > .sortable__grip {
  margin-block-start: var(--space-2);
}