style: UI polish and miscellaneous fixes

Fixes link color from hardcoded white to currentColor for proper theme
support. Adds video and audio modality icons to ModelInfo. Registers
anthropic, nvidia, and xiaomi in the provider icon map. Removes unused
pagination validation from agents and topics endpoints. Adds convenience
start script. Updates AGENTS.md.

app/assets/css/base.css

@@ -186,6 +186,10 @@ body {
     height: 100%;
 }
 
+a {
+    color: currentColor;
+}
+
 button {
     color: inherit;
     display: flex;
@@ -273,15 +277,15 @@ button.accent:hover {
     mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 12a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0m7 0a1 1 0 1 0 2 0a1 1 0 1 0-2 0'/%3E%3C/svg%3E");
 }
 
-.reasoning-contaizner.middle {
+.reasoning-container.middle {
     mask-image: linear-gradient(#000, #000, transparent 0, #000 12%, #000 88%, transparent)
 }
 
-.reasoning-contaizner.top {
+.reasoning-container.top {
     mask-image: linear-gradient(#000, transparent, #000 0, #000 12%, #000 88%, transparent)
 }
 
-.reasoning-contaizner.bottom {
+.reasoning-container.bottom {
     mask-image: linear-gradient(transparent, #000, transparent 0, #000 12%, #000 88%, #000)
 }
 

app/assets/css/reset.css

@@ -67,10 +67,6 @@ h6 {
     text-wrap: balance;
 }
 
-a {
-    color: #fff;
-}
-
 a:hover {
     text-decoration: none;
 }

app/components/ModelInfo.vue

@@ -110,6 +110,14 @@ const handleEdit = () => {
                     class="w-4.5 h-4.5 bg-emerald/10 rounded flex items-center justify-center">
                     <span class="i-mynaui-image text-2.5 text-emerald"></span>
                 </div>
+                <div v-if="model.inputModalities.includes('video')" title="Video Input"
+                    class="w-4.5 h-4.5 bg-pink/10 rounded flex items-center justify-center">
+                    <span class="i-mynaui-video text-2.5 text-pink"></span>
+                </div>
+                <div v-if="model.inputModalities.includes('audio')" title="Audio Input"
+                    class="w-4.5 h-4.5 bg-orange/10 rounded flex items-center justify-center">
+                    <span class="i-mynaui-volume-high text-2.5 text-orange"></span>
+                </div>
                 <div v-if="model.capabilities.includes('reasoning')" title="Reasoning"
                     class="w-4.5 h-4.5 bg-[color-mix(in_srgb,_transparent_90%,_var(--reasoning-accent)_10%)] rounded flex items-center justify-center">
                     <span class="i-mynaui-atom text-2.5 text-[var(--reasoning-accent)]"></span>

app/components/ModelSelector.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { ref, computed, watch, nextTick } from 'vue';
 import { useFloating, offset, flip, shift, autoUpdate, size, hide } from '@floating-ui/vue';
+import type { DialogType } from '~/composables/useDialog';
 import type { Model, ModelWithProvider, Provider, ProviderWithModels } from '~/composables/useModels';
 import { sortByReleaseDate } from '~/utils/sort';
 import RowVirtualizerFixed from './RowVirtualizerFixed.vue';
@@ -211,7 +212,7 @@ onUnmounted(() => {
 
 <template>
     <div role="button" @click="toggleDropdown()" ref="dropdownButton"
-        class="cursor-pointer flex items-center min-w-0 select-none gap-2 px-3 py-1.5 rounded-lg text-sm font-medium transition-colors duration-200"
+        class="cursor-pointer flex items-center w-fit min-w-0 select-none gap-2 px-3 py-1.5 rounded-lg text-sm font-medium transition-colors duration-200"
         :class="[
             isOpen
                 ? 'bg-[var(--color-hover)] text-[var(--text-primary)]'

app/utils/model-mapping.ts

@@ -322,7 +322,7 @@ export const providerIcons: Record<string, any | null> = {
     google: markRaw(LogoGoogle),
     openai: markRaw(LogoOpenAI),
     azure: null,
-    anthropic: null,
+    anthropic: markRaw(LogoAnthropic),
     cohere: markRaw(LogoCohere),
     huggingface: null,
     openrouter: markRaw(LogoOpenrouter),
@@ -332,6 +332,8 @@ export const providerIcons: Record<string, any | null> = {
     mistral: markRaw(LogoMistral),
     vllm: markRaw(LogoVllm),
     closedrouter: markRaw(LogoClosedRouter),
+    nvidia: markRaw(LogoNvidia),
+    xiaomi: markRaw(LogoXiaomiMiMo),
 };
 
 export function getModelConfig(modelId: string) {