.dashboard {
    gap: 2em;
}
.dashboard:not(:last-child){
    margin-bottom: 2em;
}
@media(max-width: 992px){
    .dashboard{
        margin-top: 4em;
    }
}

.card.rewards,
.card.shadow{
    box-shadow: 0px 0px 80px #00FF803D;
}

.flx-rewards.standart .flx-values,
.flx-rewards.dynamic .column-values{
    flex-direction: row;
    align-items: center;
}
.flx-rewards.standart .flx-values:not(:left){
    justify-content: space-between;
}
.flx-rewards.standart .flx-values.left,
.flx-rewards.dynamic .column-values{
    justify-content: flex-start;
}

@media(min-width: 993px){
    .titleBigBrd + .sublabel{
        border-left-width: 4px;
        padding-left: 1.5em;
    }
}

.card:not(.rewards),
.container > .dflt:not(:empty){
    padding: 2em;
}

/* rewards */
@media(min-width: 1241px){
    .dashboard.ver0 .card.rewards{
        min-width: 54em;
    }
    .dashboard.ver1 .card.rewards{
        flex-basis: 66.25%;
    }
    .flx-rewards.dynamic .card:not(.rewards){
        flex-basis: calc(33.75% - 2em);
        padding: 2.625em 3.25em;
    }
}
@media(min-width: 993px) and (max-width: 1240px){
    .dashboard.ver0 .card.rewards{
        min-width: 43em;
    }
    .dashboard.ver1 .card.rewards{
        flex-basis: 62.25%;
    }
    .flx-rewards.dynamic .card:not(.rewards){
        flex-basis: calc(37.75% - 2em);
        padding: 3em 2em;
    }
}
@media(min-width: 993px){
    .card.rewards{
        padding: 2.625em 3.375em;
    }
    .flx-rewards.dynamic .card.rewards{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }
}
@media(max-width: 992px){
    .card.rewards{
        padding: 2em;
    }
    .flx-rewards.standart .card.rewards{
        margin-top: 2em;
    }
    .flx-rewards.dynamic{
        gap: 2em 0;
    }
}
@media(min-width: 993px){
    .flx-rewards > .titleBig{
        text-align: right;
    }
}
.card.rewards .flx-values:not(:last-child){
    margin-bottom: 2em;
}
@media(min-width: 993px){
    .flx-rewards{
        display: flex;
        flex-direction: row-reverse;
        gap: 2em;
        justify-content: space-between;
    }
    .dashboard.ver0 .flx-rewards{
        align-items: flex-start;
    } 
    .dashboard.ver1 .flx-rewards.standart{
        align-items: center;
    }
    .dashboard.ver1 .flx-rewards.dynamic{
        align-items: stretch;
    } 
}
.flx-rewards .column-values{
    padding-left: 1em;
    border-left: 1px solid var(--color3);
}
.flx-values.left .card-value{
    padding-right: 1rem;
    margin-right: 1rem;
    border-right: 1px solid var(--color3);
}

@media(min-width: 1241px){    
    .rewards-value{
        font-size: 4em;
    }
}
@media(max-width: 992px){
    .rewards-value{
        font-size: 2.6em;
    }
}

@media(min-width: 993px) and (max-width: 1240px){    
    .rewards-value,
    .flx-rewards > .titleBig{
        font-size: 2.8em;
    }
}

@media(min-width: 993px){
    .rewards-usd {
        font-size: 1.5625em;
    }
}
@media(max-width: 992px){
    .rewards-usd {
        font-size: 1.5625em;
    }
}

.flx-rewards.standart .column-values .rewards-meta{
    margin-top: .6em;
}
.flx-rewards.dynamic .column-values{
    margin-top: 1.625em;
}
.flx-rewards.dynamic .column-values .rewards-meta{
    margin-left: .6em;
}

@media(min-width: 1241px){
    .card-value {
        font-size: 2.875em;
    }
}
@media(min-width: 993px) and (max-width: 1240px){
    .card-value {
        font-size: 2.25em;
    }
}
@media(max-width: 992px){
    .card-value {
        font-size: 2em;
    }
}

@media(min-width: 993px){
    .flx-rewards.dynamic .card.rewards .titleBigBrd,
    .card:not(.rewards) .titleBigBrd{
        font-size: 1.875em;
    }
    .card.mini:not(.rewards) .titleBigBrd{
        font-size: 1.5em;
    }
}
@media(max-width: 992px){
    .card:not(.rewards) .titleBigBrd{
        font-size: 1.5em;
    }
}


@media(min-width: 993px){
    .hero-row {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .metrics-row {
        grid-template-columns: 1fr 1fr;
    }    
    .info-row {
        grid-template-columns: 5fr 3fr;
    }
}
@media (min-width: 1241px) {
    .stats-row {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media (max-width: 1240px) {
    .stats-row {
        grid-template-columns: repeat(2, 1fr);
    }
}

.detail-row {
    gap: 1em;
    align-items: center;
}
