/* The entry's notes sheet (curator_entry_sheet.js), after the profile sheet:
   the hero stays behind while the sheet scrolls over it, and the sheet's head
   (the preview deck) docks beneath the header. */
.curator-entry-fixed-hero-space { display: none; }

.curator-entry-header-title {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: 52%;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, calc(-50% + 4px));
    transition: opacity 0.18s ease, transform 0.18s ease;
}
/* Only while the header belongs to the page whose sheet is docked: one header
   moves between app surfaces. */
[data-curator-app-scroll]:has(> .curator-reading-shell.is-entry-sheet-docked) > .site-header .curator-entry-header-title.is-visible {
    opacity: 1;
    transform: translate(-50%, -50%);
}
.curator-entry-header-title img { flex: none; width: 22px; height: 22px; object-fit: cover; }
.curator-entry-header-title span {
    min-width: 0;
    overflow: hidden;
    color: var(--curator-reading-ink, #3f3c39);
    font: 500 15px/1.2 var(--rh-sans);
    letter-spacing: -0.02em;
    white-space: nowrap;
    text-overflow: ellipsis;
}

@media (max-width: 1100px) {
    /* Laid out by CSS alone, so nothing moves when the script arrives. The
       script only measures the pinning offsets and the native fixed layers. */
    [data-curator-app-scroll]:has(> .curator-reading-shell > .curator-entry-sheet),
    html:has(body:not(.curator-app-shell-page) .curator-reading-shell > .curator-entry-sheet) {
        overflow-anchor: none;
        scroll-snap-type: none;
    }

    /* In the app, as on Rhune release pages: padding on the scrollport moves
       pinned layers during rubber-banding, so the header is fixed at the safe
       area and the page keeps its place with a margin instead. */
    body.curator-app-shell-page [data-curator-app-scroll]:has(> .curator-reading-shell > .curator-entry-sheet) {
        padding-top: 0;
        scroll-padding-top: env(safe-area-inset-top, 0px);
    }
    body.curator-app-shell-page [data-curator-app-scroll]:has(> .curator-reading-shell > .curator-entry-sheet) > .site-header {
        position: fixed;
        z-index: 6;
        inset: env(safe-area-inset-top, 0px) 0 auto;
        width: auto;
        margin: 0;
    }
    /* Covers the status area once the notes pass beneath, and cannot be pulled down in a bounce. */
    body.curator-app-shell-page [data-curator-app-scroll]:has(> .curator-reading-shell > .curator-entry-sheet) > .site-header::before {
        content: "";
        position: absolute;
        top: calc(-1 * env(safe-area-inset-top, 0px));
        right: 0;
        left: 0;
        height: calc(env(safe-area-inset-top, 0px) + min(2px, env(safe-area-inset-top, 0px)));
        background: var(--curator-reading-paper);
        opacity: 0;
        pointer-events: none;
    }
    body.curator-app-shell-page [data-curator-app-scroll]:has(> .curator-reading-shell.is-entry-sheet-docked) > .site-header::before { opacity: 1; }
    body.curator-app-shell-page [data-curator-app-scroll] > .curator-reading-shell:has(> .curator-entry-sheet) {
        margin-top: calc(env(safe-area-inset-top, 0px) + var(--curator-app-header-height, 56px));
    }

    body:not(.curator-app-shell-page):has(.curator-reading-shell > .curator-entry-sheet) > .site-header {
        position: sticky;
        top: 0;
        z-index: 6;
    }
    /* Browser: the page ends with the sheet, and the sheet ends with its notes. */
    /* A short entry's sheet still reaches the bottom of the screen, without adding scroll. */
    body:not(.curator-app-shell-page) > main:has(> .curator-reading-shell > .curator-entry-sheet) {
        display: flex;
        flex-direction: column;
        margin-bottom: 0;
    }
    body:not(.curator-app-shell-page) > main > .curator-reading-shell:has(> .curator-entry-sheet) {
        display: flex;
        flex: 1 0 auto;
        flex-direction: column;
    }
    body:not(.curator-app-shell-page) .curator-reading-shell > .curator-entry-sheet {
        flex: 1 0 auto;
        min-height: 0;
    }
    /* The back link stays with the pinned hero instead of scrolling under the header. */
    body:not(.curator-app-shell-page) .curator-reading-shell:has(> .curator-entry-sheet) > .curator-entry-back {
        position: sticky;
        top: var(--entry-hero-top, 0px);
        margin: 0 0 -36px -0.2rem;
    }

    /* Once the notes pass beneath it, the header is solid paper. */
    :is([data-curator-app-scroll]:has(> .curator-reading-shell.is-entry-sheet-docked), body:not(.curator-app-shell-page):has(.curator-reading-shell.is-entry-sheet-docked)) .site-header {
        background: var(--curator-reading-paper);
    }
    :is([data-curator-app-scroll]:has(> .curator-reading-shell.is-entry-sheet-docked), body:not(.curator-app-shell-page):has(.curator-reading-shell.is-entry-sheet-docked)) .site-header .header-bg {
        background: var(--curator-reading-paper);
        opacity: 1;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }

    .curator-reading-shell:has(> .curator-entry-sheet) {
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .curator-reading-shell > .curator-reading-hero:has(~ .curator-entry-sheet) {
        position: sticky;
        top: var(--entry-hero-top, 0px);
        z-index: 1;
    }

    /* Full-bleed from the page's own centring; the script confirms the exact gutter. */
    .curator-reading-shell > .curator-entry-sheet {
        position: relative;
        z-index: 3;
        box-sizing: border-box;
        min-height: var(--entry-sheet-height, 0px);
        margin-left: calc(-1 * var(--entry-sheet-left, calc(50vw - 50%)));
        margin-right: calc(-1 * var(--entry-sheet-right, calc(50vw - 50%)));
        /* Down over the space kept clear for the tab bar, so no page shows beneath it. */
        margin-bottom: calc(-1 * var(--entry-sheet-clearance, 0px));
        padding: 0 var(--entry-sheet-right, calc(50vw - 50%)) calc(3.5rem + var(--entry-sheet-clearance, 0px)) var(--entry-sheet-left, calc(50vw - 50%));
        border-radius: 18px 18px 0 0;
        background: var(--curator-reading-paper);
        /* Negative spread keeps the shadow above the sheet; none shows below its end. */
        box-shadow: 0 -12px 24px -12px rgba(40, 36, 33, 0.07);
        /* Holds the deck's paper panel (below) to the sheet's own outline. */
        overflow: clip;
    }

    .curator-entry-sheet > .curator-entry-sheet-head {
        position: sticky;
        top: var(--entry-sheet-dock, calc(env(safe-area-inset-top, 0px) + var(--curator-app-header-height, 0px)));
        z-index: 4;
        isolation: isolate;
        margin-left: calc(-1 * var(--entry-sheet-left, calc(50vw - 50%)));
        margin-right: calc(-1 * var(--entry-sheet-right, calc(50vw - 50%)));
        padding-left: max(var(--entry-sheet-left, calc(50vw - 50%)), 1rem);
        padding-right: max(var(--entry-sheet-right, calc(50vw - 50%)), 1rem);
        border-radius: 18px 18px 0 0;
        background: var(--curator-reading-paper);
    }
    .is-entry-sheet-docked > .curator-entry-sheet > .curator-entry-sheet-head { border-radius: 0; }
    /* Paper from the deck up to the top of the screen, so notes passing above
       it never show through the header on a fast scroll: it moves with the
       sticky deck, where the header only turns solid once the script hears
       the scroll. Above the sheet's top edge it is clipped away, so it shows
       only once the sheet has risen past it. */
    .curator-entry-sheet > .curator-entry-sheet-head::before {
        content: "";
        position: absolute;
        right: 0;
        bottom: 100%;
        left: 0;
        height: var(--entry-sheet-dock, 100px);
        background: var(--curator-reading-paper);
        pointer-events: none;
    }

    /* The hero's in-page back link would otherwise paint over the rising sheet. */
    .curator-reading-shell:has(> .curator-entry-sheet) > .curator-entry-back { z-index: 2; }

    html.rhune-native-ios .curator-reading-shell > .curator-reading-hero:has(~ .curator-entry-sheet),
    html.rhune-native-ios .curator-entry-sheet > .curator-entry-sheet-head {
        will-change: transform;
    }

    /* Native: the hero becomes a fixed background layer that never follows
       rubber-banding; a placeholder keeps its space in the flow. */
    html.rhune-native-ios .has-entry-fixed-background .curator-entry-fixed-hero-space {
        display: block;
        pointer-events: none;
    }
    html.rhune-native-ios .has-entry-fixed-background .curator-reading-shell > .curator-reading-hero:has(~ .curator-entry-sheet) {
        position: fixed;
        top: var(--entry-hero-resting-top);
        left: var(--entry-hero-left);
        right: var(--entry-hero-right);
        z-index: 1;
    }
}

/* Empty entries offer + in the sheet's head; once there's a note, the list's end does. */
.curator-entry-sheet:has(.curator-reading-note-list > [data-curator-note-row]) .curator-entry-sheet-add,
.curator-entry-sheet:not(:has(.curator-reading-note-list > [data-curator-note-row])) .curator-entry-add-track {
    display: none;
}
.curator-entry-sheet-head .curator-entry-sheet-add { flex: none; margin: 0; }
/* Tapping the empty deck, or Publish with nothing to publish, points here. */
.curator-entry-sheet-head .curator-entry-sheet-add.is-nudged { animation: curator-entry-intro-tint 0.9s ease-in-out 1; }
.curator-entry-editorial.is-entry-intro .curator-entry-sheet:not(:has([data-curator-note-row])) .curator-entry-sheet-add {
    animation: curator-entry-intro-tint 1.1s ease-in-out 0.6s 2;
}


@media (prefers-reduced-motion: reduce) {
    .curator-entry-header-title { transition: none; }
    .curator-entry-editorial.is-entry-intro .curator-entry-sheet-add,
    .curator-entry-sheet-head .curator-entry-sheet-add.is-nudged { animation: none; }
}