/* Compact contribution dialog; deliberately isolated from the book layout. */
html.verse-dialog-open {
	overflow: hidden;
}

body.verse-dialog-open .single-element.editable-section .image-container {
	display: flex;
}

dialog.verse-dialog {
	--verse-accent: #810958;
	position: fixed;
	inset: 0;
	width: min(520px, calc(100% - 48px));
	max-width: none;
	max-height: calc(100vh - 64px);
	max-height: calc(100dvh - 64px);
	margin: auto;
	padding: 0;
	border: 1px solid rgba(85, 54, 66, .08);
	border-radius: 22px;
	background: #fffefa;
	color: #352c30;
	box-shadow: 0 24px 80px rgba(42, 20, 31, .22);
	font-family: "Roboto Regular", Arial, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.45;
	text-align: left;
	overflow: hidden;
}

dialog.verse-dialog[open] {
	display: flex;
	flex-direction: column;
	animation: verse-dialog-enter 180ms ease-out;
}

dialog.verse-dialog::backdrop {
	background: rgba(31, 24, 29, .34);
}

.verse-dialog *,
.verse-dialog *::before,
.verse-dialog *::after {
	box-sizing: border-box;
}

.verse-dialog [hidden] {
	display: none !important;
}

.verse-dialog .verse-dialog__header {
	position: relative;
	inset: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex: 0 0 auto;
	width: auto;
	height: auto;
	min-height: 0;
	max-height: none;
	max-width: none;
	gap: 16px;
	padding: 14px 20px 8px 24px;
	margin: 0;
	background: transparent;
	box-shadow: none;
	transform: none;
	overflow: visible;
	z-index: auto;
}

.verse-dialog .verse-dialog__header h2 {
	margin: 0;
	padding: 0;
	color: var(--verse-accent);
	font-family: "Roboto Bold", Arial, sans-serif;
	font-size: 20px;
	font-weight: 500;
	line-height: 1.25;
}

.verse-dialog .verse-dialog__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	margin: 0 -6px 0 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: #65585e;
	font-family: Arial, sans-serif;
	font-size: 28px;
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
}

.verse-dialog .verse-dialog__close:hover {
	background: #f3eef0;
}

.verse-dialog .verse-dialog__body {
	min-height: 0;
	padding: 4px 24px 24px;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

.verse-dialog .verse-dialog__steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
	color: #756b6e;
	font-size: 11px;
	line-height: 1.35;
	text-align: center;
}

.verse-dialog .verse-dialog__steps li {
	display: flex;
	align-items: center;
	flex-direction: column;
	gap: 5px;
	min-width: 0;
	margin: 0;
	padding: 0;
}

.verse-dialog .verse-dialog__steps img {
	display: block;
	width: 28px;
	height: 28px;
	margin: 0;
	object-fit: contain;
	opacity: .65;
}

.verse-dialog .verse-dialog__verse {
	margin: 0 0 16px;
	padding: 12px 15px;
	border-radius: 12px;
	background: #f4f0e9;
}

.verse-dialog .verse-dialog__verse-number {
	display: block;
	margin: 0 0 4px;
	color: #81756f;
	font-family: "Roboto Bold", Arial, sans-serif;
	font-size: 11px;
	font-weight: 500;
	line-height: 1.3;
}

.verse-dialog .verse-dialog__verse-text {
	display: block;
	height: auto;
	max-height: none;
	overflow: visible;
	text-overflow: clip;
	-webkit-line-clamp: unset;
	margin: 0;
	padding: 0;
	color: #342a2c;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 19px;
	font-weight: 400;
	line-height: 1.4;
	white-space: normal;
	overflow-wrap: break-word;
}

.verse-dialog #form-add-vers {
	margin: 0;
	padding: 0;
}

.verse-dialog .verse-dialog__fields {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 9px;
	margin: 0 0 12px;
}

.verse-dialog .verse-dialog__field {
	min-width: 0;
	margin: 0;
}

