.visualizer-container {
    position: relative; 
    z-index: 1;
}

#visualizer {
    display: flex;
    align-items: flex-end;
    width: 100%;
    gap: 1px;
}

.bar {
    flex: 1;
    /*background-color: var(--color-primary);*/
    transition: height 0.4s ease;
    border-radius: 1px 1px 0 0;
    background: linear-gradient(0deg,rgba(11, 71, 0, 1) 0%, var(--color-primary) 100%);
}

.visualizer-footer {
    color: var(--color-primary);
    font-size: 15px; /*deliberatly making this fixed*/
    margin: 10px 0;
    display: flex;
    justify-content: space-between;
}

#timer-simulator {
    color: var(--color-primary);
    font-family: "Roboto Mono", monospace;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    font-size: 15px; /*deliberatly making this fixed*/
}