/* Quiet verse references and contributor names in the book. */
body.project-banner-page #sentence .sentence-number { color:#c6c6c6;overflow:visible;text-overflow:clip; }
body.project-banner-page #sentence .single-element .sentence-author {
    color:#810958;letter-spacing:.2px;
    position:absolute;left:auto;right:0;bottom:0;
    width:max-content;max-width:none;white-space:nowrap;overflow-wrap:normal;
    text-align:right;overflow:visible;
}
body.project-banner-page #sentence .editable-elem .pencil.button { right: 0; }

@media (min-width: 992px) {
    body.project-banner-page #sentence .single-element { padding-left: 64px; }
    body.project-banner-page #sentence .single-element .sentence-number {
        position: absolute; left: 0; top: 20px; width: calc(64px - 8px);
        margin: 0; text-align: right; white-space: nowrap;
        font-size: 14px; line-height: 1.5;
    }
    body.project-banner-page #sentence .single-element:has(.reserved-sentence-title) .sentence-number { top: 23px; }
    body.project-banner-page #sentence .single-element:not(.active-element) .section-left { position: static; }
    body.project-banner-page #sentence .single-element > .image-container { margin-top: 0; }
    body.project-banner-page #sentence .editable-elem .pencil.button { top: 23px; }
}

/* Reserved rows have an informational hover label, never an action. */
@media (hover: hover) and (pointer: fine) {
    body.project-banner-page #sentence .single-element:has(.reserved-sentence-title)::after {
        content: "Zarezerwowano";
        position: absolute; right: 0; top: 23px;
        display: flex; align-items: center; min-height: 44px;
        padding: 7px 0; color: #999;
        font: 400 14px/1.5 "Roboto Regular", Arial, sans-serif;
        opacity: 0; pointer-events: none; transition: opacity 140ms ease;
    }
    body.project-banner-page:has(#promised-menu .lang-en.active) #sentence .single-element:has(.reserved-sentence-title)::after { content: "Reserved"; }
    body.project-banner-page #sentence .single-element:has(.reserved-sentence-title):hover::after { opacity: 1; }
}

/* On narrow screens the label follows the complete wrapped verse, just like
   the rewrite action, rather than overlapping its first line. */
@media (max-width: 586px) and (hover: hover) and (pointer: fine) {
    body.project-banner-page #sentence .single-element:has(.reserved-sentence-title)::after {
        position: relative; top: 0; width: max-content; margin-left: auto;
    }
}

/* Touch-only screens retain a visible action; keyboard focus also reveals it. */
@media (min-width: 992px) and (hover: hover) and (pointer: fine) {
    body.project-banner-page #sentence .single-element:has(.editable-elem) {
        transition: background-color 140ms ease;
    }
    body.project-banner-page #sentence .editable-elem .pencil.button {
        opacity: 0; pointer-events: none; transition: opacity 140ms ease;
    }
    body.project-banner-page #sentence .single-element:has(.editable-elem):hover,
    body.project-banner-page #sentence .single-element:has(.editable-elem):focus-within { background: rgba(129, 9, 88, .035); }
    body.project-banner-page #sentence .single-element:hover .editable-elem .pencil.button,
    body.project-banner-page #sentence .single-element:focus-within .editable-elem .pencil.button { opacity: 1; pointer-events: auto; }
}
@media (prefers-reduced-motion: reduce) {
    body.project-banner-page #sentence .single-element,
    body.project-banner-page #sentence .single-element::after,
    body.project-banner-page #sentence .editable-elem .pencil.button { transition: none; }
}

/* Rows remain readable while scrolling, including their first entrance.
   Child opacity still controls the handwriting/text interaction and actions. */
body.project-banner-page #sentence .single-element {
    visibility:visible!important;opacity:1!important;transition:none!important;
}

/* Touch taps explicitly toggle transcription, overriding sticky :hover.
   Only verse content changes; contributor signatures keep their own behavior. */
body.project-banner-page #sentence .single-element.active-element[data-verse-touch-text="true"] .section-left .sentence-title { opacity:1!important; }
body.project-banner-page #sentence .single-element.active-element[data-verse-touch-text="true"] .section-left img { opacity:.1!important; }
body.project-banner-page #sentence .single-element.active-element[data-verse-touch-text="false"] .section-left .sentence-title { opacity:0!important; }
body.project-banner-page #sentence .single-element.active-element[data-verse-touch-text="false"] .section-left img { opacity:1!important; }

/* Only the reading area is capped; the illustrated banner spans the viewport. */
body.project-banner-page { --book-gutter:32px;--book-width:1100px; }
body.project-banner-page #sentence {
    width:min(100vw,var(--book-width));max-width:none;
    margin-left:calc((100% - min(100vw,var(--book-width))) / 2)!important;
    margin-right:0!important;
}
body.project-banner-page #sentence > .row { margin-left:0;margin-right:0; }
body.project-banner-page #sentence > .row > .chapters-box { padding-left:0;padding-right:0; }
body.project-banner-page #sentence .chapter-container-outer { padding-left:0;padding-right:0; }
body.project-banner-page #sentence .chapter-container { padding-left:var(--book-gutter);padding-right:var(--book-gutter); }
@media(max-width:991px) { body.project-banner-page { --book-gutter:30px; } }
@media(max-width:359px) { body.project-banner-page { --book-gutter:26px; } }