.verse-dialog .verse-dialog__fields input {
	display: block;
	width: 100%;
	max-width: none;
	min-height: 44px;
	height: 44px;
	margin: 0;
	padding: 10px 13px !important;
	border: 1px solid #e1dadd;
	border-radius: 9px;
	background: #fff;
	color: #352c30;
	box-shadow: none;
	font-family: "Roboto Regular", Arial, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 22px;
	letter-spacing: normal;
	text-transform: none;
	appearance: none;
}

.verse-dialog input::placeholder {
	color: #8a8085;
	opacity: 1;
}

.verse-dialog input:focus {
	border-color: var(--verse-accent);
	outline: 2px solid rgba(129, 9, 88, .1);
	outline-offset: 1px;
}

.verse-dialog .verse-dialog__upload {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 64px;
	margin: 0 0 14px;
	padding: 11px 14px;
	border: 1px dashed #d5cbd0;
	border-radius: 11px;
	background: #fbf9f6;
	color: #6b6064;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;
	text-align: left;
	cursor: pointer;
}

.verse-dialog .verse-dialog__upload:hover,
.verse-dialog .verse-dialog__upload:focus-within {
	border-color: var(--verse-accent);
	background: #f7f1f5;
}

.verse-dialog .verse-dialog__upload input[type="file"] {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	margin: 0;
	padding: 0;
	opacity: 0;
	cursor: pointer;
}

.verse-dialog .verse-dialog__upload label {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin: 0;
	padding: 0;
	font: inherit;
	color: inherit;
	pointer-events: none;
}

.verse-dialog .verse-dialog__upload:has(.verse-dialog__file-name:not(:empty)) {
	flex-wrap: wrap;
	gap: 4px 12px;
}

.verse-dialog .verse-dialog__file-name:not(:empty) {
	flex-basis: 100%;
	text-align: center;
}

.verse-dialog .verse-dialog__upload img,
.verse-dialog .verse-dialog__upload svg {
	flex: 0 0 26px;
	width: 26px;
	height: 26px;
	margin: 0;
	object-fit: contain;
	opacity: .75;
}

.verse-dialog .verse-dialog__upload-copy,
.verse-dialog .verse-dialog__file-name {
	min-width: 0;
	overflow-wrap: anywhere;
}

.verse-dialog .verse-dialog__file-name {
	color: #53434c;
	font-size: 12px;
}

.verse-dialog .verse-dialog__submit {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 11px 18px;
	border: 0;
	border-radius: 10px;
	background: var(--verse-accent);
	color: #fff;
	font-family: "Roboto Bold", Arial, sans-serif;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
}

.verse-dialog .verse-dialog__submit:hover {
	background: #6d084a;
}

.verse-dialog .verse-dialog__resend-email {
	margin-top: 10px;
}

.verse-dialog .verse-dialog__resend-email[hidden] {
	display: none;
}

.verse-dialog button:disabled {
	opacity: .55;
	cursor: wait;
}

.verse-dialog .verse-dialog__notice {
	margin: 10px 1px 0;
	padding: 0;
	color: #8a7e84;
	font-size: 11px;
	line-height: 1.5;
	text-align: center;
}

.verse-dialog .verse-dialog__notice a,
.verse-dialog .verse-dialog__notice button {
	display: inline;
	width: auto;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: #7b3b62;
	font: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
	cursor: pointer;
}

.verse-dialog .verse-dialog__error,
.verse-dialog .verse-dialog__field-error,
.verse-dialog .verse-dialog__status {
	margin: 0 0 10px;
	padding: 0;
	color: #9c304a;
	font-size: 12px;
	line-height: 1.4;
}

.verse-dialog .verse-dialog__error:empty,
.verse-dialog .verse-dialog__field-error:empty,
.verse-dialog .verse-dialog__status:empty {
	display: none;
}

.verse-dialog .verse-dialog__field-error:not(:empty) {
	display: block;
	margin: 4px 2px 0;
	font-size: 11px;
}

.verse-dialog [aria-invalid="true"] {
	border-color: #bb5d71 !important;
}

.verse-dialog .verse-dialog__sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	clip: rect(0, 0, 0, 0);
	overflow: hidden;
	white-space: nowrap;
}

