/* PTW component primitives. Phase 1 is isolated: only .ds-* classes are styled. */

@layer ptw-design-system {
  :where(.ds-button, .ds-input, .ds-textarea, .ds-select, .ds-search, .ds-card, .ds-table,
    .ds-badge, .ds-dialog, .ds-drawer, .ds-toast, .ds-pagination, .ds-tabs, .ds-timeline,
    .ds-toolbar, .ds-empty-state, .ds-loading, .ds-avatar, .ds-logo, .ds-toggle) {
    box-sizing: border-box;
    font-family: var(--ds-font-family);
    letter-spacing: var(--ds-letter-spacing-default);
  }

  .ds-display, .ds-h1, .ds-h2, .ds-h3, .ds-h4, .ds-body, .ds-secondary, .ds-caption, .ds-overline {
    margin: 0;
    color: var(--ds-color-text);
    font-family: var(--ds-font-family);
  }
  .ds-display { font-size: var(--ds-font-size-display); font-weight: var(--ds-font-weight-bold); line-height: var(--ds-line-height-display); }
  .ds-h1 { font-size: var(--ds-font-size-h1); font-weight: var(--ds-font-weight-bold); line-height: var(--ds-line-height-heading); }
  .ds-h2 { font-size: var(--ds-font-size-h2); font-weight: var(--ds-font-weight-bold); line-height: var(--ds-line-height-heading); }
  .ds-h3 { font-size: var(--ds-font-size-h3); font-weight: var(--ds-font-weight-medium); line-height: var(--ds-line-height-heading); }
  .ds-h4 { font-size: var(--ds-font-size-h4); font-weight: var(--ds-font-weight-medium); line-height: var(--ds-line-height-heading); }
  .ds-body { font-size: var(--ds-font-size-body); font-weight: var(--ds-font-weight-regular); line-height: var(--ds-line-height-body); }
  .ds-secondary { color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-secondary); line-height: var(--ds-line-height-body); }
  .ds-caption { color: var(--ds-color-text-muted); font-size: var(--ds-font-size-caption); line-height: var(--ds-line-height-compact); }
  .ds-overline { color: var(--ds-color-text-muted); font-size: var(--ds-font-size-overline); font-weight: var(--ds-font-weight-medium); letter-spacing: var(--ds-letter-spacing-overline); line-height: var(--ds-line-height-compact); text-transform: uppercase; }

  :where(.ds-button, .ds-input, .ds-textarea, .ds-select, .ds-search__input, .ds-tab, .ds-pagination__button, .ds-toggle__control):focus-visible {
    outline: var(--ds-border-strong) solid var(--ds-color-focus-ring);
    outline-offset: var(--ds-border-strong);
  }

  .ds-button {
    align-items: center;
    background: var(--ds-color-primary);
    border: var(--ds-border-thin) solid var(--ds-color-primary);
    border-radius: var(--ds-radius-2);
    color: var(--ds-color-text-inverse);
    cursor: pointer;
    display: inline-flex;
    font-size: var(--ds-font-size-secondary);
    font-weight: var(--ds-font-weight-medium);
    gap: var(--ds-space-2);
    height: var(--ds-control-height-md);
    justify-content: center;
    line-height: var(--ds-line-height-compact);
    padding: 0 var(--ds-space-4);
    position: relative;
    transition: background-color var(--ds-transition-interactive), border-color var(--ds-transition-interactive), box-shadow var(--ds-transition-interactive), transform var(--ds-transition-interactive);
    white-space: nowrap;
  }
  .ds-button:hover { background: var(--ds-color-primary-hover); border-color: var(--ds-color-primary-hover); }
  .ds-button:active { background: var(--ds-color-primary-pressed); border-color: var(--ds-color-primary-pressed); transform: translateY(var(--ds-motion-nudge)); }
  .ds-button:disabled, .ds-button[aria-disabled="true"] { background: var(--ds-color-disabled-surface); border-color: var(--ds-color-border); color: var(--ds-color-disabled-text); cursor: not-allowed; transform: none; }
  .ds-button--secondary { background: var(--ds-color-surface-1); border-color: var(--ds-color-border-strong); color: var(--ds-color-text); }
  .ds-button--secondary:hover { background: var(--ds-color-hover); border-color: var(--ds-color-primary); }
  .ds-button--ghost, .ds-button--toolbar { background: transparent; border-color: transparent; color: var(--ds-color-text-secondary); }
  .ds-button--ghost:hover, .ds-button--toolbar:hover { background: var(--ds-color-hover); border-color: transparent; color: var(--ds-color-text); }
  .ds-button--danger { background: var(--ds-color-danger); border-color: var(--ds-color-danger); }
  .ds-button--danger:hover { background: var(--ds-color-danger-600); border-color: var(--ds-color-danger-600); }
  .ds-button--success { background: var(--ds-color-success); border-color: var(--ds-color-success); }
  .ds-button--success:hover { background: var(--ds-color-success-600); border-color: var(--ds-color-success-600); }
  .ds-button--icon { padding: 0; width: var(--ds-control-height-md); }
  .ds-button--toolbar { height: var(--ds-control-height-sm); padding: 0 var(--ds-space-3); }
  .ds-button--sm { height: var(--ds-control-height-sm); padding-inline: var(--ds-space-3); }
  .ds-button--lg { height: var(--ds-control-height-lg); padding-inline: var(--ds-space-5); }
  .ds-button--loading { color: transparent; pointer-events: none; }
  .ds-button--loading::after { animation: ds-spin var(--ds-duration-slow) var(--ds-easing-linear) infinite; border: var(--ds-button-spinner-border) solid var(--ds-color-text-inverse); border-right-color: transparent; border-radius: var(--ds-radius-pill); content: ""; height: var(--ds-icon-1); inset: 0; margin: auto; position: absolute; width: var(--ds-icon-1); }
  .ds-split-button { display: inline-flex; }
  .ds-split-button > .ds-button:first-child { border-radius: var(--ds-radius-2) 0 0 var(--ds-radius-2); }
  .ds-split-button > .ds-button:last-child { border-left-color: var(--ds-color-primary-hover); border-radius: 0 var(--ds-radius-2) var(--ds-radius-2) 0; padding-inline: var(--ds-space-3); }

  .ds-field { display: grid; gap: var(--ds-space-2); }
  .ds-field__label { color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-secondary); font-weight: var(--ds-font-weight-medium); line-height: var(--ds-line-height-compact); }
  .ds-field__required { color: var(--ds-color-danger); }
  .ds-field__help, .ds-field__error { color: var(--ds-color-text-muted); font-size: var(--ds-font-size-caption); line-height: var(--ds-line-height-compact); margin: 0; }
  .ds-field__error { color: var(--ds-color-danger); }
  .ds-input, .ds-select, .ds-textarea, .ds-search__input {
    appearance: none;
    background: var(--ds-color-surface-1);
    border: var(--ds-border-thin) solid var(--ds-color-border-strong);
    border-radius: var(--ds-radius-3);
    color: var(--ds-color-text);
    font-size: var(--ds-font-size-body);
    line-height: var(--ds-line-height-body);
    min-height: var(--ds-control-height-md);
    padding: 0 var(--ds-space-3);
    transition: background-color var(--ds-transition-interactive), border-color var(--ds-transition-interactive), box-shadow var(--ds-transition-interactive);
    width: 100%;
  }
  .ds-input:hover, .ds-select:hover, .ds-textarea:hover, .ds-search__input:hover { border-color: var(--ds-color-primary); }
  .ds-input:disabled, .ds-select:disabled, .ds-textarea:disabled, .ds-search__input:disabled { background: var(--ds-color-disabled-surface); color: var(--ds-color-disabled-text); cursor: not-allowed; }
  .ds-input[aria-invalid="true"], .ds-select[aria-invalid="true"], .ds-textarea[aria-invalid="true"] { border-color: var(--ds-color-danger); }
  .ds-textarea { min-height: calc(var(--ds-control-height-md) * 2); padding-block: var(--ds-space-3); resize: none; }
  .ds-select { background-position: right var(--ds-space-3) center; padding-right: var(--ds-space-7); }
  .ds-search { align-items: center; display: flex; position: relative; }
  .ds-search__icon { border: var(--ds-border-strong) solid var(--ds-color-text-muted); border-radius: var(--ds-radius-pill); height: var(--ds-search-icon-size); left: var(--ds-space-3); pointer-events: none; position: absolute; top: var(--ds-space-3); width: var(--ds-search-icon-size); }
  .ds-search__icon::after { background: var(--ds-color-text-muted); content: ""; height: var(--ds-border-strong); left: var(--ds-search-handle-offset); position: absolute; top: var(--ds-search-handle-offset); transform: rotate(45deg); transform-origin: left center; width: var(--ds-search-handle-length); }
  .ds-search__input { padding-left: var(--ds-space-8); }
  .ds-search__clear { position: absolute; right: var(--ds-space-1); }

  .ds-card { background: var(--ds-color-surface-1); border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-4); box-shadow: var(--ds-elevation-surface-1); color: var(--ds-color-text); overflow: hidden; }
  .ds-card__header, .ds-card__body, .ds-card__footer { padding: var(--ds-space-5); }
  .ds-card__header { align-items: center; border-bottom: var(--ds-border-thin) solid var(--ds-color-border); display: flex; gap: var(--ds-space-3); justify-content: space-between; }
  .ds-card__footer { align-items: center; border-top: var(--ds-border-thin) solid var(--ds-color-border); display: flex; gap: var(--ds-space-3); justify-content: flex-end; }
  .ds-card--interactive { cursor: pointer; transition: border-color var(--ds-transition-interactive), box-shadow var(--ds-transition-interactive), transform var(--ds-transition-interactive); }
  .ds-card--interactive:hover { border-color: var(--ds-color-primary); box-shadow: var(--ds-elevation-surface-2); transform: translateY(calc(var(--ds-motion-nudge) * -1)); }
  .ds-card--danger { border-color: var(--ds-color-danger); }
  .ds-card--success { border-color: var(--ds-color-success); }
  .ds-card--dashboard { background: var(--ds-color-surface-2); box-shadow: var(--ds-elevation-surface-0); }
  .ds-card--empty { background: transparent; border-style: dashed; box-shadow: none; }

  .ds-table-shell { border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-3); overflow: auto; }
  .ds-table { border-collapse: collapse; color: var(--ds-color-text); font-size: var(--ds-font-size-secondary); min-width: 100%; width: 100%; }
  .ds-table th { background: var(--ds-color-surface-2); color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-caption); font-weight: var(--ds-font-weight-medium); height: var(--ds-table-header-height); padding: 0 var(--ds-space-4); text-align: left; text-transform: uppercase; }
  .ds-table td { border-top: var(--ds-border-thin) solid var(--ds-color-border); height: var(--ds-table-row-height); padding: var(--ds-space-2) var(--ds-space-4); vertical-align: middle; }
  .ds-table tbody tr { background: var(--ds-color-surface-1); transition: background-color var(--ds-transition-interactive); }
  .ds-table tbody tr:hover { background: var(--ds-color-hover); }
  .ds-table tbody tr[aria-selected="true"] { background: var(--ds-color-selected); }
  .ds-table__sort { align-items: center; background: transparent; border: 0; color: inherit; cursor: pointer; display: inline-flex; font: inherit; gap: var(--ds-space-1); padding: 0; }
  .ds-table__actions { align-items: center; display: flex; gap: var(--ds-space-1); justify-content: flex-end; }

  .ds-badge { align-items: center; background: var(--ds-status-draft-bg); border-radius: var(--ds-radius-pill); color: var(--ds-status-draft-text); display: inline-flex; font-size: var(--ds-font-size-caption); font-weight: var(--ds-font-weight-medium); gap: var(--ds-space-1); min-height: var(--ds-badge-min-height); padding: var(--ds-space-1) var(--ds-space-3); white-space: nowrap; }
  .ds-badge__icon { height: var(--ds-icon-1); width: var(--ds-icon-1); }
  .ds-badge--review { background: var(--ds-status-review-bg); color: var(--ds-status-review-text); }
  .ds-badge--client { background: var(--ds-status-client-bg); color: var(--ds-status-client-text); }
  .ds-badge--ready { background: var(--ds-status-ready-bg); color: var(--ds-status-ready-text); }
  .ds-badge--active { background: var(--ds-status-active-bg); color: var(--ds-status-active-text); }
  .ds-badge--suspended { background: var(--ds-status-suspended-bg); color: var(--ds-status-suspended-text); }
  .ds-badge--ended { background: var(--ds-status-ended-bg); color: var(--ds-status-ended-text); }
  .ds-badge--closed { background: var(--ds-status-closed-bg); color: var(--ds-status-closed-text); }
  .ds-badge--rejected { background: var(--ds-status-rejected-bg); color: var(--ds-status-rejected-text); }
  .ds-badge--cancelled { background: var(--ds-status-cancelled-bg); color: var(--ds-status-cancelled-text); }

  .ds-backdrop { align-items: center; background: var(--ds-color-overlay); display: flex; inset: 0; justify-content: center; padding: var(--ds-space-6); position: fixed; z-index: var(--ds-z-modal); }
  .ds-dialog { background: var(--ds-color-surface-modal); border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-5); box-shadow: var(--ds-elevation-modal); color: var(--ds-color-text); max-height: calc(100dvh - var(--ds-space-9)); max-width: var(--ds-dialog-max-width); overflow: auto; width: min(100%, var(--ds-dialog-max-width)); }
  .ds-dialog--sm { max-width: var(--ds-dialog-width-sm); }
  .ds-dialog--lg { max-width: var(--ds-dialog-width-lg); }
  .ds-dialog__header, .ds-dialog__body, .ds-dialog__footer { padding: var(--ds-space-6); }
  .ds-dialog__header { align-items: center; border-bottom: var(--ds-border-thin) solid var(--ds-color-border); display: flex; gap: var(--ds-space-3); justify-content: space-between; }
  .ds-dialog__footer { border-top: var(--ds-border-thin) solid var(--ds-color-border); display: flex; gap: var(--ds-space-3); justify-content: flex-end; }
  .ds-drawer { background: var(--ds-color-surface-drawer); box-shadow: var(--ds-elevation-drawer); color: var(--ds-color-text); height: 100dvh; max-width: var(--ds-drawer-max-width); overflow: auto; padding: var(--ds-space-6); position: fixed; right: 0; top: 0; width: min(92vw, var(--ds-drawer-max-width)); z-index: var(--ds-z-drawer); }

  .ds-toast-region { bottom: var(--ds-space-6); display: grid; gap: var(--ds-space-2); position: fixed; right: var(--ds-space-6); width: min(var(--ds-toast-max-width), calc(100vw - var(--ds-space-7))); z-index: var(--ds-z-toast); }
  .ds-toast { align-items: flex-start; background: var(--ds-color-surface-floating); border: var(--ds-border-thin) solid var(--ds-color-border); border-left: var(--ds-accent-border) solid var(--ds-color-info); border-radius: var(--ds-radius-3); box-shadow: var(--ds-elevation-floating); color: var(--ds-color-text); display: flex; gap: var(--ds-space-3); padding: var(--ds-space-4); }
  .ds-toast--success { border-left-color: var(--ds-color-success); }
  .ds-toast--warning { border-left-color: var(--ds-color-warning); }
  .ds-toast--danger { border-left-color: var(--ds-color-danger); }
  .ds-tooltip { background: var(--ds-color-neutral-900); border-radius: var(--ds-radius-1); color: var(--ds-color-text-inverse); font-size: var(--ds-font-size-caption); max-width: var(--ds-tooltip-max-width); padding: var(--ds-space-2) var(--ds-space-3); position: absolute; z-index: var(--ds-z-tooltip); }

  .ds-pagination { align-items: center; display: flex; gap: var(--ds-space-2); justify-content: space-between; min-height: var(--ds-control-height-lg); }
  .ds-pagination__button { align-items: center; background: transparent; border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-2); color: var(--ds-color-text-secondary); cursor: pointer; display: inline-flex; height: var(--ds-control-height-sm); justify-content: center; min-width: var(--ds-control-height-sm); padding-inline: var(--ds-space-3); }
  .ds-pagination__button:hover { background: var(--ds-color-hover); border-color: var(--ds-color-primary); color: var(--ds-color-text); }
  .ds-pagination__button:disabled { color: var(--ds-color-disabled-text); cursor: not-allowed; }
  .ds-pagination__status { color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-secondary); }

  .ds-tabs { align-items: center; border-bottom: var(--ds-border-thin) solid var(--ds-color-border); display: flex; gap: var(--ds-space-1); overflow-x: auto; }
  .ds-tab { background: transparent; border: 0; border-bottom: var(--ds-border-strong) solid transparent; color: var(--ds-color-text-secondary); cursor: pointer; font-size: var(--ds-font-size-secondary); font-weight: var(--ds-font-weight-medium); min-height: var(--ds-control-height-md); padding: 0 var(--ds-space-3); white-space: nowrap; }
  .ds-tab:hover { color: var(--ds-color-text); }
  .ds-tab[aria-selected="true"] { border-bottom-color: var(--ds-color-primary); color: var(--ds-color-primary); }
  .ds-toolbar { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ds-space-2); min-height: var(--ds-control-height-md); }

  .ds-filter-bar { align-items: end; display: flex; flex-wrap: wrap; gap: var(--ds-space-3); }
  .ds-filter-bar > .ds-search { flex: 1 1 var(--ds-filter-search-min-width); min-width: var(--ds-search-min-width); }
  .ds-filter-bar > .ds-field { flex: 0 1 var(--ds-filter-control-min-width); min-width: var(--ds-filter-control-min-width); }
  .ds-filter-bar > .ds-button, .ds-filter-bar > .ds-toolbar { flex: 0 0 auto; }

  .ds-header-card, .ds-section { color: var(--ds-color-text); display: flex; gap: var(--ds-space-5); justify-content: space-between; }
  .ds-header-card { align-items: center; padding: var(--ds-space-5) 0; }
  .ds-header-card__copy, .ds-section__header > div:first-child { min-width: 0; }
  .ds-header-card__copy > :first-child, .ds-section__header > div:first-child > :first-child { margin-top: 0; }
  .ds-header-card__copy > :last-child, .ds-section__header > div:first-child > :last-child { margin-bottom: 0; }
  .ds-header-card__actions, .ds-section__actions { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ds-space-2); }
  .ds-section { display: block; }
  .ds-section__header { align-items: center; display: flex; gap: var(--ds-space-4); justify-content: space-between; margin-bottom: var(--ds-space-4); }
  .ds-section__body { min-width: 0; }
  .ds-divider { border: 0; border-top: var(--ds-border-thin) solid var(--ds-color-border); margin: var(--ds-space-4) 0; }
  .ds-divider--vertical { border-left: var(--ds-border-thin) solid var(--ds-color-border); border-top: 0; height: 100%; margin: 0 var(--ds-space-4); width: 0; }

  .ds-metric-card { align-items: flex-start; background: var(--ds-color-surface-2); border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-3); color: var(--ds-color-text); display: flex; gap: var(--ds-space-3); min-height: var(--ds-metric-min-height); padding: var(--ds-space-4); }
  .ds-metric-card > .ds-icon { color: var(--ds-color-primary); flex: 0 0 auto; font-size: var(--ds-font-size-h3); }
  .ds-metric-card__content { display: grid; gap: var(--ds-space-1); min-width: 0; }
  .ds-metric-card__value { font-size: var(--ds-font-size-h2); line-height: var(--ds-line-height-tight); }
  .ds-metric-card__trend { color: var(--ds-color-success); font-size: var(--ds-font-size-caption); font-weight: var(--ds-font-weight-medium); }
  .ds-chart-card { background: transparent; border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-3); color: var(--ds-color-text); overflow: hidden; }
  .ds-chart-card__header { align-items: flex-start; display: flex; gap: var(--ds-space-4); justify-content: space-between; padding: var(--ds-space-5); }
  .ds-chart-card__header h3 { margin: 0; }
  .ds-chart-card__header p { margin: var(--ds-space-1) 0 0; }
  .ds-chart-card__actions, .ds-chart-card__legend { align-items: center; display: flex; flex-wrap: wrap; gap: var(--ds-space-2); }
  .ds-chart-card__body { min-height: var(--ds-chart-min-height); padding: 0 var(--ds-space-5) var(--ds-space-5); }
  .ds-company-identity { align-items: center; display: flex; gap: var(--ds-space-4); min-width: 0; padding: var(--ds-space-3) 0; }
  .ds-company-logo { align-items: center; background: var(--ds-color-surface-2); border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-2); display: inline-flex; flex: 0 0 auto; height: var(--ds-company-logo-height); justify-content: center; overflow: hidden; padding: var(--ds-space-1); width: var(--ds-company-logo-width); }
  .ds-company-logo img { display: block; height: 100%; max-height: 100%; max-width: 100%; object-fit: contain; width: 100%; }
  .ds-company-logo__fallback { align-items: center; color: var(--ds-color-primary); display: inline-flex; font-size: var(--ds-font-size-h3); font-weight: var(--ds-font-weight-semibold); justify-content: center; }
  .ds-company-identity__copy { display: grid; gap: var(--ds-space-1); min-width: 0; }
  .ds-company-identity__name { font-size: var(--ds-font-size-h4); max-width: 24ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ds-company-identity__role { color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-caption); }
  .ds-wizard__list { align-items: flex-start; display: flex; gap: var(--ds-space-2); list-style: none; margin: 0; overflow-x: auto; padding: 0; }
  .ds-wizard__step { flex: 1 1 0; min-width: var(--ds-wizard-min-width); }
  .ds-wizard__button { background: transparent; border: 0; border-bottom: var(--ds-border-strong) solid var(--ds-color-border); color: var(--ds-color-text-secondary); cursor: pointer; font: inherit; min-height: var(--ds-control-height-lg); padding: var(--ds-space-2) var(--ds-space-3); text-align: left; width: 100%; }
  .ds-wizard__step.is-current .ds-wizard__button { border-bottom-color: var(--ds-color-primary); color: var(--ds-color-primary); font-weight: var(--ds-font-weight-semibold); }
  .ds-wizard__step.is-complete .ds-wizard__button { color: var(--ds-color-success); }
  .ds-wizard__button:disabled { color: var(--ds-color-disabled-text); cursor: not-allowed; }
  .ds-wizard__button:focus-visible { outline: var(--ds-border-strong) solid var(--ds-color-focus-ring); outline-offset: calc(var(--ds-border-strong) * -1); }
  .ds-dialog--delete .ds-dialog__header { border-bottom-color: var(--ds-color-danger); }
  .ds-dialog--delete .ds-dialog__header h2 { color: var(--ds-color-danger-600); }
  .ds-dialog--confirmation .ds-dialog__header { border-bottom-color: var(--ds-color-primary); }

  .ds-timeline { list-style: none; margin: 0; padding: 0; }
  .ds-timeline__item { display: grid; gap: var(--ds-space-1) var(--ds-space-3); grid-template-columns: var(--ds-icon-4) minmax(0, 1fr) auto; padding: var(--ds-space-3) 0; position: relative; }
  .ds-timeline__item:not(:last-child)::after { background: var(--ds-color-border); content: ""; height: calc(100% - var(--ds-icon-4)); left: calc(var(--ds-icon-4) / 2); position: absolute; top: calc(var(--ds-icon-4) + var(--ds-space-1)); width: var(--ds-border-thin); }
  .ds-timeline__marker { align-items: center; background: var(--ds-color-surface-1); border: var(--ds-border-strong) solid var(--ds-color-primary); border-radius: var(--ds-radius-pill); color: var(--ds-color-primary); display: flex; grid-row: span 2; height: var(--ds-icon-4); justify-content: center; width: var(--ds-icon-4); z-index: 1; }
  .ds-timeline__title { color: var(--ds-color-text); font-size: var(--ds-font-size-secondary); font-weight: var(--ds-font-weight-medium); }
  .ds-timeline__time, .ds-timeline__meta { color: var(--ds-color-text-muted); font-size: var(--ds-font-size-caption); }

  .ds-choice { align-items: flex-start; color: var(--ds-color-text); cursor: pointer; display: flex; font-size: var(--ds-font-size-secondary); gap: var(--ds-space-2); min-height: var(--ds-touch-target-min); padding-block: var(--ds-space-2); }
  .ds-choice input { accent-color: var(--ds-color-primary); height: var(--ds-icon-3); margin: 0; width: var(--ds-icon-3); }
  .ds-toggle { align-items: center; display: inline-flex; gap: var(--ds-space-2); }
  .ds-toggle__control { appearance: none; background: var(--ds-color-neutral-300); border: 0; border-radius: var(--ds-radius-pill); cursor: pointer; height: var(--ds-toggle-height); position: relative; transition: background-color var(--ds-transition-interactive); width: var(--ds-toggle-width); }
  .ds-toggle__control::after { background: var(--ds-color-neutral-0); border-radius: var(--ds-radius-pill); box-shadow: var(--ds-shadow-xs); content: ""; height: var(--ds-toggle-thumb-size); left: var(--ds-toggle-thumb-offset); position: absolute; top: var(--ds-toggle-thumb-offset); transition: transform var(--ds-transition-interactive); width: var(--ds-toggle-thumb-size); }
  .ds-toggle__control:checked { background: var(--ds-color-primary); }
  .ds-toggle__control:checked::after { transform: translateX(var(--ds-toggle-checked-offset)); }

  .ds-avatar { align-items: center; background: var(--ds-color-primary-50); border-radius: var(--ds-radius-pill); color: var(--ds-color-primary-700); display: inline-flex; font-size: var(--ds-font-size-secondary); font-weight: var(--ds-font-weight-medium); height: var(--ds-control-height-md); justify-content: center; overflow: hidden; width: var(--ds-control-height-md); }
  .ds-avatar img { height: 100%; object-fit: cover; width: 100%; }
  .ds-logo { align-items: center; background: var(--ds-color-surface-2); border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-2); display: inline-flex; height: var(--ds-company-logo-height); justify-content: center; overflow: hidden; padding: var(--ds-space-1); width: var(--ds-company-logo-width); }
  .ds-logo img { height: 100%; max-height: 100%; max-width: 100%; object-fit: contain; width: 100%; }

  .ds-empty-state { align-items: center; color: var(--ds-color-text-secondary); display: flex; flex-direction: column; gap: var(--ds-space-3); justify-content: center; min-height: var(--ds-empty-min-height); padding: var(--ds-space-7); text-align: center; }
  .ds-empty-state__icon { color: var(--ds-color-text-muted); height: var(--ds-icon-6); width: var(--ds-icon-6); }
