@layer patterns {
  .workspace-header {
    min-height: calc(var(--touch-target) + var(--space-6));
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-4);
    padding: var(--space-5) var(--space-4) var(--space-4);
    border-bottom: 1px solid var(--border-default);
  }

  .workspace-header-main {
    min-width: 0;
    display: grid;
    gap: var(--space-3);
  }

  .workspace-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-3);
  }

  .workspace-title-row h1 {
    margin: 0;
    font-size: var(--type-workbench-title);
    font-weight: 650;
  }

  .workspace-meta {
    color: var(--text-muted);
    font-family: var(--font-mono);
    font-size: var(--type-workbench-meta);
    text-transform: uppercase;
  }

  .workspace-navigation .tabs {
    min-height: var(--control-height);
    border-bottom: 0;
  }

  .workspace-navigation .tabs > button {
    min-height: var(--control-height);
  }

  .workspace-header-actions {
    display: flex;
    align-items: center;
    gap: var(--space-2);
  }

  .workspace-toolbar {
    min-height: calc(var(--touch-target) + var(--space-4));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    padding: var(--space-2) var(--space-4);
    border-bottom: 1px solid var(--border-default);
  }

  .workspace-toolbar-primary,
  .workspace-toolbar-secondary {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: var(--space-2);
  }

  .workspace-toolbar-primary {
    flex: 1;
  }

  .workspace-section-header {
    min-height: var(--touch-target);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    border-bottom: 1px solid var(--border-default);
  }

  .workspace-section-header h2 {
    margin: 0;
    font-size: var(--type-workbench-section);
  }

  @media (max-width: 767px) {
    .workspace-header {
      min-height: auto;
      align-items: center;
      padding: var(--space-4);
    }

    .workspace-header-actions {
      flex: 0 0 auto;
    }

    .workspace-navigation .tabs,
    .workspace-navigation .tabs > button {
      min-height: var(--touch-target);
    }

    .workspace-toolbar {
      align-items: stretch;
      flex-direction: column;
      padding: var(--space-3) var(--space-4);
    }

    .workspace-toolbar-primary,
    .workspace-toolbar-secondary {
      width: 100%;
    }
  }
}