/* v2 の組み合わせ（/compose。I47 N7-7。features/compose/compose-screen.js）。.panel・.menu・.primary は ui/style.css のもの。
   チップ（compose-chips.js）の見た目は「組み合わせて選ぶ」ポップアップ（compose-popup.js の .fox-pick）と共有する */
.v2-compose .compose-notice { font-size: 0.82rem; color: var(--text-2); margin: 0 0 8px; }
.v2-compose .compose-pv { display: flex; gap: 10px; align-items: center; }
.v2-compose .compose-face { width: 56px; height: 56px; image-rendering: pixelated; font-size: 2.4rem; line-height: 56px; text-align: center; flex: none; }
.v2-compose .compose-pv-text { min-width: 0; }
.v2-compose .compose-name { margin: 0; font-weight: 700; font-size: 1.05rem; overflow-wrap: anywhere; }
.v2-compose .compose-rate { margin: 2px 0 0; font-size: 0.85rem; font-variant-numeric: tabular-nums; }
.v2-compose .compose-sub-note { margin: 4px 0 0; font-size: 0.75rem; color: var(--text-2); }
.v2-compose .compose-errors { margin: 8px 0 0; padding-left: 1.2em; font-size: 0.82rem; color: var(--danger, #c0392b); }
.v2-compose .compose-blocked { margin: 8px 0 0; font-size: 0.82rem; color: var(--text-2); }
:is(.v2-compose, .fox-pick) .compose-cat { margin: 16px 0 6px; font-size: 1rem; }
:is(.v2-compose, .fox-pick) .compose-cat small, :is(.v2-compose, .fox-pick) .compose-sub small { font-weight: 400; font-size: 0.72rem; color: var(--text-2); }
:is(.v2-compose, .fox-pick) .compose-sub { margin: 10px 0 4px; font-size: 0.85rem; }
:is(.v2-compose, .fox-pick) .compose-bases, :is(.v2-compose, .fox-pick) .compose-parts, :is(.v2-compose, .fox-pick) .compose-profiles { display: flex; flex-wrap: wrap; gap: 6px; }
:is(.v2-compose, .fox-pick) .compose-chip { min-height: 40px; padding: 4px 10px; font-size: 0.85rem; }
:is(.v2-compose, .fox-pick) .compose-chip[aria-pressed='true'], :is(.v2-compose, .fox-pick) .compose-chip[aria-checked='true'] { background: var(--accent); border-color: var(--accent); color: #fff; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) :is(.v2-compose, .fox-pick) .compose-chip[aria-pressed='true'], :root:not([data-theme='light']) :is(.v2-compose, .fox-pick) .compose-chip[aria-checked='true'] { color: #1a1206; }
}
:is(.v2-compose, .fox-pick) .compose-chip.blocked { opacity: 0.55; border-style: dashed; cursor: not-allowed; }
:is(.v2-compose, .fox-pick) .compose-chip.locked { color: var(--text-2); }
.v2-compose .compose-msg { min-height: 1.4em; margin: 12px 0 0; font-size: 0.82rem; }
.v2-compose .compose-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 10px 0 0; }
.v2-compose .compose-actions > p { flex-basis: 100%; margin: 4px 0 0; font-size: 0.78rem; color: var(--text-2); overflow-wrap: anywhere; }
.v2-compose .compose-actions a { color: var(--accent); font-weight: 600; text-decoration: none; }
.v2-compose .compose-auto-row { margin: 0 0 6px; }
:is(.v2-compose, .fox-pick) .compose-chip-sub { display: block; font-size: 0.75rem; font-weight: 400; opacity: 0.85; font-variant-numeric: tabular-nums; }
/* 「組み合わせて選ぶ」ポップアップ（compose-popup.js。器は狐のシートと同じ .dialog.fs） */
.fox-pick .fox-pick-chips { min-width: 0; }
.fox-pick .fox-pick-chips .compose-cat { margin: 10px 0 4px; font-size: 0.85rem; }
.fox-pick .fox-pick-name { margin: 10px 0 0; font-weight: 700; overflow-wrap: anywhere; }
.fox-pick .fox-pick-name.is-ng { font-weight: 400; color: var(--text-2); }
.fox-pick .fox-pick-msg { min-height: 1.2em; }
.fox-pick .fox-pick-apply[aria-disabled='true'] { opacity: 0.55; cursor: not-allowed; }
.fox-pick .fs-buttons { flex-wrap: wrap; }
.fox-pick .fox-pick-parts[aria-disabled='true'] { opacity: 0.55; }
.fox-pick-open { min-height: 40px; }
.fox-pick-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
/* 鍵の札をたたむ（compose-chips.js の foldLocked。R1 #24） */
.compose-more { margin: 4px 0 8px; }
.compose-more > summary { display: inline-flex; align-items: center; min-height: 40px; padding: 0 12px; border: 1px dashed var(--border); border-radius: 999px; color: var(--text-2); font-weight: 700; font-size: 0.88rem; list-style: none; cursor: pointer; }
.compose-more > summary::-webkit-details-marker { display: none; }
.compose-more[open] > summary { margin-bottom: 6px; }
