fix(account): soften participant display colors

docs/2-screen.md

@@ -75,7 +75,7 @@
 
 **送信だけは塗る。** `送信` は 塗ったボタンとして残す。画面が前に出す操作を一つに絞るためである。他のボタンはすべてカーソルを待ってから現れる。
 
-**送信の地はアプリのアイコンの青である（#258）。** 地はライトとダークのどちらでも `#1e9be8`——タスクバーのアイコン（`src-tauri/app-icon.svg`、#246）の青——であり、線画は白である。Master「さらに細かいんだけど、pullceptのアイコンの青色に。送信ボタンも合わせることって可能？」（2026-10-03）。それまでは `--accent`（ライト `#185fa5`、ダーク `#7aa7d8`）で塗り、線画は `--bg` だった。色は専用のトークン（`--send-ground` / `--send-ink`）に置き、`--accent` は変えない——参加者ごとの色の明度と彩度は `--accent` から測っている（下記「参加者ごとの色」）。カーソルの下では地を黒へ 15% 寄せ、ライトとダークのどちらでも少し濃くなる。それまでは `--fg` へ寄せており、ダークでは明るくなっていた——地が両方の面で同じ一色になったため、寄せる先も一つに固定した。
+**送信の地はアプリのアイコンの青である（#258）。** 地はライトとダークのどちらでも `#1e9be8`——タスクバーのアイコン（`src-tauri/app-icon.svg`、#246）の青——であり、線画は白である。Master「さらに細かいんだけど、pullceptのアイコンの青色に。送信ボタンも合わせることって可能？」（2026-10-03）。それまでは `--accent`（ライト `#185fa5`、ダーク `#7aa7d8`）で塗り、線画は `--bg` だった。色は専用のトークン（`--send-ground` / `--send-ink`）に置き、`--accent` は変えない——参加者ごとの色は専用の明度・彩度トークンで描く（下記「参加者ごとの色」）。カーソルの下では地を黒へ 15% 寄せ、ライトとダークのどちらでも少し濃くなる。それまでは `--fg` へ寄せており、ダークでは明るくなっていた——地が両方の面で同じ一色になったため、寄せる先も一つに固定した。
 
 **カーソルの塗りは地の上に重ねる影であって、色ではない。** カーソルの塗り `--hover` は半透明の黒（ダークでは白）であり、`:root` とダークの両方に定義する。ボタンが `--bg` の上にあっても `--surface` の上にあっても、同じだけ持ち上がる。旧規則（下記）が枠で守っていた「操作はどの面に載っていても一つの形である」は、この形で保たれる。選択の塗り `--selected` も #235 までは同じ作りだったが、ライトでは Claude デスクトップのサイドバーの選ばれた行の色 `#edece8` になった（下記「ライトの色」）。ライトの二つの地はどちらもほぼ白であり、一つの色でも両方の上で同じに読める。ダークは半透明の白のままである。
 
@@ -394,12 +394,12 @@ Master「コメント書き込み欄の上にある下までスクロールボ
 
 **宛先の候補は増えていない。** オフラインの行は部屋の名簿に居ないため、宛先には出ない。届かない相手を名指せる状態は、宛先を名簿から引くという判断（#43）の理由に反する。
 
-**参加者ごとの色。** 発言の丸印の色（#225 までは縁の色線）と名簿の丸印の色（#253 までは点）は同じであり、参加者ごとに異なる。明度と彩度は `--accent` の実測値に固定し、色相だけを振る。
+**参加者ごとの色。** 発言の丸印の色（#225 までは縁の色線）と名簿の丸印の色（#253 までは点）は同じであり、参加者ごとに異なる。宣言色と名前からの導出色は、テーマごとの共通の明度・彩度（`--speaker-l` / `--speaker-c`）で色相だけを振る。#395 で accent の実測値より少し明るく、彩度を抑えた淡い色へ調整した。アカウントの一覧・チャット・宛先など、同じ話し手色を使う表示へ共通して反映する。宣言の無い本人は引き続き `--accent` で描く。
 
 | | 明度 | 彩度 |
 |---|---|---|
