.agent-generated-image { position:relative; width:min(100%,440px); margin:0; }
.agent-answer-text + .agent-generated-image { margin-top:14px; }
.agent-image-preview { display:block; width:100%; overflow:hidden; border-radius:14px; background:#f1f1f1; cursor:zoom-in; }
.agent-generated-image .agent-image-preview img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; border-radius:0; opacity:1; transition:opacity 160ms; }
.agent-generated-image.is-loading .agent-image-preview { min-height:220px; background:linear-gradient(110deg,#f4f4f4 25%,#fafafa 45%,#f4f4f4 65%); }
.agent-generated-image.is-loading img { opacity:0; }
.agent-generated-image figcaption { display:flex; align-items:center; justify-content:space-between; margin-top:10px; color:#929292; font-size:12px; line-height:1.6; }
.agent-image-tools { display:flex; gap:6px; position:absolute; top:10px; right:10px; opacity:0; transform:translateY(-3px); transition:opacity 150ms,transform 150ms; }
.agent-generated-image:hover .agent-image-tools,.agent-generated-image:focus-within .agent-image-tools { opacity:1; transform:none; }
.agent-image-tools button,.agent-image-tools a { display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:9px; background:#ffffffed; color:#333; font-size:22px; box-shadow:0 2px 8px #0001; }
.agent-image-error { display:none; padding:35px 16px; color:#888; font-size:13px; background:#f6f6f6; border-radius:12px; }
.agent-image-error button { margin-left:12px; color:var(--red); }
.agent-generated-image.is-error .agent-image-preview,.agent-generated-image.is-error .agent-image-tools { display:none; }
.agent-generated-image.is-error .agent-image-error { display:block; }
.agent-image-viewer { width:min(1100px,94vw); max-height:94dvh; padding:0; border:0; border-radius:16px; background:#171717; color:#fff; overflow:auto; }
.agent-image-viewer::backdrop { background:#000c; backdrop-filter:blur(5px); }
.image-viewer-toolbar { display:flex; align-items:center; gap:20px; padding:14px 20px; font-size:13px; }
.image-viewer-download { margin-left:auto; color:#fff; }
.image-viewer-close { width:30px; height:30px; font-size:26px; border-radius:6px; color:#ddd; }
.agent-image-viewer > img { display:block; width:100%; max-height:calc(94dvh - 60px); object-fit:contain; }
.agent-image-recovery { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:16px; padding:14px; border:1px dashed #ddd; border-radius:10px; color:#888; font-size:13px; }
.agent-image-recovery button { color:var(--red); }
.agent-image-recovery-dialog { width:min(680px,94vw); }
.agent-recovery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:16px; }
.agent-recovery-choice { min-width:0; text-align:left; }
.agent-recovery-choice img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:10px; }
.agent-recovery-choice span { display:block; font-size:11px; line-height:1.6; color:#888; margin-top:6px; }
@media(hover:none) { .agent-image-tools { opacity:1; transform:none; } }
@media(max-width:600px) { .agent-recovery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(prefers-reduced-motion:reduce) { .agent-image-tools,.agent-image-preview img { transition:none; } }