add Tailwind and design tokens to frontend.

Tailwind v4 via Vite plugin, theme tokens in main.css, and VS Code hints for v4 at-rules.

.gitignore

@@ -12,6 +12,9 @@
 /frontend/node_modules
 /frontend/dist
 
-.vscode
+.vscode/*
+!.vscode/settings.json
+!.vscode/extensions.json
+!.vscode/tailwind.css-data.json
 .idea
 *.log

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+    "recommendations": ["bradlc.vscode-tailwindcss"]
+}

.vscode/settings.json

@@ -0,0 +1,10 @@
+{
+    "css.customData": [".vscode/tailwind.css-data.json"],
+    "files.associations": {
+        "**/frontend/src/assets/css/main.css": "tailwindcss"
+    },
+    "tailwindCSS.includeLanguages": {
+        "vue": "html"
+    },
+    "tailwindCSS.experimental.configFile": "frontend/src/assets/css/main.css"
+}

.vscode/tailwind.css-data.json

@@ -0,0 +1,33 @@
+{
+    "version": 1.1,
+    "atDirectives": [
+        {
+            "name": "@theme",
+            "description": "Tailwind CSS v4 theme configuration."
+        },
+        {
+            "name": "@custom-variant",
+            "description": "Tailwind CSS v4 custom variant."
+        },
+        {
+            "name": "@apply",
+            "description": "Tailwind CSS utility composition."
+        },
+        {
+            "name": "@layer",
+            "description": "Tailwind CSS cascade layer."
+        },
+        {
+            "name": "@source",
+            "description": "Tailwind CSS v4 content source paths."
+        },
+        {
+            "name": "@utility",
+            "description": "Tailwind CSS v4 custom utility."
+        },
+        {
+            "name": "@variant",
+            "description": "Tailwind CSS v4 variant definition."
+        }
+    ]
+}

frontend/package-lock.json

@@ -8,6 +8,8 @@
             "name": "frontend",
             "version": "0.0.0",
             "dependencies": {
+                "@tailwindcss/vite": "^4.3.3",
+                "tailwindcss": "^4.3.3",
                 "vue": "^3.5.32"
             },
             "devDependencies": {
@@ -65,17 +67,55 @@
                 "node": ">=6.9.0"
             }
         },
+        "node_modules/@jridgewell/gen-mapping": {
+            "version": "0.3.13",
+            "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
+            "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
+            "license": "MIT",
+            "dependencies": {
+                "@jridgewell/sourcemap-codec": "^1.5.0",
+                "@jridgewell/trace-mapping": "^0.3.24"
+            }
+        },
+        "node_modules/@jridgewell/remapping": {
+            "version": "2.3.5",
+            "resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
+            "integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
+            "license": "MIT",
+            "dependencies": {
+                "@jridgewell/gen-mapping": "^0.3.5",
+                "@jridgewell/trace-mapping": "^0.3.24"
+            }
+        },
+        "node_modules/@jridgewell/resolve-uri": {
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+            "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+            "license": "MIT",
+            "engines": {
+                "node": ">=6.0.0"
+            }
+        },
         "node_modules/@jridgewell/sourcemap-codec": {
             "version": "1.6.0",
             "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.6.0.tgz",
             "integrity": "sha512-T7jf+5zgsZHwNJ4lvQ7/aezbyk0nNX+zJVWpmHA7VYsEx7a7qr5Rg5IbtJFqkgze5Y2sruq1RUY8Q837Od7iFw==",
             "license": "MIT"
         },
