/* =========================================================================
   Project Studio — PS 固有の追加スタイル
   ★ps.css（P001 の写し）に手を入れずに、ここへ足す・上書きする。
   ★:root の配色トークンは増やさない。色は ps.css のトークンだけを使う。
   ★Phase 29（決定234）で見た目を刷新した（角丸・札・枠のある欄。手本 docs/mockups/refresh-issue.html）
   ========================================================================= */

/* ---- ヘッダー（LY-01）は ps.css の §4（★決定234 で紺の帯に作り直した。ログアウトは自分のメニューの中のフォーム） ---- */

/* ---- LT-3 単一ペイン型の器 -------------------------------------------------
   固定ヘッダー ／ 画面見出し ／ 中央1枚（本文が縦にスクロール）／ 下端の操作行 ／ 固定フッター */
.ps-single {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--c-pane-bg);   /* ★パネル構成（ps.css）: LT-3 の1枚もパネル */
}
.ps-single .ps-pane__body { padding: 10px 16px; }

/* ---- LT-4 ①認証の姿: KSP-001 ログイン画面のサイズ感に寄せる ------------------
   参考: input/reference/screens/Login-KSP.png（カード幅 480px・上下余白 50px・ロゴ ／ 題 ／ 欄 ／ 右寄せボタン ／ 右下に version） */
.ps-card--auth {
  max-width: 480px;
  padding: 44px 52px 12px 52px;
  color: var(--c-text);
}
.ps-card--auth.ps-card--wide { max-width: 560px; }
.ps-auth__brand {
  display: flex; align-items: center; gap: 8px;
  height: 36px;
  margin-bottom: 14px;
}
.ps-auth__brand img { display: block; }
.ps-auth__brand .ps-auth__mark { height: 28px; width: auto; }
.ps-auth__brand .ps-auth__wordmark { height: 15px; width: auto; }
.ps-auth__title {
  margin: 0 0 30px 0;
  font-size: 20px; font-weight: 500; color: var(--c-text);
  letter-spacing: .04em;
}
.ps-auth__lead { margin: -20px 0 22px 0; font-size: var(--fs-small); color: var(--c-text-weak); line-height: 1.6; }
.ps-card--auth .ps-field { margin-bottom: 14px; }
.ps-card--auth .ps-field__label { flex: 0 0 120px; font-size: 11px; }
.ps-card--auth .ps-input { background: transparent; }
.ps-card--auth .ps-input:focus { background: var(--c-input-focus-bg); }
.ps-auth__actions {
  display: flex; justify-content: flex-end; align-items: center; gap: 12px;
  margin-top: 26px;
}
.ps-auth__actions .ps-action { min-width: 96px; height: 36px; padding: 0 16px; font-size: var(--fs-base); }
.ps-auth__links { display: flex; gap: 14px; margin-right: auto; }
.ps-auth__links a { font-size: var(--fs-small); color: var(--c-link); text-decoration: none; }
.ps-auth__links a:hover { text-decoration: underline; }
.ps-auth__links button {
  background: none; border: none; padding: 0; font: inherit; font-size: var(--fs-small);
  color: var(--c-link); cursor: pointer;
}
.ps-auth__links button:hover { text-decoration: underline; }
.ps-auth__version {
  margin-top: 26px;
  text-align: right;
  font-size: 11px; color: var(--c-text-weak);
}
/* カードの上端に置く1行の案内（common.md §4.5 sc-aut-01-lbl-notice）と、利用者エラー */
.ps-auth__notice { margin: 0 0 16px 0; font-size: var(--fs-small); color: var(--c-text-weak); }
.ps-auth__error  {
  margin: 0 0 16px 0; padding: 8px 12px;
  font-size: var(--fs-small); color: var(--c-error); background: var(--c-error-bg);
  border: 1px solid var(--c-error-line); border-radius: var(--r-md);
}
.ps-otp-input { font-size: 20px; letter-spacing: .5em; text-align: center; }
.ps-check { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-small); cursor: pointer; }
.ps-check input { margin: 0; accent-color: var(--c-accent); }

/* ---- 開発用 /StyleGuide ---------------------------------------------------- */
.ps-styleguide { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 12px 16px; }
.ps-styleguide h2 {
  font-size: var(--fs-base); margin: 18px 0 8px 0; padding: 4px 10px;
  background: var(--c-section-bg); color: var(--c-section-fg); font-weight: 500; border-radius: var(--r-sm);
}
.ps-styleguide h2:first-child { margin-top: 0; }
.ps-styleguide__note { font-size: var(--fs-small); color: var(--c-text-weak); margin: 0 0 8px 0; }
.ps-styleguide__box { border: 1px solid var(--c-border); padding: 10px 12px; margin-bottom: 6px; }
.ps-styleguide__two { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ps-styleguide__cap { font-size: 11px; color: var(--c-text-weak); margin: 0 0 6px 0; }
.ps-styleguide code { font-size: 11px; background: var(--c-label-bg); padding: 0 3px; }
.ps-styleguide__frame {
  display: flex; height: 260px; border: 1px solid var(--c-border-strong);
}
.ps-styleguide__frame .ps-main { min-height: 0; }

/* ---- ボタンの見た目のリンク（画面遷移する「新規作成」「キャンセル」） ------------------ */
a.ps-excel, a.ps-action { display: inline-flex; text-decoration: none; text-align: center; box-sizing: border-box; }
a.ps-excel:hover, a.ps-action:hover { text-decoration: none; }
/* 下端の操作行の左に出す利用者エラー。★長い文は文の中で折り返し、ボタンは右に 1 行でそろえる（30-2。前は「保存する」だけが次の行へ落ちた）。
   幅の基準を 0 にして残りの幅を取り、最低 8em は残す（それも入らない狭さでは、前と同じくボタンが次の行へ回る＝押せなくならない）。
   切れ目の無い長い英数字（英字だけの組織名・メールアドレスなど）もその場で折り返す — 折り返さないとボタンの下へはみ出して隠れる（Quinn 30-2 の NG-1） */
.ps-actionbar .ps-field__error { margin: 0; flex: 1 1 0; min-width: 8em; overflow-wrap: anywhere; }
.ps-actionbar .ps-field__error:empty { min-width: 0; }

/* ---- 欄の並びの手直し ------------------------------------------------------------
   複数行（textarea）はラベルを上端にそろえる（baseline だと最終行にぶら下がる） */
.ps-field:has(> .ps-field__body > textarea) { align-items: flex-start; }
.ps-field:has(> .ps-field__body > textarea) > .ps-field__label { padding-top: 8px; }
/* 右ペインのラベル列: 「顧客（相手先組織）*」「プロジェクトの状態」が折り返さない幅 */
.ps-right .ps-field__label { flex: 0 0 124px; }

/* ---- 表の列幅（ps.css の mk/xs/sm/md/lg/num/act に足す） -------------------------
   氏名のように「全角 10 文字前後を切らずに見せたい」列。社員管理の氏名列（ユーザー指摘: md の倍） */
.ps-c--xl { width: 264px; }

/* ---- LT-1 課題一覧（SC-ISU-01。6-1） -------------------------------------------
   _Search 部分ビューは「列見出しの帯 ＋ 一覧のスクロール領域」の 2 要素を返す。
   差し込み先の器を display: contents にして、ps-center の flex の子として並べる */
.ps-listarea { display: contents; }
/* ★右ペインの差し込み先も同じ理由で display: contents。
   _Detail が返す 操作ボタン／属性表／時系列／記録欄 は、どれも .ps-right（flex 列）の
   直接の子である前提で書かれている（.ps-timeline の flex:1 1 auto + min-height:0 + overflow-y:auto）。
   器が普通の block のままだと flex の連鎖が切れ、時系列がスクロールせずに伸び続けて、
   コメントの多い課題では下端の記録欄（登録者・処理者・確認者）が画面の外へ出てしまう（決定68-c 違反）。 */
#sc-isu-01-pnl-detailbody { display: contents; }
/* モーダル・フォームの中で欄を親いっぱいに広げる */
.ps-input--block { width: 100%; box-sizing: border-box; }
textarea.ps-input--block { resize: vertical; }
/* 登録モーダルの利用者エラー */
.ps-modal__body .ps-field__error { display: block; margin-top: 6px; }

/* ---- 件名だけを目立たせる（決定144） ------------------------------------
   右ペインの属性表も MD-ISU-03 の課題情報も、件名と他の属性が同じ 13px / 400 で、
   どこが件名かを目で探すことになっていた。**14px / 500（Medium）**だけ変える。
   ★500 の字形は ps.css の @import で読み込んでいる（無いと 400 で描かれる）。
   ★.ps-input の font-size を上書きするので、入力欄向けの選択子を並べて書く。 */
.ps-title,
.ps-input.ps-title { font-size: 14px; font-weight: 500; }

/* ---- 右ペインの時系列（7-1。決定46: コメントの編集・削除は各投稿から） --------------
   meta は 日時・投稿者 を左に寄せ、操作（編集・削除）を右端に置く（ps.css の space-between を上書き） */
.ps-post__meta { justify-content: flex-start; gap: 10px; }
.ps-post__actions { margin-left: auto; display: flex; gap: 10px; }
.ps-post__actions button {
  border: none; background: none; padding: 0; cursor: pointer;
  font-size: 11px; color: var(--c-link);
}
.ps-post__actions button:hover { text-decoration: underline; }
.ps-post__edited { font-size: 11px; color: var(--c-text-weak); }

/* ---- コピーのボタンの置き場所（決定136。部品そのものは ps.css） ------------------
   コメント＝日時・投稿者の行の右端（「編集・削除」のさらに右。重ならない）。
   詳細＝「詳細」ラベルの行の右端（この行には他に何も無いので絶対位置でよい）。 */
.ps-post__meta > .ps-copy { margin-left: auto; }                    /* 読むだけの面（編集・削除が無い） */
.ps-post__meta > .ps-post__actions ~ .ps-copy { margin-left: 6px; } /* 編集・削除があるとき（右へ寄せるのはそちら） */
.ps-post--desc { position: relative; }
.ps-post--desc > .ps-copy { position: absolute; top: 2px; right: 2px; }
/* 右ペインの操作ボタンの列では右端のごみ箱の印の隣（★29-2・手本。状態を変えるボタンの並びから離す考えは同じ。右へ寄せるのは .ps-right__spacer） */
.ps-right__actions > .ps-copy { margin: 0; }
/* 区画見出し（MD-ISU-03 の「課題情報」）では横罫線より後ろへ回す（.ps-section__action と同じ） */
.ps-section > .ps-copy { order: 1; }

/* MD-ISU-03 の状態変更モード（決定47）: 編集不可の優先度トグル */
.ps-toggle:disabled { opacity: .55; cursor: default; }

/* ---- メンションの @補完（7-2。FN-ISU-12・決定41。部品は ps.js の PS.mention） --------
   候補はコメント欄の真上に全幅で出す（欄はモーダル最下部にあるため上向き）。
   ★MD-ISU-03 だけは欄が右列の上端から始まる背の高い欄なので（決定145）、真上には出す場所が無い。
     PS.mention の follow で「@ を打った行」の下（下が狭ければ上）に top/bottom を JS が入れる */
.ps-mention__wrap { position: relative; display: block; }
.ps-mention__pop {
  position: absolute; left: 0; right: 0; bottom: 100%; z-index: 30;
  max-height: 168px; overflow-y: auto;
  padding: 4px;
  background: var(--c-pane-bg);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  box-shadow: var(--sh-pop);
}
.ps-mention__pop[hidden] { display: none; }
.ps-mention__item {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 6px 8px; border: none; border-radius: 7px; background: none; cursor: pointer;
  font-size: var(--fs-base); font-family: inherit; text-align: left;
}
.ps-mention__item.is-active, .ps-mention__item:hover { background: var(--c-row-selected); }
.ps-mention__name { font-weight: bold; white-space: nowrap; }
.ps-mention__sub {
  font-size: 11px; color: var(--c-text-weak);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* 確定したメンションの表示（欄の下。×で外せる） */
.ps-mention__chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; }
.ps-mention__chips[hidden] { display: none; }
.ps-mention__cap { font-size: 11px; color: var(--c-text-weak); }
.ps-mention__chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px;
  border: 1px solid var(--c-accent-line); border-radius: 999px; color: var(--c-accent-ink);
  background: var(--c-accent-soft); font-size: 12px;
}
.ps-mention__chip button {
  border: none; background: none; padding: 0; cursor: pointer;
  color: inherit; font-size: 11px; line-height: 1;
}
/* 時系列（右ペイン）の本文中のメンションの色付け */
.ps-mention { padding: 0 4px; border-radius: 4px; background: var(--c-accent-soft); color: var(--c-accent-ink); font-weight: 500; }

/* ---- AI エージェントのコメントの Markdown 表示（19-3・決定154。HTML は CMarkdown が作る） ----------------
   ★時系列の中の 1 投稿なので、見出しでも本文より大きくしすぎない（件名 14px を超えない）。
   改行は <br> で来るので pre-line を切る（残すと改行が二重になる） */
.ps-md { white-space: normal; overflow-wrap: anywhere; }
.ps-md > :first-child { margin-top: 0; }
.ps-md > :last-child { margin-bottom: 0; }
.ps-md h1, .ps-md h2, .ps-md h3, .ps-md h4, .ps-md h5, .ps-md h6 {
  margin: 12px 0 4px; font-weight: bold; line-height: 1.4;
}
.ps-md h1, .ps-md h2 { font-size: 14px; padding-bottom: 2px; border-bottom: 1px solid var(--c-border); }
.ps-md h3 { font-size: var(--fs-base); }
.ps-md h4, .ps-md h5, .ps-md h6 { font-size: var(--fs-base); color: var(--c-text-weak); }
.ps-md p { margin: 0 0 6px; }
.ps-md ul, .ps-md ol { margin: 0 0 6px; padding-left: 1.6em; }
.ps-md li > ul, .ps-md li > ol { margin-bottom: 0; }
.ps-md li.task-list-item { list-style: none; margin-left: -1.3em; }
.ps-md li.task-list-item input { margin: 0 4px 0 0; vertical-align: -1px; }
.ps-md code {
  font-family: Consolas, "BIZ UDGothic", monospace; font-size: 12px;
  background: var(--c-label-bg); border: 1px solid var(--c-border); border-radius: 4px; padding: 0 3px;
}
.ps-md pre {
  margin: 0 0 6px; padding: 8px 10px; overflow-x: auto;
  background: var(--c-label-bg); border: 1px solid var(--c-border); border-radius: var(--r-md);
}
.ps-md pre code { background: none; border: none; padding: 0; white-space: pre; }
.ps-md blockquote { margin: 0 0 6px; padding: 0 0 0 10px; border-left: 3px solid var(--c-border-strong); color: var(--c-text-weak); }
/* 表は右ペインの幅に収まらないことがあるので、表だけ横にスクロールする */
.ps-md table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 0 0 6px; }
.ps-md th, .ps-md td { border: 1px solid var(--c-border-strong); padding: 3px 8px; text-align: left; }
.ps-md th { background: var(--c-label-bg); font-weight: bold; white-space: nowrap; }
.ps-md hr { border: none; border-top: 1px solid var(--c-border); margin: 8px 0; }
.ps-md a { color: var(--c-link); }

/* ---- 添付ファイル（FN-ISU-13/15。7-3。手本: docs/mockups/issue-attachment.html） ----------------- */
/* 本体が数行ぶん高くなる項目は、ラベルを上端にそろえる（ps-field の既定は baseline なので下がってしまう） */
.ps-field--top { align-items: flex-start; }
/* 書く面の添付の欄: 「ファイルを選ぶ」＋ ここへドロップ。選んだものは下にチップで並ぶ（保存で確定＝決定22） */
.ps-files { display: block; }
.ps-files__drop {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  border: 1.5px dashed #c5d2de; border-radius: 10px; background: #fafbfd;
}
/* ★29-2（決定236・手本）: 置き場の左に上向きの矢印の印 */
.ps-files__drop::before {
  content: ""; flex: 0 0 18px; width: 18px; height: 18px; background: var(--c-faint);
  -webkit-mask: var(--i-upload) center / 18px no-repeat; mask: var(--i-upload) center / 18px no-repeat;
}
.ps-files__drop.is-over { border-color: var(--c-accent); background: var(--c-row-selected); }
.ps-files__hint { font-size: 12px; color: var(--c-text-weak); }
.ps-files__list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ps-files__list:empty { display: none; }
/* 添付 1 件（書く面でも時系列でも同じ見た目。時系列では名前がダウンロードのリンク） */
.ps-file {
  display: inline-flex; align-items: center; gap: 6px; max-width: 320px;
  padding: 4px 9px 4px 8px; border: 1px solid var(--c-border); border-radius: var(--r-md);
  background: var(--c-surface); font-size: 12px; line-height: 1.5;
}
/* ★29-2（手本）: 添付の頭にクリップの印 */
.ps-file::before {
  content: ""; flex: 0 0 13px; width: 13px; height: 13px; background: var(--c-muted);
  -webkit-mask: var(--i-clip) center / 13px no-repeat; mask: var(--i-clip) center / 13px no-repeat;
}
.ps-file--new { border-color: var(--c-accent-line); background: var(--c-accent-softer); }
.ps-file__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-file__name a { color: var(--c-accent-ink); }
.ps-file__size { color: var(--c-text-weak); white-space: nowrap; }
.ps-file__del {
  border: none; background: none; padding: 0; cursor: pointer;
  color: inherit; font-size: 11px; line-height: 1;
}
/* 読む面（時系列）の添付の並び */
.ps-post__files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

/* ---- 「詳細な条件」の枠（軸7〜11。7-4b。issue-list.md §5.1 規則2: ②と③のあいだ） -------------
   トグルの意味は左3軸と同じ「押されている＝一覧に出る」（決定58）。開閉しても一覧の列構成は変わらない */
.ps-adv {
  flex: 0 0 auto;
  margin: 0 16px 12px 16px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  background: var(--c-surface-2);
  padding: 10px 14px;
  display: grid; grid-template-columns: 84px 1fr; gap: 8px 12px; align-items: center;
}
.ps-adv[hidden] { display: none; }
.ps-adv__label { font-size: var(--fs-small); color: var(--c-text-weak); text-align: right; white-space: nowrap; }
.ps-adv__body { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }
.ps-adv__body .ps-toggle { flex: 0 0 auto; }
.ps-adv input[type="date"] {
  font: inherit; font-size: var(--fs-small); height: 30px; padding: 0 8px;
  border: 1px solid var(--c-border-strong); border-radius: var(--r-md); background: var(--c-surface); color: var(--c-text); outline: none;
}
.ps-adv input[type="date"]:focus { border-color: var(--c-accent); box-shadow: 0 0 0 3px var(--c-ring); }
.ps-adv__sep { font-size: var(--fs-small); color: var(--c-text-weak); }
.ps-adv__spacer { flex: 1 1 auto; }