.verse-dialog :is(button, a):focus-visible {
	outline: 2px solid var(--verse-accent);
	outline-offset: 3px;
}

.verse-dialog .verse-dialog__legal-content {
	color: #61555c;
	font-size: 13px;
	line-height: 1.65;
	overflow-wrap: break-word;
}

.verse-dialog .verse-dialog__legal-content :is(h2, h3, h4) {
	margin: 18px 0 10px;
	font-size: 15px;
	font-weight: 600;
}

.verse-dialog .verse-dialog__legal-content :is(ol, ul) {
	padding-left: 20px;
}

.verse-dialog .verse-dialog__legal-content a {
	color: var(--verse-accent);
}

@keyframes verse-dialog-enter {
	from { opacity: 0; transform: translateY(12px); }
	to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 600px) {
	dialog.verse-dialog {
		inset: auto 0 0;
		width: calc(100% - 16px);
		max-height: 78vh;
		max-height: 78dvh;
		margin: 0 auto max(8px, env(safe-area-inset-bottom));
		border-radius: 22px;
	}

	.verse-dialog .verse-dialog__header {
		padding: 9px 16px 6px 19px;
	}

	.verse-dialog .verse-dialog__header h2 {
		font-size: 18px;
	}

	.verse-dialog .verse-dialog__body {
		padding: 2px 19px 18px;
	}

	.verse-dialog .verse-dialog__steps {
		gap: 8px;
		margin-bottom: 12px;
		font-size: 10px;
	}

	.verse-dialog .verse-dialog__steps img {
		width: 23px;
		height: 23px;
	}

	.verse-dialog .verse-dialog__verse {
		margin-bottom: 12px;
		padding: 10px 12px;
	}

	.verse-dialog .verse-dialog__verse-text {
		font-size: 18px;
		line-height: 1.35;
	}
}

@media (prefers-reduced-motion: reduce) {
	dialog.verse-dialog[open] {
		animation: none;
	}
}

/* Keep upload confirmation visible until the contributor dismisses it. */
.verse-dialog .verse-dialog__success {
	padding-top: 2px;
	color: #53434c;
	font-size: 15px;
	line-height: 1.6;
	outline: none;
}

.verse-dialog .verse-dialog__success p {
	margin: 0 0 14px;
	padding: 0;
}

.verse-dialog .verse-dialog__success .verse-dialog__success-lead {
	color: #352c30;
	font-weight: 600;
}

