/* Composition geometry is local; appearance follows Bootstrap root tokens. */
@layer custom {
    .journal-section {
        padding-block: calc(var(--bs-spacer-12) * 2);
        background: var(--bs-bg-body);
        color: var(--bs-fg-body);
        overflow-wrap: anywhere;
    }
    .journal-section
        :is(div, header, article, aside, footer, figure, li, details, summary) {
        min-width: 0;
    }
    .journal-section :is(h2, h3) {
        margin: 0;
        font-family: var(--bs-heading-font-family);
        font-weight: var(--bs-heading-font-weight);
        line-height: var(--bs-heading-line-height);
    }
    .journal-section__eyebrow {
        margin: 0 0 var(--bs-spacer-4);
        color: var(--bs-primary-fg);
        font-weight: var(--bs-font-weight-semibold);
        font-size: var(--bs-font-size-sm);
    }
    .journal-section__title {
        max-width: 24ch;
        text-wrap: balance;
    }
    .journal-section__intro {
        color: var(--bs-fg-2);
        font-size: var(--bs-font-size-lg);
        margin: var(--bs-spacer-6) 0 0;
        max-width: 52ch;
        white-space: pre-line;
    }
    .journal-section :is(a, summary, [tabindex]):focus-visible {
        outline: var(--bs-focus-ring-width) solid var(--bs-primary-fg);
        outline-offset: var(--bs-spacer-1);
    }
    .journal-section .btn {
        min-height: 44px;
        white-space: normal;
        gap: var(--bs-spacer-3);
    }
    .journal-section__number {
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-sm);
        font-variant-numeric: tabular-nums;
        white-space: nowrap;
        flex-shrink: 0;
        min-width: 2ch;
    }

    .journal-section__opening {
        display: grid;
        gap: var(--bs-spacer-6);
        margin-bottom: var(--bs-spacer-10);
    }
    .journal-section__opening .journal-section__intro {
        margin: 0;
    }
    .journal-section__story {
        display: flex;
        flex-direction: column;
        gap: var(--bs-spacer-6);
    }
    .journal-section__story-title a {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: var(--bs-spacer-4);
        min-height: 44px;
        color: inherit;
        font: inherit;
        padding: 0;
        border: 0;
        text-align: start;
        text-wrap: balance;
    }
    .journal-section__story-title a > span {
        min-width: 0;
    }
    .journal-section__story-title i {
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-xl);
        flex-shrink: 0;
    }
    .journal-section__story-title a:hover {
        color: var(--bs-primary-fg);
    }
    .journal-section__category {
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-sm);
        font-weight: var(--bs-font-weight-semibold);
        margin: 0 0 var(--bs-spacer-3);
    }
    .journal-section__excerpt {
        color: var(--bs-fg-2);
        margin: var(--bs-spacer-4) 0 0;
        max-width: 62ch;
    }
    .journal-section__meta {
        display: flex;
        flex-wrap: wrap;
        gap: var(--bs-spacer-2) var(--bs-spacer-4);
        color: var(--bs-fg-2);
        font-size: var(--bs-font-size-sm);
        margin: var(--bs-spacer-5) 0 0;
    }
    .journal-section__meta > span + span {
        border-inline-start: var(--bs-border-width) solid var(--bs-border-color);
        padding-inline-start: var(--bs-spacer-4);
    }
    .journal-section__media {
        padding: 0;
        border: 0;
        display: block;
        position: relative;
        overflow: hidden;
        background: var(--bs-bg-2);
        border-radius: var(--bs-radius-4);
        aspect-ratio: 16/10;
    }
    .journal-section__media :is(picture, img) {
        display: block;
        width: 100%;
        height: 100%;
    }
    .journal-section__image {
        object-fit: cover;
    }
    .journal-section__art {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: end;
        justify-content: space-between;
        gap: var(--bs-spacer-5);
        padding: var(--bs-spacer-7);
        background: var(--bs-primary-bg-subtle);
        color: var(--bs-primary-fg);
    }
    .journal-section__art i {
        font-size: var(--bs-font-size-3xl);
    }
    .journal-section__art > span {
        font-family: var(--bs-heading-font-family);
        font-size: var(--bs-font-size-5xl);
        line-height: 1;
    }
    .journal-section__closing {
        margin-top: var(--bs-spacer-8);
    }
    .journal-section__topline {
        display: grid;
        gap: var(--bs-spacer-6);
        margin-bottom: var(--bs-spacer-9);
        align-items: end;
    }
    .journal-section__topline .journal-section__opening {
        margin: 0;
    }
    .journal-section__topline .journal-section__closing {
        margin: 0;
    }
    .journal-section__rail {
        display: flex;
        gap: var(--bs-spacer-8);
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: inline proximity;
        scroll-padding-inline: var(--bs-spacer-3);
        padding: var(--bs-spacer-3) var(--bs-spacer-3) var(--bs-spacer-6);
    }
    .journal-section__rail .journal-section__story {
        flex: 0 0 min(88%, 24rem);
        scroll-snap-align: start;
    }
    .journal-section__rail .journal-section__story:only-child {
        flex-basis: 100%;
    }
    .journal-section__rail .journal-section__copy {
        border-top: var(--bs-border-width) solid var(--bs-border-color);
        padding-top: var(--bs-spacer-5);
    }
    .journal-section__desk,
    .journal-section__cover,
    .journal-section__library,
    .journal-section__bulletin,
    .journal-section__spread,
    .journal-section__gallery,
    .journal-section__quick,
    .journal-section__invitation {
        display: grid;
        gap: var(--bs-spacer-8);
    }
    .journal-section__desk .journal-section__story--feature {
        padding-bottom: var(--bs-spacer-8);
        border-bottom: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__desk .journal-section__story--note {
        padding-top: var(--bs-spacer-5);
        border-top: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__navigator {
        border-top: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__navigator .journal-section__story {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        column-gap: var(--bs-spacer-5);
        row-gap: var(--bs-spacer-4);
        padding-block: var(--bs-spacer-7);
        border-bottom: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__navigator .journal-section__media {
        grid-column: 2;
    }
    .journal-section__navigator .journal-section__copy {
        grid-column: 2;
    }
    .journal-section__navigator .journal-section__number {
        grid-row: 1 / span 2;
        font-size: var(--bs-font-size-xl);
    }
    .journal-section__cover
        .journal-section__story--cover
        .journal-section__media {
        padding: 0;
        border: 0;
        display: block;
        aspect-ratio: 24/9;
    }
    .journal-section__cover .journal-section__story--note {
        border-top: var(--bs-border-width) solid var(--bs-border-color);
        padding-top: var(--bs-spacer-6);
    }
    .journal-section__library .journal-section__media {
        aspect-ratio: 4/3;
        border-radius: var(--bs-radius-5);
    }
    .journal-section__library .journal-section__copy {
        padding-bottom: var(--bs-spacer-6);
        border-bottom: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__bulletin .journal-section__story {
        border-top: var(--bs-border-width) solid var(--bs-primary-border);
        padding-top: var(--bs-spacer-6);
    }
    .journal-section__bulletin .journal-section__copy {
        order: 1;
    }
    .journal-section__bulletin .journal-section__media {
        order: 2;
        aspect-ratio: 16/9;
    }
    .journal-section__ledger .journal-section__story {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: var(--bs-spacer-5);
        padding-block: var(--bs-spacer-8);
        border-top: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__ledger .journal-section__media {
        grid-column: 2;
    }
    .journal-section__ledger .journal-section__copy {
        grid-column: 2;
    }
    .journal-section__ledger .journal-section__number {
        grid-row: 1 / span 2;
    }
    .journal-section__spread .journal-section__story--note {
        padding-top: var(--bs-spacer-6);
        border-top: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__gallery .journal-section__media {
        aspect-ratio: 4/3;
        border-radius: var(--bs-radius-5);
    }
    .journal-section__gallery .journal-section__copy {
        position: relative;
        margin: calc(var(--bs-spacer-10) * -1) var(--bs-spacer-4) 0;
        padding: var(--bs-spacer-6);
        border: var(--bs-border-width) solid var(--bs-border-color);
        border-radius: var(--bs-radius-4);
        background: var(--bs-bg-body);
    }
    .journal-section__gallery
        .journal-section__story--text
        .journal-section__copy {
        margin: 0;
    }
    .journal-section--quick {
        background: var(--bs-primary-bg-subtle);
    }
    .journal-section__quick .journal-section__story {
        padding-top: var(--bs-spacer-6);
        border-top: var(--bs-border-width) solid var(--bs-primary-border);
    }
    .journal-section__quick .journal-section__number {
        font-size: var(--bs-font-size-4xl);
        font-family: var(--bs-heading-font-family);
        line-height: 1;
    }
    .journal-section__byline {
        display: flex;
        gap: var(--bs-spacer-4);
        align-items: center;
        color: var(--bs-fg-2);
        font-size: var(--bs-font-size-sm);
        margin: 0;
    }
    .journal-section__initial {
        display: grid;
        place-items: center;
        flex-shrink: 0;
        width: 44px;
        height: 44px;
        background: var(--bs-primary-bg-subtle);
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-lg);
        font-weight: var(--bs-font-weight-semibold);
    }
    .journal-section__notebook .journal-section__story {
        padding-block: var(--bs-spacer-8);
        border-top: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__notebook .journal-section__media {
        aspect-ratio: 16/9;
    }
    .journal-section--invitation {
        background: var(--bs-bg-2);
    }
    .journal-section__invitation .journal-section__story {
        display: grid;
        grid-template-columns: minmax(0, 0.35fr) minmax(0, 1fr);
        align-items: start;
        gap: var(--bs-spacer-5);
        padding-top: var(--bs-spacer-6);
        border-top: var(--bs-border-width) solid var(--bs-border-color);
    }
    .journal-section__invitation .journal-section__media {
        aspect-ratio: 1;
    }
    .journal-section__invitation .journal-section__story--text {
        grid-template-columns: minmax(0, 1fr);
    }
    .journal-section__empty {
        display: grid;
        gap: var(--bs-spacer-7);
        padding-top: var(--bs-spacer-8);
        border-top: var(--bs-border-width) solid var(--bs-primary-border);
    }
    .journal-section__empty-icon {
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-4xl);
    }
    .journal-section__empty .btn {
        margin-top: var(--bs-spacer-7);
    }
    @media (min-width: 768px) {
        .journal-section__library,
        .journal-section__gallery,
        .journal-section__quick {
            grid-template-columns: repeat(
                auto-fit,
                minmax(min(100%, 17rem), 1fr)
            );
        }
        .journal-section__bulletin,
        .journal-section__spread,
        .journal-section__desk,
        .journal-section__cover {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .journal-section__desk .journal-section__story--feature,
        .journal-section__cover .journal-section__story--cover {
            grid-column: 1/-1;
        }
        .journal-section__cover
            .journal-section__story--cover
            .journal-section__copy {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr);
            gap: var(--bs-spacer-3) var(--bs-spacer-8);
        }
        .journal-section__cover
            .journal-section__story--cover
            .journal-section__category {
            grid-column: 1/-1;
        }
        .journal-section__cover
            .journal-section__story--cover
            .journal-section__excerpt {
            margin: 0;
        }
        .journal-section__cover
            .journal-section__story--cover
            .journal-section__meta {
            grid-column: 1/-1;
        }
        .journal-section__notebook .journal-section__story {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 0.4fr);
            align-items: start;
            gap: var(--bs-spacer-5) var(--bs-spacer-8);
        }
        .journal-section__notebook .journal-section__byline {
            grid-column: 1/-1;
        }
        .journal-section__notebook .journal-section__media {
            grid-column: 2;
            grid-row: 2;
        }
        .journal-section__notebook .journal-section__copy {
            grid-column: 1;
            grid-row: 2;
        }
        .journal-section__notebook .journal-section__story--text {
            grid-template-columns: minmax(0, 1fr);
        }
        .journal-section__empty {
            grid-template-columns: auto minmax(0, 1fr);
        }
    }
    @media (min-width: 1024px) {
        .journal-section__opening {
            grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr);
            align-items: end;
            gap: var(--bs-spacer-10);
        }
        .journal-section__topline {
            grid-template-columns: minmax(0, 1fr) auto;
            gap: var(--bs-spacer-10);
        }
        .journal-section__topline .journal-section__opening {
            grid-template-columns: minmax(0, 1fr);
            gap: var(--bs-spacer-6);
        }
        .journal-section__rail .journal-section__story {
            flex-basis: 30%;
        }
        .journal-section__desk
            .journal-section__story--feature:not(
                .journal-section__story--text
            ) {
            display: grid;
            grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
            align-items: center;
            gap: var(--bs-spacer-10);
        }
        .journal-section__cover {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
        .journal-section__ledger .journal-section__story {
            grid-template-columns: auto minmax(0, 1fr) minmax(0, 0.45fr);
            gap: var(--bs-spacer-8);
            align-items: start;
        }
        .journal-section__ledger .journal-section__media {
            grid-column: 3;
            grid-row: 1;
        }
        .journal-section__ledger .journal-section__copy {
            grid-row: 1;
        }
        .journal-section__ledger .journal-section__number {
            grid-row: 1;
        }
        .journal-section__ledger .journal-section__story--text {
            grid-template-columns: auto minmax(0, 1fr);
        }
        .journal-section__invitation {
            grid-template-columns: repeat(3, minmax(0, 1fr));
        }
        .journal-section__invitation .journal-section__story {
            grid-template-columns: minmax(0, 1fr);
        }
        .journal-section__invitation .journal-section__media {
            aspect-ratio: 16/9;
        }
    }
}