.ai-search { position: relative; display: flex; align-items: center; min-width: 0; }
.ai-search input { flex: 1; min-width: 0; width: 100%; padding-right: 52px !important; }
.ai-mic { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 999px; border: 0; background: transparent; color: var(--brand, #b30000); display: grid; place-items: center; cursor: pointer; }
.ai-mic[hidden] { display: none !important; }
.ai-search:has(.ai-mic[hidden]) input { padding-right: 12px !important; }
.ai-mic.listening { background: var(--brand, #b30000); color: #fff; animation: aiPulse 1.2s ease-in-out infinite; }
@keyframes aiPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(179,0,0,.45); } 50% { box-shadow: 0 0 0 8px rgba(179,0,0,0); } }
.ai-listening { margin: -4px 0 0; font-size: 13px; font-weight: 650; color: var(--brand, #b30000); display: flex; align-items: center; gap: 8px; }
.ai-listening[hidden] { display: none; }
.ai-dot { width: 9px; height: 9px; border-radius: 50%; background: currentColor; animation: aiBlink 1s infinite; }
@keyframes aiBlink { 50% { opacity: .25; } }
.ai-chips { display: flex; flex-wrap: wrap; gap: 6px; max-width: 100%; }
.ai-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; min-height: 32px; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--brand, #b30000); background: rgba(179,0,0,.08); color: var(--ink, #111); font: inherit; font-size: 13px; font-weight: 650; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-chip span { font-size: 16px; line-height: 1; opacity: .7; }
body[data-mode="night"] .ai-chip { background: rgba(255,80,80,.14); border-color: rgba(255,110,110,.6); color: #f3f3f3; }
body[data-mode="night"] .ai-mic { color: #ff8a8a; }
body[data-mode="night"] .ai-mic.listening { background: #b30000; color: #fff; }
body[data-mode="night"] .ai-listening { color: #ff8a8a; }
@media (prefers-reduced-motion: reduce) { .ai-mic.listening, .ai-dot { animation: none; } }

/* Phones: no install banner on the search screen or while typing a search (beats regfix.css specificity) */
@media (max-width: 768px) {
  html body.on-search[data-mode]:not(#_r):not(#_s):not(#_t):not(#_u) #installBanner.install-banner,
  html body.search-focus[data-mode]:not(#_r):not(#_s):not(#_t):not(#_u) #installBanner.install-banner,
  html body.on-search:not(#_r):not(#_s):not(#_t):not(#_u) #installBanner.install-banner,
  html body.search-focus:not(#_r):not(#_s):not(#_t):not(#_u) #installBanner.install-banner { display: none !important; }
}