refactor: migrate to tailwind v4 style

[hyoban]

Important

1. Make sure you have read our contribution guidelines
2. Ensure there is an associated issue and you have been assigned to it
3. Use the correct syntax to link this PR: Fixes #<issue number>.

Summary

close #36416

Auto-Fix Categories

• Size-axis merge: ~1938 occurrences across 820 files. Examples: h-4 w-4 -> size-4, h-full w-full -> size-full, h-auto w-auto -> size-auto.
• Font size and line-height merge: 91 occurrences across 65 files. Examples: text-sm leading-5 -> text-sm/5, text-xs leading-4 -> text-xs/4, text-lg leading-6 -> text-lg/6.
• Important modifier normalization: 66 occurrences across 28 files. Examples: !px-2 -> px-2!, data-[...]:!w-[420px] -> data-[...]:w-[420px]!.
• Padding/margin axis merge: 30 occurrences across 24 files. Examples: pl-6 pr-6 -> px-6, px-0 py-0 -> p-0, mb-2 mt-2 -> my-2.
• Inset/edge-position merge: 20 occurrences across 16 files. Examples: left-0 right-0 -> inset-x-0, top-0 right-0 bottom-0 left-0 -> inset-0.
• Translate-axis merge: 17 occurrences across 13 files. Examples: translate-x-0 translate-y-0 -> translate-0, -translate-x-1/2 -translate-y-1/2 -> -translate-1/2.
• Text overflow, word wrapping, and scrollbar utilities: ~18 occurrences. Examples: overflow-hidden text-ellipsis whitespace-nowrap -> truncate, break-words -> wrap-break-word, [scrollbar-width:none] -> scrollbar-none.
• Border radius direction merge: 8 occurrences across 6 files. Examples: rounded-bl-xl rounded-br-xl -> rounded-b-xl, rounded-tl-xl rounded-tr-xl -> rounded-t-xl.
• Tailwind v4 naming/value normalization: includes bg-gradient-to-r -> bg-linear-to-r 4 occurrences, bg-white/[0.08] -> bg-white/8 4 occurrences, z-[9999] -> z-9999 3 occurrences, and border-[1px] -> border 1 occurrence.
• Arbitrary value normalization: examples include -right-[9px] -> right-[-9px], max-w-[calc(100%_-_30px)] -> max-w-[calc(100%-30px)], and has-[[data-popup-open]]:visible -> has-data-popup-open:visible.
• Project-specific semantic utility folding: 4 occurrences. Examples: p-1.5 rounded-lg size-8 -> action-btn-l, system-xs-regular font-normal -> body-xs-regular, system-xs-medium uppercase -> system-xs-medium-uppercase.

Screenshots

Before	After
...	...

Checklist

• This change requires a documentation update, included: Dify Document
• I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos!)
• I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change.
• I've updated the documentation accordingly.
• I ran make lint && make type-check (backend) and cd web && pnpm exec vp staged (frontend) to appease the lint gods

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 86.02%. Comparing base (0b48a7e) to head (f4b8912).
⚠️ Report is 5 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main   #36417   +/-   ##
=======================================
  Coverage   86.02%   86.02%           
=======================================
  Files        4477     4478    +1     
  Lines      213439   213433    -6     
  Branches    39667    39673    +6     
=======================================
- Hits       183612   183607    -5     
+ Misses      26565    26564    -1     
  Partials     3262     3262           

Flag	Coverage Δ
dify-ui	94.80% <ø> (ø)
web	86.57% <100.00%> (+<0.01%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.