/* Source cards and a moving lens distinguish search from the braided thread
   used while composing. No artificial percentages or elapsed-time promises. */
.synox-app .message.search-presented { flex-wrap: wrap; row-gap: 10px; }
.search-presentation {
    --search-offset: 42px;
    display: flex;
    align-items: center;
    gap: 12px;
    width: calc(100% - var(--search-offset));
    min-width: 0;
    margin-left: var(--search-offset);
    padding: 10px 13px 10px 10px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: var(--surface);
    color: var(--text-muted);
    font-family: var(--font-body, sans-serif);
    text-align: left;
    animation: search-surface-in .36s cubic-bezier(.2,.7,.2,1) both;
}
.search-visual { display: block; width: 40px; height: 40px; flex: 0 0 40px; color: var(--accent); }
.search-visual svg { display: block; width: 100%; height: 100%; overflow: visible; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.search-page-back { stroke: currentColor; opacity: .2; }
.search-page { fill: var(--surface); stroke: currentColor; opacity: .55; }
.search-source-line { stroke: currentColor; opacity: .4; }
.search-lens { stroke: currentColor; stroke-width: 1.6; transform-origin: 28px 27px; }
.search-lens circle { fill: var(--surface); }
.search-check, .search-unavailable { display: none; stroke: currentColor; stroke-width: 1.7; }
.search-copy { min-width: 0; flex: 1; }
.search-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 9px; min-height: 20px; }
.search-status-label { color: var(--text); font-size: 12px; font-weight: 500; line-height: 1.5; }
.search-round { flex: 0 0 auto; color: var(--text-dim); font-size: 10px; font-weight: 500; line-height: 1.5; }
.search-round:not([hidden])::before { content: ''; display: inline-block; width: 3px; height: 3px; margin: 0 8px 2px 0; border-radius: 50%; background: currentColor; opacity: .6; }
.search-query { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; font-size: 11px; line-height: 1.65; color: var(--text-muted); }
.search-query-pending { color: var(--text-dim); }
.search-notice { margin-top: 4px; color: var(--text-muted); font-size: 11px; line-height: 1.6; overflow-wrap: anywhere; }
.search-sources { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; }
.search-source-link { display: inline-block; min-width: 0; max-width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--text-muted); font-size: 10px; line-height: 1.7; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--border-2); }
.search-source-link:hover { color: var(--accent); text-decoration-color: currentColor; }
.search-presentation [hidden] { display: none; }
.search-presentation[data-state="searching"] .search-lens { animation: search-lens-read 3.2s cubic-bezier(.45,0,.25,1) infinite; }
.search-presentation[data-state="searching"] .search-source-line { animation: search-source-read 2.4s ease-in-out infinite; }
.search-presentation[data-state="searching"] .search-source-two { animation-delay: .28s; }
.search-presentation[data-state="searching"] .search-source-three { animation-delay: .56s; }
.search-presentation[data-state="done"] .search-check { display: block; animation: search-check-in .35s ease-out both; }
.search-presentation[data-state="done"] :is(.search-lens,.search-source-line) { display: none; }
.search-presentation:is([data-state="empty"],[data-state="error"],[data-state="cancelled"]) { color: var(--text-dim); }
.search-presentation:is([data-state="empty"],[data-state="error"],[data-state="cancelled"]) :is(.search-lens,.search-source-line) { display: none; }
.search-presentation:is([data-state="empty"],[data-state="error"],[data-state="cancelled"]) .search-unavailable { display: block; }
.search-presentation[data-state="error"] .search-status-label { color: var(--text-muted); }
@keyframes search-surface-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@keyframes search-lens-read { 0%,100% { transform: translate(0,0); } 30% { transform: translate(-4px,-4px); } 65% { transform: translate(-2px,3px); } }
@keyframes search-source-read { 0%,75%,100% { opacity: .3; } 35% { opacity: 1; } }
@keyframes search-check-in { from { opacity: 0; transform: translateY(2px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 600px) {
    .search-presentation { --search-offset: 37px; gap: 8px; padding: 9px 10px 9px 7px; border-radius: 11px; }
    .search-visual { width: 34px; height: 34px; flex-basis: 34px; }
    .search-status-label { font-size: 11px; }
    .search-query { font-size: 10px; }
    .search-round { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
    .search-presentation, .search-presentation * { animation: none !important; transition: none !important; }
}
[data-ui-style="minimal"] .search-presentation, [data-ui-style="minimal"] .search-presentation * { animation: none !important; }