.shell {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 var(--space-16);
}

/* Tablet / iPad: reduce working width by 80px (40px each side) so content is not flush to edges */
@media (min-width: 768px) and (max-width: 1025px) {
  .shell {
    padding-left: 40px;
    padding-right: 40px;
  }
}

.mono {
  font-family: var(--font-mono);
}

.small {
  font-size: var(--fs-12);
}

.muted {
  color: var(--color-muted);
}

.mt8 {
  margin-top: var(--space-8);
}

.mt12 {
  margin-top: var(--space-12);
}

.mt16 {
  margin-top: var(--space-16);
}

.ml8 {
  margin-left: var(--space-8);
}

.w100 {
  width: 100%;
}

.flex {
  display: flex;
}

.gap8 {
  gap: var(--space-8);
}

.align-center {
  align-items: center;
}

.right {
  text-align: right;
}

.row {
  display: grid;
  gap: var(--space-8);
}