/* ---- 並び替え（FN-REF-11。7-4c。一覧のバーのドロップダウン 1 つ） ------------------------ */
.ps-sort { display: flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.ps-sort__label { font-size: var(--fs-small); color: var(--c-text-weak); white-space: nowrap; }
.ps-sort select {
  font: inherit; font-size: 12.5px; height: 30px; padding: 0 30px 0 10px;
  min-width: 90px; border: 1px solid var(--c-border-strong); border-radius: var(--r-md);
  -webkit-appearance: none; appearance: none;
  background: var(--c-surface) var(--i-chev-down) no-repeat right 9px center / 12px; color: var(--c-text); outline: none; cursor: pointer;
}
.ps-sort select:focus-visible { border-color: var(--c-accent); box-shadow: 0 0 0 3px var(--c-ring); }
/* 「自分の順序」のときだけ行をドラッグできる（FN-REF-22） */
.ps-list.is-sortable .ps-row { cursor: grab; }
.ps-list.is-sortable .ps-row.is-dragging { opacity: .5; cursor: grabbing; }
.ps-list.is-sortable .ps-row.is-dropbefore { box-shadow: inset 0 2px 0 0 var(--c-accent); }
.ps-list.is-sortable .ps-row.is-dropafter { box-shadow: inset 0 -2px 0 0 var(--c-accent); }

/* ---- 左ペイン プロジェクト軸の「自分の並び」（決定122） ----------------------------
   ★掴みどころ（⠿）からだけドラッグできる。行そのものは「押す＝絞り込む」ものなので掴めない。
   印はふだん薄く置いておき、行にポインタを乗せたときだけはっきりさせる（気づけるが、うるさくない） */
.ps-filter__item--sortable { display: flex; align-items: center; gap: 2px; }
.ps-filter__grip {
  flex: 0 0 auto;
  color: var(--c-leader);
  font-size: 11px;
  line-height: 1;
  cursor: grab;
  user-select: none;
}
.ps-filter__item--sortable:hover .ps-filter__grip { color: var(--c-text-weak); }
.ps-filter__grip:active { cursor: grabbing; }
.ps-filter__item--sortable.is-dragging { opacity: .5; }
.ps-filter__item--sortable.is-dropbefore { box-shadow: inset 0 2px 0 0 var(--c-accent); }
.ps-filter__item--sortable.is-dropafter { box-shadow: inset 0 -2px 0 0 var(--c-accent); }

/* ---- 保存した検索条件（FN-REF-14。7-4d） -------------------------------------------- */
.ps-savedcond {
  flex: 0 0 auto; min-width: 110px; max-width: 190px;
  font: inherit; font-size: 12.5px; height: 30px; padding: 0 30px 0 10px;
  border: 1px solid var(--c-border-strong); border-radius: var(--r-md);
  -webkit-appearance: none; appearance: none;
  background: var(--c-surface) var(--i-chev-down) no-repeat right 9px center / 12px; color: var(--c-text); outline: none; cursor: pointer;
}
.ps-savedcond:focus-visible { border-color: var(--c-accent); box-shadow: 0 0 0 3px var(--c-ring); }
/* MD-REF-01 の中の保存済み一覧（名前と × だけ。独立した管理画面を持たないため） */
.ps-condlist { display: flex; flex-direction: column; gap: 2px; }
.ps-condlist__item {
  display: flex; align-items: center; gap: 6px;
  font-size: var(--fs-small); padding: 2px 0;
  border-bottom: 1px solid var(--c-border);
}
.ps-condlist__name { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-condlist__del {
  flex: 0 0 auto; border: none; background: none; padding: 0; cursor: pointer;
  color: var(--c-text-weak); font-size: 11px; line-height: 1;
}
.ps-condlist__empty { font-size: 11px; color: var(--c-text-weak); }

/* 課題の削除（FN-ISU-18。誤登録の訂正手段なので、ほかの操作ボタンと見分けが付くようにする） */
.ps-action--danger { margin-left: auto; color: var(--c-error); border-color: var(--c-error-line); }
.ps-action--danger:hover:not(:disabled) { background: var(--c-error-bg); border-color: var(--c-error); }

/* ---- 通知先欄（FN-NTF-01。9-1。手本: docs/mockups/issue-notify.html） ------------------
   ★各チップに「なぜ入っているか」を添える（決定76）— 送ったら取り消せないので、外していいか判断できるように。
   契機7（完了からの復帰）で入った人は灰色・× を持たない（D-47） */
.ps-notify { display: block; }
.ps-notify__list { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.ps-notify__list:empty { display: none; }
.ps-notify__chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 4px;
  border: 1px solid var(--c-accent-line); border-radius: 999px; color: var(--c-accent-ink);
  background: var(--c-accent-soft); font-size: 12px; line-height: 1.5;
}
.ps-notify__chip.is-locked {
  border-color: var(--c-border-strong); color: var(--c-ink-2); background: var(--c-surface-2);
}
.ps-notify__why { font-size: 11px; color: var(--c-text-weak); }
.ps-notify__chip button {
  border: none; background: none; padding: 0; cursor: pointer; color: inherit; font-size: 11px; line-height: 1;
}
.ps-notify__add {
  font: inherit; font-size: 12px; height: 28px; padding: 0 28px 0 12px; min-width: 180px;
  border: 1px solid var(--c-border-strong); border-radius: 999px;
  -webkit-appearance: none; appearance: none;
  background: var(--c-surface) var(--i-chev-down) no-repeat right 10px center / 12px; color: var(--c-text); outline: none; cursor: pointer;
}
.ps-notify__empty { font-size: 12px; color: var(--c-text-weak); }

/* ---- 詳細の変更を開くリンクと、変更前・変更後の並べ（決定86。MD-ISU-05） ---------
   ★詳細は 1 行に収まらない。20 文字で切った from→to は、冒頭が同じだと左右が
   同じ文字列に見えて何も伝えないので、時系列は「詳細を変更した」だけを出し、
   全文はこのモーダルで並べて見せる（_ChangeDetail が当時の全文を返す）。 */
.ps-changelink {
  border: none; background: none; padding: 0; cursor: pointer;
  font: inherit; color: var(--c-link); text-decoration: underline;
}
.ps-changelink:hover { color: var(--c-accent); }

.ps-diff { display: flex; gap: 10px; align-items: stretch; }
.ps-diff__col { flex: 1 1 50%; min-width: 0; display: flex; flex-direction: column; }
.ps-diff__label {
  font-size: var(--fs-small); font-weight: 500; color: var(--c-text-weak);
  padding: 0 0 6px 0;
}
.ps-diff__body {
  flex: 1 1 auto; min-height: 180px; max-height: 46vh; overflow-y: auto;
  border: 1px solid var(--c-border); border-radius: 10px; background: var(--c-surface-2);
  padding: 10px 12px; white-space: pre-wrap; word-break: break-word; line-height: 1.8;
}
.ps-diff__body:empty::before { content: "（なし）"; color: var(--c-text-weak); }

/* ---- MD-ISU-02 課題の登録: 高さは画面いっぱい、増えた高さは詳細の欄へ（決定185。手本: docs/mockups/issue-new-height.html）
   幅は .ps-modal--lg の 900px のまま（1 列なので、広げると 1 行が長くなりすぎる）。高さは MD-ISU-03 と同じ値（決定143）。
   ★伸びるのは .ps-field--fill の 1 つだけ。それより上の欄の位置は今までと同じ。
     下の欄との間は 8px（ほかの欄どうしと同じ）— 以前は textarea が文字の行に置かれていて、その下に約 6px のすき間が足されていた（Quinn 22-1） */
.ps-modal--tall .ps-modal__box { height: calc(100vh - 64px); }
.ps-modal--tall .ps-modal__body { display: flex; flex-direction: column; }
.ps-modal--tall .ps-modal__body > * { flex: 0 0 auto; }
/* 縦に並べると余白が重ならなくなる（ブロックの並びでは欄の 8px と注記の 4px が重なって 8px）。今までと同じ 8px に揃える */
.ps-modal--tall .ps-modal__body > .ps-note { margin-top: 0; }
/* 残りの高さを受け取る欄。縮めない＝textarea の rows の高さが下限（足りなければ本文がスクロールする）。
   ★.ps-field:has(> .ps-field__body > textarea)（ラベルを上端に揃える）より強くしないと stretch が効かない。
     ラベルの padding-top 4px はそちらの規則のまま */
.ps-modal--tall .ps-modal__body > .ps-field--fill { flex: 1 0 auto; align-items: stretch; }
.ps-modal--tall .ps-field--fill > .ps-field__label { align-self: flex-start; }
.ps-modal--tall .ps-field--fill > .ps-field__body { display: flex; flex-direction: column; }
/* 欄の高さは画面の高さで決まるので、伸縮つまみは出さない（MD-ISU-03 のコメント欄と同じ） */
.ps-modal--tall .ps-field--fill textarea { flex: 1 1 auto; resize: none; }

/* ---- MD-ISU-03 課題の作業場（決定90・決定145） ------------------------------------
   左＝読む面（課題情報 ＋ これまでのコメント）／右＝書く面（新しいコメント）。手本: docs/mockups/issue-modal-wide.html
   ★幅も高さも「画面 − 余白 32px × 2」いっぱい（高さ＝決定143、幅＝決定145）。
     以前の上限 1700px は「1 列が広すぎて読めない」ための線だったが、2 列に割っているので 1 列は画面の半分弱に収まる。
     64px = .ps-modal の余白 32px × 2。max-height と同じ値なので、詰めるならそちらと一緒に動かす */
.ps-modal--xl .ps-modal__box {
  width: calc(100vw - 64px);
  max-width: none;
  height: calc(100vh - 64px);
}
/* ★本文（grid）そのものはスクロールしない。スクロールするのは左列ぜんたい 1 本だけ（決定145）。
   右列は動かず、コメント欄が残りの高さを受け取る */
.ps-editgrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0 24px;
  min-height: 0;
  overflow: hidden;
}
.ps-editgrid__col { display: flex; flex-direction: column; min-height: 0; }
.ps-editgrid__col--info { overflow-y: auto; padding-right: 10px; }
/* 詳細は中身の高さまで伸ばす（高さは issue.js の fitDescription が入れる）。欄の中のスクロールと伸縮つまみを消す。
   ★要素名まで付ける — textarea.ps-input--block { resize: vertical } と同じ強さでないと負けてつまみが残る */
textarea.ps-editgrid__autosize { resize: none; overflow: hidden; }
/* 右列: コメント欄が残りの高さをぜんぶ受け取り、解決理由・担当者・通知先は下に寄る */
.ps-editgrid__new { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.ps-editgrid__comment { flex: 1 1 auto; min-height: 0; align-items: stretch; }
.ps-editgrid__comment > .ps-field__label { align-self: flex-start; padding-top: 4px; }
.ps-editgrid__comment > .ps-field__body { display: flex; flex-direction: column; }
.ps-editgrid__comment .ps-mention__wrap { flex: 1 1 auto; min-height: 0; display: flex; }
.ps-editgrid__comment textarea { flex: 1 1 auto; min-height: 160px; resize: none; }
/* ★地は灰色（決定106）。この画面では「灰色の地＝読むだけ」（.ps-input.is-locked と同じ --c-label-bg）。
   白いのは書ける欄だけになり、どこに書くかがひと目で分かる。
   ★箱の中ではスクロールさせない（左列ぜんたいが 1 本でスクロールする＝決定145） */
.ps-editgrid .ps-timeline {
  --feed-bg: var(--c-label-bg);   /* ★29-2: 時系列の丸と点の縁取りを地の色に合わせる */
  flex: 0 0 auto; min-height: 0; overflow: visible;
  margin: 0 0 4px 0; padding: 14px 14px 0;
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  background: var(--c-label-bg);
}
/* ★右ペイン・実績の「これまでのコメント」の見出し（決定147。手本: docs/mockups/issue-modal-wide.html の右ペイン）。
   見出しの横罫が区切りになるので、すぐ下の投稿の上罫は引かない（二重線にしない） */
.ps-timeline > .ps-section + .ps-post { border-top: none; }
/* コメントが 1 件も無いとき（モーダルの「まだコメントはありません。」と同じ見た目） */
.ps-timeline__empty { margin: 0; padding: 10px 2px; color: var(--c-text-weak); font-size: var(--fs-small); }
/* 並び順の切り替え（決定146）。アイコン＋「いまの並び」 */
.ps-order { display: inline-flex; align-items: center; gap: 4px; }
.ps-order__i { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.ps-editgrid .ps-timeline .ps-post:first-child { border-top: none; }
.ps-editgrid .ps-timeline:empty::before {
  content: "まだコメントはありません。";
  display: block; padding: 0 2px 14px; color: var(--c-text-weak); font-size: var(--fs-small);
}
/* 区画が見分けられるように、項目の間隔をモーダルの中だけ広げる */
.ps-editgrid .ps-field { margin-bottom: 12px; }
.ps-editgrid .ps-section { margin-top: 4px; }
/* 区画見出しの右端に置く操作（.ps-section::after の横罫線より後ろへ回す） */
.ps-section__action { order: 1; }
/* ★読み取り専用の欄（決定90）。「直せない」は点線の下辺と薄い地で示すが、
   ★文字は薄くしない — ここは読むための面であり、詳細を読み通せることが要る。
   （ps.css の .ps-input:disabled は文字も薄くするので、そちらを上書きする） */
.ps-input.is-locked,
.ps-input.is-locked:disabled {
  background: var(--c-label-bg);
  border: 1px solid transparent;   /* ★決定234: 読むだけ＝灰の地で枠なし（書ける欄だけが白地に枠） */
  box-shadow: none;
  color: var(--c-text);
  cursor: default;
}

/* ---- SC-HLP-01 ヘルプ（利用者ガイド。決定108） ------------------------------
   左＝目次・右＝本文（LT-2 と同じ「左で選び右で読む」）。本文の中身は
   tools/Generate-UserGuideHtml.ps1 が docs/user-guide.md から生成する。 */
.ps-help { display: flex; min-height: 0; flex: 1 1 auto; }
.ps-help__toc {
  flex: 0 0 250px; overflow-y: auto; padding: 10px 0 20px 0;
  background: var(--c-left-bg); border-right: 1px solid var(--c-border-strong);
}
.ps-help__toc a {
  display: block; padding: 4px 14px 4px 18px; font-size: var(--fs-base);
  color: var(--c-text); text-decoration: none; border-left: 3px solid transparent;
}
.ps-help__toc a:hover { background: var(--c-row-hover); }
.ps-help__toc a.is-current { border-left-color: var(--c-accent); background: var(--c-row-selected); font-weight: bold; }
.ps-help__toc a.is-sub { padding-left: 34px; font-size: var(--fs-small); color: var(--c-text-weak); }
.ps-help__tochead { margin: 8px 14px 4px 14px; font-size: var(--fs-small); color: var(--c-text-weak); }
.ps-help__body { flex: 1 1 auto; overflow-y: auto; min-width: 0; scroll-behavior: smooth; }
.ps-help__page { max-width: 820px; padding: 6px 32px 60px 32px; }
.ps-help__page h1 { font-size: 17px; margin: 14px 0 4px 0; }
.ps-help__page .ps-help__lead { color: var(--c-text-weak); margin: 0 0 10px 0; }
.ps-help__page h2 {
  display: flex; align-items: center; gap: 6px;
  font-size: 15px; margin: 34px 0 10px 0; padding-top: 14px; border-top: 1px solid var(--c-border);
}
.ps-help__page h2::before { content: ""; flex: 0 0 3px; width: 3px; height: 15px; background: var(--c-accent); }
.ps-help__page h3 { font-size: var(--fs-base); margin: 20px 0 6px 0; }
.ps-help__page p, .ps-help__page li { font-size: var(--fs-base); line-height: 1.9; }
.ps-help__page ul, .ps-help__page ol { margin: 6px 0; padding-left: 22px; }
.ps-help__page li { margin: 2px 0; }
/* 画面イメージ: 縮小して流れを止めない。押すと原寸が別タブで開く */
.ps-help__shot { display: block; margin: 10px 0; width: fit-content; cursor: zoom-in; }
.ps-help__shot img {
  display: block; max-width: 100%; max-height: 420px;
  border: 1px solid var(--c-border); border-radius: var(--r-md); box-shadow: var(--sh-panel);
}
.ps-help__page table { border-collapse: collapse; margin: 8px 0; font-size: var(--fs-base); }
.ps-help__page th, .ps-help__page td { border: 1px solid var(--c-border-strong); padding: 4px 12px; text-align: left; }
.ps-help__page th { background: var(--c-label-bg); font-weight: bold; }
.ps-help__page code {
  font-family: Consolas, monospace; font-size: 12px;
  background: var(--c-label-bg); border: 1px solid var(--c-border); padding: 0 4px;
}
.ps-help__page pre {
  margin: 8px 0; padding: 8px 12px; overflow-x: auto;
  background: var(--c-label-bg); border: 1px solid var(--c-border);
}
.ps-help__page pre code { background: none; border: none; padding: 0; white-space: pre; line-height: 1.6; }
.ps-help__page hr { border: none; border-top: 1px solid var(--c-border); margin: 26px 0; }

/* ---- SC-FIL-01 プロジェクトのファイル（Phase 11。手本: docs/mockups/project-files.html） ----------------
   左ペインと中央の間に 4 つ目のペイン（フォルダー）。ツリーは絞り込みの軸＝押しても遷移しない（決定116）。
   選択中の印は一覧の選択行と同じ薄いブルーの地（左ペインの点線＋▶ は使わない。ユーザー指示 2026-09-02） */
.ps-folder {
  flex: 0 0 var(--w-folder);
  width: var(--w-folder);
  overflow-y: auto; overflow-x: hidden;
  padding: 0 8px 12px 8px;
}
.ps-folder .ps-filter__head { margin-top: 10px; }
.ps-treearea { display: block; }
.ps-tree, .ps-tree ul { list-style: none; margin: 0; padding: 0; }
.ps-tree { padding: 0; }
.ps-tree ul { padding-left: 14px; }
.ps-tree__item { margin: 0; }
.ps-tree__row { display: flex; align-items: baseline; gap: 2px; }
.ps-tree__twist {
  flex: 0 0 auto; width: 14px; height: 14px; line-height: 12px;
  margin-top: 6px; padding: 0; font: inherit; font-size: 11px;
  border: 1px solid var(--c-border-strong); border-radius: 4px; background: var(--c-pane-bg); color: var(--c-text-weak);
  cursor: pointer;
}
.ps-tree__twist:hover { border-color: var(--c-accent); color: var(--c-accent); }
.ps-tree__twist.is-leaf { visibility: hidden; }
.ps-tree__link { padding: 4px 2px; }
.ps-tree__count { flex: 0 0 auto; color: var(--c-text-weak); font-size: 11px; }
.ps-tree__item.is-collapsed > ul { display: none; }
.ps-tree__row.is-selected { background: var(--c-row-selected); border-radius: var(--r-md); }
.ps-tree__row.is-selected .ps-tree__link { font-weight: 500; }
.ps-tree__row.is-selected .ps-tree__link { color: var(--c-text); }
.ps-tree__row.is-selected .ps-filter__leader,
.ps-tree__row.is-selected .ps-filter__mark { visibility: hidden; }
.ps-tree__ops { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 0 0 0; }
.ps-tree__ops .ps-action { white-space: nowrap; }

/* 一覧の列構成（課題一覧と違う）: 名前 / フォルダー / サイズ / 更新日 / 更新者 /（畳んでいるときだけ）⇩ */
.ps-row--file, .ps-list__head--file {
  grid-template-columns: 1fr 150px 74px 84px 92px 0;
  grid-template-areas: "t f z d u a";
}
.ps-row__name, .ps-row__folder, .ps-row__who { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ps-row__name   { grid-area: t; }
.ps-row__folder { grid-area: f; color: var(--c-text-weak); }
.ps-row__size   { grid-area: z; text-align: right; color: var(--c-text-weak); }
.ps-row__date   { grid-area: d; color: var(--c-text-weak); }
.ps-row__who    { grid-area: u; }
.ps-list__head--file .ps-col--z { grid-area: z; text-align: right; }
.ps-list__head--file .ps-col--f { grid-area: f; }
.ps-list__head--file .ps-col--d { grid-area: d; }
.ps-list__head--file .ps-col--u { grid-area: u; }
.ps-list__head--file .ps-col--dl { grid-area: a; }
.ps-row__dl { grid-area: a; display: none; text-align: right; }
.ps-row__dl a {
  display: inline-block; font-size: 11.5px; line-height: 18px; padding: 0 6px;
  border: 1px solid var(--c-border-strong); border-radius: var(--r-sm);
  color: var(--c-accent-ink); text-decoration: none;
}
.ps-row__dl a:hover { background: var(--c-btn-bg); color: var(--c-btn-fg); }
#sc-fil-01-pnl-detailbody { display: contents; }

/* 右ペイン: 属性表の下のプレビュー（画像だけ）と、畳む仕掛け */
.ps-preview { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 8px 10px; }
.ps-preview__box {
  border: 1px solid var(--c-border); border-radius: 10px; background: var(--c-label-bg);
  height: 240px; display: flex; align-items: center; justify-content: center;
  color: var(--c-text-weak); font-size: var(--fs-small); text-align: center; padding: 10px;
}
.ps-preview__img { display: block; max-width: 100%; max-height: 480px; border: 1px solid var(--c-border); border-radius: var(--r-md); }
.ps-memo { white-space: pre-line; }
.ps-right__fold {
  margin-right: auto; align-self: center;
  font: inherit; font-size: 11.5px; line-height: 20px; padding: 0 9px;
  border: 1px solid var(--c-border); border-radius: 999px;
  background: var(--c-surface); color: var(--c-text-weak); cursor: pointer;
}
.ps-right__fold:hover { color: var(--c-accent-ink); border-color: var(--c-accent-line); background: var(--c-accent-softer); }
.ps-rightstrip { flex: 0 0 40px; width: 40px; display: none; }
.ps-rightstrip button {
  width: 100%; height: 100%; border: none; border-radius: var(--r-lg); background: transparent; cursor: pointer;
  font: inherit; font-size: 12px; color: var(--c-text-weak); letter-spacing: .2em;
  writing-mode: vertical-rl; padding: 14px 0 0 0; text-align: left;
}
.ps-rightstrip button:hover { color: var(--c-accent-ink); background: var(--c-accent-softer); }
.ps-main.is-folded .ps-right,
.ps-main.is-folded .ps-splitter--right { display: none; }
.ps-main.is-folded .ps-rightstrip { display: block; }
.ps-main.is-folded .ps-row--file, .ps-main.is-folded .ps-list__head--file {
  grid-template-columns: 1fr 150px 74px 84px 92px 32px;
}
.ps-main.is-folded .ps-row__dl { display: block; }
/* 追加のモーダル: sm(480) と lg(900) の間 */
.ps-modal--md .ps-modal__box { max-width: 640px; }
.ps-files__drop .ps-action { flex: 0 0 auto; white-space: nowrap; }

/* =====================================================================
   SC-WRK-01 実績一覧（Phase 12。手本: docs/mockups/works.html）
   ===================================================================== */

/* 一覧の列構成（課題一覧と違う）: 日時 / 種類 / プロジェクト / 課題番号 / 件名 / 内容 / 実施者
   ★決定221（PSTUD-49 ③）: プロジェクト 104→84（課題一覧と同じ幅）・実施者 152→110。空いた 62px は件名と内容へ */
.ps-row--work, .ps-list__head--work {
  grid-template-columns: 88px 46px 84px 74px minmax(0, 1.15fr) minmax(0, 1fr) 110px;
  grid-template-areas: "w k p n t c u";
}
/* ★英語の画面だけ種類の札の列を広げる（Resolved・Updated が 46px に収まらない。20-5）。日本語の見た目は変えない */
html[lang="en"] .ps-row--work, html[lang="en"] .ps-list__head--work {
  grid-template-columns: 88px 64px 84px 74px minmax(0, 1.15fr) minmax(0, 1fr) 110px;
}
/* ★決定221 ③: 一覧そのもの（LT-1 の中央＝ps.css で器にしてある）が 700px より狭いときは、プロジェクトの列を出さない
   — 課題番号の頭がプロジェクトのコード。iPad の横で左ペインを畳んでも、件名が 46px しか残らなかった */
@container (width < 700px) {
  .ps-row--work, .ps-list__head--work {
    grid-template-columns: 88px 46px 74px minmax(0, 1.15fr) minmax(0, 1fr) 110px;
    grid-template-areas: "w k n t c u";
  }
  html[lang="en"] .ps-row--work, html[lang="en"] .ps-list__head--work {
    grid-template-columns: 88px 64px 74px minmax(0, 1.15fr) minmax(0, 1fr) 110px;
  }
  .ps-row--work .ps-row__project, .ps-list__head--work .ps-col--p { display: none; }
}
.ps-row__when, .ps-row__what, .ps-row__who { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ps-row__when { grid-area: w; color: var(--c-text-weak); font-variant-numeric: tabular-nums; }
.ps-row__kind { grid-area: k; }
.ps-row__what { grid-area: c; color: var(--c-text-weak); }
.ps-row__what.is-empty::before { content: "\2014"; }
.ps-row__who  { grid-area: u; }
.ps-list__head--work .ps-col--w { grid-area: w; }
.ps-list__head--work .ps-col--k { grid-area: k; text-align: center; }
.ps-list__head--work .ps-col--c { grid-area: c; }
.ps-list__head--work .ps-col--u { grid-area: u; }

/* 更新の種類の札。★状態バッジの3色をそのまま使い、新しい色域を足さない（決定127）。
   登録＝未解決になった／処理＝処理済みにした／完了＝完了にした と1対1で対応する。
   「更新」だけは状態が動いていないので色を持たず、社内限定の印（.ps-scope）と同じ無彩色にする。 */
.ps-kind {
  display: block; text-align: center; border-radius: 5px;
  font-size: 11.5px; font-weight: 500; line-height: 20px; height: 20px;
}
.ps-kind--new     { background: var(--c-active-bg);   color: var(--c-active-fg); }
.ps-kind--resolve { background: var(--c-resolved-bg); color: var(--c-resolved-fg); }
.ps-kind--close   { background: var(--c-closed-bg);   color: var(--c-closed-fg); }
.ps-kind--update  {
  background: var(--c-surface); color: var(--c-ink-2);
  border: 1px solid var(--c-border-strong); line-height: 18px;
}

/* 中央の帯: 期間（1つだけ選ぶ）＋「期間指定」のときだけ出る日付欄2つ（ラベルは持たない） */
.ps-period { display: flex; align-items: center; gap: 6px; }
.ps-period__dates { display: flex; align-items: center; gap: 4px; }
.ps-period__dates[hidden] { display: none; }
.ps-period__sep { color: var(--c-text-weak); }
/* ★決定221（PSTUD-49 ⑤・Quinn 27-1 の NG）: 実績の帯は、1 段に入りきらないときだけ折り返す — 期間指定で日付欄が出たときや英語の画面で、
   更新の種類のボタンが中央ペインの右で切れて押せなかった（ペインの並びは画面に入っているので、横スクロールでも届かない）。
   1 段のときの高さは今までと同じ 44px（上下の余白 9px ＋ ボタン 26px）。課題の帯はキーワード欄が縮むので折り返さない（ここは実績だけ） */
#sc-wrk-01-pnl-center .ps-center__bar {
  flex: 0 0 auto; height: auto; min-height: var(--h-filterbar);
  padding-top: 9px; padding-bottom: 9px;
  flex-wrap: wrap; row-gap: 6px;
}
#sc-wrk-01-pnl-center .ps-period { flex-wrap: wrap; row-gap: 6px; }

/* ---- SC-ADM-01 アクセストークン（Phase 19。決定150） ------------------------------------------------
   取り消したトークンは一覧に残す（いつ・誰が取り消したかを見せる）が、文字を弱めて「もう効かない」ことを示す。
   発行した直後のモーダル（MD-ADM-10）は、平文を等幅で 1 本の欄に出す — 選んで写す人もいるので折り返しても切らない */
.ps-table tr.is-muted td { color: var(--c-text-weak); }
.ps-token {
  display: block; width: 100%; box-sizing: border-box;
  font-family: Consolas, monospace; font-size: 13px; word-break: break-all;
  padding: 8px 10px; background: var(--c-label-bg); border: 1px solid var(--c-border-strong); border-radius: var(--r-md);
}
.ps-token__row { display: flex; align-items: flex-start; gap: 6px; margin: 8px 0; }
/* 名前の下に先頭の数文字（取り違えずに取り消すための見分け）。列を 1 本減らすため同じセルに置く */
.ps-token__prefix { display: block; font-family: Consolas, monospace; font-size: 11px; color: var(--c-text-weak); }
/* ★英語の画面だけ社員管理の一覧の「Login」列を広げる（Allowed・Disabled が 62px に収まらない。20-8）。日本語の見た目は変えない */
html[lang="en"] #sc-adm-01-grd-users col:nth-child(5) { width: 88px; }
/* ★英語の画面だけ顧客の一覧の「Type」列と、担当者の表の「Login」の選択を広げる（External organization・Allowed が収まらない。20-9） */
html[lang="en"] #sc-adm-04-grd-organizations col:nth-child(3) { width: 176px; }
html[lang="en"] #sc-adm-04-grd-detail-users col:nth-child(3) { width: 108px; }
/* ★英語の画面だけテンプレートの一覧の「Number of issue types」列を広げる（見出しが収まらない。20-10） */
html[lang="en"] #sc-adm-09-grd-templates col:nth-child(3) { width: 160px; }

/* ---- LY-01「はじめに」— 最初の 5 分のチェックリスト（Phase 21-1・決定182） ------------------------------
   個人メニューの先頭に置く。★決定234: 「AI に質問」と同じ形の丸い札（左に進み具合の輪。--p はサーバーが入れる％）で、
   開いている間は少し明るく。一覧は札の左端に揃えて下に開く（白い面・角丸 12px・影）。
   ★モックアップ（docs/mockups/refresh-issue.html の ?onboarding=on）から移した */
.ps-onboard { position: relative; display: inline-flex; align-items: center; }
.ps-onboard__btn {
  display: inline-flex; align-items: center; gap: 7px;
  height: 30px; padding: 0 12px 0 10px;
  border: 1px solid rgba(255, 255, 255, .26); border-radius: 999px;
  background: rgba(255, 255, 255, .04); color: #eaf1f8;
  font: inherit; font-size: 12.5px; white-space: nowrap; cursor: pointer;
}
.ps-onboard__btn::before {
  content: ""; flex: 0 0 14px; width: 14px; height: 14px; border-radius: 50%;
  background: conic-gradient(var(--c-sky) calc(var(--p, 0) * 1%), rgba(255, 255, 255, .22) 0);
  -webkit-mask: radial-gradient(circle, transparent 3.6px, #000 4px); mask: radial-gradient(circle, transparent 3.6px, #000 4px);
}
.ps-onboard__btn:hover { background: rgba(255, 255, 255, .12); }
.ps-onboard__btn[aria-expanded="true"] { background: rgba(255, 255, 255, .16); }
#ly-01-lbl-onboarding-count { font-family: var(--f-brand); color: var(--c-navy-weak); font-variant-numeric: tabular-nums; }
.ps-onboard__pop {
  position: absolute; top: calc(100% + 10px); left: 0; width: 372px; z-index: 60; text-align: left;
  padding: 6px 6px 8px;
  background: var(--c-pane-bg); color: var(--c-text); font-size: 13px; line-height: 1.5; white-space: normal;
  border: 1px solid var(--c-border); border-radius: var(--r-lg); box-shadow: var(--sh-pop);
}
.ps-onboard__head { display: flex; align-items: center; gap: 8px; padding: 6px 4px 6px 10px; }
.ps-onboard__title { font-weight: 700; font-size: 14px; }
.ps-onboard__count { font-family: var(--f-brand); font-size: 13px; color: var(--c-text-weak); }
.ps-onboard__spacer { flex: 1; }
.ps-onboard__close {
  width: 26px; height: 26px; display: grid; place-items: center; padding: 0;
  border: 0; border-radius: var(--r-md); background: none; cursor: pointer;
  color: var(--c-text-weak); font: inherit; font-size: 16px; line-height: 1;
}
.ps-onboard__close:hover { background: var(--c-accent-softer); color: var(--c-accent-ink); }
.ps-onboard__bar { height: 4px; margin: 2px 10px 8px; background: var(--c-border); border-radius: 2px; overflow: hidden; }
.ps-onboard__bar > span { display: block; height: 100%; border-radius: 2px; background: var(--c-accent); }
.ps-onboard__items { list-style: none; margin: 0; padding: 0; }
.ps-onboard__items li { display: flex; align-items: center; gap: 10px; min-height: 36px; padding: 4px 6px 4px 10px; border-radius: var(--r-md); }
.ps-onboard__check {
  flex: 0 0 18px; height: 18px; box-sizing: border-box; border: 1.5px solid #b6c3d1; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; font-size: 11px; color: var(--c-btn-fg);
}
.ps-onboard__items li.is-done .ps-onboard__check { background: var(--c-accent); border-color: var(--c-accent); }
.ps-onboard__items li.is-done .ps-onboard__text { color: var(--c-text-weak); text-decoration: line-through; }
.ps-onboard__text { flex: 1; min-width: 0; }
.ps-onboard__sub { color: var(--c-text-weak); margin-left: 4px; }
/* やり方を見る（21-2）。リンクの見た目のボタン */
.ps-onboard__how {
  flex: 0 0 auto; padding: 3px 7px; border: 0; border-radius: var(--r-sm); background: none; cursor: pointer;
  color: var(--c-link); font: inherit; font-size: var(--fs-small); white-space: nowrap;
}
.ps-onboard__how:hover { background: var(--c-accent-softer); }

/* ---- ツアーの吹き出し（Driver.js の popoverClass。Phase 21-2・決定184） ------------------------------
   Driver.js の既定（driver.css）を画面の見た目に寄せる。★モックアップ（docs/mockups/onboarding.css）から移した */
.driver-popover.ps-tour { font-family: inherit; border-radius: var(--r-lg); padding: 14px 16px 12px; max-width: 320px; color: var(--c-text); box-shadow: var(--sh-pop); }
.driver-popover.ps-tour .driver-popover-title { font-size: 15px; font-weight: 700; }
.driver-popover.ps-tour .driver-popover-description { font-size: 13px; line-height: 1.6; margin-top: 6px; }
.driver-popover.ps-tour .driver-popover-progress-text { font-size: 12px; color: var(--c-text-weak); }
.driver-popover.ps-tour .driver-popover-footer button {
  text-shadow: none; font-size: 12px; padding: 5px 12px; border-radius: var(--r-md);
  border: 1px solid var(--c-border-strong); background: var(--c-pane-bg); color: var(--c-accent-ink);
}
.driver-popover.ps-tour .driver-popover-footer .driver-popover-next-btn { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-btn-fg); }

/* 閉じたときの一言（PS.toast。数秒で消える） */
.ps-toast {
  position: fixed; left: 50%; top: calc(var(--h-header) + 14px); transform: translateX(-50%); z-index: 300;
  max-width: min(560px, calc(100vw - 32px));
  background: #1e2a37; color: #f2f6fa; padding: 9px 16px; border-radius: 10px; font-size: 12.5px; line-height: 1.6;
  box-shadow: var(--sh-pop);
}

/* SC-HLP-01 の目次の上: 「はじめに」（閉じたチェックリストを開き直す。21-1）と「ツアー」（画面のツアーへのリンク。21-2）。
   目次と本文は生成物なので、器を 3 行の格子にして、左の列に はじめに → ツアー → 目次、右の列に本文を通す
   （「はじめに」が隠れているときは、その行の高さが 0 になる） */
.ps-help { display: grid; grid-template-columns: 250px minmax(0, 1fr); grid-template-rows: auto auto minmax(0, 1fr); }
/* ★決定234: ヘルプも白い面（角丸 12px・薄い影）に載せる */
.ps-help { background: var(--c-surface); border: 1px solid var(--c-line); border-radius: var(--r-lg); box-shadow: var(--sh-panel); overflow: hidden; }
.ps-help > .ps-help__toc { grid-column: 1; grid-row: 3; }
.ps-help > .ps-help__body { grid-column: 2; grid-row: 1 / span 3; }
.ps-help__onboard, .ps-help__tours {
  justify-self: stretch; margin: 0; padding: 10px 14px 0;
  background: var(--c-left-bg); border-right: 1px solid var(--c-border-strong);
}
.ps-help__onboard { grid-column: 1; grid-row: 1; }
.ps-help__onboard[hidden] { display: none; }
.ps-help__tours { grid-column: 1; grid-row: 2; font-size: var(--fs-small); display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.ps-help__tours-head { color: var(--c-text-weak); }
.ps-help__tours a { color: var(--c-link); }
/* ---- 親課題の欄（Phase 23・決定189「入れて探す」。MD-ISU-02 と MD-ISU-03。手本: docs/mockups/issue-subtasks.html） ----
   候補は欄の下に重ねて出す（メンションの候補 .ps-mention__pop と同じ出方）。選んだ親は札（通知先の札と同じ色づかい）。
   MD-ISU-03 のふだん（読むだけ）は、ほかの読み取り専用の欄と同じ灰色の地（.ps-input.is-locked）に番号と件名を並べる */
.ps-parent { display: block; min-width: 0; }
.ps-parent__wrap { position: relative; display: block; }
.ps-parent__wrap[hidden] { display: none; }
.ps-parent__pop {
  position: absolute; left: 0; right: 0; top: calc(100% + 2px); z-index: 40;
  max-height: 320px; overflow-y: auto;
  background: var(--c-pane-bg);
  border: 1px solid var(--c-border);
  border-radius: 10px;
  box-shadow: var(--sh-pop);
}
.ps-parent__pop[hidden] { display: none; }
.ps-parent__item {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 4px 10px; border: none; border-bottom: 1px solid var(--c-border); background: none; cursor: pointer;
  font: inherit; font-size: var(--fs-base); line-height: 20px; text-align: left;
}
.ps-parent__item:hover, .ps-parent__item.is-active { background: var(--c-row-selected); }
.ps-parent__item .ps-badge { flex: 0 0 64px; width: 64px; padding: 0 4px; }
.ps-parent__item .ps-badge::before { display: none; }
.ps-parent__empty { display: block; padding: 8px 10px; color: var(--c-text-weak); font-size: var(--fs-small); }
.ps-parent__up { flex: 0 0 auto; font-size: 11px; color: var(--c-text-weak); white-space: nowrap; }
.ps-parent__no { flex: 0 0 auto; color: var(--c-text-weak); white-space: nowrap; }
.ps-parent__title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-parent__chip {
  display: inline-flex; align-items: center; gap: 8px; max-width: 100%; min-width: 0;
  padding: 3px 8px 3px 10px; border: 1px solid var(--c-accent-line); border-radius: 999px; background: var(--c-accent-soft);
}
.ps-parent__chip[hidden] { display: none; }
.ps-parent__path { display: inline-flex; align-items: baseline; gap: 6px; min-width: 0; max-width: 100%; }
.ps-parent__remove { flex: 0 0 auto; border: none; background: none; padding: 0 2px; cursor: pointer; color: var(--c-accent-ink); font-size: 12px; line-height: 1; }
.ps-parent__read { display: flex; align-items: baseline; gap: 6px; min-width: 0; min-height: 26px; box-sizing: border-box; }
.ps-parent__read[hidden] { display: none; }
/* ---- 課題の親子の右ペイン（23-4・決定188〜190。手本: docs/mockups/issue-subtasks.html の右ペイン A） ----
   木の線は、アクセントを地の色に 4 割混ぜた薄い青灰色（配色トークンは増やさない）。★23-5 の課題一覧の木も同じ色にする */
.ps-issuelink {
  border: none; background: none; padding: 0; cursor: pointer;
  font: inherit; color: var(--c-link);
}
.ps-issuelink:hover { text-decoration: underline; }
/* 親課題の行（属性の表の「件名」の上）。上の段から 1 行ずつ、2 段目は └ でつなぐ */
.ps-attrs td.ps-up__cell { padding-top: 3px; padding-bottom: 3px; }
.ps-up { position: relative; display: flex; align-items: center; gap: 6px; min-width: 0; height: 22px; padding-left: calc(var(--d) * 16px); }
.ps-up__elbow {
  position: absolute; left: calc((var(--d) - 1) * 16px + 5px); top: -4px; width: 8px; height: 15px;
  border-left: 1px solid color-mix(in srgb, var(--c-accent) 40%, var(--c-pane-bg));
  border-bottom: 1px solid color-mix(in srgb, var(--c-accent) 40%, var(--c-pane-bg));
}
.ps-up .ps-issuelink { flex: 0 0 auto; white-space: nowrap; }
.ps-up__title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 進み具合の札（_Progress）: 3 色の細い帯（左から 完了・処理済み・未解決）＋「完了した数/子と孫の数」 */
.ps-prog { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; }
.ps-prog__bar { display: inline-flex; width: 40px; height: 6px; background: var(--c-border); overflow: hidden; }
.ps-prog__bar i { display: block; height: 100%; }
.ps-prog__bar .is-closed   { background: var(--c-closed); }
.ps-prog__bar .is-resolved { background: var(--c-resolved); }
.ps-prog__bar .is-active   { background: var(--c-active); }
.ps-prog__num { min-width: 28px; font-size: 11px; line-height: 15px; color: var(--c-text-weak); font-variant-numeric: tabular-nums; }
/* 子課題の欄（_Subtasks。時系列の中＝詳細と「これまでのコメント」の間）。見出しの印は .ps-section と同じ */
.ps-kids { margin: 22px 0 10px; }
.ps-kids__head { display: flex; align-items: center; gap: 8px; min-height: 28px; font-size: 13px; }
.ps-kids__head::before { content: ""; flex: 0 0 3px; width: 3px; height: 13px; border-radius: 2px; background: var(--c-accent); }
.ps-kids__label { font-weight: 700; color: var(--c-ink); letter-spacing: .03em; white-space: nowrap; }
.ps-kids__rule { flex: 1 1 auto; border-bottom: 1px solid var(--c-border); }
.ps-kids__none { color: var(--c-text-weak); font-size: var(--fs-small); }
.ps-kids__head .ps-action { min-width: 0; height: 26px; padding: 0 9px; font-size: 12px; }
/* ★29-2（決定236・手本）: 角の丸い枠の中に 1 件 36px。担当者は小さな丸＋名前、状態は小さな札（点つき） */
.ps-kids__list { list-style: none; margin: 10px 0 0; padding: 0; border: 1px solid var(--c-line); border-radius: 10px; overflow: hidden; }
.ps-kid {
  position: relative; display: grid; grid-template-columns: 78px minmax(0, 1fr) 118px 76px; align-items: center; gap: 0 10px;
  height: 36px; padding: 0 12px; border-top: 1px solid var(--c-line-soft); font-size: 12.5px; cursor: pointer;
}
.ps-kid:first-child { border-top: 0; }
.ps-kid:hover { background: var(--c-row-hover); }
.ps-kid__no { font-family: var(--f-brand); color: var(--c-text-weak); white-space: nowrap; }
.ps-kid__person { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.ps-kid__title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: calc(var(--d) * 14px + 2px); }
.ps-kid__who { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 担当者がいない子: 未完了は点線の丸＋「未アサイン」、完了は「—」（見本のとおり） */
.ps-kid__none { color: var(--c-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ps-kid__who:empty::after { content: "\2014"; color: var(--c-faint); }
.ps-kid__none + .ps-kid__who { display: none; }
/* 状態の札は一覧の .ps-badge（grid-area: s）を外して、この行の列に置く（小さな札・点つき） */
.ps-kid .ps-badge { grid-area: auto; justify-self: start; height: 18px; padding: 0 7px 0 6px; gap: 5px; font-size: 11px; border-radius: 5px; }
.ps-kid .ps-badge::before { flex-basis: 6px; width: 6px; height: 6px; }
/* 木の線は件名の列の左端から（1 段 14px。├ は上から下まで、└ は上から真ん中まで） */
.ps-kid__tree { position: absolute; left: 100px; top: 0; bottom: 0; width: 0; pointer-events: none; }
.ps-kid__tree i { position: absolute; top: 0; bottom: 0; width: 0; border-left: 1px solid color-mix(in srgb, var(--c-accent) 40%, var(--c-pane-bg)); }
.ps-kid__tree i.is-elbow { bottom: 50%; }
.ps-kid__tree b { position: absolute; top: 50%; width: 9px; height: 0; border-top: 1px solid color-mix(in srgb, var(--c-accent) 40%, var(--c-pane-bg)); }
/* 既存の課題を子にする（MD-ISU-06）。候補は欄の下に重ねて出すので、本文の中で切れないよう高さを取る */
.ps-modal--adopt .ps-modal__box { max-width: 820px; }
.ps-modal--adopt .ps-modal__body { min-height: 440px; }
.ps-modal--adopt .ps-parent__read { padding: 2px 6px; }
/* 親を完了にするときの確かめ（MD-ISU-03・決定190）。状態の 3 色は札だけに使い、枠は無彩色。多いときは一覧の中だけスクロール（6 行ぶん） */
.ps-unfinished { flex: 0 0 auto; margin: 4px 0 8px; padding: 10px 12px; border: 1px solid var(--c-border-strong); border-radius: 10px; background: var(--c-label-bg); }
.ps-unfinished[hidden] { display: none; }
.ps-unfinished__head { margin: 0 0 6px; font-size: var(--fs-base); line-height: 20px; }
.ps-unfinished__list { list-style: none; margin: 0; padding: 0; max-height: 157px; overflow-y: auto; border-top: 1px solid var(--c-border); }
.ps-unfinished__row {
  display: grid; grid-template-columns: auto minmax(0, 1fr) 110px 60px; align-items: center; gap: 0 10px;
  height: 26px; border-bottom: 1px solid var(--c-border); font-size: var(--fs-small);
}
.ps-unfinished__no { color: var(--c-text-weak); white-space: nowrap; }
.ps-unfinished__title, .ps-unfinished__who { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-unfinished__row .ps-badge { grid-area: auto; justify-self: stretch; font-size: 11px; height: 18px; padding: 0 4px; }
.ps-unfinished__row .ps-badge::before { display: none; }
/* ---- 課題一覧の親子（23-5・決定187。手本: docs/mockups/issue-subtasks.html の一覧 B） ----
   「最上位だけ」のときだけ、子を持つ行の左端の四角がつまみになり、開くと子と孫が線でつながって出る。
   木の線の色は 23-4 と同じ（アクセントを地に混ぜた薄い青灰色）。 */
.ps-row__title.has-prog, .ps-row__title.has-up, .ps-row__title.is-tree { display: flex; align-items: center; }
.ps-row__text { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-row__title .ps-prog { margin-left: 8px; }
/* 子の行の、親の課題番号（平らな一覧で件名の前に小さな札。★29-2: 番号は Jost） */
.ps-row__up {
  flex: 0 0 auto; margin-right: 8px; height: 18px; padding: 0 6px; border-radius: 5px; background: #edf2f7;
  font-family: var(--f-brand); font-size: 11.5px; line-height: 18px; letter-spacing: .02em; color: var(--c-text-weak);
}
/* 開いた下に並ぶ子と孫（字下げと線は件名の列の中。課題番号の列は揃えたまま）。★29-2: 左の線はやめた（選んだ行の藍の縦線と見分けるため） */
.ps-row.is-sub, .ps-row.is-sub:nth-child(even) { background: #f6f9fc; }
.ps-row.is-sub:hover { background: var(--c-row-hover); }
.ps-row.is-sub.is-selected { background: var(--c-row-selected); }
.ps-row__title.is-tree { position: relative; overflow: visible; padding-left: calc(var(--d) * 16px); }
/* 線: 1 段 16px。├ は上から下まで、└ は上から真ん中まで。上の段に続きの兄弟がいればその段の縦線も引く（線の位置はつまみの真ん中＝_Search が 16 × 段 + 8px で置く） */
.ps-row__tree { position: absolute; left: 0; top: -5px; bottom: -5px; width: calc(var(--d) * 16px); pointer-events: none; }
.ps-row__tree i { position: absolute; top: 0; bottom: 0; width: 0; border-left: 1.5px solid #bfd0e0; }
.ps-row__tree i.is-elbow { bottom: 50%; }
.ps-row__tree b { position: absolute; top: 50%; width: 8px; height: 0; border-top: 1.5px solid #bfd0e0; }
.ps-row__tree b.is-long { width: 27px; }   /* 子の無い行はつまみの分も線を伸ばし、件名の手前まで届かせる */
/* 開閉のつまみ（★29-2: 左端の列は ● だけにして、つまみは件名の列の頭へ。藍の山の印が開くと下を向く）。子の無い行は同じ幅だけ空けて件名を揃える */
.ps-tw {
  flex: 0 0 16px; width: 16px; height: 16px; margin-right: 6px; position: relative; cursor: pointer;
  display: inline-grid; place-items: center; border-radius: 4px; color: var(--c-accent);
}
.ps-tw::before {
  content: ""; width: 12px; height: 12px; background: currentColor; transition: transform .15s;
  -webkit-mask: var(--i-chev-right) center / 12px no-repeat; mask: var(--i-chev-right) center / 12px no-repeat;
}
.ps-tw.is-open::before { transform: rotate(90deg); }
.ps-tw:hover { background: rgba(65, 123, 167, .12); }
.ps-tw::after { content: ""; position: absolute; inset: -10px -6px; }   /* 押せる範囲を広げる */
.ps-tw.is-leaf { cursor: default; }
.ps-tw.is-leaf::before, .ps-tw.is-leaf::after { content: none; }
.ps-tw.is-leaf:hover { background: none; }

/* ---- 課題一覧の見出しの「←」「→」＝一段上げる・一段下げる（23-9・決定197。手本: docs/mockups/issue-subtasks.html?data=now） ----
   件名の見出しと同じ区画（grid-area: t）の右端に重ねる — 見出しの文字の要素はそのまま（テストと読み上げが「件名」だけを読む）。
   地も枠も持たないアイコンのボタン（コピーのボタンと同じ作り）。押せるときはアクセントの色（＝操作できる）、押せないときは薄い灰色。
   見出しの帯の高さ（30px）は変えない（ボタンは 22px） */
.ps-list__head .ps-level { grid-area: t; justify-self: end; display: inline-flex; align-items: center; gap: 2px; }
.ps-level__btn {
  border: none; background: none; margin: 0; padding: 2px;
  line-height: 0; cursor: pointer; color: var(--c-accent); border-radius: var(--r-btn);
}
.ps-level__btn:hover:not(:disabled) { background: var(--c-row-hover); }
.ps-level__btn svg { width: 18px; height: 18px; display: block; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linejoin: round; }
.ps-level__btn:disabled { color: var(--c-btn-disabled-fg); opacity: .55; cursor: default; }

/* ---- AI ヘルプ（Phase 26・PSTUD-56・決定202〜205。手本: docs/mockups/ai-help.html） --------------------------------
   ヘッダーの「AI に質問」（開いている間は塗る＝チェックリストのボタンと同じ）と、ヘッダーとフッターのあいだに右から出るパネル。
   暗幕は掛けない（後ろの画面も触れる）。答えの本文はサーバーが作る HTML（CMarkdown）なので、見た目は .ps-md と同じ */
.ps-ai__entry {
  display: inline-flex; align-items: center; gap: 6px;
  height: 30px; padding: 0 12px 0 10px;
  border: 1px solid rgba(255, 255, 255, .26); border-radius: 999px;
  background: rgba(255, 255, 255, .04); color: #eaf1f8;
  font: inherit; font-size: 12.5px; white-space: nowrap; cursor: pointer;
}
.ps-ai__entry::before {
  content: ""; flex: 0 0 15px; width: 15px; height: 15px; background: var(--c-sky);
  -webkit-mask: var(--i-spark) no-repeat center / contain; mask: var(--i-spark) no-repeat center / contain;
}
.ps-ai__entry:hover:not(:disabled) { background: rgba(255, 255, 255, .12); }
.ps-ai__entry[aria-expanded="true"] { background: rgba(255, 255, 255, .18); border-color: rgba(255, 255, 255, .42); }
/* 外部組織ユーザーには押せない形で出す（AI の機能は社員だけ＝26-14・PSTUD-71・決定242。手本: docs/mockups/ai-staff-only.html）。
   紺のヘッダーの上なので、形はそのまま薄くする（「AI で要約」は ps.css の .ps-action:disabled＝ほかの押せないボタンと同じ灰色） */
.ps-ai__entry:disabled { opacity: .45; cursor: not-allowed; }
.ps-ai {
  position: fixed; top: var(--h-header); right: 0; bottom: var(--h-footer); width: 440px; max-width: 100vw; z-index: 40;
  display: flex; flex-direction: column; background: var(--c-pane-bg); color: var(--c-text); font-size: 13px;
  border-left: 1px solid var(--c-border); box-shadow: -8px 0 28px rgba(12, 28, 44, .14);
}
.ps-ai[hidden] { display: none; }
.ps-ai__head { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--c-border); }
.ps-ai__title { flex: 1; margin: 0; font-weight: 700; font-size: 14px; }
.ps-ai__close { border: 0; background: none; cursor: pointer; color: var(--c-text-weak); font-size: 18px; line-height: 1; padding: 2px 4px; }
.ps-ai__close:hover { color: var(--c-text); }
.ps-ai__body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 12px; }
.ps-ai__foot { flex: 0 0 auto; margin: 0; padding: 10px 12px 12px; border-top: 1px solid var(--c-border); }
.ps-ai__foot textarea.ps-input { width: 100%; box-sizing: border-box; min-height: 60px; }
.ps-ai__row { display: flex; justify-content: flex-end; margin-top: 6px; }
.ps-ai__turn + .ps-ai__turn { margin-top: 16px; }
.ps-ai__q {
  margin: 0 0 10px auto; max-width: 85%; width: fit-content; padding: 8px 12px; border-radius: 12px 12px 3px 12px;
  background: var(--c-row-selected); line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere;
}
.ps-ai__a { line-height: 1.75; }
.ps-ai__a p { margin: 0 0 8px; }
.ps-ai__a ol, .ps-ai__a ul { margin: 0 0 8px; }
.ps-ai__a li { margin: 2px 0; }
.ps-ai__links {
  margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--c-border);
  display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; align-items: baseline;
}
.ps-ai__links > span:nth-child(even) { display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; }
.ps-ai__label { color: var(--c-text-weak); font-size: 12px; white-space: nowrap; }
.ps-ai__links a { color: var(--c-link); }
.ps-ai__links a.ps-ai__go { display: inline-block; padding: 2px 10px; border: 1px solid var(--c-accent-line); border-radius: 999px; background: var(--c-accent-softer); text-decoration: none; font-size: 12px; }
.ps-ai__links a.ps-ai__go:hover { background: var(--c-row-hover); }
.ps-ai__wait { display: flex; align-items: center; gap: 8px; color: var(--c-text-weak); }
.ps-ai__dots { display: inline-flex; gap: 4px; }
.ps-ai__dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--c-accent); opacity: .3; animation: ps-ai-blink 1.2s infinite; }
.ps-ai__dots i:nth-child(2) { animation-delay: .2s; }
.ps-ai__dots i:nth-child(3) { animation-delay: .4s; }
@keyframes ps-ai-blink { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
.ps-ai__sys { margin-top: 6px; padding: 8px 10px; border-left: 3px solid var(--c-leader); background: var(--c-label-bg); line-height: 1.7; }
.ps-ai__sys .ps-action { margin-top: 6px; }
/* 答えられなかった問いの下の一言（記録される＝26-3・決定205 前提 1）。地も枠も持たない小さな字 */
.ps-ai__note { margin-top: 6px; color: var(--c-text-weak); font-size: 11px; line-height: 1.6; }

/* ---- 課題の要約（26-5・PSTUD-53・決定212。手本: docs/mockups/issue-summary.html） --------------------------------------
   右ペインの「これまでのコメント」の見出しのすぐ下（最初のコメントの上）に出る枠。時系列と一緒にスクロールする。
   中身はサーバーが作る HTML（CMarkdown）なので .ps-md。考えている間の点は AI ヘルプの .ps-ai__dots を使う */
.ps-sum { margin: 0 0 12px; border: 1px solid #cfdeeb; border-radius: var(--r-lg); background: linear-gradient(180deg, #f3f8fc 0%, #ffffff 70%); overflow: hidden; }
.ps-sum + .ps-post { border-top: none; }
.ps-sum__head { display: flex; align-items: center; gap: 8px; padding: 7px 8px 7px 12px; border-bottom: 1px solid #e1eaf2; }
.ps-sum__title { font-weight: 700; }
.ps-sum__at { color: var(--c-text-weak); font-size: 11px; white-space: nowrap; }
.ps-sum__spacer { flex: 1; }
.ps-sum__close { border: 0; background: none; cursor: pointer; color: var(--c-text-weak); font-size: 15px; line-height: 1; padding: 2px 4px; }
.ps-sum__close:hover { color: var(--c-text); }
.ps-sum__body { padding: 10px 14px 12px; line-height: 1.75; }
.ps-sum__body .ps-md p { margin: 0 0 2px; }
.ps-sum__body .ps-md ul { margin: 0 0 8px; padding-left: 1.4em; }
.ps-sum__body .ps-md li { margin: 1px 0; }
.ps-sum__wait { display: flex; align-items: center; gap: 8px; color: var(--c-text-weak); }
.ps-sum__sys { margin-top: 6px; padding: 8px 10px; border-left: 3px solid var(--c-leader); background: var(--c-label-bg); line-height: 1.7; }
.ps-sum__body > .ps-sum__sys:first-child { margin-top: 0; }
.ps-sum__sys .ps-action { margin-top: 6px; }
/* 要約を作っている間は「AI で要約」を押した姿にする（右ペインと、課題のモーダルの見出し＝26-12・決定220） */
#sc-isu-01-btn-summary[aria-pressed="true"], #md-isu-03-btn-summary[aria-pressed="true"] { background: var(--c-row-selected); }

/* ---- 読むだけの長い文（SC-AIH-01 の質問と AI の答え。26-3・決定206 ③。手本: docs/mockups/ai-help-admin.html） ----
   改行をそのまま見せ、欄だと分かる枠を持つ（直せないので .ps-input は使わない） */
.ps-quote {
  padding: 8px 10px; border: 1px solid var(--c-border); border-radius: var(--r-md);
  background: var(--c-input-bg); line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere;
}
.ps-quote--answer { background: var(--c-label-bg); }


/* ---- AI ユーザーの作業中・順番待ち（26-7・PSTUD-58・決定214 A。手本: docs/mockups/ai-worker.html） --------------------------
   右ペインの担当者の名前の下に 2 行の札（既定の幅 500px では担当者の欄が狭く、1 行に詰めると右ペインの外へはみ出した）。
   一覧の担当者の横には小さな点（作業中は青で明滅・順番待ちは灰）。札の中身は issue.js が 10 秒ごとに新しくする */
.ps-aiw { display: block; width: fit-content; max-width: 100%; box-sizing: border-box; margin: 4px 0 0; padding: 2px 9px 3px; border: 1px solid var(--c-border);
          border-radius: 10px; background: var(--c-surface-2); font-size: 11.5px; line-height: 17px; color: var(--c-ink-2); }
.ps-aiw__dot, .ps-aiw-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--c-active); vertical-align: 1px;
                            animation: ps-aiw-pulse 1.4s ease-in-out infinite; }
.ps-aiw__dot { margin-right: 4px; }
.ps-aiw.is-wait .ps-aiw__dot, .ps-aiw-dot.is-wait { background: var(--c-text-weak); animation: none; }
.ps-aiw__sub { display: block; color: var(--c-text-weak); }   /* 欄が狭いときは折り返す（日付入りの 2 行目は既定の幅で欄の外へはみ出した） */
.ps-aiw-dot { margin-left: 5px; }
@keyframes ps-aiw-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .ps-aiw__dot, .ps-aiw-dot { animation: none; } }
/* AI ユーザーの結果のコメントの最後の 1 行（作業の分・費用・Web 検索の回数）。本文は Markdown なので斜体の段落 1 つで書き、ここで小さく薄くする */
.ps-md > p:last-child > em:only-child { font-size: 11px; color: var(--c-text-weak); font-style: normal; }

/* ---- My Task（28-3・PSTUD-67・決定224）: 課題一覧の左ペインのいちばん上の 1 行 -------------------------
   手本: docs/mockups/my-task.html（.mt-lock・.mt-count）。鍵の印と、終わっていない件数の丸い札 */
.ps-mytask__lock {
  flex: 0 0 auto; width: 13px; height: 13px; align-self: center;
  fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round;
}
.ps-mytask__count {
  flex: 0 0 auto; min-width: 22px; height: 18px; padding: 0 6px;
  display: inline-grid; place-items: center;
  font-family: var(--f-brand); font-size: 11.5px; line-height: 1; color: var(--c-text-weak); font-variant-numeric: tabular-nums;
  border: 1px solid var(--c-border); border-radius: 999px; background: var(--c-surface-2);
}
.ps-filter__link.is-selected .ps-mytask__count { color: var(--c-accent-ink); border-color: var(--c-accent-line); background: var(--c-surface); }
/* 読むだけの画面の 1 行の要約（My Task の使用量＝SC-ADM-13 の「社員 n 人のうち…」） */
.ps-summary { margin: 4px 0 10px 0; font-size: var(--fs-base); }

/* ---- My Task（28-4・PSTUD-68・決定225〜227）: 入力の行・期限の列・完了した行 -------------------------
   手本: docs/mockups/my-task.css（.mt-quick・.ps-row__due・.ps-row.is-done） */
/* 入力の行（決定225）。列見出しの上に 1 行: 件名（残りの幅ぜんぶ）＋ 期限 ＋「足す」。
   ★29-2（決定236・手本 refresh-issue.html の #mytask）: 足す場所だと分かるように、件名の欄は点線の枠と頭に藍の ＋ */
.ps-quick {
  flex: 0 0 auto;
  display: flex; align-items: center; gap: 8px;
  padding: 0 16px 12px;
}
.ps-quick__field { position: relative; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; }
.ps-quick__field::before {
  content: ""; position: absolute; left: 11px; width: 15px; height: 15px; background: var(--c-accent); pointer-events: none;
  -webkit-mask: var(--i-plus) center / 15px no-repeat; mask: var(--i-plus) center / 15px no-repeat;
}
.ps-quick .ps-quick__title { flex: 1 1 auto; min-width: 0; height: 34px; padding-left: 34px; border: 1px dashed #b3c7da; border-radius: 10px; }
.ps-quick .ps-quick__title:hover { border-color: var(--c-accent-line); }
.ps-quick .ps-quick__title:focus { border-style: solid; }
.ps-quick__label { flex: 0 0 auto; font-size: 12px; color: var(--c-text-weak); white-space: nowrap; }
.ps-quick .ps-quick__due { flex: 0 0 auto; width: 150px; height: 34px; }
.ps-quick .ps-action { height: 34px; }
/* 期限の列（決定226）: 担当者の列と同じ位置。過ぎたもの＝赤・今日＝藍の太字・明日＝太字。完了したものは日付だけ。★29-2: 日付は番号と同じ Jost */
.ps-row__due { grid-area: a; justify-self: start; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
               font-family: var(--f-brand); font-size: 12.5px; letter-spacing: .02em; color: var(--c-ink-2); font-variant-numeric: tabular-nums; }
.ps-row__due.is-over { color: var(--c-error); }
.ps-row__due.is-today { font-family: var(--f-text); font-weight: 700; color: var(--c-accent-ink); }
.ps-row__due.is-tomorrow { font-family: var(--f-text); font-weight: 700; color: var(--c-ink); }
/* 完了した行（決定227 ②）: 件名に取り消し線。番号と期限も薄く */
.ps-row.is-done .ps-row__text { text-decoration: line-through; color: var(--c-text-weak); }
.ps-row.is-done .ps-row__no, .ps-row.is-done .ps-row__due { color: var(--c-faint); }

/* ★英語の画面だけ、管理メニューを丸のメニューへ移す幅を広げる（決定235 ③）— 英語は語が長く、「はじめに」の札と「AI に質問」がそろうと
   ヘッダーに約 1,122px 要る（日本語は 1,091px）。1100px の境のままだと 1101〜1106px で丸の右が切れた（Quinn 29-1 の気づき ①）。日本語の見た目は変えない */
@media (max-width: 1130px) {
  html[lang="en"] .ps-nav--admin, html[lang="en"] .ps-header__div { display: none; }
  html[lang="en"] .ps-menu__admin { display: block; }
}

/* =====================================================================
   ★Phase 29-2 課題一覧と My Task（決定234・236。手本 docs/mockups/refresh-issue.html。My Task は #mytask）
   一覧の行（鞠の列・頭文字の丸・1 文字の状態）・右ペイン（件名の見出し・4 つの札・時系列・登録 → 処理 → 確認の 3 歩）・
   モーダルの細部・My Task の形。★id・data-testid・読み上げの語はそのままで、見た目だけを見本に寄せる
   ===================================================================== */

/* ---- 一覧の件数（数を大きく。Jost）と「課題を登録」の ＋ ---- */
#sc-isu-01-lbl-count { display: inline-flex; align-items: baseline; gap: 3px; font-size: 12.5px; color: var(--c-muted); white-space: nowrap; }
#sc-isu-01-lbl-count b { font-family: var(--f-brand); font-size: 17px; font-weight: 500; line-height: 1; color: var(--c-ink); font-variant-numeric: tabular-nums; }
.ps-count__note { margin-left: 6px; font-size: 12px; color: var(--c-muted); }
#sc-isu-01-btn-issue-new::before {
  content: ""; flex: 0 0 15px; width: 15px; height: 15px; background: currentColor;
  -webkit-mask: var(--i-plus) center / 15px no-repeat; mask: var(--i-plus) center / 15px no-repeat;
}

/* ---- 左ペイン: 名前が長くても札（● 自分・AI）は切らない（名前のほうを … で縮める。グリッドの項目は既定では中身より狭くならない） ---- */
.ps-filter__item { min-width: 0; }

/* ---- 一覧の行 ---- */
.ps-list__head .ps-col--a { justify-self: center; }
.ps-list__head.is-mytask .ps-col--a { justify-self: start; }
.ps-row.is-selected .ps-row__text { font-weight: 500; }
.ps-row.is-closed .ps-row__text { color: var(--c-muted); }
.ps-prog__bar { width: 44px; border-radius: 3px; background: #e5ebf1; }
.ps-prog__num { min-width: 0; font-family: var(--f-brand); font-size: 12px; line-height: 1; }
/* My Task の一覧（期限の列）: 担当の丸の列の代わりに 84px。朱の ● は付けない（_Search） */
.ps-list__head.is-mytask, .ps-list.is-mytask .ps-row { grid-template-columns: 14px 84px 92px minmax(0, 1fr) 84px 36px; }
.ps-center.is-nopro .ps-list__head.is-mytask, .ps-center.is-nopro .ps-list.is-mytask .ps-row { grid-template-columns: 14px 92px minmax(0, 1fr) 84px 36px; }
/* 一覧が狭いとき（左ペインを開いた 125%・iPad の横で左を畳んだとき）は列の間を詰める（見本の §10） */
@container (width < 760px) {
  .ps-row, .ps-list__head { column-gap: 10px; }
}

/* ---- 人の丸の大きさと種類（丸そのものは ps.css の .ps-avatar） ---- */
.ps-avatar--xs { --av: 18px; }
.ps-avatar--chip { --av: 20px; }
.ps-avatar--md { --av: 24px; }
.ps-avatar--post { --av: 32px; }
/* 担当者のいない課題（未アサイン）は点線の丸 */
.ps-avatar--none { background: transparent; border: 1.5px dashed #bcc8d4; }
/* AI の仲間（人ではない利用者）は紺の丸に空色の字（決定234 の紺＝枠の色。人の 8 色とは分ける） */
.ps-avatar.ps-avatar--ai { --av-bg: var(--c-navy); color: var(--c-sky); }

/* ---- 右ペイン: 操作ボタン ---- */
.ps-right__spacer { flex: 1 1 auto; }
.ps-flow { display: inline-flex; flex-wrap: wrap; gap: 6px 4px; margin-left: 4px; }
.ps-action--open::before {
  content: ""; flex: 0 0 15px; width: 15px; height: 15px; background: currentColor;
  -webkit-mask: var(--i-open) center / 15px no-repeat; mask: var(--i-open) center / 15px no-repeat;
}
/* 印だけのボタン（ごみ箱）。語は title と読み上げ（ボタンの文字は大きさ 0 で残す — 押したときの e.target はボタンのまま） */
.ps-iconbtn {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; padding: 0;
  border: 1px solid transparent; border-radius: var(--r-md); background: transparent;
  font: inherit; font-size: 0; line-height: 0; color: var(--c-muted); cursor: pointer;
  transition: background .12s, color .12s;
}
.ps-iconbtn:hover { background: var(--c-accent-softer); color: var(--c-accent-ink); }
.ps-iconbtn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--c-ring); }
.ps-iconbtn--danger:hover { background: var(--c-error-bg); color: var(--c-error); }
.ps-iconbtn--trash::before {
  content: ""; width: 16px; height: 16px; background: currentColor;
  -webkit-mask: var(--i-trash) center / 16px no-repeat; mask: var(--i-trash) center / 16px no-repeat;
}
.ps-right__note { margin: 10px 18px 0; }

/* ---- 右ペイン: プロジェクト › 課題番号・親課題・件名の見出し ---- */
.ps-right__head { flex: 0 0 auto; padding: 14px 18px 0; }
.ps-crumb { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 12px; color: var(--c-muted); }
.ps-crumb__project { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-crumb__sep {
  flex: 0 0 12px; width: 12px; height: 12px; background: var(--c-faint);
  -webkit-mask: var(--i-chev-right) center / 12px no-repeat; mask: var(--i-chev-right) center / 12px no-repeat;
}
.ps-crumb__no { flex: 0 0 auto; font-family: var(--f-brand); font-size: 13.5px; font-weight: 500; letter-spacing: .03em; color: var(--c-ink-2); }
/* My Task は頭に鍵の印（左ペインの My Task と同じ） */
.ps-crumb--mytask::before {
  content: ""; flex: 0 0 12px; width: 12px; height: 12px; background: var(--c-muted);
  -webkit-mask: var(--i-lock) center / 12px no-repeat; mask: var(--i-lock) center / 12px no-repeat;
}
.ps-up__cell { display: flex; align-items: flex-start; gap: 8px; min-width: 0; margin-top: 8px; font-size: 12px; color: var(--c-muted); }
.ps-up__label { flex: 0 0 auto; line-height: 20px; }
.ps-up__rows { flex: 1 1 auto; min-width: 0; }
.ps-up__cell .ps-up { height: 20px; }
.ps-up__cell .ps-issuelink {
  font-family: var(--f-brand); font-size: 12.5px; letter-spacing: .02em; color: var(--c-accent-ink);
  text-decoration: underline; text-decoration-color: rgba(45, 95, 134, .35); text-underline-offset: 3px;
}
.ps-up__cell .ps-issuelink:hover { text-decoration-color: currentColor; }
.ps-up__cell .ps-up__title { color: var(--c-ink-2); }
.ps-right__title {
  margin: 6px 0 0; font-size: 18px; line-height: 1.55; font-weight: 500; color: var(--c-ink);
  letter-spacing: .01em; font-feature-settings: "palt"; overflow-wrap: anywhere; text-wrap: pretty;
}
.ps-right__title .ps-title { font-size: inherit; font-weight: inherit; }
.ps-right__title .ps-scope { margin-right: 8px; vertical-align: 3px; }

/* ---- 右ペイン: 4 つの札（担当者・状態／優先度・課題の種類）。My Task は 3 つを 1 段（期限・状態・優先度） ---- */
.ps-props {
  display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
  margin: 14px 0 0; border: 1px solid var(--c-line); border-radius: 10px;
}
.ps-props > div { min-width: 0; padding: 8px 12px 9px; }
.ps-props > div:nth-child(odd) { border-right: 1px solid var(--c-line); }
.ps-props > div:nth-child(n+3) { border-top: 1px solid var(--c-line); }
.ps-props dt { font-size: 11.5px; line-height: 1.4; color: var(--c-muted); }
.ps-props dd { margin: 4px 0 0; min-height: 26px; min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; font-size: 13px; }
.ps-props__sub { font-size: 12px; color: var(--c-muted); }
.ps-props--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ps-props--3 > div:nth-child(n) { border-top: 0; border-right: 0; }
.ps-props--3 > div:nth-child(n+2) { border-left: 1px solid var(--c-line); }
/* あなたの番（担当者があなたで完了でない）: 朱の ● と語 */
.ps-turn { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--c-ink-2); white-space: nowrap; }
.ps-turn::before { content: ""; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--c-ball); }
/* 優先度の印（棒 3 本。data-level＝高 3・中 2・低 1） */
.ps-prio { display: inline-flex; align-items: center; gap: 7px; }
.ps-prio::before {
  content: ""; flex: 0 0 11px; width: 11px; height: 11px; background: var(--c-accent);
  -webkit-mask: var(--i-prio-2) center / 11px no-repeat; mask: var(--i-prio-2) center / 11px no-repeat;
}
.ps-prio[data-level="3"]::before { -webkit-mask-image: var(--i-prio-3); mask-image: var(--i-prio-3); }
.ps-prio[data-level="1"]::before { -webkit-mask-image: var(--i-prio-1); mask-image: var(--i-prio-1); }
/* AI の仲間の作業中・順番待ちの札は、担当者の札の中で名前の下の行 */
.ps-props .ps-aiw { flex: 1 0 100%; margin: 2px 0 0; }
/* 空の値は「—」（format.md §7.2。文字は CSS で描き、要素の中身は空のまま） */
.ps-props .is-empty::after, .ps-life .is-empty::after { content: "\2014"; color: var(--c-faint); }
/* 担当者がいない未完了の課題は、点線の丸＋「未アサイン」（見本のとおり。そのときは「—」を描かない） */
.ps-props__none { color: var(--c-faint); }
.ps-props__none + .is-empty::after { content: none; }

/* ---- 右ペイン: 時系列（詳細・子課題・これまでのコメント） ---- */
#sc-isu-01-grd-detail-timeline { margin-top: 0; padding: 2px 18px 18px; }
/* 詳細は区画の見出し（藍の縦線・太字・細い横罫）。コピーは見出しの右端 */
.ps-post--desc { position: relative; display: flow-root; padding: 0; border-top: 0; }   /* flow-root: 見出しの上の余白が外へ抜けない（コピーの位置がずれないように） */
.ps-post--desc > .ps-post__label {
  display: flex; align-items: center; gap: 8px; min-height: 28px; margin: 14px 0 10px; padding: 0;
  border: 0; border-radius: 0; background: none;
  font-size: 13px; font-weight: 700; line-height: 1.4; letter-spacing: .03em; color: var(--c-ink);
}
.ps-post--desc > .ps-post__label::before { content: ""; flex: 0 0 3px; width: 3px; height: 13px; border-radius: 2px; background: var(--c-accent); }
.ps-post--desc > .ps-post__label::after { content: ""; flex: 1 1 auto; height: 1px; margin-right: 34px; background: var(--c-line); }
.ps-post--desc > .ps-copy { top: 16px; right: 0; }
.ps-post--desc > .ps-post__body { margin: 0; font-size: 13.5px; line-height: 1.8; overflow-wrap: anywhere; }
.ps-timeline > .ps-section { margin: 22px 0 12px; }
.ps-section__sub { flex: 0 0 auto; font-size: 12px; font-weight: 400; letter-spacing: 0; color: var(--c-muted); }
/* これまでのコメント: 左の縦線に書いた人の丸を並べ、コメントは吹き出しの枠（記録が 1 本の物語として読めるように） */
.ps-feed { position: relative; }
.ps-feed::before { content: ""; position: absolute; left: 15px; top: 8px; bottom: 16px; width: 2px; border-radius: 2px; background: var(--c-line-soft); }
.ps-feed > .ps-post { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 0 12px; padding: 0 0 16px; border-top: 0; }
.ps-feed > .ps-post > .ps-avatar { position: relative; z-index: 1; box-shadow: 0 0 0 4px var(--feed-bg, var(--c-surface)); }
.ps-post__main { min-width: 0; }
.ps-feed .ps-post__meta { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-start; gap: 2px 10px; min-height: 32px; font-size: 12px; color: var(--c-muted); }
.ps-feed .ps-post__meta > span:first-child { font-variant-numeric: tabular-nums; }
/* コメントは書いた人の名前が先（形は「日時・書いた人」のまま。並びだけ入れ替える） */
.ps-feed .ps-post__main > .ps-post__meta > span:nth-child(2) { order: -1; font-size: 13px; font-weight: 500; color: var(--c-ink); }
.ps-feed .ps-post__actions button { font-size: 12px; }
.ps-feed .ps-post__card { margin-top: 2px; padding: 10px 14px 11px; border: 1px solid var(--c-line); border-radius: 3px 12px 12px 12px; background: var(--c-surface); }
.ps-feed .ps-post__card > .ps-post__body { margin: 0; font-size: 13.5px; line-height: 1.75; overflow-wrap: anywhere; }
.ps-feed .ps-post__card .ps-post__change { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--c-line); text-align: left; font-size: 12px; color: var(--c-muted); }
/* 変更だけの記録: 小さな点と 1 行（日時・した人・変更） */
.ps-feed > .ps-post--change { display: flex; flex-wrap: wrap; align-items: center; column-gap: 12px; row-gap: 0; min-height: 24px; padding: 0 0 14px 44px; }
.ps-feed > .ps-post--change > .ps-post__node { position: absolute; left: 0; top: 0; z-index: 1; width: 32px; height: 24px; display: grid; place-items: center; }
.ps-post__node::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--c-surface); border: 2px solid #c4d1de; box-shadow: 0 0 0 4px var(--feed-bg, var(--c-surface)); }
.ps-feed > .ps-post--change > .ps-post__meta { min-height: 24px; gap: 0 12px; }
.ps-feed > .ps-post--change > .ps-post__change { margin: 0; padding: 0; border: 0; text-align: left; font-size: 12px; line-height: 24px; color: var(--c-ink-2); }

/* ---- 右ペインの下端: 登録 → 処理 → 確認 の 3 歩（My Task は 登録 → 完了 の 2 歩。済んだ歩は藍） ---- */
.ps-right__foot { padding: 12px 18px 14px; background: var(--c-surface-2); border-radius: 0 0 var(--r-lg) var(--r-lg); }
.ps-life { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 14px; }
.ps-life--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ps-life > li { position: relative; min-width: 0; padding-top: 20px; }
.ps-life > li::after { content: ""; position: absolute; top: 6px; left: 18px; right: -10px; height: 2px; border-radius: 2px; background: #d9e2eb; }
.ps-life > li:last-child::after { display: none; }
.ps-life > li.is-done:has(+ li.is-done)::after { background: var(--c-accent-line); }
.ps-life__dot { position: absolute; top: 1px; left: 0; width: 12px; height: 12px; border-radius: 50%; border: 2px solid #c1cdda; background: var(--c-surface); }
.ps-life > li.is-done .ps-life__dot { border-color: var(--c-accent); background: var(--c-accent); }
.ps-life__label { display: block; font-size: 11.5px; color: var(--c-muted); }
.ps-life__who { display: block; font-size: 12.5px; color: var(--c-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-life__when { display: block; font-family: var(--f-brand); font-size: 12px; color: var(--c-muted); font-variant-numeric: tabular-nums; }
/* 済んでいない歩は、名前の「—」だけ（日付の「—」は重ねない） */
/* ★済んだ歩で日付が無いとき（旧 Project Studio から移したデータなど＝決定236 ⑫）は日付も「—」。29-3a の Quinn の NG で、済んでいない歩だけに絞った */
.ps-life > li:not(.is-done) .ps-life__who ~ .ps-life__when .is-empty::after { content: none; }

/* ---- モーダルの細部 ---- */
/* 1 つだけ選ぶもの（優先度）＝つながった切りかえ（押されている＝白く浮く。トグルの丸い札とは形で分ける） */
.ps-modal .ps-toggle__set[data-ps-single] { display: inline-flex; gap: 2px; padding: 3px; border-radius: 10px; background: #eaeff4; }
.ps-modal .ps-toggle__set[data-ps-single] > .ps-toggle {
  height: 28px; min-width: 56px; padding: 0 14px;
  border: 0; border-radius: 7px; background: transparent; color: var(--c-muted); font-size: 13px; font-weight: 400;
}
.ps-modal .ps-toggle__set[data-ps-single] > .ps-toggle:hover:not(:disabled) { color: var(--c-ink); background: transparent; }
.ps-modal .ps-toggle__set[data-ps-single] > .ps-toggle[aria-pressed="true"] {
  background: var(--c-surface); color: var(--c-accent-ink); font-weight: 500;
  box-shadow: 0 1px 2px rgba(20, 40, 64, .12), 0 0 0 1px rgba(65, 123, 167, .25);
}
/* このプロジェクトに参加している外部組織ユーザー（FN-PRJ-20 ①）: 人の印の付いた薄い藍の枠 */
#md-isu-02-lbl-external, #md-isu-03-lbl-external {
  display: flex; align-items: flex-start; gap: 8px; margin: 8px 0 0; padding: 8px 12px;
  border: 1px solid #dbe6f0; border-radius: var(--r-md); background: var(--c-accent-softer);
  font-size: 12.5px; line-height: 1.6; color: var(--c-ink-2);
}
#md-isu-03-lbl-external { margin: 0 0 12px; }
#md-isu-02-lbl-external::before, #md-isu-03-lbl-external::before {
  content: ""; flex: 0 0 15px; width: 15px; height: 15px; margin-top: 2px; background: var(--c-accent);
  -webkit-mask: var(--i-users) center / 15px no-repeat; mask: var(--i-users) center / 15px no-repeat;
}
#md-isu-02-lbl-external:empty, #md-isu-03-lbl-external:empty { display: none; }
/* 課題情報の「編集」に鉛筆の印 */
#md-isu-03-btn-edit::before {
  content: ""; flex: 0 0 13px; width: 13px; height: 13px; background: currentColor;
  -webkit-mask: var(--i-edit) center / 13px no-repeat; mask: var(--i-edit) center / 13px no-repeat;
}
/* 題の課題番号は Jost */
#md-isu-03-lbl-target { font-family: var(--f-brand); letter-spacing: .03em; color: var(--c-ink-2); }

/* ---- 英語の画面（状態の短い語は 29-4 で決める。それまでは元の語なので、状態と担当の列を広げる） ---- */
html[lang="en"] .ps-row, html[lang="en"] .ps-list__head { grid-template-columns: 14px 84px 92px minmax(0, 1fr) 56px 80px; }
html[lang="en"] .ps-center.is-nopro .ps-row, html[lang="en"] .ps-center.is-nopro .ps-list__head { grid-template-columns: 14px 92px minmax(0, 1fr) 56px 80px; }
html[lang="en"] .ps-list__head.is-mytask, html[lang="en"] .ps-list.is-mytask .ps-row { grid-template-columns: 14px 84px 92px minmax(0, 1fr) 92px 80px; }
html[lang="en"] .ps-center.is-nopro .ps-list__head.is-mytask, html[lang="en"] .ps-center.is-nopro .ps-list.is-mytask .ps-row { grid-template-columns: 14px 92px minmax(0, 1fr) 92px 80px; }

/* =====================================================================
   ★Phase 29-3a ファイルと実績（決定237。手本 docs/mockups/refresh-files.html・refresh-works.html）
   課題一覧（29-2）と同じ部品にそろえる: 件数は数を大きく・「〜を追加」に ＋・人は頭文字の丸だけ（名前は title と読み上げ）・
   右ペインは 操作ボタン → 道すじ → 18px の見出し → 札 → …… → 下端の歩み。★id と「id の要素のすぐ中の文字」は前のまま
   ===================================================================== */

/* ---- 共通: 一覧の件数は数を大きく（課題一覧の #sc-isu-01-lbl-count と同じ形）・「〜を追加」の ＋ ---- */
.ps-listbar .ps-count { display: inline-flex; align-items: baseline; gap: 3px; font-size: 12.5px; color: var(--c-muted); }
.ps-listbar .ps-count b { font-family: var(--f-brand); font-size: 17px; font-weight: 500; line-height: 1; color: var(--c-ink); font-variant-numeric: tabular-nums; }
.ps-add::before {
  content: ""; flex: 0 0 15px; width: 15px; height: 15px; background: currentColor;
  -webkit-mask: var(--i-plus) center / 15px no-repeat; mask: var(--i-plus) center / 15px no-repeat;
}
.ps-action--sm.ps-add::before { flex-basis: 13px; width: 13px; height: 13px; -webkit-mask-size: 13px; mask-size: 13px; }
/* 操作ボタンの印（ダウンロード・名前や説明の変更＝鉛筆・移動・課題一覧で開く）。語はボタンの中のまま */
.ps-action--dl::before, .ps-action--edit::before, .ps-action--move::before, .ps-action--goto::before {
  content: ""; flex: 0 0 15px; width: 15px; height: 15px; background: currentColor;
  -webkit-mask: var(--i-download) center / 15px no-repeat; mask: var(--i-download) center / 15px no-repeat;
}
.ps-action--edit::before { -webkit-mask-image: var(--i-edit); mask-image: var(--i-edit); }
.ps-action--move::before { -webkit-mask-image: var(--i-move); mask-image: var(--i-move); }
.ps-action--goto::before { -webkit-mask-image: var(--i-open); mask-image: var(--i-open); }
/* 印だけのボタン（鉛筆）と、押せないとき（「すべて」を選んでいるときのフォルダーの名前の変更・削除） */
.ps-iconbtn--edit::before {
  content: ""; width: 15px; height: 15px; background: currentColor;
  -webkit-mask: var(--i-edit) center / 15px no-repeat; mask: var(--i-edit) center / 15px no-repeat;
}
.ps-iconbtn:disabled { opacity: .35; cursor: default; }
.ps-iconbtn:disabled:hover { background: transparent; color: var(--c-muted); }
/* 人の丸だけの列（課題一覧の担当と同じ） */
.ps-row--file .ps-row__who, .ps-row--work .ps-row__who { display: flex; align-items: center; justify-content: center; overflow: visible; }
.ps-list__head--file .ps-col--u, .ps-list__head--work .ps-col--u { justify-self: center; }

/* ---- ファイル（SC-FIL-01）: フォルダーの木 — 開閉は山の印（課題一覧のつまみと同じ）・フォルダーの印・件数は Jost ---- */
.ps-tree ul { padding-left: 16px; }
.ps-tree__row { align-items: center; gap: 0; border-radius: var(--r-md); }
.ps-tree__twist {
  flex: 0 0 18px; width: 18px; height: 24px; margin: 0; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 4px; background: transparent; font-size: 0; color: var(--c-muted);
}
.ps-tree__twist::before {
  content: ""; width: 12px; height: 12px; background: currentColor; transform: rotate(90deg); transition: transform .15s;
  -webkit-mask: var(--i-chev-right) center / 12px no-repeat; mask: var(--i-chev-right) center / 12px no-repeat;
}
.ps-tree__twist[aria-expanded="false"]::before { transform: none; }
.ps-tree__twist:not(.is-leaf):hover { background: var(--c-accent-softer); color: var(--c-accent-ink); border: 0; }
.ps-tree__link { flex: 1 1 auto; min-width: 0; padding: 5px 8px 5px 2px; }
.ps-tree__link .ps-filter__name { display: inline-flex; align-items: center; gap: 7px; min-width: 0; }
.ps-tree__link .ps-filter__name::before {
  content: ""; flex: 0 0 15px; width: 15px; height: 15px; background: #8ea3b8;
  -webkit-mask: var(--i-folder) center / 15px no-repeat; mask: var(--i-folder) center / 15px no-repeat;
}
#sc-fil-01-btn-folder-all .ps-filter__name::before { -webkit-mask-image: var(--i-stack); mask-image: var(--i-stack); }
.ps-tree__row.is-selected .ps-filter__name::before { background: var(--c-accent); }
.ps-tree__row.is-selected .ps-tree__link { color: var(--c-accent-ink); }
.ps-tree__count { font-family: var(--f-brand); font-size: 12px; color: var(--c-faint); font-variant-numeric: tabular-nums; }
.ps-tree__row.is-selected .ps-tree__count { color: var(--c-accent-ink); }
.ps-tree__link .ps-filter__mark { display: none; }
/* 木の下の操作: ＋ フォルダーを追加 ｜ 鉛筆（名前の変更）・ごみ箱（削除）。右の 2 つは印だけで、まとめて右へ（ペインが狭い iPad の横では次の行の右端） */
.ps-tree__ops { align-items: center; gap: 6px 2px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--c-line-soft); }
.ps-tree__tools { display: inline-flex; gap: 2px; margin-left: auto; }

/* ---- ファイル: 一覧 — ファイルの印・サイズと日付は Jost・更新者は丸だけ ---- */
.ps-row--file, .ps-list__head--file { grid-template-columns: minmax(0, 1fr) 150px 64px 84px 44px 0; }
.ps-main.is-folded .ps-row--file, .ps-main.is-folded .ps-list__head--file { grid-template-columns: minmax(0, 1fr) 150px 64px 84px 44px 32px; }
/* 英語の画面は列の見出し（Updated by）が長いので、更新者の列を広げる（29-4 で見直す） */
html[lang="en"] .ps-row--file, html[lang="en"] .ps-list__head--file { grid-template-columns: minmax(0, 1fr) 150px 64px 84px 76px 0; }
html[lang="en"] .ps-main.is-folded .ps-row--file, html[lang="en"] .ps-main.is-folded .ps-list__head--file { grid-template-columns: minmax(0, 1fr) 150px 64px 84px 76px 32px; }
.ps-row--file .ps-row__name::before {
  content: ""; display: inline-block; width: 15px; height: 15px; margin-right: 8px; vertical-align: -3px; background: #9aabbd;
  -webkit-mask: var(--i-file) center / 15px no-repeat; mask: var(--i-file) center / 15px no-repeat;
}
.ps-row--file.is-selected .ps-row__name { font-weight: 500; }
.ps-row--file.is-selected .ps-row__name::before { background: var(--c-accent); }
.ps-row--file .ps-row__size, .ps-row--file .ps-row__date { font-family: var(--f-brand); font-size: 13px; font-variant-numeric: tabular-nums; }
/* ★iPad の横（1180）で 4 つのペインが入るように、1280px 未満のファイルの画面だけ一覧の下限を 560 → 500px にする
   （29-1 で余白とペインの隙間を広げたあと、左を畳んでも右ペインが約 56px 外に出ていた。決定221 のときは約 6px）。
   ps.js は :root の --w-center-min を読んでペインの幅を丸めるので、:root（html）に置く。一覧が 560px より狭いときはサイズの列を出さない（右ペインにある） */
@media (max-width: 1279px) {
  html:has(#sc-fil-01-pnl-center) { --w-center-min: 500px; }
}
@container (width < 560px) {
  .ps-row--file, .ps-list__head--file { grid-template-columns: minmax(0, 1fr) 120px 84px 44px 0; grid-template-areas: "t f d u a"; }
  .ps-main.is-folded .ps-row--file, .ps-main.is-folded .ps-list__head--file { grid-template-columns: minmax(0, 1fr) 120px 84px 44px 32px; }
  html[lang="en"] .ps-row--file, html[lang="en"] .ps-list__head--file { grid-template-columns: minmax(0, 1fr) 120px 84px 76px 0; }
  html[lang="en"] .ps-main.is-folded .ps-row--file, html[lang="en"] .ps-main.is-folded .ps-list__head--file { grid-template-columns: minmax(0, 1fr) 120px 84px 76px 32px; }
  .ps-row--file .ps-row__size, .ps-list__head--file .ps-col--z { display: none; }
}

/* ---- ファイル: 右ペイン — 畳むは印だけ・フォルダーの道すじ・ファイル名の見出し・札（サイズ・説明）・プレビュー・登録 → 更新 ---- */
#sc-fil-01-btn-detail-fold {
  flex: 0 0 auto; width: 30px; height: 30px; padding: 0; margin-right: 2px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent; border-radius: var(--r-md); background: transparent;
  font-size: 0; line-height: 0; color: var(--c-muted);
}
#sc-fil-01-btn-detail-fold::before {
  content: ""; width: 16px; height: 16px; background: currentColor; transform: scaleX(-1);
  -webkit-mask: var(--i-fold) center / 16px no-repeat; mask: var(--i-fold) center / 16px no-repeat;
}
#sc-fil-01-btn-detail-fold:hover { background: var(--c-accent-softer); color: var(--c-accent-ink); border-color: transparent; }
.ps-crumb--folder::before {
  content: ""; flex: 0 0 13px; width: 13px; height: 13px; background: currentColor;
  -webkit-mask: var(--i-folder) center / 13px no-repeat; mask: var(--i-folder) center / 13px no-repeat;
}
.ps-props--file { grid-template-columns: 120px minmax(0, 1fr); }
.ps-props--file .ps-memo { white-space: pre-line; line-height: 1.7; }
#sc-fil-01-pnl-detail .ps-preview { padding: 14px 18px; }
#sc-fil-01-pnl-detail .ps-preview__box {
  flex-direction: column; gap: 10px; height: 200px;
  border: 1px dashed var(--c-line-strong); border-radius: var(--r-lg); background: var(--c-surface-2); color: var(--c-muted);
}
#sc-fil-01-pnl-detail .ps-preview__box::before {
  content: ""; width: 30px; height: 30px; background: #b4c2d0;
  -webkit-mask: var(--i-file) center / 30px no-repeat; mask: var(--i-file) center / 30px no-repeat;
}

/* ---- 実績（SC-WRK-01）: 帯 — 更新の種類の札に、一覧の札と同じ色の点（課題一覧の状態の札と同じ。押されていないときは輪） ---- */
#sc-wrk-01-chk-kind-new::before, #sc-wrk-01-chk-kind-update::before, #sc-wrk-01-chk-kind-resolve::before, #sc-wrk-01-chk-kind-close::before {
  content: ""; flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--dot);
}
#sc-wrk-01-chk-kind-new { --dot: var(--c-active); }
#sc-wrk-01-chk-kind-resolve { --dot: var(--c-resolved); }
#sc-wrk-01-chk-kind-close { --dot: var(--c-closed); }
#sc-wrk-01-chk-kind-update::before { background: var(--c-surface); box-shadow: inset 0 0 0 1.5px #9aabbd; }
#sc-wrk-01-chk-kind-new[aria-pressed="false"]::before, #sc-wrk-01-chk-kind-resolve[aria-pressed="false"]::before,
#sc-wrk-01-chk-kind-close[aria-pressed="false"]::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--dot); }

/* ---- 実績: 一覧 — 日時と課題番号は Jost（課題番号は課題一覧と同じ 92px）・件名は … で切る（ps-row__text）・実施者は丸だけ ---- */
.ps-row--work, .ps-list__head--work { grid-template-columns: 84px 46px 84px 92px minmax(0, 1.15fr) minmax(0, 1fr) 44px; }
html[lang="en"] .ps-row--work, html[lang="en"] .ps-list__head--work { grid-template-columns: 84px 64px 84px 92px minmax(0, 1.15fr) minmax(0, 1fr) 44px; }
@container (width < 700px) {
  .ps-row--work, .ps-list__head--work { grid-template-columns: 84px 46px 92px minmax(0, 1.15fr) minmax(0, 1fr) 44px; }
  html[lang="en"] .ps-row--work, html[lang="en"] .ps-list__head--work { grid-template-columns: 84px 64px 92px minmax(0, 1.15fr) minmax(0, 1fr) 44px; }
}
.ps-row--work .ps-row__when { font-family: var(--f-brand); font-size: 13px; }
.ps-row--work .ps-row__title { overflow: hidden; }
.ps-row--work .ps-row__title .ps-scope { flex: 0 0 auto; margin-right: 6px; }
.ps-kind { display: flex; align-items: center; justify-content: center; border-radius: 6px; }

/* ---- 実績: 右ペイン — 課題一覧の右ペインと同じ並び（読むだけ）。器をペインの縦いっぱいにして、時系列だけがスクロールし、3 歩は下端 ---- */
#sc-wrk-01-pnl-detailbody { display: contents; }

/* =====================================================================
   ★Phase 29-3b 管理と設定（決定238。手本 docs/mockups/refresh-project.html・usermgr・organization・template・aihelp-admin（LT-2）／
   refresh-settings・ai-settings・mytask-usage・mysettings（LT-3））
   課題一覧（29-2）・ファイルと実績（29-3a）と同じ部品にそろえる: 件数は数を大きく・「＋ 新規作成」・状態は札・人は頭文字の丸＋名前・
   右ペインの題は 18px・1 つだけ選ぶ欄はつながった切りかえ・表は角の丸い枠。★id と「id の要素のすぐ中の文字」は前のまま
   ===================================================================== */

/* ---- LT-2 の一覧（中央）: 見出しは読み上げだけ・件数は数を大きく・行の頭の四角い印はやめる ---- */
/* LT-2 の中央を器にする（一覧の幅で列を出し分ける。LT-1 の中央と同じ @container の決まりがそのまま効く＝狭いと帯の見出しを隠す） */
.ps-pagehead + .ps-main > .ps-center { container-type: inline-size; }
/* 「検索フィルター」「結果リスト」は画面に出さない（課題一覧・ファイル・実績と同じく帯から始める。読み上げの名前には残す） */
.ps-pagehead + .ps-main > .ps-center > .ps-section {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.ps-center__bar .ps-count { display: inline-flex; align-items: baseline; gap: 3px; font-size: 12.5px; color: var(--c-muted); }
.ps-center__bar .ps-count b { font-family: var(--f-brand); font-size: 17px; font-weight: 500; line-height: 1; color: var(--c-ink); font-variant-numeric: tabular-nums; }
/* 行の頭の四角い印はやめる（選んだ行は左の藍の線と地で分かる。課題一覧・ファイルと同じ） */
.ps-table .ps-table__marker { display: none; }
.ps-table > colgroup > col.ps-c--mk { width: 6px; }
.ps-table tr > td:first-child:has(> .ps-table__marker),
.ps-table tr > th:first-child:has(> [id$="-col-marker"]) { padding: 0; }
/* 状態の列は札（課題の状態と同じ色の点。実施中・利用中・未対応＝空色／終了中・停止中・対応の済んだもの＝灰） */
.ps-table td > .ps-badge { vertical-align: middle; }
/* 終わったもの（終了中のプロジェクト・停止中の組織・ログインできない人）の行は、字を薄く（課題一覧の完了した行と同じ） */
.ps-table tbody tr.is-off > td { color: var(--c-faint); }
/* コード・日時・お金は Jost（課題番号・日付と同じ字） */
.ps-table .ps-code, .ps-table .ps-when, .ps-table .ps-money {
  font-family: var(--f-brand); letter-spacing: .02em; font-variant-numeric: tabular-nums;
}
.ps-table .ps-code { font-size: 13px; letter-spacing: .04em; color: var(--c-ink-2); }
/* 人は頭文字の丸＋名前（管理の表は名前そのものが中身なので、ファイル・実績と違って丸だけにはしない） */
.ps-table td > .ps-avatar { vertical-align: middle; margin: -2px 8px 0 0; }
.ps-table--sub td > .ps-avatar { --av: 20px; margin-right: 7px; }

/* ---- 一覧の列の幅（1920 で字が切れない幅。一覧が狭いとき＝iPad の横・125% は、右ペインでも見られる列を隠して主の列に幅を回す） ---- */
/* プロジェクト: 顧客 ｜ プロジェクト名 ｜ コード ｜ 状態 ｜ 未完了 ｜ 総数 ｜ 一覧に表示 */
#sc-prj-01-grd-projects > colgroup > col:nth-child(4) { width: 76px; }
#sc-prj-01-grd-projects > colgroup > col:nth-child(5) { width: 128px; }
#sc-prj-01-grd-projects > colgroup > col:nth-child(8) { width: 96px; }
/* 社員: 氏名（丸＋名前） ｜ メールアドレス ｜ ユーザーの種類 ｜ ログイン ｜ 参加プロジェクト */
#sc-adm-01-grd-users > colgroup > col:nth-child(2) { width: 280px; }
#sc-adm-01-grd-users > colgroup > col:nth-child(5) { width: 76px; }
#sc-adm-01-grd-users > colgroup > col:nth-child(6) { width: 124px; }
/* 顧客: 組織名 ｜ 区分 ｜ 所属ユーザー ｜ ログイン可 ｜ 相手先の案件 ｜ 組織の状態（札が入る幅。区分の列は英語だけ広げる＝決定168 ③のまま） */
#sc-adm-04-grd-organizations > colgroup > col:nth-child(7) { width: 104px; }
/* 課題の種類テンプレート: テンプレート名 ｜ 課題の種類の数 */
#sc-adm-09-grd-templates > colgroup > col:nth-child(3) { width: 128px; }
/* AI ヘルプ: 日時 ｜ 質問 ｜ 画面 ｜ 人（丸＋名前） ｜ 対応 */
#sc-aih-01-grd-questions > colgroup > col:nth-child(2) { width: 150px; }
#sc-aih-01-grd-questions > colgroup > col:nth-child(4) { width: 112px; }
#sc-aih-01-grd-questions > colgroup > col:nth-child(5) { width: 250px; }
#sc-aih-01-grd-questions > colgroup > col:nth-child(6) { width: 144px; }   /* 対応の札（ガイドに足した）が入る幅（Quinn 29-3b の NG 1） */
@container (width < 900px) {
  #sc-prj-01-grd-projects > colgroup > col:nth-child(2) { width: 150px; }
  #sc-adm-01-grd-users > colgroup > col:nth-child(2) { width: 210px; }
  #sc-aih-01-grd-questions > colgroup > col:nth-child(5) { width: 170px; }
}
/* ★見本を作る途中で見つけた崩れ（本番の版でも起きていた）: iPad の横（1180）で、プロジェクトの一覧の「プロジェクト名」の列がほぼ 0 幅になり、
   AI ヘルプの一覧の「質問」の列が消えていた（固定幅の列の合計が一覧の幅を超え、幅の決まっていない主の列が押しつぶされた） */
@container (width < 760px) {
  /* 右ペインでも見られる列（プロジェクトの課題の総数・一覧に表示／社員の参加プロジェクト）は隠す（最後の列なので、列の対応はずれない） */
  #sc-prj-01-grd-projects > colgroup > col:nth-child(n+7) { width: 0; }
  #sc-prj-01-grd-projects tr > :nth-child(n+7) { display: none; }
  #sc-prj-01-grd-projects > colgroup > col:nth-child(5) { width: 96px; }
  #sc-adm-01-grd-users > colgroup > col:nth-child(6) { width: 0; }
  #sc-adm-01-grd-users tr > :nth-child(6) { display: none; }
  /* 顧客のログイン可の数（右ペインの担当者の表で見られる）。途中の列なので、セルは残して幅を 0 にする（消すと後ろのセルが前の列へずれる） */
  #sc-adm-04-grd-organizations > colgroup > col:nth-child(5) { width: 0; }
  #sc-adm-04-grd-organizations tr > :nth-child(5) { padding: 0; font-size: 0; }
  #sc-adm-01-grd-users > colgroup > col:nth-child(2) { width: 190px; }
  #sc-adm-01-grd-users > colgroup > col:nth-child(4) { width: 122px; }
  /* AI ヘルプの画面の名前（右ペインの「画面」で見られる）も隠して、対応の札が入る幅を残す（Quinn 29-3b の NG 1。途中の列なのでセルは残す） */
  #sc-aih-01-grd-questions > colgroup > col:nth-child(2) { width: 144px; }
  #sc-aih-01-grd-questions > colgroup > col:nth-child(4) { width: 0; }
  #sc-aih-01-grd-questions tr > :nth-child(4) { padding: 0; font-size: 0; }
  #sc-aih-01-grd-questions > colgroup > col:nth-child(5) { width: 150px; }
  #sc-aih-01-grd-questions > colgroup > col:nth-child(6) { width: 140px; }
}

/* ---- LT-2 の右ペイン: 見出しは 18px の題・1 つだけ選ぶ欄はつながった切りかえ・表の削除はごみ箱の印・追加に ＋ ---- */
.ps-pagehead + .ps-main > .ps-right > .ps-pane__body { padding: 16px 18px 18px; margin-top: 0; }
.ps-pagehead + .ps-main > .ps-right h3.ps-section[id$="-lbl-sec-detail"] {
  margin: 0 0 16px; font-size: 18px; font-weight: 500; line-height: 1.5; letter-spacing: .01em; color: var(--c-ink);
  overflow-wrap: anywhere;
}
.ps-pagehead + .ps-main > .ps-right h3.ps-section[id$="-lbl-sec-detail"]::before,
.ps-pagehead + .ps-main > .ps-right h3.ps-section[id$="-lbl-sec-detail"]::after { content: none; }
/* 社員は題の前に、その人の丸（ヘッダーの自分の丸・一覧の丸と同じ。丸は題の要素の外） */
.ps-detailhead { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; }
.ps-pagehead + .ps-main > .ps-right .ps-detailhead > h3.ps-section[id$="-lbl-sec-detail"] { margin: 0; }
.ps-detailhead > .ps-avatar { --av: 36px; }
/* 1 つだけ選ぶ欄（する／しない・実施中／終了中・あり／なし・可／不可・対応・AI のモデル）＝つながった切りかえ
   （課題の登録の優先度と同じ。押されている＝白く浮く。絞り込みの丸い札とは形で分ける） */
.ps-right .ps-field .ps-toggle__set[data-ps-single],
.ps-single .ps-field .ps-toggle__set[data-ps-single] {
  display: flex; flex-wrap: wrap; gap: 2px; width: fit-content; max-width: 100%; padding: 3px; border-radius: 10px; background: #eaeff4;
}
.ps-right .ps-field .ps-toggle__set[data-ps-single] > .ps-toggle,
.ps-single .ps-field .ps-toggle__set[data-ps-single] > .ps-toggle {
  height: 28px; min-width: 56px; padding: 0 14px;
  border: 0; border-radius: 7px; background: transparent; color: var(--c-muted); font-size: 13px; font-weight: 400;
}
.ps-right .ps-field .ps-toggle__set[data-ps-single] > .ps-toggle:hover:not(:disabled),
.ps-single .ps-field .ps-toggle__set[data-ps-single] > .ps-toggle:hover:not(:disabled) { color: var(--c-ink); background: transparent; }
.ps-right .ps-field .ps-toggle__set[data-ps-single] > .ps-toggle[aria-pressed="true"],
.ps-single .ps-field .ps-toggle__set[data-ps-single] > .ps-toggle[aria-pressed="true"] {
  background: var(--c-surface); color: var(--c-accent-ink); font-weight: 500;
  box-shadow: 0 1px 2px rgba(20, 40, 64, .12), 0 0 0 1px rgba(65, 123, 167, .25);
}
.ps-right .ps-field .ps-toggle__set[data-ps-single] > .ps-toggle:disabled,
.ps-single .ps-field .ps-toggle__set[data-ps-single] > .ps-toggle:disabled { opacity: .55; cursor: not-allowed; }
.ps-right .ps-field .ps-toggle__set[data-ps-single] + .ps-note,
.ps-single .ps-field .ps-toggle__set[data-ps-single] + .ps-note { margin-top: 6px; }
/* 欄の並び: ラベルと切りかえ・入力欄の縦の中心をそろえる */
.ps-pagehead + .ps-main > .ps-right .ps-field { margin-bottom: 12px; }
.ps-pagehead + .ps-main > .ps-right .ps-field__label,
.ps-single .ps-field__label { line-height: 34px; }
.ps-pagehead + .ps-main > .ps-right .ps-field:has(> .ps-field__body > .ps-readonly) .ps-field__label,
.ps-single .ps-field:has(> .ps-field__body > .ps-readonly) .ps-field__label { line-height: 26px; }

/* ---- 入れ子の表（右ペイン・LT-3）: 角の丸い枠の中に。行は選べないので指の形にしない ---- */
.ps-table--sub, .ps-single .ps-table {
  border: 1px solid var(--c-line); border-radius: 10px; border-collapse: separate; border-spacing: 0; overflow: hidden;
  background: var(--c-surface);
}
.ps-table--sub thead th, .ps-single .ps-table thead th { height: 32px; font-size: 11.5px; }
.ps-table--sub tbody tr, .ps-single .ps-table tbody tr { cursor: default; }
.ps-table--sub tbody tr:hover, .ps-single .ps-table tbody tr:hover { background: transparent; }
.ps-table--sub tbody tr:nth-child(even):hover, .ps-single .ps-table tbody tr:nth-child(even):hover { background: var(--c-row-zebra); }
.ps-table--sub td { height: 36px; }
.ps-table--sub tbody tr:last-child > td, .ps-single .ps-table tbody tr:last-child > td { border-bottom: 0; }
.ps-table--sub tfoot td { height: 44px; border-top: 1px solid var(--c-line); border-bottom: 0; background: var(--c-surface-2); }
.ps-table--sub td .ps-input { min-height: 28px; height: 28px; padding: 2px 8px; font-size: 12.5px; }
.ps-table--sub td select.ps-input { padding: 0 24px 0 8px; background-position: right 7px center; }
.ps-table--sub td > .ps-iconbtn { width: 28px; height: 28px; vertical-align: middle; }
.ps-table--sub td > .ps-action--sm.ps-add { height: 28px; }
/* 状態の語の前に、課題の状態と同じ色の点（件数の表の 未解決・処理済み・完了／参加しているプロジェクト・相手先の案件・通知の表の状態） */
[id$="-lbl-detail-count-active"]::before, [id$="-lbl-detail-count-resolved"]::before, [id$="-lbl-detail-count-closed"]::before,
td[data-state]::before {
  content: ""; display: inline-block; width: 8px; height: 8px; margin: 0 8px 1px 0; border-radius: 50%; background: var(--c-active);
}
[id$="-lbl-detail-count-resolved"]::before { background: var(--c-resolved); }
[id$="-lbl-detail-count-closed"]::before, td[data-state="closed"]::before { background: var(--c-closed); }

/* プロジェクトの右ペイン: メンバーの表（氏名＝丸＋名前 ｜ メール ｜ 所属組織 ｜ ロール ｜ ごみ箱）・課題の種類の表。
   ロールの選択（プロジェクト管理者）とごみ箱は切らない。メールと所属組織は切れたら …（全文は title）。
   右ペインが狭いとき（iPad の横）は、メールの列を隠して氏名と所属組織に幅を回す（メールは氏名の title にある） */
.ps-pagehead + .ps-main > .ps-right { container-type: inline-size; }
#sc-prj-01-grd-detail-members > colgroup > col:nth-child(1) { width: 29%; }
#sc-prj-01-grd-detail-members > colgroup > col:nth-child(3) { width: 17%; }
#sc-prj-01-grd-detail-members > colgroup > col:nth-child(4) { width: 162px; }
#sc-prj-01-grd-detail-members > colgroup > col:nth-child(5) { width: 42px; }
#sc-prj-01-grd-detail-members thead tr > :nth-child(4), #sc-prj-01-grd-detail-members tbody tr > :nth-child(4) { padding-left: 6px; padding-right: 6px; }
#sc-prj-01-grd-detail-members thead tr > :nth-child(5), #sc-prj-01-grd-detail-members tbody tr > :nth-child(5) { padding: 0 6px; text-align: center; }
#sc-prj-01-grd-detail-members tbody tr > :nth-child(5) { overflow: visible; }
@container (width < 540px) {
  /* 列を消すと後ろのセルが前の列へずれるので、セルは残して幅を 0 にする */
  #sc-prj-01-grd-detail-members > colgroup > col:nth-child(2) { width: 0; }
  #sc-prj-01-grd-detail-members thead tr > :nth-child(2), #sc-prj-01-grd-detail-members tbody tr > :nth-child(2) { padding: 0; font-size: 0; }
  #sc-prj-01-grd-detail-members > colgroup > col:nth-child(1) { width: auto; }
  #sc-prj-01-grd-detail-members > colgroup > col:nth-child(3) { width: 30%; }
}
#sc-prj-01-grd-detail-issuetypes > colgroup > col:nth-child(2) { width: 104px; }
#sc-prj-01-grd-detail-issuetypes > colgroup > col:nth-child(3) { width: 120px; }
#sc-prj-01-lbl-detail-template + .ps-field__body { flex-wrap: wrap; }
#sc-prj-01-sel-detail-template { flex: 1 1 150px; width: auto; }
/* 社員の右ペイン: 参加しているプロジェクト（プロジェクト ｜ ロール ｜ 状態） */
#sc-adm-01-grd-detail-projects > colgroup > col:nth-child(2) { width: 150px; }
#sc-adm-01-grd-detail-projects > colgroup > col:nth-child(3) { width: 126px; }
/* 顧客の右ペイン: 担当者の表（氏名 ｜ メール ｜ ログイン ｜ 操作）・相手先になっている案件。
   ログインの選択は「不可」まで入る幅（Quinn 29-3b の NG 2。62px では「不可」が切れた）。英語は決定168 ③のとおり 108px（こちらのほうが広い） */
#sc-adm-04-grd-detail-users > colgroup > col:nth-child(3) { width: 80px; }
#sc-adm-04-grd-detail-users tbody td:nth-child(3) { padding-left: 6px; padding-right: 6px; }
#sc-adm-04-grd-detail-users tbody td:nth-child(3) select.ps-input { padding-right: 22px; background-position: right 6px center; }
#sc-adm-04-grd-detail-projects > colgroup > col:nth-child(2) { width: 104px; }
#sc-adm-04-grd-detail-projects > colgroup > col:nth-child(3) { width: 126px; }
#sc-adm-04-btn-detail-user-suspend-all { margin-top: 8px; }
/* 課題の種類テンプレートの右ペイン: 種類名 ｜ ごみ箱（＋ 追加する が入る幅） */
#sc-adm-09-grd-detail-items > colgroup > col:nth-child(2) { width: 118px; }
/* AI ヘルプの右ペイン: 人は丸＋名前 */
.ps-field__body:has(> #sc-aih-01-txt-detail-person) { display: flex; align-items: center; gap: 4px; }
.ps-field__body:has(> #sc-aih-01-txt-detail-person) > .ps-avatar { --av: 22px; margin-left: 6px; }

/* ---- LT-3（各種設定・AI の設定・My Task の使用量・個人設定）: 余白を広く・表は角の丸い枠 ---- */
.ps-single .ps-pane__body { padding: 18px 24px 24px; margin-top: 0; }
.ps-single .ps-section:first-child { margin-top: 0; }
.ps-single .ps-section { margin: 26px 0 12px; }
.ps-single .ps-formcol .ps-field { margin-bottom: 12px; }
/* 各種設定: 進む先は 3 枚のカード（印・名前・説明・開く） */
#sc-adm-12-pnl-gotolist { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; max-width: 1100px; }
.ps-formcol:has(> #sc-adm-12-pnl-gotolist) { max-width: none; }
#sc-adm-12-pnl-gotolist > li {
  position: relative;
  display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: 40px 1fr auto; gap: 6px 14px; align-content: start;
  padding: 18px 18px 16px; border: 1px solid var(--c-line); border-radius: 12px; background: var(--c-surface);
  box-shadow: 0 1px 2px rgba(20, 40, 64, .04);
}
/* 印の台（薄い藍の角丸）と、その上の印（台と印を 2 つの疑似要素で。印は CSS の mask） */
#sc-adm-12-pnl-gotolist > li::before {
  content: ""; grid-row: 1; grid-column: 1; width: 40px; height: 40px; border-radius: 10px;
  background: var(--c-accent-soft); box-shadow: inset 0 0 0 1px #dbe6f0;
}
#sc-adm-12-pnl-gotolist > li::after {
  content: ""; position: absolute; top: 28px; left: 28px; width: 20px; height: 20px; background: var(--c-accent);
  -webkit-mask: var(--ico) center / 20px no-repeat; mask: var(--ico) center / 20px no-repeat; pointer-events: none;
}
.ps-gotolist__item--template { --ico: var(--i-stack); }
.ps-gotolist__item--ai { --ico: var(--i-spark); }
.ps-gotolist__item--mytask { --ico: var(--i-lock); }
#sc-adm-12-pnl-gotolist .ps-gotolist__name { grid-row: 1; grid-column: 2; align-self: center; font-size: 15px; font-weight: 500; line-height: 1.5; color: var(--c-ink); }
#sc-adm-12-pnl-gotolist .ps-gotolist__desc { grid-row: 2; grid-column: 2; font-size: 12.5px; line-height: 1.7; color: var(--c-muted); }
#sc-adm-12-pnl-gotolist > li > .ps-action { grid-row: 3; grid-column: 2; justify-self: start; margin-top: 8px; }
.ps-action--next::after {
  content: ""; flex: 0 0 13px; width: 13px; height: 13px; margin-right: -3px; background: currentColor;
  -webkit-mask: var(--i-chev-right) center / 13px no-repeat; mask: var(--i-chev-right) center / 13px no-repeat;
}
/* AI の設定: お金と日時は Jost・今月の上限に対する割合は棒（80% で黄＝管理者にお知らせが届く割合・上限に達したら赤）・上限の欄と注記の間を空ける */
#sc-aih-02-txt-budget + .ps-note, #sc-aih-02-txt-taskbudget + .ps-note { margin-left: 10px; }
.ps-meter { display: inline-block; width: 96px; height: 6px; margin: 0 0 1px 10px; vertical-align: middle; border-radius: 3px; background: #e5ebf1; overflow: hidden; }
.ps-meter > span { display: block; width: var(--p, 0%); height: 100%; border-radius: 3px; background: var(--c-accent); }
.ps-meter.is-warn > span { background: var(--c-resolved); }
.ps-meter.is-over > span { background: var(--c-error); }
#sc-aih-02-grd-summary > colgroup > col:nth-child(2) { width: 120px; }
#sc-aih-02-grd-summary > colgroup > col:nth-child(3) { width: 80px; }
#sc-aih-02-grd-person > colgroup > col:nth-child(2), #sc-aih-02-grd-feature > colgroup > col:nth-child(2) { width: 80px; }
#sc-aih-02-grd-person > colgroup > col:nth-child(3), #sc-aih-02-grd-feature > colgroup > col:nth-child(3) { width: 120px; }
#sc-aih-02-grd-detail > colgroup > col:nth-child(1) { width: 130px; }   /* 日時・氏名・モデル（29-4 でビューの style から移した＝英語だけ広げられるように） */
#sc-aih-02-grd-detail > colgroup > col:nth-child(2) { width: 210px; }
#sc-aih-02-grd-detail > colgroup > col:nth-child(4) { width: 130px; }
#sc-aih-02-grd-detail > colgroup > col:nth-child(6), #sc-aih-02-grd-detail > colgroup > col:nth-child(7) { width: 112px; }
#sc-aih-02-grd-detail > colgroup > col:nth-child(9) { width: 108px; }
/* My Task の使用量: 氏名は丸＋名前・最後に使った日は Jost */
#sc-adm-13-grd-staff .ps-when { font-size: 13px; }
/* 個人設定: 氏名の欄の左に、自分の丸（ヘッダーの丸と同じ。頭文字は保存してある氏名の最初の 1 字）・受信段階は「（既定）」まで見える幅 */
.ps-field__body--me { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.ps-field__body--me > .ps-avatar { --av: 34px; }
.ps-field__body--me > .ps-input { flex: 1 1 200px; width: auto; }
.ps-field__body--me > .ps-note { flex: 1 0 100%; margin: 0 0 0 44px; }
#sc-hom-02-grd-notify > colgroup > col:nth-child(2) { width: 76px; }
#sc-hom-02-grd-notify > colgroup > col:nth-child(3) { width: 128px; }
#sc-hom-02-grd-notify > colgroup > col:nth-child(4) { width: 300px; }
#sc-hom-02-grd-notify td select.ps-input { min-height: 30px; height: 30px; padding: 0 26px 0 10px; font-size: 13px; }

/* =====================================================================
   ★Phase 29-3c 入口と案内（決定239。手本 docs/mockups/refresh-login.html・refresh-verify・refresh-setup（LT-4 ①）／
   refresh-error・refresh-notfound（LT-4 ②）／refresh-help／refresh-aihelp／refresh-tour）
   課題一覧（29-2）・ファイルと実績（29-3a）・管理と設定（29-3b）と同じ部品にそろえる: ログインのロゴはヘッダーと同じ字・
   空の一覧と同じ点線の弧と朱の鞠の絵・番号は Jost・表は角の丸い枠・人（AI）は丸＋吹き出し・つながった丸い札。
   ★id と「id の要素のすぐ中の文字」は前のまま。変えた書き方はログイン画面のロゴ（_LayoutAuth）だけ
   ===================================================================== */

/* ---- LT-4 ①認証の姿（SC-AUT-01 ログイン・02 ワンタイムパスワード・03 初期セットアップ） ----------------
   ロゴはヘッダーと同じ字（「Project Studıo」の i の点が朱の鞠・Jost 500）を紺で。PS のマークは残す（決定234 ⑤）。
   カードの右肩に、空の一覧と同じ点線の弧と朱の鞠（字の無い飾り。カードから渡した鞠）。版と番号の欄は Jost */
.ps-card--auth { position: relative; }
.ps-card--auth::after {
  content: ""; position: absolute; left: calc(100% - 4px); top: 30px; width: 250px; height: 120px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 250 120'%3E%3Cpath d='M4 64 C 60 -6, 170 -10, 214 70' fill='none' stroke='%23b9c9d8' stroke-width='2.4' stroke-linecap='round' stroke-dasharray='0.5 9'/%3E%3Ccircle cx='220' cy='81' r='9' fill='%23eb6101'/%3E%3C/svg%3E") no-repeat left top / contain;
}
.ps-auth__brand { align-items: baseline; gap: 9px; margin-bottom: 18px; }   /* マークの下端をロゴの字の並びの線（baseline）に */
.ps-auth__brand .ps-auth__mark { height: 24px; }
.ps-auth__wordmark { display: inline-flex; align-items: baseline; color: var(--c-navy); }
.ps-auth__brand .ps-auth__wordmark { height: auto; }   /* 前の画像の高さ（15px）の規則を字のロゴには効かせない（Quinn 29-3c の気づき） */
.ps-auth__wordmark .wm { font-size: 27px; }
.ps-auth__wordmark:hover .wm-ball { animation: ps-bob .9s ease-in-out 1; }
.ps-auth__title { margin-bottom: 28px; }
.ps-auth__version { font-family: var(--f-brand); color: var(--c-faint); letter-spacing: .02em; }
.ps-otp-input { font-family: var(--f-brand); font-size: 22px; font-weight: 500; letter-spacing: .42em; font-variant-numeric: tabular-nums; }
/* 1 行の案内（ログアウトしました・再送しました）は、利用者エラーと同じ形の薄い藍の枠 */
.ps-auth__notice {
  padding: 8px 12px; color: var(--c-accent-ink);
  background: var(--c-accent-softer); border: 1px solid var(--c-accent-line); border-radius: var(--r-md);
}
.ps-auth__error { border-radius: var(--r-md); }
/* 案内の枠のすぐ下の説明は、題に寄せる負の上の余白（-20px）をやめる — 枠の下の線に説明の 1 行目が 4px 重なっていた（Quinn 29-3c の NG 1。
   案内を枠にしたので見えるようになった）。案内 → 説明は案内の下の余白 16px だけ */
.ps-auth__notice + .ps-auth__lead { margin-top: 0; }
@media (prefers-reduced-motion: reduce) { .ps-auth__wordmark:hover .wm-ball { animation: none; } }

/* ---- LT-4 ②システムの姿（SC-SYS-01 エラー・SC-SYS-02 見つかりません） ------------------------------
   真ん中にそろえ、題の上に小さな絵（空の一覧と同じ点線の弧と鞠）: エラー＝鞠が下に落ちた／見つかりません＝鞠が無い（点線の輪）。
   記録の番号は Jost の札（問い合わせで読み上げる・写す番号）。区切りの線はやめる */
#sc-sys-01-pnl-card, #sc-sys-02-pnl-card { max-width: 500px; padding: 30px 36px 26px; text-align: center; }
#sc-sys-01-pnl-card::before, #sc-sys-02-pnl-card::before {
  content: ""; display: block; width: 150px; height: 64px; margin: 0 auto 16px; background: no-repeat center / contain;
}
#sc-sys-01-pnl-card::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 64'%3E%3Cpath d='M8 26 C 40 -2, 92 -6, 115 43' fill='none' stroke='%23b9c9d8' stroke-width='2' stroke-linecap='round' stroke-dasharray='0.5 7'/%3E%3Cpath d='M92 62 H 148' stroke='%23d3dce6' stroke-width='1.6' stroke-linecap='round'/%3E%3Ccircle cx='121' cy='54' r='7' fill='%23eb6101'/%3E%3C/svg%3E");
}
#sc-sys-02-pnl-card::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 64'%3E%3Cpath d='M6 60 C 40 4, 102 -4, 128 30' fill='none' stroke='%23b9c9d8' stroke-width='2' stroke-linecap='round' stroke-dasharray='0.5 7'/%3E%3Ccircle cx='134' cy='39' r='7' fill='none' stroke='%23b9c9d8' stroke-width='1.6' stroke-dasharray='2.2 2.6'/%3E%3C/svg%3E");
}
#sc-sys-01-pnl-card .ps-card__title, #sc-sys-02-pnl-card .ps-card__title { font-size: 19px; }
#sc-sys-01-pnl-card .ps-card__message, #sc-sys-02-pnl-card .ps-card__message { text-wrap: balance; }
#sc-sys-01-pnl-card .ps-card__ref {
  justify-content: center; align-items: center; gap: 10px;
  margin-top: 18px; padding-top: 0; border-top: 0;
}
#sc-sys-01-pnl-card .ps-card__refvalue {
  font-family: var(--f-brand); font-size: 15px; font-weight: 500; letter-spacing: .12em; color: var(--c-ink);
  padding: 3px 12px; background: var(--c-surface-2); border: 1px solid var(--c-line); border-radius: var(--r-md);
}
#sc-sys-01-pnl-card .ps-card__guide, #sc-sys-02-pnl-card .ps-card__guide { margin-top: 18px; }

