Merge remote-tracking branch 'origin/main'

chore: update AAGUIDs (#1511 )
Co-authored-by: stonith404 <58886915+stonith404@users.noreply.github.com>
2026-07-23 21:37:34 +03:00 · 2026-06-16 08:48:35 +02:00 · 2026-06-08 09:22:50 +02:00 · 2026-06-05 11:39:14 +02:00 · 2026-06-02 14:08:33 +02:00 · 2026-06-02 14:02:12 +02:00
156 changed files with 2116 additions and 648 deletions
--- a/.github/ISSUE_TEMPLATE/feature.yml
+++ b/.github/ISSUE_TEMPLATE/feature.yml
@@ -1,7 +1,8 @@
 name: 🚀 Feature
 description: "Submit a proposal for a new feature"
 title: "🚀 Feature: "
-type: 'Feature'
+type: "Feature"
+labels: ["needs more upvotes"]
 body:
  - type: textarea
    id: feature-description
--- a/.github/pull_request_template.md
+++ b/.github/pull_request_template.md
@@ -0,0 +1,12 @@
+## What does this PR do?
+
+## Screenshots
+
+## AI Usage
+
+## Contributing Guidelines
+
+Have you read the [Contributing Guidelines](https://github.com/pocket-id/pocket-id/blob/main/CONTRIBUTING.md)?
+
+- [ ] If I'm implementing a new feature, I have opened an issue first, or commented on an existing one, to discuss the implementation details.
+- [ ] I have read the [AI Usage Guidelines](https://github.com/pocket-id/pocket-id/blob/main/CONTRIBUTING.md#ai-usage-policy).
--- a/.github/workflows/pr-quality.yml
+++ b/.github/workflows/pr-quality.yml
@@ -42,7 +42,7 @@ jobs:

                  # PR Template Checks
                  require-pr-template: true
-                  strict-pr-template-sections: ""
+                  strict-pr-template-sections: "Contributing Guidelines"
                  optional-pr-template-sections: "Issues"
                  max-additional-pr-template-sections: 3

--- a/.version
+++ b/.version
@@ -1 +1 @@
-2.7.0
+2.8.0
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,46 @@
+## v2.8.0
+
+### Bug Fixes
+
+- delete refresh tokens on end-session to prevent reuse after logout ([#1458](https://github.com/pocket-id/pocket-id/pull/1458) by @wucm667)
+- return 404 status code for `.well-known` routes if not found ([714b5b3](https://github.com/pocket-id/pocket-id/commit/714b5b3307bb012b94e66e8dcb1de93a2d62eceb) by @stonith404)
+- add `email_verified` to reserved claims list ([8b22fca](https://github.com/pocket-id/pocket-id/commit/8b22fcaaa475984bb4c42306487035073d7c47e3) by @stonith404)
+- reject unknown PKCE code challenge methods ([ce6bdb9](https://github.com/pocket-id/pocket-id/commit/ce6bdb9d7e6c0f1eaaa21ddb6d808e41088a38b8) by @stonith404)
+- make stream of downloaded logos seekable for S3 checksum calculation ([cc9163f](https://github.com/pocket-id/pocket-id/commit/cc9163f577280d7c278dc744e20d0505dbe83ede) by @stonith404)
+- scope confirmation wasn't shown if account selection was prompted ([272d147](https://github.com/pocket-id/pocket-id/commit/272d1479bd64b4a068bfe4dfa5ba4cd3c5e90505) by @stonith404)
+- add support for unix socket mode in healthcheck ([a712196](https://github.com/pocket-id/pocket-id/commit/a71219637af1746e9faba5274b6095da676ec555) by @stonith404)
+- restore cross-platform binary builds ([7027296](https://github.com/pocket-id/pocket-id/commit/7027296632ab82cd9930f2fbe60054c2421688c4) by @stonith404)
+
+### Documentation
+
+- update SECURITY.md ([bb5a111](https://github.com/pocket-id/pocket-id/commit/bb5a111e3d51ad56fc074df7083022e3d4e25369) by @stonith404)
+
+### Features
+
+- delete OAuth refresh token on RP initiated logout ([#1480](https://github.com/pocket-id/pocket-id/pull/1480) by @stonith404)
+- remove EXIF/XMP metadata from uploaded images ([#1477](https://github.com/pocket-id/pocket-id/pull/1477) by @stonith404)
+- add support for `response_mode=fragment` ([0c95b7c](https://github.com/pocket-id/pocket-id/commit/0c95b7c3cc171ed77b51f236009b5ff659da0bec) by @stonith404)
+- add support for systemd socket activation ([#1479](https://github.com/pocket-id/pocket-id/pull/1479) by @deviant)
+- improve design trough the whole application ([b3d40a4](https://github.com/pocket-id/pocket-id/commit/b3d40a476b35cfa2451749e9a3d307b7babaeb6b) by @stonith404)
+
+### Other
+
+- update AAGUIDs ([#1476](https://github.com/pocket-id/pocket-id/pull/1476) by @github-actions[bot])
+- upgrade dependencies ([91c2ea2](https://github.com/pocket-id/pocket-id/commit/91c2ea2a6616a500922365d1789f1fa1ba66c112) by @stonith404)
+- remove deprecated http2 package ([e56dc12](https://github.com/pocket-id/pocket-id/commit/e56dc124cee4d3c176c89e7d574ddfde089bcbd1) by @stonith404)
+- apply go 1.26.0 syntax updated ([8ad95b8](https://github.com/pocket-id/pocket-id/commit/8ad95b8af17ba8cbb62168ed0bb54c87e3df379c) by @stonith404)
+- delete refresh tokens on end-session to prevent reuse after logout ([b27a52a](https://github.com/pocket-id/pocket-id/commit/b27a52a5915228383dbdbf0a2c353452cd351d0f) by @stonith404)
+- use dependabot for automatic dependency upgrades ([b9fdd53](https://github.com/pocket-id/pocket-id/commit/b9fdd530c0f370f2fccb6251d700aa6f9bdf4124) by @stonith404)
+- fix invalid schema ([e8c398f](https://github.com/pocket-id/pocket-id/commit/e8c398ffbd6545f76c983f01556bb3b73d40a728) by @stonith404)
+- update AAGUIDs ([#1487](https://github.com/pocket-id/pocket-id/pull/1487) by @github-actions[bot])
+- use custom Playwright route for callback URL checks ([f134247](https://github.com/pocket-id/pocket-id/commit/f13424720b7f5da3978988f0f9169cf303971a13) by @stonith404)
+- fix linter issues ([bc4f75c](https://github.com/pocket-id/pocket-id/commit/bc4f75c44f12a71380042ad4c140d41f4dddc7dd) by @stonith404)
+- don't compare hashes of profile pictures ([9ad2bfc](https://github.com/pocket-id/pocket-id/commit/9ad2bfc7b30e0eb2d7ae1406874b8caba5a1f121) by @stonith404)
+- run formatter ([0616aba](https://github.com/pocket-id/pocket-id/commit/0616abaf7f079d0a35543258e13aa5b4acb4adc0) by @stonith404)
+- use fixed minor version of Go ([e046a03](https://github.com/pocket-id/pocket-id/commit/e046a03364f00001f8699aaa7e902b33c2661118) by @stonith404)
+
+**Full Changelog**: https://github.com/pocket-id/pocket-id/compare/v2.7.0...v2.8.0
+
 ## v2.7.0

 ### Bug Fixes
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,12 +1,35 @@
 # Contributing

-I am happy that you want to contribute to Pocket ID and help to make it better! All contributions are welcome, including issues, suggestions, pull requests and more.
+We are happy that you want to contribute to Pocket ID and help to make it better!
+
+## Before you start
+
+Before starting to work on a new feature, please open an issue first, or comment on an existing one, to discuss the implementation details. This saves you time and avoids the disappointment of having a PR closed later because the change doesn't fit the project's direction.
+
+### AI Usage Policy
+
+We have nothing against using AI tools to assist your development. But we've seen a growing number of pull requests that appear to be fully or largely AI-generated and submitted without genuine human review. These are difficult and time-consuming for maintainers to review, and they often waste everyone's time.
+
+To keep contributions reviewable and high-quality, please follow these guidelines when using AI tools.
+
+#### Guidelines for Using AI Tools
+
+1. **Understand every line.** You must be able to explain what your code does and why, in your own words. "The AI wrote it" is not an acceptable answer to a reviewer's question.
+2. **Test before submitting.** Review and test all code manually, as a human, before opening a PR. Don't trust the AI's claim that it works.
+3. **Write your own words.** Don't paste AI-generated text into issues, comments, or PR descriptions. Walls of generated text make discussions harder, not easier.
+4. **Disclose your usage.** Note in the PR description how you used AI (see below).
+
+PRs that appear to be low effort AI output may be closed without a detailed review.
+
+#### Example disclosure
+
+> Used GitHub Copilot for autocomplete, and asked an LLM to help draft the test cases in `parser_test.go`. I reviewed, edited, and tested everything myself and understand how it works.
+
+> Used an LLM to generate the initial implementation of the new API endpoint, but I manually reviewed and tested it before submitting.

 ## Getting started

-You've found a bug, have suggestion or something else, just create an issue on GitHub and we can get in touch.
-
-## Submit a Pull Request
+### Submit a Pull Request

 Before you submit the pull request for review please ensure that

@@ -29,15 +52,15 @@ Before you submit the pull request for review please ensure that
 - Your pull request has a detailed description
 - You run `pnpm format` to format the code

-## Development Environment
+### Development Environment

 Pocket ID consists of a frontend and backend. In production the frontend gets statically served by the backend, but in development they run as separate processes to enable hot reloading.

 There are two ways to get the development environment setup:

-### 1. Install required tools
+#### 1. Install required tools

-#### With Dev Containers
+##### With Dev Containers

 If you use [Dev Containers](https://code.visualstudio.com/docs/remote/containers) in VS Code, you don't need to install anything manually, just follow the steps below.

@@ -46,7 +69,7 @@ If you use [Dev Containers](https://code.visualstudio.com/docs/remote/containers
 3. VS Code will detect .devcontainer and will prompt you to open the folder in devcontainer
 4. If the auto prompt does not work, hit `F1` and select `Dev Containers: Open Folder in Container.`, then select the pocket-id repo root folder and it'll open in container.

-#### Without Dev Containers
+##### Without Dev Containers

 If you don't use Dev Containers, you need to install the following tools manually:

@@ -54,9 +77,9 @@ If you don't use Dev Containers, you need to install the following tools manuall
 - [Go](https://golang.org/doc/install) >= 1.26
 - [Git](https://git-scm.com/downloads)

-### 2. Setup
+#### 2. Setup

-#### Backend
+##### Backend

 The backend is built with [Gin](https://gin-gonic.com) and written in Go. To set it up, follow these steps:

@@ -64,7 +87,7 @@ The backend is built with [Gin](https://gin-gonic.com) and written in Go. To set
 2. Copy the `.env.development-example` file to `.env` and edit the variables as needed
 3. Start the backend with `go run -tags exclude_frontend ./cmd`

-### Frontend
+##### Frontend

 The frontend is built with [SvelteKit](https://kit.svelte.dev) and written in TypeScript. To set it up, follow these steps:

@@ -77,9 +100,13 @@ You're all set! The application is now listening on `localhost:3000`. The backen

 ### Testing

+If you are contributing to a new feature please ensure that you add tests for it.
+
+#### End-to-end tests
+
 We are using [Playwright](https://playwright.dev) for end-to-end testing.

-If you are contributing to a new feature please ensure that you add tests for it. The tests are located in the `tests` folder at the root of the project.
+The tests are located in the `tests` folder at the root of the project.

 The tests can be run like this:

@@ -93,3 +120,9 @@ The tests can be run like this:
 5. Run the tests with `pnpm dlx playwright test` or from the root project folder `pnpm test`

 If you make any changes to the application, you have to rebuild the test environment by running `docker compose up -d --build` again.
+
+#### Unit tests
+
+In the backend we are using unit tests with the built-in Go testing framework. The tests are located in the same folder as the code they are testing and have the `_test.go` suffix.
+
+To run the tests, simply run `go test ./...` from the root of the `backend` folder.
--- a/SECURITY.md
+++ b/SECURITY.md
@@ -5,7 +5,7 @@
 It's recommended to always use the latest version of Pocket ID. We will provide security updates for the latest version.

 > [!NOTE]  
-> Updates can be automated with e.g [Watchtower](https://github.com/containrrr/watchtower). Upgrading between non major versions is safe but you shouldn't upgrade between major versions before checking the release notes.
+> Updates can be automated with e.g [Watchtower](https://github.com/nicholas-fedor/watchtower/). Upgrading between non major versions is safe but you shouldn't upgrade between major versions before checking the release notes.

 ## Reporting a Vulnerability

--- a/backend/.env.development-example
+++ b/backend/.env.development-example
@@ -6,4 +6,7 @@ APP_ENV=development
 # In the development environment the backend gets proxied by the frontend
 APP_URL=http://localhost:3000
 PORT=1411
-MAXMIND_LICENSE_KEY=your_license_key
+MAXMIND_LICENSE_KEY=your_license_key
+
+# Set the ENCRYPTION_KEY to a random sequence of characters, for example generated with `openssl rand -base64 32`
+ENCRYPTION_KEY=
--- a/backend/frontend/frontend_included.go
+++ b/backend/frontend/frontend_included.go
@@ -87,10 +87,13 @@ func RegisterFrontend(router *gin.Engine, oidcService *service.OidcService) erro
 		if isSPARequest(path, distFS) {
 			nonce := middleware.GetCSPNonce(c)

-			if isOAuth2AuthorizationPostRequest(c) {
-				// In that case, we need to validate and allow form submissions to the redirect_uri
-				redirectURI := c.Query("redirect_uri")
+			// For an authorization request that responds via response_mode=form_post, the
+			// consent page auto-submits a form to the client's callback, so that callback
+			// must be allowed in the CSP form-action directive
+			isAuthPostRequest, redirectURI := isOAuth2AuthorizationPostRequest(c, oidcService)
+			if isAuthPostRequest {
 				clientID := c.Query("client_id")
+				// In that case, we need to validate and allow form submissions to the redirect_uri
 				validatedRedirectURI, err := oidcService.ResolveAllowedCallbackURL(c.Request.Context(), clientID, redirectURI)
 				if err == nil {
 					c.Header("Content-Security-Policy", middleware.BuildCSP(nonce, validatedRedirectURI))
@@ -113,17 +116,21 @@ func RegisterFrontend(router *gin.Engine, oidcService *service.OidcService) erro
 	}

 	rateLimitMiddleware := middleware.NewRateLimitMiddleware().Add(rate.Every(300*time.Millisecond), 50)
-	router.NoRoute(rateLimitOnlyForOAuth2AuthorizationPostRequest(rateLimitMiddleware, distFS), handler)
+	router.NoRoute(rateLimitOnlyForOAuth2AuthorizationPostRequest(rateLimitMiddleware, oidcService, distFS), handler)

 	return nil
 }

-func rateLimitOnlyForOAuth2AuthorizationPostRequest(rateLimitMiddleware gin.HandlerFunc, distFS fs.FS) gin.HandlerFunc {
+func rateLimitOnlyForOAuth2AuthorizationPostRequest(rateLimitMiddleware gin.HandlerFunc, oidcService *service.OidcService, distFS fs.FS) gin.HandlerFunc {
 	return func(c *gin.Context) {
 		path := strings.TrimPrefix(c.Request.URL.Path, "/")
-		if isSPARequest(path, distFS) && isOAuth2AuthorizationPostRequest(c) {
-			rateLimitMiddleware(c)
-			return
+
+		if isSPARequest(path, distFS) {
+			isAuthPostRequest, _ := isOAuth2AuthorizationPostRequest(c, oidcService)
+			if isAuthPostRequest {
+				rateLimitMiddleware(c)
+				return
+			}
 		}

 		c.Next()
@@ -132,12 +139,29 @@ func rateLimitOnlyForOAuth2AuthorizationPostRequest(rateLimitMiddleware gin.Hand

 // isOAuth2AuthorizationRequest checks if this is an OAuth2 authorization request with response_mode=form_post
 // In that case, we need to validate and allow form submissions to the redirect_uri
-func isOAuth2AuthorizationPostRequest(c *gin.Context) bool {
+func isOAuth2AuthorizationPostRequest(c *gin.Context, oidcService *service.OidcService) (bool, string) {
 	responseMode := c.Query("response_mode")
 	redirectURI := c.Query("redirect_uri")
 	clientID := c.Query("client_id")
+	requestUri := c.Query("request_uri")

-	return responseMode == "form_post" && redirectURI != "" && clientID != ""
+	if c.Request.URL.Path != "/authorize" {
+		return false, ""
+	}
+
+	if requestUri != "" && clientID != "" {
+		par, err := oidcService.GetPushedAuthorizationRequest(c.Request.Context(), clientID, requestUri)
+		if err != nil {
+			return false, ""
+		}
+
+		responseMode = par.Parameters.ResponseMode
+		redirectURI = par.Parameters.RedirectURI
+
+	}
+
+	ok := responseMode == "form_post" && redirectURI != "" && clientID != ""
+	return ok, redirectURI
 }

 func isSPARequest(path string, distFS fs.FS) bool {
--- a/backend/frontend/frontend_included_test.go
+++ b/backend/frontend/frontend_included_test.go
@@ -43,7 +43,7 @@ func TestRateLimitOnlyForOAuth2AuthorizationPostRequest(t *testing.T) {
 		middleware := rateLimitOnlyForOAuth2AuthorizationPostRequest(func(c *gin.Context) {
 			rateLimited = true
 			c.Abort()
-		}, distFS)
+		}, nil, distFS)

 		router := gin.New()
 		router.NoRoute(
@@ -67,7 +67,7 @@ func TestRateLimitOnlyForOAuth2AuthorizationPostRequest(t *testing.T) {
 		middleware := rateLimitOnlyForOAuth2AuthorizationPostRequest(func(c *gin.Context) {
 			rateLimited = true
 			c.Abort()
-		}, distFS)
+		}, nil, distFS)

 		router := gin.New()
 		router.NoRoute(
@@ -91,7 +91,7 @@ func TestRateLimitOnlyForOAuth2AuthorizationPostRequest(t *testing.T) {
 		middleware := rateLimitOnlyForOAuth2AuthorizationPostRequest(func(c *gin.Context) {
 			rateLimited = true
 			c.Abort()
-		}, distFS)
+		}, nil, distFS)

 		router := gin.New()
 		router.NoRoute(
@@ -108,4 +108,30 @@ func TestRateLimitOnlyForOAuth2AuthorizationPostRequest(t *testing.T) {
 		assert.False(t, rateLimited)
 		assert.True(t, nextCalled)
 	})
+
+	t.Run("does not rate limit non-authorize spa path with form_post params", func(t *testing.T) {
+		rateLimited := false
+		nextCalled := false
+		// oidcService is nil: a non-/authorize path is rejected by the path guard
+		// before the request_uri branch that would dereference it.
+		middleware := rateLimitOnlyForOAuth2AuthorizationPostRequest(func(c *gin.Context) {
+			rateLimited = true
+			c.Abort()
+		}, nil, distFS)
+
+		router := gin.New()
+		router.NoRoute(
+			middleware,
+			func(c *gin.Context) {
+				nextCalled = true
+			},
+		)
+
+		recorder := httptest.NewRecorder()
+		req := httptest.NewRequest(http.MethodGet, "/settings?response_mode=form_post&client_id=test&redirect_uri=https://example.com/callback", nil)
+		router.ServeHTTP(recorder, req)
+
+		assert.False(t, rateLimited)
+		assert.True(t, nextCalled)
+	})
 }
--- a/backend/go.mod
+++ b/backend/go.mod
@@ -1,6 +1,6 @@
 module github.com/pocket-id/pocket-id/backend

-go 1.26.0
+go 1.26

 require (
 	github.com/aws/aws-sdk-go-v2 v1.41.7
@@ -10,6 +10,7 @@ require (
 	github.com/aws/smithy-go v1.25.1
 	github.com/caarlos0/env/v11 v11.4.1
 	github.com/cenkalti/backoff/v5 v5.0.3
+	github.com/coreos/go-systemd v0.0.0-20191104093116-d3cd4ed1dbcf
 	github.com/disintegration/imageorient v0.0.0-20180920195336-8147d86e83ec
 	github.com/disintegration/imaging v1.6.2
 	github.com/dunglas/go-urlpattern v0.0.0-20241020164140-716dfa1c80b1
--- a/backend/go.sum
+++ b/backend/go.sum
@@ -65,6 +65,8 @@ github.com/containerd/errdefs v1.0.0 h1:tg5yIfIlQIrxYtu9ajqY42W3lpS19XqdxRQeEwYG
 github.com/containerd/errdefs v1.0.0/go.mod h1:+YBYIdtsnF4Iw6nWZhJcqGSg/dwvV7tyJ/kCkyJ2k+M=
 github.com/containerd/errdefs/pkg v0.3.0 h1:9IKJ06FvyNlexW690DXuQNx2KA2cUJXx151Xdx3ZPPE=
 github.com/containerd/errdefs/pkg v0.3.0/go.mod h1:NJw6s9HwNuRhnjJhM7pylWwMyAkmCQvQ4GpJHEqRLVk=
+github.com/coreos/go-systemd v0.0.0-20191104093116-d3cd4ed1dbcf h1:iW4rZ826su+pqaw19uhpSCzhj44qo35pNgKFGqzDKkU=
+github.com/coreos/go-systemd v0.0.0-20191104093116-d3cd4ed1dbcf/go.mod h1:F5haX7vjVVG0kc13fIWeqUViNPyEJxv/OmvnBo0Yme4=
 github.com/cpuguy83/go-md2man/v2 v2.0.6/go.mod h1:oOW0eioCTA6cOiMLiUPZOpcVxMig6NIQQ7OS05n1F4g=
 github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
 github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
--- a/backend/internal/bootstrap/router_bootstrap.go
+++ b/backend/internal/bootstrap/router_bootstrap.go
@@ -9,7 +9,6 @@ import (
 	"net"
 	"net/http"
 	"os"
-	"strconv"
 	"strings"
 	"sync"
 	"sync/atomic"
@@ -163,24 +162,26 @@ func initServer(r *gin.Engine) (*serverConfig, error) {
 		return nil, err
 	}

-	network, addr := listenerNetworkAndAddr()
-	listener, err := net.Listen(network, addr) //nolint:noctx
-	if err != nil {
-		return nil, fmt.Errorf("failed to create %s listener: %w", network, err)
+	var socketFn func() (*socket, error)
+	switch {
+	case common.EnvConfig.SystemdSocket:
+		socketFn = systemdSocket
+	case common.EnvConfig.UnixSocket != "":
+		socketFn = unixSocket
+	default:
+		socketFn = tcpSocket
 	}

-	if err := setUnixSocketMode(network, addr); err != nil {
-		listener.Close()
+	socket, err := socketFn()
+	if err != nil {
 		return nil, err
 	}

-	return &serverConfig{
-		addr:         addr,
-		certProvider: certProvider,
-		listener:     listener,
-		server:       newHTTPServer(r, protocols),
-		tlsConfig:    tlsConfig,
-	}, nil
+	addr := socket.addr
+	listener := socket.listener
+	server := newHTTPServer(r, protocols)
+
+	return &serverConfig{addr, certProvider, listener, server, tlsConfig}, nil
 }

 func initServerProtocols() (*http.Protocols, *tls.Config, *tlsCertProvider, error) {
@@ -227,33 +228,6 @@ func newHTTPServer(r *gin.Engine, protocols *http.Protocols) *http.Server {
 	}
 }

-func listenerNetworkAndAddr() (string, string) {
-	if common.EnvConfig.UnixSocket == "" {
-		return "tcp", net.JoinHostPort(common.EnvConfig.Host, common.EnvConfig.Port)
-	}
-
-	addr := common.EnvConfig.UnixSocket
-	os.Remove(addr) // remove dangling the socket file to avoid file-exist error
-	return "unix", addr
-}
-
-func setUnixSocketMode(network, addr string) error {
-	if network != "unix" || common.EnvConfig.UnixSocketMode == "" {
-		return nil
-	}
-
-	mode, err := strconv.ParseUint(common.EnvConfig.UnixSocketMode, 8, 32)
-	if err != nil {
-		return fmt.Errorf("failed to parse UNIX socket mode '%s': %w", common.EnvConfig.UnixSocketMode, err)
-	}
-
-	if err := os.Chmod(addr, os.FileMode(mode)); err != nil {
-		return fmt.Errorf("failed to set UNIX socket mode '%s': %w", common.EnvConfig.UnixSocketMode, err)
-	}
-
-	return nil
-}
-
 func runServer(ctx context.Context, config *serverConfig) error {
 	slog.Info("Server listening", slog.String("addr", config.addr), slog.Bool("tls", config.tlsConfig != nil))

--- a/backend/internal/bootstrap/socket.go
+++ b/backend/internal/bootstrap/socket.go
@@ -0,0 +1,51 @@
+package bootstrap
+
+import (
+	"fmt"
+	"net"
+	"os"
+	"strconv"
+
+	"github.com/pocket-id/pocket-id/backend/internal/common"
+)
+
+type socket struct {
+	addr     string
+	listener net.Listener
+}
+
+func unixSocket() (*socket, error) {
+	addr := common.EnvConfig.UnixSocket
+	os.Remove(addr) // remove dangling the socket file to avoid file-exist error
+
+	listener, err := net.Listen("unix", addr) //nolint:noctx
+	if err != nil {
+		return nil, fmt.Errorf("failed to create UNIX socket: %w", err)
+	}
+
+	if common.EnvConfig.UnixSocketMode != "" {
+		mode, err := strconv.ParseUint(common.EnvConfig.UnixSocketMode, 8, 32)
+		if err != nil {
+			listener.Close()
+			return nil, fmt.Errorf("failed to parse UNIX socket mode '%s': %w", common.EnvConfig.UnixSocketMode, err)
+		}
+
+		if err := os.Chmod(addr, os.FileMode(mode)); err != nil {
+			listener.Close()
+			return nil, fmt.Errorf("failed to set UNIX socket mode '%s': %w", common.EnvConfig.UnixSocketMode, err)
+		}
+	}
+
+	return &socket{addr, listener}, nil
+}
+
+func tcpSocket() (*socket, error) {
+	addr := net.JoinHostPort(common.EnvConfig.Host, common.EnvConfig.Port)
+
+	listener, err := net.Listen("tcp", addr) //nolint:noctx
+	if err != nil {
+		return nil, fmt.Errorf("failed to create TCP socket: %w", err)
+	}
+
+	return &socket{addr, listener}, nil
+}
--- a/backend/internal/bootstrap/systemd_socket_linux.go
+++ b/backend/internal/bootstrap/systemd_socket_linux.go
@@ -0,0 +1,27 @@
+//go:build linux
+
+package bootstrap
+
+import (
+	"errors"
+	"fmt"
+
+	"github.com/coreos/go-systemd/activation"
+)
+
+func systemdSocket() (*socket, error) {
+	listeners, err := activation.Listeners()
+	if err != nil {
+		return nil, fmt.Errorf("failed to receive socket from systemd: %w", err)
+	}
+
+	if len(listeners) == 0 {
+		return nil, errors.New("did not receive any sockets from systemd")
+	}
+
+	if len(listeners) > 1 {
+		return nil, errors.New("received too many sockets from systemd")
+	}
+
+	return &socket{"(systemd)", listeners[0]}, nil
+}
--- a/backend/internal/bootstrap/systemd_socket_nonlinux.go
+++ b/backend/internal/bootstrap/systemd_socket_nonlinux.go
@@ -0,0 +1,9 @@
+//go:build !linux
+
+package bootstrap
+
+import "errors"
+
+func systemdSocket() (*socket, error) {
+	return nil, errors.New("systemd socket activation is only supported on Linux")
+}
--- a/backend/internal/cmds/healthcheck.go
+++ b/backend/internal/cmds/healthcheck.go
@@ -2,9 +2,12 @@ package cmds

 import (
 	"context"
+	"fmt"
 	"log/slog"
+	"net"
 	"net/http"
 	"os"
+	"strings"
 	"time"

 	"github.com/spf13/cobra"
@@ -13,8 +16,14 @@ import (
 )

 type healthcheckFlags struct {
-	Endpoint string
-	Verbose  bool
+	Endpoint   string
+	UnixSocket string
+	Verbose    bool
+}
+
+type healthcheckResult struct {
+	StatusCode int
+	URL        string
 }

 func init() {
@@ -29,47 +38,26 @@ func init() {
 			ctx, cancel := context.WithTimeout(cmd.Context(), 5*time.Second)
 			defer cancel()

-			url := flags.Endpoint + "/healthz"
-			req, err := http.NewRequestWithContext(ctx, http.MethodGet, url, nil)
+			if flags.UnixSocket == "" && !cmd.Flags().Changed("endpoint") {
+				flags.UnixSocket = common.EnvConfig.UnixSocket
+			}
+
+			result, err := healthcheck(ctx, flags)
 			if err != nil {
 				slog.ErrorContext(ctx,
-					"Failed to create request object",
+					"Healthcheck failed",
 					"error", err,
-					"url", url,
 					"ms", time.Since(start).Milliseconds(),
 				)
 				os.Exit(1)
 			}

-			res, err := http.DefaultClient.Do(req)
-			if err != nil {
-				slog.ErrorContext(ctx,
-					"Failed to perform request",
-					"error", err,
-					"url", url,
-					"ms", time.Since(start).Milliseconds(),
-				)
-				os.Exit(1)
-			}
-			defer res.Body.Close()
-
-			if res.StatusCode < 200 || res.StatusCode >= 300 {
-				if err != nil {
-					slog.ErrorContext(ctx,
-						"Healthcheck failed",
-						"status", res.StatusCode,
-						"url", url,
-						"ms", time.Since(start).Milliseconds(),
-					)
-					os.Exit(1)
-				}
-			}
-
 			if flags.Verbose {
 				slog.InfoContext(ctx,
 					"Healthcheck succeeded",
-					"status", res.StatusCode,
-					"url", url,
+					"status", result.StatusCode,
+					"url", result.URL,
+					"unixSocket", flags.UnixSocket,
 					"ms", time.Since(start).Milliseconds(),
 				)
 			}
@@ -77,7 +65,42 @@ func init() {
 	}

 	healthcheckCmd.Flags().StringVarP(&flags.Endpoint, "endpoint", "e", "http://localhost:"+common.EnvConfig.Port, "Endpoint for Pocket ID")
+	healthcheckCmd.Flags().StringVar(&flags.UnixSocket, "unix-socket", "", "UNIX socket path for Pocket ID")
 	healthcheckCmd.Flags().BoolVarP(&flags.Verbose, "verbose", "v", false, "Enable verbose mode")

 	rootCmd.AddCommand(healthcheckCmd)
 }
+
+func healthcheck(ctx context.Context, flags healthcheckFlags) (*healthcheckResult, error) {
+	url := strings.TrimRight(flags.Endpoint, "/") + "/healthz"
+	req, err := http.NewRequestWithContext(ctx, http.MethodGet, url, nil)
+	if err != nil {
+		return nil, fmt.Errorf("failed to create request object for %q: %w", url, err)
+	}
+
+	client := http.DefaultClient
+	if flags.UnixSocket != "" {
+		transport := http.DefaultTransport.(*http.Transport).Clone()
+		transport.Proxy = nil
+		transport.DialContext = func(ctx context.Context, network, addr string) (net.Conn, error) {
+			dialer := net.Dialer{}
+			return dialer.DialContext(ctx, "unix", flags.UnixSocket)
+		}
+		client = &http.Client{Transport: transport}
+	}
+
+	res, err := client.Do(req)
+	if err != nil {
+		return nil, fmt.Errorf("failed to perform request to %q: %w", url, err)
+	}
+	defer res.Body.Close()
+
+	if res.StatusCode < 200 || res.StatusCode >= 300 {
+		return nil, fmt.Errorf("unexpected status %d from %q", res.StatusCode, url)
+	}
+
+	return &healthcheckResult{
+		StatusCode: res.StatusCode,
+		URL:        url,
+	}, nil
+}
--- a/backend/internal/cmds/healthcheck_test.go
+++ b/backend/internal/cmds/healthcheck_test.go
@@ -0,0 +1,79 @@
+package cmds
+
+import (
+	"context"
+	"net"
+	"net/http"
+	"net/http/httptest"
+	"path/filepath"
+	"testing"
+	"time"
+
+	"github.com/stretchr/testify/assert"
+	"github.com/stretchr/testify/require"
+)
+
+func TestHealthcheckTCPSuccess(t *testing.T) {
+	server := httptest.NewServer(http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		assert.Equal(t, "/healthz", r.URL.Path)
+		w.WriteHeader(http.StatusNoContent)
+	}))
+	defer server.Close()
+
+	result, err := healthcheck(t.Context(), healthcheckFlags{
+		Endpoint: server.URL,
+	})
+
+	require.NoError(t, err)
+	require.Equal(t, http.StatusNoContent, result.StatusCode)
+	require.Equal(t, server.URL+"/healthz", result.URL)
+}
+
+func TestHealthcheckFailsOnUnexpectedStatus(t *testing.T) {
+	server := httptest.NewServer(http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		w.WriteHeader(http.StatusInternalServerError)
+	}))
+	defer server.Close()
+
+	_, err := healthcheck(t.Context(), healthcheckFlags{
+		Endpoint: server.URL,
+	})
+
+	require.Error(t, err)
+	require.ErrorContains(t, err, "unexpected status 500")
+}
+
+func TestHealthcheckUnixSocket(t *testing.T) {
+	socketPath := filepath.Join(t.TempDir(), "pocket-id.sock")
+	listener, err := (&net.ListenConfig{}).Listen(t.Context(), "unix", socketPath)
+	require.NoError(t, err)
+
+	server := &http.Server{
+		Handler: http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+			assert.Equal(t, "/healthz", r.URL.Path)
+			w.WriteHeader(http.StatusNoContent)
+		}),
+		ReadHeaderTimeout: time.Second,
+	}
+
+	errCh := make(chan error, 1)
+	go func() {
+		errCh <- server.Serve(listener)
+	}()
+
+	t.Cleanup(func() {
+		ctx, cancel := context.WithTimeout(context.Background(), time.Second)
+		defer cancel()
+		require.NoError(t, server.Shutdown(ctx))
+		require.ErrorIs(t, <-errCh, http.ErrServerClosed)
+	})
+
+	result, err := healthcheck(t.Context(), healthcheckFlags{
+		Endpoint:   "http://localhost:1411",
+		UnixSocket: socketPath,
+	})
+
+	require.NoError(t, err)
+	require.Equal(t, http.StatusNoContent, result.StatusCode)
+	require.Equal(t, "http://localhost:1411/healthz", result.URL)
+}
--- a/backend/internal/common/env_config.go
+++ b/backend/internal/common/env_config.go
@@ -68,6 +68,7 @@ type EnvConfigSchema struct {
 	Host            string `env:"HOST" options:"toLower"`
 	UnixSocket      string `env:"UNIX_SOCKET"`
 	UnixSocketMode  string `env:"UNIX_SOCKET_MODE"`
+	SystemdSocket   bool   `env:"SYSTEMD_SOCKET"`
 	LocalIPv6Ranges string `env:"LOCAL_IPV6_RANGES"`

 	TLSCertFile string `env:"TLS_CERT" options:"file"`
@@ -153,6 +154,9 @@ func ValidateEnvConfig(config *EnvConfigSchema) error {
 	if err := validateFileBackend(config); err != nil {
 		return err
 	}
+	if config.SystemdSocket && config.UnixSocket != "" {
+		return errors.New("SYSTEMD_SOCKET and UNIX_SOCKET are mutually exclusive")
+	}
 	if err := validateLocalIPv6Ranges(config.LocalIPv6Ranges); err != nil {
 		return err
 	}
--- a/backend/internal/common/errors.go
+++ b/backend/internal/common/errors.go
@@ -354,6 +354,29 @@ func (e ImageNotFoundError) Error() string { return "Image not found" }

 func (e ImageNotFoundError) HttpStatusCode() int { return http.StatusNotFound }

+type OidcPARNotSupportedForPublicClientsError struct{}
+
+func (e OidcPARNotSupportedForPublicClientsError) Error() string {
+	return "pushed authorization requests are not supported for public clients"
+}
+func (e OidcPARNotSupportedForPublicClientsError) HttpStatusCode() int {
+	return http.StatusBadRequest
+}
+
+type OidcInvalidRequestURIError struct{}
+
+func (e OidcInvalidRequestURIError) Error() string {
+	return "invalid or expired request_uri"
+}
+func (e OidcInvalidRequestURIError) HttpStatusCode() int { return http.StatusBadRequest }
+
+type OidcPARRequiredError struct{}
+
+func (e OidcPARRequiredError) Error() string {
+	return "this client requires pushed authorization requests"
+}
+func (e OidcPARRequiredError) HttpStatusCode() int { return http.StatusBadRequest }
+
 type InvalidEmailVerificationTokenError struct{}

 func (e InvalidEmailVerificationTokenError) Error() string { return "Invalid email verification token" }
--- a/backend/internal/controller/oidc_controller.go
+++ b/backend/internal/controller/oidc_controller.go
@@ -33,8 +33,10 @@ func NewOidcController(group *gin.RouterGroup, authMiddleware *middleware.AuthMi

 	group.POST("/oidc/authorize", authMiddleware.WithAdminNotRequired().Add(), oc.authorizeHandler)
 	group.POST("/oidc/authorization-required", authMiddleware.WithAdminNotRequired().Add(), oc.authorizationConfirmationRequiredHandler)
+	group.GET("/oidc/par-request-info", authMiddleware.WithAdminNotRequired().Add(), oc.parRequestInfoHandler)

 	group.POST("/oidc/token", oc.createTokensHandler)
+	group.POST("/oidc/par", oc.pushedAuthorizationRequestHandler)
 	group.GET("/oidc/userinfo", oc.userInfoHandler)
 	group.POST("/oidc/userinfo", oc.userInfoHandler)
 	group.POST("/oidc/end-session", authMiddleware.WithAdminNotRequired().WithSuccessOptional().Add(), oc.EndSessionHandler)
@@ -154,13 +156,50 @@ func (oc *OidcController) authorizationConfirmationRequiredHandler(c *gin.Contex
 		return
 	}

-	hasAuthorizedClient, err := oc.oidcService.HasAuthorizedClient(c.Request.Context(), input.ClientID, c.GetString("userID"), input.Scope)
+	authorizationRequired, scope, err := oc.oidcService.AuthorizationRequired(c.Request.Context(), input.ClientID, c.GetString("userID"), input.Scope, input.RequestURI)
 	if err != nil {
 		_ = c.Error(err)
 		return
 	}

-	c.JSON(http.StatusOK, gin.H{"authorizationRequired": !hasAuthorizedClient})
+	c.JSON(http.StatusOK, gin.H{"authorizationRequired": authorizationRequired, "scope": scope})
+}
+
+// parRequestInfoHandler godoc
+// @Summary Resolve stored authorization request parameters
+// @Description Resolve the parameters of a stored request_uri request so the consent page can render the requested scope and build the final redirect. Does not consume the request.
+// @Tags OIDC
+// @Produce json
+// @Param client_id query string true "Client ID"
+// @Param request_uri query string true "Request URI returned from the PAR endpoint"
+// @Success 200 {object} dto.OidcAuthorizeRequestInfoDto "Resolved authorization request parameters"
+// @Router /api/oidc/par-request-info [get]
+func (oc *OidcController) parRequestInfoHandler(c *gin.Context) {
+	clientID := c.Query("client_id")
+	requestURI := c.Query("request_uri")
+	if clientID == "" {
+		_ = c.Error(&common.ValidationError{Message: "client_id is required"})
+		return
+	}
+	if requestURI == "" {
+		_ = c.Error(&common.ValidationError{Message: "request_uri is required"})
+		return
+	}
+
+	info, err := oc.oidcService.GetPushedAuthorizationRequest(c.Request.Context(), clientID, requestURI)
+	if err != nil {
+		_ = c.Error(err)
+		return
+	}
+
+	var infoDto dto.OidcAuthorizeRequestInfoDto
+	err = dto.MapStruct(info.Parameters, &infoDto)
+	if err != nil {
+		_ = c.Error(err)
+		return
+	}
+
+	c.JSON(http.StatusOK, infoDto)
 }

 // createTokensHandler godoc
@@ -232,6 +271,49 @@ func (oc *OidcController) createTokensHandler(c *gin.Context) {
 	})
 }

+// pushedAuthorizationRequestHandler godoc
+// @Summary Pushed Authorization Request (PAR)
+// @Description RFC 9126: Push authorization request parameters and receive a request_uri. Only confidential clients may use this endpoint.
+// @Tags OIDC
+// @Accept application/x-www-form-urlencoded
+// @Produce json
+// @Success 201 {object} dto.OidcPARResponseDto
+// @Router /api/oidc/par [post]
+func (oc *OidcController) pushedAuthorizationRequestHandler(c *gin.Context) {
+	// Per RFC 9126, parameters MUST be passed in the request body
+	c.Request.URL.RawQuery = ""
+
+	var input dto.OidcPARRequestDto
+	if err := c.ShouldBind(&input); err != nil {
+		_ = c.Error(err)
+		return
+	}
+
+	// Client id and secret can also be passed over the Authorization header
+	if input.ClientID == "" && input.ClientSecret == "" {
+		input.ClientID, input.ClientSecret, _ = utils.OAuthClientBasicAuth(c.Request)
+	}
+
+	creds := service.ClientAuthCredentials{
+		ClientID:            input.ClientID,
+		ClientSecret:        input.ClientSecret,
+		ClientAssertion:     input.ClientAssertion,
+		ClientAssertionType: input.ClientAssertionType,
+	}
+
+	requestURI, expiresIn, err := oc.oidcService.CreatePushedAuthorizationRequest(c.Request.Context(), creds, input)
+	if err != nil {
+		_ = c.Error(err)
+		return
+	}
+
+	// RFC 9126 §2.2 requires HTTP 201 Created for successful PAR responses
+	c.JSON(http.StatusCreated, dto.OidcPARResponseDto{
+		RequestURI: requestURI,
+		ExpiresIn:  expiresIn,
+	})
+}
+
 // userInfoHandler godoc
 // @Summary Get user information
 // @Description Get user information based on the access token
--- a/backend/internal/controller/well_known_controller.go
+++ b/backend/internal/controller/well_known_controller.go
@@ -92,7 +92,9 @@ func (wkc *WellKnownController) computeOIDCConfiguration() ([]byte, error) {
 		"authorization_response_iss_parameter_supported": true,
 		"code_challenge_methods_supported":               []string{"plain", "S256"},
 		"prompt_values_supported":                        []string{"none", "login", "consent", "select_account"},
-		"token_endpoint_auth_methods_supported":          []string{"client_secret_basic", "client_secret_post", "none"},
+		"token_endpoint_auth_methods_supported":          []string{"client_secret_basic", "client_secret_post", "private_key_jwt", "none"},
+		"pushed_authorization_request_endpoint":          internalAppUrl + "/api/oidc/par",
+		"require_pushed_authorization_requests":          false,
 	}
 	return json.Marshal(config)
 }
--- a/backend/internal/dto/oidc_dto.go
+++ b/backend/internal/dto/oidc_dto.go
@@ -13,12 +13,13 @@ type OidcClientMetaDataDto struct {

 type OidcClientDto struct {
 	OidcClientMetaDataDto
-	CallbackURLs       []string                 `json:"callbackURLs"`
-	LogoutCallbackURLs []string                 `json:"logoutCallbackURLs"`
-	IsPublic           bool                     `json:"isPublic"`
-	PkceEnabled        bool                     `json:"pkceEnabled"`
-	Credentials        OidcClientCredentialsDto `json:"credentials"`
-	IsGroupRestricted  bool                     `json:"isGroupRestricted"`
+	CallbackURLs                        []string                 `json:"callbackURLs"`
+	LogoutCallbackURLs                  []string                 `json:"logoutCallbackURLs"`
+	IsPublic                            bool                     `json:"isPublic"`
+	PkceEnabled                         bool                     `json:"pkceEnabled"`
+	RequiresPushedAuthorizationRequests bool                     `json:"requiresPushedAuthorizationRequests"`
+	Credentials                         OidcClientCredentialsDto `json:"credentials"`
+	IsGroupRestricted                   bool                     `json:"isGroupRestricted"`
 }

 type OidcClientWithAllowedUserGroupsDto struct {
@@ -32,19 +33,20 @@ type OidcClientWithAllowedGroupsCountDto struct {
 }

 type OidcClientUpdateDto struct {
-	Name                     string                   `json:"name" binding:"required,max=50" unorm:"nfc"`
-	CallbackURLs             []string                 `json:"callbackURLs" binding:"omitempty,dive,callback_url_pattern"`
-	LogoutCallbackURLs       []string                 `json:"logoutCallbackURLs" binding:"omitempty,dive,callback_url_pattern"`
-	IsPublic                 bool                     `json:"isPublic"`
-	PkceEnabled              bool                     `json:"pkceEnabled"`
-	RequiresReauthentication bool                     `json:"requiresReauthentication"`
-	Credentials              OidcClientCredentialsDto `json:"credentials"`
-	LaunchURL                *string                  `json:"launchURL" binding:"omitempty,url"`
-	HasLogo                  bool                     `json:"hasLogo"`
-	HasDarkLogo              bool                     `json:"hasDarkLogo"`
-	LogoURL                  *string                  `json:"logoUrl"`
-	DarkLogoURL              *string                  `json:"darkLogoUrl"`
-	IsGroupRestricted        bool                     `json:"isGroupRestricted"`
+	Name                                string                   `json:"name" binding:"required,max=50" unorm:"nfc"`
+	CallbackURLs                        []string                 `json:"callbackURLs" binding:"omitempty,dive,callback_url_pattern"`
+	LogoutCallbackURLs                  []string                 `json:"logoutCallbackURLs" binding:"omitempty,dive,callback_url_pattern"`
+	IsPublic                            bool                     `json:"isPublic"`
+	PkceEnabled                         bool                     `json:"pkceEnabled"`
+	RequiresReauthentication            bool                     `json:"requiresReauthentication"`
+	RequiresPushedAuthorizationRequests bool                     `json:"requiresPushedAuthorizationRequests"`
+	Credentials                         OidcClientCredentialsDto `json:"credentials"`
+	LaunchURL                           *string                  `json:"launchURL" binding:"omitempty,url"`
+	HasLogo                             bool                     `json:"hasLogo"`
+	HasDarkLogo                         bool                     `json:"hasDarkLogo"`
+	LogoURL                             *string                  `json:"logoUrl"`
+	DarkLogoURL                         *string                  `json:"darkLogoUrl"`
+	IsGroupRestricted                   bool                     `json:"isGroupRestricted"`
 }

 type OidcClientCreateDto struct {
@@ -65,14 +67,36 @@ type OidcClientFederatedIdentityDto struct {

 type AuthorizeOidcClientRequestDto struct {
 	ClientID              string `json:"clientID" binding:"required"`
-	Scope                 string `json:"scope" binding:"required"`
-	CallbackURL           string `json:"callbackURL" binding:"omitempty,callback_url"`
+	Scope                 string `json:"scope" binding:"required_without=RequestURI"`
+	CallbackURL           string `json:"callbackURL"`
 	Nonce                 string `json:"nonce"`
 	CodeChallenge         string `json:"codeChallenge"`
 	CodeChallengeMethod   string `json:"codeChallengeMethod"`
 	ReauthenticationToken string `json:"reauthenticationToken"`
 	Prompt                string `json:"prompt"`
 	ResponseMode          string `json:"responseMode" binding:"omitempty,response_mode"`
+	RequestURI            string `json:"requestURI"`
+}
+
+type OidcPARRequestDto struct {
+	ClientID            string `form:"client_id"`
+	ClientSecret        string `form:"client_secret"`
+	ClientAssertion     string `form:"client_assertion"`
+	ClientAssertionType string `form:"client_assertion_type"`
+	ResponseType        string `form:"response_type" binding:"required"`
+	Scope               string `form:"scope" binding:"required"`
+	RedirectURI         string `form:"redirect_uri"`
+	State               string `form:"state"`
+	Nonce               string `form:"nonce"`
+	CodeChallenge       string `form:"code_challenge"`
+	CodeChallengeMethod string `form:"code_challenge_method"`
+	Prompt              string `form:"prompt"`
+	ResponseMode        string `form:"response_mode" binding:"omitempty,response_mode"`
+}
+
+type OidcPARResponseDto struct {
+	RequestURI string `json:"request_uri"`
+	ExpiresIn  int    `json:"expires_in"`
 }

 type AuthorizeOidcClientResponseDto struct {
@@ -82,8 +106,18 @@ type AuthorizeOidcClientResponseDto struct {
 }

 type AuthorizationRequiredDto struct {
-	ClientID string `json:"clientID" binding:"required"`
-	Scope    string `json:"scope" binding:"required"`
+	ClientID   string `json:"clientID" binding:"required"`
+	Scope      string `json:"scope"`
+	RequestURI string `json:"requestURI"`
+}
+
+type OidcAuthorizeRequestInfoDto struct {
+	Scope        string `json:"scope"`
+	RedirectURI  string `json:"redirectURI"`
+	State        string `json:"state,omitempty"`
+	Nonce        string `json:"nonce,omitempty"`
+	ResponseMode string `json:"responseMode,omitempty"`
+	Prompt       string `json:"prompt,omitempty"`
 }

 type OidcCreateTokensDto struct {
--- a/backend/internal/dto/validations.go
+++ b/backend/internal/dto/validations.go
@@ -92,11 +92,11 @@ func ValidateCallbackURLPattern(raw string) bool {
 }

 // ValidateResponseMode validates response_mode parameter
-// If responseMode is present, it must be "form_post" or "query"
+// If responseMode is present, it must be "form_post", "query", or "fragment"
 // Empty responseMode is allowed (field not provided, use default)
 func ValidateResponseMode(responseMode string) bool {
 	switch responseMode {
-	case "form_post", "query":
+	case "form_post", "query", "fragment":
 		return true
 	case "":
 		return true
--- a/backend/internal/dto/validations_test.go
+++ b/backend/internal/dto/validations_test.go
@@ -66,8 +66,9 @@ func TestValidateResponseMode(t *testing.T) {
 	}{
 		{"valid form_post", "form_post", true},
 		{"valid query", "query", true},
+		{"valid fragment", "fragment", true},
 		{"valid empty", "", true},
-		{"invalid fragment", "fragment", false},
+		{"invalid unknown", "unknown", false},
 	}

 	for _, tt := range tests {
--- a/backend/internal/job/db_cleanup_job.go
+++ b/backend/internal/job/db_cleanup_job.go
@@ -38,6 +38,7 @@ func (s *Scheduler) RegisterDbCleanupJobs(ctx context.Context, db *gorm.DB) erro
 		s.RegisterJob(ctx, "ClearOidcRefreshTokens", jobDefWithJitter(24*time.Hour), jobs.clearOidcRefreshTokens, service.RegisterJobOpts{RunImmediately: true, BackOff: newBackOff()}),
 		s.RegisterJob(ctx, "ClearReauthenticationTokens", jobDefWithJitter(24*time.Hour), jobs.clearReauthenticationTokens, service.RegisterJobOpts{RunImmediately: true, BackOff: newBackOff()}),
 		s.RegisterJob(ctx, "ClearAuditLogs", jobDefWithJitter(24*time.Hour), jobs.clearAuditLogs, service.RegisterJobOpts{RunImmediately: true, BackOff: newBackOff()}),
+		s.RegisterJob(ctx, "ClearOidcPushedAuthorizationRequests", jobDefWithJitter(24*time.Hour), jobs.clearOidcPushedAuthorizationRequests, service.RegisterJobOpts{RunImmediately: true, BackOff: newBackOff()}),
 	)
 }

@@ -146,6 +147,20 @@ func (j *DbCleanupJobs) clearAuditLogs(ctx context.Context) error {
 	return nil
 }

+// clearOidcPushedAuthorizationRequests deletes PAR records that have expired without being consumed
+func (j *DbCleanupJobs) clearOidcPushedAuthorizationRequests(ctx context.Context) error {
+	st := j.db.
+		WithContext(ctx).
+		Delete(&model.OidcPushedAuthorizationRequest{}, "expires_at < ?", datatype.DateTime(time.Now()))
+	if st.Error != nil {
+		return fmt.Errorf("failed to clean expired pushed authorization requests: %w", st.Error)
+	}
+
+	slog.InfoContext(ctx, "Cleaned expired pushed authorization requests", slog.Int64("count", st.RowsAffected))
+
+	return nil
+}
+
 // ClearEmailVerificationTokens deletes email verification tokens that have expired
 func (j *DbCleanupJobs) clearEmailVerificationTokens(ctx context.Context) error {
 	st := j.db.
--- a/backend/internal/model/oidc.go
+++ b/backend/internal/model/oidc.go
@@ -48,18 +48,19 @@ type OidcAuthorizationCode struct {
 type OidcClient struct {
 	Base

-	Name                     string `sortable:"true"`
-	Secret                   string
-	CallbackURLs             UrlList
-	LogoutCallbackURLs       UrlList
-	ImageType                *string
-	DarkImageType            *string
-	IsPublic                 bool
-	PkceEnabled              bool `sortable:"true" filterable:"true"`
-	RequiresReauthentication bool `sortable:"true" filterable:"true"`
-	Credentials              OidcClientCredentials
-	LaunchURL                *string
-	IsGroupRestricted        bool `sortable:"true" filterable:"true"`
+	Name                                string `sortable:"true"`
+	Secret                              string
+	CallbackURLs                        UrlList
+	LogoutCallbackURLs                  UrlList
+	ImageType                           *string
+	DarkImageType                       *string
+	IsPublic                            bool
+	PkceEnabled                         bool `sortable:"true" filterable:"true"`
+	RequiresReauthentication            bool `sortable:"true" filterable:"true"`
+	RequiresPushedAuthorizationRequests bool `sortable:"true" filterable:"true"`
+	Credentials                         OidcClientCredentials
+	LaunchURL                           *string
+	IsGroupRestricted                   bool `sortable:"true" filterable:"true"`

 	AllowedUserGroups         []UserGroup `gorm:"many2many:oidc_clients_allowed_user_groups;"`
 	CreatedByID               *string
@@ -157,3 +158,32 @@ type OidcDeviceCode struct {
 	ClientID string
 	Client   OidcClient
 }
+
+type OidcPushedAuthorizationRequest struct {
+	Base
+
+	RequestURI string
+	ClientID   string
+	Parameters OidcAuthorizationRequestParameters
+	ExpiresAt  datatype.DateTime
+}
+
+type OidcAuthorizationRequestParameters struct { //nolint:recvcheck
+	Scope               string `json:"scope,omitempty"`
+	RedirectURI         string `json:"redirect_uri,omitempty"`
+	State               string `json:"state,omitempty"`
+	Nonce               string `json:"nonce,omitempty"`
+	CodeChallenge       string `json:"code_challenge,omitempty"`
+	CodeChallengeMethod string `json:"code_challenge_method,omitempty"`
+	ResponseType        string `json:"response_type,omitempty"`
+	Prompt              string `json:"prompt,omitempty"`
+	ResponseMode        string `json:"response_mode,omitempty"`
+}
+
+func (p *OidcAuthorizationRequestParameters) Scan(value any) error {
+	return utils.UnmarshalJSONFromDatabase(p, value)
+}
+
+func (p OidcAuthorizationRequestParameters) Value() (driver.Value, error) {
+	return json.Marshal(p)
+}
--- a/backend/internal/service/e2etest_service.go
+++ b/backend/internal/service/e2etest_service.go
@@ -236,6 +236,15 @@ func (s *TestService) SeedDatabase(baseURL string) error {
 					userGroups[1],
 				},
 			},
+			{
+				Base: model.Base{
+					ID: "a1b2c3d4-e5f6-7890-abcd-ef0000000001",
+				},
+				Name:         "PAR Test Client",
+				Secret:       "$2a$10$9dypwot8nGuCjT6wQWWpJOckZfRprhe2EkwpKizxS/fpVHrOLEJHC", // w2mUeZISmEvIDMEDvpY0PnxQIpj1m3zY
+				CallbackURLs: model.UrlList{"http://par-client/auth/callback"},
+				CreatedByID:  new(users[0].ID),
+			},
 		}
 		for _, client := range oidcClients {
 			if err := tx.Create(&client).Error; err != nil {
@@ -310,6 +319,12 @@ func (s *TestService) SeedDatabase(baseURL string) error {
 				ClientID:   oidcClients[3].ID,
 				LastUsedAt: datatype.DateTime(time.Date(2025, 8, 12, 12, 0, 0, 0, time.UTC)),
 			},
+			{
+				Scope:      "openid profile email",
+				UserID:     users[0].ID,
+				ClientID:   oidcClients[5].ID,
+				LastUsedAt: datatype.DateTime(time.Date(2024, 1, 1, 0, 0, 0, 0, time.UTC)),
+			},
 		}
 		for _, userAuthorizedClient := range userAuthorizedClients {
 			if err := tx.Create(&userAuthorizedClient).Error; err != nil {
--- a/backend/internal/service/oidc_service.go
+++ b/backend/internal/service/oidc_service.go
@@ -48,6 +48,9 @@ const (
 	AccessTokenDuration  = time.Hour
 	RefreshTokenDuration = 30 * 24 * time.Hour // 30 days
 	DeviceCodeDuration   = 15 * time.Minute
+	PARDuration          = 90 * time.Second
+
+	parRequestURIPrefix = "urn:ietf:params:oauth:request_uri:"
 )

 type OidcService struct {
@@ -138,6 +141,18 @@ func (s *OidcService) Authorize(ctx context.Context, input dto.AuthorizeOidcClie
 		return "", "", err
 	}

+	// If the client requires PAR, a request_uri must be provided
+	if client.RequiresPushedAuthorizationRequests && input.RequestURI == "" {
+		return "", "", &common.OidcPARRequiredError{}
+	}
+
+	// If a request_uri is provided, consume the stored PAR and overwrite input fields
+	if input.RequestURI != "" {
+		if err := s.applyPushedAuthorizationRequest(ctx, tx, &input); err != nil {
+			return "", "", err
+		}
+	}
+
 	// If the client is not public, the code challenge must be provided
 	if client.IsPublic && input.CodeChallenge == "" {
 		return "", "", &common.OidcMissingCodeChallengeError{}
@@ -241,11 +256,48 @@ func (s *OidcService) Authorize(ctx context.Context, input dto.AuthorizeOidcClie
 	return code, callbackURL, nil
 }

+// applyPushedAuthorizationRequest consumes the stored PAR for the given request_uri
+// and overwrites the corresponding fields on input.
+func (s *OidcService) applyPushedAuthorizationRequest(ctx context.Context, tx *gorm.DB, input *dto.AuthorizeOidcClientRequestDto) error {
+	parMeta, err := s.getAndConsumePushedAuthorizationRequest(ctx, tx, input.ClientID, input.RequestURI)
+	if err != nil {
+		return err
+	}
+	par := parMeta.Parameters
+
+	input.Scope = par.Scope
+	input.CallbackURL = par.RedirectURI
+	input.Nonce = par.Nonce
+	input.Prompt = par.Prompt
+	input.CodeChallenge = par.CodeChallenge
+	input.CodeChallengeMethod = par.CodeChallengeMethod
+
+	return nil
+}
+
 // HasAuthorizedClient checks if the user has already authorized the client with the given scope
 func (s *OidcService) HasAuthorizedClient(ctx context.Context, clientID, userID, scope string) (bool, error) {
 	return s.hasAuthorizedClientInternal(ctx, clientID, userID, scope, s.db)
 }

+// AuthorizationRequired reports whether the user must confirm authorization for the client.
+func (s *OidcService) AuthorizationRequired(ctx context.Context, clientID, userID, scope, requestURI string) (required bool, resolvedScope string, err error) {
+	if requestURI != "" {
+		par, err := s.getPushedAuthorizationRequestInternal(ctx, s.db, clientID, requestURI)
+		if err != nil {
+			return false, "", err
+		}
+		scope = par.Parameters.Scope
+	}
+
+	hasAuthorized, err := s.hasAuthorizedClientInternal(ctx, clientID, userID, scope, s.db)
+	if err != nil {
+		return false, "", err
+	}
+
+	return !hasAuthorized, scope, nil
+}
+
 func (s *OidcService) hasAuthorizedClientInternal(ctx context.Context, clientID, userID, scope string, tx *gorm.DB) (bool, error) {
 	var userAuthorizedOidcClient model.UserAuthorizedOidcClient
 	err := tx.
@@ -925,6 +977,8 @@ func updateOIDCClientModelFromDto(client *model.OidcClient, input *dto.OidcClien
 	// PKCE is required for public clients
 	client.PkceEnabled = input.IsPublic || input.PkceEnabled
 	client.RequiresReauthentication = input.RequiresReauthentication
+	// PAR is not available for public clients, so ignore the flag if the client is public
+	client.RequiresPushedAuthorizationRequests = !input.IsPublic && input.RequiresPushedAuthorizationRequests
 	client.LaunchURL = input.LaunchURL
 	client.IsGroupRestricted = input.IsGroupRestricted

@@ -1318,6 +1372,116 @@ func codeChallengeMethodIsSha256(codeChallengeMethod string) (bool, error) {
 	}
 }

+// CreatePushedAuthorizationRequest validates and stores authorization parameters for PAR (RFC 9126).
+// Only confidential clients (non-public) may use this endpoint.
+func (s *OidcService) CreatePushedAuthorizationRequest(ctx context.Context, creds ClientAuthCredentials, input dto.OidcPARRequestDto) (requestURI string, expiresIn int, err error) {
+	// Public clients are not allowed, but we allow them in this step for better error messages
+	client, err := s.verifyClientCredentialsInternal(ctx, s.db, creds, true)
+	if err != nil {
+		return "", 0, err
+	}
+
+	// Reject public clients here
+	if client.IsPublic {
+		return "", 0, &common.OidcPARNotSupportedForPublicClientsError{}
+	}
+
+	if input.ResponseType != "code" {
+		return "", 0, common.NewOidcInvalidRequestError("unsupported response_type: only 'code' is supported")
+	}
+
+	// Validate redirect_uri at push time (BCP requirement)
+	if _, err = s.getCallbackURL(client, input.RedirectURI, s.db, ctx); err != nil {
+		return "", 0, err
+	}
+
+	randomSuffix, err := utils.GenerateRandomAlphanumericString(32)
+	if err != nil {
+		return "", 0, fmt.Errorf("failed to generate request URI: %w", err)
+	}
+	requestURI = parRequestURIPrefix + randomSuffix
+
+	par := model.OidcPushedAuthorizationRequest{
+		RequestURI: requestURI,
+		ClientID:   client.ID,
+		ExpiresAt:  datatype.DateTime(time.Now().Add(PARDuration)),
+		Parameters: model.OidcAuthorizationRequestParameters{
+			Scope:               input.Scope,
+			RedirectURI:         input.RedirectURI,
+			State:               input.State,
+			Nonce:               input.Nonce,
+			CodeChallenge:       input.CodeChallenge,
+			CodeChallengeMethod: input.CodeChallengeMethod,
+			ResponseType:        input.ResponseType,
+			Prompt:              input.Prompt,
+			ResponseMode:        input.ResponseMode,
+		},
+	}
+
+	if err = s.db.WithContext(ctx).Create(&par).Error; err != nil {
+		return "", 0, fmt.Errorf("failed to store pushed authorization request: %w", err)
+	}
+
+	return requestURI, int(PARDuration.Seconds()), nil
+}
+
+// GetPushedAuthorizationRequest retrieves a PAR record without consuming it.
+func (s *OidcService) GetPushedAuthorizationRequest(ctx context.Context, clientID, requestURI string) (model.OidcPushedAuthorizationRequest, error) {
+	return s.getPushedAuthorizationRequestInternal(ctx, s.db, clientID, requestURI)
+}
+
+// getPushedAuthorizationRequestInternal retrieves a PAR record without consuming it.
+func (s *OidcService) getPushedAuthorizationRequestInternal(ctx context.Context, tx *gorm.DB, clientID, requestURI string) (model.OidcPushedAuthorizationRequest, error) {
+	var par model.OidcPushedAuthorizationRequest
+	err := tx.
+		WithContext(ctx).
+		Where(
+			"request_uri = ? AND client_id = ? AND expires_at > ?",
+			requestURI,
+			clientID,
+			datatype.DateTime(time.Now()),
+		).
+		First(&par).
+		Error
+	if err != nil {
+		if errors.Is(err, gorm.ErrRecordNotFound) {
+			return par, &common.OidcInvalidRequestURIError{}
+		}
+		return par, err
+	}
+
+	return par, nil
+}
+
+// getAndConsumePushedAuthorizationRequest atomically retrieves and deletes a PAR record.
+// Returns OidcInvalidRequestURIError if the record is not found, expired, or belongs to a different client.
+func (s *OidcService) getAndConsumePushedAuthorizationRequest(ctx context.Context, tx *gorm.DB, clientID, requestURI string) (model.OidcPushedAuthorizationRequest, error) {
+	var par model.OidcPushedAuthorizationRequest
+	err := tx.
+		WithContext(ctx).
+		Clauses(clause.Returning{}).
+		Where(
+			"request_uri = ? AND client_id = ? AND expires_at > ?",
+			requestURI,
+			clientID,
+			datatype.DateTime(time.Now()),
+		).
+		Delete(&par).
+		Error
+	if err != nil {
+		if errors.Is(err, gorm.ErrRecordNotFound) {
+			return par, &common.OidcInvalidRequestURIError{}
+		}
+		return par, err
+	}
+	// After DELETE … RETURNING, check if a row was actually deleted
+	if par.ID == "" {
+		return par, &common.OidcInvalidRequestURIError{}
+	}
+
+	return par, nil
+}
+
 func validateCodeVerifier(codeVerifier, codeChallenge string, codeChallengeMethodSha256 bool) bool {
 	if codeVerifier == "" || codeChallenge == "" {
 		return false
--- a/backend/internal/utils/image/metadata.go
+++ b/backend/internal/utils/image/metadata.go
@@ -96,7 +96,7 @@ func stripWEBPMetadata(data []byte) []byte {

 	// WEBP image can max be 4GB in size
 	riffSize := out.Len() - 8
-	if riffSize < 0 || riffSize > int(maxRIFFSize) {
+	if riffSize < 0 || uint64(riffSize) > uint64(maxRIFFSize) {
 		return data
 	}

--- a/backend/internal/utils/image/profile_picture.go
+++ b/backend/internal/utils/image/profile_picture.go
@@ -54,7 +54,7 @@ func CreateDefaultProfilePicture(initials string) (*bytes.Buffer, error) {
 	img := imaging.New(profilePictureSize, profilePictureSize, color.RGBA{R: 255, G: 255, B: 255, A: 255})

 	// Load the font
-	fontBytes, err := resources.FS.ReadFile("fonts/PlayfairDisplay-Bold.ttf")
+	fontBytes, err := resources.FS.ReadFile("fonts/Gloock.ttf")
 	if err != nil {
 		return nil, fmt.Errorf("failed to read font file: %w", err)
 	}
@@ -84,7 +84,7 @@ func CreateDefaultProfilePicture(initials string) (*bytes.Buffer, error) {

 	// Center the initials
 	x := (profilePictureSize - font.MeasureString(face, initials).Ceil()) / 2
-	y := (profilePictureSize-face.Metrics().Height.Ceil())/2 + face.Metrics().Ascent.Ceil() - 10
+	y := (profilePictureSize-face.Metrics().Height.Ceil())/2 + face.Metrics().Ascent.Ceil()
 	drawer.Dot = fixed.P(x, y)

 	// Draw the initials
--- a/backend/resources/aaguids.json
+++ b/backend/resources/aaguids.json
--- a/backend/resources/fonts/Gloock.ttf
+++ b/backend/resources/fonts/Gloock.ttf
--- a/backend/resources/fonts/PlayfairDisplay-Bold.ttf
+++ b/backend/resources/fonts/PlayfairDisplay-Bold.ttf
--- a/backend/resources/migrations/postgres/20260601154900_par.down.sql
+++ b/backend/resources/migrations/postgres/20260601154900_par.down.sql
@@ -0,0 +1,3 @@
+DROP TABLE IF EXISTS oidc_pushed_authorization_requests;
+
+ALTER TABLE oidc_clients DROP COLUMN requires_pushed_authorization_requests;
--- a/backend/resources/migrations/postgres/20260601154900_par.up.sql
+++ b/backend/resources/migrations/postgres/20260601154900_par.up.sql
@@ -0,0 +1,12 @@
+CREATE TABLE oidc_pushed_authorization_requests (
+    id UUID NOT NULL PRIMARY KEY,
+    created_at TIMESTAMPTZ NOT NULL,
+    request_uri TEXT NOT NULL UNIQUE,
+    client_id TEXT NOT NULL REFERENCES oidc_clients(id) ON DELETE CASCADE,
+    parameters JSONB NOT NULL DEFAULT '{}',
+    expires_at TIMESTAMPTZ NOT NULL
+);
+
+CREATE INDEX idx_oidc_par_expires_at ON oidc_pushed_authorization_requests (expires_at);
+
+ALTER TABLE oidc_clients ADD COLUMN requires_pushed_authorization_requests BOOLEAN NOT NULL DEFAULT FALSE;
--- a/backend/resources/migrations/sqlite/20260601154900_par.down.sql
+++ b/backend/resources/migrations/sqlite/20260601154900_par.down.sql
@@ -0,0 +1,3 @@
+DROP TABLE IF EXISTS oidc_pushed_authorization_requests;
+
+ALTER TABLE oidc_clients DROP COLUMN requires_pushed_authorization_requests;
--- a/backend/resources/migrations/sqlite/20260601154900_par.up.sql
+++ b/backend/resources/migrations/sqlite/20260601154900_par.up.sql
@@ -0,0 +1,12 @@
+CREATE TABLE oidc_pushed_authorization_requests (
+    id TEXT NOT NULL PRIMARY KEY,
+    created_at INTEGER NOT NULL,
+    request_uri TEXT NOT NULL UNIQUE,
+    client_id TEXT NOT NULL REFERENCES oidc_clients(id) ON DELETE CASCADE,
+    parameters TEXT NOT NULL DEFAULT '{}',
+    expires_at INTEGER NOT NULL
+);
+
+CREATE INDEX idx_oidc_par_expires_at ON oidc_pushed_authorization_requests (expires_at);
+
+ALTER TABLE oidc_clients ADD COLUMN requires_pushed_authorization_requests BOOLEAN NOT NULL DEFAULT FALSE;
--- a/frontend/messages/en.json
+++ b/frontend/messages/en.json
@@ -288,6 +288,9 @@
 	"public_key_code_exchange_is_a_security_feature_to_prevent_csrf_and_authorization_code_interception_attacks": "Public Key Code Exchange is a security feature to prevent CSRF and authorization code interception attacks.",
 	"requires_reauthentication": "Requires Re-Authentication",
 	"requires_users_to_authenticate_again_on_each_authorization": "Requires users to authenticate again on each authorization, even if already signed in",
+	"par": "PAR",
+	"requires_pushed_authorization_requests": "Requires Pushed Authorization Requests",
+	"requires_pushed_authorization_requests_description": "Requires clients to use the PAR endpoint (/api/oidc/par) to pre-register authorization parameters before initiating the flow. Not available for public clients.",
 	"name_logo": "{name} logo",
 	"change_logo": "Change Logo",
 	"upload_logo": "Upload Logo",
--- a/frontend/messages/fr.json
+++ b/frontend/messages/fr.json
@@ -48,7 +48,7 @@
 	"authenticator_does_not_support_any_of_the_requested_algorithms": "L'authentificateur ne supporte aucun des algorithmes requis",
 	"webauthn_error_invalid_rp_id": "L'ID de la partie de confiance configurée n'est pas valide.",
 	"webauthn_error_invalid_domain": "Le domaine configuré n'est pas valide.",
-	"contact_administrator_to_fix": "Contacte ton administrateur pour régler ce problème.",
+	"contact_administrator_to_fix": "Contactez votre administrateur pour régler ce problème.",
 	"webauthn_operation_not_allowed_or_timed_out": "L'opération n'a pas été autorisée ou a expiré.",
 	"webauthn_not_supported_by_browser": "Les clés d'accès ne sont pas prises en charge par ce navigateur. Essaie une autre méthode de connexion.",
 	"critical_error_occurred_contact_administrator": "Une erreur critique s'est produite. Veuillez contacter votre administrateur.",
@@ -288,6 +288,9 @@
 	"public_key_code_exchange_is_a_security_feature_to_prevent_csrf_and_authorization_code_interception_attacks": "Le Public Key Code Exchange est une fonctionnalité de sécurité conçue pour prévenir les attaques CSRF et d’interception de code d’autorisation.",
 	"requires_reauthentication": "Nécessite une nouvelle authentification",
 	"requires_users_to_authenticate_again_on_each_authorization": "Demande aux utilisateurs de se connecter à nouveau à chaque autorisation, même s'ils sont déjà connectés.",
+	"par": "PAR",
+	"requires_pushed_authorization_requests": "Nécessite Pushed Authorization Requests (PAR)",
+	"requires_pushed_authorization_requests_description": "Les clients doivent utiliser le point de terminaison PAR (/api/oidc/par) pour préenregistrer les paramètres d'autorisation avant de démarrer le flux. Non disponible pour les clients publics.",
 	"name_logo": "Logo {name}",
 	"change_logo": "Changer le logo",
 	"upload_logo": "Télécharger un logo",
--- a/frontend/messages/ja.json
+++ b/frontend/messages/ja.json
@@ -108,14 +108,14 @@
 	"ip_address": "IPアドレス",
 	"device": "デバイス",
 	"client": "クライアント",
-	"actor": "俳優",
+	"actor": "実行者",
 	"unknown": "不明",
 	"account_details_updated_successfully": "アカウントの詳細が正常に更新されました",
 	"profile_picture_updated_successfully": "プロフィール画像が正常に更新されました。反映まで数分かかる場合があります。",
 	"account_settings": "アカウント設定",
 	"passkey_missing": "パスキーが見つかりません",
 	"please_provide_a_passkey_to_prevent_losing_access_to_your_account": "アカウントへのアクセスを失わないように、パスキーを追加してください。",
-	"single_passkey_configured": "Single Passkey Configured",
+	"single_passkey_configured": "シングルパスキーが設定済み",
 	"it_is_recommended_to_add_more_than_one_passkey": "アカウントへのアクセスを失わないように、複数のパスキーを追加することをお勧めします。",
 	"account_details": "アカウントの詳細",
 	"passkeys": "パスキー",
@@ -132,7 +132,7 @@
 	"username_must_start_with": "ユーザー名は英数字で始まる必要があります",
 	"username_must_end_with": "ユーザー名は英数字で終わる必要があります",
 	"sign_in_using_the_following_code_the_code_will_expire_in_minutes": "以下のコードを使用してサインインしてください。コードは15分後に失効します。",
-	"or_visit": "or visit",
+	"or_visit": "または次を訪問",
 	"added_on": "追加日",
 	"rename": "名前を変更",
 	"delete": "削除",
@@ -162,7 +162,7 @@
 	"api_key_revoked_successfully": "API キーが正常に削除されました",
 	"are_you_sure_you_want_to_revoke_the_api_key_apikeyname": "APIキー \"{apiKeyName}\" を本当に削除しますか？このAPI キーを使用しているすべての連携が停止します。",
 	"last_used": "最終使用日",
-	"actions": "Actions",
+	"actions": "操作",
 	"images_updated_successfully": "画像の更新が正常に完了しました。更新には数分かかる場合があります。",
 	"general": "一般",
 	"configure_smtp_to_send_emails": "新しいデバイスや場所からのログインが検出された際にユーザーに警告するメール通知を有効にします。",
@@ -205,15 +205,15 @@
 	"ldap_sync_finished": "LDAP同期が完了しました",
 	"client_configuration": "クライアントの設定",
 	"ldap_url": "LDAP URL",
-	"ldap_bind_dn": "LDAP Bind DN",
-	"ldap_bind_password": "LDAP Bind Password",
-	"ldap_base_dn": "LDAP Base DN",
+	"ldap_bind_dn": "LDAP バインド DN",
+	"ldap_bind_password": "LDAP バインドパスワード",
+	"ldap_base_dn": "LDAP ベース DN",
 	"user_search_filter": "ユーザー検索フィルター",
 	"the_search_filter_to_use_to_search_or_sync_users": "ユーザーの検索、同期に使用する検索フィルター。",
 	"groups_search_filter": "グループ検索フィルター",
 	"the_search_filter_to_use_to_search_or_sync_groups": "グループの検索、同期に使用する検索フィルター。",
 	"attribute_mapping": "属性マッピング",
-	"user_unique_identifier_attribute": "User Unique Identifier Attribute",
+	"user_unique_identifier_attribute": "ユーザー固有識別子属性",
 	"the_value_of_this_attribute_should_never_change": "この属性の値は決して変更されてはなりません。",
 	"username_attribute": "ユーザー名属性",
 	"user_mail_attribute": "ユーザーメール属性",
@@ -245,7 +245,7 @@
 	"admin": "管理者",
 	"user": "ユーザー",
 	"local": "ローカル",
-	"toggle_menu": "Toggle menu",
+	"toggle_menu": "メニューの表示/非表示を切り替える",
 	"edit": "編集",
 	"user_groups_updated_successfully": "ユーザーグループが正常に更新されました",
 	"user_updated_successfully": "ユーザーは正常に更新されました",
@@ -261,7 +261,7 @@
 	"add_group": "グループを追加",
 	"manage_user_groups": "ユーザーグループの管理",
 	"friendly_name": "Friendly Name",
-	"name_that_will_be_displayed_in_the_ui": "Name that will be displayed in the UI",
+	"name_that_will_be_displayed_in_the_ui": "UIに表示される名前",
 	"name_that_will_be_in_the_groups_claim": "Name that will be in the \"groups\" claim",
 	"delete_name": "{name} を削除",
 	"are_you_sure_you_want_to_delete_this_user_group": "このユーザーグループを削除しますか？",
@@ -282,12 +282,12 @@
 	"add": "追加",
 	"callback_urls": "Callback URLs",
 	"logout_callback_urls": "Logout Callback URLs",
-	"public_client": "Public Client",
-	"public_clients_description": "Public clients do not have a client secret. They are designed for mobile, web, and native applications where secrets cannot be securely stored.",
+	"public_client": "パブリッククライアント",
+	"public_clients_description": "パブリッククライアントにはクライアントシークレットがありません。これらは、シークレットを安全に保存できないモバイル、Web、およびネイティブアプリケーション向けに設計されています。",
 	"pkce": "PKCE",
-	"public_key_code_exchange_is_a_security_feature_to_prevent_csrf_and_authorization_code_interception_attacks": "Public Key Code Exchange is a security feature to prevent CSRF and authorization code interception attacks.",
+	"public_key_code_exchange_is_a_security_feature_to_prevent_csrf_and_authorization_code_interception_attacks": "公開鍵コード交換は、CSRFおよび認証コード傍受攻撃を防ぐためのセキュリティ機能です。",
 	"requires_reauthentication": "再認証が必要",
-	"requires_users_to_authenticate_again_on_each_authorization": "Requires users to authenticate again on each authorization, even if already signed in",
+	"requires_users_to_authenticate_again_on_each_authorization": "すでにログイン済みの場合でも、認証のたびにユーザーに再認証を求めます",
 	"name_logo": "{name} ロゴ",
 	"change_logo": "ロゴの変更",
 	"upload_logo": "ロゴをアップロード",
@@ -305,7 +305,7 @@
 	"oidc_client_updated_successfully": "OIDC クライアントが正常に更新されました",
 	"create_new_client_secret": "新しいクライアントシークレットを作成する",
 	"are_you_sure_you_want_to_create_a_new_client_secret": "新しいクライアントシークレットを作成してもよろしいですか？古いシークレットは無効化されます。",
-	"generate": "Generate",
+	"generate": "生成",
 	"new_client_secret_created_successfully": "新しいクライアントシークレットが正常に作成されました",
 	"oidc_client_name": "OIDC クライアント {name}",
 	"client_id": "Client ID",
@@ -331,8 +331,8 @@
 	"profile_picture_has_been_reset": "プロフィール画像がリセットされました。更新には数分かかる場合があります。",
 	"select_the_language_you_want_to_use": "使用する言語を選択してください。一部のテキストは自動翻訳により、不正確な場合がありますのでご注意ください。",
 	"contribute_to_translation": "問題が見つかった場合は、 <link href='https://crowdin.com/project/pocket-id'>Crowdin</link> で翻訳に貢献してください。",
-	"personal": "Personal",
-	"global": "Global",
+	"personal": "個人",
+	"global": "グローバル",
 	"all_users": "すべてのユーザー",
 	"all_events": "すべてのイベント",
 	"all_clients": "すべてのクライアント",
@@ -340,21 +340,21 @@
 	"global_audit_log": "グローバル監査ログ",
 	"see_all_recent_account_activities": "設定された保持期間中の全ユーザーのアカウント活動を閲覧する。",
 	"token_sign_in": "トークンサインイン",
-	"client_authorization": "Client Authorization",
-	"new_client_authorization": "New Client Authorization",
+	"client_authorization": "クライアント認証",
+	"new_client_authorization": "新規クライアント認証",
 	"device_code_authorization": "デバイスコード認証",
 	"new_device_code_authorization": "新規デバイス認証コード",
 	"passkey_added": "パスキー追加",
 	"passkey_removed": "パスキー削除済み",
 	"disable_animations": "アニメーションの無効化",
-	"turn_off_ui_animations": "Turn off animations throughout the UI.",
+	"turn_off_ui_animations": "UI全体のアニメーションを無効にします。",
 	"user_disabled": "アカウントの無効化",
 	"disabled_users_cannot_log_in_or_use_services": "無効化されたユーザーはログインやサービスを利用できません。",
 	"user_disabled_successfully": "ユーザーが正常に無効化されました。",
 	"user_enabled_successfully": "ユーザーが正常に有効化されました。",
-	"status": "Status",
+	"status": "ステータス",
 	"disable_firstname_lastname": "無効化 {firstName} {lastName}",
-	"are_you_sure_you_want_to_disable_this_user": "Are you sure you want to disable this user? They will not be able to log in or access any services.",
+	"are_you_sure_you_want_to_disable_this_user": "このユーザーを無効化してもよろしいですか？無効化すると、そのユーザーはログインやサービスの利用ができなくなります。",
 	"ldap_soft_delete_users": "LDAPから無効なユーザーを保持します。",
 	"ldap_soft_delete_users_description": "有効にすると、LDAPから削除されたユーザーはシステムから削除されるのではなく、無効化されます。",
 	"login_code_email_success": "ログインコードがユーザーに送信されました。",
@@ -367,38 +367,38 @@
 	"authorize_device": "デバイスの認証",
 	"the_device_has_been_authorized": "デバイスは認証されました。",
 	"enter_code_displayed_in_previous_step": "前のステップで表示されたコードを入力してください。",
-	"authorize": "Authorize",
+	"authorize": "承認",
 	"federated_client_credentials": "連携クライアントの資格情報",
 	"federated_client_credentials_description": "フェデレーテッドクライアント認証情報は、長期にわたるシークレットを管理せずにOIDCクライアントを認証することを可能にします。これらは、クライアントアサーション（例：ワークロードIDトークン）のためにサードパーティ機関が発行するJWTトークンを活用します。",
-	"add_federated_client_credential": "Add Federated Client Credential",
-	"add_another_federated_client_credential": "Add another federated client credential",
+	"add_federated_client_credential": "連携クライアントの資格情報を追加",
+	"add_another_federated_client_credential": "他の連携クライアントの資格情報を追加",
 	"oidc_allowed_group_count": "許可されたグループ数",
 	"unrestricted": "制限なし",
 	"show_advanced_options": "詳細設定を表示",
 	"hide_advanced_options": "詳細設定を隠す",
-	"oidc_data_preview": "OIDC Data Preview",
-	"preview_the_oidc_data_that_would_be_sent_for_different_users": "Preview the OIDC data that would be sent for different users",
-	"id_token": "ID Token",
-	"access_token": "Access Token",
-	"userinfo": "Userinfo",
-	"id_token_payload": "ID Token Payload",
-	"access_token_payload": "Access Token Payload",
-	"userinfo_endpoint_response": "Userinfo Endpoint Response",
+	"oidc_data_preview": "OIDC データプレビュー",
+	"preview_the_oidc_data_that_would_be_sent_for_different_users": "異なるユーザーに対して送信されるOIDCデータのプレビュー",
+	"id_token": "IDトークン",
+	"access_token": "アクセストークン",
+	"userinfo": "ユーザー情報",
+	"id_token_payload": "IDトークンのペイロード",
+	"access_token_payload": "アクセストークンのペイロード",
+	"userinfo_endpoint_response": "ユーザー情報エンドポイントのレスポンス",
 	"copy": "コピー",
-	"no_preview_data_available": "No preview data available",
+	"no_preview_data_available": "利用可能なプレビューデータがありません",
 	"copy_all": "すべてコピー",
 	"preview": "プレビュー",
 	"preview_for_user": "{name} のプレビュー",
-	"preview_the_oidc_data_that_would_be_sent_for_this_user": "Preview the OIDC data that would be sent for this user",
+	"preview_the_oidc_data_that_would_be_sent_for_this_user": "このユーザーに対して送信されるOIDCデータのプレビュー",
 	"show": "表示",
-	"select_an_option": "Select an option",
+	"select_an_option": "オプションを選択",
 	"select_user": "ユーザーを選択",
 	"error": "エラー",
 	"select_an_accent_color_to_customize_the_appearance_of_pocket_id": "アクセントカラーを選択して、Pocket IDの外観をカスタマイズしてください。",
 	"accent_color": "アクセントカラー",
 	"custom_accent_color": "カスタムアクセントカラー",
 	"custom_accent_color_description": "有効な CSS カラーフォーマット (例: hex, rgb, hsl) を使用してカスタムカラーを入力します。",
-	"color_value": "Color Value",
+	"color_value": "カラー値",
 	"apply": "適用",
 	"signup_token": "サインアップトークン",
 	"create_a_signup_token_to_allow_new_user_registration": "新規ユーザー登録を許可するためのサインアップトークンを作成する。",
@@ -432,7 +432,7 @@
 	"signup_token_deleted_successfully": "サインアップトークンが正常に削除されました。",
 	"expired": "Expired",
 	"used_up": "Used Up",
-	"active": "Active",
+	"active": "有効",
 	"usage": "Usage",
 	"created": "Created",
 	"token": "トークン",
@@ -452,24 +452,24 @@
 	"launch": "起動",
 	"client_launch_url": "Client Launch URL",
 	"client_launch_url_description": "ユーザーが「マイアプリ」ページからアプリを起動した際に開かれるURL。",
-	"client_name_description": "The name of the client that shows in the Pocket ID UI.",
+	"client_name_description": "Pocket ID UIに表示されるクライアント名。",
 	"revoke_access": "アクセスを取り消す",
 	"revoke_access_description": "<b>{clientName}</b>へのアクセスを取り消します。 <b>{clientName}</b> はあなたのアカウント情報にアクセスできなくなります。",
 	"revoke_access_successful": "{clientName} へのアクセスは正常に取り消されました。",
-	"last_signed_in_ago": "Last signed in {time} ago",
-	"invalid_client_id": "Client ID can only contain letters, numbers, underscores, and hyphens",
-	"custom_client_id_description": "Set a custom client ID if this is required by your application. Otherwise, leave it blank to generate a random one.",
+	"last_signed_in_ago": "最終ログイン {time} 前",
+	"invalid_client_id": "クライアントIDには、英字、数字、アンダースコア、ハイフンのみを含めることができます",
+	"custom_client_id_description": "アプリケーションで必要とされる場合は、カスタムクライアントIDを設定してください。必要ない場合は、空白のままにするとランダムなIDが生成されます。",
 	"generated": "Generated",
-	"administration": "Administration",
-	"group_rdn_attribute_description": "The attribute used in the groups distinguished name (DN).",
-	"display_name_attribute": "Display Name Attribute",
+	"administration": "管理",
+	"group_rdn_attribute_description": "グループの識別名（DN）で使用される属性。",
+	"display_name_attribute": "表示名属性",
 	"display_name": "表示名",
 	"configure_application_images": "アプリケーションの画像を設定",
-	"ui_config_disabled_info_title": "UI Configuration Disabled",
-	"ui_config_disabled_info_description": "The UI configuration is disabled because the application configuration settings are managed through environment variables. Some settings may not be editable.",
+	"ui_config_disabled_info_title": "UI設定が無効になっています",
+	"ui_config_disabled_info_description": "アプリケーションの設定は環境変数を通じて管理されているため、UI設定は無効になっています。一部の設定は編集できない場合があります。",
 	"logo_from_url_description": "画像の直接のURL (svg, png, webp) を貼り付けます。アイコンは <link  href=\"https://selfh.st/icons\">Selfh.st Icons</link> か <link href=\"https://dashboardicons.com\">Dashboard Icons</link> で探せます。",
 	"invalid_url": "無効な URL",
-	"require_user_email": "Require Email Address",
+	"require_user_email": "メールアドレスを必須にする",
 	"require_user_email_description": "ユーザーにメールアドレスの登録を必須とします。無効にした場合、メールアドレスを持たないユーザーはメールアドレスが必要な機能を利用できなくなります。",
 	"view": "表示",
 	"toggle_columns": "列の表示/非表示を切り替える",
--- a/frontend/messages/tr.json
+++ b/frontend/messages/tr.json
@@ -249,7 +249,7 @@
 	"edit": "Düzenle",
 	"user_groups_updated_successfully": "Kullanıcı grupları başarıyla güncellendi",
 	"user_updated_successfully": "Kullanıcı başarıyla güncellendi",
-	"custom_claims_updated_successfully": "Özel alanlar başarıyla güncellendi",
+	"custom_claims_updated_successfully": "Özel yetkiler başarıyla güncellendi",
 	"back": "Geri",
 	"user_details_firstname_lastname": "Kullanıcı Detayları {firstName} {lastName}",
 	"manage_which_groups_this_user_belongs_to": "Bu kullanıcının ait olduğu grupları yönetin.",
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -1,6 +1,6 @@
 {
  "name": "pocket-id-frontend",
-  "version": "2.7.0",
+  "version": "2.8.0",
  "private": true,
  "type": "module",
  "scripts": {
@@ -14,6 +14,7 @@
    "format": "prettier --write ."
  },
  "dependencies": {
+    "@fontsource/gloock": "^5.2.8",
    "@simplewebauthn/browser": "^13.3.0",
    "@tailwindcss/vite": "^4.3.0",
    "axios": "^1.16.1",
--- a/frontend/src/app.css
+++ b/frontend/src/app.css
@@ -1,5 +1,6 @@
@import 'tailwindcss';
@import 'tw-animate-css';
+@import '@fontsource/gloock';

@variant dark (&:where(.dark, .dark *));

@@ -22,7 +23,7 @@
 }

 :root {
-	--radius: 0.625rem;
+	--radius: 1rem;
 	--background: oklch(1 0 0);
 	--foreground: oklch(0.145 0 0);
 	--card: oklch(1 0 0);
@@ -133,13 +134,8 @@
 	--color-sidebar-border: var(--sidebar-border);
 	--color-sidebar-ring: var(--sidebar-ring);

-	/* Animations */
-	--animate-accordion-up: accordion-up 0.2s ease-out;
-	--animate-accordion-down: accordion-down 0.2s ease-out;
-	--animate-caret-blink: caret-blink 1.25s ease-out infinite;
-
 	/* Font */
-	--font-playfair: 'Playfair Display', serif;
+	--font-gloock: 'gloock', serif;
 }

@layer base {
@@ -154,60 +150,6 @@
 	button {
 		@apply cursor-pointer;
 	}
-
-	@font-face {
-		font-family: 'Playfair Display';
-		font-weight: 400;
-		src: url('/fonts/PlayfairDisplay-Regular.woff') format('woff');
-	}
-	@font-face {
-		font-family: 'Playfair Display';
-		font-weight: 500;
-		src: url('/fonts/PlayfairDisplay-Medium.woff') format('woff');
-	}
-	@font-face {
-		font-family: 'Playfair Display';
-		font-weight: 600;
-		src: url('/fonts/PlayfairDisplay-SemiBold.woff') format('woff');
-	}
-	@font-face {
-		font-family: 'Playfair Display';
-		font-weight: 700;
-		src: url('/fonts/PlayfairDisplay-Bold.woff') format('woff');
-	}
-}
-
-@keyframes accordion-down {
-	from {
-		height: 0;
-	}
-
-	to {
-		height: var(--bits-accordion-content-height);
-	}
-}
-
-@keyframes accordion-up {
-	from {
-		height: var(--bits-accordion-content-height);
-	}
-
-	to {
-		height: 0;
-	}
-}
-
-@keyframes caret-blink {
-	0%,
-	70%,
-	100% {
-		opacity: 1;
-	}
-
-	20%,
-	50% {
-		opacity: 0;
-	}
 }

 .animate-fade-in {
@@ -220,6 +162,7 @@
 		opacity: 0;
 		transform: translateY(10px);
 	}
+
 	to {
 		opacity: 1;
 		transform: translateY(0);
@@ -230,6 +173,7 @@
 	0% {
 		transform: scale(1.3);
 	}
+
 	100% {
 		transform: scale(1);
 	}
@@ -246,6 +190,7 @@
 	40% {
 		opacity: 0;
 	}
+
 	100% {
 		opacity: 1;
 	}
--- a/frontend/src/lib/components/form/searchable-multi-select.svelte
+++ b/frontend/src/lib/components/form/searchable-multi-select.svelte
@@ -81,18 +81,20 @@
 				variant="outline"
 				role="combobox"
 				aria-expanded={open}
-				class="h-auto min-h-10 w-full justify-between"
+				class="h-auto min-h-10 w-full bg-input/30!"
 			>
-				<div class="flex flex-wrap items-center gap-1">
-					{#if selectedItems.length > 0}
-						{#each selectedLabels as label}
-							<Badge variant="secondary">{label}</Badge>
-						{/each}
-					{:else}
-						<span class="text-muted-foreground font-normal">{m.select_items()}</span>
-					{/if}
+				<div class="flex items-center justify-between w-full">
+					<div class="flex flex-wrap items-center gap-1">
+						{#if selectedItems.length > 0}
+							{#each selectedLabels as label}
+								<Badge variant="secondary">{label}</Badge>
+							{/each}
+						{:else}
+							<span class="text-muted-foreground font-normal">{m.select_items()}</span>
+						{/if}
+					</div>
+					<LucideChevronDown class="ml-2 size-4 shrink-0 opacity-50" />
 				</div>
-				<LucideChevronDown class="ml-2 size-4 shrink-0 opacity-50" />
 			</Button>
 		{/snippet}
 	</Popover.Trigger>
--- a/frontend/src/lib/components/form/searchable-select.svelte
+++ b/frontend/src/lib/components/form/searchable-select.svelte
@@ -70,10 +70,12 @@
 				role="combobox"
 				aria-expanded={open}
 				{...props}
-				class={cn('justify-between', restProps.class)}
+				class={restProps.class}
 			>
-				{items.find((item) => item.value === value)?.label || selectText}
-				<LucideChevronDown class="ml-2 size-4 shrink-0 opacity-50" />
+				<span class="flex justify-between w-full">
+					{items.find((item) => item.value === value)?.label || selectText}
+					<LucideChevronDown class="size-4 shrink-0 opacity-50" />
+				</span>
 			</Button>
 		{/snippet}
 	</Popover.Trigger>
--- a/frontend/src/lib/components/header/header.svelte
+++ b/frontend/src/lib/components/header/header.svelte
@@ -1,8 +1,9 @@
 <script lang="ts">
 	import { page } from '$app/state';
-	import appConfigStore from '$lib/stores/application-configuration-store';
+	import { m } from '$lib/paraglide/messages';
 	import userStore from '$lib/stores/user-store';
 	import Logo from '../logo.svelte';
+	import Separator from '../ui/separator/separator.svelte';
 	import HeaderAvatar from './header-avatar.svelte';
 	import ModeSwitcher from './mode-switcher.svelte';

@@ -19,7 +20,11 @@
 	);
 </script>

-<div class=" w-full {isAuthPage ? 'absolute top-0 z-10 mt-3 lg:mt-8 pr-2 lg:pr-3' : 'border-b'}">
+<div
+	class=" w-full {isAuthPage
+		? 'absolute top-0 z-10 mt-3 lg:mt-8 pr-2 lg:pr-3'
+		: 'pt-3 bg-muted/40 dark:bg-background '}"
+>
 	<div
 		class="{!isAuthPage
 			? 'max-w-410'
@@ -27,10 +32,11 @@
 	>
 		<div class="flex h-16 items-center">
 			{#if !isAuthPage}
-				<a href="/" class="flex items-center gap-3 transition-opacity hover:opacity-80">
+				<a href="/" class="flex items-center transition-opacity hover:opacity-80">
 					<Logo class="size-8" />
-					<h1 class="text-lg font-semibold tracking-tight" data-testid="application-name">
-						{$appConfigStore.appName}
+					<Separator orientation="vertical" class="h-5! bg-neutral-600 ml-2 mr-3" />
+					<h1 class="text-2xl font-gloock" data-testid="application-name">
+						{m.settings()}
 					</h1>
 				</a>
 			{/if}
--- a/frontend/src/lib/components/passkey-row.svelte
+++ b/frontend/src/lib/components/passkey-row.svelte
@@ -23,7 +23,7 @@
 </script>

 <Item.Root variant="transparent" class="hover:bg-muted transition-colors py-3 px-0 sm:px-4">
-	<Item.Media class="bg-primary/10 text-primary rounded-lg p-2">
+	<Item.Media class="bg-primary/10 text-primary rounded-full p-3">
 		{#if icon}{@const Icon = icon}
 			<Icon class="size-5" />
 		{/if}
--- a/frontend/src/lib/components/qrcode/qrcode.svelte
+++ b/frontend/src/lib/components/qrcode/qrcode.svelte
@@ -9,7 +9,7 @@
 		value,
 		size = 200,
 		color = '#000000',
-		backgroundColor = '#FFFFFF',
+		backgroundColor = 'transparent',
 		...restProps
 	}: HTMLAttributes<HTMLCanvasElement> & {
 		value: string | null;
@@ -39,4 +39,4 @@
 	});
 </script>

-<canvas {...restProps} bind:this={canvasEl} class={cn('rounded-lg', restProps.class)}></canvas>
+<canvas {...restProps} bind:this={canvasEl} class={cn('rounded', restProps.class)}></canvas>
--- a/frontend/src/lib/components/signup/signup-token-modal.svelte
+++ b/frontend/src/lib/components/signup/signup-token-modal.svelte
@@ -187,7 +187,6 @@
 					value={signupLink}
 					size={180}
 					color={mode.current === 'dark' ? '#FFFFFF' : '#000000'}
-					backgroundColor={mode.current === 'dark' ? '#000000' : '#FFFFFF'}
 				/>
 				<CopyToClipboard value={signupLink!}>
 					<p data-testId="signup-token-link" class="px-2 text-center text-sm break-all">
--- a/frontend/src/lib/components/table/advanced-table-column-selection.svelte
+++ b/frontend/src/lib/components/table/advanced-table-column-selection.svelte
@@ -16,7 +16,7 @@
 		class={buttonVariants({
 			variant: 'outline',
 			size: 'sm',
-			class: 'ml-auto h-8'
+			class: 'ml-auto'
 		})}
 	>
 		<Settings2Icon />
--- a/frontend/src/lib/components/table/advanced-table-filter.svelte
+++ b/frontend/src/lib/components/table/advanced-table-filter.svelte
@@ -38,11 +38,13 @@
 				{...props}
 				variant="outline"
 				size="sm"
-				class="h-8 border-dashed"
+				class="order-dashed"
 				data-testid={`facet-${title.toLowerCase()}-trigger`}
 			>
-				<ListFilterIcon />
-				{title}
+				<span class="flex gap-2 items-center">
+					<ListFilterIcon />
+					{title}
+				</span>
 				{#if selectedValues.size > 0}
 					<Separator orientation="vertical" class="mx-2 h-4" />
 					<Badge variant="secondary" class="rounded-sm px-1 font-normal lg:hidden">
--- a/frontend/src/lib/components/table/advanced-table.svelte
+++ b/frontend/src/lib/components/table/advanced-table.svelte
@@ -239,7 +239,7 @@
 										class="h-12 w-full justify-start px-4 font-medium hover:bg-transparent"
 										onclick={() => onSort(column.column)}
 									>
-										<span class="flex items-center">
+										<span class="flex items-center w-full">
 											{column.label}
 											<ChevronDown
 												class={cn(
@@ -310,9 +310,7 @@
 												<DropdownMenu.Item
 													onclick={() => action.onClick(item)}
 													disabled={action.disabled}
-													class={action.variant === 'danger'
-														? 'text-red-500 focus:!text-red-700'
-														: ''}
+													class={action.variant === 'danger' ? 'text-red-500!' : ''}
 												>
 													{#if action.icon}
 														{@const Icon = action.icon}
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte
@@ -1,18 +1,27 @@
 <script lang="ts">
 	import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
-	import { buttonVariants } from '$lib/components/ui/button/index.js';
+	import {
+		buttonVariants,
+		type ButtonVariant,
+		type ButtonSize
+	} from '$lib/components/ui/button/index.js';
 	import { cn } from '$lib/utils/style.js';

 	let {
 		ref = $bindable(null),
 		class: className,
+		variant = 'default',
+		size = 'default',
 		...restProps
-	}: AlertDialogPrimitive.ActionProps = $props();
+	}: AlertDialogPrimitive.ActionProps & {
+		variant?: ButtonVariant;
+		size?: ButtonSize;
+	} = $props();
 </script>

 <AlertDialogPrimitive.Action
 	bind:ref
 	data-slot="alert-dialog-action"
-	class={cn(buttonVariants(), className)}
+	class={cn(buttonVariants({ variant, size }), 'cn-alert-dialog-action', className)}
 	{...restProps}
 />
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte
@@ -1,18 +1,27 @@
 <script lang="ts">
 	import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
-	import { buttonVariants } from '$lib/components/ui/button/index.js';
+	import {
+		buttonVariants,
+		type ButtonVariant,
+		type ButtonSize
+	} from '$lib/components/ui/button/index.js';
 	import { cn } from '$lib/utils/style.js';

 	let {
 		ref = $bindable(null),
 		class: className,
+		variant = 'outline',
+		size = 'default',
 		...restProps
-	}: AlertDialogPrimitive.CancelProps = $props();
+	}: AlertDialogPrimitive.CancelProps & {
+		variant?: ButtonVariant;
+		size?: ButtonSize;
+	} = $props();
 </script>

 <AlertDialogPrimitive.Cancel
 	bind:ref
 	data-slot="alert-dialog-cancel"
-	class={cn(buttonVariants({ variant: 'outline' }), className)}
+	class={cn(buttonVariants({ variant, size }), 'cn-alert-dialog-cancel', className)}
 	{...restProps}
 />
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte
@@ -1,27 +1,32 @@
 <script lang="ts">
 	import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
+	import AlertDialogPortal from './alert-dialog-portal.svelte';
 	import AlertDialogOverlay from './alert-dialog-overlay.svelte';
 	import { cn, type WithoutChild, type WithoutChildrenOrChild } from '$lib/utils/style.js';
+	import type { ComponentProps } from 'svelte';

 	let {
 		ref = $bindable(null),
 		class: className,
+		size = 'default',
 		portalProps,
 		...restProps
 	}: WithoutChild<AlertDialogPrimitive.ContentProps> & {
-		portalProps?: WithoutChildrenOrChild<AlertDialogPrimitive.PortalProps>;
+		size?: 'default' | 'sm';
+		portalProps?: WithoutChildrenOrChild<ComponentProps<typeof AlertDialogPortal>>;
 	} = $props();
 </script>

-<AlertDialogPrimitive.Portal {...portalProps}>
+<AlertDialogPortal {...portalProps}>
 	<AlertDialogOverlay />
 	<AlertDialogPrimitive.Content
 		bind:ref
 		data-slot="alert-dialog-content"
+		data-size={size}
 		class={cn(
-			'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
+			'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 bg-popover text-popover-foreground ring-foreground/10 gap-4 rounded-4xl p-5 sm:p-8 sm:pb-6 ring-1 duration-100 data-[size=default]:max-w-sm data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-md group/alert-dialog-content fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2 outline-none',
 			className
 		)}
 		{...restProps}
 	/>
-</AlertDialogPrimitive.Portal>
+</AlertDialogPortal>
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte
@@ -12,6 +12,9 @@
 <AlertDialogPrimitive.Description
 	bind:ref
 	data-slot="alert-dialog-description"
-	class={cn('text-muted-foreground text-sm', className)}
+	class={cn(
+		'text-muted-foreground *:[a]:hover:text-foreground text-sm text-balance md:text-pretty *:[a]:underline *:[a]:underline-offset-3',
+		className
+	)}
 	{...restProps}
 />
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-footer.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-footer.svelte
@@ -13,7 +13,10 @@
 <div
 	bind:this={ref}
 	data-slot="alert-dialog-footer"
-	class={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}
+	class={cn(
+		'-mx-4 -mb-4 rounded-b-xl p-4 flex flex-col-reverse gap-2 group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end',
+		className
+	)}
 	{...restProps}
 >
 	{@render children?.()}
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-header.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-header.svelte
@@ -13,7 +13,10 @@
 <div
 	bind:this={ref}
 	data-slot="alert-dialog-header"
-	class={cn('flex flex-col gap-2 text-center sm:text-left', className)}
+	class={cn(
+		'grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]',
+		className
+	)}
 	{...restProps}
 >
 	{@render children?.()}
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-media.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-media.svelte
@@ -0,0 +1,23 @@
+<script lang="ts">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { cn, type WithElementRef } from '$lib/utils/style.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		children,
+		...restProps
+	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
+</script>
+
+<div
+	bind:this={ref}
+	data-slot="alert-dialog-media"
+	class={cn(
+		"bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-6",
+		className
+	)}
+	{...restProps}
+>
+	{@render children?.()}
+</div>
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte
@@ -13,7 +13,7 @@
 	bind:ref
 	data-slot="alert-dialog-overlay"
 	class={cn(
-		'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50',
+		'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 bg-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs fixed inset-0 z-50',
 		className
 	)}
 	{...restProps}
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-portal.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-portal.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
+
+	let { ...restProps }: AlertDialogPrimitive.PortalProps = $props();
+</script>
+
+<AlertDialogPrimitive.Portal {...restProps} />
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte
@@ -12,6 +12,9 @@
 <AlertDialogPrimitive.Title
 	bind:ref
 	data-slot="alert-dialog-title"
-	class={cn('text-lg font-semibold', className)}
+	class={cn(
+		'text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2',
+		className
+	)}
 	{...restProps}
 />
--- a/frontend/src/lib/components/ui/alert-dialog/alert-dialog.svelte
+++ b/frontend/src/lib/components/ui/alert-dialog/alert-dialog.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
+
+	let { open = $bindable(false), ...restProps }: AlertDialogPrimitive.RootProps = $props();
+</script>
+
+<AlertDialogPrimitive.Root bind:open {...restProps} />
--- a/frontend/src/lib/components/ui/alert-dialog/index.ts
+++ b/frontend/src/lib/components/ui/alert-dialog/index.ts
@@ -1,4 +1,5 @@
-import { AlertDialog as AlertDialogPrimitive } from 'bits-ui';
+import Root from './alert-dialog.svelte';
+import Portal from './alert-dialog-portal.svelte';
 import Trigger from './alert-dialog-trigger.svelte';
 import Title from './alert-dialog-title.svelte';
 import Action from './alert-dialog-action.svelte';
@@ -8,29 +9,32 @@ import Header from './alert-dialog-header.svelte';
 import Overlay from './alert-dialog-overlay.svelte';
 import Content from './alert-dialog-content.svelte';
 import Description from './alert-dialog-description.svelte';
-
-const Root = AlertDialogPrimitive.Root;
+import Media from './alert-dialog-media.svelte';

 export {
 	Root,
 	Title,
 	Action,
 	Cancel,
+	Portal,
 	Footer,
 	Header,
 	Trigger,
 	Overlay,
 	Content,
 	Description,
+	Media,
 	//
 	Root as AlertDialog,
 	Title as AlertDialogTitle,
 	Action as AlertDialogAction,
 	Cancel as AlertDialogCancel,
+	Portal as AlertDialogPortal,
 	Footer as AlertDialogFooter,
 	Header as AlertDialogHeader,
 	Trigger as AlertDialogTrigger,
 	Overlay as AlertDialogOverlay,
 	Content as AlertDialogContent,
-	Description as AlertDialogDescription
+	Description as AlertDialogDescription,
+	Media as AlertDialogMedia
 };
--- a/frontend/src/lib/components/ui/alert/alert.svelte
+++ b/frontend/src/lib/components/ui/alert/alert.svelte
@@ -2,7 +2,7 @@
 	import { tv, type VariantProps } from 'tailwind-variants';

 	export const alertVariants = tv({
-		base: 'relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-lg border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current',
+		base: 'relative grid w-full grid-cols-[0_1fr] items-start gap-y-0.5 rounded-3xl border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current',
 		variants: {
 			variant: {
 				default: 'bg-card text-card-foreground',
--- a/frontend/src/lib/components/ui/badge/badge.svelte
+++ b/frontend/src/lib/components/ui/badge/badge.svelte
@@ -2,15 +2,16 @@
 	import { type VariantProps, tv } from 'tailwind-variants';

 	export const badgeVariants = tv({
-		base: 'focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden whitespace-nowrap rounded-md border px-2 py-0.5 text-xs font-medium transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none [&>svg]:size-3',
+		base: 'h-5 gap-1 rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium transition-all has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&>svg]:size-3! focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive group/badge inline-flex w-fit shrink-0 items-center justify-center overflow-hidden whitespace-nowrap transition-colors focus-visible:ring-[3px] [&>svg]:pointer-events-none',
 		variants: {
 			variant: {
-				default: 'bg-primary text-primary-foreground [a&]:hover:bg-primary/90 border-transparent',
-				secondary:
-					'bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent',
+				default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
+				secondary: 'bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80',
 				destructive:
-					'bg-destructive [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/70 border-transparent text-white',
-				outline: 'text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground'
+					'bg-destructive/10 [a]:hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 text-destructive dark:bg-destructive/20',
+				outline: 'border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground',
+				ghost: 'hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50',
+				link: 'text-primary underline-offset-4 hover:underline'
 			}
 		},
 		defaultVariants: {
--- a/frontend/src/lib/components/ui/button/button.svelte
+++ b/frontend/src/lib/components/ui/button/button.svelte
@@ -4,22 +4,24 @@
 	import { tv, type VariantProps } from 'tailwind-variants';

 	export const buttonVariants = tv({
-		base: "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium outline-none transition-all focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+		base: "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-full text-sm font-medium outline-none transition-all focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:shrink-0 transition active:scale-95",
 		variants: {
 			variant: {
-				default: 'bg-primary text-primary-foreground shadow-xs hover:bg-primary/90',
-				destructive:
-					'bg-destructive shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white',
+				default: 'bg-primary text-primary-foreground hover:bg-primary/80',
 				outline:
-					'bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border',
-				secondary: 'bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80',
-				ghost: 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
+					'border border-border bg-background hover:bg-muted hover:text-foreground dark:hover:bg-input/30 aria-expanded:bg-muted aria-expanded:text-foreground dark:bg-transparent',
+				secondary:
+					'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',
+				ghost:
+					'hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground',
+				destructive:
+					'bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30',
 				link: 'text-primary underline-offset-4 hover:underline'
 			},
 			size: {
 				default: 'h-10 px-4 py-2',
-				sm: 'h-8 rounded-md px-3',
-				lg: 'h-11 rounded-md px-8',
+				sm: 'h-9 px-3 py-2',
+				lg: 'h-11 px-8',
 				icon: 'h-10 w-10'
 			}
 		},
@@ -96,9 +98,6 @@
 		tabindex={disabled ? -1 : undefined}
 		{...restProps}
 	>
-		{#if isLoading}
-			<Spinner />
-		{/if}
 		{@render children?.()}
 	</a>
 {:else}
@@ -111,9 +110,15 @@
 		onclick={handleOnClick}
 		{...restProps}
 	>
-		{#if isLoading}
-			<Spinner />
-		{/if}
-		{@render children?.()}
+		<span class="flex items-center w-full justify-center">
+			<Spinner
+				class={cn(
+					'grid overflow-hidden transition-[width,opacity,margin-right] duration-400 ease-[linear(0,0.897_14.4%,1.311_31.2%,1.338_46%,1.054_80.4%,1)]',
+					isLoading ? 'w-4 opacity-100 mr-2' : 'w-0 opacity-0'
+				)}
+				aria-hidden={!isLoading}
+			/>
+			{@render children?.()}
+		</span>
 	</button>
 {/if}
--- a/frontend/src/lib/components/ui/card/card.svelte
+++ b/frontend/src/lib/components/ui/card/card.svelte
@@ -14,7 +14,7 @@
 	bind:this={ref}
 	data-slot="card"
 	class={cn(
-		'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm',
+		'bg-card text-card-foreground flex flex-col gap-6 rounded-4xl border py-6 shadow-sm',
 		className
 	)}
 	{...restProps}
--- a/frontend/src/lib/components/ui/dialog/dialog-content.svelte
+++ b/frontend/src/lib/components/ui/dialog/dialog-content.svelte
@@ -23,14 +23,14 @@
 		bind:ref
 		data-slot="dialog-content"
 		class={cn(
-			'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
+			'bg-popover data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-4xl border p-6 shadow-lg duration-200 sm:max-w-lg',
 			className
 		)}
 		{...restProps}
 	>
 		{@render children?.()}
 		<DialogPrimitive.Close
-			class="ring-offset-background focus:ring-ring absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
+			class="ring-offset-popover focus:ring-ring absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
 		>
 			<XIcon />
 			<span class="sr-only">Close</span>
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-group.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-group.svelte
@@ -0,0 +1,16 @@
+<script lang="ts">
+	import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
+
+	let {
+		ref = $bindable(null),
+		value = $bindable([]),
+		...restProps
+	}: DropdownMenuPrimitive.CheckboxGroupProps = $props();
+</script>
+
+<DropdownMenuPrimitive.CheckboxGroup
+	bind:ref
+	bind:value
+	data-slot="dropdown-menu-checkbox-group"
+	{...restProps}
+/>
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
-	import CheckIcon from '@lucide/svelte/icons/check';
 	import MinusIcon from '@lucide/svelte/icons/minus';
+	import CheckIcon from '@lucide/svelte/icons/check';
 	import { cn, type WithoutChildrenOrChild } from '$lib/utils/style.js';
 	import type { Snippet } from 'svelte';

@@ -23,17 +23,20 @@
 	bind:indeterminate
 	data-slot="dropdown-menu-checkbox-item"
 	class={cn(
-		"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+		"focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1.5 pr-9 pl-2 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
 		className
 	)}
 	{...restProps}
 >
 	{#snippet children({ checked, indeterminate })}
-		<span class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+		<span
+			class="absolute right-2 flex items-center justify-center pointer-events-none"
+			data-slot="dropdown-menu-checkbox-item-indicator"
+		>
 			{#if indeterminate}
-				<MinusIcon class="size-4" />
-			{:else}
-				<CheckIcon class={cn('size-4', !checked && 'text-transparent')} />
+				<MinusIcon />
+			{:else if checked}
+				<CheckIcon />
 			{/if}
 		</span>
 		{@render childrenProp?.()}
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-content.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-content.svelte
@@ -1,27 +1,31 @@
 <script lang="ts">
-	import { cn } from '$lib/utils/style.js';
+	import { cn, type WithoutChildrenOrChild } from '$lib/utils/style.js';
+	import DropdownMenuPortal from './dropdown-menu-portal.svelte';
 	import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
+	import type { ComponentProps } from 'svelte';

 	let {
 		ref = $bindable(null),
 		sideOffset = 4,
+		align = 'start',
 		portalProps,
 		class: className,
 		...restProps
 	}: DropdownMenuPrimitive.ContentProps & {
-		portalProps?: DropdownMenuPrimitive.PortalProps;
+		portalProps?: WithoutChildrenOrChild<ComponentProps<typeof DropdownMenuPortal>>;
 	} = $props();
 </script>

-<DropdownMenuPrimitive.Portal {...portalProps}>
+<DropdownMenuPortal {...portalProps}>
 	<DropdownMenuPrimitive.Content
 		bind:ref
 		data-slot="dropdown-menu-content"
 		{sideOffset}
+		{align}
 		class={cn(
-			'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md',
+			'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 bg-popover text-popover-foreground min-w-32 rounded-lg p-1 shadow-md ring-1 duration-100 data-[side=inline-start]:slide-in-from-right-2 data-[side=inline-end]:slide-in-from-left-2 z-50 overflow-x-hidden overflow-y-auto outline-none data-closed:overflow-hidden',
 			className
 		)}
 		{...restProps}
 	/>
-</DropdownMenuPrimitive.Portal>
+</DropdownMenuPortal>
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-group-heading.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-group-heading.svelte
@@ -17,6 +17,6 @@
 	bind:ref
 	data-slot="dropdown-menu-group-heading"
 	data-inset={inset}
-	class={cn('px-2 py-1.5 text-sm font-semibold data-[inset]:pl-8', className)}
+	class={cn('px-2 py-1.5 text-sm font-semibold data-[inset]:ps-8', className)}
 	{...restProps}
 />
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte
@@ -20,7 +20,7 @@
 	data-inset={inset}
 	data-variant={variant}
 	class={cn(
-		"data-highlighted:bg-accent data-highlighted:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:data-highlighted:bg-destructive/10 dark:data-[variant=destructive]:data-highlighted:bg-destructive/20 data-[variant=destructive]:data-highlighted:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+		"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md px-2 py-1.5 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 group/dropdown-menu-item relative flex cursor-pointer items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0",
 		className
 	)}
 	{...restProps}
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte
@@ -17,7 +17,10 @@
 	bind:this={ref}
 	data-slot="dropdown-menu-label"
 	data-inset={inset}
-	class={cn('px-2 py-1.5 text-sm font-semibold data-[inset]:pl-8', className)}
+	class={cn(
+		'text-muted-foreground px-1.5 py-1 text-xs font-medium data-inset:pl-7 data-[inset]:pl-8',
+		className
+	)}
 	{...restProps}
 >
 	{@render children?.()}
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-portal.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-portal.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
+
+	let { ...restProps }: DropdownMenuPrimitive.PortalProps = $props();
+</script>
+
+<DropdownMenuPrimitive.Portal {...restProps} />
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-radio-item.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-radio-item.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
-	import CircleIcon from '@lucide/svelte/icons/circle';
+	import CheckIcon from '@lucide/svelte/icons/check';
 	import { cn, type WithoutChild } from '$lib/utils/style.js';

 	let {
@@ -15,15 +15,18 @@
 	bind:ref
 	data-slot="dropdown-menu-radio-item"
 	class={cn(
-		"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+		"focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
 		className
 	)}
 	{...restProps}
 >
 	{#snippet children({ checked })}
-		<span class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
+		<span
+			class="absolute right-2 flex items-center justify-center"
+			data-slot="dropdown-menu-radio-item-indicator"
+		>
 			{#if checked}
-				<CircleIcon class="size-2 fill-current" />
+				<CheckIcon />
 			{/if}
 		</span>
 		{@render childrenProp?.({ checked })}
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-shortcut.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-shortcut.svelte
@@ -13,7 +13,10 @@
 <span
 	bind:this={ref}
 	data-slot="dropdown-menu-shortcut"
-	class={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)}
+	class={cn(
+		'text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground ml-auto text-xs tracking-widest',
+		className
+	)}
 	{...restProps}
 >
 	{@render children?.()}
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-sub-content.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-sub-content.svelte
@@ -13,7 +13,7 @@
 	bind:ref
 	data-slot="dropdown-menu-sub-content"
 	class={cn(
-		'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg',
+		'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 bg-popover text-popover-foreground min-w-[96px] rounded-lg p-1 shadow-lg ring-1 duration-100 w-auto',
 		className
 	)}
 	{...restProps}
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-sub-trigger.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-sub-trigger.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
-	import { cn } from '$lib/utils/style.js';
-	import ChevronRightIcon from '@lucide/svelte/icons/chevron-right';
 	import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
+	import ChevronRightIcon from '@lucide/svelte/icons/chevron-right';
+	import { cn } from '$lib/utils/style.js';

 	let {
 		ref = $bindable(null),
@@ -19,11 +19,11 @@
 	data-slot="dropdown-menu-sub-trigger"
 	data-inset={inset}
 	class={cn(
-		"data-highlighted:bg-accent data-highlighted:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+		"focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md px-1.5 py-1 text-sm data-inset:pl-7 [&_svg:not([class*='size-'])]:size-4 flex cursor-default items-center outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0",
 		className
 	)}
 	{...restProps}
 >
 	{@render children?.()}
-	<ChevronRightIcon class="ml-auto size-4" />
+	<ChevronRightIcon class="ml-auto" />
 </DropdownMenuPrimitive.SubTrigger>
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-sub.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu-sub.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
+
+	let { open = $bindable(false), ...restProps }: DropdownMenuPrimitive.SubProps = $props();
+</script>
+
+<DropdownMenuPrimitive.Sub bind:open {...restProps} />
--- a/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu.svelte
+++ b/frontend/src/lib/components/ui/dropdown-menu/dropdown-menu.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
+
+	let { open = $bindable(false), ...restProps }: DropdownMenuPrimitive.RootProps = $props();
+</script>
+
+<DropdownMenuPrimitive.Root bind:open {...restProps} />
--- a/frontend/src/lib/components/ui/dropdown-menu/index.ts
+++ b/frontend/src/lib/components/ui/dropdown-menu/index.ts
@@ -1,4 +1,6 @@
-import { DropdownMenu as DropdownMenuPrimitive } from 'bits-ui';
+import Root from './dropdown-menu.svelte';
+import Sub from './dropdown-menu-sub.svelte';
+import CheckboxGroup from './dropdown-menu-checkbox-group.svelte';
 import CheckboxItem from './dropdown-menu-checkbox-item.svelte';
 import Content from './dropdown-menu-content.svelte';
 import Group from './dropdown-menu-group.svelte';
@@ -12,15 +14,18 @@ import Trigger from './dropdown-menu-trigger.svelte';
 import SubContent from './dropdown-menu-sub-content.svelte';
 import SubTrigger from './dropdown-menu-sub-trigger.svelte';
 import GroupHeading from './dropdown-menu-group-heading.svelte';
-const Sub = DropdownMenuPrimitive.Sub;
-const Root = DropdownMenuPrimitive.Root;
+import Portal from './dropdown-menu-portal.svelte';

 export {
+	CheckboxGroup,
 	CheckboxItem,
 	Content,
+	Portal,
 	Root as DropdownMenu,
+	CheckboxGroup as DropdownMenuCheckboxGroup,
 	CheckboxItem as DropdownMenuCheckboxItem,
 	Content as DropdownMenuContent,
+	Portal as DropdownMenuPortal,
 	Group as DropdownMenuGroup,
 	Item as DropdownMenuItem,
 	Label as DropdownMenuLabel,
--- a/frontend/src/lib/components/ui/input/input.svelte
+++ b/frontend/src/lib/components/ui/input/input.svelte
@@ -24,7 +24,7 @@
 		bind:this={ref}
 		data-slot="input"
 		class={cn(
-			'selection:bg-primary dark:bg-input/30 selection:text-primary-foreground border-input ring-offset-background placeholder:text-muted-foreground flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-2 text-base font-medium shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+			'selection:bg-primary dark:bg-input/30 selection:text-primary-foreground border-input ring-offset-background placeholder:text-muted-foreground flex h-9 w-full min-w-0 rounded-full border bg-transparent px-3 py-2 text-base font-medium shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
 			'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
 			'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
 			className
@@ -39,7 +39,7 @@
 		bind:this={ref}
 		data-slot="input"
 		class={cn(
-			'border-input bg-background selection:bg-primary dark:bg-input/30 selection:text-primary-foreground ring-offset-background placeholder:text-muted-foreground flex h-9 w-full min-w-0 rounded-md border px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+			'border-input bg-background selection:bg-primary dark:bg-input/30 selection:text-primary-foreground ring-offset-background placeholder:text-muted-foreground flex h-9 w-full min-w-0 rounded-full border px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
 			'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
 			'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
 			className
--- a/frontend/src/lib/components/ui/item/item.svelte
+++ b/frontend/src/lib/components/ui/item/item.svelte
@@ -2,7 +2,7 @@
 	import { tv, type VariantProps } from 'tailwind-variants';

 	export const itemVariants = tv({
-		base: 'group/item focus-visible:border-ring focus-visible:ring-ring/50 flex flex-wrap items-center rounded-xl border border-transparent text-sm outline-none transition-colors duration-100 focus-visible:ring-[3px]',
+		base: 'group/item focus-visible:border-ring focus-visible:ring-ring/50 flex flex-wrap items-center rounded-4xl border border-transparent text-sm outline-none transition-colors duration-100 focus-visible:ring-[3px]',
 		variants: {
 			variant: {
 				default: 'bg-transparent [a&]:hover:bg-accent/50 [a&]:transition-colors',
@@ -12,8 +12,8 @@
 				transparent: 'bg-transparent'
 			},
 			size: {
-				default: 'gap-4 p-4',
-				sm: 'gap-2.5 px-4 py-3'
+				default: 'gap-4 p-6',
+				sm: 'gap-2.5 px-4 py-4'
 			}
 		},
 		defaultVariants: {
--- a/frontend/src/lib/components/ui/popover/index.ts
+++ b/frontend/src/lib/components/ui/popover/index.ts
@@ -1,17 +1,28 @@
-import { Popover as PopoverPrimitive } from 'bits-ui';
+import Root from './popover.svelte';
+import Close from './popover-close.svelte';
 import Content from './popover-content.svelte';
+import Description from './popover-description.svelte';
+import Header from './popover-header.svelte';
+import Title from './popover-title.svelte';
 import Trigger from './popover-trigger.svelte';
-const Root = PopoverPrimitive.Root;
-const Close = PopoverPrimitive.Close;
+import Portal from './popover-portal.svelte';

 export {
 	Root,
 	Content,
+	Description,
+	Header,
+	Title,
 	Trigger,
 	Close,
+	Portal,
 	//
 	Root as Popover,
 	Content as PopoverContent,
+	Description as PopoverDescription,
+	Header as PopoverHeader,
+	Title as PopoverTitle,
 	Trigger as PopoverTrigger,
-	Close as PopoverClose
+	Close as PopoverClose,
+	Portal as PopoverPortal
 };
--- a/frontend/src/lib/components/ui/popover/popover-close.svelte
+++ b/frontend/src/lib/components/ui/popover/popover-close.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Popover as PopoverPrimitive } from 'bits-ui';
+
+	let { ref = $bindable(null), ...restProps }: PopoverPrimitive.CloseProps = $props();
+</script>
+
+<PopoverPrimitive.Close bind:ref data-slot="popover-close" {...restProps} />
--- a/frontend/src/lib/components/ui/popover/popover-content.svelte
+++ b/frontend/src/lib/components/ui/popover/popover-content.svelte
@@ -1,6 +1,8 @@
 <script lang="ts">
-	import { cn } from '$lib/utils/style.js';
+	import { cn, type WithoutChildrenOrChild } from '$lib/utils/style.js';
 	import { Popover as PopoverPrimitive } from 'bits-ui';
+	import type { ComponentProps } from 'svelte';
+	import PopoverPortal from './popover-portal.svelte';

 	let {
 		ref = $bindable(null),
@@ -11,22 +13,22 @@
 		portalProps,
 		...restProps
 	}: PopoverPrimitive.ContentProps & {
-		portalProps?: PopoverPrimitive.PortalProps;
+		portalProps?: WithoutChildrenOrChild<ComponentProps<typeof PopoverPortal>>;
 		sameWidth?: boolean;
 	} = $props();
 </script>

-<PopoverPrimitive.Portal {...portalProps}>
+<PopoverPortal {...portalProps}>
 	<PopoverPrimitive.Content
 		bind:ref
 		data-slot="popover-content"
 		{sideOffset}
 		{align}
 		class={cn(
-			'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--bits-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden',
+			'bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 flex flex-col gap-2.5 rounded-sm p-2.5 text-sm shadow-md ring-1 duration-100 data-[side=inline-start]:slide-in-from-right-2 data-[side=inline-end]:slide-in-from-left-2 z-50 w-72 origin-(--transform-origin) outline-hidden',
 			sameWidth && 'w-[var(--bits-popover-anchor-width)]',
 			className
 		)}
 		{...restProps}
 	/>
-</PopoverPrimitive.Portal>
+</PopoverPortal>
--- a/frontend/src/lib/components/ui/popover/popover-description.svelte
+++ b/frontend/src/lib/components/ui/popover/popover-description.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { cn, type WithElementRef } from '$lib/utils/style.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		children,
+		...restProps
+	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
+</script>
+
+<div
+	bind:this={ref}
+	data-slot="popover-description"
+	class={cn('text-muted-foreground', className)}
+	{...restProps}
+>
+	{@render children?.()}
+</div>
--- a/frontend/src/lib/components/ui/popover/popover-header.svelte
+++ b/frontend/src/lib/components/ui/popover/popover-header.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { cn, type WithElementRef } from '$lib/utils/style.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		children,
+		...restProps
+	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
+</script>
+
+<div
+	bind:this={ref}
+	data-slot="popover-header"
+	class={cn('flex flex-col gap-0.5 text-sm', className)}
+	{...restProps}
+>
+	{@render children?.()}
+</div>
--- a/frontend/src/lib/components/ui/popover/popover-portal.svelte
+++ b/frontend/src/lib/components/ui/popover/popover-portal.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Popover as PopoverPrimitive } from 'bits-ui';
+
+	let { ...restProps }: PopoverPrimitive.PortalProps = $props();
+</script>
+
+<PopoverPrimitive.Portal {...restProps} />
--- a/frontend/src/lib/components/ui/popover/popover-title.svelte
+++ b/frontend/src/lib/components/ui/popover/popover-title.svelte
@@ -0,0 +1,15 @@
+<script lang="ts">
+	import type { HTMLAttributes } from 'svelte/elements';
+	import { cn, type WithElementRef } from '$lib/utils/style.js';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		children,
+		...restProps
+	}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
+</script>
+
+<div bind:this={ref} data-slot="popover-title" class={cn('font-medium', className)} {...restProps}>
+	{@render children?.()}
+</div>
--- a/frontend/src/lib/components/ui/popover/popover.svelte
+++ b/frontend/src/lib/components/ui/popover/popover.svelte
@@ -0,0 +1,7 @@
+<script lang="ts">
+	import { Popover as PopoverPrimitive } from 'bits-ui';
+
+	let { open = $bindable(false), ...restProps }: PopoverPrimitive.RootProps = $props();
+</script>
+
+<PopoverPrimitive.Root bind:open {...restProps} />
--- a/frontend/src/lib/components/ui/select/index.ts
+++ b/frontend/src/lib/components/ui/select/index.ts
@@ -1,5 +1,4 @@
-import { Select as SelectPrimitive } from 'bits-ui';
-
+import Root from './select.svelte';
 import Group from './select-group.svelte';
 import Label from './select-label.svelte';
 import Item from './select-item.svelte';
@@ -8,8 +7,8 @@ import Trigger from './select-trigger.svelte';
 import Separator from './select-separator.svelte';
 import ScrollDownButton from './select-scroll-down-button.svelte';
 import ScrollUpButton from './select-scroll-up-button.svelte';
-
-const Root = SelectPrimitive.Root;
+import GroupHeading from './select-group-heading.svelte';
+import Portal from './select-portal.svelte';

 export {
 	Root,
@@ -21,6 +20,8 @@ export {
 	Separator,
 	ScrollDownButton,
 	ScrollUpButton,
+	GroupHeading,
+	Portal,
 	//
 	Root as Select,
 	Group as SelectGroup,
@@ -30,5 +31,7 @@ export {
 	Trigger as SelectTrigger,
 	Separator as SelectSeparator,
 	ScrollDownButton as SelectScrollDownButton,
-	ScrollUpButton as SelectScrollUpButton
+	ScrollUpButton as SelectScrollUpButton,
+	GroupHeading as SelectGroupHeading,
+	Portal as SelectPortal
 };
--- a/frontend/src/lib/components/ui/select/select-content.svelte
+++ b/frontend/src/lib/components/ui/select/select-content.svelte
@@ -1,8 +1,11 @@
 <script lang="ts">
-	import { Select as SelectPrimitive } from 'bits-ui';
-	import SelectScrollUpButton from './select-scroll-up-button.svelte';
-	import SelectScrollDownButton from './select-scroll-down-button.svelte';
+	import type { WithoutChildrenOrChild } from '$lib/utils/style.js';
 	import { cn, type WithoutChild } from '$lib/utils/style.js';
+	import { Select as SelectPrimitive } from 'bits-ui';
+	import type { ComponentProps } from 'svelte';
+	import SelectPortal from './select-portal.svelte';
+	import SelectScrollDownButton from './select-scroll-down-button.svelte';
+	import SelectScrollUpButton from './select-scroll-up-button.svelte';

 	let {
 		ref = $bindable(null),
@@ -10,19 +13,21 @@
 		sideOffset = 4,
 		portalProps,
 		children,
+		preventScroll = true,
 		...restProps
 	}: WithoutChild<SelectPrimitive.ContentProps> & {
-		portalProps?: SelectPrimitive.PortalProps;
+		portalProps?: WithoutChildrenOrChild<ComponentProps<typeof SelectPortal>>;
 	} = $props();
 </script>

-<SelectPrimitive.Portal {...portalProps}>
+<SelectPortal {...portalProps}>
 	<SelectPrimitive.Content
 		bind:ref
 		{sideOffset}
+		{preventScroll}
 		data-slot="select-content"
 		class={cn(
-			'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--bits-select-content-available-height) min-w-[8rem] origin-(--bits-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
+			'bg-popover y-5 p-1 text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 min-w-36 rounded-lg shadow-md ring-1 duration-100 data-[side=inline-start]:slide-in-from-right-2 data-[side=inline-end]:slide-in-from-left-2 relative isolate z-50 overflow-x-hidden overflow-y-auto',
 			className
 		)}
 		{...restProps}
@@ -30,11 +35,11 @@
 		<SelectScrollUpButton />
 		<SelectPrimitive.Viewport
 			class={cn(
-				'h-(--bits-select-anchor-height) w-full min-w-(--bits-select-anchor-width) scroll-my-1 p-1'
+				'h-(--bits-select-anchor-height) w-full min-w-(--bits-select-anchor-width) scroll-my-1'
 			)}
 		>
 			{@render children?.()}
 		</SelectPrimitive.Viewport>
 		<SelectScrollDownButton />
 	</SelectPrimitive.Content>
-</SelectPrimitive.Portal>
+</SelectPortal>
--- a/frontend/src/lib/components/ui/select/select-group-heading.svelte
+++ b/frontend/src/lib/components/ui/select/select-group-heading.svelte
@@ -0,0 +1,21 @@
+<script lang="ts">
+	import { Select as SelectPrimitive } from 'bits-ui';
+	import { cn } from '$lib/utils/style.js';
+	import type { ComponentProps } from 'svelte';
+
+	let {
+		ref = $bindable(null),
+		class: className,
+		children,
+		...restProps
+	}: ComponentProps<typeof SelectPrimitive.GroupHeading> = $props();
+</script>
+
+<SelectPrimitive.GroupHeading
+	bind:ref
+	data-slot="select-group-heading"
+	class={cn('text-muted-foreground px-2 py-1.5 text-xs', className)}
+	{...restProps}
+>
+	{@render children?.()}
+</SelectPrimitive.GroupHeading>
--- a/frontend/src/lib/components/ui/select/select-group.svelte
+++ b/frontend/src/lib/components/ui/select/select-group.svelte
@@ -1,7 +1,17 @@
 <script lang="ts">
 	import { Select as SelectPrimitive } from 'bits-ui';
+	import { cn } from '$lib/utils/style.js';

-	let { ref = $bindable(null), ...restProps }: SelectPrimitive.GroupProps = $props();
+	let {
+		ref = $bindable(null),
+		class: className,
+		...restProps
+	}: SelectPrimitive.GroupProps = $props();
 </script>

-<SelectPrimitive.Group data-slot="select-group" {...restProps} />
+<SelectPrimitive.Group
+	bind:ref
+	data-slot="select-group"
+	class={cn('scroll-my-1 p-1', className)}
+	{...restProps}
+/>
--- a/frontend/src/lib/components/ui/select/select-item.svelte
+++ b/frontend/src/lib/components/ui/select/select-item.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
-	import CheckIcon from '@lucide/svelte/icons/check';
 	import { Select as SelectPrimitive } from 'bits-ui';
 	import { cn, type WithoutChild } from '$lib/utils/style.js';
+	import CheckIcon from '@lucide/svelte/icons/check';

 	let {
 		ref = $bindable(null),
@@ -18,15 +18,15 @@
 	{value}
 	data-slot="select-item"
 	class={cn(
-		"data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
+		"focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md py-1.5 pr-9 pl-2 text-sm [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2 focus:bg-accent data-highlighted:bg-accent data-highlighted:text-accent-foreground focus:text-accent-foreground relative flex w-full cursor-pointer items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
 		className
 	)}
 	{...restProps}
 >
 	{#snippet children({ selected, highlighted })}
-		<span class="absolute right-2 flex size-3.5 items-center justify-center">
+		<span class="absolute end-2 flex size-3.5 items-center justify-center">
 			{#if selected}
-				<CheckIcon class="size-4" />
+				<CheckIcon class="cn-select-item-indicator-icon" />
 			{/if}
 		</span>
 		{#if childrenProp}
--- a/frontend/src/lib/components/ui/select/select-label.svelte
+++ b/frontend/src/lib/components/ui/select/select-label.svelte
@@ -13,7 +13,7 @@
 <div
 	bind:this={ref}
 	data-slot="select-label"
-	class={cn('text-muted-foreground px-2 py-1.5 text-xs', className)}
+	class={cn('text-muted-foreground px-1.5 py-1 text-xs', className)}
 	{...restProps}
 >
 	{@render children?.()}
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Elias Schneider	37c568b66c	Merge remote-tracking branch 'origin/main'	2026-06-16 08:48:35 +02:00
github-actions[bot]	212c574a68	chore: update AAGUIDs (#1511 ) Co-authored-by: stonith404 <58886915+stonith404@users.noreply.github.com>	2026-06-08 09:22:50 +02:00
Elias Schneider	420fd02c8c	fix: PAR parameters not respected by authorize page	2026-06-05 11:39:14 +02:00
Elias Schneider	4f97cd4188	refactor: fix linter issues	2026-06-02 14:08:33 +02:00
Thibault NORMAND	68a5abdcca	feat(oauth): add support for Pushed Authorization Requests (RFC9126) (#1404 ) Co-authored-by: Elias Schneider <login@eliasschneider.com>	2026-06-02 14:02:12 +02:00
wollew	2eada149af	docs: fix link to watchtower repo (#1500 )	2026-06-01 11:42:00 +02:00
Elias Schneider	81e5aa2168	chore(translations): update translations via Crowdin (#1498 )	2026-06-01 11:17:12 +02:00
Melvin Snijders	e88ff03ea2	fix: issues with loading new font (#1496 )	2026-06-01 11:16:55 +02:00
Elias Schneider	fc42f6211d	docs: add "needs more upvotes" label as default	2026-05-31 21:08:08 +02:00
Elias Schneider	bf9f76bbd5	docs: add PR template	2026-05-31 21:04:33 +02:00
Elias Schneider	fea933b62d	docs: add AI Usage Policy to CONTRIBUTING.md	2026-05-31 20:55:05 +02:00
Elias Schneider	cdc77062f0	release: 2.8.0	2026-05-31 20:04:59 +02:00
Elias Schneider	7027296632	fix: restore cross-platform binary builds	2026-05-31 20:04:30 +02:00
Elias Schneider	e046a03364	chore: use fixed minor version of Go	2026-05-31 19:09:06 +02:00
Elias Schneider	0616abaf7f	refactor: run formatter	2026-05-31 16:11:21 +02:00
Elias Schneider	9ad2bfc7b3	tests(e2e): don't compare hashes of profile pictures	2026-05-29 13:43:21 +02:00
Elias Schneider	bc4f75c44f	refactor: fix linter issues	2026-05-29 12:25:06 +02:00
Elias Schneider	a71219637a	fix: add support for unix socket mode in healthcheck	2026-05-29 12:11:26 +02:00
Elias Schneider	b3d40a476b	feat: improve design trough the whole application	2026-05-29 11:37:34 +02:00
Elias Schneider	272d1479bd	fix: scope confirmation wasn't shown if account selection was prompted	2026-05-29 10:04:56 +02:00
Elias Schneider	f13424720b	tests(e2e): use custom Playwright route for callback URL checks	2026-05-29 09:44:37 +02:00
Elias Schneider	6aefe6c8e1	chore(translations): update translations via Crowdin (#1490 )	2026-05-29 09:18:59 +02:00
V	dd77bb0f32	feat: add support for systemd socket activation (#1479 )	2026-05-29 09:18:29 +02:00
Elias Schneider	0c95b7c3cc	feat: add support for `response_mode=fragment`	2026-05-29 09:14:44 +02:00
github-actions[bot]	f4a20e3ef9	chore: update AAGUIDs (#1487 ) Co-authored-by: stonith404 <58886915+stonith404@users.noreply.github.com>	2026-05-25 09:20:32 -05:00
@@ -1 +1 @@
 .7.0
 .8.0