.container-WINy09md {
    align-items: center;
    display: grid;
    flex-flow: row nowrap;
    gap: 4px 8px;
    grid-template-areas: "logo titleContainer price" "logo shortName valueAndUnit";
    grid-template-columns: 36px 1fr min-content
}

@media (min-width:768px) {
    .container-WINy09md {
        grid-template-areas: "logo titleContainer price valueAndUnit" "logo shortName change valueAndUnit";
        grid-template-columns: 36px 10fr 2fr 24%
    }
}

.containerInversionFields-WINy09md {
    grid-template-areas: "logo titleContainer valueAndUnit" "logo shortName price"
}

@media (min-width:768px) {
    .containerInversionFields-WINy09md {
        grid-template-areas: "logo titleContainer price valueAndUnit" "logo shortName change valueAndUnit"
    }
}

.containerInversionFields-WINy09md.containerWithoutLogo-WINy09md {
    grid-template-areas: "titleContainer valueAndUnit" "shortName price"
}

@media (min-width:768px) {
    .containerNoChange-WINy09md {
        grid-template-areas: "logo titleContainer price valueAndUnit" "logo shortName price valueAndUnit";
        grid-template-columns: 36px 10fr 2fr 24%
    }
}

.containerWithoutLogo-WINy09md {
    grid-template-areas: "titleContainer price" "shortName valueAndUnit";
    grid-template-columns: 1fr min-content
}

@media (min-width:768px) {
    .containerWithoutLogo-WINy09md {
        grid-template-areas: "titleContainer price valueAndUnit" "shortName change valueAndUnit";
        grid-template-columns: 4fr 2fr 24%
    }
}

.containerNoData-WINy09md {
    grid-template-areas: "logo titleContainer noData" "logo shortName noData";
    grid-template-columns: 36px auto auto
}

@media (min-width:768px) {
    .containerNoData-WINy09md {
        grid-template-areas: "logo titleContainer noData" "logo shortName noData";
        grid-template-columns: 36px 1fr 1fr
    }
}

.containerWithoutLogo-WINy09md.containerNoData-WINy09md {
    grid-template-areas: "titleContainer noData" "shortName noData";
    grid-template-columns: auto auto
}

@media (min-width:768px) {
    .containerWithoutLogo-WINy09md.containerNoData-WINy09md {
        grid-template-areas: "titleContainer noData" "shortName noData";
        grid-template-columns: 1fr 1fr
    }
}

.change-WINy09md {
    display: none;
    grid-area: change;
    text-align: right
}

@media (min-width:768px) {
    .change-WINy09md {
        display: inline-block
    }
}

.priceContainer-WINy09md {
    font-family: -apple-system, BlinkMacSystemFont, Trebuchet MS, Roboto, Ubuntu, sans-serif;
    font-feature-settings: "tnum" on, "lnum" on;
    font-style: normal;
    grid-area: price;
    --ui-lib-typography-font-size: 16px;
    font-size: var(--ui-lib-typography-font-size);
    font-weight: 400;
    --ui-lib-typography-line-height: 24px;
    line-height: var(--ui-lib-typography-line-height)
}

@media (min-width:768px) {
    .priceContainer-WINy09md {
        font-family: -apple-system, BlinkMacSystemFont, Trebuchet MS, Roboto, Ubuntu, sans-serif;
        font-feature-settings: "tnum" on, "lnum" on;
        --ui-lib-typography-line-height: 24px;
        line-height: var(--ui-lib-typography-line-height);
        --ui-lib-typography-font-size: 16px;
        font-size: var(--ui-lib-typography-font-size);
        font-style: normal;
        font-weight: 500
    }
}