Rename replay → initChannelState

Rename the query parameter, function, and all related comments
from 'replay' to 'initChannelState' to better reflect the
semantics: the server initializes channel state for the
reconnecting client rather than replaying past events.

.gitignore

@@ -21,7 +21,6 @@ node_modules/
 *.key
 
 # Build artifacts
-web/dist/
 /neoircd
 /bin/
 *.exe

Dockerfile

@@ -1,13 +1,3 @@
-# Web build stage — compile SPA from source
-# node:22-alpine, 2026-03-09
-FROM node@sha256:8094c002d08262dba12645a3b4a15cd6cd627d30bc782f53229a2ec13ee22a00 AS web-builder
-WORKDIR /web
-COPY web/package.json web/package-lock.json ./
-RUN npm ci
-COPY web/src/ src/
-COPY web/build.sh build.sh
-RUN sh build.sh
-
 # Lint stage — fast feedback on formatting and lint issues
 # golangci/golangci-lint:v2.1.6, 2026-03-02
 FROM golangci/golangci-lint@sha256:568ee1c1c53493575fa9494e280e579ac9ca865787bafe4df3023ae59ecf299b AS lint
@@ -15,9 +5,6 @@ WORKDIR /src
 COPY go.mod go.sum ./
 RUN go mod download
 COPY . .
-# Create placeholder files so //go:embed dist/* in web/embed.go resolves
-# without depending on the web-builder stage (lint should fail fast)
-RUN mkdir -p web/dist && touch web/dist/index.html web/dist/style.css web/dist/app.js
 RUN make fmt-check
 RUN make lint
 
@@ -34,7 +21,6 @@ COPY go.mod go.sum ./
 RUN go mod download
 
 COPY . .
-COPY --from=web-builder /web/dist/ web/dist/
 
 RUN make test
 

README.md

@@ -1374,18 +1374,16 @@ Return server metadata. No authentication required.
 ```json
 {
   "name": "My NeoIRC Server",
-  "version": "0.1.0",
   "motd": "Welcome! Be nice.",
   "users": 42
 }
 ```
 
-| Field     | Type    | Description |
-|-----------|---------|-------------|
-| `name`    | string  | Server display name |
-| `version` | string  | Server version |
-| `motd`    | string  | Message of the day |
-| `users`   | integer | Number of currently active user sessions |
+| Field   | Type    | Description |
+|---------|---------|-------------|
+| `name`  | string  | Server display name |
+| `motd`  | string  | Message of the day |
+| `users` | integer | Number of currently active user sessions |
 
 ### GET /.well-known/healthcheck.json — Health Check
 
@@ -1624,10 +1622,6 @@ authenticity.
   termination.
 - **CORS**: The server allows all origins by default (`Access-Control-Allow-Origin: *`).
   Restrict this in production via reverse proxy configuration if needed.
-- **Content-Security-Policy**: The server sets a strict CSP header on all
-  responses, restricting resource loading to same-origin and disabling
-  dangerous features (object embeds, framing, base tag injection). The
-  embedded SPA works without `'unsafe-inline'` for scripts or styles.
 
 ---
 
