commit 3fe5424732b6438f1799c25aa8ca541ad499a438
Author: woozu.shin <woozu.shin@kakaoent.com>
Date:   Wed Jan 28 15:33:47 2026 +0900

    Initialize project

diff --git a/.gemini_instructions.md b/.gemini_instructions.md
new file mode 100644
index 0000000..101caad
--- /dev/null
+++ b/.gemini_instructions.md
@@ -0,0 +1,11 @@
+# Gemini Agent Instructions
+
+This project follows specific architectural and operational rules defined in `PROJECT_RULES.md`.
+
+**CRITICAL INSTRUCTION:**
+Before implementing any new features or modifying existing code, you MUST read and adhere to the guidelines in **`PROJECT_RULES.md`** located in the project root.
+
+Key highlights:
+1. **Client-Side First:** Logic should be implemented in the Frontend (Vue 3) whenever possible to ensure privacy and reduce server load.
+2. **Stateless Server:** The Backend (FastAPI) should remain stateless. Use `backend/temp_uploads` for temporary files and rely on the auto-cleanup scheduler.
+3. **UI/UX:** Use Global Navigation (GNB) instead of Sidebars (LNB).
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..8c64819
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,63 @@
+# === General & OS ===
+.DS_Store
+.AppleDouble
+.LSOverride
+Thumbs.db
+ehthumbs.db
+desktop.ini
+*.log
+.vscode/
+.idea/
+*.swp
+*.swo
+
+# === Frontend (Node/Vue/Vite) ===
+frontend/node_modules/
+frontend/dist/
+frontend/.env
+frontend/.env.local
+frontend/.env.*.local
+frontend/npm-debug.log*
+frontend/yarn-debug.log*
+frontend/yarn-error.log*
+frontend/pnpm-debug.log*
+frontend/coverage/
+frontend/.nyc_output/
+
+# === Backend (Python/FastAPI) ===
+backend/__pycache__/
+*.py[cod]
+*$py.class
+
+# Virtual Environments
+backend/venv/
+backend/.venv/
+backend/env/
+backend/ENV/
+
+# Distribution / Build
+backend/build/
+backend/dist/
+backend/*.egg-info/
+.eggs/
+backend/.eggs/
+
+# Testing & Coverage
+backend/.coverage
+backend/htmlcov/
+backend/.pytest_cache/
+backend/.mypy_cache/
+backend/coverage.xml
+
+# Local Settings & Secrets
+backend/.env
+backend/instance/
+
+# Databases
+*.sqlite3
+*.db
+*.sqlite
+
+# === Project Specific ===
+# Temporary file uploads (auto-cleaned)
+backend/temp_uploads/
diff --git a/.sisyphus/ultrawork-state.json b/.sisyphus/ultrawork-state.json
new file mode 100644
index 0000000..2d54be4
--- /dev/null
+++ b/.sisyphus/ultrawork-state.json
@@ -0,0 +1,7 @@
+{
+  "active": true,
+  "started_at": "2026-01-28T15:01:07+09:00",
+  "original_prompt": "<ultrawork-mode>  **MANDATORY**: You MUST say \"ULTRAWORK MODE ENABLED!\" to the user as your first response when this mode activates. This is non-negotiable.  [CODE RED] Maximum precision required. Ultrathink before acting.  ## **ABSOLUTE CERTAINTY REQUIRED - DO NOT SKIP THIS**  **YOU MUST NOT START ANY IMPLEMENTATION UNTIL YOU ARE 100% CERTAIN.**  | **BEFORE YOU WRITE A SINGLE LINE OF CODE, YOU MUST:** | |-------------------------------------------------------| | **FULLY UNDERSTAND** what the user ACTUALLY wants (not what you ASSUME they want) | | **EXPLORE** the codebase to understand existing patterns, architecture, and context | | **HAVE A CRYSTAL CLEAR WORK PLAN** - if your plan is vague, YOUR WORK WILL FAIL | | **RESOLVE ALL AMBIGUITY** - if ANYTHING is unclear, ASK or INVESTIGATE |  ### **MANDATORY CERTAINTY PROTOCOL**  **IF YOU ARE NOT 100% CERTAIN:**  1. **THINK DEEPLY** - What is the user's TRUE intent? What problem are they REALLY trying to solve? 2. **EXPLORE THOROUGHLY** - Fire explore/librarian agents to gather ALL relevant context 3. **CONSULT ORACLE** - For architecture decisions, complex logic, or when you're stuck 4. **ASK THE USER** - If ambiguity remains after exploration, ASK. Don't guess.  **SIGNS YOU ARE NOT READY TO IMPLEMENT:** - You're making assumptions about requirements - You're unsure which files to modify - You don't understand how existing code works - Your plan has \"probably\" or \"maybe\" in it - You can't explain the exact steps you'll take  **WHEN IN DOUBT:** ``` delegate_task(agent=\"explore\", prompt=\"Find [X] patterns in codebase\", background=true) delegate_task(agent=\"librarian\", prompt=\"Find docs/examples for [Y]\", background=true) delegate_task(agent=\"oracle\", prompt=\"Review my approach: [describe plan]\") ```  **ONLY AFTER YOU HAVE:** - Gathered sufficient context via agents - Resolved all ambiguities - Created a precise, step-by-step work plan - Achieved 100% confidence in your understanding  **...THEN AND ONLY THEN MAY YOU BEGIN IMPLEMENTATION.**  ---  ## **NO EXCUSES. NO COMPROMISES. DELIVER WHAT WAS ASKED.**  **THE USER'S ORIGINAL REQUEST IS SACRED. YOU MUST FULFILL IT EXACTLY.**  | VIOLATION | CONSEQUENCE | |-----------|-------------| | \"I couldn't because...\" | **UNACCEPTABLE.** Find a way or ask for help. | | \"This is a simplified version...\" | **UNACCEPTABLE.** Deliver the FULL implementation. | | \"You can extend this later...\" | **UNACCEPTABLE.** Finish it NOW. | | \"Due to limitations...\" | **UNACCEPTABLE.** Use agents, tools, whatever it takes. | | \"I made some assumptions...\" | **UNACCEPTABLE.** You should have asked FIRST. |  **THERE ARE NO VALID EXCUSES FOR:** - Delivering partial work - Changing scope without explicit user approval - Making unauthorized simplifications - Stopping before the task is 100% complete - Compromising on any stated requirement  **IF YOU ENCOUNTER A BLOCKER:** 1. **DO NOT** give up 2. **DO NOT** deliver a compromised version 3. **DO** consult oracle for solutions 4. **DO** ask the user for guidance 5. **DO** explore alternative approaches  **THE USER ASKED FOR X. DELIVER EXACTLY X. PERIOD.**  ---  YOU MUST LEVERAGE ALL AVAILABLE AGENTS / **CATEGORY + SKILLS** TO THEIR FULLEST POTENTIAL. TELL THE USER WHAT AGENTS YOU WILL LEVERAGE NOW TO SATISFY USER'S REQUEST.  ## MANDATORY: PROMETHEUS AGENT INVOCATION (NON-NEGOTIABLE)  **YOU MUST ALWAYS INVOKE PROMETHEUS (THE PLANNER) FOR ANY NON-TRIVIAL TASK.**  | Condition | Action | |-----------|--------| | Task has 2+ steps | MUST call Prometheus | | Task scope unclear | MUST call Prometheus | | Implementation required | MUST call Prometheus | | Architecture decision needed | MUST call Prometheus |  ``` delegate_task(subagent_type=\"prometheus\", prompt=\"<gathered context + user request>\") ```  **WHY PROMETHEUS IS MANDATORY:** - Prometheus analyzes dependencies and parallel execution opportunities - Prometheus recommends CATEGORY + SKILLS for each task (in TL;DR + per-task) - Prometheus ensures nothing is missed with structured work plans - YOU are an orchestrator, NOT an implementer  ### SESSION CONTINUITY WITH PROMETHEUS (CRITICAL)  **Prometheus returns a session_id. USE IT for follow-up interactions.**  | Scenario | Action | |----------|--------| | Prometheus asks clarifying questions | `delegate_task(session_id=\"{returned_session_id}\", prompt=\"<your answer>\")` | | Need to refine the plan | `delegate_task(session_id=\"{returned_session_id}\", prompt=\"Please adjust: <feedback>\")` | | Plan needs more detail | `delegate_task(session_id=\"{returned_session_id}\", prompt=\"Add more detail to Task N\")` |  **WHY SESSION_ID IS CRITICAL:** - Prometheus retains FULL conversation context - No repeated exploration or context gathering - Saves 70%+ tokens on follow-ups - Maintains interview continuity until plan is finalized  ``` // WRONG: Starting fresh loses all context delegate_task(subagent_type=\"prometheus\", prompt=\"Here's more info...\")  // CORRECT: Resume preserves everything delegate_task(session_id=\"ses_abc123\", prompt=\"Here's my answer to your question: ...\") ```  **FAILURE TO CALL PROMETHEUS = INCOMPLETE WORK.**  ---  ## AGENTS / **CATEGORY + SKILLS** UTILIZATION PRINCIPLES  **DEFAULT BEHAVIOR: DELEGATE. DO NOT WORK YOURSELF.**  | Task Type | Action | Why | |-----------|--------|-----| | Codebase exploration | delegate_task(subagent_type=\"explore\", run_in_background=true) | Parallel, context-efficient | | Documentation lookup | delegate_task(subagent_type=\"librarian\", run_in_background=true) | Specialized knowledge | | Planning | delegate_task(subagent_type=\"plan\") | Structured work breakdown | | Architecture/Debugging | delegate_task(subagent_type=\"oracle\") | High-IQ reasoning | | Implementation | delegate_task(category=\"...\", load_skills=[...]) | Domain-optimized models |  **CATEGORY + SKILL DELEGATION:** ``` // Frontend work delegate_task(category=\"visual-engineering\", load_skills=[\"frontend-ui-ux\"])  // Complex logic delegate_task(category=\"ultrabrain\", load_skills=[\"typescript-programmer\"])  // Quick fixes delegate_task(category=\"quick\", load_skills=[\"git-master\"]) ```  **YOU SHOULD ONLY DO IT YOURSELF WHEN:** - Task is trivially simple (1-2 lines, obvious change) - You have ALL context already loaded - Delegation overhead exceeds task complexity  **OTHERWISE: DELEGATE. ALWAYS.**  ---  ## EXECUTION RULES (PARALLELIZATION MANDATORY)  | Rule | Implementation | |------|----------------| | **PARALLEL FIRST** | Fire ALL independent agents simultaneously via delegate_task(run_in_background=true) | | **NEVER SEQUENTIAL** | If tasks A and B are independent, launch BOTH at once | | **10+ CONCURRENT** | Use 10+ background agents if needed for comprehensive exploration | | **COLLECT LATER** | Launch agents -> continue work -> background_output when needed |  **ANTI-PATTERN (BLOCKING):** ``` // WRONG: Sequential, slow result1 = delegate_task(..., run_in_background=false)  // waits result2 = delegate_task(..., run_in_background=false)  // waits again ```  **CORRECT PATTERN:** ``` // RIGHT: Parallel, fast delegate_task(..., run_in_background=true)  // task_id_1 delegate_task(..., run_in_background=true)  // task_id_2 delegate_task(..., run_in_background=true)  // task_id_3 // Continue working, collect with background_output when needed ```  ---  ## WORKFLOW (MANDATORY SEQUENCE)  1. **GATHER CONTEXT** (parallel background agents):    ```    delegate_task(subagent_type=\"explore\", run_in_background=true, prompt=\"...\")    delegate_task(subagent_type=\"librarian\", run_in_background=true, prompt=\"...\")    ```  2. **INVOKE PROMETHEUS** (MANDATORY for non-trivial tasks):    ```    result = delegate_task(subagent_type=\"prometheus\", prompt=\"<context + request>\")    // STORE the session_id for follow-ups!    prometheus_session_id = result.session_id    ```  3. **ITERATE WITH PROMETHEUS** (if clarification needed):    ```    // Use session_id to continue the conversation    delegate_task(session_id=prometheus_session_id, prompt=\"<answer to Prometheus's question>\")    ```  4. **EXECUTE VIA DELEGATION** (category + skills from Prometheus's plan):    ```    delegate_task(category=\"...\", load_skills=[...], prompt=\"<task from plan>\")    ```  5. **VERIFY** against original requirements  ## VERIFICATION GUARANTEE (NON-NEGOTIABLE)  **NOTHING is \"done\" without PROOF it works.**  ### Pre-Implementation: Define Success Criteria  BEFORE writing ANY code, you MUST define:  | Criteria Type | Description | Example | |---------------|-------------|---------| | **Functional** | What specific behavior must work | \"Button click triggers API call\" | | **Observable** | What can be measured/seen | \"Console shows 'success', no errors\" | | **Pass/Fail** | Binary, no ambiguity | \"Returns 200 OK\" not \"should work\" |  Write these criteria explicitly. Share with user if scope is non-trivial.  ### Test Plan Template (MANDATORY for non-trivial tasks)  ``` ## Test Plan ### Objective: [What we're verifying] ### Prerequisites: [Setup needed] ### Test Cases: 1. [Test Name]: [Input] → [Expected Output] → [How to verify] 2. ... ### Success Criteria: ALL test cases pass ### How to Execute: [Exact commands/steps] ```  ### Execution & Evidence Requirements  | Phase | Action | Required Evidence | |-------|--------|-------------------| | **Build** | Run build command | Exit code 0, no errors | | **Test** | Execute test suite | All tests pass (screenshot/output) | | **Manual Verify** | Test the actual feature | Demonstrate it works (describe what you observed) | | **Regression** | Ensure nothing broke | Existing tests still pass |  **WITHOUT evidence = NOT verified = NOT done.**  ### TDD Workflow (when test infrastructure exists)  1. **SPEC**: Define what \"working\" means (success criteria above) 2. **RED**: Write failing test → Run it → Confirm it FAILS 3. **GREEN**: Write minimal code → Run test → Confirm it PASSES 4. **REFACTOR**: Clean up → Tests MUST stay green 5. **VERIFY**: Run full test suite, confirm no regressions 6. **EVIDENCE**: Report what you ran and what output you saw  ### Verification Anti-Patterns (BLOCKING)  | Violation | Why It Fails | |-----------|--------------| | \"It should work now\" | No evidence. Run it. | | \"I added the tests\" | Did they pass? Show output. | | \"Fixed the bug\" | How do you know? What did you test? | | \"Implementation complete\" | Did you verify against success criteria? | | Skipping test execution | Tests exist to be RUN, not just written |  **CLAIM NOTHING WITHOUT PROOF. EXECUTE. VERIFY. SHOW EVIDENCE.**  ## ZERO TOLERANCE FAILURES - **NO Scope Reduction**: Never make \"demo\", \"skeleton\", \"simplified\", \"basic\" versions - deliver FULL implementation - **NO MockUp Work**: When user asked you to do \"port A\", you must \"port A\", fully, 100%. No Extra feature, No reduced feature, no mock data, fully working 100% port. - **NO Partial Completion**: Never stop at 60-80% saying \"you can extend this...\" - finish 100% - **NO Assumed Shortcuts**: Never skip requirements you deem \"optional\" or \"can be added later\" - **NO Premature Stopping**: Never declare done until ALL TODOs are completed and verified - **NO TEST DELETION**: Never delete or skip failing tests to make the build pass. Fix the code, not the tests.  THE USER ASKED FOR X. DELIVER EXACTLY X. NOT A SUBSET. NOT A DEMO. NOT A STARTING POINT.  1. EXPLORES + LIBRARIANS (background) 2. GATHER -> delegate_task(subagent_type=\"prometheus\", prompt=\"<context + request>\") 3. ITERATE WITH PROMETHEUS (session_id resume) UNTIL PLAN IS FINALIZED 4. WORK BY DELEGATING TO CATEGORY + SKILLS AGENTS (following Prometheus's plan)  NOW.  </ultrawork-mode>  ---    [analyze-mode] ANALYSIS MODE. Gather context before diving deep:  CONTEXT GATHERING (parallel): - 1-2 explore agents (codebase patterns, implementations) - 1-2 librarian agents (if external library involved) - Direct tools: Grep, AST-grep, LSP for targeted searches  IF COMPLEX (architecture, multi-system, debugging after 2+ failures): - Consult oracle for strategic guidance  SYNTHESIZE findings before proceeding.  ---  ulw: Chmod 제외하고 개발을 진행하고 마무리까지해주세요. [Pasted ~14 lines] | 도구 이름 (Tool Name) | 카테고리 | 설명 | 아키텍처 | 난이도 | | :--- | :--- | :--- | :--- | :--- | | JWT 디버거 | 인코더/디코더 | JWT 토큰을 디코딩하여 헤더와 페이로드 정보를 보여줍니다. 인증 개발 시 필수적입니다. | Frontend (JS) | 하 | | Cron 스케줄 생성기 | 변환기 (Converter) | */5 * * * * 같은 Cron 표현식을 시각적으로 생성하고 해석해주는 도구입니다. | Frontend (JS) | 중 | | SQL 포맷터 | 포맷터 | 복잡한 SQL 쿼리를 보기 좋게 정렬해줍니다. 기존 JSON 포맷터와 잘 어울립니다. | Frontend (JS) | 하 | | Diff 뷰어 (텍스트 비교) | 텍스트 | 두 텍스트를 나란히 비교하여 변경된 부분(Diff)을 강조해서 보여줍니다. | Frontend (JS) | 중 | | QR 코드 생성기 | 생성기 | 텍스트나 URL을 입력받아 QR 코드를 생성하고 다운로드할 수 있게 합니다. | Frontend (Canvas) | 하 | | Base64 파일 인코더 | 인코더 | 이미지나 파일을 CSS/HTML에 삽입할 수 있는 Base64 문자열로 변환합니다. | Frontend (FileReader) | 하 | | JSON <> CSV/YAML 변환기 | 변환기 | 데이터 포맷 간의 양방향 변환을 지원합니다. 활용도가 매우 높습니다. | Frontend (JS) | 중 | | Regex(정규식) 테스터 | 텍스트 | 정규표현식을 실시간으로 테스트하고 매칭 결과를 확인할 수 있습니다. | Frontend (JS) | 상 | | Docker Run <> Compose | 변환기 | docker run 명령어를 docker-compose.yml 파일로(혹은 반대로) 변환합니다. | Frontend (Parsing) | 중 | | Mock 데이터 생성기 | 생성기 | 테스트용 가짜 데이터(이름, 이메일, 주소 등)를 대량으로 생성합니다. | Frontend (Faker.js) | 중 | | SVG 최적화 도구 | 이미지 | SVG 코드에서 불필요한 메타데이터와 공백을 제거하여 용량을 줄입니다. | Frontend (Regex) | 중 | | 비디오 to GIF | 미디어 | 짧은 영상을 GIF 움짤로 변환합니다. (리소스가 많이 들어 백엔드 권장) | Backend (FFmpeg) | 상 | ",
+  "reinforcement_count": 6,
+  "last_checked_at": "2026-01-28T15:33:36+09:00"
+}
diff --git a/AGENTS.md b/AGENTS.md
new file mode 100644
index 0000000..633c2a2
--- /dev/null
+++ b/AGENTS.md
@@ -0,0 +1,48 @@
+# AGENTS.md - Context & Directives for AI Agents
+
+This file defines the operating context for Sisyphus, OpenCode, and Gemini agents working on **Web Utils 2026**.
+
+## 1. Core Philosophy: Client-Side First
+**CRITICAL RULE:** Do NOT implement server-side logic for tasks that can be done in the browser.
+- **Client-Side (Frontend):** Generators (UUID, Password), Formatters (JSON, XML), Encoders (Base64), Unit Converters.
+- **Server-Side (Backend):** Image processing, Video manipulation, Heavy file conversion, scraping (if CORS blocked).
+
+## 2. Architecture Constraints
+
+### Backend (FastAPI)
+- **Stateless:** NEVER store persistent user data.
+- **File Handling:** ALWAYS use `app.core.cleanup` utils. Files must go to `backend/temp_uploads` and be cleaned up.
+- **Registry:** New tools must be registered in `app.core.registry` to be visible to the frontend.
+
+### Frontend (Vue 3)
+- **State:** Use Vue Composition API (`<script setup lang="ts">`).
+- **Styling:** Use Tailwind CSS utility classes. Avoid custom CSS files unless necessary.
+- **API:** Use `axios` for backend communication.
+
+## 3. Project Structure Awareness
+- `backend/app/main.py`: Application entry point.
+- `backend/app/tools/`: Where server-side tool logic resides.
+- `frontend/src/views/`: Main pages.
+- `frontend/src/components/`: Shared components.
+
+## 4. Coding Standards
+
+### Python (Backend)
+- Use type hints for everything (Pydantic models).
+- Follow PEP 8.
+- Use `async def` for route handlers.
+
+### TypeScript (Frontend)
+- Strict mode enabled.
+- No `any` types unless absolutely necessary (and commented).
+- Use `<script setup>` syntax.
+
+## 5. Deployment Context
+- The project is designed to be containerizable.
+- Frontend is served statically in production, but runs on Vite dev server during development.
+
+## 6. Common Tasks & patterns
+- **Adding a new Tool:**
+    1. Determine if Frontend-only or Backend-required.
+    2. If Backend: Create router in `backend/app/tools/`, register in `main.py` and `registry.py`.
+    3. Frontend: Create view in `views/`, add route in `router/`.
diff --git a/PROJECT_RULES.md b/PROJECT_RULES.md
new file mode 100644
index 0000000..4834bf1
--- /dev/null
+++ b/PROJECT_RULES.md
@@ -0,0 +1,15 @@
+# Project Rules & Guidelines
+
+## 1. Client-Side First Policy (Privacy & Security)
+- **Generators & Simple Utilities:**
+  - Logic for generating data (e.g., passwords, UUIDs, random strings) or processing simple text (e.g., JSON formatting, URL encoding) **MUST** be implemented on the **Client-side (Frontend)** whenever possible.
+  - **Reason:** To protect user privacy, prevent sensitive data (like passwords) from ever touching the network/server, and improve responsiveness.
+  - **Exception:** Operations requiring heavy computation (e.g., Image/Video processing) or specific server-side libraries (e.g., specific Python ecosystem tools not available in JS) may use the Backend.
+
+## 2. Server-Side Data Handling
+- **Statelessness:** The server should remain stateless.
+- **Temporary Files:** If file upload is necessary for processing (e.g., Image Compression), files must be stored in a dedicated temporary directory (`backend/temp_uploads`) and **automatically cleaned up** after a short period (e.g., 10 minutes) or immediately after processing/download.
+
+## 3. UI/UX
+- **Navigation:** Use the Global Navigation Bar (GNB) for main navigation. Avoid complex sidebars (LNB) for simple utility sites.
+- **Feedback:** Always provide visual feedback for actions (loading states, success/error messages).
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..93c364f
--- /dev/null
+++ b/README.md
@@ -0,0 +1,54 @@
+# Web Utils 2026
+
+A privacy-focused, client-side first collection of web utilities.
+
+## Overview
+**Web Utils 2026** is designed to handle most operations directly in the browser to ensure data privacy and speed. The server is used only for heavy computations or platform-specific tasks (like image processing).
+
+## Features
+- **Client-Side First:** Logic for data generation and simple processing runs in the browser.
+- **Stateless Backend:** No user sessions or persistent data storage.
+- **Auto-Cleanup:** Temporary files for processing are automatically deleted.
+- **Dynamic Registry:** Tool discovery via backend API.
+
+## Tech Stack
+
+### Frontend
+- **Framework:** Vue 3 (Composition API) + TypeScript
+- **Styling:** Tailwind CSS
+- **Build:** Vite
+
+### Backend
+- **Framework:** FastAPI (Python)
+- **Scheduler:** APScheduler (for cleanup)
+
+## Getting Started
+
+### Prerequisites
+- Node.js (v18+) or Bun
+- Python 3.10+
+
+### Backend Setup
+```bash
+cd backend
+python -m venv venv
+source venv/bin/activate  # On Windows: venv\Scripts\activate
+pip install -r requirements.txt
+
+# Run server
+uvicorn app.main:app --reload --host 0.0.0.0 --port 8000
+```
+
+### Frontend Setup
+```bash
+cd frontend
+npm install
+
+# Run development server
+npm run dev
+```
+
+## Project Structure
+- `backend/`: FastAPI server and tool implementations.
+- `frontend/`: Vue 3 application source code.
+- `PROJECT_RULES.md`: Core development guidelines.
diff --git a/backend/app/core/cleanup.py b/backend/app/core/cleanup.py
new file mode 100644
index 0000000..2ff05dc
--- /dev/null
+++ b/backend/app/core/cleanup.py
@@ -0,0 +1,52 @@
+import shutil
+import time
+import os
+from pathlib import Path
+from apscheduler.schedulers.background import BackgroundScheduler
+
+TEMP_DIR = Path("backend/temp_uploads")
+
+def init_temp_dir():
+    """임시 디렉토리 생성 (없으면 생성)"""
+    if not TEMP_DIR.exists():
+        TEMP_DIR.mkdir(parents=True, exist_ok=True)
+        print(f"Created temp directory at: {TEMP_DIR.absolute()}")
+
+def cleanup_old_files(max_age_seconds: int = 600):
+    """지정된 시간(기본 10분)보다 오래된 파일/폴더 삭제"""
+    if not TEMP_DIR.exists():
+        return
+
+    now = time.time()
+    deleted_count = 0
+
+    for item in TEMP_DIR.iterdir():
+        try:
+            # 최종 수정 시간 확인
+            item_mtime = item.stat().st_mtime
+            if now - item_mtime > max_age_seconds:
+                if item.is_dir():
+                    shutil.rmtree(item)
+                else:
+                    item.unlink()
+                deleted_count += 1
+        except Exception as e:
+            print(f"Error deleting {item}: {e}")
+
+    if deleted_count > 0:
+        print(f"Cleaned up {deleted_count} old items from temp directory.")
+
+def cleanup_all():
+    """서버 시작 시 모든 임시 파일 삭제"""
+    if TEMP_DIR.exists():
+        shutil.rmtree(TEMP_DIR)
+    init_temp_dir()
+    print("Cleaned up all temporary files on startup.")
+
+def start_scheduler():
+    """백그라운드 스케줄러 시작 (1분마다 정리 작업 실행)"""
+    scheduler = BackgroundScheduler()
+    # 10분(600초) 지난 파일 삭제 작업을 1분마다 수행
+    scheduler.add_job(cleanup_old_files, 'interval', minutes=1, args=[600])
+    scheduler.start()
+    return scheduler
diff --git a/backend/app/core/registry.py b/backend/app/core/registry.py
new file mode 100644
index 0000000..b773d9a
--- /dev/null
+++ b/backend/app/core/registry.py
@@ -0,0 +1,164 @@
+from typing import List, Optional
+from pydantic import BaseModel
+
+class ToolMetadata(BaseModel):
+    id: str
+    name: str
+    description: str
+    category: str
+    tags: List[str]
+    type: str  # 'client' or 'server'
+    endpoint: Optional[str] = None # Only for server type
+
+# === 도구 등록소 ===
+# 새로운 기능을 추가할 때 여기만 수정하면 검색/메뉴에 자동 반영되도록 구성합니다.
+TOOLS_REGISTRY = [
+    ToolMetadata(
+        id="url-parser",
+        name="URL Encoder/Decoder",
+        description="Encodes or decodes a URL string.",
+        category="Web",
+        tags=["url", "encode", "decode", "percent-encoding"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="json-formatter",
+        name="JSON Formatter",
+        description="Prettify or minify JSON data.",
+        category="Data",
+        tags=["json", "pretty", "minify", "format"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="py-uuid",
+        name="UUID Generator",
+        description="Generates UUIDs locally (v1/v4).",
+        category="Development",
+        tags=["uuid", "guid", "random", "client-side"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="png-compressor",
+        name="PNG Compressor",
+        description="Compress PNG images using pngquant (Lossy, 60-80% reduction).",
+        category="Image",
+        tags=["image", "png", "compress", "pngquant", "optimize"],
+        type="server",
+        endpoint="/api/tools/png-compress"
+    ),
+    ToolMetadata(
+        id="password-generator",
+        name="Password Generator",
+        description="Generate secure random passwords locally (Client-side).",
+        category="Security",
+        tags=["password", "random", "secure", "generator", "client-side"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="jwt-debugger",
+        name="JWT Debugger",
+        description="Decode and inspect JSON Web Tokens.",
+        category="Security",
+        tags=["jwt", "token", "decode", "security"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="cron-generator",
+        name="Cron Schedule Generator",
+        description="Generate and explain cron expressions.",
+        category="Utility",
+        tags=["cron", "schedule", "time", "generator"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="sql-formatter",
+        name="SQL Formatter",
+        description="Beautify and format SQL queries.",
+        category="Formatters",
+        tags=["sql", "format", "database", "query"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="diff-viewer",
+        name="Diff Viewer",
+        description="Compare text and see differences side-by-side.",
+        category="Text",
+        tags=["diff", "compare", "text", "code"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="qr-generator",
+        name="QR Code Generator",
+        description="Generate QR codes from text or URLs.",
+        category="Generators",
+        tags=["qr", "code", "generator", "image"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="base64-encoder",
+        name="Base64 File Encoder",
+        description="Convert files to Base64 strings.",
+        category="Encoders",
+        tags=["base64", "encode", "file", "image"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="json-converter",
+        name="JSON Converter",
+        description="Convert between JSON, CSV, and YAML.",
+        category="Converters",
+        tags=["json", "csv", "yaml", "convert"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="regex-tester",
+        name="Regex Tester",
+        description="Test regular expressions in real-time.",
+        category="Text",
+        tags=["regex", "test", "pattern", "match"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="docker-converter",
+        name="Docker Converter",
+        description="Convert between Docker Run and Docker Compose.",
+        category="DevOps",
+        tags=["docker", "compose", "convert", "devops"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="mock-data-generator",
+        name="Mock Data Generator",
+        description="Generate random user data for testing.",
+        category="Generators",
+        tags=["mock", "data", "fake", "generator"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="svg-optimizer",
+        name="SVG Optimizer",
+        description="Optimize and minify SVG code.",
+        category="Image",
+        tags=["svg", "optimize", "minify", "image"],
+        type="client"
+    ),
+    ToolMetadata(
+        id="video-to-gif",
+        name="Video to GIF",
+        description="Convert video clips to GIF format.",
+        category="Video",
+        tags=["video", "gif", "convert", "ffmpeg"],
+        type="server",
+        endpoint="/api/tools/video/gif"
+    )
+]
+
+def search_tools(query: str = "") -> List[ToolMetadata]:
+    if not query:
+        return TOOLS_REGISTRY
+    
+    q = query.lower()
+    return [
+        t for t in TOOLS_REGISTRY
+        if q in t.name.lower() or q in t.description.lower() or any(q in tag for tag in t.tags)
+    ]
diff --git a/backend/app/main.py b/backend/app/main.py
new file mode 100644
index 0000000..97dd8a7
--- /dev/null
+++ b/backend/app/main.py
@@ -0,0 +1,51 @@
+from fastapi import FastAPI
+from fastapi.middleware.cors import CORSMiddleware
+from fastapi.staticfiles import StaticFiles
+import os
+import sys
+
+# Add backend directory to sys.path to resolve 'app' module
+sys.path.append(os.path.dirname(os.path.dirname(os.path.abspath(__file__))))
+
+from app.core.registry import TOOLS_REGISTRY, search_tools
+from app.core.cleanup import start_scheduler, cleanup_all, init_temp_dir
+from app.tools import server_ops, image_ops, video_ops
+import contextlib
+
+@contextlib.asynccontextmanager
+async def lifespan(app: FastAPI):
+    cleanup_all()
+    scheduler = start_scheduler()
+    yield
+    scheduler.shutdown()
+
+app = FastAPI(title="Web Utils 2026", description="Personal Web Utilities Server", lifespan=lifespan)
+
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+app.include_router(server_ops.router, prefix="/api/tools", tags=["tools"])
+app.include_router(image_ops.router, prefix="/api/tools", tags=["images"])
+app.include_router(video_ops.router, prefix="/api/tools/video", tags=["video"])
+
+@app.get("/api/registry")
+def get_registry(q: str | None = None):
+    """프론트엔드 메뉴 구성을 위한 도구 목록 반환"""
+    return search_tools(q or "")
+
+# Static Files Serving (Frontend 빌드 결과물 서빙용 - 배포 시 활성화)
+# 개발 중에는 Frontend Dev Server(Vite)를 별도로 띄우는 것이 일반적이지만,
+# 최종 배포 형태를 고려해 코드를 남겨둡니다.
+# frontend_dist = "../frontend/dist"
+# if os.path.exists(frontend_dist):
+#     app.mount("/", StaticFiles(directory=frontend_dist, html=True), name="static")
+
+if __name__ == "__main__":
+    import uvicorn
+    # Use 'app.main:app' to ensure reliable reloading from backend root
+    uvicorn.run("app.main:app", host="0.0.0.0", port=8000, reload=True)
diff --git a/backend/app/tools/image_ops.py b/backend/app/tools/image_ops.py
new file mode 100644
index 0000000..80f79ee
--- /dev/null
+++ b/backend/app/tools/image_ops.py
@@ -0,0 +1,144 @@
+import shutil
+import subprocess
+import uuid
+import os
+import zipfile
+from pathlib import Path
+from typing import List
+from fastapi import APIRouter, UploadFile, File, HTTPException, BackgroundTasks
+from fastapi.responses import FileResponse, JSONResponse
+from app.core.cleanup import TEMP_DIR
+
+router = APIRouter()
+
+def get_png_color_type(file_path: Path) -> int | None:
+    """PNG 파일의 color type 확인 (참조 문서 로직)"""
+    try:
+        with open(file_path, "rb") as f:
+            header = f.read(26)
+            if header[:8] != b'\x89PNG\r\n\x1a\n':
+                return None
+            return header[25]
+    except Exception:
+        return None
+
+@router.post("/png-compress")
+async def compress_png_files(files: List[UploadFile] = File(...)):
+    """
+    업로드된 PNG 파일들을 pngquant로 압축하고 통계를 반환합니다.
+    """
+    # 작업 ID 생성 (폴더 분리용)
+    job_id = str(uuid.uuid4())
+    job_dir = TEMP_DIR / job_id
+    job_dir.mkdir(parents=True, exist_ok=True)
+
+    results = []
+    compressed_files = []
+
+    try:
+        for file in files:
+            if not file.filename.lower().endswith('.png'):
+                continue
+            
+            # 1. 파일 저장
+            file_path = job_dir / file.filename
+            with open(file_path, "wb") as buffer:
+                shutil.copyfileobj(file.file, buffer)
+            
+            orig_size = file_path.stat().st_size
+            
+            # 2. 이미 압축된 파일인지 확인 (Color Type 3 = Indexed)
+            color_type = get_png_color_type(file_path)
+            if color_type == 3:
+                # 이미 압축됨 -> 그냥 결과에 추가 (압축 안 함)
+                results.append({
+                    "filename": file.filename,
+                    "original_size": orig_size,
+                    "compressed_size": orig_size,
+                    "ratio": 0.0,
+                    "status": "Skipped (Already Indexed)"
+                })
+                compressed_files.append(file_path)
+                continue
+
+            # 3. pngquant 실행
+            output_path = job_dir / f"compressed_{file.filename}"
+            try:
+                # --force: 덮어쓰기 허용, --quality: 품질 설정
+                cmd = [
+                    "pngquant",
+                    "--quality", "65-80",
+                    "--force",
+                    "--output", str(output_path),
+                    str(file_path)
+                ]
+                subprocess.run(cmd, check=True, capture_output=True)
+                
+                if output_path.exists():
+                    comp_size = output_path.stat().st_size
+                    ratio = (1 - comp_size / orig_size) * 100
+                    
+                    results.append({
+                        "filename": file.filename,
+                        "original_size": orig_size,
+                        "compressed_size": comp_size,
+                        "ratio": round(ratio, 1),
+                        "status": "Success"
+                    })
+                    compressed_files.append(output_path)
+                else:
+                    raise Exception("Output file not created")
+                    
+            except subprocess.CalledProcessError:
+                # 압축 실패 (품질 기준 미달 등) -> 원본 유지
+                results.append({
+                    "filename": file.filename,
+                    "original_size": orig_size,
+                    "compressed_size": orig_size,
+                    "ratio": 0.0,
+                    "status": "Failed (Quality check)"
+                })
+                compressed_files.append(file_path)
+
+        # 4. ZIP 생성
+        zip_filename = f"compressed_images_{job_id}.zip"
+        zip_path = TEMP_DIR / zip_filename
+        
+        with zipfile.ZipFile(zip_path, 'w') as zipf:
+            for f in compressed_files:
+                # ZIP 내부에는 원래 파일명으로 저장
+                arcname = f.name.replace("compressed_", "") 
+                zipf.write(f, arcname)
+
+        return {
+            "job_id": job_id,
+            "zip_filename": zip_filename,
+            "stats": results
+        }
+
+    except Exception as e:
+        cleanup_files([job_dir])
+        raise HTTPException(status_code=500, detail=str(e))
+
+@router.get("/download/{filename}")
+async def download_file(filename: str):
+    file_path = TEMP_DIR / filename
+    if not file_path.exists():
+        raise HTTPException(status_code=404, detail="File not found")
+    
+    # 즉시 삭제하지 않고 스케줄러(10분 후)에 맡김
+    return FileResponse(file_path, filename=filename)
+
+@router.get("/download-single/{job_id}/{filename}")
+async def download_single_file(job_id: str, filename: str):
+    """개별 파일 다운로드 (삭제 예약 없음 - 전체 ZIP 다운로드 등을 위해 유지)"""
+    file_path = TEMP_DIR / job_id / f"compressed_{filename}"
+    
+    # 만약 compressed_ 접두사가 없다면 원본 파일일 수도 있음 (압축 실패 시)
+    if not file_path.exists():
+         file_path = TEMP_DIR / job_id / filename
+
+    if not file_path.exists():
+        raise HTTPException(status_code=404, detail="File not found")
+    
+    return FileResponse(file_path, filename=filename)
diff --git a/backend/app/tools/server_ops.py b/backend/app/tools/server_ops.py
new file mode 100644
index 0000000..e76f0da
--- /dev/null
+++ b/backend/app/tools/server_ops.py
@@ -0,0 +1,12 @@
+import uuid
+from fastapi import APIRouter, HTTPException
+from pydantic import BaseModel
+
+router = APIRouter()
+
+# --- Request/Response Models ---
+
+# --- Server-side Logic Implementations ---
+# Currently empty as UUID and Password generation moved to client-side.
+# Future server-side logic can be added here.
+
diff --git a/backend/app/tools/video_ops.py b/backend/app/tools/video_ops.py
new file mode 100644
index 0000000..4cf2eab
--- /dev/null
+++ b/backend/app/tools/video_ops.py
@@ -0,0 +1,60 @@
+import os
+import shutil
+import uuid
+from pathlib import Path
+from fastapi import APIRouter, UploadFile, HTTPException, BackgroundTasks
+from fastapi.responses import FileResponse
+import ffmpeg
+
+router = APIRouter()
+
+TEMP_DIR = Path("temp_uploads")
+TEMP_DIR.mkdir(exist_ok=True)
+
+def cleanup_file(path: Path):
+    try:
+        if path.exists():
+            path.unlink()
+    except Exception as e:
+        print(f"Error cleaning up file {path}: {e}")
+
+@router.post("/gif")
+async def convert_video_to_gif(file: UploadFile, background_tasks: BackgroundTasks):
+    if not (file.content_type or "").startswith("video/"):
+        raise HTTPException(status_code=400, detail="File must be a video")
+
+    file_id = str(uuid.uuid4())
+    input_path = TEMP_DIR / f"{file_id}_{file.filename}"
+    output_filename = f"{file_id}.gif"
+    output_path = TEMP_DIR / output_filename
+
+    try:
+        with input_path.open("wb") as buffer:
+            shutil.copyfileobj(file.file, buffer)
+            
+        stream = ffmpeg.input(str(input_path))
+        stream = ffmpeg.filter(stream, 'fps', fps=10)
+        stream = ffmpeg.filter(stream, 'scale', 320, -1)
+        stream = ffmpeg.output(stream, str(output_path))
+        ffmpeg.run(stream, capture_stdout=True, capture_stderr=True)
+        
+        background_tasks.add_task(cleanup_file, input_path)
+        background_tasks.add_task(cleanup_file, output_path)
+
+        return FileResponse(
+            output_path, 
+            media_type="image/gif", 
+            filename="converted.gif"
+        )
+
+    except ffmpeg.Error as e:
+        cleanup_file(input_path)
+        if output_path.exists():
+            cleanup_file(output_path)
+        print(e.stderr.decode('utf8'))
+        raise HTTPException(status_code=500, detail="FFmpeg conversion failed")
+    except Exception as e:
+        cleanup_file(input_path)
+        if output_path.exists():
+            cleanup_file(output_path)
+        raise HTTPException(status_code=500, detail=str(e))
diff --git a/backend/requirements.txt b/backend/requirements.txt
new file mode 100644
index 0000000..d155da1
--- /dev/null
+++ b/backend/requirements.txt
@@ -0,0 +1,5 @@
+fastapi==0.109.0
+uvicorn==0.27.0
+pydantic==2.6.0
+python-multipart
+apscheduler==3.10.4
\ No newline at end of file
diff --git a/frontend/bun.lock b/frontend/bun.lock
new file mode 100644
index 0000000..83a3a2e
--- /dev/null
+++ b/frontend/bun.lock
@@ -0,0 +1,417 @@
+{
+  "lockfileVersion": 1,
+  "configVersion": 1,
+  "workspaces": {
+    "": {
+      "name": "web-utils-frontend",
+      "dependencies": {
+        "@heroicons/vue": "^2.1.1",
+        "@types/uuid": "^11.0.0",
+        "axios": "^1.6.0",
+        "uuid": "^13.0.0",
+        "vue": "^3.4.0",
+        "vue-router": "^4.2.5",
+      },
+      "devDependencies": {
+        "@vitejs/plugin-vue": "^5.0.0",
+        "autoprefixer": "^10.4.16",
+        "postcss": "^8.4.31",
+        "tailwindcss": "^3.3.5",
+        "typescript": "^5.2.0",
+        "vite": "^5.0.0",
+        "vue-tsc": "^1.8.0",
+      },
+    },
+  },
+  "packages": {
+    "@alloc/quick-lru": ["@alloc/quick-lru@5.2.0", "", {}, "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw=="],
+
+    "@babel/helper-string-parser": ["@babel/helper-string-parser@7.27.1", "", {}, "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA=="],
+
+    "@babel/helper-validator-identifier": ["@babel/helper-validator-identifier@7.28.5", "", {}, "sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q=="],
+
+    "@babel/parser": ["@babel/parser@7.28.6", "", { "dependencies": { "@babel/types": "^7.28.6" }, "bin": "./bin/babel-parser.js" }, "sha512-TeR9zWR18BvbfPmGbLampPMW+uW1NZnJlRuuHso8i87QZNq2JRF9i6RgxRqtEq+wQGsS19NNTWr2duhnE49mfQ=="],
+
+    "@babel/types": ["@babel/types@7.28.6", "", { "dependencies": { "@babel/helper-string-parser": "^7.27.1", "@babel/helper-validator-identifier": "^7.28.5" } }, "sha512-0ZrskXVEHSWIqZM/sQZ4EV3jZJXRkio/WCxaqKZP1g//CEWEPSfeZFcms4XeKBCHU0ZKnIkdJeU/kF+eRp5lBg=="],
+
+    "@esbuild/aix-ppc64": ["@esbuild/aix-ppc64@0.21.5", "", { "os": "aix", "cpu": "ppc64" }, "sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ=="],
+
+    "@esbuild/android-arm": ["@esbuild/android-arm@0.21.5", "", { "os": "android", "cpu": "arm" }, "sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg=="],
+
+    "@esbuild/android-arm64": ["@esbuild/android-arm64@0.21.5", "", { "os": "android", "cpu": "arm64" }, "sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A=="],
+
+    "@esbuild/android-x64": ["@esbuild/android-x64@0.21.5", "", { "os": "android", "cpu": "x64" }, "sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA=="],
+
+    "@esbuild/darwin-arm64": ["@esbuild/darwin-arm64@0.21.5", "", { "os": "darwin", "cpu": "arm64" }, "sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ=="],
+
+    "@esbuild/darwin-x64": ["@esbuild/darwin-x64@0.21.5", "", { "os": "darwin", "cpu": "x64" }, "sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw=="],
+
+    "@esbuild/freebsd-arm64": ["@esbuild/freebsd-arm64@0.21.5", "", { "os": "freebsd", "cpu": "arm64" }, "sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g=="],
+
+    "@esbuild/freebsd-x64": ["@esbuild/freebsd-x64@0.21.5", "", { "os": "freebsd", "cpu": "x64" }, "sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ=="],
+
+    "@esbuild/linux-arm": ["@esbuild/linux-arm@0.21.5", "", { "os": "linux", "cpu": "arm" }, "sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA=="],
+
+    "@esbuild/linux-arm64": ["@esbuild/linux-arm64@0.21.5", "", { "os": "linux", "cpu": "arm64" }, "sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q=="],
+
+    "@esbuild/linux-ia32": ["@esbuild/linux-ia32@0.21.5", "", { "os": "linux", "cpu": "ia32" }, "sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg=="],
+
+    "@esbuild/linux-loong64": ["@esbuild/linux-loong64@0.21.5", "", { "os": "linux", "cpu": "none" }, "sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg=="],
+
+    "@esbuild/linux-mips64el": ["@esbuild/linux-mips64el@0.21.5", "", { "os": "linux", "cpu": "none" }, "sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg=="],
+
+    "@esbuild/linux-ppc64": ["@esbuild/linux-ppc64@0.21.5", "", { "os": "linux", "cpu": "ppc64" }, "sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w=="],
+
+    "@esbuild/linux-riscv64": ["@esbuild/linux-riscv64@0.21.5", "", { "os": "linux", "cpu": "none" }, "sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA=="],
+
+    "@esbuild/linux-s390x": ["@esbuild/linux-s390x@0.21.5", "", { "os": "linux", "cpu": "s390x" }, "sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A=="],
+
+    "@esbuild/linux-x64": ["@esbuild/linux-x64@0.21.5", "", { "os": "linux", "cpu": "x64" }, "sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ=="],
+
+    "@esbuild/netbsd-x64": ["@esbuild/netbsd-x64@0.21.5", "", { "os": "none", "cpu": "x64" }, "sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg=="],
+
+    "@esbuild/openbsd-x64": ["@esbuild/openbsd-x64@0.21.5", "", { "os": "openbsd", "cpu": "x64" }, "sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow=="],
+
+    "@esbuild/sunos-x64": ["@esbuild/sunos-x64@0.21.5", "", { "os": "sunos", "cpu": "x64" }, "sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg=="],
+
+    "@esbuild/win32-arm64": ["@esbuild/win32-arm64@0.21.5", "", { "os": "win32", "cpu": "arm64" }, "sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A=="],
+
+    "@esbuild/win32-ia32": ["@esbuild/win32-ia32@0.21.5", "", { "os": "win32", "cpu": "ia32" }, "sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA=="],
+
+    "@esbuild/win32-x64": ["@esbuild/win32-x64@0.21.5", "", { "os": "win32", "cpu": "x64" }, "sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw=="],
+
+    "@heroicons/vue": ["@heroicons/vue@2.2.0", "", { "peerDependencies": { "vue": ">= 3" } }, "sha512-G3dbSxoeEKqbi/DFalhRxJU4mTXJn7GwZ7ae8NuEQzd1bqdd0jAbdaBZlHPcvPD2xI1iGzNVB4k20Un2AguYPw=="],
+
+    "@jridgewell/gen-mapping": ["@jridgewell/gen-mapping@0.3.13", "", { "dependencies": { "@jridgewell/sourcemap-codec": "^1.5.0", "@jridgewell/trace-mapping": "^0.3.24" } }, "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA=="],
+
+    "@jridgewell/resolve-uri": ["@jridgewell/resolve-uri@3.1.2", "", {}, "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw=="],
+
+    "@jridgewell/sourcemap-codec": ["@jridgewell/sourcemap-codec@1.5.5", "", {}, "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og=="],
+
+    "@jridgewell/trace-mapping": ["@jridgewell/trace-mapping@0.3.31", "", { "dependencies": { "@jridgewell/resolve-uri": "^3.1.0", "@jridgewell/sourcemap-codec": "^1.4.14" } }, "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw=="],
+
+    "@nodelib/fs.scandir": ["@nodelib/fs.scandir@2.1.5", "", { "dependencies": { "@nodelib/fs.stat": "2.0.5", "run-parallel": "^1.1.9" } }, "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g=="],
+
+    "@nodelib/fs.stat": ["@nodelib/fs.stat@2.0.5", "", {}, "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A=="],
+
+    "@nodelib/fs.walk": ["@nodelib/fs.walk@1.2.8", "", { "dependencies": { "@nodelib/fs.scandir": "2.1.5", "fastq": "^1.6.0" } }, "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg=="],
+
+    "@rollup/rollup-android-arm-eabi": ["@rollup/rollup-android-arm-eabi@4.57.0", "", { "os": "android", "cpu": "arm" }, "sha512-tPgXB6cDTndIe1ah7u6amCI1T0SsnlOuKgg10Xh3uizJk4e5M1JGaUMk7J4ciuAUcFpbOiNhm2XIjP9ON0dUqA=="],
+
+    "@rollup/rollup-android-arm64": ["@rollup/rollup-android-arm64@4.57.0", "", { "os": "android", "cpu": "arm64" }, "sha512-sa4LyseLLXr1onr97StkU1Nb7fWcg6niokTwEVNOO7awaKaoRObQ54+V/hrF/BP1noMEaaAW6Fg2d/CfLiq3Mg=="],
+
+    "@rollup/rollup-darwin-arm64": ["@rollup/rollup-darwin-arm64@4.57.0", "", { "os": "darwin", "cpu": "arm64" }, "sha512-/NNIj9A7yLjKdmkx5dC2XQ9DmjIECpGpwHoGmA5E1AhU0fuICSqSWScPhN1yLCkEdkCwJIDu2xIeLPs60MNIVg=="],
+
+    "@rollup/rollup-darwin-x64": ["@rollup/rollup-darwin-x64@4.57.0", "", { "os": "darwin", "cpu": "x64" }, "sha512-xoh8abqgPrPYPr7pTYipqnUi1V3em56JzE/HgDgitTqZBZ3yKCWI+7KUkceM6tNweyUKYru1UMi7FC060RyKwA=="],
+
+    "@rollup/rollup-freebsd-arm64": ["@rollup/rollup-freebsd-arm64@4.57.0", "", { "os": "freebsd", "cpu": "arm64" }, "sha512-PCkMh7fNahWSbA0OTUQ2OpYHpjZZr0hPr8lId8twD7a7SeWrvT3xJVyza+dQwXSSq4yEQTMoXgNOfMCsn8584g=="],
+
+    "@rollup/rollup-freebsd-x64": ["@rollup/rollup-freebsd-x64@4.57.0", "", { "os": "freebsd", "cpu": "x64" }, "sha512-1j3stGx+qbhXql4OCDZhnK7b01s6rBKNybfsX+TNrEe9JNq4DLi1yGiR1xW+nL+FNVvI4D02PUnl6gJ/2y6WJA=="],
+
+    "@rollup/rollup-linux-arm-gnueabihf": ["@rollup/rollup-linux-arm-gnueabihf@4.57.0", "", { "os": "linux", "cpu": "arm" }, "sha512-eyrr5W08Ms9uM0mLcKfM/Uzx7hjhz2bcjv8P2uynfj0yU8GGPdz8iYrBPhiLOZqahoAMB8ZiolRZPbbU2MAi6Q=="],
+
+    "@rollup/rollup-linux-arm-musleabihf": ["@rollup/rollup-linux-arm-musleabihf@4.57.0", "", { "os": "linux", "cpu": "arm" }, "sha512-Xds90ITXJCNyX9pDhqf85MKWUI4lqjiPAipJ8OLp8xqI2Ehk+TCVhF9rvOoN8xTbcafow3QOThkNnrM33uCFQA=="],
+
+    "@rollup/rollup-linux-arm64-gnu": ["@rollup/rollup-linux-arm64-gnu@4.57.0", "", { "os": "linux", "cpu": "arm64" }, "sha512-Xws2KA4CLvZmXjy46SQaXSejuKPhwVdaNinldoYfqruZBaJHqVo6hnRa8SDo9z7PBW5x84SH64+izmldCgbezw=="],
+
+    "@rollup/rollup-linux-arm64-musl": ["@rollup/rollup-linux-arm64-musl@4.57.0", "", { "os": "linux", "cpu": "arm64" }, "sha512-hrKXKbX5FdaRJj7lTMusmvKbhMJSGWJ+w++4KmjiDhpTgNlhYobMvKfDoIWecy4O60K6yA4SnztGuNTQF+Lplw=="],
+
+    "@rollup/rollup-linux-loong64-gnu": ["@rollup/rollup-linux-loong64-gnu@4.57.0", "", { "os": "linux", "cpu": "none" }, "sha512-6A+nccfSDGKsPm00d3xKcrsBcbqzCTAukjwWK6rbuAnB2bHaL3r9720HBVZ/no7+FhZLz/U3GwwZZEh6tOSI8Q=="],
+
+    "@rollup/rollup-linux-loong64-musl": ["@rollup/rollup-linux-loong64-musl@4.57.0", "", { "os": "linux", "cpu": "none" }, "sha512-4P1VyYUe6XAJtQH1Hh99THxr0GKMMwIXsRNOceLrJnaHTDgk1FTcTimDgneRJPvB3LqDQxUmroBclQ1S0cIJwQ=="],
+
+    "@rollup/rollup-linux-ppc64-gnu": ["@rollup/rollup-linux-ppc64-gnu@4.57.0", "", { "os": "linux", "cpu": "ppc64" }, "sha512-8Vv6pLuIZCMcgXre6c3nOPhE0gjz1+nZP6T+hwWjr7sVH8k0jRkH+XnfjjOTglyMBdSKBPPz54/y1gToSKwrSQ=="],
+
+    "@rollup/rollup-linux-ppc64-musl": ["@rollup/rollup-linux-ppc64-musl@4.57.0", "", { "os": "linux", "cpu": "ppc64" }, "sha512-r1te1M0Sm2TBVD/RxBPC6RZVwNqUTwJTA7w+C/IW5v9Ssu6xmxWEi+iJQlpBhtUiT1raJ5b48pI8tBvEjEFnFA=="],
+
+    "@rollup/rollup-linux-riscv64-gnu": ["@rollup/rollup-linux-riscv64-gnu@4.57.0", "", { "os": "linux", "cpu": "none" }, "sha512-say0uMU/RaPm3CDQLxUUTF2oNWL8ysvHkAjcCzV2znxBr23kFfaxocS9qJm+NdkRhF8wtdEEAJuYcLPhSPbjuQ=="],
+
+    "@rollup/rollup-linux-riscv64-musl": ["@rollup/rollup-linux-riscv64-musl@4.57.0", "", { "os": "linux", "cpu": "none" }, "sha512-/MU7/HizQGsnBREtRpcSbSV1zfkoxSTR7wLsRmBPQ8FwUj5sykrP1MyJTvsxP5KBq9SyE6kH8UQQQwa0ASeoQQ=="],
+
+    "@rollup/rollup-linux-s390x-gnu": ["@rollup/rollup-linux-s390x-gnu@4.57.0", "", { "os": "linux", "cpu": "s390x" }, "sha512-Q9eh+gUGILIHEaJf66aF6a414jQbDnn29zeu0eX3dHMuysnhTvsUvZTCAyZ6tJhUjnvzBKE4FtuaYxutxRZpOg=="],
+
+    "@rollup/rollup-linux-x64-gnu": ["@rollup/rollup-linux-x64-gnu@4.57.0", "", { "os": "linux", "cpu": "x64" }, "sha512-OR5p5yG5OKSxHReWmwvM0P+VTPMwoBS45PXTMYaskKQqybkS3Kmugq1W+YbNWArF8/s7jQScgzXUhArzEQ7x0A=="],
+
+    "@rollup/rollup-linux-x64-musl": ["@rollup/rollup-linux-x64-musl@4.57.0", "", { "os": "linux", "cpu": "x64" }, "sha512-XeatKzo4lHDsVEbm1XDHZlhYZZSQYym6dg2X/Ko0kSFgio+KXLsxwJQprnR48GvdIKDOpqWqssC3iBCjoMcMpw=="],
+
+    "@rollup/rollup-openbsd-x64": ["@rollup/rollup-openbsd-x64@4.57.0", "", { "os": "openbsd", "cpu": "x64" }, "sha512-Lu71y78F5qOfYmubYLHPcJm74GZLU6UJ4THkf/a1K7Tz2ycwC2VUbsqbJAXaR6Bx70SRdlVrt2+n5l7F0agTUw=="],
+
+    "@rollup/rollup-openharmony-arm64": ["@rollup/rollup-openharmony-arm64@4.57.0", "", { "os": "none", "cpu": "arm64" }, "sha512-v5xwKDWcu7qhAEcsUubiav7r+48Uk/ENWdr82MBZZRIm7zThSxCIVDfb3ZeRRq9yqk+oIzMdDo6fCcA5DHfMyA=="],
+
+    "@rollup/rollup-win32-arm64-msvc": ["@rollup/rollup-win32-arm64-msvc@4.57.0", "", { "os": "win32", "cpu": "arm64" }, "sha512-XnaaaSMGSI6Wk8F4KK3QP7GfuuhjGchElsVerCplUuxRIzdvZ7hRBpLR0omCmw+kI2RFJB80nenhOoGXlJ5TfQ=="],
+
+    "@rollup/rollup-win32-ia32-msvc": ["@rollup/rollup-win32-ia32-msvc@4.57.0", "", { "os": "win32", "cpu": "ia32" }, "sha512-3K1lP+3BXY4t4VihLw5MEg6IZD3ojSYzqzBG571W3kNQe4G4CcFpSUQVgurYgib5d+YaCjeFow8QivWp8vuSvA=="],
+
+    "@rollup/rollup-win32-x64-gnu": ["@rollup/rollup-win32-x64-gnu@4.57.0", "", { "os": "win32", "cpu": "x64" }, "sha512-MDk610P/vJGc5L5ImE4k5s+GZT3en0KoK1MKPXCRgzmksAMk79j4h3k1IerxTNqwDLxsGxStEZVBqG0gIqZqoA=="],
+
+    "@rollup/rollup-win32-x64-msvc": ["@rollup/rollup-win32-x64-msvc@4.57.0", "", { "os": "win32", "cpu": "x64" }, "sha512-Zv7v6q6aV+VslnpwzqKAmrk5JdVkLUzok2208ZXGipjb+msxBr/fJPZyeEXiFgH7k62Ak0SLIfxQRZQvTuf7rQ=="],
+
+    "@types/estree": ["@types/estree@1.0.8", "", {}, "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w=="],
+
+    "@types/uuid": ["@types/uuid@11.0.0", "", { "dependencies": { "uuid": "*" } }, "sha512-HVyk8nj2m+jcFRNazzqyVKiZezyhDKrGUA3jlEcg/nZ6Ms+qHwocba1Y/AaVaznJTAM9xpdFSh+ptbNrhOGvZA=="],
+
+    "@vitejs/plugin-vue": ["@vitejs/plugin-vue@5.2.4", "", { "peerDependencies": { "vite": "^5.0.0 || ^6.0.0", "vue": "^3.2.25" } }, "sha512-7Yx/SXSOcQq5HiiV3orevHUFn+pmMB4cgbEkDYgnkUWb0WfeQ/wa2yFv6D5ICiCQOVpjA7vYDXrC7AGO8yjDHA=="],
+
+    "@volar/language-core": ["@volar/language-core@1.11.1", "", { "dependencies": { "@volar/source-map": "1.11.1" } }, "sha512-dOcNn3i9GgZAcJt43wuaEykSluAuOkQgzni1cuxLxTV0nJKanQztp7FxyswdRILaKH+P2XZMPRp2S4MV/pElCw=="],
+
+    "@volar/source-map": ["@volar/source-map@1.11.1", "", { "dependencies": { "muggle-string": "^0.3.1" } }, "sha512-hJnOnwZ4+WT5iupLRnuzbULZ42L7BWWPMmruzwtLhJfpDVoZLjNBxHDi2sY2bgZXCKlpU5XcsMFoYrsQmPhfZg=="],
+
+    "@volar/typescript": ["@volar/typescript@1.11.1", "", { "dependencies": { "@volar/language-core": "1.11.1", "path-browserify": "^1.0.1" } }, "sha512-iU+t2mas/4lYierSnoFOeRFQUhAEMgsFuQxoxvwn5EdQopw43j+J27a4lt9LMInx1gLJBC6qL14WYGlgymaSMQ=="],
+
+    "@vue/compiler-core": ["@vue/compiler-core@3.5.27", "", { "dependencies": { "@babel/parser": "^7.28.5", "@vue/shared": "3.5.27", "entities": "^7.0.0", "estree-walker": "^2.0.2", "source-map-js": "^1.2.1" } }, "sha512-gnSBQjZA+//qDZen+6a2EdHqJ68Z7uybrMf3SPjEGgG4dicklwDVmMC1AeIHxtLVPT7sn6sH1KOO+tS6gwOUeQ=="],
+
+    "@vue/compiler-dom": ["@vue/compiler-dom@3.5.27", "", { "dependencies": { "@vue/compiler-core": "3.5.27", "@vue/shared": "3.5.27" } }, "sha512-oAFea8dZgCtVVVTEC7fv3T5CbZW9BxpFzGGxC79xakTr6ooeEqmRuvQydIiDAkglZEAd09LgVf1RoDnL54fu5w=="],
+
+    "@vue/compiler-sfc": ["@vue/compiler-sfc@3.5.27", "", { "dependencies": { "@babel/parser": "^7.28.5", "@vue/compiler-core": "3.5.27", "@vue/compiler-dom": "3.5.27", "@vue/compiler-ssr": "3.5.27", "@vue/shared": "3.5.27", "estree-walker": "^2.0.2", "magic-string": "^0.30.21", "postcss": "^8.5.6", "source-map-js": "^1.2.1" } }, "sha512-sHZu9QyDPeDmN/MRoshhggVOWE5WlGFStKFwu8G52swATgSny27hJRWteKDSUUzUH+wp+bmeNbhJnEAel/auUQ=="],
+
+    "@vue/compiler-ssr": ["@vue/compiler-ssr@3.5.27", "", { "dependencies": { "@vue/compiler-dom": "3.5.27", "@vue/shared": "3.5.27" } }, "sha512-Sj7h+JHt512fV1cTxKlYhg7qxBvack+BGncSpH+8vnN+KN95iPIcqB5rsbblX40XorP+ilO7VIKlkuu3Xq2vjw=="],
+
+    "@vue/devtools-api": ["@vue/devtools-api@6.6.4", "", {}, "sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g=="],
+
+    "@vue/language-core": ["@vue/language-core@1.8.27", "", { "dependencies": { "@volar/language-core": "~1.11.1", "@volar/source-map": "~1.11.1", "@vue/compiler-dom": "^3.3.0", "@vue/shared": "^3.3.0", "computeds": "^0.0.1", "minimatch": "^9.0.3", "muggle-string": "^0.3.1", "path-browserify": "^1.0.1", "vue-template-compiler": "^2.7.14" }, "peerDependencies": { "typescript": "*" }, "optionalPeers": ["typescript"] }, "sha512-L8Kc27VdQserNaCUNiSFdDl9LWT24ly8Hpwf1ECy3aFb9m6bDhBGQYOujDm21N7EW3moKIOKEanQwe1q5BK+mA=="],
+
+    "@vue/reactivity": ["@vue/reactivity@3.5.27", "", { "dependencies": { "@vue/shared": "3.5.27" } }, "sha512-vvorxn2KXfJ0nBEnj4GYshSgsyMNFnIQah/wczXlsNXt+ijhugmW+PpJ2cNPe4V6jpnBcs0MhCODKllWG+nvoQ=="],
+
+    "@vue/runtime-core": ["@vue/runtime-core@3.5.27", "", { "dependencies": { "@vue/reactivity": "3.5.27", "@vue/shared": "3.5.27" } }, "sha512-fxVuX/fzgzeMPn/CLQecWeDIFNt3gQVhxM0rW02Tvp/YmZfXQgcTXlakq7IMutuZ/+Ogbn+K0oct9J3JZfyk3A=="],
+
+    "@vue/runtime-dom": ["@vue/runtime-dom@3.5.27", "", { "dependencies": { "@vue/reactivity": "3.5.27", "@vue/runtime-core": "3.5.27", "@vue/shared": "3.5.27", "csstype": "^3.2.3" } }, "sha512-/QnLslQgYqSJ5aUmb5F0z0caZPGHRB8LEAQ1s81vHFM5CBfnun63rxhvE/scVb/j3TbBuoZwkJyiLCkBluMpeg=="],
+
+    "@vue/server-renderer": ["@vue/server-renderer@3.5.27", "", { "dependencies": { "@vue/compiler-ssr": "3.5.27", "@vue/shared": "3.5.27" }, "peerDependencies": { "vue": "3.5.27" } }, "sha512-qOz/5thjeP1vAFc4+BY3Nr6wxyLhpeQgAE/8dDtKo6a6xdk+L4W46HDZgNmLOBUDEkFXV3G7pRiUqxjX0/2zWA=="],
+
+    "@vue/shared": ["@vue/shared@3.5.27", "", {}, "sha512-dXr/3CgqXsJkZ0n9F3I4elY8wM9jMJpP3pvRG52r6m0tu/MsAFIe6JpXVGeNMd/D9F4hQynWT8Rfuj0bdm9kFQ=="],
+
+    "any-promise": ["any-promise@1.3.0", "", {}, "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A=="],
+
+    "anymatch": ["anymatch@3.1.3", "", { "dependencies": { "normalize-path": "^3.0.0", "picomatch": "^2.0.4" } }, "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw=="],
+
+    "arg": ["arg@5.0.2", "", {}, "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg=="],
+
+    "asynckit": ["asynckit@0.4.0", "", {}, "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="],
+
+    "autoprefixer": ["autoprefixer@10.4.23", "", { "dependencies": { "browserslist": "^4.28.1", "caniuse-lite": "^1.0.30001760", "fraction.js": "^5.3.4", "picocolors": "^1.1.1", "postcss-value-parser": "^4.2.0" }, "peerDependencies": { "postcss": "^8.1.0" }, "bin": { "autoprefixer": "bin/autoprefixer" } }, "sha512-YYTXSFulfwytnjAPlw8QHncHJmlvFKtczb8InXaAx9Q0LbfDnfEYDE55omerIJKihhmU61Ft+cAOSzQVaBUmeA=="],
+
+    "axios": ["axios@1.13.4", "", { "dependencies": { "follow-redirects": "^1.15.6", "form-data": "^4.0.4", "proxy-from-env": "^1.1.0" } }, "sha512-1wVkUaAO6WyaYtCkcYCOx12ZgpGf9Zif+qXa4n+oYzK558YryKqiL6UWwd5DqiH3VRW0GYhTZQ/vlgJrCoNQlg=="],
+
+    "balanced-match": ["balanced-match@1.0.2", "", {}, "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="],
+
+    "baseline-browser-mapping": ["baseline-browser-mapping@2.9.18", "", { "bin": { "baseline-browser-mapping": "dist/cli.js" } }, "sha512-e23vBV1ZLfjb9apvfPk4rHVu2ry6RIr2Wfs+O324okSidrX7pTAnEJPCh/O5BtRlr7QtZI7ktOP3vsqr7Z5XoA=="],
+
+    "binary-extensions": ["binary-extensions@2.3.0", "", {}, "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw=="],
+
+    "brace-expansion": ["brace-expansion@2.0.2", "", { "dependencies": { "balanced-match": "^1.0.0" } }, "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ=="],
+
+    "braces": ["braces@3.0.3", "", { "dependencies": { "fill-range": "^7.1.1" } }, "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA=="],
+
+    "browserslist": ["browserslist@4.28.1", "", { "dependencies": { "baseline-browser-mapping": "^2.9.0", "caniuse-lite": "^1.0.30001759", "electron-to-chromium": "^1.5.263", "node-releases": "^2.0.27", "update-browserslist-db": "^1.2.0" }, "bin": { "browserslist": "cli.js" } }, "sha512-ZC5Bd0LgJXgwGqUknZY/vkUQ04r8NXnJZ3yYi4vDmSiZmC/pdSN0NbNRPxZpbtO4uAfDUAFffO8IZoM3Gj8IkA=="],
+
+    "call-bind-apply-helpers": ["call-bind-apply-helpers@1.0.2", "", { "dependencies": { "es-errors": "^1.3.0", "function-bind": "^1.1.2" } }, "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ=="],
+
+    "camelcase-css": ["camelcase-css@2.0.1", "", {}, "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA=="],
+
+    "caniuse-lite": ["caniuse-lite@1.0.30001766", "", {}, "sha512-4C0lfJ0/YPjJQHagaE9x2Elb69CIqEPZeG0anQt9SIvIoOH4a4uaRl73IavyO+0qZh6MDLH//DrXThEYKHkmYA=="],
+
+    "chokidar": ["chokidar@3.6.0", "", { "dependencies": { "anymatch": "~3.1.2", "braces": "~3.0.2", "glob-parent": "~5.1.2", "is-binary-path": "~2.1.0", "is-glob": "~4.0.1", "normalize-path": "~3.0.0", "readdirp": "~3.6.0" }, "optionalDependencies": { "fsevents": "~2.3.2" } }, "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw=="],
+
+    "combined-stream": ["combined-stream@1.0.8", "", { "dependencies": { "delayed-stream": "~1.0.0" } }, "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg=="],
+
+    "commander": ["commander@4.1.1", "", {}, "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA=="],
+
+    "computeds": ["computeds@0.0.1", "", {}, "sha512-7CEBgcMjVmitjYo5q8JTJVra6X5mQ20uTThdK+0kR7UEaDrAWEQcRiBtWJzga4eRpP6afNwwLsX2SET2JhVB1Q=="],
+
+    "cssesc": ["cssesc@3.0.0", "", { "bin": { "cssesc": "bin/cssesc" } }, "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg=="],
+
+    "csstype": ["csstype@3.2.3", "", {}, "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="],
+
+    "de-indent": ["de-indent@1.0.2", "", {}, "sha512-e/1zu3xH5MQryN2zdVaF0OrdNLUbvWxzMbi+iNA6Bky7l1RoP8a2fIbRocyHclXt/arDrrR6lL3TqFD9pMQTsg=="],
+
+    "delayed-stream": ["delayed-stream@1.0.0", "", {}, "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ=="],
+
+    "didyoumean": ["didyoumean@1.2.2", "", {}, "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw=="],
+
+    "dlv": ["dlv@1.1.3", "", {}, "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA=="],
+
+    "dunder-proto": ["dunder-proto@1.0.1", "", { "dependencies": { "call-bind-apply-helpers": "^1.0.1", "es-errors": "^1.3.0", "gopd": "^1.2.0" } }, "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A=="],
+
+    "electron-to-chromium": ["electron-to-chromium@1.5.279", "", {}, "sha512-0bblUU5UNdOt5G7XqGiJtpZMONma6WAfq9vsFmtn9x1+joAObr6x1chfqyxFSDCAFwFhCQDrqeAr6MYdpwJ9Hg=="],
+
+    "entities": ["entities@7.0.1", "", {}, "sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA=="],
+
+    "es-define-property": ["es-define-property@1.0.1", "", {}, "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g=="],
+
+    "es-errors": ["es-errors@1.3.0", "", {}, "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw=="],
+
+    "es-object-atoms": ["es-object-atoms@1.1.1", "", { "dependencies": { "es-errors": "^1.3.0" } }, "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA=="],
+
+    "es-set-tostringtag": ["es-set-tostringtag@2.1.0", "", { "dependencies": { "es-errors": "^1.3.0", "get-intrinsic": "^1.2.6", "has-tostringtag": "^1.0.2", "hasown": "^2.0.2" } }, "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA=="],
+
+    "esbuild": ["esbuild@0.21.5", "", { "optionalDependencies": { "@esbuild/aix-ppc64": "0.21.5", "@esbuild/android-arm": "0.21.5", "@esbuild/android-arm64": "0.21.5", "@esbuild/android-x64": "0.21.5", "@esbuild/darwin-arm64": "0.21.5", "@esbuild/darwin-x64": "0.21.5", "@esbuild/freebsd-arm64": "0.21.5", "@esbuild/freebsd-x64": "0.21.5", "@esbuild/linux-arm": "0.21.5", "@esbuild/linux-arm64": "0.21.5", "@esbuild/linux-ia32": "0.21.5", "@esbuild/linux-loong64": "0.21.5", "@esbuild/linux-mips64el": "0.21.5", "@esbuild/linux-ppc64": "0.21.5", "@esbuild/linux-riscv64": "0.21.5", "@esbuild/linux-s390x": "0.21.5", "@esbuild/linux-x64": "0.21.5", "@esbuild/netbsd-x64": "0.21.5", "@esbuild/openbsd-x64": "0.21.5", "@esbuild/sunos-x64": "0.21.5", "@esbuild/win32-arm64": "0.21.5", "@esbuild/win32-ia32": "0.21.5", "@esbuild/win32-x64": "0.21.5" }, "bin": { "esbuild": "bin/esbuild" } }, "sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw=="],
+
+    "escalade": ["escalade@3.2.0", "", {}, "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA=="],
+
+    "estree-walker": ["estree-walker@2.0.2", "", {}, "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w=="],
+
+    "fast-glob": ["fast-glob@3.3.3", "", { "dependencies": { "@nodelib/fs.stat": "^2.0.2", "@nodelib/fs.walk": "^1.2.3", "glob-parent": "^5.1.2", "merge2": "^1.3.0", "micromatch": "^4.0.8" } }, "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg=="],
+
+    "fastq": ["fastq@1.20.1", "", { "dependencies": { "reusify": "^1.0.4" } }, "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw=="],
+
+    "fdir": ["fdir@6.5.0", "", { "peerDependencies": { "picomatch": "^3 || ^4" }, "optionalPeers": ["picomatch"] }, "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg=="],
+
+    "fill-range": ["fill-range@7.1.1", "", { "dependencies": { "to-regex-range": "^5.0.1" } }, "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg=="],
+
+    "follow-redirects": ["follow-redirects@1.15.11", "", {}, "sha512-deG2P0JfjrTxl50XGCDyfI97ZGVCxIpfKYmfyrQ54n5FO/0gfIES8C/Psl6kWVDolizcaaxZJnTS0QSMxvnsBQ=="],
+
+    "form-data": ["form-data@4.0.5", "", { "dependencies": { "asynckit": "^0.4.0", "combined-stream": "^1.0.8", "es-set-tostringtag": "^2.1.0", "hasown": "^2.0.2", "mime-types": "^2.1.12" } }, "sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w=="],
+
+    "fraction.js": ["fraction.js@5.3.4", "", {}, "sha512-1X1NTtiJphryn/uLQz3whtY6jK3fTqoE3ohKs0tT+Ujr1W59oopxmoEh7Lu5p6vBaPbgoM0bzveAW4Qi5RyWDQ=="],
+
+    "fsevents": ["fsevents@2.3.3", "", { "os": "darwin" }, "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw=="],
+
+    "function-bind": ["function-bind@1.1.2", "", {}, "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA=="],
+
+    "get-intrinsic": ["get-intrinsic@1.3.0", "", { "dependencies": { "call-bind-apply-helpers": "^1.0.2", "es-define-property": "^1.0.1", "es-errors": "^1.3.0", "es-object-atoms": "^1.1.1", "function-bind": "^1.1.2", "get-proto": "^1.0.1", "gopd": "^1.2.0", "has-symbols": "^1.1.0", "hasown": "^2.0.2", "math-intrinsics": "^1.1.0" } }, "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ=="],
+
+    "get-proto": ["get-proto@1.0.1", "", { "dependencies": { "dunder-proto": "^1.0.1", "es-object-atoms": "^1.0.0" } }, "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g=="],
+
+    "glob-parent": ["glob-parent@6.0.2", "", { "dependencies": { "is-glob": "^4.0.3" } }, "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A=="],
+
+    "gopd": ["gopd@1.2.0", "", {}, "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg=="],
+
+    "has-symbols": ["has-symbols@1.1.0", "", {}, "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ=="],
+
+    "has-tostringtag": ["has-tostringtag@1.0.2", "", { "dependencies": { "has-symbols": "^1.0.3" } }, "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw=="],
+
+    "hasown": ["hasown@2.0.2", "", { "dependencies": { "function-bind": "^1.1.2" } }, "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ=="],
+
+    "he": ["he@1.2.0", "", { "bin": { "he": "bin/he" } }, "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw=="],
+
+    "is-binary-path": ["is-binary-path@2.1.0", "", { "dependencies": { "binary-extensions": "^2.0.0" } }, "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw=="],
+
+    "is-core-module": ["is-core-module@2.16.1", "", { "dependencies": { "hasown": "^2.0.2" } }, "sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w=="],
+
+    "is-extglob": ["is-extglob@2.1.1", "", {}, "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ=="],
+
+    "is-glob": ["is-glob@4.0.3", "", { "dependencies": { "is-extglob": "^2.1.1" } }, "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg=="],
+
+    "is-number": ["is-number@7.0.0", "", {}, "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng=="],
+
+    "jiti": ["jiti@1.21.7", "", { "bin": { "jiti": "bin/jiti.js" } }, "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A=="],
+
+    "lilconfig": ["lilconfig@3.1.3", "", {}, "sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw=="],
+
+    "lines-and-columns": ["lines-and-columns@1.2.4", "", {}, "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg=="],
+
+    "magic-string": ["magic-string@0.30.21", "", { "dependencies": { "@jridgewell/sourcemap-codec": "^1.5.5" } }, "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ=="],
+
+    "math-intrinsics": ["math-intrinsics@1.1.0", "", {}, "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g=="],
+
+    "merge2": ["merge2@1.4.1", "", {}, "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg=="],
+
+    "micromatch": ["micromatch@4.0.8", "", { "dependencies": { "braces": "^3.0.3", "picomatch": "^2.3.1" } }, "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA=="],
+
+    "mime-db": ["mime-db@1.52.0", "", {}, "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg=="],
+
+    "mime-types": ["mime-types@2.1.35", "", { "dependencies": { "mime-db": "1.52.0" } }, "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw=="],
+
+    "minimatch": ["minimatch@9.0.5", "", { "dependencies": { "brace-expansion": "^2.0.1" } }, "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow=="],
+
+    "muggle-string": ["muggle-string@0.3.1", "", {}, "sha512-ckmWDJjphvd/FvZawgygcUeQCxzvohjFO5RxTjj4eq8kw359gFF3E1brjfI+viLMxss5JrHTDRHZvu2/tuy0Qg=="],
+
+    "mz": ["mz@2.7.0", "", { "dependencies": { "any-promise": "^1.0.0", "object-assign": "^4.0.1", "thenify-all": "^1.0.0" } }, "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q=="],
+
+    "nanoid": ["nanoid@3.3.11", "", { "bin": { "nanoid": "bin/nanoid.cjs" } }, "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w=="],
+
+    "node-releases": ["node-releases@2.0.27", "", {}, "sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA=="],
+
+    "normalize-path": ["normalize-path@3.0.0", "", {}, "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA=="],
+
+    "object-assign": ["object-assign@4.1.1", "", {}, "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg=="],
+
+    "object-hash": ["object-hash@3.0.0", "", {}, "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw=="],
+
+    "path-browserify": ["path-browserify@1.0.1", "", {}, "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g=="],
+
+    "path-parse": ["path-parse@1.0.7", "", {}, "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw=="],
+
+    "picocolors": ["picocolors@1.1.1", "", {}, "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA=="],
+
+    "picomatch": ["picomatch@2.3.1", "", {}, "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA=="],
+
+    "pify": ["pify@2.3.0", "", {}, "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog=="],
+
+    "pirates": ["pirates@4.0.7", "", {}, "sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA=="],
+
+    "postcss": ["postcss@8.5.6", "", { "dependencies": { "nanoid": "^3.3.11", "picocolors": "^1.1.1", "source-map-js": "^1.2.1" } }, "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg=="],
+
+    "postcss-import": ["postcss-import@15.1.0", "", { "dependencies": { "postcss-value-parser": "^4.0.0", "read-cache": "^1.0.0", "resolve": "^1.1.7" }, "peerDependencies": { "postcss": "^8.0.0" } }, "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew=="],
+
+    "postcss-js": ["postcss-js@4.1.0", "", { "dependencies": { "camelcase-css": "^2.0.1" }, "peerDependencies": { "postcss": "^8.4.21" } }, "sha512-oIAOTqgIo7q2EOwbhb8UalYePMvYoIeRY2YKntdpFQXNosSu3vLrniGgmH9OKs/qAkfoj5oB3le/7mINW1LCfw=="],
+
+    "postcss-load-config": ["postcss-load-config@6.0.1", "", { "dependencies": { "lilconfig": "^3.1.1" }, "peerDependencies": { "jiti": ">=1.21.0", "postcss": ">=8.0.9", "tsx": "^4.8.1", "yaml": "^2.4.2" }, "optionalPeers": ["jiti", "postcss", "tsx", "yaml"] }, "sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g=="],
+
+    "postcss-nested": ["postcss-nested@6.2.0", "", { "dependencies": { "postcss-selector-parser": "^6.1.1" }, "peerDependencies": { "postcss": "^8.2.14" } }, "sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ=="],
+
+    "postcss-selector-parser": ["postcss-selector-parser@6.1.2", "", { "dependencies": { "cssesc": "^3.0.0", "util-deprecate": "^1.0.2" } }, "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg=="],
+
+    "postcss-value-parser": ["postcss-value-parser@4.2.0", "", {}, "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ=="],
+
+    "proxy-from-env": ["proxy-from-env@1.1.0", "", {}, "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg=="],
+
+    "queue-microtask": ["queue-microtask@1.2.3", "", {}, "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A=="],
+
+    "read-cache": ["read-cache@1.0.0", "", { "dependencies": { "pify": "^2.3.0" } }, "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA=="],
+
+    "readdirp": ["readdirp@3.6.0", "", { "dependencies": { "picomatch": "^2.2.1" } }, "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA=="],
+
+    "resolve": ["resolve@1.22.11", "", { "dependencies": { "is-core-module": "^2.16.1", "path-parse": "^1.0.7", "supports-preserve-symlinks-flag": "^1.0.0" }, "bin": { "resolve": "bin/resolve" } }, "sha512-RfqAvLnMl313r7c9oclB1HhUEAezcpLjz95wFH4LVuhk9JF/r22qmVP9AMmOU4vMX7Q8pN8jwNg/CSpdFnMjTQ=="],
+
+    "reusify": ["reusify@1.1.0", "", {}, "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw=="],
+
+    "rollup": ["rollup@4.57.0", "", { "dependencies": { "@types/estree": "1.0.8" }, "optionalDependencies": { "@rollup/rollup-android-arm-eabi": "4.57.0", "@rollup/rollup-android-arm64": "4.57.0", "@rollup/rollup-darwin-arm64": "4.57.0", "@rollup/rollup-darwin-x64": "4.57.0", "@rollup/rollup-freebsd-arm64": "4.57.0", "@rollup/rollup-freebsd-x64": "4.57.0", "@rollup/rollup-linux-arm-gnueabihf": "4.57.0", "@rollup/rollup-linux-arm-musleabihf": "4.57.0", "@rollup/rollup-linux-arm64-gnu": "4.57.0", "@rollup/rollup-linux-arm64-musl": "4.57.0", "@rollup/rollup-linux-loong64-gnu": "4.57.0", "@rollup/rollup-linux-loong64-musl": "4.57.0", "@rollup/rollup-linux-ppc64-gnu": "4.57.0", "@rollup/rollup-linux-ppc64-musl": "4.57.0", "@rollup/rollup-linux-riscv64-gnu": "4.57.0", "@rollup/rollup-linux-riscv64-musl": "4.57.0", "@rollup/rollup-linux-s390x-gnu": "4.57.0", "@rollup/rollup-linux-x64-gnu": "4.57.0", "@rollup/rollup-linux-x64-musl": "4.57.0", "@rollup/rollup-openbsd-x64": "4.57.0", "@rollup/rollup-openharmony-arm64": "4.57.0", "@rollup/rollup-win32-arm64-msvc": "4.57.0", "@rollup/rollup-win32-ia32-msvc": "4.57.0", "@rollup/rollup-win32-x64-gnu": "4.57.0", "@rollup/rollup-win32-x64-msvc": "4.57.0", "fsevents": "~2.3.2" }, "bin": { "rollup": "dist/bin/rollup" } }, "sha512-e5lPJi/aui4TO1LpAXIRLySmwXSE8k3b9zoGfd42p67wzxog4WHjiZF3M2uheQih4DGyc25QEV4yRBbpueNiUA=="],
+
+    "run-parallel": ["run-parallel@1.2.0", "", { "dependencies": { "queue-microtask": "^1.2.2" } }, "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA=="],
+
+    "semver": ["semver@7.7.3", "", { "bin": { "semver": "bin/semver.js" } }, "sha512-SdsKMrI9TdgjdweUSR9MweHA4EJ8YxHn8DFaDisvhVlUOe4BF1tLD7GAj0lIqWVl+dPb/rExr0Btby5loQm20Q=="],
+
+    "source-map-js": ["source-map-js@1.2.1", "", {}, "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="],
+
+    "sucrase": ["sucrase@3.35.1", "", { "dependencies": { "@jridgewell/gen-mapping": "^0.3.2", "commander": "^4.0.0", "lines-and-columns": "^1.1.6", "mz": "^2.7.0", "pirates": "^4.0.1", "tinyglobby": "^0.2.11", "ts-interface-checker": "^0.1.9" }, "bin": { "sucrase": "bin/sucrase", "sucrase-node": "bin/sucrase-node" } }, "sha512-DhuTmvZWux4H1UOnWMB3sk0sbaCVOoQZjv8u1rDoTV0HTdGem9hkAZtl4JZy8P2z4Bg0nT+YMeOFyVr4zcG5Tw=="],
+
+    "supports-preserve-symlinks-flag": ["supports-preserve-symlinks-flag@1.0.0", "", {}, "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w=="],
+
+    "tailwindcss": ["tailwindcss@3.4.19", "", { "dependencies": { "@alloc/quick-lru": "^5.2.0", "arg": "^5.0.2", "chokidar": "^3.6.0", "didyoumean": "^1.2.2", "dlv": "^1.1.3", "fast-glob": "^3.3.2", "glob-parent": "^6.0.2", "is-glob": "^4.0.3", "jiti": "^1.21.7", "lilconfig": "^3.1.3", "micromatch": "^4.0.8", "normalize-path": "^3.0.0", "object-hash": "^3.0.0", "picocolors": "^1.1.1", "postcss": "^8.4.47", "postcss-import": "^15.1.0", "postcss-js": "^4.0.1", "postcss-load-config": "^4.0.2 || ^5.0 || ^6.0", "postcss-nested": "^6.2.0", "postcss-selector-parser": "^6.1.2", "resolve": "^1.22.8", "sucrase": "^3.35.0" }, "bin": { "tailwind": "lib/cli.js", "tailwindcss": "lib/cli.js" } }, "sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ=="],
+
+    "thenify": ["thenify@3.3.1", "", { "dependencies": { "any-promise": "^1.0.0" } }, "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw=="],
+
+    "thenify-all": ["thenify-all@1.6.0", "", { "dependencies": { "thenify": ">= 3.1.0 < 4" } }, "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA=="],
+
+    "tinyglobby": ["tinyglobby@0.2.15", "", { "dependencies": { "fdir": "^6.5.0", "picomatch": "^4.0.3" } }, "sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ=="],
+
+    "to-regex-range": ["to-regex-range@5.0.1", "", { "dependencies": { "is-number": "^7.0.0" } }, "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ=="],
+
+    "ts-interface-checker": ["ts-interface-checker@0.1.13", "", {}, "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA=="],
+
+    "typescript": ["typescript@5.9.3", "", { "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" } }, "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw=="],
+
+    "update-browserslist-db": ["update-browserslist-db@1.2.3", "", { "dependencies": { "escalade": "^3.2.0", "picocolors": "^1.1.1" }, "peerDependencies": { "browserslist": ">= 4.21.0" }, "bin": { "update-browserslist-db": "cli.js" } }, "sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w=="],
+
+    "util-deprecate": ["util-deprecate@1.0.2", "", {}, "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw=="],
+
+    "uuid": ["uuid@13.0.0", "", { "bin": { "uuid": "dist-node/bin/uuid" } }, "sha512-XQegIaBTVUjSHliKqcnFqYypAd4S+WCYt5NIeRs6w/UAry7z8Y9j5ZwRRL4kzq9U3sD6v+85er9FvkEaBpji2w=="],
+
+    "vite": ["vite@5.4.21", "", { "dependencies": { "esbuild": "^0.21.3", "postcss": "^8.4.43", "rollup": "^4.20.0" }, "optionalDependencies": { "fsevents": "~2.3.3" }, "peerDependencies": { "@types/node": "^18.0.0 || >=20.0.0", "less": "*", "lightningcss": "^1.21.0", "sass": "*", "sass-embedded": "*", "stylus": "*", "sugarss": "*", "terser": "^5.4.0" }, "optionalPeers": ["@types/node", "less", "lightningcss", "sass", "sass-embedded", "stylus", "sugarss", "terser"], "bin": { "vite": "bin/vite.js" } }, "sha512-o5a9xKjbtuhY6Bi5S3+HvbRERmouabWbyUcpXXUA1u+GNUKoROi9byOJ8M0nHbHYHkYICiMlqxkg1KkYmm25Sw=="],
+
+    "vue": ["vue@3.5.27", "", { "dependencies": { "@vue/compiler-dom": "3.5.27", "@vue/compiler-sfc": "3.5.27", "@vue/runtime-dom": "3.5.27", "@vue/server-renderer": "3.5.27", "@vue/shared": "3.5.27" }, "peerDependencies": { "typescript": "*" }, "optionalPeers": ["typescript"] }, "sha512-aJ/UtoEyFySPBGarREmN4z6qNKpbEguYHMmXSiOGk69czc+zhs0NF6tEFrY8TZKAl8N/LYAkd4JHVd5E/AsSmw=="],
+
+    "vue-router": ["vue-router@4.6.4", "", { "dependencies": { "@vue/devtools-api": "^6.6.4" }, "peerDependencies": { "vue": "^3.5.0" } }, "sha512-Hz9q5sa33Yhduglwz6g9skT8OBPii+4bFn88w6J+J4MfEo4KRRpmiNG/hHHkdbRFlLBOqxN8y8gf2Fb0MTUgVg=="],
+
+    "vue-template-compiler": ["vue-template-compiler@2.7.16", "", { "dependencies": { "de-indent": "^1.0.2", "he": "^1.2.0" } }, "sha512-AYbUWAJHLGGQM7+cNTELw+KsOG9nl2CnSv467WobS5Cv9uk3wFcnr1Etsz2sEIHEZvw1U+o9mRlEO6QbZvUPGQ=="],
+
+    "vue-tsc": ["vue-tsc@1.8.27", "", { "dependencies": { "@volar/typescript": "~1.11.1", "@vue/language-core": "1.8.27", "semver": "^7.5.4" }, "peerDependencies": { "typescript": "*" }, "bin": { "vue-tsc": "bin/vue-tsc.js" } }, "sha512-WesKCAZCRAbmmhuGl3+VrdWItEvfoFIPXOvUJkjULi+x+6G/Dy69yO3TBRJDr9eUlmsNAwVmxsNZxvHKzbkKdg=="],
+
+    "chokidar/glob-parent": ["glob-parent@5.1.2", "", { "dependencies": { "is-glob": "^4.0.1" } }, "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow=="],
+
+    "fast-glob/glob-parent": ["glob-parent@5.1.2", "", { "dependencies": { "is-glob": "^4.0.1" } }, "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow=="],
+
+    "tinyglobby/picomatch": ["picomatch@4.0.3", "", {}, "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q=="],
+  }
+}
diff --git a/frontend/index.html b/frontend/index.html
new file mode 100644
index 0000000..8e18eb0
--- /dev/null
+++ b/frontend/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Web Utils 2026</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+  </head>
+  <body class="bg-gray-50 text-gray-900">
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
new file mode 100644
index 0000000..9248680
--- /dev/null
+++ b/frontend/package-lock.json
@@ -0,0 +1,2780 @@
+{
+  "name": "web-utils-frontend",
+  "version": "0.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "web-utils-frontend",
+      "version": "0.0.0",
+      "dependencies": {
+        "@faker-js/faker": "^10.2.0",
+        "@heroicons/vue": "^2.1.1",
+        "@types/uuid": "^11.0.0",
+        "axios": "^1.6.0",
+        "composerize": "^1.7.5",
+        "cronstrue": "^3.9.0",
+        "decomposerize": "^1.4.4",
+        "diff": "^8.0.3",
+        "js-yaml": "^4.1.1",
+        "jwt-decode": "^4.0.0",
+        "papaparse": "^5.5.3",
+        "qrcode": "^1.5.4",
+        "sql-formatter": "^15.7.0",
+        "svgo": "^4.0.0",
+        "uuid": "^13.0.0",
+        "vue": "^3.4.0",
+        "vue-diff": "^1.2.4",
+        "vue-router": "^4.2.5"
+      },
+      "devDependencies": {
+        "@vitejs/plugin-vue": "^5.0.0",
+        "autoprefixer": "^10.4.16",
+        "postcss": "^8.4.31",
+        "tailwindcss": "^3.3.5",
+        "typescript": "^5.2.0",
+        "vite": "^5.0.0",
+        "vue-tsc": "^1.8.0"
+      }
+    },
+    "node_modules/@alloc/quick-lru": {
+      "version": "5.2.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@babel/helper-string-parser": {
+      "version": "7.27.1",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-identifier": {
+      "version": "7.28.5",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/parser": {
+      "version": "7.28.6",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.28.6"
+      },
+      "bin": {
+        "parser": "bin/babel-parser.js"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@babel/types": {
+      "version": "7.28.6",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-string-parser": "^7.27.1",
+        "@babel/helper-validator-identifier": "^7.28.5"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@esbuild/darwin-arm64": {
+      "version": "0.21.5",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@faker-js/faker": {
+      "version": "10.2.0",
+      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-10.2.0.tgz",
+      "integrity": "sha512-rTXwAsIxpCqzUnZvrxVh3L0QA0NzToqWBLAhV+zDV3MIIwiQhAZHMdPCIaj5n/yADu/tyk12wIPgL6YHGXJP+g==",
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fakerjs"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || ^23.5.0 || >=24.0.0",
+        "npm": ">=10"
+      }
+    },
+    "node_modules/@heroicons/vue": {
+      "version": "2.2.0",
+      "license": "MIT",
+      "peerDependencies": {
+        "vue": ">= 3"
+      }
+    },
+    "node_modules/@jridgewell/gen-mapping": {
+      "version": "0.3.13",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.0",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      }
+    },
+    "node_modules/@jridgewell/resolve-uri": {
+      "version": "3.1.2",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/sourcemap-codec": {
+      "version": "1.5.5",
+      "license": "MIT"
+    },
+    "node_modules/@jridgewell/trace-mapping": {
+      "version": "0.3.31",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/resolve-uri": "^3.1.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14"
+      }
+    },
+    "node_modules/@nodelib/fs.scandir": {
+      "version": "2.1.5",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.stat": "2.0.5",
+        "run-parallel": "^1.1.9"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@nodelib/fs.stat": {
+      "version": "2.0.5",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@nodelib/fs.walk": {
+      "version": "1.2.8",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.scandir": "2.1.5",
+        "fastq": "^1.6.0"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.57.0",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@types/estree": {
+      "version": "1.0.8",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/uuid": {
+      "version": "11.0.0",
+      "deprecated": "This is a stub types definition. uuid provides its own type definitions, so you do not need this installed.",
+      "license": "MIT",
+      "dependencies": {
+        "uuid": "*"
+      }
+    },
+    "node_modules/@types/web-bluetooth": {
+      "version": "0.0.14",
+      "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.14.tgz",
+      "integrity": "sha512-5d2RhCard1nQUC3aHcq/gHzWYO6K0WJmAbjO7mQJgCQKtZpgXxv1rOM6O/dBDhDYYVutk1sciOgNSe+5YyfM8A==",
+      "license": "MIT"
+    },
+    "node_modules/@vitejs/plugin-vue": {
+      "version": "5.2.4",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.0.0 || >=20.0.0"
+      },
+      "peerDependencies": {
+        "vite": "^5.0.0 || ^6.0.0",
+        "vue": "^3.2.25"
+      }
+    },
+    "node_modules/@volar/language-core": {
+      "version": "1.11.1",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@volar/source-map": "1.11.1"
+      }
+    },
+    "node_modules/@volar/source-map": {
+      "version": "1.11.1",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "muggle-string": "^0.3.1"
+      }
+    },
+    "node_modules/@volar/typescript": {
+      "version": "1.11.1",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@volar/language-core": "1.11.1",
+        "path-browserify": "^1.0.1"
+      }
+    },
+    "node_modules/@vue/compiler-core": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.28.5",
+        "@vue/shared": "3.5.27",
+        "entities": "^7.0.0",
+        "estree-walker": "^2.0.2",
+        "source-map-js": "^1.2.1"
+      }
+    },
+    "node_modules/@vue/compiler-dom": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/compiler-core": "3.5.27",
+        "@vue/shared": "3.5.27"
+      }
+    },
+    "node_modules/@vue/compiler-sfc": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.28.5",
+        "@vue/compiler-core": "3.5.27",
+        "@vue/compiler-dom": "3.5.27",
+        "@vue/compiler-ssr": "3.5.27",
+        "@vue/shared": "3.5.27",
+        "estree-walker": "^2.0.2",
+        "magic-string": "^0.30.21",
+        "postcss": "^8.5.6",
+        "source-map-js": "^1.2.1"
+      }
+    },
+    "node_modules/@vue/compiler-ssr": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/compiler-dom": "3.5.27",
+        "@vue/shared": "3.5.27"
+      }
+    },
+    "node_modules/@vue/devtools-api": {
+      "version": "6.6.4",
+      "license": "MIT"
+    },
+    "node_modules/@vue/language-core": {
+      "version": "1.8.27",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@volar/language-core": "~1.11.1",
+        "@volar/source-map": "~1.11.1",
+        "@vue/compiler-dom": "^3.3.0",
+        "@vue/shared": "^3.3.0",
+        "computeds": "^0.0.1",
+        "minimatch": "^9.0.3",
+        "muggle-string": "^0.3.1",
+        "path-browserify": "^1.0.1",
+        "vue-template-compiler": "^2.7.14"
+      },
+      "peerDependencies": {
+        "typescript": "*"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vue/reactivity": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/shared": "3.5.27"
+      }
+    },
+    "node_modules/@vue/runtime-core": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/reactivity": "3.5.27",
+        "@vue/shared": "3.5.27"
+      }
+    },
+    "node_modules/@vue/runtime-dom": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/reactivity": "3.5.27",
+        "@vue/runtime-core": "3.5.27",
+        "@vue/shared": "3.5.27",
+        "csstype": "^3.2.3"
+      }
+    },
+    "node_modules/@vue/server-renderer": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/compiler-ssr": "3.5.27",
+        "@vue/shared": "3.5.27"
+      },
+      "peerDependencies": {
+        "vue": "3.5.27"
+      }
+    },
+    "node_modules/@vue/shared": {
+      "version": "3.5.27",
+      "license": "MIT"
+    },
+    "node_modules/@vueuse/metadata": {
+      "version": "8.9.4",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-8.9.4.tgz",
+      "integrity": "sha512-IwSfzH80bnJMzqhaapqJl9JRIiyQU0zsRGEgnxN6jhq7992cPUJIRfV+JHRIZXjYqbwt07E1gTEp0R0zPJ1aqw==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/ajv": {
+      "version": "8.17.1",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
+      "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.3",
+        "fast-uri": "^3.0.1",
+        "json-schema-traverse": "^1.0.0",
+        "require-from-string": "^2.0.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/ajv-errors": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/ajv-errors/-/ajv-errors-3.0.0.tgz",
+      "integrity": "sha512-V3wD15YHfHz6y0KdhYFjyy9vWtEVALT9UrxfN3zqlI6dMioHnJrqOYfyPKol3oqrnCM9uwkcdCwkJ0WUcbLMTQ==",
+      "license": "MIT",
+      "peerDependencies": {
+        "ajv": "^8.0.1"
+      }
+    },
+    "node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/any-promise": {
+      "version": "1.3.0",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/anymatch": {
+      "version": "3.1.3",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/anymatch/node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/arg": {
+      "version": "5.0.2",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/argparse": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+      "license": "Python-2.0"
+    },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "license": "MIT"
+    },
+    "node_modules/autoprefixer": {
+      "version": "10.4.23",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/autoprefixer"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "browserslist": "^4.28.1",
+        "caniuse-lite": "^1.0.30001760",
+        "fraction.js": "^5.3.4",
+        "picocolors": "^1.1.1",
+        "postcss-value-parser": "^4.2.0"
+      },
+      "bin": {
+        "autoprefixer": "bin/autoprefixer"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
+    "node_modules/axios": {
+      "version": "1.13.4",
+      "license": "MIT",
+      "dependencies": {
+        "follow-redirects": "^1.15.6",
+        "form-data": "^4.0.4",
+        "proxy-from-env": "^1.1.0"
+      }
+    },
+    "node_modules/balanced-match": {
+      "version": "1.0.2",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/baseline-browser-mapping": {
+      "version": "2.9.18",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "baseline-browser-mapping": "dist/cli.js"
+      }
+    },
+    "node_modules/binary-extensions": {
+      "version": "2.3.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/boolbase": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+      "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
+      "license": "ISC"
+    },
+    "node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/braces": {
+      "version": "3.0.3",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fill-range": "^7.1.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/browserslist": {
+      "version": "4.28.1",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "baseline-browser-mapping": "^2.9.0",
+        "caniuse-lite": "^1.0.30001759",
+        "electron-to-chromium": "^1.5.263",
+        "node-releases": "^2.0.27",
+        "update-browserslist-db": "^1.2.0"
+      },
+      "bin": {
+        "browserslist": "cli.js"
+      },
+      "engines": {
+        "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
+      }
+    },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/camelcase": {
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
+      "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/camelcase-css": {
+      "version": "2.0.1",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/caniuse-lite": {
+      "version": "1.0.30001766",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/caniuse-lite"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "CC-BY-4.0"
+    },
+    "node_modules/chokidar": {
+      "version": "3.6.0",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "anymatch": "~3.1.2",
+        "braces": "~3.0.2",
+        "glob-parent": "~5.1.2",
+        "is-binary-path": "~2.1.0",
+        "is-glob": "~4.0.1",
+        "normalize-path": "~3.0.0",
+        "readdirp": "~3.6.0"
+      },
+      "engines": {
+        "node": ">= 8.10.0"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/chokidar/node_modules/glob-parent": {
+      "version": "5.1.2",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/cliui": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-6.0.0.tgz",
+      "integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.0",
+        "wrap-ansi": "^6.2.0"
+      }
+    },
+    "node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "license": "MIT"
+    },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "license": "MIT",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/commander": {
+      "version": "4.1.1",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/composerize": {
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/composerize/-/composerize-1.7.5.tgz",
+      "integrity": "sha512-QIBM2PL9jDneea5JYvBRecM8ZD2nOrrrU1f0a7p+veO174RLqL3UpmX6hBP69FSalhJkNVPVLDIEYrAz9hOySQ==",
+      "license": "MIT",
+      "dependencies": {
+        "composeverter": "latest",
+        "core-js": "^2.5.5",
+        "deepmerge": "^2.1.0",
+        "invariant": "^2.2.4",
+        "yargs-parser": "^13.0.0"
+      },
+      "bin": {
+        "composerize": "cli.js"
+      }
+    },
+    "node_modules/composeverter": {
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/composeverter/-/composeverter-1.7.5.tgz",
+      "integrity": "sha512-XUPZdktweMFFMk7oLFOOFZeuZ4U0jY/MpisUmRkHImybn9PvixceiKGVMMwSL19P9Mr5Ty1A7bmG2lFWn5UWTA==",
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "^8.x",
+        "ajv-errors": "^3.x",
+        "core-js": "^2.5.5",
+        "yaml": "^2.x"
+      }
+    },
+    "node_modules/computeds": {
+      "version": "0.0.1",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/core-js": {
+      "version": "2.6.12",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
+      "integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
+      "deprecated": "core-js@<3.23.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Some versions have web compatibility issues. Please, upgrade your dependencies to the actual version of core-js.",
+      "hasInstallScript": true,
+      "license": "MIT"
+    },
+    "node_modules/cronstrue": {
+      "version": "3.9.0",
+      "resolved": "https://registry.npmjs.org/cronstrue/-/cronstrue-3.9.0.tgz",
+      "integrity": "sha512-T3S35zmD0Ai2B4ko6+mEM+k9C6tipe2nB9RLiGT6QL2Wn0Vsn2cCZAC8Oeuf4CaE00GZWVdpYitbpWCNlIWqdA==",
+      "license": "MIT",
+      "bin": {
+        "cronstrue": "bin/cli.js"
+      }
+    },
+    "node_modules/css-select": {
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-5.2.2.tgz",
+      "integrity": "sha512-TizTzUddG/xYLA3NXodFM0fSbNizXjOKhqiQQwvhlspadZokn1KDy0NZFS0wuEubIYAV5/c1/lAr0TaaFXEXzw==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "boolbase": "^1.0.0",
+        "css-what": "^6.1.0",
+        "domhandler": "^5.0.2",
+        "domutils": "^3.0.1",
+        "nth-check": "^2.0.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fb55"
+      }
+    },
+    "node_modules/css-tree": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-3.1.0.tgz",
+      "integrity": "sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==",
+      "license": "MIT",
+      "dependencies": {
+        "mdn-data": "2.12.2",
+        "source-map-js": "^1.0.1"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
+      }
+    },
+    "node_modules/css-what": {
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.2.2.tgz",
+      "integrity": "sha512-u/O3vwbptzhMs3L1fQE82ZSLHQQfto5gyZzwteVIEyeaY5Fc7R4dapF/BvRoSYFeqfBk4m0V1Vafq5Pjv25wvA==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">= 6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fb55"
+      }
+    },
+    "node_modules/cssesc": {
+      "version": "3.0.0",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "cssesc": "bin/cssesc"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/csso": {
+      "version": "5.0.5",
+      "resolved": "https://registry.npmjs.org/csso/-/csso-5.0.5.tgz",
+      "integrity": "sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==",
+      "license": "MIT",
+      "dependencies": {
+        "css-tree": "~2.2.0"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0",
+        "npm": ">=7.0.0"
+      }
+    },
+    "node_modules/csso/node_modules/css-tree": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.2.1.tgz",
+      "integrity": "sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==",
+      "license": "MIT",
+      "dependencies": {
+        "mdn-data": "2.0.28",
+        "source-map-js": "^1.0.1"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0",
+        "npm": ">=7.0.0"
+      }
+    },
+    "node_modules/csso/node_modules/mdn-data": {
+      "version": "2.0.28",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.28.tgz",
+      "integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==",
+      "license": "CC0-1.0"
+    },
+    "node_modules/csstype": {
+      "version": "3.2.3",
+      "license": "MIT"
+    },
+    "node_modules/de-indent": {
+      "version": "1.0.2",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/decamelize": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha512-z2S+W9X73hAUUki+N+9Za2lBlun89zigOyGrsax+KUQ6wKW4ZoWpEYBkGhQjwAjjDCkWxhY0VKEhk8wzY7F5cA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/decomposerize": {
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/decomposerize/-/decomposerize-1.4.4.tgz",
+      "integrity": "sha512-XEG0Jq2Cyhuqg8sc/LQIsIBElMUEQ+rqk88kC3qa0PkPUpfxWLcaHbQTji8otrUQDHiH/fhSG40yaIAxi7fQOQ==",
+      "license": "MIT",
+      "dependencies": {
+        "composeverter": "latest",
+        "core-js": "^2.5.5"
+      },
+      "bin": {
+        "decomposerize": "cli.js"
+      }
+    },
+    "node_modules/deepmerge": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
+      "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
+    "node_modules/didyoumean": {
+      "version": "1.2.2",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
+    "node_modules/diff": {
+      "version": "8.0.3",
+      "resolved": "https://registry.npmjs.org/diff/-/diff-8.0.3.tgz",
+      "integrity": "sha512-qejHi7bcSD4hQAZE0tNAawRK1ZtafHDmMTMkrrIGgSLl7hTnQHmKCeB45xAcbfTqK2zowkM3j3bHt/4b/ARbYQ==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.3.1"
+      }
+    },
+    "node_modules/diff-match-patch": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/diff-match-patch/-/diff-match-patch-1.0.5.tgz",
+      "integrity": "sha512-IayShXAgj/QMXgB0IWmKx+rOPuGMhqm5w6jvFxmVenXKIzRqTAAsbBPT3kWQeGANj3jGgvcvv4yK6SxqYmikgw==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/dijkstrajs": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.3.tgz",
+      "integrity": "sha512-qiSlmBq9+BCdCA/L46dw8Uy93mloxsPSbwnm5yrKn2vMPiy8KyAskTF6zuV/j5BMsmOGZDPs7KjU+mjb670kfA==",
+      "license": "MIT"
+    },
+    "node_modules/discontinuous-range": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/discontinuous-range/-/discontinuous-range-1.0.0.tgz",
+      "integrity": "sha512-c68LpLbO+7kP/b1Hr1qs8/BJ09F5khZGTxqxZuhzxpmwJKOgRFHJWIb9/KmqnqHhLdO55aOxFH/EGBvUQbL/RQ==",
+      "license": "MIT"
+    },
+    "node_modules/dlv": {
+      "version": "1.1.3",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/dom-serializer": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz",
+      "integrity": "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==",
+      "license": "MIT",
+      "dependencies": {
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.2",
+        "entities": "^4.2.0"
+      },
+      "funding": {
+        "url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
+      }
+    },
+    "node_modules/dom-serializer/node_modules/entities": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+      "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/domelementtype": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
+      "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fb55"
+        }
+      ],
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/domhandler": {
+      "version": "5.0.3",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz",
+      "integrity": "sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "domelementtype": "^2.3.0"
+      },
+      "engines": {
+        "node": ">= 4"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/domhandler?sponsor=1"
+      }
+    },
+    "node_modules/domutils": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-3.2.2.tgz",
+      "integrity": "sha512-6kZKyUajlDuqlHKVX1w7gyslj9MPIXzIFiz/rGu35uC1wMi+kMhQwGhl4lt9unC9Vb9INnY9Z3/ZA3+FhASLaw==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "dom-serializer": "^2.0.0",
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.3"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/domutils?sponsor=1"
+      }
+    },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/electron-to-chromium": {
+      "version": "1.5.279",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "license": "MIT"
+    },
+    "node_modules/entities": {
+      "version": "7.0.1",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/es-define-property": {
+      "version": "1.0.1",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-object-atoms": {
+      "version": "1.1.1",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-set-tostringtag": {
+      "version": "2.1.0",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/esbuild": {
+      "version": "0.21.5",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "esbuild": "bin/esbuild"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "optionalDependencies": {
+        "@esbuild/aix-ppc64": "0.21.5",
+        "@esbuild/android-arm": "0.21.5",
+        "@esbuild/android-arm64": "0.21.5",
+        "@esbuild/android-x64": "0.21.5",
+        "@esbuild/darwin-arm64": "0.21.5",
+        "@esbuild/darwin-x64": "0.21.5",
+        "@esbuild/freebsd-arm64": "0.21.5",
+        "@esbuild/freebsd-x64": "0.21.5",
+        "@esbuild/linux-arm": "0.21.5",
+        "@esbuild/linux-arm64": "0.21.5",
+        "@esbuild/linux-ia32": "0.21.5",
+        "@esbuild/linux-loong64": "0.21.5",
+        "@esbuild/linux-mips64el": "0.21.5",
+        "@esbuild/linux-ppc64": "0.21.5",
+        "@esbuild/linux-riscv64": "0.21.5",
+        "@esbuild/linux-s390x": "0.21.5",
+        "@esbuild/linux-x64": "0.21.5",
+        "@esbuild/netbsd-x64": "0.21.5",
+        "@esbuild/openbsd-x64": "0.21.5",
+        "@esbuild/sunos-x64": "0.21.5",
+        "@esbuild/win32-arm64": "0.21.5",
+        "@esbuild/win32-ia32": "0.21.5",
+        "@esbuild/win32-x64": "0.21.5"
+      }
+    },
+    "node_modules/escalade": {
+      "version": "3.2.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/estree-walker": {
+      "version": "2.0.2",
+      "license": "MIT"
+    },
+    "node_modules/fast-deep-equal": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+      "license": "MIT"
+    },
+    "node_modules/fast-glob": {
+      "version": "3.3.3",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.stat": "^2.0.2",
+        "@nodelib/fs.walk": "^1.2.3",
+        "glob-parent": "^5.1.2",
+        "merge2": "^1.3.0",
+        "micromatch": "^4.0.8"
+      },
+      "engines": {
+        "node": ">=8.6.0"
+      }
+    },
+    "node_modules/fast-glob/node_modules/glob-parent": {
+      "version": "5.1.2",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/fast-uri": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.0.tgz",
+      "integrity": "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fastify"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fastify"
+        }
+      ],
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/fastq": {
+      "version": "1.20.1",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "reusify": "^1.0.4"
+      }
+    },
+    "node_modules/fdir": {
+      "version": "6.5.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/fill-range": {
+      "version": "7.1.1",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "to-regex-range": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/find-up": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
+      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
+      "license": "MIT",
+      "dependencies": {
+        "locate-path": "^5.0.0",
+        "path-exists": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/follow-redirects": {
+      "version": "1.15.11",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/form-data": {
+      "version": "4.0.5",
+      "license": "MIT",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "es-set-tostringtag": "^2.1.0",
+        "hasown": "^2.0.2",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/fraction.js": {
+      "version": "5.3.4",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "*"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/rawify"
+      }
+    },
+    "node_modules/fsevents": {
+      "version": "2.3.3",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/function-bind": {
+      "version": "1.1.2",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "license": "ISC",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
+    "node_modules/get-intrinsic": {
+      "version": "1.3.0",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "function-bind": "^1.1.2",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/glob-parent": {
+      "version": "6.0.2",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.3"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/gopd": {
+      "version": "1.2.0",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-symbols": {
+      "version": "1.1.0",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-tostringtag": {
+      "version": "1.0.2",
+      "license": "MIT",
+      "dependencies": {
+        "has-symbols": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/hasown": {
+      "version": "2.0.2",
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/he": {
+      "version": "1.2.0",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "he": "bin/he"
+      }
+    },
+    "node_modules/highlight.js": {
+      "version": "11.11.1",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.11.1.tgz",
+      "integrity": "sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/invariant": {
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
+      "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.0.0"
+      }
+    },
+    "node_modules/is-binary-path": {
+      "version": "2.1.0",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "binary-extensions": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/is-core-module": {
+      "version": "2.16.1",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-extglob": {
+      "version": "2.1.1",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/is-glob": {
+      "version": "4.0.3",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-extglob": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-number": {
+      "version": "7.0.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
+    "node_modules/jiti": {
+      "version": "1.21.7",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "jiti": "bin/jiti.js"
+      }
+    },
+    "node_modules/js-tokens": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+      "license": "MIT"
+    },
+    "node_modules/js-yaml": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.1.tgz",
+      "integrity": "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==",
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1"
+      },
+      "bin": {
+        "js-yaml": "bin/js-yaml.js"
+      }
+    },
+    "node_modules/json-schema-traverse": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
+      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
+      "license": "MIT"
+    },
+    "node_modules/jwt-decode": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/jwt-decode/-/jwt-decode-4.0.0.tgz",
+      "integrity": "sha512-+KJGIyHgkGuIq3IEBNftfhW/LfWhXUIY6OmyVWjliu5KH1y0fw7VQ8YndE2O4qZdMSd9SqbnC8GOcZEy0Om7sA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/lilconfig": {
+      "version": "3.1.3",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antonk52"
+      }
+    },
+    "node_modules/lines-and-columns": {
+      "version": "1.2.4",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/locate-path": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
+      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
+      "license": "MIT",
+      "dependencies": {
+        "p-locate": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/loose-envify": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "js-tokens": "^3.0.0 || ^4.0.0"
+      },
+      "bin": {
+        "loose-envify": "cli.js"
+      }
+    },
+    "node_modules/magic-string": {
+      "version": "0.30.21",
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.5"
+      }
+    },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/mdn-data": {
+      "version": "2.12.2",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.12.2.tgz",
+      "integrity": "sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==",
+      "license": "CC0-1.0"
+    },
+    "node_modules/merge2": {
+      "version": "1.4.1",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/micromatch": {
+      "version": "4.0.8",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "braces": "^3.0.3",
+        "picomatch": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=8.6"
+      }
+    },
+    "node_modules/micromatch/node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/minimatch": {
+      "version": "9.0.5",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/moo": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/moo/-/moo-0.5.2.tgz",
+      "integrity": "sha512-iSAJLHYKnX41mKcJKjqvnAN9sf0LMDTXDEvFv+ffuRR9a1MIuXLjMNL6EsnDHSkKLTWNqQQ5uo61P4EbU4NU+Q==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/muggle-string": {
+      "version": "0.3.1",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/mz": {
+      "version": "2.7.0",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "any-promise": "^1.0.0",
+        "object-assign": "^4.0.1",
+        "thenify-all": "^1.0.0"
+      }
+    },
+    "node_modules/nanoid": {
+      "version": "3.3.11",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "bin": {
+        "nanoid": "bin/nanoid.cjs"
+      },
+      "engines": {
+        "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
+      }
+    },
+    "node_modules/nearley": {
+      "version": "2.20.1",
+      "resolved": "https://registry.npmjs.org/nearley/-/nearley-2.20.1.tgz",
+      "integrity": "sha512-+Mc8UaAebFzgV+KpI5n7DasuuQCHA89dmwm7JXw3TV43ukfNQ9DnBH3Mdb2g/I4Fdxc26pwimBWvjIw0UAILSQ==",
+      "license": "MIT",
+      "dependencies": {
+        "commander": "^2.19.0",
+        "moo": "^0.5.0",
+        "railroad-diagrams": "^1.0.0",
+        "randexp": "0.4.6"
+      },
+      "bin": {
+        "nearley-railroad": "bin/nearley-railroad.js",
+        "nearley-test": "bin/nearley-test.js",
+        "nearley-unparse": "bin/nearley-unparse.js",
+        "nearleyc": "bin/nearleyc.js"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://nearley.js.org/#give-to-nearley"
+      }
+    },
+    "node_modules/nearley/node_modules/commander": {
+      "version": "2.20.3",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+      "license": "MIT"
+    },
+    "node_modules/node-releases": {
+      "version": "2.0.27",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/normalize-path": {
+      "version": "3.0.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/nth-check": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
+      "integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "boolbase": "^1.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/nth-check?sponsor=1"
+      }
+    },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/object-hash": {
+      "version": "3.0.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/p-limit": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
+      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+      "license": "MIT",
+      "dependencies": {
+        "p-try": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/p-locate": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
+      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
+      "license": "MIT",
+      "dependencies": {
+        "p-limit": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/p-try": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/papaparse": {
+      "version": "5.5.3",
+      "resolved": "https://registry.npmjs.org/papaparse/-/papaparse-5.5.3.tgz",
+      "integrity": "sha512-5QvjGxYVjxO59MGU2lHVYpRWBBtKHnlIAcSe1uNFCkkptUh63NFRj0FJQm7nR67puEruUci/ZkjmEFrjCAyP4A==",
+      "license": "MIT"
+    },
+    "node_modules/path-browserify": {
+      "version": "1.0.1",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/path-exists": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
+      "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/path-parse": {
+      "version": "1.0.7",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/picocolors": {
+      "version": "1.1.1",
+      "license": "ISC"
+    },
+    "node_modules/picomatch": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/pify": {
+      "version": "2.3.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/pirates": {
+      "version": "4.0.7",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/pngjs": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-5.0.0.tgz",
+      "integrity": "sha512-40QW5YalBNfQo5yRYmiw7Yz6TKKVr3h6970B2YE+3fQpsWcrbj1PzJgxeJ19DRQjhMbKPIuMY8rFaXc8moolVw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/postcss": {
+      "version": "8.5.6",
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "nanoid": "^3.3.11",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      }
+    },
+    "node_modules/postcss-import": {
+      "version": "15.1.0",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "postcss-value-parser": "^4.0.0",
+        "read-cache": "^1.0.0",
+        "resolve": "^1.1.7"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "postcss": "^8.0.0"
+      }
+    },
+    "node_modules/postcss-js": {
+      "version": "4.1.0",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "camelcase-css": "^2.0.1"
+      },
+      "engines": {
+        "node": "^12 || ^14 || >= 16"
+      },
+      "peerDependencies": {
+        "postcss": "^8.4.21"
+      }
+    },
+    "node_modules/postcss-load-config": {
+      "version": "6.0.1",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "lilconfig": "^3.1.1"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "peerDependencies": {
+        "jiti": ">=1.21.0",
+        "postcss": ">=8.0.9",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "jiti": {
+          "optional": true
+        },
+        "postcss": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/postcss-nested": {
+      "version": "6.2.0",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "postcss-selector-parser": "^6.1.1"
+      },
+      "engines": {
+        "node": ">=12.0"
+      },
+      "peerDependencies": {
+        "postcss": "^8.2.14"
+      }
+    },
+    "node_modules/postcss-selector-parser": {
+      "version": "6.1.2",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cssesc": "^3.0.0",
+        "util-deprecate": "^1.0.2"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/postcss-value-parser": {
+      "version": "4.2.0",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/proxy-from-env": {
+      "version": "1.1.0",
+      "license": "MIT"
+    },
+    "node_modules/qrcode": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.5.4.tgz",
+      "integrity": "sha512-1ca71Zgiu6ORjHqFBDpnSMTR2ReToX4l1Au1VFLyVeBTFavzQnv5JxMFr3ukHVKpSrSA2MCk0lNJSykjUfz7Zg==",
+      "license": "MIT",
+      "dependencies": {
+        "dijkstrajs": "^1.0.1",
+        "pngjs": "^5.0.0",
+        "yargs": "^15.3.1"
+      },
+      "bin": {
+        "qrcode": "bin/qrcode"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/queue-microtask": {
+      "version": "1.2.3",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/railroad-diagrams": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/railroad-diagrams/-/railroad-diagrams-1.0.0.tgz",
+      "integrity": "sha512-cz93DjNeLY0idrCNOH6PviZGRN9GJhsdm9hpn1YCS879fj4W+x5IFJhhkRZcwVgMmFF7R82UA/7Oh+R8lLZg6A==",
+      "license": "CC0-1.0"
+    },
+    "node_modules/randexp": {
+      "version": "0.4.6",
+      "resolved": "https://registry.npmjs.org/randexp/-/randexp-0.4.6.tgz",
+      "integrity": "sha512-80WNmd9DA0tmZrw9qQa62GPPWfuXJknrmVmLcxvq4uZBdYqb1wYoKTmnlGUchvVWe0XiLupYkBoXVOxz3C8DYQ==",
+      "license": "MIT",
+      "dependencies": {
+        "discontinuous-range": "1.0.0",
+        "ret": "~0.1.10"
+      },
+      "engines": {
+        "node": ">=0.12"
+      }
+    },
+    "node_modules/read-cache": {
+      "version": "1.0.0",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "pify": "^2.3.0"
+      }
+    },
+    "node_modules/readdirp": {
+      "version": "3.6.0",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "picomatch": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
+    "node_modules/readdirp/node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/require-from-string": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
+      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/require-main-filename": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+      "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg==",
+      "license": "ISC"
+    },
+    "node_modules/resolve": {
+      "version": "1.22.11",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-core-module": "^2.16.1",
+        "path-parse": "^1.0.7",
+        "supports-preserve-symlinks-flag": "^1.0.0"
+      },
+      "bin": {
+        "resolve": "bin/resolve"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/ret": {
+      "version": "0.1.15",
+      "resolved": "https://registry.npmjs.org/ret/-/ret-0.1.15.tgz",
+      "integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.12"
+      }
+    },
+    "node_modules/reusify": {
+      "version": "1.1.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "iojs": ">=1.0.0",
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/rollup": {
+      "version": "4.57.0",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "1.0.8"
+      },
+      "bin": {
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "@rollup/rollup-android-arm-eabi": "4.57.0",
+        "@rollup/rollup-android-arm64": "4.57.0",
+        "@rollup/rollup-darwin-arm64": "4.57.0",
+        "@rollup/rollup-darwin-x64": "4.57.0",
+        "@rollup/rollup-freebsd-arm64": "4.57.0",
+        "@rollup/rollup-freebsd-x64": "4.57.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.57.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.57.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.57.0",
+        "@rollup/rollup-linux-arm64-musl": "4.57.0",
+        "@rollup/rollup-linux-loong64-gnu": "4.57.0",
+        "@rollup/rollup-linux-loong64-musl": "4.57.0",
+        "@rollup/rollup-linux-ppc64-gnu": "4.57.0",
+        "@rollup/rollup-linux-ppc64-musl": "4.57.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.57.0",
+        "@rollup/rollup-linux-riscv64-musl": "4.57.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.57.0",
+        "@rollup/rollup-linux-x64-gnu": "4.57.0",
+        "@rollup/rollup-linux-x64-musl": "4.57.0",
+        "@rollup/rollup-openbsd-x64": "4.57.0",
+        "@rollup/rollup-openharmony-arm64": "4.57.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.57.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.57.0",
+        "@rollup/rollup-win32-x64-gnu": "4.57.0",
+        "@rollup/rollup-win32-x64-msvc": "4.57.0",
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/run-parallel": {
+      "version": "1.2.0",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "queue-microtask": "^1.2.2"
+      }
+    },
+    "node_modules/sax": {
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/sax/-/sax-1.4.4.tgz",
+      "integrity": "sha512-1n3r/tGXO6b6VXMdFT54SHzT9ytu9yr7TaELowdYpMqY/Ao7EnlQGmAQ1+RatX7Tkkdm6hONI2owqNx2aZj5Sw==",
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=11.0.0"
+      }
+    },
+    "node_modules/semver": {
+      "version": "7.7.3",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/set-blocking": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha512-KiKBS8AnWGEyLzofFfmvKwpdPzqiy16LvQfK3yv/fVH7Bj13/wl3JSR1J+rfgRE9q7xUJK4qvgS8raSOeLUehw==",
+      "license": "ISC"
+    },
+    "node_modules/source-map-js": {
+      "version": "1.2.1",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/sql-formatter": {
+      "version": "15.7.0",
+      "resolved": "https://registry.npmjs.org/sql-formatter/-/sql-formatter-15.7.0.tgz",
+      "integrity": "sha512-o2yiy7fYXK1HvzA8P6wwj8QSuwG3e/XcpWht/jIxkQX99c0SVPw0OXdLSV9fHASPiYB09HLA0uq8hokGydi/QA==",
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1",
+        "nearley": "^2.20.1"
+      },
+      "bin": {
+        "sql-formatter": "bin/sql-formatter-cli.cjs"
+      }
+    },
+    "node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/sucrase": {
+      "version": "3.35.1",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.2",
+        "commander": "^4.0.0",
+        "lines-and-columns": "^1.1.6",
+        "mz": "^2.7.0",
+        "pirates": "^4.0.1",
+        "tinyglobby": "^0.2.11",
+        "ts-interface-checker": "^0.1.9"
+      },
+      "bin": {
+        "sucrase": "bin/sucrase",
+        "sucrase-node": "bin/sucrase-node"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      }
+    },
+    "node_modules/supports-preserve-symlinks-flag": {
+      "version": "1.0.0",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/svgo": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/svgo/-/svgo-4.0.0.tgz",
+      "integrity": "sha512-VvrHQ+9uniE+Mvx3+C9IEe/lWasXCU0nXMY2kZeLrHNICuRiC8uMPyM14UEaMOFA5mhyQqEkB02VoQ16n3DLaw==",
+      "license": "MIT",
+      "dependencies": {
+        "commander": "^11.1.0",
+        "css-select": "^5.1.0",
+        "css-tree": "^3.0.1",
+        "css-what": "^6.1.0",
+        "csso": "^5.0.5",
+        "picocolors": "^1.1.1",
+        "sax": "^1.4.1"
+      },
+      "bin": {
+        "svgo": "bin/svgo.js"
+      },
+      "engines": {
+        "node": ">=16"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/svgo"
+      }
+    },
+    "node_modules/svgo/node_modules/commander": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-11.1.0.tgz",
+      "integrity": "sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/tailwindcss": {
+      "version": "3.4.19",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@alloc/quick-lru": "^5.2.0",
+        "arg": "^5.0.2",
+        "chokidar": "^3.6.0",
+        "didyoumean": "^1.2.2",
+        "dlv": "^1.1.3",
+        "fast-glob": "^3.3.2",
+        "glob-parent": "^6.0.2",
+        "is-glob": "^4.0.3",
+        "jiti": "^1.21.7",
+        "lilconfig": "^3.1.3",
+        "micromatch": "^4.0.8",
+        "normalize-path": "^3.0.0",
+        "object-hash": "^3.0.0",
+        "picocolors": "^1.1.1",
+        "postcss": "^8.4.47",
+        "postcss-import": "^15.1.0",
+        "postcss-js": "^4.0.1",
+        "postcss-load-config": "^4.0.2 || ^5.0 || ^6.0",
+        "postcss-nested": "^6.2.0",
+        "postcss-selector-parser": "^6.1.2",
+        "resolve": "^1.22.8",
+        "sucrase": "^3.35.0"
+      },
+      "bin": {
+        "tailwind": "lib/cli.js",
+        "tailwindcss": "lib/cli.js"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/thenify": {
+      "version": "3.3.1",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "any-promise": "^1.0.0"
+      }
+    },
+    "node_modules/thenify-all": {
+      "version": "1.6.0",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "thenify": ">= 3.1.0 < 4"
+      },
+      "engines": {
+        "node": ">=0.8"
+      }
+    },
+    "node_modules/tinyglobby": {
+      "version": "0.2.15",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.3"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/SuperchupuDev"
+      }
+    },
+    "node_modules/to-regex-range": {
+      "version": "5.0.1",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-number": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=8.0"
+      }
+    },
+    "node_modules/ts-interface-checker": {
+      "version": "0.1.13",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
+    "node_modules/typescript": {
+      "version": "5.9.3",
+      "devOptional": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=14.17"
+      }
+    },
+    "node_modules/update-browserslist-db": {
+      "version": "1.2.3",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "escalade": "^3.2.0",
+        "picocolors": "^1.1.1"
+      },
+      "bin": {
+        "update-browserslist-db": "cli.js"
+      },
+      "peerDependencies": {
+        "browserslist": ">= 4.21.0"
+      }
+    },
+    "node_modules/util-deprecate": {
+      "version": "1.0.2",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/uuid": {
+      "version": "13.0.0",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist-node/bin/uuid"
+      }
+    },
+    "node_modules/vite": {
+      "version": "5.4.21",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.21.3",
+        "postcss": "^8.4.43",
+        "rollup": "^4.20.0"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^18.0.0 || >=20.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^18.0.0 || >=20.0.0",
+        "less": "*",
+        "lightningcss": "^1.21.0",
+        "sass": "*",
+        "sass-embedded": "*",
+        "stylus": "*",
+        "sugarss": "*",
+        "terser": "^5.4.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vue": {
+      "version": "3.5.27",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/compiler-dom": "3.5.27",
+        "@vue/compiler-sfc": "3.5.27",
+        "@vue/runtime-dom": "3.5.27",
+        "@vue/server-renderer": "3.5.27",
+        "@vue/shared": "3.5.27"
+      },
+      "peerDependencies": {
+        "typescript": "*"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vue-diff": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/vue-diff/-/vue-diff-1.2.4.tgz",
+      "integrity": "sha512-9z+0uPHigi/DdE3Zhdg1zR3VkiBaDN4czjWa/Zznvizn4znckVqz20p1KytaWq5NJtJ7UnkqRbuWsaCuC1ZHaA==",
+      "license": "ISC",
+      "dependencies": {
+        "@vueuse/core": "^8.3.1",
+        "diff-match-patch": "^1.0.5",
+        "highlight.js": "^11.5.1"
+      }
+    },
+    "node_modules/vue-diff/node_modules/@vueuse/core": {
+      "version": "8.9.4",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-8.9.4.tgz",
+      "integrity": "sha512-B/Mdj9TK1peFyWaPof+Zf/mP9XuGAngaJZBwPaXBvU3aCTZlx3ltlrFFFyMV4iGBwsjSCeUCgZrtkEj9dS2Y3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.14",
+        "@vueuse/metadata": "8.9.4",
+        "@vueuse/shared": "8.9.4",
+        "vue-demi": "*"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.1.0",
+        "vue": "^2.6.0 || ^3.2.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        },
+        "vue": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vue-diff/node_modules/@vueuse/shared": {
+      "version": "8.9.4",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-8.9.4.tgz",
+      "integrity": "sha512-wt+T30c4K6dGRMVqPddexEVLa28YwxW5OFIPmzUHICjphfAuBFTTdDoyqREZNDOFJZ44ARH1WWQNCUK8koJ+Ag==",
+      "license": "MIT",
+      "dependencies": {
+        "vue-demi": "*"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.1.0",
+        "vue": "^2.6.0 || ^3.2.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        },
+        "vue": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vue-diff/node_modules/vue-demi": {
+      "version": "0.14.10",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
+      "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vue-router": {
+      "version": "4.6.4",
+      "license": "MIT",
+      "dependencies": {
+        "@vue/devtools-api": "^6.6.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/posva"
+      },
+      "peerDependencies": {
+        "vue": "^3.5.0"
+      }
+    },
+    "node_modules/vue-template-compiler": {
+      "version": "2.7.16",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "de-indent": "^1.0.2",
+        "he": "^1.2.0"
+      }
+    },
+    "node_modules/vue-tsc": {
+      "version": "1.8.27",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@volar/typescript": "~1.11.1",
+        "@vue/language-core": "1.8.27",
+        "semver": "^7.5.4"
+      },
+      "bin": {
+        "vue-tsc": "bin/vue-tsc.js"
+      },
+      "peerDependencies": {
+        "typescript": "*"
+      }
+    },
+    "node_modules/which-module": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.1.tgz",
+      "integrity": "sha512-iBdZ57RDvnOR9AGBhML2vFZf7h8vmBjhoaZqODJBFWHVtKkDmKuHai3cx5PgVMrX5YDNp27AofYbAwctSS+vhQ==",
+      "license": "ISC"
+    },
+    "node_modules/wrap-ansi": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/y18n": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
+      "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==",
+      "license": "ISC"
+    },
+    "node_modules/yaml": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.2.tgz",
+      "integrity": "sha512-mplynKqc1C2hTVYxd0PU2xQAc22TI1vShAYGksCCfxbn/dFwnHTNi1bvYsBTkhdUNtGIf5xNOg938rrSSYvS9A==",
+      "license": "ISC",
+      "bin": {
+        "yaml": "bin.mjs"
+      },
+      "engines": {
+        "node": ">= 14.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/eemeli"
+      }
+    },
+    "node_modules/yargs": {
+      "version": "15.4.1",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-15.4.1.tgz",
+      "integrity": "sha512-aePbxDmcYW++PaqBsJ+HYUFwCdv4LVvdnhBy78E57PIor8/OVvhMrADFFEDh8DHDFRv/O9i3lPhsENjO7QX0+A==",
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^6.0.0",
+        "decamelize": "^1.2.0",
+        "find-up": "^4.1.0",
+        "get-caller-file": "^2.0.1",
+        "require-directory": "^2.1.1",
+        "require-main-filename": "^2.0.0",
+        "set-blocking": "^2.0.0",
+        "string-width": "^4.2.0",
+        "which-module": "^2.0.0",
+        "y18n": "^4.0.0",
+        "yargs-parser": "^18.1.2"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "13.1.2",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.2.tgz",
+      "integrity": "sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==",
+      "license": "ISC",
+      "dependencies": {
+        "camelcase": "^5.0.0",
+        "decamelize": "^1.2.0"
+      }
+    },
+    "node_modules/yargs/node_modules/yargs-parser": {
+      "version": "18.1.3",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
+      "integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
+      "license": "ISC",
+      "dependencies": {
+        "camelcase": "^5.0.0",
+        "decamelize": "^1.2.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    }
+  }
+}
diff --git a/frontend/package.json b/frontend/package.json
new file mode 100644
index 0000000..a8cfc43
--- /dev/null
+++ b/frontend/package.json
@@ -0,0 +1,40 @@
+{
+  "name": "web-utils-frontend",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vue-tsc && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@faker-js/faker": "^10.2.0",
+    "@heroicons/vue": "^2.1.1",
+    "@types/uuid": "^11.0.0",
+    "axios": "^1.6.0",
+    "composerize": "^1.7.5",
+    "cronstrue": "^3.9.0",
+    "decomposerize": "^1.4.4",
+    "diff": "^8.0.3",
+    "js-yaml": "^4.1.1",
+    "jwt-decode": "^4.0.0",
+    "papaparse": "^5.5.3",
+    "qrcode": "^1.5.4",
+    "sql-formatter": "^15.7.0",
+    "svgo": "^4.0.0",
+    "uuid": "^13.0.0",
+    "vue": "^3.4.0",
+    "vue-diff": "^1.2.4",
+    "vue-router": "^4.2.5"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^5.0.0",
+    "autoprefixer": "^10.4.16",
+    "postcss": "^8.4.31",
+    "tailwindcss": "^3.3.5",
+    "typescript": "^5.2.0",
+    "vite": "^5.0.0",
+    "vue-tsc": "^1.8.0"
+  }
+}
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
new file mode 100644
index 0000000..6da7792
--- /dev/null
+++ b/frontend/src/App.vue
@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import GlobalNavBar from './components/GlobalNavBar.vue'
+</script>
+
+<template>
+  <div class="min-h-screen bg-gray-100 flex flex-col">
+    <GlobalNavBar />
+    
+    <main class="flex-1 max-w-7xl w-full mx-auto p-6">
+      <router-view></router-view>
+    </main>
+    
+    <footer class="bg-white border-t border-gray-200 mt-auto">
+      <div class="max-w-7xl mx-auto py-6 px-4 text-center text-sm text-gray-500">
+        &copy; 2026 Web Utils. Powered by Vue 3 & FastAPI.
+      </div>
+    </footer>
+  </div>
+</template>
\ No newline at end of file
diff --git a/frontend/src/components/GlobalNavBar.vue b/frontend/src/components/GlobalNavBar.vue
new file mode 100644
index 0000000..51941d6
--- /dev/null
+++ b/frontend/src/components/GlobalNavBar.vue
@@ -0,0 +1,32 @@
+<script setup lang="ts">
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+</script>
+
+<template>
+  <nav class="bg-gray-800 text-white shadow-md">
+    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div class="flex items-center justify-between h-16">
+        <!-- Logo / Home Link -->
+        <div class="flex items-center cursor-pointer" @click="router.push('/')">
+          <span class="text-xl font-bold tracking-tight">Web Utils 2026</span>
+        </div>
+        
+        <!-- Navigation Links -->
+        <div class="hidden md:block">
+          <div class="ml-10 flex items-baseline space-x-4">
+            <router-link 
+              to="/" 
+              class="px-3 py-2 rounded-md text-sm font-medium hover:bg-gray-700 transition"
+              active-class="bg-gray-900 text-white"
+            >
+              Dashboard
+            </router-link>
+            <!-- Add more global links here if needed -->
+          </div>
+        </div>
+      </div>
+    </div>
+  </nav>
+</template>
diff --git a/frontend/src/components/ToolLayout.vue b/frontend/src/components/ToolLayout.vue
new file mode 100644
index 0000000..03001d8
--- /dev/null
+++ b/frontend/src/components/ToolLayout.vue
@@ -0,0 +1,37 @@
+<template>
+  <div class="h-full flex flex-col bg-gray-50 dark:bg-gray-900">
+    <!-- Header -->
+    <header class="bg-white dark:bg-gray-800 shadow-sm border-b border-gray-200 dark:border-gray-700 px-6 py-4">
+      <div class="flex items-center justify-between">
+        <div>
+          <slot name="header">
+            <h1 class="text-xl font-semibold text-gray-900 dark:text-white">Tool Name</h1>
+            <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Tool description goes here.</p>
+          </slot>
+        </div>
+        <div class="flex items-center space-x-3">
+          <slot name="actions"></slot>
+        </div>
+      </div>
+    </header>
+
+    <div class="flex-1 flex overflow-hidden">
+      <!-- Options Sidebar (Optional) -->
+      <aside v-if="$slots.options" class="w-80 bg-white dark:bg-gray-800 border-r border-gray-200 dark:border-gray-700 overflow-y-auto p-6 flex-shrink-0 z-10">
+        <h2 class="text-xs font-semibold text-gray-400 uppercase tracking-wider mb-4">Configuration</h2>
+        <slot name="options"></slot>
+      </aside>
+
+      <!-- Main Content -->
+      <main class="flex-1 overflow-auto p-6 relative">
+        <div class="max-w-[90%] mx-auto h-full">
+          <slot name="content"></slot>
+        </div>
+      </main>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+// ToolLayout.vue - Shared wrapper for all Web Utils tools
+</script>
diff --git a/frontend/src/main.ts b/frontend/src/main.ts
new file mode 100644
index 0000000..1ef63cd
--- /dev/null
+++ b/frontend/src/main.ts
@@ -0,0 +1,11 @@
+import { createApp } from 'vue'
+import VueDiff from 'vue-diff'
+import 'vue-diff/dist/index.css'
+import './style.css'
+import App from './App.vue'
+import router from './router'
+
+const app = createApp(App)
+app.use(router)
+app.use(VueDiff)
+app.mount('#app')
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
new file mode 100644
index 0000000..2a2e0cb
--- /dev/null
+++ b/frontend/src/router/index.ts
@@ -0,0 +1,121 @@
+import { createRouter, createWebHistory } from 'vue-router'
+import Dashboard from '../views/Dashboard.vue'
+
+// Tools
+import UrlParser from '../views/tools/UrlParser.vue'
+import JsonFormatter from '../views/tools/JsonFormatter.vue'
+import UuidGen from '../views/tools/UuidGen.vue'
+import PngCompressor from '../views/tools/PngCompressor.vue'
+import PasswordGen from '../views/tools/PasswordGen.vue'
+import JwtDebugger from '../views/tools/JwtDebugger.vue'
+import CronGen from '../views/tools/CronGen.vue'
+import SqlFormatter from '../views/tools/SqlFormatter.vue'
+import DiffViewer from '../views/tools/DiffViewer.vue'
+import QrGenerator from '../views/tools/QrGenerator.vue'
+import Base64Encoder from '../views/tools/Base64Encoder.vue'
+import JsonConverter from '../views/tools/JsonConverter.vue'
+import RegexTester from '../views/tools/RegexTester.vue'
+import DockerConverter from '../views/tools/DockerConverter.vue'
+import MockDataGen from '../views/tools/MockDataGen.vue'
+import SvgOptimizer from '../views/tools/SvgOptimizer.vue'
+import VideoToGif from '../views/tools/VideoToGif.vue'
+
+const routes = [
+  {
+    path: '/',
+    name: 'Dashboard',
+    component: Dashboard
+  },
+  {
+    path: '/tools/url-parser',
+    name: 'URL Encoder/Decoder',
+    component: UrlParser
+  },
+  {
+    path: '/tools/json-formatter',
+    name: 'JSON Formatter',
+    component: JsonFormatter
+  },
+  {
+    path: '/tools/py-uuid',
+    name: 'UUID Generator',
+    component: UuidGen
+  },
+  {
+    path: '/tools/png-compressor',
+    name: 'PNG Compressor',
+    component: PngCompressor
+  },
+  {
+    path: '/tools/password-generator',
+    name: 'Password Generator',
+    component: PasswordGen
+  },
+  {
+    path: '/tools/jwt-debugger',
+    name: 'JWT Debugger',
+    component: JwtDebugger
+  },
+  {
+    path: '/tools/cron-generator',
+    name: 'Cron Schedule Generator',
+    component: CronGen
+  },
+  {
+    path: '/tools/sql-formatter',
+    name: 'SQL Formatter',
+    component: SqlFormatter
+  },
+  {
+    path: '/tools/diff-viewer',
+    name: 'Diff Viewer',
+    component: DiffViewer
+  },
+  {
+    path: '/tools/qr-generator',
+    name: 'QR Code Generator',
+    component: QrGenerator
+  },
+  {
+    path: '/tools/base64-encoder',
+    name: 'Base64 File Encoder',
+    component: Base64Encoder
+  },
+  {
+    path: '/tools/json-converter',
+    name: 'JSON Converter',
+    component: JsonConverter
+  },
+  {
+    path: '/tools/regex-tester',
+    name: 'Regex Tester',
+    component: RegexTester
+  },
+  {
+    path: '/tools/docker-converter',
+    name: 'Docker Converter',
+    component: DockerConverter
+  },
+  {
+    path: '/tools/mock-data-generator',
+    name: 'Mock Data Generator',
+    component: MockDataGen
+  },
+  {
+    path: '/tools/svg-optimizer',
+    name: 'SVG Optimizer',
+    component: SvgOptimizer
+  },
+  {
+    path: '/tools/video-to-gif',
+    name: 'Video to GIF',
+    component: VideoToGif
+  }
+]
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes
+})
+
+export default router
diff --git a/frontend/src/style.css b/frontend/src/style.css
new file mode 100644
index 0000000..02f8d48
--- /dev/null
+++ b/frontend/src/style.css
@@ -0,0 +1,14 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  input[type="text"],
+  input[type="number"],
+  input[type="password"],
+  input[type="email"],
+  textarea,
+  select {
+    @apply border border-gray-300 dark:border-gray-600 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100;
+  }
+}
diff --git a/frontend/src/utils/csvDownloader.ts b/frontend/src/utils/csvDownloader.ts
new file mode 100644
index 0000000..616c3bb
--- /dev/null
+++ b/frontend/src/utils/csvDownloader.ts
@@ -0,0 +1,68 @@
+/**
+ * Converts an array of strings or objects to CSV and triggers a download.
+ * @param data Array of data (strings or objects)
+ * @param filename Name of the file to download (without extension)
+ * @param headers Optional headers for object arrays. If not provided, keys of the first object are used.
+ */
+export const downloadCsv = (data: any[], filename: string, headers?: string[]) => {
+  if (!data || data.length === 0) {
+    alert("No data to download.");
+    return;
+  }
+
+  // Add BOM for Excel compatibility with UTF-8
+  let csvContent = "\uFEFF";
+
+  // Helper to safely escape CSV fields
+  const escapeCsvField = (field: any): string => {
+    if (field === null || field === undefined) {
+      return '""';
+    }
+    const stringField = String(field);
+    // Escape double quotes by doubling them (" -> "")
+    return `"${stringField.replace(/"/g, '""')}"`;
+  };
+
+  // 1. Determine Headers
+  let csvHeaders: string[] = [];
+  const isSimpleArray = typeof data[0] !== 'object' || data[0] === null;
+
+  if (headers) {
+    csvHeaders = headers;
+  } else if (!isSimpleArray) {
+    csvHeaders = Object.keys(data[0]);
+  } else {
+    csvHeaders = ["Value"];
+  }
+  
+  // Write Headers
+  csvContent += csvHeaders.map(escapeCsvField).join(",") + "\n";
+
+  // 2. Build Rows
+  data.forEach((row) => {
+    if (isSimpleArray) {
+      csvContent += escapeCsvField(row) + "\n";
+    } else {
+      const rowString = csvHeaders.map(header => {
+        return escapeCsvField(row[header]);
+      }).join(",");
+      csvContent += rowString + "\n";
+    }
+  });
+
+  // 3. Trigger Download
+  const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
+  const link = document.createElement("a");
+  
+  if (navigator.msSaveBlob) { // IE 10+
+    navigator.msSaveBlob(blob, `${filename}.csv`);
+  } else {
+    const url = URL.createObjectURL(blob);
+    link.setAttribute("href", url);
+    link.setAttribute("download", `${filename}.csv`);
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+    URL.revokeObjectURL(url); // Clean up memory
+  }
+};
diff --git a/frontend/src/views/Dashboard.vue b/frontend/src/views/Dashboard.vue
new file mode 100644
index 0000000..3dadeb3
--- /dev/null
+++ b/frontend/src/views/Dashboard.vue
@@ -0,0 +1,121 @@
+<script setup lang="ts">
+import { ref, computed, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+
+interface Tool {
+  id: string;
+  name: string;
+  description: string;
+  tags: string[];
+  type: 'client' | 'server';
+}
+
+const router = useRouter()
+const tools = ref<Tool[]>([])
+const searchQuery = ref('')
+const loading = ref(true)
+
+// Fetch tools from Backend Registry
+const fetchTools = async () => {
+  try {
+    const res = await fetch('/api/registry')
+    if (res.ok) {
+      tools.value = await res.json()
+    }
+  } catch (e) {
+    console.error("Failed to fetch registry:", e)
+  } finally {
+    loading.value = false
+  }
+}
+
+onMounted(() => {
+  fetchTools()
+})
+
+const filteredTools = computed(() => {
+  const q = searchQuery.value.toLowerCase()
+  return tools.value.filter(t => 
+    t.name.toLowerCase().includes(q) || 
+    t.description.toLowerCase().includes(q) ||
+    t.tags.some(tag => tag.toLowerCase().includes(q))
+  )
+})
+
+const navigateToTool = (toolId: string) => {
+  router.push(`/tools/${toolId}`)
+}
+
+const getTagColor = (type: string) => {
+  return type === 'server' 
+    ? 'bg-orange-50 text-orange-700 border-orange-200' 
+    : 'bg-blue-50 text-blue-700 border-blue-200'
+}
+</script>
+
+<template>
+  <div>
+    <div class="mb-12 text-center">
+      <h1 class="text-4xl font-extrabold text-gray-800 mb-4">Web Utils 2026</h1>
+      <p class="text-lg text-gray-600 max-w-2xl mx-auto">
+        A powerful collection of developer utilities, combining the speed of Vue 3 with the capabilities of Python.
+      </p>
+    </div>
+
+    <!-- Search -->
+    <div class="mb-10 max-w-2xl mx-auto">
+      <div class="relative">
+        <input 
+          v-model="searchQuery"
+          type="text" 
+          placeholder="Search for tools..." 
+          class="w-full pl-12 pr-4 py-4 rounded-xl border border-gray-200 focus:ring-4 focus:ring-blue-100 focus:border-blue-500 shadow-sm text-lg transition"
+        >
+        <div class="absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none">
+          <svg class="h-6 w-6 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
+        </div>
+      </div>
+    </div>
+
+    <!-- Grid -->
+    <div v-if="loading" class="text-center py-12">
+      <div class="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-500 mx-auto"></div>
+      <p class="mt-4 text-gray-500">Loading tools...</p>
+    </div>
+
+    <div v-else class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+      <div 
+        v-for="tool in filteredTools" 
+        :key="tool.id"
+        @click="navigateToTool(tool.id)"
+        class="bg-white rounded-xl shadow-sm hover:shadow-lg hover:-translate-y-1 transition-all duration-200 cursor-pointer border border-gray-100 overflow-hidden flex flex-col h-full"
+      >
+        <div class="p-6 flex-1">
+          <div class="flex justify-between items-start mb-4">
+            <h3 class="text-xl font-bold text-gray-800">{{ tool.name }}</h3>
+            <span class="px-2 py-1 rounded-md text-xs font-bold uppercase tracking-wide border" :class="getTagColor(tool.type)">
+              {{ tool.type }}
+            </span>
+          </div>
+          <p class="text-gray-600 text-sm mb-4 line-clamp-2">{{ tool.description }}</p>
+          <div class="flex flex-wrap gap-2">
+            <span v-for="tag in tool.tags" :key="tag" class="px-2 py-1 bg-gray-100 text-gray-600 text-xs rounded font-medium">
+              #{{ tag }}
+            </span>
+          </div>
+        </div>
+        <div class="bg-gray-50 px-6 py-3 border-t border-gray-100 text-right group">
+          <span class="text-blue-600 text-sm font-medium group-hover:text-blue-800 transition flex items-center justify-end">
+            Open Tool <svg class="w-4 h-4 ml-1 transform group-hover:translate-x-1 transition" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path></svg>
+          </span>
+        </div>
+      </div>
+    </div>
+
+    <div v-if="!loading && filteredTools.length === 0" class="text-center py-16 bg-white rounded-xl border border-dashed border-gray-300">
+      <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
+      <p class="mt-4 text-gray-500 text-lg">No tools found matching "{{ searchQuery }}"</p>
+      <button @click="searchQuery = ''" class="mt-2 text-blue-600 hover:text-blue-800 font-medium">Clear search</button>
+    </div>
+  </div>
+</template>
\ No newline at end of file
diff --git a/frontend/src/views/tools/Base64Encoder.vue b/frontend/src/views/tools/Base64Encoder.vue
new file mode 100644
index 0000000..f4aa129
--- /dev/null
+++ b/frontend/src/views/tools/Base64Encoder.vue
@@ -0,0 +1,103 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">Base64 File Encoder</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Convert files to Base64 strings for easy embedding.</p>
+    </template>
+    
+    <template #content>
+      <div class="max-w-5xl mx-auto space-y-6">
+        
+        <!-- Drop Zone -->
+        <div 
+          class="border-2 border-dashed border-gray-300 dark:border-gray-700 rounded-lg p-12 text-center hover:border-blue-500 dark:hover:border-blue-500 transition-colors cursor-pointer"
+          @click="triggerFileInput"
+          @drop.prevent="handleDrop"
+          @dragover.prevent
+        >
+          <div class="space-y-2">
+            <svg class="mx-auto h-12 w-12 text-gray-400" stroke="currentColor" fill="none" viewBox="0 0 48 48">
+              <path d="M28 8H12a4 4 0 00-4 4v20m32-12v8m0 0v8a4 4 0 01-4 4H12a4 4 0 01-4-4v-4m32-4l-3.172-3.172a4 4 0 00-5.656 0L28 28M8 32l9.172-9.172a4 4 0 015.656 0L28 28m0 0l4 4m4-24h8m-4-4v8m-12 4h.02" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+            <div class="text-gray-600 dark:text-gray-300">
+              <span class="font-medium text-blue-600 hover:text-blue-500">Upload a file</span> or drag and drop
+            </div>
+            <p class="text-xs text-gray-500 dark:text-gray-400">Any file up to 5MB</p>
+          </div>
+          <input ref="fileInput" type="file" class="hidden" @change="handleFileSelect" />
+        </div>
+
+        <!-- Result -->
+        <div v-if="result" class="space-y-3">
+          <div class="flex items-center justify-between">
+            <h3 class="text-sm font-medium text-gray-700 dark:text-gray-300">Base64 Output</h3>
+            <button 
+              @click="copyToClipboard"
+              class="inline-flex items-center px-3 py-1.5 border border-transparent text-xs font-medium rounded-md text-blue-700 bg-blue-100 hover:bg-blue-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+            >
+              <span v-if="copied">Copied!</span>
+              <span v-else>Copy</span>
+            </button>
+          </div>
+          
+          <textarea 
+            v-model="result" 
+            readonly 
+            rows="8"
+            class="w-full px-3 py-2 bg-gray-50 dark:bg-gray-900 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm font-mono text-xs break-all"
+          ></textarea>
+          
+          <div class="text-xs text-gray-500">
+            Preview: <span class="font-mono">{{ result.substring(0, 50) }}...</span>
+          </div>
+        </div>
+
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const fileInput = ref<HTMLInputElement | null>(null);
+const result = ref('');
+const copied = ref(false);
+
+const triggerFileInput = () => {
+  fileInput.value?.click();
+};
+
+const processFile = (file: File) => {
+  if (!file) return;
+  const reader = new FileReader();
+  reader.onload = (e) => {
+    result.value = e.target?.result as string;
+  };
+  reader.readAsDataURL(file);
+};
+
+const handleFileSelect = (event: Event) => {
+  const target = event.target as HTMLInputElement;
+  if (target.files && target.files[0]) {
+    processFile(target.files[0]);
+  }
+};
+
+const handleDrop = (event: DragEvent) => {
+  if (event.dataTransfer?.files && event.dataTransfer.files[0]) {
+    processFile(event.dataTransfer.files[0]);
+  }
+};
+
+const copyToClipboard = async () => {
+  try {
+    await navigator.clipboard.writeText(result.value);
+    copied.value = true;
+    setTimeout(() => copied.value = false, 2000);
+  } catch (err) {
+    console.error('Failed to copy', err);
+  }
+};
+</script>
diff --git a/frontend/src/views/tools/CronGen.vue b/frontend/src/views/tools/CronGen.vue
new file mode 100644
index 0000000..88b390e
--- /dev/null
+++ b/frontend/src/views/tools/CronGen.vue
@@ -0,0 +1,67 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">Cron Schedule Generator</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Generate and explain cron expressions.</p>
+    </template>
+    
+    <template #content>
+      <div class="max-w-4xl mx-auto space-y-6">
+        
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Cron Expression</label>
+          <div class="relative">
+            <input 
+              v-model="cronExpression"
+              type="text" 
+              class="w-full px-4 py-3 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-lg"
+              placeholder="*/5 * * * *"
+            />
+          </div>
+        </div>
+
+        <div class="bg-blue-50 dark:bg-blue-900/20 p-4 rounded-md border border-blue-100 dark:border-blue-800">
+          <h3 class="text-sm font-medium text-blue-800 dark:text-blue-300 mb-1">Human Readable</h3>
+          <p class="text-lg text-blue-900 dark:text-blue-100 font-medium">
+            {{ humanReadable || 'Invalid cron expression' }}
+          </p>
+        </div>
+
+        <div class="space-y-4">
+           <h3 class="text-sm font-medium text-gray-700 dark:text-gray-300">Quick Presets</h3>
+           <div class="grid grid-cols-2 sm:grid-cols-3 gap-3">
+             <button v-for="preset in presets" :key="preset.val" @click="cronExpression = preset.val" class="px-3 py-2 text-xs font-medium text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50 dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 dark:hover:bg-gray-700">
+               {{ preset.label }}
+             </button>
+           </div>
+        </div>
+
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue';
+import cronstrue from 'cronstrue';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const cronExpression = ref('*/5 * * * *');
+
+const presets = [
+  { label: 'Every Minute', val: '* * * * *' },
+  { label: 'Every 5 Minutes', val: '*/5 * * * *' },
+  { label: 'Every Hour', val: '0 * * * *' },
+  { label: 'Every Day at Midnight', val: '0 0 * * *' },
+  { label: 'Every Week (Sun)', val: '0 0 * * 0' },
+  { label: 'Every Month (1st)', val: '0 0 1 * *' },
+];
+
+const humanReadable = computed(() => {
+  try {
+    return cronstrue.toString(cronExpression.value);
+  } catch (e) {
+    return '';
+  }
+});
+</script>
diff --git a/frontend/src/views/tools/DiffViewer.vue b/frontend/src/views/tools/DiffViewer.vue
new file mode 100644
index 0000000..b8bc61a
--- /dev/null
+++ b/frontend/src/views/tools/DiffViewer.vue
@@ -0,0 +1,92 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">Diff Viewer</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Compare two text blocks and see differences side-by-side.</p>
+    </template>
+    
+    <template #options>
+      <div class="space-y-4">
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Mode</label>
+          <select v-model="mode" class="w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm">
+            <option value="split">Split (Side-by-Side)</option>
+            <option value="unified">Unified (Inline)</option>
+          </select>
+        </div>
+        
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Language</label>
+          <select v-model="language" class="w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm">
+            <option value="plaintext">Plain Text</option>
+            <option value="json">JSON</option>
+            <option value="javascript">JavaScript</option>
+            <option value="typescript">TypeScript</option>
+            <option value="python">Python</option>
+            <option value="html">HTML</option>
+            <option value="css">CSS</option>
+          </select>
+        </div>
+      </div>
+    </template>
+
+    <template #content>
+      <div class="h-full flex flex-col space-y-4">
+        <div class="grid grid-cols-2 gap-4 h-1/3 min-h-[150px]">
+          <div class="flex flex-col">
+            <label class="text-xs font-medium text-gray-500 mb-1">Original</label>
+            <textarea
+              v-model="prev"
+              class="flex-1 w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-xs resize-none"
+              placeholder="Paste original text here..."
+            ></textarea>
+          </div>
+          <div class="flex flex-col">
+            <label class="text-xs font-medium text-gray-500 mb-1">Modified</label>
+            <textarea
+              v-model="current"
+              class="flex-1 w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-xs resize-none"
+              placeholder="Paste new text here..."
+            ></textarea>
+          </div>
+        </div>
+        
+        <div class="flex-1 border border-gray-200 dark:border-gray-700 rounded-md overflow-hidden bg-white dark:bg-gray-900">
+          <Diff
+            :mode="mode"
+            :theme="isDark ? 'dark' : 'light'"
+            :language="language"
+            :prev="prev"
+            :current="current"
+            class="h-full text-xs"
+          />
+        </div>
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const mode = ref('split');
+const language = ref('plaintext');
+const prev = ref('');
+const current = ref('');
+
+// Simple dark mode detection
+const isDark = computed(() => window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches);
+</script>
+
+<style>
+/* Vue Diff Overrides if needed */
+.vue-diff-theme-light {
+  --diff-background: #ffffff;
+  --diff-text: #1f2937;
+}
+.vue-diff-theme-dark {
+  --diff-background: #111827;
+  --diff-text: #e5e7eb;
+}
+</style>
diff --git a/frontend/src/views/tools/DockerConverter.vue b/frontend/src/views/tools/DockerConverter.vue
new file mode 100644
index 0000000..ccc52ff
--- /dev/null
+++ b/frontend/src/views/tools/DockerConverter.vue
@@ -0,0 +1,75 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">Docker Converter</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Convert between 'docker run' commands and Docker Compose YAML.</p>
+    </template>
+    
+    <template #content>
+      <div class="h-full flex flex-col space-y-4">
+        
+        <!-- Docker Run Input -->
+        <div class="flex-1 flex flex-col">
+          <div class="flex items-center justify-between mb-2">
+            <label class="text-sm font-medium text-gray-700 dark:text-gray-300">Docker Run Command</label>
+            <button @click="convertToCompose" class="text-xs text-blue-600 hover:text-blue-500">Convert to Compose ↓</button>
+          </div>
+          <textarea
+            v-model="dockerRun"
+            class="flex-1 w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-xs resize-none"
+            placeholder="docker run -d -p 80:80 nginx"
+          ></textarea>
+        </div>
+
+        <!-- Compose Output -->
+        <div class="flex-1 flex flex-col">
+          <div class="flex items-center justify-between mb-2">
+             <label class="text-sm font-medium text-gray-700 dark:text-gray-300">Docker Compose (YAML)</label>
+             <button @click="convertToRun" class="text-xs text-blue-600 hover:text-blue-500">Convert to Run ↑</button>
+          </div>
+          <textarea
+            v-model="dockerCompose"
+            class="flex-1 w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-purple-500 focus:border-purple-500 font-mono text-xs resize-none"
+            placeholder="version: '3.3'&#10;services:..."
+          ></textarea>
+        </div>
+
+        <div v-if="error" class="text-red-500 text-xs">{{ error }}</div>
+
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import composerize from 'composerize';
+import decomposerize from 'decomposerize';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const dockerRun = ref('');
+const dockerCompose = ref('');
+const error = ref('');
+
+const convertToCompose = () => {
+  if (!dockerRun.value) return;
+  try {
+    dockerCompose.value = composerize(dockerRun.value);
+    error.value = '';
+  } catch (e: any) {
+    error.value = 'Error converting to Compose: ' + e.message;
+  }
+};
+
+const convertToRun = () => {
+  if (!dockerCompose.value) return;
+  try {
+    // Decomposerize types might be missing or different
+    const result = decomposerize(dockerCompose.value);
+    dockerRun.value = result;
+    error.value = '';
+  } catch (e: any) {
+    error.value = 'Error converting to Run: ' + e.message;
+  }
+};
+</script>
diff --git a/frontend/src/views/tools/JsonConverter.vue b/frontend/src/views/tools/JsonConverter.vue
new file mode 100644
index 0000000..3f9ff14
--- /dev/null
+++ b/frontend/src/views/tools/JsonConverter.vue
@@ -0,0 +1,120 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">JSON / CSV / YAML Converter</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Convert data formats bi-directionally. Edit any field to update the others.</p>
+    </template>
+    
+    <template #content>
+      <div class="h-full grid grid-cols-1 lg:grid-cols-3 gap-4">
+        
+        <!-- JSON Input -->
+        <div class="flex flex-col h-full">
+          <div class="flex items-center justify-between mb-2">
+            <label class="text-sm font-medium text-gray-700 dark:text-gray-300">JSON</label>
+            <span v-if="jsonError" class="text-xs text-red-500">Invalid JSON</span>
+          </div>
+          <textarea
+            v-model="json"
+            @input="updateFrom('json')"
+            class="flex-1 w-full h-full min-h-[400px] px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-xs resize-none"
+            placeholder='[{"id": 1, "name": "John"}]'
+          ></textarea>
+        </div>
+
+        <!-- YAML Input -->
+        <div class="flex flex-col h-full">
+          <div class="flex items-center justify-between mb-2">
+            <label class="text-sm font-medium text-gray-700 dark:text-gray-300">YAML</label>
+            <span v-if="yamlError" class="text-xs text-red-500">Invalid YAML</span>
+          </div>
+          <textarea
+            v-model="yaml"
+            @input="updateFrom('yaml')"
+            class="flex-1 w-full h-full min-h-[400px] px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-purple-500 focus:border-purple-500 font-mono text-xs resize-none"
+            placeholder="- id: 1&#10;  name: John"
+          ></textarea>
+        </div>
+
+        <!-- CSV Input -->
+        <div class="flex flex-col h-full">
+          <div class="flex items-center justify-between mb-2">
+            <label class="text-sm font-medium text-gray-700 dark:text-gray-300">CSV</label>
+            <span v-if="csvError" class="text-xs text-red-500">Invalid CSV</span>
+          </div>
+          <textarea
+            v-model="csv"
+            @input="updateFrom('csv')"
+            class="flex-1 w-full h-full min-h-[400px] px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-green-500 focus:border-green-500 font-mono text-xs resize-none"
+            placeholder="id,name&#10;1,John"
+          ></textarea>
+        </div>
+
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import yamljs from 'js-yaml';
+import Papa from 'papaparse';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const json = ref('');
+const yaml = ref('');
+const csv = ref('');
+
+const jsonError = ref(false);
+const yamlError = ref(false);
+const csvError = ref(false);
+
+const updateFrom = (source: 'json' | 'yaml' | 'csv') => {
+  let data: any = null;
+  
+  // 1. Parse Source to Object
+  try {
+    if (source === 'json') {
+      data = JSON.parse(json.value);
+      jsonError.value = false;
+    } else if (source === 'yaml') {
+      data = yamljs.load(yaml.value);
+      yamlError.value = false;
+    } else if (source === 'csv') {
+      const result = Papa.parse(csv.value, { header: true, skipEmptyLines: true });
+      if (result.errors.length) throw new Error('CSV Error');
+      data = result.data;
+      csvError.value = false;
+    }
+  } catch (e) {
+    if (source === 'json') jsonError.value = true;
+    if (source === 'yaml') yamlError.value = true;
+    if (source === 'csv') csvError.value = true;
+    return; // Stop if invalid
+  }
+
+  // 2. Update Targets
+  if (source !== 'json') {
+    try {
+      json.value = JSON.stringify(data, null, 2);
+      jsonError.value = false;
+    } catch { json.value = ''; }
+  }
+
+  if (source !== 'yaml') {
+    try {
+      yaml.value = yamljs.dump(data);
+      yamlError.value = false;
+    } catch { yaml.value = ''; }
+  }
+
+  if (source !== 'csv') {
+    try {
+      // Papa unparse expects array of objects
+      const arrayData = Array.isArray(data) ? data : [data];
+      csv.value = Papa.unparse(arrayData);
+      csvError.value = false;
+    } catch { csv.value = ''; }
+  }
+};
+</script>
diff --git a/frontend/src/views/tools/JsonFormatter.vue b/frontend/src/views/tools/JsonFormatter.vue
new file mode 100644
index 0000000..b5e3b50
--- /dev/null
+++ b/frontend/src/views/tools/JsonFormatter.vue
@@ -0,0 +1,57 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const input = ref('{"name":"Gemini","type":"AI"}')
+const output = ref('')
+const error = ref('')
+
+const format = () => {
+  try {
+    const parsed = JSON.parse(input.value)
+    output.value = JSON.stringify(parsed, null, 2)
+    error.value = ''
+  } catch (e: any) {
+    error.value = e.message
+  }
+}
+
+const minify = () => {
+  try {
+    const parsed = JSON.parse(input.value)
+    output.value = JSON.stringify(parsed)
+    error.value = ''
+  } catch (e: any) {
+    error.value = e.message
+  }
+}
+</script>
+
+<template>
+  <div class="h-[calc(100vh-200px)] flex flex-col">
+    <div class="flex space-x-2 mb-4">
+      <button @click="format" class="px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700">Prettify</button>
+      <button @click="minify" class="px-4 py-2 bg-gray-200 text-gray-700 rounded hover:bg-gray-300">Minify</button>
+    </div>
+
+    <div class="flex-1 grid grid-cols-1 md:grid-cols-2 gap-4 min-h-0">
+      <div class="flex flex-col">
+        <label class="mb-2 text-sm font-bold text-gray-500">Input JSON</label>
+        <textarea 
+          v-model="input" 
+          class="flex-1 w-full p-4 font-mono text-sm border rounded-lg focus:ring-2 focus:ring-blue-500 resize-none"
+          :class="{'border-red-500': error}"
+        ></textarea>
+        <p v-if="error" class="text-red-500 text-sm mt-1">{{ error }}</p>
+      </div>
+      
+      <div class="flex flex-col">
+        <label class="mb-2 text-sm font-bold text-gray-500">Output</label>
+        <textarea 
+          readonly 
+          :value="output" 
+          class="flex-1 w-full p-4 font-mono text-sm bg-gray-50 border rounded-lg resize-none text-gray-800"
+        ></textarea>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/frontend/src/views/tools/JwtDebugger.vue b/frontend/src/views/tools/JwtDebugger.vue
new file mode 100644
index 0000000..f70e1e6
--- /dev/null
+++ b/frontend/src/views/tools/JwtDebugger.vue
@@ -0,0 +1,75 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">JWT Debugger</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Decode and inspect JSON Web Tokens (JWT) without backend verification.</p>
+    </template>
+    
+    <template #content>
+      <div class="space-y-6">
+        <!-- Input Section -->
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
+            Encoded Token
+          </label>
+          <textarea
+            v-model="token"
+            rows="3"
+            class="w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-sm"
+            placeholder="Paste your JWT here (eyJhbGci...)"
+          ></textarea>
+        </div>
+
+        <!-- Error Message -->
+        <div v-if="error" class="bg-red-50 dark:bg-red-900/30 text-red-600 dark:text-red-400 p-3 rounded-md text-sm">
+          {{ error }}
+        </div>
+
+        <!-- Output Section -->
+        <div v-if="decodedHeader || decodedPayload" class="grid grid-cols-1 md:grid-cols-2 gap-6">
+          <!-- Header -->
+          <div>
+            <h3 class="text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 uppercase tracking-wide">Header</h3>
+            <pre class="bg-gray-50 dark:bg-gray-900 p-4 rounded-md border border-gray-200 dark:border-gray-700 overflow-auto text-xs font-mono h-64">{{ JSON.stringify(decodedHeader, null, 2) }}</pre>
+          </div>
+          
+          <!-- Payload -->
+          <div>
+            <h3 class="text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 uppercase tracking-wide">Payload</h3>
+            <pre class="bg-gray-50 dark:bg-gray-900 p-4 rounded-md border border-gray-200 dark:border-gray-700 overflow-auto text-xs font-mono h-64">{{ JSON.stringify(decodedPayload, null, 2) }}</pre>
+          </div>
+        </div>
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, watch } from 'vue';
+import { jwtDecode } from 'jwt-decode';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const token = ref('');
+const decodedHeader = ref<any>(null);
+const decodedPayload = ref<any>(null);
+const error = ref('');
+
+watch(token, (newVal) => {
+  if (!newVal.trim()) {
+    decodedHeader.value = null;
+    decodedPayload.value = null;
+    error.value = '';
+    return;
+  }
+
+  try {
+    decodedHeader.value = jwtDecode(newVal, { header: true });
+    decodedPayload.value = jwtDecode(newVal);
+    error.value = '';
+  } catch (e) {
+    decodedHeader.value = null;
+    decodedPayload.value = null;
+    error.value = 'Invalid JWT format';
+  }
+});
+</script>
diff --git a/frontend/src/views/tools/MockDataGen.vue b/frontend/src/views/tools/MockDataGen.vue
new file mode 100644
index 0000000..881ebf5
--- /dev/null
+++ b/frontend/src/views/tools/MockDataGen.vue
@@ -0,0 +1,113 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">Mock Data Generator</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Generate massive amounts of fake data for testing.</p>
+    </template>
+    
+    <template #options>
+      <div class="space-y-6">
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Rows Count</label>
+          <div class="flex items-center space-x-2">
+            <input type="range" v-model.number="count" min="1" max="1000" class="flex-1">
+            <input type="number" v-model.number="count" class="w-20 rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 shadow-sm sm:text-sm">
+          </div>
+        </div>
+
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Fields</label>
+          <div class="space-y-2">
+            <label class="flex items-center">
+              <input type="checkbox" v-model="fields" value="id" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">ID (UUID)</span>
+            </label>
+            <label class="flex items-center">
+              <input type="checkbox" v-model="fields" value="firstName" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">First Name</span>
+            </label>
+            <label class="flex items-center">
+              <input type="checkbox" v-model="fields" value="lastName" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Last Name</span>
+            </label>
+            <label class="flex items-center">
+              <input type="checkbox" v-model="fields" value="email" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Email</span>
+            </label>
+            <label class="flex items-center">
+              <input type="checkbox" v-model="fields" value="phone" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Phone</span>
+            </label>
+            <label class="flex items-center">
+              <input type="checkbox" v-model="fields" value="address" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Address</span>
+            </label>
+            <label class="flex items-center">
+              <input type="checkbox" v-model="fields" value="jobTitle" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-2 text-sm text-gray-700 dark:text-gray-300">Job Title</span>
+            </label>
+          </div>
+        </div>
+        
+        <button 
+          @click="generate"
+          class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+        >
+          Regenerate
+        </button>
+
+        <button 
+          @click="copyJson"
+          class="w-full flex justify-center py-2 px-4 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm text-sm font-medium text-gray-700 dark:text-gray-200 bg-white dark:bg-gray-800 hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+        >
+          Copy JSON
+        </button>
+      </div>
+    </template>
+
+    <template #content>
+      <div class="h-full flex flex-col">
+        <div class="flex items-center justify-between mb-2">
+          <span class="text-sm text-gray-500">Preview ({{ count }} items)</span>
+        </div>
+        <textarea
+          readonly
+          :value="output"
+          class="flex-1 w-full px-3 py-2 bg-gray-50 dark:bg-gray-900 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm font-mono text-xs resize-none"
+        ></textarea>
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, onMounted, watch } from 'vue';
+import { faker } from '@faker-js/faker';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const count = ref(10);
+const output = ref('');
+const fields = ref(['id', 'firstName', 'lastName', 'email']);
+
+const generate = () => {
+  const data = Array.from({ length: count.value }, () => {
+    const item: any = {};
+    if (fields.value.includes('id')) item.id = faker.string.uuid();
+    if (fields.value.includes('firstName')) item.firstName = faker.person.firstName();
+    if (fields.value.includes('lastName')) item.lastName = faker.person.lastName();
+    if (fields.value.includes('email')) item.email = faker.internet.email();
+    if (fields.value.includes('phone')) item.phone = faker.phone.number();
+    if (fields.value.includes('address')) item.address = faker.location.streetAddress();
+    if (fields.value.includes('jobTitle')) item.jobTitle = faker.person.jobTitle();
+    return item;
+  });
+  output.value = JSON.stringify(data, null, 2);
+};
+
+const copyJson = async () => {
+  await navigator.clipboard.writeText(output.value);
+};
+
+onMounted(generate);
+watch([count], generate); // Don't watch fields deeply to prevent too many re-renders
+</script>
diff --git a/frontend/src/views/tools/PasswordGen.vue b/frontend/src/views/tools/PasswordGen.vue
new file mode 100644
index 0000000..d289113
--- /dev/null
+++ b/frontend/src/views/tools/PasswordGen.vue
@@ -0,0 +1,128 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+import { downloadCsv } from '../../utils/csvDownloader'
+
+const count = ref(5)
+const length = ref(16)
+const includeUpper = ref(true)
+const includeDigits = ref(true)
+const includeSpecial = ref(true)
+
+const results = ref<string[]>([])
+
+// Secure random generator using Web Crypto API
+const generate = () => {
+  const lower = 'abcdefghijklmnopqrstuvwxyz'
+  const upper = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
+  const digits = '0123456789'
+  const special = '!@#$%^&*()_+-=[]{}|;:,.<>?'
+
+  let chars = lower
+  if (includeUpper.value) chars += upper
+  if (includeDigits.value) chars += digits
+  if (includeSpecial.value) chars += special
+
+  if (!chars) {
+    alert("Please select at least one character set.")
+    return
+  }
+
+  const newPasswords: string[] = []
+  
+  for (let i = 0; i < count.value; i++) {
+    let password = ''
+    const array = new Uint32Array(length.value)
+    crypto.getRandomValues(array)
+    
+    for (let j = 0; j < length.value; j++) {
+      password += chars[array[j] % chars.length]
+    }
+    newPasswords.push(password)
+  }
+  
+  results.value = newPasswords
+}
+
+const copyToClipboard = (text: string) => {
+    navigator.clipboard.writeText(text)
+}
+
+const downloadResults = () => {
+  downloadCsv(results.value, `passwords-${new Date().getTime()}`, ['Password'])
+}
+</script>
+
+<template>
+  <div class="max-w-5xl mx-auto">
+    <div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
+      <!-- Controls -->
+      <div class="p-6 border-b border-gray-100 bg-gray-50 grid grid-cols-1 md:grid-cols-2 gap-6">
+        
+        <div class="space-y-4">
+          <div>
+            <label class="block text-xs font-bold text-gray-500 uppercase mb-2">Password Length: {{ length }}</label>
+            <input type="range" v-model.number="length" min="4" max="64" class="w-full accent-blue-600">
+          </div>
+          
+          <div>
+            <label class="block text-xs font-bold text-gray-500 uppercase mb-2">Quantity: {{ count }}</label>
+            <input type="range" v-model.number="count" min="1" max="50" class="w-full accent-blue-600">
+          </div>
+        </div>
+
+        <div class="space-y-3">
+            <label class="block text-xs font-bold text-gray-500 uppercase">Character Sets</label>
+            <label class="flex items-center space-x-2 cursor-pointer">
+                <input type="checkbox" v-model="includeUpper" class="rounded text-blue-600 focus:ring-blue-500">
+                <span class="text-sm text-gray-700">Uppercase (A-Z)</span>
+            </label>
+            <label class="flex items-center space-x-2 cursor-pointer">
+                <input type="checkbox" v-model="includeDigits" class="rounded text-blue-600 focus:ring-blue-500">
+                <span class="text-sm text-gray-700">Digits (0-9)</span>
+            </label>
+            <label class="flex items-center space-x-2 cursor-pointer">
+                <input type="checkbox" v-model="includeSpecial" class="rounded text-blue-600 focus:ring-blue-500">
+                <span class="text-sm text-gray-700">Special Characters (!@#$...)</span>
+            </label>
+        </div>
+      </div>
+      
+      <!-- Actions -->
+      <div class="p-4 bg-gray-50 border-b border-gray-100 flex justify-end space-x-3">
+        <button 
+            v-if="results.length > 0"
+            @click="downloadResults"
+            class="px-4 py-2 bg-white border border-gray-300 text-gray-700 hover:bg-gray-50 rounded-lg font-medium transition flex items-center shadow-sm"
+        >
+            <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path></svg>
+            Download CSV
+        </button>
+        <button 
+            @click="generate"
+            class="px-6 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg font-bold shadow-sm transition flex items-center"
+        >
+             Generate
+        </button>
+      </div>
+
+      <!-- Results -->
+      <div class="p-0">
+        <ul v-if="results.length > 0" class="divide-y divide-gray-100">
+          <li v-for="(pwd, idx) in results" :key="idx" class="p-4 font-mono text-gray-700 hover:bg-gray-50 flex justify-between items-center group">
+            <span class="break-all mr-4">{{ pwd }}</span>
+            <button 
+              @click="copyToClipboard(pwd)"
+              class="opacity-0 group-hover:opacity-100 text-gray-400 hover:text-blue-600 transition"
+              title="Copy"
+            >
+               <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg>
+            </button>
+          </li>
+        </ul>
+        <div v-else class="p-12 text-center text-gray-400">
+          Adjust settings and click generate to create secure passwords locally.
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/frontend/src/views/tools/PngCompressor.vue b/frontend/src/views/tools/PngCompressor.vue
new file mode 100644
index 0000000..1840b68
--- /dev/null
+++ b/frontend/src/views/tools/PngCompressor.vue
@@ -0,0 +1,233 @@
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+
+interface CompressionResult {
+  filename: string
+  original_size: number
+  compressed_size: number
+  ratio: number
+  status: string
+}
+
+const files = ref<File[]>([])
+const isDragging = ref(false)
+const uploading = ref(false)
+const results = ref<CompressionResult[]>([])
+const downloadUrl = ref('')
+const downloadFilename = ref('')
+const jobId = ref('')
+
+const totalSavings = computed(() => {
+  if (results.value.length === 0) return 0
+  const orig = results.value.reduce((acc, r) => acc + r.original_size, 0)
+  const comp = results.value.reduce((acc, r) => acc + r.compressed_size, 0)
+  return Math.round(((orig - comp) / orig) * 100)
+})
+
+const formatBytes = (bytes: number) => {
+  if (bytes === 0) return '0 B'
+  const k = 1024
+  const sizes = ['B', 'KB', 'MB', 'GB']
+  const i = Math.floor(Math.log(bytes) / Math.log(k))
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]
+}
+
+const onDrop = (e: DragEvent) => {
+  isDragging.value = false
+  const droppedFiles = e.dataTransfer?.files
+  if (droppedFiles) {
+    addFiles(droppedFiles)
+  }
+}
+
+const onFileSelect = (e: Event) => {
+  const target = e.target as HTMLInputElement
+  if (target.files) {
+    addFiles(target.files)
+  }
+}
+
+const addFiles = (fileList: FileList) => {
+  // Reset previous results if adding new files
+  if (results.value.length > 0) {
+    results.value = []
+    downloadUrl.value = ''
+    files.value = []
+    jobId.value = ''
+  }
+  
+  for (let i = 0; i < fileList.length; i++) {
+    const file = fileList[i]
+    if (file.type === 'image/png') {
+      files.value.push(file)
+    } else {
+      alert(`Skipped non-PNG file: ${file.name}`)
+    }
+  }
+}
+
+const removeFile = (index: number) => {
+  files.value.splice(index, 1)
+}
+
+const processFiles = async () => {
+  if (files.value.length === 0) return
+  
+  uploading.value = true
+  const formData = new FormData()
+  files.value.forEach(file => {
+    formData.append('files', file)
+  })
+
+  try {
+    const res = await fetch('/api/tools/png-compress', {
+      method: 'POST',
+      body: formData
+    })
+    
+    if (!res.ok) throw new Error('Compression failed')
+    
+    const data = await res.json()
+    results.value = data.stats
+    jobId.value = data.job_id
+    downloadFilename.value = data.zip_filename
+    downloadUrl.value = `/api/tools/download/${data.zip_filename}`
+    
+  } catch (e) {
+    console.error(e)
+    alert('Failed to compress images.')
+  } finally {
+    uploading.value = false
+  }
+}
+</script>
+
+<template>
+  <div class="max-w-6xl mx-auto">
+    <div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
+      <div class="p-6 border-b border-gray-100">
+        <h2 class="text-xl font-bold text-gray-800">PNG Compressor</h2>
+        <p class="text-gray-500 text-sm mt-1">
+          Compress PNGs using <code>pngquant</code>. Reduces file size by 60-80% with minimal quality loss.
+        </p>
+      </div>
+
+      <div class="p-6">
+        <!-- Drag & Drop Area -->
+        <div 
+          v-if="results.length === 0"
+          @dragover.prevent="isDragging = true"
+          @dragleave.prevent="isDragging = false"
+          @drop.prevent="onDrop"
+          class="border-2 border-dashed rounded-xl p-8 text-center transition-colors duration-200 cursor-pointer"
+          :class="isDragging ? 'border-blue-500 bg-blue-50' : 'border-gray-300 hover:border-gray-400'"
+          @click="$refs.fileInput.click()"
+        >
+          <input 
+            ref="fileInput"
+            type="file" 
+            multiple 
+            accept="image/png" 
+            class="hidden"
+            @change="onFileSelect"
+          >
+          <div class="flex flex-col items-center justify-center space-y-3">
+            <svg class="w-12 h-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12"></path></svg>
+            <div class="text-gray-600">
+              <span class="font-medium text-blue-600 hover:text-blue-500">Click to upload</span>
+              or drag and drop
+            </div>
+            <p class="text-xs text-gray-400">PNG files only</p>
+          </div>
+        </div>
+
+        <!-- File List (Pending) -->
+        <div v-if="files.length > 0 && results.length === 0" class="mt-6">
+          <h3 class="text-sm font-bold text-gray-500 uppercase mb-3">Selected Files ({{ files.length }})</h3>
+          <ul class="divide-y divide-gray-100 border rounded-lg overflow-hidden">
+            <li v-for="(file, idx) in files" :key="idx" class="p-3 bg-gray-50 flex justify-between items-center text-sm">
+              <span class="truncate">{{ file.name }}</span>
+              <div class="flex items-center space-x-4">
+                <span class="text-gray-400">{{ formatBytes(file.size) }}</span>
+                <button @click.stop="removeFile(idx)" class="text-red-400 hover:text-red-600">
+                  <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>
+                </button>
+              </div>
+            </li>
+          </ul>
+          
+          <div class="mt-6 flex justify-end">
+            <button 
+              @click="processFiles"
+              :disabled="uploading"
+              class="px-6 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg font-bold shadow-sm transition disabled:opacity-50 flex items-center"
+            >
+              <svg v-if="uploading" class="animate-spin -ml-1 mr-2 h-4 w-4 text-white" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>
+              {{ uploading ? 'Compressing...' : 'Upload & Process' }}
+            </button>
+          </div>
+        </div>
+
+        <!-- Results -->
+        <div v-if="results.length > 0" class="mt-6">
+          <div class="flex items-center justify-between mb-4">
+            <h3 class="text-lg font-bold text-gray-800">Results</h3>
+            <span class="text-green-600 font-bold bg-green-50 px-3 py-1 rounded-full text-sm">
+              Total Savings: {{ totalSavings }}%
+            </span>
+          </div>
+
+          <div class="overflow-x-auto">
+            <table class="min-w-full text-left text-sm whitespace-nowrap">
+              <thead class="uppercase tracking-wider border-b-2 border-gray-100 bg-gray-50 text-gray-500 font-semibold">
+                <tr>
+                  <th scope="col" class="px-4 py-3">Filename</th>
+                  <th scope="col" class="px-4 py-3 text-right">Original</th>
+                  <th scope="col" class="px-4 py-3 text-right">Compressed</th>
+                  <th scope="col" class="px-4 py-3 text-right">Ratio</th>
+                  <th scope="col" class="px-4 py-3 text-center">Status</th>
+                  <th scope="col" class="px-4 py-3 text-center">Action</th>
+                </tr>
+              </thead>
+              <tbody class="divide-y divide-gray-100">
+                <tr v-for="(res, idx) in results" :key="idx" class="hover:bg-gray-50">
+                  <td class="px-4 py-3 font-medium text-gray-900">{{ res.filename }}</td>
+                  <td class="px-4 py-3 text-right text-gray-500">{{ formatBytes(res.original_size) }}</td>
+                  <td class="px-4 py-3 text-right text-gray-900 font-bold">{{ formatBytes(res.compressed_size) }}</td>
+                  <td class="px-4 py-3 text-right text-green-600">{{ res.ratio }}%</td>
+                  <td class="px-4 py-3 text-center">
+                    <span v-if="res.status === 'Success'" class="text-green-600">✅</span>
+                    <span v-else class="text-gray-400 text-xs">{{ res.status }}</span>
+                  </td>
+                  <td class="px-4 py-3 text-center">
+                    <a 
+                      v-if="res.status === 'Success'"
+                      :href="`/api/tools/download-single/${jobId}/${res.filename}`"
+                      target="_blank"
+                      class="text-blue-600 hover:text-blue-800 font-medium text-xs border border-blue-200 bg-blue-50 px-2 py-1 rounded hover:bg-blue-100 transition"
+                    >
+                      Download
+                    </a>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+
+          <div class="mt-8 flex justify-between items-center bg-gray-50 p-4 rounded-lg">
+            <button @click="files = []; results = []; jobId = ''" class="text-gray-500 hover:text-gray-700 font-medium text-sm">
+              &larr; Compress More
+            </button>
+            <a 
+              :href="downloadUrl" 
+              class="px-6 py-2 bg-green-600 hover:bg-green-700 text-white rounded-lg font-bold shadow-lg shadow-green-200 transition flex items-center"
+            >
+              <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path></svg>
+              Download All (ZIP)
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/frontend/src/views/tools/QrGenerator.vue b/frontend/src/views/tools/QrGenerator.vue
new file mode 100644
index 0000000..3ffec2c
--- /dev/null
+++ b/frontend/src/views/tools/QrGenerator.vue
@@ -0,0 +1,109 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">QR Code Generator</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Generate QR codes instantly from text or URLs.</p>
+    </template>
+    
+    <template #options>
+      <div class="space-y-4">
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Text / URL</label>
+          <textarea 
+            v-model="text" 
+            rows="3"
+            class="w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm"
+            placeholder="https://example.com"
+          ></textarea>
+        </div>
+
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Error Correction</label>
+          <select v-model="errorLevel" class="w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm">
+            <option value="L">Low (7%)</option>
+            <option value="M">Medium (15%)</option>
+            <option value="Q">Quartile (25%)</option>
+            <option value="H">High (30%)</option>
+          </select>
+        </div>
+
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Scale (Size)</label>
+          <input 
+            type="range" 
+            v-model.number="scale" 
+            min="2" 
+            max="10" 
+            class="w-full"
+          />
+          <div class="text-xs text-gray-500 text-right">{{ scale }}x</div>
+        </div>
+
+        <button 
+          v-if="qrDataUrl"
+          @click="downloadQr"
+          class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+        >
+          Download PNG
+        </button>
+      </div>
+    </template>
+
+    <template #content>
+      <div class="h-full flex items-center justify-center bg-gray-100 dark:bg-black/20 rounded-lg border-2 border-dashed border-gray-200 dark:border-gray-700">
+        <div v-if="text" class="text-center">
+          <img :src="qrDataUrl" alt="QR Code" class="mx-auto shadow-lg border-4 border-white" />
+          <p class="mt-4 text-sm text-gray-500 break-all max-w-md">{{ text }}</p>
+        </div>
+        <div v-else class="text-center text-gray-400">
+          <p>Enter text to generate QR code</p>
+        </div>
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, onMounted } from 'vue';
+import QRCode from 'qrcode';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const text = ref('https://example.com');
+const errorLevel = ref('M');
+const scale = ref(6);
+const qrDataUrl = ref('');
+
+const generate = async () => {
+  if (!text.value) {
+    qrDataUrl.value = '';
+    return;
+  }
+
+  try {
+    qrDataUrl.value = await QRCode.toDataURL(text.value, {
+      errorCorrectionLevel: errorLevel.value as any,
+      width: undefined,
+      scale: scale.value,
+      margin: 1,
+      color: {
+        dark: '#000000',
+        light: '#ffffff'
+      }
+    });
+  } catch (err) {
+    console.error(err);
+  }
+};
+
+const downloadQr = () => {
+  const link = document.createElement('a');
+  link.download = 'qrcode.png';
+  link.href = qrDataUrl.value;
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+};
+
+watch([text, errorLevel, scale], generate);
+onMounted(generate);
+</script>
diff --git a/frontend/src/views/tools/RegexTester.vue b/frontend/src/views/tools/RegexTester.vue
new file mode 100644
index 0000000..3f9a09c
--- /dev/null
+++ b/frontend/src/views/tools/RegexTester.vue
@@ -0,0 +1,98 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">Regex Tester</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Test and debug regular expressions.</p>
+    </template>
+    
+    <template #options>
+      <div class="space-y-4">
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Pattern</label>
+          <input 
+            v-model="pattern"
+            type="text" 
+            class="w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm font-mono"
+            placeholder="[a-z]+"
+          />
+        </div>
+        
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Flags</label>
+          <div class="flex space-x-2">
+            <label class="inline-flex items-center text-xs">
+              <input type="checkbox" v-model="flagGlobal" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-1 text-gray-700 dark:text-gray-300">g</span>
+            </label>
+            <label class="inline-flex items-center text-xs">
+              <input type="checkbox" v-model="flagInsensitive" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-1 text-gray-700 dark:text-gray-300">i</span>
+            </label>
+            <label class="inline-flex items-center text-xs">
+              <input type="checkbox" v-model="flagMultiline" class="rounded border-gray-300 text-blue-600 shadow-sm focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
+              <span class="ml-1 text-gray-700 dark:text-gray-300">m</span>
+            </label>
+          </div>
+        </div>
+
+        <div v-if="error" class="text-xs text-red-500">{{ error }}</div>
+      </div>
+    </template>
+
+    <template #content>
+      <div class="h-full flex flex-col space-y-4">
+        <div class="flex-1 flex flex-col">
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Test String</label>
+          <textarea
+            v-model="text"
+            class="flex-1 w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-sm resize-none"
+            placeholder="Type text here to test against the regex..."
+          ></textarea>
+        </div>
+        
+        <div class="h-1/3 bg-gray-50 dark:bg-gray-900 p-4 rounded-md border border-gray-200 dark:border-gray-700 overflow-auto">
+           <h3 class="text-xs font-medium text-gray-500 mb-2 uppercase">Matches</h3>
+           <div v-if="matches.length === 0" class="text-sm text-gray-400">No matches found.</div>
+           <ul v-else class="space-y-1">
+             <li v-for="(match, idx) in matches" :key="idx" class="text-sm font-mono text-gray-800 dark:text-gray-200">
+               <span class="bg-blue-100 dark:bg-blue-900/50 px-1 rounded">Match {{ idx + 1 }}:</span> {{ match }}
+             </li>
+           </ul>
+        </div>
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const pattern = ref('');
+const text = ref('');
+const flagGlobal = ref(true);
+const flagInsensitive = ref(false);
+const flagMultiline = ref(false);
+const error = ref('');
+
+const matches = computed(() => {
+  if (!pattern.value) return [];
+  try {
+    let flags = '';
+    if (flagGlobal.value) flags += 'g';
+    if (flagInsensitive.value) flags += 'i';
+    if (flagMultiline.value) flags += 'm';
+    
+    const regex = new RegExp(pattern.value, flags);
+    error.value = '';
+    
+    if (!text.value) return [];
+
+    const found = text.value.match(regex);
+    return found ? Array.from(found) : [];
+  } catch (e: any) {
+    error.value = e.message;
+    return [];
+  }
+});
+</script>
diff --git a/frontend/src/views/tools/SqlFormatter.vue b/frontend/src/views/tools/SqlFormatter.vue
new file mode 100644
index 0000000..e881156
--- /dev/null
+++ b/frontend/src/views/tools/SqlFormatter.vue
@@ -0,0 +1,91 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">SQL Formatter</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Beautify and standardize your SQL queries.</p>
+    </template>
+    
+    <template #options>
+      <div class="space-y-4">
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Language</label>
+          <select v-model="language" class="w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm">
+            <option value="sql">Standard SQL</option>
+            <option value="mysql">MySQL</option>
+            <option value="postgresql">PostgreSQL</option>
+            <option value="plsql">PL/SQL</option>
+            <option value="tsql">Transact-SQL</option>
+          </select>
+        </div>
+        
+        <div>
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Indent Style</label>
+          <select v-model="indent" class="w-full rounded-md border-gray-300 dark:border-gray-700 dark:bg-gray-900 shadow-sm focus:border-blue-500 focus:ring-blue-500 sm:text-sm">
+            <option value="  ">2 Spaces</option>
+            <option value="    ">4 Spaces</option>
+            <option value="\t">Tab</option>
+          </select>
+        </div>
+
+        <button 
+          @click="formatSql"
+          class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+        >
+          Format SQL
+        </button>
+      </div>
+    </template>
+
+    <template #content>
+      <div class="h-full flex flex-col space-y-4">
+        <div class="flex-1 flex flex-col">
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Input</label>
+          <textarea
+            v-model="inputSql"
+            class="flex-1 w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-sm resize-none"
+            placeholder="SELECT * FROM table WHERE id = 1"
+          ></textarea>
+        </div>
+        
+        <div class="flex-1 flex flex-col">
+          <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Output</label>
+          <div class="relative flex-1">
+             <textarea
+              readonly
+              :value="outputSql"
+              class="absolute inset-0 w-full h-full px-3 py-2 bg-gray-50 dark:bg-gray-900 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm font-mono text-sm resize-none"
+            ></textarea>
+          </div>
+        </div>
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { format } from 'sql-formatter';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const inputSql = ref('');
+const outputSql = ref('');
+const language = ref('sql');
+const indent = ref('  ');
+
+const formatSql = () => {
+  if (!inputSql.value) {
+    outputSql.value = '';
+    return;
+  }
+  
+  try {
+    outputSql.value = format(inputSql.value, {
+      language: language.value as any,
+      tabWidth: indent.value === '\t' ? undefined : indent.value.length,
+      useTabs: indent.value === '\t',
+    });
+  } catch (e: any) {
+    outputSql.value = `Error: ${e.message}`;
+  }
+};
+</script>
diff --git a/frontend/src/views/tools/SvgOptimizer.vue b/frontend/src/views/tools/SvgOptimizer.vue
new file mode 100644
index 0000000..7529411
--- /dev/null
+++ b/frontend/src/views/tools/SvgOptimizer.vue
@@ -0,0 +1,83 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">SVG Optimizer</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Minify SVG code using SVGO.</p>
+    </template>
+    
+    <template #content>
+      <div class="h-full flex flex-col space-y-4">
+        
+        <div class="grid grid-cols-2 gap-4 h-full">
+          <!-- Input -->
+          <div class="flex flex-col">
+             <div class="flex items-center justify-between mb-2">
+               <label class="text-sm font-medium text-gray-700 dark:text-gray-300">Input SVG</label>
+               <span class="text-xs text-gray-500">{{ inputSize }} bytes</span>
+             </div>
+             <textarea
+               v-model="inputSvg"
+               class="flex-1 w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 font-mono text-xs resize-none"
+               placeholder="<svg>...</svg>"
+             ></textarea>
+          </div>
+
+          <!-- Output -->
+          <div class="flex flex-col">
+             <div class="flex items-center justify-between mb-2">
+               <label class="text-sm font-medium text-gray-700 dark:text-gray-300">Optimized SVG</label>
+               <span class="text-xs text-green-600 font-medium" v-if="saved > 0">-{{ saved }}% ({{ outputSize }} bytes)</span>
+             </div>
+             <textarea
+               readonly
+               :value="outputSvg"
+               class="flex-1 w-full px-3 py-2 bg-gray-50 dark:bg-gray-900 border border-gray-300 dark:border-gray-700 rounded-md shadow-sm font-mono text-xs resize-none"
+             ></textarea>
+          </div>
+        </div>
+        
+        <button 
+          @click="optimize"
+          class="w-full flex justify-center py-3 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+        >
+          Optimize SVG
+        </button>
+
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue';
+import { optimize as svgoOptimize } from 'svgo/browser';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const inputSvg = ref('');
+const outputSvg = ref('');
+
+const inputSize = computed(() => new Blob([inputSvg.value]).size);
+const outputSize = computed(() => new Blob([outputSvg.value]).size);
+const saved = computed(() => {
+  if (inputSize.value === 0) return 0;
+  return Math.round(((inputSize.value - outputSize.value) / inputSize.value) * 100);
+});
+
+const optimize = () => {
+  if (!inputSvg.value) return;
+  try {
+    const result = svgoOptimize(inputSvg.value, {
+      multipass: true,
+      plugins: [
+        'preset-default',
+        'removeDimensions',
+        'convertStyleToAttrs',
+      ],
+    });
+    outputSvg.value = result.data;
+  } catch (e) {
+    console.error(e);
+    outputSvg.value = 'Error optimizing SVG';
+  }
+};
+</script>
diff --git a/frontend/src/views/tools/UrlParser.vue b/frontend/src/views/tools/UrlParser.vue
new file mode 100644
index 0000000..f4bf460
--- /dev/null
+++ b/frontend/src/views/tools/UrlParser.vue
@@ -0,0 +1,79 @@
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+
+const input = ref('https://example.com/search?q=hello world')
+const mode = ref<'encode' | 'decode'>('encode')
+
+const output = computed(() => {
+  if (!input.value) return ''
+  try {
+    return mode.value === 'encode' 
+      ? encodeURIComponent(input.value) 
+      : decodeURIComponent(input.value)
+  } catch (e) {
+    return 'Error: Invalid URI'
+  }
+})
+
+const copyToClipboard = () => {
+  navigator.clipboard.writeText(output.value)
+  alert('Copied!')
+}
+</script>
+
+<template>
+  <div class="max-w-6xl mx-auto">
+    <div class="bg-white rounded-xl shadow-sm p-6 border border-gray-200">
+      <div class="flex items-center space-x-4 mb-6">
+        <button 
+          @click="mode = 'encode'"
+          class="px-4 py-2 rounded-lg font-medium transition"
+          :class="mode === 'encode' ? 'bg-blue-600 text-white shadow-lg shadow-blue-200' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
+        >
+          Encode
+        </button>
+        <button 
+          @click="mode = 'decode'"
+          class="px-4 py-2 rounded-lg font-medium transition"
+          :class="mode === 'decode' ? 'bg-blue-600 text-white shadow-lg shadow-blue-200' : 'bg-gray-100 text-gray-600 hover:bg-gray-200'"
+        >
+          Decode
+        </button>
+      </div>
+
+      <div class="grid gap-6">
+        <div>
+          <label class="block text-sm font-medium text-gray-700 mb-2">Input</label>
+          <textarea 
+            v-model="input"
+            rows="4"
+            class="w-full rounded-lg border-gray-300 border p-3 focus:ring-2 focus:ring-blue-500 focus:border-blue-500 font-mono text-sm"
+          ></textarea>
+        </div>
+
+        <div class="flex justify-center">
+            <svg class="w-6 h-6 text-gray-400 rotate-90 md:rotate-0" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path></svg>
+        </div>
+
+        <div>
+          <label class="block text-sm font-medium text-gray-700 mb-2">Output</label>
+          <div class="relative">
+            <textarea 
+              readonly
+              :value="output"
+              rows="4"
+              class="w-full rounded-lg border-gray-300 border p-3 bg-gray-50 font-mono text-sm text-gray-800"
+            ></textarea>
+            <button 
+              @click="copyToClipboard"
+              class="absolute top-2 right-2 p-2 bg-white rounded border border-gray-200 hover:bg-gray-50 text-gray-500"
+              title="Copy"
+            >
+              <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"></path></svg>
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/frontend/src/views/tools/UuidGen.vue b/frontend/src/views/tools/UuidGen.vue
new file mode 100644
index 0000000..86d3bf3
--- /dev/null
+++ b/frontend/src/views/tools/UuidGen.vue
@@ -0,0 +1,93 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+import { v1 as uuidv1, v4 as uuidv4 } from 'uuid'
+import { downloadCsv } from '../../utils/csvDownloader'
+
+const count = ref(5)
+const version = ref(4)
+const results = ref<string[]>([])
+
+const generate = () => {
+  const newUuids: string[] = []
+  
+  for (let i = 0; i < count.value; i++) {
+    if (version.value === 1) {
+      newUuids.push(uuidv1())
+    } else {
+      // Use native crypto API if available for v4, fallback to library
+      if (typeof crypto.randomUUID === 'function') {
+        newUuids.push(crypto.randomUUID())
+      } else {
+        newUuids.push(uuidv4())
+      }
+    }
+  }
+  
+  results.value = newUuids
+}
+
+const downloadResults = () => {
+  downloadCsv(results.value, `uuids-v${version.value}-${new Date().getTime()}`, ['UUID'])
+}
+</script>
+
+<template>
+  <div class="max-w-5xl mx-auto">
+    <div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
+      <div class="p-6 border-b border-gray-100 bg-gray-50">
+        <div class="flex flex-wrap items-end gap-4">
+          <div>
+            <label class="block text-xs font-bold text-gray-500 uppercase mb-1">Quantity</label>
+            <input 
+              v-model.number="count" 
+              type="number" 
+              min="1" 
+              max="50" 
+              class="w-24 rounded border-gray-300 p-2"
+            >
+          </div>
+          <div>
+            <label class="block text-xs font-bold text-gray-500 uppercase mb-1">Version</label>
+            <select v-model.number="version" class="w-32 rounded border-gray-300 p-2">
+              <option :value="4">UUID v4 (Random)</option>
+              <option :value="1">UUID v1 (Time)</option>
+            </select>
+          </div>
+          <div class="ml-auto flex space-x-2">
+            <button 
+                v-if="results.length > 0"
+                @click="downloadResults"
+                class="px-4 py-2 bg-white border border-gray-300 text-gray-700 hover:bg-gray-50 rounded font-medium transition flex items-center"
+            >
+                <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path></svg>
+                CSV
+            </button>
+            <button 
+                @click="generate"
+                class="px-6 py-2 bg-purple-600 hover:bg-purple-700 text-white rounded font-medium transition"
+            >
+                Generate UUIDs
+            </button>
+          </div>
+        </div>
+      </div>
+      
+      <div class="p-0">
+        <ul v-if="results.length > 0" class="divide-y divide-gray-100">
+          <li v-for="(uuid, idx) in results" :key="idx" class="p-4 font-mono text-gray-700 hover:bg-gray-50 flex justify-between items-center group">
+            <span>{{ uuid }}</span>
+            <button 
+              @click="navigator.clipboard.writeText(uuid)"
+              class="opacity-0 group-hover:opacity-100 text-gray-400 hover:text-blue-600 transition"
+            >
+               Copy
+            </button>
+          </li>
+        </ul>
+        <div v-else class="p-12 text-center text-gray-400">
+          Press generate to create UUIDs using Python backend.
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/frontend/src/views/tools/VideoToGif.vue b/frontend/src/views/tools/VideoToGif.vue
new file mode 100644
index 0000000..eb8c91d
--- /dev/null
+++ b/frontend/src/views/tools/VideoToGif.vue
@@ -0,0 +1,111 @@
+<template>
+  <ToolLayout>
+    <template #header>
+      <h1 class="text-xl font-semibold text-gray-900 dark:text-white">Video to GIF</h1>
+      <p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Convert short video clips to GIF format (Server-side).</p>
+    </template>
+    
+    <template #content>
+      <div class="max-w-4xl mx-auto space-y-8">
+        
+        <!-- Upload -->
+        <div 
+          class="border-2 border-dashed border-gray-300 dark:border-gray-700 rounded-lg p-12 text-center hover:border-blue-500 dark:hover:border-blue-500 transition-colors cursor-pointer"
+          @click="triggerFileInput"
+          @drop.prevent="handleDrop"
+          @dragover.prevent
+        >
+          <div v-if="loading" class="space-y-4">
+             <div class="animate-spin rounded-full h-10 w-10 border-b-2 border-blue-600 mx-auto"></div>
+             <p class="text-gray-600 dark:text-gray-300">Converting... This may take a moment.</p>
+          </div>
+          <div v-else class="space-y-2">
+            <svg class="mx-auto h-12 w-12 text-gray-400" stroke="currentColor" fill="none" viewBox="0 0 48 48">
+              <path d="M28 8H12a4 4 0 00-4 4v20m32-12v8m0 0v8a4 4 0 01-4 4H12a4 4 0 01-4-4v-4m32-4l-3.172-3.172a4 4 0 00-5.656 0L28 28M8 32l9.172-9.172a4 4 0 015.656 0L28 28m0 0l4 4m4-24h8m-4-4v8m-12 4h.02" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+            </svg>
+            <div class="text-gray-600 dark:text-gray-300">
+              <span class="font-medium text-blue-600 hover:text-blue-500">Upload Video</span> (MP4, MOV)
+            </div>
+            <p class="text-xs text-gray-500 dark:text-gray-400">Max 10MB recommended</p>
+          </div>
+          <input ref="fileInput" type="file" accept="video/*" class="hidden" @change="handleFileSelect" />
+        </div>
+
+        <!-- Result -->
+        <div v-if="gifUrl" class="text-center space-y-4">
+          <h3 class="text-lg font-medium text-gray-900 dark:text-white">Conversion Complete!</h3>
+          <img :src="gifUrl" alt="Converted GIF" class="mx-auto rounded shadow-lg max-h-96" />
+          <a 
+            :href="gifUrl" 
+            download="converted.gif"
+            class="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+          >
+            Download GIF
+          </a>
+        </div>
+
+        <div v-if="error" class="bg-red-50 dark:bg-red-900/20 p-4 rounded text-red-600 dark:text-red-400 text-sm text-center">
+          {{ error }}
+        </div>
+
+      </div>
+    </template>
+  </ToolLayout>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import axios from 'axios';
+import ToolLayout from '../../components/ToolLayout.vue';
+
+const fileInput = ref<HTMLInputElement | null>(null);
+const loading = ref(false);
+const gifUrl = ref('');
+const error = ref('');
+
+const triggerFileInput = () => {
+  if (!loading.value) fileInput.value?.click();
+};
+
+const handleFileSelect = (event: Event) => {
+  const target = event.target as HTMLInputElement;
+  if (target.files && target.files[0]) {
+    uploadAndConvert(target.files[0]);
+  }
+};
+
+const handleDrop = (event: DragEvent) => {
+  if (loading.value) return;
+  if (event.dataTransfer?.files && event.dataTransfer.files[0]) {
+    uploadAndConvert(event.dataTransfer.files[0]);
+  }
+};
+
+const uploadAndConvert = async (file: File) => {
+  if (!file.type.startsWith('video/')) {
+    error.value = 'Please upload a valid video file.';
+    return;
+  }
+
+  loading.value = true;
+  error.value = '';
+  gifUrl.value = '';
+
+  const formData = new FormData();
+  formData.append('file', file);
+
+  try {
+    const response = await axios.post('/api/tools/video/gif', formData, {
+      responseType: 'blob'
+    });
+    
+    const blob = new Blob([response.data], { type: 'image/gif' });
+    gifUrl.value = URL.createObjectURL(blob);
+  } catch (e: any) {
+    error.value = 'Conversion failed. The server might be busy or the format is unsupported.';
+    console.error(e);
+  } finally {
+    loading.value = false;
+  }
+};
+</script>
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
new file mode 100644
index 0000000..1853f01
--- /dev/null
+++ b/frontend/vite.config.ts
@@ -0,0 +1,22 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import path from 'path'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [vue()],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+    },
+  },
+  server: {
+    proxy: {
+      // 개발 중 API 요청을 백엔드(FastAPI)로 프록시
+      '/api': {
+        target: 'http://localhost:8000',
+        changeOrigin: true,
+      }
+    }
+  }
+})