chore: tailwind v4 migration

src/lib/components/playground/Chat.svelte

@@ -234,7 +234,7 @@
 
 						<div class="w-full">
 							<select
-								class="w-full bg-transparent border border-gray-50 dark:border-gray-850 rounded-lg py-1 px-2 -mx-0.5 text-sm outline-none"
+								class="w-full bg-transparent border border-gray-50 dark:border-gray-850 rounded-lg py-1 px-2 -mx-0.5 text-sm outline-hidden"
 								bind:value={selectedModelId}
 							>
 								{#each $models as model}
@@ -256,7 +256,7 @@
 					grow={true}
 				>
 					<div class="flex gap-2 justify-between items-center">
-						<div class=" flex-shrink-0 font-medium ml-1.5">
+						<div class=" shrink-0 font-medium ml-1.5">
 							{$i18n.t('System Instructions')}
 						</div>
 
@@ -266,7 +266,7 @@
 							</div>
 						{/if}
 
-						<div class="flex-shrink-0">
+						<div class="shrink-0">
 							<button class="p-1.5 bg-transparent hover:bg-white/5 transition rounded-lg">
 								{#if showSystem}
 									<ChevronUp className="size-3.5" />
@@ -281,7 +281,7 @@
 						<div class="pt-1 px-1.5">
 							<textarea
 								bind:this={systemTextareaElement}
-								class="w-full h-full bg-transparent resize-none outline-none text-sm"
+								class="w-full h-full bg-transparent resize-none outline-hidden text-sm"
 								bind:value={system}
 								placeholder={$i18n.t("You're a helpful assistant.")}
 								on:input={() => {
@@ -327,7 +327,7 @@
 						<!-- $i18n.t('an assistant') -->
 						<textarea
 							bind:value={message}
-							class=" w-full h-full bg-transparent resize-none outline-none text-sm"
+							class=" w-full h-full bg-transparent resize-none outline-hidden text-sm"
 							placeholder={$i18n.t(`Enter {{role}} message here`, {
 								role: role === 'user' ? $i18n.t('a user') : $i18n.t('an assistant')
 							})}