@@ -1856,16 +1850,26 @@ docker run -p 8080:8080 \
   neoirc
 ```
 
-The Dockerfile is a four-stage build:
-1. **web-builder**: Installs Node dependencies and compiles the SPA (JSX →
-   bundled JS via esbuild) into `web/dist/`
-2. **lint**: Runs formatting checks and golangci-lint against the Go source
-   (uses empty placeholder files for `web/dist/` so it runs independently of
-   web-builder for fast feedback)
-3. **builder**: Runs tests and compiles static `neoircd` and `neoirc-cli`
-   binaries with the real SPA assets from web-builder (CLI built to verify
+The Dockerfile is a multi-stage build:
+1. **Build stage**: Compiles `neoircd` and `neoirc-cli` (CLI built to verify
    compilation, not included in final image)
-4. **final**: Minimal Alpine image with only the `neoircd` binary
+2. **Final stage**: Alpine Linux + `neoircd` binary only
+
+```dockerfile
+FROM golang:1.24-alpine AS builder
+WORKDIR /src
+RUN apk add --no-cache make
+COPY go.mod go.sum ./
+RUN go mod download
+COPY . .
+RUN go build -o /neoircd ./cmd/neoircd/
+RUN go build -o /neoirc-cli ./cmd/neoirc-cli/
+
+FROM alpine:latest
+COPY --from=builder /neoircd /usr/local/bin/neoircd
+EXPOSE 8080
+CMD ["neoircd"]
+```
 
 ### Binary
 
@@ -2314,14 +2318,10 @@ neoirc/
 │       └── http.go         # HTTP timeouts
 ├── web/
 │   ├── embed.go            # go:embed directive for SPA
-│   ├── build.sh            # SPA build script (esbuild, runs in Docker)
-│   ├── package.json        # Node dependencies (preact, esbuild)
-│   ├── package-lock.json
-│   ├── src/                # SPA source files (JSX + HTML + CSS)
-│   │   ├── app.jsx
-│   │   ├── index.html
-│   │   └── style.css
-│   └── dist/               # Generated at Docker build time (not committed)
+│   └── dist/               # Built SPA (vanilla JS, no build step)
+│       ├── index.html
+│       ├── style.css
+│       └── app.js
 ├── schema/                 # JSON Schema definitions (planned)
 ├── go.mod
 ├── go.sum
@@ -2336,7 +2336,7 @@ neoirc/
 | Purpose    | Library |
 |------------|---------|
 | DI         | `go.uber.org/fx` |
-| Router     | `github.com/go-chi/chi/v5` |
+| Router     | `github.com/go-chi/chi` |
 | Logging    | `log/slog` (stdlib) |
 | Config     | `github.com/spf13/viper` |
 | Env        | `github.com/joho/godotenv/autoload` |

REPO_POLICIES.md

@@ -1,6 +1,6 @@
 ---
 title: Repository Policies
-last_modified: 2026-03-09
+last_modified: 2026-02-22
 ---
 
 This document covers repository structure, tooling, and workflow standards. Code
@@ -98,13 +98,6 @@ style conventions are in separate documents:
   `https://git.eeqj.de/sneak/prompts/raw/branch/main/.gitignore` when setting up
   a new repo.
 
-- **No build artifacts in version control.** Code-derived data (compiled
-  bundles, minified output, generated assets) must never be committed to the
-  repository if it can be avoided. The build process (e.g. Dockerfile, Makefile)
-  should generate these at build time. Notable exception: Go protobuf generated
-  files (`.pb.go`) ARE committed because repos need to work with `go get`, which
-  downloads code but does not execute code generation.
-
 - Never use `git add -A` or `git add .`. Always stage files explicitly by name.
 
 - Never force-push to `main`.
@@ -151,14 +144,8 @@ style conventions are in separate documents:
 - Use SemVer.
 
 - Database migrations live in `internal/db/migrations/` and must be embedded in
-  the binary.
-    - `000_migration.sql` — contains ONLY the creation of the migrations
-      tracking table itself. Nothing else.
-    - `001_schema.sql` — the full application schema.
-    - **Pre-1.0.0:** never add additional migration files (002, 003, etc.).
-      There is no installed base to migrate. Edit `001_schema.sql` directly.
-    - **Post-1.0.0:** add new numbered migration files for each schema change.
-      Never edit existing migrations after release.
+  the binary. Pre-1.0.0: modify existing migrations (no installed base assumed).
+  Post-1.0.0: add new migration files.
 
 - All repos should have an `.editorconfig` enforcing the project's indentation
   settings.

go.mod

