:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#000;--muted:#737373;--line:#dedede;--accent:#ed4d26}*{box-sizing:border-box}body{color:var(--ink);background:#f5f5f5;margin:0;font-family:Arial,Helvetica,sans-serif;font-size:13px}button,input{font:inherit;color:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.topbar{justify-content:flex-end;align-items:center;height:100px;margin:0 48px;display:flex}.print{background:var(--ink);color:#fff;border:0;align-items:center;gap:25px;padding:13px 18px;display:flex}.print:disabled{opacity:.35;cursor:default}.workspace{grid-template-columns:260px minmax(0,1fr);gap:72px;margin:0 48px;display:grid}aside{padding-top:32px;padding-bottom:32px}.preview-heading{letter-spacing:.07em;color:var(--muted);justify-content:space-between;font-size:11px;display:flex}.upload{background:0 0;border:1px dashed #bdbdbd;flex-direction:column;justify-content:center;align-items:center;gap:8px;width:100%;min-height:142px;display:flex}.upload:hover,.upload.dragging{background:#ebebeb;border-color:#bdbdbd}.plus{margin-bottom:5px;font-size:30px;font-weight:300;line-height:1}small{color:var(--muted);font-size:11px}.number-field{justify-content:space-between;align-items:center;margin-bottom:27px;display:flex}.range-field{margin-bottom:27px;display:block}.range-field>span{justify-content:space-between;margin-bottom:16px;display:flex}output{font-variant-numeric:tabular-nums;color:var(--muted)}input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:24px;margin:0;display:block}input[type=range]::-webkit-slider-runnable-track{background:#bdbdbd;border:0;height:1px}input[type=range]::-moz-range-track{background:#bdbdbd;border:0;height:1px}input[type=range]::-webkit-slider-thumb{appearance:none;background:linear-gradient(var(--ink), var(--ink)) center / 2px 18px no-repeat;border:0;border-radius:0;width:20px;height:24px;margin-top:-11.5px}input[type=range]::-moz-range-thumb{background:linear-gradient(var(--ink), var(--ink)) center / 2px 18px no-repeat;border:0;border-radius:0;width:20px;height:24px}input[type=range]::-moz-range-progress{background:#bdbdbd;height:1px}.range-field>span{margin-bottom:6px}.preview{min-width:0;padding:32px 0 50px}.preview-heading{max-width:760px;margin:0 auto 22px}.sheets{max-width:760px;margin:auto}.sheet{width:100%;aspect-ratio:var(--sheet-width) / var(--sheet-height);background:#fff;position:relative}.image-grid{left:var(--margin-x);right:var(--margin-x);top:var(--margin-y);bottom:var(--margin-y);grid-template-columns:repeat(var(--columns), minmax(0, 1fr));grid-template-rows:repeat(var(--rows), minmax(0, 1fr));column-gap:var(--gap-x);row-gap:var(--gap-y);display:grid;position:absolute}.image-cell{min-width:0;min-height:0;overflow:hidden}.image-cell img{width:100%;height:100%;display:block}.placeholder{color:#bdbdbd;font-variant-numeric:tabular-nums;background:#f2f2f2;justify-content:center;align-items:center;font-size:11px;display:flex}.photo-list{max-height:224px;margin-top:15px;overflow:auto}.photo-row{align-items:center;gap:9px;padding:7px 0;display:flex}.photo-row img{object-fit:cover;width:32px;height:32px}.photo-row>span{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:11px;overflow:hidden}.photo-row button{color:var(--muted);background:0 0;border:none;padding:5px;font-size:20px}.error{color:#ae331a;font-size:12px;line-height:1.5}@media (min-width:1400px){.workspace{gap:100px}.sheets,.preview-heading{max-width:700px}}@media (max-width:800px){.topbar{height:80px;margin:0 22px}h1{font-size:25px}.workspace{grid-template-columns:220px minmax(0,1fr);gap:30px;margin:0 22px}}@media (max-width:600px){.workspace{display:block}.print{gap:10px;padding:11px;font-size:11px}aside{padding-top:24px}.upload{min-height:110px}.preview{padding-top:8px}}@media print{body{background:#fff}.topbar,aside,.preview-heading,.page-number{display:none!important}main,.workspace,.preview,.sheets{max-width:none;margin:0;padding:0;display:block}.sheet{width:calc(var(--sheet-width) * 1mm);height:calc(var(--sheet-height) * 1mm);aspect-ratio:auto;break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact}.page-wrap{break-after:page}.page-wrap:last-child{break-after:auto}}.toggle-field{cursor:pointer;justify-content:space-between;align-items:center;min-height:28px;margin:0 0 18px;display:flex}.toggle-field input{appearance:none;cursor:pointer;background:0 0;border:1px solid #a3a3a3;border-radius:0;flex-shrink:0;width:14px;height:14px;margin:0}.toggle-field input:hover{border-color:var(--ink)}.toggle-field input:checked{border-color:var(--ink);background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='m2.5 6 2.2 2.2 4.8-4.8' fill='none' stroke='white' stroke-width='1'/%3E%3C/svg%3E") center no-repeat}.sheet.black-paper{background:#000}.contain-image{justify-content:center;align-items:center;display:flex}.contain-image img{width:auto;max-width:100%;height:auto;max-height:100%}.bordered-image img{border:.25mm solid #000}.layout-controls{margin-top:36px}.page-wrap+.page-wrap{margin-top:28px}@media print{.page-wrap+.page-wrap{margin-top:0}}@media screen{main{flex-direction:column;height:100dvh;display:flex;overflow:hidden}.topbar{flex:0 0 76px;height:76px}.workspace{flex:1;min-height:0;padding-bottom:24px}aside{min-height:0;padding:12px 8px 24px 0;overflow-y:auto}.preview{flex-direction:column;min-height:0;padding:12px 0 0;display:flex}.preview-heading{flex-shrink:0;align-items:center;width:100%;max-width:none;height:24px;margin:0 0 16px}.sheets{flex:1;justify-content:center;align-items:center;width:100%;max-width:none;min-height:0;margin:0;display:flex}.page-wrap{width:var(--preview-width);flex-shrink:0}.page-wrap+.page-wrap{margin:0}.page-wrap.screen-hidden{display:none}.sheet{width:var(--preview-width)}}.page-navigation{align-items:center;gap:12px;display:flex}.page-navigation button{background:0 0;border:0;padding:4px}.page-navigation button:disabled{opacity:.25;cursor:default}.guides{pointer-events:none;z-index:1;position:absolute;inset:0;overflow:hidden}.guide-line{background:#000;position:absolute}.guide-line.vertical{width:1px;top:0;bottom:0}.guide-line.horizontal{height:1px;left:0;right:0}@media screen and (max-width:600px){.topbar{flex-basis:56px;height:56px}.workspace{grid-template-rows:minmax(0,3fr) minmax(0,2fr);grid-template-columns:minmax(0,1fr);gap:20px;padding-bottom:12px;display:grid}.preview{grid-row:1;padding:0}aside{grid-row:2;padding-top:0}}@media print{.guides{display:none}.page-wrap.screen-hidden{display:block}}@media screen{.workspace{padding-top:24px}aside{padding-right:24px}aside>.print{justify-content:space-between;width:100%;margin-top:28px}}.stepper{align-items:center;gap:4px;display:flex}.stepper button{background:0 0;border:0;place-items:center;width:30px;height:32px;padding:0;font-size:18px;font-weight:400;display:grid}.stepper button:hover:not(:disabled){background:#ebebeb}.stepper button:disabled{opacity:.2;cursor:default}.stepper output{text-align:center;min-width:28px;color:var(--ink);font-variant-numeric:tabular-nums}.orientation-field{justify-content:space-between;align-items:center;margin-bottom:27px;display:flex}.orientation-switch{background:#e9e9e9;border-radius:5px;align-items:center;gap:2px;padding:3px;display:flex}.orientation-switch button{color:#737373;background:0 0;border:0;border-radius:3px;place-items:center;width:34px;height:30px;padding:0;display:grid}.orientation-switch button:hover{color:#000}.orientation-switch button[aria-pressed=true]{color:#000;background:#fff}aside{font-size:12px}.number-field,.orientation-field{margin-bottom:20px}.stepper{background:#e9e9e9;border-radius:5px;gap:0;padding:2px}.stepper button{color:#555;border-radius:3px;width:28px;height:28px;font-size:16px}.stepper button:hover:not(:disabled){color:#000;background:#fff}.stepper output{min-width:30px;font-size:12px}.range-field{margin-bottom:20px}.range-field>span{align-items:center;margin-bottom:4px}.range-field output{text-align:right;color:#333;background:#e9e9e9;border-radius:4px;min-width:54px;padding:5px 7px;font-size:11px}input[type=range]::-webkit-slider-runnable-track{background:#d0d0d0;border-radius:1px;height:2px}input[type=range]::-moz-range-track{background:#d0d0d0;border-radius:1px;height:2px}input[type=range]::-moz-range-progress{background:#d0d0d0;border-radius:1px;height:2px}input[type=range]::-webkit-slider-thumb{background:linear-gradient(#333,#333) 50%/3px 14px no-repeat;margin-top:-11px}input[type=range]::-moz-range-thumb{background:linear-gradient(#333,#333) 50%/3px 14px no-repeat}.toggle-field{color:#444;flex-direction:row-reverse;justify-content:flex-end;gap:10px;min-height:32px;margin-bottom:4px;font-size:12px;line-height:1.4}.toggle-field input{background-color:#fff;border-color:#a6a6a6;border-radius:3px;width:14px;height:14px}.toggle-field input:checked{background-color:#333;border-color:#333}button:focus-visible,input:focus-visible{outline-offset:3px;outline-width:1px;outline-color:#555}.upload{border-style:solid;border-color:#dedede;border-radius:5px;flex-direction:row;gap:9px;height:64px;min-height:0}.upload .plus{margin:0;font-size:22px}.upload small{display:none}.photo-row{cursor:grab;border-radius:3px;gap:6px}.photo-row:active{cursor:grabbing}.photo-row.photo-drop-target{background:#e4e4e4}.photo-row .drag-handle{color:#999;flex:0 0 12px;font-size:16px}.photo-row .photo-name{font-size:11px}.photo-actions{flex-shrink:0;display:flex}.photo-actions button{border-radius:3px;padding:4px;font-size:13px}.photo-actions button:disabled{opacity:.2;cursor:default}.mobile-print{display:none}@media screen and (max-width:600px){main{height:auto;min-height:100dvh;display:block;overflow:visible}.workspace{flex-direction:column;gap:28px;margin:0 20px;padding:20px 0 28px;display:flex}aside{order:0;padding:0;overflow:visible}.upload{height:52px}.layout-controls{margin-top:24px}.number-field,.orientation-field{min-height:44px;margin-bottom:14px}.stepper button{width:40px;height:38px}.stepper output{min-width:36px}.orientation-switch button{width:42px;height:38px}.toggle-field{min-height:44px;margin-bottom:0}.toggle-field input{width:18px;height:18px}input[type=range]{height:38px}.photo-list{max-height:none}.photo-actions button{min-width:32px;min-height:40px}.desktop-print{display:none}.preview{order:1;padding:0;display:block}.preview-heading{justify-content:center}.sheets{width:100%;display:block}.page-wrap,.sheet{width:100%}.mobile-print{justify-content:space-between;align-items:center;width:100%;min-height:48px;margin-top:20px;padding:14px 16px;font-size:13px;display:flex}}@media print{.mobile-print{display:none!important}}.preset-field{justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}.preset-field select{font:inherit;color:#333;cursor:pointer;background:#e9e9e9;border:0;border-radius:5px;max-width:160px;padding:8px}.preset-field select:focus-visible{outline-offset:3px;outline:1px solid #555}@media (max-width:600px){.preset-field select{min-height:44px}}.layout-switch{background:#e9e9e9;border-radius:5px;gap:2px;padding:3px;display:flex}.layout-switch button{color:#737373;background:0 0;border:0;border-radius:3px;padding:8px 10px;font-size:11px}.layout-switch button[aria-pressed=true]{color:#000;background:#fff}.adaptive-images{position:absolute;inset:0}.adaptive-cell{position:absolute}.adaptive-cell img{object-fit:contain}@media (max-width:600px){.layout-switch button{min-height:38px}}@media screen{.sheets{scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;padding-inline:max(0px, calc((100% - var(--preview-width)) / 2));justify-content:flex-start;align-items:center;gap:24px;display:flex;position:relative;overflow:auto hidden}.sheets::-webkit-scrollbar{display:none}.page-wrap{scroll-snap-align:center;scroll-snap-stop:always}.page-wrap+.page-wrap{margin:0}.carousel-navigation{flex-shrink:0;justify-content:flex-end;align-items:center;gap:18px;padding-top:16px;display:flex}.page-counter{color:#737373;font-variant-numeric:tabular-nums;font-size:12px}.carousel-buttons{gap:8px;display:flex}.carousel-buttons button{background:#e5e5e5;border:0;border-radius:50%;place-items:center;width:40px;height:40px;font-size:19px;display:grid}.carousel-buttons button:hover:not(:disabled){background:#d8d8d8}.carousel-buttons button:disabled{opacity:.3;cursor:default}}@media screen and (max-width:600px){.sheets{gap:16px;padding-inline:0;display:flex}.page-wrap{flex:0 0 100%;width:100%}.carousel-navigation{justify-content:space-between;padding-top:14px}.carousel-buttons button{width:44px;height:44px}}@media print{.carousel-navigation{display:none}}@media screen{.carousel-navigation.navigation-hidden{visibility:hidden;pointer-events:none}}.photo-list{overscroll-behavior:contain;max-height:300px;padding:2px;overflow-y:auto}.photo-row{cursor:default;background:#ebebeb;border-radius:5px;align-items:center;gap:8px;margin-bottom:4px;padding:8px 4px;display:flex}.photo-row img{object-fit:contain;flex-shrink:0;width:42px;height:48px}.photo-row .drag-handle{color:#777;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;flex:0 0 24px;place-items:center;width:24px;height:48px;padding:0;display:grid}.photo-row .drag-handle:active{cursor:grabbing}.photo-info{flex:1;min-width:0}.photo-name{text-overflow:ellipsis;white-space:nowrap;font-size:11px;line-height:1.5;display:block;overflow:hidden}.photo-actions button{color:#333;background:#f5f5f5;width:28px;min-height:28px;padding:0}.photo-row .remove-photo{color:#666;flex:0 0 32px;place-items:center;height:44px;padding:0;display:grid}.photo-row.photo-drop-target{outline-offset:-2px;background:#ddd;outline:2px solid #555}.photo-row.photo-dragging{opacity:.5}@media (max-width:600px){.photo-list{max-height:340px}.photo-actions button{width:40px;min-height:36px}.photo-row .remove-photo{flex-basis:44px}}.image-cell{justify-content:center;align-items:center;display:flex;container-type:size}.photo-figure{min-width:0;width:min(100cqw, calc((100cqh - var(--caption-height)) * var(--photo-ratio)));margin:0}.image-cell .photo-figure img{width:100%;height:auto;max-height:none;aspect-ratio:var(--photo-ratio);object-fit:contain;display:block}.photo-figure figcaption{height:var(--caption-height);padding-top:calc(var(--caption-height) * .25);font-size:var(--caption-size);letter-spacing:.015em;text-align:right;white-space:nowrap;text-overflow:ellipsis;color:#333;font-weight:400;line-height:1.2;overflow:hidden}.black-paper figcaption{color:#fff}@media screen and (max-width:600px){.sheet{--caption-size:calc((100vw - 40px) * 2 / var(--sheet-width))!important;--caption-height:0px!important}.sheet.with-names{--caption-height:calc((100vw - 40px) * 4 / var(--sheet-width))!important}}@media print{.sheet{--caption-height:0mm!important;--caption-size:2mm!important}.sheet.with-names{--caption-height:4mm!important}}.photo-list{padding:5px 2px;position:relative}.photo-row{transition:background-color .15s;position:relative}.photo-row.insert-before:before,.photo-row.insert-after:after{content:"";z-index:2;background:#222;height:2px;position:absolute;left:0;right:0}.photo-row.insert-before:before{top:-3px}.photo-row.insert-after:after{bottom:-3px}.drag-preview{z-index:100;pointer-events:none;background:#fff;border:1px solid #aaa;border-radius:5px;align-items:center;gap:8px;width:180px;padding:8px;display:flex;position:fixed}.drag-preview img{object-fit:contain;width:36px;height:40px}.drag-preview span{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:11px;overflow:hidden}@media print{.drag-preview{display:none}}@media (prefers-reduced-motion:reduce){.photo-row{transition:none}}.photo-list{padding:4px 0}.photo-row{background:#fff;border:1px solid #e6e6e6;border-radius:5px;grid-template-columns:20px 40px minmax(0,1fr) 28px;gap:8px;margin-bottom:7px;padding:10px 8px;display:grid}.photo-row img{border-radius:2px;width:40px;height:48px}.photo-row .drag-handle{color:#aaa;background:0 0;width:20px;height:48px}.photo-row .drag-handle:hover{color:#555}.photo-info{align-self:center}.photo-name{color:#333;font-size:11px;font-weight:400;line-height:16px}.photo-actions{gap:2px;margin-top:4px}.photo-actions button{color:#666;background:0 0;border-radius:3px;width:26px;min-width:0;height:26px;min-height:26px;font-size:14px}.photo-actions button:hover:not(:disabled){color:#000;background:#f2f2f2}.photo-actions button:disabled{color:#ccc;opacity:1}.photo-row .remove-photo{color:#999;background:0 0;width:28px;height:36px}.photo-row .remove-photo:hover{color:#333;background:#f2f2f2}.photo-row.photo-dragging{opacity:1;background:#fafafa;border-color:#ddd}.photo-row.photo-dragging .photo-info,.photo-row.photo-dragging img{opacity:.55}@media (max-width:600px){.photo-row{grid-template-columns:28px 48px minmax(0,1fr) 40px;gap:10px;padding:10px}.photo-row img{width:48px;height:52px}.photo-row .drag-handle{width:28px;height:56px}.photo-name{font-size:12px;line-height:18px}.photo-actions button{width:36px;height:32px;min-height:32px}.photo-row .remove-photo{width:40px;height:44px}}.export-actions{gap:8px;margin-top:28px;display:grid}.export-actions .print{justify-content:space-between;gap:10px;width:100%}.export-actions .print-secondary{color:#333;background:#e9e9e9}.export-actions .print-secondary:hover:not(:disabled){background:#dedede}.mobile-actions{display:none}@media screen and (max-width:600px){.desktop-actions{display:none}.mobile-actions{margin-top:20px;display:grid}.export-actions .print{min-height:48px;padding:14px 16px;font-size:13px}}@media print{.export-actions{display:none!important}}