: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;--content-max:90rem;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:min(100%, var(--content-max));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}.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}.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-width:46rem){.settings-bar{overflow-x:auto}}@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}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)}.number-control{align-items:center;gap:var(--space-1);color:var(--color-muted);display:flex}.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);display:flex}.custom-ratio-control input{width:4rem}.guide-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{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}.canvas-stage{border-radius:var(--radius-md);background:#0a0e12;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}.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-radius:var(--radius-sm);width:2rem;min-height:2rem;color:var(--color-text);background:var(--color-surface-muted);cursor:pointer;border:0}.zoom-controls label{color:var(--color-text);align-items:center;display:flex}.zoom-controls input{text-align:right;width:4rem}.zoom-value>span{padding-right:var(--space-2)}.zoom-controls select{margin-left:var(--space-1)}.preview-save-button{z-index:2;color:#fff;cursor:pointer;background:#08141fc7;border:1px solid #ffffff8c;border-radius:50%;width:2.25rem;height:2.25rem;font-size:1.15rem;line-height:1;position:absolute;transform:translate(-100%,-100%);box-shadow:0 4px 14px #00000052}.preview-save-button:hover{background:var(--color-accent)}.preview-save-button:disabled{opacity:.55;cursor:wait}.preview-save-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}