:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-6:1.5rem;--space-8:2rem;--radius-sm:.5rem;--radius-md:.875rem;--radius-lg:1.25rem;--control-height:2.5rem;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Yu Gothic UI,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root,:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-bg:#f5f7fa;--color-surface:#fff;--color-surface-muted:#eef2f6;--color-text:#17212b;--color-muted:#5d6b79;--color-border:#cfd8e3;--color-accent:#1677c8;--color-accent-strong:#0f5f9f;--color-focus:#ff8a00;--color-success-bg:#e5f8ec;--color-success-border:#258a4b;--color-success-text:#135f32;--shadow:0 12px 34px #17212b1a}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--color-bg:#0f1419;--color-surface:#16181c;--color-surface-muted:#20252b;--color-text:#e7e9ea;--color-muted:#99a6b2;--color-border:#38434e;--color-accent:#1d9bf0;--color-accent-strong:#59b8f7;--color-focus:#ffd166;--color-success-bg:#123a24;--color-success-border:#47c979;--color-success-text:#c4f8d5;--shadow:0 14px 38px #00000052}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{background:var(--color-bg);color:var(--color-text)}.save-notice{z-index:10;right:var(--space-4);bottom:var(--space-4);max-width:min(32rem,100vw - 2rem);padding:var(--space-3) var(--space-4);border:1px solid var(--color-success-border);border-radius:var(--radius-md);color:var(--color-success-text);background:var(--color-success-bg);box-shadow:var(--shadow);overflow-wrap:anywhere;font-weight:700;animation:.18s ease-out save-notice-in;position:fixed}.save-notice:before{content:"✓";margin-right:var(--space-2)}@keyframes save-notice-in{0%{opacity:0;transform:translateY(.5rem)}}button{font:inherit}button:focus-visible{outline:3px solid var(--color-focus);outline-offset:3px}.app-shell{width:100%;height:100dvh;min-height:38rem;padding:var(--space-4);gap:var(--space-3);grid-template-rows:auto auto minmax(0,1fr) auto;margin-inline:auto;display:grid}.control-pane,.control-pane-content{display:contents}.wide-controls-slot,.pane-divider{display:none}.app-header{grid-row:1}.settings-bar{grid-row:2}.editor-panel{grid-row:3}.export-bar{grid-row:4}.app-header,.settings-bar,.editor-panel,.export-bar{border:1px solid var(--color-border);background:var(--color-surface);box-shadow:var(--shadow)}.app-header{min-height:5rem;padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}h1{margin:0;font-size:clamp(1.3rem,2vw,1.8rem)}.app-header p{margin:var(--space-1) 0 0;color:var(--color-muted)}.header-actions{align-items:center;gap:var(--space-3);display:flex}.language-select select{min-height:var(--control-height);cursor:pointer;border-radius:999px}.theme-toggle{width:var(--control-height);height:var(--control-height);border:1px solid var(--color-border);color:var(--color-text);background:var(--color-surface-muted);cursor:pointer;border-radius:50%}.empty-editor{border-radius:var(--radius-lg);text-align:center;min-height:0;padding:var(--space-8);border-style:dashed;place-content:center;justify-items:center;display:grid}.split-mark{gap:var(--space-2);width:9rem;height:4.5rem;display:flex;transform:perspective(12rem)rotateX(4deg)}.split-mark span{border-radius:var(--radius-sm);background:linear-gradient(145deg, var(--color-accent), var(--color-accent-strong));flex:1}.export-bar{min-height:3rem;padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);justify-content:space-between;align-items:center;gap:var(--space-4);color:var(--color-muted);font-size:.8rem;display:flex}@media (max-height:38rem){.app-shell{height:auto}.empty-editor{min-height:22rem}}.settings-bar{padding:var(--space-2) var(--space-4);border-radius:var(--radius-md);align-items:end;gap:var(--space-4);display:flex}.settings-bar label,.export-bar label{gap:var(--space-1);padding:var(--space-1) var(--space-2) var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-muted);font-size:.76rem;display:grid}.settings-bar .page-zoom-control,.display-settings{display:none}select,input{border:1px solid var(--color-border);border-radius:var(--radius-sm);min-height:2rem;color:var(--color-text);background:var(--color-surface-muted);padding-inline:var(--space-2)}@media (hover:none) and (pointer:coarse),(max-width:48rem),(orientation:landscape) and (max-height:32rem) and (min-width:48.01rem){select,input:not([type=checkbox]){font-size:16px}.settings-bar .page-zoom-control{grid-column:1/-1;grid-template-columns:auto auto minmax(0,1fr);justify-content:start;align-items:center;min-height:3.25rem;font-size:.9rem;display:grid}.page-zoom-control input{width:1.25rem;min-height:1.25rem}.settings-bar>.display-option-direct{display:none}.display-settings{grid-column:1/-1;min-width:0;display:block}.display-settings summary{min-height:2.25rem;padding:var(--space-1) var(--space-2);align-items:center;gap:var(--space-1);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);background:var(--color-surface-muted);cursor:pointer;font-size:.85rem;list-style:none;display:inline-flex}.display-settings summary::-webkit-details-marker{display:none}.display-settings summary svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:1.15rem;height:1.15rem}.display-settings-options{margin-top:var(--space-1);gap:var(--space-1);display:grid}.display-settings-options .guide-control,.display-settings-options .page-zoom-control{grid-column:auto;min-width:0;display:grid}}.settings-control-icon{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:1.5rem;height:1.5rem}@media (min-width:48rem) and (min-height:32.01rem){.settings-bar>.guide-control.display-option-direct{display:grid}.settings-bar>.page-zoom-control.display-option-direct,.settings-bar>.display-settings{display:none}}.number-control{align-items:center;gap:var(--space-1);color:var(--color-muted);display:flex}.boundary-control .number-control{grid-template-columns:minmax(5rem,1fr) auto;display:grid}.boundary-control .number-control select{width:100%;min-width:0}.input-with-unit{border:1px solid var(--color-border);border-radius:var(--radius-sm);min-height:2rem;color:var(--color-muted);background:var(--color-surface-muted);align-items:center;display:flex;overflow:hidden}.input-with-unit:focus-within{outline:2px solid var(--color-focus);outline-offset:1px}.input-with-unit input{background:0 0;border:0;border-radius:0;outline:0;width:4.2rem}.input-with-unit>span{padding-right:var(--space-2)}.number-control button{min-height:2rem;padding-inline:var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);background:var(--color-surface-muted);cursor:pointer}.custom-ratio-control{align-items:center;gap:var(--space-1);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);width:100%;display:grid}.custom-ratio-control input{width:100%;min-width:0}@media (min-width:48.01rem){.ratio-control:has(.custom-ratio-control){grid-template-columns:minmax(7rem,auto) minmax(8rem,1fr)}.ratio-control-label{grid-column:1/-1}.ratio-control select{min-width:7rem}}.guide-control,.two-pane-control{grid-auto-flow:column;align-self:end;align-items:center;min-height:3.25rem;padding-block:var(--space-2)!important;font-size:.9rem!important}.guide-control input,.two-pane-control input{width:1rem;min-height:1rem}.editor-panel{min-height:0;padding:var(--space-3);border-radius:var(--radius-lg);grid-template-rows:auto minmax(0,1fr);display:grid;overflow:hidden}.image-meta{color:var(--color-muted);padding:0 var(--space-1) var(--space-2);justify-content:space-between;align-items:center;font-size:.8rem;display:flex}.image-details{gap:var(--space-1);display:grid}.image-details small{color:var(--color-muted);font-size:.72rem}.image-actions{align-items:center;gap:var(--space-2);display:flex}.image-meta button{color:var(--color-accent-strong);cursor:pointer;background:0 0;border:0}.image-meta .change-image-button{min-height:2rem;padding:var(--space-1) var(--space-2);justify-content:center;align-items:center;gap:var(--space-1);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);background:var(--color-surface-muted);white-space:nowrap;display:inline-flex}.change-image-button:hover{border-color:var(--color-accent);background:var(--color-surface)}.change-image-button svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:1.1rem;height:1.1rem}.canvas-stage{background:#0a0e12;border-radius:0;min-height:0;position:relative;overflow:hidden}.editor-canvas{cursor:grab;touch-action:none;width:100%;height:100%;min-height:0;display:block}.editor-canvas:active{cursor:grabbing}.zoom-controls{align-items:center;gap:var(--space-1);display:flex}.zoom-stepper{flex:2 1 0;grid-template-columns:auto minmax(0,1fr) auto;align-items:stretch;min-width:0;display:grid}.wheel-hint{width:2rem;height:2rem;color:var(--color-muted);place-items:center;display:grid}.wheel-hint svg{width:1.55rem;height:1.75rem;overflow:visible}.mouse-body,.mouse-divider{fill:none;stroke:currentColor;stroke-width:1.8px}.mouse-wheel{fill:var(--color-accent);stroke:var(--color-accent-strong);stroke-width:1.2px;filter:drop-shadow(0 0 3px color-mix(in srgb, var(--color-accent) 70%, transparent))}.zoom-field{gap:var(--space-1);padding:var(--space-1) var(--space-2) var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);display:grid}.control-caption{color:var(--color-muted);font-size:.76rem;line-height:1}.zoom-controls button{border:1px solid var(--color-border);width:2rem;min-height:2rem;color:var(--color-text);background:var(--color-surface-muted);cursor:pointer;border-radius:0}.zoom-stepper>button:first-child{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.zoom-stepper>button:last-child{border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-left:-1px}.zoom-controls label{color:var(--color-text);align-items:center;display:flex}.zoom-stepper label{min-width:0;margin-left:-1px}.zoom-stepper .input-with-unit{border-radius:0;width:100%;min-height:2rem}.zoom-controls input{text-align:right;width:4rem}.zoom-value input{width:0;min-width:3.5ch;padding-inline:var(--space-1);appearance:textfield;flex:auto}.zoom-value input::-webkit-inner-spin-button{appearance:none;margin:0}.zoom-value input::-webkit-outer-spin-button{appearance:none;margin:0}.zoom-value>span{padding-right:var(--space-2);flex:none}.zoom-controls select{min-width:6rem;margin-left:var(--space-1);flex:1 1 0}.preview-region-actions{z-index:2;pointer-events:none;justify-content:flex-end;display:flex;position:absolute;transform:translateY(-100%)}.preview-region-buttons{justify-content:flex-end;gap:var(--space-1);pointer-events:none;flex-wrap:wrap;width:100%;display:flex}.preview-region-button{color:#fff;cursor:pointer;pointer-events:auto;background:#08141fc7;border:1px solid #ffffff8c;border-radius:50%;flex:none;place-items:center;width:2.25rem;height:2.25rem;padding:0;font-size:1.15rem;line-height:1;display:grid;box-shadow:0 4px 14px #00000052}.preview-region-button:hover{background:var(--color-accent)}.preview-region-button:disabled{opacity:.55;cursor:wait}.preview-region-button svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:1.25rem;height:1.25rem}.empty-editor{border:1px dashed var(--color-border);width:100%;height:100%;color:var(--color-text);background:var(--color-surface-muted);cursor:pointer}.empty-editor strong{margin-top:var(--space-4);font-size:clamp(1.1rem,2vw,1.5rem)}.empty-editor>span:not(.split-mark),.empty-editor small{margin-top:var(--space-2);color:var(--color-muted)}.export-bar{grid-template-columns:auto auto 1fr auto auto;align-items:center;display:grid}.export-bar>button{min-height:var(--control-height);padding-inline:var(--space-6);background:var(--color-accent);color:#fff;border:0;border-radius:999px}.export-bar>button:disabled{opacity:.55;cursor:not-allowed}.output-summary{min-height:2rem;color:var(--color-text);align-self:end;align-items:center;font-size:.95rem;display:flex}.error-message{color:#e5484d}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (max-width:48rem){.app-shell{width:100%;height:auto;min-height:100dvh;padding:var(--space-3);gap:var(--space-2);grid-template-rows:auto auto auto auto}.app-header{min-height:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-md)}.app-header p{font-size:.82rem}.theme-toggle{width:2.75rem;height:2.75rem}.settings-bar{padding:var(--space-2);align-items:stretch;gap:var(--space-2);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.settings-bar label,.export-bar label{min-width:0;padding:var(--space-1) var(--space-2) var(--space-2)}.settings-bar select,.export-bar select{width:100%}.number-control{align-items:stretch}.number-control .input-with-unit{flex:auto;min-width:0}.number-control button{white-space:nowrap;min-height:2.75rem}.guide-control{justify-content:start;align-self:stretch;min-height:3.75rem}.guide-control input{width:1.25rem;min-height:1.25rem}select,input{min-height:2.75rem}.editor-panel{min-height:24rem;padding:var(--space-2);border-radius:var(--radius-md)}.image-meta{padding:0 0 var(--space-2);gap:var(--space-2);display:grid}.image-details span{overflow-wrap:anywhere}.image-details small{line-height:1.4}.image-actions{justify-content:space-between;align-items:end;min-width:0}.image-actions>button{min-height:2.75rem;padding-inline:var(--space-2);white-space:nowrap}.image-actions>.change-image-button{min-height:2rem}.zoom-field{min-width:0}.wheel-hint{display:none}.zoom-controls{min-width:0}.zoom-controls button{flex:none;width:2.75rem;min-height:2.75rem}.zoom-controls select{min-width:0;margin-left:0}.zoom-controls .input-with-unit{min-height:2.75rem}.editor-panel:has(.canvas-stage){min-height:0}.canvas-stage{width:100%;max-width:100%;height:auto;min-height:12rem;aspect-ratio:var(--preview-aspect-ratio)}.preview-region-button{width:2.75rem;height:2.75rem}.empty-editor{min-height:24rem;padding:var(--space-4)}.split-mark{width:7rem;height:3.5rem}.export-bar{min-height:0;padding:var(--space-2);gap:var(--space-2);grid-template-columns:repeat(2,minmax(0,1fr))}.output-summary,.error-message,.export-bar>button{grid-column:1/-1}.output-summary{justify-content:center;align-self:auto;min-height:0}.export-bar>button{width:100%;min-height:3rem}.save-notice{right:var(--space-3);bottom:var(--space-3);max-width:calc(100vw - 1.5rem)}}@media (max-width:30rem){.app-shell{padding:var(--space-2)}.app-header{gap:var(--space-2)}.app-header p{margin-top:0;font-size:.75rem}.settings-bar>label:first-child,.boundary-control{grid-column:1/-1}.number-control{grid-template-columns:minmax(0,1fr) auto;display:grid}.editor-panel:not(:has(.canvas-stage)){min-height:22rem}.image-actions{justify-content:stretch;display:grid}.zoom-controls{grid-template-columns:minmax(0,2fr) minmax(6rem,1fr);display:grid}.zoom-stepper,.zoom-controls label,.zoom-controls .input-with-unit,.zoom-controls input,.zoom-controls select{width:100%}.image-actions>button{justify-self:end}.empty-editor{min-height:22rem}.empty-editor small{line-height:1.45}.save-notice{right:var(--space-2);bottom:var(--space-2);max-width:calc(100vw - 1rem)}}@media (orientation:portrait) and (max-width:48rem){.app-shell{width:100%;min-width:0;max-width:100%;padding:0}.app-header,.settings-bar,.editor-panel,.export-bar{width:100%;min-width:0;max-width:100%}.app-header>div:first-child,.settings-bar>*,.export-bar>*{min-width:0}.settings-bar>.ratio-control{grid-column:1/-1}.app-header p{overflow-wrap:anywhere}.app-header{border-top-left-radius:0;border-top-right-radius:0}.export-bar{border-bottom-right-radius:0;border-bottom-left-radius:0}.preview-region-button{width:1.375rem;height:1.375rem}.preview-region-button svg{width:.75rem;height:.75rem}}@media (orientation:landscape) and (max-height:32rem) and (min-width:48.01rem){.app-shell{height:100dvh;min-height:0;padding:var(--space-2);gap:var(--space-2);grid-template-rows:auto auto minmax(0,1fr) auto}.app-header{min-height:0;padding:var(--space-2) var(--space-4);border-radius:var(--radius-md)}h1{font-size:1.25rem}.app-header p{margin-top:0;font-size:.75rem}.theme-toggle{width:2.25rem;height:2.25rem}.settings-bar{padding:var(--space-1) var(--space-3);gap:var(--space-3)}.settings-bar label,.export-bar label{padding:2px var(--space-2) var(--space-1);gap:0}.guide-control{min-height:2.75rem;padding-block:var(--space-1)!important}.editor-panel{padding:var(--space-2);border-radius:var(--radius-md)}.image-meta{min-width:0;padding-bottom:var(--space-1);gap:var(--space-3)}.image-details{gap:0;min-width:0}.image-details span,.image-details small{white-space:normal;overflow-wrap:anywhere}.image-actions{gap:var(--space-1)}.zoom-field{padding:2px var(--space-2) var(--space-1);gap:0}.wheel-hint,.zoom-controls button,.zoom-controls select,.zoom-controls .input-with-unit{min-height:2rem}.image-actions>button{min-height:2.25rem;padding-inline:var(--space-2)}.export-bar{min-height:0;padding:var(--space-1) var(--space-3);gap:var(--space-3)}.export-bar>button{min-height:2.25rem;padding-inline:var(--space-4)}}@media (orientation:landscape) and (min-width:48.01rem){.app-shell[data-two-pane=true]{grid-template-columns:minmax(20rem, var(--preview-pane-width)) 28px minmax(10rem, 1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}.app-shell[data-two-pane=true] .control-pane{scrollbar-gutter:stable;scrollbar-color:var(--color-muted) var(--color-surface-muted);scrollbar-width:auto;touch-action:none;overscroll-behavior:contain;grid-area:1/3;min-width:0;min-height:0;padding-right:2px;display:block;overflow:hidden auto;container-type:inline-size}.app-shell[data-two-pane=true] .control-pane-content{align-content:start;gap:var(--space-2);min-width:0;min-height:100%;transform:translateY(var(--control-overscroll,0px));will-change:transform;grid-template-columns:minmax(0,1fr);grid-auto-rows:max-content;display:grid}.app-shell[data-two-pane=true] .control-pane::-webkit-scrollbar{width:14px}.app-shell[data-two-pane=true] .control-pane::-webkit-scrollbar-track{background:var(--color-surface-muted);border-radius:999px}.app-shell[data-two-pane=true] .control-pane::-webkit-scrollbar-thumb{border:3px solid var(--color-surface-muted);background:var(--color-muted);border-radius:999px;min-height:2.5rem}.app-shell[data-two-pane=true] .control-pane::-webkit-scrollbar-thumb:hover{background:var(--color-accent)}.app-shell[data-two-pane=true] .control-pane-content>.app-header,.app-shell[data-two-pane=true] .control-pane-content>.settings-bar,.app-shell[data-two-pane=true] .control-pane-content>.export-bar{grid-area:auto}.app-shell[data-two-pane=true] .settings-bar{align-items:stretch;gap:var(--space-1);padding:var(--space-1);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.app-shell[data-two-pane=true][data-compact-wide-settings=true] .settings-bar{grid-template-columns:minmax(0,1fr)}.app-shell[data-two-pane=true] .settings-bar label{min-width:0;padding-inline:var(--space-1)}.app-shell[data-two-pane=true] .settings-bar select{width:100%}.app-shell[data-two-pane=true] .boundary-control{grid-column:auto}.app-shell[data-two-pane=true] .boundary-control .number-control button{padding-inline:var(--space-1);font-size:.72rem}.app-shell[data-two-pane=true] .boundary-reset-prefix{display:none}.app-shell[data-two-pane=true] .ratio-control:has(.custom-ratio-control){grid-column:1/-1;min-width:0}.app-shell[data-two-pane=true] .custom-ratio-control{min-width:0;max-width:100%}.app-shell[data-two-pane=true] .custom-ratio-control input{max-width:100%;padding-inline:var(--space-1)}.app-shell[data-two-pane=true] .number-control .input-with-unit{flex:auto;min-width:0}.app-shell[data-two-pane=true] .number-control button{white-space:nowrap}.app-shell[data-two-pane=true] .guide-control,.app-shell[data-two-pane=true] .two-pane-control{text-align:left;grid-template-columns:auto auto minmax(0,1fr);grid-auto-flow:row;justify-content:start;align-self:stretch;justify-items:start;min-height:2.5rem}.app-shell[data-two-pane=true] .guide-control input,.app-shell[data-two-pane=true] .page-zoom-control input,.app-shell[data-two-pane=true] .two-pane-control input{width:1.25rem;height:1.25rem;min-height:1.25rem;margin:0}.app-shell[data-two-pane=true] .editor-panel{border-radius:0;grid-area:1/1;grid-template-rows:minmax(0,1fr);min-height:0;padding:0;display:grid}.app-shell[data-two-pane=true] .wide-controls-slot{display:block}.app-shell[data-two-pane=true] .image-meta{min-height:0;padding:var(--space-1);align-content:start;align-items:stretch;gap:var(--space-1);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow);display:grid;overflow:auto}.app-shell[data-two-pane=true] .wide-controls-slot .image-meta{grid-area:auto}.app-shell[data-two-pane=true] .image-details{padding-inline:var(--space-1)}.app-shell[data-two-pane=true] .image-actions{align-items:stretch;gap:var(--space-1);display:grid}.app-shell[data-two-pane=true] .zoom-field{min-width:0}.app-shell[data-two-pane=true] .wheel-hint{display:none}.app-shell[data-two-pane=true] .zoom-controls{grid-template-columns:minmax(0,2fr) minmax(6rem,1fr);display:grid}.app-shell[data-two-pane=true] .zoom-stepper,.app-shell[data-two-pane=true] .zoom-controls label,.app-shell[data-two-pane=true] .zoom-controls .input-with-unit,.app-shell[data-two-pane=true] .zoom-controls input,.app-shell[data-two-pane=true] .zoom-controls select{width:100%}.app-shell[data-two-pane=true] .zoom-controls select{margin-left:0}.app-shell[data-two-pane=true] .image-actions>button{justify-self:end}.app-shell[data-two-pane=true] .canvas-stage,.app-shell[data-two-pane=true] .empty-editor{border:1px solid var(--color-border);border-radius:var(--radius-md);height:100%;min-height:0;box-shadow:var(--shadow);grid-area:auto}.app-shell[data-two-pane=true] .canvas-stage{border-radius:0}.app-shell[data-two-pane=true] .empty-editor{padding:var(--space-4)}.app-shell[data-two-pane=true] .export-bar{gap:var(--space-1);padding:var(--space-1);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.app-shell[data-two-pane=true] .export-bar label{min-width:0}.app-shell[data-two-pane=true] .export-bar select{width:100%}.app-shell[data-two-pane=true] .output-summary,.app-shell[data-two-pane=true] .error-message,.app-shell[data-two-pane=true] .export-bar>button{grid-column:1/-1}.app-shell[data-two-pane=true] .output-summary{justify-content:center;align-self:auto;min-height:1.5rem}.app-shell[data-two-pane=true] .export-bar>button{width:100%;min-height:2.25rem}.app-shell[data-two-pane=true] .pane-divider{z-index:3;cursor:col-resize;touch-action:none;grid-area:1/2;width:28px;min-height:0;display:block;position:relative}.app-shell[data-two-pane=true] .pane-divider:before{content:"";inset-block:var(--space-2);background:var(--color-border);border-radius:999px;width:3px;transition:background-color .15s,width .15s;position:absolute;left:50%;transform:translate(-50%)}.app-shell[data-two-pane=true] .pane-divider:hover:before,.app-shell[data-two-pane=true] .pane-divider:focus-visible:before{background:var(--color-accent);width:5px}}@container (width<=15rem){.app-header{padding-inline:var(--space-2)}.app-header>div:first-child{min-width:0}.app-header h1{overflow-wrap:anywhere}.app-header p{white-space:normal}.settings-bar,.export-bar{grid-template-columns:minmax(0,1fr)}.ratio-control:has(.custom-ratio-control){grid-template-columns:minmax(0,1fr)}.boundary-control,.custom-ratio-control,.output-summary,.error-message,.export-bar>button{grid-column:auto}.number-control{grid-template-columns:minmax(0,1fr);display:grid}.boundary-control .number-control{grid-template-columns:minmax(0,1fr)}.number-control button{white-space:normal;width:100%;min-height:2rem}.settings-bar select,.settings-bar input,.export-bar select{min-width:0}.custom-ratio-control{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);width:100%;display:grid}.custom-ratio-control input{width:100%;min-width:0}.zoom-controls{grid-template-columns:minmax(0,1fr)}.zoom-stepper,.zoom-controls select{grid-column:1/-1;width:100%}.zoom-stepper{grid-template-columns:2.5rem minmax(0,1fr) 2.5rem}.zoom-controls button{width:100%}}