-| ライト（`#185fa5`。#235 までは `#3a6ea5` の 0.528 / 0.104） | 0.481 | 0.131 |
-| ダーク（`#7aa7d8`） | 0.715 | 0.087 |
+| ライト | 0.54 | 0.09 |
+| ダーク | 0.76 | 0.065 |
 
 色相の出所は 3 段の梯子であり、上から順に決まる。
 
@@ -719,7 +719,7 @@ DOM の描画は床として残す。WebGL が使えない環境では読み込
 - **次の一手** — 現在の実装に参加者パネルと宛先を足した、実装可能な範囲。両方とも実装済みである。この 1 枚と実装の差は、操作ボタンのうち未実装のリサイズとミュート（端末と終了は実装済みで、参加者のリストの各行のメニューに載っている）、宛先の見た目（削除可能なチップ）、そして #53 / #57 / #59 / #62 で入ったアカウントまわり（種別ごとのグループ、行の開始・終了・編集、モーダル、ランチャ行の廃止）である。宛先は本文に `@名前` と書き、送ると部屋がそれを宛先へ移して本文から消す形であり（#204 / #206）、チップの形の差は追っていない。アカウントの側はキャンバスが実装より大きく遅れており、差は #46 で追う。
 - **全体像** — ルーム一覧 / ダイレクト / 参加者・セッション状態パネル
 
-色と寸法は `src/styles.css` の実値をそのまま使っている（`--accent: #3a6ea5` / `--surface: #f4f4f7` / 角丸 4・6px / system-ui + Yu Gothic UI）。参加者ごとの色は accent と同じ彩度・明度で色相だけ変えたもの。絵と実装が同じトークンの上に乗るため、キャンバスの値をそのまま実装へ移せる。
+色と寸法は `src/styles.css` の実値をそのまま使っている（`--accent: #3a6ea5` / `--surface: #f4f4f7` / 角丸 4・6px / system-ui + Yu Gothic UI）。当時の参加者ごとの色は accent と同じ彩度・明度で色相だけ変えたもの（現行の淡色化は上記「参加者ごとの色」）。絵と実装が同じトークンの上に乗るため、キャンバスの値をそのまま実装へ移せる。
 
 **この UI は本番向けではない。** 段階的に作り、機能と並行して改善する前提の暫定案である。確定仕様として扱わない。
 
@@ -728,7 +728,7 @@ DOM の描画は床として残す。WebGL が使えない環境では読み込
 - 会話面はメッセージ単位を保つ。端末は診断面側に置き、会話面には置かない。
 - 参加者パネルを持つ（実装済み。上記「参加者パネル」）。セッションの接続方法・起動コマンド・作業ディレクトリ・開始時刻を出す。操作のうち端末と終了は実装済みで、アカウントごとの行に載っている。ミュートは未実装であり、キャンバス側にのみある。
 - 発言に宛先を持たせる（実装済み。本文に参加者の `@名前` を書く。入力欄で `@` を打てば候補から選べる。複数可。書かなければ全体宛。#204 / #206）。