/* ---- SC-HLP-01 ヘルプ ---------------------------------------------------------------------------
   目次は左ペインの選び方（今の章は薄い藍の地・藍の字・角丸。左の縦線はやめる）。ツアーと「はじめに」は丸い札（再生の印・丸の中のチェック）。
   本文: 題は 22px・章の見出しの印は角の丸い棒・表は管理の表と同じ角の丸い枠（横の線だけ・見出しの行は沈んだ地）。線は薄く */
.ps-help__toc, .ps-help__onboard, .ps-help__tours { border-right-color: var(--c-line); }
.ps-help__toc { padding: 4px 0 20px; }
.ps-help__tochead { margin: 12px 18px 6px; font-size: 12px; font-weight: 700; color: var(--c-ink-2); }
.ps-help__toc a { margin: 1px 8px; padding: 5px 10px; border-left: 0; border-radius: var(--r-md); line-height: 1.55; }
.ps-help__toc a:hover { background: var(--c-accent-softer); }
.ps-help__toc a.is-current { background: var(--c-accent-soft); color: var(--c-accent-ink); font-weight: 500; }
.ps-help__toc a.is-sub { padding-left: 24px; }
.ps-help__onboard { padding: 14px 16px 0; }
.ps-help__tours { padding: 12px 14px 8px; align-items: center; gap: 6px; }
.ps-help__tours-head { flex: 0 0 100%; margin: 0 0 1px 2px; font-size: 12px; font-weight: 700; color: var(--c-ink-2); }
.ps-help__tours a, #sc-hlp-01-btn-onboarding {
  display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 9px 0 7px; box-sizing: border-box;
  border: 1px solid var(--c-line-strong); border-radius: 999px; background: var(--c-surface); color: var(--c-accent-ink);
  font: inherit; font-size: 11.5px; font-weight: 400; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.ps-help__tours a::before, #sc-hlp-01-btn-onboarding::before {
  content: ""; flex: 0 0 12px; width: 12px; height: 12px; background: currentColor;
  -webkit-mask: var(--i-play) no-repeat center / contain; mask: var(--i-play) no-repeat center / contain;
}
#sc-hlp-01-btn-onboarding::before { -webkit-mask-image: var(--i-checkcircle); mask-image: var(--i-checkcircle); }
.ps-help__tours a:hover, #sc-hlp-01-btn-onboarding:hover { background: var(--c-accent-softer); border-color: var(--c-accent-line); }
.ps-help__page { padding: 10px 40px 60px 40px; }
.ps-help__page h1 { font-size: 22px; font-weight: 700; margin: 20px 0 8px 0; letter-spacing: .02em; }
.ps-help__page h2 { font-size: 16px; margin: 40px 0 12px 0; padding-top: 20px; border-top-color: var(--c-line-soft); }
.ps-help__page h2::before { flex-basis: 4px; width: 4px; height: 16px; border-radius: 2px; }
.ps-help__page h3 { font-size: 14px; margin: 22px 0 6px 0; }
.ps-help__page hr { border-top-color: var(--c-line-soft); }
.ps-help__page table { border-collapse: separate; border-spacing: 0; border: 1px solid var(--c-line); border-radius: var(--r-md); overflow: hidden; }
.ps-help__page th, .ps-help__page td { border: 0; border-bottom: 1px solid var(--c-line-soft); padding: 6px 14px; }
.ps-help__page tr:last-child > td { border-bottom: 0; }
.ps-help__page th { background: var(--c-surface-2); color: var(--c-ink-2); font-size: 12px; font-weight: 500; border-bottom-color: var(--c-line); }
.ps-help__page code { border-color: var(--c-line); border-radius: 4px; }
.ps-help__page pre { border-color: var(--c-line); border-radius: var(--r-md); }

