:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f4f1ec;--panel:#fff;--control:#faf8f5;--field:#fff;--text:#1d1b19;--muted:#6c665f;--border:#ddd6cc;--border-hover:var(--muted);--accent:#c2410c;--on-accent:#fff;--focus:#c2410c;--slider:var(--accent);--stage:#ebe6de;--zoom-button:#ffffffeb;color:var(--text);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#1b1916;--panel:#24211d;--control:#2d2925;--field:#1f1c19;--text:#e6e0d6;--muted:#aaa196;--border:#3d3832;--border-hover:#6b635a;--focus:#f08a4b;--slider:#e0702f;--stage:#141210;--zoom-button:#2d2925eb}.collage-svg{--grout:#fff}*{box-sizing:border-box}body{background:var(--bg);margin:0}body.no-scroll{overflow:hidden}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.app{flex-direction:column;min-height:100vh;display:flex}.app-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:16px 24px;display:flex}@media (width<=800px){.app-header{padding:12px 16px}}.app-header h1{margin:0;font-size:20px}.theme-toggle{border:1px solid var(--border);background:var(--control);border-radius:10px;flex-shrink:0;padding:2px;display:inline-flex}.theme-option{min-height:36px;font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:8px;padding:0 12px;font-size:14px}.theme-option:hover{color:var(--text)}.theme-option[aria-pressed=true]{background:var(--panel);color:var(--text);box-shadow:0 0 0 1px var(--border);font-weight:600}.app-main{flex:1;grid-template-columns:300px 1fr;gap:24px;padding:24px;display:grid}@media (width<=800px){.app-main{grid-template-columns:minmax(0,1fr);padding:16px}}.controls{background:var(--panel);border:1px solid var(--border);border-radius:12px;flex-direction:column;align-self:start;gap:20px;padding:20px;display:flex}.field,.uploader{flex-direction:column;gap:8px;display:flex}.field-label{color:var(--muted);font-size:13px;font-weight:600}.field input[type=range]{accent-color:var(--slider)}.text-input{border:1px solid var(--border);background:var(--field);color:var(--text);text-transform:uppercase;border-radius:8px;width:100%;min-width:0;padding:8px 12px;font-size:22px;font-weight:700}.button-row{flex-wrap:wrap;gap:8px;display:flex}.button{font:inherit;border:1px solid var(--border);background:var(--control);color:var(--text);cursor:pointer;border-radius:8px;align-items:center;padding:8px 14px;font-size:14px;display:inline-flex}.button:hover:not(:disabled){border-color:var(--border-hover)}.button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.button:disabled{opacity:.45;cursor:not-allowed}.hint{color:var(--muted);margin:0;font-size:12px}.preview{flex-direction:column;gap:12px;min-width:0;display:flex}.stats{color:var(--muted);flex-wrap:wrap;gap:6px 16px;min-height:18px;font-size:13px;display:flex}.preview-canvas{flex:1;justify-content:center;align-items:flex-start;min-height:260px;display:flex}.preview-canvas>.preview-empty{align-self:center}.collage-frame{flex-direction:column;gap:8px;width:100%;display:flex}.collage-frame.is-fullscreen{z-index:10;background:var(--bg);padding:12px;position:fixed;inset:0}.zoom{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex;position:relative}.zoom-viewport{background:var(--stage);touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:zoom-in;border-radius:12px;height:clamp(260px,55vh,680px);min-height:96px;max-height:min(680px,75svh);position:relative;overflow:hidden}.zoom-viewport.is-zoomed{touch-action:none;cursor:grab}.is-fullscreen .zoom-viewport{flex:1;height:auto;max-height:none}.zoom-content{transform-origin:0 0;width:100%;height:100%;padding:8px}.zoom-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.zoom-controls{gap:6px;display:flex}.zoom-button{min-width:38px;height:38px;font:inherit;border:1px solid var(--border);background:var(--zoom-button);color:var(--text);cursor:pointer;border-radius:8px;font-size:18px;font-weight:600}.zoom-button.zoom-fit{padding:0 10px;font-size:14px}.zoom-button:disabled{opacity:.45;cursor:default}.collage-svg{width:100%;height:100%;display:block}.collage-svg image,.collage-svg .slot-hit{cursor:pointer}.lightbox{z-index:20;background:#000000e0;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:16px;display:flex;position:fixed;inset:0}.lightbox-image{object-fit:contain;border-radius:6px;max-width:100%;max-height:calc(100% - 64px)}.lightbox-bar{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 12px;max-width:100%;display:flex}.lightbox-bar .button{white-space:nowrap;flex-shrink:0}.lightbox-error{color:#ffb4a8;text-align:center;margin:0;font-size:14px}.lightbox-name{text-align:center;color:#fff;text-overflow:ellipsis;white-space:nowrap;flex:100%;min-width:0;font-size:14px;overflow:hidden}.framing-editor{border:1px solid var(--border);background:var(--panel);width:min(720px,100%);height:100%;max-height:760px;color:var(--text);border-radius:12px;flex-direction:column;gap:10px;padding:12px;display:flex}.framing-title{color:var(--muted);text-align:center;margin:0;font-size:14px}.framing-stage{background:var(--stage);touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab;border-radius:8px;flex:1;min-height:0;position:relative;overflow:hidden}.framing-stage:active{cursor:grabbing}.framing-stage img{pointer-events:none;max-width:none;position:absolute}.framing-context{opacity:.35}.framing-window{outline:2px solid #fff;position:absolute;overflow:hidden;box-shadow:0 0 0 1px #00000080}.framing-loading{color:var(--muted);place-items:center;display:grid;position:absolute;inset:0}.framing-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.framing-zoom,.framing-actions{align-items:center;gap:8px;display:flex}.framing-zoom .button{height:38px}.letter-base{fill:var(--grout)}.preview-empty{color:var(--muted)}