.ds-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: var(--background-accent);
  min-height: 48px;
  z-index: 1150;
  gap: 16px;

  .header-left {
    display: flex;
    align-items: center;
    gap: 8px;

    .app-title {
      > .title {
        @include label-large-2;
        color: var(--text-light-fixed);
        margin-right: 8px;
      }

      > .subtitle {
        @include label-large-1;
        color: var(--text-light-fixed);
      }
    }
  }

  .header-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: var(--spacing-150);
    gap: 8px;
  }

  .header-corpus {
    display: flex;
    align-items: center;
    gap: 16px;
  }
}

@media (max-width: 768px) {
  .ds-header {
    .header-left {
      gap: 4px;

      .app-title {
        .title {
          display: none;
        }
        .subtitle {
          @include label-medium-2;
        }
      }
    }
  }
}

@media (max-width: 767px) {
  .ds-header {
    .header-left {
      gap: 4px;

      .app-title {
        .title {
          display: none;
        }
        .subtitle {
          @include label-medium-2;
        }
      }
    }
  }
}