/* The profile keeps its existing scroll owner. Sticky identity and header
   layers sit behind a normal-flow sheet; no transparent overlay catches taps. */
.curator-profile-sheet-avatar-slot {
    display: none;
}

@media (max-width: 1100px) {
    .curator-profile-sheet-scroll {
        --profile-sheet-top: env(safe-area-inset-top, 0px);
        scroll-padding-top: var(--profile-sheet-top);
        /* Sticky navigation supplies the dock. Scroll snapping fights a
           downward dismissal and can re-snap after WebKit rubber-banding. */
        scroll-snap-type: none;
        overflow-anchor: none;
    }

    body.curator-app-shell-page .curator-profile-sheet-scroll > .site-header,
    html.curator-profile-sheet-scroll body > .site-header {
        position: sticky;
        top: var(--profile-sheet-top);
        z-index: 2;
    }

    /* Keep WebKit's sticky scrollport free of top padding. A normal-flow
       safe-area block establishes the resting position; sticky top uses that
       same inset only as its docking boundary. */
    [data-curator-profile-surface].curator-profile-sheet-scroll {
        padding-top: 0;
    }

    [data-curator-profile-surface].curator-profile-sheet-scroll::before {
        display: block;
        height: var(--profile-sheet-top);
        content: "";
        pointer-events: none;
    }

    /* Leave ::before in flow as spacing; keep the actual status-area paper
       fixed so it cannot follow a downward rubber-band gesture. The device
       inset, not a particular iPhone model, determines its height. */
    html.rhune-native-ios [data-curator-profile-surface].curator-profile-sheet-scroll::after {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        /* Overlap the sticky header edge by 2px to cover subpixel seams.
           A device with no top inset still receives no cover. */
        height: calc(env(safe-area-inset-top, 0px) + min(2px, env(safe-area-inset-top, 0px)));
        z-index: 10;
        background: var(--curator-paper);
        pointer-events: none;
    }

    html.rhune-native-ios [data-curator-profile-surface] > .curator-root-header-spacer,
    .curator-profile-sheet-scroll > .curator-root-header-spacer {
        display: none;
    }

    .curator-profile-shell.curator-profile-sheet-enabled {
        padding-bottom: 0;
        margin-bottom: 0;
        /* The sheet must be able to paint above the sibling page header. */
        z-index: auto;
        isolation: auto;
    }

    .curator-profile-sheet-enabled > .curator-profile-identity {
        position: sticky;
        top: var(--profile-identity-top);
        z-index: 1;
    }

    .curator-profile-sheet-enabled > .curator-entry-index {
        z-index: 3;
        box-sizing: border-box;
        min-height: var(--profile-sheet-height);
        margin-left: calc(-1 * var(--profile-sheet-left));
        margin-right: calc(-1 * var(--profile-sheet-right));
        padding: 0 var(--profile-sheet-right) 0 var(--profile-sheet-left);
        border: 0;
        border-radius: 18px 18px 0 0;
        background: var(--curator-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);
    }

    .curator-profile-sheet-enabled .curator-profile-content {
        min-height: inherit;
    }

    /* Draft badges and loading artwork have their own z-indices. Keep those
       local to the panel so they cannot paint over the sticky navigation. */
    .curator-profile-content > .curator-profile-content-panel {
        position: relative;
        z-index: 0;
        isolation: isolate;
    }

    .curator-profile-sheet-enabled .curator-profile-sheet-navigation {
        position: sticky;
        z-index: 4;
        isolation: isolate;
        top: var(--profile-sheet-top);
        margin-left: calc(-1 * var(--profile-sheet-left));
        margin-right: calc(-1 * var(--profile-sheet-right));
        padding: 12px var(--profile-sheet-right) 10px var(--profile-sheet-left);
        border-radius: 18px 18px 0 0;
        background: var(--curator-paper);
    }

    /* An opaque backing covers the entire docked row and status area,
       including its otherwise rounded corners. It stays behind the controls. */
    .curator-profile-sheet-enabled .curator-profile-sheet-navigation::before {
        position: absolute;
        z-index: -1;
        top: calc(-1 * var(--profile-sheet-top));
        right: 0;
        bottom: 0;
        left: 0;
        background: var(--curator-paper);
        content: "";
        opacity: 0;
        pointer-events: none;
    }

    .curator-profile-sheet-enabled.is-profile-sheet-docked .curator-profile-sheet-navigation::before {
        opacity: 1;
    }

    .curator-profile-sheet-enabled.is-profile-sheet-docked .curator-profile-sheet-navigation {
        border-radius: 0;
    }

    /* Prepare only the bounded sticky layers before the first iOS gesture.
       The potentially long collection stays in ordinary tiled scrolling. */
    html.rhune-native-ios .curator-profile-sheet-scroll > .site-header,
    html.rhune-native-ios .curator-profile-sheet-enabled > .curator-profile-identity,
    html.rhune-native-ios .curator-profile-sheet-enabled .curator-profile-sheet-navigation {
        will-change: transform;
    }

    html.rhune-native-ios .curator-profile-sheet-enabled .curator-profile-sheet-navigation::before {
        /* The permanent surface cover owns the status area. This backing only
           fills the navigation's rounded corners once the sheet is docked. */
        top: 0;
    }

    .curator-profile-sheet-enabled .curator-profile-content-header {
        position: relative;
        min-height: 40px;
    }

    /* Establish the collapsed avatar track before JS mounts the sheet. If
       the ordinary two-column grid changes at mount, its first track animates
       from the full row width and briefly pushes Collection to the right. */
    .curator-profile-content-header.has-profile-sheet-avatar {
        grid-template-columns: 0px minmax(0, 1fr);
        column-gap: 0;
    }

    .curator-profile-content-header.has-profile-sheet-avatar.is-owner {
        grid-template-columns: 0px minmax(0, 1fr) 38px;
    }

    .curator-profile-sheet-enabled .curator-profile-content-header.has-profile-sheet-avatar {
        transition: grid-template-columns 440ms cubic-bezier(0.25, 0.1, 0.25, 1);
    }

    .curator-profile-sheet-enabled.is-profile-sheet-avatar-visible .curator-profile-content-header.has-profile-sheet-avatar {
        grid-template-columns: 44px minmax(0, 1fr);
    }

    .curator-profile-sheet-enabled.is-profile-sheet-avatar-visible .curator-profile-content-header.has-profile-sheet-avatar.is-owner {
        grid-template-columns: 44px minmax(0, 1fr) 38px;
    }

    .curator-profile-sheet-avatar-slot {
        display: block;
        min-width: 0;
        height: 40px;
    }

    .curator-profile-sheet-minimise {
        position: relative;
        display: grid;
        width: 40px;
        height: 40px;
        place-items: center;
        box-sizing: border-box;
        padding: 0;
        overflow: hidden;
        border: 0;
        border-radius: 50%;
        background: transparent;
        color: #242220;
        cursor: pointer;
        opacity: 0;
        visibility: hidden;
        transform: translateX(-3px) scale(0.96);
        transition: opacity 400ms ease, transform 440ms cubic-bezier(0.25, 0.1, 0.25, 1), visibility 440ms;
    }

    .is-profile-sheet-avatar-visible .curator-profile-sheet-minimise {
        opacity: 1;
        visibility: visible;
        transform: none;
    }

    /* Keep the touch target generous while reducing the visible portrait. */
    .curator-profile-sheet-minimise::before {
        position: absolute;
        inset: 5px;
        border-radius: 50%;
        background: #e9e5de;
        content: "";
    }

    .curator-profile-sheet-minimise img {
        position: absolute;
        inset: 5px;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        object-fit: cover;
    }

    .curator-profile-sheet-minimise img[hidden] {
        display: none;
    }

    .curator-profile-sheet-minimise svg {
        position: relative;
        width: 20px;
        height: 20px;
        fill: none;
        stroke: currentColor;
        stroke-width: 1.6;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

    .curator-profile-sheet-minimise:focus-visible {
        outline: 1px solid currentColor;
        outline-offset: 3px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .curator-profile-sheet-enabled .curator-profile-content-header.has-profile-sheet-avatar,
    .curator-profile-sheet-minimise {
        transition: none;
    }
}

/* Native profile experiment: the sheet scrolls over fixed background layers.
   Placeholders preserve the original sheet position without scroll corrections. */
.curator-profile-fixed-identity-space,
.curator-profile-fixed-header-space { display: none; }
@media (max-width: 1100px) {
    html.rhune-native-ios .has-profile-fixed-background .curator-profile-fixed-identity-space,
    html.rhune-native-ios .has-profile-fixed-background > .curator-profile-fixed-header-space {
        display: block;
        pointer-events: none;
    }
    html.rhune-native-ios body.curator-app-shell-page [data-curator-profile-surface].has-profile-fixed-background > .site-header {
        position: fixed;
        top: var(--profile-sheet-top);
        left: 0;
        right: 0;
        width: auto;
        margin-left: 0;
        margin-right: 0;
        z-index: 2;
    }
    html.rhune-native-ios .has-profile-fixed-background .curator-profile-sheet-enabled > .curator-profile-identity {
        position: fixed;
        top: var(--profile-identity-resting-top);
        left: var(--profile-sheet-left);
        right: var(--profile-sheet-right);
        z-index: 1;
    }
    /* Pull to refresh: the mark waits just below the fixed details, behind the sheet.
       Pulling the sheet down uncovers it; iOS's own stretch does all the motion. */
    html.rhune-native-ios .has-profile-fixed-background .curator-profile-sheet-enabled > .curator-profile-identity::after {
        content: "";
        position: absolute;
        top: calc(100% + 14px);
        left: 50%;
        width: 15px;
        height: 15px;
        margin-left: -7.5px;
        background: url('/static/rhune-r.webp?v=2') center / contain no-repeat;
        opacity: 0;
        transform: scale(0.86);
        transition: opacity 160ms ease, transform 180ms cubic-bezier(0.22, 0.72, 0.28, 1);
        pointer-events: none;
    }
    html.rhune-native-ios .has-profile-fixed-background .curator-profile-sheet-enabled > .curator-profile-identity.is-refresh-pulling::after {
        opacity: 0.5;
    }
    html.rhune-native-ios .has-profile-fixed-background .curator-profile-sheet-enabled > .curator-profile-identity.is-refresh-ready::after {
        opacity: 0.88;
        transform: scale(1);
    }
}

.curator-profile-content .curator-profile-empty-copy {
    font: 400 1.1rem/1.45 "Cormorant Garamond", Georgia, serif;
    letter-spacing: -0.033em;
}

/* Own and visitor profiles scroll without a visible indicator. */
:is([data-curator-app-surface="profile"], [data-curator-profile-surface]) { scrollbar-width: none; }
:is([data-curator-app-surface="profile"], [data-curator-profile-surface])::-webkit-scrollbar { display: none; }