/* The direct-board shell owns physical rolling behavior. The strict historical
   layout keeps its original contract below. Native authoring uses natural-size
   wrappers from the runtime and leaves authored contents and appearance alone. */

.direct-board-tape {
    display: grid;
    gap: clamp(30px, 5vw, 58px);
    width: 100%;
    min-width: 0;
    padding-bottom: 18px;
    color: var(--board-ink, #22303a);
}

.direct-board-window {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    scroll-margin-top: 0;
}

/* Only new rolling-board-v1 artifacts opt into the rigid physical contract.
   Pre-contract direct boards retain their frozen authored presentation. */
.direct-board-tape--rolling {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: none !important;
    grid-auto-rows: max-content !important;
    grid-auto-flow: row !important;
    align-content: start !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding-bottom: 0;
}

.direct-board-tape--rolling .direct-board-window {
    position: relative !important;
    grid-row: auto !important;
    grid-column: auto !important;
    align-self: auto !important;
    justify-self: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    order: 0 !important;
    inset: auto !important;
    transform: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

.direct-board-tape--rolling .direct-board-workspace {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    position: relative !important;
    width: 100%;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    order: 0 !important;
    inset: auto !important;
    transform: none !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.direct-board-tape--rolling .direct-board-row {
    box-sizing: border-box;
    position: relative !important;
    flex: 0 0 auto !important;
    width: 100%;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    order: 0 !important;
    inset: auto !important;
    transform: none !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.direct-board-tape--rolling .direct-board-row-content {
    box-sizing: border-box;
    position: relative !important;
    width: 100%;
    min-width: 0;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

/* These mounts are the growing physical tape, not an authored slide canvas.
   Logical sizes and individual transforms must not bypass the height rules.
   Authors retain normal CSS, diagrams and animation on elements inside them. */
.direct-board-tape--rolling,
.direct-board-tape--rolling .direct-board-window,
.direct-board-tape--rolling .direct-board-workspace,
.direct-board-tape--rolling .direct-board-row,
.direct-board-tape--rolling .direct-board-row-content {
    block-size: auto !important;
    min-block-size: 0 !important;
    max-block-size: none !important;
    aspect-ratio: auto !important;
    contain: none !important;
    content-visibility: visible !important;
    inset: auto !important;
    transform: none !important;
    translate: none !important;
    rotate: none !important;
    scale: none !important;
    zoom: 1 !important;
    clip-path: none !important;
    mask: none !important;
    filter: none !important;
    animation: none !important;
    transition: none !important;
    writing-mode: horizontal-tb !important;
}

@media (prefers-reduced-motion: reduce) {
    .direct-board-tape--rolling .direct-board-window {
        scroll-behavior: auto;
    }
}