:root{
  --bg:#ffffff;
  --bg-soft:#FBFAFC;
  --ink:#1A1620;
  --muted:#4E4859;
  --faint:#6B6478;
  --line:#ECE8F0;
  --line-strong:#DED8E6;
  --mag:#EC008C;
  --cyan:#00AEEF;
  --mag-600:#C8067A;
  --mag-700:#A30865;
  --mag-wash:#FDE9F4;
  --mag-tint:#FCF3F8;
  --ok:#12A06A;
  --ok-wash:#E6F6EE;
  --danger:#e5484d;
  --danger-700:#c93c40;
  --danger-wash:#fdecee;
  --danger-line:#f5c2c5;
  --radius:14px;
  --radius-sm:10px;
  --shadow:0 1px 2px rgba(26,22,32,.04), 0 8px 24px -12px rgba(26,22,32,.12);
  --shadow-lg:0 24px 60px -20px rgba(26,22,32,.28);
  --sans:"Zen Kaku Gothic New",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow-x:hidden}
/* Zen Kaku Gothic New は 400 だと線が細く薄く見えるため、本文の既定を 500 にする（9/28） */
body{font-family:var(--sans);font-weight:500;color:var(--ink);background:var(--bg);line-height:1.6}
::selection{background:var(--mag-wash);color:var(--mag-700)}
button{font-family:inherit;cursor:pointer}
input,select,textarea,button{font-weight:inherit} /* 入力欄とボタンも本文と同じ太さに（ブラウザ既定の400にしない） */
a{cursor:pointer}

/* ---------- shell ---------- */
.app{display:flex;height:100vh;overflow:hidden}

/* ---------- sidebar ---------- */
.sidebar{width:286px;flex:none;height:100%;overflow-y:auto;scrollbar-gutter:stable;overflow-x:hidden;background:var(--bg-soft);transition:width .3s cubic-bezier(.4,0,.2,1),padding .3s,border-color .3s;
  border-right:1px solid var(--line);padding:20px 16px 20px;display:flex;flex-direction:column;gap:18px}
.sidebar::-webkit-scrollbar{width:8px}
.sidebar::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:8px}

/* brand + clock (one row) */
.brand{position:sticky;top:0;z-index:3;background:var(--bg-soft);padding-bottom:4px}
.brand-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow)}
.brand-id{position:relative;display:flex;align-items:center}
.logo-row{display:flex;align-items:center;gap:8px}
.brand .logo{font-family:"Archivo Black",var(--sans);font-weight:900;font-size:26px;letter-spacing:-.04em;line-height:1;position:relative;color:var(--ink)}
.brand .logo .lc{color:var(--mag)}
.brand .logo .cy{position:absolute;left:2px;bottom:1px;width:8px;height:8px;background:var(--cyan)}
.logo-img{height:19px;width:auto;display:block}
.brand .logo b{color:var(--mag)}
.brand .dot{width:7px;height:7px;border-radius:50%;background:var(--mag);box-shadow:0 0 0 4px var(--mag-wash)}
.brand .tag{position:absolute;top:100%;left:1px;margin-top:1px;white-space:nowrap;font-family:var(--mono);font-size:10.5px;color:var(--faint);letter-spacing:.14em;text-transform:uppercase}
.clock{display:flex;flex-direction:column;align-items:flex-end;gap:3px;min-width:116px} /* 時計の文字の幅が、フォントの読み込みで変わらないように固定（JetBrains Mono の実寸） */
.clock .date{font-family:var(--mono);font-size:13px;color:var(--muted);letter-spacing:.01em;white-space:nowrap}
.clock .time{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:30px;font-weight:500;color:var(--ink);letter-spacing:.01em;line-height:1}
.clock .lv{width:7px;height:7px;border-radius:50%;background:var(--ok);animation:lvblink 1.8s infinite;flex:none}
@keyframes lvblink{0%,100%{opacity:1}50%{opacity:.45}}

.search{display:flex;flex:none;align-items:center;gap:9px;padding:0 15px;height:50px;background:var(--bg);
  border:1px solid var(--mag);border-radius:var(--radius-sm);color:var(--faint);font-size:14px;transition:.18s}
.search:focus-within,.search:hover{border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-wash)}
.search svg{width:16px;height:16px;flex:none}
.search input{border:0;outline:0;background:0;flex:1;font-family:inherit;font-size:14px;color:var(--ink)}
.search input::placeholder{color:var(--faint)}
.search kbd{font-family:var(--mono);font-size:11px;color:var(--faint);border:1px solid var(--line-strong);border-radius:5px;padding:1px 5px}

/* master agent (top, hero) */
.magent{display:flex;align-items:center;gap:11px;padding:11px;border-radius:13px;text-decoration:none;
  background:#fff;border:1px solid var(--mag);color:var(--mag-700);
  box-shadow:0 6px 16px -13px var(--mag);transition:.18s}
.magent:hover{background:var(--mag-tint);box-shadow:0 10px 20px -12px var(--mag);transform:translateY(-1px)}
.magent .ma-ic{width:34px;height:34px;border-radius:10px;background:var(--mag-wash);color:var(--mag-600);display:grid;place-items:center;flex:none}
.magent .ma-t b{font-size:14.5px;font-weight:700;display:block;line-height:1.2;color:var(--ink)}
.magent .ma-t small{font-size:11px;color:var(--muted);font-family:var(--mono);letter-spacing:.02em}
.magent .ma-dot{margin-left:auto;width:8px;height:8px;border-radius:50%;background:var(--mag);box-shadow:0 0 0 3px var(--mag-wash);animation:pulse 1.8s infinite}

.navlabel{font-size:12px;font-weight:700;letter-spacing:.02em;color:var(--muted);padding:0 8px;margin-bottom:-6px}

.group{border-top:1px solid var(--line);padding-top:14px}
.ghead{display:flex;align-items:center;gap:8px;width:100%;background:0;border:0;padding:4px 8px;
  color:var(--muted);font-size:13.5px;font-weight:700;border-radius:8px;transition:.15s}
.ghead:hover{color:var(--ink);background:var(--mag-tint)}
.ghead .chev{margin-left:auto;transition:.2s;color:var(--faint)}
.group.collapsed .chev{transform:rotate(-90deg)}
.ghead .ico{color:var(--mag);display:flex}
.gbody{display:flex;flex-direction:column;gap:1px;margin-top:6px;overflow:hidden}
.group.collapsed .gbody{display:none}
.navitem{display:flex;align-items:center;gap:10px;padding:7px 10px 7px 30px;border-radius:8px;
  color:var(--ink);font-size:14px;text-decoration:none;transition:.14s}
.navitem:hover{background:var(--bg);color:var(--mag-700)}
.navitem.active{background:var(--mag-wash);color:var(--mag-700);font-weight:700}
.navitem.toplink{padding:8px 12px;font-weight:700;gap:9px}
.navitem.toplink svg{color:var(--mag);flex:none}
.navbox{border:1px solid var(--mag);border-radius:13px;background:#fff;box-shadow:0 6px 16px -13px var(--mag);transition:.18s}
.navbox:focus-within{box-shadow:0 0 0 3px var(--mag-wash)}
.navbox .toplink{padding:11px 13px;font-weight:700;gap:9px;border-radius:12px 12px 0 0}
.navbox .toplink.active{background:transparent;color:var(--mag-700)}
.navbox .toplink.active svg{color:var(--mag)}
.navbox .toplink:hover{background:var(--mag-tint)}
.navbox .search{border:0 !important;border-top:1px solid var(--mag-wash) !important;border-radius:0 !important;height:44px;box-shadow:none !important;background:transparent}
.toplink .tl-t{display:flex;flex-direction:column;line-height:1.25}
.toplink .tl-t small{font-size:11px;font-weight:400;color:var(--muted);margin-top:1px}
.navitem .lock{margin-left:auto;color:var(--faint)}
.navitem .badge{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--mag);background:var(--mag-wash);padding:1px 6px;border-radius:20px}
.navitem.rec{color:var(--muted)}

/* nested knowledge sub-groups (toggle) */
.subgroup{margin:1px 0}
.subhead{display:flex;align-items:center;gap:7px;width:100%;background:0;border:0;padding:6px 8px 6px 16px;color:var(--ink);font-size:13px;font-weight:700;border-radius:8px;transition:.14s}
.subhead:hover{background:var(--bg);color:var(--mag-700)}
.subhead .tagchip{margin-left:auto;font-family:var(--mono);font-size:9.5px;font-weight:500;color:var(--faint);border:1px solid var(--line);border-radius:20px;padding:1px 6px}
.subhead .chev{margin-left:auto;transition:.2s;color:var(--faint)}
.subgroup.collapsed .chev{transform:rotate(-90deg)}
.subbody{display:flex;flex-direction:column;gap:1px;margin-top:1px}
.subgroup.collapsed .subbody{display:none}
.subbody .navitem{padding-left:38px;font-size:13.5px}

