Javascript try 在 JSS 中使用具有类似函数格式的 CSS 语句，但出现错误

import { createUseStyles } from 'react-jss'
import React, { useState } from 'react';

const useStyles = createUseStyles({
    button: {
        '&hover': {
            transform: translateY(0.5)
        }
    },
    
    clickButton: {
        background: '#b60000',
        transform: translateY(0.5)
    }
})

function Button() {

    const [button, toggleButton] = useState(useStyles.button);

    return (
        <div>
            <svg width="900" height="600">
                <circle cx="120" cy="120" r="150" stroke="grey" stroke-width="3" fill="grey"/>
                <circle cx="120" cy="120" r="100" stroke="red" stroke-width="3" fill="red" className={button} onClick={() => toggleButton(useStyles.clickButton)}/>
            </svg>
        </div>
    )
}

export default Button

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>