-- 参加者ごとの色（実装済み。accent と同じ明度・彩度で色相のみ）。色相は宣言でき、宣言が導出に優先する（上記「参加者パネル」の梯子）。
+- 参加者ごとの色（実装済み。現行の宣言色・導出色はテーマごとの共通の明度・彩度で色相のみ）。色相は宣言でき、宣言が導出に優先する（上記「参加者パネル」の梯子）。
 - 名前と色は「この部屋での自分は誰か」の宣言である（実装済み。人間もセッションも、アカウントの属性として）。
 - アカウントは起動していなくても存在する（実装済み。「[アカウント](3-accounts.md#アカウント)」）。同一性は id であり、名前は表示と宛先のための属性である。
 - **人間はアカウントである**（実装済み。種別 `admin`。#53 が保留にし、#59 が決めた。#192 で `user` から改名）。画面の本人も他の参加者と同じ行を持ち、名簿と宛先の出所は一本化された。人間の同一性を config のエントリとして持つことは受け入れる——本人であることは `localStorage` に残り、config に入るのは名前と色だけである。

src/main.ts

@@ -63,9 +63,9 @@ const LOCAL_KEY = "pullcept.local-account";
 /**
  * The hues a participant can declare.
  *
- * Hue only. Lightness and chroma stay the accent's in whichever theme is
- * showing, so a declared colour sits at the same weight on the page as every
- * other participant's and stays readable in both themes (#43). Offering a full
+ * Hue only. Lightness and chroma use the theme's shared display tokens, so
+ * declared colours share one weight on the page. The softer pair (#395) is
+ * independent of accent; the hue-only contract stays (#43). Offering a full
  * colour picker would ask for two values and silently discard them.
  *
  * A short list rather than a continuous dial: what this has to buy is that any
@@ -616,8 +616,8 @@ function hueFor(name: string): number {
 /**
  * The colour a participant is drawn in.
  *
- * Lightness and chroma are the accent's, in whichever theme is showing; only
- * the hue turns. One ladder, in this order:
+ * Declared and derived colours use the theme's shared display lightness and
+ * chroma; only hue turns. Undeclared oneself keeps accent. One ladder:
  *
  *   declared > oneself's accent > derived from the name
  *

src/styles.css

@@ -50,8 +50,8 @@
   --composer-line: rgb(0 0 0 / 0.2);
   /* 送信's ground and its drawing (#258): the blue of the app's icon
      (src-tauri/app-icon.svg), in light and dark alike, so it is not
-     redefined below. Not `--accent`, which the participants' colours are
-     measured from (`--speaker-l` / `--speaker-c`). */
+     redefined below. Separate from `--accent` and the participants'
+     colour tokens (`--speaker-l` / `--speaker-c`). */
   --send-ground: #1e9be8;
   --send-ink: #ffffff;
   /* How far a participant's colour is carried into the circle and into one's
@@ -64,15 +64,12 @@
   --avatar-ink-toward: #000000;
   --mine-ground: 9%;
   --mine-edge: 35%;
-  /* One participant is told from another by hue alone: every participant
-     colour is the accent's own lightness and chroma with the hue turned. The
-     pair below is #185fa5 measured in oklch, not a value chosen next to it, so
-     a participant sits at the same weight on the page as the accent does.
-     This pair is what a participant may not choose — declaring a colour
-     declares a hue, and these two hold whatever hue lands on them readable in
-     this theme. */
-  --speaker-l: 0.481;
-  --speaker-c: 0.131;
+  /* Declared and derived participant colours share this theme's lightness
+     and chroma; only hue varies. Slightly lighter and less saturated than
+     the accent's measured pair (#395), for softer display colours.
+     A declaration chooses only hue. An undeclared own colour stays accent. */
+  --speaker-l: 0.54;
+  --speaker-c: 0.09;
   /* The shadow under a control that floats over the room's lines — 最新の発言へ
      (#243) — so it reads as above them and not as one of them. Deeper in dark,
      where a shadow on a dark ground barely shows. */
@@ -152,11 +149,10 @@
     --avatar-ink: 100%;
     --mine-ground: 14%;
     --mine-edge: 14%;
-    /* #7aa7d8 measured the same way. The dark accent is lighter and slightly
-       less saturated, so carrying the light pair over here would leave every
-       participant but oneself too dark to read against #17171a. */
-    --speaker-l: 0.715;
-    --speaker-c: 0.087;
+    /* The softer dark pair (#395) stays lighter than the light theme's
+       colours, for the dark ground. It is independent of the accent. */
+    --speaker-l: 0.76;
+    --speaker-c: 0.065;
     --float-shadow: 0 2px 8px rgb(0 0 0 / 0.5);
   }
 }