feat(server+web+desktop): Phase 3.2-B Payple 결제 연동 + 대시보드 Premium 상태 표시

Payple PG 연동:
- _shared/payple.ts: Payple API 래퍼 (auth/billing/cancel/deleteBillingKey)
- payple-checkout Edge Function: 빌링키 결제 + 구독 활성화
- payple-webhook Edge Function: 결제완료/취소 이벤트
- payple-manage Edge Function: 구독 취소 (빌링키 해지)
- DB migration: payment_provider + payple_payer_id + payple_pay_oid
- 웹 billing 페이지: Payple JS SDK 결제창 + 관리 버튼 (Stripe 대체)
- Electron LicenseModal: shell.openExternal → 웹 결제 페이지

대시보드 Premium 상태:
- CrtDisplay services에 PREMIUM LLM LED 추가
- 백엔드 인디케이터 카드 (Local/Premium) + 티어 카드
- 사용량 섹션: 전 티어 표시 + 모델별 Premium 쿼터
- 12개 locale × 14개 i18n 키

apps/web/src/components/billing/payple-manage-button.tsx

@@ -0,0 +1,101 @@
+'use client'
+
+// apps/web/src/components/billing/payple-manage-button.tsx
+// Payple 구독 관리 — payple-manage Edge Function 호출 (구독 취소)
+
+import { useState } from 'react'
+import { Button, CircularProgress, Alert, Box, Dialog, DialogTitle, DialogContent, DialogContentText, DialogActions } from '@mui/material'
+import SettingsIcon from '@mui/icons-material/Settings'
+import { getSupabaseBrowserClient } from '@/lib/supabase-browser'
+
+export function PaypleManageButton(): React.ReactElement {
+  const [busy, setBusy] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+  const [confirmOpen, setConfirmOpen] = useState(false)
+  const [success, setSuccess] = useState(false)
+
+  async function handleCancel(): Promise<void> {
+    setConfirmOpen(false)
+    setError(null)
+    setBusy(true)
+    try {
+      const supabase = getSupabaseBrowserClient()
+      const { data: { session } } = await supabase.auth.getSession()
+
+      if (!session) {
+        setError('로그인이 필요합니다')
+        return
+      }
+
+      const response = await fetch(
+        `${process.env.NEXT_PUBLIC_SUPABASE_URL}/functions/v1/payple-manage`,
+        {
+          method: 'POST',
+          headers: {
+            Authorization: `Bearer ${session.access_token}`,
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({ action: 'cancel' }),
+        }
+      )
+
+      if (!response.ok) {
+        const txt = await response.text()
+        throw new Error(`구독 취소 실패: ${response.status} ${txt}`)
+      }
+
+      const data = await response.json() as { success?: boolean; cancel_at?: string }
+      if (data.success) {
+        setSuccess(true)
+        setTimeout(() => window.location.reload(), 2000)
+      }
+    } catch (e) {
+      setError(e instanceof Error ? e.message : '알 수 없는 오류')
+    } finally {
+      setBusy(false)
+    }
+  }
+
+  if (success) {
+    return (
+      <Alert severity="info" variant="outlined" sx={{ fontSize: 12 }}>
+        구독이 취소되었습니다. 현재 결제 기간이 끝날 때까지 이용 가능합니다.
+      </Alert>
+    )
+  }
+
+  return (
+    <Box>
+      <Button
+        variant="outlined"
+        size="small"
+        startIcon={busy ? <CircularProgress size={14} /> : <SettingsIcon />}
+        onClick={() => setConfirmOpen(true)}
+        disabled={busy}
+      >
+        구독 관리
+      </Button>
+
+      <Dialog open={confirmOpen} onClose={() => setConfirmOpen(false)}>
+        <DialogTitle>구독 취소</DialogTitle>
+        <DialogContent>
+          <DialogContentText>
+            정말 구독을 취소하시겠습니까? 현재 결제 기간이 끝날 때까지는 계속 이용할 수 있습니다.
+          </DialogContentText>
+        </DialogContent>
+        <DialogActions>
+          <Button onClick={() => setConfirmOpen(false)}>돌아가기</Button>
+          <Button onClick={() => void handleCancel()} color="error" variant="contained">
+            구독 취소
+          </Button>
+        </DialogActions>
+      </Dialog>
+
+      {error && (
+        <Alert severity="error" variant="outlined" sx={{ mt: 1, fontSize: 11 }}>
+          {error}
+        </Alert>
+      )}
+    </Box>
+  )
+}