/* app.css 分割 2/4（段4タスク8）: 診断先ページ（タブ・名簿）／ホーム（プロジェクト・履歴）／問診（グリル・生成パネル）／
   右レール常設AIアシスタント。index.html で app.css の直後に読み込む（この順を変えない）。 */


/* ============ 診断先ページ: タブ（段4） ============ */
.tabs{display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:18px}
.tab-btn{border:0; background:none; cursor:pointer; padding:10px 16px; font-size:13.5px; font-weight:700; color:var(--sub); border-bottom:2px solid transparent; margin-bottom:-1px; transition:color var(--t),border-color var(--t)}
.tab-btn:hover{color:var(--ink)}
.tab-btn[aria-selected="true"]{color:var(--brand-ink); border-bottom-color:var(--brand)}

/* ============ 名簿: 表（概要行＋クリックで展開する編集パネル・段4） ============ */
/* 行の高さ・余白（padding/margin-bottom）はプレビュー実機確認1（段4タスク8追補）で詰めた値。
   4人3ツールが835pxビューポートの縦1画面に収まることが条件（新規登録フォームは既定で閉じる方を主対応、
   ここは補助対応）。 */
.roster-table{border:1px solid var(--line); border-radius:var(--r); overflow:hidden; margin-bottom:10px}
.roster-row{display:grid; grid-template-columns:2fr 1fr 1fr 18px; align-items:center; gap:10px; width:100%; border:0; border-top:1px solid var(--line-soft); background:var(--surface); text-align:left; padding:7px 14px; font:inherit; color:var(--ink); cursor:pointer}
.roster-table .roster-row:first-child{border-top:0}
.roster-row:hover{background:var(--surface-2)}
.roster-row.expanded{background:var(--brand-soft)}
.roster-row.roster-row-2col{grid-template-columns:2fr 2fr 18px}
/* 見出し行（roster-row と同時に付く。後勝ちでは負けるため2クラス連結で優先度を上げる） */
.roster-row.roster-head{background:var(--surface-2); font-size:11px; font-weight:800; color:var(--sub); cursor:default; padding-top:6px; padding-bottom:6px}
.roster-row.roster-head:hover{background:var(--surface-2)}
.roster-col{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px}
.roster-col-name{font-weight:700}
.roster-chev{font-size:11px; color:var(--sub); justify-self:end}
.roster-row-detail{border-top:1px solid var(--brand-line); background:var(--brand-soft); padding:14px}
.roster-row-detail .actions{margin-top:6px}
/* 名簿の新規登録フォームの開閉ブロック（既定で閉じる・プレビュー実機確認1・段4タスク8追補）。
   トグルボタンは表のすぐ下、開いた時のフォームはボタンの下に続く。 */
.roster-add-block{margin-top:2px}
.roster-add-toggle{margin-bottom:2px}
.roster-add-block .subsection-title{margin-top:14px}

