.attribute-box {
    border: solid 1px var(--border-color);
    background-color: var(--field-background-color);
    box-shadow: var(--shadow-small);
    border-radius: 10px;
    text-align: center;
    cursor: pointer;

    .attribute-name {
        cursor: pointer;
        font-weight: 600;
    }

    input {
        border: none;
        outline: none;
        box-shadow: none;
        text-align: center;
        background-color: transparent;
        width: 100%;
        font-size: 1.25rem;
        font-weight: 600;
    }

    input[type="number"]::-webkit-inner-spin-button,
    input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    input[type="number"] {
        -moz-appearance: textfield;
    }

    .attribute-modifier {
        font-size: 2rem;
        font-weight: 700;
    }
}