.ds-loading { display: grid; gap: var(--ds-space-3); }

/* Shared permit workspace primitives. */
.ds-permit-workspace { display: flex; min-width: 0; flex-direction: column; gap: var(--ds-space-4); }
.ds-permit-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--ds-space-3) var(--ds-space-6); align-items: center; }
.ds-permit-header__title { min-width: 0; }
.ds-permit-header__heading { margin: 0; color: var(--ds-color-text); font-size: var(--ds-font-size-h1); line-height: 1.15; }
.ds-permit-header__description { margin: var(--ds-space-1) 0 0; color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-body); }
.ds-permit-header__rig { display: inline-flex; margin-top: var(--ds-space-2); color: var(--ds-color-text-muted); font-size: var(--ds-font-size-caption); }
.ds-permit-header__right { display: flex; align-items: center; justify-content: flex-end; gap: var(--ds-space-3); }
.ds-permit-header__actions { display: flex; gap: var(--ds-space-2); }
.ds-permit-header .ds-permit-toolbar { grid-column: 1 / -1; }
.ds-permit-toolbar { display: flex; min-width: 0; align-items: center; gap: var(--ds-space-2); }
.ds-permit-summary { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-space-2); }
.ds-permit-summary__item { display: inline-flex; align-items: baseline; gap: var(--ds-space-1); color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-caption); }
.ds-permit-summary__item strong { color: var(--ds-color-text); font-size: var(--ds-font-size-secondary); font-variant-numeric: tabular-nums; }
.ds-permit-summary__item.is-warning strong { color: var(--ds-color-warning); }
.ds-permit-summary__item.is-danger strong { color: var(--ds-color-danger); }
.ds-permit-summary__item.is-success strong { color: var(--ds-color-success); }
.ds-permit-workspace__list { display: flex; min-height: 0; flex-direction: column; gap: var(--ds-space-2); }
.ds-permit-workspace__pagination { display: flex; justify-content: center; }
.ds-permit-table { display: grid; min-width: 0; }
.ds-permit-table__header { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); align-items: center; min-height: 38px; padding-inline: var(--ds-space-4); color: var(--ds-color-text-muted); background: var(--ds-color-surface-2); font-size: var(--ds-font-size-caption); font-weight: var(--ds-font-weight-medium); text-transform: uppercase; }
.ds-permit-validity { display: grid; gap: var(--ds-space-1); color: var(--ds-color-text-secondary); }
.ds-permit-validity small { color: var(--ds-color-text-muted); font-size: var(--ds-font-size-caption); }
.ds-permit-validity strong { color: var(--ds-color-text); font-size: var(--ds-font-size-secondary); }
.ds-permit-validity.is-danger strong { color: var(--ds-color-danger); }
.ds-permit-pagination { display: flex; align-items: center; justify-content: center; gap: var(--ds-space-3); }
.ds-permit-widget { display: grid; gap: var(--ds-space-3); min-width: 0; padding: var(--ds-space-4); border: var(--ds-border-thin) solid var(--ds-color-border); border-radius: var(--ds-radius-3); background: var(--ds-color-surface-1); }
.ds-permit-widget__header { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-3); }
.ds-permit-widget__copy { min-width: 0; }
.ds-permit-widget__copy h3 { margin: 0; }
.ds-permit-widget__copy span { display: block; margin-top: var(--ds-space-1); }
.ds-permit-widget__summary { min-height: 20px; }
.ds-permit-widget__list { display: grid; gap: var(--ds-space-2); min-width: 0; }
.ds-permit-row__main { display: grid; grid-template-columns: minmax(140px, .8fr) minmax(260px, 1.5fr) minmax(150px, .9fr) minmax(150px, .8fr) auto; gap: var(--ds-space-4); align-items: center; }
.ds-permit-row__primary, .ds-permit-row__secondary, .ds-permit-row__status, .ds-permit-row__validity, .ds-permit-row__action { min-width: 0; }
@media (max-width: 767px) {
  .ds-permit-header { grid-template-columns: 1fr; }
  .ds-permit-header__right { justify-content: flex-start; }
  .ds-permit-header .ds-permit-toolbar { grid-column: auto; }
  .ds-permit-toolbar { flex-wrap: wrap; }
  .ds-permit-row__main { grid-template-columns: minmax(0, 1fr) auto; gap: var(--ds-space-2); }
  .ds-permit-row__status { grid-column: 1; }
  .ds-permit-row__validity { grid-column: 1; }
  .ds-permit-row__action { grid-column: 2; grid-row: 1 / span 4; }
}
  .ds-skeleton { animation: ds-pulse 1.2s var(--ds-easing-standard) infinite alternate; background: var(--ds-color-surface-3); border-radius: var(--ds-radius-2); min-height: var(--ds-control-height-md); }
  .ds-error-state { background: var(--ds-color-danger-50); border: var(--ds-border-thin) solid var(--ds-color-danger); border-radius: var(--ds-radius-3); color: var(--ds-color-danger-600); padding: var(--ds-space-4); }

  @keyframes ds-spin { to { transform: rotate(360deg); } }
  @keyframes ds-pulse { to { opacity: 0.55; } }

  @media (max-width: 767px) {
    .ds-filter-bar { align-items: stretch; flex-direction: column; }
    .ds-filter-bar > .ds-search, .ds-filter-bar > .ds-field { flex-basis: auto; width: 100%; }
    .ds-header-card { align-items: flex-start; flex-direction: column; gap: var(--ds-space-3); }
    .ds-company-logo { height: var(--ds-company-logo-height-mobile); width: var(--ds-company-logo-width-mobile); }
    .ds-company-identity__name { font-size: var(--ds-font-size-body); }
    .ds-section__header { align-items: flex-start; flex-direction: column; }
    .ds-backdrop { align-items: flex-end; padding: 0; }
    .ds-dialog { border-radius: var(--ds-radius-5) var(--ds-radius-5) 0 0; max-height: 92dvh; max-width: none; width: 100%; }
    .ds-dialog__header, .ds-dialog__body, .ds-dialog__footer { padding: var(--ds-space-4); }
    .ds-dialog__footer { flex-direction: column-reverse; }
    .ds-dialog__footer .ds-button { width: 100%; }
    .ds-toast-region { bottom: var(--ds-space-4); left: var(--ds-space-4); right: var(--ds-space-4); width: auto; }
    .ds-pagination__status { text-align: center; }
  }

  @media (prefers-reduced-motion: reduce) {
    :where(.ds-button, .ds-input, .ds-textarea, .ds-select, .ds-card--interactive, .ds-table tbody tr,
      .ds-toggle__control, .ds-toggle__control::after) { scroll-behavior: auto; transition-duration: 1ms; }
    .ds-skeleton, .ds-button--loading::after { animation-duration: 1ms; animation-iteration-count: 1; }
  }
}
