/* AI秘書 — 営業会議室（卓のビュー）
 *
 * ねらい: 事務的な進捗画面ではなく「卓に着く」高揚感。ただし毎日見る業務画面なので、
 * 派手さではなく質感（木・フェルト・照明）で楽しさを出す。
 *
 * 構成の約束:
 * - 色は style.css のトークンと、ロゴ由来の4ブランド色の color-mix だけで組む（新しい色相を足さない）
 * - 画像は使わない。木目・フェルト・椅子はすべてグラデーションと擬似要素で描く
 * - 動きは「脈動」と「フェード」だけ。回転・跳躍・点滅はしない
 * - ライト／ダークは --room-ink（陰）と --room-lume（照り）の2変数を差し替えて吸収する。
 *   影に text をそのまま使うとダークで白い影になるため、この2変数が要る。
 */

/* ★[hidden] より詳細度の高い display 指定を後から足しても効くように、先に打ち消しておく。
   これが無いと会議室が一覧の上に出っぱなしになる（.modal と同じ事故）。 */
#meeting-room[hidden], #meeting-lobby[hidden] { display: none; }

/* ---------- 会議室のヘッダ ---------- */

.room-head {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  margin-bottom: 14px;
}
.room-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }

/* 議題は「ボードに貼った紙」の気分で、ブランド色の短冊を左に立てる。
   短冊は図形なのでパステルのままでよい（文字には使わない）。 */
.room-topic {
  position: relative;
  font-size: 17px; font-weight: 700; line-height: 1.5;
  margin: 0 0 4px; padding-left: 13px; word-break: break-word;
}
.room-topic::before {
  content: ''; position: absolute; left: 0; top: .2em; bottom: .2em; width: 4px;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--brand-mint), var(--brand-yellow));
}
.room-when { font-size: 11.5px; color: var(--text-dim); line-height: 1.8; margin-bottom: 4px; }

/* 中継中の札。ON AIR の空気を出すため小さなピルにする。
   文字は warn を text 側へ 18% 寄せてコントラスト 4.78（warn 素のままだと 3.82 しかない）。 */
.live-dot {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700;
  color: color-mix(in srgb, var(--warn) 82%, var(--text));
  background: var(--warn-weak);
  border: 1px solid color-mix(in srgb, var(--warn) 38%, transparent);
  padding: 2px 9px; border-radius: 999px;
}
.live-dot::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%;
  background: var(--warn); animation: room-breathe 2.4s ease-in-out infinite;
}

/* ---------- ラウンド帯（第1R → 第2R → 第3R → まとめ） ---------- */

.rounds { display: flex; gap: 10px; margin: 16px 0 14px; }
.round {
  position: relative;
  flex: 1 1 0; min-width: 0; text-align: center;
  padding: 7px 4px 6px; border-radius: 11px;
  border: 1px solid var(--border); background: var(--surface);
}
/* 帯同士を小さな矢羽で繋いで「進行の道」に見せる。gap 10px の間に置く */
.round + .round::before {
  content: ''; position: absolute; left: -8.5px; top: 50%;
  width: 6px; height: 6px;
  border-top: 1.5px solid var(--text-dim); border-right: 1.5px solid var(--text-dim);
  transform: translateY(-50%) rotate(45deg);   /* 静的な向きだけ。回転アニメはしない */
  opacity: .45;
}
/* 待ちのラウンドは一段引いた明度に。済／現在との明度差で進行が読める */
.round .r-label { display: block; font-size: 12px; font-weight: 700; line-height: 1.3;
                  color: var(--text-dim); }
