/* A small moving mark acknowledges work without inventing task progress. */
.chat-processing:empty{display:none}
.chat-processing{flex:none;min-width:0}
.chat-processing .processing-indicator{display:flex;align-items:center;gap:12px;max-width:none;margin:12px 0 0;padding:13px 0;border-top:1px solid var(--line);color:var(--muted)}
.processing-indicator .thinking-mark{width:38px;height:38px;border-radius:var(--radius-sm,7px);background:var(--accent-soft);color:var(--accent);flex:none}
.processing-indicator .thinking-matrix{grid-template-columns:repeat(4,4px);gap:3px}
.processing-indicator .thinking-cell{display:block;width:4px;height:4px;border-radius:1px;opacity:.25;visibility:visible;animation:none}
.processing-indicator .thinking-cell:nth-child(4n+1){--cell-delay:0ms}
.processing-indicator .thinking-cell:nth-child(4n+2){--cell-delay:160ms}
.processing-indicator .thinking-cell:nth-child(4n+3){--cell-delay:320ms}
.processing-indicator .thinking-cell:nth-child(4n){--cell-delay:480ms}
.processing-indicator .thinking-copy{flex:1;min-width:0}
.processing-indicator .thinking-label{font-size:13px;line-height:1.5;color:var(--ink);margin:0;overflow-wrap:anywhere}
.processing-indicator .thinking-note{font-size:12px;line-height:1.5;margin:3px 0 0;color:var(--muted);overflow-wrap:anywhere}
.processing-indicator .thinking-time{flex:none;align-self:flex-start;padding-top:1px;margin:0;font-size:11px;line-height:1.6;font-variant-numeric:tabular-nums;color:var(--muted)}
.processing-indicator[data-processing="thinking"] .thinking-cell{animation:processing-wave 1800ms ease-in-out var(--cell-delay) infinite}
.processing-indicator[data-processing="focus"] .thinking-cell{animation:processing-focus 2200ms ease-in-out var(--cell-delay) infinite}
.processing-indicator[data-processing="working"] .thinking-cell{animation:processing-travel 1400ms ease-in-out var(--cell-delay) infinite}
.processing-indicator[data-processing="waiting"] .thinking-cell{animation:processing-wave 2800ms ease-in-out var(--cell-delay) infinite}
.processing-indicator[data-processing="finishing"] .thinking-cell{animation:processing-focus 1200ms ease-in-out var(--cell-delay) infinite}
.processing-indicator[data-processing="attention"] .thinking-cell{opacity:.65}
.processing-indicator.thinking-paused .thinking-cell{animation-play-state:paused}
@keyframes processing-wave{0%,100%{opacity:.25}45%{opacity:1}}
@keyframes processing-focus{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}
@keyframes processing-travel{0%,100%{opacity:.25;transform:translateY(1px)}45%{opacity:1;transform:translateY(-1px)}}
@media(max-width:760px){.chat-processing .processing-indicator{gap:10px;margin-top:8px;padding:11px 0}.processing-indicator .thinking-note{font-size:12px}.processing-indicator .thinking-time{font-size:11px}}
@media(prefers-reduced-motion:reduce){.processing-indicator .thinking-cell{animation:none!important;transform:none!important;opacity:.65}.processing-indicator .thinking-cell:nth-child(3n){opacity:1}}
