/* Shared card styles for Design System preview tiles.
   Cards target ~700×150 (max 400 tall). The asset NAME renders outside
   the card by the system, so no titles inside. Just show the spec. */
@import url('../../colors_and_type.css');

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg-primary);
  font-family: var(--font-sans);
  font-feature-settings: var(--font-feature-settings);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
}
body { padding: 20px 24px; box-sizing: border-box; }
.row { display: flex; align-items: center; gap: 12px; }
.col { display: flex; flex-direction: column; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.eyebrow { font-size: 10px; font-weight: 600; letter-spacing: 0.5px;
           text-transform: uppercase; color: var(--text-tertiary); }
.hint { font-size: 12px; color: var(--text-tertiary); }