.round .r-sub   { display: block; font-size: 10px; color: var(--text-dim); line-height: 1.4;
                  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 済んだラウンド。チェックを付けて「消化した」ことを文字でも示す（色だけに頼らない） */
.round.is-done, .round.is-pending.is-done {
  background: var(--ok-weak);
  border-color: color-mix(in srgb, var(--ok) 35%, transparent);
}
.round.is-done .r-label { color: color-mix(in srgb, var(--ok) 78%, var(--text)); }  /* 4.53 */
.round.is-done .r-label::before { content: '✓'; margin-right: 3px; }

/* いま走っているラウンド。live-dot と同じ息づかいの点を灯し、少しだけ浮かせる */
.round.is-now {
  background: var(--warn-weak);
  border-color: color-mix(in srgb, var(--warn) 45%, transparent);
  box-shadow: 0 2px 10px -2px color-mix(in srgb, var(--warn) 35%, transparent);
}
.round.is-now .r-label { color: color-mix(in srgb, var(--warn) 82%, var(--text)); }  /* 4.78 */
.round.is-now .r-label::before {
  content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 5px;
  border-radius: 50%; background: var(--warn); vertical-align: 1px;
  animation: room-breathe 2.4s ease-in-out infinite;
}
.round.is-now .r-sub { color: color-mix(in srgb, var(--warn) 60%, var(--text)); }

/* ---------- 部屋の床（外周＝観察席、中央＝卓） ---------- */

/* 陰と照り。ライトでは text（濃緑）が陰・白が照りだが、ダークでは text が白のため
   そのまま影に使うと発光してしまう。ここだけ差し替えて以降は共通式で書く。 */
.room-floor { --room-ink: var(--text); --room-lume: var(--surface); }
@media (prefers-color-scheme: dark) {
  .room-floor { --room-ink: var(--bg); --room-lume: var(--text); }
}

.room-floor {
  display: grid; gap: 12px;
  grid-template-columns: 1fr 1fr;
  padding: 14px 12px 12px;
  border: 1px dashed color-mix(in srgb, var(--brand-slate) 45%, var(--border));
  border-radius: 26px;
  /* 床の上、卓のあたりだけ照明が落ちている。部屋の中心に視線を集める */
  background:
    radial-gradient(72% 82% at 50% 46%,
      color-mix(in srgb, var(--brand-mint) 12%, transparent), transparent 72%),
    color-mix(in srgb, var(--brand-slate) 8%, var(--bg));
}
.obs-left   { grid-column: 1; grid-row: 1; }
.obs-right  { grid-column: 2; grid-row: 1; }
.room-table { grid-column: 1 / -1; grid-row: 2; }

/* 卓が広く取れる幅では、観察者を卓の左右へ回して「外から見ている」形にする */
@media (min-width: 760px) {
  .room-floor { grid-template-columns: 154px minmax(0, 1fr) 154px; align-items: center;
                gap: 16px; padding: 16px 14px; }
  .obs-left   { grid-column: 1; grid-row: 1; }
  .room-table { grid-column: 2; grid-row: 1; }
  .obs-right  { grid-column: 3; grid-row: 1; }
}

/* ---------- 卓（木枠＋フェルト） ---------- */

/* 木の色は黄＋ピンク（暖色系）の混合だけで作る。ライトは明るいメープル、
   ダークは同じ2色でも土台が沈むぶん配合を変えてウォルナット寄りに振る。 */
.room-table {
  --wood-hi:   color-mix(in srgb, var(--brand-yellow) 46%, var(--surface-2));
  --wood-mid:  color-mix(in srgb, var(--brand-pink)   42%, var(--surface-2));
  --wood-lo:   color-mix(in srgb, var(--brand-yellow) 30%, var(--surface-2));
  --wood-band: color-mix(in srgb, var(--brand-pink)   16%, transparent);
}
@media (prefers-color-scheme: dark) {
  .room-table {
    --wood-hi:   color-mix(in srgb, var(--brand-pink)   34%, var(--surface-2));
    --wood-mid:  color-mix(in srgb, var(--brand-yellow) 26%, var(--surface-2));
    --wood-lo:   color-mix(in srgb, var(--brand-pink)   22%, var(--surface-2));
    --wood-band: color-mix(in srgb, var(--brand-yellow) 10%, transparent);
  }
}

.room-table {
  padding: 12px; border-radius: 28px;
  border: 1px solid color-mix(in srgb, var(--brand-pink) 30%, var(--border));
  /* 上から: ラッカーの照り / 細い木目 / 太い年輪の帯 / 地の板。
     細目 7px 周期・帯 34px 周期と割り切れない周期を重ね、機械的な縞に見せない */
  background:
    radial-gradient(130% 90% at 50% -12%,
      color-mix(in srgb, var(--room-lume) 28%, transparent), transparent 55%),
    repeating-linear-gradient(97deg,
      color-mix(in srgb, var(--text) 6%, transparent) 0 1px, transparent 1px 7px),
    repeating-linear-gradient(93deg,
      transparent 0 13px, var(--wood-band) 13px 19px, transparent 19px 34px),
    linear-gradient(152deg, var(--wood-hi) 0%, var(--wood-mid) 52%, var(--wood-lo) 100%);
  /* 面取り: 上辺に照り・下辺に陰。外は slate の環境影で床から浮かせる */
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--room-lume) 60%, transparent),
    inset 0 -2px 4px color-mix(in srgb, var(--room-ink) 16%, transparent),
    var(--shadow),
    0 16px 36px -18px color-mix(in srgb, var(--brand-slate) 55%, transparent);
}

