.booklet-intro{margin-bottom:22px}.booklet-intro h3{font-size:30px;margin:0 0 9px}.booklet-intro p{font-size:12px;margin:6px 0;color:var(--muted)}
.booklet-media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0 27px}
.booklet-media-item{margin:0;padding:9px;border:1px solid #d8c9ac;border-radius:12px;background:#fffcf6;min-width:0}
.booklet-media-preview{display:grid;place-items:center;width:100%;height:150px;padding:6px;background:#eee8db;border-radius:7px;border:1px solid transparent;color:var(--ink);font-size:11px}
.booklet-media-preview[aria-pressed="true"]{border-color:#9b783c;outline:1px solid #9b783c;outline-offset:2px}
.booklet-media-preview img{width:100%;height:100%;object-fit:contain;min-height:0}
.booklet-media-item figcaption{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:9px 2px 0;font-size:12px}.booklet-media-item small{display:block;font-size:10px;color:var(--muted)}
.booklet-media-item .text-button,.booklet-video-choice .text-button{min-height:44px;padding:7px 6px}
.booklet-video-choice{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0 24px;font-size:11px;overflow-wrap:anywhere}
.booklet-video-choice>span{flex:1;min-width:120px}
.booklet-flow{display:flex;align-items:center;flex-wrap:wrap;gap:9px;margin:24px 0 10px;padding-top:18px;border-top:1px solid var(--line);font-size:11px;color:var(--ink)}.booklet-flow span{color:var(--gold)}
.booklet-navigation{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:14px;font-size:12px}
.booklet-navigation>span{text-align:center;line-height:1.35;min-width:0}.booklet-navigation small{display:block;font-size:10px;color:var(--muted);margin-top:3px}
.booklet-navigation button{min-height:44px;padding:9px 12px;border:1px solid #cbb78f;border-radius:24px;background:#fffcf5;color:#304939;font-size:11px}
.booklet-navigation button:disabled{opacity:.35;cursor:default}
.booklet-surprises{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px}
.recipient-wrap>.booklet-reader{max-width:760px;margin:28px auto;padding:24px;background:#eee7d9;border:1px solid #d5c6a9;border-radius:14px}
.booklet-reader .miniature[data-styled]{width:100%;height:100%;max-width:none;min-height:0;transform:none}
.booklet-reader .booklet-page-cover .miniature[data-styled]{--title-base:35px;padding:28px}
.editor-preview .preview-desk.showing-attachments{display:block;padding:18px!important}
.editor-preview .booklet-viewport{width:100%;display:grid;place-items:center}
#floating-preview-host .booklet-navigation{pointer-events:none}
#floating-preview-host .booklet-surprises{display:none}
@media(max-width:760px){
 #floating-preview-host .floating-preview-viewport>.showing-attachments,#floating-preview-host .floating-preview-viewport>.showing-message{height:auto;max-height:none}
 #floating-preview-dialog .booklet-navigation{gap:6px}
 .booklet-reader .booklet-page-cover .miniature[data-styled]{--title-base:30px;padding:21px}
 .recipient-wrap>.booklet-reader{padding:13px}
 .booklet-media-preview{height:125px}
}

.message-composer{padding:18px;border:1px solid #d5c29e;border-radius:12px;background:#fffcf6;margin-bottom:20px}.message-composer .field{margin-bottom:10px}.message-composer .field>span{font-size:14px;color:var(--ink)}.message-composer textarea{min-height:210px;resize:vertical;font-size:16px;line-height:1.6;background:#fffefb}.message-composer .fine{margin:0;line-height:1.6}.cover-composer{margin-bottom:24px}.booklet-intro .text-button{min-height:44px}.preview-under{flex-wrap:wrap;gap:10px}.preview-under [data-action="edit-message"]{min-height:44px}.booklet-flow strong{flex-basis:100%;font-weight:500}.editor-controls .more>summary{min-height:44px;display:flex;align-items:center}.editor-controls .more .font-choices{margin-top:12px}
.video-import-status{margin:14px 0 20px;padding:15px;border:1px solid #d4c2a0;border-radius:10px;background:#f2eddf;font-size:12px;line-height:1.6}.video-import-status p{margin:0 0 10px}.video-import-status progress{display:block;width:100%;height:8px;accent-color:#375740;margin:10px 0}.video-import-status .text-button{min-height:44px}.video-import-status[hidden],.video-import-status [hidden]{display:none!important}
@media(max-width:760px){.message-composer{padding:14px}.message-composer textarea{min-height:190px}.editor-controls input:not([type="color"]):not([type="checkbox"]),.editor-controls textarea,.editor-controls select{font-size:16px}}

.preview-heading-actions{display:flex;align-items:center;gap:6px;flex:none}

.booklet-photo-adjust{display:block;width:100%;min-height:44px;margin-top:9px;padding:8px 12px;border:1px solid #c6ad7a;border-radius:22px;background:#faf3e2;color:#304939;font:600 12px/1.4 var(--sans,Arial,sans-serif)}
.booklet-photo-adjust:disabled{opacity:.5}
.booklet-photo-editor{margin:0 0 28px;padding:20px;border:1px solid #cbb58a;border-radius:14px;background:#fffdf8;scroll-margin-top:calc(var(--header-height,94px) + 18px)}
.booklet-photo-editor-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.booklet-photo-editor-heading h3{margin:0;font-size:26px;line-height:1.15}.booklet-photo-editor-heading .text-button{min-height:44px}
.booklet-photo-stage{width:100%;max-width:420px;margin:0 auto 18px;outline-offset:5px}
.booklet-photo-stage[data-fit="cover"] .booklet-photo-window{touch-action:none;cursor:grab}
.booklet-photo-stage[data-fit="cover"] .booklet-photo-window:active{cursor:grabbing}
.booklet-photo-stage[data-fit="contain"] .booklet-photo-window{touch-action:pan-y}
.booklet-photo-fit{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}
.booklet-photo-fit button{min-height:44px;padding:10px;border:1px solid #d1c4a8;border-radius:9px;background:#fffdf7;color:#304939;font:500 13px/1.4 var(--sans,Arial,sans-serif)}
.booklet-photo-fit button[aria-pressed="true"]{border-color:#385841;background:#e9eee3;box-shadow:inset 0 0 0 1px #385841}
.booklet-photo-range{display:block;margin:15px 0}.booklet-photo-range>span{display:flex;justify-content:space-between;gap:14px;font-size:12px;color:#334b3a}.booklet-photo-range output{font-variant-numeric:tabular-nums;color:#8d6a36}.booklet-photo-range input{display:block;width:100%;min-height:44px;accent-color:#385841;padding:0;touch-action:pan-y}.booklet-photo-range input:disabled{opacity:.38}
.booklet-photo-editor .fine{font-size:12px;line-height:1.55}.booklet-photo-status:empty{display:none}
@media(max-width:760px){.booklet-photo-editor{padding:15px;scroll-margin-top:18px}.booklet-photo-editor-heading h3{font-size:25px}.booklet-photo-fit button{font-size:14px}}

/* Names are edited beside the cover where they appear. */
.cover-names{margin:0 0 22px;padding:18px 20px;border:1px solid #d5c29e;border-radius:12px;background:#fffcf6}
.cover-names h3{font-family:inherit;font-size:15px;font-weight:600;margin:0 0 14px;color:var(--ink)}
.cover-names .field{margin-bottom:0}.cover-names .field-row{margin:0}
.creation-names-summary{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;padding:0 0 16px;margin-bottom:12px;border-bottom:1px solid #ded4bf}
.creation-names-summary p{margin:0;color:var(--muted);font-size:13px}.creation-names-summary strong{font-weight:500;color:var(--ink)}
.creation-names-summary .text-button{min-height:44px}
@media(max-width:760px){.cover-names{padding:16px}.cover-names .field-row{gap:14px}.preview-heading-actions [data-action="edit-names"]{padding-inline:10px}}