@layer utilities {
  /* Text - Semantic sizes (Apple HIG) */
  .txt-caption { font-size: var(--text-caption); }
  .txt-footnote { font-size: var(--text-footnote); }
  .txt-subhead { font-size: var(--text-subhead); }
  .txt-callout { font-size: var(--text-callout); }
  .txt-body { font-size: var(--text-body); }
  .txt-title-3 { font-size: var(--text-title-3); }
  .txt-title-2 { font-size: var(--text-title-2); }
  .txt-title-1 { font-size: var(--text-title-1); }
  .txt-large-title { font-size: var(--text-large-title); }

  /* Line heights */
  .leading-tight { line-height: var(--leading-tight); }
  .leading-snug { line-height: var(--leading-snug); }
  .leading-normal { line-height: var(--leading-normal); }
  .leading-relaxed { line-height: var(--leading-relaxed); }

  .txt-light { color: var(--color-ink-light); }
  .txt-center { text-align: center; }
  .txt-bold { font-weight: 600; }

  /* Spacing */
  .mt-0 { margin-top: 0; }
  .mt-half { margin-top: var(--block-space-half); }
  .mt-1 { margin-top: var(--block-space); }
  .mt-2 { margin-top: var(--block-space-double); }
  .mb-0 { margin-bottom: 0; }
  .mb-half { margin-bottom: var(--block-space-half); }
  .mb-1 { margin-bottom: var(--block-space); }
  .mb-2 { margin-bottom: var(--block-space-double); }

  .pt-0 { padding-top: 0; }
  .pt-1 { padding-top: var(--block-space); }
  .pt-2 { padding-top: var(--block-space-double); }
  .pb-0 { padding-bottom: 0; }
  .pb-1 { padding-bottom: var(--block-space); }
  .pb-2 { padding-bottom: var(--block-space-double); }

  /* Layout */
  .flex { display: flex; }
  .flex-col { flex-direction: column; }
  .flex-wrap { flex-wrap: wrap; }
  .items-center { align-items: center; }
  .justify-between { justify-content: space-between; }
  .justify-center { justify-content: center; }
  .gap-1 { gap: var(--inline-space); }
  .gap-2 { gap: var(--inline-space-double); }

  .grid { display: grid; }

  /* Visibility */
  .hidden { display: none; }
  .visually-hidden,
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  /* Width */
  .w-full { width: 100%; }
  .max-w-prose { max-width: 65ch; }

  /* Status dots (colored indicators) */
  .status-dot {
    width: var(--status-dot-size);
    height: var(--status-dot-size);
    border-radius: 50%;
    display: inline-block;
  }

  .status-dot--alive {
    background-color: var(--color-positive);
    box-shadow: 0 0 8px 2px var(--color-link-50);
    animation: status-pulse 2s ease-in-out infinite;
  }

  .status-dot--dead {
    background-color: var(--color-negative);
  }

  .status-dot--tbd {
    background-color: var(--color-warning);
  }

  @keyframes status-pulse {
    0%, 100% {
      opacity: 1;
      box-shadow: 0 0 8px 2px var(--color-link-50);
    }
    50% {
      opacity: 0.7;
      box-shadow: 0 0 12px 4px var(--color-overlay);
    }
  }

  /* Status legend */
  .status-legend {
    display: flex;
    gap: var(--block-space-1-25);
    margin: var(--block-space-1-25) 0;
    padding: var(--block-space-half);
    background-color: var(--color-ink-lightest);
    border-radius: var(--border-radius);
    flex-wrap: wrap;
  }

  .status-legend__item {
    display: flex;
    align-items: center;
    gap: var(--block-space-half);
    font-size: var(--text-footnote);
  }

  @media (max-width: 640px) {
    .status-legend {
      flex-direction: column;
      gap: var(--block-space-half);
    }
  }

  /* Divider with text */
  .form-divider {
    display: flex;
    align-items: center;
    gap: var(--inline-space);
    margin: var(--block-space) 0;
    color: var(--color-ink-light);
    font-size: var(--text-footnote);

    &::before,
    &::after {
      content: "";
      flex: 1;
      height: 1px;
      background: var(--color-border);
    }
  }
}