Spec Owner Card

---
import type { CompendiumMeta } from '../../../data/types';

export const meta: CompendiumMeta = {
  id: 9,
  slug: 'owner-card',
  name: 'Spec Owner Card',
  category: 'specs-documents',
  subcategory: 'lifecycle',
  pillar: 'do',
  description: 'Spec ownership: an avatar monogram, @handle, role, and last-touched timestamp — the human accountable for this document.',
  spec: `## Intent
Every DoCoDeGo spec has exactly one owner: the human who stands behind the intent. This card surfaces that ownership — initials tile, handle, pillar role (Author / Architect / Gatekeeper / Governor), and the last-touched timestamp.

## Acceptance Criteria
- [ ] Initials avatar tile on accent background
- [ ] @handle in mono
- [ ] Role string drawn from DoCoDeGo pillar vocabulary
- [ ] Timestamp in ISO-ish format
- [ ] Does not expose any contact channel beyond the handle

## Constraints
- Static; no JS
- Theme-aware`,
  tags: ['card', 'badge', 'real-content', 'dark-mode-tested'],
  status: 'stable',
  health: { ics: 100, a11y: 'aa', themed: true, animated: false },
};
---

<article class="w-full bg-paper text-black border-4 border-black shadow-nb-sm">
  <div class="flex items-stretch">
    <div class="bg-do text-black w-16 shrink-0 flex items-center justify-center border-e-4 border-black">
      <span class="font-black text-2xl tracking-tighter">TZ</span>
    </div>
    <div class="flex-1 px-3 py-2 min-w-0">
      <div class="flex items-baseline justify-between gap-2">
        <span class="font-mono text-[11px] font-black uppercase tracking-tight truncate">@author</span>
        <span class="font-mono text-[9px] uppercase tracking-widest opacity-60 shrink-0">OWNER</span>
      </div>
      <div class="text-[11px] leading-snug mt-0.5">The Governor</div>
      <div class="font-mono text-[9px] uppercase tracking-widest opacity-60 mt-1">DO · AUTHOR</div>
    </div>
  </div>
  <footer class="px-3 py-1.5 border-t-2 border-black bg-ink text-paper flex items-baseline justify-between font-mono text-[9px] uppercase tracking-widest">
    <span class="opacity-80">LAST TOUCHED</span>
    <span>2026-05-21 14:32Z</span>
  </footer>
</article>