+        "node_modules/@jridgewell/trace-mapping": {
+            "version": "0.3.31",
+            "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.31.tgz",
+            "integrity": "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==",
+            "license": "MIT",
+            "dependencies": {
+                "@jridgewell/resolve-uri": "^3.1.0",
+                "@jridgewell/sourcemap-codec": "^1.4.14"
+            }
+        },
         "node_modules/@oxc-project/types": {
             "version": "0.151.0",
             "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.151.0.tgz",
             "integrity": "sha512-J1yXrIlNDZVzE3ada310xeAw7nH8yCAyLPuUIsjKatFPmfn5bS1oW+cM+QsGOtVWd5nhSpbwZWx/rue+r5Z+PA==",
-            "dev": true,
             "license": "MIT",
             "funding": {
                 "url": "https://github.com/sponsors/oxc-project"
@@ -88,7 +128,6 @@
             "cpu": [
                 "arm"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -105,7 +144,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -122,7 +160,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -139,7 +176,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -156,7 +192,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -173,7 +208,6 @@
             "cpu": [
                 "arm"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -190,7 +224,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -207,7 +240,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -224,7 +256,6 @@
             "cpu": [
                 "ppc64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -241,7 +272,6 @@
             "cpu": [
                 "s390x"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -258,7 +288,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -275,7 +304,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -292,7 +320,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -309,7 +336,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -326,7 +352,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MIT",
             "optional": true,
             "os": [
@@ -340,14 +365,519 @@
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.1.tgz",
             "integrity": "sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==",
-            "dev": true,
             "license": "MIT"
         },
+        "node_modules/@tailwindcss/node": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.3.3.tgz",
+            "integrity": "sha512-/T8IKEsf9VTU6tLjgC7+sv2mOPtQxzE2jMw7u4Tt40Tx+QSZxpzh95/H6cMKoja9XuW7iMdLJYBB0o9G1CaAgg==",
+            "license": "MIT",
+            "dependencies": {
+                "@jridgewell/remapping": "^2.3.5",
+                "enhanced-resolve": "^5.24.1",
+                "jiti": "^2.7.0",
+                "lightningcss": "1.32.0",
+                "magic-string": "^0.30.21",
+                "source-map-js": "^1.2.1",
+                "tailwindcss": "4.3.3"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.32.0.tgz",
+            "integrity": "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==",
+            "license": "MPL-2.0",
+            "dependencies": {
+                "detect-libc": "^2.0.3"
+            },
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            },
+            "optionalDependencies": {
+                "lightningcss-android-arm64": "1.32.0",
+                "lightningcss-darwin-arm64": "1.32.0",
+                "lightningcss-darwin-x64": "1.32.0",
+                "lightningcss-freebsd-x64": "1.32.0",
+                "lightningcss-linux-arm-gnueabihf": "1.32.0",
+                "lightningcss-linux-arm64-gnu": "1.32.0",
+                "lightningcss-linux-arm64-musl": "1.32.0",
+                "lightningcss-linux-x64-gnu": "1.32.0",
+                "lightningcss-linux-x64-musl": "1.32.0",
+                "lightningcss-win32-arm64-msvc": "1.32.0",
+                "lightningcss-win32-x64-msvc": "1.32.0"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-android-arm64": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.32.0.tgz",
+            "integrity": "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "android"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-darwin-arm64": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.32.0.tgz",
+            "integrity": "sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-darwin-x64": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.32.0.tgz",
+            "integrity": "sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-freebsd-x64": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.32.0.tgz",
+            "integrity": "sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "freebsd"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-linux-arm-gnueabihf": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.32.0.tgz",
+            "integrity": "sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==",
+            "cpu": [
+                "arm"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-linux-arm64-gnu": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.32.0.tgz",
+            "integrity": "sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-linux-arm64-musl": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.32.0.tgz",
+            "integrity": "sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-linux-x64-gnu": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.32.0.tgz",
+            "integrity": "sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-linux-x64-musl": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.32.0.tgz",
+            "integrity": "sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-win32-arm64-msvc": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.32.0.tgz",
+            "integrity": "sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/node/node_modules/lightningcss-win32-x64-msvc": {
+            "version": "1.32.0",
+            "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.32.0.tgz",
+            "integrity": "sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MPL-2.0",
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 12.0.0"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/parcel"
+            }
+        },
+        "node_modules/@tailwindcss/oxide": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.3.3.tgz",
+            "integrity": "sha512-krXjAikiaFSPaK/FkAQT5UTx3VormQaiZ5hBFlJZ9UFQGB/rwg1MZIhHAG9smMQRTdyJxP6Qt5MwMtdyU5FWrA==",
+            "license": "MIT",
+            "engines": {
+                "node": ">= 20"
+            },
+            "optionalDependencies": {
+                "@tailwindcss/oxide-android-arm64": "4.3.3",
+                "@tailwindcss/oxide-darwin-arm64": "4.3.3",
+                "@tailwindcss/oxide-darwin-x64": "4.3.3",
+                "@tailwindcss/oxide-freebsd-x64": "4.3.3",
+                "@tailwindcss/oxide-linux-arm-gnueabihf": "4.3.3",
+                "@tailwindcss/oxide-linux-arm64-gnu": "4.3.3",
+                "@tailwindcss/oxide-linux-arm64-musl": "4.3.3",
+                "@tailwindcss/oxide-linux-x64-gnu": "4.3.3",
+                "@tailwindcss/oxide-linux-x64-musl": "4.3.3",
+                "@tailwindcss/oxide-wasm32-wasi": "4.3.3",
+                "@tailwindcss/oxide-win32-arm64-msvc": "4.3.3",
+                "@tailwindcss/oxide-win32-x64-msvc": "4.3.3"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-android-arm64": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.3.3.tgz",
+            "integrity": "sha512-Y85A2gmPSkl5Ve5qR86GL4HT509cFqQh1aes9p3sSkyTPwt0Pppf3GkwGe4JPACcRYjgJIEhQgM6dBClnr0NYw==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "android"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-darwin-arm64": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.3.3.tgz",
+            "integrity": "sha512-BiaWatpBcERQFDlOjRDpIVXuFK5PJez5SA4JMg6VYZdBYU+qKfV/vqjcIs+IYmtitf1xYQZTwXvU/8y4lfZUGw==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-darwin-x64": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.3.3.tgz",
+            "integrity": "sha512-fAeUqfV5ndhxRwai8cXGzdLvul9utWOmeTkv69unv4ZXixjn61Z+p9lCWdwOwA3TYboG3BwdVuN/RDjhBRl0mw==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-freebsd-x64": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.3.3.tgz",
+            "integrity": "sha512-iyf5bV6+wnAlflVeEy7R25dupxTNECZN5QMI0qNT6eT+EgaGdZcKhGkr5SdoaWiLJ3spLqIY9VCeSGrwmtg4kw==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "freebsd"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-linux-arm-gnueabihf": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.3.3.tgz",
+            "integrity": "sha512-aAYUprJAJQWWbRrPvtjdroZ56Md+JM8pMiopS6xGEwDfLhqj+2ver2p4nU4Mb3CRqcMmNBjo8KkUgcxhkzVQGQ==",
+            "cpu": [
+                "arm"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-linux-arm64-gnu": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.3.3.tgz",
+            "integrity": "sha512-nDxldcEENOxZRzC2uu9jrutZdAAQtb+8WWDCSnWL1zvBk1+FN+x6MtDViPB5AJMfttVCUhehGWus3XBPgatM/w==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-linux-arm64-musl": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.3.3.tgz",
+            "integrity": "sha512-Md44bD6veX/PC5iyF8cDVnw4HBIANZepRZZ7a8DQOvkfo5WUBwcp6iAuCUz23u+4SUkhJlD3eL7hNdW8ezd/kA==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-linux-x64-gnu": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.3.3.tgz",
+            "integrity": "sha512-tx7us1muwOKAKWao2v/GaafFeQboE6aj88vC6ziN2NCGcRm8gWUhwjzg+YdVB1e4boAtdtma4L43onunI6NS4w==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-linux-x64-musl": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.3.3.tgz",
+            "integrity": "sha512-SJxX60smvHgasZoBy11dX6YRjXJFovwWBoedhbQPOBzgFWBHGB+TVPWB9BxzR7TTxU8FQZAI2AyiNCMzFm8Img==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-wasm32-wasi": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.3.3.tgz",
+            "integrity": "sha512-jx1+rPhY/5Ympkktd656HBWEBLxP7dH06losBLjjf5vgCODXvi9KhtftWcMIwTFIDqBr7cRnQkdLnAG+IOlGvQ==",
+            "bundleDependencies": [
+                "@napi-rs/wasm-runtime",
+                "@emnapi/core",
+                "@emnapi/runtime",
+                "@tybys/wasm-util",
+                "@emnapi/wasi-threads",
+                "tslib"
+            ],
+            "cpu": [
+                "wasm32"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "dependencies": {
+                "@emnapi/core": "^1.11.1",
+                "@emnapi/runtime": "^1.11.1",
+                "@emnapi/wasi-threads": "^1.2.2",
+                "@napi-rs/wasm-runtime": "^1.1.4",
+                "@tybys/wasm-util": "^0.10.2",
+                "tslib": "^2.8.1"
+            },
+            "engines": {
+                "node": ">=14.0.0"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-win32-arm64-msvc": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.3.3.tgz",
+            "integrity": "sha512-3rc292Ca2ceK6Ulcc/bAVnTs/3nDtoPhyEKlgPv+yQJQi/JS/AMJlqzxvlDacL1nekbrcf6bTqp/jV4qgnPxNQ==",
+            "cpu": [
+                "arm64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/oxide-win32-x64-msvc": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.3.3.tgz",
+            "integrity": "sha512-yJ0pwIVc/nYeGoV02WtsN8KYyLQv7kyI2wDnkezyJlGGjkd4QLwDGAwl47YpPJeuI0M0ObaXGSPjvWDPeTPggw==",
+            "cpu": [
+                "x64"
+            ],
+            "license": "MIT",
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 20"
+            }
+        },
+        "node_modules/@tailwindcss/vite": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.3.3.tgz",
+            "integrity": "sha512-yYU8cogLeSh/ms2jh8Fj7jaba/EWa7Ja6GoUqYZaraEuCI5YS6ms6ObZgjjedm+jm6XZjdNRWBpPP6Z86oOxcw==",
+            "license": "MIT",
+            "dependencies": {
+                "@tailwindcss/node": "4.3.3",
+                "@tailwindcss/oxide": "4.3.3",
+                "tailwindcss": "4.3.3"
+            },
+            "peerDependencies": {
+                "vite": "^5.2.0 || ^6 || ^7 || ^8"
+            }
+        },
         "node_modules/@types/node": {
             "version": "22.20.4",
             "resolved": "https://registry.npmjs.org/@types/node/-/node-22.20.4.tgz",
             "integrity": "sha512-zJRE40jpHtKqE/C4fgHrAKQLJuSpzEnP9ff9Y7YtoR3Wd2pwqzlekDeEuUQXjRd+QCYnVnNwuJYmhdk9XV8gvA==",
-            "dev": true,
+            "devOptional": true,
             "license": "MIT",
             "dependencies": {
                 "undici-types": "~6.21.0"
@@ -549,12 +1079,24 @@
             "version": "2.1.2",
             "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
             "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
-            "dev": true,
             "license": "Apache-2.0",
             "engines": {
                 "node": ">=8"
             }
         },
+        "node_modules/enhanced-resolve": {
+            "version": "5.25.1",
+            "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.25.1.tgz",
+            "integrity": "sha512-nGXts5znJzmWPu+mIE9izCOzdg63oJca2mDzGWWTth7sr4aCToKcoyFVBQwN75Ij5Pf6p510EwkTqViTRzDV+w==",
+            "license": "MIT",
+            "dependencies": {
+                "graceful-fs": "^4.2.4",
+                "tapable": "^2.3.3"
+            },
+            "engines": {
+                "node": ">=10.13.0"
+            }
+        },
         "node_modules/entities": {
             "version": "7.0.1",
             "resolved": "https://registry.npmjs.org/entities/-/entities-7.0.1.tgz",
@@ -577,7 +1119,6 @@
             "version": "6.5.0",
             "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
             "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=12.0.0"
@@ -595,7 +1136,6 @@
             "version": "2.3.3",
             "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
             "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
-            "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
             "optional": true,
@@ -606,11 +1146,25 @@
                 "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
             }
         },
+        "node_modules/graceful-fs": {
+            "version": "4.2.11",
+            "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
+            "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
+            "license": "ISC"
+        },
+        "node_modules/jiti": {
+            "version": "2.7.0",
+            "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.7.0.tgz",
+            "integrity": "sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ==",
+            "license": "MIT",
+            "bin": {
+                "jiti": "lib/jiti-cli.mjs"
+            }
+        },
         "node_modules/lightningcss": {
             "version": "1.33.0",
             "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.33.0.tgz",
             "integrity": "sha512-WkUDrojuJs0xkgGf2udWxa3yGBRxPtxUkB79i6aCZLRgc7PM8fZe9TosfPDcvEpQZbuFASnHYmRLBLUbmLOIIA==",
-            "dev": true,
             "license": "MPL-2.0",
             "dependencies": {
                 "detect-libc": "^2.0.3"
@@ -643,7 +1197,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -664,7 +1217,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -685,7 +1237,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -706,7 +1257,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -727,7 +1277,6 @@
             "cpu": [
                 "arm"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -748,7 +1297,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -769,7 +1317,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -790,7 +1337,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -811,7 +1357,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -832,7 +1377,6 @@
             "cpu": [
                 "arm64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -853,7 +1397,6 @@
             "cpu": [
                 "x64"
             ],
-            "dev": true,
             "license": "MPL-2.0",
             "optional": true,
             "os": [
@@ -918,7 +1461,6 @@
             "version": "4.0.7",
             "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.7.tgz",
             "integrity": "sha512-qcJu88Q2IWqJsDD529JKMdwGm/dvInW4HvQnRwiH9JtihJvzGOscDtHE3x1pBKeUOTysQ8kVmLnJ2kJu7yhcGA==",
-            "dev": true,
             "license": "MIT",
             "engines": {
                 "node": ">=12"
@@ -959,7 +1501,6 @@
             "version": "1.2.11",
             "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.2.11.tgz",
             "integrity": "sha512-qpSwIyz0jHQq5qXBTNxFmE6664rJ7O+4TvPFOiOaBSrz8IOHc1koKKSqTM2H6u1UG1+TveuC6vaDHKXFOvb1Kw==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "@oxc-project/types": "=0.151.0",
@@ -998,11 +1539,29 @@
                 "node": ">=0.10.0"
             }
         },
+        "node_modules/tailwindcss": {
+            "version": "4.3.3",
+            "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.3.3.tgz",
+            "integrity": "sha512-gOhV3P7ufE62QDGg1zVaTgCR+EtPv92k2nIhVcVKcLmxT1sUBsQGhnZj175j+MqRt4zLF7ic+sCYjfhxMxj7YQ==",
+            "license": "MIT"
+        },
+        "node_modules/tapable": {
+            "version": "2.3.3",
+            "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.3.tgz",
+            "integrity": "sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A==",
+            "license": "MIT",
+            "engines": {
+                "node": ">=6"
+            },
+            "funding": {
+                "type": "opencollective",
+                "url": "https://opencollective.com/webpack"
+            }
+        },
         "node_modules/tinyglobby": {
             "version": "0.2.17",
             "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.17.tgz",
             "integrity": "sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "fdir": "^6.5.0",
@@ -1033,14 +1592,13 @@
             "version": "6.21.0",
             "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
             "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
-            "dev": true,
+            "devOptional": true,
             "license": "MIT"
         },
         "node_modules/vite": {
             "version": "8.3.1",
             "resolved": "https://registry.npmjs.org/vite/-/vite-8.3.1.tgz",
             "integrity": "sha512-/bvH9E9tmCXRGp2uXY3WbOldqpTwFkbha/8ANaEQ6VkxhH60KyqLwgZq6lG2y+4uT55x9+9eUHMpQ7uGnOCKjA==",
-            "dev": true,
             "license": "MIT",
             "dependencies": {
                 "lightningcss": "^1.33.0",

frontend/package.json

@@ -9,6 +9,8 @@
         "preview": "vite preview"
     },
     "dependencies": {
+        "@tailwindcss/vite": "^4.3.3",
+        "tailwindcss": "^4.3.3",
         "vue": "^3.5.32"
     },
     "devDependencies": {

frontend/src/App.vue

@@ -1,32 +1,6 @@
 <template>
-    <main class="home">
+    <main class="flex min-h-screen flex-col p-8">
-        <h1>Private Image</h1>
+        <h1 class="text-2xl font-semibold tracking-tight">Private Image</h1>
+        <p class="mt-2 text-muted-foreground">Privacy-first image hosting — upload UI coming soon.</p>
     </main>
 </template>
-
-<style scoped>
-.home {
-    box-sizing: border-box;
-    min-height: 100vh;
-    margin: 0;
-    padding: 2rem;
-    font-family:
-        system-ui,
-        -apple-system,
-        Segoe UI,
-        Roboto,
-        sans-serif;
-    line-height: 1.5;
-}
-
-h1 {
-    margin: 0 0 0.5rem;
-    font-size: 1.75rem;
-    font-weight: 600;
-}
-
-p {
-    margin: 0;
-    color: #444;
-}
-</style>

frontend/src/assets/css/main.css

@@ -0,0 +1,75 @@
+@import 'tailwindcss';
+
+@custom-variant dark (&:is(.dark *));
+
+@theme inline {
+    --radius-sm: calc(var(--radius) - 4px);
+    --radius-md: calc(var(--radius) - 2px);
+    --radius-lg: var(--radius);
+    --radius-xl: calc(var(--radius) + 4px);
+    --color-background: var(--background);
+    --color-foreground: var(--foreground);
+    --color-card: var(--card);
+    --color-card-foreground: var(--card-foreground);
+    --color-primary: var(--primary);
+    --color-primary-foreground: var(--primary-foreground);
+    --color-secondary: var(--secondary);
+    --color-secondary-foreground: var(--secondary-foreground);
+    --color-muted: var(--muted);
+    --color-muted-foreground: var(--muted-foreground);
+    --color-accent: var(--accent);
+    --color-accent-foreground: var(--accent-foreground);
+    --color-destructive: var(--destructive);
+    --color-border: var(--border);
+    --color-input: var(--input);
+    --color-ring: var(--ring);
+}
+
+:root {
+    --radius: 0.5rem;
+    --background: oklch(0.99 0.002 260);
+    --foreground: oklch(0.2 0.02 260);
+    --card: oklch(1 0 0);
+    --card-foreground: oklch(0.2 0.02 260);
+    --primary: oklch(0.42 0.08 260);
+    --primary-foreground: oklch(0.99 0.002 260);
+    --secondary: oklch(0.96 0.01 260);
+    --secondary-foreground: oklch(0.28 0.03 260);
+    --muted: oklch(0.96 0.008 260);
+    --muted-foreground: oklch(0.48 0.02 260);
+    --accent: oklch(0.94 0.02 260);
+    --accent-foreground: oklch(0.28 0.03 260);
+    --destructive: oklch(0.55 0.2 25);
+    --border: oklch(0.9 0.01 260);
+    --input: oklch(0.9 0.01 260);
+    --ring: oklch(0.42 0.08 260);
+}
+
+.dark {
+    --background: oklch(0.16 0.02 260);
+    --foreground: oklch(0.96 0.01 260);
+    --card: oklch(0.2 0.02 260);
+    --card-foreground: oklch(0.96 0.01 260);
+    --primary: oklch(0.72 0.1 260);
+    --primary-foreground: oklch(0.18 0.02 260);
+    --secondary: oklch(0.24 0.02 260);
+    --secondary-foreground: oklch(0.96 0.01 260);
+    --muted: oklch(0.24 0.02 260);
+    --muted-foreground: oklch(0.68 0.02 260);
+    --accent: oklch(0.28 0.03 260);
+    --accent-foreground: oklch(0.96 0.01 260);
+    --destructive: oklch(0.62 0.2 25);
+    --border: oklch(0.32 0.02 260);
+    --input: oklch(0.32 0.02 260);
+    --ring: oklch(0.72 0.1 260);
+}
+
+@layer base {
+    * {
+        @apply border-border;
+    }
+
+    body {
+        @apply bg-background text-foreground antialiased;
+    }
+}

frontend/src/main.ts

@@ -1,4 +1,5 @@
 import { createApp } from 'vue';
+import '@/assets/css/main.css';
 import App from './App.vue';
 
 createApp(App).mount('#app');

frontend/vite.config.ts

@@ -1,5 +1,6 @@
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
+import tailwindcss from '@tailwindcss/vite';
 import { defineConfig } from 'vite';
 import vue from '@vitejs/plugin-vue';
 
@@ -11,8 +12,5 @@ export default defineConfig({
             '@': path.resolve(__dirname, 'src')
         }
     },
-    plugins: [vue()],
+    plugins: [vue(), tailwindcss()]
-    server: {
-        port: 5173
-    }
 });