/* Compact B layout: both image composers stay within one viewport. */
.official-qr-style-modal{padding:12px}.official-qr-style-card{display:flex;flex-direction:column;width:min(680px,calc(100vw - 24px));height:min(720px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);padding:18px 20px;overflow:hidden}.official-qr-style-card>h3{margin:1px 0 2px}.official-qr-style-card>p:not(.eyebrow){margin-bottom:6px}.official-qr-composer-heading{flex:0 0 auto;margin:7px 0 5px}.official-qr-composer-preview-wrap{flex:1 1 auto;min-height:0;padding:8px;overflow:hidden}#official-qr-composer-preview{width:100%;max-width:100%;height:100%;max-height:100%;object-fit:contain}.official-qr-style-grid{display:flex;flex:0 0 auto;gap:7px;margin:0;padding:1px 1px 5px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scroll-snap-type:x mandatory}.official-qr-style-grid button{display:grid;flex:0 0 78px;gap:4px;min-height:0;padding:5px;scroll-snap-align:start}.official-qr-style-grid i{height:30px}.official-qr-style-grid span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.official-qr-composer-actions{display:flex;flex:0 0 auto;gap:8px;margin-top:7px}.official-qr-composer-actions>button{flex:1;min-height:40px}.official-qr-composer-actions>p{flex:1;padding:8px}
.success-poster-modal{padding:12px}.success-poster-dialog{display:flex;flex-direction:column;width:min(680px,calc(100vw - 24px));min-width:0;height:min(720px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);overflow:hidden}.success-poster-dialog>header{flex:0 0 auto;padding:14px 18px 10px}.success-poster-dialog>header .eyebrow,.success-poster-dialog>header p:last-child{display:none}.success-poster-layout{width:100%;min-width:0;display:grid;flex:1 1 auto;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:8px;min-height:0;padding:10px 14px 14px}.success-poster-preview{width:100%;min-width:0;min-height:0;padding:6px;overflow:hidden}.success-poster-preview img{width:100%;max-width:100%;height:100%;max-height:100%;object-fit:contain;object-position:center}.success-poster-controls{width:100%;min-width:0;min-height:0;gap:7px}.success-poster-controls>strong{font-size:12px}.success-poster-styles{width:100%;max-width:100%;min-width:0;display:flex;gap:7px;padding:1px 1px 5px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-x;overscroll-behavior-inline:contain;scrollbar-width:thin;scroll-snap-type:x mandatory}.success-poster-styles button{flex:0 0 auto;min-height:36px;padding:7px 10px;white-space:nowrap;scroll-snap-align:start}.success-poster-controls>#copy-success-poster{min-height:40px;margin-top:0}.success-poster-controls>p{margin:0;padding:7px}
@media(max-width:700px){.official-qr-style-modal,.success-poster-modal{align-items:stretch;padding:0}.official-qr-style-card,.success-poster-dialog{width:100%;height:100dvh;max-height:100dvh;border-radius:0}.official-qr-style-card{padding:14px 12px max(12px,env(safe-area-inset-bottom))}.official-qr-style-card>.eyebrow,.official-qr-style-card>p:not(.eyebrow){display:none}.official-qr-style-card>h3,.success-poster-dialog h3{font-size:18px}.official-qr-composer-heading{margin:5px 0 4px}.official-qr-composer-preview-wrap{padding:6px}.official-qr-style-grid,.success-poster-styles{gap:6px;padding-bottom:4px}.official-qr-style-grid button{flex-basis:70px}.official-qr-style-grid i{height:26px}.official-qr-composer-actions{margin-top:5px}.official-qr-composer-actions>button{min-height:38px}.success-poster-dialog>header{padding:12px 14px 8px}.success-poster-layout{padding:8px 10px max(10px,env(safe-area-inset-bottom))}.success-poster-preview{padding:4px}.success-poster-controls{gap:5px}.success-poster-styles button{min-height:34px;padding:6px 9px}.success-poster-controls>p{display:block!important;padding:6px}}
.official-qr-composer-preview-wrap{position:relative}#official-qr-composer-preview{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px)}.success-poster-preview{position:relative}.success-poster-preview img{position:absolute;inset:6px;width:calc(100% - 12px);height:calc(100% - 12px)}
#cancel-official-qr-style{display:none}@media(max-width:700px){.official-qr-style-modal{background:#07131d}.official-qr-style-modal>.official-qr-preview-mask{background:#07131d;backdrop-filter:none}.official-qr-style-card{background:#07131d;color:#fff;padding:18px 12px max(18px,env(safe-area-inset-bottom));box-shadow:none}.official-qr-style-card>h3,.official-qr-style-card>p,.official-qr-style-card>.official-qr-composer-heading,.official-qr-style-card>.overlay-close{display:none}.official-qr-composer-preview-wrap{background:transparent;border-radius:0;padding:0}#official-qr-composer-preview{inset:0;width:100%;height:100%;border-radius:12px;box-shadow:none}.official-qr-style-grid{gap:10px;margin:14px 0 10px;padding:2px 0 6px}.official-qr-style-grid button{flex:0 0 62px;padding:4px;border-color:transparent;background:transparent}.official-qr-style-grid button.selected{border-color:#fff;background:rgba(255,255,255,.08);box-shadow:none}.official-qr-style-grid i{height:48px;border-radius:7px}.official-qr-style-grid span{display:none}.official-qr-composer-actions{display:grid;gap:10px;margin:0}.official-qr-composer-actions>#copy-official-qr-image{display:none!important}#official-qr-mobile-save-hint{display:block!important;padding:8px;background:transparent;color:#dce6eb;font-size:13px}#cancel-official-qr-style{display:block;min-height:52px;border:1px solid #56636d;border-radius:26px;background:transparent;color:#fff;font-size:17px}}
#cancel-success-poster{display:none}@media(max-width:700px){.success-poster-dialog>header .overlay-close{display:none}.success-poster-preview{width:min(100%,calc((100dvh - 190px)*.8));aspect-ratio:4/5;align-self:center;background:transparent}.success-poster-preview img{inset:0;width:100%;height:100%}#cancel-success-poster{display:block;min-height:48px;border:1px solid var(--line);background:#fff;color:#34443e}}