/* A separate viewing surface: zoom never changes the designer underneath. */
html.collage-preview-open,html.collage-preview-open body{touch-action:none;overscroll-behavior:none}
#preview-open{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:7px 10px;background:#fff;border:1px solid #d7d1c8;border-radius:7px;color:#60384c;font-size:11px;white-space:nowrap;touch-action:manipulation}
#preview-open:hover:not(:disabled){background:#f8eaf1;border-color:#b8899f}
.collage-preview-dialog{position:fixed;inset:0;margin:auto;padding:0;width:min(1120px,calc(100vw - 36px));height:min(880px,calc(100vh - 40px));height:min(880px,calc(100dvh - 40px));max-width:none;max-height:none;border:1px solid #ded8cf;border-radius:18px;background:#f7f6f2;color:#252522;overflow:hidden;box-shadow:0 28px 100px #100d1759;overscroll-behavior:none;touch-action:pan-x pan-y}
.collage-preview-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.collage-preview-dialog::backdrop{background:#24212c99;backdrop-filter:blur(6px);touch-action:none;overscroll-behavior:none}
.collage-preview-dialog,.collage-preview-dialog *{touch-action:none}
.collage-preview-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 24px;border-bottom:1px solid #e1ddd5}
.collage-preview-dialog h2{font-size:24px;line-height:1.2;font-weight:500;letter-spacing:-.6px;margin:0}
.collage-preview-caption{font-size:12px;line-height:1.4;color:#79746e;margin:5px 0 0}
.collage-preview-close{flex-shrink:0;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:10px 15px;border:1px solid #d6d1c8;background:#fff;border-radius:8px;font-size:13px;touch-action:manipulation}
.collage-preview-close span{font-size:23px;line-height:1;font-weight:300}
.collage-preview-close:hover{background:#eee9e2}
.collage-preview-surface{position:relative;min-width:0;min-height:0;overflow:hidden;background:#e8e4dc;background-image:radial-gradient(#bdb8ad70 .8px,transparent .8px);background-size:15px 15px;touch-action:none;overscroll-behavior:none;user-select:none;-webkit-user-select:none;outline-offset:-5px!important;cursor:default}
.collage-preview-surface[data-zoomed=true]{cursor:grab}
.collage-preview-surface[data-dragging=true]{cursor:grabbing}
.collage-preview-canvas{position:absolute;left:50%;top:50%;display:block;max-width:none!important;max-height:none!important;background:#fff;box-shadow:0 10px 35px #28212c33;transform-origin:center;will-change:transform;pointer-events:none;user-select:none;-webkit-user-select:none}
.collage-preview-footer{display:block;background:#f7f6f2;border-top:1px solid #ded8cf;padding:15px 24px 17px}
.collage-preview-booth{display:flex;align-items:center;justify-content:center;gap:13px;width:100%;max-width:620px;min-height:64px;margin:0 auto 14px;padding:13px 20px;border:1px solid #713d57;border-radius:10px;background:#713d57;color:#fff;text-align:left;line-height:1.35;box-shadow:0 4px 12px #49313f1a}
.collage-preview-booth:hover:not(:disabled){background:#8b496c;border-color:#8b496c}
.collage-preview-booth:disabled{opacity:.6;box-shadow:none}
.collage-preview-booth>span:nth-child(2){min-width:0}
.collage-preview-booth strong{display:block;font-size:16px;font-weight:600}
.collage-preview-booth small{display:block;font-size:11px;font-weight:400;color:#f2dfe9;margin-top:3px}
.collage-preview-phone{display:block;flex-shrink:0;width:25px;height:34px}
.collage-preview-phone svg{display:block;width:100%;height:100%}
.collage-preview-booth-arrow{font-size:25px;line-height:1;flex-shrink:0;margin-left:6px}
.collage-preview-toolbar{display:flex;align-items:center;justify-content:center;gap:12px}
.collage-preview-toolbar button{flex-shrink:0;min-width:44px;min-height:44px;border:1px solid #d6d1c8;background:#fff;border-radius:8px;font-size:23px;line-height:1;touch-action:manipulation}
.collage-preview-toolbar button:hover:not(:disabled){background:#f3e2eb;border-color:#b8899f}
.collage-preview-toolbar .collage-preview-fit{padding:10px 15px;font-size:13px;min-width:64px}
.collage-preview-zoom-label{display:flex;align-items:center;gap:12px;min-width:0;width:min(300px,42vw);font-size:12px;font-weight:400}
.collage-preview-zoom-label input{width:100%;min-width:45px;min-height:44px!important;padding:0;margin:0!important;touch-action:none}
.collage-preview-zoom-label output{float:none;flex-shrink:0;min-width:43px;text-align:right;color:#63374f;font-size:13px;font-variant-numeric:tabular-nums}
.collage-preview-instructions{text-align:center;font-size:11px;line-height:1.5;color:#827a70;margin:10px 0 0}
.collage-preview-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:600px){
 .collage-preview-dialog{width:100vw;height:100vh;height:100dvh;border:0;border-radius:0;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
 .collage-preview-header{padding:14px 16px;gap:12px}
 .collage-preview-dialog h2{font-size:21px;letter-spacing:-.4px}
 .collage-preview-caption{font-size:11px;max-width:225px}
 .collage-preview-close{padding:9px 12px;font-size:12px;gap:7px}
 .collage-preview-footer{padding:12px 14px 14px}
 .collage-preview-booth{gap:10px;padding:12px;min-height:62px;margin-bottom:12px}
 .collage-preview-booth strong{font-size:14px}
 .collage-preview-booth small{font-size:10px}
 .collage-preview-phone{width:22px;height:30px}
 .collage-preview-booth-arrow{font-size:22px;margin-left:auto}
 .collage-preview-toolbar{gap:8px}
 .collage-preview-zoom-label{gap:7px;width:auto;flex:1}
 .collage-preview-zoom-label output{font-size:12px;min-width:38px}
 .collage-preview-toolbar .collage-preview-fit{min-width:51px;padding:10px}
 .collage-preview-instructions{font-size:10px;margin-top:8px}
}
@media(max-height:480px){.collage-preview-header{padding:9px 16px}.collage-preview-dialog h2{font-size:19px}.collage-preview-caption{display:none}.collage-preview-footer{padding:8px 16px}.collage-preview-instructions{display:none}.collage-preview-booth{min-height:48px;padding:8px 14px;margin-bottom:8px}.collage-preview-booth small{display:none}.collage-preview-phone{height:28px;width:21px}}