.verse-dialog .verse-dialog__success-close {
	display: block;
	width: 100%;
	min-height: 44px;
	margin: 20px 0 0;
	padding: 11px 18px;
	border: 0;
	border-radius: 10px;
	background: var(--verse-accent);
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.verse-dialog .verse-dialog__success-close:hover {
	background: #6d084a;
}

/* Sharing controls are disabled in every reading mode and on every device. */
#sentence .promised-share { display:none!important; }

/* A local image preview: the original handwriting is exported in the browser. */
body.promised-story-open { overflow:hidden; }
dialog.promised-story {
    box-sizing:border-box;position:fixed;inset:0;width:560px;max-width:calc(100% - 24px);
    max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);margin:auto;padding:22px;
    overflow:auto;border:1px solid #e5d8e1;border-radius:18px;background:#fff;color:#332b31;
    box-shadow:0 20px 80px #2c132d33;font:400 15px/1.5 "Roboto Regular",Arial,sans-serif;
    overscroll-behavior:contain;text-align:left;
}
dialog.promised-story::backdrop { background:rgba(34,22,31,.55); }
.promised-story .promised-story__heading { display:flex;align-items:center;justify-content:space-between;gap:16px; }
.promised-story .promised-story__heading h2 { margin:0;padding:0;color:#332b31;font:600 22px/1.25 Arial,sans-serif; }
.promised-story .promised-story__close {
    appearance:none;flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;
    padding:0;margin:0;border:0;border-radius:50%;background:#f6f1f3;color:#810958;
    font:400 28px/1 Arial,sans-serif;cursor:pointer;
}
.promised-story .promised-story__intro { margin:12px 0 8px;padding:0;color:#62545f;font:inherit; }
.promised-story .promised-story__status { margin:8px 0 14px;padding:0;color:#62545f;font:inherit; }
.promised-story .promised-story__preview {
    display:block;width:270px;height:auto;max-width:100%;margin:0 auto 20px;border:1px solid #eadfe5;
    border-radius:5px;box-shadow:0 4px 18px #332b3110;aspect-ratio:9/16;object-fit:contain;
}
.promised-story .promised-story__actions { display:flex;flex-wrap:wrap;gap:10px; }
.promised-story .promised-story__actions :is(a,button),
.promised-story .promised-story__copy {
    appearance:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;
    flex:1 1 180px;width:auto;min-width:0;min-height:46px;margin:0;padding:11px 16px;border:1px solid #810958;
    border-radius:8px;background:#fff;color:#810958;text-decoration:none;text-transform:none;
    font:600 14px/1.4 Arial,sans-serif;letter-spacing:0;cursor:pointer;
}
.promised-story .promised-story__actions .promised-story__download { background:#810958;color:#fff; }
.promised-story .promised-story__actions :is(a,button):hover,
.promised-story .promised-story__copy:hover { filter:brightness(.94); }
.promised-story .promised-story__link-label { display:block;margin:18px 0 8px;font:inherit;color:#62545f; }
.promised-story .promised-story__link-label span { display:block;margin:0 0 5px;font:inherit; }
.promised-story .promised-story__link-label input {
    display:block;box-sizing:border-box;width:100%;height:42px;padding:8px 10px;border:1px solid #c6b8c1;
    border-radius:6px;background:#fff;color:#332b31;font:400 14px/1.4 Arial,sans-serif;
}
.promised-story .promised-story__copy { min-height:42px;padding:8px 12px; }
.promised-story :is(button,a,input):focus-visible { outline:3px solid #810958;outline-offset:3px; }
.promised-story button:disabled { opacity:.6;cursor:wait; }
.promised-story [hidden] { display:none!important; }
@media(max-width:600px) {
    dialog.promised-story { width:calc(100% - 16px);max-width:none;max-height:calc(100dvh - 16px);padding:18px; }
    .promised-story .promised-story__preview { width:230px; }
}
@media print { dialog.promised-story { display:none!important; } }
/* Participant selection uses the original reserved-verse contribution form. */
#promised-verse-dialog .verse-dialog__groups {
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;
    min-width:0;margin:0 0 16px;padding:0;border:0;
}
#promised-verse-dialog .verse-dialog__groups legend {
    float:none;width:100%;margin:0 0 8px;padding:0;border:0;
    color:#51444c;font:400 14px/1.4 "Roboto Regular",Arial,sans-serif;
}
#promised-verse-dialog .verse-dialog__group {
    display:flex;align-items:flex-start;gap:8px;min-width:0;min-height:74px;
    margin:0;padding:10px;border:1px solid #e1dadd;border-radius:9px;background:#fff;
    color:#51444c;font:400 14px/1.35 "Roboto Regular",Arial,sans-serif;cursor:pointer;
}
#promised-verse-dialog .verse-dialog__group:has(input:checked) {
    border-color:#810958;background:#faf4f8;color:#810958;
}
#promised-verse-dialog .verse-dialog__group input[type=radio] {
    appearance:auto;position:static;display:block;opacity:1;flex:0 0 17px;
    width:17px;min-width:17px;height:17px;min-height:17px;margin:1px 0 0;padding:0;
    accent-color:#810958;border:0;box-shadow:none;
}
#promised-verse-dialog .verse-dialog__group small {
    display:block;margin-top:4px;color:#786d74;font:400 11px/1.35 "Roboto Regular",Arial,sans-serif;
}
#promised-verse-dialog .verse-dialog__groups > .verse-dialog__field-error { grid-column:1/-1; }
#promised-verse-dialog [data-verse-participant-field] > label {
    display:block;margin:0 0 5px;padding:0;color:#51444c;
    font:400 13px/1.4 "Roboto Regular",Arial,sans-serif;
}
#promised-verse-dialog .verse-dialog__group:has(input:disabled) { cursor:default;opacity:.7; }
@media(max-width:600px) {
    #promised-verse-dialog .verse-dialog__groups { grid-template-columns:minmax(0,1fr);gap:6px;margin-bottom:12px; }
    #promised-verse-dialog .verse-dialog__group { min-height:44px;padding:9px 10px; }
    #promised-verse-dialog .verse-dialog__group small { margin-top:1px; }
}

