@layer tokens {

h1, .h1 { font-size: var(--mr-text-heading-1); }
h2, .h2 { font-size: var(--mr-text-heading-2); }
h3, .h3 { font-size: var(--mr-text-heading-3); }
h4, .h4 { font-size: var(--mr-text-heading-4); }
h5, .h5 { font-size: var(--mr-text-heading-5); }
h6, .h6 { font-size: var(--mr-text-heading-6); }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--mr-font-heading);
    font-weight: var(--mr-weight-semibold);

    line-height: var(--mr-leading-heading);
}

.display-1 { font-size: var(--mr-text-display); }

small, .small { font-size: var(--mr-text-small); }

.mr-caption {
    font-size: var(--mr-text-caption);
    line-height: var(--mr-leading-base);
}

}

:root:root[data-mr-target-size="minimum"],
[data-pv="frame"][data-pv="frame"][data-mr-target-size="minimum"] { --mr-target-min: 1.5rem; }
:root:root[data-mr-target-size="enhanced"],
[data-pv="frame"][data-pv="frame"][data-mr-target-size="enhanced"] { --mr-target-min: 2.75rem; }

@media (prefers-reduced-motion: reduce) {
    :root:root:root,
    [data-ds-brand][data-ds-brand][data-mr-mode] {
        --mr-duration-fast: 0ms;
        --mr-duration-base: 0ms;
        --mr-duration-slow: 0ms;
    }
}