.room-felt {
  --felt-hi: color-mix(in srgb, var(--brand-mint)  46%, var(--surface));
  --felt-lo: color-mix(in srgb, var(--brand-slate) 32%, var(--surface-2));
}
@media (prefers-color-scheme: dark) {
  .room-felt {
    --felt-hi: color-mix(in srgb, var(--brand-mint)  38%, var(--surface));
    --felt-lo: color-mix(in srgb, var(--brand-slate) 22%, var(--surface-2));
  }
}

.room-felt {
  border-radius: 20px; padding: 13px 11px;
  display: grid; grid-template-columns: 1fr; gap: 10px;
  /* 綾織りの十字クロス（45°/-45°）＋ 上方のランプ光。中央上が明るく縁へ沈む */
  background:
    repeating-linear-gradient(45deg,
      color-mix(in srgb, var(--text) 3%, transparent) 0 1px, transparent 1px 4px),
    repeating-linear-gradient(-45deg,
      color-mix(in srgb, var(--text) 3%, transparent) 0 1px, transparent 1px 4px),
    radial-gradient(120% 95% at 50% 12%,
      var(--felt-hi) 0%,
      color-mix(in srgb, var(--felt-hi) 55%, var(--felt-lo)) 55%,
      var(--felt-lo) 100%);
  /* 縁: 締めの黒線 → 木の面取りの照り → 内側の落ち込み。布が枠に沈んで見える */
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--room-ink) 24%, transparent),
    0 1px 0 1px color-mix(in srgb, var(--room-lume) 40%, transparent),
    inset 0 3px 14px color-mix(in srgb, var(--room-ink) 22%, transparent);
  /* カードテーブルのステッチライン。outline なら子要素に触れず1本引ける */
  outline: 1px dashed color-mix(in srgb, var(--room-lume) 50%, transparent);
  outline-offset: -8px;
}
/* 375px でも「2人・卓上・2人」で囲めるところまでは2列を保つ。
   これより狭い端末（320px 等）だけ縦積みに落とす。 */
@media (min-width: 360px) {
  .room-felt { grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px 9px; }
}
@media (min-width: 460px) {
  .room-felt { gap: 10px; padding: 13px 11px; }
}
.room-felt > .table-center { grid-column: 1 / -1; }

/* ---------- 席（駒） ---------- */

.seat {
  min-width: 0; text-align: center; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 10px 8px 9px; border-radius: 15px;
  border: 1px solid var(--border);
  /* 発言者を 100% 不透明で立てるため、通常席は 84% に留めて明度差の余地を作る */
  background: color-mix(in srgb, var(--surface) 84%, transparent);
  box-shadow: 0 2px 5px -2px color-mix(in srgb, var(--room-ink) 30%, transparent);
  transition: transform .25s ease, border-color .3s ease, box-shadow .3s ease;
}
.seat:active { transform: scale(.985); }
.seat:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (hover: hover) {
  .seat:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }
}