/* Keep verse selection secondary to the quoted text and the upload action. */
.verse-dialog .verse-dialog__picker {
    display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:2px 16px;
    min-width:0;margin:-8px 0 14px;padding:0;
}
.verse-dialog .verse-dialog__pick {
    appearance:none;display:inline-flex;align-items:center;justify-content:center;
    flex:0 0 auto;min-height:28px;width:auto;margin:0;padding:3px 0;
    border:0;border-radius:2px;background:transparent;color:var(--verse-accent);
    font:400 12px/1.2 "Roboto Regular",Arial,sans-serif;letter-spacing:0;text-transform:none;
    text-align:left;text-decoration:underline;text-underline-offset:3px;white-space:nowrap;cursor:pointer;
}
.verse-dialog .verse-dialog__pick:disabled {
    opacity:.42;cursor:not-allowed;text-decoration:none;
}
.verse-dialog .verse-dialog__pick[aria-busy="true"] { cursor:wait; }
.verse-dialog .verse-dialog__selection-note {
    display:block;margin:0;padding:0;color:#756861;
    font:400 11px/1.2 "Roboto Regular",Arial,sans-serif;overflow-wrap:anywhere;
}
.verse-dialog .verse-dialog__upload .verse-dialog__remove-file {
    appearance:none;position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;
    flex:0 0 auto;min-height:28px;width:auto;margin:0;padding:3px 6px;
    border:0;border-radius:2px;background:transparent;color:var(--verse-accent);
    font:400 12px/1.2 "Roboto Regular",Arial,sans-serif;letter-spacing:0;text-transform:none;
    text-decoration:underline;text-underline-offset:3px;cursor:pointer;
}
.verse-dialog :is(.verse-dialog__pick,.verse-dialog__remove-file):focus-visible {
    outline:2px solid var(--verse-accent);outline-offset:2px;
}
@media (max-width:600px) {
    .verse-dialog .verse-dialog__picker { gap:2px 15px;margin-top:-6px;margin-bottom:12px; }
    .verse-dialog .verse-dialog__pick { min-height:32px;font-size:11px; }
    .verse-dialog .verse-dialog__selection-note { font-size:10px;line-height:1.1; }
    .verse-dialog .verse-dialog__upload .verse-dialog__remove-file { min-height:32px;font-size:11px; }
}
.verse-dialog.is-submitted .verse-dialog__picker,
.verse-dialog.is-submitted .verse-dialog__selection-note { display:none; }

/* A quiet guide for the signature on the photographed sheet. */
.verse-dialog .verse-dialog__verse-footer {
    display:flex;justify-content:flex-end;margin-top:8px;
}
.verse-dialog .verse-dialog__signature-cue {
    display:flex;align-items:center;justify-content:center;flex:0 0 138px;width:100%;
    min-height:36px;max-width:100%;margin-left:auto;padding:7px 8px;
    border:1px dashed #b9afa6;border-radius:2px;color:#857b73;
    font:400 10px/1.3 "Roboto Regular",Arial,sans-serif;text-align:center;
}
.verse-dialog .verse-dialog__selection-note:not([hidden]) { margin:-8px 0 12px; }
.verse-dialog.is-submitted .verse-dialog__verse-footer { display:none; }
@media(max-width:600px) {
    .verse-dialog .verse-dialog__verse-footer { margin-top:7px; }
    .verse-dialog .verse-dialog__signature-cue { flex-basis:126px;min-height:34px;font-size:10px; }
}

.verse-dialog .verse-dialog__pick[data-verse-pick="previous"] { max-width:100%;white-space:normal; }