/* ---- AI に質問（LY-01 のパネル。_AiHelpPanel と ps.js の 13） ------------------------------------
   題の前にきらめきの印・閉じるは印のボタン。本文は沈んだ地に、問い＝右の薄い藍の吹き出し／答え＝紺の丸（空色のきらめき）＋白い吹き出し
   （時系列のコメントと同じ「丸＋枠」。AI の仲間の紺の丸と同じ色）。欄は角丸 12px */
.ps-ai { border-left-color: var(--c-line); }
.ps-ai__head { padding: 10px 10px 10px 16px; border-bottom-color: var(--c-line); }
.ps-ai__title { display: inline-flex; align-items: center; gap: 7px; font-size: 14.5px; }
.ps-ai__title::before {
  content: ""; flex: 0 0 16px; width: 16px; height: 16px; background: var(--c-accent);
  -webkit-mask: var(--i-spark) no-repeat center / contain; mask: var(--i-spark) no-repeat center / contain;
}
.ps-ai__close { width: 30px; height: 30px; display: grid; place-items: center; padding: 0; border-radius: var(--r-md); }
.ps-ai__close:hover { background: var(--c-accent-softer); color: var(--c-accent-ink); }
.ps-ai__body { background: var(--c-surface-2); padding: 16px 16px 18px; }
.ps-ai__turn + .ps-ai__turn { margin-top: 20px; }
.ps-ai__q { margin-bottom: 12px; padding: 8px 13px; background: var(--c-accent-soft); border: 1px solid #d3e1ee; border-radius: 14px 14px 4px 14px; }
.ps-ai__a {
  position: relative; margin-left: 38px; padding: 10px 14px 12px;
  background: var(--c-surface); border: 1px solid var(--c-line); border-radius: 4px 14px 14px 14px;
  box-shadow: 0 1px 2px rgba(20, 40, 64, .04);
}
.ps-ai__a::before {
  content: ""; position: absolute; left: -38px; top: 0; width: 28px; height: 28px; border-radius: 50%;
  background: var(--c-navy) var(--i-spark-sky) no-repeat center / 15px;
}
.ps-ai__a > :last-child { margin-bottom: 0; }
.ps-ai__links { border-top-color: var(--c-line); }
.ps-ai__sys { background: var(--c-surface-2); border-radius: 0 var(--r-md) var(--r-md) 0; }
.ps-ai__foot { padding: 12px 16px 14px; border-top-color: var(--c-line); }
.ps-ai__foot textarea.ps-input { border-radius: var(--r-lg); min-height: 66px; padding: 9px 12px; }

/* ---- ツアーの吹き出し（Driver.js の .ps-tour。はじめにの「やり方を見る」・ヘルプのツアー・AI の「画面で見る」） -----------------
   モーダルと同じ角丸 16px・細い枠・歩みの数は Jost・ボタンは画面のボタンと同じ高さと角丸・閉じるは印のボタン。
   ★はじめにのチェックリストは 29-1 の形のまま（「やり方を見る」を札にすると、ヘッダーの右から 396px の位置で開く一覧が
     1440px 以下で画面の外へ 8px 出るため。実測） */
.driver-popover.ps-tour { border: 1px solid var(--c-line); border-radius: 16px; padding: 16px 18px 14px; max-width: 340px; }
.driver-popover.ps-tour .driver-popover-title { padding-right: 26px; }
.driver-popover.ps-tour .driver-popover-description { color: var(--c-ink-2); line-height: 1.7; }
.driver-popover.ps-tour .driver-popover-footer { margin-top: 14px; }
.driver-popover.ps-tour .driver-popover-progress-text { font-family: var(--f-brand); font-size: 12.5px; color: var(--c-muted); font-variant-numeric: tabular-nums; }
.driver-popover.ps-tour .driver-popover-footer button { height: 30px; padding: 0 14px; border-radius: var(--r-md); font-size: 12.5px; font-weight: 500; line-height: 1; }
.driver-popover.ps-tour .driver-popover-footer .driver-popover-btn-disabled { opacity: .45; }
.driver-popover.ps-tour .driver-popover-close-btn {
  top: 10px; right: 10px; width: 28px; height: 28px; border-radius: var(--r-md);
  color: var(--c-muted); font-size: 18px; line-height: 1;
}
.driver-popover.ps-tour .driver-popover-close-btn:hover { background: var(--c-accent-softer); color: var(--c-accent-ink); }

/* =====================================================================
   MD-SUP-01 サポートに問い合わせ（32-1・PSTUD-74・決定246。手本: docs/mockups/support.html）
   自分のメニューとエラー画面から開くモーダル（ps-modal--md＝640px）。欄は 種類（プルダウン）・内容 の 2 つ。
   その下に「一緒に送る情報」の薄い箱（2 列。URL と記録の番号は 1 行を使う）。送ったあとは同じモーダルの中で「送りました」
   ===================================================================== */
#md-sup-01-pnl-veil textarea { min-height: 150px; }
.ps-supinfo {
  margin: 4px 0 0; padding: 10px 14px 11px;
  background: var(--c-surface-2); border: 1px solid var(--c-line); border-radius: var(--r-md);
}
.ps-supinfo__title { margin: 0 0 4px; font-size: 12.5px; font-weight: 500; color: var(--c-ink-2); }
.ps-supinfo__list {
  display: grid; grid-template-columns: max-content minmax(0, 1fr) max-content minmax(0, 1fr);
  column-gap: 12px; row-gap: 0; margin: 0;
  font-size: 12px; line-height: 1.85;
}
.ps-supinfo__list dt { color: var(--c-muted); white-space: nowrap; }
/* 値は 1 行（長い URL は … で切る。全文は title） */
.ps-supinfo__list dd { margin: 0; min-width: 0; color: var(--c-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-supinfo__list dd.is-wide { grid-column: 2 / -1; }
/* エラー画面から開いたときの記録の番号（エラー画面の札と同じ字） */
.ps-supinfo__list dd.is-refno { font-family: var(--f-brand); font-weight: 500; letter-spacing: .1em; }
#md-sup-01-pnl-veil .ps-note { margin-top: 10px; }
/* 送ったあと: 丸の中のチェック（藍）＋「送りました」＋控えの宛先 */
.ps-supdone { padding: 18px 0 8px; text-align: center; }
.ps-supdone::before {
  content: ""; display: block; width: 40px; height: 40px; margin: 0 auto 10px;
  background: var(--c-accent);
  -webkit-mask: var(--i-checkcircle) no-repeat center / contain;
  mask: var(--i-checkcircle) no-repeat center / contain;
}
.ps-supdone__title { margin: 0 0 6px; font-size: 16px; font-weight: 500; }
.ps-supdone__text { margin: 0; font-size: 13px; color: var(--c-ink-2); overflow-wrap: anywhere; }
/* SC-SYS-01 エラー: 記録の番号の下の「サポートに問い合わせる」 */
#sc-sys-01-pnl-card .ps-card__support { margin-top: 16px; }
#sc-sys-01-pnl-card .ps-card__support .ps-action { height: 36px; padding: 0 16px; font-size: 13px; }

/* =====================================================================
   ★Phase 29-4 英語とメール（決定240。手本 docs/mockups/refresh-en-issue.html・refresh-en-files・refresh-en-aihelp-admin・
   refresh-en-ai-settings・refresh-en-project・refresh-en-organization。メールは refresh-mail-otp・refresh-mail-issue（日英）＝CSS ではなく
   CAuth・CNotifyMail が組む）
   英語の語は日本語より長いので、英語の画面で切れていた見出し・日時・選択の字が入るように、英語だけ幅を広げる（決定168 ③と同じ考え）。
   ★英語の一覧の状態は語のまま（Active・Resolved・Closed）＝担当 56・状態 80 の列は 29-2 のまま（1 文字の A・R・C は英語では意味が伝わらない）
   ===================================================================== */
/* ファイルの並び: Updated on (newest first) が入る幅（一覧のバーの選択の上限 180 → 192px） */
html[lang="en"] #sc-fil-01-sel-sort { max-width: 192px; }
/* AI の設定の使用の記録: 日時（Sep 23, 2026 02:53。130 → 136px）と機能（Issue summary。88 → 104px）。
   そのぶん氏名を 210 → 184px に詰めて、結果の列の幅は前のまま（氏名は切れたら …＝全文は title） */
html[lang="en"] #sc-aih-02-grd-detail > colgroup > col:nth-child(1) { width: 136px; }
html[lang="en"] #sc-aih-02-grd-detail > colgroup > col:nth-child(2) { width: 184px; }
html[lang="en"] #sc-aih-02-grd-detail > colgroup > col:nth-child(3) { width: 104px; }
/* プロジェクトの右ペインのメンバーの表: 見出しの Organization（17 → 19%）と Actions（42 → 56px） */
html[lang="en"] #sc-prj-01-grd-detail-members > colgroup > col:nth-child(3) { width: 19%; }
html[lang="en"] #sc-prj-01-grd-detail-members > colgroup > col:nth-child(5) { width: 56px; }
/* 顧客の一覧: 見出しの Login allowed（96 → 104px） */
html[lang="en"] #sc-adm-04-grd-organizations > colgroup > col:nth-child(5) { width: 104px; }
/* 社員の右ペインのアクセストークンの表（29-5 のガイドの画像で見つけた＝29-3b の角の丸い枠の余白から）: 見出しの Generated on と日付（88 → 96px）・
   下の行の Generate（88 → 104px）。名前の列が縮む（切れたら …＝全文は title） */
html[lang="en"] #sc-adm-01-grd-detail-tokens > colgroup > col:nth-child(2) { width: 96px; }
html[lang="en"] #sc-adm-01-grd-detail-tokens > colgroup > col:nth-child(4) { width: 104px; }
/* 一覧・右ペインが狭いとき（iPad の横）。★英語の規則は言語を問わない規則より強いので、狭いときの形（隠す列・右ペインの幅）はここで言い直す */
@container (width < 760px) {
  html[lang="en"] #sc-aih-01-grd-questions > colgroup > col:nth-child(2) { width: 150px; }   /* AI ヘルプの日時（144 → 150px） */
  html[lang="en"] #sc-prj-01-grd-projects > colgroup > col:nth-child(5) { width: 100px; }    /* 見出しの Project status（96 → 100px） */
  html[lang="en"] #sc-adm-04-grd-organizations > colgroup > col:nth-child(5) { width: 0; }   /* 顧客のログイン可の列は隠したまま */
}
@container (width < 540px) {
  html[lang="en"] #sc-prj-01-grd-detail-members > colgroup > col:nth-child(3) { width: 30%; }   /* メールの列を隠したときの所属組織は前のまま */
}
/* 課題一覧・My Task の帯（一覧が 700px より狭いとき）: 英語は検索欄のもとの幅を 120 → 164px に — 薄い字（Keyword / No.）が入らない幅なら、
   帯を 2 段にして欄を 1 段目に広げる（Quinn 29-4 の NG 1: iPad の横で左を畳んだ My Task は、帯が 1 段のまま欄が 68px まで縮んで末尾が切れた。
   課題一覧は帯の項目が多く、前から 2 段）。★欄の最小の幅（input の min-width）で押さえると、囲みが広がらずに検索のボタンが隣の札に重なった。
   日本語は前のまま（1180 で欄が細くなる＝決定236 ④） */
@container (width < 700px) {
  html[lang="en"] .ps-center__bar .ps-search { flex-basis: 164px; }
}

/* =========================================================================
   P701 5-2: 止めたときの画面（SC-TSY-01〜04）とカードの会社の名前。見本 Docs/mockups/sc-tsy-0N.html の足す分（app-saas.css）から移した
   ========================================================================= */
/* ---- カードの会社の名前（ロゴの下・題の上。SC-TSY-02、5-4 でログインの画面にも）。会社名の右に入口のホスト名 ---- */
.ps-auth__tenant {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  margin: -4px 0 16px 0;
  font-size: 15px; font-weight: 500; color: var(--c-ink);
}
.ps-auth__tenant::before {
  content: ""; flex: 0 0 16px; width: 16px; height: 16px; background: var(--c-accent);
  -webkit-mask: var(--i-building) center / 16px no-repeat; mask: var(--i-building) center / 16px no-repeat;
}
.ps-auth__host { font-family: var(--f-brand); font-size: 12px; font-weight: 400; color: var(--c-faint); letter-spacing: .02em; }
.ps-auth__tenant + .ps-auth__title { margin-top: 0; }

/* ---- SC-TSY-01／-02（認証の姿のカード）: 本文の段落の間 ---- */
#sc-tsy-01-pnl-card .ps-card__message + .ps-card__message,
#sc-tsy-02-pnl-card .ps-card__message + .ps-card__message { margin-top: 10px; }
#sc-tsy-01-pnl-card .ps-card__guide a, #sc-tsy-02-pnl-card .ps-card__guide a { color: var(--c-link); }
.ps-card__host { font-family: var(--f-brand); letter-spacing: .02em; }

/* ---- SC-TSY-03／-04（システムの姿のカード）: SC-SYS-02 見つかりません と同じ形（真ん中・点線の弧・鞠が無い） ---- */
#sc-tsy-03-pnl-card, #sc-tsy-04-pnl-card { max-width: 500px; padding: 30px 36px 26px; text-align: center; }
#sc-tsy-03-pnl-card::before, #sc-tsy-04-pnl-card::before {
  content: ""; display: block; width: 150px; height: 64px; margin: 0 auto 16px; background: no-repeat center / contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 64'%3E%3Cpath d='M6 60 C 40 4, 102 -4, 128 30' fill='none' stroke='%23b9c9d8' stroke-width='2' stroke-linecap='round' stroke-dasharray='0.5 7'/%3E%3Ccircle cx='134' cy='39' r='7' fill='none' stroke='%23b9c9d8' stroke-width='1.6' stroke-dasharray='2.2 2.6'/%3E%3C/svg%3E");
}
#sc-tsy-03-pnl-card .ps-card__title, #sc-tsy-04-pnl-card .ps-card__title { font-size: 19px; }
#sc-tsy-03-pnl-card .ps-card__message, #sc-tsy-04-pnl-card .ps-card__message { text-wrap: balance; }
#sc-tsy-03-pnl-card .ps-card__guide, #sc-tsy-04-pnl-card .ps-card__guide { margin-top: 18px; }
#sc-tsy-03-pnl-card .ps-card__actions, #sc-tsy-04-pnl-card .ps-card__actions { margin-top: 18px; display: flex; justify-content: center; gap: 8px; }

.ps-auth__tenantname .ps-auth__host { margin-left: 7px; }

/* =========================================================================
   P701 5-2-4: SC-AIH-02 AI の設定 — 数の欄の後ろの単位（決定 S34 の AI クレジット）。見本 Docs/mockups/sc-aih-02.html の足す分（app-saas.css）から移した
   ========================================================================= */
.ps-field__unit { margin-left: 6px; font-size: 13px; }
/* 欄のあとの注記は次の行へ（見本の CSS の「見本の小さな直し」— いまはこの画面にだけ効かせる。ほかの画面は見本に合わせるときに） */
#sc-aih-02-frm-main .ps-field__body > .ps-note { display: block; }

/* =========================================================================
   P701 5-4-2: ヘッダーの氏名と右端の会社（決定 S21・S22）。見本 Docs/mockups/sc-tad-01.html（LY-01）の足す分（app-saas.css）から移した
   ========================================================================= */
/* ---- 丸の横は氏名（前はメールアドレスで、幅 1,440px 以下は隠していた＝.ps-userbtn__mail）。氏名は短いので、どの幅でも出す。長い名前は省略 ---- */
.ps-userbtn__name { color: #d3dfeb; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 160px; }
/* ---- 自分のメニューの頭: メールアドレスの下に会社の名前（アカウントは会社ごと） ---- */
.ps-menu__tenant { font-size: 12px; color: var(--c-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* ---- 右端の会社（自分のメニューの右）。ロゴと出し方（会社名／ロゴ＋会社名／ロゴ）は 5-4-4 の会社の設定で足す ---- */
.ps-tenant { display: inline-flex; align-items: center; gap: 8px; flex: 0 1 auto; min-width: 0; }
.ps-tenant__name { color: var(--c-navy-ink); font-size: 12.5px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px; }

/* =========================================================================
   P701 5-4-3: 会社の状態の帯（LY-07）と、契約とプラン（SC-TAD-03）の利用量の表。見本 Docs/mockups/sc-tad-01.html?tenant=… と sc-tad-03.html の足す分（app-saas.css）から移した
   ========================================================================= */
:root {
  /* 砂時計（トライアルの残り）・カード（契約とプラン）。ほかの印と同じ 16px・線 1.6 */
  --i-card: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1.8' y='3.4' width='12.4' height='9.2' rx='1.6'/%3E%3Cpath d='M1.8 6.6h12.4M4.4 10.2h2.6'/%3E%3C/svg%3E");
  --i-hourglass: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 2h8M4 14h8M5 2v2.1c0 1.3.9 2.3 3 3.9 2.1-1.6 3-2.6 3-3.9V2M5 14v-2.1c0-1.3.9-2.3 3-3.9 2.1 1.6 3 2.6 3 3.9V14'/%3E%3C/svg%3E");
}
/* ---- LY-07 テナントの状態の帯（ログインのあとの画面だけ。ヘッダーの下・画面見出しの上） ---- */
.ps-banner {
  flex: 0 0 auto;
  display: flex; align-items: center; gap: 10px;
  margin: var(--w-gutter) var(--w-gutter) 0;
  padding: 6px 8px 6px 12px;
  border: 1px solid var(--c-accent-line); border-radius: var(--r-md);
  background: var(--c-accent-softer); color: var(--c-accent-ink);
  font-size: 12.5px; line-height: 1.6;
  --ico: var(--i-hourglass);
}
.ps-banner::before {
  content: ""; flex: 0 0 16px; width: 16px; height: 16px; background: currentColor;
  -webkit-mask: var(--ico) center / 16px no-repeat; mask: var(--ico) center / 16px no-repeat;
}
.ps-banner__text { flex: 1 1 auto; min-width: 0; }
.ps-banner__text strong { font-weight: 700; }
.ps-banner > .ps-action { flex: 0 0 auto; }
/* 閲覧のみ（猶予・一時停止）は黄の地（処理済みの札と同じ地と字。錠の印） */
.ps-banner--readonly { border-color: #ead48a; background: var(--c-resolved-bg); color: var(--c-resolved-fg); --ico: var(--i-lock); }
.ps-banner--readonly > .ps-action { color: var(--c-resolved-fg); border-color: #dcc16a; }
.ps-banner + .ps-pagehead { padding-top: 12px; }
.ps-banner + .ps-main { padding-top: var(--w-gutter); }

/* ---- SC-ADM-12 各種設定の進む先の印（契約とプラン） ---- */
.ps-gotolist__item--contract { --ico: var(--i-card); }
/* ---- SC-TAD-03 契約とプラン: 利用量の表（いまの数は Jost・単位は小さく。上限に対する棒）。英語の単位（users・issues）は空白を少し広く ---- */
.ps-usage__value { font-family: var(--f-brand); font-variant-numeric: tabular-nums; }
.ps-usage__value .ps-usage__unit { font-family: var(--f-text); font-size: 12px; color: var(--c-muted); margin-left: 2px; }
.ps-usage .ps-meter { width: 120px; }
.ps-usage .ps-usage__now { width: 90px; }
.ps-usage .ps-usage__limit { width: 160px; }
.ps-usage .ps-usage__bar { width: 150px; }
.ps-usage td > .ps-meter { margin-left: 0; }
.ps-usage td { overflow: visible; }
html[lang="en"] .ps-usage__value .ps-usage__unit { margin-left: 4px; }

/* =========================================================================
   P701 5-4-4: 会社の設定（SC-TAD-04）と会社のロゴ（ヘッダーの右端・ログインの画面。決定 S21）。見本 Docs/mockups/sc-tad-04.html・sc-tad-01.html・sc-tau-01.html の足す分（app-saas.css）から移した
   ========================================================================= */
/* ---- SC-ADM-12 各種設定の進む先の印（会社の設定） ---- */
.ps-gotolist__item--tenant { --ico: var(--i-building); }
/* ---- SC-TAD-04 会社の設定: ロゴの枠（見本の表示）・ロゴが無いときの字・欄のあとの注記と誤りは次の行へ ---- */
.ps-logo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ps-logo__preview {
  display: inline-flex; align-items: center; justify-content: center;
  width: 190px; height: 58px; padding: 6px 10px;
  border: 1px dashed var(--c-line-strong); border-radius: var(--r-md); background: var(--c-surface-2);
}
.ps-logo__preview > svg, .ps-logo__preview > img { max-width: 100%; max-height: 100%; }
.ps-logo__empty { color: var(--c-faint); font-size: 12px; }
#sc-tad-04-frm-main .ps-field__body > .ps-note, #sc-tad-04-frm-main .ps-field__body > .ps-field__error { display: block; }
#sc-tad-04-msg-logo:empty { display: none; }
/* ---- 会社のロゴ（会社の設定で入れたもの）---------------------------------------------------------
   ヘッダーの右端（自分のメニューの丸の右）に、会社を出す。ロゴは紺の帯の上でも、どんな色でも見えるよう白い札に入れる。
   出し方は会社の設定で選ぶ: 会社名（ps-tenant--name）／ロゴ＋会社名（既定。幅 1,440px 以下はロゴだけ＝メールアドレスを隠す幅）／ロゴ（ps-tenant--logo）。
   ロゴが無い会社は、どれを選んでいても会社名だけ */
.ps-tenant__logo {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  height: 30px; padding: 3px 8px; box-sizing: border-box; background: #fff; border-radius: var(--r-sm);
}
.ps-tenant__logo > img { display: block; max-height: 22px; max-width: 110px; width: auto; height: auto; }
.ps-tenant--name .ps-tenant__logo { display: none; }                                      /* 会社名 */
.ps-tenant--logo .ps-tenant__logo:not([hidden]) + .ps-tenant__name { display: none; }        /* ロゴ */
@media (max-width: 1440px) { .ps-tenant:not(.ps-tenant--name) .ps-tenant__logo:not([hidden]) + .ps-tenant__name { display: none; } }  /* ロゴ＋会社名は狭いとロゴだけ */
/* ログインの画面: ロゴがあるときは建物の印をやめ、ロゴの右に会社名と URL を 2 行で */
.ps-auth__tenant.has-logo::before { display: none; }
.ps-auth__tenant.has-logo { gap: 12px; }
.ps-auth__tenantlogo {
  display: inline-flex; align-items: center; justify-content: center;
  height: 48px; padding: 6px 12px; box-sizing: border-box;
  border: 1px solid var(--c-line); border-radius: var(--r-md); background: #fff;
}
.ps-auth__tenantlogo > svg, .ps-auth__tenantlogo > img { display: block; max-height: 34px; max-width: 170px; width: auto; height: auto; }
.ps-auth__tenant.has-logo .ps-auth__tenantname { display: grid; line-height: 1.5; }
.ps-auth__tenant.has-logo .ps-auth__host { margin-left: 0; }

/* =========================================================================
   P701 5-4-5: 社員管理（SC-TAD-01）に足す分 — ユーザー数と上限・上限に達したときの注記と押せない「新規作成」・招待の節。
   見本 Docs/mockups/sc-tad-01*.html の足す分（app-saas.css）から移した
   ========================================================================= */
.ps-count--seats { padding: 1px 8px; border: 1px solid var(--c-line); border-radius: 999px; background: var(--c-surface-2); }
.ps-count--seats.is-full { border-color: #ead48a; background: var(--c-resolved-bg); color: var(--c-resolved-fg); }
.ps-limitnote {
  margin: 8px 16px 0; padding: 7px 12px;
  border: 1px solid #ead48a; border-radius: var(--r-md);
  background: var(--c-resolved-bg); color: var(--c-resolved-fg); font-size: 12px; line-height: 1.6;
}
.ps-limitnote a { color: var(--c-accent-ink); }
.ps-excel:disabled, .ps-excel:disabled:hover {
  background: var(--c-btn-disabled); color: var(--c-btn-disabled-fg); border-color: var(--c-line); cursor: not-allowed;
}
.ps-invite__actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }