/* SparkDream original CSS motion. An indeterminate visual, never a fake image or progress. */
.generation-working.motion-workspace { display:block; min-height:0; padding:0; background:none; border:0; border-radius:0; }
.generation-pending-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2px; width:calc(100% - 12px); margin:0 6px; max-width:none; align-items:start; }
.generation-pending-frame:only-child { grid-column:span 2; }
.generation-pending-frame { position:relative; aspect-ratio:var(--frame-ratio); overflow:hidden; isolation:isolate; border-radius:12px; border:1px solid #ffffff0d; background:#1c2024; contain:paint; }
.pending-field { position:absolute; inset:-40%; background:radial-gradient(ellipse at 24% 34%,#4d737d70,transparent 46%),radial-gradient(ellipse at 74% 72%,#69608760,transparent 44%),radial-gradient(ellipse at 82% 22%,#68857930,transparent 44%); animation:pending-drift 9s ease-in-out infinite alternate; animation-delay:calc(var(--frame-index) * -1.8s); }
.pending-sweep { position:absolute; inset:-40%; background:linear-gradient(115deg,transparent 30%,#c7e6ee0c 46%,#bcd8ec18 50%,transparent 68%); animation:pending-light 5s ease-in-out infinite; animation-delay:calc(var(--frame-index) * -.9s); }
.pending-grain { position:absolute; inset:0; opacity:.12; background-image:radial-gradient(#c9dae5 0.65px,transparent .9px); background-size:5px 5px; mask-image:linear-gradient(140deg,transparent,#0007,transparent); pointer-events:none; }
.pending-center { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; color:#e2ebf1; }
.pending-symbol { display:block; font-size:30px; font-weight:300; line-height:1; color:#d4e9ef; text-shadow:0 0 30px #c6eaff35; animation:pending-breathe 2.7s ease-in-out infinite; animation-delay:calc(var(--frame-index) * -.4s); }
.pending-label { font-size:11px; letter-spacing:2px; color:#ced9df; }
.pending-dots { display:flex; gap:4px; height:5px; align-items:center; }
.pending-dots i { width:3px; height:3px; border-radius:50%; background:currentColor; animation:pending-dot 1.8s ease-in-out infinite; }
.pending-dots i:nth-child(2) { animation-delay:.2s; }.pending-dots i:nth-child(3) { animation-delay:.4s; }
.pending-number { position:absolute; bottom:13px; left:14px; font-size:9px; letter-spacing:1.5px; color:#9eacb7; font-variant-numeric:tabular-nums; }
.pending-corner { position:absolute; bottom:13px; right:14px; width:12px; height:12px; border-right:1px solid #b4cdd04d; border-bottom:1px solid #b4cdd04d; border-radius:0 0 3px 0; }
.generation-wait-caption { display:flex; align-items:center; gap:8px; margin-top:12px; color:var(--studio-muted); flex-wrap:wrap; line-height:1.6; }
.generation-wait-caption strong { font-size:11px; font-weight:400; color:var(--studio-text); }
.generation-wait-caption>span:last-child { font-size:11px; }
.wait-status-orb { width:5px; height:5px; border-radius:50%; flex:0 0 5px; background:#88cad8; }
.is-queued .pending-field { opacity:.4; animation:none; }.is-queued .pending-sweep { display:none; }.is-queued .pending-symbol { color:#9eacb7; }
.generation-pending-frame:not(.motion-visible) *,body:not(.generation-view) .generation-pending-frame *,html.motion-paused .generation-pending-frame * { animation-play-state:paused; }
.generation-images figure>.generation-image-shell>button { position:relative; }
.generation-images figure>.generation-image-shell>button:not(.result-ready):not(.result-error) { min-height:140px; background:var(--studio-surface); }
.generation-images figure>.generation-image-shell>button img { opacity:0; }
.generation-images figure>.generation-image-shell>button.result-ready img { opacity:1; }
.generation-images figure>.generation-image-shell>button.result-arrival img { animation:result-arrive .65s ease-out both; }
.generation-images figure>.generation-image-shell>button.result-error { min-height:150px; background:var(--studio-surface); }
.generation-images figure>.generation-image-shell>button.result-error img { display:none; }
.result-load-error { display:block; padding:40px 14px; font-size:12px; line-height:1.8; color:var(--studio-muted); text-align:center; }.result-load-error small { font-size:10px; }
@keyframes pending-drift { from { transform:translate(-4%,2%) rotate(-8deg) scale(1); } to { transform:translate(6%,-5%) rotate(12deg) scale(1.12); } }
@keyframes pending-light { 0%,100% { transform:translateX(-35%); opacity:0; } 28%,70% { opacity:1; } 80% { transform:translateX(35%); opacity:0; } }
@keyframes pending-breathe { 0%,100% { opacity:.45; transform:scale(.92); } 50% { opacity:1; transform:scale(1.04); } }
@keyframes pending-dot { 0%,70%,100% { opacity:.25; } 35% { opacity:1; } }
@keyframes result-arrive { from { opacity:0; filter:blur(5px); transform:scale(1.025); } to { opacity:1; filter:blur(0); transform:scale(1); } }
html[data-theme="light"] .generation-pending-frame { background:#e8eef2; border-color:#52687520; }
html[data-theme="light"] .pending-field { opacity:.5; }
html[data-theme="light"] .pending-center,html[data-theme="light"] .pending-symbol,html[data-theme="light"] .pending-label { color:#4e6879; text-shadow:none; }
html[data-theme="light"] .pending-number { color:#667e8d; }
html[data-theme="light"] .pending-corner { border-color:#7691a270; }
html[data-theme="light"] .pending-grain { opacity:.06; }
html[data-density="compact"] .generation-pending-grid { max-width:800px; }
html[data-density="compact"] .generation-pending-grid:has(>.generation-pending-frame:only-child) { width:min(100%,270px); }
@media(max-width:760px) { .generation-pending-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }.pending-symbol { font-size:24px; }.pending-center { gap:8px; }.pending-number { bottom:10px; left:10px; }.generation-wait-caption>span:last-child { flex-basis:100%; padding-left:13px; font-size:10px; } }
@media(prefers-reduced-motion:reduce) { .generation-pending-frame *, .generation-images figure>button.result-arrival img { animation:none!important; }.pending-sweep { display:none; }.pending-symbol { opacity:.8; }.pending-dots i { opacity:.5; } }