﻿.rank-graph-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px; /* space between number and graph */
    width: 100%;
}

.small-canvas {
    width: 55px;
    display: inline-block;
    height: 45px;
}

.overall-rank {
    text-align: center; /* center text */
    display: block; /* force block, so spans stack vertically */
}
    .overall-rank.small-text {
        font-size: 14px;
        width:100%;
    }
    .overall-rank.big-text {
        font-size: 30px;
    }

.graph-rank {
    display: inline; /* or inline-block depending on your layout */
}

    /* Alignment modifiers */

    .graph-rank.left {
        text-align: left;
        float: left;
        display: inline;
    }

    .graph-rank.right {
        text-align: right;
        float: right;
        display: inline;
    }

