@layer blocks {
    .album {
        max-width: 48rem;
    }

    .album > .image {
        max-width: 30rem;
        margin: calc(var(--space-unit) * 1.5) 0;
    }

    .album-list {
        --block-grid-min: 14rem;
    }

    .album-card {
        display: grid;
        align-content: start;
        gap: calc(var(--space-unit) * 0.5);
    }

    .album-card-title,
    .album-promo-title {
        margin: 0;
    }

    .album-meta {
        margin: 0;
        color: var(--tone-muted);
        font-family: var(--font-ui);
        font-size: 0.875rem;
    }

    .album-badges,
    .album-links {
        display: flex;
        flex-wrap: wrap;
        gap: calc(var(--space-unit) * 0.25) calc(var(--space-unit) * 0.75);
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .album-badges li {
        padding: 0 calc(var(--space-unit) * 0.5);
        border: 1px solid var(--tone-border);
        border-radius: var(--radius-control);
        font-family: var(--font-ui);
        font-size: 0.75rem;
    }

    .album-price {
        margin: 0;
        font-family: var(--font-ui);
        font-weight: 600;
    }

    .album-promo {
        display: grid;
        gap: calc(var(--space-unit) * 0.75);
    }

    .album-promo > .image {
        max-width: 20rem;
    }

    .album-promo-text {
        max-width: 40rem;
        margin: 0 0 var(--space-unit);
    }

    .album-tracks {
        margin: 0 0 var(--space-unit);
        padding-left: calc(var(--space-unit) * 1.5);
    }

    .album-tracks li + li {
        margin-top: calc(var(--space-unit) * 0.25);
    }

    .album-track-title {
        font-weight: 600;
    }

    .album-track-type,
    .album-track-credits,
    .album-track-time {
        color: var(--tone-muted);
        font-family: var(--font-ui);
        font-size: 0.875rem;
    }

    .album-track-time {
        font-variant-numeric: tabular-nums;
    }
}