/* ============ ホーム（プロジェクト/履歴） ============ */
.hero-head{display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:20px; flex-wrap:wrap}
.hero-head h1{font-size:24px; font-weight:800; letter-spacing:-.02em; margin:0}
.hero-head p{margin:5px 0 0; color:var(--sub); font-size:13px}
.hero-head .actions{margin:0}
.page-intro{font-size:14px !important; color:var(--ink-2) !important; max-width:660px}
.resume-card{position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:28px; margin:0 0 18px; padding:22px 24px; border:1px solid var(--brand-line); border-radius:var(--r-lg); background:linear-gradient(135deg,#f5fafb 0,var(--brand-soft) 100%); box-shadow:var(--sh-sm)}
.resume-card::after{content:""; position:absolute; right:-40px; top:-72px; width:180px; height:180px; border-radius:50%; border:36px solid rgba(32,98,119,.06); pointer-events:none}
.resume-copy{position:relative; z-index:1; min-width:0}
.eyebrow{display:block; margin-bottom:3px; color:var(--brand); font-size:10.5px; font-weight:800; letter-spacing:.08em}
.resume-copy h2{margin:0; font-size:20px; line-height:1.35; letter-spacing:-.01em}
.resume-copy>p{margin:4px 0 12px; color:var(--sub); font-size:12px}
.resume-next{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:12px}
.resume-next>span:first-child{color:var(--sub)}
.resume-next b{color:var(--brand-ink)}
.resume-action{position:relative; z-index:1; flex:0 0 auto}
.statrow{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:24px}
.stat{background:rgba(255,255,255,.78); border:1px solid var(--line); border-radius:var(--r); padding:13px 16px; box-shadow:var(--sh-xs)}
.stat .sv{font-size:24px; font-weight:800; letter-spacing:-.02em; line-height:1}
.stat .sl{font-size:12px; color:var(--sub); font-weight:600; margin-top:6px}
.stat.accent .sv{color:var(--brand)}

.dash{display:grid; grid-template-columns:minmax(0,1.65fr) minmax(260px,1fr); gap:20px; align-items:start}
.sectionlabel{display:flex; align-items:center; justify-content:space-between; margin:2px 2px 12px}
.sectionlabel h3{font-size:14px; font-weight:800; margin:0}
.sectionlabel .mini{font-size:12px; color:var(--sub)}

.proj{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:16px 18px; margin-bottom:14px; box-shadow:var(--sh-xs)}
.proj .ph{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:4px}
.proj .pname{font-size:15px; font-weight:800}
.proj .pnote{font-size:12px; color:var(--sub); margin-bottom:10px}
.proj-cases{display:flex; flex-direction:column; gap:8px}
.pcase{display:flex; align-items:center; gap:12px; width:100%; text-align:left; color:var(--ink); font:inherit; border:1px solid var(--line-soft); border-radius:var(--r); padding:11px 13px; cursor:pointer; background:var(--surface-2); transition:border-color var(--t),background var(--t),transform 140ms var(--ease-out),box-shadow var(--t)}
.pcase:hover{border-color:var(--brand-line); background:var(--brand-soft)}
.pcase .pc-main{flex:1; min-width:0}
.pcase .pc-t{display:block; font-weight:700; font-size:13.5px}
.pcase .pc-m{display:block; font-size:11.5px; color:var(--sub); margin-top:1px}
/* プレビュー実機確認3（段4タスク8追補）: unit は生成方式（AI等）によっては長い内訳文になりうるため、
   nowrap で1行に固定せず、カードの幅の中で「年間の数字（pl-num）／内訳（pl-unit）」の2行に分けて
   読みやすく折り返す（.pc-main を過度に圧迫しないよう max-width で列自体の幅も抑える）。 */
.pcase .pc-loss{display:flex; flex-direction:column; align-items:flex-end; flex:0 0 auto; max-width:180px}
.pcase .pc-loss .pl-cap{font-size:9.5px; font-weight:700; letter-spacing:.04em; color:var(--faint); white-space:nowrap}
.pcase .pc-loss .pl-v{display:flex; flex-direction:column; align-items:flex-end; line-height:1.2}
.pcase .pc-loss .pl-num{font-size:15px; font-weight:800; color:var(--brand-ink)}
.pcase .pc-loss .pl-unit{font-size:10.5px; font-weight:600; color:var(--sub); white-space:normal; text-align:right; max-width:180px}
.pcase .pc-side{display:flex; align-items:flex-end; flex-direction:column; gap:5px; flex:0 0 auto}
.pcase .pc-next{font-size:11px; font-weight:800; color:var(--brand)}
.proj-add{display:flex; gap:10px; margin-top:12px}

.feed{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:16px 18px; box-shadow:var(--sh-xs)}
.feeditem{display:grid; grid-template-columns:12px minmax(0,1fr) auto; align-items:start; width:100%; gap:9px; padding:10px 2px; border:0; border-bottom:1px solid var(--line-soft); background:none; text-align:left; cursor:pointer; transition:color var(--t),background var(--t)}
.feeditem:last-child{border-bottom:0}
.feeditem .fmark{width:9px; height:9px; border-radius:50%; background:var(--brand); margin-top:6px}
.feeditem .feed-copy{display:block; min-width:0}
.feeditem .ft{display:block; font-size:12.5px; font-weight:600; line-height:1.45}
.feeditem .fm{display:block; font-size:11px; color:var(--sub); margin-top:2px; font-family:ui-monospace,monospace}
.feed-arrow{color:var(--brand); opacity:0; transform:translateX(-3px); transition:opacity var(--t),transform var(--t)}
.feeditem:hover .feed-arrow{opacity:1; transform:translateX(0)}
.empty{color:var(--faint); font-size:12.5px; padding:14px 2px}

/* ============ グリル問診 ============ */
.gate{position:sticky; top:70px; z-index:6; display:flex; flex-direction:column; align-items:stretch; gap:8px; border-radius:var(--r); padding:12px 16px; margin:6px 0 16px; font-size:14px; font-weight:700; box-shadow:0 6px 10px -8px rgba(20,24,28,.25)} /* MTG中の操作ハブ＝sticky固定（P4-5・.karte-nav と同パターン） */
.gate.open{background:var(--warn-soft); color:var(--warn)}
.gate.clear{background:var(--ok-soft); color:var(--ok)}
.grow{display:flex; align-items:center; gap:12px; justify-content:space-between}
.gmsg{flex:1; line-height:1.4}
.gjump{flex:0 0 auto; border:1px solid currentColor; background:transparent; color:inherit; font-weight:800; font-size:12px; padding:4px 12px; border-radius:999px; cursor:pointer; white-space:nowrap; transition:background var(--t)}
.gjump:hover{background:rgba(255,255,255,.55)}
/* intake のライブ推定機会損失 */
.lossest{border:1px dashed var(--line); border-radius:var(--r); padding:13px 16px; margin:2px 0 14px; background:var(--surface-2); transition:border-color var(--t),background var(--t)}
.lossest.on{border-style:solid; border-color:var(--brand-line); background:linear-gradient(180deg,var(--brand-soft),var(--surface))}
.lossest .le-cap{font-size:10.5px; font-weight:800; letter-spacing:.04em; color:var(--faint)}
.lossest .le-fig{font-size:30px; font-weight:800; line-height:1.1; color:var(--faint); margin-top:2px; letter-spacing:-.01em}
.lossest.on .le-fig{color:var(--brand-ink)}
.lossest .le-note{font-size:12px; line-height:1.7; color:var(--sub); margin-top:7px}
/* 画像ピン注釈 */
.annot{margin-top:16px; border:1px solid var(--line); border-radius:var(--r-lg); padding:18px 20px; background:var(--surface); box-shadow:var(--sh-xs)}
.an-head{display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin-bottom:12px}
.an-head h3{margin:0 0 3px; font-size:15px; color:var(--brand-ink)}
.an-count{color:var(--sub); font-weight:700; font-size:13px}
.an-tools{display:flex; gap:8px; flex:0 0 auto; align-items:center; margin-bottom:10px}
.an-tools[hidden]{display:none}
.an-file{position:relative; overflow:hidden}
.an-file input{position:absolute; inset:0; opacity:0; cursor:pointer}
/* 画像/動画 モード切替 */
.an-modes{display:inline-flex; flex:0 0 auto; border:1px solid var(--line); border-radius:999px; overflow:hidden; background:var(--surface-2)}
.an-mode{border:0; background:transparent; color:var(--ink-2); font-size:12.5px; font-weight:700; padding:6px 16px; cursor:pointer; font-family:inherit}
.an-mode.active{background:var(--brand); color:#fff}
.an-cur{font-family:ui-monospace,monospace; font-weight:800; margin-left:4px}
.an-stage{position:relative; border:1px solid var(--line-soft); border-radius:var(--r); background:var(--surface-2); overflow:hidden; min-height:80px}
.an-empty{padding:26px 20px; text-align:center; font-size:12.5px; color:var(--sub); line-height:1.7}
#anImg{display:none; width:100%; height:auto; cursor:crosshair}
#anVid{display:none; width:100%; height:auto; background:#000}
.an-pins{position:absolute; inset:0; pointer-events:none}
.an-pin{position:absolute; transform:translate(-50%,-50%); width:24px; height:24px; border-radius:50%; border:2px solid #fff; background:var(--risk); color:#fff; font-size:12px; font-weight:800; cursor:grab; touch-action:none; pointer-events:auto; box-shadow:0 2px 6px rgba(20,24,28,.3); display:flex; align-items:center; justify-content:center}
.an-pin:hover{background:var(--brand-ink)}
.an-list{margin-top:12px; display:flex; flex-direction:column; gap:8px}
.an-row{display:flex; align-items:center; gap:10px}
.an-no{flex:0 0 auto; width:22px; height:22px; border:0; padding:0; border-radius:50%; background:var(--risk-soft); color:var(--risk); font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; cursor:pointer; font-family:inherit}
.an-no-vid{width:auto; min-width:62px; height:24px; border-radius:999px; padding:0 10px; background:var(--brand-soft); color:var(--brand-ink); font-family:ui-monospace,monospace; white-space:nowrap}
.an-no-vid:hover{background:var(--brand); color:#fff}
.an-note{flex:1; padding:8px 11px; border:1px solid var(--line); border-radius:var(--r-sm); font-family:inherit; font-size:13px}
.an-note:focus{outline:none; border-color:var(--brand-line); box-shadow:0 0 0 3px var(--brand-glow)}
.an-del{flex:0 0 auto; border:1px solid var(--line); background:var(--surface); color:var(--sub); width:28px; height:28px; border-radius:var(--r-sm); cursor:pointer; font-size:15px; line-height:1}
.an-del:hover{border-color:var(--risk-line); color:var(--risk); background:var(--risk-soft)}
/* 裏づけ種別セレクト / 区間ボタン（一覧の各行） */
.an-src{flex:0 0 auto; border:1px solid var(--line); border-radius:var(--r-sm); padding:6px 7px; font-family:inherit; font-size:12px; color:var(--ink-2); background:var(--surface); cursor:pointer}
.an-end{flex:0 0 auto; border:1px solid var(--line); background:var(--surface); color:var(--sub); height:30px; padding:0 10px; border-radius:var(--r-sm); cursor:pointer; font-size:12px; font-weight:700; white-space:nowrap}
.an-end:hover{border-color:var(--brand-line); color:var(--brand-ink); background:var(--brand-soft)}
.an-end.on{border-color:var(--ok); color:var(--ok); background:var(--ok-soft)}
/* ピンのドラッグ（cursor:grab/touch-action は .an-pin 本体へマージ済み・P2-4） */
.an-pin.dragging{cursor:grabbing; box-shadow:0 3px 10px rgba(20,24,28,.45)}
/* 録画サムネのストリップ（複数録画の切替） */
.an-thumbs{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px}
.an-thumbs[hidden]{display:none}
.an-thumb{flex:0 0 auto; width:128px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); padding:0; overflow:hidden; cursor:pointer; display:flex; flex-direction:column}
.an-thumb img{width:100%; height:72px; object-fit:cover; display:block; background:#000}
.an-thumb-cap{font-size:11px; color:var(--ink-2); padding:4px 6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.an-thumb.active{border-color:var(--brand); box-shadow:0 0 0 2px var(--brand-glow)}
.an-thumb.active .an-thumb-cap{color:var(--brand-ink); font-weight:700}
.gbar{height:6px; background:rgba(20,24,28,.08); border-radius:999px; overflow:hidden}
.gbar span{display:block; height:100%; width:0; background:var(--brand); border-radius:999px; transition:width .25s ease}
.gate.clear .gbar span{background:var(--ok)}
.qcard{border:1px solid var(--line); border-radius:var(--r); padding:16px 18px; margin-bottom:12px; background:var(--surface); box-shadow:var(--sh-xs)}
.qcard.skipped{opacity:.55}
.qcard.answered{box-shadow:inset 3px 0 0 var(--ok),var(--sh-xs)}
.qhead{display:flex; align-items:center; gap:10px; margin-bottom:6px}
.qstat{margin-left:auto; font-size:11px; font-weight:800; padding:2px 9px; border-radius:999px; white-space:nowrap}
.qstat.done{color:var(--ok); background:var(--ok-soft)}
.qstat.todo{color:var(--warn); background:var(--warn-soft)}
.qstat.skip{color:var(--faint); background:var(--line-soft)}
.qid{font-family:ui-monospace,monospace; font-size:11.5px; font-weight:800; color:var(--brand); background:var(--brand-soft); border-radius:6px; padding:2px 8px}
.qcat{font-size:11.5px; font-weight:700; color:var(--sub); border:1px solid var(--line); border-radius:999px; padding:1px 9px}
.qtext{font-weight:700; font-size:14.5px}
.qwhy{font-size:12px; color:var(--sub); margin:2px 0 9px}
.qskip{font-size:12px; color:var(--sub); display:flex; align-items:center; gap:5px; cursor:pointer; user-select:none}
/* 言動の乖離は任意。空のうちは地味に、書き込まれたら赤で目立たせる */
.gapbox{margin-top:9px; border-left:3px solid var(--line); background:var(--surface-2); border-radius:0 9px 9px 0; padding:9px 12px}
.gapbox .gl{font-size:11.5px; font-weight:700; color:var(--sub); margin-bottom:4px}
.gapbox:has(input:not(:placeholder-shown)){border-left-color:var(--risk); background:var(--risk-soft)}
.gapbox:has(input:not(:placeholder-shown)) .gl{color:var(--risk)}
.flow-foot{margin-top:4px}
.gapbox .row2{gap:10px}

/* 生成パネル */
.genpanel{border:1px solid var(--brand-line); border-radius:var(--r); padding:17px 19px; background:linear-gradient(180deg,var(--brand-soft),#fff); margin-top:14px}
.genpanel h3{margin:0 0 4px; font-size:15px; color:var(--brand-ink)}
/* ===== 右レール: 常設AIアシスタント（3カラム右・幅可変・下ドック可） ===== */
.assistant{display:none; position:sticky; top:0; height:100vh; flex-direction:column; background:var(--surface); border-left:1px solid var(--line); min-width:0}
.app.assist-open{grid-template-columns:var(--sidebar-w) 1fr var(--assist-w)}
.app.assist-open .assistant{display:flex}
.assist-resize{position:absolute; z-index:3; background:transparent; touch-action:none}
.app:not(.assist-bottom) .assist-resize{top:0; left:-3px; width:7px; height:100%; cursor:col-resize}
.app.assist-bottom .assist-resize{top:-3px; left:0; width:100%; height:7px; cursor:row-resize}
.assist-resize:hover{background:var(--brand-glow)}
.assist-head{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 8px 0 14px; min-height:56px; flex:0 0 auto; border-bottom:1px solid var(--line)}
.assist-title{font-weight:800; color:var(--brand-ink); font-size:14px}
.assist-headbtns{display:flex; align-items:center; gap:2px}
.assist-icon{border:none; background:none; font-size:18px; line-height:1; color:var(--sub); cursor:pointer; padding:5px 8px; border-radius:8px}
.assist-icon:hover{background:var(--brand-soft); color:var(--brand-ink)}
.assist-ctx{flex:0 0 auto; padding:7px 14px; font-size:12px; color:var(--brand-ink); background:var(--brand-soft); border-bottom:1px solid var(--line)}
.assist-body{flex:1 1 auto; display:flex; flex-direction:column; min-height:0; padding:12px 14px; gap:8px; overflow:hidden}
.assist-empty{font-size:13px; color:var(--sub); line-height:1.8; margin-bottom:6px}
/* 会話＝上でスクロール / 入力＝下に固定・大きめ（右チャットの基本形） */
.assist-body .grillchat{flex:1 1 auto; max-height:none; min-height:0; margin:0}
.assist-body .grillinput{flex:0 0 auto}
.assist-body .grillinput textarea{min-height:66px}
.assist-stat{flex:0 0 auto; margin:0}
/* 右端の常設ハンドル（A案ドロワー・開閉の単一コントロール） */
.assist-handle{position:fixed; right:0; top:50%; transform:translateY(-50%); z-index:28; display:flex; flex-direction:column; align-items:center; gap:6px; background:var(--brand); color:#fff; border:none; cursor:pointer; padding:15px 8px; border-radius:12px 0 0 12px; box-shadow:-4px 0 16px rgba(20,24,28,.16); font-family:inherit; font-weight:800; letter-spacing:.03em; transition:background var(--t),right .2s ease}
.assist-handle:hover{background:var(--brand-ink)}
.assist-handle .ah-ic{font-size:16px; line-height:1}
.assist-handle .ah-lbl{writing-mode:vertical-rl; text-orientation:mixed; font-size:12px}
.assist-handle .ah-chev{font-size:13px; opacity:.9; transition:transform .2s ease}
/* 開いている間は右レール(幅=assist-w)の左肩へ寄せ、シェブロンを反転 */
.app.assist-open:not(.assist-bottom) .assist-handle{right:var(--assist-w)}
.app.assist-open .assist-handle .ah-chev{transform:rotate(180deg)}
@media (max-width:1100px){ .app.assist-open:not(.assist-bottom) .assist-handle{right:min(92vw,var(--assist-w))} }
.gmsg-done{align-self:stretch; padding:9px 12px; border-radius:10px; font-size:12.5px; font-weight:700; color:var(--brand-ink); background:var(--brand-soft); border:1px solid var(--brand)}
/* 下ドック（VSCode風・幅いっぱい＝長文に強い / 高さ可変） */
.app.assist-bottom.assist-open{grid-template-columns:var(--sidebar-w) 1fr}
.app.assist-bottom .assistant{position:fixed; left:var(--sidebar-w); right:0; bottom:0; top:auto; width:auto; height:var(--assist-h); border-left:0; border-top:1px solid var(--line); box-shadow:0 -6px 22px rgba(20,24,28,.10); z-index:25}
.app.assist-bottom.assist-open .main-wrap{padding-bottom:var(--assist-h)}
.app.assist-bottom .gmsg-ai,.app.assist-bottom .gmsg-user{max-width:720px}
@media (max-width:1100px){
  .app.assist-open{grid-template-columns:var(--sidebar-w) 1fr}
  .app:not(.assist-bottom) .assistant{position:fixed; top:0; right:0; width:min(92vw,var(--assist-w)); z-index:30; box-shadow:var(--sh-md)}
  .app.assist-bottom .assistant{left:0; height:min(var(--assist-h),100dvh)}
  .app.assist-open .assist-handle{display:none}
}
/* 問診の中央記録ラベル */
.reclabel{font-size:12px; font-weight:800; letter-spacing:.04em; color:var(--brand-ink); background:var(--brand-soft); display:inline-block; padding:4px 12px; border-radius:999px; margin:2px 0 12px}
.othercard .qtext{font-weight:700}
/* 未使用: .grillpanel / .grillpanel h3 / .linkbtn（問診の右レール移設で孤児化）は削除・P2-4 */
.grillchat{display:flex; flex-direction:column; gap:8px; max-height:340px; overflow-y:auto; padding:12px; margin:6px 0 10px; background:#fff; border:1px solid var(--brand-line); border-radius:var(--r-sm)}
.grillchat:empty{display:none}
.assist-body .grillchat:empty{display:flex} /* レール/下ドック内は空でも枠を残し、入力欄を最下部に固定 */
.gmsg-ai,.gmsg-user{max-width:82%; padding:9px 13px; border-radius:13px; font-size:13.5px; line-height:1.6; white-space:pre-wrap; word-break:break-word}
.gmsg-ai{align-self:flex-start; background:var(--brand-soft); color:var(--brand-ink); border-bottom-left-radius:4px}
.gmsg-user{align-self:flex-end; background:var(--brand); color:#fff; border-bottom-right-radius:4px}
.grillinput{display:flex; flex-direction:column; gap:8px}
.grillinput textarea{width:100%; font:inherit; font-size:13.5px; border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 12px; background:#fff; resize:vertical}
.grillinput textarea:focus{outline:none; border-color:var(--brand-line); box-shadow:0 0 0 3px var(--brand-glow)}
.grillbtns{display:flex; gap:8px; flex-wrap:wrap}
/* 未使用: .grillsummary / .grillsummary .gmsg（右レール移設で孤児化）は削除・P2-4 */
.codebox{width:100%; min-height:150px; font-family:ui-monospace,Menlo,monospace; font-size:12px; border:1px solid var(--line); border-radius:var(--r-sm); padding:12px; background:#fff; color:#384044; resize:vertical}
details summary{cursor:pointer; font-weight:700; color:var(--brand); font-size:13.5px; margin:10px 0 8px}