text: import { createUseStyles } from 'react-jss';
  
  export default createUseStyles({
    app: {
      display: 'flex',
      flexDirection: 'column',
      width: '100%',
      height: '100%',
      justifyContent: 'start',
      alignItems: 'center',
      backgroundColor: '#0f0f0f',
      fontFamily: 'monospace',
    },
    colorSwatchContainer: {
      display: 'flex',
      flexWrap: 'wrap',
    },
    colorSwatch: {
      display: 'flex',
      justifyContent: 'center',
      alignItems: 'center',
      margin: '0.5rem',
      padding: 0,
      width: '25px',
      height: '25px',
      outline: 'none',
      border: 'none',
      cursor: 'pointer',
      color: 'white',
    },
    clearButton: {
      display: 'flex',
      justifyContent: 'center',
      alignItems: 'center',
      margin: '0.5rem',
      padding: 0,
      height: '25px',
      outline: 'none',
      border: 'none',
      cursor: 'pointer',
      color: '#666',
      width: '50px',
      backgroundColor: '#fff',
    },
    chatSwatch: {
      fontSize: '.8rem',
      color: '#555',
      display: 'flex',
      flexDirection: 'column',
      justifyContent: 'space-between',
      backgroundColor: 'white',
      padding: '.5rem',
    },
    swatchContainer: {
      margin: '0 0 4px 0',
    },
  });
  