@media(max-width:991px) { body.project-banner-page #sentence .sentence-number { margin-left:0;margin-right:0;width:100%; } }

/* Reserved references sit inside a wrapper; keep it aligned with the verse
   instead of inheriting the legacy centered, 82%-wide mobile container. */
@media(max-width:586px) {
    body.project-banner-page #sentence .section-left:has(> .reserved-sentence-title) > .sentence-title-container {
        max-width:100%;margin-left:0;margin-right:0;
    }
}

/* 1100 = 32 + 64 reference + 780 verse + 6 gap + 186 contributor + 32.
   The widest published text measures 778.125px at the existing 19px size.
   Images fit this same verse column without cropping or changing their files. */
@media(min-width:992px) {
    body.project-banner-page #sentence .single-element { --contributor-width:186px;--contributor-gap:6px; }
    body.project-banner-page #sentence .single-element:not(.editable-section) > .image-container {
        display:grid;grid-template-columns:minmax(0,1fr) var(--contributor-width);
        column-gap:var(--contributor-gap);align-items:start;
    }
    body.project-banner-page #sentence .single-element > .image-container > .section-left,
    body.project-banner-page #sentence .single-element > .image-container > .section-right {
        width:100%;min-width:0;max-width:100%;flex-basis:auto;
    }
    /* Preserve the row spacing around the legacy -45px/+30px margins. */
    body.project-banner-page #sentence .single-element.active-element { padding-bottom:15px; }
    /* Align written text with free verses; move its full-size image with it. */
    body.project-banner-page #sentence .single-element.active-element > .image-container > .section-left {
        top:15px;
    }
    body.project-banner-page #sentence .single-element > .image-container > .section-right {
        display:block;height:60px;min-height:60px;overflow:visible;
        font-size:1.15em;
    }
    body.project-banner-page #sentence .single-element .sentence-title,
    body.project-banner-page #sentence .single-element .editable-sentence-title,
    body.project-banner-page #sentence .single-element .reserved-sentence-title {
        width:100%;max-width:100%;white-space:nowrap;overflow:visible;text-overflow:clip;
        font-size:clamp(16.36px,calc((100vw - 320px) * .0243589744),19px);
    }
    body.project-banner-page #sentence .single-element .images-title {
        width:100%;max-width:100%;height:60px;overflow:hidden;
    }
    body.project-banner-page #sentence .single-element .images-title .verse-image {
        display:block;width:auto!important;max-width:100%!important;height:auto!important;max-height:60px;
        object-fit:contain;object-position:left center;
    }
    body.project-banner-page #sentence .single-element .section-right > img {
        position:absolute;left:auto;right:0!important;bottom:0!important;
        /* Match the phone's 68px image / 19.2px author-text proportion.
           Wide signatures may extend left over the verse instead of shrinking. */
        width:auto!important;max-width:none;height:3.541666667em!important;max-height:none;
        object-fit:contain;object-position:right bottom;
    }
    body.project-banner-page #sentence .single-element .sentence-author {
        font-size:inherit;line-height:1.5;
    }
    body.project-banner-page #sentence .single-element .editable-elem .pencil.button {
        left:auto;right:0;
        justify-content:flex-end;padding-right:0;
    }
    body.project-banner-page #sentence .single-element:has(.reserved-sentence-title)::after {
        left:auto;right:0;
    }
}

/* Shorten chapter breaks in normal reading while preserving their headings.
   Search has its own continuous list, and the first chapter keeps its lead-in. */
body.project-banner-page #sentence:not([data-verse-search-active="true"]) .chapter-container {
    padding-bottom:3em;margin-bottom:.5em;
}

/* Every tab shares the complete manuscript and identical row geometry.
   Only contributor names change colour; scans remain readable and usable. */
body.project-banner-page #sentence .single-element[data-participant-selected="false"] .sentence-author {
    color:#999!important;
}
body.project-banner-page #sentence .single-element[data-participant-selected="true"] .sentence-author {
    color:#810958!important;
}
@media(min-width:992px) {
    body.project-banner-page #sentence:not([data-verse-search-active="true"]) .chapter-container:not(#chapter_sentences_1) {
        padding-top:50px;
    }
}