.seat-piece { position: relative; line-height: 0; }
.seat-face {
  width: 46px; height: 46px; border-radius: 50%; display: block;
  border: 2px solid var(--surface);
  box-shadow: 0 1px 3px color-mix(in srgb, var(--room-ink) 30%, transparent);
  background: var(--surface);
}
/* 観察者は顔を持たない。記号を丸の中に置く */
.seat-face-mark {
  display: flex; align-items: center; justify-content: center;
  border-style: dashed; border-color: var(--brand-slate);
  color: color-mix(in srgb, var(--brand-slate) 72%, var(--text));   /* 図形なので 3:1 を確保（実測 4.09） */
  box-shadow: none;
}
.seat-face-mark svg { width: 22px; height: 22px; display: block; }

.seat-name { font-size: 13px; font-weight: 700; line-height: 1.35; }
.seat-role { font-size: 10.5px; color: var(--text-dim); line-height: 1.45; word-break: break-word; }
/* 偏向の一言。10.5px と小さいので、accent を text 側へ寄せて可読域に入れる（実測 7.16） */
.seat-bias {
  font-size: 10.5px; line-height: 1.45; word-break: break-word;
  color: color-mix(in srgb, var(--accent) 50%, var(--text));
}
.seat-foot { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; margin-top: 3px; }
.seat-count { font-size: 10px; color: var(--text-dim); }

/* まだ座っていない（queued）。輪郭だけの席にして「椅子は用意してある」を見せる */
.seat.is-empty {
  background: color-mix(in srgb, var(--surface) 72%, transparent);
  border-style: dashed; box-shadow: none;
}
.seat.is-empty .seat-face { filter: grayscale(1); opacity: .38; }
.seat.is-empty .seat-name,
.seat.is-empty .seat-role,
.seat.is-empty .seat-bias { opacity: .68; }   /* .6 だと名前が 4.0 を割る。.68 で 4.95 */
.seat-wait { font-size: 10px; color: var(--text-dim); }

/* 観察席。参加者と同格に見せない: 布(felt)ではなく床に立ち、地は半透明・枠は点線・
   顔も一回り小さい。ただし札と記号はきちんと描き、添え物には見せない */
.seat-observer {
  background: color-mix(in srgb, var(--surface) 52%, transparent);
  border-style: dashed;
  border-color: color-mix(in srgb, var(--brand-slate) 60%, var(--border));
  box-shadow: none;
  padding: 8px 8px 9px; gap: 2px;
}
.seat-observer .seat-face { width: 40px; height: 40px; }
.seat-observer .seat-name { font-size: 12.5px; }
/* 「観察席」の札。来客バッジのようなピルにする。文字は slate を text 側へ寄せて実測 7.26 */
.obs-tag {
  font-size: 9.5px; font-weight: 700; letter-spacing: .12em; text-transform: none;
  color: color-mix(in srgb, var(--brand-slate) 34%, var(--text));
  background: color-mix(in srgb, var(--brand-slate) 14%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--brand-slate) 45%, transparent);
  padding: 1px 8px; border-radius: 999px; margin-bottom: 1px;
}

/* 発言中の席 = 主役。観察席の点線・薄地も上書きするため、観察席より後に置く。
   仕掛けは3つ: ①2px 浮かせて accent の影を落とす ②顔の後ろに暖色のスポットライト
   ③通常席が 84% なので、100% の白がそれだけで一段明るく立つ */
.seat.is-speaking {
  border-style: solid;
  border-color: color-mix(in srgb, var(--accent) 75%, var(--surface));
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--surface) 70%, var(--accent-weak)) 0%,
    var(--accent-weak) 100%);
  transform: translateY(-2px);
  /* 静的な影は reduced-motion（脈動なし）のときの姿。動くときは keyframes 側が上書きする */
  box-shadow:
    0 8px 20px -6px color-mix(in srgb, var(--accent) 50%, transparent),
    0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
  animation: seat-pulse 2.6s ease-in-out infinite;
}
.seat.is-speaking .seat-face { border-color: var(--accent); position: relative; }
/* 顔の後ろの光だまり。ランプの暖色（yellow）で「照らされている」ことにする */
.seat.is-speaking .seat-piece::before {
  content: ''; position: absolute; inset: -9px -12px; border-radius: 50%;
  background: radial-gradient(closest-side,
    color-mix(in srgb, var(--brand-yellow) 60%, transparent), transparent);
}
.seat-live {
  font-size: 10px; font-weight: 700; padding: 1px 7px; border-radius: 999px;
  background: var(--accent); color: var(--surface);
  box-shadow: 0 1px 3px color-mix(in srgb, var(--accent) 45%, transparent);
}
/* 誰かが話している間、他の席をわずかに布へ沈める（対応ブラウザのみの追い足し）。
   84%→72% の差に留め、文字コントラストは bias 6.87 / role 4.83 を下回らせない */