@@ -6,7 +6,7 @@ require (
 	github.com/99designs/basicauth-go v0.0.0-20230316000542-bf6f9cbbf0f8
 	github.com/gdamore/tcell/v2 v2.13.8
 	github.com/getsentry/sentry-go v0.42.0
-	github.com/go-chi/chi/v5 v5.2.1
+	github.com/go-chi/chi v1.5.5
 	github.com/go-chi/cors v1.2.2
 	github.com/google/uuid v1.6.0
 	github.com/joho/godotenv v1.5.1

go.sum

@@ -18,8 +18,8 @@ github.com/gdamore/tcell/v2 v2.13.8 h1:Mys/Kl5wfC/GcC5Cx4C2BIQH9dbnhnkPgS9/wF3Rl
 github.com/gdamore/tcell/v2 v2.13.8/go.mod h1:+Wfe208WDdB7INEtCsNrAN6O2m+wsTPk1RAovjaILlo=
 github.com/getsentry/sentry-go v0.42.0 h1:eeFMACuZTbUQf90RE8dE4tXeSe4CZyfvR1MBL7RLEt8=
 github.com/getsentry/sentry-go v0.42.0/go.mod h1:eRXCoh3uvmjQLY6qu63BjUZnaBu5L5WhMV1RwYO8W5s=
-github.com/go-chi/chi/v5 v5.2.1 h1:KOIHODQj58PmL80G2Eak4WdvUzjSJSm0vG72crDCqb8=
-github.com/go-chi/chi/v5 v5.2.1/go.mod h1:L2yAIGWB3H+phAw1NxKwWM+7eUH/lU8pOMm5hHcoops=
+github.com/go-chi/chi v1.5.5 h1:vOB/HbEMt9QqBqErz07QehcOKHaWFtuj87tTDVz2qXE=
+github.com/go-chi/chi v1.5.5/go.mod h1:C9JqLr3tIYjDOZpzn+BCuxY8z8vmca43EeMgyZt7irw=
 github.com/go-chi/cors v1.2.2 h1:Jmey33TE+b+rB7fT8MUy1u0I4L+NARQlK6LhzKPSyQE=
 github.com/go-chi/cors v1.2.2/go.mod h1:sSbTewc+6wYHBBCW7ytsFSn836hqM7JxpglAy2Vzc58=
 github.com/go-errors/errors v1.4.2 h1:J6MZopCL4uSllY1OfXM374weqZFFItUbrImctkmUxIA=

internal/db/auth.go

@@ -64,14 +64,12 @@ func (database *Database) RegisterUser(
 
 	sessionID, _ := res.LastInsertId()
 
-	tokenHash := hashToken(token)
-
 	clientRes, err := transaction.ExecContext(ctx,
 		`INSERT INTO clients
 		 (uuid, session_id, token,
 		  created_at, last_seen)
 		 VALUES (?, ?, ?, ?, ?)`,
-		clientUUID, sessionID, tokenHash, now, now)
+		clientUUID, sessionID, token, now, now)
 	if err != nil {
 		_ = transaction.Rollback()
 
@@ -139,14 +137,12 @@ func (database *Database) LoginUser(
 
 	now := time.Now()
 
-	tokenHash := hashToken(token)
-
 	res, err := database.conn.ExecContext(ctx,
 		`INSERT INTO clients
 		 (uuid, session_id, token,
 		  created_at, last_seen)
 		 VALUES (?, ?, ?, ?, ?)`,
-		clientUUID, sessionID, tokenHash, now, now)
+		clientUUID, sessionID, token, now, now)
 	if err != nil {
 		return 0, 0, "", fmt.Errorf(
 			"create login client: %w", err,

internal/db/errors.go

@@ -1,20 +0,0 @@
-// Package db provides database access and migration management.
-package db
-
-import (
-	"errors"
-
-	"modernc.org/sqlite"
-	sqlite3 "modernc.org/sqlite/lib"
-)
-
-// IsUniqueConstraintError reports whether err is a SQLite
-// unique-constraint violation.
-func IsUniqueConstraintError(err error) bool {
-	var sqliteErr *sqlite.Error
-	if !errors.As(err, &sqliteErr) {
-		return false
-	}
-
-	return sqliteErr.Code() == sqlite3.SQLITE_CONSTRAINT_UNIQUE
-}

internal/db/queries.go

@@ -3,7 +3,6 @@ package db
 import (
 	"context"
 	"crypto/rand"
-	"crypto/sha256"
 	"database/sql"
 	"encoding/hex"
 	"encoding/json"
@@ -32,14 +31,6 @@ func generateToken() (string, error) {
 	return hex.EncodeToString(buf), nil
 }
 
-// hashToken returns the lowercase hex-encoded SHA-256
-// digest of a plaintext token string.
-func hashToken(token string) string {
-	sum := sha256.Sum256([]byte(token))
-
-	return hex.EncodeToString(sum[:])
-}
-
 // IRCMessage is the IRC envelope for all messages.
 type IRCMessage struct {
 	ID      string          `json:"id"`
@@ -114,14 +105,12 @@ func (database *Database) CreateSession(
 
 	sessionID, _ := res.LastInsertId()
 
-	tokenHash := hashToken(token)
-
 	clientRes, err := transaction.ExecContext(ctx,
 		`INSERT INTO clients
 		 (uuid, session_id, token,
 		  created_at, last_seen)
 		 VALUES (?, ?, ?, ?, ?)`,
-		clientUUID, sessionID, tokenHash, now, now)
+		clientUUID, sessionID, token, now, now)
 	if err != nil {
 		_ = transaction.Rollback()
 
@@ -154,8 +143,6 @@ func (database *Database) GetSessionByToken(
 		nick      string
 	)
 
-	tokenHash := hashToken(token)
-
 	err := database.conn.QueryRowContext(
 		ctx,
 		`SELECT s.id, c.id, s.nick
@@ -163,7 +150,7 @@ func (database *Database) GetSessionByToken(
 		 INNER JOIN sessions s
 		   ON s.id = c.session_id
 		 WHERE c.token = ?`,
-		tokenHash,
+		token,
 	).Scan(&sessionID, &clientID, &nick)
 	if err != nil {
 		return 0, 0, "", fmt.Errorf(

internal/handlers/api.go

@@ -10,9 +10,8 @@ import (
 	"strings"
 	"time"
 
-	"git.eeqj.de/sneak/neoirc/internal/db"
 	"git.eeqj.de/sneak/neoirc/internal/irc"
-	"github.com/go-chi/chi/v5"
+	"github.com/go-chi/chi"
 )
 
 var validNickRe = regexp.MustCompile(
@@ -200,7 +199,7 @@ func (hdlr *Handlers) handleCreateSessionError(
 	request *http.Request,
 	err error,
 ) {
-	if db.IsUniqueConstraintError(err) {
+	if strings.Contains(err.Error(), "UNIQUE") {
 		hdlr.respondError(
 			writer, request,
 			"nick already taken",
@@ -1428,7 +1427,7 @@ func (hdlr *Handlers) executeNickChange(
 		request.Context(), sessionID, newNick,
 	)
 	if err != nil {
-		if db.IsUniqueConstraintError(err) {
+		if strings.Contains(err.Error(), "UNIQUE") {
 			hdlr.respondIRCError(
 				writer, request, clientID, sessionID,
 				irc.ErrNicknameInUse, nick, []string{newNick},
@@ -2393,10 +2392,9 @@ func (hdlr *Handlers) HandleServerInfo() http.HandlerFunc {
 		}
 
 		hdlr.respondJSON(writer, request, map[string]any{
-			"name":    hdlr.params.Config.ServerName,
-			"version": hdlr.params.Globals.Version,
-			"motd":    hdlr.params.Config.MOTD,
-			"users":   users,
+			"name":  hdlr.params.Config.ServerName,
+			"motd":  hdlr.params.Config.MOTD,
+			"users": users,
 		}, http.StatusOK)
 	}
 }

internal/handlers/auth.go

@@ -4,8 +4,6 @@ import (
 	"encoding/json"
 	"net/http"
 	"strings"
-
-	"git.eeqj.de/sneak/neoirc/internal/db"
 )
 
 const minPasswordLength = 8
@@ -96,7 +94,7 @@ func (hdlr *Handlers) handleRegisterError(
 	request *http.Request,
 	err error,
 ) {
-	if db.IsUniqueConstraintError(err) {
+	if strings.Contains(err.Error(), "UNIQUE") {
 		hdlr.respondError(
 			writer, request,
 			"nick already taken",

internal/middleware/middleware.go

@@ -11,7 +11,7 @@ import (
 	"git.eeqj.de/sneak/neoirc/internal/globals"
 	"git.eeqj.de/sneak/neoirc/internal/logger"
 	basicauth "github.com/99designs/basicauth-go"
-	chimw "github.com/go-chi/chi/v5/middleware"
+	chimw "github.com/go-chi/chi/middleware"
 	"github.com/go-chi/cors"
 	metrics "github.com/slok/go-http-metrics/metrics/prometheus"
 	ghmm "github.com/slok/go-http-metrics/middleware"
@@ -142,6 +142,20 @@ func (mware *Middleware) CORS() func(http.Handler) http.Handler {
 	})
 }
 
+// Auth returns middleware that performs authentication.
+func (mware *Middleware) Auth() func(http.Handler) http.Handler {
+	return func(next http.Handler) http.Handler {
+		return http.HandlerFunc(
+			func(
+				writer http.ResponseWriter,
+				request *http.Request,
+			) {
+				mware.log.Info("AUTH: before request")
+				next.ServeHTTP(writer, request)
+			})
+	}
+}
+
 // Metrics returns middleware that records HTTP metrics.
 func (mware *Middleware) Metrics() func(http.Handler) http.Handler {
 	metricsMiddleware := ghmm.New(ghmm.Config{ //nolint:exhaustruct // optional fields
@@ -166,36 +180,3 @@ func (mware *Middleware) MetricsAuth() func(http.Handler) http.Handler {
 		},
 	)
 }
-
-// cspPolicy is the Content-Security-Policy header value applied to all
-// responses.  The embedded SPA loads scripts and styles from same-origin
-// files only (no inline scripts or inline style attributes), so a strict
-// policy works without 'unsafe-inline'.
-const cspPolicy = "default-src 'self'; " +
-	"script-src 'self'; " +
-	"style-src 'self'; " +
-	"connect-src 'self'; " +
-	"img-src 'self'; " +
-	"font-src 'self'; " +
-	"object-src 'none'; " +
-	"frame-ancestors 'none'; " +
-	"base-uri 'self'; " +
-	"form-action 'self'"
-
-// CSP returns middleware that sets the Content-Security-Policy header on
-// every response for defense-in-depth against XSS.
-func (mware *Middleware) CSP() func(http.Handler) http.Handler {
-	return func(next http.Handler) http.Handler {
-		return http.HandlerFunc(
-			func(
-				writer http.ResponseWriter,
-				request *http.Request,
-			) {
-				writer.Header().Set(
-					"Content-Security-Policy",
-					cspPolicy,
-				)
-				next.ServeHTTP(writer, request)
-			})
-	}
-}

internal/server/routes.go

@@ -8,8 +8,8 @@ import (
 	"git.eeqj.de/sneak/neoirc/web"
 
 	sentryhttp "github.com/getsentry/sentry-go/http"
-	"github.com/go-chi/chi/v5"
-	"github.com/go-chi/chi/v5/middleware"
+	"github.com/go-chi/chi"
+	"github.com/go-chi/chi/middleware"
 	"github.com/prometheus/client_golang/prometheus/promhttp"
 	"github.com/spf13/viper"
 )
@@ -29,7 +29,6 @@ func (srv *Server) SetupRoutes() {
 	}
 
 	srv.router.Use(srv.mw.CORS())
-	srv.router.Use(srv.mw.CSP())
 	srv.router.Use(middleware.Timeout(routeTimeout))
 
 	if srv.sentryEnabled {

internal/server/server.go

@@ -20,7 +20,7 @@ import (
 	"go.uber.org/fx"
 
 	"github.com/getsentry/sentry-go"
-	"github.com/go-chi/chi/v5"
+	"github.com/go-chi/chi"
 
 	_ "github.com/joho/godotenv/autoload" // loads .env file
 )

web/dist/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>NeoIRC</title>
+  <link rel="stylesheet" href="/style.css">
+</head>
+<body>
+  <div id="root"></div>
+  <script type="module" src="/app.js"></script>
+</body>
+</html>

web/dist/style.css

@@ -0,0 +1,466 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+:root {
+  --bg: #0a0e14;
+  --bg-panel: #0d1117;
+  --bg-input: #0d1117;
+  --bg-tab: #161b22;
+  --bg-tab-active: #0d1117;
+  --bg-topic: #0d1117;
+  --text: #c9d1d9;
+  --text-dim: #6e7681;
+  --text-bright: #e6edf3;
+  --accent: #58a6ff;
+  --accent-dim: #1f6feb;
+  --border: #21262d;
+  --system: #7d8590;
+  --action: #d2a8ff;
+  --warn: #d29922;
+  --error: #f85149;
+  --unread: #f0883e;
+  --nick-brackets: #6e7681;
+  --timestamp: #484f58;
+  --input-bg: #161b22;
+  --prompt: #3fb950;
+  --tab-indicator: #58a6ff;
+  --user-list-bg: #0d1117;
+  --user-list-header: #484f58;
+}
+
+html,
+body,
+#root {
+  height: 100%;
+  font-family: "JetBrains Mono", "Cascadia Code", "Fira Code", "SF Mono",
+    "Consolas", "Liberation Mono", "Courier New", monospace;
+  font-size: 13px;
+  background: var(--bg);
+  color: var(--text);
+  overflow: hidden;
+}
+
+/* ============================================
+   Login Screen
+   ============================================ */
+
+.login-screen {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  background: var(--bg);
+}
+
+.login-box {
+  text-align: center;
+  max-width: 360px;
+  width: 100%;
+  padding: 32px;
+}
+
+.login-box h1 {
+  color: var(--accent);
+  font-size: 1.8em;
+  margin-bottom: 16px;
+  font-weight: 400;
+}
+
+.login-box .motd {
+  color: var(--accent);
+  font-size: 11px;
+  margin-bottom: 20px;
+  text-align: left;
+  white-space: pre;
+  font-family: inherit;
+  line-height: 1.2;
+  overflow-x: auto;
+}
+
+.login-box form {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  align-items: stretch;
+}
+
+.login-box label {
+  color: var(--text-dim);
+  text-align: left;
+  font-size: 12px;
+}
+
+.login-box input {
+  padding: 8px 12px;
+  font-family: inherit;
+  font-size: 14px;
+  background: var(--input-bg);
+  border: 1px solid var(--border);
+  color: var(--text-bright);
+  border-radius: 3px;
+  outline: none;
+}
+
+.login-box input:focus {
+  border-color: var(--accent-dim);
+}
+
+.login-box button {
+  padding: 8px 16px;
+  font-family: inherit;
+  font-size: 14px;
+  background: var(--accent-dim);
+  border: none;
+  color: var(--text-bright);
+  border-radius: 3px;
+  cursor: pointer;
+  margin-top: 4px;
+}
+
+.login-box button:hover {
+  background: var(--accent);
+}
+
+.login-box .error {
+  color: var(--error);
+  font-size: 12px;
+  margin-top: 8px;
+}
+
+/* ============================================
+   IRC App Layout
+   ============================================ */
+
+.irc-app {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  overflow: hidden;
+}
+
+/* ============================================
+   Tab Bar
+   ============================================ */
+
+.tab-bar {
+  display: flex;
+  background: var(--bg-tab);
+  border-bottom: 1px solid var(--border);
+  flex-shrink: 0;
+  height: 32px;
+  align-items: stretch;
+}
+
+.tabs {
+  display: flex;
+  overflow-x: auto;
+  flex: 1;
+  scrollbar-width: none;
+}
+
+.tabs::-webkit-scrollbar {
+  display: none;
+}
+
+.tab {
+  display: flex;
+  align-items: center;
+  padding: 0 12px;
+  cursor: pointer;
+  color: var(--text-dim);
+  white-space: nowrap;
+  user-select: none;
+  border-right: 1px solid var(--border);
+  font-size: 12px;
+  gap: 4px;
+  position: relative;
+}
+
+.tab:hover {
+  color: var(--text);
+  background: rgba(255, 255, 255, 0.03);
+}
+
+.tab.active {
+  color: var(--text-bright);
+  background: var(--bg-tab-active);
+  border-bottom: 2px solid var(--tab-indicator);
+  margin-bottom: -1px;
+}
+
+.tab.has-unread .tab-label {
+  color: var(--unread);
+  font-weight: bold;
+}
+
+.tab .unread-count {
+  color: var(--unread);
+  font-size: 11px;
+  font-weight: bold;
+}
+
+.tab-close {
+  color: var(--text-dim);
+  font-size: 14px;
+  line-height: 1;
+  margin-left: 2px;
+}
+
+.tab-close:hover {
+  color: var(--error);
+}
+
+.status-area {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  padding: 0 12px;
+  flex-shrink: 0;
+  font-size: 12px;
+}
+
+.status-nick {
+  color: var(--accent);
+  font-weight: bold;
+}
+
+.status-warn {
+  color: var(--warn);
+  animation: blink 1.5s ease-in-out infinite;
+}
+
+@keyframes blink {
+  0%,
+  100% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.4;
+  }
+}
+
+/* ============================================
+   Topic Bar
+   ============================================ */
+
+.topic-bar {
+  padding: 4px 12px;
+  background: var(--bg-topic);
+  border-bottom: 1px solid var(--border);
+  font-size: 12px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  flex-shrink: 0;
+  line-height: 1.5;
+}
+
+.topic-label {
+  color: var(--text-dim);
+}
+
+.topic-text {
+  color: var(--text);
+}
+
+/* ============================================
+   Main Content Area
+   ============================================ */
+
+.main-area {
+  display: flex;
+  flex: 1;
+  overflow: hidden;
+  min-height: 0;
+}
+
+/* ============================================
+   Messages Panel
+   ============================================ */
+
+.messages-panel {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  min-width: 0;
+}
+
+.messages-scroll {
+  flex: 1;
+  overflow-y: auto;
+  padding: 4px 8px;
+  scrollbar-width: thin;
+  scrollbar-color: var(--border) transparent;
+}
+
+.messages-scroll::-webkit-scrollbar {
+  width: 8px;
+}
+
+.messages-scroll::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.messages-scroll::-webkit-scrollbar-thumb {
+  background: var(--border);
+  border-radius: 4px;
+}
+
+/* ============================================
+   Message Lines
+   ============================================ */
+
+.message {
+  padding: 1px 0;
+  line-height: 1.4;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  font-size: 13px;
+}
+
+.message .timestamp {
+  color: var(--timestamp);
+  font-size: 12px;
+}
+
+.message .nick {
+  font-weight: bold;
+}
+
+.message .content {
+  color: var(--text);
+}
+
+/* System messages (joins, parts, quits, etc.) */
+.system-message {
+  color: var(--system);
+}
+
+.system-message .system-text {
+  color: var(--system);
+}
+
+/* /me action messages */
+.action-message .action-text {
+  color: var(--action);
+}
+
+/* ============================================
+   User List (Right Panel)
+   ============================================ */
+
+.user-list {
+  width: 160px;
+  background: var(--user-list-bg);
+  border-left: 1px solid var(--border);
+  display: flex;
+  flex-direction: column;
+  flex-shrink: 0;
+  overflow: hidden;
+}
+
+.user-list-header {
+  padding: 6px 10px;
+  color: var(--user-list-header);
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  border-bottom: 1px solid var(--border);
+  flex-shrink: 0;
+}
+
+.user-list-entries {
+  overflow-y: auto;
+  padding: 4px 0;
+  flex: 1;
+  scrollbar-width: thin;
+  scrollbar-color: var(--border) transparent;
+}
+
+.nick-entry {
+  padding: 2px 10px;
+  font-size: 12px;
+  cursor: pointer;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  line-height: 1.5;
+}
+
+.nick-entry:hover {
+  background: rgba(255, 255, 255, 0.04);
+}
+
+.nick-prefix {
+  color: var(--text-dim);
+  display: inline-block;
+  width: 1ch;
+  text-align: right;
+  margin-right: 1px;
+}
+
+.nick-name {
+  font-weight: normal;
+}
+
+/* ============================================
+   Input Line (Bottom)
+   ============================================ */
+
+.input-line {
+  display: flex;
+  align-items: center;
+  background: var(--input-bg);
+  border-top: 1px solid var(--border);
+  flex-shrink: 0;
+  height: 36px;
+  padding: 0 8px;
+  gap: 6px;
+}
+
+.input-prompt {
+  color: var(--prompt);
+  font-size: 13px;
+  flex-shrink: 0;
+  white-space: nowrap;
+}
+
+.input-line input {
+  flex: 1;
+  padding: 4px 0;
+  font-family: inherit;
+  font-size: 13px;
+  background: transparent;
+  border: none;
+  color: var(--text-bright);
+  outline: none;
+  caret-color: var(--accent);
+}
+
+.input-line input::placeholder {
+  color: var(--text-dim);
+  font-style: italic;
+}
+
+/* ============================================
+   Responsive
+   ============================================ */
+
+@media (max-width: 600px) {
+  .user-list {
+    display: none;
+  }
+
+  .tab {
+    padding: 0 8px;
+    font-size: 11px;
+  }
+
+  .input-prompt {
+    font-size: 12px;
+  }
+}