.result-preview{position:relative;display:block;width:100%;padding:0;border:0;border-radius:12px;background:var(--surface);color:var(--ink);cursor:zoom-in;overflow:hidden}
.result-preview img{transition:transform .18s cubic-bezier(.23,1,.32,1)}
.result-preview:hover img{transform:scale(1.012)}
.result-preview:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.result-preview-cue{position:absolute;right:12px;bottom:12px;border:1px solid #ffffff40;border-radius:24px;padding:7px 12px;color:white;background:#152018b8;opacity:0;translate:0 3px;font-size:11px;transition:opacity .15s,translate .15s;pointer-events:none}
.result-preview:hover .result-preview-cue,.result-preview:focus-visible .result-preview-cue{opacity:1;translate:0 0}
.live-result figcaption .reuse-prompt-button{display:inline-flex;align-items:center;gap:6px;color:var(--accent);border:1px solid var(--line);padding:4px 9px;border-radius:8px;background:var(--surface);min-height:30px;transition:background-color .15s,scale .12s}
.reuse-prompt-button:hover{background:var(--surface-muted)!important}.reuse-prompt-button:active{scale:.97}
.reuse-prompt-button[aria-busy=true]:before{content:'';width:10px;height:10px;border:1.5px solid currentColor;border-right-color:transparent;border-radius:50%;animation:loading-turn .8s linear infinite}
.reuse-hint{display:flex;align-items:center;gap:12px;margin:4px 0 12px;padding:9px 12px;border-radius:10px;background:var(--surface-muted);color:var(--muted);font-size:11px;line-height:1.6;animation:reuse-hint-in .17s cubic-bezier(.23,1,.32,1)}
.reuse-hint[hidden]{display:none}.reuse-hint>span{flex:1}.reuse-hint button{flex:none;padding:4px 6px;border:0;border-radius:5px;background:transparent;color:var(--accent);font-size:11px}
.composer.is-reused{animation:composer-reused .55s ease-out}
.attachment-preview{width:100%;height:100%;border:0;background:none;padding:0;cursor:zoom-in;border-radius:12px}
.workflow-input{height:auto;margin-bottom:22px}.workflow-input .attachment-preview{position:relative;right:auto;top:auto;display:block;width:100%;height:72px;border:0;border-radius:12px;background:none}.workflow-input small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;max-width:84px;line-height:20px}
#workflowAttachments:has(.workflow-input){display:flex;gap:14px;overflow-x:auto;padding:6px 6px 0}
.toast{pointer-events:auto}.toast .toast-action{color:var(--accent);font-size:12px;white-space:nowrap;padding:5px 8px}
.image-preview{--preview-ink:#f3f6f2;--preview-muted:#bdc5bd;--preview-line:#ffffff24;position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;overflow:hidden;color:var(--preview-ink);background:#111611f7;color-scheme:dark;box-shadow:none}
.image-preview[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto}
.image-preview::backdrop{background:#0b110bea;backdrop-filter:blur(8px)}
.image-preview:fullscreen{height:100%;background:#101410}
.preview-header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px;padding:16px 24px;border-bottom:1px solid var(--preview-line);z-index:3}
.preview-heading{display:grid;gap:5px;min-width:0}.preview-heading strong{font-size:14px;font-weight:550;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(40vw,520px)}
.preview-heading>span{font-size:11px;color:var(--preview-muted);min-height:14px}
.preview-tools{display:flex;align-items:center;gap:4px;flex-shrink:0}
.image-preview button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:38px;min-height:38px;padding:8px;color:inherit;background:transparent;border:1px solid transparent;border-radius:9px;font:inherit;font-size:12px;cursor:pointer;transition:background-color .13s,scale .12s}
.image-preview button:hover{background:#ffffff15}.image-preview button:active{scale:.96}.image-preview button:disabled{opacity:.27;cursor:default;scale:1;background:transparent}
.image-preview button:focus-visible{outline:2px solid #c8dec0;outline-offset:2px}
.image-preview button svg{width:19px;height:19px;flex:none}
.preview-tools [data-preview-action=actual]{font-variant-numeric:tabular-nums;min-width:58px}
.preview-tools [data-preview-action=close]{margin-left:10px;background:#ffffff14}
.preview-stage{position:relative;min-height:0;overflow:hidden;touch-action:none;user-select:none}
.preview-image{position:absolute;top:50%;left:50%;max-width:none!important;max-height:none!important;transform:translate(-50%,-50%);transform-origin:center;object-fit:contain;transition:transform .18s cubic-bezier(.23,1,.32,1);user-select:none;-webkit-user-drag:none;box-shadow:0 12px 56px #0003}
.image-preview[data-direct=true] .preview-image,.image-preview[data-keyboard=true] .preview-image{transition:none}
.image-preview[data-loading=true] .preview-image,.image-preview[data-error=true] .preview-image{visibility:hidden}
.image-preview[data-zoomed=true] .preview-image{cursor:grab}.image-preview[data-panning=true] .preview-image{cursor:grabbing}
.preview-stage>[data-preview-action=previous],.preview-stage>[data-preview-action=next]{position:absolute;z-index:4;top:calc(50% - 24px);min-width:46px;min-height:48px;border-color:#ffffff22;border-radius:14px;background:#172018c9;backdrop-filter:blur(12px)}
.preview-stage>[data-preview-action=previous]{left:20px}.preview-stage>[data-preview-action=next]{right:20px}
.preview-loading,.preview-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;font-size:12px;color:var(--preview-muted);pointer-events:none}
.preview-loading[hidden],.preview-error[hidden]{display:none}.preview-error strong{color:var(--preview-ink);font-size:15px;font-weight:550}.preview-error button{pointer-events:auto;border-color:var(--preview-line);padding-inline:16px}.preview-loading .loading-spinner{width:24px;height:24px}
.preview-thumbnails{display:flex;justify-content:flex-start;align-items:center;gap:8px;overflow-x:auto;padding:12px max(20px,calc((100vw - 900px)/2));border-top:1px solid var(--preview-line);scrollbar-width:thin;scrollbar-color:#ffffff45 transparent}
.preview-thumbnails:empty{display:none}.preview-thumbnails button{padding:3px;flex:none;width:58px;height:58px;border:1px solid #ffffff20;border-radius:10px;background:#ffffff06;overflow:hidden}
.preview-thumbnails button img{display:block;width:100%;height:100%;object-fit:contain;border-radius:5px;pointer-events:none}.preview-thumbnails button[aria-current=true]{border-color:#c9e2bc;background:#ffffff18;box-shadow:0 0 0 1px #c9e2bc}
.preview-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:62px;padding:10px 24px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--preview-line)}
.preview-help{font-size:11px;color:var(--preview-muted);white-space:nowrap}.preview-position{font-variant-numeric:tabular-nums;font-size:12px;white-space:nowrap;color:var(--preview-muted)}
.preview-result-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.preview-result-actions button{padding:8px 12px;min-height:36px;border-color:var(--preview-line);font-size:12px}.preview-result-actions [data-reuse-task]{background:#d7e6cd;color:#233720;border-color:#d7e6cd}.preview-result-actions [data-reuse-task]:hover{background:#e2efda}
.preview-notice{position:absolute;z-index:8;bottom:16px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:12px;max-width:calc(100% - 48px);padding:11px 16px;border-radius:12px;background:#334031f5;box-shadow:0 5px 25px #0005;font-size:12px;line-height:1.6;animation:reuse-hint-in .15s ease-out}
.preview-notice[hidden]{display:none}.preview-notice>button{min-height:28px;min-width:0;padding:3px 6px;font-size:11px;white-space:nowrap}
@keyframes reuse-hint-in{from{opacity:.5;translate:0 3px}to{opacity:1;translate:0 0}}
@keyframes composer-reused{0%,20%{box-shadow:0 0 0 3px #78976c4d}100%{box-shadow:0 0 0 0 #78976c00}}
@media(max-width:1050px){.preview-help{display:none}.preview-header{gap:12px}.preview-heading strong{max-width:28vw}.preview-tools{gap:0}}
@media(max-width:760px){.preview-header{display:grid;grid-template-columns:minmax(0,1fr);padding:12px 12px 6px;gap:9px;min-height:0}.preview-heading{padding:0 48px 0 4px}.preview-heading strong{max-width:100%;font-size:12px}.preview-tools{overflow-x:auto;scrollbar-width:none;padding:2px 0 4px}.preview-tools [data-preview-action=close]{position:absolute;right:12px;top:12px;margin:0;min-width:34px;min-height:34px;background:#ffffff13}.preview-tools button{min-width:36px;min-height:34px;padding:7px}.preview-tools button svg{width:18px;height:18px}.preview-tools [data-preview-action=actual]{min-width:54px}.preview-stage>[data-preview-action=previous],.preview-stage>[data-preview-action=next]{min-width:34px;min-height:42px;padding:7px;border-radius:11px}.preview-stage>[data-preview-action=previous]{left:8px}.preview-stage>[data-preview-action=next]{right:8px}.preview-thumbnails{gap:7px;padding:10px 12px}.preview-thumbnails button{width:49px;height:49px}.preview-footer{padding:8px 12px calc(8px + env(safe-area-inset-bottom));gap:8px;min-height:54px}.preview-result-actions{gap:5px}.preview-result-actions button{font-size:11px;min-height:34px;padding:7px 9px}.preview-notice{max-width:calc(100% - 24px);font-size:11px;white-space:normal;width:max-content}.live-result figcaption{gap:10px}.reuse-hint{font-size:10px;gap:8px;padding:8px}.reuse-hint button{font-size:10px}}
html[data-input=keyboard] .composer.is-reused,html[data-input=keyboard] .reuse-hint,html[data-input=keyboard] .result-preview img{animation:none;transition:none}
@media(prefers-reduced-motion:reduce){.image-preview *,.image-preview *::before,.result-preview *,.reuse-hint,.composer.is-reused,.reuse-prompt-button,.reuse-prompt-button::before{animation:none!important;transition:none!important;scroll-behavior:auto!important}}