.room-felt:has(.seat.is-speaking) .seat:not(.is-speaking) {
  background: color-mix(in srgb, var(--surface) 72%, transparent);
  box-shadow: none;
}

/* ---------- 立場バッジ ---------- */

/* 色だけに頼らず、豆マークの形でも立場を判別できるようにする（色弱対応と静かさの両立）:
   賛成=●塗り / 条件付き賛成=◐半塗り / 反対=■角 / 保留=○輪郭 / 指摘のみ=－線。
   文字色はそれぞれ text 側へ寄せ、4.5 以上に載せる（素の ok/warn/danger は 3.4〜3.8 しかない） */
.stance {
  display: inline-block; font-size: 10px; font-weight: 700;
  padding: 2px 8px; border-radius: 999px; white-space: nowrap;
  border: 1px solid transparent;
}
.stance::before {
  content: ''; display: inline-block; width: 6px; height: 6px; margin-right: 4px;
  border-radius: 50%; background: currentColor; vertical-align: 0;
}
.stance-ok     { background: var(--ok-weak);
                 color: color-mix(in srgb, var(--ok) 78%, var(--text));        /* 4.53 */
                 border-color: color-mix(in srgb, var(--ok) 38%, transparent); }
.stance-warn   { background: var(--warn-weak);
                 color: color-mix(in srgb, var(--warn) 82%, var(--text));      /* 4.78 */
                 border-color: color-mix(in srgb, var(--warn) 38%, transparent); }
.stance-warn::before {
  width: 5px; height: 5px; border: 1px solid currentColor;
  background: linear-gradient(90deg, currentColor 50%, transparent 50%);
}
.stance-danger { background: var(--danger-weak);
                 color: color-mix(in srgb, var(--danger) 82%, var(--text));    /* 4.70 */
                 border-color: color-mix(in srgb, var(--danger) 38%, transparent); }
.stance-danger::before { border-radius: 1.5px; }
.stance-hold   { background: var(--surface-2); color: var(--text-dim); border-color: var(--border); }
.stance-hold::before { width: 5px; height: 5px; background: transparent; border: 1.5px solid currentColor; }
.stance-note   { background: color-mix(in srgb, var(--brand-slate) 18%, var(--surface));
                 color: color-mix(in srgb, var(--brand-slate) 55%, var(--text));   /* 4.7 前後 */
                 border-color: color-mix(in srgb, var(--brand-slate) 50%, transparent); }
.stance-note::before { width: 7px; height: 2px; border-radius: 1px; vertical-align: 2px; }

/* ---------- 卓上（現在のラウンドと、埋まっていく椅子） ---------- */

/* フェルトに置いた議事次第の紙。うっすら影を落として布から浮かせる */
.table-center {
  text-align: center; border-radius: 14px; padding: 11px 12px 9px;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--surface) 92%, transparent),
    color-mix(in srgb, var(--surface) 78%, transparent));
  border: 1px solid color-mix(in srgb, var(--surface) 55%, var(--border));
  box-shadow:
    0 2px 8px -2px color-mix(in srgb, var(--room-ink) 26%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--room-lume) 70%, transparent);
}
.center-round { font-size: 12.5px; font-weight: 700; line-height: 1.5; }
.center-sub   { font-size: 10.5px; color: var(--text-dim); line-height: 1.5; }

/* 1脚 = 発言1回。背もたれ・座面・脚を持つ椅子を描き、済んだ席から accent で埋まる。
   行間 11px は背もたれ(6px)＋脚(3px)のはみ出しが上下の行に触れない最小値 */