/* Notion風ナビツリー：ページ行＝トグル一体・左チェブロン・3段ネスト（nv- で名前空間化） */
.nvtree{display:flex;flex-direction:column;gap:1px;margin-top:2px}
.nvbranch{display:flex;flex-direction:column}
.nvbranch[hidden]{display:none}
.nvrow{display:flex;align-items:center;gap:5px;width:100%;padding:6px 8px;border-radius:8px;background:0;border:0;text-align:left;font-size:14px;color:var(--ink);cursor:pointer;transition:.13s;text-decoration:none;font-family:inherit}
.nvrow:hover{background:var(--bg);color:var(--mag-700)}
.nvrow.active{background:var(--mag-wash);color:var(--mag-700);font-weight:700}
.nvrow.lv0{font-weight:700}
.nvtw,.nvtwg{display:flex;align-items:center;justify-content:center;width:17px;height:17px;flex:none;border:0;background:0;padding:0;border-radius:5px;color:var(--faint)}
.nvtw{cursor:pointer}.nvtwg{cursor:default;visibility:hidden}
.nvtw:hover{background:var(--mag-tint);color:var(--mag)}
.nvtw svg{transition:.18s}
.nvbranch.collapsed>.nvrow .nvtw svg{transform:rotate(-90deg)}
.nvkids{display:flex;flex-direction:column;gap:1px;padding-left:15px;margin-top:1px}
.nvbranch.collapsed>.nvkids{display:none}
.nvrow .nvic{display:flex;color:var(--mag);flex:none}
.nvrow .nvlbl{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nvrow .badge{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--mag);background:var(--mag-wash);padding:1px 6px;border-radius:20px}
.nv-empty{padding:5px 8px 5px 23px;font-size:12.5px;color:var(--faint)}
/* 検索結果（検索ボックス直下） */
.search-results{margin-top:6px;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:var(--shadow);overflow:hidden}
.search-results .sr-list{max-height:300px;overflow:auto}
.sr-item{display:flex;align-items:center;gap:9px;width:100%;padding:8px 10px;background:0;border:0;border-bottom:1px solid var(--line);text-align:left;cursor:pointer;transition:.12s}
.sr-item:last-child{border-bottom:0}
.sr-item:hover{background:var(--bg)}
.sr-item .sr-ic{flex:none;color:var(--mag);display:flex}
.sr-item .sr-main{min-width:0}
.sr-item .sr-main b{display:block;font-size:13.5px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-item .sr-main small{font-size:11.5px;color:var(--muted)}
.sr-empty{padding:12px;font-size:13px;color:var(--muted)}
.sr-foot{border-top:1px solid var(--line);background:var(--bg-soft)}
.sr-ask{display:flex;align-items:center;gap:7px;width:100%;padding:9px 11px;background:0;border:0;text-align:left;font-size:13px;font-weight:700;color:var(--mag-700);cursor:pointer;transition:.12s}
.sr-ask:hover{background:var(--mag-tint)}
.sr-ask svg{flex:none;color:var(--mag)}
/* 設定ページ（タブ＋カード） */
.set-tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin:6px 0 22px}
.set-tab{position:relative;padding:10px 14px;background:0;border:0;font-size:15px;font-weight:700;color:var(--muted);cursor:pointer;transition:.13s}
.set-tab:hover{color:var(--ink)}
.set-tab.active{color:var(--mag-700)}
.set-tab.active::after{content:"";position:absolute;left:8px;right:8px;bottom:-1px;height:2.5px;border-radius:3px;background:var(--mag)}
.set-panel{max-width:760px}
.set-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin-bottom:16px;box-shadow:var(--shadow)}
.set-note{font-size:13.5px;color:var(--muted);margin:0 0 16px;line-height:1.6}
.set-label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;margin-bottom:11px}
.set-label svg{color:var(--mag)}
.sf-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;flex:1;min-width:0}
.sf-field>span{font-size:13px;font-weight:600;color:var(--ink)}
.sf-field input,.sf-field select{padding:9px 12px;border:1px solid var(--line-strong);border-radius:9px;font-size:14.5px;font-family:inherit;color:var(--ink);background:#fff;transition:.13s}
.sf-field select{cursor:pointer}
.sf-field input:focus,.sf-field select:focus{outline:0;border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-tint)}
.sf-row{display:flex;gap:12px}
.agent-model-head{display:grid;grid-template-columns:minmax(0,1fr) auto auto;column-gap:14px;row-gap:8px;padding-block:0 8px;border-bottom:1px solid var(--line);font-family:var(--sans);font-size:12px;font-weight:600;line-height:1.5;letter-spacing:normal;color:var(--muted)}
.agent-model-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;column-gap:14px;row-gap:8px;padding-block:12px;border-bottom:1px solid var(--line)}
.agent-model-status{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;font-size:13.5px;line-height:1.6}
.agent-model-status p{margin:0}
.engine-head{font-size:12px;font-weight:600;color:var(--muted)}
.engine-row{display:flex;justify-content:space-between;gap:14px;padding-block:6px;border-top:1px solid var(--line)}
.engine-row>span:first-child{font-weight:600;color:var(--ink)}
.engine-off{color:var(--faint)}
.agent-model-status.stale{background:#FFF8E8;border-color:#F0DFAE;color:#8A6A12}
.agent-model-sub{display:block;margin-top:1px;font-size:11.5px;font-weight:400;color:var(--faint)}
.agent-model-sub.warn{color:#A31232}
.agent-model-name{min-inline-size:0;overflow-wrap:anywhere;font-family:var(--sans);font-size:14px;font-weight:600;line-height:1.5;letter-spacing:normal;color:var(--ink)}
.agent-model-count{font-family:var(--sans);font-size:14px;font-weight:500;line-height:1.5;letter-spacing:normal;color:var(--ink);text-align:end}
.set-save{display:inline-flex;align-items:center;gap:7px;margin-top:4px;padding:9px 18px;border:0;border-radius:9px;background:var(--mag);color:#fff;font-size:14px;font-weight:700;cursor:pointer;transition:.13s}
.set-save:hover{background:var(--mag-700)}
.set-save svg{flex:none}
.set-save.dirty{box-shadow:0 0 0 3px var(--mag-wash)}
.set-save.dirty::after{content:"未保存";font-size:11px;font-weight:700;margin-left:2px;opacity:.9}

/* ページ右の余白対策：コンテンツ中央寄せ（幅の正本は下の .klist/.kpis/.report 側で調整） */
.content{margin-inline:auto}
.emptynote{grid-column:1/-1;color:var(--muted);font-size:14px;padding:16px 2px}

/* 管理者AI：チャット＋セッション記録パネル（2カラム） */
/* 管理者AIのモード切替（通常会話 / 会社の文脈を使うAI） */
.mode-seg{margin-left:auto;display:inline-flex;gap:2px;padding:3px;background:var(--bg);border:1px solid var(--line);border-radius:11px}
.ms-opt{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border:0;background:0;border-radius:8px;font-size:13.5px;font-weight:700;color:var(--muted);cursor:pointer;transition:.13s;white-space:nowrap}
.ms-opt svg{flex:none;opacity:.8}
.ms-opt:hover{color:var(--ink)}
.ms-opt.active{background:#fff;color:var(--mag-700);box-shadow:var(--shadow)}
.sess-list{display:flex;flex-direction:column;gap:1px;margin-bottom:8px}
.page-head .ph-toggle{width:38px;height:38px;flex:none;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--muted);display:grid;place-items:center;cursor:pointer;transition:.14s}
.page-head .ph-toggle:hover{color:var(--mag);border-color:var(--mag-wash);background:var(--mag-tint)}
.page-head .ph-toggle.on{color:var(--mag);border-color:var(--mag);background:var(--mag-wash)}
.agentwrap{display:flex;gap:16px;align-items:stretch;height:calc(100vh - 250px);min-height:420px}
.agentwrap .bigchat{flex:1;min-width:0;height:100%;max-width:none}
.sesspanel{width:288px;flex:none;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow);overflow:hidden;transition:width .22s ease,opacity .16s}
.agentwrap.panel-off .sesspanel{width:0;opacity:0;border-width:0;margin-left:-16px;pointer-events:none}
.sp-head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--line);flex:none}
.sp-head b{font-size:14px;white-space:nowrap}
.sp-new{margin-left:auto;display:flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700;color:var(--mag-700);border:1px solid var(--mag-wash);background:#fff;padding:5px 9px;border-radius:8px;cursor:pointer;white-space:nowrap}
.sp-new:hover{background:var(--mag);color:#fff;border-color:var(--mag)}
.sp-body{flex:1;overflow-y:auto;padding:8px}
.sess-group{margin-bottom:4px}
.sess-ghead{display:flex;align-items:center;gap:6px;width:100%;background:0;border:0;padding:7px 8px;font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--muted);cursor:pointer;border-radius:8px}
.sess-ghead:hover{background:var(--bg)}
.sess-ghead .chev{transition:.18s;color:var(--faint)}
.sess-group.collapsed .chev{transform:rotate(-90deg)}
.sess-ghead .cnt{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--faint)}
.sess-body{display:flex;flex-direction:column;gap:2px}
.sess-group.collapsed .sess-body{display:none}
.sess-item{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:9px;cursor:pointer;transition:.13s;border:1px solid transparent}
.sess-item:hover{background:var(--bg)}
.sess-item.active{background:var(--mag-wash);border-color:var(--mag-wash)}
.si-ic{width:26px;height:26px;flex:none;border-radius:7px;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600);position:relative}
.sess-item[data-st="running"] .si-ic::after{content:"";position:absolute;top:-2px;right:-2px;width:7px;height:7px;border-radius:50%;background:var(--mag);border:1.5px solid #fff}
.si-main{flex:1;min-width:0}
.si-main b{display:block;font-size:13.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.si-main span{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.si-when{font-size:11px;color:var(--faint);flex:none}
.si-act{flex:none;width:24px;height:24px;border:0;background:0;border-radius:6px;color:var(--faint);cursor:pointer;display:grid;place-items:center;opacity:0;transition:.13s}
.sess-item:hover .si-act{opacity:1}
.si-act:hover{background:var(--mag-tint);color:var(--mag)}
.sess-empty{font-size:12.5px;color:var(--faint);padding:6px 9px}
@media(max-width:980px){.sesspanel{display:none}.agentwrap{height:calc(100vh - 250px)}}

/* 設定モーダル：ナレッジ保存先（別格カード）・組織情報・ロール・接続カード拡張 */
.storebox{display:flex;align-items:center;gap:11px;padding:13px 14px;border:1px solid var(--mag-wash);background:var(--mag-tint);border-radius:12px}
.storebox .sb-ic{width:40px;height:40px;border-radius:11px;flex:none;display:grid;place-items:center;background:#fff;color:var(--mag-600);border:1px solid var(--mag-wash)}
.storebox .sb-main{flex:1;min-width:0}
.storebox .sb-main b{font-size:14.5px;font-weight:700;display:block}
.storebox .sb-main small{font-size:12px;color:var(--muted);display:block}
.storebox .sb-main .cmeta{color:var(--faint);font-size:11px;margin-top:1px}
.orginfo{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.oi{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg-soft)}
.oi span{font-size:12.5px;color:var(--muted)}
.oi b{font-size:13.5px;font-weight:700}
.conn .role{font-family:var(--mono);font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:2px 9px;white-space:nowrap;flex:none}
.conn .role.owner{color:var(--mag);border-color:var(--mag-wash);background:var(--mag-wash)}
.conn .role.invited{color:#b26a00;border-color:#f3d9a8;background:#fdf4e0;font-family:inherit;font-weight:700}
.conn .cn .cmeta{display:block;color:var(--faint);font-size:11px;margin-top:1px}
/* Composio でつながっているアプリの行（設定の MCP連携・Composio の行のすぐ下）。置き場は一覧の gap をそのまま使う */
.composio-rows{display:contents}
.linkbtn{font-family:inherit;font-size:11px;font-weight:700;line-height:1.5;letter-spacing:0;color:var(--mag);background:none;border:0;padding-block:0;padding-inline:4px 0;cursor:pointer;text-decoration:underline}
.conn .cright{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}
.conn .st.pending{color:#c98a00}
.conn .st.pending i{background:#e0a200}
.conn-act{font-size:11.5px;font-weight:700;color:var(--mag-700);border:1px solid var(--mag-wash);background:#fff;padding:3px 9px;border-radius:7px;cursor:pointer;white-space:nowrap}
.conn-act:hover{background:var(--mag);color:#fff;border-color:var(--mag)}
.fieldnote{font-size:11.5px;color:var(--faint);margin-top:8px;line-height:1.55}
.developer-token-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.developer-claude-login{padding-block-end:14px}
.developer-claude-note{margin-block-start:8px;font-family:inherit;font-size:12px;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.developer-claude-status{margin-block-start:8px;font-family:inherit;font-size:13px;font-weight:700;line-height:1.5;letter-spacing:normal;color:var(--ink)}
.developer-claude-message{margin-block-start:8px;font-family:inherit;font-size:12px;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.developer-claude-link{margin-block-start:8px;max-inline-size:100%;overflow-wrap:anywhere;font-family:inherit;font-size:12px;font-weight:400;line-height:1.5;letter-spacing:normal;color:var(--mag-700)}
.developer-claude-code{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-block-start:8px}
.developer-claude-code input{flex:1 1 220px;min-inline-size:0;font-family:var(--mono);font-size:13px;padding:6px 8px;border:1px solid var(--line);border-radius:7px}
.developer-claude-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-block-start:8px}
.developer-claude-manual{margin-block-start:12px}
.developer-claude-manual summary{cursor:pointer;font-size:12px;font-weight:700;color:var(--muted)}
.developer-codex-login{margin-block-start:16px;padding-block-start:14px;border-block-start:1px solid var(--line)}
.developer-codex-note{margin-block-start:8px;font-family:inherit;font-size:12px;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.developer-codex-status{margin-block-start:8px;font-family:inherit;font-size:13px;font-weight:700;line-height:1.5;letter-spacing:normal;color:var(--ink)}
.developer-codex-message{margin-block-start:8px;font-family:inherit;font-size:12px;font-weight:400;line-height:1.55;letter-spacing:normal;color:var(--muted)}
.developer-codex-link{margin-block-start:8px;max-inline-size:100%;overflow-wrap:anywhere;font-family:inherit;font-size:12px;font-weight:400;line-height:1.5;letter-spacing:normal;color:var(--mag-700)}
.developer-codex-code{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-block-start:8px}
.developer-codex-code-value{font-family:var(--mono);font-size:22px;font-weight:700;line-height:1.2;letter-spacing:.12em;color:var(--ink);overflow-wrap:anywhere}
.developer-codex-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-block-start:8px}
.crumb .chome{cursor:pointer;max-width:16em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crumb .chome:hover{color:var(--mag-700)}

.session{margin:0 2px;padding:11px 12px;border:1px solid var(--mag-wash);background:var(--mag-tint);border-radius:var(--radius-sm);cursor:pointer;transition:.15s}
.session:hover{border-color:var(--mag);box-shadow:0 4px 14px -8px var(--mag)}
.session .top{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:var(--mag-700)}
.session .top i{width:7px;height:7px;border-radius:50%;background:var(--mag);animation:pulse 1.6s infinite}
.session .body{font-size:12.5px;color:var(--muted);margin-top:5px;padding-left:14px}
.session .body .cur-task{color:var(--ink);font-weight:700}
.session .bar{height:4px;border-radius:4px;background:#fff;margin-top:9px;overflow:hidden}
/* 思考が進むたび右へ「ぐっ」と伸びる（実進捗＝思考数に連動）。先端を淡く光らせて前進感を出す */
.session .bar i{display:block;height:100%;width:14%;background:linear-gradient(90deg,var(--mag),var(--mag-600));border-radius:4px;
  transition:width .7s cubic-bezier(.22,1,.36,1);box-shadow:0 0 6px -1px var(--mag)}
.session .thinking{display:flex;align-items:flex-start;gap:6px;margin-top:9px;padding-left:14px;font-size:11.5px;color:var(--mag-700);font-style:italic;line-height:1.45}
/* 思考テキストは2行でクランプ（…で省略）。長文でもサイドバーを崩さない */
.session .thinking .th-text{flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}
.session .thinking .th-ic{flex:none;margin-top:2px;color:var(--mag);opacity:.85}
.session .thinking .caret{width:2px;height:12px;background:var(--mag);animation:blink 1s steps(1) infinite;flex:none;margin-top:1px}
@keyframes blink{50%{opacity:0}}

.linkrow{display:flex;align-items:center;gap:9px;padding:7px 6px 7px 4px;font-size:14px;color:#4A4452;text-decoration:none;border-radius:8px;flex:1;min-width:0}
.linkrow:hover{color:var(--ink)}
.linkrow .ic{width:14px;height:14px;flex:none;opacity:.85}
.linkrow .ext{margin-left:auto;color:var(--faint);opacity:.7}
/* 外部リンク行（グリップ＝ドラッグ並び替え／リンク／編集／削除。操作はホバーで出す） */
.linkitem{display:flex;align-items:center;padding-left:14px;border-radius:8px;transition:background .12s}
.linkitem:hover{background:var(--bg)}
.linkitem.dragging{opacity:.45}
.linkitem.over{box-shadow:inset 0 2px 0 0 var(--mag)}
.linkitem .lname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.lgrip{flex:none;width:13px;color:var(--faint);font-size:11px;line-height:1;text-align:center;cursor:grab;opacity:0;transition:.15s;user-select:none}
.linkitem:hover .lgrip{opacity:.55}
.linkact,.linkdel{flex:none;opacity:0;border:0;background:0;color:var(--faint);cursor:pointer;padding:5px;border-radius:6px;line-height:0;transition:.15s}
.linkitem:hover .linkact,.linkitem:hover .linkdel{opacity:.6}
.linkact:hover{opacity:1;color:var(--ink);background:var(--mag-tint)}
.linkdel:hover{opacity:1;color:var(--mag);background:var(--mag-tint)}
.regbtn{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:8px;padding:8px;
  border:1px dashed var(--line-strong);border-radius:8px;background:0;color:var(--muted);font-size:12.5px;font-weight:700;transition:.15s}
.regbtn:hover{border-color:var(--mag);color:var(--mag);background:var(--mag-tint)}

/* ---------- user (fixed bottom-right) ---------- */
.userbar{margin-top:auto;display:flex;align-items:center;gap:8px;
  background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);padding:7px 8px 7px 11px}
.profile{display:flex;align-items:center;gap:10px;flex:1;min-width:0}
/* 会社設定：アイコン編集 */
.org-ava-row{display:flex;align-items:center;gap:10px;margin-top:2px}
.org-ava-prev{width:44px;height:44px;border-radius:11px;flex:none;display:grid;place-items:center;background:var(--ink);color:#fff;font-weight:800;font-size:18px;background-size:cover;background-position:center}
.org-ava-prev.has-img{color:transparent}
.profile .who{flex:1;min-width:0;font-size:15px;font-weight:700;line-height:1.3}
.profile .who span,.profile .who small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;overflow-wrap:anywhere}
.profile .who small{font-family:var(--mono);font-size:12px;color:var(--mag);font-weight:500;letter-spacing:.02em;margin-top:1px}
.gear{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--bg-soft);display:grid;place-items:center;color:var(--muted);transition:.2s;flex:none}
.gear:hover{border-color:var(--mag);color:var(--mag);background:var(--mag-tint);transform:rotate(45deg)}

/* ---------- main ---------- */
.main{flex:1;height:100%;overflow-y:auto;background:radial-gradient(120% 90% at 100% -10%, var(--mag-tint), transparent 42%),var(--bg);background-attachment:local}
.topbar{position:sticky;top:0;z-index:5;backdrop-filter:saturate(1.2) blur(8px);background:rgba(255,255,255,.88);border-bottom:1px solid var(--line);display:flex;flex-direction:column}
.tb-row{display:flex;align-items:center;gap:8px;padding:0 16px}
.tb-top{padding-top:9px;padding-bottom:7px}
.tb-bottom{padding-bottom:10px}
.tb-ic{width:30px;height:30px;border-radius:8px;border:0;background:0;color:var(--muted);display:grid;place-items:center;transition:.15s;flex:none}
.tb-ic:hover{background:var(--mag-tint);color:var(--mag-700)}
.tabs{display:flex;align-items:center;gap:4px;margin-left:4px;min-width:0;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{display:flex;align-items:center;gap:7px;padding:6px 8px 6px 11px;border-radius:9px;font-size:13.5px;font-weight:600;color:var(--muted);background:var(--bg-soft);border:1px solid transparent;white-space:nowrap;cursor:pointer;transition:.14s}
.tab:hover{color:var(--ink)}
.tab.active{background:#fff;border-color:var(--line);color:var(--ink);box-shadow:var(--shadow)}
.tab .t-ic{width:14px;height:14px;color:var(--mag);opacity:.9;flex:none}
.tab .t-x{width:18px;height:18px;border:0;background:0;color:var(--faint);border-radius:5px;display:grid;place-items:center;flex:none}
.tab .t-x:hover{background:var(--line);color:var(--ink)}
.tab-add{width:28px;height:28px;border-radius:8px;border:0;background:0;color:var(--muted);display:grid;place-items:center;flex:none}
.tab-add:hover{background:var(--mag-tint);color:var(--mag)}
.tb-top .spacer{flex:1}
.crumb{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted)}
.crumb b{color:var(--ink);font-weight:700}
.crumb .sep{color:var(--faint)}
.agent{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11px;color:var(--ok);border:1px solid var(--ok-wash);background:var(--ok-wash);padding:3px 8px;border-radius:20px;flex:none}
.agent[hidden]{display:none} /* display:flex が UA の [hidden] を上書きするため明示（実態表示の実効化） */
.agent i{width:6px;height:6px;border-radius:50%;background:var(--ok);animation:pulse 1.8s infinite}
.ghost{display:flex;align-items:center;gap:7px;border:1px solid var(--line-strong);background:#fff;color:var(--ink);font-size:13.5px;font-weight:700;padding:7px 13px;border-radius:9px;transition:.15s;flex:none;white-space:nowrap}
.ghost:hover{border-color:var(--mag);color:var(--mag-700);box-shadow:var(--shadow)}
.ghost.on{border-color:var(--mag);background:var(--mag-tint);color:var(--mag-700)}
.ghost[hidden]{display:none}
.app.sb-collapsed .sidebar{width:0;min-width:0;padding-left:0;padding-right:0;border-right-color:transparent}

.content{padding:26px 30px 90px;max-width:1180px}
.block{margin-bottom:34px}
.bhead{display:flex;align-items:flex-end;gap:12px;margin-bottom:14px}
.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mag);margin-bottom:3px}
.btitle{font-size:21px;font-weight:900;letter-spacing:-.01em}
.bhead .meta{margin-left:auto;font-size:13px;color:var(--faint)}
.bhead-r{margin-left:auto;display:flex;align-items:center;gap:6px}
.bhead-r .meta{margin-left:0}
.cat-menu{flex:none;display:flex;opacity:0;border:0;background:0;color:var(--muted);cursor:pointer;padding:5px;border-radius:7px;transition:.13s}
.block:hover .cat-menu,.cat-menu:focus-visible{opacity:.6}
.cat-menu:hover{opacity:1;color:var(--ink);background:var(--bg)}
/* Notion風ポップオーバー（3点メニュー） */
.popmenu{position:fixed;z-index:200;min-width:168px;padding:5px;background:#fff;border:1px solid var(--line);border-radius:11px;box-shadow:0 10px 30px rgba(0,0,0,.14)}
.pm-item{display:flex;align-items:center;gap:9px;width:100%;padding:8px 10px;background:0;border:0;border-radius:8px;text-align:left;font-size:14px;color:var(--ink);cursor:pointer;transition:.1s}
.pm-item svg{flex:none;color:var(--muted)}
.pm-item:hover{background:var(--bg)}
.pm-item.danger{color:var(--danger)}
.pm-item.danger svg{color:var(--danger)}
.pm-item.danger:hover{background:var(--danger-wash)}
/* 削除ダイアログ：扱いをボタン選択（デフォルト無し）→ 削除 */
.del-body{padding:4px 2px 2px}
.del-q{font-size:14px;color:var(--muted);margin:0 0 12px}
.del-opt{display:block;width:100%;text-align:left;padding:12px 14px;margin-bottom:10px;border:1.5px solid var(--line-strong);border-radius:11px;background:#fff;cursor:pointer;transition:.13s}
.del-opt b{display:block;font-size:14.5px;color:var(--ink);margin-bottom:2px}
.del-opt span{font-size:12.5px;color:var(--muted)}
.del-opt:hover{border-color:var(--mag)}
.del-opt.sel{border-color:var(--mag);background:var(--mag-tint);box-shadow:0 0 0 3px var(--mag-tint)}
.fm-ok.danger{background:var(--danger)}
.fm-ok.danger:hover{background:var(--danger-700)}
.fm-ok:disabled{opacity:.45;cursor:not-allowed}

.today{border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);overflow:hidden}
.today .t-top{display:flex;align-items:center;gap:10px;padding:13px 18px;border-bottom:1px solid var(--line);background:linear-gradient(0deg,#fff,var(--mag-tint))}
.today .t-top .dot{width:8px;height:8px;border-radius:50%;background:var(--mag)}
.today .t-top h3{font-size:14.5px;font-weight:900}
.today .t-top .count{margin-left:auto;font-family:var(--mono);font-size:12px;color:var(--muted)}
.trow{display:flex;align-items:center;gap:14px;padding:13px 18px;border-bottom:1px solid var(--line);transition:.14s}
.trow:last-child{border-bottom:0}
.trow:hover{background:var(--mag-tint)}
.trow .ti{width:34px;height:34px;flex:none;border-radius:9px;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600)}
.trow .tmain{display:flex;align-items:center;gap:14px;flex:1;min-width:0}
.trow .tmain.clickable{cursor:pointer;border-radius:9px;margin:-5px 0;padding:5px 6px;transition:.12s}
.trow .tmain.clickable:hover{background:var(--mag-wash)}
.trow .tt{flex:1;min-width:0}
.trow .tt b{font-size:16px;font-weight:700;display:block}
.trow .tt span{font-size:13.5px;color:var(--muted)}
.trow .tt span.run{color:var(--mag-600)}
.trow .act{font-family:var(--sans);font-size:12.5px;font-weight:700;color:var(--mag-700);border:1px solid var(--mag-wash);background:#fff;padding:6px 12px;border-radius:8px;white-space:nowrap}
.trow .act:hover{background:var(--mag);color:#fff;border-color:var(--mag)}
.today .t-top h3{font-size:15.5px}
.t-sub{font-size:13.5px;color:var(--muted);margin-top:2px}
.t-need{margin-left:auto;font-family:var(--mono);font-size:11.5px;font-weight:700;color:var(--mag-700);background:var(--mag-wash);padding:5px 11px;border-radius:20px;white-space:nowrap}
.trow.urgent{background:linear-gradient(90deg,var(--mag-tint),transparent 65%)}
.trow.urgent .ti{background:var(--mag);color:#fff}
.act.primary{background:var(--mag);color:#fff;border-color:var(--mag)}
.act.primary:hover{background:var(--mag-600)}
.t-auto{border-top:1px dashed var(--line-strong);background:var(--bg-soft);padding:12px 18px 14px}
.ta-label{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin-bottom:9px;display:flex;align-items:center;gap:6px}
.ta-row{display:flex;align-items:center;gap:12px}
.ta-ic{width:30px;height:30px;border-radius:8px;flex:none;display:grid;place-items:center;background:#fff;border:1px solid var(--line);color:var(--muted)}
.ta-t{flex:1;min-width:0}
.ta-t b{font-size:13.5px;font-weight:700;display:block;color:var(--ink)}
.ta-t span{font-size:12px;color:var(--muted)}

.pill{font-family:var(--mono);font-size:11px;font-weight:500;padding:3px 9px;border-radius:20px;white-space:nowrap}
.pill.wait{background:var(--mag-wash);color:var(--mag-700)}
.pill.done{background:var(--ok-wash);color:var(--ok)}
.pill.run{background:var(--ink);color:#fff;display:inline-flex;align-items:center;gap:5px}
.pill.run i{width:5px;height:5px;border-radius:50%;background:var(--mag);animation:pulse 1.4s infinite}
.pill.new{background:#F1EEF5;color:var(--muted)}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px}
.card{border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:16px;display:flex;flex-direction:column;gap:11px;cursor:pointer;transition:.18s;box-shadow:var(--shadow);position:relative;overflow:hidden}
/* ドラッグでカテゴリ移動：掴んでいるカード＋ドロップ先カテゴリ節のハイライト */
.card.dragging{opacity:.4;transform:none;box-shadow:none}
.block.drop-over{outline:2px dashed var(--mag);outline-offset:6px;border-radius:14px;background:var(--mag-wash)}
.nvrow.drop-over{background:var(--mag-wash);outline:2px dashed var(--mag);outline-offset:-2px;border-radius:8px}
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--mag);transform:scaleY(0);transform-origin:top;transition:.2s}
.card:hover{border-color:var(--line-strong);transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.card:hover::before{transform:scaleY(1)}
.card .chip{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600)}
.card.cat .chip{background:var(--mag-tint)}
.card h4{font-size:16px;font-weight:700;letter-spacing:-.01em;line-height:1.5;min-height:48px}
.card p{font-size:15px;color:var(--muted);line-height:1.75;flex:1}
.card .foot{display:flex;align-items:center;gap:8px;margin-top:2px}
.owner{font-size:12.5px;font-weight:500;color:var(--muted)}
.owner .ow-ava{width:21px;height:21px;border-radius:6px;flex:none;display:grid;place-items:center;background:var(--ink);color:#fff;font-size:11px;font-weight:700}
.card .star{margin-left:auto;width:28px;height:28px;border:0;background:0;color:var(--faint);font-size:16px;line-height:1;border-radius:7px;display:grid;place-items:center;transition:.15s;cursor:pointer}
.card .star:hover{background:var(--mag-tint)}
.card .star.on{color:var(--mag)}
.tbadge{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.04em;padding:2px 8px;border-radius:20px;border:1px solid var(--line)}
.tbadge.task{color:var(--muted);background:var(--bg-soft)}
.tbadge.set{color:var(--mag-700);background:var(--mag-wash);border-color:var(--mag-wash)}
.chain{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.chain .cw{display:inline-flex;align-items:center;gap:6px}
.chain .ct{font-size:11.5px;font-weight:700;color:var(--mag-700);background:var(--mag-wash);padding:3px 8px;border-radius:7px}
.chain .ca{color:var(--faint);font-size:12px}
/* creation drawers (task / workset) */
.solo-drawer{position:fixed;top:0;right:0;bottom:var(--builder-drawer-bottom,0);width:var(--builder-drawer-w,min(520px,94vw));background:#fff;border-left:1px solid var(--line);transform:translateX(101%);transition:transform .34s cubic-bezier(.22,.61,.36,1);z-index:50;display:flex;flex-direction:column}
.solo-drawer.open{transform:none;box-shadow:-26px 0 60px -34px rgba(26,22,32,.45)}
.dw-body .field{margin-bottom:16px}
.ftitle{display:block;width:100%;border:0;outline:0;background:0;resize:none;overflow:hidden;font-size:23px;font-weight:900;line-height:1.35;letter-spacing:-.01em;word-break:auto-phrase;text-wrap:pretty;color:var(--ink);font-family:inherit;margin-bottom:20px}
.ftitle::placeholder{color:var(--faint)}
.finput,.ftext{width:100%;border:1px solid var(--line-strong);border-radius:9px;padding:10px 12px;font-size:14px;font-family:inherit;color:var(--ink);outline:0;background:#fff;transition:.14s}
.finput:focus,.ftext:focus{border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-wash)}
.finput::placeholder,.ftext::placeholder{color:var(--faint)}
.ftext{resize:vertical;min-height:62px;line-height:1.5}
.io{display:flex;gap:10px}
.io .field{flex:1}
.compose{display:flex;flex-direction:column;gap:8px}
.tchip{display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}
.tchip .tnum{width:24px;height:24px;border-radius:7px;flex:none;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600);font-family:var(--mono);font-size:12px;font-weight:700}
.tchip .tlabel{flex:1;font-size:14px;font-weight:700}
.tchip .tio{font-family:var(--mono);font-size:10.5px;color:var(--faint)}
.tchip .trm{width:24px;height:24px;border:0;background:0;color:var(--faint);border-radius:6px;display:grid;place-items:center}
.tchip .trm:hover{background:var(--mag-tint);color:var(--mag)}
.addtask{display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;border:1px dashed var(--line-strong);border-radius:10px;background:0;color:var(--muted);font-size:13.5px;font-weight:700;width:100%}
.addtask:hover{border-color:var(--mag);color:var(--mag);background:var(--mag-tint)}
.aithink{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:6px;padding:12px;border:1px solid var(--mag);background:var(--mag-tint);color:var(--mag-700);font-weight:700;font-size:14px;border-radius:10px;transition:.15s}
.aithink:hover{background:var(--mag-wash)}
.aiout{margin-top:14px;padding:14px;border:1px solid var(--mag-wash);background:linear-gradient(0deg,#fff,var(--mag-tint));border-radius:12px;font-size:13.5px;line-height:1.65;color:var(--ink);display:none}
.aiout.show{display:block;animation:fadeUp .4s both}
.aiout b{color:var(--mag-700)}
.aiout .ai-h{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mag);margin-bottom:9px}
.card.add{border:1.5px dashed var(--line-strong);box-shadow:none;align-items:center;justify-content:center;text-align:center;color:var(--muted);gap:8px;background:var(--bg-soft)}
.card.add::before{display:none}
.card.add:hover{border-color:var(--mag);color:var(--mag);background:var(--mag-tint);transform:translateY(-3px)}
.card.add .chip{background:#fff;border:1px dashed var(--line-strong)}
.card.add:hover .chip{border-color:var(--mag)}
.card.add b{font-size:14px;font-weight:700}
.newcat{display:flex;align-items:center;gap:14px;padding:18px 20px;border:1.5px dashed var(--line-strong);border-radius:var(--radius);color:var(--muted);cursor:pointer;transition:.16s;background:var(--bg-soft)}
.newcat:hover{border-color:var(--mag);color:var(--mag-700);background:var(--mag-tint)}
.newcat .nc-ic{width:38px;height:38px;border-radius:11px;flex:none;display:grid;place-items:center;background:#fff;border:1px dashed var(--line-strong);color:var(--mag)}
.newcat:hover .nc-ic{border-color:var(--mag)}
.newcat b{font-size:15px;font-weight:700;display:block;color:inherit}
.newcat span{font-size:12.5px;color:var(--muted)}
/* ===== multi-page views ===== */
.view{display:none}
.view.active{display:block;animation:fadeUp .35s both}
.page-head{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.page-head .ph-ic{width:48px;height:48px;border-radius:13px;flex:none;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600)}
.page-head h2{font-size:24px;font-weight:900;letter-spacing:-.01em}
.page-head p{font-size:14px;color:var(--muted);margin-top:3px}
.bigchat{display:flex;flex-direction:column;height:calc(100vh - 250px);min-height:420px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow);overflow:hidden;max-width:1040px}
.bc-msgs{flex:1;overflow-y:auto;padding:22px;display:flex;flex-direction:column;gap:13px}
.bc-msgs .msg{max-width:74%;font-size:14.5px;line-height:1.6;padding:12px 15px;border-radius:14px}
.bc-msgs .msg.ai{align-self:flex-start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px;color:var(--ink)}
.bc-msgs .msg.me{align-self:flex-end;background:var(--mag);color:#fff;border-bottom-right-radius:4px}
.bc-input{display:flex;gap:10px;padding:14px;border-top:1px solid var(--line);background:var(--bg-soft)}
.bc-input input{flex:1;border:1px solid var(--line-strong);border-radius:11px;padding:12px 14px;font-size:14.5px;font-family:inherit;outline:0;background:#fff;color:var(--ink)}
.bc-input input:focus{border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-wash)}
.bc-input .send{width:46px;flex:none;border:0;background:var(--mag);color:#fff;border-radius:11px;display:grid;place-items:center}
.klist{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:10px;align-content:start}
.krow{display:flex;align-items:center;gap:13px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow);cursor:pointer;transition:.15s}
.krow:hover{border-color:var(--line-strong);transform:translateY(-1px);box-shadow:var(--shadow-lg)}
.krow .ki{width:36px;height:36px;border-radius:9px;flex:none;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600)}
.krow .kt{flex:1;min-width:0}
.krow .kt b{font-size:15px;font-weight:700;display:block}
.krow .kt span{font-size:13px;color:var(--muted)}
.krow .kmeta{font-family:var(--mono);font-size:11px;color:var(--faint);white-space:nowrap}
.krow-del{flex:none;width:26px;height:26px;border:0;background:0;color:var(--faint);border-radius:7px;display:grid;place-items:center;cursor:pointer;opacity:0;transition:.15s}
.krow:hover .krow-del{opacity:1}
.krow-del:hover{background:var(--mag-tint);color:var(--mag-700)}
#taskKnowledgeDocs .krow{cursor:default}
#taskKnowledgeDocs .krow:hover{transform:none;box-shadow:var(--shadow)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:14px;margin-bottom:24px}
.kpi{border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--shadow);padding:16px 18px}
.kpi .kl{font-size:12.5px;color:var(--muted);margin-bottom:8px}
.kpi .kv{font-size:27px;font-weight:900;letter-spacing:-.02em}
.kpi .kd{font-family:var(--mono);font-size:11.5px;color:var(--ok);margin-top:5px}
.report{border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow);padding:20px 22px;font-size:14.5px;line-height:1.75;color:var(--ink)}
.report h3{font-size:12px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--mag);margin:0 0 12px}
.report b{color:var(--mag-700)}

.reveal{animation:fadeUp .5s both}
.grid .card{animation:fadeUp .5s both}
.grid .card:nth-child(1){animation-delay:.04s}
.grid .card:nth-child(2){animation-delay:.09s}
.grid .card:nth-child(3){animation-delay:.14s}
.grid .card:nth-child(4){animation-delay:.19s}
.grid .card:nth-child(5){animation-delay:.24s}

/* ---------- modal / settings ---------- */
.overlay{position:fixed;inset:0;background:rgba(26,22,32,.42);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:24px;z-index:50}
.overlay.open{display:flex;animation:fade .2s both}
.modal{width:min(520px,100%);background:#fff;border-radius:18px;box-shadow:var(--shadow-lg);overflow:hidden;animation:pop .26s cubic-bezier(.2,.9,.3,1.2) both;max-height:90vh;display:flex;flex-direction:column}
.m-head{display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--line);background:linear-gradient(0deg,#fff,var(--mag-tint))}
.m-head .chip{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600);flex:none}
.m-head h3{font-size:16px;font-weight:900}
.m-head .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;color:var(--mag);text-transform:uppercase}
.m-head .x{margin-left:auto;border:0;background:0;color:var(--muted);width:30px;height:30px;border-radius:8px;display:grid;place-items:center}
.m-head .x:hover{background:#fff;color:var(--ink)}
.m-body{padding:20px;display:flex;flex-direction:column;gap:18px;overflow-y:auto}
.field label{font-size:13px;font-weight:700;display:flex;align-items:center;gap:7px;margin-bottom:9px}
.field label .n{font-family:var(--mono);font-size:10.5px;color:#fff;background:var(--mag);width:18px;height:18px;border-radius:5px;display:grid;place-items:center}
/* アイコン＋タイトル＋キャプションの3点セットは制作/編集ドロワー（.solo-drawer）だけの構造。
   実行ドロワー（#wfBody・inputWidgetHtml）はアイコンもspanタイトルも持たない別構造なので、ここへ波及させない。 */
.solo-drawer .field label{flex-wrap:wrap}
.solo-drawer .field label>span{white-space:nowrap}
.solo-drawer .field label small{flex-basis:calc(100% - 19px);margin:2px 0 0 19px;font-weight:400;font-size:13px;color:var(--muted);line-height:1.5}
.filelist{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.filelist .f{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);font-size:13.5px}
.filelist .f:last-child{border-bottom:0}
.filelist .f .ck{width:17px;height:17px;border-radius:5px;border:1.5px solid var(--mag);flex:none;display:grid;place-items:center;color:#fff;background:var(--mag)}
.filelist .f.off .ck{border-color:var(--line-strong);background:#fff;color:transparent}
.filelist .f .nm{flex:1}
.filelist .f .sz{font-family:var(--mono);font-size:11px;color:var(--faint)}
.filelist .f .src{font-family:var(--mono);font-size:10.5px;color:var(--mag);background:var(--mag-wash);padding:2px 7px;border-radius:20px}
.seg{display:flex;gap:8px}
.seg .opt{flex:1;border:1px solid var(--line-strong);border-radius:10px;padding:11px 8px;text-align:center;font-size:13.5px;font-weight:700;color:var(--muted);transition:.15s;background:#fff}
.seg .opt small{display:block;font-family:var(--mono);font-size:10px;font-weight:400;margin-top:3px;color:var(--faint)}
.seg .opt:hover{border-color:var(--mag)}
.seg .opt.sel{border-color:var(--mag);background:var(--mag-wash);color:var(--mag-700)}
.seg .opt.sel small{color:var(--mag-600)}
.privacy{display:flex;gap:9px;font-size:12px;color:var(--muted);background:var(--bg-soft);border:1px solid var(--line);border-radius:10px;padding:10px 12px;line-height:1.5}
.privacy svg{flex:none;color:var(--ok);margin-top:1px}
.m-foot{display:flex;gap:10px;padding:16px 20px;border-top:1px solid var(--line);background:var(--bg-soft)}
.m-foot .cancel{flex:none;padding:11px 18px;border:1px solid var(--line-strong);background:#fff;border-radius:10px;font-weight:700;font-size:14px;color:var(--muted)}
.m-foot .run{flex:1;border:0;background:var(--mag);color:#fff;border-radius:10px;font-weight:700;font-size:14.5px;display:flex;align-items:center;justify-content:center;gap:8px;transition:.15s;padding:11px}
.m-foot .run:hover{background:var(--mag-600);box-shadow:0 8px 20px -8px var(--mag)}

/* connections list (settings) */
.conns{display:flex;flex-direction:column;gap:8px}
.conn{display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid var(--line);border-radius:11px;transition:.14s}
.conn:hover{border-color:var(--line-strong)}
.conn.off{opacity:.6}
.conn .ci{width:34px;height:34px;border-radius:9px;flex:none;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600);font-weight:700;font-size:14px}
.conn .cn{flex:1;min-width:0}
.conn .cn b{font-size:14px;font-weight:700;display:block}
.conn .cn small{font-size:12px;color:var(--muted)}
.conn .st{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11.5px;color:var(--muted);white-space:nowrap}
.conn .st i{width:7px;height:7px;border-radius:50%;background:var(--faint);flex:none}
.conn .st.on{color:var(--ok)}
.conn .st.on i{background:var(--ok)}

/* ---- workflow drawer (right slide) + chat ---- */
.scrim{position:fixed;inset:0;background:rgba(26,22,32,.30);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:.25s;z-index:45}
.scrim.open{opacity:1;visibility:visible}
.rightdock{position:fixed;top:var(--builder-chat-top,0);right:0;bottom:0;z-index:50;display:flex;transform:translateX(101%);transition:transform .34s cubic-bezier(.22,.61,.36,1)}
.rightdock.open{transform:none}
.rightdock.open .drawer{box-shadow:-26px 0 60px -34px rgba(26,22,32,.45)}
.drawer{order:1;width:var(--drawer-w,min(490px,93vw));height:100%;background:#fff;border-left:1px solid var(--line);display:flex;flex-direction:column;position:relative}
.chatpane{order:2;width:0;height:100%;background:var(--bg-soft);border-left:1px solid var(--line);display:flex;flex-direction:column;overflow:hidden;transition:width .3s cubic-bezier(.22,.61,.36,1);position:relative}
.rightdock.chat-open .chatpane{width:var(--builder-chat-w,var(--chat-w,min(372px,82vw)))}
/* 幅をドラッグで調整するハンドル（各パネル左端）。ドラッグ中は幅トランジションを切って追従させる。 */
.dock-resizer{position:absolute;left:0;top:0;bottom:0;width:7px;cursor:col-resize;z-index:6}
.dock-resizer::after{content:"";position:absolute;left:2px;top:0;bottom:0;width:2px;background:transparent;transition:background .15s}
.dock-resizer:hover::after,.dock-resizer.drag::after{background:var(--mag)}
body.resizing-dock{user-select:none}
body.resizing-dock .chatpane{transition:none}
.rightdock.solo-chat .drawer{display:none}
.rightdock.solo-chat .chatpane{border-left:1px solid var(--line);box-shadow:-26px 0 60px -34px rgba(26,22,32,.45)}
/* タスクビルダー(#taskNew)から対話を開いた時＝対話ドックは右端(right:0)のまま、タスクパネルを
   チャット幅ぶん左へずらして横並びに（Figma：タスク左・対話右）。 */
body.builder-talk #taskNew.open,
body.builder-talk #worksetNew.open{right:var(--builder-drawer-right,var(--chat-w,min(372px,82vw)))}
/* 横並びは「残りの幅」に合わせて縮める（520px＋会話幅が入らない帯で、流れが左外へはみ出さないように）。 */
/* チャットの幅に上限をつけて、左の背面（サイドバー）が約220px見えるようにする（Figma）。
   上限は、広げて保存されたチャット幅にだけ効く（既定の372pxは変わらない・窓が狭いときは372pxを下回らない）。 */
body.builder-talk{--bt-chat:min(var(--chat-w,min(372px,82vw)),max(372px,calc(100vw - 740px)));--builder-chat-w:var(--bt-chat);--builder-drawer-right:var(--bt-chat);--builder-drawer-w:min(520px,calc(100vw - var(--bt-chat)))}
/* 狭い画面では横に並べる幅がない（流れが画面の左外へ押し出される）＝上に流れ・下に会話で2段にする。
   値だけ差し替え、各要素は自分のセレクターで var() を受け取る（広い画面は従来どおり）。 */
@media(max-width:880px){
  body.builder-talk{--builder-drawer-right:0px;--builder-drawer-w:100vw;--builder-drawer-bottom:48svh;--builder-chat-top:52svh;--builder-chat-w:100vw}
}
/* 横並び時は2枚が密着するので、対話ドック左の影（タスクパネルに落ちて見える影）を消す。 */
body.builder-talk .rightdock.solo-chat .chatpane{box-shadow:none}
.trow{cursor:pointer}

.dw-head{display:flex;align-items:center;gap:4px;padding:11px 14px;border-bottom:1px solid var(--line)}
.dw-ic{width:30px;height:30px;border-radius:8px;border:0;background:0;color:var(--muted);display:grid;place-items:center;transition:.15s}
.dw-ic:hover{background:var(--mag-tint);color:var(--mag-700)}
.dw-head .spacer{flex:1}
.dw-share{display:flex;align-items:center;gap:6px;border:1px solid var(--line-strong);background:#fff;color:var(--ink);font-size:13.5px;font-weight:700;padding:6px 12px;border-radius:8px}
.dw-share:hover{border-color:var(--mag);color:var(--mag-700)}
.dw-bm{width:34px;height:30px;display:grid;place-items:center;border:1px solid var(--line-strong);background:#fff;color:var(--muted);border-radius:8px;transition:.15s}
.dw-bm:hover{border-color:var(--mag);color:var(--mag-700)}
.dw-bm.on{border-color:var(--mag);background:var(--mag-wash);color:var(--mag)}
.dw-bm.on svg{fill:currentColor}

.dw-body{flex:1;overflow-y:auto;padding:24px 28px 30px}
.dw-kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mag);margin-bottom:9px}
.dw-title{font-size:23px;font-weight:900;letter-spacing:-.01em;display:flex;align-items:center;gap:12px;margin-bottom:22px;line-height:1.25}
.dw-title .ti{width:44px;height:44px;border-radius:12px;flex:none;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600)}

.props{display:flex;flex-direction:column;gap:1px;margin-bottom:26px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.prop{display:flex;align-items:center;gap:12px;padding:8px;border-radius:8px;font-size:14px}
.prop:hover{background:var(--bg-soft)}
.prop .pk{width:108px;flex:none;color:var(--muted);display:flex;align-items:center;gap:8px}
.prop .pk svg{color:var(--faint)}
.prop .pv{color:var(--ink);display:flex;align-items:center;gap:9px;font-weight:500}
.prop .pv em{font-style:normal;font-family:var(--mono);font-size:10.5px;color:var(--faint);border:1px solid var(--line);border-radius:20px;padding:2px 8px;letter-spacing:.02em}
.prop-more{font-size:13px;color:var(--faint);padding:8px;cursor:pointer}
.prop-more:hover{color:var(--mag-700)}
.prop .pen{margin-left:auto;width:26px;height:26px;border:0;background:0;color:var(--faint);border-radius:7px;display:grid;place-items:center;opacity:0;transition:.14s;flex:none}
.prop:hover .pen{opacity:1}
.prop .pen:hover{background:var(--mag-tint);color:var(--mag)}
.prop .pval[contenteditable="true"]{outline:0;border-bottom:1.5px solid var(--mag);min-width:40px}
.pmemo{flex:1;border:1px solid var(--line);border-radius:7px;padding:7px 11px;font-size:13.5px;font-family:inherit;color:var(--ink);outline:0;background:var(--bg-soft)}
.pmemo:focus{border-color:var(--mag);background:#fff;box-shadow:0 0 0 3px var(--mag-wash)}
.pmemo::placeholder{color:var(--faint)}

.dw-sec{margin-bottom:26px}
.dw-sec h3{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mag);margin-bottom:15px;display:flex;align-items:center;gap:7px}
/* WS実行：手順ごとの入力ブロック */
.ws-instep{border:1px solid var(--line);border-radius:11px;padding:13px 14px 4px;margin-bottom:12px;background:var(--bg-soft)}
.ws-insteph{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--ink);margin-bottom:10px}
.ws-insteph .sn{flex:none;width:20px;height:20px;border-radius:6px;background:var(--mag);color:#fff;font-size:12.5px;display:grid;place-items:center;font-family:var(--mono)}
.steps{display:flex;flex-direction:column}
.steps.boxed{background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;padding:16px 16px 16px}
.step{display:flex;gap:13px;padding-bottom:16px;position:relative}
.step:last-child{padding-bottom:0}
.step:not(:last-child)::before{content:"";position:absolute;left:14px;top:30px;bottom:2px;width:2px;background:var(--line)}
.step .sn{width:28px;height:28px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600);font-family:var(--mono);font-size:12.5px;font-weight:700;position:relative;z-index:1}
.step .sc b{font-size:15px;font-weight:700;display:block;margin-bottom:1px}
.step .sc span{font-size:13.5px;color:var(--muted);line-height:1.5}

/* ボタンの文字は2行に割らず、入らない時はボタンごと次の行へ */
.dw-foot{display:flex;flex-wrap:wrap;gap:10px;padding:14px 20px;border-top:1px solid var(--line);background:var(--bg-soft)}
.dw-foot .talk{flex:none;display:flex;align-items:center;gap:7px;border:1px solid var(--mag);background:#fff;color:var(--mag-700);font-weight:700;font-size:14.5px;white-space:nowrap;padding:11px 16px;border-radius:10px;transition:.15s}
/* display:flex が hidden 属性に勝って、隠したボタンが出ていた */
.dw-foot .task-model-field{flex:0 0 100%;margin:0 0 6px}
.dw-foot .task-model-field label{margin-bottom:9px}
/* 右の▼を枠線から離す（左の文字の余白12pxと同じ） */
.dw-foot .task-model-field select{appearance:none;-webkit-appearance:none;padding-right:36px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23666' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center}
.dw-foot .task-model-field[hidden]{display:none}
.dw-foot .talk[hidden]{display:none}
.dw-foot .talk:hover{background:var(--mag-tint)}
.dw-foot .run{flex:1;border:0;background:var(--mag);color:#fff;border-radius:10px;font-weight:700;font-size:15px;white-space:nowrap;padding-block:11px;padding-inline:16px;display:flex;align-items:center;justify-content:center;gap:8px;transition:.15s}
.dw-foot .run[hidden]{display:none}
.dw-foot .run:hover{background:var(--mag-600);box-shadow:0 8px 20px -8px var(--mag)}

.cp-head{display:flex;align-items:center;gap:9px;padding:13px 14px;border-bottom:1px solid var(--line);background:#fff}
.cp-head .ci{width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600)}
.cp-head b{font-size:14.5px;font-weight:700}
.cp-head .cp-sub{font-family:var(--mono);font-size:11px;color:var(--faint)}
.cp-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:11px}
.msg{max-width:86%;font-size:14px;line-height:1.55;padding:10px 13px;border-radius:13px}
.msg.ai{align-self:flex-start;background:#fff;border:1px solid var(--line);border-bottom-left-radius:4px;color:var(--ink)}
/* 表を含む返答は、パネルの幅いっぱいまで広げる（86%で止めると、パネルを広げても表の右が空いたままになる） */
.msg.ai:has(.md-tablewrap){max-inline-size:100%}
.msg.me{align-self:flex-end;background:var(--mag);color:#fff;border-bottom-right-radius:4px}
/* 右トーク（#chat）の composer＝メイン v-agent と同じモダンなピル（textarea＋丸送信・⌘/Ctrl+Enter） */
.cp-input{display:flex;align-items:flex-end;gap:8px;margin:12px;padding:7px 7px 7px 14px;background:#fff;border:1px solid var(--line-strong);border-radius:22px;box-shadow:0 2px 14px rgba(26,22,32,.06);transition:.18s}
.cp-input:focus-within{border-color:var(--mag);box-shadow:0 0 0 4px var(--mag-wash),0 2px 14px rgba(26,22,32,.06)}
.cp-input .cp-ta{flex:1;border:0;background:0;outline:0;box-shadow:none;resize:none;font-family:inherit;font-size:15px;line-height:1.5;color:var(--ink);padding:6px 0;min-height:24px;max-height:160px;overflow-y:auto;min-width:0}
.cp-input .cp-ta::placeholder{color:var(--faint)}
.cp-input .send{width:36px;height:36px;flex:none;border:0;border-radius:50%;background:var(--line-strong);color:#fff;display:grid;place-items:center;cursor:default;transition:.15s}
.cp-input.has-text .send{background:var(--mag);cursor:pointer}
.cp-input.has-text .send:hover{background:var(--mag-700)}

.fab{position:fixed;right:24px;bottom:24px;z-index:44;width:56px;height:56px;border-radius:50%;border:0;background:var(--mag);color:#fff;display:grid;place-items:center;box-shadow:0 12px 28px -10px var(--mag);transition:.2s;cursor:pointer}
.fab:hover{background:var(--mag-600);transform:translateY(-2px);box-shadow:0 16px 34px -10px var(--mag)}
.hint{position:fixed;right:24px;bottom:92px;font-family:var(--mono);font-size:11px;color:var(--faint);background:#fff;border:1px solid var(--line);padding:6px 11px;border-radius:20px;box-shadow:var(--shadow)}

@keyframes pulse{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(236,0,140,.4)}50%{opacity:.55;box-shadow:0 0 0 5px rgba(236,0,140,0)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes pop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}

/* 狭い画面（タブレット縦/スマホ）：サイドバーは常設をやめ、ヘッダーの開閉ボタンで
   オーバーレイとして出す（UI-3＝設定・ログアウト・ナビへの導線を絶やさない）。
   背面の暗幕は box-shadow の広がりで作る（追加DOM無し・クリック閉じは app.js）。 */
@media(max-width:880px){
  .sidebar{display:none}
  .app.sb-open .sidebar{display:flex;position:fixed;top:0;left:0;bottom:0;width:min(80vw,300px);z-index:120;
    padding:20px 16px 20px;border-right:1px solid var(--line); /* デスクトップで sb-collapsed（padding:0）にした残りを打ち消す */
    background:var(--bg-soft);box-shadow:0 0 0 100vmax rgba(15,18,32,.35),8px 0 30px rgba(15,18,32,.18)}
  .content{padding:20px 16px 90px}
}

/* ---------- login（コミット11） ---------- */
.login-view{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px;
  background:radial-gradient(120% 90% at 100% -10%, var(--mag-tint), transparent 42%),var(--bg)}
.login-view[hidden]{display:none}
.login-card{width:min(380px,100%);display:flex;flex-direction:column;gap:13px;
  background:#fff;border:1px solid var(--mag);border-radius:18px;padding:30px 28px;
  box-shadow:0 24px 60px -22px rgba(236,0,140,.28)}
.login-logo{height:22px;width:auto;align-self:flex-start;margin-bottom:2px}
.login-h{font-size:21px;font-weight:900;letter-spacing:-.01em}
.login-sub{font-size:13.5px;color:var(--muted);margin-top:-8px;margin-bottom:4px}
.login-field{display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:700;color:var(--muted)}
.login-field input{border:1px solid var(--line-strong);border-radius:10px;padding:11px 13px;font-size:15px;
  font-family:inherit;color:var(--ink);outline:0;background:#fff;transition:.14s}
.login-field input:focus{border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-wash)}
.login-error{font-size:13px;color:var(--mag-700);background:var(--mag-wash);border-radius:9px;padding:9px 12px}
.login-error[hidden]{display:none}
.login-btn{margin-top:4px;border:0;background:var(--mag);color:#fff;font-weight:700;font-size:15px;
  padding:12px;border-radius:11px;transition:.15s}
.login-btn:hover{background:var(--mag-600)}
.login-btn:disabled{opacity:.6;cursor:default}

/* ---------- 足せる器：汎用フォームモーダル（コミット14-16） ---------- */
.form-modal{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:20px;
  background:rgba(26,22,32,.42);backdrop-filter:blur(2px)}
.fm-card{width:min(420px,100%);max-height:90vh;overflow-y:auto;display:flex;flex-direction:column;gap:12px;
  background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 22px 18px;box-shadow:var(--shadow-lg)}
.fm-head{font-size:16px;font-weight:900;letter-spacing:-.01em}
.fm-field{display:flex;flex-direction:column;gap:5px;font-size:12.5px;font-weight:700;color:var(--muted)}
.fm-field input,.fm-field select,.fm-field textarea{border:1px solid var(--line-strong);border-radius:9px;
  padding:9px 11px;font-size:14.5px;font-family:inherit;color:var(--ink);outline:0;background:#fff;transition:.14s}
.fm-field textarea{min-height:60px;resize:vertical;line-height:1.5}
.fm-field input:focus,.fm-field select:focus,.fm-field textarea:focus{border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-wash)}
.fm-err{font-size:13px;color:var(--mag-700);background:var(--mag-wash);border-radius:8px;padding:8px 11px}
.fm-err[hidden]{display:none}
.fm-foot{display:flex;gap:9px;justify-content:flex-end;margin-top:4px}
.fm-cancel{border:1px solid var(--line-strong);background:#fff;color:var(--ink);font-weight:700;font-size:13.5px;padding:9px 15px;border-radius:9px}
.fm-cancel:hover{border-color:var(--mag);color:var(--mag-700)}
.fm-ok{border:0;background:var(--mag);color:#fff;font-weight:700;font-size:13.5px;padding:9px 17px;border-radius:9px}
.fm-ok:hover{background:var(--mag-600)}
/* 接続追加モーダル（種類トグル＋該当フィールド） */
.cm-seg{display:flex;gap:3px;padding:3px;background:var(--bg);border:1px solid var(--line);border-radius:11px}
.cm-seg .ms-opt{flex:1;justify-content:center}
.cm-note{font-size:12px;color:var(--faint);line-height:1.5;margin:-2px 0 2px}
.cm-list{margin:4px 0 6px;padding-left:1.2em}
.cm-list li{margin:2px 0}
.cm-hint{display:block;font-size:12px;color:var(--muted);line-height:1.45;margin:4px 0 0}
.linklike{border:0;background:0;padding:0;color:var(--mag-700);font:inherit;font-size:inherit;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.linklike:hover{color:var(--mag)}
/* 実行中の停止ボタン（送った吹き出しの下） */
.stoprow{margin:2px 0 6px}
.stopbtn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-strong);background:#fff;color:var(--muted);font-size:13px;font-weight:600;padding:5px 12px;border-radius:8px;cursor:pointer;transition:.15s}
.stopbtn:hover{border-color:var(--mag);color:var(--mag);background:var(--mag-tint)}
.cm-check{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer;margin-top:2px}
.cm-check input{width:15px;height:15px;accent-color:var(--mag);cursor:pointer}
.cm-err{font-size:13px;color:var(--danger-700);background:var(--danger-wash);border:1px solid var(--danger-line);border-radius:8px;padding:8px 10px}

/* 共有トースト（非ブロッキング・右下・白×マゼンタ）＋ 確認モーダル（confirm の置換） */
.toast-host{position:fixed;right:20px;bottom:20px;z-index:300;display:flex;flex-direction:column;gap:8px;align-items:flex-end;pointer-events:none}
.toast{display:flex;align-items:center;gap:9px;max-width:340px;padding:11px 14px;border-radius:11px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-lg);font-size:14px;font-weight:600;color:var(--ink);opacity:0;transform:translateY(8px);transition:.22s;pointer-events:auto}
.toast.in{opacity:1;transform:none}
.toast-act{flex:none;margin-inline-start:4px;padding-block:4px;padding-inline:10px;border:1px solid var(--mag);border-radius:8px;background:var(--mag);color:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.toast-act:hover{background:var(--mag-600)}
.form-modal .trow.hl{background:var(--mag-tint);box-shadow:inset 3px 0 0 var(--mag)}
.toast svg{flex:none}
.toast-x{flex:none;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-inline-start:2px;padding:0;border:0;border-radius:6px;background:transparent;cursor:pointer}
.toast.ok .toast-x svg,.toast.err .toast-x svg{color:#8a8a99}
.toast-x:hover{background:var(--line)}
.toast.ok .toast-x:hover svg,.toast.err .toast-x:hover svg{color:var(--ink)}
.toast.ok{border-color:var(--ok-wash)}.toast.ok svg{color:var(--ok)}
.toast.err{border-color:var(--danger-line)}.toast.err svg{color:var(--danger-700)}
.cf-card{gap:18px}
.cf-msg{font-size:14.5px;line-height:1.65;color:var(--ink)}
/* 完了3択の任意メモ入力 */
/* 初期化の項目チェック（デバッグ用初期化モーダル） */
.reset-items{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:11px;padding:6px;background:var(--bg-soft)}
.reset-item{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:8px;font-size:14.5px;color:var(--ink);cursor:pointer;transition:.12s}
.reset-item:hover{background:var(--mag-wash)}
.reset-item input{width:16px;height:16px;accent-color:var(--mag);flex:none}
/* 初期化の最終確認：組織名を手で打たせる（勢いで消せない形にする） */
.reset-confirm{display:flex;flex-direction:column;gap:6px;margin-block-start:12px}
.reset-confirm label{font-size:13.5px;color:var(--muted)}
.reset-confirm b{color:var(--ink)}
.reset-confirm-input{inline-size:100%;padding:9px 11px;border:1px solid var(--line);border-radius:9px;font:inherit;font-size:14.5px;color:var(--ink);background:#fff}
.reset-confirm-input:focus{outline:2px solid var(--mag);outline-offset:-1px}

/* =========================================================================
   #v-agent ＝ 管理者AI画面を ChatGPT 風に寄せる（ライト＋マゼンタ）。
   すべて #v-agent スコープで既存チャットCSSを上書き（グローバル .msg には触れない）。
   ========================================================================= */
/* チャット上部バー：サイドバートグル＋モデルセレクタ（ChatGPT風・チャット列の最上部） */
#v-agent .bc-top{display:flex;align-items:center;gap:4px;padding:2px 2px 10px}
/* 上部の トグル／新規 ボタン：コンポーザと同じ orca トンマナのフラット丸に統一 */
#v-agent .bc-top .ph-toggle{width:34px;height:34px;flex:none;border:0;background:0;border-radius:9px;color:var(--muted);display:grid;place-items:center;cursor:pointer;transition:.13s}
#v-agent .bc-top .ph-toggle:hover{color:var(--mag);background:var(--mag-tint)}
#v-agent .bc-top .ph-toggle.on{color:var(--mag);background:var(--mag-wash)}
#v-agent .bc-top .ph-toggle+.mode-seg{margin-left:6px}
/* エージェント選択＝セグメント・ボタン（プルダウンではない）。選択中はマゼンタで色つき＝トンマナ統一 */
#v-agent .bc-top .mode-seg{display:inline-flex;gap:3px;margin-left:2px;padding:3px;background:var(--bg-soft);border:1px solid var(--line);border-radius:12px}
#v-agent .bc-top .ms-opt{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border:0;background:0;border-radius:9px;font-size:14px;font-weight:700;color:var(--muted);cursor:pointer;transition:.13s;white-space:nowrap}
#v-agent .bc-top .ms-opt[hidden]{display:none}
#v-agent .bc-top .ms-opt svg{flex:none;opacity:.85}
#v-agent .bc-top .ms-opt:hover{color:var(--ink)}
#v-agent .bc-top .ms-opt.active{background:var(--mag);color:#fff;box-shadow:0 3px 9px -3px var(--mag)}
#v-agent .bc-top .ms-opt.active svg{opacity:1}
/* エージェント画面は全幅で使う（.content の 1180px 上限と 90px 下余白を解除） */
body.on-agent .content{max-width:none;padding:16px 26px 12px}
/* キャンバス化：bigchat の枠・影・最大幅を撤去して背景に溶かす。履歴は左レール */
#v-agent .agentwrap{display:flex;gap:10px;align-items:stretch;height:calc(100vh - 122px);min-height:500px}
#v-agent .bigchat{flex:1;min-width:0;max-width:none;display:flex;flex-direction:column;height:100%;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
/* 左レール（会話履歴）：collapse は幅0（負マージンは使わない＝左配置のため） */
#v-agent .agentwrap.panel-off .sesspanel{width:0;opacity:0;border-width:0;margin:0;pointer-events:none}
/* トランスクリプト：中央740px読み物列・余白たっぷり */
#v-agent .bc-msgs{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:24px;width:100%;max-width:1040px;margin:0 auto;padding:22px 16px 12px}
/* アシスタント＝バブル無しの全幅プレーン本文（ChatGPT流） */
#v-agent .bc-msgs .msg{max-width:100%;font-size:16px;line-height:1.75;padding:0;border:0;border-radius:0;background:none}
#v-agent .bc-msgs .msg.ai{align-self:stretch;color:var(--ink);white-space:pre-wrap}
#v-agent .bc-msgs .msg.ai .th-ic{color:var(--mag);opacity:.85;vertical-align:-1px;margin-right:2px}
/* ユーザー＝控えめな薄マゼンタ角丸バブル（右寄せ） */
#v-agent .bc-msgs .msg.me{align-self:flex-end;max-width:80%;white-space:pre-wrap;background:var(--mag-tint);color:var(--ink);border:1px solid var(--mag-wash);border-radius:18px 18px 6px 18px;padding:11px 15px}
#v-agent .bc-msgs .caret{display:inline-block;width:2px;height:1.05em;background:var(--mag);vertical-align:-2px;margin-left:1px;animation:blink 1s steps(1) infinite}
/* 稼働表示（Claude Code 風の活動ログ）：直近の思考・道具使用を時系列リストで。最後の1件が「実行中」。 */
#v-agent .bc-msgs .msg.ai.actfeed{display:flex;flex-direction:column;gap:5px;white-space:normal}
#v-agent .bc-msgs .actline{display:flex;align-items:flex-start;gap:7px;color:var(--muted);font-size:14px;line-height:1.5}
#v-agent .bc-msgs .actline.on{color:var(--ink)}
#v-agent .bc-msgs .actline .acttext{flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}
#v-agent .bc-msgs .actline.on .acttext{-webkit-line-clamp:2}
#v-agent .bc-msgs .actline .actdot{flex:none;width:6px;height:6px;border-radius:50%;background:var(--mag);opacity:.45;margin-top:6px}
#v-agent .bc-msgs .actline .th-ic{flex:none;margin-top:3px}
/* ドック（AIと対話）でも同じ稼働表示にする＝管理者AI画面と統一（actfeed のCSSが #v-agent 限定で漏れていた）。actfeed はバブル無し全幅に。 */
.cp-body .msg.ai.actfeed{display:flex;flex-direction:column;gap:5px;white-space:normal;border:0;background:none;padding:0}
.cp-body .actline{display:flex;align-items:flex-start;gap:7px;color:var(--muted);font-size:13.5px;line-height:1.5}
.cp-body .actline.on{color:var(--ink)}
.cp-body .actline .acttext{flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}
.cp-body .actline.on .acttext{-webkit-line-clamp:2}
.cp-body .actline .actdot{flex:none;width:6px;height:6px;border-radius:50%;background:var(--mag);opacity:.45;margin-top:6px}
.cp-body .actline .th-ic{flex:none;margin-top:3px}
.cp-body .msg.ai .th-ic{color:var(--mag);opacity:.85;vertical-align:-1px;margin-right:2px}
.cp-body .caret{display:inline-block;width:2px;height:1.05em;background:var(--mag);vertical-align:-2px;margin-left:1px;animation:blink 1s steps(1) infinite}
/* 空状態：ヒーロー（中央）。:has で検知しJS無改変 */
#v-agent .bc-msgs .msg.ai.greet{display:flex;flex-direction:column;align-items:center;text-align:center;gap:9px}
#v-agent .bc-msgs .msg.ai.greet .gh-ic{width:54px;height:54px;border-radius:16px;background:var(--mag-tint);color:var(--mag);display:grid;place-items:center;margin-bottom:4px}
#v-agent .bc-msgs .msg.ai.greet .gh-title{font-size:23px;font-weight:800;letter-spacing:-.01em;color:var(--ink);margin:0}
/* ほかの案内文（句読点で区切っていないもの）は、対応しているブラウザーで文節ごとに折り返す */
.gh-sub{word-break:auto-phrase}
#v-agent .bc-msgs .msg.ai.greet .gh-sub .ph{display:inline-block}
#v-agent .bc-msgs .msg.ai.greet .gh-sub{font-size:15px;color:var(--muted);max-width:460px;margin:0;line-height:1.65}
#v-agent .bc-msgs:has(.greet:only-child){justify-content:center}
/* 入力欄は常に下部に固定（空状態でも持ち上げない＝もう少し下） */
#v-agent .bc-input{margin-bottom:2px}
/* コンポーザ：下中央の大角丸ピル（selector .bc-input / input / .send 厳守） */
#v-agent .bc-input{display:flex;flex-direction:column;gap:8px;width:100%;max-width:1040px;margin:10px auto 6px;padding:12px 14px;background:#fff;border:1px solid var(--line-strong);border-radius:26px;box-shadow:0 2px 18px rgba(26,22,32,.07);transition:.18s}
#v-agent .bc-input:focus-within{border-color:var(--mag);box-shadow:0 0 0 4px var(--mag-wash),0 2px 18px rgba(26,22,32,.07)}
#v-agent .bc-input textarea{flex:none;width:100%;border:0;background:0;outline:0;box-shadow:none;padding:4px 6px;font-size:16px;font-family:inherit;color:var(--ink);resize:none;line-height:1.5;min-height:26px;max-height:200px;overflow-y:auto}
#v-agent .bc-input textarea::placeholder{color:var(--faint)}
#v-agent .bc-tools{display:flex;align-items:center;justify-content:space-between;gap:8px}
#v-agent .bc-left,#v-agent .bc-right{display:flex;align-items:center;gap:4px}
/* ツールボタン：orcaトンマナで統一（フラットな丸・muted→マゼンタのホバー）。未配線(.soon/:disabled)は薄く・無反応＝正直に */
#v-agent .bc-rd{width:34px;height:34px;flex:none;border-radius:50%;border:0;background:0;color:var(--muted);display:grid;place-items:center;cursor:pointer;transition:.13s}
#v-agent .bc-rd:not(:disabled):hover{color:var(--mag);background:var(--mag-tint)}
#v-agent .bc-rd.soon,#v-agent .bc-rd:disabled{opacity:.38;cursor:default}
/* 送信ボタン：本文があるときだけマゼンタ＋押下可（JS駆動 .has-text）。空はグレー＝押せないと分かる。送信中は薄く脈動 */
#v-agent .bc-input .send{width:40px;height:40px;flex:none;border:0;border-radius:50%;background:var(--line-strong);color:#fff;display:grid;place-items:center;cursor:default;transition:.15s}
#v-agent .bc-input.has-text .send{background:var(--mag);cursor:pointer}
#v-agent .bc-input.has-text .send:hover{background:var(--mag-700)}
#v-agent .bc-input.sending .send{opacity:.6;cursor:default;animation:pulse 1.2s infinite}
#v-agent .bc-input .send:disabled{cursor:default}
/* ツールボタンのオン状態（Webリサーチ）／音声入力の録音中 */
#v-agent .bc-rd.on{color:var(--mag);background:var(--mag-wash)}
/* いま使うモデル名の文字ボタン（入力欄の右下）。長いモデル名は省略して、幅を食い過ぎない */
#v-agent .bc-right,.chatpane .bc-right{min-width:0}
#v-agent .bc-rd.bc-mdl{flex:0 1 auto;min-width:0;width:auto;max-width:240px;height:34px;border-radius:17px;padding-inline:10px;display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;font-family:inherit}
.bc-mdl .bc-mdl-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-mdl svg{flex:none}
#v-agent .bc-rd.rec{color:#fff;background:var(--mag);animation:pulse 1.1s infinite}
/* 画像添付プレビュー（チップ） */
#v-agent .bc-attach{display:flex;flex-wrap:wrap;gap:6px;padding:2px 4px 6px}
.att-chip{display:flex;align-items:center;gap:7px;max-width:220px;padding:4px 7px 4px 5px;border:1px solid var(--line-strong);border-radius:10px;background:#fff;font-size:12.5px;color:var(--ink)}
.att-chip img{width:24px;height:24px;border-radius:6px;object-fit:cover;flex:none;background:var(--bg-soft)}
.att-chip .att-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att-chip .att-rm{flex:none;border:0;background:0;color:var(--faint);cursor:pointer;border-radius:5px;display:grid;place-items:center;padding:2px}
.att-chip .att-rm:hover{color:var(--mag);background:var(--mag-tint)}
.att-chip.up{opacity:.6}
/* モデル選択ポップオーバー（popmenu を流用＋選択行） */
.mdl-item{display:flex;align-items:flex-start;gap:9px;width:100%;padding:8px 10px;background:0;border:0;border-radius:8px;text-align:left;font-size:14px;color:var(--ink);cursor:pointer;transition:.1s}
.mdl-item:hover{background:var(--bg)}
.mdl-item .mdl-t{flex:1;min-width:0}
.mdl-item .mdl-t small{display:block;font-size:11.5px;color:var(--muted);margin-top:1px}
.mdl-item.sel .mdl-t b{color:var(--mag-700)}
.mdl-item .mdl-ck{flex:none;color:var(--mag);opacity:0;margin-top:2px}
.mdl-item.sel .mdl-ck{opacity:1}
#v-agent .bc-note{text-align:center;font-size:12px;color:var(--faint);margin:0 auto 6px;max-width:1040px}
/* 履歴レール：新規チャットを最上位・active を細左バーへ */
/* 履歴レール：フラット（大きな空カードを廃し、右罫で仕切るだけ）。既定は閉じ（panel-off） */
#v-agent .sesspanel{width:256px;flex:none;display:flex;flex-direction:column;border:0;border-right:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;overflow:hidden}
#v-agent .sp-new{display:flex;align-items:center;gap:8px;justify-content:flex-start;width:auto;margin:12px 12px 4px;padding:10px 12px;font-size:14px;font-weight:700;color:var(--mag-700);border:1px solid var(--line);background:#fff;border-radius:12px;cursor:pointer;transition:.13s}
#v-agent .sp-new:hover{background:var(--mag-tint);border-color:var(--mag-wash)}
#v-agent .sp-new svg{color:var(--mag)}
#v-agent .sp-head{display:flex;align-items:center;padding:8px 14px 6px;border-bottom:0}
#v-agent .sp-head b{font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--faint)}
#v-agent .sess-item.active{background:var(--mag-tint);border-color:transparent;position:relative}
#v-agent .sess-item.active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:2px;border-radius:2px;background:var(--mag)}
/* 管理者AI画面では右下のFAB（別チャット）を隠す（本家に寄せる） */
body.on-agent .fab{display:none}
/* レスポンシブ：980px以下は履歴非表示・列幅解放 */
@media(max-width:980px){
  #v-agent .sesspanel{display:none}
  #v-agent .bc-msgs,#v-agent .bc-input,#v-agent .bc-note{max-width:none}
}

/* ============ タスク/WS ビルダー：ヒアリング→エディタ（m4） ============ */
/* ヒアリング（intake） */
.intake-h{font-size:21px;font-weight:900;letter-spacing:-.02em;margin:6px 0 6px}
.intake-d{font-size:14px;color:var(--muted);margin-bottom:16px;line-height:1.6}
.intake-input{width:100%;border:1px solid var(--line-strong);border-radius:12px;padding:14px 15px;font-size:15px;font-family:inherit;color:var(--ink);outline:0;background:#fff;resize:vertical;min-height:120px;line-height:1.6}
.intake-input:focus{border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-wash)}
.intake-input::placeholder{color:var(--faint)}
.intake-ex{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:13px}
.intake-ex .ex-label{font-size:12px;font-family:var(--mono);color:var(--faint);letter-spacing:.06em}
.intake-ex .ex{font-size:13px;font-weight:700;color:var(--mag-700);background:var(--mag-tint);border:1px solid #F3D9E8;border-radius:999px;padding:5px 12px}
.intake-ex .ex:hover{border-color:var(--mag)}
.intake-reply{display:flex;gap:9px;align-items:flex-start;background:var(--mag-tint);border:1px solid #F3D9E8;border-radius:11px;padding:12px 14px;margin-top:18px;font-size:13.5px;color:var(--mag-700);line-height:1.6}
.intake-reply .ir-ic{width:24px;height:24px;border-radius:7px;flex:none;background:var(--mag-wash);color:var(--mag-600);display:grid;place-items:center}
.intake-reply.thinking{color:var(--muted)}
.back-intake{border:0;background:0;color:var(--mag-700);font-family:var(--mono);font-size:12px;font-weight:700;cursor:pointer;padding:0;margin-right:10px}
.back-intake:hover{text-decoration:underline}

/* タイトル下の説明（薄め・読みやすく） */
.fdesc{display:block;width:100%;border:1px solid transparent;border-radius:9px;outline:0;resize:none;overflow:hidden;font-family:inherit;font-size:14px;color:var(--muted);background:0;margin:-12px 0 20px;line-height:1.6;word-break:auto-phrase;min-height:24px;padding:2px 0}
.fdesc:focus{border-color:var(--line-strong);background:#fff;padding:8px 10px;color:var(--ink)}
.fdesc::placeholder{color:var(--faint)}

/* Notion風プロパティ（基本項目・設定） */
.nprops{border:1px solid var(--line);border-radius:11px;overflow:hidden;margin-bottom:18px}
.nprop{display:flex;align-items:center;gap:10px;padding:7px 13px;border-bottom:1px solid var(--line);min-height:44px}
.nprop:last-child{border-bottom:0}
.nprop:hover{background:var(--bg-soft)}
.npk{display:flex;align-items:center;gap:8px;width:108px;flex:none;color:var(--muted);font-size:13.5px;font-weight:500}
.npk svg{color:var(--faint);flex:none}
.npv{flex:1;font-size:14px;color:var(--ink);display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.seg.mini{flex-wrap:wrap;gap:6px}
.seg.mini .opt{flex:none;padding:5px 12px;font-size:13px;border-radius:999px}

/* 入力スキーマ（型つき項目） */
.schemaList{display:flex;flex-direction:column;gap:8px}
.sfield{display:flex;align-items:center;flex-wrap:wrap;gap:9px;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:#fff}
.sfield.isfile{border-color:#F3D9E8;background:var(--mag-tint)}
/* 固定参照（#1 入力2分離）：url 型を制作時に固定するトグル＋url/label 入力 */
.sbound{flex:none;font-size:11px;font-family:var(--mono);font-weight:700;color:var(--muted);border:1px solid var(--line-strong);border-radius:6px;padding:4px 7px;background:#fff;cursor:pointer;white-space:nowrap}
.sbound.on{color:#fff;border-color:var(--mag);background:var(--mag)}
.sfield.isbound{border-color:#F3D9E8;background:var(--mag-tint)}
.sfield.isbound .sreq{opacity:.4;cursor:default}
.sfield .shint{flex-basis:100%;border:0;border-top:1px dashed var(--line);margin-top:1px;padding:6px 2px 0 23px;font-size:13px;font-family:inherit;color:var(--muted);background:0;outline:0;min-width:0}
.sfield .shint::placeholder{color:var(--faint)}
.sres{flex-basis:100%;display:flex;gap:7px;padding:6px 2px 0 23px;margin-top:1px;border-top:1px dashed #F3D9E8}
.sres input{flex:1;border:1px solid var(--line-strong);border-radius:7px;padding:6px 9px;font-size:13px;font-family:inherit;color:var(--ink);outline:0;min-width:0}
.sres input:focus{border-color:var(--mag);box-shadow:0 0 0 2px var(--mag-wash)}
.sres .sresurl{flex:2}
.sfield .sgrip{color:var(--faint);font-size:15px;flex:none;cursor:grab}
.sfield .sname{flex:1;border:0;outline:0;font-size:14px;font-weight:700;font-family:inherit;color:var(--ink);background:0;min-width:40px}
.sfield .sname::placeholder{color:var(--faint);font-weight:400}
.stype{position:relative;flex:none}
.stype select{appearance:none;-webkit-appearance:none;border:1px solid #F3D9E8;background:#fff;color:var(--mag-700);font-family:var(--mono);font-size:12px;font-weight:700;border-radius:999px;padding:5px 24px 5px 11px;outline:0;cursor:pointer}
.stype::after{content:"▾";position:absolute;right:10px;top:6px;color:var(--mag-600);font-size:11px;pointer-events:none}
.sreq{flex:none;font-size:11px;font-family:var(--mono);font-weight:700;color:var(--muted);border:1px solid var(--line-strong);border-radius:6px;padding:4px 7px;background:#fff;cursor:pointer;white-space:nowrap}
.sreq.on{color:var(--mag-700);border-color:#F3D9E8;background:var(--mag-tint)}
.sfield .srm{width:24px;height:24px;border:0;background:0;color:var(--faint);border-radius:6px;display:grid;place-items:center;flex:none;cursor:pointer}
.sfield .srm:hover{background:var(--mag-wash);color:var(--mag)}
.uphint{flex-basis:100%;font-size:11.5px;color:var(--mag-700);font-family:var(--mono);padding-left:23px}
.addfield{display:flex;align-items:center;justify-content:center;gap:7px;border:1px dashed var(--line-strong);border-radius:10px;padding:9px;font-size:13.5px;font-weight:700;color:var(--mag-700);background:var(--mag-tint);width:100%;cursor:pointer}
.addfield:hover{border-color:var(--mag)}
.refadd{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px}
.refadd .addfield{width:auto;flex:1 1 140px;padding:6px 12px;font-size:12.5px}
.refadd small{flex-basis:100%;color:var(--faint);font-size:11.5px}

/* 手順（このタスクが行うこと）＝本体・最後が出力に繋がる */
.howto{border:1.5px solid var(--mag);border-radius:12px;padding:16px 18px}
.flow{display:flex;flex-direction:column}
.flow-empty{padding-block:2px 12px;font-family:var(--sans);font-size:14px;font-weight:400;line-height:1.6;letter-spacing:normal;color:var(--faint)}
/* 様式・過去の例（流れの下）＝ファイル名だけの小さい一覧。長い名前は折り返す（見切れない） */
.task-refs{display:flex;flex-wrap:wrap;gap:6px}
.ref-chip{display:flex;align-items:center;gap:6px;max-width:100%;padding-block:4px;padding-inline:8px 4px;border:1px solid var(--line-strong);border-radius:10px;background:#fff;font-family:var(--sans);font-size:12.5px;font-weight:400;line-height:1.5;letter-spacing:normal;color:var(--ink)}
.ref-ic{flex:none;display:grid;color:var(--muted)}
.ref-kind{flex:none;padding-block:1px;padding-inline:7px;border:1px solid var(--line-strong);border-radius:6px;background:#fff;font:inherit;font-size:11.5px;line-height:1.5;color:var(--muted);cursor:pointer;white-space:nowrap}
.ref-kind.template{border-color:var(--mag);background:var(--mag-tint);color:var(--mag)}
.ref-kind:hover{border-color:var(--mag)}
.ref-name{min-width:0;overflow-wrap:anywhere}
.ref-rm{flex:none;display:grid;place-items:center;padding-block:2px;padding-inline:2px;border:0;border-radius:5px;background:0;color:var(--faint);cursor:pointer}
.ref-rm:hover{color:var(--mag);background:var(--mag-tint)}
.fstep{display:flex;gap:13px}
/* 会話で増えた手順（JSが付ける状態）＝ふわっと出して、どこが増えたか分かるように */
.fstep[data-fresh]{animation:fadeUp .45s both}
@media (prefers-reduced-motion: reduce){ .fstep[data-fresh]{animation:none} }
.fstep .rail{display:flex;flex-direction:column;align-items:center;flex:none;width:26px}
.fstep .fd{width:26px;height:26px;border-radius:50%;background:var(--mag);color:#fff;font-family:var(--mono);font-size:13px;font-weight:700;display:grid;place-items:center}
.fstep .fl{width:2px;flex:1;background:var(--line-strong);min-height:12px}
.fstep .fb{flex:1;padding-bottom:12px;display:flex;align-items:center;gap:7px}
.fstep .fb input{flex:1;min-width:0;border:0;outline:0;font-size:15px;font-weight:600;font-family:inherit;color:var(--ink);background:0;border-bottom:1px solid transparent;padding:3px 0}
.fstep .fb input:focus{border-bottom-color:var(--line-strong)}
.fstep .fb .srm{width:22px;height:22px;border:0;background:0;color:var(--faint);border-radius:6px;display:grid;place-items:center;flex:none;cursor:pointer}
.fstep .fb .srm:hover{background:var(--mag-wash);color:var(--mag)}
.fstep.out .fd{background:#fff;border:2px solid var(--ink);color:var(--ink);border-radius:8px;font-size:11px}
.fstep.out .fb{padding-bottom:0}
.obox{flex:1;border:1px solid var(--ink);border-radius:10px;padding:9px 12px;background:var(--bg-soft);display:flex;align-items:center;gap:9px}
.obox .ok{font-family:var(--mono);font-size:10.5px;font-weight:700;color:#fff;background:var(--ink);border-radius:6px;padding:3px 8px;flex:none}
.obox input{flex:1;border:0;outline:0;font-size:13.5px;color:var(--ink);background:0;font-family:inherit}
/* 手順・得られる結果は複数行（中身に合わせて高さが伸びる＝JSの growTa）。長い文も見切れない */
.stepin{flex:1;min-width:0;display:block;border:0;border-bottom:1px solid transparent;outline:0;padding-block:3px;padding-inline:0;background:0;resize:none;overflow:hidden;font-family:inherit;font-size:15px;font-weight:600;line-height:1.5;letter-spacing:normal;word-break:auto-phrase;text-wrap:pretty;color:var(--ink)}
.stepin:focus{border-bottom-color:var(--line-strong)}
.stepin::placeholder{color:var(--faint)}
.outin{flex:1;min-width:0;display:block;border:0;outline:0;padding-block:0;padding-inline:0;background:0;resize:none;overflow:hidden;font-family:inherit;font-size:13.5px;font-weight:400;line-height:1.5;letter-spacing:normal;word-break:auto-phrase;text-wrap:pretty;color:var(--ink)}
.outin::placeholder{color:var(--faint)}
.addstep{font-size:12.5px;color:var(--mag-700);font-weight:700;cursor:pointer;background:0;border:0;padding:2px 0 8px 39px;text-align:left}
.addstep:hover{text-decoration:underline}
/* くわしい設定（流れ以外の設定をしまう・初期は閉じる） */
.task-adv{border:1px solid var(--line);border-radius:12px;background:var(--bg-soft)}
/* 開いた時は親が矢印の向きだけ差し替え、子は自分のセレクターで受け取る */
.task-adv[open]{background:#fff;--task-adv-arrow:rotate(180deg)}
.task-adv-sum{display:flex;align-items:center;flex-wrap:wrap;column-gap:8px;row-gap:2px;padding-block:12px;padding-inline:14px;cursor:pointer;list-style:none;color:var(--muted)}
.task-adv-sum::-webkit-details-marker{display:none}
.task-adv-sum::after{content:"▾";margin-inline-start:auto;font-size:12px;color:var(--faint);transform:var(--task-adv-arrow,none);transition:transform .15s}
.task-adv-ttl{font-family:var(--sans);font-size:14px;font-weight:700;line-height:1.5;letter-spacing:normal;color:var(--ink)}
.task-adv-sub{order:1;flex-basis:100%;padding-inline-start:22px;font-family:var(--sans);font-size:12.5px;font-weight:400;line-height:1.5;letter-spacing:normal;color:var(--muted)}
.task-adv-body{padding-block:4px 14px;padding-inline:14px}

/* 業務フローの流れ（再利用/新規） */
.wschain{display:flex;flex-direction:column}
.wsstep{display:flex;gap:13px}
.wsstep .rail{display:flex;flex-direction:column;align-items:center;flex:none;width:28px}
.wsstep .wd{width:28px;height:28px;border-radius:50%;font-family:var(--mono);font-size:13px;font-weight:700;display:grid;place-items:center;flex:none}
.wsstep.reuse .wd{background:var(--ok-wash);color:var(--ok);border:1.5px solid #bfe6d3}
.wsstep.new .wd{background:var(--mag-wash);color:var(--mag-700);border:1.5px solid #F3D9E8}
.wsstep .wl{width:2px;flex:1;background:var(--line-strong);min-height:14px}
.wsstep:last-child .wl{display:none}
.wsstep .wb{flex:1;padding-bottom:16px;display:flex;align-items:center;gap:8px}
.wsstep .wb .wt{font-size:14.5px;font-weight:700;flex:1}
.wsbadge{font-size:11px;font-weight:700;font-family:var(--mono);padding:2px 9px;border-radius:999px}
.wsbadge.reuse{background:var(--ok-wash);color:var(--ok)}
.wsbadge.new{background:var(--mag-wash);color:var(--mag-700)}
.wsstep .srm{width:22px;height:22px;border:0;background:0;color:var(--faint);border-radius:6px;display:grid;place-items:center;flex:none;cursor:pointer}
.wsstep .srm:hover{background:var(--mag-wash);color:var(--mag)}
.wsaddrow{display:flex;align-items:center;gap:7px;padding-left:41px}
.wsadd{display:inline-flex;align-items:center;gap:6px;border:1px dashed var(--line-strong);border-radius:9px;padding:7px 12px;font-size:13px;font-weight:700;color:var(--mag-700);background:var(--mag-tint);cursor:pointer}
.wsadd:hover{border-color:var(--mag)}

/* 実行入力フォームのファイル/画像アップロード欄 */
.updrop{border:1.5px dashed var(--line-strong);border-radius:10px;padding:15px;text-align:center;font-size:13.5px;color:var(--muted);background:var(--bg-soft);cursor:pointer}
.updrop.over{border-color:var(--mag);background:var(--mag-tint)}
.updrop b{display:block;color:var(--ink);font-size:14px;margin-bottom:2px}
.upfiles{display:flex;flex-direction:column;gap:6px;margin-top:9px}
.upfile{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:8px;padding:7px 11px;font-size:13.5px}
.upfile img{width:30px;height:30px;border-radius:6px;object-fit:cover;flex:none}
.upfile .un{flex:1;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upfile .us{font-family:var(--mono);font-size:11px;color:var(--faint)}
.upfile .urm{width:22px;height:22px;border:0;background:0;color:var(--faint);border-radius:6px;display:grid;place-items:center;cursor:pointer;flex:none}
.upfile .urm:hover{background:var(--mag-wash);color:var(--mag)}

/* ============ チャットのMarkdown表示 / 編集ボタン / Web無効（m4-2） ============ */
.msg.ai h2,.report.md h2{font-size:18px;font-weight:800;letter-spacing:-.01em;margin:.7em 0 .3em}
.msg.ai h3,.report.md h3{font-size:16px;font-weight:800;margin:.7em 0 .3em}
.msg.ai h4,.report.md h4{font-size:15px;font-weight:700;margin:.55em 0 .25em}
.msg.ai p,.report.md p{margin:.5em 0;line-height:1.75}
.msg.ai ul,.msg.ai ol,.report.md ul,.report.md ol{margin:.5em 0;padding-left:1.5em}
.msg.ai li,.report.md li{margin:.25em 0;line-height:1.7}
.msg.ai code,.report.md code{font-family:var(--mono);font-size:.88em;background:var(--mag-tint);color:var(--mag-700);padding:1px 5px;border-radius:5px}
.msg.ai pre,.report.md pre{background:var(--ink);color:#f4f0f7;border-radius:10px;padding:12px 14px;overflow:auto;margin:.6em 0}
.msg.ai pre code,.report.md pre code{background:0;color:inherit;padding:0;font-size:13.5px;line-height:1.6}
.msg.ai hr,.report.md hr{border:0;border-top:1px solid var(--line);margin:1.1em 0}
.msg.ai a,.report.md a{color:var(--mag-700);text-decoration:underline}
.msg.ai strong,.report.md strong{font-weight:700;color:var(--ink)}
/* 表：AIの返答に出てくる Markdown の表。横に長い表は枠の中でスクロールさせ、
   ページ全体が横に伸びないようにする。 */
.md-tablewrap{overflow-x:auto;margin:.7em 0;border:1px solid var(--line);border-radius:var(--radius-sm)}
.md-tablewrap table{border-collapse:collapse;width:100%;font-size:14px;line-height:1.6}
.md-tablewrap th,.md-tablewrap td{padding:9px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.md-tablewrap thead th{background:var(--bg-soft);font-weight:700;color:var(--ink);white-space:nowrap}
.md-tablewrap tbody tr:last-child td{border-bottom:0}
.md-tablewrap td.nw{white-space:nowrap} /* 短いセルは折らない（「2 実績」が2行に割れるのを防ぐ） */
/* 幅の狭い置き場（右の小さなトーク欄など）で表が枠より広くなる時：列を潰して右の列を読めなくせず、
   各列に最小の幅を持たせて枠の中を横にスクロールさせる。スクロールできると分かるよう、バーは常に見せる。 */
.md-tablewrap th,.md-tablewrap td{min-inline-size:7em}
.md-tablewrap td.nw{min-inline-size:0}
.md-tablewrap thead th{white-space:normal}
.md-tablewrap::-webkit-scrollbar{block-size:8px}
.md-tablewrap::-webkit-scrollbar-track{background:var(--bg-soft)}
.md-tablewrap::-webkit-scrollbar-thumb{background:var(--mag);border-radius:4px}
.md-tablewrap tbody tr:hover{background:var(--mag-tint)}
/* 長いコードの折りたたみ。開くまでは1行にして、会話が埋まらないようにする。 */
.md-fold{margin:.6em 0}
.md-fold summary{cursor:pointer;font-size:14px;font-weight:700;color:var(--muted);padding:7px 10px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg-soft);list-style:none}
.md-fold summary::-webkit-details-marker{display:none}
.md-fold summary::before{content:"▶ ";font-size:11px}
.md-fold[open] summary::before{content:"▼ "}
.md-fold summary:hover{color:var(--ink);border-color:var(--line-strong)}
.md-fold[open] summary{margin-bottom:6px}
/* 結果（得られる結果）本文の可読性（K）：レンダリング済みMarkdownは pre-wrap を解除し、
   行間・字間・行長を読みやすく。先頭/末尾の余白を詰める。 */
.msg.ai.md,#v-agent .bc-msgs .msg.ai.md{white-space:normal}
.report.md,.msg.ai.md{font-size:15.5px;line-height:1.85;letter-spacing:.005em;color:var(--ink)}
.report.md{padding:18px 22px}
.report.md p,.msg.ai.md p{margin:.6em 0}
.report.md li,.msg.ai.md li{margin:.3em 0;line-height:1.8}
#v-agent .bc-msgs .msg.ai.md{max-width:74ch}
.report.md > :first-child,.msg.ai.md > :first-child{margin-top:0}
.report.md > :last-child,.msg.ai.md > :last-child{margin-bottom:0}
.msg.ai > :first-child,.report.md > :first-child{margin-top:0}
.msg.ai > :last-child,.report.md > :last-child{margin-bottom:0}

/* 実行ドロワー：タイトル行＋編集ボタン */
.dw-titlerow{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:0 12px}
/* 題名の右のボタン群：狭い時は1つの塊として題名の下へ折り返す（題名を1文字ずつ縦に潰さない） */
.dw-acts{flex:none;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.dw-editbtn{flex:none;display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line-strong);background:#fff;color:var(--mag-700);font-size:13px;font-weight:700;border-radius:8px;padding:6px 11px;cursor:pointer;white-space:nowrap}
.dw-modelname{flex:none;display:inline-flex;align-items:center;border:1px solid var(--line-strong);background:#fff;color:var(--mag-700);font-size:13px;font-weight:700;border-radius:8px;padding:6px 11px;white-space:nowrap;cursor:default}
.dw-editbtn:hover{border-color:var(--mag);background:var(--mag-tint)}
.dw-editbtn.danger{color:var(--danger)}
/* アーカイブ（左メニューのフォルダーで開く一覧） */
.nvtw-blank{width:22px;flex:none}
/* 行をサブグリッドにして、アイコン・名前・メタ・「戻す」・「削除」の列を全行でそろえる */
.arclist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;gap:8px}
.arclist li{display:grid;grid-column:1/-1;grid-template-columns:subgrid;align-items:center;column-gap:10px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:#fff}
.arclist li b{font-size:14px}
.arclist li .meta{font-size:12px;color:var(--muted)}
.arclist li .dw-editbtn{justify-self:stretch;justify-content:center}
.dw-editbtn.danger:hover{border-color:var(--danger);background:var(--danger-wash)}
/* タスクビルダーの kicker 行：ラベルを左、「AIと対話」ボタンを右端に */
.dw-kicker.dwk-row{display:flex;align-items:center}
.dwk-row .dw-editbtn{margin-left:auto;letter-spacing:normal;text-transform:none}

/* Webリサーチが環境で無効なときのコンポーザボタン */
#bcWeb.cap-off{opacity:.4}
.navlabel .cnt{font-family:var(--mono);font-size:11px;color:var(--mag-700);background:var(--mag-tint);border-radius:999px;padding:1px 7px;margin-left:4px}

/* 管理者AIの名前チップ（顔＝ミナト等）。管理者AIラベルの近くに小さく名前を出す。 */
.agent-tag{display:inline-flex;align-items:center;gap:5px;margin-left:8px;padding:3px 9px;border-radius:999px;background:var(--mag-tint);color:var(--mag-700);font-size:13px;font-weight:700;letter-spacing:.01em;vertical-align:middle}
.agent-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--mag)}

/* 会話下の小アクション（ナレッジ保存・ツール化）：未スタイルだった .run.sm を意図あるデザインに。 */
.msg.ai .run.sm{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-strong);background:var(--bg);color:var(--ink);border-radius:9px;padding:7px 12px;font-size:14px;font-weight:600;cursor:pointer;transition:.15s;line-height:1}
.msg.ai .run.sm svg{color:var(--mag)}
.msg.ai .run.sm:hover{border-color:var(--mag);color:var(--mag-700);background:var(--mag-tint)}
/* 「これをツール化」＝原点の主アクション。リード文＋ボタンを1枚にまとめて目立たせる。 */
.msg.ai.toolize{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;padding:10px 12px;margin-top:6px;border:1px dashed var(--mag);border-radius:12px;background:var(--mag-tint)}
.msg.ai.toolize .toolize-lead{font-size:13.5px;color:var(--mag-700);font-weight:700}
.msg.ai.toolize .run.sm{background:#fff}
.msg.ai.toolize .run.sm:first-of-type{border-color:var(--mag);color:var(--mag-700)}

/* 権限不足で停止（NEEDS_PERMISSION）＝完了でもエラーでもない第3の状態。アンバーで誘導 */
.permcard{border:1px solid #F0C36B;background:#FFF8EC;border-radius:12px;padding:14px 16px;margin:2px 0;white-space:normal}
.permcard .permhd{display:flex;align-items:center;gap:8px;color:#9A6A04;font-size:15px}
.permcard .permhd svg{color:#C9890A}
.permcard .permneed{margin:8px 0 2px;font-weight:600;color:var(--ink);font-size:14.5px}
.permcard .permreason{margin:2px 0;color:var(--muted);font-size:14px}
.permcard .permhint{margin:6px 0 10px;color:var(--faint);font-size:13px}
.permcard .permacts{display:flex;flex-wrap:wrap;gap:8px}
.permbtn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line-strong);background:var(--bg);color:var(--ink);
  border-radius:8px;padding:7px 12px;font-family:inherit;font-size:13.5px;cursor:pointer;transition:.15s}
.permbtn:hover{border-color:var(--mag);color:var(--mag-700)}
.permbtn.prim{background:var(--mag);border-color:var(--mag);color:#fff}
.permbtn.prim:hover{background:var(--mag-600);color:#fff}

/* AI権限タブ：適用範囲セレクト（接続行の右側に並べる） */
.permrole{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.permrole select{font-family:inherit;font-size:13px;color:var(--ink);border:1px solid var(--line-strong);border-radius:7px;padding:4px 8px;background:var(--bg);cursor:pointer}
.permrole select:disabled{opacity:.45;cursor:not-allowed}
.agt-danger{font-family:var(--mono);font-size:10px;letter-spacing:.04em;color:#9A2A2A;background:#FCEDED;border:1px solid #E9C3C3;border-radius:999px;padding:1px 6px;vertical-align:middle;margin-left:4px}

/* 手順・タスクのメタバッジ（I=入力あり / J=○○を使用） */
.mbadges{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
.mbadge{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;border-radius:999px;padding:2px 8px;line-height:1.4;white-space:nowrap}
.mbadge svg{opacity:.85}
.mbadge.in{color:#9A6A04;background:#FFF7E8;border:1px solid #F0DCA8}
.mbadge.tool{color:var(--mag-700);background:var(--mag-tint);border:1px solid var(--mag-wash)}
.step .mbadges{margin:4px 0 0}

/* 接続を追加：サービス選択（プリセットカード） */
.cm-lead{margin:2px 0 12px;font-size:14.5px;color:var(--muted)}
/* 列数は置き場所の幅で決める（狭いカードで「Googleカレン／ダー」のように名前が割れないように） */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.svc-card{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;padding:13px 13px 12px;border:1px solid var(--line-strong);border-radius:12px;background:var(--bg);cursor:pointer;transition:.15s;min-height:96px}
.svc-card:hover{border-color:var(--mag);box-shadow:0 6px 18px -10px var(--mag);transform:translateY(-1px)}
.svc-card .svc-ic{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;background:var(--mag-tint);color:var(--mag-700);margin-bottom:4px}
.svc-card b{font-size:14.5px;color:var(--ink);word-break:keep-all;overflow-wrap:anywhere}
.svc-card small{font-size:12px;color:var(--faint);line-height:1.35;word-break:keep-all;overflow-wrap:anywhere}
.svc-card .svc-tag{margin-top:auto;font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:var(--mag-700);background:var(--mag-tint);border-radius:999px;padding:2px 7px}
.ai-badge{display:inline-flex;align-items:center;gap:3px;vertical-align:middle;margin-left:6px;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.03em;color:var(--mag-700);background:var(--mag-tint);border-radius:999px;padding:1px 7px 1px 5px}
.ai-badge svg{width:11px;height:11px}
/* AI対話 composer の文脈チップ（起点タスク/ワーク・Notion AI風） */
.bc-ctx{padding:8px 10px 0}
.bc-ctx .ctx-pill{display:inline-flex;align-items:center;gap:5px;max-width:100%;font-size:13px;color:var(--mag-700);background:var(--mag-tint);border-radius:999px;padding:3px 6px 3px 10px}
.bc-ctx .ctx-pill svg{flex:none}
.bc-ctx .ctx-nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bc-ctx .ctx-x{display:inline-flex;align-items:center;border:0;background:transparent;cursor:pointer;color:inherit;padding:2px;border-radius:999px;opacity:.65}
.bc-ctx .ctx-x:hover{opacity:1;background:rgba(0,0,0,.08)}
.svc-head{display:flex;align-items:center;gap:11px;margin:2px 0 12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.svc-head .svc-ic.big{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:11px;background:var(--mag-tint);color:var(--mag-700);flex:none}
.svc-head b{font-size:16px;color:var(--ink);display:block}
.svc-head small{font-size:13px;color:var(--muted)}
.cm-back{background:0;border:0;color:var(--muted);font-family:inherit;font-size:13px;cursor:pointer;padding:2px 0 10px;align-self:flex-start}
.cm-back:hover{color:var(--mag-700)}

/* 承認ゲート：エディタのトグル／承認待ちバナー／決裁後の状態 */
.apvtoggle{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;color:var(--muted);cursor:pointer}
.apvtoggle input{width:15px;height:15px;accent-color:var(--mag);cursor:pointer}
.apvbanner{border:1px solid #BFE3C8;background:#F2FBF4;border-radius:12px;padding:11px 13px;margin:2px 0;white-space:normal}
.apvbanner .apvhd{display:flex;align-items:center;gap:8px;color:#1E7A41;font-size:15px;flex-wrap:wrap}
.apvbanner .apvhd svg{color:#2E9E57}
.apvbanner .apvhd span{color:var(--muted);font-size:13px;font-weight:400}
.apvbanner .apvacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
/* 実行結果の直下に常設する「直す場」＋「直した記録」＋確定（承認の3択の置き換え）。
   .msg.ai の pre-wrap を受けないよう各箱は white-space:normal。幅は親に任せ、高さは中身で伸びる。 */
.fixbox{display:flex;flex-direction:column;gap:10px;border:1px solid var(--mag);background:var(--mag-tint);border-radius:12px;padding-block:13px;padding-inline:14px;margin-block:2px;white-space:normal}
.fixlab{font-family:inherit;font-size:13px;font-weight:700;line-height:1.5;letter-spacing:0;color:var(--mag-700)}
.fixfield{inline-size:100%;min-block-size:58px;resize:vertical;padding-block:9px;padding-inline:12px;border:1px solid var(--line-strong);border-radius:9px;background:#fff;font-family:inherit;font-size:13.5px;font-weight:400;line-height:1.5;letter-spacing:0;color:var(--ink)}
.fixfield:focus{outline:none;border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-wash)}
.fixfield::placeholder{color:var(--faint)}
.fixrow{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.fixchips{display:flex;flex-wrap:wrap;gap:6px;min-inline-size:0}
.fixchip{border:1px solid var(--line-strong);background:#fff;border-radius:999px;padding-block:3px;padding-inline:11px;font-family:inherit;font-size:12px;font-weight:400;line-height:1.5;letter-spacing:0;color:var(--muted);cursor:pointer}
.fixchip:hover{border-color:var(--mag);color:var(--mag-700)}
.fixhist{border:1px solid var(--line);border-radius:11px;overflow:hidden;margin-block:2px;white-space:normal}
.fixhist-h{background:var(--bg-soft);border-block-end:1px solid var(--line);padding-block:8px;padding-inline:13px;font-family:inherit;font-size:12.5px;font-weight:700;line-height:1.5;letter-spacing:0;color:var(--muted)}
.fixhist-i{display:flex;gap:11px;padding-block:10px;padding-inline:13px;border-block-end:1px solid var(--line)}
.fixhist-i:last-child{border-block-end:0}
.fixhist-n{flex:none;align-self:flex-start;border:1px solid var(--line);border-radius:5px;padding-inline:6px;font-family:var(--mono);font-size:11px;font-weight:400;line-height:19px;letter-spacing:0;color:var(--faint);margin-block-start:2px}
.fixhist-t{display:flex;flex-direction:column;gap:2px;min-inline-size:0;font-size:12.5px;font-weight:400;line-height:1.5;letter-spacing:0;color:var(--ink)}
.fixhist-t b{font-weight:700}
.fixhist-t span{font-size:11.5px;color:var(--faint)}
.fixok{border:1px solid #BFE3C8;background:#F2FBF4;border-radius:12px;padding-block:11px;padding-inline:13px;margin-block:2px;white-space:normal}
.fixok-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:#1E7A41;font-family:inherit;font-size:15px;font-weight:700;line-height:1.5;letter-spacing:0}
.fixok-h span{color:var(--muted);font-size:13px;font-weight:400}
.fillmiss{display:flex;gap:9px;align-items:flex-start;border:1px solid #F3B5C3;background:#FDEDF1;color:#7A0E26;border-radius:12px;padding-block:12px;padding-inline:13px;white-space:normal;font-size:13px;line-height:1.6}
.fillmiss>svg{flex:none;margin-block-start:3px;color:#A31232}
.fillmiss>div{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.fillmiss b{font-size:13.5px;color:#A31232}
.fillmiss ul{margin:0;padding-inline-start:18px;overflow-wrap:anywhere}
.fixok-acts{display:flex;flex-wrap:wrap;gap:8px;margin-block:2px;white-space:normal}
.fixok-note{margin:4px 0 0;font-size:12px;color:var(--faint);line-height:1.6;white-space:normal}
.permbtn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
.permbtn.ok:hover{background:#0E8A5B;border-color:#0E8A5B;color:#fff}
.permbtn.dim{color:var(--faint)}
.apvdone{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;border-radius:8px;padding:5px 10px}
.apvdone.ok{color:#1E7A41;background:#F2FBF4;border:1px solid #BFE3C8}
.apvdone.reject{color:#9A2A2A;background:#FCF2F2;border:1px solid #E9C3C3}

/* 実行パイプライン（ops＝道具先・文章後）：タスクエディタの表示 */
.taskops{display:flex;flex-direction:column;gap:6px}
.opline{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:10px;padding:7px 10px;background:#fff}
.opline .opn{flex:none;width:20px;height:20px;border-radius:6px;background:var(--soft,#f4f4f5);color:var(--muted);font-size:12px;font-weight:700;display:grid;place-items:center}
.opline .opb{flex:1;display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.op-tool{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:700;color:var(--mag);background:#FCF1F8;border:1px solid #F0CFE6;border-radius:7px;padding:2px 7px}
.op-tool svg{color:var(--mag)}
.op-ttl{font-size:13.5px;color:var(--ink,#222)}
.op-native{font-size:13.5px;color:var(--muted)}
.opline .srm{flex:none;color:var(--faint);background:none;border:none;cursor:pointer;padding:2px;border-radius:6px}
.opline .srm:hover{color:#9A2A2A;background:#FCF2F2}
/* 固定設定(config＝初期設定)：ラベル＋値の行 */
.taskcfg{display:flex;flex-direction:column;gap:6px}
.cfgrow{display:flex;align-items:center;gap:8px}
.cfgrow .cfglabel{flex:0 0 38%;min-width:0;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:13.5px;font-family:inherit;outline:0;background:#fff;color:var(--ink)}
.cfgrow .cfgvalue{flex:1;min-width:0}
.cfgrow .cfglabel:focus{border-color:var(--mag);box-shadow:0 0 0 3px var(--mag-wash)}
.cfgrow .srm{flex:none;color:var(--faint);background:none;border:none;cursor:pointer;padding:3px;border-radius:6px}
.cfgrow .srm:hover{color:#9A2A2A;background:#FCF2F2}

/* 右トーク（dock）のコンポーザも v-agent と同じリッチピル（添付・Web・モデル・音声・送信） */
.chatpane .bc-input{display:flex;flex-direction:column;gap:8px;margin:12px;padding:10px 12px;background:#fff;border:1px solid var(--line-strong);border-radius:22px;box-shadow:0 2px 14px rgba(26,22,32,.06);transition:.18s}
.chatpane .bc-input:focus-within{border-color:var(--mag);box-shadow:0 0 0 4px var(--mag-wash),0 2px 14px rgba(26,22,32,.06)}
.chatpane .bc-input .bc-ta{flex:none;width:100%;border:0;background:0;outline:0;box-shadow:none;padding:4px 6px;font-size:15px;font-family:inherit;color:var(--ink);resize:none;line-height:1.5;min-height:24px;max-height:160px;overflow-y:auto}
.chatpane .bc-input .bc-ta::placeholder{color:var(--faint)}
.chatpane .bc-tools{display:flex;align-items:center;justify-content:space-between;gap:8px}
.chatpane .bc-left,.chatpane .bc-right{display:flex;align-items:center;gap:4px}
.chatpane .bc-rd{width:32px;height:32px;flex:none;border-radius:50%;border:0;background:0;color:var(--muted);display:grid;place-items:center;cursor:pointer;transition:.13s}
.chatpane .bc-rd:not(:disabled):hover{color:var(--mag);background:var(--mag-tint)}
.chatpane .bc-rd.on{color:var(--mag);background:var(--mag-wash)}
.chatpane .bc-rd:disabled{opacity:.38;cursor:default}
.chatpane .bc-rd.bc-mdl{flex:0 1 auto;min-width:0;width:auto;max-width:200px;height:32px;border-radius:16px;padding-inline:9px;display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:600;font-family:inherit}
.chatpane .bc-rd.rec{color:#fff;background:var(--mag);animation:pulse 1.1s infinite}
.chatpane .bc-input .send{width:38px;height:38px;flex:none;border:0;border-radius:50%;background:var(--line-strong);color:#fff;display:grid;place-items:center;cursor:default;transition:.15s}
.chatpane .bc-input.has-text .send{background:var(--mag);cursor:pointer}
.chatpane .bc-input.has-text .send:hover{background:var(--mag-700)}
.chatpane .bc-attach{display:flex;flex-wrap:wrap;gap:6px;padding:2px 4px 6px}
/* タスク制作の聞き返し＝選択肢ボタン（押すとその文が次の発言になる） */
.chat-choices{display:flex;flex-wrap:wrap;gap:8px}
.chat-choice{max-inline-size:100%;padding-block:8px;padding-inline:14px;border:1px solid var(--mag);border-radius:999px;background:#fff;font-family:var(--sans);font-size:14px;font-weight:700;line-height:1.45;letter-spacing:normal;color:var(--mag-700);text-align:left;transition:.13s}
.chat-choice:disabled{opacity:.5;cursor:default}
@media (any-hover: hover){ .chat-choice:not(:disabled):hover{background:var(--mag-tint)} }

/* ── A3: execute プラン（顧客サービス版＝実行専用）の出し分け ──
   「作る側」UI を CSS で隠す（DOM は残す＝フラグ1つで復活可）。サーバ側の正は requireFullPlan（A2）。 */
body.plan-execute:not(.exec-author) .card.add,                         /* 新規タスク/WS作成カード（既定は隠す・exec-author=制作許可つき owner には出す） */
body.plan-execute:not(.exec-author) [data-new],
body.plan-execute:not(.exec-author) .newcat,
body.plan-execute:not(.exec-author) [data-newcat],                     /* 新規カテゴリ（同上・追加は乗せない） */
body.plan-execute .set-tab[data-stab="conn"],        /* 設定: 接続 */
body.plan-execute .set-tab[data-stab="agent"],       /* 設定: AI権限 */
body.plan-execute .set-tab[data-stab="skill"],       /* 設定: スキル */
body.plan-execute [data-go="v-knowledge"],           /* ナレッジ（ナビ・小行含む） */
body.plan-execute [data-go="v-org"],                 /* 組織ナレッジ */
body.plan-execute [data-go="v-feedback"],            /* 月次フィードバック */
body.plan-execute #devResetBtn,                      /* 初期化（デバッグ用）＝運営者専用・顧客に出さない（機能は admin へ移設） */
body.plan-execute #wfTest                            /* タスク/WSドロワーのテストラン＝運営者専用 */
{ display: none !important; }

[data-plan-hide="execute"][hidden] { display: none; } /* 管理者AI入口・システムAIのフローティングボタン */

/* ── 通知欄（OS画面・topbar 直下）：AI利用上限の接近/到達など ── */
.noticebar{ padding:8px 22px 0; display:flex; flex-direction:column; gap:6px; }
.noticebar .notice{ display:flex; align-items:center; gap:8px; padding:8px 12px; border-radius:10px; font-size:13.5px; border:1px solid; }
.noticebar .notice svg{ flex:none; }
.noticebar .notice-warn{ background:#FFF8E8; border-color:#F0DFAE; color:#8A6A12; }
.noticebar .notice-err{ background:#FDEDF1; border-color:#F2C4CE; color:#A31232; }
.pill.err{background:#FDEDF1;color:#A31232}

/* 通知欄の操作ボタン（例：接続の「認可する」） */
.noticebar .nbtn{ margin-left:auto; flex:none; padding:5px 12px; border-radius:8px; background:#fff; border:1px solid currentColor; color:inherit; font-size:13px; text-decoration:none; font-weight:600; }
/* 通知の×（閉じる）。ボタンがある通知では、ボタンの右に並べる */
.noticebar .nclose{ flex:none; margin-left:auto; width:26px; height:26px; border:0; border-radius:7px; background:transparent; color:inherit; font-size:18px; line-height:1; cursor:pointer; opacity:.7; }
.noticebar .nclose:hover{ opacity:1; background:rgba(0,0,0,.06); }
.noticebar .nbtn + .nclose{ margin-left:4px; }

/* ナレッジ関連は今回のサービスには載せない（大髙FB 2026-07-11）＝プラン問わず非表示。
   復活させる時はこのブロックを削除するだけ（機能・データは残っている）。
   サイドバーは枝ごと消す（子の「タスクナレッジ/業務フローナレッジ」(kn:*) が残る取りこぼし対策・同FB第5弾）。 */
[data-go="v-knowledge"], [data-go="v-org"],
[data-cat="kn:task"], [data-cat="kn:set"],
.nvbranch:has(> .nvrow.lv0[data-go="v-knowledge"]) { display: none !important; }

/* 実行責任者も今回のサービスには載せない（大髙FB 2026-07-11 第6弾）＝プラン問わず非表示。
   カードの表示＋タスク編集の選択行を隠す（DB列・APIは残す）。復活＝このブロック削除＋app.js OWNER_UI=true。 */
.card .foot .owner, #taskOwnerProp { display: none !important; }

/* 使い方（操作マニュアル）。.report 既定の見出しは小さいモノスペース＝短い総評向けで、
   長く読む文書では日本語が等幅にならず読みにくい。読む文書用の見出しに戻す。 */
/* トンマナ（2026-10-05 本人依頼）：一番外の枠・見出しを orca のピンクにし、見出しと本文の差をはっきりさせる。
   本文は黒のまま。大見出し＝ピンクの帯／中見出し＝左の太線＋淡いピンク地／小見出し＝ピンク文字＋下線。 */
.report.manual{padding:0 30px 26px;border:2px solid var(--mag);overflow:hidden}
.report.manual h2{font-size:22px;font-weight:800;color:#fff;background:var(--mag);margin:0 -30px .9em;padding:16px 30px}
.report.manual h3{font-family:var(--sans);font-size:17px;font-weight:800;text-transform:none;letter-spacing:normal;color:var(--mag-700);background:var(--mag-wash);border-left:6px solid var(--mag);border-radius:0 10px 10px 0;margin:1.7em 0 .6em;padding:8px 14px}
.report.manual h4{font-size:15px;font-weight:800;color:var(--mag-600);margin:1.3em 0 .5em;padding-bottom:4px;border-bottom:2px solid var(--mag-wash)}
.report.manual hr{border:0;border-top:2px dashed var(--mag-wash);margin:1.6em 0}
.report.manual .md-tablewrap{border-color:var(--mag-wash)}
.report.manual .md-tablewrap thead th{background:var(--mag-wash);color:var(--mag-700);border-bottom:2px solid var(--mag)}

/* 作られたファイルの受け取り口。実行ごとのフォルダに残った成果物を並べる。 */
.runfiles{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.runfiles>b{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);margin-right:2px}
.runfiles .run.sm{gap:8px}
.runfiles .run.sm small{color:var(--faint);font-size:12px}
.runfiles .runfile{display:inline-flex;align-items:center;gap:4px}
.runfiles .run.sm.ghost{background:transparent}
/* 成果物のプレビュー：画面の右側に重ねて開く（会話・ワークフローの右パネルより手前） */
.file-preview{position:fixed;top:12px;bottom:12px;right:calc(var(--fp-right,0px) + 12px);z-index:49;inline-size:min(var(--fp-w,min(640px,46vw)),calc(100vw - var(--fp-right,0px) - 24px));display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 18px 50px -18px rgba(26,22,32,.35)}
.fp-head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-block-end:1px solid var(--line)}
.fp-head .run.sm{display:inline-flex;align-items:center;border:1px solid var(--line-strong);background:var(--bg);color:var(--ink);border-radius:9px;padding:7px 14px;font-size:14px;font-weight:600;cursor:pointer;line-height:1}
.fp-head .run.sm:hover{border-color:var(--mag);color:var(--mag-700);background:var(--mag-tint)}
.fp-head>b{flex:1;min-inline-size:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.fp-body{flex:1;min-block-size:0;display:grid;grid-template:minmax(0,1fr)/minmax(0,1fr);place-items:safe center;overflow:auto;background:var(--bg-soft,var(--bg))}
.fp-fix{padding:10px 14px;border-block-start:1px solid var(--line);display:flex;flex-direction:column;gap:8px;background:var(--bg)}
.fp-fix-note{font-size:13px;color:var(--muted)}
.fp-fix-row{display:flex;gap:10px;align-items:flex-end}
.fp-fix-row textarea{flex:1;min-inline-size:0;resize:vertical;border:1px solid var(--line-strong);border-radius:9px;padding:8px 10px;font:inherit;font-size:14px;background:var(--bg);color:var(--ink)}
.fp-fix-row textarea:focus{outline:2px solid var(--mag);outline-offset:1px}
.fp-fix[hidden],.fp-fix-note[hidden]{display:none}
.fp-head .dw-ic[data-fp-wide]{display:inline-grid}
@media (max-width:880px){.fp-head .dw-ic[data-fp-wide]{display:none}}
.fp-head>b small{margin-inline-start:8px;font-size:12px;font-weight:600;color:var(--faint)}
/* プレビューは本体の上に重ねるだけ（本体の幅・配置は変えない）。会話の右ドックが開いていれば、その左隣に並ぶ。
   以前は、プレビューの分だけ本体の右に余白を足して本体を左へ詰めていたが、右ドックも開くと余白が画面幅を超え、本体が数pxまで潰れて崩れた。 */
/* 右ドックの左隣が狭すぎる時（app.js の placeFilePreview が body に fp-over を付ける）は、ドックの上に重ねる。
   プレビュー（z-index:49）を上げるのではなく、ドックを一段下げる（48）＝プレビューはドックより手前・モーダル（.overlay・50）や制作ドロワーより奥のまま。 */
body.fp-over .rightdock{z-index:48}
body.fp-over .file-preview{top:0;bottom:0;right:0;inline-size:100vw;border-radius:0;border:0}
@media (max-width:880px){.file-preview{inline-size:100vw;top:0;bottom:0;right:0;border-radius:0;border:0;z-index:90}}
.fp-note{margin:0;padding:24px;color:var(--muted);font-size:14px;text-align:center}
.fp-body audio{inline-size:min(90%,420px)}
.fp-body iframe{inline-size:100%;block-size:100%;border:0}
.fp-body img{max-inline-size:100%;max-block-size:100%;object-fit:contain}
.fp-body video{inline-size:100%;block-size:auto;max-block-size:100%;object-fit:contain;background:#000}

/* ロールとカテゴリの権限（Discord に合わせた画面・2026-09-22） */
.acc-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.acc-head b{font-size:15px}
.acc-head .cright{margin-left:auto;display:flex;gap:6px}
.acc-picks{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.acc-pick{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border:1px solid var(--line-strong);border-radius:999px;font-size:13.5px;cursor:pointer;background:#fff;transition:.13s}
.acc-pick:hover{border-color:var(--mag)}
.acc-pick:has(input:checked){border-color:var(--mag);background:var(--mag-tint);font-weight:600}
.acc-pick input{accent-color:var(--mag);cursor:pointer}
.acc-kind{align-self:center;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.04em;margin-right:2px}
.acc-kind:not(:first-child){margin-left:10px}
.acc-toggle{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer}
.acc-toggle input{accent-color:var(--mag);cursor:pointer}

/* タスクの要約（web/task-summary.js）：提案カード・タスク詳細で共通の4欄。
   .msg.ai の ul/ol/h4/p の既定より強く当てるため、要素名つきで指定する。
   見出しは dw-sec の見出しと同じ調子、手順の番号は .step .sn と同じ丸。狭い幅でも横にはみ出さない。 */
.tsum{display:flex;flex-direction:column;gap:14px;white-space:normal;min-width:0}
.tsum-sec{min-width:0}
.tsum h4.tsum-h{font-family:var(--mono);font-size:12px;letter-spacing:.1em;font-weight:700;color:var(--mag);margin:0 0 8px}
.tsum ul.tsum-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.tsum ul.tsum-list li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0;line-height:1.6;min-width:0}
.tsum-k{font-weight:700;color:var(--ink);overflow-wrap:anywhere}
.tsum-v{color:var(--muted);overflow-wrap:anywhere;min-width:0}
.tsum-req{flex:none;font-size:11.5px;font-weight:700;color:var(--mag-700);background:var(--mag-tint);border:1px solid #F0CFE6;border-radius:6px;padding:0 6px;line-height:1.7}
.tsum-unset{font-size:12.5px;color:var(--faint)}
.tsum ol.tsum-steps{list-style:none;margin:0;padding:12px 14px;display:flex;flex-direction:column;gap:9px;background:var(--bg-soft);border:1px solid var(--line);border-radius:12px}
.tsum ol.tsum-steps li{display:flex;align-items:flex-start;gap:10px;margin:0;line-height:1.6;min-width:0}
.tsum-n{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--mag-wash);color:var(--mag-600);font-family:var(--mono);font-size:12px;font-weight:700}
.tsum-t{flex:1;min-width:0;padding-top:1px;overflow-wrap:anywhere}
.tsum p.tsum-out{margin:0;line-height:1.7;overflow-wrap:anywhere}
.msg.ai.tsum-card,#v-agent .bc-msgs .msg.ai.tsum-card{white-space:normal;display:flex;flex-direction:column;gap:14px;min-width:0;max-width:100%}
.tsum-lead{display:flex;flex-direction:column;gap:2px;min-width:0}
.tsum-lead-k{font-size:12px;color:var(--faint)}
.tsum-title{font-size:16px;font-weight:800;color:var(--ink);overflow-wrap:anywhere}
.tsum-card p.tsum-foot{margin:0;font-size:13.5px;color:var(--muted);line-height:1.7}
.tsum-drawer .tsum{gap:22px}
.opline .op-tool span{overflow-wrap:anywhere}

/* ロール・カテゴリの権限（Discord に合わせる・2026-09-28） */
.nv-gear{flex:none;display:flex;margin-left:4px;opacity:0;border:0;background:0;color:var(--muted);cursor:pointer;padding:3px;border-radius:6px;transition:.13s}
.nvrow:hover .nv-gear,.nv-gear:focus-visible{opacity:.7}
.nv-gear:hover{opacity:1;color:var(--ink);background:var(--bg)}
.nvrow .badge + .nv-gear{margin-left:4px}
.nvrow .nvlbl + .nv-gear{margin-left:auto}
.role-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.role-chip{font-size:11.5px;font-weight:700;color:var(--mag-700);background:var(--mag-wash);border-radius:999px;padding:2px 9px}
.acc-dialog{width:min(520px,100%)}
.acc-dialog .acc-picks{margin-top:2px}
.acc-toggle-row{margin-left:0;font-size:14.5px}
.acc-dialog [hidden]{display:none}
.fm-danger{margin-right:auto;border:0;background:0;color:var(--danger);font-weight:700;font-size:13.5px;padding:9px 4px;cursor:pointer}
.fm-danger:hover{color:var(--danger-700);text-decoration:underline}
/* ホバーできない端末（タッチ）では歯車を常に見せる */
@media (any-hover: none){
  .nv-gear,.cat-gear{opacity:.7}
}
/* 実行エンジン欄の Codex（版・APIキー・モデル一覧の状態） */
.engine-state{font-family:var(--sans);font-size:13.5px;font-weight:600;line-height:1.6;letter-spacing:normal;color:var(--faint)}
.engine-state[data-state="ok"]{color:var(--ok)}
.engine-state[data-state="warn"]{color:#A31232}
.codex-detail{display:flex;flex-direction:column;gap:6px;padding-inline-start:14px;border-inline-start:2px solid var(--line)}
.codex-detail .engine-row>span:first-child{flex:none;white-space:nowrap}
.codex-detail .engine-row>span:last-child{flex:1 1 0;min-inline-size:0;overflow-wrap:anywhere;text-align:end}
/* 会話のモデル選択：Codex の見出し */
.mdl-group{padding-block:8px 2px;padding-inline:10px;border-top:1px solid var(--line);margin-block-start:4px;font-family:var(--sans);font-size:11.5px;font-weight:600;line-height:1.5;letter-spacing:normal;color:var(--muted)}
.mdl-item .mdl-t{overflow-wrap:anywhere}
/* 役割ごとの既定モデル：狭い幅では、役割名の下に選択欄を回す（名前が1文字ずつに折れない） */
.role-model-card .engine-row{flex-wrap:wrap;align-items:center}
.role-model-card .engine-row>span:first-child{flex:1 1 10em;min-inline-size:0}
/* 役割ごとの既定モデルの選択欄（設定のエージェント） */
.role-model-field{flex:none;margin-block-end:0;inline-size:min(100%,18em)}