/* A single, dormant student form opens in the top layer; book rows never move. */
html.student-dialog-open { overflow:hidden;scrollbar-gutter:stable; }
#promised-student-form {
    box-sizing:border-box;width:min(650px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);
    margin:auto;padding:0;border:0;border-radius:4px;background:#fff;color:#333;
    box-shadow:0 18px 70px #0003;overflow:auto;overscroll-behavior:contain;
    font:400 16px/1.45 "Roboto Regular",Arial,sans-serif;text-align:left;
}
#promised-student-form:not([open]), #promised-student-form [hidden] { display:none!important; }
#promised-student-form::backdrop { background:rgba(32,20,27,.38); }
#promised-student-form *, #promised-student-form *::before, #promised-student-form *::after { box-sizing:border-box; }
#promised-student-form .student-dialog__header { position:sticky;top:0;left:auto;right:auto;bottom:auto;width:100%;height:auto;float:none;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px 12px 28px;background:#fff;border-bottom:1px solid #eee; }
#promised-student-form h2 { position:static;flex:1;left:auto;right:auto;width:auto;height:auto;margin:0;padding:0;color:#333;text-indent:0;font:400 27px/1.2 Georgia,serif; }
#promised-student-form .student-icon-button { display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;padding:0;border:0;background:transparent;box-shadow:none;color:#777;font:300 32px/1 Arial,sans-serif;cursor:pointer; }
#promised-student-form .student-dialog__body { padding:22px 28px 28px; }
#promised-student-form .student-dialog__steps { list-style:none;margin:0 0 22px;padding:0;display:flex;gap:16px;font-size:13px; }
#promised-student-form .student-dialog__steps li { display:flex;gap:9px;align-items:center;flex:1;padding:0; }
#promised-student-form .student-dialog__steps span { font:400 26px/1 "Roboto Regular",Arial,sans-serif;color:#810958; }
#promised-student-form .student-dialog__verse { margin:0 0 22px;padding:12px 16px;border:0;background:#f6f3f5; }
#promised-student-form [data-form-reference] { color:#888;font-size:13px; }
#promised-student-form [data-form-verse] { margin:6px 0 0;font:400 20px/1.4 Georgia,serif;color:#222; }
#promised-student-form form { margin:0; }
#promised-student-form label { display:block;margin:0;color:#444;font:400 14px/1.4 "Roboto Regular",Arial,sans-serif; }
#promised-student-form label > span { font-weight:400; }
#promised-student-form .student-dialog__fields { display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;margin:18px 0; }
#promised-student-form .student-dialog__wide { grid-column:1/-1; }
#promised-student-form input:not([type=hidden]):not([type=checkbox]):not([type=file]) { display:block;position:static;width:100%;max-width:none;height:44px;min-height:44px;margin:5px 0 0;padding:9px 12px;border:1px solid #ddd;border-radius:2px;background:#fafafa;color:#222;box-shadow:none;font:400 16px/24px "Roboto Regular",Arial,sans-serif; }
#promised-student-form input:focus-visible { outline:2px solid #810958;outline-offset:1px; }
#promised-student-form input[type=checkbox] { appearance:auto;position:static;opacity:1;width:18px;height:18px;min-width:18px;margin:2px 0 0;accent-color:#810958; }
#promised-student-form .student-dialog__project, #promised-student-form .student-dialog__consent { display:flex;align-items:flex-start;gap:10px; }
#promised-student-form .student-dialog__instruction, #promised-student-form .student-dialog__notice { margin:10px 0 0;color:#777;font-size:13px;line-height:1.5; }
#promised-student-form .student-dialog__upload { padding:15px;background:#f4f4f4; }
#promised-student-form .student-dialog__upload small { font-size:12px;color:#777; }
#promised-student-form [data-upload-copy] { white-space:pre-line; }
#promised-student-form input[type=file] { display:block;position:static;opacity:1;max-width:100%;height:auto;margin:10px 0 0;padding:0;border:0;background:transparent;font:400 14px/1.5 "Roboto Regular",Arial,sans-serif;color:#444; }
#promised-student-form .student-dialog__preview { display:block;width:auto;max-width:100%;max-height:160px;margin:12px auto;object-fit:contain; }
#promised-student-form .student-dialog__consent { margin-top:18px;font-size:13px; }
#promised-student-form .student-dialog__status { margin:12px 0;color:#810958;font-size:14px; }
#promised-student-form .student-dialog__status:empty { display:none; }
#promised-student-form .student-dialog__submit { display:block;width:100%;min-height:44px;margin:18px 0 0;padding:10px 16px;border:0;border-radius:2px;background:#810958;box-shadow:none;color:#fff;font:400 16px/24px "Roboto Regular",Arial,sans-serif;text-align:center;cursor:pointer; }
#promised-student-form button:disabled { opacity:.55;cursor:wait; }
#promised-student-form button:focus-visible { outline:2px solid #810958;outline-offset:3px; }
#promised-student-form .student-dialog__resend { min-height:44px;padding:10px 0;border:0;background:transparent;color:#810958;font:400 15px/24px "Roboto Regular",Arial,sans-serif;cursor:pointer; }
#promised-student-form h3 { font:400 26px/1.25 Georgia,serif;color:#333;margin:15px 0; }
@media(max-width:480px) {
    #promised-student-form { width:calc(100vw - 16px);max-height:calc(100dvh - 16px); }
    #promised-student-form .student-dialog__header { padding:10px 8px 10px 18px; }
    #promised-student-form h2 { font-size:23px; }
    #promised-student-form .student-dialog__body { padding:18px; }
    #promised-student-form .student-dialog__steps { gap:8px;font-size:11px; }
    #promised-student-form .student-dialog__steps li { gap:6px; }
    #promised-student-form .student-dialog__steps span { font-size:22px; }
    #promised-student-form .student-dialog__fields { gap:12px; }
}