.chairs {
  display: flex; flex-wrap: wrap; gap: 11px 9px;
  justify-content: center; margin: 11px 0 6px;
}
.chair {
  position: relative; width: 13px; height: 10px; border-radius: 2px 2px 4px 4px;
  background: color-mix(in srgb, var(--text) 16%, transparent);
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--room-lume) 40%, transparent);
  transition: background-color .5s ease, box-shadow .5s ease;   /* 埋まる瞬間はフェードで */
}
.chair::before {   /* 背もたれ */
  content: ''; position: absolute; left: 2.5px; right: 2.5px; top: -6px; height: 6px;
  border-radius: 3px 3px 0 0; background: inherit;
}
.chair::after {    /* 脚2本。currentColor を使い、埋まった椅子だけ色を差し替える */
  content: ''; position: absolute; left: 1.5px; right: 1.5px; bottom: -3px; height: 3px;
  color: color-mix(in srgb, var(--text) 24%, transparent);
  background: linear-gradient(90deg,
    currentColor 0 2px, transparent 2px calc(100% - 2px), currentColor calc(100% - 2px) 100%);
}
.chair.is-filled {
  background: var(--accent);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--room-lume) 45%, transparent),
    0 1px 3px color-mix(in srgb, var(--accent) 45%, transparent);
}
.chair.is-filled::after { color: color-mix(in srgb, var(--accent) 55%, transparent); }
/* いま埋まったばかりの椅子（塗り済みの直後に空席が続く椅子＝最新）に淡い輪を残す。
   会議が1歩進んだ手応えを、点滅させずに示す */
.chair.is-filled:has(+ .chair:not(.is-filled)),
.chair.is-filled:last-child {
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--room-lume) 45%, transparent),
    0 1px 3px color-mix(in srgb, var(--accent) 45%, transparent),
    0 0 0 2.5px color-mix(in srgb, var(--accent) 25%, transparent);
}
.center-count { font-size: 11px; color: var(--text-dim); font-variant-numeric: tabular-nums; }

/* ---------- 発言ログ ---------- */

.round-sep {
  display: flex; align-items: center; gap: 10px;
  font-size: 11px; font-weight: 700; letter-spacing: .06em;
  color: var(--text-dim); margin: 6px 0 -2px;
}
/* 罫線は端で消えるグラデーションに。表罫のような硬さを避ける */
.round-sep::before, .round-sep::after { content: ''; flex: 1 1 0; height: 1px; }
.round-sep::before { background: linear-gradient(90deg, transparent, var(--border)); }
.round-sep::after  { background: linear-gradient(90deg, var(--border), transparent); }
.round-sep span { flex: 0 0 auto; }

.room-turn .seat-face { width: 40px; height: 40px; border-width: 1px; }
.room-turn .flow-meta b { font-weight: 700; color: var(--text); }
.room-turn .flow-meta .stance { margin-left: 4px; vertical-align: 1px; }
.room-turn.is-new { animation: turn-in .45s ease both; }

/* ---------- 動き ---------- */

/* box-shadow を丸ごと差し替えるアニメーションなので、
   持ち上げの影（1本目）を両キーフレームに含めておかないと脈動のたびに影が消える */
@keyframes seat-pulse {
  0%, 100% {
    box-shadow:
      0 8px 20px -6px color-mix(in srgb, var(--accent) 50%, transparent),
      0 0 0 0 color-mix(in srgb, var(--accent) 38%, transparent);
  }
  50% {
    box-shadow:
      0 8px 20px -6px color-mix(in srgb, var(--accent) 50%, transparent),
      0 0 0 8px color-mix(in srgb, var(--accent) 0%, transparent);
  }
}
@keyframes room-breathe {
  0%, 100% { opacity: 1; }
  50%      { opacity: .35; }
}
@keyframes turn-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}

/* 動きを嫌う設定の人には止める（業務画面なので既定より控えめでよい）。
   発言席は静的な影＋輪（.seat.is-speaking 本体に定義済み）が残るので主役は消えない */
@media (prefers-reduced-motion: reduce) {
  .seat.is-speaking, .room-turn.is-new, .live-dot::before,
  .round.is-now .r-label::before { animation: none; }
  .seat, .chair { transition: none; }
}