{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "curio-base",
  "type": "registry:lib",
  "title": "Base",
  "description": "Design tokens, animations and shared types used by every curio component.",
  "categories": [
    "base"
  ],
  "files": [
    {
      "path": "registry/curio/curio.css",
      "type": "registry:file",
      "target": "app/curio.css",
      "content": "/*\n  curio: tokens + animations shared by every component.\n  override any --curio-* variable to match your site.\n  dark values apply under .dark or [data-theme=\"dark\"] on any ancestor.\n*/\n\n:root,\n.light,\n[data-theme=\"light\"] {\n  --curio-bg: #ffffff;\n  --curio-fg: #09090b;\n  --curio-muted: #71717a;\n  --curio-surface: #ffffff;\n  --curio-border: #e4e4e7;\n  --curio-chip: #f4f4f5;\n  --curio-accent: #18181b;\n  --curio-on-accent: #fafafa;\n}\n\n.dark,\n[data-theme=\"dark\"] {\n  --curio-bg: #09090b;\n  --curio-fg: #fafafa;\n  --curio-muted: #a1a1aa;\n  --curio-surface: #18181b;\n  --curio-border: #27272a;\n  --curio-chip: #27272a;\n  --curio-accent: #fafafa;\n  --curio-on-accent: #18181b;\n}\n\n/* map tiles: light by default, dark tiles inside a dark theme */\n.curio-tiles-dark { display: none; }\n:is(.dark, [data-theme=\"dark\"]) .curio-tiles-light { display: none; }\n:is(.dark, [data-theme=\"dark\"]) .curio-tiles-dark { display: block; }\n/* a light section inside a dark page */\n:is(.dark, [data-theme=\"dark\"]) :is(.light, [data-theme=\"light\"]) .curio-tiles-light { display: block; }\n:is(.dark, [data-theme=\"dark\"]) :is(.light, [data-theme=\"light\"]) .curio-tiles-dark { display: none; }\n\n/* inline link chip */\n.curio-chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  padding: 0.1rem 0.45rem;\n  line-height: 1.2;\n  background: var(--curio-chip);\n  color: var(--curio-fg);\n  white-space: nowrap;\n  transition: background-color 120ms ease, color 120ms ease;\n}\n.curio-chip:hover,\n.curio-chip:focus-visible,\n.curio-chip[data-active=\"true\"] {\n  background: var(--curio-accent);\n  color: var(--curio-on-accent);\n  outline: none;\n}\n\n@keyframes curio-spin { to { transform: rotate(360deg); } }\n@keyframes curio-eq { 0%, 100% { height: 3px; } 50% { height: 11px; } }\n@keyframes curio-pulse { 0% { transform: scale(0.4); opacity: 0.5; } 100% { transform: scale(1.6); opacity: 0; } }\n@keyframes curio-blink { 50% { opacity: 0; } }\n@keyframes curio-wave { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(0.35); } }\n@keyframes curio-fade { 0%, 100% { opacity: 1; } 50% { opacity: 0.2; } }\n\n.curio-spin { animation: curio-spin 6s linear infinite; }\n.curio-eq-bar { width: 2px; height: 3px; background: currentColor; animation: curio-eq 0.9s ease infinite; }\n.curio-pulse { animation: curio-pulse 2.2s ease-out infinite; }\n.curio-blink { animation: curio-blink 1s steps(1) infinite; }\n.curio-wave-bar { transform-origin: center; animation: curio-wave 1.1s ease-in-out infinite; }\n.curio-fade { animation: curio-fade 0.7s ease-in-out infinite; }\n\n@media (prefers-reduced-motion: reduce) {\n  .curio-eq-bar, .curio-pulse, .curio-blink, .curio-wave-bar, .curio-fade { animation: none !important; }\n}\n"
    },
    {
      "path": "registry/curio/lib/types.ts",
      "type": "registry:lib",
      "target": "components/curio/lib/types.ts",
      "content": "export type Track = {\n  title: string\n  artist: string\n  album?: string\n  /** album art url */\n  art?: string\n  /** where clicking the track goes */\n  url?: string\n  isPlaying?: boolean\n  /** ms timestamp of when it was last played */\n  playedAt?: number | null\n}\n\nexport type Project = {\n  name: string\n  description: string\n  url: string\n  year: string\n  tags?: string[]\n  /** screenshot url, used by the visual layouts */\n  image?: string\n  status?: 'live' | 'archived'\n}\n\nexport type ThemeOption = {\n  /** shown as the step's label */\n  label: string\n  /** a colour that represents the option (swatches, gradient) */\n  swatch?: string\n  /** an accent colour for the option (swatches) */\n  accent?: string\n}\n\nexport function timeAgo(ms: number) {\n  const s = Math.max(1, Math.round((Date.now() - ms) / 1000))\n  if (s < 60) return `${s}s ago`\n  const m = Math.round(s / 60)\n  if (m < 60) return `${m}m ago`\n  const h = Math.round(m / 60)\n  if (h < 24) return `${h}h ago`\n  return `${Math.round(h / 24)}d ago`\n}\n\nexport function trackStatus(t: Track) {\n  if (t.isPlaying) return 'Listening now'\n  return `Last played${t.playedAt ? ` ${timeAgo(t.playedAt)}` : ''}`\n}\n"
    }
  ]
}