feat(theme): glass.specular 토큰 추가 (커서 추종 빛 반사용)

RadTheme.glass에 specular(rgba) 토큰 추가 — 6개 테마 전부 톤 파생. TiltCard 스페큘러 하이라이트 색 SSOT (색은 토큰, 그라디언트 geometry는 컴포넌트가 소유해 커서가 하이라이트를 이동).

Co-Authored-By: Claude <noreply@anthropic.com>

packages/ui/src/theme.ts

@@ -80,6 +80,8 @@ interface RawTheme {
     borderGradient: string
     /** backdrop-filter blur 반경 */
     blur: string
+    /** 커서 추종 반사 하이라이트 색 (rgba) — 컴포넌트가 그라디언트 geometry 생성 */
+    specular: string
   }
   /** v2: 그라디언트 */
   gradient: {
@@ -137,6 +139,7 @@ const RAW: Record<ThemeKey, RawTheme> = {
       sheen: 'radial-gradient(ellipse 70% 55% at 18% -8%, rgba(59,130,246,0.14) 0%, transparent 55%), linear-gradient(180deg, rgba(148,180,255,0.05) 0%, rgba(148,180,255,0) 40%)',
       borderGradient: 'linear-gradient(135deg, rgba(125,180,255,0.55) 0%, rgba(148,180,255,0.14) 32%, rgba(148,180,255,0.06) 58%, rgba(59,130,246,0.22) 100%)',
       blur: '24px',
+      specular: 'rgba(180,205,255,0.22)',
     },
     gradient: {
       accent: 'linear-gradient(135deg, #1d4ed8 0%, #3b82f6 55%, #60a5fa 100%)',
@@ -177,6 +180,7 @@ const RAW: Record<ThemeKey, RawTheme> = {
       sheen: 'radial-gradient(ellipse 70% 55% at 18% -8%, rgba(37,99,235,0.08) 0%, transparent 55%), linear-gradient(180deg, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0) 42%)',
       borderGradient: 'linear-gradient(135deg, rgba(37,99,235,0.45) 0%, rgba(30,58,138,0.14) 32%, rgba(30,58,138,0.08) 58%, rgba(37,99,235,0.18) 100%)',
       blur: '24px',
+      specular: 'rgba(255,255,255,0.50)',
     },
     gradient: {
       accent: 'linear-gradient(135deg, #1d4ed8 0%, #2563eb 55%, #3b82f6 100%)',
@@ -217,6 +221,7 @@ const RAW: Record<ThemeKey, RawTheme> = {
       sheen: 'radial-gradient(ellipse 70% 55% at 18% -8%, rgba(136,192,208,0.14) 0%, transparent 55%), linear-gradient(180deg, rgba(216,222,233,0.05) 0%, rgba(216,222,233,0) 40%)',
       borderGradient: 'linear-gradient(135deg, rgba(160,205,220,0.55) 0%, rgba(216,222,233,0.14) 32%, rgba(216,222,233,0.06) 58%, rgba(136,192,208,0.22) 100%)',
       blur: '24px',
+      specular: 'rgba(200,225,235,0.22)',
     },
     gradient: {
       accent: 'linear-gradient(135deg, #5e81ac 0%, #81a1c1 55%, #88c0d0 100%)',
@@ -257,6 +262,7 @@ const RAW: Record<ThemeKey, RawTheme> = {
       sheen: 'radial-gradient(ellipse 70% 55% at 18% -8%, rgba(181,137,0,0.14) 0%, transparent 55%), linear-gradient(180deg, rgba(131,148,150,0.05) 0%, rgba(131,148,150,0) 40%)',
       borderGradient: 'linear-gradient(135deg, rgba(212,160,23,0.55) 0%, rgba(131,148,150,0.14) 32%, rgba(131,148,150,0.06) 58%, rgba(181,137,0,0.22) 100%)',
       blur: '24px',
+      specular: 'rgba(238,232,213,0.22)',
     },
     gradient: {
       accent: 'linear-gradient(135deg, #8a6800 0%, #b58900 55%, #d4a017 100%)',
@@ -297,6 +303,7 @@ const RAW: Record<ThemeKey, RawTheme> = {
       sheen: 'radial-gradient(ellipse 70% 55% at 18% -8%, rgba(203,166,247,0.14) 0%, transparent 55%), linear-gradient(180deg, rgba(205,214,244,0.05) 0%, rgba(205,214,244,0) 40%)',
       borderGradient: 'linear-gradient(135deg, rgba(215,185,255,0.55) 0%, rgba(205,214,244,0.14) 32%, rgba(205,214,244,0.06) 58%, rgba(203,166,247,0.22) 100%)',
       blur: '24px',
+      specular: 'rgba(205,214,244,0.22)',
     },
     gradient: {
       accent: 'linear-gradient(135deg, #a67fd4 0%, #cba6f7 55%, #f5c2e7 100%)',
@@ -337,6 +344,7 @@ const RAW: Record<ThemeKey, RawTheme> = {
       sheen: 'radial-gradient(ellipse 70% 55% at 18% -8%, rgba(189,147,249,0.14) 0%, transparent 55%), linear-gradient(180deg, rgba(248,248,242,0.05) 0%, rgba(248,248,242,0) 40%)',
       borderGradient: 'linear-gradient(135deg, rgba(205,170,255,0.55) 0%, rgba(248,248,242,0.14) 32%, rgba(248,248,242,0.06) 58%, rgba(189,147,249,0.22) 100%)',
       blur: '24px',
+      specular: 'rgba(248,248,242,0.22)',
     },
     gradient: {
       accent: 'linear-gradient(135deg, #9a70e0 0%, #bd93f9 55%, #ff79c6 100%)',
@@ -390,6 +398,7 @@ export const d3roPalette = {
     sheen: 'var(--d3-glass-sheen)',
     borderGradient: 'var(--d3-glass-borderGradient)',
     blur: 'var(--d3-glass-blur)',
+    specular: 'var(--d3-glass-specular)',
   },
   /** v2: 그라디언트 토큰 */
   gradient: {
@@ -578,6 +587,7 @@ function buildCssVars(key: ThemeKey): Record<string, string> {
     '--d3-glass-sheen': r.glass.sheen,
     '--d3-glass-borderGradient': r.glass.borderGradient,
     '--d3-glass-blur': r.glass.blur,
+    '--d3-glass-specular': r.glass.specular,
     '--d3-gradient-accent': r.gradient.accent,
     '--d3-gradient-logo': r.gradient.logo,
     '--d3-gradient-bar': r.gradient.bar,