fix(ui): render Select arrow independently of icon CSS

packages/ui/components/select.wrn

@@ -57,7 +57,7 @@ size: string = "default"
           {#if !multiple}<option value="" selected="{value === ''}" disabled="{required}">{placeholder}</option>{/if}
           {#each options as option}<option value="{option.value}" selected="{selected(option)}" disabled="{option.disabled}">{option.label}</option>{/each}
         </select>
-        {#if !multiple}<span class="icon-[lucide--chevron-down] wrn-next__select-indicator" aria-hidden="true"></span>{/if}
+        {#if !multiple}<svg class="wrn-next__select-indicator" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="m6 9 6 6 6-6"></path></svg>{/if}
         {#if variant === "floating"}<span class="wrn-next__field-floating-label">{label}</span>{/if}
       </div>
       {#if helperText}<small class="wrn-next__field-help">{helperText}</small>{/if}
@@ -79,7 +79,11 @@ size: string = "default"
 
     .wrn-next__select-indicator {
       position: absolute;
-      right: 0.85rem;
+      inset-inline-end: 0.85rem;
+      top: 50%;
+      transform: translateY(-50%);
+      width: 1rem;
+      height: 1rem;
       color: var(--wrn-color-muted);
       pointer-events: none;
     }