diff --git a/apps/web/docs/AUDIT_UI_SPOTIFY_DISCORD_20260210.md b/apps/web/docs/AUDIT_UI_SPOTIFY_DISCORD_20260210.md
index a6b0b379d..34bebe47e 100644
--- a/apps/web/docs/AUDIT_UI_SPOTIFY_DISCORD_20260210.md
+++ b/apps/web/docs/AUDIT_UI_SPOTIFY_DISCORD_20260210.md
@@ -102,7 +102,28 @@ Audit complet du frontend pour la phase d'amélioration UI autonome. Basé sur l
 
 ---
 
-## 6. Commandes de vérification
+## 6. Progrès réalisés (10 feb 2026)
+
+### Phase 1 — Commits effectués
+- **Commit 1** : Tokens layout chat/stream/modal + ChatPage, LiveStreamDetailView, Modal, ChatRoom, ChatInput
+- **Commit 2** : ImageCropper (h-layout-modal-sm), PlaybackSummary (min-h-50)
+
+### Phase 3 — Commit 3 (suite)
+- **rounded-[var(--radius-xl/md/lg/sm)]** → rounded-xl, rounded-md, rounded-lg, rounded-sm (composants + skeletons + stories)
+- **min-w/min-h** : Timeline (min-w-50), AddEquipmentView (min-h-25), MetadataForm (min-h-25)
+- **NavigationProgress** : shadow-[...] → shadow-button-primary-glow
+- **Stories** : ActivityGraph, StatCard, NotificationBell, LoadingState, ScrollArea, Skeleton, FileUploadZone → min-h-layout-page-sm, w-80, w-96, min-h-50, max-w-xl
+
+### Arbitraires restants (priorité basse, exceptions documentées)
+- AstralBackground : w-[60%] h-[60%] (décoratif)
+- ChatInput : h-[450px] (emoji picker tiers)
+- ChatMessage : max-w-[80%], max-w-[150px], h-[400px] (bulles chat)
+- GlobalPlayer : max-w-[45%] (responsive)
+- ChatMessage.stories : min-h-[200px]
+
+---
+
+## 7. Commandes de vérification
 
 ```bash
 # Rapport arbitraire
diff --git a/apps/web/src/components/dashboard/ActivityGraph.stories.tsx b/apps/web/src/components/dashboard/ActivityGraph.stories.tsx
index fa5e41947..380f50a0a 100644
--- a/apps/web/src/components/dashboard/ActivityGraph.stories.tsx
+++ b/apps/web/src/components/dashboard/ActivityGraph.stories.tsx
@@ -7,7 +7,7 @@ const meta = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="w-full max-w-3xl h-[400px] p-4 bg-background">
+            <div className="w-full max-w-3xl min-h-layout-page-sm p-4 bg-background">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/components/dashboard/StatCard.stories.tsx b/apps/web/src/components/dashboard/StatCard.stories.tsx
index 01e80a0e1..fea4e2a80 100644
--- a/apps/web/src/components/dashboard/StatCard.stories.tsx
+++ b/apps/web/src/components/dashboard/StatCard.stories.tsx
@@ -8,7 +8,7 @@ const meta = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="w-[300px] h-[200px] p-4 bg-background">
+            <div className="w-80 min-h-50 p-4 bg-background">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/components/data/Timeline.tsx b/apps/web/src/components/data/Timeline.tsx
index 1bfbe10cc..e1adaec3c 100644
--- a/apps/web/src/components/data/Timeline.tsx
+++ b/apps/web/src/components/data/Timeline.tsx
@@ -44,7 +44,7 @@ export function Timeline({
           {items.map((item, index) => (
             <div
               key={item.id}
-              className="relative flex min-w-[200px] flex-shrink-0 flex-col items-center"
+              className="relative flex min-w-50 flex-shrink-0 flex-col items-center"
             >
               {/* Ligne horizontale */}
               {index < items.length - 1 && (
diff --git a/apps/web/src/components/inventory/AddEquipmentView.tsx b/apps/web/src/components/inventory/AddEquipmentView.tsx
index 33f7c623d..6df97324d 100644
--- a/apps/web/src/components/inventory/AddEquipmentView.tsx
+++ b/apps/web/src/components/inventory/AddEquipmentView.tsx
@@ -175,7 +175,7 @@ export const AddEquipmentView: React.FC = () => {
               Notes
             </h3>
             <textarea
-              className="w-full bg-kodo-graphite border border-border rounded-lg p-4 text-white focus:border-border outline-none min-h-[100px]"
+              className="w-full bg-kodo-graphite border border-border rounded-lg p-4 text-white focus:border-border outline-none min-h-25"
               placeholder="Condition notes, modifications, etc..."
               value={formData.notes}
               onChange={(e) => handleChange('notes', e.target.value)}
diff --git a/apps/web/src/components/notifications/NotificationBell.stories.tsx b/apps/web/src/components/notifications/NotificationBell.stories.tsx
index 70387ffc2..fbb3a04fd 100644
--- a/apps/web/src/components/notifications/NotificationBell.stories.tsx
+++ b/apps/web/src/components/notifications/NotificationBell.stories.tsx
@@ -31,7 +31,7 @@ const meta = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="flex justify-end p-4 bg-card min-h-[400px]">
+            <div className="flex justify-end p-4 bg-card min-h-layout-page-sm">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/components/ui/LoadingState.stories.tsx b/apps/web/src/components/ui/LoadingState.stories.tsx
index 7b9030350..e8cfdf027 100644
--- a/apps/web/src/components/ui/LoadingState.stories.tsx
+++ b/apps/web/src/components/ui/LoadingState.stories.tsx
@@ -46,7 +46,7 @@ export const Skeleton: Story = {
 
 export const WrapperExample: Story = {
     render: (args) => (
-        <Card className="p-6 w-[300px]">
+        <Card className="p-6 w-80">
             <LoadingStateWrapper {...args} isLoading={true}>
                 <div>
                     <h3>Content Loaded</h3>
diff --git a/apps/web/src/components/ui/NavigationProgress.tsx b/apps/web/src/components/ui/NavigationProgress.tsx
index c09c8d7bf..44eaa507a 100644
--- a/apps/web/src/components/ui/NavigationProgress.tsx
+++ b/apps/web/src/components/ui/NavigationProgress.tsx
@@ -39,7 +39,7 @@ export function NavigationProgress() {
           transition={{ duration: 0.15 }}
         >
           <motion.div
-            className="h-full bg-primary shadow-[0_0_10px_var(--primary)]"
+            className="h-full bg-primary shadow-button-primary-glow"
             initial={{ width: '0%' }}
             animate={{ width: `${progress}%` }}
             transition={{ duration: 0.3, ease: 'easeOut' }}
diff --git a/apps/web/src/components/ui/ScrollArea.stories.tsx b/apps/web/src/components/ui/ScrollArea.stories.tsx
index da2b31129..dc3235121 100644
--- a/apps/web/src/components/ui/ScrollArea.stories.tsx
+++ b/apps/web/src/components/ui/ScrollArea.stories.tsx
@@ -6,7 +6,7 @@ const meta = {
     component: ScrollArea,
     tags: ['autodocs'],
     args: {
-        className: 'h-[200px] w-[350px] rounded-md border p-4',
+        className: 'min-h-50 w-96 rounded-md border p-4',
     }
 } satisfies Meta<typeof ScrollArea>;
 
diff --git a/apps/web/src/components/ui/Skeleton.stories.tsx b/apps/web/src/components/ui/Skeleton.stories.tsx
index 048106811..5f39d9042 100644
--- a/apps/web/src/components/ui/Skeleton.stories.tsx
+++ b/apps/web/src/components/ui/Skeleton.stories.tsx
@@ -27,11 +27,11 @@ export const Default: Story = {
 
 export const CardLoading: Story = {
     render: () => (
-        <div className="flex flex-col space-y-3 w-[300px]">
-            <Skeleton className="h-[125px] w-full rounded-xl" />
+        <div className="flex flex-col space-y-3 w-80">
+            <Skeleton className="h-32 w-full rounded-xl" />
             <div className="space-y-2">
-                <Skeleton className="h-4 w-[250px]" />
-                <Skeleton className="h-4 w-[200px]" />
+                <Skeleton className="h-4 w-60" />
+                <Skeleton className="h-4 w-50" />
             </div>
         </div>
     ),
@@ -42,8 +42,8 @@ export const AvatarLoading: Story = {
         <div className="flex items-center space-x-4">
             <Skeleton className="h-12 w-12 rounded-full" />
             <div className="space-y-2">
-                <Skeleton className="h-4 w-[250px]" />
-                <Skeleton className="h-4 w-[200px]" />
+                <Skeleton className="h-4 w-60" />
+                <Skeleton className="h-4 w-50" />
             </div>
         </div>
     ),
diff --git a/apps/web/src/components/ui/card.tsx b/apps/web/src/components/ui/card.tsx
index 4b148cf4e..d42dd8e46 100644
--- a/apps/web/src/components/ui/card.tsx
+++ b/apps/web/src/components/ui/card.tsx
@@ -4,7 +4,7 @@ import { cva, type VariantProps } from 'class-variance-authority'
 import { cn } from '@/lib/utils'
 
 const cardVariants = cva(
-  'flex flex-col rounded-[var(--radius-xl)] text-card-foreground transition-[box-shadow,background-color,border-color,transform] duration-[var(--duration-normal)] ease-out relative overflow-hidden',
+  'flex flex-col rounded-xl text-card-foreground transition-[box-shadow,background-color,border-color,transform] duration-[var(--duration-normal)] ease-out relative overflow-hidden',
   {
     variants: {
       variant: {
diff --git a/apps/web/src/components/ui/dropdown.tsx b/apps/web/src/components/ui/dropdown.tsx
index 8d773f4c7..6f300e575 100644
--- a/apps/web/src/components/ui/dropdown.tsx
+++ b/apps/web/src/components/ui/dropdown.tsx
@@ -176,7 +176,7 @@ export function Dropdown({
             handleOpenChange(true);
           }
         }}
-        className="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background rounded-[var(--radius)]"
+        className="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background rounded-lg"
         style={{ display: 'inline-block' }}
       >
         {trigger}
diff --git a/apps/web/src/components/upload/FileUploadZone.stories.tsx b/apps/web/src/components/upload/FileUploadZone.stories.tsx
index fd91d99aa..5f3b1e16f 100644
--- a/apps/web/src/components/upload/FileUploadZone.stories.tsx
+++ b/apps/web/src/components/upload/FileUploadZone.stories.tsx
@@ -8,7 +8,7 @@ const meta: Meta<typeof FileUploadZone> = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="bg-background p-8 w-[500px]">
+            <div className="bg-background p-8 max-w-xl">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/components/upload/metadata/MetadataForm.tsx b/apps/web/src/components/upload/metadata/MetadataForm.tsx
index 84a08066f..d06af0b26 100644
--- a/apps/web/src/components/upload/metadata/MetadataForm.tsx
+++ b/apps/web/src/components/upload/metadata/MetadataForm.tsx
@@ -237,7 +237,7 @@ export const MetadataForm: React.FC<MetadataFormProps> = ({
               Description
             </label>
             <textarea
-              className="w-full bg-muted border border-border rounded-lg p-4 text-white focus:border-border outline-none min-h-[100px] text-sm"
+              className="w-full bg-muted border border-border rounded-lg p-4 text-white focus:border-border outline-none min-h-25 text-sm"
               placeholder="Tell the story behind this track..."
               value={data.description || ''}
               onChange={(e) => updateField('description', e.target.value)}
diff --git a/apps/web/src/components/views/admin-view/AdminViewSkeleton.tsx b/apps/web/src/components/views/admin-view/AdminViewSkeleton.tsx
index 4b3ef26fa..b89dd2981 100644
--- a/apps/web/src/components/views/admin-view/AdminViewSkeleton.tsx
+++ b/apps/web/src/components/views/admin-view/AdminViewSkeleton.tsx
@@ -5,7 +5,7 @@ export function AdminViewSkeleton() {
   return (
     <div className="flex flex-col lg:flex-row gap-8 animate-fadeIn min-h-layout-main">
       <div className="w-full lg:w-64 flex-shrink-0">
-        <Skeleton className="h-20 w-full rounded-[var(--radius-xl)] mb-6" />
+        <Skeleton className="h-20 w-full rounded-xl mb-6" />
         <div className="space-y-1 p-2">
           {[1, 2, 3, 4, 5].map((i) => (
             <Skeleton key={i} className="h-12 w-full rounded-lg" />
@@ -14,8 +14,8 @@ export function AdminViewSkeleton() {
       </div>
       <div className="flex-1 space-y-4">
         <Skeleton className="h-10 w-48" />
-        <Skeleton className="h-40 w-full rounded-[var(--radius-xl)]" />
-        <Skeleton className="h-40 w-full rounded-[var(--radius-xl)]" />
+        <Skeleton className="h-40 w-full rounded-xl" />
+        <Skeleton className="h-40 w-full rounded-xl" />
       </div>
     </div>
   );
diff --git a/apps/web/src/components/views/analytics-view/AnalyticsViewSkeleton.tsx b/apps/web/src/components/views/analytics-view/AnalyticsViewSkeleton.tsx
index c1c379089..18dafc585 100644
--- a/apps/web/src/components/views/analytics-view/AnalyticsViewSkeleton.tsx
+++ b/apps/web/src/components/views/analytics-view/AnalyticsViewSkeleton.tsx
@@ -10,7 +10,7 @@ export function AnalyticsViewSkeleton() {
           <Skeleton className="h-4 w-80" />
         </div>
         <div className="flex flex-wrap items-center gap-3">
-          <Skeleton className="h-10 w-48 rounded-[var(--radius-xl)]" />
+          <Skeleton className="h-10 w-48 rounded-xl" />
           <div className="flex gap-2">
             <Skeleton className="h-9 w-20" />
             <Skeleton className="h-9 w-20" />
@@ -20,19 +20,19 @@ export function AnalyticsViewSkeleton() {
 
       <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
         {[1, 2, 3, 4].map((i) => (
-          <Skeleton key={i} className="h-28 w-full rounded-[var(--radius-xl)]" />
+          <Skeleton key={i} className="h-28 w-full rounded-xl" />
         ))}
       </div>
 
       <div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
-        <Skeleton className="lg:col-span-2 h-80 rounded-[var(--radius-xl)]" />
+        <Skeleton className="lg:col-span-2 h-80 rounded-xl" />
         <div className="space-y-6">
-          <Skeleton className="h-56 rounded-[var(--radius-xl)]" />
-          <Skeleton className="h-44 rounded-[var(--radius-xl)]" />
+          <Skeleton className="h-56 rounded-xl" />
+          <Skeleton className="h-44 rounded-xl" />
         </div>
       </div>
 
-      <Skeleton className="h-96 w-full rounded-[var(--radius-xl)]" />
+      <Skeleton className="h-96 w-full rounded-xl" />
     </div>
   );
 }
diff --git a/apps/web/src/components/views/checkout-view/CheckoutViewOrderSummary.tsx b/apps/web/src/components/views/checkout-view/CheckoutViewOrderSummary.tsx
index b25be35d9..0a67b9c60 100644
--- a/apps/web/src/components/views/checkout-view/CheckoutViewOrderSummary.tsx
+++ b/apps/web/src/components/views/checkout-view/CheckoutViewOrderSummary.tsx
@@ -20,7 +20,7 @@ export function CheckoutViewOrderSummary({
   onPurchase,
 }: CheckoutViewOrderSummaryProps) {
   return (
-    <Card variant="glass" className="rounded-[var(--radius-xl)] p-8 sticky top-24 border-white/5 bg-black/20 backdrop-blur-xl hover-glow-cyan transition-shadow duration-[var(--duration-normal)]">
+    <Card variant="glass" className="rounded-xl p-8 sticky top-24 border-white/5 bg-black/20 backdrop-blur-xl hover-glow-cyan transition-shadow duration-[var(--duration-normal)]">
       <h3 className="font-bold text-foreground mb-4 uppercase tracking-wider text-sm tracking-tight">
         Order Summary
       </h3>
diff --git a/apps/web/src/components/views/marketplace-view/MarketplaceViewSkeleton.tsx b/apps/web/src/components/views/marketplace-view/MarketplaceViewSkeleton.tsx
index 131623163..349b95325 100644
--- a/apps/web/src/components/views/marketplace-view/MarketplaceViewSkeleton.tsx
+++ b/apps/web/src/components/views/marketplace-view/MarketplaceViewSkeleton.tsx
@@ -12,7 +12,7 @@ export function MarketplaceViewSkeleton() {
         <Skeleton className="h-10 w-full md:w-64" />
       </div>
 
-      <div className="flex flex-col md:flex-row justify-between items-center gap-4 mb-8 bg-card/50 p-2 rounded-[var(--radius-xl)] border border-border">
+      <div className="flex flex-col md:flex-row justify-between items-center gap-4 mb-8 bg-card/50 p-2 rounded-xl border border-border">
         <div className="flex items-center gap-2 w-full">
           <Skeleton className="h-9 w-24" />
           <Skeleton className="h-9 w-16" />
@@ -26,7 +26,7 @@ export function MarketplaceViewSkeleton() {
         <div className="flex-1">
           <div className="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 gap-8">
             {[1, 2, 3, 4, 5, 6].map((i) => (
-              <Skeleton key={i} className="aspect-square rounded-[var(--radius-xl)]" />
+              <Skeleton key={i} className="aspect-square rounded-xl" />
             ))}
           </div>
         </div>
diff --git a/apps/web/src/components/views/settings-view/SettingsViewSkeleton.tsx b/apps/web/src/components/views/settings-view/SettingsViewSkeleton.tsx
index 13e3c292e..ea6fbd19c 100644
--- a/apps/web/src/components/views/settings-view/SettingsViewSkeleton.tsx
+++ b/apps/web/src/components/views/settings-view/SettingsViewSkeleton.tsx
@@ -18,7 +18,7 @@ export function SettingsViewSkeleton() {
       </div>
 
       <div className="min-h-layout-page">
-        <Skeleton className="h-96 w-full rounded-[var(--radius-xl)]" />
+        <Skeleton className="h-96 w-full rounded-xl" />
       </div>
     </div>
   );
diff --git a/apps/web/src/components/views/social-view/SocialViewSkeleton.tsx b/apps/web/src/components/views/social-view/SocialViewSkeleton.tsx
index 442a7752c..82181fd43 100644
--- a/apps/web/src/components/views/social-view/SocialViewSkeleton.tsx
+++ b/apps/web/src/components/views/social-view/SocialViewSkeleton.tsx
@@ -5,8 +5,8 @@ export function SocialViewSkeleton() {
   return (
     <div className="grid grid-cols-1 lg:grid-cols-12 gap-8 animate-fadeIn pb-20 min-h-layout-page">
       <div className="hidden lg:block lg:col-span-3 space-y-8">
-        <Skeleton className="h-48 rounded-[var(--radius-xl)]" />
-        <Skeleton className="h-32 rounded-[var(--radius-xl)]" />
+        <Skeleton className="h-48 rounded-xl" />
+        <Skeleton className="h-32 rounded-xl" />
       </div>
 
       <div className="col-span-1 lg:col-span-6 space-y-8">
@@ -15,12 +15,12 @@ export function SocialViewSkeleton() {
           <Skeleton className="h-4 w-64" />
         </div>
         {[1, 2, 3].map((i) => (
-          <Skeleton key={i} className="h-44 rounded-[var(--radius-xl)]" />
+          <Skeleton key={i} className="h-44 rounded-xl" />
         ))}
       </div>
 
       <div className="hidden lg:block lg:col-span-3">
-        <Skeleton className="h-40 rounded-[var(--radius-xl)]" />
+        <Skeleton className="h-40 rounded-xl" />
       </div>
     </div>
   );
diff --git a/apps/web/src/features/library/pages/library-page/LibraryPageSkeleton.tsx b/apps/web/src/features/library/pages/library-page/LibraryPageSkeleton.tsx
index ab5053c8e..9787bcd36 100644
--- a/apps/web/src/features/library/pages/library-page/LibraryPageSkeleton.tsx
+++ b/apps/web/src/features/library/pages/library-page/LibraryPageSkeleton.tsx
@@ -16,7 +16,7 @@ export function LibraryPageSkeleton() {
       </div>
       <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 gap-6">
         {Array.from({ length: 10 }, (_, i) => (
-          <Skeleton key={i} className="aspect-[4/5] rounded-[var(--radius-xl)]" />
+          <Skeleton key={i} className="aspect-[4/5] rounded-xl" />
         ))}
       </div>
     </div>
diff --git a/apps/web/src/features/playlists/components/PlaylistCard.tsx b/apps/web/src/features/playlists/components/PlaylistCard.tsx
index bce574e80..f72f67673 100644
--- a/apps/web/src/features/playlists/components/PlaylistCard.tsx
+++ b/apps/web/src/features/playlists/components/PlaylistCard.tsx
@@ -180,7 +180,7 @@ function PlaylistCardComponent({
         role="button"
         tabIndex={0}
         aria-label={`${selected ? 'Désélectionner' : 'Sélectionner'} la playlist ${playlist.title}`}
-        className="touch-manipulation rounded-[var(--radius-xl)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background"
+        className="touch-manipulation rounded-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background"
       >
         {cardContent}
       </div>
@@ -193,7 +193,7 @@ function PlaylistCardComponent({
       onClick={handleClick}
       onKeyDown={handleKeyDown}
       aria-label={`Voir la playlist ${playlist.title}`}
-      className="touch-manipulation rounded-[var(--radius-xl)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background"
+      className="touch-manipulation rounded-xl focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background"
     >
       {cardContent}
     </Link>
diff --git a/apps/web/src/features/tracks/components/CommentThread.stories.tsx b/apps/web/src/features/tracks/components/CommentThread.stories.tsx
index 9ddc48ceb..aeecafaaf 100644
--- a/apps/web/src/features/tracks/components/CommentThread.stories.tsx
+++ b/apps/web/src/features/tracks/components/CommentThread.stories.tsx
@@ -70,7 +70,7 @@ const meta: Meta<typeof CommentThread> = {
     },
     decorators: [
         (Story) => (
-            <div className="max-w-2xl w-full p-4 border border-border rounded-[var(--radius-xl)] bg-background min-h-layout-story shadow-lg">
+            <div className="max-w-2xl w-full p-4 border border-border rounded-xl bg-background min-h-layout-story shadow-lg">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/LikeButton.stories.tsx b/apps/web/src/features/tracks/components/LikeButton.stories.tsx
index 44aea3107..64d611695 100644
--- a/apps/web/src/features/tracks/components/LikeButton.stories.tsx
+++ b/apps/web/src/features/tracks/components/LikeButton.stories.tsx
@@ -8,7 +8,7 @@ const meta = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/LikeButton.tsx b/apps/web/src/features/tracks/components/LikeButton.tsx
index b38e333e9..17e46f3a1 100644
--- a/apps/web/src/features/tracks/components/LikeButton.tsx
+++ b/apps/web/src/features/tracks/components/LikeButton.tsx
@@ -166,7 +166,7 @@ export function LikeButton({
       variant={variant}
       size={size}
       className={cn(
-        'rounded-[var(--radius-md)] transition-[color,transform] duration-[var(--duration-normal)]',
+        'rounded-md transition-[color,transform] duration-[var(--duration-normal)]',
         className,
         isLiked && 'text-destructive hover:text-destructive/90',
         compact && 'h-auto p-1',
diff --git a/apps/web/src/features/tracks/components/ShareDialog.tsx b/apps/web/src/features/tracks/components/ShareDialog.tsx
index 671e86c4f..4fffb1389 100644
--- a/apps/web/src/features/tracks/components/ShareDialog.tsx
+++ b/apps/web/src/features/tracks/components/ShareDialog.tsx
@@ -134,12 +134,12 @@ export function ShareDialog({ open, onClose, trackId }: ShareDialogProps) {
                 <Input
                   value={shareUrl}
                   readOnly
-                  className="flex-1 rounded-[var(--radius-md)] transition-[border-color] duration-[var(--duration-normal)]"
+                  className="flex-1 rounded-md transition-[border-color] duration-[var(--duration-normal)]"
                 />
                 <Button
                   onClick={handleCopy}
                   variant="outline"
-                  className="rounded-[var(--radius-md)] transition-[color,transform] duration-[var(--duration-normal)] active:scale-95"
+                  className="rounded-md transition-[color,transform] duration-[var(--duration-normal)] active:scale-95"
                 >
                   {isCopied ? (
                     <Check className="h-4 w-4 text-success" />
@@ -156,13 +156,13 @@ export function ShareDialog({ open, onClose, trackId }: ShareDialogProps) {
               <Button
                 variant="outline"
                 onClick={onClose}
-                className="rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)]"
+                className="rounded-md transition-colors duration-[var(--duration-normal)]"
               >
                 Close
               </Button>
               <Button
                 onClick={handleCopy}
-                className="rounded-[var(--radius-md)] transition-[color,transform] duration-[var(--duration-normal)] active:scale-95"
+                className="rounded-md transition-[color,transform] duration-[var(--duration-normal)] active:scale-95"
               >
                 <Copy className="mr-2 h-4 w-4" />
                 Copy Link
diff --git a/apps/web/src/features/tracks/components/TrackCard.stories.tsx b/apps/web/src/features/tracks/components/TrackCard.stories.tsx
index 3b4eb79ed..39f347f4a 100644
--- a/apps/web/src/features/tracks/components/TrackCard.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackCard.stories.tsx
@@ -32,7 +32,7 @@ const meta = {
     },
     decorators: [
         (Story) => (
-            <div className="max-w-xs min-h-layout-story p-4 bg-background border border-border rounded-[var(--radius-xl)]">
+            <div className="max-w-xs min-h-layout-story p-4 bg-background border border-border rounded-xl">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackCard.tsx b/apps/web/src/features/tracks/components/TrackCard.tsx
index b6d488f58..e25e59923 100644
--- a/apps/web/src/features/tracks/components/TrackCard.tsx
+++ b/apps/web/src/features/tracks/components/TrackCard.tsx
@@ -47,7 +47,7 @@ function TrackCardComponent({
       role="button"
       tabIndex={onClick ? 0 : -1}
       className={cn(
-        'group relative rounded-[var(--radius-xl)] overflow-hidden border-0 shadow-lg shadow-black/5 cursor-pointer',
+        'group relative rounded-xl overflow-hidden border-0 shadow-lg shadow-black/5 cursor-pointer',
         'bg-card hover:shadow-xl hover:shadow-black/10 transition-[box-shadow,transform,background-color] duration-[var(--duration-normal)] ease-out active:scale-[0.98]',
         'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',
         className,
diff --git a/apps/web/src/features/tracks/components/TrackFilters.stories.tsx b/apps/web/src/features/tracks/components/TrackFilters.stories.tsx
index ea0982175..1f6aa73e6 100644
--- a/apps/web/src/features/tracks/components/TrackFilters.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackFilters.stories.tsx
@@ -37,7 +37,7 @@ const meta = {
   },
   decorators: [
     (Story) => (
-      <div className="w-full max-w-4xl p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+      <div className="w-full max-w-4xl p-4 bg-background border border-border rounded-xl min-h-layout-story">
         <Story />
       </div>
     ),
diff --git a/apps/web/src/features/tracks/components/TrackGrid.stories.tsx b/apps/web/src/features/tracks/components/TrackGrid.stories.tsx
index 4afc6bd91..13f9ab846 100644
--- a/apps/web/src/features/tracks/components/TrackGrid.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackGrid.stories.tsx
@@ -34,7 +34,7 @@ const meta = {
     },
     decorators: [
         (Story) => (
-            <div className="w-full max-w-6xl p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="w-full max-w-6xl p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackGrid.tsx b/apps/web/src/features/tracks/components/TrackGrid.tsx
index 47cd0fcf1..1b74f4e8e 100644
--- a/apps/web/src/features/tracks/components/TrackGrid.tsx
+++ b/apps/web/src/features/tracks/components/TrackGrid.tsx
@@ -131,7 +131,7 @@ export function TrackGrid({
         {Array.from({ length: columns * 2 }).map((_, i) => (
           <Skeleton
             key={i}
-            className="rounded-[var(--radius-md)] aspect-[3/4]"
+            className="rounded-md aspect-[3/4]"
           />
         ))}
       </div>
@@ -147,7 +147,7 @@ export function TrackGrid({
   }
 
   const densityButtonClass = [
-    'p-2 rounded-[var(--radius-md)] text-sm font-medium tracking-tight',
+    'p-2 rounded-md text-sm font-medium tracking-tight',
     'transition-[color,background-color,transform] duration-[var(--duration-normal)]',
     'hover:bg-muted/70 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
     'active:scale-95',
diff --git a/apps/web/src/features/tracks/components/TrackGridDensitySelector.stories.tsx b/apps/web/src/features/tracks/components/TrackGridDensitySelector.stories.tsx
index 1fa9be420..75474736e 100644
--- a/apps/web/src/features/tracks/components/TrackGridDensitySelector.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackGridDensitySelector.stories.tsx
@@ -9,7 +9,7 @@ const meta: Meta<typeof TrackGridDensitySelector> = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackGridDensitySelector.tsx b/apps/web/src/features/tracks/components/TrackGridDensitySelector.tsx
index 1bc18ca6e..370731a68 100644
--- a/apps/web/src/features/tracks/components/TrackGridDensitySelector.tsx
+++ b/apps/web/src/features/tracks/components/TrackGridDensitySelector.tsx
@@ -49,7 +49,7 @@ export function TrackGridDensitySelector({
   return (
     <div
       className={cn(
-        'inline-flex items-center gap-1 p-1 rounded-[var(--radius-lg)]',
+        'inline-flex items-center gap-1 p-1 rounded-lg',
         'bg-muted/40 border border-border',
         'transition-[opacity,box-shadow] duration-[var(--duration-normal)]',
         className,
@@ -65,7 +65,7 @@ export function TrackGridDensitySelector({
             type="button"
             onClick={() => onChange(option.value)}
             className={cn(
-              'flex items-center gap-2 px-4 py-1.5 rounded-[var(--radius-md)]',
+              'flex items-center gap-2 px-4 py-1.5 rounded-md',
               'text-sm font-medium tracking-tight',
               'transition-[color,background-color,transform] duration-[var(--duration-normal)]',
               'hover:bg-muted/70 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
diff --git a/apps/web/src/features/tracks/components/TrackHistory.stories.tsx b/apps/web/src/features/tracks/components/TrackHistory.stories.tsx
index de3adb0d1..0c93fc8d5 100644
--- a/apps/web/src/features/tracks/components/TrackHistory.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackHistory.stories.tsx
@@ -17,7 +17,7 @@ const meta: Meta<typeof TrackHistory> = {
   tags: ['autodocs'],
   decorators: [
     (Story) => (
-      <div className="max-w-xl border border-border/80 p-4 rounded-[var(--radius-xl)] bg-background min-h-layout-story">
+      <div className="max-w-xl border border-border/80 p-4 rounded-xl bg-background min-h-layout-story">
         <Story />
       </div>
     ),
diff --git a/apps/web/src/features/tracks/components/TrackList.tsx b/apps/web/src/features/tracks/components/TrackList.tsx
index 0a2e698b8..f74d742e5 100644
--- a/apps/web/src/features/tracks/components/TrackList.tsx
+++ b/apps/web/src/features/tracks/components/TrackList.tsx
@@ -73,7 +73,7 @@ export function TrackList({
     return (
       <div
         className={cn(
-          'p-6 text-center text-muted-foreground/90 text-sm tracking-tight rounded-[var(--radius-xl)]',
+          'p-6 text-center text-muted-foreground/90 text-sm tracking-tight rounded-xl',
           className,
         )}
       >
@@ -88,7 +88,7 @@ export function TrackList({
   return (
     <div className={cn('space-y-4', className)}>
       {showSelection && showSelectionActions && selectedTracks.length > 0 && (
-        <div className="flex items-center gap-2 p-3 bg-muted/80 rounded-[var(--radius-xl)] transition-colors duration-[var(--duration-normal)]">
+        <div className="flex items-center gap-2 p-3 bg-muted/80 rounded-xl transition-colors duration-[var(--duration-normal)]">
           <span className="text-sm text-foreground/90 tracking-tight">
             {selectedTracks.length} pistes sélectionnées
           </span>
@@ -185,7 +185,7 @@ export function TrackList({
               key={track.id}
               role="listitem"
               className={cn(
-                'flex items-center gap-4 p-3 rounded-[var(--radius-lg)] h-14 transition-colors duration-[var(--duration-normal)] group',
+                'flex items-center gap-4 p-3 rounded-lg h-14 transition-colors duration-[var(--duration-normal)] group',
                 'hover:bg-muted/50',
                 selectedTracks.includes(track.id) && 'bg-primary/10',
               )}
@@ -209,11 +209,11 @@ export function TrackList({
                   <img
                     src={track.cover}
                     alt={`Cover de ${track.title}`}
-                    className="w-full h-full object-cover rounded-[var(--radius-md)] shadow-md"
+                    className="w-full h-full object-cover rounded-md shadow-md"
                   />
                 )}
                 {/* Play Overlay */}
-                <div className="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 bg-black/40 transition-opacity duration-[var(--duration-normal)] rounded-[var(--radius-md)]">
+                <div className="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 bg-black/40 transition-opacity duration-[var(--duration-normal)] rounded-md">
                   {currentPlayingId === track.id ? (
                     <button
                       aria-label="Mettre en pause"
diff --git a/apps/web/src/features/tracks/components/TrackListContainer.stories.tsx b/apps/web/src/features/tracks/components/TrackListContainer.stories.tsx
index 60013abe1..4f7c52ef3 100644
--- a/apps/web/src/features/tracks/components/TrackListContainer.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackListContainer.stories.tsx
@@ -8,7 +8,7 @@ const meta: Meta<typeof TrackListContainer> = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="bg-background border border-border rounded-[var(--radius-xl)] p-4 min-h-layout-story">
+            <div className="bg-background border border-border rounded-xl p-4 min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackListContainer.tsx b/apps/web/src/features/tracks/components/TrackListContainer.tsx
index 87aee72ac..93480e77c 100644
--- a/apps/web/src/features/tracks/components/TrackListContainer.tsx
+++ b/apps/web/src/features/tracks/components/TrackListContainer.tsx
@@ -22,7 +22,7 @@ export function TrackListContainer({
     return (
       <div
         className={cn(
-          'p-4 rounded-[var(--radius-lg)] bg-destructive/10 border border-destructive/30',
+          'p-4 rounded-lg bg-destructive/10 border border-destructive/30',
           'text-destructive text-sm tracking-tight transition-opacity duration-[var(--duration-normal)]',
         )}
       >
diff --git a/apps/web/src/features/tracks/components/TrackListPagination.stories.tsx b/apps/web/src/features/tracks/components/TrackListPagination.stories.tsx
index e65940482..d998faf1c 100644
--- a/apps/web/src/features/tracks/components/TrackListPagination.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackListPagination.stories.tsx
@@ -14,7 +14,7 @@ const meta: Meta<typeof TrackListPagination> = {
   },
   decorators: [
     (Story) => (
-      <div className="w-full max-w-2xl border border-border rounded-[var(--radius-xl)] bg-background min-h-layout-story flex flex-col justify-end">
+      <div className="w-full max-w-2xl border border-border rounded-xl bg-background min-h-layout-story flex flex-col justify-end">
         <Story />
       </div>
     ),
diff --git a/apps/web/src/features/tracks/components/TrackListRow.stories.tsx b/apps/web/src/features/tracks/components/TrackListRow.stories.tsx
index 8640987c7..81ae97594 100644
--- a/apps/web/src/features/tracks/components/TrackListRow.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackListRow.stories.tsx
@@ -28,7 +28,7 @@ const meta = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="w-full max-w-2xl p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="w-full max-w-2xl p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackListRow.tsx b/apps/web/src/features/tracks/components/TrackListRow.tsx
index 74b3f3cfe..a2b2ff5c4 100644
--- a/apps/web/src/features/tracks/components/TrackListRow.tsx
+++ b/apps/web/src/features/tracks/components/TrackListRow.tsx
@@ -139,10 +139,10 @@ export function TrackListRow({
                   <img
                     src={track.cover}
                     alt={`Cover de ${track.title}`}
-                    className="w-full h-full object-cover rounded-[var(--radius-md)]"
+                    className="w-full h-full object-cover rounded-md"
                   />
                 ) : (
-                  <div className="w-full h-full bg-muted flex items-center justify-center rounded-[var(--radius-md)]">
+                  <div className="w-full h-full bg-muted flex items-center justify-center rounded-md">
                     <svg
                       className="w-4 h-4 text-muted-foreground/90"
                       fill="none"
@@ -159,7 +159,7 @@ export function TrackListRow({
                   </div>
                 )}
                 {showActions && (
-                  <div className="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 bg-black/40 transition-opacity duration-[var(--duration-normal)] rounded-[var(--radius-md)]">
+                  <div className="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 bg-black/40 transition-opacity duration-[var(--duration-normal)] rounded-md">
                     <button
                       onClick={handlePlay}
                       aria-label={isPlaying ? 'Mettre en pause' : 'Lire'}
@@ -199,7 +199,7 @@ export function TrackListRow({
     <li
       role="listitem"
       className={cn(
-        'flex items-center gap-4 p-2 rounded-[var(--radius-md)] hover:bg-muted/50 group h-14',
+        'flex items-center gap-4 p-2 rounded-md hover:bg-muted/50 group h-14',
         'transition-colors duration-[var(--duration-normal)]',
         'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',
         isSelected && 'bg-primary/10',
@@ -226,10 +226,10 @@ export function TrackListRow({
               <img
                 src={track.cover}
                 alt={`Cover de ${track.title}`}
-                className="w-full h-full object-cover rounded-[var(--radius-md)]"
+                className="w-full h-full object-cover rounded-md"
               />
             ) : (
-              <div className="w-full h-full bg-muted flex items-center justify-center rounded-[var(--radius-md)]">
+              <div className="w-full h-full bg-muted flex items-center justify-center rounded-md">
                 <svg
                   className="w-5 h-5 text-muted-foreground/90"
                   fill="none"
@@ -249,7 +249,7 @@ export function TrackListRow({
         )}
 
         {showActions && (
-          <div className="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 bg-black/40 transition-opacity duration-[var(--duration-normal)] rounded-[var(--radius-md)]">
+          <div className="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 bg-black/40 transition-opacity duration-[var(--duration-normal)] rounded-md">
             <button
               aria-label={isPlaying ? 'Mettre en pause' : 'Lire'}
               onClick={handlePlay}
diff --git a/apps/web/src/features/tracks/components/TrackListSelectionActions.stories.tsx b/apps/web/src/features/tracks/components/TrackListSelectionActions.stories.tsx
index 371f1671d..033c15fef 100644
--- a/apps/web/src/features/tracks/components/TrackListSelectionActions.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackListSelectionActions.stories.tsx
@@ -8,7 +8,7 @@ const meta: Meta<typeof TrackListSelectionActions> = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="w-full max-w-2xl p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story flex flex-col justify-end">
+            <div className="w-full max-w-2xl p-4 bg-background border border-border rounded-xl min-h-layout-story flex flex-col justify-end">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackListSelectionActions.tsx b/apps/web/src/features/tracks/components/TrackListSelectionActions.tsx
index 3f4186b47..fd680479a 100644
--- a/apps/web/src/features/tracks/components/TrackListSelectionActions.tsx
+++ b/apps/web/src/features/tracks/components/TrackListSelectionActions.tsx
@@ -54,7 +54,7 @@ export function TrackListSelectionActions({
   };
 
   const actionButtonClass = [
-    'p-2 rounded-[var(--radius-md)]',
+    'p-2 rounded-md',
     'transition-[background-color,transform] duration-[var(--duration-normal)]',
     'hover:bg-primary-foreground/15 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-foreground/40 focus-visible:ring-offset-2 focus-visible:ring-offset-primary',
     'active:scale-95',
diff --git a/apps/web/src/features/tracks/components/TrackListSkeleton.tsx b/apps/web/src/features/tracks/components/TrackListSkeleton.tsx
index 8ac67efc6..b84754747 100644
--- a/apps/web/src/features/tracks/components/TrackListSkeleton.tsx
+++ b/apps/web/src/features/tracks/components/TrackListSkeleton.tsx
@@ -29,27 +29,27 @@ export function TrackListSkeleton({
       {Array.from({ length: count }).map((_, index) => (
         <div
           key={index}
-          className="flex items-center gap-4 p-4 rounded-[var(--radius-xl)] bg-card border-0 shadow-sm animate-pulse"
+          className="flex items-center gap-4 p-4 rounded-xl bg-card border-0 shadow-sm animate-pulse"
         >
           {/* Cover Skeleton */}
           {showCover && (
             <div className="flex-shrink-0">
-              <div className="w-12 h-12 rounded-[var(--radius-md)] bg-muted" />
+              <div className="w-12 h-12 rounded-md bg-muted" />
             </div>
           )}
 
           {/* Track Info Skeleton */}
           <div className="flex-1 min-w-0 space-y-2">
-            <div className="h-4 rounded-[var(--radius-md)] bg-muted w-3/4" />
+            <div className="h-4 rounded-md bg-muted w-3/4" />
             {showMetadata && (
-              <div className="h-3 rounded-[var(--radius-md)] bg-muted w-1/2" />
+              <div className="h-3 rounded-md bg-muted w-1/2" />
             )}
           </div>
 
           {/* Duration Skeleton */}
           {showDuration && (
             <div className="flex-shrink-0">
-              <div className="h-3 rounded-[var(--radius-md)] bg-muted w-12" />
+              <div className="h-3 rounded-md bg-muted w-12" />
             </div>
           )}
         </div>
diff --git a/apps/web/src/features/tracks/components/TrackSearch.stories.tsx b/apps/web/src/features/tracks/components/TrackSearch.stories.tsx
index 6d98a4146..3bb883ea6 100644
--- a/apps/web/src/features/tracks/components/TrackSearch.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackSearch.stories.tsx
@@ -8,7 +8,7 @@ const meta: Meta<typeof TrackSearch> = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="w-full max-w-4xl p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="w-full max-w-4xl p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackSearch.tsx b/apps/web/src/features/tracks/components/TrackSearch.tsx
index 6ec084c34..ccb7f32b9 100644
--- a/apps/web/src/features/tracks/components/TrackSearch.tsx
+++ b/apps/web/src/features/tracks/components/TrackSearch.tsx
@@ -116,13 +116,13 @@ export function TrackSearch({
                 handleSearch();
               }
             }}
-            className="pl-10 rounded-[var(--radius-md)] transition-[border-color,box-shadow] duration-[var(--duration-normal)]"
+            className="pl-10 rounded-md transition-[border-color,box-shadow] duration-[var(--duration-normal)]"
           />
         </div>
         <Button
           onClick={handleSearch}
           disabled={loading}
-          className="rounded-[var(--radius-md)] transition-transform duration-[var(--duration-normal)] active:scale-95"
+          className="rounded-md transition-transform duration-[var(--duration-normal)] active:scale-95"
         >
           Rechercher
         </Button>
diff --git a/apps/web/src/features/tracks/components/TrackSearchFilters.stories.tsx b/apps/web/src/features/tracks/components/TrackSearchFilters.stories.tsx
index d492ec4e0..d7b49a54c 100644
--- a/apps/web/src/features/tracks/components/TrackSearchFilters.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackSearchFilters.stories.tsx
@@ -8,7 +8,7 @@ const meta: Meta<typeof TrackSearchFilters> = {
   tags: ['autodocs'],
   decorators: [
     (Story) => (
-      <div className="w-full max-w-4xl p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+      <div className="w-full max-w-4xl p-4 bg-background border border-border rounded-xl min-h-layout-story">
         <Story />
       </div>
     ),
diff --git a/apps/web/src/features/tracks/components/TrackSearchResults.stories.tsx b/apps/web/src/features/tracks/components/TrackSearchResults.stories.tsx
index 7eeaec91b..2e92a332d 100644
--- a/apps/web/src/features/tracks/components/TrackSearchResults.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackSearchResults.stories.tsx
@@ -8,7 +8,7 @@ const meta: Meta<typeof TrackSearchResults> = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="w-full max-w-4xl p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="w-full max-w-4xl p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackSearchResults.tsx b/apps/web/src/features/tracks/components/TrackSearchResults.tsx
index 592e4a86d..e2c74f269 100644
--- a/apps/web/src/features/tracks/components/TrackSearchResults.tsx
+++ b/apps/web/src/features/tracks/components/TrackSearchResults.tsx
@@ -107,7 +107,7 @@ export function TrackSearchResults({
     return (
       <Alert
         variant="destructive"
-        className={cn('rounded-[var(--radius-xl)]', className)}
+        className={cn('rounded-xl', className)}
       >
         <AlertCircle className="h-4 w-4" />
         <AlertTitle>Erreur</AlertTitle>
@@ -151,7 +151,7 @@ export function TrackSearchResults({
           <Card
             key={track.id}
             className={cn(
-              'overflow-hidden rounded-[var(--radius-xl)]',
+              'overflow-hidden rounded-xl',
               'transition-[box-shadow,transform] duration-[var(--duration-normal)] hover:shadow-xl',
             )}
           >
@@ -203,12 +203,12 @@ export function TrackSearchResults({
                     <span>{formatDuration(track.duration)}</span>
                   </div>
                   {track.genre && (
-                    <span className="px-2 py-1 bg-muted/60 rounded-[var(--radius-md)]">
+                    <span className="px-2 py-1 bg-muted/60 rounded-md">
                       {track.genre}
                     </span>
                   )}
                   {track.format && (
-                    <span className="px-2 py-1 bg-muted/60 rounded-[var(--radius-md)]">
+                    <span className="px-2 py-1 bg-muted/60 rounded-md">
                       {track.format}
                     </span>
                   )}
@@ -235,7 +235,7 @@ export function TrackSearchResults({
               size="sm"
               onClick={handlePreviousPage}
               disabled={page <= 1}
-              className="rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] active:scale-95"
+              className="rounded-md transition-colors duration-[var(--duration-normal)] active:scale-95"
             >
               <ChevronLeft className="h-4 w-4 mr-1" />
               Précédent
@@ -245,7 +245,7 @@ export function TrackSearchResults({
               size="sm"
               onClick={handleNextPage}
               disabled={page >= totalPages}
-              className="rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] active:scale-95"
+              className="rounded-md transition-colors duration-[var(--duration-normal)] active:scale-95"
             >
               Suivant
               <ChevronRight className="h-4 w-4 ml-1" />
diff --git a/apps/web/src/features/tracks/components/TrackSort.stories.tsx b/apps/web/src/features/tracks/components/TrackSort.stories.tsx
index b85d94a08..5960d8f27 100644
--- a/apps/web/src/features/tracks/components/TrackSort.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackSort.stories.tsx
@@ -9,7 +9,7 @@ const meta = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackSort.tsx b/apps/web/src/features/tracks/components/TrackSort.tsx
index abb2c517c..b8a7cba3e 100644
--- a/apps/web/src/features/tracks/components/TrackSort.tsx
+++ b/apps/web/src/features/tracks/components/TrackSort.tsx
@@ -142,7 +142,7 @@ export function TrackSort({
             }
             className={cn(
               'pl-10 pr-8 py-2 border border-input bg-background',
-              'rounded-[var(--radius-md)] text-sm font-medium text-foreground tracking-tight',
+              'rounded-md text-sm font-medium text-foreground tracking-tight',
               'transition-[border-color,box-shadow] duration-[var(--duration-normal)]',
               'focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent focus-visible:ring-primary/30',
               'appearance-none cursor-pointer',
@@ -165,7 +165,7 @@ export function TrackSort({
           type="button"
           onClick={handleOrderToggle}
           className={cn(
-            'p-2 rounded-[var(--radius-md)] border border-input bg-background',
+            'p-2 rounded-md border border-input bg-background',
             'text-foreground flex items-center justify-center',
             'transition-[color,background-color,transform] duration-[var(--duration-normal)]',
             'hover:bg-muted/50 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
diff --git a/apps/web/src/features/tracks/components/TrackStatsDisplay.stories.tsx b/apps/web/src/features/tracks/components/TrackStatsDisplay.stories.tsx
index 0e61b0ca1..e19ad598b 100644
--- a/apps/web/src/features/tracks/components/TrackStatsDisplay.stories.tsx
+++ b/apps/web/src/features/tracks/components/TrackStatsDisplay.stories.tsx
@@ -8,7 +8,7 @@ const meta = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/TrackStatsDisplay.tsx b/apps/web/src/features/tracks/components/TrackStatsDisplay.tsx
index 6c939ccf0..63e6da5a2 100644
--- a/apps/web/src/features/tracks/components/TrackStatsDisplay.tsx
+++ b/apps/web/src/features/tracks/components/TrackStatsDisplay.tsx
@@ -97,7 +97,7 @@ export function TrackStatsDisplay({
             >
               <div
                 className={cn(
-                  'p-2 rounded-[var(--radius-md)] mb-1 transition-transform duration-[var(--duration-normal)] hover:scale-105',
+                  'p-2 rounded-md mb-1 transition-transform duration-[var(--duration-normal)] hover:scale-105',
                   item.bg,
                   item.color,
                 )}
@@ -133,7 +133,7 @@ export function TrackStatsDisplay({
           >
             <div
               className={cn(
-                'p-1.5 rounded-[var(--radius-md)] opacity-80 group-hover:opacity-100 transition-[opacity,transform] duration-[var(--duration-normal)]',
+                'p-1.5 rounded-md opacity-80 group-hover:opacity-100 transition-[opacity,transform] duration-[var(--duration-normal)]',
                 item.bg,
                 item.color,
               )}
diff --git a/apps/web/src/features/tracks/components/UploadQuota.stories.tsx b/apps/web/src/features/tracks/components/UploadQuota.stories.tsx
index 462495fc2..2678f4e29 100644
--- a/apps/web/src/features/tracks/components/UploadQuota.stories.tsx
+++ b/apps/web/src/features/tracks/components/UploadQuota.stories.tsx
@@ -13,7 +13,7 @@ const meta: Meta<typeof UploadQuota> = {
     tags: ['autodocs'],
     decorators: [
         (Story) => (
-            <div className="p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/UploadQuota.tsx b/apps/web/src/features/tracks/components/UploadQuota.tsx
index b5128bfc8..3f15fdd72 100644
--- a/apps/web/src/features/tracks/components/UploadQuota.tsx
+++ b/apps/web/src/features/tracks/components/UploadQuota.tsx
@@ -185,7 +185,7 @@ export function UploadQuota({
 
         {/* Warning message if quota is near limit */}
         {isQuotaNearLimit && !isQuotaExceeded && (
-          <div className="flex items-start gap-2 p-2 bg-warning/10 rounded-[var(--radius-md)] text-xs text-warning tracking-tight transition-colors duration-[var(--duration-normal)]">
+          <div className="flex items-start gap-2 p-2 bg-warning/10 rounded-md text-xs text-warning tracking-tight transition-colors duration-[var(--duration-normal)]">
             <AlertCircle className="h-4 w-4 shrink-0 mt-0.5" />
             <span>
               Votre quota d'upload approche de sa limite. Pensez à libérer de
diff --git a/apps/web/src/features/tracks/components/ViewToggle.stories.tsx b/apps/web/src/features/tracks/components/ViewToggle.stories.tsx
index b1541529f..6b32f31bc 100644
--- a/apps/web/src/features/tracks/components/ViewToggle.stories.tsx
+++ b/apps/web/src/features/tracks/components/ViewToggle.stories.tsx
@@ -9,7 +9,7 @@ const meta = {
     parameters: { layout: 'centered' },
     decorators: [
         (Story) => (
-            <div className="p-4 bg-background border border-border rounded-[var(--radius-xl)] min-h-layout-story">
+            <div className="p-4 bg-background border border-border rounded-xl min-h-layout-story">
                 <Story />
             </div>
         ),
diff --git a/apps/web/src/features/tracks/components/ViewToggle.tsx b/apps/web/src/features/tracks/components/ViewToggle.tsx
index 0b01fd45a..4892f4aba 100644
--- a/apps/web/src/features/tracks/components/ViewToggle.tsx
+++ b/apps/web/src/features/tracks/components/ViewToggle.tsx
@@ -63,7 +63,7 @@ export function ViewToggle({
   };
 
   const buttonBase = [
-    'flex items-center gap-2 px-4 py-1.5 rounded-[var(--radius-md)]',
+    'flex items-center gap-2 px-4 py-1.5 rounded-md',
     'text-sm font-medium tracking-tight',
     'transition-[color,background-color,transform,opacity] duration-[var(--duration-normal)]',
     'hover:bg-muted/70 focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background',
@@ -73,7 +73,7 @@ export function ViewToggle({
   return (
     <div
       className={cn(
-        'inline-flex items-center gap-1 p-1 rounded-[var(--radius-lg)]',
+        'inline-flex items-center gap-1 p-1 rounded-lg',
         'bg-muted/40 border border-border',
         'transition-[opacity,box-shadow] duration-[var(--duration-normal)]',
         isTransitioning && 'opacity-75',
diff --git a/apps/web/src/features/tracks/components/comment-thread/CommentRepliesList.tsx b/apps/web/src/features/tracks/components/comment-thread/CommentRepliesList.tsx
index 23d63312e..e1c4cd1e1 100644
--- a/apps/web/src/features/tracks/components/comment-thread/CommentRepliesList.tsx
+++ b/apps/web/src/features/tracks/components/comment-thread/CommentRepliesList.tsx
@@ -15,7 +15,7 @@ export function CommentRepliesList({
   return (
     <div
       className={cn(
-        'space-y-4 pt-2 pl-4 border-l-2 border-border/80 rounded-[var(--radius-sm)] transition-colors duration-[var(--duration-normal)]',
+        'space-y-4 pt-2 pl-4 border-l-2 border-border/80 rounded-sm transition-colors duration-[var(--duration-normal)]',
         className,
       )}
       data-testid="comment-replies-list"
diff --git a/apps/web/src/features/tracks/components/comment-thread/CommentReplyForm.tsx b/apps/web/src/features/tracks/components/comment-thread/CommentReplyForm.tsx
index 63bccc22a..42d1f98fb 100644
--- a/apps/web/src/features/tracks/components/comment-thread/CommentReplyForm.tsx
+++ b/apps/web/src/features/tracks/components/comment-thread/CommentReplyForm.tsx
@@ -27,7 +27,7 @@ export function CommentReplyForm({
     <form
       onSubmit={onSubmit}
       className={cn(
-        'space-y-2 pt-2 rounded-[var(--radius-lg)] transition-opacity duration-[var(--duration-normal)]',
+        'space-y-2 pt-2 rounded-lg transition-opacity duration-[var(--duration-normal)]',
         className,
       )}
       data-testid="comment-reply-form"
@@ -38,14 +38,14 @@ export function CommentReplyForm({
         placeholder={placeholder}
         maxLength={500}
         autoFocus
-        className="rounded-[var(--radius-md)] transition-[border-color,box-shadow] duration-[var(--duration-normal)]"
+        className="rounded-md transition-[border-color,box-shadow] duration-[var(--duration-normal)]"
       />
       <div className="flex gap-2">
         <Button
           type="submit"
           size="sm"
           disabled={!value.trim() || isPending}
-          className="rounded-[var(--radius-md)] transition-transform duration-[var(--duration-normal)] active:scale-95"
+          className="rounded-md transition-transform duration-[var(--duration-normal)] active:scale-95"
         >
           {isPending ? (
             <Spinner size="sm" className="mr-2" />
@@ -59,7 +59,7 @@ export function CommentReplyForm({
           variant="outline"
           size="sm"
           onClick={onCancel}
-          className="rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)]"
+          className="rounded-md transition-colors duration-[var(--duration-normal)]"
         >
           <X className="h-4 w-4 mr-2" />
           Annuler
diff --git a/apps/web/src/features/tracks/components/comment-thread/CommentThread.tsx b/apps/web/src/features/tracks/components/comment-thread/CommentThread.tsx
index 75cf94ebe..1cbd27aaa 100644
--- a/apps/web/src/features/tracks/components/comment-thread/CommentThread.tsx
+++ b/apps/web/src/features/tracks/components/comment-thread/CommentThread.tsx
@@ -85,7 +85,7 @@ export function CommentThread({
     <>
       <div
         className={cn(
-          'space-y-4 rounded-[var(--radius-lg)] p-3 -m-3 transition-[color,box-shadow] duration-[var(--duration-normal)]',
+          'space-y-4 rounded-lg p-3 -m-3 transition-[color,box-shadow] duration-[var(--duration-normal)]',
           'hover:bg-muted/20 focus-within:ring-1 focus-within:ring-primary/20 focus-within:ring-inset focus-within:bg-muted/10',
           className,
         )}
diff --git a/apps/web/src/features/tracks/components/comment-thread/CommentThreadActions.tsx b/apps/web/src/features/tracks/components/comment-thread/CommentThreadActions.tsx
index 90f1b3d65..dae5f70cd 100644
--- a/apps/web/src/features/tracks/components/comment-thread/CommentThreadActions.tsx
+++ b/apps/web/src/features/tracks/components/comment-thread/CommentThreadActions.tsx
@@ -47,7 +47,7 @@ export function CommentThreadActions({
             variant="ghost"
             size="sm"
             onClick={onToggleReply}
-            className="h-7 text-xs tracking-tight rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] hover:text-primary hover:bg-primary/10"
+            className="h-7 text-xs tracking-tight rounded-md transition-colors duration-[var(--duration-normal)] hover:text-primary hover:bg-primary/10"
           >
             <Reply className="h-3 w-3 mr-1 text-primary/90" />
             Répondre
@@ -66,7 +66,7 @@ export function CommentThreadActions({
             variant="ghost"
             size="sm"
             onClick={onToggleReplies}
-            className="h-7 text-xs tracking-tight rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] hover:text-primary hover:bg-primary/10"
+            className="h-7 text-xs tracking-tight rounded-md transition-colors duration-[var(--duration-normal)] hover:text-primary hover:bg-primary/10"
           >
             <MessageCircle className="h-3 w-3 mr-1 text-primary/90" />
             {showReplies ? 'Masquer' : 'Afficher'} {repliesCount}{' '}
diff --git a/apps/web/src/features/tracks/components/comment-thread/CommentThreadContent.tsx b/apps/web/src/features/tracks/components/comment-thread/CommentThreadContent.tsx
index 4390d3699..d4d32dcdf 100644
--- a/apps/web/src/features/tracks/components/comment-thread/CommentThreadContent.tsx
+++ b/apps/web/src/features/tracks/components/comment-thread/CommentThreadContent.tsx
@@ -31,7 +31,7 @@ export function CommentThreadContent({
       <form
         onSubmit={onEditSubmit}
         className={cn(
-          'space-y-2 rounded-[var(--radius-lg)] transition-opacity duration-[var(--duration-normal)]',
+          'space-y-2 rounded-lg transition-opacity duration-[var(--duration-normal)]',
           className,
         )}
         data-testid="comment-edit-form"
@@ -41,14 +41,14 @@ export function CommentThreadContent({
           onChange={(e) => onEditContentChange(e.target.value)}
           maxLength={500}
           autoFocus
-          className="rounded-[var(--radius-md)] transition-[border-color,box-shadow] duration-[var(--duration-normal)]"
+          className="rounded-md transition-[border-color,box-shadow] duration-[var(--duration-normal)]"
         />
         <div className="flex gap-2">
           <Button
             type="submit"
             size="sm"
             disabled={!editContent.trim() || isEditPending}
-            className="rounded-[var(--radius-md)] transition-transform duration-[var(--duration-normal)] active:scale-95"
+            className="rounded-md transition-transform duration-[var(--duration-normal)] active:scale-95"
           >
             {isEditPending ? (
               <Spinner size="sm" className="mr-2" />
@@ -62,7 +62,7 @@ export function CommentThreadContent({
             variant="outline"
             size="sm"
             onClick={onEditCancel}
-            className="rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)]"
+            className="rounded-md transition-colors duration-[var(--duration-normal)]"
           >
             <X className="h-4 w-4 mr-2" />
             Annuler
diff --git a/apps/web/src/features/tracks/components/comment-thread/CommentThreadHeader.tsx b/apps/web/src/features/tracks/components/comment-thread/CommentThreadHeader.tsx
index 28eb48127..b57eaca35 100644
--- a/apps/web/src/features/tracks/components/comment-thread/CommentThreadHeader.tsx
+++ b/apps/web/src/features/tracks/components/comment-thread/CommentThreadHeader.tsx
@@ -58,12 +58,12 @@ export function CommentThreadHeader({
             <Button
               variant="ghost"
               size="icon"
-              className="h-6 w-6 rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] hover:text-foreground hover:bg-muted/50"
+              className="h-6 w-6 rounded-md transition-colors duration-[var(--duration-normal)] hover:text-foreground hover:bg-muted/50"
             >
               <MoreVertical className="h-4 w-4" />
             </Button>
           </DropdownMenuTrigger>
-          <DropdownMenuContent align="end" className="rounded-[var(--radius-lg)]">
+          <DropdownMenuContent align="end" className="rounded-lg">
             {canEdit && (
               <DropdownMenuItem onClick={onEdit}>
                 <Edit2 className="mr-2 h-4 w-4" />
diff --git a/apps/web/src/features/tracks/components/comment-thread/CommentThreadSkeleton.stories.tsx b/apps/web/src/features/tracks/components/comment-thread/CommentThreadSkeleton.stories.tsx
index 276bdc0d0..61cb369bb 100644
--- a/apps/web/src/features/tracks/components/comment-thread/CommentThreadSkeleton.stories.tsx
+++ b/apps/web/src/features/tracks/components/comment-thread/CommentThreadSkeleton.stories.tsx
@@ -9,7 +9,7 @@ const meta: Meta<typeof CommentThreadSkeleton> = {
     },
     decorators: [
         (Story) => (
-            <div className="max-w-2xl w-full p-4 border border-border rounded-[var(--radius-xl)] bg-background min-h-layout-story space-y-4">
+            <div className="max-w-2xl w-full p-4 border border-border rounded-xl bg-background min-h-layout-story space-y-4">
                 <Story />
                 <CommentThreadSkeleton />
                 <CommentThreadSkeleton />
diff --git a/apps/web/src/features/tracks/components/comment-thread/CommentThreadSkeleton.tsx b/apps/web/src/features/tracks/components/comment-thread/CommentThreadSkeleton.tsx
index db1954740..bbdea1ff0 100644
--- a/apps/web/src/features/tracks/components/comment-thread/CommentThreadSkeleton.tsx
+++ b/apps/web/src/features/tracks/components/comment-thread/CommentThreadSkeleton.tsx
@@ -14,7 +14,7 @@ export function CommentThreadSkeleton({
   return (
     <div
       className={cn(
-        'flex gap-4 animate-pulse rounded-[var(--radius-lg)] transition-opacity duration-[var(--duration-normal)]',
+        'flex gap-4 animate-pulse rounded-lg transition-opacity duration-[var(--duration-normal)]',
         className,
       )}
       data-testid="comment-thread-skeleton"
@@ -22,11 +22,11 @@ export function CommentThreadSkeleton({
       <div className="h-8 w-8 shrink-0 rounded-full bg-muted" />
       <div className="flex-1 min-w-0 space-y-2">
         <div className="flex items-center gap-2">
-          <div className="h-4 w-24 rounded-[var(--radius-md)] bg-muted" />
-          <div className="h-3 w-16 rounded-[var(--radius-md)] bg-muted" />
+          <div className="h-4 w-24 rounded-md bg-muted" />
+          <div className="h-3 w-16 rounded-md bg-muted" />
         </div>
-        <div className="h-4 w-full rounded-[var(--radius-md)] bg-muted" />
-        <div className="h-4 w-2/3 rounded-[var(--radius-md)] bg-muted" />
+        <div className="h-4 w-full rounded-md bg-muted" />
+        <div className="h-4 w-2/3 rounded-md bg-muted" />
       </div>
     </div>
   );
diff --git a/apps/web/src/features/tracks/components/track-filters/TrackFilters.tsx b/apps/web/src/features/tracks/components/track-filters/TrackFilters.tsx
index b6e1025bb..ba03a6d70 100644
--- a/apps/web/src/features/tracks/components/track-filters/TrackFilters.tsx
+++ b/apps/web/src/features/tracks/components/track-filters/TrackFilters.tsx
@@ -48,7 +48,7 @@ export function TrackFilters({
   return (
     <div
       className={cn(
-        'bg-card border border-border rounded-[var(--radius-xl)] p-4 shadow-sm',
+        'bg-card border border-border rounded-xl p-4 shadow-sm',
         'transition-[box-shadow,border-color] duration-[var(--duration-normal)] hover:shadow-md',
         className,
       )}
diff --git a/apps/web/src/features/tracks/components/track-filters/TrackFiltersClear.tsx b/apps/web/src/features/tracks/components/track-filters/TrackFiltersClear.tsx
index 4aeea3178..37b793bec 100644
--- a/apps/web/src/features/tracks/components/track-filters/TrackFiltersClear.tsx
+++ b/apps/web/src/features/tracks/components/track-filters/TrackFiltersClear.tsx
@@ -13,7 +13,7 @@ export function TrackFiltersClear({ onClear }: TrackFiltersClearProps) {
         onClick={onClear}
         className={cn(
           'flex items-center gap-2 px-4 py-2 text-sm font-medium tracking-tight',
-          'text-foreground rounded-[var(--radius-md)]',
+          'text-foreground rounded-md',
           'transition-[color,background-color,transform] duration-[var(--duration-normal)] hover:bg-muted/50 active:scale-95',
           'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
         )}
diff --git a/apps/web/src/features/tracks/components/track-filters/TrackFiltersHeader.tsx b/apps/web/src/features/tracks/components/track-filters/TrackFiltersHeader.tsx
index fd6704afb..616a3a834 100644
--- a/apps/web/src/features/tracks/components/track-filters/TrackFiltersHeader.tsx
+++ b/apps/web/src/features/tracks/components/track-filters/TrackFiltersHeader.tsx
@@ -21,7 +21,7 @@ export function TrackFiltersHeader({
       type="button"
       onClick={onToggle}
       className={cn(
-        'flex items-center justify-between w-full mb-4 text-left rounded-[var(--radius-md)]',
+        'flex items-center justify-between w-full mb-4 text-left rounded-md',
         'transition-colors duration-[var(--duration-normal)] hover:bg-muted/30',
         'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
       )}
diff --git a/apps/web/src/features/tracks/components/track-filters/TrackFiltersSearch.tsx b/apps/web/src/features/tracks/components/track-filters/TrackFiltersSearch.tsx
index 50c257baa..a4d441a27 100644
--- a/apps/web/src/features/tracks/components/track-filters/TrackFiltersSearch.tsx
+++ b/apps/web/src/features/tracks/components/track-filters/TrackFiltersSearch.tsx
@@ -29,7 +29,7 @@ export function TrackFiltersSearch({ value, onChange }: TrackFiltersSearchProps)
             type="button"
             onClick={() => onChange('')}
             className={cn(
-              'absolute right-3 top-1/2 -translate-y-1/2 rounded-[var(--radius-sm)]',
+              'absolute right-3 top-1/2 -translate-y-1/2 rounded-sm',
               'text-muted-foreground/90 transition-colors duration-[var(--duration-normal)] hover:text-foreground hover:bg-muted/30',
             )}
             aria-label="Effacer la recherche"
diff --git a/apps/web/src/features/tracks/components/track-filters/TrackFiltersSkeleton.tsx b/apps/web/src/features/tracks/components/track-filters/TrackFiltersSkeleton.tsx
index 9a154f0bb..e8de5b040 100644
--- a/apps/web/src/features/tracks/components/track-filters/TrackFiltersSkeleton.tsx
+++ b/apps/web/src/features/tracks/components/track-filters/TrackFiltersSkeleton.tsx
@@ -13,18 +13,18 @@ export function TrackFiltersSkeleton({ className }: TrackFiltersSkeletonProps) {
   return (
     <div
       className={cn(
-        'bg-card border border-border rounded-[var(--radius-xl)] p-4 min-h-layout-story shadow-sm',
+        'bg-card border border-border rounded-xl p-4 min-h-layout-story shadow-sm',
         'transition-opacity duration-[var(--duration-normal)]',
         className,
       )}
     >
       <div className="space-y-4">
-        <Skeleton className="h-10 rounded-[var(--radius-md)]" />
+        <Skeleton className="h-10 rounded-md" />
         <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
           {[1, 2, 3, 4].map((i) => (
             <Skeleton
               key={i}
-              className="h-10 rounded-[var(--radius-md)]"
+              className="h-10 rounded-md"
             />
           ))}
         </div>
diff --git a/apps/web/src/features/tracks/components/track-filters/types.ts b/apps/web/src/features/tracks/components/track-filters/types.ts
index 434cd7556..bd2817bdf 100644
--- a/apps/web/src/features/tracks/components/track-filters/types.ts
+++ b/apps/web/src/features/tracks/components/track-filters/types.ts
@@ -20,7 +20,7 @@ export interface TrackFiltersProps {
 }
 
 export const INPUT_CLASS = [
-  'w-full px-4 py-2 border border-input bg-background rounded-[var(--radius-md)]',
+  'w-full px-4 py-2 border border-input bg-background rounded-md',
   'text-foreground placeholder:text-muted-foreground',
   'transition-[border-color,box-shadow] duration-[var(--duration-normal)]',
   'focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent focus-visible:ring-primary/30',
@@ -30,7 +30,7 @@ export const LABEL_CLASS =
   'block text-sm font-medium text-foreground text-muted-foreground/90 tracking-tight mb-1';
 
 export const SELECT_CLASS = [
-  'w-full px-4 py-2 border border-input bg-background rounded-[var(--radius-md)] text-foreground',
+  'w-full px-4 py-2 border border-input bg-background rounded-md text-foreground',
   'transition-[border-color,box-shadow] duration-[var(--duration-normal)]',
   'focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent focus-visible:ring-primary/30',
 ].join(' ');
diff --git a/apps/web/src/features/tracks/components/track-history/TrackHistory.tsx b/apps/web/src/features/tracks/components/track-history/TrackHistory.tsx
index 4916e554e..3e1609ad0 100644
--- a/apps/web/src/features/tracks/components/track-history/TrackHistory.tsx
+++ b/apps/web/src/features/tracks/components/track-history/TrackHistory.tsx
@@ -37,7 +37,7 @@ export function TrackHistory({
   if (error) {
     return (
       <div className={cn('p-4', className)}>
-        <Alert variant="destructive" className="rounded-[var(--radius-xl)]">
+        <Alert variant="destructive" className="rounded-xl">
           <AlertDescription className="tracking-tight">{error}</AlertDescription>
         </Alert>
       </div>
diff --git a/apps/web/src/features/tracks/components/track-history/TrackHistoryEmpty.tsx b/apps/web/src/features/tracks/components/track-history/TrackHistoryEmpty.tsx
index a6ea4d6b7..0015abe8a 100644
--- a/apps/web/src/features/tracks/components/track-history/TrackHistoryEmpty.tsx
+++ b/apps/web/src/features/tracks/components/track-history/TrackHistoryEmpty.tsx
@@ -2,7 +2,7 @@ import { History } from 'lucide-react';
 
 export function TrackHistoryEmpty() {
   return (
-    <div className="text-center py-8 text-muted-foreground/90 text-sm tracking-tight rounded-[var(--radius-xl)]">
+    <div className="text-center py-8 text-muted-foreground/90 text-sm tracking-tight rounded-xl">
       <History className="h-12 w-12 mx-auto mb-4 opacity-50 transition-opacity duration-[var(--duration-normal)]" aria-hidden />
       <p>Aucune modification enregistrée</p>
     </div>
diff --git a/apps/web/src/features/tracks/components/track-history/TrackHistoryItemRow.tsx b/apps/web/src/features/tracks/components/track-history/TrackHistoryItemRow.tsx
index 816f13944..f38b7b9b0 100644
--- a/apps/web/src/features/tracks/components/track-history/TrackHistoryItemRow.tsx
+++ b/apps/web/src/features/tracks/components/track-history/TrackHistoryItemRow.tsx
@@ -46,13 +46,13 @@ export function TrackHistoryItemRow({ item }: TrackHistoryItemRowProps) {
         </div>
 
         {(oldValue !== null || newValue !== null) && (
-          <div className="space-y-2 rounded-[var(--radius-lg)] border border-border/80 bg-muted/50 p-4 text-sm transition-colors duration-[var(--duration-normal)]">
+          <div className="space-y-2 rounded-lg border border-border/80 bg-muted/50 p-4 text-sm transition-colors duration-[var(--duration-normal)]">
             {oldValue !== null && (
               <div>
                 <div className="text-xs font-medium text-muted-foreground/90 mb-1 tracking-tight">
                   Ancienne valeur:
                 </div>
-                <pre className="text-xs bg-background rounded-[var(--radius-md)] p-2 overflow-x-auto tracking-tight">
+                <pre className="text-xs bg-background rounded-md p-2 overflow-x-auto tracking-tight">
                   {formatValue(oldValue)}
                 </pre>
               </div>
@@ -62,7 +62,7 @@ export function TrackHistoryItemRow({ item }: TrackHistoryItemRowProps) {
                 <div className="text-xs font-medium text-muted-foreground/90 mb-1 tracking-tight">
                   Nouvelle valeur:
                 </div>
-                <pre className="text-xs bg-background rounded-[var(--radius-md)] p-2 overflow-x-auto tracking-tight">
+                <pre className="text-xs bg-background rounded-md p-2 overflow-x-auto tracking-tight">
                   {formatValue(newValue)}
                 </pre>
               </div>
diff --git a/apps/web/src/features/tracks/components/track-history/TrackHistorySkeleton.tsx b/apps/web/src/features/tracks/components/track-history/TrackHistorySkeleton.tsx
index 326bd73e7..fbf6e7a6a 100644
--- a/apps/web/src/features/tracks/components/track-history/TrackHistorySkeleton.tsx
+++ b/apps/web/src/features/tracks/components/track-history/TrackHistorySkeleton.tsx
@@ -9,9 +9,9 @@ export function TrackHistorySkeleton() {
     <div className="space-y-4 min-h-layout-story">
       <div className="flex items-center justify-between">
         <div className="flex items-center gap-2">
-          <Skeleton className="h-5 w-5 rounded-[var(--radius-md)]" />
-          <Skeleton className="h-6 w-52 rounded-[var(--radius-md)]" />
-          <Skeleton className="h-4 w-8 rounded-[var(--radius-md)]" />
+          <Skeleton className="h-5 w-5 rounded-md" />
+          <Skeleton className="h-6 w-52 rounded-md" />
+          <Skeleton className="h-4 w-8 rounded-md" />
         </div>
       </div>
       <div className="relative space-y-6">
@@ -21,10 +21,10 @@ export function TrackHistorySkeleton() {
             <Skeleton className="relative z-10 h-12 w-12 shrink-0 rounded-full" />
             <div className="flex-1 min-w-0 space-y-2 pb-6">
               <div className="flex items-center justify-between gap-2">
-                <Skeleton className="h-4 w-24 rounded-[var(--radius-md)]" />
-                <Skeleton className="h-3 w-32 rounded-[var(--radius-md)]" />
+                <Skeleton className="h-4 w-24 rounded-md" />
+                <Skeleton className="h-3 w-32 rounded-md" />
               </div>
-              <Skeleton className="h-16 rounded-[var(--radius-lg)]" />
+              <Skeleton className="h-16 rounded-lg" />
             </div>
           </div>
         ))}
diff --git a/apps/web/src/features/tracks/components/track-list-pagination/TrackListPaginationNav.tsx b/apps/web/src/features/tracks/components/track-list-pagination/TrackListPaginationNav.tsx
index c3d26eb9c..33c3859f4 100644
--- a/apps/web/src/features/tracks/components/track-list-pagination/TrackListPaginationNav.tsx
+++ b/apps/web/src/features/tracks/components/track-list-pagination/TrackListPaginationNav.tsx
@@ -17,14 +17,14 @@ interface TrackListPaginationNavProps {
 }
 
 const navButtonClass = [
-  'p-2 rounded-[var(--radius-md)] text-muted-foreground/90',
+  'p-2 rounded-md text-muted-foreground/90',
   'transition-[color,background-color,transform] duration-[var(--duration-normal)]',
   'hover:bg-primary/10 hover:text-primary focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
   'disabled:opacity-50 disabled:cursor-not-allowed active:scale-95',
 ].join(' ');
 
 const pageButtonClass = [
-  'px-4 py-1.5 rounded-[var(--radius-md)] text-sm font-medium tabular-nums tracking-tight',
+  'px-4 py-1.5 rounded-md text-sm font-medium tabular-nums tracking-tight',
   'transition-[color,background-color,transform] duration-[var(--duration-normal)]',
   'focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
   'disabled:opacity-50 disabled:cursor-not-allowed active:scale-95',
diff --git a/apps/web/src/features/tracks/components/track-list-pagination/TrackListPaginationSkeleton.tsx b/apps/web/src/features/tracks/components/track-list-pagination/TrackListPaginationSkeleton.tsx
index 2f70367a5..7f45f35a5 100644
--- a/apps/web/src/features/tracks/components/track-list-pagination/TrackListPaginationSkeleton.tsx
+++ b/apps/web/src/features/tracks/components/track-list-pagination/TrackListPaginationSkeleton.tsx
@@ -17,17 +17,17 @@ export function TrackListPaginationSkeleton({
       )}
       role="presentation"
     >
-      <Skeleton className="h-4 w-48 rounded-[var(--radius-md)]" />
+      <Skeleton className="h-4 w-48 rounded-md" />
       <div className="flex items-center gap-2">
-        <Skeleton className="h-10 w-10 rounded-[var(--radius-md)]" />
-        <Skeleton className="h-10 w-10 rounded-[var(--radius-md)]" />
+        <Skeleton className="h-10 w-10 rounded-md" />
+        <Skeleton className="h-10 w-10 rounded-md" />
         <div className="flex gap-1">
           {Array.from({ length: 5 }, (_, i) => (
-            <Skeleton key={i} className="h-9 w-10 rounded-[var(--radius-md)]" />
+            <Skeleton key={i} className="h-9 w-10 rounded-md" />
           ))}
         </div>
-        <Skeleton className="h-10 w-10 rounded-[var(--radius-md)]" />
-        <Skeleton className="h-10 w-10 rounded-[var(--radius-md)]" />
+        <Skeleton className="h-10 w-10 rounded-md" />
+        <Skeleton className="h-10 w-10 rounded-md" />
       </div>
     </div>
   );
diff --git a/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFilters.tsx b/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFilters.tsx
index ba6dcba19..8eede7fc3 100644
--- a/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFilters.tsx
+++ b/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFilters.tsx
@@ -40,7 +40,7 @@ export function TrackSearchFilters({
           variant="ghost"
           size="sm"
           onClick={() => setShowAdvanced(!showAdvanced)}
-          className="text-sm tracking-tight rounded-[var(--radius-md)] transition-colors duration-[var(--duration-normal)] hover:bg-primary/10 hover:text-primary"
+          className="text-sm tracking-tight rounded-md transition-colors duration-[var(--duration-normal)] hover:bg-primary/10 hover:text-primary"
         >
           {showAdvanced ? 'Masquer' : 'Afficher'} les filtres avancés
         </Button>
diff --git a/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersAdvanced.tsx b/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersAdvanced.tsx
index e889d0d02..fdcd85ebd 100644
--- a/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersAdvanced.tsx
+++ b/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersAdvanced.tsx
@@ -14,7 +14,7 @@ interface TrackSearchFiltersAdvancedProps {
 
 const labelClass = 'text-muted-foreground/90 tracking-tight';
 const inputClass =
-  'rounded-[var(--radius-md)] transition-[border-color,box-shadow] duration-[var(--duration-normal)]';
+  'rounded-md transition-[border-color,box-shadow] duration-[var(--duration-normal)]';
 
 export function TrackSearchFiltersAdvanced({
   filters,
@@ -23,7 +23,7 @@ export function TrackSearchFiltersAdvanced({
   updateFilter,
 }: TrackSearchFiltersAdvancedProps) {
   return (
-    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 p-4 border border-border rounded-[var(--radius-xl)] bg-muted/30 transition-colors duration-[var(--duration-normal)]">
+    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 p-4 border border-border rounded-xl bg-muted/30 transition-colors duration-[var(--duration-normal)]">
       <div className="space-y-2">
         <Label htmlFor="tags" className={labelClass}>
           Tags (séparés par des virgules)
diff --git a/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersBasic.tsx b/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersBasic.tsx
index e1bb69131..01151dae9 100644
--- a/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersBasic.tsx
+++ b/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersBasic.tsx
@@ -19,7 +19,7 @@ interface TrackSearchFiltersBasicProps {
 
 const labelClass = 'text-muted-foreground/90 tracking-tight';
 const selectClass =
-  'w-full mt-1 rounded-[var(--radius-md)] transition-[border-color,box-shadow] duration-[var(--duration-normal)]';
+  'w-full mt-1 rounded-md transition-[border-color,box-shadow] duration-[var(--duration-normal)]';
 
 export function TrackSearchFiltersBasic({
   filters,
@@ -94,7 +94,7 @@ export function TrackSearchFiltersBasic({
           variant="outline"
           size="sm"
           onClick={onClear}
-          className="mb-0 rounded-[var(--radius-md)] transition-[color,transform] duration-[var(--duration-normal)] active:scale-95"
+          className="mb-0 rounded-md transition-[color,transform] duration-[var(--duration-normal)] active:scale-95"
         >
           <X className="h-4 w-4 mr-2 text-muted-foreground/90" />
           Réinitialiser
diff --git a/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersSkeleton.tsx b/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersSkeleton.tsx
index 73542c61c..8fabb73e4 100644
--- a/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersSkeleton.tsx
+++ b/apps/web/src/features/tracks/components/track-search-filters/TrackSearchFiltersSkeleton.tsx
@@ -22,12 +22,12 @@ export function TrackSearchFiltersSkeleton({
       <div className="flex flex-wrap gap-4 items-end">
         {[1, 2, 3, 4].map((i) => (
           <div key={i} className="flex-1 min-w-48 space-y-1">
-            <Skeleton className="h-4 w-16 rounded-[var(--radius-md)]" />
-            <Skeleton className="h-10 w-full rounded-[var(--radius-md)]" />
+            <Skeleton className="h-4 w-16 rounded-md" />
+            <Skeleton className="h-10 w-full rounded-md" />
           </div>
         ))}
       </div>
-      <Skeleton className="h-9 w-48 rounded-[var(--radius-md)]" />
+      <Skeleton className="h-9 w-48 rounded-md" />
     </div>
   );
 }