*
    box-sizing: border-box
    user-select: none

body
    background: #111
    font-family: sans-serif
    display: flex
    justify-content: center
    align-items: center
    height: 100vh
    margin: 0
    padding: 0

    main
        min-width: 500px
        background: #222
        color: #fff
        box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1)
        padding: 1.5rem
        border-radius: 1rem

        h1
            font-size: 3rem
            font-weight: bold
            text-align: center
            margin: 0
            margin-bottom: 1rem

        #value
            background: #191919
            box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1)
            border-radius: 0.5rem
            font-size: 2rem
            font-weight: bold
            text-align: center
            padding: 1rem
            margin: 0
            margin-bottom: 1rem

        #controls
            display: flex
            margin: 0 -0.25rem

            button
                flex: 1
                background: coral
                color: white
                box-shadow: none
                border: none
                border-radius: 0.5rem
                font-weight: bold
                font-size: 1.25rem
                text-align: center
                cursor: pointer
                padding: 0.5rem 1rem
                margin: 0.25rem
                transition: background 0.2s ease-in-out

                &:hover
                    background: darken(coral, 5%)
                    color: #fff
