feat(cssVar): add new CSS variables for font size and tooltip positioning

Refactor styles for consistency and improved theming

- Updated context menu styles to use new spacing and surface mixins.
- Adjusted control styles to utilize touch hit size for better accessibility.
- Refined info panel padding and applied panel surface mixin for uniformity.
- Standardized mini player transitions and background colors.
- Introduced new mixins for panel surfaces and flyout animations.
- Enhanced notice padding and applied consistent spacing variables.
- Updated plugin styles to use new icon sizes and panel surface mixin.
- Improved progress bar styles with consistent surface and shadow properties.
- Refactored selector styles to utilize new surface mixin and flyout animations.
- Streamlined setting panel styles with consistent spacing and hover effects.
- Added new variables for spacing, surface colors, and icon sizes.
- Updated volume panel styles to use new spacing and flyout animations.

feat(cssVar): add new CSS variables for enhanced theming and layout

Refactor styles in ArtPlayer

- Updated transition properties across various LESS files to use the new `--art-ease-standard` variable for consistency.
- Added new CSS variables for mobile padding and border radius.
- Introduced shadow variables for different elevation levels.
- Minor adjustments to ensure proper formatting and consistency in LESS files, including adding missing newlines at the end of files.

refactor: replace art-text-muted mixin with direct font-size in setting.less

Refactor styles for context menu, info panel, and settings

- Updated font sizes to use the new variable `--art-font-size-sm` for consistency across context menus, info panels, and settings.
- Introduced a new mixin `.art-menu-item-base` to standardize menu item styles, including padding and hover effects.
- Adjusted padding and positioning for tooltip elements in the progress bar.
- Added new CSS variables for tip padding and offset to enhance maintainability and readability of styles.

packages/artplayer/types/cssVar.d.ts

@@ -2,15 +2,28 @@ export interface CssVar {
   '--art-theme': string
   '--art-font-color': string
   '--art-background-color': string
+  '--art-font-size-sm': string
   '--art-text-shadow-color': string
   '--art-transition-duration': string
+  '--art-ease-standard': string
   '--art-padding': string
   '--art-border-radius': string
+  '--art-mobile-padding': string
+  '--art-mobile-radius': string
+  '--art-radius-sm': string
+  '--art-space-xxs': string
+  '--art-space-xs': string
+  '--art-surface-hover-color': string
+  '--art-surface-border-color': string
+  '--art-surface-muted-color': string
+  '--art-surface-range-color': string
   '--art-progress-height': string
   '--art-progress-color': string
   '--art-progress-top-gap': string
   '--art-hover-color': string
   '--art-loaded-color': string
+  '--art-tip-padding': string
+  '--art-tip-offset': string
   '--art-state-size': string
   '--art-state-opacity': number
   '--art-bottom-height': string
@@ -22,6 +35,7 @@ export interface CssVar {
   '--art-control-opacity': number
   '--art-control-icon-size': string
   '--art-control-icon-scale': number
+  '--art-touch-hit-size': string
   '--art-volume-height': string
   '--art-volume-handle-size': string
   '--art-lock-size': string
@@ -32,6 +46,7 @@ export interface CssVar {
   '--art-settings-max-height': string
   '--art-selector-max-height': string
   '--art-contextmenus-min-width': string
+  '--art-contextmenu-padding-x': string
   '--art-subtitle-font-size': string
   '--art-subtitle-gap': string
   '--art-subtitle-bottom': string
@@ -42,4 +57,11 @@ export interface CssVar {
   '--art-scrollbar-background': string
   '--art-scrollbar-background-hover': string
   '--art-mini-progress-height': string
+  '--art-shadow-low': string
+  '--art-shadow-medium': string
+  '--art-shadow-high': string
+  '--art-shadow-elevated': string
+  '--art-icon-small-size': string
+  '--art-overlay-dim': string
+  '--art-overlay-strong': string
 }