Feat: improve sidebar tree usability

.gitignore

@@ -21,3 +21,11 @@ pnpm-debug.log*
 # OS / editor files
 .DS_Store
 .idea/
+
+# Go build output
+tmp/
+bin/
+
+.cgcignore
+
+POSIX/

Backend/.air.api.toml

@@ -0,0 +1,52 @@
+root = "."
+testdata_dir = "testdata"
+tmp_dir = "tmp/dev"
+
+[build]
+args_bin = []
+bin = "./tmp/dev/bin/api"
+cmd = "go build -o ./tmp/dev/bin/api ./cmd/api"
+delay = 1000
+exclude_dir = ["tmp", "vendor", "testdata"]
+exclude_file = []
+exclude_regex = ["_test.go"]
+exclude_unchanged = false
+follow_symlink = false
+full_bin = ""
+include_dir = []
+include_ext = ["go", "sql"]
+include_file = []
+kill_delay = "0s"
+log = "tmp/dev/logs/build-errors.api.log"
+poll = false
+poll_interval = 0
+post_cmd = []
+pre_cmd = []
+rerun = false
+rerun_delay = 500
+send_interrupt = false
+stop_on_error = true
+
+[color]
+app = ""
+build = "yellow"
+main = "magenta"
+runner = "green"
+watcher = "cyan"
+
+[log]
+main_only = false
+silent = false
+time = true
+
+[misc]
+clean_on_exit = false
+
+[proxy]
+app_port = 0
+enabled = false
+proxy_port = 0
+
+[screen]
+clear_on_rebuild = true
+keep_scroll = true

Backend/.air.web.toml

@@ -0,0 +1,52 @@
+root = "."
+testdata_dir = "testdata"
+tmp_dir = "tmp/dev"
+
+[build]
+args_bin = []
+bin = "./tmp/dev/bin/web"
+cmd = "go build -o ./tmp/dev/bin/web ./cmd/web"
+delay = 1000
+exclude_dir = ["tmp", "vendor", "testdata"]
+exclude_file = []
+exclude_regex = ["_test.go"]
+exclude_unchanged = false
+follow_symlink = false
+full_bin = ""
+include_dir = []
+include_ext = ["go", "sql"]
+include_file = []
+kill_delay = "0s"
+log = "tmp/dev/logs/build-errors.web.log"
+poll = false
+poll_interval = 0
+post_cmd = []
+pre_cmd = []
+rerun = false
+rerun_delay = 500
+send_interrupt = false
+stop_on_error = true
+
+[color]
+app = ""
+build = "yellow"
+main = "magenta"
+runner = "green"
+watcher = "cyan"
+
+[log]
+main_only = false
+silent = false
+time = true
+
+[misc]
+clean_on_exit = false
+
+[proxy]
+app_port = 0
+enabled = false
+proxy_port = 0
+
+[screen]
+clear_on_rebuild = true
+keep_scroll = true

Backend/.air.worker.toml

@@ -0,0 +1,52 @@
+root = "."
+testdata_dir = "testdata"
+tmp_dir = "tmp/dev"
+
+[build]
+args_bin = []
+bin = "./tmp/dev/bin/worker"
+cmd = "go build -o ./tmp/dev/bin/worker ./cmd/worker"
+delay = 1000
+exclude_dir = ["tmp", "vendor", "testdata"]
+exclude_file = []
+exclude_regex = ["_test.go"]
+exclude_unchanged = false
+follow_symlink = false
+full_bin = ""
+include_dir = []
+include_ext = ["go", "sql"]
+include_file = []
+kill_delay = "0s"
+log = "tmp/dev/logs/build-errors.worker.log"
+poll = false
+poll_interval = 0
+post_cmd = []
+pre_cmd = []
+rerun = false
+rerun_delay = 500
+send_interrupt = false
+stop_on_error = true
+
+[color]
+app = ""
+build = "yellow"
+main = "magenta"
+runner = "green"
+watcher = "cyan"
+
+[log]
+main_only = false
+silent = false
+time = true
+
+[misc]
+clean_on_exit = false
+
+[proxy]
+app_port = 0
+enabled = false
+proxy_port = 0
+
+[screen]
+clear_on_rebuild = true
+keep_scroll = true

Backend/.dockerignore

@@ -0,0 +1,4 @@
+.git
+.gitignore
+tmp
+testdata

Backend/Dockerfile

@@ -0,0 +1,36 @@
+# syntax=docker/dockerfile:1.7
+
+FROM golang:1.25.7-alpine AS base
+
+WORKDIR /app
+
+RUN apk add --no-cache ca-certificates curl git tzdata && update-ca-certificates
+
+COPY go.mod go.sum ./
+RUN go mod download
+
+FROM base AS development
+
+RUN curl -fsSL https://raw.githubusercontent.com/air-verse/air/master/install.sh | sh -s -- -b /usr/local/bin
+
+COPY . .
+
+CMD ["air", "-c", ".air.web.toml"]
+
+FROM base AS builder
+
+ARG SERVICE_NAME=web
+
+COPY . .
+
+RUN CGO_ENABLED=0 GOOS=linux GOARCH=amd64 go build -o /out/app ./cmd/${SERVICE_NAME}
+
+FROM alpine:3.22 AS runtime
+
+RUN apk add --no-cache ca-certificates tzdata && update-ca-certificates
+
+WORKDIR /app
+
+COPY --from=builder /out/app /usr/local/bin/app
+
+CMD ["/usr/local/bin/app"]

Backend/cmd/api/main.go

@@ -0,0 +1,35 @@
+package main
+
+import (
+	"log"
+
+	"moku-backend/internal/bootstrap"
+	"moku-backend/internal/httpx"
+	"moku-backend/internal/process"
+)
+
+func main() {
+	app, err := bootstrap.New("api")
+	if err != nil {
+		log.Fatalf("bootstrap api service: %v", err)
+	}
+	defer func() {
+		if closeErr := app.Close(); closeErr != nil {
+			app.Logger.Error("close api service", "error", closeErr)
+		}
+	}()
+
+	handler := httpx.NewRouter(httpx.RouterConfig{
+		ServiceName: app.ServiceName,
+		Config:      app.Config,
+		Logger:      app.Logger,
+		BuildInfo:   app.BuildInfo,
+		Database:    app.Database,
+		Cache:       app.Cache,
+	})
+
+	if err := process.RunHTTPServer(app.ServiceName, app.Config.Address(app.ServiceName), handler, app.Logger, app.Config.ShutdownTimeout); err != nil {
+		app.Logger.Error("api service stopped", "error", err)
+		log.Fatal(err)
+	}
+}

Backend/cmd/migrate/main.go

@@ -0,0 +1,49 @@
+package main
+
+import (
+	"fmt"
+	"log"
+	"os"
+
+	"moku-backend/internal/config"
+	"moku-backend/internal/database"
+)
+
+func main() {
+	cfg := config.Load()
+
+	db, err := database.NewPostgres(cfg.PostgresURL)
+	if err != nil {
+		log.Fatalf("connect database for migrations: %v", err)
+	}
+	defer db.Close()
+
+	command := "up"
+	if len(os.Args) > 1 {
+		command = os.Args[1]
+	}
+
+	switch command {
+	case "up":
+		if err := db.MigrateUp(); err != nil {
+			log.Fatalf("run migrations: %v", err)
+		}
+		fmt.Println("migrations applied")
+	case "down":
+		if err := db.MigrateDown(); err != nil {
+			log.Fatalf("roll back migration: %v", err)
+		}
+		fmt.Println("latest migration rolled back")
+	case "reset":
+		if err := db.MigrateReset(); err != nil {
+			log.Fatalf("reset migrations: %v", err)
+		}
+		fmt.Println("migrations reset")
+	case "status":
+		if err := db.MigrateStatus(); err != nil {
+			log.Fatalf("show migration status: %v", err)
+		}
+	default:
+		log.Fatalf("unsupported migrate command %q (supported: up, down, reset, status)", command)
+	}
+}

Backend/cmd/posix/main.go

@@ -0,0 +1,52 @@
+package main
+
+import (
+	"context"
+	"fmt"
+	"log"
+	"os"
+
+	"moku-backend/internal/config"
+	"moku-backend/internal/database"
+	"moku-backend/internal/posixproj"
+)
+
+func main() {
+	command := "rebuild"
+	if len(os.Args) > 1 {
+		command = os.Args[1]
+	}
+
+	switch command {
+	case "rebuild":
+		if err := rebuildProjection(context.Background()); err != nil {
+			log.Fatalf("rebuild POSIX projection: %v", err)
+		}
+	default:
+		log.Fatalf("unsupported posix command %q (supported: rebuild)", command)
+	}
+}
+
+func rebuildProjection(ctx context.Context) error {
+	cfg := config.Load()
+
+	db, err := database.NewPostgres(cfg.PostgresURL)
+	if err != nil {
+		return fmt.Errorf("connect database: %w", err)
+	}
+	defer db.Close()
+
+	summary, err := posixproj.NewProjector(db, cfg.POSIXRoot).RebuildWithSummary(ctx)
+	if err != nil {
+		return err
+	}
+
+	fmt.Printf(
+		"POSIX projection rebuilt from %s\n  total nodes: %d\n  directories: %d\n  files: %d\n",
+		cfg.POSIXRoot,
+		summary.TotalNodes,
+		summary.DirectoryCount,
+		summary.FileCount,
+	)
+	return nil
+}

Backend/cmd/web/main.go

@@ -0,0 +1,35 @@
+package main
+
+import (
+	"log"
+
+	"moku-backend/internal/bootstrap"
+	"moku-backend/internal/httpx"
+	"moku-backend/internal/process"
+)
+
+func main() {
+	app, err := bootstrap.New("web")
+	if err != nil {
+		log.Fatalf("bootstrap web service: %v", err)
+	}
+	defer func() {
+		if closeErr := app.Close(); closeErr != nil {
+			app.Logger.Error("close web service", "error", closeErr)
+		}
+	}()
+
+	handler := httpx.NewRouter(httpx.RouterConfig{
+		ServiceName: app.ServiceName,
+		Config:      app.Config,
+		Logger:      app.Logger,
+		BuildInfo:   app.BuildInfo,
+		Database:    app.Database,
+		Cache:       app.Cache,
+	})
+
+	if err := process.RunHTTPServer(app.ServiceName, app.Config.Address(app.ServiceName), handler, app.Logger, app.Config.ShutdownTimeout); err != nil {
+		app.Logger.Error("web service stopped", "error", err)
+		log.Fatal(err)
+	}
+}

Backend/cmd/worker/main.go

@@ -0,0 +1,49 @@
+package main
+
+import (
+	"context"
+	"encoding/json"
+	"log"
+	"os/signal"
+	"syscall"
+	"time"
+
+	"moku-backend/internal/bootstrap"
+	"moku-backend/internal/jobs"
+	"moku-backend/internal/worker"
+)
+
+func main() {
+	app, err := bootstrap.New("worker")
+	if err != nil {
+		log.Fatalf("bootstrap worker service: %v", err)
+	}
+	defer func() {
+		if closeErr := app.Close(); closeErr != nil {
+			app.Logger.Error("close worker service", "error", closeErr)
+		}
+	}()
+
+	jobStore := jobs.NewStore(app.Database)
+	runner := worker.NewRunner(jobStore, app.Logger, time.Second)
+	runner.Register(jobs.KindBootstrapStructureMaterialize, func(ctx context.Context, job jobs.Job) error {
+		var payload jobs.BootstrapStructureMaterializePayload
+		if len(job.Payload) > 0 {
+			if err := json.Unmarshal(job.Payload, &payload); err != nil {
+				return err
+			}
+		}
+
+		return bootstrap.NewService(app.Database, app.Config.POSIXRoot).ProcessBootstrapStructureMaterialization(ctx, payload.InstallationID)
+	})
+
+	ctx, stop := signal.NotifyContext(context.Background(), syscall.SIGINT, syscall.SIGTERM)
+	defer stop()
+
+	app.Logger.Info("worker ready", "service", app.ServiceName, "environment", app.Config.Environment, "pollInterval", time.Second)
+
+	if err := runner.Run(ctx); err != nil {
+		app.Logger.Error("worker stopped", "error", err)
+		log.Fatal(err)
+	}
+}

Backend/db/embed.go

@@ -0,0 +1,6 @@
+package db
+
+import "embed"
+
+//go:embed migrations/*.sql
+var Migrations embed.FS

Backend/db/migrations/000001_init.sql

@@ -0,0 +1,26 @@
+-- +goose Up
+CREATE EXTENSION IF NOT EXISTS "pgcrypto";
+
+CREATE TABLE IF NOT EXISTS organizations (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  name TEXT NOT NULL,
+  slug TEXT NOT NULL UNIQUE,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
+);
+
+CREATE TABLE IF NOT EXISTS workspaces (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  organization_id UUID NOT NULL REFERENCES organizations(id) ON DELETE CASCADE,
+  name TEXT NOT NULL,
+  slug TEXT NOT NULL,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  UNIQUE (organization_id, slug)
+);
+
+CREATE INDEX IF NOT EXISTS idx_workspaces_organization_id ON workspaces (organization_id);
+
+-- +goose Down
+DROP TABLE IF EXISTS workspaces;
+DROP TABLE IF EXISTS organizations;

Backend/db/migrations/000002_bootstrap_foundation.sql

@@ -0,0 +1,180 @@
+-- +goose Up
+
+CREATE TYPE instance_mode AS ENUM ('personal', 'organizational');
+CREATE TYPE instance_access AS ENUM ('local', 'remote');
+CREATE TYPE instance_protocol AS ENUM ('http', 'https');
+CREATE TYPE workspace_kind AS ENUM ('organization', 'department', 'team', 'project');
+CREATE TYPE membership_role AS ENUM ('owner', 'admin', 'member');
+
+CREATE TABLE IF NOT EXISTS installations (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  singleton BOOLEAN NOT NULL DEFAULT TRUE UNIQUE,
+  mode instance_mode NOT NULL,
+  access instance_access NOT NULL,
+  protocol instance_protocol NOT NULL DEFAULT 'http',
+  host TEXT NOT NULL,
+  is_bootstrapped BOOLEAN NOT NULL DEFAULT FALSE,
+  bootstrapped_at TIMESTAMPTZ,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
+);
+
+CREATE TABLE IF NOT EXISTS users (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  email TEXT NOT NULL,
+  display_name TEXT NOT NULL,
+  password_hash TEXT NOT NULL,
+  is_instance_admin BOOLEAN NOT NULL DEFAULT FALSE,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
+);
+
+CREATE UNIQUE INDEX IF NOT EXISTS idx_users_email_unique ON users (LOWER(email));
+
+CREATE TABLE IF NOT EXISTS user_homes (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  user_id UUID NOT NULL UNIQUE REFERENCES users(id) ON DELETE CASCADE,
+  title TEXT NOT NULL,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
+);
+
+ALTER TABLE organizations
+  ADD COLUMN IF NOT EXISTS created_by_user_id UUID REFERENCES users(id) ON DELETE SET NULL;
+
+CREATE TABLE IF NOT EXISTS organization_memberships (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  organization_id UUID NOT NULL REFERENCES organizations(id) ON DELETE CASCADE,
+  user_id UUID NOT NULL REFERENCES users(id) ON DELETE CASCADE,
+  role membership_role NOT NULL DEFAULT 'member',
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  UNIQUE (organization_id, user_id)
+);
+
+CREATE INDEX IF NOT EXISTS idx_organization_memberships_user_id ON organization_memberships (user_id);
+
+CREATE TABLE IF NOT EXISTS departments (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  organization_id UUID NOT NULL REFERENCES organizations(id) ON DELETE CASCADE,
+  name TEXT NOT NULL,
+  slug TEXT NOT NULL,
+  created_by_user_id UUID REFERENCES users(id) ON DELETE SET NULL,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  UNIQUE (organization_id, slug)
+);
+
+CREATE INDEX IF NOT EXISTS idx_departments_organization_id ON departments (organization_id);
+
+CREATE TABLE IF NOT EXISTS teams (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  organization_id UUID NOT NULL REFERENCES organizations(id) ON DELETE CASCADE,
+  department_id UUID REFERENCES departments(id) ON DELETE SET NULL,
+  name TEXT NOT NULL,
+  slug TEXT NOT NULL,
+  created_by_user_id UUID REFERENCES users(id) ON DELETE SET NULL,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  UNIQUE (organization_id, slug)
+);
+
+CREATE INDEX IF NOT EXISTS idx_teams_organization_id ON teams (organization_id);
+CREATE INDEX IF NOT EXISTS idx_teams_department_id ON teams (department_id);
+
+CREATE TABLE IF NOT EXISTS team_memberships (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  team_id UUID NOT NULL REFERENCES teams(id) ON DELETE CASCADE,
+  user_id UUID NOT NULL REFERENCES users(id) ON DELETE CASCADE,
+  role membership_role NOT NULL DEFAULT 'member',
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  UNIQUE (team_id, user_id)
+);
+
+CREATE INDEX IF NOT EXISTS idx_team_memberships_user_id ON team_memberships (user_id);
+
+CREATE TABLE IF NOT EXISTS projects (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  organization_id UUID NOT NULL REFERENCES organizations(id) ON DELETE CASCADE,
+  department_id UUID REFERENCES departments(id) ON DELETE SET NULL,
+  team_id UUID REFERENCES teams(id) ON DELETE SET NULL,
+  name TEXT NOT NULL,
+  slug TEXT NOT NULL,
+  created_by_user_id UUID REFERENCES users(id) ON DELETE SET NULL,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  UNIQUE (organization_id, slug)
+);
+
+CREATE INDEX IF NOT EXISTS idx_projects_organization_id ON projects (organization_id);
+CREATE INDEX IF NOT EXISTS idx_projects_department_id ON projects (department_id);
+CREATE INDEX IF NOT EXISTS idx_projects_team_id ON projects (team_id);
+
+CREATE TABLE IF NOT EXISTS project_memberships (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  project_id UUID NOT NULL REFERENCES projects(id) ON DELETE CASCADE,
+  user_id UUID NOT NULL REFERENCES users(id) ON DELETE CASCADE,
+  role membership_role NOT NULL DEFAULT 'member',
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  UNIQUE (project_id, user_id)
+);
+
+CREATE INDEX IF NOT EXISTS idx_project_memberships_user_id ON project_memberships (user_id);
+
+ALTER TABLE workspaces
+  ADD COLUMN IF NOT EXISTS kind workspace_kind NOT NULL DEFAULT 'organization',
+  ADD COLUMN IF NOT EXISTS created_by_user_id UUID REFERENCES users(id) ON DELETE SET NULL,
+  ADD COLUMN IF NOT EXISTS department_id UUID REFERENCES departments(id) ON DELETE SET NULL,
+  ADD COLUMN IF NOT EXISTS team_id UUID REFERENCES teams(id) ON DELETE SET NULL,
+  ADD COLUMN IF NOT EXISTS project_id UUID REFERENCES projects(id) ON DELETE SET NULL;
+
+CREATE INDEX IF NOT EXISTS idx_workspaces_department_id ON workspaces (department_id);
+CREATE INDEX IF NOT EXISTS idx_workspaces_team_id ON workspaces (team_id);
+CREATE INDEX IF NOT EXISTS idx_workspaces_project_id ON workspaces (project_id);
+
+-- +goose Down
+
+DROP INDEX IF EXISTS idx_workspaces_project_id;
+DROP INDEX IF EXISTS idx_workspaces_team_id;
+DROP INDEX IF EXISTS idx_workspaces_department_id;
+
+ALTER TABLE workspaces
+  DROP COLUMN IF EXISTS project_id,
+  DROP COLUMN IF EXISTS team_id,
+  DROP COLUMN IF EXISTS department_id,
+  DROP COLUMN IF EXISTS created_by_user_id,
+  DROP COLUMN IF EXISTS kind;
+
+DROP INDEX IF EXISTS idx_project_memberships_user_id;
+DROP TABLE IF EXISTS project_memberships;
+
+DROP INDEX IF EXISTS idx_projects_team_id;
+DROP INDEX IF EXISTS idx_projects_department_id;
+DROP INDEX IF EXISTS idx_projects_organization_id;
+DROP TABLE IF EXISTS projects;
+
+DROP INDEX IF EXISTS idx_team_memberships_user_id;
+DROP TABLE IF EXISTS team_memberships;
+
+DROP INDEX IF EXISTS idx_teams_department_id;
+DROP INDEX IF EXISTS idx_teams_organization_id;
+DROP TABLE IF EXISTS teams;
+
+DROP INDEX IF EXISTS idx_departments_organization_id;
+DROP TABLE IF EXISTS departments;
+
+DROP INDEX IF EXISTS idx_organization_memberships_user_id;
+DROP TABLE IF EXISTS organization_memberships;
+
+ALTER TABLE organizations
+  DROP COLUMN IF EXISTS created_by_user_id;
+
+DROP TABLE IF EXISTS user_homes;
+DROP INDEX IF EXISTS idx_users_email_unique;
+DROP TABLE IF EXISTS users;
+DROP TABLE IF EXISTS installations;
+
+DROP TYPE IF EXISTS membership_role;
+DROP TYPE IF EXISTS workspace_kind;
+DROP TYPE IF EXISTS instance_protocol;
+DROP TYPE IF EXISTS instance_access;
+DROP TYPE IF EXISTS instance_mode;

Backend/db/migrations/000003_installation_name.sql

@@ -0,0 +1,9 @@
+-- +goose Up
+
+ALTER TABLE installations
+  ADD COLUMN IF NOT EXISTS name TEXT NOT NULL DEFAULT '';
+
+-- +goose Down
+
+ALTER TABLE installations
+  DROP COLUMN IF EXISTS name;

Backend/db/migrations/000004_posix_nodes.sql

@@ -0,0 +1,45 @@
+-- +goose Up
+
+CREATE TYPE posix_node_kind AS ENUM ('directory', 'file');
+
+CREATE TABLE IF NOT EXISTS posix_nodes (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  path TEXT NOT NULL UNIQUE,
+  parent_path TEXT,
+  name TEXT NOT NULL,
+  depth INTEGER NOT NULL,
+  node_kind posix_node_kind NOT NULL,
+  logical_type TEXT NOT NULL DEFAULT 'generic',
+  file_role TEXT,
+  resource_id TEXT,
+  resource_name TEXT,
+  resource_slug TEXT,
+  installation_id TEXT,
+  organization_id TEXT,
+  organization_slug TEXT,
+  department_slug TEXT,
+  team_slug TEXT,
+  project_slug TEXT,
+  personal_slug TEXT,
+  content_json JSONB,
+  size_bytes BIGINT NOT NULL DEFAULT 0,
+  checksum TEXT,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
+);
+
+CREATE INDEX IF NOT EXISTS idx_posix_nodes_parent_path ON posix_nodes (parent_path);
+CREATE INDEX IF NOT EXISTS idx_posix_nodes_logical_type ON posix_nodes (logical_type);
+CREATE INDEX IF NOT EXISTS idx_posix_nodes_project_slug ON posix_nodes (project_slug);
+CREATE INDEX IF NOT EXISTS idx_posix_nodes_department_slug ON posix_nodes (department_slug);
+CREATE INDEX IF NOT EXISTS idx_posix_nodes_team_slug ON posix_nodes (team_slug);
+
+-- +goose Down
+
+DROP INDEX IF EXISTS idx_posix_nodes_team_slug;
+DROP INDEX IF EXISTS idx_posix_nodes_department_slug;
+DROP INDEX IF EXISTS idx_posix_nodes_project_slug;
+DROP INDEX IF EXISTS idx_posix_nodes_logical_type;
+DROP INDEX IF EXISTS idx_posix_nodes_parent_path;
+DROP TABLE IF EXISTS posix_nodes;
+DROP TYPE IF EXISTS posix_node_kind;

Backend/db/migrations/000005_background_jobs.sql

@@ -0,0 +1,64 @@
+-- +goose Up
+
+CREATE TYPE bootstrap_materialization_status AS ENUM ('not_started', 'pending', 'running', 'succeeded', 'failed');
+CREATE TYPE background_job_status AS ENUM ('pending', 'running', 'succeeded', 'failed');
+
+ALTER TABLE installations
+  ADD COLUMN IF NOT EXISTS materialization_status bootstrap_materialization_status NOT NULL DEFAULT 'not_started',
+  ADD COLUMN IF NOT EXISTS materialization_error TEXT,
+  ADD COLUMN IF NOT EXISTS materialization_requested_at TIMESTAMPTZ,
+  ADD COLUMN IF NOT EXISTS materialization_started_at TIMESTAMPTZ,
+  ADD COLUMN IF NOT EXISTS materialization_finished_at TIMESTAMPTZ;
+
+UPDATE installations
+SET
+  materialization_status = CASE
+    WHEN is_bootstrapped THEN 'succeeded'::bootstrap_materialization_status
+    ELSE 'not_started'::bootstrap_materialization_status
+  END,
+  materialization_error = NULL,
+  materialization_requested_at = CASE
+    WHEN is_bootstrapped THEN COALESCE(bootstrapped_at, created_at, NOW())
+    ELSE NULL
+  END,
+  materialization_started_at = CASE
+    WHEN is_bootstrapped THEN COALESCE(bootstrapped_at, created_at, NOW())
+    ELSE NULL
+  END,
+  materialization_finished_at = CASE
+    WHEN is_bootstrapped THEN COALESCE(bootstrapped_at, created_at, NOW())
+    ELSE NULL
+  END
+WHERE materialization_status = 'not_started'::bootstrap_materialization_status;
+
+CREATE TABLE IF NOT EXISTS background_jobs (
+  id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+  kind TEXT NOT NULL,
+  status background_job_status NOT NULL DEFAULT 'pending',
+  payload JSONB NOT NULL DEFAULT '{}'::jsonb,
+  attempts INTEGER NOT NULL DEFAULT 0,
+  max_attempts INTEGER NOT NULL DEFAULT 1,
+  available_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  started_at TIMESTAMPTZ,
+  finished_at TIMESTAMPTZ,
+  last_error TEXT,
+  created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+  updated_at TIMESTAMPTZ NOT NULL DEFAULT NOW()
+);
+
+CREATE INDEX IF NOT EXISTS idx_background_jobs_claim ON background_jobs (status, available_at, created_at);
+
+-- +goose Down
+
+DROP INDEX IF EXISTS idx_background_jobs_claim;
+DROP TABLE IF EXISTS background_jobs;
+
+ALTER TABLE installations
+  DROP COLUMN IF EXISTS materialization_finished_at,
+  DROP COLUMN IF EXISTS materialization_started_at,
+  DROP COLUMN IF EXISTS materialization_requested_at,
+  DROP COLUMN IF EXISTS materialization_error,
+  DROP COLUMN IF EXISTS materialization_status;
+
+DROP TYPE IF EXISTS background_job_status;
+DROP TYPE IF EXISTS bootstrap_materialization_status;

Backend/db/queries/organizations.sql

@@ -0,0 +1,15 @@
+-- name: ListOrganizations :many
+SELECT id, name, slug, created_at, updated_at
+FROM organizations
+ORDER BY created_at DESC;
+
+-- name: CreateOrganization :one
+INSERT INTO organizations (name, slug)
+VALUES ($1, $2)
+RETURNING id, name, slug, created_at, updated_at;
+
+-- name: ListWorkspacesByOrganization :many
+SELECT id, organization_id, name, slug, created_at, updated_at
+FROM workspaces
+WHERE organization_id = $1
+ORDER BY created_at DESC;

Backend/docker-bake.hcl

@@ -0,0 +1,72 @@
+variable "REGISTRY" {
+  default = "registry.example.com"
+}
+
+variable "TAG" {
+  default = "latest"
+}
+
+target "_app" {
+  context    = "."
+  dockerfile = "Dockerfile"
+}
+
+target "dev" {
+  inherits = ["_app"]
+  target   = "development"
+  tags     = ["moku/work-backend:dev"]
+}
+
+target "dev-image" {
+  inherits = ["_app"]
+  target   = "development"
+  tags     = ["${REGISTRY}/moku/work-backend:dev-${TAG}"]
+}
+
+target "prod-api" {
+  inherits = ["_app"]
+  target   = "runtime"
+  args = {
+    SERVICE_NAME = "api"
+  }
+  tags = ["moku/work-backend:local-prod-api"]
+}
+
+target "prod-worker" {
+  inherits = ["_app"]
+  target   = "runtime"
+  args = {
+    SERVICE_NAME = "worker"
+  }
+  tags = ["moku/work-backend:local-prod-worker"]
+}
+
+target "prod-api-image" {
+  inherits = ["_app"]
+  target   = "runtime"
+  args = {
+    SERVICE_NAME = "api"
+  }
+  tags = ["${REGISTRY}/moku/work-backend:prod-api-${TAG}"]
+}
+
+target "prod-worker-image" {
+  inherits = ["_app"]
+  target   = "runtime"
+  args = {
+    SERVICE_NAME = "worker"
+  }
+  tags = ["${REGISTRY}/moku/work-backend:prod-worker-${TAG}"]
+}
+
+group "local" {
+  targets = ["dev", "prod-api", "prod-worker"]
+}
+
+group "registry" {
+  targets = ["dev-image", "prod-api-image", "prod-worker-image"]
+}
+
+group "default" {
+  targets = ["dev", "prod-api", "prod-worker"]
+}

Backend/go.mod

@@ -0,0 +1,24 @@
+module moku-backend
+
+go 1.25.7
+
+require (
+	github.com/go-chi/chi/v5 v5.3.0
+	github.com/google/uuid v1.6.0
+	github.com/jackc/pgx/v5 v5.10.0
+	github.com/pressly/goose/v3 v3.27.1
+	github.com/redis/go-redis/v9 v9.20.1
+)
+
+require (
+	github.com/cespare/xxhash/v2 v2.3.0 // indirect
+	github.com/jackc/pgpassfile v1.0.0 // indirect
+	github.com/jackc/pgservicefile v0.0.0-20240606120523-5a60cdf6a761 // indirect
+	github.com/jackc/puddle/v2 v2.2.2 // indirect
+	github.com/mfridman/interpolate v0.0.2 // indirect
+	github.com/sethvargo/go-retry v0.3.0 // indirect
+	go.uber.org/atomic v1.11.0 // indirect
+	go.uber.org/multierr v1.11.0 // indirect
+	golang.org/x/sync v0.20.0 // indirect
+	golang.org/x/text v0.36.0 // indirect
+)

Backend/go.sum

@@ -0,0 +1,70 @@
+github.com/bsm/ginkgo/v2 v2.12.0 h1:Ny8MWAHyOepLGlLKYmXG4IEkioBysk6GpaRTLC8zwWs=
+github.com/bsm/ginkgo/v2 v2.12.0/go.mod h1:SwYbGRRDovPVboqFv0tPTcG1sN61LM1Z4ARdbAV9g4c=
+github.com/bsm/gomega v1.27.10 h1:yeMWxP2pV2fG3FgAODIY8EiRE3dy0aeFYt4l7wh6yKA=
+github.com/bsm/gomega v1.27.10/go.mod h1:JyEr/xRbxbtgWNi8tIEVPUYZ5Dzef52k01W3YH0H+O0=
+github.com/cespare/xxhash/v2 v2.3.0 h1:UL815xU9SqsFlibzuggzjXhog7bL6oX9BbNZnL2UFvs=
+github.com/cespare/xxhash/v2 v2.3.0/go.mod h1:VGX0DQ3Q6kWi7AoAeZDth3/j3BFtOZR5XLFGgcrjCOs=
+github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=
+github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+github.com/dustin/go-humanize v1.0.1 h1:GzkhY7T5VNhEkwH0PVJgjz+fX1rhBrR7pRT3mDkpeCY=
+github.com/dustin/go-humanize v1.0.1/go.mod h1:Mu1zIs6XwVuF/gI1OepvI0qD18qycQx+mFykh5fBlto=
+github.com/go-chi/chi/v5 v5.3.0 h1:halUjDxhshgXHMrao5bB8eNBXo/rnzwr8m5m36glehM=
+github.com/go-chi/chi/v5 v5.3.0/go.mod h1:R+tYY2hNuVUUjxoPtqUdgBqevM9s9njzkTLutVsOCto=
+github.com/google/uuid v1.6.0 h1:NIvaJDMOsjHA8n1jAhLSgzrAzy1Hgr+hNrb57e+94F0=
+github.com/google/uuid v1.6.0/go.mod h1:TIyPZe4MgqvfeYDBFedMoGGpEw/LqOeaOT+nhxU+yHo=
+github.com/jackc/pgpassfile v1.0.0 h1:/6Hmqy13Ss2zCq62VdNG8tM1wchn8zjSGOBJ6icpsIM=
+github.com/jackc/pgpassfile v1.0.0/go.mod h1:CEx0iS5ambNFdcRtxPj5JhEz+xB6uRky5eyVu/W2HEg=
+github.com/jackc/pgservicefile v0.0.0-20240606120523-5a60cdf6a761 h1:iCEnooe7UlwOQYpKFhBabPMi4aNAfoODPEFNiAnClxo=
+github.com/jackc/pgservicefile v0.0.0-20240606120523-5a60cdf6a761/go.mod h1:5TJZWKEWniPve33vlWYSoGYefn3gLQRzjfDlhSJ9ZKM=
+github.com/jackc/pgx/v5 v5.10.0 h1:VhSvgU2jSli8o3AqIEOTJr7rZwAEUVo4E4XhR94Zfr0=
+github.com/jackc/pgx/v5 v5.10.0/go.mod h1:mal1tBGAFfLHvZzaYh77YS/eC6IX9OWbRV1QIIM0Jn4=
+github.com/jackc/puddle/v2 v2.2.2 h1:PR8nw+E/1w0GLuRFSmiioY6UooMp6KJv0/61nB7icHo=
+github.com/jackc/puddle/v2 v2.2.2/go.mod h1:vriiEXHvEE654aYKXXjOvZM39qJ0q+azkZFrfEOc3H4=
+github.com/klauspost/cpuid/v2 v2.2.10 h1:tBs3QSyvjDyFTq3uoc/9xFpCuOsJQFNPiAhYdw2skhE=
+github.com/klauspost/cpuid/v2 v2.2.10/go.mod h1:hqwkgyIinND0mEev00jJYCxPNVRVXFQeu1XKlok6oO0=
+github.com/mattn/go-isatty v0.0.21 h1:xYae+lCNBP7QuW4PUnNG61ffM4hVIfm+zUzDuSzYLGs=
+github.com/mattn/go-isatty v0.0.21/go.mod h1:ZXfXG4SQHsB/w3ZeOYbR0PrPwLy+n6xiMrJlRFqopa4=
+github.com/mfridman/interpolate v0.0.2 h1:pnuTK7MQIxxFz1Gr+rjSIx9u7qVjf5VOoM/u6BbAxPY=
+github.com/mfridman/interpolate v0.0.2/go.mod h1:p+7uk6oE07mpE/Ik1b8EckO0O4ZXiGAfshKBWLUM9Xg=
+github.com/ncruces/go-strftime v1.0.0 h1:HMFp8mLCTPp341M/ZnA4qaf7ZlsbTc+miZjCLOFAw7w=
+github.com/ncruces/go-strftime v1.0.0/go.mod h1:Fwc5htZGVVkseilnfgOVb9mKy6w1naJmn9CehxcKcls=
+github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM=
+github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
+github.com/pressly/goose/v3 v3.27.1 h1:6uEvcprBybDmW4hcz3gYujhARhye+GoWKhEWyzD5sh4=
+github.com/pressly/goose/v3 v3.27.1/go.mod h1:maruOxsPnIG2yHHyo8UqKWXYKFcH7Q76csUV7+7KYoM=
+github.com/redis/go-redis/v9 v9.20.1 h1:sfCU6A8P3dXbKyWes02uxA2baehGux9dZHfEKtsTB1w=
+github.com/redis/go-redis/v9 v9.20.1/go.mod h1:v/M13XI1PVCDcm01VtPFOADfZtHf8YW3baQf57KlIkA=
+github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec h1:W09IVJc94icq4NjY3clb7Lk8O1qJ8BdBEF8z0ibU0rE=
+github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec/go.mod h1:qqbHyh8v60DhA7CoWK5oRCqLrMHRGoxYCSS9EjAz6Eo=
+github.com/sethvargo/go-retry v0.3.0 h1:EEt31A35QhrcRZtrYFDTBg91cqZVnFL2navjDrah2SE=
+github.com/sethvargo/go-retry v0.3.0/go.mod h1:mNX17F0C/HguQMyMyJxcnU471gOZGxCLyYaFyAZraas=
+github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
+github.com/stretchr/testify v1.3.0/go.mod h1:M5WIy9Dh21IEIfnGCwXGc5bZfKNJtfHm1UVUgZn+9EI=
+github.com/stretchr/testify v1.7.0/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
+github.com/stretchr/testify v1.11.1 h1:7s2iGBzp5EwR7/aIZr8ao5+dra3wiQyKjjFuvgVKu7U=
+github.com/stretchr/testify v1.11.1/go.mod h1:wZwfW3scLgRK+23gO65QZefKpKQRnfz6sD981Nm4B6U=
+github.com/zeebo/xxh3 v1.1.0 h1:s7DLGDK45Dyfg7++yxI0khrfwq9661w9EN78eP/UZVs=
+github.com/zeebo/xxh3 v1.1.0/go.mod h1:IisAie1LELR4xhVinxWS5+zf1lA4p0MW4T+w+W07F5s=
+go.uber.org/atomic v1.11.0 h1:ZvwS0R+56ePWxUNi+Atn9dWONBPp/AUETXlHW0DxSjE=
+go.uber.org/atomic v1.11.0/go.mod h1:LUxbIzbOniOlMKjJjyPfpl4v+PKK2cNJn91OQbhoJI0=
+go.uber.org/multierr v1.11.0 h1:blXXJkSxSSfBVBlC76pxqeO+LN3aDfLQo+309xJstO0=
+go.uber.org/multierr v1.11.0/go.mod h1:20+QtiLqy0Nd6FdQB9TLXag12DsQkrbs3htMFfDN80Y=
+golang.org/x/sync v0.20.0 h1:e0PTpb7pjO8GAtTs2dQ6jYa5BWYlMuX047Dco/pItO4=
+golang.org/x/sync v0.20.0/go.mod h1:9xrNwdLfx4jkKbNva9FpL6vEN7evnE43NNNJQ2LF3+0=
+golang.org/x/sys v0.43.0 h1:Rlag2XtaFTxp19wS8MXlJwTvoh8ArU6ezoyFsMyCTNI=
+golang.org/x/sys v0.43.0/go.mod h1:4GL1E5IUh+htKOUEOaiffhrAeqysfVGipDYzABqnCmw=
+golang.org/x/text v0.36.0 h1:JfKh3XmcRPqZPKevfXVpI1wXPTqbkE5f7JA92a55Yxg=
+golang.org/x/text v0.36.0/go.mod h1:NIdBknypM8iqVmPiuco0Dh6P5Jcdk8lJL0CUebqK164=
+gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
+gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
+gopkg.in/yaml.v3 v3.0.1 h1:fxVm/GzAzEWqLHuvctI91KS9hhNmmWOoWu0XTYJS7CA=
+gopkg.in/yaml.v3 v3.0.1/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
+modernc.org/libc v1.72.1 h1:db1xwJ6u1kE3KHTFTTbe2GCrczHPKzlURP0aDC4NGD0=
+modernc.org/libc v1.72.1/go.mod h1:HRMiC/PhPGLIPM7GzAFCbI+oSgE3dhZ8FWftmRrHVlY=
+modernc.org/mathutil v1.7.1 h1:GCZVGXdaN8gTqB1Mf/usp1Y/hSqgI2vAGGP4jZMCxOU=
+modernc.org/mathutil v1.7.1/go.mod h1:4p5IwJITfppl0G4sUEDtCr4DthTaT47/N3aT6MhfgJg=
+modernc.org/memory v1.11.0 h1:o4QC8aMQzmcwCK3t3Ux/ZHmwFPzE6hf2Y5LbkRs+hbI=
+modernc.org/memory v1.11.0/go.mod h1:/JP4VbVC+K5sU2wZi9bHoq2MAkCnrt2r98UGeSK7Mjw=
+modernc.org/sqlite v1.49.1 h1:dYGHTKcX1sJ+EQDnUzvz4TJ5GbuvhNJa8Fg6ElGx73U=
+modernc.org/sqlite v1.49.1/go.mod h1:m0w8xhwYUVY3H6pSDwc3gkJ/irZT/0YEXwBlhaxQEew=

Backend/internal/bootstrap/bootstrap.go

@@ -0,0 +1,85 @@
+// Path: Backend/internal/bootstrap/bootstrap.go
+
+package bootstrap
+
+import (
+	"log/slog"
+	"os"
+	"strings"
+
+	"moku-backend/internal/buildinfo"
+	"moku-backend/internal/cache"
+	"moku-backend/internal/config"
+	"moku-backend/internal/database"
+)
+
+type App struct {
+	ServiceName string
+	Config      *config.Config
+	Logger      *slog.Logger
+	BuildInfo   buildinfo.Info
+	Database    *database.DB
+	Cache       *cache.Client
+}
+
+func New(serviceName string) (*App, error) {
+	cfg := config.Load()
+	logger := newLogger(cfg)
+
+	db, err := database.NewPostgres(cfg.PostgresURL)
+	if err != nil {
+		return nil, err
+	}
+
+	valkey, err := cache.NewValkey(cfg.ValkeyURL)
+	if err != nil {
+		db.Close()
+		return nil, err
+	}
+
+	return &App{
+		ServiceName: serviceName,
+		Config:      cfg,
+		Logger:      logger.With("service", serviceName),
+		BuildInfo:   buildinfo.Current(),
+		Database:    db,
+		Cache:       valkey,
+	}, nil
+}
+
+func (a *App) Close() error {
+	var closeErr error
+
+	if a.Cache != nil {
+		if err := a.Cache.Close(); err != nil {
+			closeErr = err
+		}
+	}
+
+	if a.Database != nil {
+		a.Database.Close()
+	}
+
+	return closeErr
+}
+
+func newLogger(cfg *config.Config) *slog.Logger {
+	level := slog.LevelInfo
+
+	switch strings.ToLower(cfg.LogLevel) {
+	case "debug":
+		level = slog.LevelDebug
+	case "warn":
+		level = slog.LevelWarn
+	case "error":
+		level = slog.LevelError
+	}
+
+	options := &slog.HandlerOptions{Level: level}
+
+	if cfg.IsDevelopment() {
+		return slog.New(slog.NewTextHandler(os.Stdout, options))
+	}
+
+	return slog.New(slog.NewJSONHandler(os.Stdout, options))
+}

Backend/internal/bootstrap/bootstrap_installation.go

@@ -0,0 +1,159 @@
+package bootstrap
+
+import (
+	"context"
+	"errors"
+	"strings"
+
+	"github.com/jackc/pgx/v5"
+)
+
+const (
+	materializationNotStarted = "not_started"
+	materializationPending    = "pending"
+	materializationRunning    = "running"
+	materializationSucceeded  = "succeeded"
+	materializationFailed     = "failed"
+)
+
+type bootstrapStructurePrerequisites struct {
+	installation InstallationRecord
+	admin        AdminSummary
+}
+
+func (service *Service) GetInstallation(ctx context.Context) (*InstallationRecord, error) {
+	record, err := scanInstallationRecord(service.db.Pool.QueryRow(ctx, `
+		SELECT
+			id::text,
+			name,
+			mode::text,
+			access::text,
+			protocol::text,
+			host,
+			is_bootstrapped,
+			materialization_status::text,
+			materialization_error
+		FROM installations
+		WHERE singleton = TRUE
+		LIMIT 1;
+	`))
+	if err != nil {
+		if errors.Is(err, pgx.ErrNoRows) {
+			return nil, nil
+		}
+
+		return nil, err
+	}
+
+	return &record, nil
+}
+
+func loadInstallation(ctx context.Context, tx pgx.Tx) (InstallationRecord, error) {
+	return scanInstallationRecord(tx.QueryRow(ctx, `
+		SELECT
+			id::text,
+			name,
+			mode::text,
+			access::text,
+			protocol::text,
+			host,
+			is_bootstrapped,
+			materialization_status::text,
+			materialization_error
+		FROM installations
+		WHERE singleton = TRUE
+		LIMIT 1;
+	`))
+}
+
+func updateBootstrappedInstallation(ctx context.Context, tx pgx.Tx) (InstallationRecord, error) {
+	return scanInstallationRecord(tx.QueryRow(ctx, `
+		UPDATE installations
+		SET
+			is_bootstrapped = TRUE,
+			bootstrapped_at = COALESCE(bootstrapped_at, NOW()),
+			materialization_status = 'pending'::bootstrap_materialization_status,
+			materialization_error = NULL,
+			materialization_requested_at = NOW(),
+			materialization_started_at = NULL,
+			materialization_finished_at = NULL,
+			updated_at = NOW()
+		WHERE singleton = TRUE
+		RETURNING
+			id::text,
+			name,
+			mode::text,
+			access::text,
+			protocol::text,
+			host,
+			is_bootstrapped,
+			materialization_status::text,
+			materialization_error;
+	`))
+}
+
+func scanInstallationRecord(row pgx.Row) (InstallationRecord, error) {
+	var record InstallationRecord
+	if err := row.Scan(
+		&record.ID,
+		&record.Name,
+		&record.Mode,
+		&record.Access,
+		&record.Protocol,
+		&record.Host,
+		&record.IsBootstrapped,
+		&record.MaterializationStatus,
+		&record.MaterializationError,
+	); err != nil {
+		return InstallationRecord{}, err
+	}
+
+	if strings.TrimSpace(record.MaterializationStatus) == "" {
+		record.MaterializationStatus = materializationNotStarted
+	}
+
+	return record, nil
+}
+
+func loadPrimaryAdmin(ctx context.Context, tx pgx.Tx) (AdminSummary, error) {
+	var admin AdminSummary
+	if err := tx.QueryRow(ctx, `
+		SELECT id::text, email, display_name
+		FROM users
+		WHERE is_instance_admin = TRUE
+		ORDER BY created_at ASC
+		LIMIT 1;
+	`).Scan(&admin.ID, &admin.Email, &admin.DisplayName); err != nil {
+		return AdminSummary{}, err
+	}
+
+	return admin, nil
+}
+
+func (service *Service) loadBootstrapStructurePrerequisites(
+	ctx context.Context,
+	tx pgx.Tx,
+) (bootstrapStructurePrerequisites, error) {
+	installation, err := loadInstallation(ctx, tx)
+	if err != nil {
+		if errors.Is(err, pgx.ErrNoRows) {
+			return bootstrapStructurePrerequisites{}, ErrInstallationNotConfigured
+		}
+
+		return bootstrapStructurePrerequisites{}, err
+	}
+
+	admin, err := loadPrimaryAdmin(ctx, tx)
+	if err != nil {
+		if errors.Is(err, pgx.ErrNoRows) {
+			return bootstrapStructurePrerequisites{}, ErrAdminNotConfigured
+		}
+
+		return bootstrapStructurePrerequisites{}, err
+	}
+
+	return bootstrapStructurePrerequisites{
+		installation: installation,
+		admin:        admin,
+	}, nil
+}

Backend/internal/bootstrap/bootstrap_materialization.go

@@ -0,0 +1,180 @@
+package bootstrap
+
+import (
+	"context"
+	"errors"
+	"fmt"
+	"strings"
+
+	"moku-backend/internal/jobs"
+	"moku-backend/internal/posixproj"
+)
+
+func (service *Service) enqueueBootstrapStructureMaterialization(
+	ctx context.Context,
+	installation *InstallationRecord,
+) error {
+	if installation == nil {
+		return nil
+	}
+
+	jobStore := jobs.NewStore(service.db)
+	if _, err := jobStore.Enqueue(ctx, jobs.EnqueueInput{
+		Kind: jobs.KindBootstrapStructureMaterialize,
+		Payload: jobs.BootstrapStructureMaterializePayload{
+			InstallationID: installation.ID,
+		},
+	}); err != nil {
+		failure := fmt.Sprintf("enqueue bootstrap materialization job: %v", err)
+		if markErr := service.markBootstrapMaterializationFailed(ctx, installation.ID, failure); markErr != nil {
+			return errors.Join(err, markErr)
+		}
+
+		// The relational bootstrap write already committed successfully, so keep the
+		// response successful and surface the enqueue problem via materialization state.
+		installation.MaterializationStatus = materializationFailed
+		installation.MaterializationError = &failure
+	}
+
+	return nil
+}
+
+func (service *Service) ProcessBootstrapStructureMaterialization(ctx context.Context, installationID string) error {
+	trimmedInstallationID := strings.TrimSpace(installationID)
+	if trimmedInstallationID == "" {
+		return ErrInstallationNotConfigured
+	}
+
+	installation, err := service.GetInstallation(ctx)
+	if err != nil {
+		return err
+	}
+	if installation == nil || installation.ID != trimmedInstallationID {
+		return ErrInstallationNotConfigured
+	}
+
+	if err := service.markBootstrapMaterializationRunning(ctx, trimmedInstallationID); err != nil {
+		return err
+	}
+
+	if err := service.materializeBootstrapStructure(ctx, *installation); err != nil {
+		failure := strings.TrimSpace(err.Error())
+		if failure == "" {
+			failure = "bootstrap materialization failed"
+		}
+
+		if markErr := service.markBootstrapMaterializationFailed(ctx, trimmedInstallationID, failure); markErr != nil {
+			return errors.Join(err, markErr)
+		}
+
+		return err
+	}
+
+	return service.markBootstrapMaterializationSucceeded(ctx, trimmedInstallationID)
+}
+
+func (service *Service) materializeBootstrapStructure(ctx context.Context, installation InstallationRecord) error {
+	admin, err := service.GetAdmin(ctx)
+	if err != nil {
+		return err
+	}
+	if admin == nil {
+		return ErrAdminNotConfigured
+	}
+
+	organization, err := service.loadPrimaryOrganization(ctx)
+	if err != nil {
+		return err
+	}
+	if organization == nil {
+		return ErrBootstrapStructureMissing
+	}
+
+	department, err := service.loadPrimaryDepartment(ctx)
+	if err != nil {
+		return err
+	}
+	if department == nil {
+		return ErrBootstrapStructureMissing
+	}
+
+	team, err := service.loadPrimaryTeam(ctx)
+	if err != nil {
+		return err
+	}
+	if team == nil {
+		return ErrBootstrapStructureMissing
+	}
+
+	project, err := service.loadPrimaryProject(ctx)
+	if err != nil {
+		return err
+	}
+	if project == nil {
+		return ErrBootstrapStructureMissing
+	}
+
+	if err := service.ensureBootstrapPOSIXSkeleton(
+		installation,
+		AdminSummary{ID: admin.ID, Email: admin.Email, DisplayName: admin.DisplayName},
+		namedRecord{ID: organization.ID, Name: organization.Name, Slug: organization.Slug},
+		namedRecord{ID: department.ID, Name: department.Name, Slug: department.Slug},
+		namedRecord{ID: team.ID, Name: team.Name, Slug: team.Slug},
+		namedRecord{ID: project.ID, Name: project.Name, Slug: project.Slug},
+	); err != nil {
+		return err
+	}
+
+	return service.rebuildProjection(ctx)
+}
+
+func (service *Service) rebuildProjection(ctx context.Context) error {
+	if err := posixproj.NewProjector(service.db, service.posixRoot).Rebuild(ctx); err != nil {
+		return fmt.Errorf("rebuild POSIX projection: %w", err)
+	}
+
+	return nil
+}
+
+func (service *Service) markBootstrapMaterializationRunning(ctx context.Context, installationID string) error {
+	_, err := service.db.Pool.Exec(ctx, `
+		UPDATE installations
+		SET
+			materialization_status = 'running'::bootstrap_materialization_status,
+			materialization_error = NULL,
+			materialization_started_at = NOW(),
+			materialization_finished_at = NULL,
+			updated_at = NOW()
+		WHERE id = $1::uuid;
+	`, strings.TrimSpace(installationID))
+
+	return err
+}
+
+func (service *Service) markBootstrapMaterializationSucceeded(ctx context.Context, installationID string) error {
+	_, err := service.db.Pool.Exec(ctx, `
+		UPDATE installations
+		SET
+			materialization_status = 'succeeded'::bootstrap_materialization_status,
+			materialization_error = NULL,
+			materialization_finished_at = NOW(),
+			updated_at = NOW()
+		WHERE id = $1::uuid;
+	`, strings.TrimSpace(installationID))
+
+	return err
+}
+
+func (service *Service) markBootstrapMaterializationFailed(ctx context.Context, installationID, failure string) error {
+	_, err := service.db.Pool.Exec(ctx, `
+		UPDATE installations
+		SET
+			materialization_status = 'failed'::bootstrap_materialization_status,
+			materialization_error = $2,
+			materialization_finished_at = NOW(),
+			updated_at = NOW()
+		WHERE id = $1::uuid;
+	`, strings.TrimSpace(installationID), strings.TrimSpace(failure))
+
+	return err
+}

Backend/internal/bootstrap/bootstrap_state.go

@@ -0,0 +1,73 @@
+package bootstrap
+
+import "context"
+
+func (service *Service) GetState(ctx context.Context) (BootstrapState, error) {
+	installation, err := service.GetInstallation(ctx)
+	if err != nil {
+		return BootstrapState{}, err
+	}
+
+	admin, err := service.GetAdmin(ctx)
+	if err != nil {
+		return BootstrapState{}, err
+	}
+
+	structure, err := service.GetStructure(ctx)
+	if err != nil {
+		return BootstrapState{}, err
+	}
+
+	return BootstrapState{
+		Installation: installation,
+		Admin:        admin,
+		Structure:    structure,
+	}, nil
+}
+
+func (service *Service) GetAppShellState(ctx context.Context) (AppShellState, error) {
+	installation, err := service.GetInstallation(ctx)
+	if err != nil {
+		return AppShellState{}, err
+	}
+
+	admin, err := service.GetAdmin(ctx)
+	if err != nil {
+		return AppShellState{}, err
+	}
+
+	organizations, err := service.listOrganizations(ctx)
+	if err != nil {
+		return AppShellState{}, err
+	}
+
+	departments, err := service.listDepartments(ctx)
+	if err != nil {
+		return AppShellState{}, err
+	}
+
+	teams, err := service.listTeams(ctx)
+	if err != nil {
+		return AppShellState{}, err
+	}
+
+	projects, err := service.listProjects(ctx)
+	if err != nil {
+		return AppShellState{}, err
+	}
+
+	workspaces, err := service.listWorkspaces(ctx)
+	if err != nil {
+		return AppShellState{}, err
+	}
+
+	return AppShellState{
+		Installation:  installation,
+		Admin:         admin,
+		Organizations: organizations,
+		Departments:   departments,
+		Teams:         teams,
+		Projects:      projects,
+		Workspaces:    workspaces,
+	}, nil
+}

Backend/internal/bootstrap/service_test.go

@@ -0,0 +1,639 @@
+package bootstrap
+
+import (
+	"encoding/json"
+	"errors"
+	"os"
+	"path/filepath"
+	"strings"
+	"testing"
+)
+
+type fakeRow struct {
+	scan func(dest ...any) error
+}
+
+func (row fakeRow) Scan(dest ...any) error {
+	return row.scan(dest...)
+}
+
+func TestScanInstallationRecordDefaultsMaterializationStatus(t *testing.T) {
+	record, err := scanInstallationRecord(fakeRow{scan: func(dest ...any) error {
+		*(dest[0].(*string)) = "installation-1"
+		*(dest[1].(*string)) = "MangoPig"
+		*(dest[2].(*string)) = "personal"
+		*(dest[3].(*string)) = "local"
+		*(dest[4].(*string)) = "http"
+		*(dest[5].(*string)) = "localhost"
+		*(dest[6].(*bool)) = true
+		*(dest[7].(*string)) = ""
+		*(dest[8].(**string)) = nil
+		return nil
+	}})
+	if err != nil {
+		t.Fatalf("scanInstallationRecord: %v", err)
+	}
+
+	if record.MaterializationStatus != materializationNotStarted {
+		t.Fatalf("expected default materialization status %q, got %q", materializationNotStarted, record.MaterializationStatus)
+	}
+	if record.MaterializationError != nil {
+		t.Fatalf("expected nil materialization error, got %#v", record.MaterializationError)
+	}
+}
+
+func TestScanInstallationRecordPreservesMaterializationFields(t *testing.T) {
+	failure := "projection rebuild failed"
+
+	record, err := scanInstallationRecord(fakeRow{scan: func(dest ...any) error {
+		*(dest[0].(*string)) = "installation-2"
+		*(dest[1].(*string)) = "MangoPig"
+		*(dest[2].(*string)) = "personal"
+		*(dest[3].(*string)) = "local"
+		*(dest[4].(*string)) = "http"
+		*(dest[5].(*string)) = "localhost"
+		*(dest[6].(*bool)) = true
+		*(dest[7].(*string)) = materializationFailed
+		*(dest[8].(**string)) = &failure
+		return nil
+	}})
+	if err != nil {
+		t.Fatalf("scanInstallationRecord: %v", err)
+	}
+
+	if record.MaterializationStatus != materializationFailed {
+		t.Fatalf("expected materialization status %q, got %q", materializationFailed, record.MaterializationStatus)
+	}
+	if record.MaterializationError == nil || *record.MaterializationError != failure {
+		t.Fatalf("expected materialization error %q, got %#v", failure, record.MaterializationError)
+	}
+}
+
+func TestEnsureBootstrapPOSIXSkeletonInitializesEmptyRoot(t *testing.T) {
+	rootPath := filepath.Join(t.TempDir(), "POSIX")
+	t.Setenv("POSIX_ROOT", rootPath)
+
+	if _, err := os.Stat(rootPath); !os.IsNotExist(err) {
+		t.Fatalf("expected isolated POSIX root to start absent, got err=%v", err)
+	}
+
+	service := NewService(nil, os.Getenv("POSIX_ROOT"))
+
+	err := service.ensureBootstrapPOSIXSkeleton(
+		InstallationRecord{
+			ID:             "installation-1",
+			Name:           "MangoPig",
+			Mode:           "personal",
+			Access:         "local",
+			Protocol:       "http",
+			Host:           "localhost",
+			IsBootstrapped: true,
+		},
+		AdminSummary{
+			ID:          "admin-1",
+			Email:       "ronald@example.com",
+			DisplayName: "Ronald",
+		},
+		namedRecord{ID: "org-1", Name: "Primary Organization", Slug: "primary-organization"},
+		namedRecord{ID: "dept-1", Name: "Primary Department", Slug: "primary-department"},
+		namedRecord{ID: "team-1", Name: "Primary Team", Slug: "primary-team"},
+		namedRecord{ID: "project-1", Name: "Primary Project", Slug: "primary-project"},
+	)
+	if err != nil {
+		t.Fatalf("ensure bootstrap POSIX skeleton: %v", err)
+	}
+
+	requiredPaths := []string{
+		filepath.Join(rootPath, "settings.json"),
+		filepath.Join(rootPath, "layout.json"),
+		filepath.Join(rootPath, "catalog", "packs"),
+		filepath.Join(rootPath, "catalog", "standalone"),
+		filepath.Join(rootPath, "departments", "department-primary-department", "settings.json"),
+		filepath.Join(rootPath, "departments", "department-primary-department", "users.json"),
+		filepath.Join(rootPath, "departments", "department-primary-department", "teams", "team-primary-team", "settings.json"),
+		filepath.Join(rootPath, "departments", "department-primary-department", "teams", "team-primary-team", "users.json"),
+		filepath.Join(rootPath, "projects", "project-primary-project", "settings.json"),
+		filepath.Join(rootPath, "projects", "project-primary-project", "home.json"),
+		filepath.Join(rootPath, "projects", "project-primary-project", "acl.json"),
+		filepath.Join(rootPath, "projects", "project-primary-project", "children"),
+		filepath.Join(rootPath, "projects", "project-primary-project", "tree"),
+		filepath.Join(rootPath, "users", "settings.json"),
+		filepath.Join(rootPath, "users", "data.json"),
+		filepath.Join(rootPath, "users", "personals"),
+		filepath.Join(rootPath, "users", "personals", "personal-ronald", "settings.json"),
+		filepath.Join(rootPath, "users", "personals", "personal-ronald", "layout.json"),
+		filepath.Join(rootPath, "users", "personals", "personal-ronald", "home.json"),
+		filepath.Join(rootPath, "users", "personals", "personal-ronald", "tree"),
+	}
+
+	for _, path := range requiredPaths {
+		if _, err := os.Stat(path); err != nil {
+			t.Fatalf("expected path to exist %s: %v", path, err)
+		}
+	}
+
+	settingsPayload := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, "settings.json"))
+	installationPayload, ok := settingsPayload["installation"].(map[string]any)
+	if !ok {
+		t.Fatalf("settings.json missing installation object: %#v", settingsPayload)
+	}
+	if installationPayload["name"] != "MangoPig" {
+		t.Fatalf("expected installation name MangoPig, got %#v", installationPayload["name"])
+	}
+	if installationPayload["isBootstrapped"] != true {
+		t.Fatalf("expected installation to be bootstrapped, got %#v", installationPayload["isBootstrapped"])
+	}
+
+	layoutPayload := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, "layout.json"))
+	homePayload, ok := layoutPayload["home"].(map[string]any)
+	if !ok {
+		t.Fatalf("layout.json missing home object: %#v", layoutPayload)
+	}
+	if homePayload["defaultProjectSlug"] != "primary-project" {
+		t.Fatalf("expected default project slug primary-project, got %#v", homePayload["defaultProjectSlug"])
+	}
+
+	projectSettings := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, "projects", "project-primary-project", "settings.json"))
+	if projectSettings["type"] != "project" {
+		t.Fatalf("expected project settings type project, got %#v", projectSettings["type"])
+	}
+
+	projectACL := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, "projects", "project-primary-project", "acl.json"))
+	if projectACL["inherits"] != true {
+		t.Fatalf("expected project acl to inherit by default, got %#v", projectACL["inherits"])
+	}
+
+	usersSettings := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, "users", "settings.json"))
+	if usersSettings["primaryAdminId"] != "admin-1" {
+		t.Fatalf("expected primary admin id admin-1, got %#v", usersSettings["primaryAdminId"])
+	}
+
+	personalSettings := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, "users", "personals", "personal-ronald", "settings.json"))
+	if personalSettings["type"] != "personal" {
+		t.Fatalf("expected personal settings type personal, got %#v", personalSettings["type"])
+	}
+	if personalSettings["name"] != "Ronald" {
+		t.Fatalf("expected personal name Ronald, got %#v", personalSettings["name"])
+	}
+	if personalSettings["slug"] != "ronald" {
+		t.Fatalf("expected personal slug ronald, got %#v", personalSettings["slug"])
+	}
+
+	personalHome := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, "users", "personals", "personal-ronald", "home.json"))
+	if personalHome["type"] != "personal-home" {
+		t.Fatalf("expected personal home type personal-home, got %#v", personalHome["type"])
+	}
+	if personalHome["title"] != "Ronald's Home" {
+		t.Fatalf("expected personal home title Ronald's Home, got %#v", personalHome["title"])
+	}
+}
+
+func TestCreateProjectHierarchyFolderOnDiskCreatesExpectedFolderShape(t *testing.T) {
+	rootPath := filepath.Join(t.TempDir(), "POSIX")
+	service := NewService(nil, rootPath)
+
+	err := service.ensureBootstrapPOSIXSkeleton(
+		InstallationRecord{ID: "installation-1", Name: "MangoPig", Mode: "personal", Access: "local", Protocol: "http", Host: "localhost", IsBootstrapped: true},
+		AdminSummary{ID: "admin-1", Email: "ronald@example.com", DisplayName: "Ronald"},
+		namedRecord{ID: "org-1", Name: "Primary Organization", Slug: "primary-organization"},
+		namedRecord{ID: "dept-1", Name: "Primary Department", Slug: "primary-department"},
+		namedRecord{ID: "team-1", Name: "Primary Team", Slug: "primary-team"},
+		namedRecord{ID: "project-1", Name: "Primary Project", Slug: "primary-project"},
+	)
+	if err != nil {
+		t.Fatalf("ensure bootstrap POSIX skeleton: %v", err)
+	}
+
+	createdPath, createdSlug, err := service.createProjectHierarchyFolderOnDisk("primary-project", "", "Design System")
+	if err != nil {
+		t.Fatalf("createProjectHierarchyFolderOnDisk root folder: %v", err)
+	}
+	if createdPath != "projects/project-primary-project/children/folder-design-system" {
+		t.Fatalf("unexpected created path: %s", createdPath)
+	}
+	if createdSlug != "design-system" {
+		t.Fatalf("unexpected created slug: %s", createdSlug)
+	}
+
+	createdFolderPath := filepath.Join(rootPath, "projects", "project-primary-project", "children", "folder-design-system")
+	for _, path := range []string{
+		filepath.Join(createdFolderPath, "folder.json"),
+		filepath.Join(createdFolderPath, "acl.json"),
+		filepath.Join(createdFolderPath, "children"),
+	} {
+		if _, err := os.Stat(path); err != nil {
+			t.Fatalf("expected path to exist %s: %v", path, err)
+		}
+	}
+
+	folderPayload := readJSONFileForTest[map[string]any](t, filepath.Join(createdFolderPath, "folder.json"))
+	if strings.TrimSpace(asStringForTest(folderPayload["id"])) == "" {
+		t.Fatalf("expected created folder to have stable id, got %#v", folderPayload["id"])
+	}
+	if folderPayload["name"] != "Design System" {
+		t.Fatalf("expected folder name Design System, got %#v", folderPayload["name"])
+	}
+	if folderPayload["slug"] != "design-system" {
+		t.Fatalf("expected folder slug design-system, got %#v", folderPayload["slug"])
+	}
+
+	nestedPath, nestedSlug, err := service.createProjectHierarchyFolderOnDisk("primary-project", createdPath, "Research")
+	if err != nil {
+		t.Fatalf("createProjectHierarchyFolderOnDisk nested folder: %v", err)
+	}
+	if nestedPath != "projects/project-primary-project/children/folder-design-system/children/folder-research" {
+		t.Fatalf("unexpected nested path: %s", nestedPath)
+	}
+	if nestedSlug != "research" {
+		t.Fatalf("unexpected nested slug: %s", nestedSlug)
+	}
+}
+
+func TestCreateProjectTreeFolderOnDiskCreatesExpectedFolderShape(t *testing.T) {
+	rootPath := filepath.Join(t.TempDir(), "POSIX")
+	service := NewService(nil, rootPath)
+
+	err := service.ensureBootstrapPOSIXSkeleton(
+		InstallationRecord{ID: "installation-1", Name: "MangoPig", Mode: "personal", Access: "local", Protocol: "http", Host: "localhost", IsBootstrapped: true},
+		AdminSummary{ID: "admin-1", Email: "ronald@example.com", DisplayName: "Ronald"},
+		namedRecord{ID: "org-1", Name: "Primary Organization", Slug: "primary-organization"},
+		namedRecord{ID: "dept-1", Name: "Primary Department", Slug: "primary-department"},
+		namedRecord{ID: "team-1", Name: "Primary Team", Slug: "primary-team"},
+		namedRecord{ID: "project-1", Name: "Primary Project", Slug: "primary-project"},
+	)
+	if err != nil {
+		t.Fatalf("ensure bootstrap POSIX skeleton: %v", err)
+	}
+
+	createdPath, createdSlug, err := service.createProjectTreeFolderOnDisk("primary-project", "", "Docs")
+	if err != nil {
+		t.Fatalf("createProjectTreeFolderOnDisk root folder: %v", err)
+	}
+	if createdPath != "projects/project-primary-project/tree/folder-docs" {
+		t.Fatalf("unexpected created path: %s", createdPath)
+	}
+	if createdSlug != "docs" {
+		t.Fatalf("unexpected created slug: %s", createdSlug)
+	}
+
+	createdFolderPath := filepath.Join(rootPath, "projects", "project-primary-project", "tree", "folder-docs")
+	for _, path := range []string{
+		filepath.Join(createdFolderPath, "folder.json"),
+		filepath.Join(createdFolderPath, "acl.json"),
+		filepath.Join(createdFolderPath, "children"),
+	} {
+		if _, err := os.Stat(path); err != nil {
+			t.Fatalf("expected path to exist %s: %v", path, err)
+		}
+	}
+
+	nestedPath, nestedSlug, err := service.createProjectTreeFolderOnDisk("primary-project", createdPath, "Research")
+	if err != nil {
+		t.Fatalf("createProjectTreeFolderOnDisk nested folder: %v", err)
+	}
+	if nestedPath != "projects/project-primary-project/tree/folder-docs/children/folder-research" {
+		t.Fatalf("unexpected nested path: %s", nestedPath)
+	}
+	if nestedSlug != "research" {
+		t.Fatalf("unexpected nested slug: %s", nestedSlug)
+	}
+}
+
+func TestRenameProjectHierarchyFolderOnDiskRenamesFolderShape(t *testing.T) {
+	rootPath := filepath.Join(t.TempDir(), "POSIX")
+	service := NewService(nil, rootPath)
+
+	err := service.ensureBootstrapPOSIXSkeleton(
+		InstallationRecord{ID: "installation-1", Name: "MangoPig", Mode: "personal", Access: "local", Protocol: "http", Host: "localhost", IsBootstrapped: true},
+		AdminSummary{ID: "admin-1", Email: "ronald@example.com", DisplayName: "Ronald"},
+		namedRecord{ID: "org-1", Name: "Primary Organization", Slug: "primary-organization"},
+		namedRecord{ID: "dept-1", Name: "Primary Department", Slug: "primary-department"},
+		namedRecord{ID: "team-1", Name: "Primary Team", Slug: "primary-team"},
+		namedRecord{ID: "project-1", Name: "Primary Project", Slug: "primary-project"},
+	)
+	if err != nil {
+		t.Fatalf("ensure bootstrap POSIX skeleton: %v", err)
+	}
+
+	createdPath, _, err := service.createProjectHierarchyFolderOnDisk("primary-project", "", "Design System")
+	if err != nil {
+		t.Fatalf("createProjectHierarchyFolderOnDisk root folder: %v", err)
+	}
+
+	nestedPath, _, err := service.createProjectHierarchyFolderOnDisk("primary-project", createdPath, "Research")
+	if err != nil {
+		t.Fatalf("createProjectHierarchyFolderOnDisk nested folder: %v", err)
+	}
+
+	previousPath, renamedPath, err := service.renameProjectHierarchyFolderOnDisk("primary-project", createdPath, "Platform Design")
+	if err != nil {
+		t.Fatalf("renameProjectHierarchyFolderOnDisk: %v", err)
+	}
+	if previousPath != createdPath {
+		t.Fatalf("expected previous path %s, got %s", createdPath, previousPath)
+	}
+	if renamedPath != "projects/project-primary-project/children/folder-platform-design" {
+		t.Fatalf("unexpected renamed path: %s", renamedPath)
+	}
+
+	if _, err := os.Stat(filepath.Join(rootPath, filepath.FromSlash(createdPath))); !os.IsNotExist(err) {
+		t.Fatalf("expected previous folder path to be gone, got err=%v", err)
+	}
+
+	renamedFolderPath := filepath.Join(rootPath, filepath.FromSlash(renamedPath))
+	if _, err := os.Stat(filepath.Join(renamedFolderPath, "children", filepath.Base(nestedPath))); err != nil {
+		t.Fatalf("expected nested child folder to move with renamed parent: %v", err)
+	}
+
+	folderPayload := readJSONFileForTest[map[string]any](t, filepath.Join(renamedFolderPath, "folder.json"))
+	if strings.TrimSpace(asStringForTest(folderPayload["id"])) == "" {
+		t.Fatalf("expected renamed folder to preserve stable id, got %#v", folderPayload["id"])
+	}
+	if folderPayload["name"] != "Platform Design" {
+		t.Fatalf("expected renamed folder name Platform Design, got %#v", folderPayload["name"])
+	}
+	if folderPayload["slug"] != "platform-design" {
+		t.Fatalf("expected renamed folder slug platform-design, got %#v", folderPayload["slug"])
+	}
+	if folderPayload["type"] != "folder" {
+		t.Fatalf("expected renamed folder type folder, got %#v", folderPayload["type"])
+	}
+}
+
+func TestRenameProjectTreeFolderOnDiskRenamesFolderShape(t *testing.T) {
+	rootPath := filepath.Join(t.TempDir(), "POSIX")
+	service := NewService(nil, rootPath)
+
+	err := service.ensureBootstrapPOSIXSkeleton(
+		InstallationRecord{ID: "installation-1", Name: "MangoPig", Mode: "personal", Access: "local", Protocol: "http", Host: "localhost", IsBootstrapped: true},
+		AdminSummary{ID: "admin-1", Email: "ronald@example.com", DisplayName: "Ronald"},
+		namedRecord{ID: "org-1", Name: "Primary Organization", Slug: "primary-organization"},
+		namedRecord{ID: "dept-1", Name: "Primary Department", Slug: "primary-department"},
+		namedRecord{ID: "team-1", Name: "Primary Team", Slug: "primary-team"},
+		namedRecord{ID: "project-1", Name: "Primary Project", Slug: "primary-project"},
+	)
+	if err != nil {
+		t.Fatalf("ensure bootstrap POSIX skeleton: %v", err)
+	}
+
+	createdPath, _, err := service.createProjectTreeFolderOnDisk("primary-project", "", "Docs")
+	if err != nil {
+		t.Fatalf("createProjectTreeFolderOnDisk root folder: %v", err)
+	}
+
+	previousPath, renamedPath, err := service.renameProjectTreeFolderOnDisk("primary-project", createdPath, "Specifications")
+	if err != nil {
+		t.Fatalf("renameProjectTreeFolderOnDisk: %v", err)
+	}
+	if previousPath != createdPath {
+		t.Fatalf("expected previous path %s, got %s", createdPath, previousPath)
+	}
+	if renamedPath != "projects/project-primary-project/tree/folder-specifications" {
+		t.Fatalf("unexpected renamed path: %s", renamedPath)
+	}
+
+	folderPayload := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, filepath.FromSlash(renamedPath), "folder.json"))
+	if folderPayload["name"] != "Specifications" {
+		t.Fatalf("expected renamed folder name Specifications, got %#v", folderPayload["name"])
+	}
+	if folderPayload["slug"] != "specifications" {
+		t.Fatalf("expected renamed folder slug specifications, got %#v", folderPayload["slug"])
+	}
+}
+
+func TestMoveProjectHierarchyFolderOnDiskMovesFolderToNewParent(t *testing.T) {
+	rootPath := filepath.Join(t.TempDir(), "POSIX")
+	service := NewService(nil, rootPath)
+
+	err := service.ensureBootstrapPOSIXSkeleton(
+		InstallationRecord{ID: "installation-1", Name: "MangoPig", Mode: "personal", Access: "local", Protocol: "http", Host: "localhost", IsBootstrapped: true},
+		AdminSummary{ID: "admin-1", Email: "ronald@example.com", DisplayName: "Ronald"},
+		namedRecord{ID: "org-1", Name: "Primary Organization", Slug: "primary-organization"},
+		namedRecord{ID: "dept-1", Name: "Primary Department", Slug: "primary-department"},
+		namedRecord{ID: "team-1", Name: "Primary Team", Slug: "primary-team"},
+		namedRecord{ID: "project-1", Name: "Primary Project", Slug: "primary-project"},
+	)
+	if err != nil {
+		t.Fatalf("ensure bootstrap POSIX skeleton: %v", err)
+	}
+
+	designPath, _, err := service.createProjectHierarchyFolderOnDisk("primary-project", "", "Design")
+	if err != nil {
+		t.Fatalf("create design folder: %v", err)
+	}
+	operationsPath, _, err := service.createProjectHierarchyFolderOnDisk("primary-project", "", "Operations")
+	if err != nil {
+		t.Fatalf("create operations folder: %v", err)
+	}
+	researchPath, _, err := service.createProjectHierarchyFolderOnDisk("primary-project", designPath, "Research")
+	if err != nil {
+		t.Fatalf("create research folder: %v", err)
+	}
+	nestedPath, _, err := service.createProjectHierarchyFolderOnDisk("primary-project", researchPath, "Interview Notes")
+	if err != nil {
+		t.Fatalf("create nested folder: %v", err)
+	}
+
+	previousPath, movedPath, err := service.moveProjectHierarchyFolderOnDisk("primary-project", researchPath, operationsPath)
+	if err != nil {
+		t.Fatalf("moveProjectHierarchyFolderOnDisk: %v", err)
+	}
+	if previousPath != researchPath {
+		t.Fatalf("expected previous path %s, got %s", researchPath, previousPath)
+	}
+	if movedPath != "projects/project-primary-project/children/folder-operations/children/folder-research" {
+		t.Fatalf("unexpected moved path: %s", movedPath)
+	}
+
+	if _, err := os.Stat(filepath.Join(rootPath, filepath.FromSlash(researchPath))); !os.IsNotExist(err) {
+		t.Fatalf("expected previous folder path to be gone, got err=%v", err)
+	}
+
+	movedFolderPath := filepath.Join(rootPath, filepath.FromSlash(movedPath))
+	if _, err := os.Stat(filepath.Join(movedFolderPath, "children", filepath.Base(nestedPath))); err != nil {
+		t.Fatalf("expected nested child folder to move with moved parent: %v", err)
+	}
+
+	folderPayload := readJSONFileForTest[map[string]any](t, filepath.Join(movedFolderPath, "folder.json"))
+	if strings.TrimSpace(asStringForTest(folderPayload["id"])) == "" {
+		t.Fatalf("expected moved folder to preserve stable id, got %#v", folderPayload["id"])
+	}
+	if folderPayload["name"] != "Research" {
+		t.Fatalf("expected moved folder name Research, got %#v", folderPayload["name"])
+	}
+	if folderPayload["slug"] != "research" {
+		t.Fatalf("expected moved folder slug research, got %#v", folderPayload["slug"])
+	}
+	if folderPayload["type"] != "folder" {
+		t.Fatalf("expected moved folder type folder, got %#v", folderPayload["type"])
+	}
+}
+
+func TestMoveProjectTreeFolderOnDiskMovesFolderToNewParent(t *testing.T) {
+	rootPath := filepath.Join(t.TempDir(), "POSIX")
+	service := NewService(nil, rootPath)
+
+	err := service.ensureBootstrapPOSIXSkeleton(
+		InstallationRecord{ID: "installation-1", Name: "MangoPig", Mode: "personal", Access: "local", Protocol: "http", Host: "localhost", IsBootstrapped: true},
+		AdminSummary{ID: "admin-1", Email: "ronald@example.com", DisplayName: "Ronald"},
+		namedRecord{ID: "org-1", Name: "Primary Organization", Slug: "primary-organization"},
+		namedRecord{ID: "dept-1", Name: "Primary Department", Slug: "primary-department"},
+		namedRecord{ID: "team-1", Name: "Primary Team", Slug: "primary-team"},
+		namedRecord{ID: "project-1", Name: "Primary Project", Slug: "primary-project"},
+	)
+	if err != nil {
+		t.Fatalf("ensure bootstrap POSIX skeleton: %v", err)
+	}
+
+	docsPath, _, err := service.createProjectTreeFolderOnDisk("primary-project", "", "Docs")
+	if err != nil {
+		t.Fatalf("create docs folder: %v", err)
+	}
+	archivePath, _, err := service.createProjectTreeFolderOnDisk("primary-project", "", "Archive")
+	if err != nil {
+		t.Fatalf("create archive folder: %v", err)
+	}
+
+	previousPath, movedPath, err := service.moveProjectTreeFolderOnDisk("primary-project", docsPath, archivePath)
+	if err != nil {
+		t.Fatalf("moveProjectTreeFolderOnDisk: %v", err)
+	}
+	if previousPath != docsPath {
+		t.Fatalf("expected previous path %s, got %s", docsPath, previousPath)
+	}
+	if movedPath != "projects/project-primary-project/tree/folder-archive/children/folder-docs" {
+		t.Fatalf("unexpected moved path: %s", movedPath)
+	}
+
+	folderPayload := readJSONFileForTest[map[string]any](t, filepath.Join(rootPath, filepath.FromSlash(movedPath), "folder.json"))
+	if folderPayload["name"] != "Docs" {
+		t.Fatalf("expected moved folder name Docs, got %#v", folderPayload["name"])
+	}
+	if folderPayload["slug"] != "docs" {
+		t.Fatalf("expected moved folder slug docs, got %#v", folderPayload["slug"])
+	}
+}
+
+func TestMoveProjectHierarchyFolderOnDiskRejectsDescendantTarget(t *testing.T) {
+	rootPath := filepath.Join(t.TempDir(), "POSIX")
+	service := NewService(nil, rootPath)
+
+	err := service.ensureBootstrapPOSIXSkeleton(
+		InstallationRecord{ID: "installation-1", Name: "MangoPig", Mode: "personal", Access: "local", Protocol: "http", Host: "localhost", IsBootstrapped: true},
+		AdminSummary{ID: "admin-1", Email: "ronald@example.com", DisplayName: "Ronald"},
+		namedRecord{ID: "org-1", Name: "Primary Organization", Slug: "primary-organization"},
+		namedRecord{ID: "dept-1", Name: "Primary Department", Slug: "primary-department"},
+		namedRecord{ID: "team-1", Name: "Primary Team", Slug: "primary-team"},
+		namedRecord{ID: "project-1", Name: "Primary Project", Slug: "primary-project"},
+	)
+	if err != nil {
+		t.Fatalf("ensure bootstrap POSIX skeleton: %v", err)
+	}
+
+	parentPath, _, err := service.createProjectHierarchyFolderOnDisk("primary-project", "", "Parent")
+	if err != nil {
+		t.Fatalf("create parent folder: %v", err)
+	}
+	childPath, _, err := service.createProjectHierarchyFolderOnDisk("primary-project", parentPath, "Child")
+	if err != nil {
+		t.Fatalf("create child folder: %v", err)
+	}
+
+	_, _, err = service.moveProjectHierarchyFolderOnDisk("primary-project", parentPath, childPath)
+	if !errors.Is(err, ErrInvalidProjectFolderMove) {
+		t.Fatalf("expected ErrInvalidProjectFolderMove, got %v", err)
+	}
+}
+
+func TestBuildProjectHierarchyFolderTreeBuildsNestedStructure(t *testing.T) {
+	rows := []projectHierarchyFolderRow{
+		{ID: "folder-design-id", Path: "projects/project-primary-project/children/folder-design", ParentPath: projectHierarchyRootPath("primary-project"), Label: "Design"},
+		{ID: "folder-research-id", Path: "projects/project-primary-project/children/folder-design/children/folder-research", ParentPath: "projects/project-primary-project/children/folder-design/children", Label: "Research"},
+		{ID: "folder-ops-id", Path: "projects/project-primary-project/children/folder-ops", ParentPath: projectHierarchyRootPath("primary-project"), Label: "Ops"},
+	}
+
+	folders := buildProjectHierarchyFolderTree(rows, projectHierarchyRootPath("primary-project"))
+	if len(folders) != 2 {
+		t.Fatalf("expected 2 top-level folders, got %d", len(folders))
+	}
+	if folders[0].Label != "Design" || folders[1].Label != "Ops" {
+		t.Fatalf("unexpected top-level folder labels: %#v", folders)
+	}
+	if len(folders[0].Children) != 1 || folders[0].Children[0].Label != "Research" {
+		t.Fatalf("unexpected nested folder structure: %#v", folders[0].Children)
+	}
+	if folders[0].ID != "folder-design-id" || folders[0].Path != "projects/project-primary-project/children/folder-design" {
+		t.Fatalf("expected design folder to retain stable id/path, got %#v", folders[0])
+	}
+	if folders[0].Children[0].ID != "folder-research-id" || folders[1].ID != "folder-ops-id" {
+		t.Fatalf("expected nested/top-level folder ids to be preserved, got %#v / %#v", folders[0].Children[0], folders[1])
+	}
+}
+
+func TestApplyProjectHierarchyFolderOrderingOrdersRootAndChildrenByStableID(t *testing.T) {
+	folders := []ProjectHierarchyFolderRecord{
+		{
+			ID:    "folder-design-id",
+			Path:  "projects/project-primary-project/children/folder-design",
+			Label: "Design",
+			Children: []ProjectHierarchyFolderRecord{
+				{ID: "folder-research-id", Path: "projects/project-primary-project/children/folder-design/children/folder-research", Label: "Research"},
+				{ID: "folder-assets-id", Path: "projects/project-primary-project/children/folder-design/children/folder-assets", Label: "Assets"},
+			},
+		},
+		{ID: "folder-ops-id", Path: "projects/project-primary-project/children/folder-ops", Label: "Ops"},
+		{ID: "folder-qa-id", Path: "projects/project-primary-project/children/folder-qa", Label: "QA"},
+	}
+
+	ordered := applyProjectHierarchyFolderOrdering(folders, map[string][]string{
+		projectFolderOrderRootKey: {"folder-qa-id", "folder-design-id"},
+		"folder-design-id":        {"folder-assets-id", "folder-research-id"},
+	})
+
+	if len(ordered) != 3 {
+		t.Fatalf("expected 3 ordered root folders, got %d", len(ordered))
+	}
+	if ordered[0].ID != "folder-qa-id" || ordered[1].ID != "folder-design-id" || ordered[2].ID != "folder-ops-id" {
+		t.Fatalf("unexpected ordered root ids: %#v", ordered)
+	}
+	if len(ordered[1].Children) != 2 {
+		t.Fatalf("expected design folder children to be preserved, got %#v", ordered[1].Children)
+	}
+	if ordered[1].Children[0].ID != "folder-assets-id" || ordered[1].Children[1].ID != "folder-research-id" {
+		t.Fatalf("unexpected ordered child ids: %#v", ordered[1].Children)
+	}
+}
+
+func TestInsertFolderOrderReordersWithinSameParent(t *testing.T) {
+	folderOrder := map[string][]string{
+		projectFolderOrderRootKey: {"folder-a", "folder-b", "folder-c"},
+	}
+
+	insertFolderOrder(folderOrder, "", "folder-c", 0)
+
+	got := folderOrder[projectFolderOrderRootKey]
+	if len(got) != 3 || got[0] != "folder-c" || got[1] != "folder-a" || got[2] != "folder-b" {
+		t.Fatalf("unexpected reordered root children: %#v", got)
+	}
+}
+
+func asStringForTest(value any) string {
+	text, _ := value.(string)
+	return text
+}
+
+func readJSONFileForTest[T any](t *testing.T, path string) T {
+	t.Helper()
+
+	data, err := os.ReadFile(path)
+	if err != nil {
+		t.Fatalf("read %s: %v", path, err)
+	}
+
+	var payload T
+	if err := json.Unmarshal(data, &payload); err != nil {
+		t.Fatalf("unmarshal %s: %v", path, err)
+	}
+
+	return payload
+}

Backend/internal/buildinfo/buildinfo.go

@@ -0,0 +1,23 @@
+// Path: Backend/internal/buildinfo/buildinfo.go
+
+package buildinfo
+
+var (
+	Version = "dev"
+	Commit  = "unknown"
+	BuiltAt = "unknown"
+)
+
+type Info struct {
+	Version string `json:"version"`
+	Commit  string `json:"commit"`
+	BuiltAt string `json:"builtAt"`
+}
+
+func Current() Info {
+	return Info{
+		Version: Version,
+		Commit:  Commit,
+		BuiltAt: BuiltAt,
+	}
+}

Backend/internal/cache/valkey.go

@@ -0,0 +1,40 @@
+// Path: Backend/internal/cache/valkey.go
+
+package cache
+
+import (
+	"context"
+
+	"github.com/redis/go-redis/v9"
+)
+
+type Client struct {
+	Redis *redis.Client
+}
+
+func NewValkey(valkeyURL string) (*Client, error) {
+	options, err := redis.ParseURL(valkeyURL)
+	if err != nil {
+		return nil, err
+	}
+
+	client := redis.NewClient(options)
+
+	return &Client{Redis: client}, nil
+}
+
+func (c *Client) Health(ctx context.Context) error {
+	if c == nil || c.Redis == nil {
+		return nil
+	}
+
+	return c.Redis.Ping(ctx).Err()
+}
+
+func (c *Client) Close() error {
+	if c == nil || c.Redis == nil {
+		return nil
+	}
+
+	return c.Redis.Close()
+}

Backend/internal/config/config.go

@@ -0,0 +1,77 @@
+// Path: Backend/internal/config/config.go
+
+package config
+
+import (
+	"fmt"
+	"os"
+	"strings"
+	"time"
+)
+
+type Config struct {
+	AppName         string
+	Environment     string
+	LogLevel        string
+	WebPort         string
+	APIPort         string
+	PostgresURL     string
+	ValkeyURL       string
+	POSIXRoot       string
+	ShutdownTimeout time.Duration
+}
+
+func Load() *Config {
+	return &Config{
+		AppName:         getEnv("APP_NAME", "moku"),
+		Environment:     getEnv("GO_ENV", "development"),
+		LogLevel:        getEnv("LOG_LEVEL", "debug"),
+		WebPort:         getEnv("BACKEND_WEB_PORT", "8080"),
+		APIPort:         getEnv("BACKEND_API_PORT", "8081"),
+		PostgresURL:     getEnv("DATABASE_URL", "postgres://moku:moku_dev_password@localhost:5432/moku?sslmode=disable"),
+		ValkeyURL:       getEnv("VALKEY_URL", "redis://localhost:6379/0"),
+		POSIXRoot:       getEnv("POSIX_ROOT", "../POSIX"),
+		ShutdownTimeout: getDurationEnv("BACKEND_SHUTDOWN_TIMEOUT", 10*time.Second),
+	}
+}
+
+func (c *Config) Address(serviceName string) string {
+	var port string
+
+	switch strings.ToLower(serviceName) {
+	case "web":
+		port = c.WebPort
+	case "api":
+		port = c.APIPort
+	default:
+		port = c.WebPort
+	}
+
+	return fmt.Sprintf(":%s", port)
+}
+
+func (c *Config) IsDevelopment() bool {
+	return strings.EqualFold(c.Environment, "development")
+}
+
+func getEnv(key, fallback string) string {
+	if value, exists := os.LookupEnv(key); exists {
+		return value
+	}
+
+	return fallback
+}
+
+func getDurationEnv(key string, fallback time.Duration) time.Duration {
+	value, exists := os.LookupEnv(key)
+	if !exists {
+		return fallback
+	}
+
+	parsed, err := time.ParseDuration(value)
+	if err != nil {
+		return fallback
+	}
+
+	return parsed
+}

Backend/internal/database/postgres.go

@@ -0,0 +1,95 @@
+// Path: Backend/internal/database/postgres.go
+
+package database
+
+import (
+	"context"
+	"database/sql"
+	"time"
+
+	"github.com/jackc/pgx/v5/pgxpool"
+	"github.com/jackc/pgx/v5/stdlib"
+	"github.com/pressly/goose/v3"
+
+	"moku-backend/db"
+)
+
+type DB struct {
+	Pool *pgxpool.Pool
+}
+
+func NewPostgres(databaseURL string) (*DB, error) {
+	ctx, cancel := context.WithTimeout(context.Background(), 10*time.Second)
+	defer cancel()
+
+	config, err := pgxpool.ParseConfig(databaseURL)
+	if err != nil {
+		return nil, err
+	}
+
+	config.MaxConns = 25
+	config.MinConns = 5
+	config.MaxConnLifetime = time.Hour
+	config.MaxConnIdleTime = 30 * time.Minute
+
+	pool, err := pgxpool.NewWithConfig(ctx, config)
+	if err != nil {
+		return nil, err
+	}
+
+	if err := pool.Ping(ctx); err != nil {
+		pool.Close()
+		return nil, err
+	}
+
+	return &DB{Pool: pool}, nil
+}
+
+func (d *DB) MigrateUp() error {
+	return d.runGoose(goose.Up)
+}
+
+func (d *DB) MigrateDown() error {
+	return d.runGoose(goose.Down)
+}
+
+func (d *DB) MigrateReset() error {
+	return d.runGoose(goose.Reset)
+}
+
+func (d *DB) MigrateStatus() error {
+	return d.runGoose(goose.Status)
+}
+
+func (d *DB) runGoose(command func(*sql.DB, string, ...goose.OptionsFunc) error) error {
+	if d == nil || d.Pool == nil {
+		return nil
+	}
+
+	sqlDB := stdlib.OpenDBFromPool(d.Pool)
+	defer sqlDB.Close()
+
+	goose.SetBaseFS(db.Migrations)
+
+	if err := goose.SetDialect("postgres"); err != nil {
+		return err
+	}
+
+	return command(sqlDB, "migrations")
+}
+
+func (d *DB) Health(ctx context.Context) error {
+	if d == nil || d.Pool == nil {
+		return nil
+	}
+
+	return d.Pool.Ping(ctx)
+}
+
+func (d *DB) Close() {
+	if d == nil || d.Pool == nil {
+		return
+	}
+
+	d.Pool.Close()
+}

Backend/internal/httpx/api_bootstrap_routes.go

@@ -0,0 +1,396 @@
+// Path: Backend/internal/httpx/api_bootstrap_routes.go
+
+package httpx
+
+import (
+	"encoding/json"
+	"errors"
+	"io"
+	"net/http"
+	"strings"
+
+	bootstrapservice "moku-backend/internal/bootstrap"
+)
+
+type bootstrapInstanceStepRequest struct {
+	Protocol string `json:"protocol"`
+	Access   string `json:"access"`
+	Host     string `json:"host"`
+}
+
+type bootstrapModeStepRequest struct {
+	Mode string `json:"mode"`
+	Name string `json:"name"`
+}
+
+type bootstrapAdminStepRequest struct {
+	DisplayName string `json:"displayName"`
+	Email       string `json:"email"`
+	Password    string `json:"password"`
+}
+
+type bootstrapStructureStepRequest struct {
+	OrganizationName string `json:"organizationName"`
+	DepartmentName   string `json:"departmentName"`
+	TeamName         string `json:"teamName"`
+	ProjectName      string `json:"projectName"`
+}
+
+func (routes apiRoutes) handleBootstrapOverview(w http.ResponseWriter, _ *http.Request) {
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": map[string]any{
+			"resource": "bootstrap",
+			"status":   "persisted",
+			"steps": []map[string]string{
+				{
+					"id":     "instance",
+					"method": http.MethodPost,
+					"path":   "/v1/bootstrap/steps/instance",
+				},
+				{
+					"id":     "mode",
+					"method": http.MethodPost,
+					"path":   "/v1/bootstrap/steps/mode",
+				},
+				{
+					"id":     "admin",
+					"method": http.MethodPost,
+					"path":   "/v1/bootstrap/steps/admin",
+				},
+				{
+					"id":     "structure",
+					"method": http.MethodPost,
+					"path":   "/v1/bootstrap/steps/structure",
+				},
+				{
+					"id":     "installation",
+					"method": http.MethodGet,
+					"path":   "/v1/bootstrap/installation",
+				},
+				{
+					"id":     "admin-state",
+					"method": http.MethodGet,
+					"path":   "/v1/bootstrap/admin",
+				},
+				{
+					"id":     "structure-state",
+					"method": http.MethodGet,
+					"path":   "/v1/bootstrap/structure",
+				},
+				{
+					"id":     "bootstrap-state",
+					"method": http.MethodGet,
+					"path":   "/v1/bootstrap/state",
+				},
+				{
+					"id":     "app-shell",
+					"method": http.MethodGet,
+					"path":   "/v1/app-shell",
+				},
+			},
+		},
+	})
+}
+
+func (routes apiRoutes) handleBootstrapInstallation(w http.ResponseWriter, r *http.Request) {
+	record, err := routes.bootstrapService().GetInstallation(r.Context())
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": record,
+		"meta": map[string]any{
+			"resource": "bootstrap-installation",
+		},
+	})
+}
+
+func (routes apiRoutes) handleBootstrapAdmin(w http.ResponseWriter, r *http.Request) {
+	record, err := routes.bootstrapService().GetAdmin(r.Context())
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": record,
+		"meta": map[string]any{
+			"resource": "bootstrap-admin",
+		},
+	})
+}
+
+func (routes apiRoutes) handleBootstrapStructure(w http.ResponseWriter, r *http.Request) {
+	record, err := routes.bootstrapService().GetStructure(r.Context())
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": record,
+		"meta": map[string]any{
+			"resource": "bootstrap-structure",
+		},
+	})
+}
+
+func (routes apiRoutes) handleBootstrapState(w http.ResponseWriter, r *http.Request) {
+	record, err := routes.bootstrapService().GetState(r.Context())
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": record,
+		"meta": map[string]any{
+			"resource": "bootstrap-state",
+		},
+	})
+}
+
+func (routes apiRoutes) handleAppShellState(w http.ResponseWriter, r *http.Request) {
+	record, err := routes.bootstrapService().GetAppShellState(r.Context())
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": record,
+		"meta": map[string]any{
+			"resource": "app-shell",
+		},
+	})
+}
+
+func (routes apiRoutes) handleDevelopmentBootstrapReset(w http.ResponseWriter, r *http.Request) {
+	if !routes.cfg.Config.IsDevelopment() {
+		WriteError(w, http.StatusNotFound, RequestIDFromContext(r.Context()), "not_found", "The requested endpoint does not exist.")
+		return
+	}
+
+	if err := routes.bootstrapService().ResetDevelopmentState(r.Context()); err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": map[string]any{
+			"reset": true,
+		},
+		"meta": map[string]any{
+			"resource":        "development-bootstrap-reset",
+			"developmentOnly": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleBootstrapInstanceStep(w http.ResponseWriter, r *http.Request) {
+	payload, ok := decodeBootstrapRequest[bootstrapInstanceStepRequest](w, r)
+	if !ok {
+		return
+	}
+	payload.Protocol = strings.ToLower(strings.TrimSpace(payload.Protocol))
+	payload.Access = strings.ToLower(strings.TrimSpace(payload.Access))
+	payload.Host = strings.TrimSpace(payload.Host)
+
+	if payload.Protocol != "http" && payload.Protocol != "https" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Protocol must be either 'http' or 'https'.")
+		return
+	}
+
+	if payload.Access != "local" && payload.Access != "remote" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Access must be either 'local' or 'remote'.")
+		return
+	}
+
+	if payload.Host == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Host is required.")
+		return
+	}
+
+	record, err := routes.bootstrapService().SaveInstance(r.Context(), bootstrapservice.SaveInstanceInput{
+		Protocol: payload.Protocol,
+		Access:   payload.Access,
+		Host:     payload.Host,
+	})
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	routes.writeBootstrapStepResponse(w, http.StatusOK, "instance", map[string]any{
+		"request":      payload,
+		"installation": record,
+	})
+}
+
+func (routes apiRoutes) handleBootstrapModeStep(w http.ResponseWriter, r *http.Request) {
+	payload, ok := decodeBootstrapRequest[bootstrapModeStepRequest](w, r)
+	if !ok {
+		return
+	}
+	payload.Mode = strings.ToLower(strings.TrimSpace(payload.Mode))
+	payload.Name = strings.TrimSpace(payload.Name)
+
+	if payload.Mode != "personal" && payload.Mode != "organizational" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Mode must be either 'personal' or 'organizational'.")
+		return
+	}
+
+	if payload.Name == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Name is required.")
+		return
+	}
+
+	record, err := routes.bootstrapService().SaveMode(r.Context(), bootstrapservice.SaveModeInput{Mode: payload.Mode, Name: payload.Name})
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	routes.writeBootstrapStepResponse(w, http.StatusOK, "mode", map[string]any{
+		"request":      payload,
+		"installation": record,
+	})
+}
+
+func (routes apiRoutes) handleBootstrapAdminStep(w http.ResponseWriter, r *http.Request) {
+	payload, ok := decodeBootstrapRequest[bootstrapAdminStepRequest](w, r)
+	if !ok {
+		return
+	}
+	payload.DisplayName = strings.TrimSpace(payload.DisplayName)
+	payload.Email = strings.ToLower(strings.TrimSpace(payload.Email))
+
+	if payload.DisplayName == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Display name is required.")
+		return
+	}
+
+	if payload.Email == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Email is required.")
+		return
+	}
+
+	if strings.TrimSpace(payload.Password) == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Password is required.")
+		return
+	}
+
+	record, err := routes.bootstrapService().SaveAdmin(r.Context(), bootstrapservice.SaveAdminInput{
+		DisplayName: payload.DisplayName,
+		Email:       payload.Email,
+		Password:    payload.Password,
+	})
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	routes.writeBootstrapStepResponse(w, http.StatusOK, "admin", map[string]any{
+		"request": payload,
+		"admin":   record,
+	})
+}
+
+func (routes apiRoutes) handleBootstrapStructureStep(w http.ResponseWriter, r *http.Request) {
+	payload, ok := decodeBootstrapRequest[bootstrapStructureStepRequest](w, r)
+	if !ok {
+		return
+	}
+	payload.OrganizationName = strings.TrimSpace(payload.OrganizationName)
+	payload.DepartmentName = strings.TrimSpace(payload.DepartmentName)
+	payload.TeamName = strings.TrimSpace(payload.TeamName)
+	payload.ProjectName = strings.TrimSpace(payload.ProjectName)
+
+	if payload.DepartmentName == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Department name is required.")
+		return
+	}
+
+	if payload.TeamName == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Team name is required.")
+		return
+	}
+
+	if payload.ProjectName == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project name is required.")
+		return
+	}
+
+	record, err := routes.bootstrapService().SaveStructure(r.Context(), bootstrapservice.SaveStructureInput{
+		OrganizationName: payload.OrganizationName,
+		DepartmentName:   payload.DepartmentName,
+		TeamName:         payload.TeamName,
+		ProjectName:      payload.ProjectName,
+	})
+	if err != nil {
+		routes.writeBootstrapPersistenceError(w, r, err)
+		return
+	}
+
+	routes.writeBootstrapStepResponse(w, http.StatusOK, "structure", map[string]any{
+		"request":   payload,
+		"structure": record,
+	})
+}
+
+func (routes apiRoutes) bootstrapService() *bootstrapservice.Service {
+	return bootstrapservice.NewService(routes.cfg.Database, routes.cfg.Config.POSIXRoot)
+}
+
+func (routes apiRoutes) writeBootstrapStepResponse(w http.ResponseWriter, status int, step string, payload any) {
+	WriteJSON(w, status, map[string]any{
+		"data": map[string]any{
+			"step":   step,
+			"result": payload,
+		},
+		"meta": map[string]any{
+			"resource":  "bootstrap-step",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) writeBootstrapPersistenceError(w http.ResponseWriter, r *http.Request, err error) {
+	switch {
+	case errors.Is(err, bootstrapservice.ErrInstallationNotConfigured), errors.Is(err, bootstrapservice.ErrAdminNotConfigured):
+		WriteError(w, http.StatusConflict, RequestIDFromContext(r.Context()), "bootstrap_prerequisite_missing", err.Error())
+	default:
+		routes.cfg.Logger.Error("persist bootstrap step", "error", err, "path", r.URL.Path)
+		message := "Failed to persist bootstrap data."
+		if routes.cfg.Config.IsDevelopment() {
+			message = message + " " + err.Error()
+		}
+		WriteError(w, http.StatusInternalServerError, RequestIDFromContext(r.Context()), "bootstrap_persist_failed", message)
+	}
+}
+
+func decodeBootstrapRequest[T any](w http.ResponseWriter, r *http.Request) (T, bool) {
+	var payload T
+
+	decoder := json.NewDecoder(r.Body)
+	decoder.DisallowUnknownFields()
+
+	if err := decoder.Decode(&payload); err != nil {
+		if errors.Is(err, io.EOF) {
+			WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body is required and must be valid JSON for this bootstrap step.")
+			return payload, false
+		}
+
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must be valid JSON for this bootstrap step.")
+		return payload, false
+	}
+
+	if err := decoder.Decode(&struct{}{}); !errors.Is(err, io.EOF) {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must contain a single JSON object.")
+		return payload, false
+	}
+
+	return payload, true
+}

Backend/internal/httpx/api_project_routes.go

@@ -0,0 +1,717 @@
+package httpx
+
+import (
+	"encoding/json"
+	"errors"
+	"io"
+	"net/http"
+	"strings"
+
+	bootstrapservice "moku-backend/internal/bootstrap"
+
+	"github.com/go-chi/chi/v5"
+)
+
+type createProjectFolderRequest struct {
+	Name             string `json:"name"`
+	ParentFolderPath string `json:"parentFolderId"`
+}
+
+type renameProjectFolderRequest struct {
+	FolderPath string `json:"folderId"`
+	Name       string `json:"name"`
+}
+
+type deleteProjectFolderRequest struct {
+	FolderPath string `json:"folderId"`
+}
+
+// Keep the existing JSON contract for the frontend, but use clearer path-vs-stable-ID
+// names internally so the move flow is easier to reason about.
+type moveProjectFolderRequest struct {
+	FolderPath       string `json:"folderId"`
+	FolderStableID   string `json:"folderNodeId"`
+	ParentFolderPath string `json:"parentFolderId"`
+	ParentStableID   string `json:"parentNodeId"`
+	TargetIndex      int    `json:"targetIndex"`
+}
+
+type createProjectItemRequest struct {
+	Name             string `json:"name"`
+	ParentFolderPath string `json:"parentFolderId"`
+	ItemType         string `json:"itemType"`
+}
+
+type deleteProjectItemRequest struct {
+	ItemPath string `json:"itemId"`
+}
+
+type moveProjectItemRequest struct {
+	ItemPath         string `json:"itemId"`
+	ItemStableID     string `json:"itemNodeId"`
+	ParentFolderPath string `json:"parentFolderId"`
+	ParentStableID   string `json:"parentNodeId"`
+	TargetIndex      int    `json:"targetIndex"`
+}
+
+func (routes apiRoutes) handleProjectFolders(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	folders, err := routes.bootstrapService().GetProjectHierarchyFolders(r.Context(), projectID)
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "load")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": map[string]any{
+			"projectId": projectID,
+			"folders":   folders,
+		},
+		"meta": map[string]any{
+			"resource": "project-folders",
+		},
+	})
+}
+
+func (routes apiRoutes) handleCreateProjectFolder(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload, ok := decodeProjectFolderRequest(w, r)
+	if !ok {
+		return
+	}
+
+	payload.Name = strings.TrimSpace(payload.Name)
+	payload.ParentFolderPath = strings.TrimSpace(payload.ParentFolderPath)
+	if payload.Name == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder name is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().CreateProjectFolder(r.Context(), bootstrapservice.CreateProjectFolderInput{
+		ProjectID:        projectID,
+		ParentFolderPath: payload.ParentFolderPath,
+		Name:             payload.Name,
+	})
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "persist")
+		return
+	}
+
+	WriteJSON(w, http.StatusCreated, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-folder-create",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleDeleteProjectFolder(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload := decodeDeleteProjectFolderRequest(r)
+	if strings.TrimSpace(payload.FolderPath) == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder ID is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().DeleteProjectFolder(r.Context(), bootstrapservice.DeleteProjectFolderInput{
+		ProjectID:  projectID,
+		FolderPath: payload.FolderPath,
+	})
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "delete")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-folder-delete",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleRenameProjectFolder(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload, ok := decodeRenameProjectFolderRequest(w, r)
+	if !ok {
+		return
+	}
+
+	payload.FolderPath = strings.TrimSpace(payload.FolderPath)
+	payload.Name = strings.TrimSpace(payload.Name)
+	if payload.FolderPath == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder ID is required.")
+		return
+	}
+	if payload.Name == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder name is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().RenameProjectFolder(r.Context(), bootstrapservice.RenameProjectFolderInput{
+		ProjectID:  projectID,
+		FolderPath: payload.FolderPath,
+		Name:       payload.Name,
+	})
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "rename")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-folder-rename",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleMoveProjectFolder(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload, ok := decodeMoveProjectFolderRequest(w, r)
+	if !ok {
+		return
+	}
+
+	payload.FolderPath = strings.TrimSpace(payload.FolderPath)
+	payload.FolderStableID = strings.TrimSpace(payload.FolderStableID)
+	payload.ParentFolderPath = strings.TrimSpace(payload.ParentFolderPath)
+	payload.ParentStableID = strings.TrimSpace(payload.ParentStableID)
+	if payload.FolderPath == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder ID is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().MoveProjectFolder(r.Context(), bootstrapservice.MoveProjectFolderInput{
+		ProjectID:        projectID,
+		FolderPath:       payload.FolderPath,
+		FolderStableID:   payload.FolderStableID,
+		ParentFolderPath: payload.ParentFolderPath,
+		ParentStableID:   payload.ParentStableID,
+		TargetIndex:      payload.TargetIndex,
+	})
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "move")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-folder-move",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleProjectTreeFolders(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	folders, err := routes.bootstrapService().GetProjectTreeFolders(r.Context(), projectID)
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "load")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": map[string]any{
+			"projectId": projectID,
+			"folders":   folders,
+		},
+		"meta": map[string]any{
+			"resource": "project-tree-folders",
+		},
+	})
+}
+
+func (routes apiRoutes) handleProjectTree(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	nodes, err := routes.bootstrapService().GetProjectTreeNodes(r.Context(), projectID)
+	if err != nil {
+		routes.writeProjectTreeError(w, r, err, "load")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": map[string]any{
+			"projectId": projectID,
+			"nodes":     nodes,
+		},
+		"meta": map[string]any{
+			"resource": "project-tree",
+		},
+	})
+}
+
+func (routes apiRoutes) handleCreateProjectTreeFolder(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload, ok := decodeProjectFolderRequest(w, r)
+	if !ok {
+		return
+	}
+
+	payload.Name = strings.TrimSpace(payload.Name)
+	payload.ParentFolderPath = strings.TrimSpace(payload.ParentFolderPath)
+	if payload.Name == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder name is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().CreateProjectTreeFolder(r.Context(), bootstrapservice.CreateProjectFolderInput{
+		ProjectID:        projectID,
+		ParentFolderPath: payload.ParentFolderPath,
+		Name:             payload.Name,
+	})
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "persist")
+		return
+	}
+
+	WriteJSON(w, http.StatusCreated, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-tree-folder-create",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleDeleteProjectTreeFolder(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload := decodeDeleteProjectFolderRequest(r)
+	if strings.TrimSpace(payload.FolderPath) == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder ID is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().DeleteProjectTreeFolder(r.Context(), bootstrapservice.DeleteProjectFolderInput{
+		ProjectID:  projectID,
+		FolderPath: payload.FolderPath,
+	})
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "delete")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-tree-folder-delete",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleRenameProjectTreeFolder(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload, ok := decodeRenameProjectFolderRequest(w, r)
+	if !ok {
+		return
+	}
+
+	payload.FolderPath = strings.TrimSpace(payload.FolderPath)
+	payload.Name = strings.TrimSpace(payload.Name)
+	if payload.FolderPath == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder ID is required.")
+		return
+	}
+	if payload.Name == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder name is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().RenameProjectTreeFolder(r.Context(), bootstrapservice.RenameProjectFolderInput{
+		ProjectID:  projectID,
+		FolderPath: payload.FolderPath,
+		Name:       payload.Name,
+	})
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "rename")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-tree-folder-rename",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleMoveProjectTreeFolder(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload, ok := decodeMoveProjectFolderRequest(w, r)
+	if !ok {
+		return
+	}
+
+	payload.FolderPath = strings.TrimSpace(payload.FolderPath)
+	payload.FolderStableID = strings.TrimSpace(payload.FolderStableID)
+	payload.ParentFolderPath = strings.TrimSpace(payload.ParentFolderPath)
+	payload.ParentStableID = strings.TrimSpace(payload.ParentStableID)
+	if payload.FolderPath == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Folder ID is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().MoveProjectTreeFolder(r.Context(), bootstrapservice.MoveProjectFolderInput{
+		ProjectID:        projectID,
+		FolderPath:       payload.FolderPath,
+		FolderStableID:   payload.FolderStableID,
+		ParentFolderPath: payload.ParentFolderPath,
+		ParentStableID:   payload.ParentStableID,
+		TargetIndex:      payload.TargetIndex,
+	})
+	if err != nil {
+		routes.writeProjectFolderError(w, r, err, "move")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-tree-folder-move",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleCreateProjectTreeItem(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload, ok := decodeProjectItemRequest(w, r)
+	if !ok {
+		return
+	}
+
+	payload.Name = strings.TrimSpace(payload.Name)
+	payload.ParentFolderPath = strings.TrimSpace(payload.ParentFolderPath)
+	payload.ItemType = strings.TrimSpace(payload.ItemType)
+	if payload.Name == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Item name is required.")
+		return
+	}
+	if payload.ItemType == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Item type is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().CreateProjectTreeItem(r.Context(), bootstrapservice.CreateProjectItemInput{
+		ProjectID:        projectID,
+		ParentFolderPath: payload.ParentFolderPath,
+		Name:             payload.Name,
+		ItemType:         payload.ItemType,
+	})
+	if err != nil {
+		routes.writeProjectTreeError(w, r, err, "persist")
+		return
+	}
+
+	WriteJSON(w, http.StatusCreated, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-tree-item-create",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleDeleteProjectTreeItem(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload := decodeDeleteProjectItemRequest(r)
+	if strings.TrimSpace(payload.ItemPath) == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Item ID is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().DeleteProjectTreeItem(r.Context(), bootstrapservice.DeleteProjectItemInput{
+		ProjectID: projectID,
+		ItemPath:  payload.ItemPath,
+	})
+	if err != nil {
+		routes.writeProjectTreeError(w, r, err, "delete")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-tree-item-delete",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) handleMoveProjectTreeItem(w http.ResponseWriter, r *http.Request) {
+	projectID := strings.TrimSpace(chi.URLParam(r, "projectId"))
+	if projectID == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Project ID is required.")
+		return
+	}
+
+	payload, ok := decodeMoveProjectItemRequest(w, r)
+	if !ok {
+		return
+	}
+
+	payload.ItemPath = strings.TrimSpace(payload.ItemPath)
+	payload.ItemStableID = strings.TrimSpace(payload.ItemStableID)
+	payload.ParentFolderPath = strings.TrimSpace(payload.ParentFolderPath)
+	payload.ParentStableID = strings.TrimSpace(payload.ParentStableID)
+	if payload.ItemPath == "" {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", "Item ID is required.")
+		return
+	}
+
+	result, err := routes.bootstrapService().MoveProjectTreeItem(r.Context(), bootstrapservice.MoveProjectItemInput{
+		ProjectID:        projectID,
+		ItemPath:         payload.ItemPath,
+		ItemStableID:     payload.ItemStableID,
+		ParentFolderPath: payload.ParentFolderPath,
+		ParentStableID:   payload.ParentStableID,
+		TargetIndex:      payload.TargetIndex,
+	})
+	if err != nil {
+		routes.writeProjectTreeError(w, r, err, "move")
+		return
+	}
+
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": result,
+		"meta": map[string]any{
+			"resource":  "project-tree-item-move",
+			"persisted": true,
+		},
+	})
+}
+
+func (routes apiRoutes) writeProjectFolderError(w http.ResponseWriter, r *http.Request, err error, operation string) {
+	switch {
+	case errors.Is(err, bootstrapservice.ErrProjectNotFound), errors.Is(err, bootstrapservice.ErrProjectFolderNotFound):
+		WriteError(w, http.StatusNotFound, RequestIDFromContext(r.Context()), "not_found", err.Error())
+	case errors.Is(err, bootstrapservice.ErrInvalidProjectFolderMove):
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", err.Error())
+	default:
+		routes.cfg.Logger.Error(operation+" project folder", "error", err, "path", r.URL.Path)
+		message := "Failed to " + operation + " project folder."
+		if routes.cfg.Config.IsDevelopment() {
+			message = message + " " + err.Error()
+		}
+		WriteError(w, http.StatusInternalServerError, RequestIDFromContext(r.Context()), "project_folder_"+operation+"_failed", message)
+	}
+}
+
+func (routes apiRoutes) writeProjectTreeError(w http.ResponseWriter, r *http.Request, err error, operation string) {
+	switch {
+	case errors.Is(err, bootstrapservice.ErrProjectNotFound), errors.Is(err, bootstrapservice.ErrProjectFolderNotFound), errors.Is(err, bootstrapservice.ErrProjectItemNotFound):
+		WriteError(w, http.StatusNotFound, RequestIDFromContext(r.Context()), "not_found", err.Error())
+	case errors.Is(err, bootstrapservice.ErrInvalidProjectFolderMove), errors.Is(err, bootstrapservice.ErrInvalidProjectItemMove):
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_request", err.Error())
+	default:
+		routes.cfg.Logger.Error(operation+" project tree", "error", err, "path", r.URL.Path)
+		message := "Failed to " + operation + " project tree."
+		if routes.cfg.Config.IsDevelopment() {
+			message = message + " " + err.Error()
+		}
+		WriteError(w, http.StatusInternalServerError, RequestIDFromContext(r.Context()), "project_tree_"+operation+"_failed", message)
+	}
+}
+
+func decodeMoveProjectFolderRequest(w http.ResponseWriter, r *http.Request) (moveProjectFolderRequest, bool) {
+	var payload moveProjectFolderRequest
+
+	decoder := json.NewDecoder(r.Body)
+	decoder.DisallowUnknownFields()
+
+	if err := decoder.Decode(&payload); err != nil {
+		if errors.Is(err, io.EOF) {
+			WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body is required and must be valid JSON.")
+			return payload, false
+		}
+
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must be valid JSON.")
+		return payload, false
+	}
+
+	if err := decoder.Decode(&struct{}{}); !errors.Is(err, io.EOF) {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must contain a single JSON object.")
+		return payload, false
+	}
+
+	return payload, true
+}
+
+func decodeDeleteProjectFolderRequest(r *http.Request) deleteProjectFolderRequest {
+	return deleteProjectFolderRequest{
+		FolderPath: strings.TrimSpace(r.URL.Query().Get("folderId")),
+	}
+}
+
+func decodeDeleteProjectItemRequest(r *http.Request) deleteProjectItemRequest {
+	return deleteProjectItemRequest{
+		ItemPath: strings.TrimSpace(r.URL.Query().Get("itemId")),
+	}
+}
+
+func decodeRenameProjectFolderRequest(w http.ResponseWriter, r *http.Request) (renameProjectFolderRequest, bool) {
+	var payload renameProjectFolderRequest
+
+	decoder := json.NewDecoder(r.Body)
+	decoder.DisallowUnknownFields()
+
+	if err := decoder.Decode(&payload); err != nil {
+		if errors.Is(err, io.EOF) {
+			WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body is required and must be valid JSON.")
+			return payload, false
+		}
+
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must be valid JSON.")
+		return payload, false
+	}
+
+	if err := decoder.Decode(&struct{}{}); !errors.Is(err, io.EOF) {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must contain a single JSON object.")
+		return payload, false
+	}
+
+	return payload, true
+}
+
+func decodeProjectFolderRequest(w http.ResponseWriter, r *http.Request) (createProjectFolderRequest, bool) {
+	var payload createProjectFolderRequest
+
+	decoder := json.NewDecoder(r.Body)
+	decoder.DisallowUnknownFields()
+
+	if err := decoder.Decode(&payload); err != nil {
+		if errors.Is(err, io.EOF) {
+			WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body is required and must be valid JSON.")
+			return payload, false
+		}
+
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must be valid JSON.")
+		return payload, false
+	}
+
+	if err := decoder.Decode(&struct{}{}); !errors.Is(err, io.EOF) {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must contain a single JSON object.")
+		return payload, false
+	}
+
+	return payload, true
+}
+
+func decodeProjectItemRequest(w http.ResponseWriter, r *http.Request) (createProjectItemRequest, bool) {
+	var payload createProjectItemRequest
+
+	decoder := json.NewDecoder(r.Body)
+	decoder.DisallowUnknownFields()
+
+	if err := decoder.Decode(&payload); err != nil {
+		if errors.Is(err, io.EOF) {
+			WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body is required and must be valid JSON.")
+			return payload, false
+		}
+
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must be valid JSON.")
+		return payload, false
+	}
+
+	if err := decoder.Decode(&struct{}{}); !errors.Is(err, io.EOF) {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must contain a single JSON object.")
+		return payload, false
+	}
+
+	return payload, true
+}
+
+func decodeMoveProjectItemRequest(w http.ResponseWriter, r *http.Request) (moveProjectItemRequest, bool) {
+	var payload moveProjectItemRequest
+
+	decoder := json.NewDecoder(r.Body)
+	decoder.DisallowUnknownFields()
+
+	if err := decoder.Decode(&payload); err != nil {
+		if errors.Is(err, io.EOF) {
+			WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body is required and must be valid JSON.")
+			return payload, false
+		}
+
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must be valid JSON.")
+		return payload, false
+	}
+
+	if err := decoder.Decode(&struct{}{}); !errors.Is(err, io.EOF) {
+		WriteError(w, http.StatusBadRequest, RequestIDFromContext(r.Context()), "invalid_json", "The request body must contain a single JSON object.")
+		return payload, false
+	}
+
+	return payload, true
+}

Backend/internal/httpx/api_routes.go

@@ -0,0 +1,85 @@
+// Path: Backend/internal/httpx/api_routes.go
+
+package httpx
+
+import (
+	"net/http"
+
+	"github.com/go-chi/chi/v5"
+)
+
+type apiRoutes struct {
+	cfg RouterConfig
+}
+
+func newAPIRoutes(cfg RouterConfig) routeRegistrar {
+	return apiRoutes{cfg: cfg}
+}
+
+func (routes apiRoutes) Register(router chi.Router) {
+	router.Route("/v1", func(apiRouter chi.Router) {
+		apiRouter.Get("/", routes.handleIndex)
+		apiRouter.Get("/bootstrap", routes.handleBootstrapOverview)
+		apiRouter.Get("/bootstrap/installation", routes.handleBootstrapInstallation)
+		apiRouter.Get("/bootstrap/admin", routes.handleBootstrapAdmin)
+		apiRouter.Get("/bootstrap/structure", routes.handleBootstrapStructure)
+		apiRouter.Get("/bootstrap/state", routes.handleBootstrapState)
+		apiRouter.Route("/bootstrap/steps", func(bootstrapRouter chi.Router) {
+			bootstrapRouter.Post("/instance", routes.handleBootstrapInstanceStep)
+			bootstrapRouter.Post("/mode", routes.handleBootstrapModeStep)
+			bootstrapRouter.Post("/admin", routes.handleBootstrapAdminStep)
+			bootstrapRouter.Post("/structure", routes.handleBootstrapStructureStep)
+		})
+		apiRouter.Get("/app-shell", routes.handleAppShellState)
+		apiRouter.Get("/organizations", routes.handleOrganizations)
+		apiRouter.Get("/workspaces", routes.handleWorkspaces)
+		apiRouter.Route("/projects/{projectId}", func(projectRouter chi.Router) {
+			projectRouter.Get("/folders", routes.handleProjectFolders)
+			projectRouter.Post("/folders", routes.handleCreateProjectFolder)
+			projectRouter.Patch("/folders", routes.handleRenameProjectFolder)
+			projectRouter.Patch("/folders/move", routes.handleMoveProjectFolder)
+			projectRouter.Delete("/folders", routes.handleDeleteProjectFolder)
+			projectRouter.Get("/tree", routes.handleProjectTree)
+			projectRouter.Get("/tree/folders", routes.handleProjectTreeFolders)
+			projectRouter.Post("/tree/folders", routes.handleCreateProjectTreeFolder)
+			projectRouter.Patch("/tree/folders", routes.handleRenameProjectTreeFolder)
+			projectRouter.Patch("/tree/folders/move", routes.handleMoveProjectTreeFolder)
+			projectRouter.Delete("/tree/folders", routes.handleDeleteProjectTreeFolder)
+			projectRouter.Post("/tree/items", routes.handleCreateProjectTreeItem)
+			projectRouter.Patch("/tree/items/move", routes.handleMoveProjectTreeItem)
+			projectRouter.Delete("/tree/items", routes.handleDeleteProjectTreeItem)
+		})
+
+		if routes.cfg.Config.IsDevelopment() {
+			apiRouter.Post("/dev/bootstrap/reset", routes.handleDevelopmentBootstrapReset)
+		}
+	})
+}
+
+func (routes apiRoutes) handleIndex(w http.ResponseWriter, _ *http.Request) {
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"service": routes.cfg.ServiceName,
+		"version": "v1",
+		"status":  "scaffolded",
+	})
+}
+
+func (routes apiRoutes) handleOrganizations(w http.ResponseWriter, _ *http.Request) {
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": []any{},
+		"meta": map[string]any{
+			"resource": "organizations",
+			"count":    0,
+		},
+	})
+}
+
+func (routes apiRoutes) handleWorkspaces(w http.ResponseWriter, _ *http.Request) {
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"data": []any{},
+		"meta": map[string]any{
+			"resource": "workspaces",
+			"count":    0,
+		},
+	})
+}

Backend/internal/httpx/middleware.go

@@ -0,0 +1,80 @@
+// Path: Backend/internal/httpx/middleware.go
+
+package httpx
+
+import (
+	"context"
+	"log/slog"
+	"net/http"
+	"time"
+
+	"github.com/google/uuid"
+)
+
+type contextKey string
+
+const requestIDContextKey contextKey = "requestID"
+
+type statusRecorder struct {
+	http.ResponseWriter
+	statusCode int
+}
+
+func (r *statusRecorder) WriteHeader(statusCode int) {
+	r.statusCode = statusCode
+	r.ResponseWriter.WriteHeader(statusCode)
+}
+
+func RequestID(next http.Handler) http.Handler {
+	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+		requestID := uuid.NewString()
+		ctx := context.WithValue(r.Context(), requestIDContextKey, requestID)
+		w.Header().Set("X-Request-ID", requestID)
+		next.ServeHTTP(w, r.WithContext(ctx))
+	})
+}
+
+func Recoverer(logger *slog.Logger) func(http.Handler) http.Handler {
+	return func(next http.Handler) http.Handler {
+		return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+			defer func() {
+				if recovered := recover(); recovered != nil {
+					requestID := RequestIDFromContext(r.Context())
+					logger.Error("panic recovered", "request_id", requestID, "panic", recovered, "path", r.URL.Path)
+					WriteError(w, http.StatusInternalServerError, requestID, "internal_error", "An unexpected error occurred.")
+				}
+			}()
+
+			next.ServeHTTP(w, r)
+		})
+	}
+}
+
+func RequestLogger(logger *slog.Logger) func(http.Handler) http.Handler {
+	return func(next http.Handler) http.Handler {
+		return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+			startedAt := time.Now()
+			recorder := &statusRecorder{ResponseWriter: w, statusCode: http.StatusOK}
+
+			next.ServeHTTP(recorder, r)
+
+			logger.Info(
+				"http request",
+				"request_id", RequestIDFromContext(r.Context()),
+				"method", r.Method,
+				"path", r.URL.Path,
+				"status", recorder.statusCode,
+				"duration", time.Since(startedAt).String(),
+			)
+		})
+	}
+}
+
+func RequestIDFromContext(ctx context.Context) string {
+	requestID, ok := ctx.Value(requestIDContextKey).(string)
+	if !ok {
+		return ""
+	}
+
+	return requestID
+}

Backend/internal/httpx/response.go

@@ -0,0 +1,33 @@
+// Path: Backend/internal/httpx/response.go
+
+package httpx
+
+import (
+	"encoding/json"
+	"net/http"
+)
+
+type ErrorResponse struct {
+	Error     string `json:"error"`
+	Message   string `json:"message"`
+	RequestID string `json:"requestId,omitempty"`
+}
+
+func WriteJSON(w http.ResponseWriter, status int, payload any) {
+	w.Header().Set("Content-Type", "application/json; charset=utf-8")
+	w.WriteHeader(status)
+
+	if payload == nil {
+		return
+	}
+
+	_ = json.NewEncoder(w).Encode(payload)
+}
+
+func WriteError(w http.ResponseWriter, status int, requestID, code, message string) {
+	WriteJSON(w, status, ErrorResponse{
+		Error:     code,
+		Message:   message,
+		RequestID: requestID,
+	})
+}

Backend/internal/httpx/router.go

@@ -0,0 +1,70 @@
+// Path: Backend/internal/httpx/router.go
+
+package httpx
+
+import (
+	"log/slog"
+	"net/http"
+	"strings"
+
+	"github.com/go-chi/chi/v5"
+	chimiddleware "github.com/go-chi/chi/v5/middleware"
+
+	"moku-backend/internal/buildinfo"
+	"moku-backend/internal/cache"
+	"moku-backend/internal/config"
+	"moku-backend/internal/database"
+)
+
+type RouterConfig struct {
+	ServiceName string
+	Config      *config.Config
+	Logger      *slog.Logger
+	BuildInfo   buildinfo.Info
+	Database    *database.DB
+	Cache       *cache.Client
+}
+
+type routeRegistrar interface {
+	Register(chi.Router)
+}
+
+func NewRouter(cfg RouterConfig) http.Handler {
+	router := chi.NewRouter()
+
+	registerMiddleware(router, cfg)
+	registerRoutes(router, routesForService(cfg)...)
+	router.NotFound(notFoundHandler)
+
+	return router
+}
+
+func registerMiddleware(router chi.Router, cfg RouterConfig) {
+	router.Use(chimiddleware.RealIP)
+	router.Use(RequestID)
+	router.Use(Recoverer(cfg.Logger))
+	router.Use(RequestLogger(cfg.Logger))
+}
+
+func registerRoutes(router chi.Router, registrars ...routeRegistrar) {
+	for _, registrar := range registrars {
+		registrar.Register(router)
+	}
+}
+
+func routesForService(cfg RouterConfig) []routeRegistrar {
+	registrars := []routeRegistrar{newSharedRoutes(cfg)}
+
+	switch strings.ToLower(cfg.ServiceName) {
+	case "web":
+		registrars = append(registrars, newWebRoutes(cfg))
+	case "api":
+		registrars = append(registrars, newAPIRoutes(cfg))
+	}
+
+	return registrars
+}
+
+func notFoundHandler(w http.ResponseWriter, r *http.Request) {
+	WriteError(w, http.StatusNotFound, RequestIDFromContext(r.Context()), "not_found", "The requested endpoint does not exist.")
+}

Backend/internal/httpx/shared_routes.go

@@ -0,0 +1,69 @@
+// Path: Backend/internal/httpx/shared_routes.go
+
+package httpx
+
+import (
+	"context"
+	"net/http"
+	"time"
+
+	"github.com/go-chi/chi/v5"
+)
+
+type sharedRoutes struct {
+	cfg RouterConfig
+}
+
+func newSharedRoutes(cfg RouterConfig) routeRegistrar {
+	return sharedRoutes{cfg: cfg}
+}
+
+func (routes sharedRoutes) Register(router chi.Router) {
+	router.Get("/", routes.handleIndex)
+	router.Get("/health", routes.handleHealth)
+	router.Get("/version", routes.handleVersion)
+}
+
+func (routes sharedRoutes) handleIndex(w http.ResponseWriter, _ *http.Request) {
+	WriteJSON(w, http.StatusOK, map[string]string{
+		"service": routes.cfg.ServiceName,
+		"status":  "ok",
+	})
+}
+
+func (routes sharedRoutes) handleHealth(w http.ResponseWriter, r *http.Request) {
+	ctx, cancel := context.WithTimeout(r.Context(), 2*time.Second)
+	defer cancel()
+
+	databaseStatus := "ok"
+	if err := routes.cfg.Database.Health(ctx); err != nil {
+		databaseStatus = err.Error()
+	}
+
+	cacheStatus := "ok"
+	if err := routes.cfg.Cache.Health(ctx); err != nil {
+		cacheStatus = err.Error()
+	}
+
+	statusCode := http.StatusOK
+	if databaseStatus != "ok" || cacheStatus != "ok" {
+		statusCode = http.StatusServiceUnavailable
+	}
+
+	WriteJSON(w, statusCode, map[string]any{
+		"service": routes.cfg.ServiceName,
+		"status": map[string]string{
+			"database": databaseStatus,
+			"cache":    cacheStatus,
+		},
+	})
+}
+
+func (routes sharedRoutes) handleVersion(w http.ResponseWriter, _ *http.Request) {
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"service":     routes.cfg.ServiceName,
+		"app":         routes.cfg.Config.AppName,
+		"environment": routes.cfg.Config.Environment,
+		"build":       routes.cfg.BuildInfo,
+	})
+}

Backend/internal/httpx/web_routes.go

@@ -0,0 +1,51 @@
+// Path: Backend/internal/httpx/web_routes.go
+
+package httpx
+
+import (
+	"net/http"
+
+	"github.com/go-chi/chi/v5"
+)
+
+type webRoutes struct {
+	cfg RouterConfig
+}
+
+func newWebRoutes(cfg RouterConfig) routeRegistrar {
+	return webRoutes{cfg: cfg}
+}
+
+func (routes webRoutes) Register(router chi.Router) {
+	router.Get("/session", routes.handleSession)
+	router.Get("/bootstrap", routes.handleBootstrap)
+	router.Get("/me", routes.handleCurrentUser)
+}
+
+func (routes webRoutes) handleSession(w http.ResponseWriter, _ *http.Request) {
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"service": routes.cfg.ServiceName,
+		"session": map[string]any{
+			"authenticated": false,
+			"mode":          "cookie",
+		},
+	})
+}
+
+func (routes webRoutes) handleBootstrap(w http.ResponseWriter, _ *http.Request) {
+	WriteJSON(w, http.StatusOK, map[string]any{
+		"service": routes.cfg.ServiceName,
+		"app": map[string]any{
+			"name":        routes.cfg.Config.AppName,
+			"environment": routes.cfg.Config.Environment,
+		},
+		"features": map[string]bool{
+			"auth":       false,
+			"workspaces": false,
+		},
+	})
+}
+
+func (routes webRoutes) handleCurrentUser(w http.ResponseWriter, r *http.Request) {
+	WriteError(w, http.StatusNotImplemented, RequestIDFromContext(r.Context()), "not_implemented", "The current user endpoint is scaffolded but not implemented yet.")
+}

Backend/internal/jobs/store.go

@@ -0,0 +1,196 @@
+package jobs
+
+import (
+	"context"
+	"encoding/json"
+	"strings"
+	"time"
+
+	"github.com/jackc/pgx/v5"
+
+	"moku-backend/internal/database"
+)
+
+const (
+	KindBootstrapStructureMaterialize = "bootstrap.structure.materialize"
+)
+
+type Status string
+
+const (
+	StatusPending   Status = "pending"
+	StatusRunning   Status = "running"
+	StatusSucceeded Status = "succeeded"
+	StatusFailed    Status = "failed"
+)
+
+type BootstrapStructureMaterializePayload struct {
+	InstallationID string `json:"installationId"`
+}
+
+type Job struct {
+	ID          string
+	Kind        string
+	Status      Status
+	Payload     json.RawMessage
+	Attempts    int
+	MaxAttempts int
+	AvailableAt time.Time
+	StartedAt   *time.Time
+	FinishedAt  *time.Time
+	LastError   *string
+	CreatedAt   time.Time
+	UpdatedAt   time.Time
+}
+
+type EnqueueInput struct {
+	Kind        string
+	Payload     any
+	AvailableAt time.Time
+	MaxAttempts int
+}
+
+type Store struct {
+	db *database.DB
+}
+
+func NewStore(db *database.DB) *Store {
+	return &Store{db: db}
+}
+
+func (store *Store) Enqueue(ctx context.Context, input EnqueueInput) (Job, error) {
+	payload := json.RawMessage([]byte(`{}`))
+	if input.Payload != nil {
+		encoded, err := json.Marshal(input.Payload)
+		if err != nil {
+			return Job{}, err
+		}
+		payload = encoded
+	}
+
+	availableAt := input.AvailableAt
+	if availableAt.IsZero() {
+		availableAt = time.Now().UTC()
+	}
+
+	maxAttempts := input.MaxAttempts
+	if maxAttempts < 1 {
+		maxAttempts = 1
+	}
+
+	return scanJob(store.db.Pool.QueryRow(ctx, `
+		INSERT INTO background_jobs (kind, status, payload, attempts, max_attempts, available_at)
+		VALUES ($1, 'pending'::background_job_status, $2::jsonb, 0, $3, $4)
+		RETURNING
+			id::text,
+			kind,
+			status::text,
+			payload,
+			attempts,
+			max_attempts,
+			available_at,
+			started_at,
+			finished_at,
+			last_error,
+			created_at,
+			updated_at;
+	`, strings.TrimSpace(input.Kind), payload, maxAttempts, availableAt))
+}
+
+func (store *Store) ClaimNext(ctx context.Context) (*Job, error) {
+	job, err := scanJob(store.db.Pool.QueryRow(ctx, `
+		WITH next_job AS (
+			SELECT id
+			FROM background_jobs
+			WHERE status = 'pending'::background_job_status
+				AND available_at <= NOW()
+			ORDER BY created_at ASC
+			LIMIT 1
+			FOR UPDATE SKIP LOCKED
+		)
+		UPDATE background_jobs AS jobs
+		SET
+			status = 'running'::background_job_status,
+			attempts = jobs.attempts + 1,
+			started_at = NOW(),
+			finished_at = NULL,
+			last_error = NULL,
+			updated_at = NOW()
+		FROM next_job
+		WHERE jobs.id = next_job.id
+		RETURNING
+			jobs.id::text,
+			jobs.kind,
+			jobs.status::text,
+			jobs.payload,
+			jobs.attempts,
+			jobs.max_attempts,
+			jobs.available_at,
+			jobs.started_at,
+			jobs.finished_at,
+			jobs.last_error,
+			jobs.created_at,
+			jobs.updated_at;
+	`))
+	if err != nil {
+		if err == pgx.ErrNoRows {
+			return nil, nil
+		}
+
+		return nil, err
+	}
+
+	return &job, nil
+}
+
+func (store *Store) MarkSucceeded(ctx context.Context, jobID string) error {
+	_, err := store.db.Pool.Exec(ctx, `
+		UPDATE background_jobs
+		SET
+			status = 'succeeded'::background_job_status,
+			finished_at = NOW(),
+			last_error = NULL,
+			updated_at = NOW()
+		WHERE id = $1::uuid;
+	`, strings.TrimSpace(jobID))
+
+	return err
+}
+
+func (store *Store) MarkFailed(ctx context.Context, jobID, failure string) error {
+	_, err := store.db.Pool.Exec(ctx, `
+		UPDATE background_jobs
+		SET
+			status = 'failed'::background_job_status,
+			finished_at = NOW(),
+			last_error = $2,
+			updated_at = NOW()
+		WHERE id = $1::uuid;
+	`, strings.TrimSpace(jobID), strings.TrimSpace(failure))
+
+	return err
+}
+
+func scanJob(row pgx.Row) (Job, error) {
+	var job Job
+	var status string
+	if err := row.Scan(
+		&job.ID,
+		&job.Kind,
+		&status,
+		&job.Payload,
+		&job.Attempts,
+		&job.MaxAttempts,
+		&job.AvailableAt,
+		&job.StartedAt,
+		&job.FinishedAt,
+		&job.LastError,
+		&job.CreatedAt,
+		&job.UpdatedAt,
+	); err != nil {
+		return Job{}, err
+	}
+
+	job.Status = Status(status)
+	return job, nil
+}

Backend/internal/posixproj/projector.go

@@ -0,0 +1,553 @@
+package posixproj
+
+import (
+	"context"
+	"crypto/sha256"
+	"encoding/hex"
+	"encoding/json"
+	"fmt"
+	"io/fs"
+	"os"
+	"path/filepath"
+	"strings"
+
+	"moku-backend/internal/database"
+)
+
+const rootProjectionPath = "/"
+
+type Projector struct {
+	db   *database.DB
+	root string
+}
+
+type RebuildSummary struct {
+	TotalNodes      int
+	DirectoryCount  int
+	FileCount       int
+}
+
+type NodeKind string
+
+const (
+	NodeKindDirectory NodeKind = "directory"
+	NodeKindFile      NodeKind = "file"
+)
+
+type Scope struct {
+	InstallationID  string
+	OrganizationID  string
+	OrganizationSlug string
+	DepartmentSlug  string
+	TeamSlug        string
+	ProjectSlug     string
+	PersonalSlug    string
+}
+
+type Node struct {
+	Path            string
+	ParentPath      *string
+	Name            string
+	Depth           int
+	NodeKind        NodeKind
+	LogicalType     string
+	FileRole        string
+	ResourceID      string
+	ResourceName    string
+	ResourceSlug    string
+	InstallationID  string
+	OrganizationID  string
+	OrganizationSlug string
+	DepartmentSlug  string
+	TeamSlug        string
+	ProjectSlug     string
+	PersonalSlug    string
+	ContentJSON     []byte
+	SizeBytes       int64
+	Checksum        string
+}
+
+func NewProjector(db *database.DB, root string) *Projector {
+	return &Projector{db: db, root: strings.TrimSpace(root)}
+}
+
+func (projector *Projector) Rebuild(ctx context.Context) error {
+	_, err := projector.RebuildWithSummary(ctx)
+	return err
+}
+
+func (projector *Projector) RebuildWithSummary(ctx context.Context) (RebuildSummary, error) {
+	if projector == nil || projector.db == nil || projector.db.Pool == nil {
+		return RebuildSummary{}, nil
+	}
+
+	nodes, err := ScanRoot(projector.root)
+	if err != nil {
+		return RebuildSummary{}, err
+	}
+
+	summary := summarizeNodes(nodes)
+
+	tx, err := projector.db.Pool.Begin(ctx)
+	if err != nil {
+		return RebuildSummary{}, err
+	}
+	defer func() {
+		_ = tx.Rollback(ctx)
+	}()
+
+	if _, err := tx.Exec(ctx, `DELETE FROM posix_nodes;`); err != nil {
+		return RebuildSummary{}, fmt.Errorf("clear posix_nodes: %w", err)
+	}
+
+	for _, node := range nodes {
+		if _, err := tx.Exec(ctx, `
+			INSERT INTO posix_nodes (
+				path,
+				parent_path,
+				name,
+				depth,
+				node_kind,
+				logical_type,
+				file_role,
+				resource_id,
+				resource_name,
+				resource_slug,
+				installation_id,
+				organization_id,
+				organization_slug,
+				department_slug,
+				team_slug,
+				project_slug,
+				personal_slug,
+				content_json,
+				size_bytes,
+				checksum
+			) VALUES (
+				$1, $2, $3, $4, $5::posix_node_kind, $6, $7, $8, $9, $10,
+				$11, $12, $13, $14, $15, $16, $17, $18::jsonb, $19, $20
+			);
+		`,
+			node.Path,
+			node.ParentPath,
+			node.Name,
+			node.Depth,
+			string(node.NodeKind),
+			node.LogicalType,
+			node.FileRole,
+			node.ResourceID,
+			node.ResourceName,
+			node.ResourceSlug,
+			node.InstallationID,
+			node.OrganizationID,
+			node.OrganizationSlug,
+			node.DepartmentSlug,
+			node.TeamSlug,
+			node.ProjectSlug,
+			node.PersonalSlug,
+				node.ContentJSON,
+				node.SizeBytes,
+				node.Checksum,
+		); err != nil {
+			return RebuildSummary{}, fmt.Errorf("insert posix node %s: %w", node.Path, err)
+		}
+	}
+
+	if err := tx.Commit(ctx); err != nil {
+		return RebuildSummary{}, err
+	}
+
+	return summary, nil
+}
+
+func ScanRoot(root string) ([]Node, error) {
+	rootPath := strings.TrimSpace(root)
+	if rootPath == "" {
+		return nil, nil
+	}
+
+	info, err := os.Stat(rootPath)
+	if err != nil {
+		return nil, fmt.Errorf("stat POSIX root: %w", err)
+	}
+	if !info.IsDir() {
+		return nil, fmt.Errorf("POSIX root is not a directory: %s", rootPath)
+	}
+
+	rootScope, err := loadRootScope(rootPath)
+	if err != nil {
+		return nil, err
+	}
+
+	nodes := []Node{{
+		Path:             rootProjectionPath,
+		ParentPath:       nil,
+		Name:             filepath.Base(rootPath),
+		Depth:            0,
+		NodeKind:         NodeKindDirectory,
+		LogicalType:      "tenant_root",
+		InstallationID:   rootScope.InstallationID,
+		OrganizationID:   rootScope.OrganizationID,
+		OrganizationSlug: rootScope.OrganizationSlug,
+	}}
+
+	err = filepath.WalkDir(rootPath, func(path string, entry fs.DirEntry, walkErr error) error {
+		if walkErr != nil {
+			return walkErr
+		}
+		if path == rootPath {
+			return nil
+		}
+
+		relPath, err := filepath.Rel(rootPath, path)
+		if err != nil {
+			return err
+		}
+		relPath = filepath.ToSlash(relPath)
+		if relPath == "." {
+			return nil
+		}
+
+		node, err := buildNode(rootPath, relPath, entry, rootScope)
+		if err != nil {
+			return err
+		}
+
+		nodes = append(nodes, node)
+		return nil
+	})
+	if err != nil {
+		return nil, fmt.Errorf("scan POSIX root: %w", err)
+	}
+
+	return nodes, nil
+}
+
+func loadRootScope(rootPath string) (Scope, error) {
+	settingsPath := filepath.Join(rootPath, "settings.json")
+	content, err := os.ReadFile(settingsPath)
+	if err != nil {
+		if errorsIsNotExist(err) {
+			return Scope{}, nil
+		}
+		return Scope{}, fmt.Errorf("read root settings.json: %w", err)
+	}
+
+	var payload map[string]any
+	if err := json.Unmarshal(content, &payload); err != nil {
+		return Scope{}, fmt.Errorf("decode root settings.json: %w", err)
+	}
+
+	installation, _ := payload["installation"].(map[string]any)
+	organization, _ := payload["organization"].(map[string]any)
+
+	return Scope{
+		InstallationID:  stringValue(installation["id"]),
+		OrganizationID:  stringValue(organization["id"]),
+		OrganizationSlug: stringValue(organization["slug"]),
+	}, nil
+}
+
+func buildNode(rootPath, relPath string, entry fs.DirEntry, rootScope Scope) (Node, error) {
+	scope := deriveScope(relPath, rootScope)
+	parentPath := projectionParentPath(relPath)
+	logicalType, fileRole := classifyPath(relPath, entry.IsDir())
+
+	node := Node{
+		Path:             relPath,
+		ParentPath:       parentPath,
+		Name:             entry.Name(),
+		Depth:            strings.Count(relPath, "/") + 1,
+		NodeKind:         NodeKindDirectory,
+		LogicalType:      logicalType,
+		FileRole:         fileRole,
+		InstallationID:   scope.InstallationID,
+		OrganizationID:   scope.OrganizationID,
+		OrganizationSlug: scope.OrganizationSlug,
+		DepartmentSlug:   scope.DepartmentSlug,
+		TeamSlug:         scope.TeamSlug,
+		ProjectSlug:      scope.ProjectSlug,
+		PersonalSlug:     scope.PersonalSlug,
+	}
+
+	if entry.IsDir() {
+		return node, nil
+	}
+
+	absPath := filepath.Join(rootPath, filepath.FromSlash(relPath))
+	content, err := os.ReadFile(absPath)
+	if err != nil {
+		return Node{}, fmt.Errorf("read POSIX file %s: %w", relPath, err)
+	}
+
+	hash := sha256.Sum256(content)
+	node.NodeKind = NodeKindFile
+	node.SizeBytes = int64(len(content))
+	node.Checksum = hex.EncodeToString(hash[:])
+
+	if strings.EqualFold(filepath.Ext(entry.Name()), ".json") {
+		var payload map[string]any
+		if err := json.Unmarshal(content, &payload); err == nil {
+			jsonContent, err := json.Marshal(payload)
+			if err != nil {
+				return Node{}, fmt.Errorf("remarshal POSIX file %s: %w", relPath, err)
+			}
+			node.ContentJSON = jsonContent
+			node.ResourceID = stringValue(payload["id"])
+			node.ResourceName = stringValue(payload["name"])
+			node.ResourceSlug = stringValue(payload["slug"])
+			if node.ResourceID == "" && fileRole == "settings" && logicalType == "tenant" {
+				installation, _ := payload["installation"].(map[string]any)
+				organization, _ := payload["organization"].(map[string]any)
+				node.ResourceID = stringValue(installation["id"])
+				node.ResourceName = stringValue(installation["name"])
+				node.InstallationID = stringValue(installation["id"])
+				node.OrganizationID = stringValue(organization["id"])
+				node.OrganizationSlug = firstNonEmpty(node.OrganizationSlug, stringValue(organization["slug"]))
+			}
+			if node.ResourceID == "" && fileRole == "users" {
+				node.ResourceName = firstNonEmpty(node.ResourceName, parentEntityName(logicalType, scope))
+			}
+		}
+	}
+
+	if node.ResourceSlug == "" {
+		node.ResourceSlug = inferredResourceSlug(logicalType, scope)
+	}
+
+	return node, nil
+}
+
+func deriveScope(relPath string, rootScope Scope) Scope {
+	scope := rootScope
+	parts := strings.Split(relPath, "/")
+	for _, part := range parts {
+		switch {
+		case strings.HasPrefix(part, "department-"):
+			scope.DepartmentSlug = strings.TrimPrefix(part, "department-")
+		case strings.HasPrefix(part, "team-"):
+			scope.TeamSlug = strings.TrimPrefix(part, "team-")
+		case strings.HasPrefix(part, "project-"):
+			scope.ProjectSlug = strings.TrimPrefix(part, "project-")
+		case strings.HasPrefix(part, "personal-"):
+			scope.PersonalSlug = strings.TrimPrefix(part, "personal-")
+		}
+	}
+	return scope
+}
+
+func classifyPath(relPath string, isDir bool) (logicalType, fileRole string) {
+	parts := strings.Split(relPath, "/")
+	name := parts[len(parts)-1]
+	if !isDir {
+		fileRole = strings.TrimSuffix(name, filepath.Ext(name))
+	}
+
+	hasChildrenAncestor := pathContainsSegment(parts, "children")
+	hasTreeAncestor := pathContainsSegment(parts, "tree")
+	parentName := ""
+	if len(parts) >= 2 {
+		parentName = parts[len(parts)-2]
+	}
+
+	switch {
+	case relPath == "settings.json":
+		return "tenant", "settings"
+	case relPath == "layout.json":
+		return "tenant", "layout"
+	case len(parts) >= 1 && parts[0] == "catalog":
+		if isDir {
+			if len(parts) == 1 {
+				return "catalog", ""
+			}
+			if len(parts) >= 2 && parts[1] == "packs" {
+				if len(parts) == 2 {
+					return "catalog_packs", ""
+				}
+				if len(parts) == 3 {
+					return "catalog_pack", ""
+				}
+				if len(parts) >= 4 && parts[3] == "entries" {
+					return "catalog_pack_entries", ""
+				}
+				return "catalog_entry", ""
+			}
+			if len(parts) >= 2 && parts[1] == "standalone" {
+				if len(parts) == 2 {
+					return "catalog_standalone", ""
+				}
+				return "catalog_entry", ""
+			}
+		}
+		return "catalog", fileRole
+	case len(parts) >= 2 && parts[0] == "departments" && strings.HasPrefix(parts[1], "department-"):
+		if isDir {
+			if len(parts) == 2 {
+				return "department", ""
+			}
+			if len(parts) == 3 && parts[2] == "teams" {
+				return "department_teams", ""
+			}
+			if len(parts) >= 4 && strings.HasPrefix(parts[3], "team-") {
+				return "team", ""
+			}
+		}
+		if len(parts) >= 4 && strings.HasPrefix(parts[3], "team-") {
+			return "team", fileRole
+		}
+		return "department", fileRole
+	case len(parts) >= 2 && parts[0] == "projects" && strings.HasPrefix(parts[1], "project-"):
+		if isDir {
+			if strings.HasPrefix(name, "project-") {
+				return "project", ""
+			}
+			if name == "children" {
+				return "project_children", ""
+			}
+			if name == "tree" {
+				return "project_tree", ""
+			}
+			if hasChildrenAncestor && strings.HasPrefix(name, "folder-") {
+				return "hierarchy_folder", ""
+			}
+			if hasTreeAncestor && strings.HasPrefix(name, "folder-") {
+				return "hierarchy_folder", ""
+			}
+			if hasTreeAncestor && strings.HasPrefix(name, "item-") {
+				return "item", ""
+			}
+		}
+		if hasChildrenAncestor && strings.HasPrefix(parentName, "folder-") {
+			return "hierarchy_folder", fileRole
+		}
+		if hasTreeAncestor {
+			if strings.HasPrefix(parentName, "item-") {
+				return "item", fileRole
+			}
+			if strings.HasPrefix(parentName, "folder-") {
+				return "hierarchy_folder", fileRole
+			}
+		}
+		return "project", fileRole
+	case len(parts) >= 1 && parts[0] == "users":
+		if isDir {
+			if len(parts) == 1 {
+				return "users", ""
+			}
+			if len(parts) == 2 && parts[1] == "personals" {
+				return "personals", ""
+			}
+			if len(parts) >= 3 && parts[1] == "personals" && strings.HasPrefix(parts[2], "personal-") {
+				return "personal", ""
+			}
+			if strings.Contains(relPath, "/tree/") || strings.HasSuffix(relPath, "/tree") {
+				if strings.HasPrefix(name, "folder-") {
+					return "folder", ""
+				}
+				if strings.HasPrefix(name, "item-") {
+					return "item", ""
+				}
+			}
+		}
+		if len(parts) >= 3 && parts[1] == "personals" && strings.HasPrefix(parts[2], "personal-") {
+			if strings.Contains(relPath, "/tree/") {
+				if strings.HasPrefix(parts[len(parts)-2], "item-") {
+					return "item", fileRole
+				}
+				if strings.HasPrefix(parts[len(parts)-2], "folder-") {
+					return "folder", fileRole
+				}
+			}
+			return "personal", fileRole
+		}
+		return "users", fileRole
+	default:
+		if isDir {
+			return "directory", ""
+		}
+		return "file", fileRole
+	}
+}
+
+func pathContainsSegment(parts []string, target string) bool {
+	for _, part := range parts {
+		if part == target {
+			return true
+		}
+	}
+	return false
+}
+
+func projectionParentPath(relPath string) *string {
+	if relPath == "" || relPath == rootProjectionPath {
+		return nil
+	}
+	parent := filepath.ToSlash(filepath.Dir(relPath))
+	if parent == "." || parent == "" {
+		root := rootProjectionPath
+		return &root
+	}
+	return &parent
+}
+
+func inferredResourceSlug(logicalType string, scope Scope) string {
+	switch logicalType {
+	case "department":
+		return scope.DepartmentSlug
+	case "team":
+		return scope.TeamSlug
+	case "project":
+		return scope.ProjectSlug
+	case "personal":
+		return scope.PersonalSlug
+	default:
+		return ""
+	}
+}
+
+func parentEntityName(logicalType string, scope Scope) string {
+	switch logicalType {
+	case "department":
+		return scope.DepartmentSlug
+	case "team":
+		return scope.TeamSlug
+	case "project":
+		return scope.ProjectSlug
+	case "personal":
+		return scope.PersonalSlug
+	default:
+		return ""
+	}
+}
+
+func stringValue(value any) string {
+	stringValue, _ := value.(string)
+	return strings.TrimSpace(stringValue)
+}
+
+func firstNonEmpty(values ...string) string {
+	for _, value := range values {
+		trimmed := strings.TrimSpace(value)
+		if trimmed != "" {
+			return trimmed
+		}
+	}
+	return ""
+}
+
+func summarizeNodes(nodes []Node) RebuildSummary {
+	summary := RebuildSummary{TotalNodes: len(nodes)}
+	for _, node := range nodes {
+		switch node.NodeKind {
+		case NodeKindDirectory:
+			summary.DirectoryCount++
+		case NodeKindFile:
+			summary.FileCount++
+		}
+	}
+	return summary
+}
+
+func errorsIsNotExist(err error) bool {
+	return err != nil && os.IsNotExist(err)
+}

Backend/internal/posixproj/projector_test.go

@@ -0,0 +1,232 @@
+package posixproj
+
+import (
+	"encoding/json"
+	"os"
+	"path/filepath"
+	"testing"
+)
+
+func TestScanRootBuildsProjectedNodesFromBootstrapShape(t *testing.T) {
+	root := filepath.Join(t.TempDir(), "POSIX")
+
+	mustMkdirAll(t, filepath.Join(root, "catalog", "packs"))
+	mustMkdirAll(t, filepath.Join(root, "catalog", "standalone"))
+	mustMkdirAll(t, filepath.Join(root, "departments", "department-primary-department", "teams", "team-primary-team"))
+	mustMkdirAll(t, filepath.Join(root, "projects", "project-primary-project", "children", "folder-design", "children", "project-web", "children"))
+	mustMkdirAll(t, filepath.Join(root, "projects", "project-primary-project", "children", "folder-design", "children", "project-web", "tree"))
+	mustMkdirAll(t, filepath.Join(root, "projects", "project-primary-project", "tree"))
+	mustMkdirAll(t, filepath.Join(root, "projects", "project-primary-project", "tree", "folder-docs", "children"))
+	mustMkdirAll(t, filepath.Join(root, "projects", "project-primary-project", "tree", "folder-docs", "item-roadmap"))
+	mustMkdirAll(t, filepath.Join(root, "users", "personals"))
+
+	mustWriteJSON(t, filepath.Join(root, "settings.json"), map[string]any{
+		"installation": map[string]any{
+			"id":             "installation-1",
+			"name":           "MangoPig",
+			"isBootstrapped": true,
+		},
+		"organization": map[string]any{
+			"id":   "org-1",
+			"name": "Primary Organization",
+			"slug": "primary-organization",
+		},
+	})
+	mustWriteJSON(t, filepath.Join(root, "layout.json"), map[string]any{
+		"type": "tenant-layout",
+		"home": map[string]any{"defaultProjectSlug": "primary-project"},
+	})
+	mustWriteJSON(t, filepath.Join(root, "departments", "department-primary-department", "settings.json"), map[string]any{
+		"id":   "dept-1",
+		"name": "Primary Department",
+		"slug": "primary-department",
+		"type": "department",
+	})
+	mustWriteJSON(t, filepath.Join(root, "departments", "department-primary-department", "users.json"), map[string]any{
+		"users": []map[string]any{{"id": "admin-1"}},
+	})
+	mustWriteJSON(t, filepath.Join(root, "departments", "department-primary-department", "teams", "team-primary-team", "settings.json"), map[string]any{
+		"id":   "team-1",
+		"name": "Primary Team",
+		"slug": "primary-team",
+		"type": "team",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "settings.json"), map[string]any{
+		"id":   "project-1",
+		"name": "Primary Project",
+		"slug": "primary-project",
+		"type": "project",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "home.json"), map[string]any{
+		"type":    "project-home",
+		"project": "primary-project",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "acl.json"), map[string]any{
+		"inherits": true,
+		"rules":    []any{},
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "children", "folder-design", "folder.json"), map[string]any{
+		"name": "Design",
+		"slug": "design",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "children", "folder-design", "acl.json"), map[string]any{
+		"inherits": true,
+		"rules":    []any{},
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "children", "folder-design", "children", "project-web", "settings.json"), map[string]any{
+		"id":   "project-2",
+		"name": "Web Project",
+		"slug": "web",
+		"type": "project",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "children", "folder-design", "children", "project-web", "home.json"), map[string]any{
+		"type":    "project-home",
+		"project": "web",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "children", "folder-design", "children", "project-web", "acl.json"), map[string]any{
+		"inherits": true,
+		"rules":    []any{},
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "tree", "folder-docs", "folder.json"), map[string]any{
+		"name": "Docs",
+		"slug": "docs",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "tree", "folder-docs", "item-roadmap", "item.json"), map[string]any{
+		"id":   "item-1",
+		"name": "Roadmap",
+		"slug": "roadmap",
+		"type": "board",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "tree", "folder-docs", "item-roadmap", "schema.json"), map[string]any{
+		"type": "object",
+	})
+	mustWriteJSON(t, filepath.Join(root, "projects", "project-primary-project", "tree", "folder-docs", "item-roadmap", "data.json"), map[string]any{
+		"title": "Roadmap",
+	})
+	mustWriteJSON(t, filepath.Join(root, "users", "settings.json"), map[string]any{
+		"primaryAdminId": "admin-1",
+	})
+	mustWriteJSON(t, filepath.Join(root, "users", "data.json"), map[string]any{
+		"users": []map[string]any{{"id": "admin-1", "email": "ronald@example.com"}},
+	})
+
+	nodes, err := ScanRoot(root)
+	if err != nil {
+		t.Fatalf("ScanRoot() error = %v", err)
+	}
+
+	index := make(map[string]Node, len(nodes))
+	for _, node := range nodes {
+		index[node.Path] = node
+	}
+
+	rootNode, ok := index[rootProjectionPath]
+	if !ok {
+		t.Fatalf("expected synthetic root node")
+	}
+	if rootNode.LogicalType != "tenant_root" {
+		t.Fatalf("expected root logical type tenant_root, got %q", rootNode.LogicalType)
+	}
+	if rootNode.OrganizationSlug != "primary-organization" {
+		t.Fatalf("expected root organization slug primary-organization, got %q", rootNode.OrganizationSlug)
+	}
+
+	tenantSettings := index["settings.json"]
+	if tenantSettings.LogicalType != "tenant" || tenantSettings.FileRole != "settings" {
+		t.Fatalf("unexpected tenant settings classification: %#v", tenantSettings)
+	}
+	if tenantSettings.InstallationID != "installation-1" {
+		t.Fatalf("expected installation id installation-1, got %q", tenantSettings.InstallationID)
+	}
+
+	deptSettings := index["departments/department-primary-department/settings.json"]
+	if deptSettings.DepartmentSlug != "primary-department" {
+		t.Fatalf("expected department slug primary-department, got %q", deptSettings.DepartmentSlug)
+	}
+	if deptSettings.ResourceID != "dept-1" {
+		t.Fatalf("expected department resource id dept-1, got %q", deptSettings.ResourceID)
+	}
+
+	teamSettings := index["departments/department-primary-department/teams/team-primary-team/settings.json"]
+	if teamSettings.TeamSlug != "primary-team" {
+		t.Fatalf("expected team slug primary-team, got %q", teamSettings.TeamSlug)
+	}
+
+	projectSettings := index["projects/project-primary-project/settings.json"]
+	if projectSettings.ProjectSlug != "primary-project" {
+		t.Fatalf("expected project slug primary-project, got %q", projectSettings.ProjectSlug)
+	}
+	if projectSettings.ResourceName != "Primary Project" {
+		t.Fatalf("expected project resource name Primary Project, got %q", projectSettings.ResourceName)
+	}
+
+	projectTree := index["projects/project-primary-project/tree"]
+	if projectTree.LogicalType != "project_tree" || projectTree.NodeKind != NodeKindDirectory {
+		t.Fatalf("unexpected project tree node: %#v", projectTree)
+	}
+
+	projectChildren := index["projects/project-primary-project/children"]
+	if projectChildren.LogicalType != "project_children" || projectChildren.NodeKind != NodeKindDirectory {
+		t.Fatalf("unexpected project children node: %#v", projectChildren)
+	}
+
+	hierarchyFolder := index["projects/project-primary-project/children/folder-design"]
+	if hierarchyFolder.LogicalType != "hierarchy_folder" || hierarchyFolder.ProjectSlug != "primary-project" {
+		t.Fatalf("unexpected hierarchy folder node: %#v", hierarchyFolder)
+	}
+
+	hierarchyFolderACL := index["projects/project-primary-project/children/folder-design/acl.json"]
+	if hierarchyFolderACL.LogicalType != "hierarchy_folder" || hierarchyFolderACL.FileRole != "acl" {
+		t.Fatalf("unexpected hierarchy folder acl classification: %#v", hierarchyFolderACL)
+	}
+
+	childProjectSettings := index["projects/project-primary-project/children/folder-design/children/project-web/settings.json"]
+	if childProjectSettings.LogicalType != "project" || childProjectSettings.ProjectSlug != "web" {
+		t.Fatalf("unexpected child project classification: %#v", childProjectSettings)
+	}
+
+	treeFolder := index["projects/project-primary-project/tree/folder-docs"]
+	if treeFolder.LogicalType != "hierarchy_folder" || treeFolder.ProjectSlug != "primary-project" {
+		t.Fatalf("unexpected tree folder node: %#v", treeFolder)
+	}
+
+	treeFolderACL := index["projects/project-primary-project/tree/folder-docs/folder.json"]
+	if treeFolderACL.LogicalType != "hierarchy_folder" || treeFolderACL.FileRole != "folder" {
+		t.Fatalf("unexpected tree folder file classification: %#v", treeFolderACL)
+	}
+
+	treeItem := index["projects/project-primary-project/tree/folder-docs/item-roadmap/item.json"]
+	if treeItem.LogicalType != "item" || treeItem.FileRole != "item" {
+		t.Fatalf("unexpected tree item classification: %#v", treeItem)
+	}
+	if treeItem.ResourceSlug != "roadmap" {
+		t.Fatalf("expected tree item resource slug roadmap, got %#v", treeItem.ResourceSlug)
+	}
+
+	usersData := index["users/data.json"]
+	if usersData.LogicalType != "users" || usersData.FileRole != "data" {
+		t.Fatalf("unexpected users data classification: %#v", usersData)
+	}
+	if usersData.Checksum == "" || usersData.SizeBytes == 0 {
+		t.Fatalf("expected users/data.json checksum and size to be populated: %#v", usersData)
+	}
+}
+
+func mustMkdirAll(t *testing.T, path string) {
+	t.Helper()
+	if err := os.MkdirAll(path, 0o755); err != nil {
+		t.Fatalf("MkdirAll(%q) error = %v", path, err)
+	}
+}
+
+func mustWriteJSON(t *testing.T, path string, payload any) {
+	t.Helper()
+	bytes, err := json.MarshalIndent(payload, "", "  ")
+	if err != nil {
+		t.Fatalf("MarshalIndent(%q) error = %v", path, err)
+	}
+	bytes = append(bytes, '\n')
+	if err := os.WriteFile(path, bytes, 0o644); err != nil {
+		t.Fatalf("WriteFile(%q) error = %v", path, err)
+	}
+}

Backend/internal/process/process.go

@@ -0,0 +1,65 @@
+// Path: Backend/internal/process/process.go
+
+package process
+
+import (
+	"context"
+	"errors"
+	"fmt"
+	"log/slog"
+	"net/http"
+	"os"
+	"os/signal"
+	"syscall"
+	"time"
+)
+
+func RunHTTPServer(serviceName, address string, handler http.Handler, logger *slog.Logger, shutdownTimeout time.Duration) error {
+	server := &http.Server{
+		Addr:              address,
+		Handler:           handler,
+		ReadHeaderTimeout: 5 * time.Second,
+	}
+
+	serverErr := make(chan error, 1)
+
+	go func() {
+		logger.Info("http server starting", "service", serviceName, "address", address)
+		serverErr <- server.ListenAndServe()
+	}()
+
+	signalCtx, stop := signal.NotifyContext(context.Background(), os.Interrupt, syscall.SIGTERM)
+	defer stop()
+
+	select {
+	case err := <-serverErr:
+		if err != nil && !errors.Is(err, http.ErrServerClosed) {
+			return err
+		}
+		return nil
+	case <-signalCtx.Done():
+		logger.Info("shutdown requested", "service", serviceName)
+	}
+
+	shutdownCtx, cancel := context.WithTimeout(context.Background(), shutdownTimeout)
+	defer cancel()
+
+	if err := server.Shutdown(shutdownCtx); err != nil {
+		return fmt.Errorf("shutdown %s server: %w", serviceName, err)
+	}
+
+	logger.Info("http server stopped", "service", serviceName)
+
+	return nil
+}
+
+func WaitForShutdown(serviceName string, logger *slog.Logger) error {
+	signalCtx, stop := signal.NotifyContext(context.Background(), os.Interrupt, syscall.SIGTERM)
+	defer stop()
+
+	logger.Info("process running", "service", serviceName)
+	<-signalCtx.Done()
+	logger.Info("shutdown requested", "service", serviceName)
+
+	return nil
+}

Backend/internal/worker/runner.go

@@ -0,0 +1,124 @@
+package worker
+
+import (
+	"context"
+	"fmt"
+	"log/slog"
+	"strings"
+	"time"
+
+	"moku-backend/internal/jobs"
+)
+
+type JobStore interface {
+	ClaimNext(ctx context.Context) (*jobs.Job, error)
+	MarkSucceeded(ctx context.Context, jobID string) error
+	MarkFailed(ctx context.Context, jobID, failure string) error
+}
+
+type Handler func(ctx context.Context, job jobs.Job) error
+
+type Runner struct {
+	store        JobStore
+	logger       *slog.Logger
+	pollInterval time.Duration
+	handlers     map[string]Handler
+}
+
+func NewRunner(store JobStore, logger *slog.Logger, pollInterval time.Duration) *Runner {
+	interval := pollInterval
+	if interval <= 0 {
+		interval = time.Second
+	}
+
+	return &Runner{
+		store:        store,
+		logger:       logger,
+		pollInterval: interval,
+		handlers:     make(map[string]Handler),
+	}
+}
+
+func (runner *Runner) Register(kind string, handler Handler) {
+	runner.handlers[strings.TrimSpace(kind)] = handler
+}
+
+func (runner *Runner) Run(ctx context.Context) error {
+	for {
+		select {
+		case <-ctx.Done():
+			return nil
+		default:
+		}
+
+		job, err := runner.store.ClaimNext(ctx)
+		if err != nil {
+			if ctx.Err() != nil {
+				return nil
+			}
+
+			runner.logger.Error("worker claim failed", "error", err)
+
+			if err := waitForNextPoll(ctx, runner.pollInterval); err != nil {
+				return nil
+			}
+
+			continue
+		}
+
+		if job == nil {
+			if err := waitForNextPoll(ctx, runner.pollInterval); err != nil {
+				return nil
+			}
+
+			continue
+		}
+
+		handler, ok := runner.handlers[job.Kind]
+		if !ok {
+			failure := fmt.Sprintf("no handler registered for job kind %q", job.Kind)
+			if err := runner.store.MarkFailed(ctx, job.ID, failure); err != nil {
+				return err
+			}
+
+			runner.logger.Error("worker job failed", "jobID", job.ID, "kind", job.Kind, "error", failure)
+			continue
+		}
+
+		if err := handler(ctx, *job); err != nil {
+			if ctx.Err() != nil {
+				return nil
+			}
+
+			failure := strings.TrimSpace(err.Error())
+			if failure == "" {
+				failure = "job handler returned an empty error"
+			}
+
+			if markErr := runner.store.MarkFailed(ctx, job.ID, failure); markErr != nil {
+				return markErr
+			}
+
+			runner.logger.Error("worker job failed", "jobID", job.ID, "kind", job.Kind, "error", failure)
+			continue
+		}
+
+		if err := runner.store.MarkSucceeded(ctx, job.ID); err != nil {
+			return err
+		}
+
+		runner.logger.Info("worker job succeeded", "jobID", job.ID, "kind", job.Kind)
+	}
+}
+
+func waitForNextPoll(ctx context.Context, interval time.Duration) error {
+	timer := time.NewTimer(interval)
+	defer timer.Stop()
+
+	select {
+	case <-ctx.Done():
+		return ctx.Err()
+	case <-timer.C:
+		return nil
+	}
+}

Backend/internal/worker/runner_test.go

@@ -0,0 +1,209 @@
+package worker
+
+import (
+	"context"
+	"errors"
+	"io"
+	"log/slog"
+	"strings"
+	"sync"
+	"testing"
+	"time"
+
+	"moku-backend/internal/jobs"
+)
+
+func TestRunnerProcessesRegisteredJob(t *testing.T) {
+	ctx, cancel := context.WithCancel(context.Background())
+	defer cancel()
+
+	store := &fakeJobStore{
+		job: &jobs.Job{
+			ID:      "job-1",
+			Kind:    jobs.KindBootstrapStructureMaterialize,
+			Payload: []byte(`{"installationId":"installation-1"}`),
+		},
+		cancel: cancel,
+	}
+	runner := NewRunner(store, slog.New(slog.NewTextHandler(io.Discard, nil)), 0)
+
+	handlerCalled := false
+	runner.Register(jobs.KindBootstrapStructureMaterialize, func(ctx context.Context, job jobs.Job) error {
+		handlerCalled = true
+		if job.ID != "job-1" {
+			t.Fatalf("expected job id job-1, got %s", job.ID)
+		}
+		return nil
+	})
+
+	if err := runner.Run(ctx); err != nil {
+		t.Fatalf("runner returned error: %v", err)
+	}
+
+	if !handlerCalled {
+		t.Fatal("expected handler to be called")
+	}
+	if len(store.succeeded) != 1 || store.succeeded[0] != "job-1" {
+		t.Fatalf("expected job to be marked succeeded once, got %#v", store.succeeded)
+	}
+	if len(store.failed) != 0 {
+		t.Fatalf("expected no failed jobs, got %#v", store.failed)
+	}
+}
+
+func TestRunnerMarksFailedWhenHandlerErrors(t *testing.T) {
+	ctx, cancel := context.WithCancel(context.Background())
+	defer cancel()
+
+	store := &fakeJobStore{
+		job: &jobs.Job{
+			ID:   "job-2",
+			Kind: jobs.KindBootstrapStructureMaterialize,
+		},
+		cancel: cancel,
+	}
+	runner := NewRunner(store, slog.New(slog.NewTextHandler(io.Discard, nil)), 0)
+	runner.Register(jobs.KindBootstrapStructureMaterialize, func(ctx context.Context, job jobs.Job) error {
+		return errors.New("boom")
+	})
+
+	if err := runner.Run(ctx); err != nil {
+		t.Fatalf("runner returned error: %v", err)
+	}
+
+	if len(store.succeeded) != 0 {
+		t.Fatalf("expected no succeeded jobs, got %#v", store.succeeded)
+	}
+	if len(store.failed) != 1 {
+		t.Fatalf("expected one failed job, got %#v", store.failed)
+	}
+	if store.failed[0].jobID != "job-2" {
+		t.Fatalf("expected failed job id job-2, got %#v", store.failed[0])
+	}
+	if !strings.Contains(store.failed[0].failure, "boom") {
+		t.Fatalf("expected failure to mention handler error, got %#v", store.failed[0])
+	}
+}
+
+func TestRunnerMarksFailedWhenHandlerMissing(t *testing.T) {
+	ctx, cancel := context.WithCancel(context.Background())
+	defer cancel()
+
+	store := &fakeJobStore{
+		job: &jobs.Job{
+			ID:   "job-3",
+			Kind: "unknown.kind",
+		},
+		cancel: cancel,
+	}
+	runner := NewRunner(store, slog.New(slog.NewTextHandler(io.Discard, nil)), 0)
+
+	if err := runner.Run(ctx); err != nil {
+		t.Fatalf("runner returned error: %v", err)
+	}
+
+	if len(store.failed) != 1 {
+		t.Fatalf("expected one failed job, got %#v", store.failed)
+	}
+	if !strings.Contains(store.failed[0].failure, "no handler registered") {
+		t.Fatalf("expected missing handler failure, got %#v", store.failed[0])
+	}
+}
+
+func TestRunnerRetriesClaimErrors(t *testing.T) {
+	ctx, cancel := context.WithCancel(context.Background())
+	defer cancel()
+
+	store := &fakeJobStore{
+		claimErrors: []error{errors.New("relation \"background_jobs\" does not exist")},
+		job: &jobs.Job{
+			ID:   "job-4",
+			Kind: jobs.KindBootstrapStructureMaterialize,
+		},
+		cancel: cancel,
+	}
+	runner := NewRunner(store, slog.New(slog.NewTextHandler(io.Discard, nil)), time.Millisecond)
+
+	handlerCalled := false
+	runner.Register(jobs.KindBootstrapStructureMaterialize, func(ctx context.Context, job jobs.Job) error {
+		handlerCalled = true
+		return nil
+	})
+
+	if err := runner.Run(ctx); err != nil {
+		t.Fatalf("runner returned error: %v", err)
+	}
+
+	if !handlerCalled {
+		t.Fatal("expected handler to be called after claim retry")
+	}
+	if store.claimAttempts < 2 {
+		t.Fatalf("expected at least two claim attempts, got %d", store.claimAttempts)
+	}
+	if len(store.succeeded) != 1 || store.succeeded[0] != "job-4" {
+		t.Fatalf("expected job to be marked succeeded once, got %#v", store.succeeded)
+	}
+	if len(store.failed) != 0 {
+		t.Fatalf("expected no failed jobs, got %#v", store.failed)
+	}
+}
+
+type fakeJobStore struct {
+	mu            sync.Mutex
+	job           *jobs.Job
+	claimed       bool
+	claimErrors   []error
+	claimAttempts int
+	succeeded     []string
+	failed        []fakeFailure
+	cancel        context.CancelFunc
+}
+
+type fakeFailure struct {
+	jobID   string
+	failure string
+}
+
+func (store *fakeJobStore) ClaimNext(ctx context.Context) (*jobs.Job, error) {
+	store.mu.Lock()
+	defer store.mu.Unlock()
+	store.claimAttempts++
+
+	if len(store.claimErrors) > 0 {
+		err := store.claimErrors[0]
+		store.claimErrors = store.claimErrors[1:]
+		return nil, err
+	}
+
+	if store.claimed || store.job == nil {
+		return nil, nil
+	}
+
+	store.claimed = true
+	job := *store.job
+	return &job, nil
+}
+
+func (store *fakeJobStore) MarkSucceeded(ctx context.Context, jobID string) error {
+	store.mu.Lock()
+	store.succeeded = append(store.succeeded, jobID)
+	store.mu.Unlock()
+
+	if store.cancel != nil {
+		store.cancel()
+	}
+
+	return nil
+}
+
+func (store *fakeJobStore) MarkFailed(ctx context.Context, jobID, failure string) error {
+	store.mu.Lock()
+	store.failed = append(store.failed, fakeFailure{jobID: jobID, failure: failure})
+	store.mu.Unlock()
+
+	if store.cancel != nil {
+		store.cancel()
+	}
+
+	return nil
+}

Backend/sqlc.yaml

@@ -0,0 +1,12 @@
+version: "2"
+sql:
+  - engine: "postgresql"
+    schema: "db/migrations"
+    queries: "db/queries"
+    gen:
+      go:
+        package: "sqlc"
+        out: "internal/sqlc"
+        sql_package: "pgx/v5"
+        emit_json_tags: true
+        emit_empty_slices: true

Commands/Local/Dev/backend.just

@@ -0,0 +1,30 @@
+project_root := justfile_directory()
+backend_dir := project_root + "/Backend"
+
+# Apply embedded database migrations.
+migrate-up:
+	cd '{{backend_dir}}' && go run ./cmd/migrate up
+
+# Roll back the most recent embedded database migration.
+migrate-down:
+	cd '{{backend_dir}}' && go run ./cmd/migrate down
+
+# Reset all embedded database migrations.
+migrate-reset:
+	cd '{{backend_dir}}' && go run ./cmd/migrate reset
+
+# Reset embedded database migrations and apply them again from scratch.
+migrate-rebuild:
+	cd '{{backend_dir}}' && go run ./cmd/migrate reset && go run ./cmd/migrate up
+
+# Show the embedded database migration status.
+migrate-status:
+	cd '{{backend_dir}}' && go run ./cmd/migrate status
+
+# Rebuild the POSIX-to-DB projection from the current POSIX root.
+posix-rebuild:
+	cd '{{backend_dir}}' && go run ./cmd/posix rebuild
+
+# Format backend Go source files.
+fmt:
+	cd '{{backend_dir}}' && gofmt -w ./cmd ./db ./internal

Commands/Local/Dev/frontend.just

@@ -0,0 +1,14 @@
+project_root := justfile_directory()
+local_compose := project_root + "/Docker/docker-compose.local.dev.yaml"
+frontend_dir := project_root + "/Frontend"
+node_modules_volume := "moku_work_frontend_node_modules"
+
+# Recreate the frontend node_modules Docker volume.
+node_modules:
+	docker compose -f '{{local_compose}}' rm -sf frontend >/dev/null 2>&1 || true
+	docker volume rm -f '{{node_modules_volume}}' >/dev/null 2>&1 || true
+	docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate frontend
+
+# Run the frontend TypeScript check.
+tsc:
+	cd '{{frontend_dir}}' && pnpm typecheck

Commands/Local/Dev/mod.just

@@ -0,0 +1,39 @@
+stack_runner := justfile_directory() + "/Commands/Local/Dev/scripts/dev-stack.sh"
+
+mod frontend
+mod backend
+
+# Build the combined local development stack assets.
+build:
+	bash '{{stack_runner}}' build
+
+# Start the full local development stack in the background.
+up:
+	bash '{{stack_runner}}' up
+
+# Build first, then start the full local development stack in the background.
+start:
+	bash '{{stack_runner}}' start
+
+# Alias for the main full local development flow.
+dev: up
+
+# Stop and remove the local development stack.
+down:
+	bash '{{stack_runner}}' down
+
+# Rebuild the full local development stack.
+rebuild:
+	bash '{{stack_runner}}' rebuild
+
+# Follow logs for the full local development stack.
+logs:
+	bash '{{stack_runner}}' logs
+
+# Restart the full local development stack.
+restart:
+	bash '{{stack_runner}}' restart
+
+# Stop the local development stack and remove local images, volumes, and backend dev state.
+clean:
+	bash '{{stack_runner}}' clean

Commands/Local/Dev/scripts/backend-stack.sh

@@ -0,0 +1,91 @@
+#!/usr/bin/env bash
+
+# Path: Commands/Local/Dev/scripts/backend-stack.sh
+set -euo pipefail
+
+action=${1:-up}
+
+script_dir=$(cd -- "$(dirname -- "${BASH_SOURCE[0]}")" && pwd)
+project_root=$(cd -- "$script_dir/../../../.." && pwd)
+backend_dir="$project_root/Backend"
+backend_bake="$backend_dir/docker-bake.hcl"
+env_dir="$project_root/Env"
+compose_file="$project_root/Docker/docker-compose.local.dev.yaml"
+runtime_dir="$backend_dir/tmp/dev"
+backend_image="moku/work-backend:dev"
+backend_go_pkg_volume="moku_work_backend_go_pkg"
+backend_go_build_volume="moku_work_backend_go_build"
+
+services=(web api worker)
+
+source "$script_dir/docker.sh"
+source "$script_dir/env.sh"
+
+build_backend() {
+	cd "$backend_dir"
+	docker buildx bake -f "$backend_bake" dev
+}
+
+up_backend() {
+	docker compose -f "$compose_file" up -d --remove-orphans --force-recreate "${services[@]}"
+}
+
+down_backend() {
+	docker compose -f "$compose_file" stop "${services[@]}" >/dev/null 2>&1 || true
+	docker compose -f "$compose_file" rm -f "${services[@]}" >/dev/null 2>&1 || true
+}
+
+restart_backend() {
+	docker compose -f "$compose_file" restart "${services[@]}"
+}
+
+follow_logs() {
+	docker compose -f "$compose_file" logs -f "${services[@]}"
+}
+
+clean_runtime() {
+	rm -rf "$runtime_dir"
+}
+
+case "$action" in
+	check)
+		ensure_docker 'docker is required for the local backend dev runtime. Install Docker first.'
+		;;
+	build)
+		ensure_docker 'docker is required for the local backend dev runtime. Install Docker first.'
+		build_backend
+		;;
+	up)
+		ensure_docker 'docker is required for the local backend dev runtime. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		up_backend
+		;;
+	down)
+		ensure_docker 'docker is required for the local backend dev runtime. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		down_backend
+		;;
+	restart)
+		ensure_docker 'docker is required for the local backend dev runtime. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		restart_backend
+		;;
+	logs)
+		ensure_docker 'docker is required for the local backend dev runtime. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		follow_logs
+		;;
+	clean)
+		ensure_docker 'docker is required for the local backend dev runtime. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		down_backend
+		remove_docker_image_if_present "$backend_image"
+		remove_docker_volume_if_present "$backend_go_pkg_volume"
+		remove_docker_volume_if_present "$backend_go_build_volume"
+		clean_runtime
+		;;
+	*)
+		printf 'Unsupported backend stack action: %s\n' "$action" >&2
+		exit 1
+		;;
+esac

Commands/Local/Dev/scripts/dev-stack.sh

@@ -0,0 +1,102 @@
+#!/usr/bin/env bash
+
+# Path: Commands/Local/Dev/scripts/dev-stack.sh
+set -euo pipefail
+
+action=${1:-up}
+
+script_dir=$(cd -- "$(dirname -- "${BASH_SOURCE[0]}")" && pwd)
+project_root=$(cd -- "$script_dir/../../../.." && pwd)
+frontend_dir="$project_root/Frontend"
+frontend_bake="$frontend_dir/docker-bake.hcl"
+backend_dir="$project_root/Backend"
+backend_bake="$backend_dir/docker-bake.hcl"
+env_dir="$project_root/Env"
+compose_file="$project_root/Docker/docker-compose.local.dev.yaml"
+frontend_image="moku/work-frontend:dev"
+backend_image="moku/work-backend:dev"
+frontend_volume="moku_work_frontend_node_modules"
+backend_go_pkg_volume="moku_work_backend_go_pkg"
+backend_go_build_volume="moku_work_backend_go_build"
+backend_runtime_dir="$backend_dir/tmp/dev"
+
+source "$script_dir/docker.sh"
+source "$script_dir/env.sh"
+
+build_frontend() {
+	cd "$frontend_dir"
+	docker buildx bake -f "$frontend_bake" dev
+}
+
+build_backend() {
+	cd "$backend_dir"
+	docker buildx bake -f "$backend_bake" dev
+}
+
+build_images() {
+	build_frontend
+	build_backend
+}
+
+up_stack() {
+	docker compose -f "$compose_file" up -d --remove-orphans --force-recreate
+}
+
+down_stack() {
+	docker compose -f "$compose_file" down --remove-orphans --volumes
+}
+
+follow_logs() {
+	docker compose -f "$compose_file" logs -f
+}
+
+clean_stack() {
+	docker compose -f "$compose_file" down --remove-orphans --volumes >/dev/null 2>&1 || true
+	remove_docker_image_if_present "$frontend_image"
+	remove_docker_image_if_present "$backend_image"
+	remove_docker_volume_if_present "$frontend_volume"
+	remove_docker_volume_if_present "$backend_go_pkg_volume"
+	remove_docker_volume_if_present "$backend_go_build_volume"
+	rm -rf "$backend_runtime_dir"
+}
+
+start_stack() {
+	build_images
+	up_stack
+}
+
+case "$action" in
+	build)
+		ensure_docker 'docker is required for the local development stack. Install Docker first.'
+		build_images
+		;;
+	up|start|rebuild)
+		ensure_docker 'docker is required for the local development stack. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		start_stack
+		;;
+	down)
+		ensure_docker 'docker is required for the local development stack. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		down_stack
+		;;
+	restart)
+		ensure_docker 'docker is required for the local development stack. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		docker compose -f "$compose_file" restart
+		;;
+	logs)
+		ensure_docker 'docker is required for the local development stack. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		follow_logs
+		;;
+	clean)
+		ensure_docker 'docker is required for the local development stack. Install Docker first.'
+		ensure_local_env_file "$env_dir"
+		clean_stack
+		;;
+	*)
+		printf 'Unsupported dev stack action: %s\n' "$action" >&2
+		exit 1
+		;;
+esac

Commands/Local/Dev/scripts/docker.sh

@@ -0,0 +1,20 @@
+#!/usr/bin/env bash
+
+set -euo pipefail
+
+ensure_docker() {
+	local error_message=${1:-docker is required. Install Docker first.}
+
+	if ! command -v docker >/dev/null 2>&1; then
+		printf '%s\n' "$error_message" >&2
+		exit 1
+	fi
+}
+
+remove_docker_image_if_present() {
+	docker image rm -f "$1" >/dev/null 2>&1 || true
+}
+
+remove_docker_volume_if_present() {
+	docker volume rm -f "$1" >/dev/null 2>&1 || true
+}

Commands/Local/Dev/scripts/env.sh

@@ -0,0 +1,21 @@
+#!/usr/bin/env bash
+
+set -euo pipefail
+
+ensure_local_env_file() {
+	local env_dir=$1
+	local example_env_file="$env_dir/.env.example"
+	local local_env_file="$env_dir/.env.local"
+
+	if [[ -f "$local_env_file" ]]; then
+		return
+	fi
+
+	if [[ ! -f "$example_env_file" ]]; then
+		printf 'Missing env template: %s\n' "$example_env_file" >&2
+		exit 1
+	fi
+
+	cp "$example_env_file" "$local_env_file"
+	printf 'Created %s from %s\n' "$local_env_file" "$example_env_file"
+}

Commands/Local/dev.just

@@ -1,36 +0,0 @@
-project_root := justfile_directory()
-frontend_dir := project_root + "/Frontend"
-frontend_bake := project_root + "/Frontend/docker-bake.hcl"
-local_compose := project_root + "/Docker/docker-compose.local.dev.yaml"
-
-# Build the Frontend development image.
-build:
-    cd '{{frontend_dir}}' && docker buildx bake -f '{{frontend_bake}}' dev
-
-# Start the local development stack in the background using the current image.
-up:
-    docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate
-
-# Build first, then start the local development stack in the background.
-start: build
-    docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate
-
-# Alias for the main local development flow.
-dev: start
-
-# Stop and remove the local development stack.
-down:
-    docker compose -f '{{local_compose}}' down --remove-orphans --volumes
-
-# Rebuild the Frontend development image and recreate the stack.
-rebuild:
-    cd '{{frontend_dir}}' && docker buildx bake -f '{{frontend_bake}}' dev
-    docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate
-
-# Follow logs for the local development stack.
-logs:
-    docker compose -f '{{local_compose}}' logs -f
-
-# Restart the local development stack.
-restart:
-    docker compose -f '{{local_compose}}' restart

Commands/Local/mod.just

@@ -1,2 +1,2 @@
-mod dev
+mod dev "Dev"
 mod prod

Commands/Local/prod.just

@@ -1,32 +1,44 @@
 project_root := justfile_directory()
 proxy_bake := project_root + "/Proxy/docker-bake.hcl"
+backend_bake := project_root + "/Backend/docker-bake.hcl"
 local_compose := project_root + "/Docker/docker-compose.local.prod.yaml"
+proxy_image := "moku/work-proxy:local-prod"
+backend_api_image := "moku/work-backend:local-prod-api"
+backend_worker_image := "moku/work-backend:local-prod-worker"
 
 # Build the local production proxy image locally.
 build:
-    cd '{{project_root}}' && docker buildx bake -f '{{proxy_bake}}' prod
+	cd '{{project_root}}' && docker buildx bake -f '{{proxy_bake}}' prod
+	cd '{{project_root}}' && docker buildx bake -f '{{backend_bake}}' prod-api prod-worker
 
 # Start the local production stack in the background using the current image.
 up:
-    docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate
+	docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate
 
 # Build first, then start the local production stack in the background.
-start: build
-    docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate
+start: build up
 
 # Rebuild the local production proxy image locally.
 rebuild:
-    cd '{{project_root}}' && docker buildx bake -f '{{proxy_bake}}' --set '*.no-cache=true' prod
-    docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate
+	cd '{{project_root}}' && docker buildx bake -f '{{proxy_bake}}' --set '*.no-cache=true' prod
+	cd '{{project_root}}' && docker buildx bake -f '{{backend_bake}}' --set '*.no-cache=true' prod-api prod-worker
+	docker compose -f '{{local_compose}}' up -d --remove-orphans --force-recreate
 
 # Stop and remove the local production stack.
 down:
-    docker compose -f '{{local_compose}}' down --remove-orphans --volumes
+	docker compose -f '{{local_compose}}' down --remove-orphans --volumes
 
 # Follow logs for the local production stack.
 logs:
-    docker compose -f '{{local_compose}}' logs -f
+	docker compose -f '{{local_compose}}' logs -f
 
 # Restart the local production stack.
 restart:
-    docker compose -f '{{local_compose}}' restart
+	docker compose -f '{{local_compose}}' restart
+
+# Stop the local production stack and remove local images.
+clean:
+	docker compose -f '{{local_compose}}' down --remove-orphans --volumes
+	docker image rm -f '{{proxy_image}}' >/dev/null 2>&1 || true
+	docker image rm -f '{{backend_api_image}}' >/dev/null 2>&1 || true
+	docker image rm -f '{{backend_worker_image}}' >/dev/null 2>&1 || true

Commands/Test/backend.just

@@ -0,0 +1,11 @@
+project_root := justfile_directory()
+backend_dir := project_root + "/Backend"
+
+# Run the full backend test suite.
+[default]
+all:
+	cd '{{backend_dir}}' && go test ./...
+
+# Run the isolated POSIX bootstrap smoke test.
+posix-bootstrap:
+	cd '{{backend_dir}}' && go test ./internal/bootstrap -run TestEnsureBootstrapPOSIXSkeletonInitializesEmptyRoot -count=1 -v

Commands/Test/mod.just

@@ -0,0 +1 @@
+mod backend

Docker/docker-compose.local.dev.yaml

@@ -1,15 +1,97 @@
+x-backend-service: &backend-service
+  image: moku/work-backend:dev
+  restart: unless-stopped
+  env_file:
+    - ../Env/.env.local
+  environment:
+    DATABASE_URL: postgres://moku:moku_dev_password@postgres:5432/moku?sslmode=disable
+    VALKEY_URL: redis://valkey:6379/0
+    POSIX_ROOT: /posix
+  depends_on:
+    postgres:
+      condition: service_healthy
+    valkey:
+      condition: service_healthy
+  volumes:
+    - ../Backend:/app
+    - ../POSIX:/posix
+    - moku_work_backend_go_pkg:/go/pkg/mod
+    - moku_work_backend_go_build:/root/.cache/go-build
+
 services:
-    frontend:
-        image: moku/work-frontend:dev
-        container_name: moku-work-frontend
-        restart: unless-stopped
-        env_file:
-            - ../Env/.env.local
-        ports:
-            - "3333:3333"
-        volumes:
-            - ../Frontend:/app
-            - moku_work_frontend_node_modules:/app/node_modules
+  postgres:
+    image: postgres:17-alpine
+    container_name: moku-work-postgres
+    restart: unless-stopped
+    environment:
+      POSTGRES_DB: moku
+      POSTGRES_USER: moku
+      POSTGRES_PASSWORD: moku_dev_password
+    ports:
+      - "5432:5432"
+    volumes:
+      - moku_work_postgres_data:/var/lib/postgresql/data
+    healthcheck:
+      test: ["CMD-SHELL", "pg_isready -U moku -d moku"]
+      interval: 10s
+      timeout: 5s
+      retries: 5
+      start_period: 10s
+
+  valkey:
+    image: valkey/valkey:8-alpine
+    container_name: moku-work-valkey
+    restart: unless-stopped
+    ports:
+      - "6379:6379"
+    volumes:
+      - moku_work_valkey_data:/data
+    healthcheck:
+      test: ["CMD", "valkey-cli", "ping"]
+      interval: 10s
+      timeout: 5s
+      retries: 5
+      start_period: 5s
+
+  frontend:
+    image: moku/work-frontend:dev
+    container_name: moku-work-frontend
+    restart: unless-stopped
+    env_file:
+      - ../Env/.env.local
+    depends_on:
+      postgres:
+        condition: service_healthy
+      valkey:
+        condition: service_healthy
+    ports:
+      - "3333:3333"
+    volumes:
+      - ../Frontend:/app
+      - moku_work_frontend_node_modules:/app/node_modules
+
+  web:
+    <<: *backend-service
+    container_name: moku-work-backend-web
+    command: ["air", "-c", ".air.web.toml"]
+    ports:
+      - "8080:8080"
+
+  api:
+    <<: *backend-service
+    container_name: moku-work-backend-api
+    command: ["air", "-c", ".air.api.toml"]
+    ports:
+      - "8081:8081"
+
+  worker:
+    <<: *backend-service
+    container_name: moku-work-backend-worker
+    command: ["air", "-c", ".air.worker.toml"]
 
 volumes:
-    moku_work_frontend_node_modules:
+  moku_work_postgres_data:
+  moku_work_valkey_data:
+  moku_work_frontend_node_modules:
+  moku_work_backend_go_pkg:
+  moku_work_backend_go_build:

Docker/docker-compose.local.prod.yaml

@@ -1,7 +1,70 @@
+x-backend-service: &backend-service
+  restart: unless-stopped
+  env_file:
+    - ../Env/.env.local
+  environment:
+    DATABASE_URL: postgres://moku:moku_dev_password@postgres:5432/moku?sslmode=disable
+    VALKEY_URL: redis://valkey:6379/0
+    POSIX_ROOT: /posix
+  depends_on:
+    postgres:
+      condition: service_healthy
+    valkey:
+      condition: service_healthy
+  volumes:
+    - ../POSIX:/posix
+
 services:
-    proxy:
-        image: moku/work-proxy:local-prod
-        container_name: moku-work-proxy-local
-        restart: unless-stopped
-        ports:
-            - "8080:80"
+  postgres:
+    image: postgres:17-alpine
+    container_name: moku-work-postgres-prod
+    restart: unless-stopped
+    environment:
+      POSTGRES_DB: moku
+      POSTGRES_USER: moku
+      POSTGRES_PASSWORD: moku_dev_password
+    volumes:
+      - moku_work_postgres_prod_data:/var/lib/postgresql/data
+    healthcheck:
+      test: ["CMD-SHELL", "pg_isready -U moku -d moku"]
+      interval: 10s
+      timeout: 5s
+      retries: 5
+      start_period: 10s
+
+  valkey:
+    image: valkey/valkey:8-alpine
+    container_name: moku-work-valkey-prod
+    restart: unless-stopped
+    volumes:
+      - moku_work_valkey_prod_data:/data
+    healthcheck:
+      test: ["CMD", "valkey-cli", "ping"]
+      interval: 10s
+      timeout: 5s
+      retries: 5
+      start_period: 5s
+
+  api:
+    <<: *backend-service
+    image: moku/work-backend:local-prod-api
+    container_name: moku-work-backend-api-prod
+
+  worker:
+    <<: *backend-service
+    image: moku/work-backend:local-prod-worker
+    container_name: moku-work-backend-worker-prod
+
+  proxy:
+    image: moku/work-proxy:local-prod
+    container_name: moku-work-proxy-local
+    restart: unless-stopped
+    depends_on:
+      api:
+        condition: service_started
+    ports:
+      - "8080:80"
+
+volumes:
+  moku_work_postgres_prod_data:
+  moku_work_valkey_prod_data:

Documentation/CONTRIBUTING

@@ -9,8 +9,8 @@ This project is still in an early scaffold stage, so the goal is to keep changes
 ### Project structure
 
 - `Frontend/` — SolidStart frontend workspace
-- `Backend/` — backend placeholder
-- `Proxy/` — proxy placeholder
+- `Backend/` — Go backend services (`web`, `api`, `worker`)
+- `Proxy/` — local production proxy/runtime assets
 - `Docker/` — local Docker Compose files
 - `Env/` — local environment files
 - `Commands/` — Just command modules and entrypoints
@@ -39,7 +39,8 @@ Main local development flow:
 just local dev
 ```
 
-This command builds the frontend development image and starts the local development stack.
+This command builds the frontend and backend development images, then starts the
+local development stack for Postgres, Valkey, frontend, and backend services.
 
 ### Local environment
 
@@ -49,7 +50,16 @@ Local development uses:
 Env/.env.local
 ```
 
-If local environment values are missing, create or update that file before starting the stack.
+The template lives at:
+
+```bash
+Env/.env.example
+```
+
+When you start the local Docker stack, the dev scripts will create `Env/.env.local`
+from `Env/.env.example` automatically if it does not already exist.
+
+If you need custom local values, edit `Env/.env.local` after it is created.
 
 ## Commit Naming Convention
 

Documentation/POSIX-Structure.md

@@ -0,0 +1,75 @@
+# POSIX Structure
+
+[Filetree Link](https://tree.nathanfriend.com/?s=(%27optiUs!(%27fancy!Yue~fullPath!fbq~YailingSlash!Yue~rootDot!fbq)~R(%27R%27PJ%20or%20OrganizatiU%20%7Bqrver%7DM*46layout6cNlog7packs7*pack37A2*enYies75W5A_standbUe7WA6HwH30LZ2teamw5teamGL5Z6FwF30LKTC058T5C7XFG5LXKXTXC7XI7I05QG5BN2*8QG5BN6Z04_dN_pJw*pJGlayout2L*KI70%27)~vEiU!%271%27)*%20%200M52_*3-%3Cslug%3E4qttings5**69M*7%2F08VG*V259.jsUA5manifestBQ25*schema25*dCchildrenEersFprojectG305HdepartmentI*YeeJEUbKhome2L*42M%5CnNataQitemRsource!Tacl2UonVfolderW*app37X55YtrZusE_90balqsews0%01wqb_ZYXWVUTRQNMLKJIHGFECBA987654320*)
+
+``` markdown
+Personal or Organization (server)/
+├── settings.json
+├── layout.json
+├── catalog/
+│   ├── packs/
+│   │   └── pack-<slug>/
+│   │       ├── manifest.json
+│   │       └── entries/
+│   │           └── app-<slug>/
+│   │               └── manifest.json
+│   └── standalone/
+│       └── app-<slug>/
+│           └── manifest.json
+├── departments/
+│   └── department-<slug>/
+│       ├── settings.json
+│       ├── users.json
+│       └── teams/
+│           └── team-<slug>/
+│               ├── settings.json
+│               └── users.json
+├── projects/
+│   └── project-<slug>/
+│       ├── settings.json
+│       ├── home.json
+│       ├── acl.json
+│       ├── children/
+│       │   └── folder-<slug>/
+│       │       ├── folder.json
+│       │       ├── acl.json
+│       │       └── children/
+│       │           └── project-<slug>/
+│       │               ├── settings.json
+│       │               ├── home.json
+│       │               ├── acl.json
+│       │               ├── children/
+│       │               └── tree/
+│       └── tree/
+│           ├── item-<slug>/
+│           │   ├── item.json
+│           │   ├── schema.json
+│           │   └── data.json
+│           └── folder-<slug>/
+│               ├── folder.json
+│               └── item-<slug>/
+│                   ├── item.json
+│                   ├── schema.json
+│                   └── data.json
+└── users/
+    ├── settings.json
+    ├── data.json
+    └── personals/
+        └── personal-<slug>/
+            ├── layout.json
+            ├── settings.json
+            ├── home.json
+            └── tree/
+```
+
+## File Responsibilities
+
+- `settings.json` — Metadata and presentation config for the thing, such as display name, icon, description, and simple settings.
+- `layout.json` — Layout configuration for the current server or personal space.
+- `home.json` — Home surface configuration, such as widgets, sections, and how they are arranged.
+- `folder.json` — Metadata for a folder node in a tree.
+- `item.json` — Instance metadata for a created item, including what it is and how it should behave.
+- `schema.json` — The structure expected by that item's data.
+- `data.json` — The actual content or state data for that item.
+- `manifest.json` — Catalog definition metadata, including versioning, description, and capabilities for reusable apps or entries.
+- `users.json` — User membership or assignment data for departments and teams.

Documentation/STYLING-THEME-SAMPLE.json

@@ -0,0 +1,177 @@
+{
+	"schemaVersion": "1.0.0",
+	"id": "moku-styling-sample",
+	"name": "Moku Styling Sample",
+	"description": "Sample theme showing the background, surface, border, accent, and primary tokens documented in Documentation/STYLING.md.",
+	"author": "Moku Work",
+	"tokens": {
+		"shared": {
+			"palette": {
+				"gray": {
+					"0": "hsl(210 20% 99%)",
+					"50": "hsl(220 20% 97%)",
+					"100": "hsl(220 16% 93%)",
+					"200": "hsl(220 13% 87%)",
+					"300": "hsl(220 11% 75%)",
+					"400": "hsl(220 9% 58%)",
+					"500": "hsl(220 10% 45%)",
+					"600": "hsl(220 14% 34%)",
+					"700": "hsl(220 18% 24%)",
+					"800": "hsl(220 22% 16%)",
+					"900": "hsl(220 28% 10%)"
+				},
+				"blue": {
+					"400": "hsl(218 88% 61%)",
+					"500": "hsl(221 83% 53%)",
+					"600": "hsl(224 76% 48%)"
+				},
+				"green": {
+					"500": "hsl(154 60% 40%)"
+				},
+				"red": {
+					"500": "hsl(0 72% 54%)"
+				},
+				"amber": {
+					"500": "hsl(36 100% 50%)"
+				}
+			},
+			"space": {
+				"1": "0.25rem",
+				"2": "0.5rem",
+				"3": "0.75rem",
+				"4": "1rem",
+				"5": "1.25rem",
+				"6": "1.5rem",
+				"8": "2rem",
+				"10": "2.5rem",
+				"12": "3rem"
+			},
+			"radius": {
+				"sm": "0.375rem",
+				"md": "0.625rem",
+				"lg": "0.875rem",
+				"xl": "1.25rem",
+				"pill": "999px"
+			},
+			"size": {
+				"controlMd": "2.25rem",
+				"controlLg": "2.5rem",
+				"contentWidthWide": "72rem",
+				"blurOverlay": "18px"
+			},
+			"shadow": {
+				"soft": "0 12px 32px hsl(220 30% 10% / 0.08)",
+				"strong": "0 20px 48px hsl(220 30% 10% / 0.16)"
+			},
+			"zIndex": {
+				"base": "1",
+				"dropdown": "100",
+				"sticky": "200",
+				"overlay": "400",
+				"modal": "500",
+				"toast": "600"
+			},
+			"motion": {
+				"durationFast": "140ms",
+				"durationBase": "220ms",
+				"durationSlow": "320ms",
+				"easeStandard": "cubic-bezier(0.2, 0.8, 0.2, 1)"
+			},
+			"typography": {
+				"fontFamily": {
+					"sans": "ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
+					"heading": "\"Avenir Next\", \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
+					"display": "\"Avenir Next\", \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
+					"serif": "ui-serif, Georgia, Cambria, \"Times New Roman\", Times, serif",
+					"mono": "ui-monospace, \"SF Mono\", \"SFMono-Regular\", Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace"
+				},
+				"fontSize": {
+					"caption": "0.75rem",
+					"label": "0.875rem",
+					"body": "1rem",
+					"title": "clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem)",
+					"heading": "clamp(1.5rem, 1.2rem + 1vw, 2.125rem)",
+					"display": "clamp(2.25rem, 1.7rem + 2.2vw, 3.75rem)"
+				},
+				"lineHeight": {
+					"caption": "1.4",
+					"label": "1.35",
+					"body": "1.55",
+					"title": "1.3",
+					"heading": "1.15",
+					"display": "1.05"
+				},
+				"fontWeight": {
+					"caption": "500",
+					"label": "600",
+					"body": "400",
+					"title": "600",
+					"heading": "600",
+					"display": "700"
+				},
+				"letterSpacing": {
+					"caption": "0.01em",
+					"label": "0.005em",
+					"body": "0",
+					"title": "-0.01em",
+					"heading": "-0.02em",
+					"display": "-0.03em"
+				}
+			}
+		},
+		"modes": {
+			"light": {
+				"colorScheme": "light",
+				"colors": {
+					"canvas": "var(--gray-50)",
+					"surface": "hsl(0 0% 100% / 0.9)",
+					"surfaceMuted": "var(--gray-0)",
+					"surfaceHover": "var(--gray-100)",
+					"border": "hsl(220 15% 85% / 0.9)",
+					"borderStrong": "hsl(220 12% 70% / 0.9)",
+					"text": "var(--gray-800)",
+					"textMuted": "var(--gray-500)",
+					"accent": "var(--blue-500)",
+					"accentStrong": "var(--blue-600)",
+					"accentSoft": "hsl(218 88% 61% / 0.12)",
+					"accentContrast": "hsl(0 0% 100%)",
+					"primaryOne": "var(--blue-500)",
+					"primaryTwo": "hsl(271 72% 60%)",
+					"primaryThree": "hsl(192 76% 48%)",
+					"success": "var(--green-500)",
+					"danger": "var(--red-500)",
+					"warning": "var(--amber-500)",
+					"focusRing": "hsl(221 83% 53% / 0.55)"
+				}
+			},
+			"dark": {
+				"colorScheme": "dark",
+				"colors": {
+					"canvas": "var(--gray-900)",
+					"surface": "hsl(220 23% 14% / 0.92)",
+					"surfaceMuted": "hsl(220 22% 12% / 0.96)",
+					"surfaceHover": "hsl(220 18% 20% / 0.96)",
+					"border": "hsl(220 12% 26% / 0.9)",
+					"borderStrong": "hsl(220 12% 38% / 0.9)",
+					"text": "hsl(210 20% 96%)",
+					"textMuted": "hsl(220 12% 70%)",
+					"accent": "hsl(217 91% 67%)",
+					"accentStrong": "hsl(218 88% 61%)",
+					"accentSoft": "hsl(217 91% 67% / 0.18)",
+					"accentContrast": "hsl(220 28% 10%)",
+					"primaryOne": "hsl(217 91% 67%)",
+					"primaryTwo": "hsl(272 80% 70%)",
+					"primaryThree": "hsl(190 84% 62%)",
+					"success": "hsl(154 55% 48%)",
+					"danger": "hsl(0 72% 62%)",
+					"warning": "hsl(36 100% 60%)",
+					"focusRing": "hsl(217 91% 67% / 0.65)"
+				},
+				"shadow": {
+					"soft": "0 16px 40px hsl(220 40% 3% / 0.45)",
+					"strong": "0 24px 60px hsl(220 40% 3% / 0.55)"
+				}
+			}
+		}
+	}
+}

Documentation/STYLING.md

@@ -0,0 +1,327 @@
+# Styling Reference
+
+This document explains which theme tokens control the main backgrounds, surfaces,
+borders, and shell gradients in Moku Work.
+
+It is focused on the current frontend shell scaffold so future visual tuning can
+be done intentionally instead of by guesswork.
+
+## Source Of Truth
+
+There are two places to look when changing styling tokens:
+
+- Runtime theme payload:
+  - `Frontend/public/themes/moku-default.json`
+- SCSS fallback defaults:
+  - `Frontend/src/styles/themes/_light.scss`
+  - `Frontend/src/styles/themes/_dark.scss`
+- Full sample theme file:
+  - `Documentation/STYLING-THEME-SAMPLE.json`
+
+If you want to change the actual themed values used by the app, update the theme
+JSON first. The SCSS files act as fallback/default variables.
+
+---
+
+## Core Surface Tokens
+
+These are the main tokens currently driving shell backgrounds and card surfaces:
+
+- `--color-canvas`
+  - outer page background
+- `--color-surface`
+  - standard panel/card/topbar surface
+- `--color-surface-muted`
+  - quieter secondary panels and dropdown surfaces
+- `--color-surface-hover`
+  - hover state for solid surface rows
+- `--color-border`
+  - standard card/panel border
+- `--color-border-strong`
+  - stronger shell edges, separators, and emphasized borders
+- `--color-text`
+  - primary text color
+- `--color-text-muted`
+  - secondary/meta text color
+- `--color-accent`
+  - primary accent lane
+- `--color-accent-strong`
+  - stronger accent emphasis
+- `--color-accent-soft`
+  - soft accent wash for subtle fills
+
+There are also ring-only multi-primary tokens currently used for the top-right
+profile ring:
+
+- `--color-primary-1`
+- `--color-primary-2`
+- `--color-primary-3`
+
+---
+
+## Light Mode Values
+
+Current light-mode surface values:
+
+```text
+--color-canvas: var(--gray-50)
+--color-surface: hsl(0 0% 100% / 0.9)
+--color-surface-muted: var(--gray-0)
+--color-surface-hover: var(--gray-100)
+--color-border: hsl(220 15% 85% / 0.9)
+--color-border-strong: hsl(220 12% 70% / 0.9)
+--color-text: var(--gray-800)
+--color-text-muted: var(--gray-500)
+--color-accent: var(--blue-500)
+--color-accent-strong: var(--blue-600)
+--color-accent-soft: hsl(218 88% 61% / 0.12)
+--color-primary-1: var(--blue-500)
+--color-primary-2: hsl(271 72% 60%)
+--color-primary-3: hsl(192 76% 48%)
+```
+
+## Dark Mode Values
+
+Current dark-mode surface values:
+
+```text
+--color-canvas: var(--gray-900)
+--color-surface: hsl(220 23% 14% / 0.92)
+--color-surface-muted: hsl(220 22% 12% / 0.96)
+--color-surface-hover: hsl(220 18% 20% / 0.96)
+--color-border: hsl(220 12% 26% / 0.9)
+--color-border-strong: hsl(220 12% 38% / 0.9)
+--color-text: hsl(210 20% 96%)
+--color-text-muted: hsl(220 12% 70%)
+--color-accent: hsl(217 91% 67%)
+--color-accent-strong: hsl(218 88% 61%)
+--color-accent-soft: hsl(217 91% 67% / 0.18)
+--color-primary-1: hsl(217 91% 67%)
+--color-primary-2: hsl(272 80% 70%)
+--color-primary-3: hsl(190 84% 62%)
+```
+
+---
+
+## What Controls What
+
+### 1. App Background
+
+File:
+
+- `Frontend/src/components/shell/AppShell/AppShell.module.scss`
+
+The outer app frame uses:
+
+```scss
+background: var(--color-canvas);
+color: var(--color-text);
+```
+
+So if you want to change the overall page backdrop, change `--color-canvas`.
+
+### 2. Main Shell Split Background
+
+File:
+
+- `Frontend/src/components/shell/AppShell/AppShell.module.scss`
+
+The shell derives two important internal surface blends:
+
+```text
+--sidebar-panel-surface: color-mix(in srgb, var(--color-surface-muted) 92%, transparent)
+--workspace-panel-surface: color-mix(in srgb, var(--color-canvas) 94%, var(--color-surface))
+```
+
+It also derives frame/separator borders:
+
+```text
+--shell-frame-border: color-mix(in srgb, var(--color-border-strong) 44%, transparent)
+--shell-divider-border: color-mix(in srgb, var(--color-border-strong) 34%, transparent)
+```
+
+Surface usage inside the shell:
+
+- `.body` → `var(--color-surface)`
+- `.railColumn` → `var(--color-surface)`
+- `.sidebarColumn` → `var(--sidebar-panel-surface)`
+- `.workspaceMain` → `var(--workspace-panel-surface)`
+
+The major left/right shell background is drawn by `workspaceRegion::before` using a
+horizontal gradient from sidebar surface to workspace surface.
+
+### 3. Standard Content Cards
+
+File:
+
+- `Frontend/src/components/workspace-home/WorkspaceHome/WorkspaceHome.module.scss`
+
+Cards currently use:
+
+```text
+background: var(--color-surface)
+border: 1px solid var(--color-border)
+box-shadow: var(--shadow-soft)
+```
+
+If cards feel too flat or too strong, start by adjusting:
+
+- `--color-surface`
+- `--color-border`
+
+### 4. Top Bar
+
+File:
+
+- `Frontend/src/components/shell/TopBar/TopBar.module.scss`
+
+The top bar itself uses:
+
+```text
+background: var(--color-surface)
+```
+
+Hover/focus states for top-right controls use transparent mixes based on:
+
+- `--color-text`
+- `--color-accent-strong`
+
+So the bar is mostly controlled by `--color-surface`, while the interactive polish
+comes from text/accent tokens.
+
+### 5. Server Dock
+
+File:
+
+- `Frontend/src/components/shell/ServerDock/ServerDock.module.scss`
+
+The dock uses two derived tokens:
+
+```text
+--server-dock-border: color-mix(in srgb, var(--color-border-strong) 75%, transparent)
+--server-dock-surface: color-mix(in srgb, var(--color-surface) 94%, transparent)
+```
+
+That means the dock is visually tied most strongly to:
+
+- `--color-surface`
+- `--color-border-strong`
+
+The server glyph fill uses a soft accent wash derived from:
+
+- `--color-accent-soft`
+
+### 6. Project Drawer
+
+File:
+
+- `Frontend/src/components/shell/ProjectSelector/ProjectSelector.module.scss`
+
+Important layers:
+
+- scrim:
+  - `color-mix(in srgb, black 8%, transparent)`
+- drawer panel surface:
+  - defined in `.drawer::before`
+  - vertical gradient from `--color-surface` to `--color-surface-muted`
+- current-project summary block:
+  - `color-mix(in srgb, var(--color-surface) 72%, transparent)`
+- menu row hover:
+  - based on `--color-surface-hover`
+- menu row active:
+  - based on `--color-surface`
+
+So the drawer’s look is mainly shaped by:
+
+- `--color-surface`
+- `--color-surface-muted`
+- `--color-surface-hover`
+- `--color-border-strong`
+
+### 7. Department Selector Dropdown
+
+File:
+
+- `Frontend/src/components/shell/DepartmentSelector/DepartmentSelector.module.scss`
+
+The department dropdown is intentionally solid, not blurred.
+
+It uses:
+
+```text
+.menu background: var(--color-surface-muted)
+.menu border: 1px solid var(--color-border-strong)
+.menuItem background: var(--color-surface-muted)
+.submenuItem background: var(--color-surface-muted)
+hover/active rows: var(--color-surface)
+```
+
+If the department menu feels too heavy or too subtle, start by adjusting:
+
+- `--color-surface-muted`
+- `--color-surface`
+- `--color-border-strong`
+
+---
+
+## Quick Tuning Guide
+
+If you want to change the overall visual mood quickly, these are the highest-leverage tokens:
+
+### Make the app feel lighter / airier
+
+Adjust:
+
+- `--color-canvas`
+- `--color-surface`
+- `--color-surface-muted`
+
+### Make shells/cards feel more separated
+
+Adjust:
+
+- `--color-border`
+- `--color-border-strong`
+- `--color-surface-muted`
+
+### Make accent washes more or less noticeable
+
+Adjust:
+
+- `--color-accent-soft`
+
+### Change the visual personality of the profile ring
+
+Adjust:
+
+- `--color-primary-1`
+- `--color-primary-2`
+- `--color-primary-3`
+
+---
+
+## Practical Rule Of Thumb
+
+Use this mental model:
+
+```text
+canvas           = app/page background
+surface          = primary panel or card
+surface-muted    = quieter secondary panel
+surface-hover    = solid hover state
+border           = normal edge
+border-strong    = stronger shell edge or divider
+accent-soft      = subtle tinted wash
+primary-1/2/3    = decorative multi-color accents
+```
+
+If you are unsure where to start, tune these in this order:
+
+1. `--color-canvas`
+2. `--color-surface`
+3. `--color-surface-muted`
+4. `--color-border`
+5. `--color-border-strong`
+6. `--color-accent-soft`
+
+That usually gives the biggest visual shift with the fewest unintended side effects.

Documentation/TODO.md

@@ -4,87 +4,149 @@
 
 ### Version 0.1.0
 
-**Goal:** Barebone frontend with a real backend core.
+**Goal:** Finish the base application shell, auth, and platform foundations.
 
-#### Architecture
+#### Architecture and Delivery
 
-- [ ] Project-Structure
-- [ ] Stack-Decisions
-- [ ] Proxy
-  - [ ] Local-Prod-NGINX-Proxy
-  - [ ] Static-Frontend-Serving
-- [ ] First-Request-Web-Loader
-  - [ ] Bootstrap-Document
-  - [ ] Route-Intent-Handoff
-  - [ ] Tiny-First-Paint-Budget
-- [ ] Dev-and-Prod-Builds
+- [x] Project-Structure
+- [x] Stack-Decisions
+- [x] Proxy
+  - [x] Local-Dev-Vite-Proxy
+  - [x] Local-Prod-NGINX-Proxy
+- [x] First-Request-Web-Loader
+  - [x] Bootstrap-Document
+  - [x] Route-Intent-Handoff
+  - [x] Tiny-First-Paint-Budget
+- [x] Dev-and-Prod-Builds
   - [x] Local-Dev-Just-Commands
   - [x] Local-Dev-Docker-Compose
-  - [ ] Local-Prod-Just-Commands
-  - [ ] Local-Prod-Docker-Compose
-  - [ ] Frontend-Production-Dockerfile
-  - [ ] Frontend-docker-bake
+  - [x] Local-Prod-Just-Commands
+  - [x] Local-Prod-Docker-Compose
+  - [x] Frontend-Production-Dockerfile
+  - [x] Frontend-docker-bake
 
-#### Backend
+#### Backend — Done Foundations
+
+- [x] Bootstrap-Persistence
+  - [x] Installation-Step
+  - [x] Mode-Step
+  - [x] Admin-Step
+  - [x] Structure-Step
+  - [x] Bootstrap-State-Authority
+  - [x] Development-Bootstrap-Reset
+- [x] Base-Schema
+  - [x] Installations
+  - [x] Users
+  - [x] User-Homes
+  - [x] Organizations
+  - [x] Departments
+  - [x] Teams
+  - [x] Projects
+  - [x] Workspaces
+  - [x] Membership-Tables
+- [x] App-Shell-Read-API
+  - [x] App-Shell-State-Endpoint
+  - [x] Bootstrap-Read-Endpoints
+  - [x] Shell-Tree-Hydration
+- [x] Web-Route-Scaffolds
+  - [x] Session-Endpoint-Scaffold
+  - [x] Bootstrap-Endpoint-Scaffold
+  - [x] Current-User-Endpoint-Scaffold
+
+#### Backend — Remaining for 0.1.0
 
 - [ ] Auth
   - [ ] Session-Flow
   - [ ] Login-Logout-Foundation
   - [ ] Authentication
-- [ ] User
-  - [ ] Base-Model
+- [ ] Current-User-Implementation
+- [ ] POSIX-Lite-File-Persistence-Foundation
+  - [ ] Mounted-Storage-Root-Config
+  - [ ] Project-Folder-Creation-On-Backend
+  - [ ] moku.project.json
+  - [ ] Item-Folder-Creation
+  - [ ] item.json
+  - [ ] schema.json
+  - [ ] data.json
+  - [ ] DB-To-Files-Write-Flow
+- [ ] User-and-Workspace-Domain-Readiness
   - [ ] Base-Workspace
-    - [ ] Folders-and-Subfolders
-    - [ ] Boards
-    - [ ] Dashboard
-- [ ] Organization
-  - [ ] Base-Model
-  - [ ] Access-Rules-and-Membership
-- [ ] Workspace
-  - [ ] Folders-and-Subfolders
+  - [ ] Boards
+  - [ ] Dashboard
 - [ ] API
+  - [ ] Real-Organizations-Read-Endpoint
+  - [ ] Real-Workspaces-Read-Endpoint
+  - [ ] Tree-Mutation-Endpoints
+  - [ ] Project-Creation-Endpoint
 
-#### Frontend
+#### Frontend — Done Foundations
 
 - [x] Foundation
 - [x] Typography
 - [x] Icons
-- [ ] App Shell
+- [x] App-Shell
+  - [x] Left-Rail
+  - [x] Top-Bar
+  - [x] Server-Dock
+  - [x] Department-Selector
+  - [x] Theme-Toggle
+  - [x] Notifications-Menu
+  - [x] Profile-Menu
+- [x] Responsive-Shell
+  - [x] Collapsible-Shell
+  - [x] Mobile-Bottom-Nav
+  - [x] Mobile-Workspace-Browser
+  - [x] Mobile-Workspace-Views
+- [x] Context-Menus
+  - [x] Workspace-Context-Menu
+  - [x] Project-Context-Menu
+- [x] Bootstrap-Workspace-Home
+  - [x] Bootstrap-Wizard
+  - [x] Bootstrap-Step-Submission
+  - [x] App-Shell-Reload-After-Bootstrap
+- [x] Project-Menu
+  - [x] Folders-and-Subfolders
+  - [x] Rooted-From-Department
+  - [x] Long-Press-Drag-and-Drop
+- [x] Workspace-Tree
+  - [x] Folders-and-Subfolders
+  - [x] Long-Press-Drag-and-Drop
+- [x] App-Shell-Hydration
+
+#### Frontend — Remaining for 0.1.0
+
 - [ ] Primitives
   - [ ] Button
   - [ ] IconButton
   - [ ] Input
   - [ ] Surface
-- [ ] Nav-Bar
 - [ ] Workspace-Switching
-- [ ] Workspace-Home
+- [ ] Real-Workspace-Home
+- [ ] Real-Workspace-Tree-Hydration
+- [ ] Create-Project-Flow
+- [ ] Persist-Tree-Mutations
+- [ ] Connect-Tree-Interactions-To-Backend-Data
 
 ### Version 0.2.0
 
-**Goal:** First real work surface.
-
-- [ ] Table
-- [ ] CVA
-- [ ] Storyboard
-- [ ] Theme-System
-  - [ ] Theme-Registry
-  - [ ] Built-In-Theme-Presets
-  - [ ] Active-Theme-Persistence
-  - [ ] Theme-Switcher
-  - [ ] Theme-JSON-Upload
-  - [ ] Theme-JSON-Import-Validation
-  - [ ] Community-Theme-Readiness
+**Goal:** Build the plugin app system on top of the base platform. And core app plugins like calendar, board, docs and text channels
 
 ### Version 0.3.0
 
-**Goal:** Documents and system hardening.
-
-- [ ] Document
-- [ ] Accessibility-Rules
-- [ ] Motion-Foundation
+**Goal:** Communications and Collaboration (Email System, Reminder System, and Live Collaboration on Documents)
 
 ### Version 0.4.0
 
-- [ ] Gantt-Board
-- [ ] Calendar
-- [ ] Timeline
+**Goal:** Introduce the POSIX-based file system drive direction with OnlyOffice + S3 blob storage + Per File Versioning
+
+### Version 0.5.0
+
+**Goal:** File Sharing and Per File Permissions
+
+### Version 0.6.0
+
+**Goal:** Git as a core plugin
+
+### Version 0.7.0
+
+**Goal:** Full Automation System (Extensive)

Env/.env.example

@@ -0,0 +1,19 @@
+ALLOWED_HOSTS=
+
+APP_NAME=moku
+GO_ENV=development
+LOG_LEVEL=debug
+
+BACKEND_WEB_PORT=8080
+BACKEND_API_PORT=8081
+BACKEND_SHUTDOWN_TIMEOUT=10s
+
+DATABASE_URL=postgres://moku:moku_dev_password@localhost:5432/moku?sslmode=disable
+VALKEY_URL=redis://localhost:6379/0
+POSIX_ROOT=../POSIX
+
+VITE_API_BASE_URL=/v1
+
+# Local frontend dev uses the Vite proxy for /v1 requests.
+# Override only if the browser must call the API directly:
+# VITE_API_BASE_URL=http://localhost:8081/v1

Frontend/public/themes/moku-default.json

@@ -134,6 +134,9 @@
 					"accentStrong": "var(--blue-600)",
 					"accentSoft": "hsl(218 88% 61% / 0.12)",
 					"accentContrast": "hsl(0 0% 100%)",
+					"primaryOne": "var(--blue-500)",
+					"primaryTwo": "hsl(271 72% 60%)",
+					"primaryThree": "hsl(192 76% 48%)",
 					"success": "var(--green-500)",
 					"danger": "var(--red-500)",
 					"warning": "var(--amber-500)",
@@ -155,6 +158,9 @@
 					"accentStrong": "hsl(218 88% 61%)",
 					"accentSoft": "hsl(217 91% 67% / 0.18)",
 					"accentContrast": "hsl(220 28% 10%)",
+					"primaryOne": "hsl(217 91% 67%)",
+					"primaryTwo": "hsl(272 80% 70%)",
+					"primaryThree": "hsl(190 84% 62%)",
 					"success": "hsl(154 55% 48%)",
 					"danger": "hsl(0 72% 62%)",
 					"warning": "hsl(36 100% 60%)",

Frontend/public/themes/moku-midnight.json

@@ -0,0 +1,177 @@
+{
+	"schemaVersion": "1.0.0",
+	"id": "moku-midnight",
+	"name": "Moku Midnight",
+	"description": "A warm, low-light Moku theme inspired by the mood and palette direction of refact0r's Midnight Discord theme, adapted to Moku's token schema.",
+	"author": "Moku Work",
+	"tokens": {
+		"shared": {
+			"palette": {
+				"gray": {
+					"0": "#f9f5d7",
+					"50": "#fbf1c7",
+					"100": "#ebdbb2",
+					"200": "#d5c4a1",
+					"300": "#bdae93",
+					"400": "#a89984",
+					"500": "#928374",
+					"600": "#7c6f64",
+					"700": "#665c54",
+					"800": "#3c3836",
+					"900": "#282828"
+				},
+				"blue": {
+					"400": "hsl(167 24% 68%)",
+					"500": "#7caea3",
+					"600": "hsl(167 24% 48%)"
+				},
+				"green": {
+					"500": "#a8b665"
+				},
+				"red": {
+					"500": "#ea6962"
+				},
+				"amber": {
+					"500": "#d8a656"
+				}
+			},
+			"space": {
+				"1": "0.25rem",
+				"2": "0.5rem",
+				"3": "0.75rem",
+				"4": "1rem",
+				"5": "1.25rem",
+				"6": "1.5rem",
+				"8": "2rem",
+				"10": "2.5rem",
+				"12": "3rem"
+			},
+			"radius": {
+				"sm": "0.375rem",
+				"md": "0.625rem",
+				"lg": "0.875rem",
+				"xl": "1.25rem",
+				"pill": "999px"
+			},
+			"size": {
+				"controlMd": "2.25rem",
+				"controlLg": "2.5rem",
+				"contentWidthWide": "72rem",
+				"blurOverlay": "18px"
+			},
+			"shadow": {
+				"soft": "0 12px 28px hsl(28 16% 12% / 0.08)",
+				"strong": "0 18px 40px hsl(28 18% 10% / 0.14)"
+			},
+			"zIndex": {
+				"base": "1",
+				"dropdown": "100",
+				"sticky": "200",
+				"overlay": "400",
+				"modal": "500",
+				"toast": "600"
+			},
+			"motion": {
+				"durationFast": "140ms",
+				"durationBase": "220ms",
+				"durationSlow": "320ms",
+				"easeStandard": "cubic-bezier(0.2, 0.8, 0.2, 1)"
+			},
+			"typography": {
+				"fontFamily": {
+					"sans": "Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
+					"heading": "Inter, \"Avenir Next\", \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
+					"display": "Inter, \"Avenir Next\", \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
+					"serif": "ui-serif, Georgia, Cambria, \"Times New Roman\", Times, serif",
+					"mono": "ui-monospace, \"SF Mono\", \"SFMono-Regular\", Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace"
+				},
+				"fontSize": {
+					"caption": "0.75rem",
+					"label": "0.875rem",
+					"body": "1rem",
+					"title": "clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem)",
+					"heading": "clamp(1.5rem, 1.2rem + 1vw, 2.125rem)",
+					"display": "clamp(2.25rem, 1.7rem + 2.2vw, 3.75rem)"
+				},
+				"lineHeight": {
+					"caption": "1.4",
+					"label": "1.35",
+					"body": "1.55",
+					"title": "1.3",
+					"heading": "1.15",
+					"display": "1.05"
+				},
+				"fontWeight": {
+					"caption": "500",
+					"label": "600",
+					"body": "400",
+					"title": "600",
+					"heading": "600",
+					"display": "700"
+				},
+				"letterSpacing": {
+					"caption": "0.01em",
+					"label": "0.005em",
+					"body": "0",
+					"title": "-0.01em",
+					"heading": "-0.02em",
+					"display": "-0.03em"
+				}
+			}
+		},
+		"modes": {
+			"light": {
+				"colorScheme": "light",
+				"colors": {
+					"canvas": "hsl(38 24% 97%)",
+					"surface": "hsl(36 22% 99% / 0.94)",
+					"surfaceMuted": "hsl(36 20% 96%)",
+					"surfaceHover": "hsl(34 18% 93%)",
+					"border": "hsl(30 14% 76% / 0.72)",
+					"borderStrong": "hsl(28 16% 60% / 0.82)",
+					"text": "hsl(22 16% 22%)",
+					"textMuted": "hsl(28 10% 42%)",
+					"accent": "#d3869b",
+					"accentStrong": "hsl(344 47% 56%)",
+					"accentSoft": "hsl(344 47% 70% / 0.12)",
+					"accentContrast": "var(--gray-0)",
+					"primaryOne": "#7caea3",
+					"primaryTwo": "#d3869b",
+					"primaryThree": "#d8a656",
+					"success": "#a8b665",
+					"danger": "#ea6962",
+					"warning": "#d8a656",
+					"focusRing": "hsl(344 47% 56% / 0.28)"
+				}
+			},
+			"dark": {
+				"colorScheme": "dark",
+				"colors": {
+					"canvas": "var(--gray-900)",
+					"surface": "hsl(20 8% 16% / 0.94)",
+					"surfaceMuted": "var(--gray-800)",
+					"surfaceHover": "hsl(22 9% 24% / 0.96)",
+					"border": "hsl(20 10% 30% / 0.72)",
+					"borderStrong": "hsl(30 14% 55% / 0.62)",
+					"text": "#d4be98",
+					"textMuted": "#a79a83",
+					"accent": "#d3869b",
+					"accentStrong": "hsl(344 47% 63%)",
+					"accentSoft": "hsl(344 47% 63% / 0.18)",
+					"accentContrast": "var(--gray-900)",
+					"primaryOne": "#7caea3",
+					"primaryTwo": "#d3869b",
+					"primaryThree": "#d8a656",
+					"success": "#a8b665",
+					"danger": "#ea6962",
+					"warning": "#d8a656",
+					"focusRing": "hsl(344 47% 63% / 0.45)"
+				},
+				"shadow": {
+					"soft": "0 14px 32px hsl(20 16% 3% / 0.28)",
+					"strong": "0 20px 48px hsl(20 16% 2% / 0.38)"
+				}
+			}
+		}
+	}
+}

Frontend/src/app.tsx

@@ -3,6 +3,7 @@
 import type { JSX } from "solid-js";
 import { AppShell } from "./components/shell/AppShell/AppShell";
 import "./styles/main.scss";
+import "./styles/user-overrides.scss";
 
 const App = (): JSX.Element => {
 	return <AppShell />;

Frontend/src/components/shell/AppShell/AppShell.module.scss

@@ -8,13 +8,16 @@
 }
 
 .body {
+  --shell-dock-clearance: calc(var(--space-12) + var(--space-12) + var(--space-8));
   --rail-width: 4.75rem;
   --sidebar-width: 16.75rem;
+  --mobile-bottom-nav-clearance: 0rem;
   --shell-top-left-radius: calc(var(--radius-xl) + var(--space-1));
   --shell-frame-border: color-mix(in srgb, var(--color-border-strong) 44%, transparent);
   --shell-divider-border: color-mix(in srgb, var(--color-border-strong) 34%, transparent);
   --sidebar-panel-surface: color-mix(in srgb, var(--color-surface-muted) 92%, transparent);
   --workspace-panel-surface: color-mix(in srgb, var(--color-canvas) 94%, var(--color-surface));
+  position: relative;
   min-height: 0;
   display: grid;
   grid-template-columns: var(--rail-width) minmax(0, 1fr);
@@ -22,11 +25,21 @@
   background: var(--color-surface);
 }
 
+.bodyRailCollapsed {
+  --rail-width: 0rem;
+}
+
+.bodySidebarCollapsed {
+  --sidebar-width: 0rem;
+}
+
 .railColumn {
   min-height: 0;
   display: flex;
   position: relative;
-  z-index: 1;
+  z-index: 6;
+  isolation: isolate;
+  overflow: visible;
   background: var(--color-surface);
 }
 
@@ -90,11 +103,22 @@
   border-top-right-radius: 0;
 }
 
+.mobileWorkspaceView {
+  min-width: 0;
+  min-height: 0;
+  height: 100%;
+  display: grid;
+  box-sizing: border-box;
+  overflow: hidden;
+  background: var(--workspace-panel-surface);
+}
+
 .sidebarDock {
   position: absolute;
-  right: var(--space-1);
   bottom: var(--space-3);
-  left: calc(var(--space-1) - (var(--rail-width) * 0.9));
+  left: calc(var(--space-1) + (var(--rail-width) * 0.1));
+  width: max(12rem, calc(var(--sidebar-width) + (var(--rail-width) * 0.9) - var(--space-2)));
+  right: auto;
   z-index: calc(var(--z-modal) + 1);
   pointer-events: none;
 
@@ -108,6 +132,14 @@
     --rail-width: 5rem;
     --sidebar-width: 17.25rem;
   }
+
+  .bodyRailCollapsed {
+    --rail-width: 0rem;
+  }
+
+  .bodySidebarCollapsed {
+    --sidebar-width: 0rem;
+  }
 }
 
 @include respond-down(tablet) {
@@ -115,21 +147,102 @@
     --rail-width: 4.5rem;
     --sidebar-width: 13.25rem;
   }
+
+  .bodyRailCollapsed {
+    --rail-width: 0rem;
+  }
+
+  .bodySidebarCollapsed {
+    --sidebar-width: 0rem;
+  }
+}
+
+.bodyRailCollapsed .railColumn {
+  overflow: hidden;
+}
+
+.bodySidebarCollapsed .railColumn {
+  --rail-dock-clearance: 0rem;
+}
+
+.bodySidebarCollapsed:not(.bodyRailCollapsed) .railColumn {
+  --rail-bottom-offset: var(--space-3);
+}
+
+.bodySidebarCollapsed .sidebarColumn {
+  --sidebar-dock-clearance: 0rem;
+  display: none;
+  overflow: hidden;
+  border-left-width: 0;
+  border-top-width: 0;
+}
+
+.bodySidebarCollapsed .workspaceRegion {
+  grid-template-columns: minmax(0, 1fr);
+}
+
+.bodySidebarCollapsed .workspaceMain {
+  border-left-color: transparent;
+}
+
+.bodySidebarCollapsed:not(.bodyRailCollapsed) .workspaceMain {
+  border-top-width: 1px;
+  border-top-color: var(--shell-frame-border);
+  border-left-color: var(--shell-frame-border);
+  border-top-left-radius: var(--shell-top-left-radius);
+  box-shadow: none;
+}
+
+.bodySidebarCollapsed:not(.bodyRailCollapsed) .workspaceRegion::before {
+  display: none;
+}
+
+.bodySidebarCollapsed .sidebarDock {
+  display: none;
 }
 
 @include respond-down(mobile) {
   .body {
-    grid-template-columns: 4.5rem minmax(0, 1fr);
-    --rail-width: 4.5rem;
+    grid-template-columns: minmax(0, 1fr);
+    --rail-width: 0rem;
+    --sidebar-width: 0rem;
+    --mobile-bottom-nav-clearance: calc(var(--space-12) + var(--space-10) + env(safe-area-inset-bottom, 0px));
   }
 
   .railColumn {
-    position: sticky;
-    top: 0;
+    display: none;
   }
 
-  .workspaceRegion,
+  .workspaceRegion {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr);
+    border-top-left-radius: 0;
+  }
+
+  .workspaceRegion::before {
+    background: var(--workspace-panel-surface);
+    border-left-width: 0;
+    border-right-width: 0;
+    border-top-left-radius: 0;
+  }
+
+  .sidebarColumn,
   .sidebarDock {
     display: none;
   }
+
+  .workspaceMain {
+    border-left-width: 0;
+    border-top-right-radius: 0;
+    border-top-left-radius: 0;
+    box-sizing: border-box;
+    padding-bottom: var(--mobile-bottom-nav-clearance);
+  }
+
+  .mobileWorkspaceView {
+    height: 100%;
+    max-height: none;
+    padding-bottom: 0;
+    background: var(--workspace-panel-surface);
+  }
 }

Frontend/src/components/shell/AppShell/AppShell.tsx

@@ -1,19 +1,54 @@
 // Path: Frontend/src/components/shell/AppShell/AppShell.tsx
 
-import { createSignal, onMount, type JSX } from "solid-js";
+import { createSignal, onCleanup, onMount, Show, type JSX } from "solid-js";
 import { getDocumentTheme, setTheme, type Theme } from "../../../theme/runtime";
 import { WorkspaceHome } from "../../workspace-home/WorkspaceHome/WorkspaceHome";
+import { AppShellDataProvider, useAppShellData } from "../data/app-shell.context";
 import { LeftRail } from "../LeftRail/LeftRail";
-import { ProfileDock } from "../ProfileDock/ProfileDock";
+import { MobileBottomNav } from "../MobileBottomNav/MobileBottomNav";
+import { MobileWorkspaceBrowser } from "../MobileWorkspaceBrowser/MobileWorkspaceBrowser";
+import { ServerDock } from "../ServerDock/ServerDock";
+import { NotificationsMenu } from "../TopBar/NotificationsMenu";
+import { ProfileMenu } from "../TopBar/ProfileMenu";
 import { TopBar } from "../TopBar/TopBar";
 import { WorkspaceSidebar } from "../WorkspaceSidebar/WorkspaceSidebar";
 import styles from "./AppShell.module.scss";
 
-export const AppShell = (): JSX.Element => {
+type MobileWorkspaceView = "notifications" | "profile" | null;
+const MOBILE_VIEWPORT_QUERY = "(max-width: 48rem)";
+
+const AppShellContent = (): JSX.Element => {
 	const [themeState, setThemeState] = createSignal<Theme>("light");
+	const [isRailCollapsed, setIsRailCollapsed] = createSignal(false);
+	const [isSidebarCollapsed, setIsSidebarCollapsed] = createSignal(false);
+	const [isMobileViewport, setIsMobileViewport] = createSignal(false);
+	const [isMobileWorkspaceBrowserOpen, setIsMobileWorkspaceBrowserOpen] = createSignal(false);
+	const [activeMobileWorkspaceView, setActiveMobileWorkspaceView] = createSignal<MobileWorkspaceView>(null);
+	const appShellData = useAppShellData();
 
 	onMount((): void => {
 		setThemeState(getDocumentTheme());
+
+		if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
+			return;
+		}
+
+		const mediaQuery = window.matchMedia(MOBILE_VIEWPORT_QUERY);
+		const syncMobileViewport = (): void => {
+			setIsMobileViewport(mediaQuery.matches);
+
+			if (!mediaQuery.matches) {
+				setIsMobileWorkspaceBrowserOpen(false);
+				setActiveMobileWorkspaceView(null);
+			}
+		};
+
+		syncMobileViewport();
+		mediaQuery.addEventListener("change", syncMobileViewport);
+
+		onCleanup(() => {
+			mediaQuery.removeEventListener("change", syncMobileViewport);
+		});
 	});
 
 	const toggleTheme = (): void => {
@@ -23,28 +58,118 @@ export const AppShell = (): JSX.Element => {
 		setThemeState(next);
 	};
 
+	const openMobileWorkspaceView = (view: Exclude<MobileWorkspaceView, null>): void => {
+		setIsMobileWorkspaceBrowserOpen(false);
+		setActiveMobileWorkspaceView((current) => (current === view ? null : view));
+	};
+
+	const toggleMobileWorkspaceBrowser = (): void => {
+		setActiveMobileWorkspaceView(null);
+		setIsMobileWorkspaceBrowserOpen((open) => !open);
+	};
+
+	const toggleMobileNotifications = (): void => {
+		openMobileWorkspaceView("notifications");
+	};
+
+	const toggleMobileProfile = (): void => {
+		openMobileWorkspaceView("profile");
+	};
+
+	const closeMobileWorkspaceView = (): void => {
+		setActiveMobileWorkspaceView(null);
+	};
+
 	return (
-		<div class={styles.shell}>
-			<TopBar theme={themeState()} onToggleTheme={toggleTheme} />
-			<div class={styles.body}>
-				<div class={styles.railColumn}>
-					<LeftRail />
+		<div class={styles.shell} data-ui="app-shell" data-app-shell-status={appShellData.status()}>
+			<TopBar
+				theme={themeState()}
+				onToggleTheme={toggleTheme}
+				isMobileViewport={isMobileViewport()}
+				isNotificationsOpen={activeMobileWorkspaceView() === "notifications"}
+				isProfileOpen={activeMobileWorkspaceView() === "profile"}
+				onToggleNotifications={toggleMobileNotifications}
+				onToggleProfile={toggleMobileProfile}
+			/>
+
+			<div
+				classList={{
+					[styles.body]: true,
+					[styles.bodyRailCollapsed]: isRailCollapsed(),
+					[styles.bodySidebarCollapsed]: isSidebarCollapsed(),
+				}}
+				data-slot="shell-body"
+				data-rail-collapsed={isRailCollapsed() ? "true" : "false"}
+				data-sidebar-collapsed={isSidebarCollapsed() ? "true" : "false"}
+			>
+				{/* Left server rail */}
+				<div class={styles.railColumn} data-slot="rail-column">
+					<LeftRail collapsed={isRailCollapsed()} />
 				</div>
 
-				<div class={styles.workspaceRegion}>
-					<div class={styles.sidebarColumn}>
-						<WorkspaceSidebar />
-
-						<div class={styles.sidebarDock}>
-							<ProfileDock />
-						</div>
+				{/* Sidebar + main workspace frame */}
+				<div class={styles.workspaceRegion} data-slot="workspace-region">
+					<div class={styles.sidebarColumn} data-slot="sidebar-column">
+						<WorkspaceSidebar
+							collapsed={isSidebarCollapsed()}
+							railCollapsed={isRailCollapsed()}
+							onToggleRailCollapse={(): void => {
+								setIsRailCollapsed((collapsed) => !collapsed);
+							}}
+						/>
 					</div>
 
-					<div class={styles.workspaceMain}>
-						<WorkspaceHome />
+					<div class={styles.workspaceMain} data-slot="workspace-main">
+						{/* On mobile, top-bar menus become full workspace views instead of popovers. */}
+						<Show
+							when={isMobileViewport() && activeMobileWorkspaceView() !== null}
+							fallback={
+								<WorkspaceHome
+									sidebarCollapsed={isSidebarCollapsed()}
+									onToggleSidebarCollapse={(): void => {
+										setIsSidebarCollapsed((collapsed) => !collapsed);
+									}}
+								/>
+							}
+						>
+							<div class={styles.mobileWorkspaceView} data-slot="mobile-workspace-view" data-view={activeMobileWorkspaceView() ?? undefined}>
+								<Show when={activeMobileWorkspaceView() === "notifications"}>
+									<NotificationsMenu id="mobile-workspace-notifications" onSelect={closeMobileWorkspaceView} variant="workspace" />
+								</Show>
+								<Show when={activeMobileWorkspaceView() === "profile"}>
+									<ProfileMenu id="mobile-workspace-profile" onSelect={closeMobileWorkspaceView} variant="workspace" />
+								</Show>
+							</div>
+						</Show>
 					</div>
 				</div>
+
+				{/* Floating server dock overlay */}
+				<div class={styles.sidebarDock} data-slot="sidebar-dock">
+					<ServerDock />
+				</div>
 			</div>
+
+			<MobileBottomNav
+				isBrowseOpen={isMobileWorkspaceBrowserOpen()}
+				onBrowseToggle={(): void => {
+					toggleMobileWorkspaceBrowser();
+				}}
+			/>
+			<MobileWorkspaceBrowser
+				open={isMobileWorkspaceBrowserOpen()}
+				onClose={(): void => {
+					setIsMobileWorkspaceBrowserOpen(false);
+				}}
+			/>
 		</div>
 	);
 };
+
+export const AppShell = (): JSX.Element => {
+	return (
+		<AppShellDataProvider>
+			<AppShellContent />
+		</AppShellDataProvider>
+	);
+};

Frontend/src/components/shell/DepartmentSelector/DepartmentSelector.module.scss

@@ -0,0 +1,221 @@
+.root {
+  position: relative;
+  min-width: 0;
+}
+
+.selector {
+  min-width: 0;
+  padding: 0;
+  display: inline-flex;
+  align-items: flex-end;
+  justify-content: flex-start;
+  gap: var(--space-2);
+  border: 0;
+  background: transparent;
+  color: var(--color-text);
+  text-align: left;
+  transition:
+    background-color 180ms var(--easing-standard),
+    color 180ms var(--easing-standard);
+}
+
+.selectorOpen {
+  .meta,
+  .icon {
+    color: var(--color-text-subtle);
+  }
+}
+
+.selector:hover {
+  .value {
+    color: var(--color-text);
+  }
+
+  .meta,
+  .icon {
+    color: var(--color-text-subtle);
+  }
+}
+
+.selector:focus-visible {
+  outline: none;
+  border-radius: var(--radius-sm);
+  box-shadow: 0 0 0 0.12rem color-mix(in srgb, var(--color-accent-soft) 14%, transparent);
+}
+
+.copy {
+  min-width: 0;
+  display: inline-flex;
+  align-items: baseline;
+  gap: var(--space-1);
+}
+
+.value {
+  @include text-title;
+  color: var(--color-text);
+  font-weight: var(--font-weight-title);
+  line-height: 1;
+}
+
+.meta {
+  @include text-caption;
+  color: var(--color-text-muted);
+  line-height: 1;
+  padding-left: var(--space-1);
+}
+
+.icon {
+  flex: 0 0 auto;
+  color: var(--color-text-muted);
+  transition: transform 180ms var(--easing-standard), color 180ms var(--easing-standard);
+}
+
+.iconOpen {
+  transform: rotate(180deg);
+}
+
+.menu {
+  position: absolute;
+  top: calc(100% + var(--space-2));
+  left: 0;
+  min-width: min(18rem, calc(100vw - (var(--space-4) * 2)));
+  display: grid;
+  gap: var(--space-2);
+  padding: var(--space-2);
+  border: 1px solid var(--color-border-strong);
+  border-radius: var(--radius-md);
+  background: var(--color-surface-muted);
+  box-shadow: 0 16px 32px color-mix(in srgb, black 18%, transparent);
+  z-index: 20;
+}
+
+.menuSection {
+  display: grid;
+  gap: calc(var(--space-1) / 2);
+}
+
+.menuSectionLabel {
+  @include text-caption;
+  display: block;
+  color: var(--color-text-muted);
+  letter-spacing: 0.05em;
+  text-transform: uppercase;
+  padding-inline: var(--space-1);
+  margin-bottom: var(--space-2);
+}
+
+.menuDivider {
+  height: 1px;
+  background: var(--color-border);
+}
+
+.menuItem {
+  min-width: 0;
+  min-height: 2.75rem;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  padding: var(--space-2) var(--space-2);
+  border: 1px solid transparent;
+  border-radius: var(--radius-sm);
+  background: var(--color-surface-muted);
+  color: var(--color-text);
+  text-align: left;
+  transition:
+    background-color 160ms var(--easing-standard),
+    border-color 160ms var(--easing-standard);
+}
+
+.menuItem:hover {
+  border-color: var(--color-border);
+  background: var(--color-surface);
+}
+
+.menuItemActive {
+  border-color: var(--color-accent-soft);
+  background: var(--color-surface);
+}
+
+.menuItemCopy {
+  min-width: 0;
+  display: grid;
+  gap: 0;
+}
+
+.menuItemValue {
+  @include text-label;
+  color: var(--color-text);
+  font-weight: var(--font-weight-semibold);
+}
+
+.menuItemMeta {
+  @include text-caption;
+  color: var(--color-text-muted);
+}
+
+.submenuItem {
+  min-width: 0;
+  min-height: 2.5rem;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  gap: var(--space-2);
+  padding: var(--space-2) var(--space-2) var(--space-2) var(--space-3);
+  border: 1px solid transparent;
+  border-radius: var(--radius-sm);
+  background: var(--color-surface-muted);
+  color: var(--color-text);
+  text-align: left;
+  transition:
+    background-color 160ms var(--easing-standard),
+    border-color 160ms var(--easing-standard);
+}
+
+.submenuItem:hover {
+  border-color: var(--color-border);
+  background: var(--color-surface);
+}
+
+.submenuItemActive {
+  border-color: var(--color-accent-soft);
+  background: var(--color-surface);
+}
+
+.submenuIndicator {
+  width: calc(var(--space-1) + (var(--space-1) / 2));
+  height: calc(var(--space-1) + (var(--space-1) / 2));
+  flex: 0 0 auto;
+  border-radius: 999px;
+  background: var(--color-accent-soft);
+}
+
+@include respond-down(mobile) {
+  .selector {
+    align-items: flex-end;
+    gap: var(--space-1);
+  }
+
+  .copy {
+    gap: var(--space-2);
+  }
+
+  .value {
+    line-height: 0.95;
+  }
+
+  .meta {
+    font-size: 0.68rem;
+    line-height: 1;
+    letter-spacing: 0.01em;
+    padding-bottom: calc(var(--space-1) / 2);
+  }
+
+  .icon {
+    align-self: flex-end;
+    margin-bottom: calc(var(--space-1) / 2);
+  }
+
+  .menu {
+    min-width: min(16rem, calc(100vw - (var(--space-4) * 2)));
+  }
+}

Frontend/src/components/shell/DepartmentSelector/DepartmentSelector.tsx

@@ -0,0 +1,120 @@
+import { For, createEffect, createSignal, onCleanup, onMount, type JSX } from "solid-js";
+import { ChevronDown } from "../../../lib/icons";
+import { useAppShellData } from "../data/app-shell.context";
+import { type DepartmentItem } from "../data/shell.data";
+import styles from "./DepartmentSelector.module.scss";
+
+export const DepartmentSelector = (): JSX.Element => {
+	const appShellData = useAppShellData();
+	const [isOpen, setIsOpen] = createSignal(false);
+	const [selectedDepartment, setSelectedDepartment] = createSignal<DepartmentItem>(appShellData.departmentItems()[0] ?? appShellData.activeDepartment());
+	const [selectedTeamName, setSelectedTeamName] = createSignal(appShellData.activeDepartment().teamName);
+
+	let rootRef: HTMLDivElement | undefined;
+
+	createEffect(() => {
+		const activeDepartment = appShellData.activeDepartment();
+		const matchingDepartment = appShellData.departmentItems().find((item) => item.id === activeDepartment.id) ?? appShellData.departmentItems()[0];
+
+		if (!matchingDepartment) {
+			return;
+		}
+
+		setSelectedDepartment(matchingDepartment);
+		setSelectedTeamName(activeDepartment.teamName || matchingDepartment.teams[0] || "");
+	});
+
+	onMount(() => {
+		const handlePointerDown = (event: PointerEvent): void => {
+			if (!isOpen()) return;
+			if (!rootRef) return;
+
+			const target = event.target;
+			if (target instanceof Node && !rootRef.contains(target)) {
+				setIsOpen(false);
+			}
+		};
+
+		document.addEventListener("pointerdown", handlePointerDown);
+		onCleanup(() => document.removeEventListener("pointerdown", handlePointerDown));
+	});
+
+	const selectDepartment = (item: DepartmentItem): void => {
+		setSelectedDepartment(item);
+		setSelectedTeamName(item.teams[0] ?? "");
+	};
+
+	const selectTeam = (teamName: string): void => {
+		setSelectedTeamName(teamName);
+		setIsOpen(false);
+	};
+
+	return (
+		<div class={styles.root} ref={rootRef}>
+			<button
+				classList={{ [styles.selector]: true, [styles.selectorOpen]: isOpen() }}
+				type="button"
+				aria-label="Select department"
+				title="Select department"
+				aria-haspopup="menu"
+				aria-expanded={isOpen()}
+				onClick={() => setIsOpen((open) => !open)}
+			>
+				<span class={styles.copy}>
+					<strong class={styles.value}>{selectedDepartment().name}</strong>
+					<span class={styles.meta}>{selectedTeamName()}</span>
+				</span>
+
+				<ChevronDown classList={{ [styles.icon]: true, [styles.iconOpen]: isOpen() }} size={16} strokeWidth={2} />
+			</button>
+
+			{isOpen() ? (
+				<div class={styles.menu} role="menu" aria-label="Department selector menu">
+					<div class={styles.menuSection}>
+						<span class={styles.menuSectionLabel}>Departments</span>
+
+						<For each={appShellData.departmentItems()}>
+							{(item): JSX.Element => (
+								<button
+									classList={{ [styles.menuItem]: true, [styles.menuItemActive]: item.id === selectedDepartment().id }}
+									type="button"
+									role="menuitemradio"
+									aria-checked={item.id === selectedDepartment().id}
+									onClick={() => selectDepartment(item)}
+								>
+									<div class={styles.menuItemCopy}>
+										<strong class={styles.menuItemValue}>{item.name}</strong>
+										<span class={styles.menuItemMeta}>{item.teams.length} teams</span>
+									</div>
+								</button>
+							)}
+						</For>
+					</div>
+
+					<div class={styles.menuDivider} aria-hidden="true" />
+
+					<div class={styles.menuSection}>
+						<span class={styles.menuSectionLabel}>Teams in {selectedDepartment().name}</span>
+
+						<For each={selectedDepartment().teams}>
+							{(teamName): JSX.Element => (
+								<button
+									classList={{ [styles.submenuItem]: true, [styles.submenuItemActive]: teamName === selectedTeamName() }}
+									type="button"
+									role="menuitemradio"
+									aria-checked={teamName === selectedTeamName()}
+									onClick={() => selectTeam(teamName)}
+								>
+									<span class={styles.submenuIndicator} aria-hidden="true" />
+									<div class={styles.menuItemCopy}>
+										<strong class={styles.menuItemValue}>{teamName}</strong>
+									</div>
+								</button>
+							)}
+						</For>
+					</div>
+				</div>
+			) : null}
+		</div>
+	);
+};

Frontend/src/components/shell/LeftRail/LeftRail.module.scss

@@ -1,18 +1,26 @@
 .rail {
   --rail-workspace-size: var(--control-size-lg);
-  --rail-action-size: var(--control-size-md);
+  position: relative;
+  z-index: 3;
   flex: 1;
   min-height: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: var(--space-3);
-  padding: var(--space-3) var(--space-2);
-  overflow: hidden;
+  padding: var(--space-3) var(--space-2) calc(var(--space-3) + var(--rail-dock-clearance, var(--shell-dock-clearance)));
+  overflow: visible;
 }
 
-.topCluster,
-.bottomCluster {
+.railCollapsed {
+  --rail-workspace-size: calc(var(--control-size-md) + 0.1rem);
+  justify-content: flex-start;
+  gap: 0;
+  padding-top: var(--space-4);
+  padding-inline: var(--space-1);
+}
+
+.topCluster {
   width: 100%;
   display: flex;
   flex-direction: column;
@@ -20,6 +28,18 @@
   gap: var(--space-2);
 }
 
+.topCluster {
+  gap: var(--space-3);
+}
+
+.railCollapsed .topCluster {
+  gap: var(--space-3);
+}
+
+.railCollapsed .topCluster {
+  align-items: center;
+}
+
 .items {
   width: 100%;
   min-height: 0;
@@ -28,22 +48,101 @@
   flex-direction: column;
   align-items: center;
   gap: var(--space-2);
-  overflow-y: auto;
-  overscroll-behavior: contain;
+  overflow: visible;
   padding-block: var(--space-1);
 }
 
-.logo {
-  width: var(--rail-workspace-size);
-  height: var(--rail-workspace-size);
+.itemSlot {
+  position: relative;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  overflow: visible;
+}
+
+.itemSlot:hover,
+.itemSlot:focus-within,
+.itemSlotActive {
+  z-index: 12;
+}
+
+.activeIndicator {
+  position: absolute;
+  left: calc(50% - (var(--rail-workspace-size) / 2) - var(--space-2));
+  top: 50%;
+  width: 0.26rem;
+  height: 0.55rem;
+  border-radius: var(--radius-pill);
+  background: hsl(0 0% 100% / 0.94);
+  transform: translateY(-50%) scaleY(0.72);
+  transform-origin: center;
+  opacity: 0;
+  z-index: 2;
+  transition:
+    opacity 140ms var(--easing-standard),
+    height 180ms var(--easing-standard),
+    transform 180ms var(--easing-standard);
+}
+
+.itemSlot:hover .activeIndicator {
+  opacity: 1;
+  height: 1.1rem;
+  transform: translateY(-50%) scaleY(1);
+}
+
+.itemSlotActive .activeIndicator {
+  opacity: 1;
+  height: 2.1rem;
+  transform: translateY(-50%) scaleY(1);
+}
+
+.hoverLabel {
+  position: absolute;
+  left: calc(100% + var(--space-3));
+  top: 50%;
+  z-index: 8;
   display: inline-flex;
   align-items: center;
-  justify-content: center;
-  border-radius: var(--radius-lg);
-  background: var(--color-accent);
-  color: var(--color-accent-contrast);
-  font-weight: 700;
-  letter-spacing: -0.02em;
+  min-height: 2rem;
+  padding: 0 var(--space-3);
+  border: 1px solid color-mix(in srgb, var(--color-border-strong) 52%, transparent);
+  border-radius: var(--radius-md);
+  background: var(--color-surface-muted);
+  color: var(--color-text);
+  white-space: nowrap;
+  box-shadow: 0 12px 28px color-mix(in srgb, black 16%, transparent);
+  @include text-label;
+  pointer-events: none;
+  opacity: 0;
+  transform: translateY(-50%) translateX(calc(var(--space-2) * -1));
+  transition:
+    opacity 140ms var(--easing-standard),
+    transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
+}
+
+.hoverLabel::before {
+  content: "";
+  position: absolute;
+  top: 50%;
+  left: calc(var(--space-2) * -1);
+  width: 0.7rem;
+  height: 0.7rem;
+  border-left: 1px solid color-mix(in srgb, var(--color-border-strong) 52%, transparent);
+  border-bottom: 1px solid color-mix(in srgb, var(--color-border-strong) 52%, transparent);
+  background: var(--color-surface-muted);
+  transform: translateY(-50%) rotate(45deg);
+}
+
+.sectionDivider {
+  width: calc(var(--rail-workspace-size) - var(--space-2));
+  height: 1px;
+  border-radius: var(--radius-pill);
+  background: color-mix(in srgb, var(--color-border-strong) 58%, transparent);
+}
+
+.itemSlot:hover .hoverLabel {
+  opacity: 1;
+  transform: translateY(-50%) translateX(0);
 }
 
 .workspaceButton {
@@ -55,28 +154,31 @@
   @include interactive-frame(var(--color-surface-muted), var(--color-border), var(--color-text-muted), var(--radius-lg));
   @include text-label;
   @include interactive-frame-hover();
+  transition:
+    border-radius 180ms var(--easing-standard),
+    background 180ms var(--easing-standard),
+    color 180ms var(--easing-standard),
+    transform 180ms var(--easing-standard);
+}
+
+.personalButton {
+  background: var(--color-accent);
+  border-color: transparent;
+  color: var(--color-accent-contrast);
+  font-weight: 700;
+  letter-spacing: -0.02em;
+}
+
+.itemSlot:hover .workspaceButton,
+.itemSlot:focus-within .workspaceButton {
+  border-radius: var(--radius-md);
+  transform: translateY(-1px);
 }
 
 .workspaceButtonActive {
   background: var(--color-accent);
   border-color: transparent;
   color: var(--color-accent-contrast);
-  box-shadow: var(--shadow-soft);
-}
-
-.addButton {
-  width: var(--rail-action-size);
-  height: var(--rail-action-size);
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border: 1px dashed var(--color-border-strong);
-  border-radius: var(--radius-pill);
-  background: transparent;
-  color: var(--color-text-muted);
-
-  &:hover {
-    background: var(--color-surface-hover);
-    color: var(--color-text);
-  }
+  border-radius: var(--radius-md);
+  box-shadow: none;
 }

Frontend/src/components/shell/LeftRail/LeftRail.tsx

@@ -1,42 +1,83 @@
 // Path: Frontend/src/components/shell/LeftRail/LeftRail.tsx
 
-import { For, type JSX } from "solid-js";
-import { Plus } from "../../../lib/icons";
-import { railItems } from "../data/shell.data";
+import { For, Show, type JSX } from "solid-js";
+import { useAppShellData } from "../data/app-shell.context";
+import { type RailItem } from "../data/shell.data";
 import styles from "./LeftRail.module.scss";
 
-export const LeftRail = (): JSX.Element => {
+type RailEntryProps = {
+	item: RailItem;
+	label: string;
+	abbreviation: string;
+	personal?: boolean;
+};
+
+const RailEntry = (props: RailEntryProps): JSX.Element => {
 	return (
-		<aside class={styles.rail} aria-label="Workspace rail">
+		<div
+			classList={{
+				[styles.itemSlot]: true,
+				[styles.itemSlotActive]: !!props.item.active,
+			}}
+		>
+			<span class={styles.activeIndicator} aria-hidden="true" />
+
+			<button
+				type="button"
+				classList={{
+					[styles.workspaceButton]: true,
+					[styles.workspaceButtonActive]: !!props.item.active,
+					[styles.personalButton]: !!props.personal,
+				}}
+				aria-label={props.label}
+				title={props.label}
+			>
+				{props.abbreviation}
+			</button>
+
+			<span class={styles.hoverLabel} role="presentation">
+				{props.label}
+			</span>
+		</div>
+	);
+};
+
+type LeftRailProps = {
+	collapsed: boolean;
+};
+
+export const LeftRail = (props: LeftRailProps): JSX.Element => {
+	const appShellData = useAppShellData();
+	const personalItem = () => appShellData.railItems().find((item) => item.kind === "personal");
+	const organizationItems = () => appShellData.railItems().filter((item) => item.kind === "organization");
+
+	return (
+		<aside
+			classList={{
+				[styles.rail]: true,
+				[styles.railCollapsed]: props.collapsed,
+			}}
+			aria-label="Server rail"
+		>
 			<div class={styles.topCluster}>
-				<div class={styles.logo} aria-hidden="true">
-					M
-				</div>
-			</div>
-
-			<div class={styles.items}>
-				<For each={railItems}>
+				<Show when={!props.collapsed && personalItem()}>
 					{(item): JSX.Element => (
-						<button
-							type="button"
-							classList={{
-								[styles.workspaceButton]: true,
-								[styles.workspaceButtonActive]: !!item.active,
-							}}
-							title={item.label}
-							aria-label={item.label}
-						>
-							{item.abbreviation}
-						</button>
+						<RailEntry item={item()} label={item().label} abbreviation={item().abbreviation} personal />
 					)}
-				</For>
+				</Show>
+
+				<Show when={!props.collapsed}>
+					<div class={styles.sectionDivider} aria-hidden="true" />
+				</Show>
 			</div>
 
-			<div class={styles.bottomCluster}>
-				<button type="button" class={styles.addButton} aria-label="Create workspace" title="Create workspace">
-					<Plus size={16} strokeWidth={2} />
-				</button>
-			</div>
+			<Show when={!props.collapsed}>
+				<div class={styles.items}>
+					<For each={organizationItems()}>
+						{(item): JSX.Element => <RailEntry item={item} label={item.label} abbreviation={item.abbreviation} />}
+					</For>
+				</div>
+			</Show>
 		</aside>
 	);
 };

Frontend/src/components/shell/MobileBottomNav/MobileBottomNav.module.scss

@@ -0,0 +1,108 @@
+.mobileNav {
+  display: none;
+}
+
+@include respond-down(mobile) {
+  .mobileNav {
+    --mobile-nav-button-gap: var(--space-1);
+    --mobile-nav-button-padding-inline: var(--space-2);
+    --mobile-nav-button-padding-top: calc(var(--space-2) + (var(--space-1) / 2));
+    --mobile-nav-button-padding-bottom: var(--space-2);
+    position: fixed;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    display: grid;
+    gap: var(--space-2);
+    padding: var(--space-2) var(--space-3) calc(var(--space-2) + env(safe-area-inset-bottom, 0px));
+    background:
+      linear-gradient(to top, color-mix(in srgb, var(--color-canvas) 98%, transparent), color-mix(in srgb, var(--color-canvas) 92%, transparent));
+    border-top: 1px solid color-mix(in srgb, var(--color-border-strong) 40%, transparent);
+    backdrop-filter: blur(var(--blur-overlay));
+    z-index: var(--z-sticky);
+  }
+
+  .contextBar {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--space-2);
+    min-width: 0;
+    color: var(--color-text-muted);
+  }
+
+  .contextServer,
+  .contextProject {
+    @include text-caption;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .contextServer {
+    max-width: 45vw;
+  }
+
+  .contextProject {
+    max-width: 30vw;
+  }
+
+  .contextDivider {
+    @include text-caption;
+    color: var(--color-text-subtle);
+  }
+
+	.navGrid {
+	  display: grid;
+	  grid-template-columns: repeat(3, minmax(0, 1fr));
+	  gap: var(--space-2);
+	}
+
+  .navButton {
+    min-width: 0;
+    display: grid;
+    justify-items: center;
+    gap: var(--mobile-nav-button-gap);
+    padding: var(--mobile-nav-button-padding-top) var(--mobile-nav-button-padding-inline) var(--mobile-nav-button-padding-bottom);
+    border: 1px solid transparent;
+    border-radius: var(--radius-xl);
+    background: transparent;
+    color: var(--color-text-muted);
+    transition:
+      background 160ms var(--easing-standard),
+      color 160ms var(--easing-standard),
+      border-color 160ms var(--easing-standard),
+      transform 180ms var(--easing-standard);
+  }
+
+  .navButton:hover,
+  .navButton:focus-visible {
+    color: var(--color-text);
+    background: color-mix(in srgb, var(--color-surface) 82%, transparent);
+    border-color: color-mix(in srgb, var(--color-border-strong) 28%, transparent);
+  }
+
+  .navButton:active {
+    transform: translateY(calc(var(--space-1) / 2));
+  }
+
+  .navButtonActive {
+    color: var(--color-text);
+    background: color-mix(in srgb, var(--color-surface) 90%, transparent);
+    border-color: color-mix(in srgb, var(--color-border-strong) 34%, transparent);
+    box-shadow: var(--shadow-soft);
+  }
+
+  .iconWrap {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .label {
+    @include text-caption;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+}

Frontend/src/components/shell/MobileBottomNav/MobileBottomNav.tsx

@@ -0,0 +1,66 @@
+// Path: Frontend/src/components/shell/MobileBottomNav/MobileBottomNav.tsx
+
+import { For, type JSX } from "solid-js";
+import { useAppShellData } from "../data/app-shell.context";
+import { mobileBottomNavItems, type MobileBottomNavItem } from "../data/shell.data";
+import styles from "./MobileBottomNav.module.scss";
+
+type MobileBottomNavProps = {
+	isBrowseOpen: boolean;
+	onBrowseToggle: VoidFunction;
+};
+
+const MobileNavEntry = (props: {
+	item: MobileBottomNavItem;
+	isActive: boolean;
+	onSelect?: VoidFunction;
+}): JSX.Element => {
+	const Icon = props.item.icon;
+
+	return (
+		<button
+			type="button"
+			onClick={() => props.onSelect?.()}
+			classList={{
+				[styles.navButton]: true,
+				[styles.navButtonActive]: props.isActive,
+			}}
+			aria-current={props.isActive ? "page" : undefined}
+			aria-expanded={props.item.id === "browse" ? props.isActive : undefined}
+			aria-label={props.item.label}
+			title={props.item.label}
+		>
+			<span class={styles.iconWrap} aria-hidden="true">
+				<Icon size={18} strokeWidth={2} />
+			</span>
+
+			<span class={styles.label}>{props.item.label}</span>
+		</button>
+	);
+};
+
+export const MobileBottomNav = (props: MobileBottomNavProps): JSX.Element => {
+	const appShellData = useAppShellData();
+
+	return (
+		<nav class={styles.mobileNav} aria-label="Mobile workspace navigation">
+			<div class={styles.contextBar}>
+				<span class={styles.contextServer}>{appShellData.activeServer().name}</span>
+				<span class={styles.contextDivider}>/</span>
+				<span class={styles.contextProject}>{appShellData.activeProject().name}</span>
+			</div>
+
+			<div class={styles.navGrid}>
+				<For each={mobileBottomNavItems}>
+					{(item): JSX.Element => (
+						<MobileNavEntry
+							item={item}
+							isActive={item.id === "browse" ? props.isBrowseOpen : (item.active ?? false) && !props.isBrowseOpen}
+							onSelect={item.id === "browse" ? props.onBrowseToggle : undefined}
+						/>
+					)}
+				</For>
+			</div>
+		</nav>
+	);
+};

Frontend/src/components/shell/MobileWorkspaceBrowser/MobileWorkspaceBrowser.module.scss

@@ -0,0 +1,414 @@
+.browserLayer {
+  display: none;
+}
+
+@include respond-down(mobile) {
+  .browserLayer {
+    position: fixed;
+    inset: 0;
+    display: grid;
+    z-index: calc(var(--z-popover, 20) + 2);
+    background: color-mix(in srgb, var(--color-canvas) 96%, black 4%);
+  }
+
+	.sheet {
+    height: 100dvh;
+    display: grid;
+    grid-template-rows: auto minmax(0, 1fr);
+    background:
+      linear-gradient(180deg, color-mix(in srgb, var(--color-surface) 84%, transparent) 0%, transparent 8rem),
+      color-mix(in srgb, var(--color-canvas) 97%, black 3%);
+    overflow: hidden;
+  }
+
+  .sheetHeader {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--space-3);
+    padding: calc(var(--space-5) + env(safe-area-inset-top, 0px)) var(--space-4) var(--space-4);
+    border-bottom: 1px solid color-mix(in srgb, var(--color-border) 84%, transparent);
+  }
+
+  .headerActions {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-2);
+  }
+
+  .brandBlock {
+    min-width: 0;
+    display: grid;
+    gap: var(--space-1);
+  }
+
+  .sectionLabel {
+    @include text-caption;
+    color: var(--color-text-muted);
+    text-transform: uppercase;
+    letter-spacing: 0.06em;
+  }
+
+  .brandEyebrow {
+    @include text-caption;
+    color: var(--color-text-muted);
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+  }
+
+  .brandTitle {
+    @include text-title;
+    color: var(--color-text);
+    font-weight: var(--font-weight-semibold);
+  }
+
+  .brandContext {
+    @include text-caption;
+    color: var(--color-text-subtle);
+  }
+
+  .closeButton {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--control-size-md);
+    height: var(--control-size-md);
+    padding: 0;
+    border: 1px solid color-mix(in srgb, var(--color-border) 92%, transparent);
+    border-radius: 999px;
+    background: color-mix(in srgb, var(--color-surface) 92%, transparent);
+    color: var(--color-text-subtle);
+  }
+
+  .createButton {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--space-2);
+    min-height: var(--control-size-md);
+    padding: 0 var(--space-3);
+    border: 1px solid color-mix(in srgb, var(--color-border-strong, var(--color-border)) 82%, transparent);
+    border-radius: 999px;
+    background: color-mix(in srgb, var(--color-surface) 94%, var(--color-canvas) 6%);
+    color: var(--color-text);
+    box-shadow: var(--shadow-soft);
+    font: inherit;
+    font-weight: var(--font-weight-semibold);
+  }
+
+  .sheetBody {
+    min-height: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    gap: var(--space-5);
+    padding: var(--space-5) var(--space-5) calc(var(--space-12) + var(--space-10) + env(safe-area-inset-bottom, 0px));
+    overflow-y: auto;
+    overflow-x: hidden;
+    overscroll-behavior: contain;
+    -webkit-overflow-scrolling: touch;
+  }
+
+  .sectionBlock {
+    display: grid;
+    gap: var(--space-2);
+    flex: 0 0 auto;
+  }
+
+  .treeList,
+  .treeListItem {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  .treeList {
+    display: grid;
+    gap: 0;
+    border-top: 1px solid color-mix(in srgb, var(--color-border) 92%, transparent);
+  }
+
+  .treeListNested {
+    display: grid;
+    gap: 0;
+  }
+
+  .treeRow {
+    min-width: 0;
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--space-3);
+    min-height: calc(var(--control-size-lg) + var(--space-3));
+    padding: var(--space-4) var(--space-2) var(--space-4) calc(var(--space-2) + (var(--tree-depth, 0) * var(--space-4)));
+    border: 0;
+    border-bottom: 1px solid color-mix(in srgb, var(--color-border) 92%, transparent);
+    border-radius: 0;
+    background: transparent;
+    color: var(--color-text);
+    text-align: left;
+  }
+
+  .treeRowActive {
+    color: var(--color-text);
+    background: color-mix(in srgb, var(--color-surface) 72%, transparent);
+  }
+
+  .treeRowBranch {
+    font-weight: var(--font-weight-semibold);
+  }
+
+  .treeRowLead,
+  .treeRowTrail {
+    min-width: 0;
+    display: inline-flex;
+    align-items: center;
+    gap: var(--space-2);
+  }
+
+  .treeRowTrail {
+    flex: 0 0 auto;
+    color: var(--color-text-muted);
+  }
+
+  .treeLabel {
+    @include text-label;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .treeMeta {
+    @include text-caption;
+    min-width: 1rem;
+    text-align: right;
+  }
+
+  .treeChevron {
+    color: var(--color-text-subtle);
+  }
+
+  .treeListNested > .treeListItem > .treeRow {
+     min-height: calc(var(--control-size-lg) + var(--space-1));
+  }
+
+	.dialogLayer {
+		position: fixed;
+		inset: 0;
+		display: grid;
+		place-items: center;
+		z-index: calc(var(--z-modal, 30) + 2);
+		padding: var(--space-5);
+	}
+
+	.dialogBackdrop {
+		position: absolute;
+		inset: 0;
+		border: 0;
+		background: color-mix(in srgb, black 56%, transparent);
+	}
+
+	.dialogCard {
+		position: relative;
+		width: min(100%, 28rem);
+		display: grid;
+		gap: var(--space-4);
+		padding: var(--space-4);
+		border: 1px solid color-mix(in srgb, var(--color-border) 88%, transparent);
+		border-radius: var(--radius-xl);
+		background: color-mix(in srgb, var(--color-surface) 94%, var(--color-canvas) 6%);
+		box-shadow: var(--shadow-strong);
+	}
+
+	.dialogCopy {
+		display: grid;
+		gap: var(--space-2);
+	}
+
+	.dialogTitle {
+		@include text-title;
+		color: var(--color-text);
+		font-weight: var(--font-weight-semibold);
+	}
+
+	.dialogMessage {
+		@include text-body;
+		margin: 0;
+		color: var(--color-text-subtle);
+	}
+
+	.dialogInput {
+		width: 100%;
+		min-height: var(--control-size-lg);
+		padding: 0 var(--space-3);
+		border: 1px solid color-mix(in srgb, var(--color-border-strong, var(--color-border)) 82%, transparent);
+		border-radius: var(--radius-lg);
+		background: color-mix(in srgb, var(--color-canvas) 92%, var(--color-surface) 8%);
+		color: var(--color-text);
+		font: inherit;
+	}
+
+	.moveSheetLayer {
+		position: fixed;
+		inset: 0;
+		display: block;
+		z-index: calc(var(--z-modal, 30) + 2);
+	}
+
+	.moveSheet {
+		position: absolute;
+		right: 0;
+		bottom: 0;
+		left: 0;
+		max-height: calc(100dvh - (var(--space-12) * 2));
+		display: grid;
+		gap: var(--space-3);
+		padding: var(--space-3) var(--space-3) calc(var(--space-4) + env(safe-area-inset-bottom, 0px));
+		border-top: 1px solid color-mix(in srgb, var(--color-border) 88%, transparent);
+		border-radius: var(--radius-xl) var(--radius-xl) 0 0;
+		background: var(--color-surface);
+		box-shadow: var(--shadow-strong);
+		overflow: auto;
+	}
+
+	.moveSheetHandle {
+		width: var(--space-10);
+		height: var(--space-1);
+		margin: 0 auto;
+		border-radius: var(--radius-pill);
+		background: color-mix(in srgb, var(--color-text-muted) 24%, transparent);
+	}
+
+	.moveSheetHeader {
+		display: grid;
+		gap: var(--space-2);
+		padding-bottom: var(--space-3);
+		border-bottom: 1px solid color-mix(in srgb, var(--color-border) 88%, transparent);
+	}
+
+	.moveSheetHeaderCopy {
+		display: grid;
+		gap: calc(var(--space-1) / 2);
+	}
+
+	.moveSheetEyebrow {
+		@include text-caption;
+		color: var(--color-text-muted);
+		text-transform: uppercase;
+		letter-spacing: 0.06em;
+	}
+
+	.moveSheetTitle {
+		@include text-title;
+		color: var(--color-text);
+		font-weight: var(--font-weight-semibold);
+	}
+
+	.moveSheetMessage {
+		@include text-body;
+		margin: 0;
+		color: var(--color-text-subtle);
+	}
+
+	.moveSection {
+		display: grid;
+		gap: var(--space-2);
+	}
+
+	.moveSectionLabel {
+		@include text-caption;
+		padding-inline: var(--space-1);
+		color: var(--color-text-muted);
+		text-transform: uppercase;
+		letter-spacing: 0.06em;
+	}
+
+	.moveDestinationList {
+		display: grid;
+		overflow: hidden;
+		border: 1px solid color-mix(in srgb, var(--color-border) 88%, transparent);
+		border-radius: var(--radius-lg);
+		background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-elevated, var(--color-surface)) 12%);
+		max-height: min(20rem, 45vh);
+		overflow-y: auto;
+	}
+
+	.moveDestinationButton {
+		width: 100%;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		gap: var(--space-3);
+		min-height: calc(var(--control-size-lg) + var(--space-2));
+		padding: 0 var(--space-3);
+		padding-left: calc(var(--space-3) + (var(--move-depth, 0) * var(--space-4)));
+		border: 0;
+		background: transparent;
+		color: var(--color-text);
+		text-align: left;
+	}
+
+	.moveDestinationButton:active {
+		background: color-mix(in srgb, var(--color-text) 6%, transparent);
+	}
+
+	.moveDestinationButton + .moveDestinationButton {
+		border-top: 1px solid color-mix(in srgb, var(--color-border) 92%, transparent);
+	}
+
+	.moveDestinationLabel {
+		@include text-label;
+		min-width: 0;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+
+	.moveDestinationMeta {
+		@include text-caption;
+		color: var(--color-text-muted);
+		flex: 0 0 auto;
+	}
+
+	.moveSheetFooter {
+		display: flex;
+		justify-content: flex-end;
+		padding-top: var(--space-2);
+		border-top: 1px solid color-mix(in srgb, var(--color-border) 88%, transparent);
+	}
+
+	.dialogActions {
+		display: flex;
+		justify-content: flex-end;
+		gap: var(--space-2);
+	}
+
+	.dialogSecondaryButton,
+	.dialogPrimaryButton {
+		min-height: var(--control-size-md);
+		padding: 0 var(--space-3);
+		border-radius: 999px;
+		font: inherit;
+		font-weight: var(--font-weight-semibold);
+	}
+
+	.dialogSecondaryButton {
+		border: 1px solid color-mix(in srgb, var(--color-border) 88%, transparent);
+		background: color-mix(in srgb, var(--color-surface) 92%, transparent);
+		color: var(--color-text-subtle);
+	}
+
+	.dialogPrimaryButton {
+		border: 1px solid color-mix(in srgb, var(--color-border-strong, var(--color-border)) 82%, transparent);
+		background: color-mix(in srgb, var(--color-text) 10%, var(--color-surface) 90%);
+		color: var(--color-text);
+	}
+
+	.dialogDangerButton {
+		border-color: color-mix(in srgb, var(--color-danger-border, var(--color-border-strong, var(--color-border))) 82%, transparent);
+		background: color-mix(in srgb, var(--color-danger-text, #b42318) 12%, var(--color-surface) 88%);
+		color: var(--color-danger-text, #b42318);
+	}
+}

Frontend/src/components/shell/MobileWorkspaceBrowser/MobileWorkspaceBrowser.tsx

@@ -0,0 +1,638 @@
+import { For, Show, createSignal, type JSX } from "solid-js";
+import { Portal } from "solid-js/web";
+import { ChevronRight, Plus, X } from "../../../lib/icons";
+import { useAppShellData } from "../data/app-shell.context";
+import { createLongPressGesture } from "../createLongPressGesture";
+import {
+	createWorkspaceStaticTarget,
+	createWorkspaceSurfaceTarget,
+	createWorkspaceTreeTarget,
+	getWorkspaceItemTypeDefinition,
+	getWorkspaceNodeIcon,
+	workspaceStaticItems,
+	type SidebarItem,
+	type WorkspaceContextMenuAction,
+	type WorkspaceContextMenuTarget,
+	type WorkspaceItemTypeId,
+	type WorkspaceStaticItem,
+	type WorkspaceTreeNode,
+} from "../data/shell.data";
+import { useWorkspaceTreeData } from "../shared/useWorkspaceTreeData";
+import { WorkspaceMobileActionSheet } from "../WorkspaceMobileActionSheet/WorkspaceMobileActionSheet";
+import styles from "./MobileWorkspaceBrowser.module.scss";
+
+type MobileWorkspaceBrowserProps = {
+	open: boolean;
+	onClose: VoidFunction;
+};
+
+type MobileWorkspaceDialogState =
+	| {
+			kind: "text";
+			title: string;
+			message: string;
+			confirmLabel: string;
+			initialValue: string;
+			onConfirm: (value: string) => void;
+	  }
+	| {
+			kind: "confirm";
+			title: string;
+			message: string;
+			confirmLabel: string;
+			tone?: "danger";
+			onConfirm: () => void;
+	  };
+
+type MobileMoveTargetState = {
+	kind: "folder" | "item";
+	id: string;
+	label: string;
+};
+
+type MobileMoveDestination = {
+	id: string | null;
+	label: string;
+	depth: number;
+	meta?: string;
+};
+
+const collectMoveDestinations = (
+	nodes: readonly WorkspaceTreeNode[],
+	movingTarget: MobileMoveTargetState,
+	depth = 0,
+	ancestorBlocked = false,
+): MobileMoveDestination[] => {
+	const destinations: MobileMoveDestination[] = [];
+
+	for (const node of nodes) {
+		if (node.kind !== "folder") {
+			continue;
+		}
+
+		const isBlockedFolder = movingTarget.kind === "folder" && node.id === movingTarget.id;
+		if (!ancestorBlocked && !isBlockedFolder) {
+			destinations.push({
+				id: node.id,
+				label: node.label,
+				depth,
+				meta: "Folder",
+			});
+		}
+
+		destinations.push(
+			...collectMoveDestinations(node.children ?? [], movingTarget, depth + 1, ancestorBlocked || isBlockedFolder),
+		);
+	}
+
+	return destinations;
+};
+
+const findTreeNodeById = (nodes: readonly WorkspaceTreeNode[], nodeId: string): WorkspaceTreeNode | null => {
+	for (const node of nodes) {
+		if (node.id === nodeId) {
+			return node;
+		}
+
+		if (node.kind !== "folder") {
+			continue;
+		}
+
+		const nestedMatch = findTreeNodeById(node.children ?? [], nodeId);
+		if (nestedMatch) {
+			return nestedMatch;
+		}
+	}
+
+	return null;
+};
+
+const isDangerDialogState = (state: MobileWorkspaceDialogState): boolean => state.kind === "confirm" && state.tone === "danger";
+
+const TreeRow = (props: { node: WorkspaceTreeNode; depth?: number }): JSX.Element => {
+	const depth = props.depth ?? 0;
+	const Icon = getWorkspaceNodeIcon(props.node);
+	const hasChildren = (props.node.children?.length ?? 0) > 0;
+
+	return (
+		<button
+			classList={{
+				[styles.treeRow]: true,
+				[styles.treeRowActive]: props.node.active ?? false,
+				[styles.treeRowBranch]: hasChildren,
+			}}
+			type="button"
+			style={{ "--tree-depth": `${depth}` }}
+			data-slot="mobile-workspace-tree-row"
+			data-kind={props.node.kind}
+			data-item-type={props.node.kind === "item" ? props.node.itemType : undefined}
+			data-active={props.node.active ? "true" : "false"}
+		>
+			<span class={styles.treeRowLead}>
+				<Icon size={16} strokeWidth={2} />
+				<span class={styles.treeLabel}>{props.node.label}</span>
+			</span>
+
+			<span class={styles.treeRowTrail}>
+				<Show when={props.node.meta}>
+					<span class={styles.treeMeta}>{props.node.meta}</span>
+				</Show>
+				<Show when={hasChildren}>
+					<ChevronRight size={14} strokeWidth={2} class={styles.treeChevron} />
+				</Show>
+			</span>
+		</button>
+	);
+};
+
+const StaticRow = (props: { item: SidebarItem }): JSX.Element => {
+	const Icon = props.item.icon;
+
+	return (
+		<button classList={{ [styles.treeRow]: true, [styles.treeRowActive]: props.item.active ?? false }} type="button" style={{ "--tree-depth": "0" }} data-slot="mobile-workspace-static-row" data-active={props.item.active ? "true" : "false"}>
+			<span class={styles.treeRowLead}>
+				<Icon size={16} strokeWidth={2} />
+				<span class={styles.treeLabel}>{props.item.label}</span>
+			</span>
+			<span class={styles.treeRowTrail}>
+				<Show when={props.item.meta}>
+					<span class={styles.treeMeta}>{props.item.meta}</span>
+				</Show>
+				<ChevronRight size={14} strokeWidth={2} class={styles.treeChevron} />
+			</span>
+		</button>
+	);
+};
+
+const WorkspaceStaticRow = (props: {
+	item: WorkspaceStaticItem;
+	onOpenActionSheet: (target: WorkspaceContextMenuTarget) => void;
+}): JSX.Element => {
+	const target = createWorkspaceStaticTarget(props.item);
+	const longPress = createLongPressGesture({
+		onLongPress: () => {
+			props.onOpenActionSheet(target);
+		},
+	});
+
+	return (
+		<li
+			class={styles.treeListItem}
+			data-slot="mobile-workspace-static-item"
+			data-target-kind={target.kind}
+			onContextMenu={(event): void => {
+				event.preventDefault();
+				props.onOpenActionSheet(target);
+			}}
+			{...longPress}
+		>
+			<StaticRow item={props.item} />
+		</li>
+	);
+};
+
+const WorkspaceTreeBranch = (props: {
+	nodes: readonly WorkspaceTreeNode[];
+	depth?: number;
+	onOpenActionSheet: (target: WorkspaceContextMenuTarget) => void;
+}): JSX.Element => {
+	const depth = props.depth ?? 0;
+
+	return (
+		<For each={props.nodes}>
+			{(node): JSX.Element => {
+				const target = createWorkspaceTreeTarget(node);
+				const longPress = createLongPressGesture({
+					onLongPress: () => {
+						props.onOpenActionSheet(target);
+					},
+				});
+
+				return (
+					<li
+						class={styles.treeListItem}
+						data-slot="mobile-workspace-tree-item"
+						data-kind={node.kind}
+						data-item-type={node.kind === "item" ? node.itemType : undefined}
+						onContextMenu={(event): void => {
+							event.preventDefault();
+							props.onOpenActionSheet(target);
+						}}
+						{...longPress}
+					>
+						<TreeRow node={node} depth={depth} />
+
+						<Show when={node.children?.length}>
+							<ul class={styles.treeListNested}>
+								<WorkspaceTreeBranch nodes={node.children ?? []} depth={depth + 1} onOpenActionSheet={props.onOpenActionSheet} />
+							</ul>
+						</Show>
+					</li>
+				);
+			}}
+		</For>
+	);
+};
+
+export const MobileWorkspaceBrowser = (props: MobileWorkspaceBrowserProps): JSX.Element => {
+	const appShellData = useAppShellData();
+	const [actionSheetTarget, setActionSheetTarget] = createSignal<WorkspaceContextMenuTarget | null>(null);
+	const [dialogState, setDialogState] = createSignal<MobileWorkspaceDialogState | null>(null);
+	const [dialogValue, setDialogValue] = createSignal("");
+	const [moveTarget, setMoveTarget] = createSignal<MobileMoveTargetState | null>(null);
+	const { workspaceTreeNodes, createFolder, renameFolder, deleteFolder, moveFolder, createItem, deleteItem, moveItem } = useWorkspaceTreeData({
+		activeProjectId: () => appShellData.activeProject().id,
+		fallbackWorkspaceTree: () => appShellData.workspaceTree(),
+	});
+	const workspaceTarget = () => createWorkspaceSurfaceTarget(appShellData.activeProject());
+
+	const moveDestinations = () => {
+		const target = moveTarget();
+		if (!target) {
+			return [] as MobileMoveDestination[];
+		}
+
+		return [
+			{ id: null, label: "Items root", depth: 0, meta: "Root" },
+			...collectMoveDestinations(workspaceTreeNodes(), target),
+		];
+	};
+
+	const resolveCreateItemType = (actionId: string): WorkspaceItemTypeId | null => {
+		switch (actionId) {
+			case "create-doc":
+				return "core.doc";
+			case "create-board":
+				return "core.board.kanban";
+			case "create-list-board":
+				return "core.board.list";
+			default:
+				return null;
+		}
+	};
+
+	const createPersistedItem = (itemType: WorkspaceItemTypeId, parentId: string | null): void => {
+		const definition = getWorkspaceItemTypeDefinition(itemType);
+		void createItem(definition.defaultCreateLabel, itemType, parentId);
+	};
+
+	const openActionSheet = (target: WorkspaceContextMenuTarget): void => {
+		setActionSheetTarget(target);
+	};
+
+	const closeActionSheet = (): void => {
+		setActionSheetTarget(null);
+	};
+
+	const closeMoveSheet = (): void => {
+		setMoveTarget(null);
+	};
+
+	const openWorkspaceActionSheet = (): void => {
+		openActionSheet(workspaceTarget());
+	};
+
+	const closeDialog = (): void => {
+		setDialogState(null);
+		setDialogValue("");
+	};
+
+	const openMoveSheet = (target: MobileMoveTargetState): void => {
+		setMoveTarget(target);
+	};
+
+	const openTextDialog = (config: Omit<Extract<MobileWorkspaceDialogState, { kind: "text" }>, "kind">): void => {
+		setDialogValue(config.initialValue);
+		setDialogState({ kind: "text", ...config });
+	};
+
+	const openConfirmDialog = (config: Omit<Extract<MobileWorkspaceDialogState, { kind: "confirm" }>, "kind">): void => {
+		setDialogValue("");
+		setDialogState({ kind: "confirm", ...config });
+	};
+
+	const submitDialog = (): void => {
+		const state = dialogState();
+		if (!state) {
+			return;
+		}
+
+		if (state.kind === "text") {
+			const value = dialogValue().trim();
+			if (!value) {
+				return;
+			}
+
+			closeDialog();
+			state.onConfirm(value);
+			return;
+		}
+
+		closeDialog();
+		state.onConfirm();
+	};
+
+	const handleMoveDestinationSelect = (destinationId: string | null): void => {
+		const target = moveTarget();
+		if (!target) {
+			return;
+		}
+
+		const destinationNode = destinationId ? findTreeNodeById(workspaceTreeNodes(), destinationId) : null;
+		const targetIndex = destinationNode?.kind === "folder"
+			? destinationNode.children?.length ?? 0
+			: destinationId
+				? 0
+				: workspaceTreeNodes().length;
+
+		closeMoveSheet();
+
+		if (target.kind === "folder") {
+			void moveFolder(target.id, destinationId, targetIndex);
+			return;
+		}
+
+		void moveItem(target.id, destinationId, targetIndex);
+	};
+
+	const handleActionSelect = (action: WorkspaceContextMenuAction, target: WorkspaceContextMenuTarget): void => {
+		const createItemType = resolveCreateItemType(action.id);
+		if (createItemType) {
+			switch (target.kind) {
+				case "workspace":
+				case "home":
+					createPersistedItem(createItemType, null);
+					return;
+				case "folder":
+					createPersistedItem(createItemType, target.id);
+					return;
+				case "settings":
+				case "item":
+					return;
+			}
+		}
+
+		switch (action.id) {
+			case "new-folder": {
+				if (target.kind === "settings" || target.kind === "item") {
+					return;
+				}
+
+				openTextDialog({
+					title: "New folder",
+					message: target.kind === "folder" ? `Create a folder inside "${target.label}".` : "Create a folder at the root of Items.",
+					confirmLabel: "Create",
+					initialValue: "Untitled folder",
+					onConfirm: (name) => {
+						void createFolder(name, target.kind === "folder" ? target.id : null);
+					},
+				});
+				return;
+			}
+			case "rename-folder": {
+				if (target.kind !== "folder") {
+					return;
+				}
+
+				openTextDialog({
+					title: "Rename folder",
+					message: `Update the name for "${target.label}".`,
+					confirmLabel: "Save",
+					initialValue: target.label,
+					onConfirm: (name) => {
+						if (name === target.label) {
+							return;
+						}
+						void renameFolder(target.id, name);
+					},
+				});
+				return;
+			}
+			case "move-folder": {
+				if (target.kind !== "folder") {
+					return;
+				}
+
+				openMoveSheet({
+					kind: "folder",
+					id: target.id,
+					label: target.label,
+				});
+				return;
+			}
+			case "delete-folder": {
+				if (target.kind !== "folder") {
+					return;
+				}
+
+				openConfirmDialog({
+					title: "Delete folder?",
+					message: `"${target.label}" and everything inside it will be removed.`,
+					confirmLabel: "Delete",
+					tone: "danger",
+					onConfirm: () => {
+						void deleteFolder(target.id);
+					},
+				});
+				return;
+			}
+			case "move-doc":
+			case "move-board":
+			case "move-list-board": {
+				if (target.kind !== "item") {
+					return;
+				}
+
+				openMoveSheet({
+					kind: "item",
+					id: target.id,
+					label: target.label,
+				});
+				return;
+			}
+			case "delete-doc":
+			case "delete-board":
+			case "delete-list-board": {
+				if (target.kind !== "item") {
+					return;
+				}
+
+				openConfirmDialog({
+					title: "Delete item?",
+					message: `"${target.label}" will be removed from the project tree.`,
+					confirmLabel: "Delete",
+					tone: "danger",
+					onConfirm: () => {
+						void deleteItem(target.id);
+					},
+				});
+				return;
+			}
+			default:
+				return;
+		}
+	};
+
+	const workspaceLongPress = createLongPressGesture({
+		onLongPress: openWorkspaceActionSheet,
+	});
+
+	return (
+		<Show when={props.open}>
+			<div class={styles.browserLayer} data-ui="mobile-workspace-browser">
+				<section class={styles.sheet} aria-label="Mobile workspace browser" data-slot="mobile-workspace-sheet">
+					<header class={styles.sheetHeader} data-slot="mobile-workspace-header">
+						<div
+							class={styles.brandBlock}
+							data-slot="mobile-workspace-brand"
+							onContextMenu={(event): void => {
+								event.preventDefault();
+								openWorkspaceActionSheet();
+							}}
+							{...workspaceLongPress}
+						>
+							{/* Long-pressing the browser header exposes workspace-level actions on mobile. */}
+							<span class={styles.brandEyebrow}>Moku Work</span>
+							<strong class={styles.brandTitle}>{appShellData.activeProject().name}</strong>
+							<span class={styles.brandContext}>{appShellData.activeServer().name}</span>
+						</div>
+
+						<div class={styles.headerActions} data-slot="mobile-workspace-header-actions">
+							<button
+								class={styles.createButton}
+								type="button"
+								aria-label="Create"
+								data-slot="mobile-workspace-create"
+								onClick={openWorkspaceActionSheet}
+							>
+								<Plus size={16} strokeWidth={2.25} />
+								<span>Create</span>
+							</button>
+
+							<button class={styles.closeButton} type="button" aria-label="Close workspace browser" data-slot="mobile-workspace-close" onClick={props.onClose}>
+								<X size={18} strokeWidth={2} />
+							</button>
+						</div>
+					</header>
+
+					<div class={styles.sheetBody} data-slot="mobile-workspace-body">
+						<section class={styles.sectionBlock} data-slot="mobile-workspace-section" data-section-id="workspace">
+							<span class={styles.sectionLabel}>Workspace</span>
+							<ul class={styles.treeList} data-slot="mobile-workspace-list" data-section-id="workspace">
+								<For each={workspaceStaticItems}>
+									{(item): JSX.Element => <WorkspaceStaticRow item={item} onOpenActionSheet={openActionSheet} />}
+								</For>
+							</ul>
+						</section>
+
+						<section class={styles.sectionBlock} data-slot="mobile-workspace-section" data-section-id="items">
+							<span class={styles.sectionLabel}>Items</span>
+							<ul class={styles.treeList} data-slot="mobile-workspace-list" data-section-id="items">
+								<WorkspaceTreeBranch nodes={workspaceTreeNodes()} onOpenActionSheet={openActionSheet} />
+							</ul>
+						</section>
+					</div>
+				</section>
+
+				<WorkspaceMobileActionSheet target={actionSheetTarget()} onClose={closeActionSheet} onSelect={handleActionSelect} />
+
+				<Show when={moveTarget()}>
+					{(state): JSX.Element => (
+						<Portal>
+							<div class={styles.moveSheetLayer} data-ui="mobile-workspace-move-sheet">
+								<button class={styles.dialogBackdrop} type="button" aria-label="Close move sheet" onClick={closeMoveSheet} />
+								<section class={styles.moveSheet} aria-label={`Move ${state().label}`}>
+									<div class={styles.moveSheetHandle} aria-hidden="true" />
+									<div class={styles.moveSheetHeader}>
+										<div class={styles.moveSheetHeaderCopy}>
+											<span class={styles.moveSheetEyebrow}>Move {state().kind}</span>
+											<strong class={styles.moveSheetTitle}>{state().label}</strong>
+											<p class={styles.moveSheetMessage}>Choose a new location in the project tree.</p>
+										</div>
+									</div>
+
+									<div class={styles.moveSection}>
+										<span class={styles.moveSectionLabel}>Destination</span>
+										<div class={styles.moveDestinationList}>
+											<For each={moveDestinations()}>
+												{(destination): JSX.Element => (
+													<button
+														type="button"
+														class={styles.moveDestinationButton}
+														style={{ "--move-depth": `${destination.depth}` }}
+														onClick={(): void => handleMoveDestinationSelect(destination.id)}
+													>
+														<span class={styles.moveDestinationLabel}>{destination.label}</span>
+														<Show when={destination.meta}>
+															<span class={styles.moveDestinationMeta}>{destination.meta}</span>
+														</Show>
+													</button>
+												)}
+											</For>
+										</div>
+									</div>
+
+									<div class={styles.moveSheetFooter}>
+										<button class={styles.dialogSecondaryButton} type="button" onClick={closeMoveSheet}>
+											Cancel
+										</button>
+									</div>
+								</section>
+							</div>
+						</Portal>
+					)}
+				</Show>
+
+				<Show when={dialogState()}>
+					{(state): JSX.Element => (
+						<Portal>
+							<div class={styles.dialogLayer} data-ui="mobile-workspace-dialog">
+								<button class={styles.dialogBackdrop} type="button" aria-label="Close dialog" onClick={closeDialog} />
+								<section class={styles.dialogCard} aria-label={state().title}>
+									<div class={styles.dialogCopy}>
+										<strong class={styles.dialogTitle}>{state().title}</strong>
+										<p class={styles.dialogMessage}>{state().message}</p>
+									</div>
+
+									<Show when={state().kind === "text"}>
+										<input
+											class={styles.dialogInput}
+											type="text"
+											value={dialogValue()}
+											onInput={(event): void => {
+												setDialogValue(event.currentTarget.value);
+											}}
+											onKeyDown={(event): void => {
+												if (event.key === "Enter") {
+													event.preventDefault();
+													submitDialog();
+												}
+											}}
+											autofocus
+										/>
+									</Show>
+
+									<div class={styles.dialogActions}>
+										<button class={styles.dialogSecondaryButton} type="button" onClick={closeDialog}>
+											Cancel
+										</button>
+										<button
+											classList={{
+												[styles.dialogPrimaryButton]: true,
+												[styles.dialogDangerButton]: isDangerDialogState(state()),
+											}}
+											type="button"
+											onClick={submitDialog}
+										>
+											{state().confirmLabel}
+										</button>
+									</div>
+								</section>
+							</div>
+						</Portal>
+					)}
+				</Show>
+			</div>
+		</Show>
+	);
+};

Frontend/src/components/shell/ProfileDock/ProfileDock.tsx

@@ -1,35 +0,0 @@
-// Path: Frontend/src/components/shell/ProfileDock/ProfileDock.tsx
-
-import type { JSX } from "solid-js";
-import { Settings, User } from "../../../lib/icons";
-import styles from "./ProfileDock.module.scss";
-
-export const ProfileDock = (): JSX.Element => {
-	return (
-		<section class={styles.panel} aria-label="Profile dock">
-			<div class={styles.identity}>
-				<div class={styles.avatar} aria-hidden="true">
-					R
-				</div>
-				<div class={styles.copy}>
-					<span class={styles.name}>Ronald</span>
-					<span class={styles.status}>
-						<span class={styles.statusDot} aria-hidden="true" />
-						Online in Moku
-					</span>
-				</div>
-			</div>
-
-			<div class={styles.actions}>
-				<button type="button" class={styles.action}>
-					<User size={16} strokeWidth={2} />
-					<span class={styles.actionLabel}>Account</span>
-				</button>
-				<button type="button" class={styles.action}>
-					<Settings size={16} strokeWidth={2} />
-					<span class={styles.actionLabel}>Prefs</span>
-				</button>
-			</div>
-		</section>
-	);
-};

Frontend/src/components/shell/ProjectContextMenu/ProjectContextMenu.tsx

@@ -0,0 +1,204 @@
+import { For, Show, createEffect, createMemo, createSignal, onMount, type JSX } from "solid-js";
+import { Portal } from "solid-js/web";
+import { ChevronRight, Plus } from "../../../lib/icons";
+import {
+	getProjectContextMenuEyebrow,
+	getProjectContextMenuSections,
+	type ProjectContextMenuAction,
+	type ProjectMenuTarget,
+	type WorkspaceContextMenuShortcut,
+} from "../data/shell.data";
+import styles from "../WorkspaceContextMenu/WorkspaceContextMenu.module.scss";
+
+type ShortcutPlatform = "mac" | "windows";
+
+type NavigatorWithUserAgentData = Navigator & {
+	userAgentData?: {
+		platform?: string;
+	};
+};
+
+type ProjectContextMenuPosition = {
+	x: number;
+	y: number;
+};
+
+type ProjectContextMenuProps = {
+	target: ProjectMenuTarget | null;
+	position: ProjectContextMenuPosition | null;
+	onClose: VoidFunction;
+	onSelect: (action: ProjectContextMenuAction, target: ProjectMenuTarget) => void;
+	menuRef: (element: HTMLDivElement) => void;
+};
+
+const getShortcutPlatform = (): ShortcutPlatform => {
+	if (typeof navigator === "undefined") {
+		return "mac";
+	}
+
+	const navigatorWithUserAgentData = navigator as NavigatorWithUserAgentData;
+	const platform =
+		typeof navigatorWithUserAgentData.userAgentData?.platform === "string"
+			? navigatorWithUserAgentData.userAgentData.platform
+			: navigator.platform;
+
+	return /mac|iphone|ipad|ipod/i.test(platform) ? "mac" : "windows";
+};
+
+const formatShortcut = (shortcut: WorkspaceContextMenuShortcut, platform: ShortcutPlatform): string => {
+	const keyLabel = (() => {
+		switch (shortcut.key) {
+			case "enter":
+				return platform === "mac" ? "↩" : "Enter";
+			case "delete":
+				return platform === "mac" ? "⌫" : "Del";
+			default:
+				return shortcut.key.toUpperCase();
+		}
+	})();
+
+	const modifierLabels =
+		shortcut.modifiers?.map((modifier) => {
+			switch (modifier) {
+				case "meta":
+					return platform === "mac" ? "⌘" : "Ctrl";
+				case "alt":
+					return platform === "mac" ? "⌥" : "Alt";
+				case "shift":
+					return platform === "mac" ? "⇧" : "Shift";
+			}
+		}) ?? [];
+
+	return platform === "mac" ? `${modifierLabels.join("")}${keyLabel}` : [...modifierLabels, keyLabel].join("+");
+};
+
+export const ProjectContextMenu = (props: ProjectContextMenuProps): JSX.Element => {
+	const [activeSubmenuActionId, setActiveSubmenuActionId] = createSignal<string | null>(null);
+	const [shortcutPlatform, setShortcutPlatform] = createSignal<ShortcutPlatform>("mac");
+	const sections = createMemo(() => (props.target ? getProjectContextMenuSections(props.target) : []));
+	const isCreateAction = (action: ProjectContextMenuAction): boolean => action.id.startsWith("new-");
+	const menuState = createMemo<{
+		target: ProjectMenuTarget;
+		position: ProjectContextMenuPosition;
+	} | null>(() => (props.target && props.position ? { target: props.target, position: props.position } : null));
+
+	onMount(() => {
+		setShortcutPlatform(getShortcutPlatform());
+	});
+
+	createEffect(() => {
+		void props.target;
+		setActiveSubmenuActionId(null);
+	});
+
+	return (
+		<Show when={menuState()}>
+			{(resolvedMenuState): JSX.Element => {
+				const target = resolvedMenuState().target;
+				const position = resolvedMenuState().position;
+
+				return (
+					<Portal>
+						<div
+							ref={props.menuRef}
+							class={styles.menu}
+							role="menu"
+							aria-label={`${target.label} project context menu`}
+							style={{ left: `${position.x}px`, top: `${position.y}px` }}
+						>
+							<Show when={target.kind !== "surface"}>
+								<header class={styles.header}>
+									<span class={styles.eyebrow}>{getProjectContextMenuEyebrow(target)}</span>
+									<strong class={styles.title}>{target.label}</strong>
+								</header>
+							</Show>
+
+							<div class={styles.sectionList}>
+								<For each={sections()}>
+									{(section): JSX.Element => (
+										<section class={styles.section}>
+											<Show when={section.label}>
+												<span class={styles.sectionLabel}>{section.label}</span>
+											</Show>
+											<div class={styles.actionList}>
+												<For each={section.items}>
+													{(action): JSX.Element => {
+														const isSubmenuOpen = () => activeSubmenuActionId() === action.id;
+
+														return (
+															<div class={styles.actionItem} onMouseEnter={() => setActiveSubmenuActionId(action.children ? action.id : null)}>
+												<button
+													type="button"
+													role="menuitem"
+													classList={{
+														[styles.action]: true,
+														[styles.actionCreate]: isCreateAction(action),
+														[styles.actionDanger]: action.tone === "danger",
+														[styles.actionSubmenuOpen]: isSubmenuOpen(),
+													}}
+																	onClick={() => {
+																		if (action.children) {
+																			setActiveSubmenuActionId(isSubmenuOpen() ? null : action.id);
+																			return;
+																		}
+
+														props.onSelect(action, target);
+														props.onClose();
+													}}
+												>
+													<Show when={isCreateAction(action)}>
+														<span class={styles.actionCreateIcon} aria-hidden="true">
+															<Plus size={14} strokeWidth={2.25} />
+														</span>
+													</Show>
+																	<span class={styles.actionLabel}>{action.label}</span>
+																	<div class={styles.actionMeta}>
+																		<Show when={action.shortcut}>
+																			<span class={styles.actionShortcut}>{formatShortcut(action.shortcut!, shortcutPlatform())}</span>
+																		</Show>
+																		<Show when={action.children}>
+																			<ChevronRight class={styles.actionChevron} size={16} strokeWidth={2} />
+																		</Show>
+																	</div>
+																</button>
+
+																<Show when={action.children && isSubmenuOpen()}>
+																	<div class={styles.submenu} role="menu" aria-label={`${action.label} submenu`}>
+																		<div class={styles.submenuList}>
+																			<For each={action.children ?? []}>
+																				{(childAction): JSX.Element => (
+																					<button
+																						type="button"
+																						role="menuitem"
+																						classList={{
+																							[styles.action]: true,
+																							[styles.actionDanger]: childAction.tone === "danger",
+																						}}
+																						onClick={() => {
+																							props.onSelect(childAction, target);
+																							props.onClose();
+																						}}
+																					>
+																						<span class={styles.actionLabel}>{childAction.label}</span>
+																					</button>
+																				)}
+																			</For>
+																		</div>
+																	</div>
+																</Show>
+															</div>
+														);
+													}}
+												</For>
+											</div>
+										</section>
+									)}
+								</For>
+							</div>
+						</div>
+					</Portal>
+				);
+			}}
+		</Show>
+	);
+};

Frontend/src/components/shell/ProjectContextMenu/createProjectContextMenuController.ts

@@ -0,0 +1,130 @@
+import { createEffect, createSignal, onCleanup } from "solid-js";
+import type { ProjectMenuTarget } from "../data/shell.data";
+
+type ProjectContextMenuState = {
+	target: ProjectMenuTarget;
+	x: number;
+	y: number;
+};
+
+const readRootPixelToken = (name: string, fallback: number): number => {
+	if (typeof window === "undefined") {
+		return fallback;
+	}
+
+	const value = window.getComputedStyle(document.documentElement).getPropertyValue(name).trim();
+	const parsed = Number.parseFloat(value);
+
+	if (!Number.isFinite(parsed)) {
+		return fallback;
+	}
+
+	if (value.endsWith("px")) {
+		return parsed;
+	}
+
+	return parsed * 16;
+};
+
+const clampMenuPosition = (value: number, min: number, max: number): number => {
+	if (max <= min) {
+		return min;
+	}
+
+	return Math.min(Math.max(value, min), max);
+};
+
+export const createProjectContextMenuController = () => {
+	const [menuState, setMenuState] = createSignal<ProjectContextMenuState | null>(null);
+	let menuRef: HTMLDivElement | undefined;
+
+	const closeMenu = (): void => {
+		setMenuState(null);
+	};
+
+	const repositionMenu = (): void => {
+		if (typeof window === "undefined" || !menuRef) {
+			return;
+		}
+
+		const current = menuState();
+
+		if (!current) {
+			return;
+		}
+
+		const viewportPadding = readRootPixelToken("--space-4", 16);
+		const rect = menuRef.getBoundingClientRect();
+		const nextX = clampMenuPosition(current.x, viewportPadding, window.innerWidth - rect.width - viewportPadding);
+		const nextY = clampMenuPosition(current.y, viewportPadding, window.innerHeight - rect.height - viewportPadding);
+
+		if (nextX === current.x && nextY === current.y) {
+			return;
+		}
+
+		setMenuState({ ...current, x: nextX, y: nextY });
+	};
+
+	const openMenu = (event: MouseEvent, target: ProjectMenuTarget): void => {
+		event.preventDefault();
+		setMenuState({ target, x: event.clientX, y: event.clientY });
+	};
+
+	const openMenuFromElement = (element: HTMLElement, target: ProjectMenuTarget): void => {
+		const rect = element.getBoundingClientRect();
+		setMenuState({
+			target,
+			x: rect.left + rect.width / 2,
+			y: rect.top + rect.height / 2,
+		});
+	};
+
+	createEffect(() => {
+		if (!menuState() || typeof window === "undefined") {
+			return;
+		}
+
+		const frame = window.requestAnimationFrame(() => {
+			repositionMenu();
+		});
+
+		const handlePointerDown = (event: PointerEvent): void => {
+			if (!menuRef?.contains(event.target as Node)) {
+				closeMenu();
+			}
+		};
+
+		const handleKeyDown = (event: KeyboardEvent): void => {
+			if (event.key === "Escape") {
+				closeMenu();
+			}
+		};
+
+		const handleViewportChange = (): void => {
+			closeMenu();
+		};
+
+		document.addEventListener("pointerdown", handlePointerDown);
+		window.addEventListener("resize", handleViewportChange);
+		window.addEventListener("scroll", handleViewportChange, true);
+		window.addEventListener("keydown", handleKeyDown);
+
+		onCleanup(() => {
+			window.cancelAnimationFrame(frame);
+			document.removeEventListener("pointerdown", handlePointerDown);
+			window.removeEventListener("resize", handleViewportChange);
+			window.removeEventListener("scroll", handleViewportChange, true);
+			window.removeEventListener("keydown", handleKeyDown);
+		});
+	});
+
+	return {
+		menuState,
+		openMenu,
+		openMenuFromElement,
+		closeMenu,
+		setMenuRef: (element: HTMLDivElement): void => {
+			menuRef = element;
+		},
+	};
+};

Frontend/src/components/shell/ProjectSelector/ProjectSelector.module.scss

@@ -0,0 +1,343 @@
+@use "../shared/tree-nav" as treeNav;
+
+.root {
+  display: grid;
+  --project-drawer-gap: var(--space-3);
+  --project-drawer-top: calc(var(--space-4) + var(--control-size-lg));
+  --project-drawer-bottom: calc(var(--sidebar-dock-clearance, var(--shell-dock-clearance)) + var(--project-drawer-gap));
+}
+
+.rootCompact {
+  justify-items: center;
+}
+
+.rootDragMode {
+	user-select: none;
+	cursor: grabbing;
+}
+
+.rootDragMode .treeItem {
+	cursor: grabbing;
+}
+
+.trigger {
+  width: 100%;
+  min-width: 0;
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr) auto;
+  align-items: center;
+  gap: var(--space-2);
+  min-height: calc(var(--control-size-lg) + var(--space-2));
+  padding: var(--space-2) var(--space-3) calc(var(--space-2) + 0.2rem);
+  border: 1px solid color-mix(in srgb, var(--color-border-strong) 44%, transparent);
+  border-radius: calc(var(--radius-lg) + var(--space-1));
+  background: color-mix(in srgb, var(--color-surface) 96%, transparent);
+  box-shadow: var(--shadow-soft);
+  text-align: left;
+  position: relative;
+  z-index: 5;
+  transition:
+    border-color var(--duration-fast) var(--easing-standard),
+    background var(--duration-fast) var(--easing-standard),
+    box-shadow var(--duration-fast) var(--easing-standard),
+    transform 180ms var(--easing-standard);
+}
+
+.trigger:hover {
+  background: var(--color-surface-hover);
+  border-color: var(--color-border);
+}
+
+.triggerOpen {
+  border-color: color-mix(in srgb, var(--color-accent-strong) 22%, var(--color-border-strong));
+  background: color-mix(in srgb, var(--color-accent-soft) 26%, var(--color-surface));
+  box-shadow: 0 10px 28px color-mix(in srgb, black 8%, transparent);
+}
+
+.triggerCompact {
+  width: var(--control-size-xl);
+  min-height: var(--control-size-xl);
+  grid-template-columns: auto;
+  justify-items: center;
+  gap: 0.15rem;
+  padding: var(--space-2) 0;
+  border-radius: var(--radius-xl);
+}
+
+.triggerCompact .triggerLead {
+  width: var(--control-size-md);
+  height: var(--control-size-md);
+}
+
+.triggerCompact .triggerIcon {
+  transform: rotate(0deg);
+}
+
+.triggerCompact .triggerIconOpen {
+  transform: rotate(180deg);
+}
+
+.triggerLead {
+  width: var(--control-size-md);
+  height: var(--control-size-md);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--radius-md);
+  background: color-mix(in srgb, var(--color-accent-soft) 82%, transparent);
+  color: var(--color-accent-strong);
+}
+
+.triggerCopy {
+  min-width: 0;
+  display: grid;
+  gap: 0.12rem;
+}
+
+.eyebrow {
+  @include text-caption;
+  color: var(--color-text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+}
+
+.value {
+  @include text-label;
+}
+
+.triggerIcon {
+  color: var(--color-text-muted);
+  transform: rotate(-90deg);
+  transition: transform var(--duration-fast) var(--easing-standard);
+}
+
+.triggerIconOpen {
+  transform: rotate(0deg);
+}
+
+.scrim {
+  position: absolute;
+  inset: calc(var(--project-drawer-top) + var(--project-drawer-gap)) var(--space-4)
+    var(--project-drawer-bottom) var(--space-4);
+  z-index: 2;
+  opacity: 0;
+  pointer-events: none;
+  background: color-mix(in srgb, black 8%, transparent);
+  border-radius: var(--radius-lg);
+  transition: opacity 260ms var(--easing-standard);
+}
+
+.scrimOpen {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.rootCompact .scrim,
+.rootCompact .drawer {
+  left: 0;
+  right: auto;
+  width: min(18rem, calc(100vw - 6rem));
+}
+
+.drawer {
+  position: absolute;
+  inset: calc(var(--project-drawer-top) + var(--project-drawer-gap)) var(--space-4)
+    var(--project-drawer-bottom) var(--space-4);
+  z-index: 3;
+  display: grid;
+  overflow: hidden;
+  border-radius: var(--radius-lg);
+  opacity: 0;
+  pointer-events: none;
+  transform: translateX(calc(-1 * (var(--space-5) + 12%)));
+  will-change: transform, opacity;
+  transition:
+    opacity 240ms var(--easing-standard),
+    transform 360ms cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.drawerOpen {
+  opacity: 1;
+  pointer-events: auto;
+  transform: translateX(0);
+}
+
+.drawer::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  border-radius: inherit;
+  border: 1px solid color-mix(in srgb, var(--color-border-strong) 52%, transparent);
+  background: var(--color-surface-muted);
+  box-shadow:
+    14px 0 30px color-mix(in srgb, black 7%, transparent),
+    inset -1px 0 0 color-mix(in srgb, white 4%, transparent);
+  pointer-events: none;
+}
+
+.drawerBody {
+  position: relative;
+  z-index: 1;
+  min-height: 0;
+  display: grid;
+  align-content: start;
+  gap: var(--space-2);
+  padding: var(--space-4);
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  scrollbar-width: none;
+}
+
+.drawerBody::-webkit-scrollbar {
+	width: 0;
+}
+
+.treeSectionLabel {
+	@include treeNav.section-label;
+  margin: 0;
+  padding: 0 var(--space-3);
+}
+
+.treeSectionHeader {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: var(--space-2);
+	margin-bottom: var(--space-2);
+	padding-right: var(--space-1);
+}
+
+.treeControls {
+	display: inline-flex;
+	align-items: center;
+	gap: var(--space-1);
+	flex-wrap: wrap;
+	justify-content: flex-end;
+}
+
+.treeControlButton {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: calc(var(--control-size-md) - var(--space-1));
+	height: calc(var(--control-size-md) - var(--space-1));
+	@include text-caption;
+	padding: 0;
+	border: 1px solid color-mix(in srgb, var(--color-border) 46%, transparent);
+	border-radius: var(--radius-pill);
+	background: color-mix(in srgb, var(--color-surface) 95%, transparent);
+	color: var(--color-text-muted);
+	transition:
+		border-color 160ms var(--easing-standard),
+		background 160ms var(--easing-standard),
+		color 160ms var(--easing-standard);
+}
+
+.treeControlButton:hover,
+.treeControlButton:focus-visible {
+	border-color: color-mix(in srgb, var(--color-border-strong) 56%, transparent);
+	background: var(--color-surface-hover);
+	color: var(--color-text);
+	outline: none;
+}
+
+.treeControlButton:disabled {
+	opacity: 0.45;
+	cursor: default;
+}
+
+.treeList {
+	@include treeNav.tree-list;
+}
+
+.treeEmptySlot {
+	@include treeNav.empty-slot;
+}
+
+.treeInputRow {
+	@include treeNav.input-row;
+}
+
+.treeInput {
+	@include treeNav.input;
+}
+
+.treeItem {
+	@include treeNav.item;
+}
+
+.treeItem:hover,
+.treeItem:focus-visible {
+	@include treeNav.item-hover;
+}
+
+.treeItemFolder {
+	@include treeNav.item-folder;
+}
+
+.treeItemDragging {
+	@include treeNav.item-dragging;
+}
+
+.treeItemDropBefore {
+	@include treeNav.item-drop-before;
+}
+
+.treeItemDropAfter {
+	@include treeNav.item-drop-after;
+}
+
+.treeItemDropInside {
+	@include treeNav.item-drop-inside;
+}
+
+.folderChevron {
+	@include treeNav.folder-chevron;
+}
+
+.folderChevronOpen {
+	@include treeNav.folder-chevron-open;
+}
+
+.treeItemActive {
+	@include treeNav.item-active;
+}
+
+.icon {
+	@include treeNav.icon;
+}
+
+.label {
+	@include treeNav.label;
+}
+
+.itemMeta {
+	@include treeNav.item-meta;
+}
+
+.dragGhostLayer {
+	@include treeNav.drag-ghost-layer;
+}
+
+.dragGhost {
+	@include treeNav.drag-ghost;
+}
+
+.dragGhostCopy {
+	@include treeNav.drag-ghost-copy;
+}
+
+.dragGhostTitle {
+	@include treeNav.drag-ghost-title;
+}
+
+.dragGhostMeta {
+	@include treeNav.drag-ghost-meta;
+}
+
+@media (max-width: 720px) {
+  .rootCompact .scrim,
+  .rootCompact .drawer {
+    width: min(18rem, calc(100vw - 5rem));
+  }
+}

Frontend/src/components/shell/ServerDock/ServerDock.module.scss

@@ -1,18 +1,17 @@
 .panel {
-  --profile-dock-avatar-size: var(--control-size-md);
-  --profile-dock-action-min-height: var(--space-8);
-  --profile-dock-border: color-mix(in srgb, var(--color-border-strong) 75%, transparent);
-  --profile-dock-surface: color-mix(in srgb, var(--color-surface) 94%, transparent);
-  --profile-dock-status-ring: 0 0 0 3px color-mix(in srgb, var(--color-success) 18%, transparent);
+  --server-dock-glyph-size: var(--control-size-md);
+  --server-dock-action-min-height: var(--space-8);
+  --server-dock-border: color-mix(in srgb, var(--color-border-strong) 75%, transparent);
+  --server-dock-surface: color-mix(in srgb, var(--color-surface) 94%, transparent);
   position: relative;
   z-index: 1;
   width: 100%;
   display: grid;
   gap: var(--space-2);
   padding: var(--space-3) var(--space-3) var(--space-2);
-  border: 1px solid var(--profile-dock-border);
+  border: 1px solid var(--server-dock-border);
   border-radius: calc(var(--radius-xl) + var(--space-1));
-  background: var(--profile-dock-surface);
+  background: var(--server-dock-surface);
   box-shadow:
     0 20px 48px color-mix(in srgb, black 16%, transparent),
     var(--shadow-strong);
@@ -26,14 +25,14 @@
   align-items: center;
 }
 
-.avatar {
-  width: var(--profile-dock-avatar-size);
-  height: var(--profile-dock-avatar-size);
+.glyph {
+  width: var(--server-dock-glyph-size);
+  height: var(--server-dock-glyph-size);
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  border-radius: 50%;
-  background: var(--color-accent-soft);
+  border-radius: var(--radius-lg);
+  background: color-mix(in srgb, var(--color-accent-soft) 84%, transparent);
   color: var(--color-accent-strong);
   @include text-label;
 }
@@ -48,20 +47,25 @@
   @include text-label;
 }
 
-.status {
+.status,
+.subtitle {
   @include text-caption;
-  display: inline-flex;
-  align-items: center;
-  gap: var(--space-2);
   color: var(--color-text-muted);
 }
 
+.status {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-1);
+}
+
 .statusDot {
-  width: 0.5rem;
-  height: 0.5rem;
-  border-radius: 50%;
+  width: 0.45rem;
+  height: 0.45rem;
+  flex: 0 0 auto;
+  border-radius: 999px;
   background: var(--color-success);
-  box-shadow: var(--profile-dock-status-ring);
+  box-shadow: 0 0 0 0.1rem color-mix(in srgb, var(--color-success) 18%, transparent);
 }
 
 .actions {
@@ -71,7 +75,7 @@
 }
 
 .action {
-  min-height: var(--profile-dock-action-min-height);
+  min-height: var(--server-dock-action-min-height);
   display: inline-flex;
   align-items: center;
   justify-content: center;

Frontend/src/components/shell/ServerDock/ServerDock.tsx

@@ -0,0 +1,49 @@
+// Path: Frontend/src/components/shell/ServerDock/ServerDock.tsx
+
+import { For, Show, type JSX } from "solid-js";
+import { useAppShellData } from "../data/app-shell.context";
+import styles from "./ServerDock.module.scss";
+
+export const ServerDock = (): JSX.Element => {
+	const appShellData = useAppShellData();
+	const activeServer = () => appShellData.activeServer();
+
+	return (
+		<section class={styles.panel} aria-label="Server dock" data-ui="server-dock" data-server-kind={activeServer().kind}>
+			<div class={styles.identity} data-slot="server-dock-identity">
+				<div class={styles.glyph} aria-hidden="true">
+					{activeServer().abbreviation}
+				</div>
+				<div class={styles.copy} data-slot="server-dock-copy">
+					<span class={styles.name}>{activeServer().name}</span>
+					<Show
+						when={activeServer().kind === "organization"}
+						fallback={<span class={styles.subtitle}>{activeServer().subtitle}</span>}
+					>
+						<span class={styles.status}>
+							<span class={styles.statusDot} aria-hidden="true" />
+							<span>{activeServer().connectedLabel}</span>
+						</span>
+					</Show>
+				</div>
+			</div>
+
+			<Show when={activeServer().dockActions.length > 0}>
+				<div class={styles.actions} data-slot="server-dock-actions">
+					<For each={activeServer().dockActions}>
+						{(item): JSX.Element => {
+							const Icon = item.icon;
+
+							return (
+								<button type="button" class={styles.action} aria-label={item.label} title={item.label} data-slot="server-dock-action" data-action-id={item.id}>
+									<Icon size={16} strokeWidth={2} />
+									<span class={styles.actionLabel}>{item.label}</span>
+								</button>
+							);
+						}}
+					</For>
+				</div>
+			</Show>
+		</section>
+	);
+};

Frontend/src/components/shell/TopBar/NotificationsButton.module.scss

@@ -0,0 +1,66 @@
+.button {
+	display: inline-flex;
+	justify-content: center;
+	align-items: center;
+	width: 2.75rem;
+	height: 2.75rem;
+	aspect-ratio: 1;
+	padding: 0;
+	border: 0;
+	border-radius: 999px;
+	flex-shrink: 0;
+	cursor: pointer;
+	background: transparent;
+	color: var(--color-text-muted);
+	transition:
+		background-color 220ms var(--easing-standard),
+		color 220ms var(--easing-standard),
+		transform 180ms var(--easing-standard);
+}
+
+.button:hover {
+	background: color-mix(in srgb, var(--color-text) 8%, transparent);
+	color: var(--color-text);
+}
+
+.buttonOpen {
+	background: color-mix(in srgb, var(--color-surface) 92%, transparent);
+	color: var(--color-text);
+}
+
+.button:focus-visible {
+	outline: none;
+	background: color-mix(in srgb, var(--color-accent-strong) 12%, transparent);
+	box-shadow: 0 0 0 0.12rem color-mix(in srgb, var(--color-accent-strong) 28%, transparent);
+	color: var(--color-text);
+}
+
+.iconWrap {
+	position: relative;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: 1.5rem;
+	height: 1.5rem;
+}
+
+.badge {
+	@include text-caption;
+	position: absolute;
+	top: -0.45rem;
+	right: -0.7rem;
+	min-width: 1rem;
+	height: 1rem;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	padding: 0 0.24rem;
+	border: 1px solid color-mix(in srgb, var(--color-surface) 68%, transparent);
+	border-radius: 999px;
+	background: color-mix(in srgb, var(--color-primary-3) 84%, black 16%);
+	color: white;
+	font-weight: var(--font-weight-semibold);
+	line-height: 1;
+	box-shadow: 0 6px 14px color-mix(in srgb, black 18%, transparent);
+	pointer-events: none;
+}

Frontend/src/components/shell/TopBar/NotificationsButton.tsx

@@ -0,0 +1,36 @@
+import type { JSX } from "solid-js";
+import { Bell } from "../../../lib/icons";
+import { unreadNotificationCount } from "../data/shell.data";
+import styles from "./NotificationsButton.module.scss";
+
+type NotificationsButtonProps = {
+	isOpen: boolean;
+	menuId: string;
+	onToggle: () => void;
+};
+
+export const NotificationsButton = (props: NotificationsButtonProps): JSX.Element => {
+	const hasUnread = unreadNotificationCount > 0;
+	const unreadLabel = hasUnread ? `, ${unreadNotificationCount} unread` : "";
+
+	return (
+		<button
+			classList={{
+				[styles.button]: true,
+				[styles.buttonOpen]: props.isOpen,
+			}}
+			type="button"
+			aria-label={`${props.isOpen ? "Close" : "Open"} notifications${unreadLabel}`}
+			title={`${props.isOpen ? "Close" : "Open"} notifications`}
+			aria-haspopup="menu"
+			aria-controls={props.menuId}
+			aria-expanded={props.isOpen}
+			onClick={props.onToggle}
+		>
+			<span class={styles.iconWrap} aria-hidden="true">
+				<Bell size={18} strokeWidth={2} />
+				{hasUnread ? <span class={styles.badge}>{unreadNotificationCount}</span> : null}
+			</span>
+		</button>
+	);
+};

Frontend/src/components/shell/TopBar/NotificationsMenu.module.scss

@@ -0,0 +1,271 @@
+.menu {
+	position: absolute;
+	top: calc(100% + var(--space-2));
+	right: 0;
+	width: min(24rem, calc(100vw - (var(--space-4) * 2)));
+	display: grid;
+	gap: var(--space-3);
+	padding: var(--space-3);
+	border: 1px solid var(--color-border-strong);
+	border-radius: calc(var(--radius-lg) + (var(--space-1) / 2));
+	background: color-mix(in srgb, var(--color-surface-muted) 96%, transparent);
+	box-shadow: var(--shadow-strong);
+	backdrop-filter: blur(var(--blur-overlay));
+	z-index: var(--z-dropdown);
+}
+
+.menu.menuWorkspace {
+	position: static;
+	top: auto;
+	right: auto;
+	left: auto;
+	bottom: auto;
+	width: 100%;
+	max-width: none;
+	height: 100%;
+	min-height: 0;
+	display: grid;
+	grid-template-rows: auto minmax(0, 1fr) auto;
+	gap: var(--space-4);
+	padding: var(--space-4);
+	border: 0;
+	border-radius: 0;
+	background: transparent;
+	box-shadow: none;
+	backdrop-filter: none;
+	z-index: auto;
+	overflow: hidden;
+}
+
+.header,
+.footer {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: var(--space-3);
+}
+
+.header {
+	padding-bottom: var(--space-3);
+	border-bottom: 1px solid var(--color-border);
+}
+
+.headerCopy {
+	min-width: 0;
+	display: grid;
+	gap: calc(var(--space-1) / 2);
+}
+
+.title {
+	@include text-label;
+	color: var(--color-text);
+}
+
+.subtitle,
+.sectionLabel,
+.itemMeta,
+.itemTime {
+	@include text-caption;
+	color: var(--color-text-muted);
+}
+
+.headerAction,
+.footerAction {
+	@include text-caption;
+	display: inline-flex;
+	align-items: center;
+	gap: var(--space-1);
+	padding: 0;
+	border: 0;
+	background: transparent;
+	color: var(--color-text-muted);
+	transition: color 160ms var(--easing-standard);
+}
+
+.headerAction:hover,
+.headerAction:focus-visible,
+.footerAction:hover,
+.footerAction:focus-visible {
+	outline: none;
+	color: var(--color-text);
+}
+
+.listWrap {
+	display: grid;
+	gap: var(--space-3);
+	max-height: min(24rem, 60vh);
+	overflow-y: auto;
+	padding-right: var(--space-1);
+	margin-right: calc(var(--space-1) * -1);
+}
+
+.stateCard {
+	display: grid;
+	justify-items: start;
+	gap: var(--space-2);
+	padding: var(--space-3);
+	border: 1px solid color-mix(in srgb, var(--color-border) 18%, transparent);
+	border-radius: var(--radius-md);
+	background: color-mix(in srgb, var(--color-surface) 92%, transparent);
+}
+
+.stateIcon {
+	width: 2.2rem;
+	height: 2.2rem;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	border-radius: 999px;
+	background: color-mix(in srgb, var(--color-surface-muted) 88%, transparent);
+	color: var(--color-text);
+}
+
+.stateTitle {
+	@include text-label;
+	color: var(--color-text);
+}
+
+.stateCopy {
+	@include text-caption;
+	color: var(--color-text-muted);
+}
+
+.section {
+	display: grid;
+	gap: var(--space-2);
+}
+
+.section + .section {
+	padding-top: var(--space-3);
+	border-top: 1px solid var(--color-border);
+}
+
+.sectionLabel {
+	text-transform: uppercase;
+	letter-spacing: 0.06em;
+	color: var(--color-text-subtle);
+}
+
+.list {
+	display: grid;
+	gap: var(--space-1);
+}
+
+.item {
+	width: 100%;
+	min-width: 0;
+	display: grid;
+	grid-template-columns: auto minmax(0, 1fr) auto;
+	align-items: start;
+	gap: var(--space-2);
+	padding: var(--space-2);
+	border: 1px solid transparent;
+	border-radius: var(--radius-sm);
+	background: transparent;
+	color: var(--color-text);
+	text-align: left;
+	transition:
+		background-color 160ms var(--easing-standard),
+		border-color 160ms var(--easing-standard),
+		color 160ms var(--easing-standard);
+}
+
+.item:hover {
+	background: color-mix(in srgb, var(--color-surface) 88%, transparent);
+	border-color: color-mix(in srgb, var(--color-border) 20%, transparent);
+}
+
+.item:focus-visible {
+	outline: none;
+	background: color-mix(in srgb, var(--color-surface) 92%, transparent);
+	border-color: color-mix(in srgb, var(--color-accent-soft) 52%, transparent);
+	box-shadow: 0 0 0 0.12rem color-mix(in srgb, var(--color-accent-soft) 14%, transparent);
+}
+
+.itemUnread {
+	background: color-mix(in srgb, var(--color-surface) 90%, transparent);
+	border-color: color-mix(in srgb, var(--color-border) 16%, transparent);
+}
+
+.itemMarker,
+.itemMarkerMuted {
+	width: 0.5rem;
+	height: 0.5rem;
+	margin-top: 0.45rem;
+	border-radius: 999px;
+	flex-shrink: 0;
+	background: color-mix(in srgb, var(--color-primary-2) 78%, white 22%);
+}
+
+.itemMarkerMuted {
+	background: color-mix(in srgb, var(--color-text-subtle) 36%, transparent);
+}
+
+.itemBody {
+	min-width: 0;
+	display: grid;
+	gap: calc(var(--space-1) / 2);
+}
+
+.itemTitle {
+	@include text-label;
+	color: var(--color-text);
+}
+
+.itemTime {
+	padding-top: calc(var(--space-1) / 4);
+	white-space: nowrap;
+	color: var(--color-text-subtle);
+}
+
+.footer {
+	padding-top: var(--space-3);
+	border-top: 1px solid var(--color-border);
+	justify-content: space-between;
+	flex-wrap: wrap;
+}
+
+.menu.menuWorkspace .listWrap {
+	min-height: 0;
+	max-height: none;
+	height: 100%;
+	padding-right: 0;
+	margin-right: 0;
+}
+
+.menu.menuWorkspace .header,
+.menu.menuWorkspace .footer {
+	padding-left: 0;
+	padding-right: 0;
+}
+
+@include respond-down(mobile) {
+	.menu.menuWorkspace {
+		height: 100%;
+		min-height: 0;
+		padding: var(--space-5);
+	}
+
+	.menu.menuWorkspace .listWrap {
+		min-height: 0;
+		max-height: none;
+	}
+
+	.menu.menuWorkspace .item {
+		grid-template-columns: auto minmax(0, 1fr);
+	}
+
+	.menu.menuWorkspace .itemTime {
+		grid-column: 2;
+		padding-top: 0;
+	}
+
+	.menu.menuWorkspace .footer {
+		align-items: flex-start;
+		flex-direction: column;
+	}
+
+	.menu.menuWorkspace .footerAction {
+		padding: var(--space-1) 0;
+	}
+}

Frontend/src/components/shell/TopBar/NotificationsMenu.tsx

@@ -0,0 +1,125 @@
+import { For, Show, type JSX } from "solid-js";
+import { Bell, Settings } from "../../../lib/icons";
+import { notificationItems, unreadNotificationCount } from "../data/shell.data";
+import styles from "./NotificationsMenu.module.scss";
+
+type NotificationsMenuProps = {
+	id: string;
+	menuRef?: (element: HTMLDivElement) => void;
+	onSelect: () => void;
+	variant?: "popover" | "workspace";
+};
+
+export const NotificationsMenu = (props: NotificationsMenuProps): JSX.Element => {
+	const unreadItems = notificationItems.filter((item) => item.unread);
+	const earlierItems = notificationItems.filter((item) => !item.unread);
+	const hasNotifications = notificationItems.length > 0;
+	const isCaughtUp = unreadItems.length === 0 && hasNotifications;
+	const variant = props.variant ?? "popover";
+
+	return (
+		<div
+			id={props.id}
+			classList={{
+				[styles.menu]: true,
+				[styles.menuWorkspace]: variant === "workspace",
+			}}
+			role="menu"
+			aria-label="Notifications"
+			ref={props.menuRef}
+			data-ui="notifications-menu"
+			data-variant={variant}
+		>
+			<div class={styles.header} data-slot="notifications-header">
+				<div class={styles.headerCopy} data-slot="notifications-header-copy">
+					<strong class={styles.title}>Notifications</strong>
+					<span class={styles.subtitle}>
+						{unreadNotificationCount > 0
+							? `You have ${unreadNotificationCount} unread`
+							: "You’re all caught up"}
+					</span>
+				</div>
+
+				<Show when={unreadNotificationCount > 0}>
+					<button type="button" role="menuitem" class={styles.headerAction} onClick={props.onSelect}>
+						Mark all read
+					</button>
+				</Show>
+			</div>
+
+			<div class={styles.listWrap} data-slot="notifications-body">
+				<Show when={!hasNotifications}>
+					<div class={styles.stateCard}>
+						<span class={styles.stateIcon} aria-hidden="true">
+							<Bell size={18} strokeWidth={2} />
+						</span>
+						<strong class={styles.stateTitle}>No notifications yet</strong>
+						<span class={styles.stateCopy}>When activity starts across your workspace, it’ll show up here.</span>
+					</div>
+				</Show>
+
+				<Show when={isCaughtUp}>
+					<div class={styles.stateCard}>
+						<span class={styles.stateIcon} aria-hidden="true">
+							<Bell size={18} strokeWidth={2} />
+						</span>
+						<strong class={styles.stateTitle}>You’re all caught up</strong>
+						<span class={styles.stateCopy}>No unread notifications right now. Earlier activity is still available below.</span>
+					</div>
+				</Show>
+
+				<Show when={unreadItems.length > 0}>
+					<section class={styles.section} aria-label="Unread notifications" data-slot="notifications-section" data-section-id="unread">
+						<span class={styles.sectionLabel}>Unread</span>
+						<div class={styles.list} data-slot="notifications-list" data-section-id="unread">
+							<For each={unreadItems}>
+								{(item): JSX.Element => (
+									<button type="button" role="menuitem" classList={{ [styles.item]: true, [styles.itemUnread]: true }} data-slot="notification-item" data-state="unread" onClick={props.onSelect}>
+										<span class={styles.itemMarker} aria-hidden="true" />
+										<div class={styles.itemBody}>
+											<span class={styles.itemTitle}>{item.title}</span>
+											<span class={styles.itemMeta}>{item.contextLabel}</span>
+										</div>
+										<span class={styles.itemTime}>{item.timeLabel}</span>
+									</button>
+								)}
+							</For>
+						</div>
+					</section>
+				</Show>
+
+				<Show when={earlierItems.length > 0}>
+					<section class={styles.section} aria-label="Earlier notifications" data-slot="notifications-section" data-section-id="earlier">
+						<span class={styles.sectionLabel}>Earlier</span>
+						<div class={styles.list} data-slot="notifications-list" data-section-id="earlier">
+							<For each={earlierItems}>
+								{(item): JSX.Element => (
+									<button type="button" role="menuitem" class={styles.item} data-slot="notification-item" data-state="read" onClick={props.onSelect}>
+										<span class={styles.itemMarkerMuted} aria-hidden="true" />
+										<div class={styles.itemBody}>
+											<span class={styles.itemTitle}>{item.title}</span>
+											<span class={styles.itemMeta}>{item.contextLabel}</span>
+										</div>
+										<span class={styles.itemTime}>{item.timeLabel}</span>
+									</button>
+								)}
+							</For>
+						</div>
+					</section>
+				</Show>
+			</div>
+
+			<div class={styles.footer} data-slot="notifications-footer">
+				<button type="button" role="menuitem" class={styles.footerAction} onClick={props.onSelect}>
+					<Settings size={16} strokeWidth={2} />
+					<span>Notification settings</span>
+				</button>
+
+				<button type="button" role="menuitem" class={styles.footerAction} onClick={props.onSelect}>
+					<Bell size={16} strokeWidth={2} />
+					<span>View all notifications</span>
+				</button>
+			</div>
+		</div>
+	);
+};

Frontend/src/components/shell/TopBar/NotificationsNav.module.scss

@@ -0,0 +1,5 @@
+.root {
+	position: relative;
+	display: inline-flex;
+	align-items: center;
+}

Frontend/src/components/shell/TopBar/NotificationsNav.tsx

@@ -0,0 +1,38 @@
+import { createUniqueId, Show, type JSX } from "solid-js";
+import { NotificationsButton } from "./NotificationsButton";
+import { NotificationsMenu } from "./NotificationsMenu";
+import { createDesktopMenuController } from "./createDesktopMenuController";
+import styles from "./NotificationsNav.module.scss";
+
+type NotificationsNavProps = {
+	isMobileViewport: boolean;
+	isMobileWorkspaceOpen: boolean;
+	onToggleMobileWorkspace: VoidFunction;
+};
+
+export const NotificationsNav = (props: NotificationsNavProps): JSX.Element => {
+	const menuId = createUniqueId();
+
+	return (
+		<Show
+			when={props.isMobileViewport}
+			fallback={<DesktopNotificationsNav />}
+		>
+			<div class={styles.root}>
+				<NotificationsButton isOpen={props.isMobileWorkspaceOpen} menuId={menuId} onToggle={props.onToggleMobileWorkspace} />
+			</div>
+		</Show>
+	);
+};
+
+const DesktopNotificationsNav = (): JSX.Element => {
+	const controller = createDesktopMenuController();
+	const menuId = createUniqueId();
+
+	return (
+		<div class={styles.root} ref={controller.setRootRef}>
+			<NotificationsButton isOpen={controller.isOpen()} menuId={menuId} onToggle={controller.toggleMenu} />
+			{controller.isOpen() ? <NotificationsMenu id={menuId} menuRef={controller.setMenuRef} onSelect={controller.closeMenu} /> : null}
+		</div>
+	);
+};

Frontend/src/components/shell/TopBar/ProfileMenu.module.scss

@@ -0,0 +1,200 @@
+.menu {
+  position: absolute;
+  top: calc(100% + var(--space-2));
+  right: 0;
+  width: min(21rem, calc(100vw - (var(--space-4) * 2)));
+  display: grid;
+  gap: var(--space-3);
+  padding: var(--space-3);
+  border: 1px solid var(--color-border-strong);
+  border-radius: calc(var(--radius-lg) + (var(--space-1) / 2));
+  background: color-mix(in srgb, var(--color-surface-muted) 96%, transparent);
+  box-shadow: var(--shadow-strong);
+  backdrop-filter: blur(var(--blur-overlay));
+  z-index: var(--z-dropdown);
+}
+
+.menu.menuWorkspace {
+  position: static;
+  top: auto;
+  right: auto;
+  left: auto;
+  bottom: auto;
+  width: 100%;
+  max-width: none;
+  height: 100%;
+  min-height: 0;
+  display: grid;
+  grid-template-rows: auto minmax(0, 1fr);
+  gap: var(--space-4);
+  padding: var(--space-4);
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+  box-shadow: none;
+  backdrop-filter: none;
+  z-index: auto;
+  overflow: hidden;
+}
+
+.sections {
+  display: grid;
+  gap: var(--space-3);
+}
+
+.summary {
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  gap: var(--space-3);
+  align-items: center;
+  padding-bottom: var(--space-3);
+  border-bottom: 1px solid var(--color-border);
+}
+
+.avatar {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 3rem;
+  height: 3rem;
+  align-self: center;
+  margin-right: var(--space-1);
+}
+
+.avatarRing {
+  position: absolute;
+  inset: 0;
+  border-radius: 999px;
+  background:
+    conic-gradient(
+      from 0deg,
+      transparent 0deg 24deg,
+      var(--color-primary-1) 24deg 118deg,
+      transparent 118deg 144deg,
+      var(--color-primary-2) 144deg 238deg,
+      transparent 238deg 264deg,
+      var(--color-primary-3) 264deg 356deg,
+      transparent 356deg 360deg
+    );
+  mask: radial-gradient(circle, transparent 64%, black 67%);
+  -webkit-mask: radial-gradient(circle, transparent 64%, black 67%);
+}
+
+.avatarCore {
+  @include text-label;
+  position: relative;
+  z-index: 1;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 78%;
+  height: 78%;
+  border-radius: 999px;
+  background: var(--color-surface);
+  color: var(--color-text);
+  font-weight: var(--font-weight-semibold);
+}
+
+.summaryCopy {
+  min-width: 0;
+  display: grid;
+  gap: calc(var(--space-1) / 2);
+}
+
+.name,
+.itemLabel {
+  @include text-label;
+}
+
+.name {
+  color: var(--color-text);
+}
+
+.email,
+.role,
+.context {
+  @include text-caption;
+  color: var(--color-text-muted);
+}
+
+.context {
+  margin-top: var(--space-1);
+  color: var(--color-text-subtle);
+}
+
+.section {
+  display: grid;
+  gap: var(--space-1);
+}
+
+.section + .section {
+  padding-top: var(--space-3);
+  border-top: 1px solid var(--color-border);
+}
+
+.item {
+  width: 100%;
+  min-width: 0;
+  min-height: calc(var(--control-size-lg) + (var(--space-1) / 2));
+  display: grid;
+  grid-template-columns: auto minmax(0, 1fr);
+  align-items: center;
+  gap: var(--space-2);
+  padding: var(--space-2);
+  border: 1px solid transparent;
+  border-radius: var(--radius-sm);
+  background: transparent;
+  color: var(--color-text);
+  text-align: left;
+  transition:
+    background-color 160ms var(--easing-standard),
+    border-color 160ms var(--easing-standard),
+    color 160ms var(--easing-standard);
+}
+
+.item:hover {
+  background: color-mix(in srgb, var(--color-surface) 88%, transparent);
+  border-color: color-mix(in srgb, var(--color-border) 20%, transparent);
+}
+
+.item:focus-visible {
+  outline: none;
+  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
+  border-color: color-mix(in srgb, var(--color-accent-soft) 52%, transparent);
+  box-shadow: 0 0 0 0.12rem color-mix(in srgb, var(--color-accent-soft) 14%, transparent);
+}
+
+.itemDanger {
+  color: color-mix(in srgb, var(--color-primary-3) 74%, var(--color-text) 26%);
+}
+
+.itemDanger:hover,
+.itemDanger:focus-visible {
+  background: color-mix(in srgb, var(--color-primary-3) 8%, transparent);
+  border-color: color-mix(in srgb, var(--color-primary-3) 16%, transparent);
+}
+
+.itemIcon {
+  width: calc(var(--control-size-lg) - var(--space-2));
+  height: calc(var(--control-size-lg) - var(--space-2));
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: var(--radius-sm);
+  background: color-mix(in srgb, var(--color-surface) 92%, transparent);
+  color: currentColor;
+}
+
+.menu.menuWorkspace .sections {
+  min-height: 0;
+  height: 100%;
+  align-content: start;
+  overflow-y: auto;
+}
+
+.menu.menuWorkspace .summary,
+.menu.menuWorkspace .sections {
+  padding-left: 0;
+  padding-right: 0;
+}

Frontend/src/components/shell/TopBar/ProfileMenu.tsx

@@ -0,0 +1,83 @@
+import { For, type JSX } from "solid-js";
+import { User } from "../../../lib/icons";
+import { useAppShellData } from "../data/app-shell.context";
+import { profileMenuSections } from "../data/shell.data";
+import styles from "./ProfileMenu.module.scss";
+
+type ProfileMenuProps = {
+	id: string;
+	menuRef?: (element: HTMLDivElement) => void;
+	onSelect: () => void;
+	variant?: "popover" | "workspace";
+};
+
+export const ProfileMenu = (props: ProfileMenuProps): JSX.Element => {
+	const variant = props.variant ?? "popover";
+	const appShellData = useAppShellData();
+	const activeUserProfile = () => appShellData.activeUserProfile();
+
+	return (
+		<div
+			id={props.id}
+			classList={{
+				[styles.menu]: true,
+				[styles.menuWorkspace]: variant === "workspace",
+			}}
+			role="menu"
+			aria-label="Profile menu"
+			ref={props.menuRef}
+			data-ui="profile-menu"
+			data-variant={variant}
+		>
+			<div class={styles.summary} data-slot="profile-summary">
+				<div class={styles.avatar} aria-hidden="true">
+					<span class={styles.avatarRing} />
+					<span class={styles.avatarCore}>
+						<User size={16} strokeWidth={2} />
+					</span>
+				</div>
+
+				<div class={styles.summaryCopy}>
+					<strong class={styles.name}>{activeUserProfile().name}</strong>
+					<span class={styles.email}>{activeUserProfile().email}</span>
+					<span class={styles.role}>{activeUserProfile().roleLabel}</span>
+					<span class={styles.context}>{activeUserProfile().contextLabel}</span>
+				</div>
+			</div>
+
+			<div class={styles.sections} data-slot="profile-sections">
+				<For each={profileMenuSections}>
+					{(section): JSX.Element => (
+						<div class={styles.section} data-slot="profile-section" data-section-id={section.id}>
+							<For each={section.items}>
+								{(item): JSX.Element => {
+									const Icon = item.icon;
+
+									return (
+										<button
+											type="button"
+											role="menuitem"
+										classList={{
+											[styles.item]: true,
+											[styles.itemDanger]: item.tone === "danger",
+										}}
+										data-slot="profile-action"
+										data-action-id={item.id}
+										data-tone={item.tone ?? "default"}
+										onClick={props.onSelect}
+										>
+											<span class={styles.itemIcon} aria-hidden="true">
+												<Icon size={16} strokeWidth={2} />
+											</span>
+											<span class={styles.itemLabel}>{item.label}</span>
+										</button>
+									);
+								}}
+							</For>
+						</div>
+					)}
+				</For>
+			</div>
+		</div>
+	);
+};

Frontend/src/components/shell/TopBar/ThemeToggle.module.scss

@@ -0,0 +1,68 @@
+.toggleButton {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  width: 2.75rem;
+  height: 2.75rem;
+  aspect-ratio: 1;
+  padding: 0;
+  border: 0;
+  border-radius: 999px;
+  flex-shrink: 0;
+  cursor: pointer;
+  background: transparent;
+  color: var(--color-text-muted);
+  transition:
+    background-color 500ms ease,
+    color 220ms var(--easing-standard),
+    transform 180ms var(--easing-standard);
+}
+
+.toggleButton:hover {
+  background: color-mix(in srgb, var(--color-text) 8%, transparent);
+  color: var(--color-text);
+}
+
+.toggleButton:focus-visible {
+  outline: none;
+  background: color-mix(in srgb, var(--color-accent-strong) 12%, transparent);
+  box-shadow: 0 0 0 0.12rem color-mix(in srgb, var(--color-accent-strong) 28%, transparent);
+  color: var(--color-text);
+}
+
+.iconContainer {
+  position: relative;
+  width: 1.375rem;
+  height: 1.375rem;
+}
+
+.iconLayer {
+  position: absolute;
+  inset: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  transition:
+    transform 1000ms ease,
+    opacity 500ms ease;
+}
+
+.moonLayer {
+  transform: rotate(90deg);
+  opacity: 0;
+
+  :global([data-theme="dark"]) & {
+    transform: rotate(0deg);
+    opacity: 1;
+  }
+}
+
+.sunLayer {
+  transform: rotate(0deg);
+  opacity: 1;
+
+  :global([data-theme="dark"]) & {
+    transform: rotate(-90deg);
+    opacity: 0;
+  }
+}

Frontend/src/components/shell/TopBar/ThemeToggle.tsx

@@ -0,0 +1,32 @@
+// Path: Frontend/src/components/shell/TopBar/ThemeToggle.tsx
+
+import type { JSX } from "solid-js";
+import type { Theme } from "../../../theme/runtime";
+import { Moon, Sun } from "../../../lib/icons";
+import styles from "./ThemeToggle.module.scss";
+
+type ThemeToggleProps = {
+	theme: Theme;
+	onToggle: VoidFunction;
+};
+
+export const ThemeToggle = (props: ThemeToggleProps): JSX.Element => {
+	return (
+		<button
+			class={styles.toggleButton}
+			type="button"
+			onClick={props.onToggle}
+			aria-label={`Switch to ${props.theme === "dark" ? "light" : "dark"} theme`}
+			title={`Switch to ${props.theme === "dark" ? "light" : "dark"} theme`}
+		>
+			<span class={styles.iconContainer} aria-hidden="true">
+				<span class={`${styles.iconLayer} ${styles.moonLayer}`}>
+					<Moon size={18} strokeWidth={2} />
+				</span>
+				<span class={`${styles.iconLayer} ${styles.sunLayer}`}>
+					<Sun size={18} strokeWidth={2} />
+				</span>
+			</span>
+		</button>
+	);
+};

Frontend/src/components/shell/TopBar/TopBar.module.scss

@@ -1,8 +1,8 @@
 .topBar {
-  --topbar-control-size: var(--control-size-md);
+  --topbar-control-size: 2.5rem;
   min-height: 4rem;
   display: grid;
-  grid-template-columns: minmax(0, 1fr) auto auto;
+  grid-template-columns: minmax(0, 1fr) auto;
   align-items: center;
   gap: var(--space-3);
   padding: var(--space-3) var(--space-4) var(--space-3);
@@ -12,6 +12,7 @@
 .identity {
   min-width: 0;
   display: grid;
+  justify-items: start;
   gap: 0;
 }
 
@@ -22,55 +23,50 @@
   letter-spacing: 0.08em;
 }
 
-.title {
-  @include text-title;
-  display: flex;
-  align-items: center;
-  gap: var(--space-2);
-
-  strong {
-    font: inherit;
-    font-weight: var(--font-weight-title);
-  }
-}
-
-.context {
-  color: var(--color-text-muted);
-}
-
+.controls,
 .actions {
   display: flex;
   align-items: center;
+}
+
+.controls {
   gap: var(--space-1);
 }
 
-.actionButton,
-.themeButton {
-  height: var(--topbar-control-size);
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  @include interactive-frame();
+.actions {
+  gap: var(--space-1);
 }
 
 .actionButton {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
   width: var(--topbar-control-size);
+  height: var(--topbar-control-size);
+  aspect-ratio: 1;
+  padding: 0;
+  border: 0;
+  border-radius: 999px;
+  flex-shrink: 0;
+  cursor: pointer;
+  background: transparent;
+  color: var(--color-text-muted);
+  transition:
+    background-color 220ms var(--easing-standard),
+    color 220ms var(--easing-standard),
+    transform 180ms var(--easing-standard);
 }
 
-.themeButton {
-  width: auto;
-  padding-inline: var(--space-2);
-  gap: var(--space-1);
+.actionButton:hover {
+  background: color-mix(in srgb, var(--color-text) 8%, transparent);
   color: var(--color-text);
 }
 
-.actionButton,
-.themeButton {
-  @include interactive-frame-hover();
-}
-
-.themeLabel {
-  @include text-label;
+.actionButton:focus-visible {
+  outline: none;
+  background: color-mix(in srgb, var(--color-accent-strong) 12%, transparent);
+  box-shadow: 0 0 0 0.12rem color-mix(in srgb, var(--color-accent-strong) 28%, transparent);
+  color: var(--color-text);
 }
 
 @include respond-down(mobile) {
@@ -82,4 +78,8 @@
   .actions {
     display: none;
   }
+
+  .controls {
+    gap: 0;
+  }
 }

Frontend/src/components/shell/TopBar/TopBar.tsx

@@ -1,44 +1,58 @@
 // Path: Frontend/src/components/shell/TopBar/TopBar.tsx
 
 import { For, type JSX } from "solid-js";
-import { ChevronDown } from "../../../lib/icons";
 import type { Theme } from "../../../theme/runtime";
 import { topBarActions } from "../data/shell.data";
+import { DepartmentSelector } from "../DepartmentSelector/DepartmentSelector";
+import { NotificationsNav } from "./NotificationsNav";
+import { ThemeToggle } from "./ThemeToggle";
+import { UserNav } from "./UserNav";
 import styles from "./TopBar.module.scss";
 
 type TopBarProps = {
 	theme: Theme;
 	onToggleTheme: VoidFunction;
+	isMobileViewport: boolean;
+	isNotificationsOpen: boolean;
+	isProfileOpen: boolean;
+	onToggleNotifications: VoidFunction;
+	onToggleProfile: VoidFunction;
 };
 
 export const TopBar = (props: TopBarProps): JSX.Element => {
 	return (
-		<header class={styles.topBar}>
-			<div class={styles.identity}>
+		<header class={styles.topBar} data-ui="top-bar">
+			<div class={styles.identity} data-slot="top-bar-identity">
 				<span class={styles.eyebrow}>Moku Work</span>
-				<div class={styles.title}>
-					<strong>Workspace Shell</strong>
-					<span class={styles.context}>Moku / Product</span>
-					<ChevronDown size={16} strokeWidth={2} />
-				</div>
+				<DepartmentSelector />
 			</div>
 
-			<button class={styles.themeButton} type="button" onClick={props.onToggleTheme}>
-				<span class={styles.themeLabel}>{props.theme === "dark" ? "Dark" : "Light"}</span>
-			</button>
+			<div class={styles.controls} data-slot="top-bar-controls">
+				<div class={styles.actions} data-slot="top-bar-actions">
+					<For each={topBarActions}>
+						{(item): JSX.Element => {
+							const Icon = item.icon;
 
-			<div class={styles.actions}>
-				<For each={topBarActions}>
-					{(item): JSX.Element => {
-						const Icon = item.icon;
+							return (
+								<button class={styles.actionButton} type="button" aria-label={item.label} title={item.label} data-slot="top-bar-action" data-action-id={item.id}>
+									<Icon size={18} strokeWidth={2} />
+								</button>
+							);
+						}}
+					</For>
+				</div>
 
-						return (
-							<button class={styles.actionButton} type="button" aria-label={item.label} title={item.label}>
-								<Icon size={18} strokeWidth={2} />
-							</button>
-						);
-					}}
-				</For>
+				<NotificationsNav
+					isMobileViewport={props.isMobileViewport}
+					isMobileWorkspaceOpen={props.isNotificationsOpen}
+					onToggleMobileWorkspace={props.onToggleNotifications}
+				/>
+				<ThemeToggle theme={props.theme} onToggle={props.onToggleTheme} />
+				<UserNav
+					isMobileViewport={props.isMobileViewport}
+					isMobileWorkspaceOpen={props.isProfileOpen}
+					onToggleMobileWorkspace={props.onToggleProfile}
+				/>
 			</div>
 		</header>
 	);