/* ─── DSMテーマトークン ───────────────────────────────────────────────
   ダークが既定(値は旧ハードコード色と同一)。html[data-dsm-theme="light"] で上書き。
   命名: bg=背景 sf=サーフェス rz=浮き/ホバー面 bd=境界 hv=ホバー強調 tx=文字
         mu=ミュート ac=アクセント gn/rd/yl/bl=状態色(gnb等のbはその背景) pn=半透明パネル
         hl=ハイライト ov=オーバーレイ hv-tx=ホバー面上の文字
   ※以降の色追加は必ず var(--…) を使うこと(直書きはライトで破綻する)。
   ─────────────────────────────────────────────────────────────────── */
:root {
  --bd8: #2b3650;
  --pn6: rgba(20,26,40,.82);
  --pn7: rgba(20,26,40,.7);
  --pn8: rgba(20,26,40,.6);
  --pn9: rgba(13,18,30,.82);
  --ac1: #a78bfa;
  --ac4: #6a5af0;
  --ac5: #4a3a6e;
  --ac6: #d9c9ff;
  --bd0: #2a344e;
  --bd1: #303a52;
  --bd2: #2e3350;
  --bd3: #344063;
  --bd4: #3a445f;
  --bd5: #3a3f5e;
  --bd6: #3a4670;
  --bd7: #475069;
  --bg0: #0d121e;
  --bg1: #0f1117;
  --bg2: #0e1320;
  --bg3: #0f1422;
  --bg4: #11182a;
  --bl0: #60a5fa;
  --bl1: #7c9cff;
  --gn0: #22d3a5;
  --gn1: #57e389;
  --gn2: #34d399;
  --gn3: #aee9c5;
  --gnb0: #123d24;
  --gnb1: #173a34;
  --gnb2: #06281f;
  --gnb3: #2f4a3a;
  --hl0: rgba(255,255,255,.02);
  --hl1: rgba(255,255,255,.03);
  --hl2: rgba(255,255,255,.04);
  --hl3: rgba(255,255,255,.05);
  --hl4: rgba(255,255,255,.08);
  --hl5: rgba(255,255,255,.1);
  --hl6: rgba(255,255,255,.12);
  --hl7: rgba(255,255,255,.18);
  --hv-tx: #fff;
  --hv0: #4a5685;
  --hv1: #4a5675;
  --hv2: #34406a;
  --mu0: #8893ad;
  --mu1: #9aa6c2;
  --mu2: #9fb0cd;
  --mu3: #7d8aa6;
  --mu4: #6d7a97;
  --mu5: #6b7280;
  --ov0: rgba(5,8,16,.6);
  --pk0: #d3b8c8;
  --pn0: rgba(20,26,40,.97);
  --pn1: rgba(20,26,40,.95);
  --pn2: rgba(20,26,40,.92);
  --pn3: rgba(27,34,51,.92);
  --pn4: rgba(27,34,51,.7);
  --pn5: rgba(31,39,64,.7);
  --rd0: #f87171;
  --rd1: #f08a8a;
  --rd2: #ff9d9d;
  --rd3: #ff8a8a;
  --rd4: #f3b6bf;
  --rdb0: #8a3a46;
  --rdb1: #6e3540;
  --rdb2: #4d1a1a;
  --rdb3: #4a2730;
  --rdb4: #46232a;
  --rdb5: #2a1820;
  --rdb6: #3a2f3a;
  --rz0: #232c44;
  --rz1: #232c40;
  --rz2: #232d47;
  --rz3: #222b40;
  --rz4: #2a3450;
  --rz5: #2a2f50;
  --rz6: #283354;
  --rz7: #2f3a58;
  --rz8: #2a3b66;
  --sf0: #141a28;
  --sf1: #161d2e;
  --sf3: #1a2236;
  --sf4: #1b2336;
  --sf5: #1b2233;
  --sf6: #182238;
  --sf7: #1f2740;
  --sf8: #1a2440;
  --sf9: #22263a;
  --tx0: #e8ecf4;
  --tx1: #d7deef;
  --tx2: #c7cee0;
  --tx3: #c4caf0;
  --tx4: #c2cbe2;
  --tx5: #cdd5e6;
  --tx6: #d3d9e8;
  --tx7: #aeb8d2;
  --yl0: #fbbf24;
  --yl1: #f5c451;
  --yl2: #ffd24a;
  --yl3: #d3a04a;
  --yl4: #e3c07a;
  --yl5: #f59e0b;
  --ylb0: #5a4a2a;
  --ylb1: #4a3a12;
  --ylb2: #3a2f1a;
}
:root[data-dsm-theme="light"] {
  --bd8: #cfd6e4;
  --pn6: rgba(255,255,255,.9);
  --pn7: rgba(255,255,255,.85);
  --pn8: rgba(255,255,255,.8);
  --pn9: rgba(240,243,250,.9);
  --ac1: #6355e0;
  --ac4: #5a4bd8;
  --ac5: #cfc6f5;
  --ac6: #4a3a9e;
  --bd0: #d3d9e6;
  --bd1: #cdd4e3;
  --bd2: #d0d6e4;
  --bd3: #c3cce0;
  --bd4: #c0c9db;
  --bd5: #c4cadd;
  --bd6: #b8c3dc;
  --bd7: #aab4c9;
  --bg0: #e9edf5;
  --bg1: #eef0f6;
  --bg2: #eaeef6;
  --bg3: #eaeef6;
  --bg4: #e4e9f3;
  --bl0: #2563eb;
  --bl1: #3b5bdb;
  --gn0: #0f9d78;
  --gn1: #148544;
  --gn2: #119a67;
  --gn3: #1c5c36;
  --gnb0: #d7f2df;
  --gnb1: #d5efe8;
  --gnb2: #dff3ec;
  --gnb3: #bfe5cc;
  --hl0: rgba(20,30,60,.02);
  --hl1: rgba(20,30,60,.03);
  --hl2: rgba(20,30,60,.04);
  --hl3: rgba(20,30,60,.05);
  --hl4: rgba(20,30,60,.07);
  --hl5: rgba(20,30,60,.09);
  --hl6: rgba(20,30,60,.11);
  --hl7: rgba(20,30,60,.16);
  --hv-tx: #1c2333;
  --hv0: #a9b6d4;
  --hv1: #a9b4d0;
  --hv2: #d0d8ea;
  --mu0: #66718c;
  --mu1: #5d6983;
  --mu2: #5a678a;
  --mu3: #6e7994;
  --mu4: #7b869e;
  --mu5: #6b7280;
  --ov0: rgba(25,32,54,.45);
  --pk0: #7a4a64;
  --pn0: rgba(255,255,255,.97);
  --pn1: rgba(255,255,255,.95);
  --pn2: rgba(255,255,255,.94);
  --pn3: rgba(255,255,255,.94);
  --pn4: rgba(255,255,255,.8);
  --pn5: rgba(235,239,247,.85);
  --rd0: #d13838;
  --rd1: #c04545;
  --rd2: #b84040;
  --rd3: #c03a3a;
  --rd4: #8f2f3f;
  --rdb0: #d98a94;
  --rdb1: #dc9aa4;
  --rdb2: #f6dada;
  --rdb3: #f4d7dc;
  --rdb4: #f6d9de;
  --rdb5: #f7e3e7;
  --rdb6: #efe2ef;
  --rz0: #e7ebf4;
  --rz1: #e7ebf4;
  --rz2: #e7ebf4;
  --rz3: #e7ebf4;
  --rz4: #dfe5f0;
  --rz5: #e2e6f2;
  --rz6: #dde4f1;
  --rz7: #d9e0ee;
  --rz8: #d3ddf0;
  --sf0: #f7f9fd;
  --sf1: #f4f7fc;
  --sf3: #f2f5fb;
  --sf4: #f2f5fb;
  --sf5: #ffffff;
  --sf6: #ffffff;
  --sf7: #eef2f9;
  --sf8: #eef2f9;
  --sf9: #f0f3fa;
  --tx0: #1c2333;
  --tx1: #26304a;
  --tx2: #3c4763;
  --tx3: #43508a;
  --tx4: #46516d;
  --tx5: #39445f;
  --tx6: #333e58;
  --tx7: #55617f;
  --yl0: #b07d10;
  --yl1: #a1770e;
  --yl2: #9a7500;
  --yl3: #9c6f1e;
  --yl4: #8a6a25;
  --yl5: #b45309;
  --ylb0: #f4e7c8;
  --ylb1: #f6ebcb;
  --ylb2: #f6eedd;
}

/* ── DSM風シェル スタイル ───────────────────────────────────────────────────── */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body, #dsm-app { height: 100%; }
body {
  font-family: 'Hiragino Sans', 'Noto Sans JP', system-ui, sans-serif;
  color: var(--tx0);
  overflow: hidden;
  user-select: none;
}

.dsm-root {
  position: fixed; inset: 0;
  background:
    radial-gradient(1200px 700px at 70% -10%, var(--rz8) 0%, transparent 60%),
    radial-gradient(900px 600px at 10% 110%, var(--gnb1) 0%, transparent 55%),
    linear-gradient(135deg, var(--bg2) 0%, var(--bg4) 100%);
}

/* ── デスクトップアイコン ─────────────────────────────────────────────────── */
.desktop-icons {
  position: absolute; top: 16px; left: 16px; right: 16px; bottom: 56px;
  overflow: hidden;
}
.dicon {
  position: absolute;
  width: 92px; height: 104px; /* 1マス(100x112)内に収める */
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px;
  background: transparent; border: 1px solid transparent; border-radius: 12px;
  color: var(--tx0); cursor: grab; touch-action: none; user-select: none;
}
.dicon-drag { cursor: grabbing; z-index: 5; opacity: .85; background: var(--hl5); border-color: var(--hl7); }
.desktop-reset {
  position: absolute; top: 0; right: 0; z-index: 3;
  font-size: 11px; padding: 5px 10px; border-radius: 8px;
  background: var(--pn5); border: 1px solid var(--bd1); color: var(--tx7); cursor: pointer;
}
.desktop-reset:hover { background: var(--hv2); color: var(--hv-tx); }
.dicon:hover { background: var(--hl4); border-color: var(--hl6); }
.dicon-img { font-size: 38px; line-height: 1; filter: drop-shadow(0 2px 4px rgba(0,0,0,.4)); }
.dicon-label { font-size: 12px; text-shadow: 0 1px 3px rgba(0,0,0,.7); max-width: 88px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dicon-dim { opacity: .55; }
.dicon-badge {
  position: absolute; top: 6px; right: 6px;
  font-size: 9px; background: var(--bd7); color: var(--tx5);
  padding: 1px 5px; border-radius: 6px;
}

/* ── ウィンドウ ───────────────────────────────────────────────────────────── */
.win {
  position: absolute;
  display: flex; flex-direction: column;
  background: var(--sf5);
  border: 1px solid var(--bd1);
  border-radius: 10px;
  box-shadow: 0 18px 50px rgba(0,0,0,.55);
  overflow: hidden;
  min-width: 320px; min-height: 200px;
}
/* 最大化: ブラウザ内全画面（下部タスクバー48pxは残す） */
.win-max {
  left: 0; top: 0; right: 0; bottom: 48px;
  width: auto; height: auto;
  border-radius: 0;
}
.win-title {
  display: flex; align-items: center; gap: 8px;
  height: 38px; padding: 0 8px 0 12px;
  background: linear-gradient(180deg, var(--rz4), var(--rz0));
  border-bottom: 1px solid var(--bd1);
  cursor: move;
}
.win-max .win-title { cursor: default; }
.win-title-ico { font-size: 16px; }
.win-title-txt { font-size: 13px; font-weight: 600; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.win-btn {
  width: 26px; height: 26px; border: none; border-radius: 6px;
  background: transparent; color: var(--tx2); font-size: 16px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.win-min:hover { background: var(--bd4); }
.win-close:hover { background: #c0392b; color: #fff; }
.win-body { flex: 1; overflow: auto; background: var(--sf0); }
.win-resize {
  position: absolute; right: 0; bottom: 0; width: 18px; height: 18px;
  cursor: nwse-resize;
  background: linear-gradient(135deg, transparent 50%, var(--hv1) 50%, var(--hv1) 60%, transparent 60%, transparent 72%, var(--hv1) 72%, var(--hv1) 82%, transparent 82%);
}

/* ── メンバーアプリ ───────────────────────────────────────────────────────── */
.ma-wrap { padding: 14px 16px; }
.ma-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.ma-head { font-size: 13px; color: var(--mu1); }
.ma-table { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: fixed; }
.ma-table th, .ma-table td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--rz1); vertical-align: middle; }
.ma-table th { color: var(--mu0); font-weight: 600; font-size: 12px; }
.ma-table tbody tr:hover { background: var(--hl2); }
/* 長い文字列(base64等)でも崩れないよう各セルではみ出しを抑制（固定列幅） */
.ma-table td { overflow: hidden; }
.ma-col-id { width: 52px; }
.ma-col-role { width: 88px; }
.ma-col-act { width: 132px; }
.ma-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ma-name-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ma-av { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; line-height: 1; }
.ma-av-emoji { line-height: 1; }
.ma-av-img { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; display: block; }
.ma-role { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--bd8); color: var(--tx4); }
.ma-role-admin { background: var(--ac5); color: var(--ac6); }
.ma-act { display: flex; gap: 6px; }
/* 汎用CRUDの一覧セル: 長い文字列・base64でも省略して崩さない */
.ma-cell-txt { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── タスク管理アプリ ─────────────────────────────────────────────────────── */
.tk-av-img { border-radius: 50%; object-fit: cover; display: inline-block; vertical-align: middle; }
.tk-av-emoji { line-height: 1; vertical-align: middle; }
.tk-avatars { display: inline-flex; align-items: center; gap: 2px; }
.tk-avatars > * { margin-left: -4px; box-shadow: 0 0 0 2px var(--sf0); border-radius: 50%; }
.tk-avatars > *:first-child { margin-left: 0; }
.tk-note { font-size: 11px; color: var(--yl3); margin: 4px 0; }

/* プロジェクトカード */
.tk-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.tk-card { background: var(--sf4); border: 1px solid var(--bd1); border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.tk-card-head { display: flex; align-items: center; gap: 8px; }
.tk-card-name { flex: 1; font-weight: 600; font-size: 13px; color: var(--tx0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.tk-pstatus { font-size: 10px; padding: 2px 8px; border-radius: 999px; background: var(--bd8); color: var(--tx4); flex: 0 0 auto; }
.tk-pstatus-active { background: var(--gnb3); color: var(--gn3); }
.tk-pstatus-planning { background: var(--bd5); color: var(--tx3); }
.tk-pstatus-archived { background: var(--rdb6); color: var(--pk0); }
.tk-progress { position: relative; height: 16px; background: var(--bg4); border-radius: 999px; overflow: hidden; }
.tk-progress-fill { position: absolute; left: 0; top: 0; bottom: 0; background: linear-gradient(90deg, #5a4bd8, #7c6cf8); border-radius: 999px; }
.tk-progress-txt { position: absolute; right: 8px; top: 0; line-height: 16px; font-size: 10px; color: var(--tx5); }
.tk-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
.tk-due { font-size: 11px; color: var(--mu1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tk-card-foot { display: flex; gap: 6px; }

/* タスク一覧 */
.tk-crumb { display: flex; align-items: center; gap: 10px; min-width: 0; }
.tk-crumb-name { font-weight: 600; font-size: 13px; color: var(--tx0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-col-status { width: 110px; }
.tk-col-prio { width: 54px; }
.tk-col-asg { width: 96px; }
.tk-col-due { width: 110px; }
.tk-status { padding: 4px 6px; background: var(--sf9); border: 1px solid var(--bd2); border-radius: 6px; color: var(--tx1); font-size: 11px; max-width: 100%; }
.tk-status-done { background: var(--gnb3); color: var(--gn3); }
.tk-status-in_progress { background: var(--hv2); color: var(--tx3); }
.tk-prio { font-size: 11px; padding: 2px 7px; border-radius: 999px; background: var(--bd8); color: var(--tx4); }
.tk-prio-high { background: var(--rdb3); color: var(--rd4); }
.tk-prio-low { background: var(--gnb3); color: var(--gn3); }

/* クイック追加 / 自分フィルタ / 受信箱 */
.tk-top { margin-bottom: 10px; }
.tk-quickadd { display: flex; align-items: center; gap: 8px; margin-top: 8px; background: var(--sf4); border: 1px solid var(--bd1); border-radius: 9px; padding: 6px 8px 6px 12px; }
.tk-quickadd-ico { color: #7c6cf8; font-weight: 700; font-size: 16px; flex: 0 0 auto; }
.tk-quickadd-input { flex: 1; min-width: 0; background: transparent; border: none; outline: none; color: var(--tx0); font-size: 13px; }
.tk-quickadd-input::placeholder { color: var(--mu5); }
.tk-quickadd-sel { background: var(--sf9); border: 1px solid var(--bd2); border-radius: 7px; color: var(--tx1); font-size: 12px; padding: 5px 6px; max-width: 160px; }
/* 担当者フィルタ（複数選択ドロップダウン） */
.tk-filter { position: relative; display: inline-block; }
.tk-filter .ma-btn { display: inline-flex; align-items: center; gap: 6px; }
.tk-filter-on { background: var(--hv2); border-color: var(--hv0); color: var(--hv-tx); }
.tk-filter-backdrop { position: fixed; inset: 0; z-index: 50; }
.tk-filter-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 51; width: 260px; max-height: 320px; overflow-y: auto;
  background: var(--sf4); border: 1px solid var(--bd3); border-radius: 10px; padding: 10px; box-shadow: 0 14px 40px rgba(0,0,0,.5); }
.tk-filter-row { display: flex; gap: 6px; margin-bottom: 8px; }
.tk-filter-mini { padding: 4px 10px; background: var(--rz4); border: 1px solid var(--bd3); border-radius: 7px; color: var(--tx1); font-size: 11px; cursor: pointer; }
.tk-filter-mini:hover { background: var(--hv2); }
.tk-filter-pop .tk-members { margin-top: 0; flex-direction: column; flex-wrap: nowrap; gap: 2px; }
.tk-filter-pop .tk-mem { width: 100%; }
.tk-card-inbox { border-color: var(--bd6); background: var(--sf8); }
.tk-card-inbox .tk-card-name { color: var(--tx3); }
.tk-inbox-badge { font-size: 11px; padding: 2px 8px; border-radius: 999px; background: var(--hv2); color: var(--tx3); white-space: nowrap; }
/* 完了表示トグル */
.tk-showdone { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--tx7); cursor: pointer; padding: 4px 8px; border: 1px solid var(--bd1); border-radius: 7px; white-space: nowrap; user-select: none; }
.tk-showdone input { margin: 0; cursor: pointer; }
.tk-showdone:hover { background: var(--rz6); }
.tk-showdone-on { background: var(--hv2); border-color: var(--hv0); color: var(--hv-tx); }
/* カンバン: 完了列を畳んだ状態 */
.tk-col-collapsed { opacity: .85; }
.tk-col-folded { padding: 16px 10px; text-align: center; font-size: 11px; color: var(--mu0); line-height: 1.6; border: 1px dashed var(--bd0); border-radius: 8px; margin: 6px; }
.tk-col-chk { width: 34px; text-align: center; }
.tk-col-chk input { margin: 0; cursor: pointer; }
.tk-ttable .tk-trow-done .ma-cell-txt { text-decoration: line-through; color: var(--mu5); }

/* ── タスク管理 2026-07-09 追加分（新クラスのみ。旧バンドル(prod)には影響しない） ── */
.tk-sortsel { background: var(--sf9); border: 1px solid var(--bd2); border-radius: 7px; color: var(--tx1); font-size: 12px; padding: 5px 6px; max-width: 190px; }
.tk-ttable2 .ma-col-act { width: 184px; } /* 編集/コピー/削除の3ボタン分 */
.tk-col-cnt { width: 70px; }
.tk-ptable { table-layout: fixed; }
.tk-ptable .tk-progress { min-width: 90px; }
.tk-kcard-copy { flex: 0 0 auto; width: 18px; height: 18px; border: none; background: transparent; color: var(--mu5); font-size: 12px; line-height: 1; cursor: pointer; border-radius: 4px; }
.tk-kcard-copy:hover { background: var(--hv2); color: var(--hv-tx); }
.tk-overdue { color: var(--rd1); font-weight: 600; }

/* ── 4コマ: 公開予約(自動公開)トグル・結果表示 ── */
.yk-auto { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--tx7); cursor: pointer; padding: 4px 8px; border: 1px solid var(--bd1); border-radius: 7px; white-space: nowrap; user-select: none; }
.yk-auto input { margin: 0; cursor: pointer; }
.yk-auto:hover { background: var(--rz6); }
.yk-auto-on { background: var(--hv2); border-color: var(--hv0); color: var(--hv-tx); }
.yk-auto-result { font-size: 11px; color: var(--mu0); margin-top: 2px; }
.yk-auto-ng { color: var(--rd1); }

/* ── ma-table-wrap: 狭い画面でテーブルを潰さず横スクロールさせる(メンバー/PJ一覧で使用) ── */
.ma-table-wrap { overflow-x: auto; }
.ma-table-wrap > .ma-table { min-width: 480px; }

/* ── gsmon: 設定エディタ(ConfigEditor) ── */
.gs-cfg-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; z-index: 30; }
.gs-cfg { background: var(--sf0); border: 1px solid var(--bd1); border-radius: 12px; width: min(680px, calc(100% - 24px)); max-height: calc(100% - 24px); display: flex; flex-direction: column; box-shadow: 0 12px 40px rgba(0,0,0,.4); }
.gs-cfg-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--bd1); }
.gs-cfg-title { font-size: 13px; font-weight: 600; color: var(--tx0); min-width: 0; }
.gs-cfg-path { display: block; font-size: 11px; font-weight: 400; color: var(--mu0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gs-cfg-body { display: flex; flex-direction: column; min-height: 0; }
.gs-cfg-meta { padding: 8px 14px 0; font-size: 11px; color: var(--mu0); }
.gs-cfg-tabs { display: flex; align-items: center; gap: 8px; padding: 8px 14px; }
.gs-cfg-search { width: 180px; margin: 0; padding: 5px 8px; font-size: 12px; }
.gs-cfg-list { overflow-y: auto; padding: 4px 14px 8px; min-height: 120px; }
.gs-cfg-row { display: flex; align-items: center; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--rz1); font-size: 12px; color: var(--tx1); cursor: default; }
.gs-cfg-key { flex: 0 0 46%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: ui-monospace, monospace; font-size: 11px; }
.gs-cfg-in { flex: 1; margin: 0; padding: 5px 8px; font-size: 12px; min-width: 0; }
.gs-cfg-chg { background: var(--hl2); }
.gs-cfg-chg .gs-cfg-key { color: var(--hv-tx); font-weight: 600; }
.gs-cfg-raw { overflow: auto; margin: 0 14px 8px; padding: 10px; background: var(--bg4); border: 1px solid var(--bd1); border-radius: 8px; font-size: 11px; line-height: 1.5; white-space: pre-wrap; word-break: break-all; max-height: 50vh; }
/* 項目説明(辞書)表示: キー名の下に小さくグレーで。辞書に無いキーは「未登録」バッジ */
.gs-cfg-keywrap { flex: 0 0 46%; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.gs-cfg-keywrap .gs-cfg-key { flex: 0 0 auto; }
.gs-cfg-desc { font-size: 10px; color: var(--mu0); line-height: 1.45; white-space: normal; }
.gs-cfg-nodesc { font-size: 9px; color: var(--mu5); border: 1px solid var(--bd1); border-radius: 999px; padding: 0 6px; align-self: flex-start; }
.gs-cfg-foot { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--bd1); }
.gs-cfg-count { font-size: 12px; color: var(--mu0); margin-right: auto; }
.gs-cfg-count-on { color: var(--hv-tx); font-weight: 600; }

/* ── サークルシステム情報（旧 情報ボックス） ─────────────────────────────── */
.ib-wrap { height: 100%; overflow-y: auto; padding: 18px 22px; }
.ib-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.ib-title { font-size: 17px; font-weight: 700; color: var(--tx0); }
.ib-sub { font-size: 12px; color: var(--mu0); margin-top: 2px; }
.ib-add-btn { flex: 0 0 auto; font-size: 13px; padding: 8px 14px; border-radius: 8px; background: #7c6cf8; border: none; color: #fff; cursor: pointer; font-weight: 600; }
.ib-add-btn:hover { background: var(--ac4); }
.ib-msg { padding: 16px; color: var(--mu1); font-size: 13px; text-align: center; }
.ib-err { color: var(--rd1); }
.ib-sec { margin-bottom: 20px; }
.ib-sec-head { display: flex; align-items: center; gap: 8px; padding: 6px 12px; border-left: 3px solid #7c6cf8; margin-bottom: 10px; }
.ib-sec-ico { font-size: 15px; }
.ib-sec-label { font-size: 14px; font-weight: 600; color: var(--tx0); }
.ib-sec-count { font-size: 11px; color: var(--mu0); background: var(--rz0); border-radius: 999px; padding: 1px 9px; }
.ib-sec-add { margin-left: auto; font-size: 11px; padding: 4px 10px; border-radius: 6px; background: var(--rz0); border: 1px solid var(--bd1); color: var(--tx7); cursor: pointer; }
.ib-sec-add:hover { background: var(--hv2); color: var(--hv-tx); }
.ib-empty { border: 2px dashed var(--bd1); border-radius: 8px; padding: 14px; text-align: center; color: var(--mu0); font-size: 12px; cursor: pointer; }
.ib-empty:hover { border-color: var(--hv0); color: var(--tx2); background: var(--hl0); }
.ib-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.ib-card { background: var(--sf5); border: 1px solid var(--bd0); border-radius: 10px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ib-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.ib-card-title { font-size: 13px; font-weight: 600; color: var(--tx0); flex: 1; min-width: 0; word-break: break-word; }
.ib-card-actions { display: flex; gap: 4px; flex: 0 0 auto; }
.ib-icon-btn { font-size: 12px; padding: 2px 8px; border: 1px solid var(--bd1); border-radius: 6px; background: var(--rz0); color: var(--tx7); cursor: pointer; }
.ib-icon-btn:hover { background: var(--hv2); color: var(--hv-tx); }
.ib-del:hover { background: #c0392b; border-color: #c0392b; }
.ib-svc { font-size: 11px; color: var(--mu0); margin-bottom: 2px; }
.ib-row { display: flex; align-items: center; gap: 6px; font-size: 12px; margin-top: 4px; min-width: 0; }
.ib-row-ico { flex: 0 0 auto; font-size: 11px; }
.ib-row-val { word-break: break-all; color: var(--tx1); flex: 1; min-width: 0; }
.ib-pw { font-family: monospace; letter-spacing: 1px; color: var(--tx1); flex: 1; min-width: 0; word-break: break-all; }
.ib-mini { flex: 0 0 auto; font-size: 10px; padding: 1px 7px; border: 1px solid var(--bd1); border-radius: 4px; background: var(--rz0); color: var(--tx7); cursor: pointer; }
.ib-mini:hover { background: var(--hv2); color: var(--hv-tx); }
.ib-url { font-size: 12px; color: var(--gn2); word-break: break-all; margin-top: 4px; display: block; text-decoration: none; }
.ib-url:hover { text-decoration: underline; }
.ib-memo { font-size: 12px; color: var(--tx1); margin-top: 6px; white-space: pre-wrap; word-break: break-word; background: var(--sf0); border-radius: 6px; padding: 8px 10px; line-height: 1.6; }
/* 追加/編集モーダル */
.ib-modal-bg { position: absolute; inset: 0; background: rgba(0,0,0,.55); z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.ib-modal { background: var(--sf5); border: 1px solid var(--bd1); border-radius: 12px; padding: 18px 20px; width: 420px; max-width: 100%; max-height: 90%; overflow-y: auto; box-shadow: 0 18px 50px rgba(0,0,0,.6); }
.ib-modal-title { font-size: 15px; font-weight: 700; color: var(--tx0); margin-bottom: 14px; }
.ib-f { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--mu1); margin-bottom: 10px; }
.ib-f input, .ib-f select, .ib-f textarea { background: var(--sf0); border: 1px solid var(--bd1); border-radius: 7px; padding: 8px 10px; color: var(--tx0); font-size: 13px; font-family: inherit; }
.ib-f input:focus, .ib-f select:focus, .ib-f textarea:focus { outline: none; border-color: #7c6cf8; }
.ib-modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 6px; }
.ib-btn-ghost { padding: 8px 14px; border-radius: 8px; background: var(--rz0); border: 1px solid var(--bd1); color: var(--tx7); cursor: pointer; font-size: 13px; }
.ib-btn-ghost:hover { background: var(--hv2); color: var(--hv-tx); }
.ib-btn-primary { padding: 8px 16px; border-radius: 8px; background: #7c6cf8; border: none; color: #fff; cursor: pointer; font-size: 13px; font-weight: 600; }
.ib-btn-primary:hover { background: var(--ac4); }

/* ═══ スマホ専用UI（.m-root 配下。PC版には影響しない） ═══════════════════════ */
.m-root { position: absolute; inset: 0; display: flex; flex-direction: column; overflow: hidden;
  background: linear-gradient(160deg, var(--bg0), var(--sf1) 60%, var(--sf3)); color: var(--tx0);
  -webkit-tap-highlight-color: transparent; user-select: none; }
.m-top { display: flex; align-items: center; justify-content: space-between; padding: calc(env(safe-area-inset-top) + 10px) 16px 10px; flex: 0 0 auto; }
.m-top-title { font-size: 16px; font-weight: 700; }
.m-top-user { background: transparent; border: none; padding: 0; cursor: pointer; }
.m-home { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 4px 14px calc(env(safe-area-inset-bottom) + 86px); }
.m-sec-head { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--mu1); margin: 16px 4px 8px; }
.m-sec-actions { display: flex; gap: 8px; }
.m-sec-btn { font-size: 12px; padding: 4px 10px; border-radius: 7px; background: var(--hl4); border: 1px solid var(--bd1); color: var(--tx2); cursor: pointer; }
.m-empty { font-size: 12px; color: var(--mu0); padding: 14px; text-align: center; border: 1px dashed var(--bd1); border-radius: 10px; }
/* ウィジェット（全幅カード） */
.m-widgets { display: flex; flex-direction: column; gap: 10px; }
.m-widget { background: var(--pn3); border: 1px solid var(--bd1); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.m-widget-head { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-bottom: 1px solid var(--bd0); }
.m-widget-ico { font-size: 16px; }
.m-widget-ico, .m-widget-title { cursor: pointer; }
.m-widget-title { flex: 1; font-size: 13px; font-weight: 600; }
.m-widget-title:active { color: var(--ac1); }
.m-widget-x { width: 26px; height: 26px; border: none; background: #c0392b; color: #fff; border-radius: 50%; font-size: 15px; cursor: pointer; }
.m-widget-body { flex: 1; overflow: auto; padding: 8px 12px; }
/* アプリグリッド（4列） */
.m-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px 4px; }
.m-icon { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 2px; background: transparent; border: none; color: var(--tx0); cursor: pointer; }
.m-icon-dim { opacity: .45; }
.m-icon-img { width: 56px; height: 56px; border-radius: 15px; background: var(--hl4); display: flex; align-items: center; justify-content: center; font-size: 30px; box-shadow: 0 3px 10px rgba(0,0,0,.35); }
.m-icon-label { font-size: 11px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 下部ドック */
.m-dock { position: absolute; left: 8px; right: 8px; bottom: calc(env(safe-area-inset-bottom) + 8px);
  display: flex; align-items: center; justify-content: space-around; gap: 4px; padding: 8px;
  background: var(--pn6); border: 1px solid var(--bd0); border-radius: 20px; backdrop-filter: blur(14px); z-index: 5; }
.m-dock-btn { flex: 1; max-width: 64px; height: 48px; display: flex; align-items: center; justify-content: center;
  background: transparent; border: none; border-radius: 14px; cursor: pointer; }
.m-dock-btn:active { background: var(--hl5); }
.m-dock-on { background: rgba(124,108,248,.3); }
.m-dock-ico { font-size: 26px; }
.m-dock-edit .m-dock-ico { font-size: 22px; color: var(--mu1); }
/* 全画面アプリ */
.m-fs { flex: 1; display: flex; flex-direction: column; overflow: hidden; background: var(--bg3); }
.m-fs-bar { display: flex; align-items: center; gap: 8px; padding: calc(env(safe-area-inset-top) + 8px) 12px 8px; flex: 0 0 auto;
  background: var(--pn2); border-bottom: 1px solid var(--bd0); }
.m-back { background: transparent; border: none; color: var(--bl1); font-size: 15px; cursor: pointer; padding: 6px 4px; }
.m-fs-title { flex: 1; font-size: 15px; font-weight: 600; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-fs-sp { width: 64px; }
.m-fs-body { flex: 1; overflow: auto; -webkit-overflow-scrolling: touch; padding-bottom: calc(env(safe-area-inset-bottom) + 78px); }
/* ボトムシート */
.m-sheet-bg { position: absolute; inset: 0; z-index: 50; background: rgba(0,0,0,.5); display: flex; align-items: flex-end; }
.m-sheet { width: 100%; max-height: 80%; display: flex; flex-direction: column; background: var(--sf5); border-top-left-radius: 18px; border-top-right-radius: 18px; border: 1px solid var(--bd1); }
.m-sheet-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--bd0); font-size: 14px; font-weight: 600; }
.m-sheet-x { width: 30px; height: 30px; border: none; background: var(--rz0); color: var(--tx2); border-radius: 50%; font-size: 17px; cursor: pointer; }
.m-sheet-body { overflow-y: auto; padding: 12px 16px calc(env(safe-area-inset-bottom) + 16px); }
.m-acc { display: flex; align-items: center; gap: 12px; padding: 6px 4px 14px; }
.m-acc-name { font-size: 15px; font-weight: 600; }
.m-acc-sub { font-size: 12px; color: var(--mu0); }
.m-row-btn { width: 100%; text-align: left; padding: 14px 12px; margin-top: 6px; border-radius: 10px; background: var(--rz0); border: 1px solid var(--bd0); color: var(--tx0); font-size: 14px; cursor: pointer; }
.m-row-danger { color: var(--rd3); }
.m-pick { display: flex; flex-direction: column; gap: 6px; }
.m-pick-row { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 10px; background: var(--rz0); border: 1px solid var(--bd0); color: var(--tx0); font-size: 14px; cursor: pointer; }
.m-pick-row:disabled { opacity: .4; }
.m-pick-on { border-color: var(--gn0); }
.m-pick-ico { font-size: 22px; }
.m-pick-name { flex: 1; }
.m-pick-state { font-size: 12px; color: var(--mu1); }
.m-pick-on .m-pick-state { color: var(--gn0); }
.m-wpick { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 10px; background: var(--rz0); border: 1px solid var(--bd0); }
.m-wpick-info { display: flex; align-items: center; gap: 10px; min-width: 0; }
.m-wpick-app { font-size: 11px; color: var(--mu0); }
.m-wpick-on { font-size: 10px; color: var(--gn0); margin-left: 6px; }
.m-wpick-sizes { display: flex; gap: 5px; }
.m-size { width: 34px; height: 34px; border-radius: 8px; background: var(--rz4); border: 1px solid var(--bd1); color: var(--tx2); font-size: 13px; cursor: pointer; }
.m-size-on { background: #7c6cf8; border-color: #7c6cf8; color: #fff; }

/* スマホ時のアプリ内コンテンツ最適化（.m-app-body 配下。指で押せる・横はみ出し回避） */
.m-app-body { font-size: 14px; }
.m-app-body button, .m-app-body .ma-btn, .m-app-body .ap-btn { min-height: 38px; }
.m-app-body input, .m-app-body select, .m-app-body textarea { font-size: 16px; max-width: 100%; } /* 16px=iOSズーム防止 */
.m-app-body table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.m-app-body .tk-kanban, .m-app-body .tk-board, .m-app-body .ap-table-wrap, .m-app-body .ma-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.m-app-body .page-content, .m-app-body [style*="grid-template-columns"] { display: block !important; }
.m-app-body .page-header, .m-app-body .toolbar { flex-wrap: wrap; }
/* アプリ内モーダルは全幅に */
.m-app-body .ap-modal, .m-app-body .ib-modal, .m-app-body .ma-modal, .m-app-body .modal, .m-app-body .cal-modal { width: calc(100vw - 24px) !important; max-width: calc(100vw - 24px) !important; }
.m-app-body .ct-frame { height: 78vh; }

/* ── ダッシュボードアプリ ────────────────────────────────────────────────── */
.dash { height: 100%; overflow-y: auto; padding: 16px 18px 28px; }
.dash-top { display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.dash-title { font-size: 18px; font-weight: 700; color: var(--tx0); }
.dash-date { font-size: 12px; color: var(--mu0); }
.dash-sec { margin-bottom: 18px; }
.dash-sec-h { display: flex; align-items: center; justify-content: space-between; margin: 0 2px 8px; }
.dash-sec-h2 { margin-top: 14px; }
.dash-sec-t { font-size: 14px; font-weight: 700; color: var(--tx2); }
.dash-open { font-size: 11px; padding: 4px 10px; border-radius: 7px; background: var(--rz0); border: 1px solid var(--bd1); color: var(--tx7); cursor: pointer; }
.dash-open:hover { background: var(--hv2); color: var(--hv-tx); }
.dash-msg { font-size: 12px; color: var(--mu1); padding: 10px; text-align: center; }
/* 読み込み中スケルトン（段階表示用） */
.dash-skel { display: flex; flex-direction: column; gap: 8px; padding: 10px 6px; }
.dash-skel-bar { height: 12px; border-radius: 6px; background: linear-gradient(90deg, var(--rz0) 25%, var(--rz7) 50%, var(--rz0) 75%); background-size: 200% 100%; animation: dash-shimmer 1.2s infinite; }
.dash-skel-bar:nth-child(2) { width: 80%; } .dash-skel-bar:nth-child(3) { width: 60%; } .dash-skel-bar:nth-child(4) { width: 70%; }
@keyframes dash-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.dash-dots { color: var(--mu0); }
.dash-err { color: var(--rd1); }
.dash-ok { font-size: 12px; color: var(--gn0); padding: 6px 2px; }
.dash-card { background: var(--pn4); border: 1px solid var(--bd0); border-radius: 12px; padding: 6px 8px; }
/* アラート: 遅延を最も目立たせる */
.dash-alert-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 10px; margin-bottom: 10px; }
.dash-delay { background: var(--sf5); border: 1px solid var(--bd0); border-left: 4px solid var(--mu5); border-radius: 12px; padding: 12px 14px; cursor: pointer; }
.dash-delay-on { background: var(--rdb5); border-color: var(--rd0); border-left-color: var(--rd0); }
.dash-delay-num { font-size: 40px; font-weight: 800; line-height: 1; color: var(--tx0); }
.dash-delay-on .dash-delay-num { color: var(--rd0); }
.dash-delay-lbl { font-size: 12px; color: var(--tx2); margin: 2px 0 8px; }
.dash-delay-list, .dash-soon { display: flex; flex-direction: column; gap: 4px; }
.dash-soon { background: var(--sf5); border: 1px solid var(--bd0); border-radius: 12px; padding: 12px 14px; cursor: pointer; }
.dash-soon-h { font-size: 13px; color: var(--tx2); margin-bottom: 6px; }
.dash-soon-h b { color: var(--yl0); font-size: 16px; }
.dash-trow { display: flex; align-items: center; gap: 7px; font-size: 12px; min-width: 0; }
.dash-dot { width: 7px; height: 7px; border-radius: 50%; flex: 0 0 auto; }
.dash-ttl { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tx0); }
.dash-due { font-size: 11px; flex: 0 0 auto; white-space: nowrap; }
.dash-more { font-size: 11px; color: var(--mu0); }
/* 通知 */
.dash-notify { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.dash-ncard { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: var(--pn4); border: 1px solid var(--bd0); border-radius: 12px; cursor: pointer; text-align: left; color: var(--tx0); }
.dash-ncard:hover { background: var(--rz6); }
.dash-nico { font-size: 18px; }
.dash-nlbl { flex: 1; font-size: 12px; color: var(--tx2); }
.dash-nnum { font-size: 18px; font-weight: 700; }
.dash-nnum small { font-size: 11px; font-weight: 400; color: var(--mu0); }
.dash-noff { font-size: 11px; color: var(--yl3); }
/* サークル */
.dash-circle { display: flex; flex-direction: column; gap: 10px; }
.dash-proj-h { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--tx2); padding: 4px 4px 8px; }
.dash-proj-h b { color: var(--tx0); }
.dash-proj-h .dash-open { margin-left: auto; }
.dash-proj { padding: 7px 6px; border-top: 1px solid var(--rz3); cursor: pointer; }
.dash-proj:hover { background: var(--hl1); }
.dash-proj-top { display: flex; justify-content: space-between; font-size: 12px; color: var(--tx0); }
.dash-proj-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dash-proj-pct { color: #7c6cf8; font-weight: 600; flex: 0 0 auto; }
.dash-bar { height: 6px; background: var(--rz3); border-radius: 999px; margin: 4px 0; overflow: hidden; }
.dash-bar-fill { height: 100%; background: linear-gradient(90deg,#7c6cf8,var(--gn0)); border-radius: 999px; }
.dash-proj-sub { font-size: 10px; color: var(--mu0); }
/* スマホ: 2カラム系を1カラムに */
.m-app-body .dash-alert-grid, .m-app-body .dash-notify { grid-template-columns: 1fr; }
.m-app-body .dash { padding: 12px 14px 24px; }

/* ── 連絡先アプリ（旧ページ埋め込み iframe） ───────────────────────────────── */
.ct-frame { display: block; width: 100%; height: 100%; border: 0; background: var(--bg1); }

/* ── 連絡先アプリ（旧・自前UI用クラス。現在は未使用だが残置） ───────────────── */
.ct-tabs { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 10px; border-bottom: 1px solid var(--bd0); padding-bottom: 10px; }
.ct-tab { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--sf7); border: 1px solid var(--bd1); border-radius: 8px; color: var(--tx2); font-size: 12px; cursor: pointer; white-space: nowrap; }
.ct-tab:hover { background: var(--rz6); }
.ct-tab-on { background: var(--hv2); border-color: var(--hv0); color: var(--hv-tx); }
.ct-tab-cnt { font-size: 10px; padding: 0 6px; border-radius: 999px; background: var(--hl6); }
.ct-tab-add { border-style: dashed; color: var(--mu1); }
.ct-filters { display: flex; gap: 8px; align-items: center; min-width: 0; }
.ct-search { width: 240px; max-width: 42vw; }
.ct-sm { width: auto; min-width: 110px; padding: 6px 8px; }
.ct-list-head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ct-list-name { font-weight: 600; font-size: 13px; color: var(--tx0); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-col-tag { width: 110px; }
.ct-col-avg, .ct-col-cnt { width: 64px; }
.ct-col-maj { width: 90px; }
.ct-num { color: var(--mu1); }
.ct-pick { max-height: 240px; overflow-y: auto; display: flex; flex-direction: column; gap: 3px; margin: 8px 0; border: 1px solid var(--bd2); border-radius: 8px; padding: 8px; }
.ct-pick .tk-mem { width: 100%; }

/* ── お問い合わせ（詳細展開の全項目） ─────────────────────────────────────── */
.ap-fields-detail { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px 16px; padding: 12px 14px; }

/* ── 設定アプリ ───────────────────────────────────────────────────────────── */
.set-body { flex: 1 1 auto; overflow-y: auto; padding: 14px 18px; display: flex; flex-direction: column; gap: 16px; max-width: 640px; }
.set-sec { background: var(--sf5); border: 1px solid var(--bd0); border-radius: 10px; padding: 16px 18px; }
.set-sec-title { font-size: 14px; font-weight: 600; margin-bottom: 12px; }
.set-note { font-size: 12px; color: var(--mu0); margin-bottom: 12px; line-height: 1.6; }
.set-prof { display: flex; align-items: center; gap: 16px; margin-bottom: 12px; }
.set-prof-fields { flex: 1; min-width: 0; }
.set-meta { font-size: 12px; color: var(--mu0); margin-top: 6px; }
.set-av-img { border-radius: 50%; object-fit: cover; display: block; }
.set-av-emoji { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; background: var(--sf9); border-radius: 50%; }
.set-av-pick { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.set-av-btn { font-size: 20px; padding: 4px 7px; background: var(--sf9); border: 2px solid transparent; border-radius: 8px; cursor: pointer; }
.set-av-on { border-color: #7c6cf8; background: var(--rz5); }
.set-av-text { flex: 1; min-width: 180px; }
.set-msg { font-size: 12px; padding: 8px 12px; border-radius: 8px; margin: 4px 0 10px; }
.set-ok { background: #22d3a522; color: var(--gn0); }
.set-ng { background: #ef444422; color: var(--rd0); }

/* ── ダウンロードアプリ ───────────────────────────────────────────────────── */
.dl-body { flex: 1 1 auto; overflow-y: auto; padding: 14px 18px; display: flex; flex-direction: column; gap: 16px; }
.dl-card { background: var(--sf5); border: 1px solid var(--bd0); border-radius: 10px; padding: 16px 18px; }
.dl-card-title { font-size: 14px; font-weight: 600; margin-bottom: 12px; }
.dl-input-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.dl-input-row .ma-input { flex: 1; min-width: 240px; }
.dl-warn { margin-top: 10px; font-size: 12px; color: var(--yl4); background: var(--ylb2); border: 1px solid var(--ylb0); border-radius: 8px; padding: 8px 12px; }
.dl-jobs { display: flex; flex-direction: column; gap: 8px; }
.dl-job { border: 1px solid var(--bd0); border-radius: 8px; padding: 10px 12px; }
.dl-job-top { display: flex; align-items: center; gap: 8px; }
.dl-badge { font-size: 10px; padding: 2px 8px; border-radius: 10px; font-weight: 600; white-space: nowrap; }
.dl-job-title { flex: 1; min-width: 0; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dl-job-by { font-size: 11px; color: var(--mu0); white-space: nowrap; }
.dl-bar-wrap { position: relative; margin-top: 8px; height: 6px; background: var(--bg4); border-radius: 4px; overflow: hidden; }
.dl-bar { height: 100%; border-radius: 4px; transition: width .4s; }
.dl-pct { position: absolute; right: 0; top: 8px; font-size: 11px; color: var(--mu0); }
.dl-link { font-size: 12px; display: inline-block; margin-top: 6px; }
.dl-path { font-size: 11px; color: var(--mu0); margin-top: 6px; word-break: break-all; }
.dl-err { font-size: 12px; color: var(--rd0); margin-top: 6px; }

/* ── カレンダーアプリ（月グリッド・旧踏襲） ────────────────────────────────── */
.cal-banner { margin: 8px 16px 0; padding: 8px 12px; background: var(--ylb2); border: 1px solid var(--ylb0); border-radius: 8px; color: var(--yl4); font-size: 12px; }
.cal-wrap { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; padding: 10px 16px 16px; overflow: auto; }
.cal-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 4px; flex: 0 0 auto; }
.cal-wd { text-align: center; font-size: 11px; font-weight: 600; color: var(--mu0); padding: 4px 0; }
.cal-sun { color: var(--rd0); }
.cal-sat { color: var(--bl0); }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); grid-auto-rows: 1fr; gap: 4px; flex: 1 1 auto; min-height: 480px; }
.cal-cell { background: var(--sf5); border: 1px solid var(--bd0); border-radius: 6px; padding: 5px; min-height: 78px; cursor: pointer; overflow: hidden; display: flex; flex-direction: column; }
.cal-cell:hover { border-color: #5a4bd8; }
.cal-empty { background: transparent; border: none; cursor: default; }
.cal-empty:hover { border: none; }
.cal-today { background: var(--rz5); border-color: #6f60ec; }
.cal-day { font-size: 12px; color: var(--tx6); margin-bottom: 3px; }
.cal-day-today { font-weight: 700; color: var(--ac1); }
.cal-items { display: flex; flex-direction: column; gap: 2px; overflow: hidden; }
.cal-chip { font-size: 10px; border-radius: 3px; padding: 1px 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.cal-chip-task { cursor: default; }
.cal-more { font-size: 10px; color: var(--mu0); padding: 0 4px; }
.cal-grid3 { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 10px; }
.cal-gcal { font-size: 11px; margin-left: 10px; font-weight: 400; }

/* ── メールアプリ（受信トレイ + 本文 2ペイン） ─────────────────────────────── */
.ml-note { font-size: 11px; color: var(--yl3); }
.ml-list { flex: 0 0 320px; width: 320px; border-right: 1px solid var(--bd0); overflow-y: auto; }
.ml-row { padding: 10px 14px; border-bottom: 1px solid var(--rz1); cursor: pointer; }
.ml-row:hover { background: var(--hl1); }
.ml-row-sel { background: var(--rz0) !important; }
.ml-row-unread { background: rgba(124,108,248,.06); }
.ml-row-top { display: flex; align-items: center; gap: 7px; margin-bottom: 3px; }
.ml-dot { width: 7px; height: 7px; border-radius: 50%; background: #7c6cf8; flex: 0 0 auto; }
.ml-dot-read { background: transparent; }
.ml-star { color: var(--yl0); font-size: 11px; flex: 0 0 auto; }
.ml-from { font-size: 12px; font-weight: 600; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ml-row-unread .ml-from { font-weight: 700; }
.ml-date { font-size: 11px; color: var(--mu5); white-space: nowrap; }
.ml-subject { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 2px; color: var(--tx0); }
.ml-preview { font-size: 11px; color: var(--mu0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ml-tag { font-size: 10px; border-radius: 4px; padding: 1px 6px; margin-top: 4px; display: inline-block; }
.ml-detail { flex: 1 1 auto; min-width: 0; overflow-y: auto; }
.ml-empty { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--mu0); font-size: 13px; }
.ml-detail-in { padding: 18px 22px; }
.ml-detail-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.ml-subj { font-size: 16px; font-weight: 600; line-height: 1.4; margin-bottom: 8px; }
.ml-meta { font-size: 12px; color: var(--mu0); margin-bottom: 14px; }
.ml-meta b { color: var(--tx0); }
.ml-meta-date { margin-left: 16px; }
.ml-body { background: var(--sf1); border: 1px solid var(--bd0); border-radius: 8px; padding: 16px; font-size: 13px; line-height: 1.7; margin-bottom: 16px; }
.ml-body-mock { color: var(--tx7); }
.ml-iframe { width: 100%; min-height: 320px; border: none; background: #fff; border-radius: 4px; }
.ml-pre { white-space: pre-wrap; word-break: break-word; font-family: inherit; margin: 0; }
.ml-reply { background: var(--sf1); border: 1px solid var(--bd0); border-radius: 8px; padding: 14px; }
.ml-reply-title { font-size: 12px; font-weight: 600; color: var(--mu0); margin-bottom: 8px; }
.ml-c-px { width: 80px; }
.ml-badge { font-size: 10px; padding: 1px 8px; border-radius: 10px; background: var(--bd8); color: var(--mu1); }
.ml-badge-on { background: var(--gnb3); color: var(--gn3); }

/* ── 応募アプリ（旧「応募管理」完全踏襲） ──────────────────────────────────── */
.ap-root { height: 100%; display: flex; flex-direction: column; overflow: hidden; }
.ap-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--bd0); flex: 0 0 auto; }
.ap-title { font-weight: 700; font-size: 15px; }
.ap-sub { font-size: 12px; color: var(--mu0); margin-left: 6px; }
.ap-head-btns { display: flex; gap: 6px; }
.ap-toolbar { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--bd0); flex-wrap: wrap; flex: 0 0 auto; }
.ap-search { width: 300px; max-width: 50vw; }
.ap-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.ap-chip { font-size: 11px; padding: 4px 12px; border-radius: 16px; border: 1px solid var(--bd1); background: transparent; color: var(--tx7); cursor: pointer; }
.ap-chip-on { background: #5a4bd8; border-color: #6f60ec; color: #fff; }

.ap-main { flex: 1 1 auto; display: flex; min-height: 0; }
.ap-table-wrap { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; overflow: hidden; }
.ap-table { border-collapse: collapse; width: 100%; min-width: 640px; font-size: 12px; }
.ap-table-wrap > .ap-table { display: block; overflow: auto; flex: 1 1 auto; }
.ap-table thead th { position: sticky; top: 0; background: var(--sf4); color: var(--mu0); font-weight: 600; font-size: 11px; text-align: left; padding: 8px 12px; border-bottom: 1px solid var(--bd0); white-space: nowrap; z-index: 1; }
.ap-sortable { cursor: pointer; user-select: none; }
.ap-sort-dim { opacity: .3; }
.ap-table td { padding: 6px 12px; border-bottom: 1px solid var(--rz1); vertical-align: top; }
.ap-row { cursor: pointer; }
.ap-row:hover { background: var(--hl1); }
.ap-row-sel { background: var(--rz0) !important; }
.ap-c-eval { min-width: 132px; white-space: nowrap; }
.ap-c-status { width: 96px; }
.ap-c-memo { width: 70px; }
.ap-c-data { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-cell { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 230px; }
.ap-link { color: var(--ac1); text-decoration: underline; }
.ap-stars { display: inline-flex; gap: 1px; }
.ap-star { font-size: 14px; line-height: 1; }
.ap-star-i { cursor: pointer; }
.ap-eval-sub { display: flex; align-items: center; gap: 6px; margin-top: 3px; }
.ap-avg { font-size: 10px; color: var(--mu1); }
.ap-cnt { font-size: 10px; padding: 2px 7px; border: 1px solid var(--bd1); border-radius: 10px; background: var(--sf9); color: var(--tx7); cursor: pointer; }
.ap-status-sel { font-size: 12px; padding: 5px 6px; background: var(--sf9); border: 1px solid var(--bd2); border-radius: 6px; color: var(--tx1); }
.ap-memo-btn { font-size: 11px; padding: 4px 8px; border: 1px solid var(--bd1); border-radius: 6px; background: var(--sf9); color: var(--mu1); cursor: pointer; white-space: nowrap; }
.ap-memo-on { background: #5a4bd8; border-color: #6f60ec; color: #fff; }
.ap-badge { font-size: 10px; padding: 1px 7px; border-radius: 10px; font-weight: 600; }
.ap-foot { flex: 0 0 auto; border-top: 1px solid var(--bd0); }
.ap-pager { display: flex; align-items: center; gap: 10px; padding: 8px 16px; font-size: 12px; color: var(--mu1); }
.ap-foot-info { display: block; padding: 6px 16px; font-size: 11px; color: var(--mu5); }

/* 詳細ペイン */
.ap-detail { flex: 0 0 320px; width: 320px; border-left: 1px solid var(--bd0); display: flex; flex-direction: column; overflow: hidden; background: var(--sf1); }
.ap-detail-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; border-bottom: 1px solid var(--bd0); font-size: 13px; font-weight: 600; flex: 0 0 auto; }
.ap-x { background: none; border: none; color: var(--mu0); font-size: 15px; cursor: pointer; }
.ap-detail-body { padding: 14px; overflow-y: auto; flex: 1 1 auto; }
.ap-sec-title { font-size: 11px; color: var(--mu0); font-weight: 600; margin-bottom: 8px; letter-spacing: .5px; }
.ap-field { margin-bottom: 10px; }
.ap-field-k { font-size: 10px; color: var(--mu0); font-weight: 600; margin-bottom: 3px; }
.ap-field-v { font-size: 12px; color: var(--tx0); white-space: pre-wrap; word-break: break-word; line-height: 1.6; }
.ap-sum { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; padding: 8px 10px; background: var(--bg4); border-radius: 8px; }
.ap-avg-big { font-size: 16px; font-weight: 700; color: var(--yl5); }
.ap-sum-cnt { font-size: 11px; color: var(--mu1); }
.ap-sum-none { color: var(--mu1); font-size: 12px; }
.ap-mrow { padding: 8px 0; border-bottom: 1px solid var(--rz1); }
.ap-mrow-top { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.ap-mname { font-size: 12px; font-weight: 600; }
.ap-mrow-stars { display: flex; align-items: center; gap: 4px; }
.ap-mscore { font-size: 11px; color: var(--mu1); }
.ap-mmemo { margin-top: 4px; font-size: 11px; color: var(--tx7); background: var(--bg4); border-radius: 6px; padding: 5px 8px; white-space: pre-wrap; }
.ap-av { border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.ap-av-txt { display: inline-flex; align-items: center; justify-content: center; background: var(--hv2); color: var(--tx3); font-size: 11px; font-weight: 700; }

/* メモモーダル / 列設定 */
.ap-modal-bg { position: fixed; inset: 0; background: rgba(0,0,0,.55); z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.ap-modal { background: var(--sf5); border: 1px solid var(--bd1); border-radius: 12px; padding: 16px; width: 100%; max-width: 460px; }
.ap-modal-title { font-size: 13px; font-weight: 600; margin-bottom: 10px; }
.ap-colcfg { max-height: 280px; overflow-y: auto; border: 1px solid var(--bd2); border-radius: 8px; padding: 6px; margin: 8px 0; }
.ap-colcfg-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 6px; }
.ap-colcfg-lbl { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--tx6); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-colcfg-mv { display: flex; gap: 4px; flex: 0 0 auto; }

/* 採点パネル */
.ct-eval { padding: 10px 12px; background: var(--bg4); }
.ct-eval-sum { font-size: 12px; color: var(--tx2); display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.ct-eval-maj { font-size: 11px; padding: 2px 8px; border-radius: 999px; }
.ct-eval-cnt { color: var(--mu0); }
.ct-eval-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.ct-eval-row { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.ct-eval-name { width: 100px; color: var(--tx6); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ct-eval-score { width: 40px; color: var(--yl0); }
.ct-eval-st { font-size: 10px; padding: 1px 7px; border-radius: 999px; }
.ct-eval-memo { flex: 1; min-width: 0; color: var(--mu1); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ct-eval-mine { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; border-top: 1px solid var(--bd0); padding-top: 8px; }
.ct-eval-mine-label { font-size: 12px; color: var(--tx7); }
.ct-eval-mine .ma-input { flex: 0 0 auto; }
.ct-eval-mine input.ma-input { flex: 1; min-width: 120px; }

/* 上部タブ（プロジェクト / タスク） */
.tk-tabs { display: inline-flex; gap: 4px; }
.tk-tab { padding: 6px 14px; background: transparent; border: 1px solid transparent; border-radius: 8px; color: var(--tx7); font-size: 13px; font-weight: 600; cursor: pointer; }
.tk-tab:hover { background: var(--hl3); }
.tk-tab-on { background: var(--hv2); color: var(--hv-tx); }

/* 表示切替（カンバン / 一覧 / カード） */
.tk-toolbar-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tk-col-proj { width: 150px; }
.tk-col-prog { width: 130px; }
.tk-col-pact { width: 150px; }
.tk-progress-sm { height: 14px; }
.tk-pcol-head { color: var(--tx3); }
.tk-kcard-proj { font-size: 10px; color: var(--mu0); margin-top: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* アコーディオン展開（プロジェクトをクリック → 下にタスク） */
.tk-clickable { cursor: pointer; }
.tk-chev { display: inline-block; width: 14px; color: var(--mu0); font-size: 10px; flex: 0 0 auto; }
.tk-card-open { border-color: var(--hv0); box-shadow: 0 0 0 1px var(--hv0); }
.tk-card-open .tk-chev { color: var(--ac1); }
.tk-col-chev { width: 28px; }
.tk-prow-open { background: rgba(124,108,248,.08); }
.tk-embed { padding: 8px 10px 10px; }
.tk-expand { grid-column: 1 / -1; background: var(--bg4); border: 1px solid var(--bd1); border-radius: 10px; margin: 2px 0 6px; }
.tk-expand-row > td { padding: 0 !important; background: var(--bg4); border-bottom: 2px solid var(--bd1); }
.tk-expand-row .tk-embed { padding: 8px 12px 12px; }
.tk-viewtoggle { display: inline-flex; border: 1px solid var(--bd1); border-radius: 8px; overflow: hidden; }
.tk-vbtn { padding: 6px 12px; background: var(--sf7); color: var(--tx7); border: none; font-size: 12px; cursor: pointer; }
.tk-vbtn + .tk-vbtn { border-left: 1px solid var(--bd1); }
.tk-vbtn-on { background: var(--hv2); color: var(--hv-tx); }

/* カンバンボード（旧アプリ準拠） */
.tk-board { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 8px; align-items: flex-start; }
.tk-col { background: var(--sf1); border: 1px solid var(--bd1); border-radius: 8px; overflow: hidden; min-width: 200px; flex: 1; }
.tk-col-head { padding: 10px 12px; border-bottom: 1px solid; display: flex; align-items: center; justify-content: space-between; font-size: 12px; }
.tk-col-count { font-size: 11px; padding: 1px 8px; border-radius: 999px; }
.tk-col-body { padding: 8px; display: flex; flex-direction: column; gap: 6px; min-height: 40px; }
.tk-kcard { background: var(--sf7); border: 1px solid var(--bd2); border-radius: 7px; padding: 9px 10px; cursor: pointer; transition: border-color .15s; }
.tk-kcard:hover { border-color: var(--hv0); }
.tk-kcard-top { display: flex; align-items: center; gap: 7px; }
.tk-prio-dot { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; }
.tk-kcard-title { flex: 1; font-size: 12px; color: var(--tx0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.tk-kcard-del { flex: 0 0 auto; width: 18px; height: 18px; border: none; background: transparent; color: var(--mu5); font-size: 15px; line-height: 1; cursor: pointer; border-radius: 4px; }
.tk-kcard-del:hover { background: #c0392b; color: #fff; }
.tk-kcard-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; min-height: 18px; }
.tk-kcard-due { font-size: 10px; color: var(--mu1); white-space: nowrap; }

/* メンバー複数選択 */
.tk-members { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.tk-mem { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px 4px 6px; border: 1px solid var(--bd2); border-radius: 999px; background: var(--sf9); font-size: 12px; color: var(--tx2); cursor: pointer; }
.tk-mem-on { background: var(--hv2); border-color: var(--hv0); color: var(--hv-tx); }
.tk-mem input { margin: 0; }
.tk-mem-name { white-space: nowrap; }
.ma-msg { padding: 24px; color: var(--mu1); font-size: 14px; }
.ma-err { color: var(--rd1); padding: 8px 0; }

/* ── ボタン ───────────────────────────────────────────────────────────────── */
.ma-btn { padding: 6px 12px; border: 1px solid var(--bd3); border-radius: 7px; background: var(--rz4); color: var(--tx1); font-size: 12px; cursor: pointer; white-space: nowrap; }
.ma-btn:hover { background: var(--hv2); }
.ma-btn:disabled { opacity: .55; cursor: not-allowed; }
.ma-btn-primary { background: #5a4bd8; border-color: #6f60ec; color: #fff; }
.ma-btn-primary:hover { background: #6f60ec; }
.ma-btn-sm { padding: 4px 9px; font-size: 11px; }
.ma-btn-danger { background: var(--rdb3); border-color: var(--rdb1); color: var(--rd4); }
.ma-btn-danger:hover { background: #c0392b; border-color: #c0392b; color: #fff; }

/* ── 追加/編集フォーム ────────────────────────────────────────────────────── */
.ma-form { background: var(--sf4); border: 1px solid var(--bd1); border-radius: 10px; padding: 14px 16px; margin-bottom: 14px; }
.ma-form-title { font-size: 13px; font-weight: 600; color: var(--tx2); margin-bottom: 12px; }
.ma-field { display: block; font-size: 12px; color: var(--mu0); margin-bottom: 10px; }
.ma-req { color: var(--rd1); }
.ma-input { width: 100%; margin-top: 4px; padding: 8px 10px; background: var(--sf9); border: 1px solid var(--bd2); border-radius: 7px; color: var(--tx0); font-size: 13px; outline: none; }
.ma-input:focus { border-color: #7c6cf8; }
.ma-av-edit { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.ma-av-edit .ma-av-img { width: 48px; height: 48px; }
.ma-av-edit-fields { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.ma-file { display: inline-block; padding: 5px 10px; background: var(--rz4); border: 1px solid var(--bd3); border-radius: 7px; color: var(--tx1); font-size: 11px; cursor: pointer; align-self: flex-start; }
.ma-file:hover { background: var(--hv2); }
.ma-form-err { color: var(--rd1); font-size: 12px; margin: 4px 0 10px; }
.ma-form-btns { display: flex; gap: 8px; margin-top: 4px; }

/* ── タスクバー ───────────────────────────────────────────────────────────── */
.taskbar {
  position: absolute; left: 0; right: 0; bottom: 0; height: 48px;
  display: flex; align-items: center; gap: 8px; padding: 0 10px;
  background: var(--pn9); backdrop-filter: blur(10px);
  border-top: 1px solid var(--bd0);
  z-index: 100; /* ウィジェット(z:2)やウィンドウより上。上方向に開くメニューが隠れないように */
}
.tb-start { font-size: 14px; font-weight: 700; padding: 0 8px; white-space: nowrap; }
.tb-start-btn { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; height: 34px; padding: 0 12px;
  background: var(--rz0); border: 1px solid var(--bd1); border-radius: 8px; color: var(--tx0); cursor: pointer; font-size: 13px; font-weight: 600; }
.tb-start-btn:hover { background: var(--hv2); }
.tb-start-on { background: #7c6cf8; border-color: #7c6cf8; color: #fff; }
.tb-start-ico { font-size: 15px; }
.tb-install { flex: 0 0 auto; height: 30px; padding: 0 12px; border-radius: 8px; background: #22d3a522; border: 1px solid var(--gn0); color: var(--gn0); cursor: pointer; font-size: 12px; font-weight: 600; white-space: nowrap; }
.tb-install:hover { background: var(--gn0); color: var(--gnb2); }
.tb-wins { flex: 1; display: flex; gap: 6px; overflow-x: auto; }

/* ── ランチャー（スタートメニュー） ──────────────────────────────────────────── */
.lnch-bg { position: absolute; inset: 0; z-index: 90; }
.lnch { position: absolute; left: 8px; bottom: 56px; width: 440px; max-width: calc(100vw - 16px); max-height: calc(100vh - 72px);
  display: flex; flex-direction: column; background: var(--pn0); border: 1px solid var(--bd1); border-radius: 14px;
  box-shadow: 0 18px 60px rgba(0,0,0,.6); backdrop-filter: blur(12px); overflow: hidden; }
.lnch-head { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--bd0); }
.lnch-title { font-size: 14px; font-weight: 700; color: var(--tx0); }
.lnch-close { width: 26px; height: 26px; border: none; background: transparent; color: var(--mu0); font-size: 18px; cursor: pointer; border-radius: 6px; }
.lnch-close:hover { background: var(--hv2); color: var(--hv-tx); }
.lnch-body { padding: 12px 14px; overflow-y: auto; }
.lnch-sec-label { font-size: 11px; color: var(--mu0); letter-spacing: .04em; margin: 6px 2px 8px; }
.lnch-apps { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px; margin-bottom: 14px; }
.lnch-app { display: flex; align-items: center; gap: 6px; background: var(--sf5); border: 1px solid var(--bd0); border-radius: 9px; padding: 6px 8px; }
.lnch-app-main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; background: transparent; border: none; color: var(--tx0); cursor: pointer; text-align: left; padding: 2px; }
.lnch-app-ico { font-size: 20px; flex: 0 0 auto; }
.lnch-app-name { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lnch-chip { flex: 0 0 auto; font-size: 10px; padding: 3px 8px; border-radius: 6px; background: var(--rz0); border: 1px solid var(--bd1); color: var(--tx7); cursor: pointer; white-space: nowrap; }
.lnch-chip:hover { background: var(--hv2); color: var(--hv-tx); }
.lnch-chip-on { background: #22d3a522; border-color: var(--gn0); color: var(--gn0); }
.lnch-widgets { display: flex; flex-direction: column; gap: 6px; }
.lnch-wg { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--sf5); border: 1px solid var(--bd0); border-radius: 9px; padding: 8px 10px; }
.lnch-wg-info { display: flex; align-items: center; gap: 8px; min-width: 0; }
.lnch-wg-text { min-width: 0; }
.lnch-wg-title { font-size: 13px; color: var(--tx0); display: flex; align-items: center; gap: 6px; }
.lnch-wg-added { font-size: 9px; color: var(--gn0); background: #22d3a522; border-radius: 999px; padding: 1px 6px; }
.lnch-wg-app { font-size: 10px; color: var(--mu0); }
.lnch-sizes { display: flex; gap: 4px; flex: 0 0 auto; }
.lnch-size { width: 30px; height: 28px; border-radius: 6px; background: var(--rz0); border: 1px solid var(--bd1); color: var(--tx2); cursor: pointer; font-size: 12px; }
.lnch-size:hover { background: var(--hv2); color: var(--hv-tx); }
.lnch-size-on { background: #7c6cf8; border-color: #7c6cf8; color: #fff; }
.lnch-empty { font-size: 12px; color: var(--mu0); padding: 8px; }
.lnch-foot { padding: 10px 14px; border-top: 1px solid var(--bd0); }
.lnch-reset { width: 100%; padding: 8px; border-radius: 8px; background: var(--rz0); border: 1px solid var(--bd1); color: var(--tx7); cursor: pointer; font-size: 12px; }
.lnch-reset:hover { background: #c0392b; border-color: #c0392b; color: #fff; }

/* 大きい数字ウィジェット（小サイズ用） */
.wg-big { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; gap: 2px; }
.wg-big-num { font-size: 34px; font-weight: 800; color: var(--tx0); line-height: 1; }
.wg-big-label { font-size: 12px; color: var(--tx2); }
.wg-big-sub { font-size: 10px; color: var(--mu0); }
.wg-more { font-size: 11px; color: var(--mu0); padding: 4px 2px; }
/* メンバー稼働状況 中サイズ（コンパクト） */
.mw-compact { display: flex; flex-direction: column; gap: 4px; }
.mw-crow { display: flex; align-items: center; gap: 7px; padding: 4px 8px; background: var(--pn8); border-left: 3px solid #7c6cf8; border-radius: 6px; min-width: 0; }
.mw-cname { flex: 1; min-width: 0; font-size: 12px; color: var(--tx0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mw-cbadge { font-size: 10px; padding: 1px 6px; border-radius: 999px; flex: 0 0 auto; }
.mw-ccount { font-size: 11px; color: var(--mu1); flex: 0 0 auto; }
.mw-chip-sm { font-size: 10px; padding: 2px 7px; }
.tb-win {
  display: flex; align-items: center; gap: 6px;
  height: 34px; padding: 0 12px; max-width: 180px;
  background: var(--sf7); border: 1px solid var(--bd1); border-radius: 8px;
  color: var(--tx6); font-size: 12px; cursor: pointer;
}
.tb-win:hover { background: var(--rz6); }
.tb-win-active { background: var(--hv2); border-color: var(--hv0); }
.tb-win-min { opacity: .6; }
.tb-win-txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tb-right { display: flex; align-items: center; gap: 10px; padding-right: 4px; flex: 0 0 auto; }
.tb-logout {
  width: 32px; height: 32px; border: 1px solid var(--bd1); border-radius: 8px;
  background: var(--sf7); color: var(--tx6); cursor: pointer; font-size: 15px;
}
.tb-logout:hover { background: #c0392b; color: #fff; border-color: #c0392b; }

/* ── デスクトップ・ウィジェット ───────────────────────────────────────────── */
/* アイコンと同じグリッド領域に重ねる（マス座標の原点を一致させる） */
.widget-layer { position: absolute; top: 16px; left: 16px; right: 16px; bottom: 56px; z-index: 2; pointer-events: none; }
.widget-layer > * { pointer-events: auto; }
.wg-launcher-wrap { position: absolute; top: 0; right: 104px; z-index: 3; }
.wg-launcher { font-size: 11px; padding: 5px 10px; border-radius: 8px; background: var(--pn5); border: 1px solid var(--bd1); color: var(--tx7); cursor: pointer; white-space: nowrap; }
.wg-launcher:hover { background: var(--hv2); color: var(--hv-tx); }
.wg-menu-bg { position: fixed; inset: 0; z-index: 40; }
.wg-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 41; width: 280px; max-height: 60vh; overflow-y: auto;
  background: var(--sf5); border: 1px solid var(--bd1); border-radius: 10px; padding: 6px; box-shadow: 0 14px 40px rgba(0,0,0,.55); }
.wg-menu-item { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 7px; cursor: pointer; font-size: 12px; color: var(--tx1); }
.wg-menu-item:hover { background: var(--rz6); }
.wg-menu-ico { flex: 0 0 auto; }
.wg-menu-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wg-menu-app { font-size: 10px; color: var(--mu0); flex: 0 0 auto; }

.widget { position: absolute; background: var(--pn3); border: 1px solid var(--bd1); border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.4); overflow: hidden; display: flex; flex-direction: column; backdrop-filter: blur(6px); }
.widget-drag { opacity: .9; z-index: 9; box-shadow: 0 16px 44px rgba(0,0,0,.55); }
.widget-head { display: flex; align-items: center; gap: 7px; padding: 8px 10px; background: linear-gradient(180deg,var(--rz4),var(--rz0));
  border-bottom: 1px solid var(--bd1); cursor: move; user-select: none; flex: 0 0 auto; }
.widget-ico { flex: 0 0 auto; }
.widget-title { flex: 1; min-width: 0; font-size: 12px; font-weight: 600; color: var(--tx0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* ウィジェットのタイトル→アプリを開く（クリック可能の手がかり） */
.widget-title-link { cursor: pointer; }
.widget-title-link:hover { color: var(--hv-tx); text-decoration: underline; text-underline-offset: 2px; }
/* 自動起動トグル（ウィンドウ/ランチャー/スマホ全画面） */
.win-auto-on { color: var(--yl2); }
.lnch-auto { flex: 0 0 auto; width: 28px; height: 28px; border: 1px solid var(--bd1); border-radius: 6px; background: var(--rz0); color: var(--mu0); cursor: pointer; font-size: 13px; }
.lnch-auto:hover { background: var(--hv2); color: var(--hv-tx); }
.lnch-auto-on { color: var(--yl2); border-color: var(--yl2); }
.m-fs-auto { width: 48px; background: transparent; border: none; color: var(--mu0); font-size: 19px; cursor: pointer; }
.m-fs-auto-on { color: var(--yl2); }
.wg-x { flex: 0 0 auto; width: 22px; height: 22px; border: none; background: transparent; color: var(--mu0); font-size: 15px; cursor: pointer; border-radius: 6px; }
.wg-x:hover { background: #c0392b; color: #fff; }
.widget-body { flex: 1; overflow-y: auto; padding: 8px 10px; }
.wg-badge { font-size: 10px; padding: 1px 7px; border-radius: 999px; margin-left: 6px; font-weight: 700; }
.wg-msg { font-size: 12px; color: var(--mu1); padding: 12px 4px; text-align: center; }
.wg-err { color: var(--rd1); }
.wg-off { color: var(--yl3); }
.wg-list { display: flex; flex-direction: column; gap: 3px; }
.wg-summary { font-size: 11px; color: var(--mu1); margin-bottom: 4px; }
.wg-summary b { color: var(--tx0); }
.wg-row { display: flex; align-items: center; gap: 7px; font-size: 12px; padding: 3px 2px; min-width: 0; }
.wg-row:hover { background: var(--hl1); border-radius: 5px; }
.wg-dot { width: 7px; height: 7px; border-radius: 50%; flex: 0 0 auto; }
.wg-row-title { flex: 1; min-width: 0; color: var(--tx0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wg-due { font-size: 11px; flex: 0 0 auto; white-space: nowrap; }
.wg-when { font-size: 11px; color: var(--ac1); flex: 0 0 auto; min-width: 52px; }
.wg-notify { display: flex; flex-direction: column; gap: 8px; }
.wg-notify-row { display: flex; align-items: center; gap: 10px; }
.wg-notify-ico { font-size: 16px; }
.wg-notify-label { flex: 1; font-size: 12px; color: var(--tx2); }
.wg-notify-n { font-size: 16px; font-weight: 700; color: var(--tx0); }
.wg-notify-n small { font-size: 11px; font-weight: 400; color: var(--mu0); }
.wg-notify-off { font-size: 11px; color: var(--yl3); }

/* メンバー稼働状況ウィジェット（旧ホーム踏襲） */
.mw { display: flex; flex-direction: column; gap: 10px; }
.mw-summary { display: flex; flex-wrap: wrap; gap: 12px; font-size: 11px; color: var(--mu1); align-items: center; }
.mw-summary b { color: var(--tx0); }
.mw-ok { color: var(--gn0); }
.mw-warn { color: var(--rd0); }
.mw-alert { padding: 8px 12px; background: #f8717122; border: 1px solid var(--rd0); border-radius: 8px; font-size: 12px; color: var(--rd0); }
.mw-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.mw-card { background: var(--pn7); border: 1px solid var(--bd0); border-left: 3px solid #7c6cf8; border-radius: 10px; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.mw-head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mw-id { flex: 1; min-width: 0; }
.mw-name { font-size: 13px; font-weight: 600; color: var(--tx0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mw-role { font-size: 10px; color: var(--mu0); }
.mw-chip { font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 10px; white-space: nowrap; flex: 0 0 auto; }
.mw-counts { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mw-muted { font-size: 11px; color: var(--mu0); }
.mw-muted b { color: var(--tx0); }
.mw-badge { font-size: 10px; padding: 2px 7px; border-radius: 10px; white-space: nowrap; }
.mw-preview { border-top: 1px solid var(--bd0); padding-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.mw-prow { display: flex; align-items: center; gap: 6px; font-size: 11px; min-width: 0; }
.mw-clock { width: 14px; text-align: center; flex: 0 0 auto; }
.mw-ptitle { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--tx0); }
.mw-pdate { white-space: nowrap; flex: 0 0 auto; }

/* 共通アバター（base64/パス/URL→img, それ以外→絵文字。生テキスト出力しない） */
.av-img { border-radius: 50%; object-fit: cover; display: block; flex: 0 0 auto; }
.av-emoji { line-height: 1; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; }

/* タスクバーのユーザー（アバター＋名前→クリックでメニュー） */
.tb-user-wrap { position: relative; flex: 0 0 auto; }
.tb-user { display: inline-flex; align-items: center; gap: 7px; max-width: 190px;
  background: transparent; border: 1px solid transparent; border-radius: 8px; padding: 4px 8px;
  color: var(--tx7); cursor: pointer; }
.tb-user:hover { background: var(--rz6); border-color: var(--bd1); }
.tb-me-name { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 120px; }
.tb-caret { font-size: 9px; color: var(--mu0); flex: 0 0 auto; }
.tb-menu-bg { position: fixed; inset: 0; z-index: 60; }
.tb-menu { position: absolute; bottom: calc(100% + 8px); right: 0; z-index: 61; min-width: 250px; max-width: 300px;
  max-height: 70vh; overflow-y: auto;
  background: var(--sf5); border: 1px solid var(--bd1); border-radius: 10px; padding: 8px;
  box-shadow: 0 -10px 34px rgba(0,0,0,.55); }
.tb-menu-head { display: flex; align-items: center; gap: 10px; padding: 6px 8px 10px; border-bottom: 1px solid var(--bd0); margin-bottom: 6px; min-width: 0; }
.tb-menu-id { min-width: 0; }
.tb-menu-name { font-size: 13px; font-weight: 600; color: var(--tx0); max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-menu-sub { font-size: 11px; color: var(--mu0); max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-menu-sec { margin-bottom: 4px; }
.tb-menu-sec-label { font-size: 10px; color: var(--mu0); padding: 4px 8px 2px; letter-spacing: .03em; }
.tb-menu-divider { height: 1px; background: var(--bd0); margin: 6px 2px; }
.tb-menu-item { width: 100%; text-align: left; padding: 8px 10px; background: transparent; border: none; border-radius: 7px; color: var(--tx1); font-size: 13px; cursor: pointer; }
.tb-menu-item:hover { background: var(--hv2); }
.tb-menu-logout:hover { background: #c0392b; color: #fff; }

/* ── トースト ─────────────────────────────────────────────────────────────── */
.dsm-toast {
  position: absolute; left: 50%; bottom: 64px; transform: translateX(-50%);
  background: var(--pn1); border: 1px solid var(--bd1);
  padding: 10px 18px; border-radius: 10px; font-size: 13px;
  box-shadow: 0 10px 30px rgba(0,0,0,.5);
}

/* ── ゲームサーバアプリ (gsmon) ─────────────────────────────────────────── */
.gs-root { display: flex; flex-direction: column; height: 100%; }
.gs-stale { font-size: 11px; color: var(--yl1); margin-right: 8px; }
.gs-list { flex: 1; overflow-y: auto; padding: 10px 14px; }
.gs-card { border: 1px solid var(--bd0); border-radius: 10px; padding: 10px 12px; margin-bottom: 10px; background: var(--sf6); }
.gs-srv { display: flex; align-items: center; gap: 8px; }
.gs-srv-name { font-weight: 700; font-size: 14px; }
.gs-online { font-size: 11px; padding: 1px 8px; border-radius: 9px; }
.gs-online-on { background: var(--gnb0); color: var(--gn1); }
.gs-online-off { background: var(--rdb4); color: var(--rd2); }
.gs-sys { font-size: 11px; color: var(--mu0); margin: 2px 0 6px; }
.gs-svc { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-top: 1px solid var(--rz2); }
.gs-svc-name { flex: 1; min-width: 0; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-badge { font-size: 11px; padding: 1px 8px; border-radius: 9px; white-space: nowrap; }
.gs-badge-run { background: var(--gnb0); color: var(--gn1); }
.gs-badge-err { background: var(--rdb2); color: var(--rd3); }
.gs-badge-pend { background: var(--ylb1); color: var(--yl1); }
.gs-badge-etc { background: var(--rz4); color: var(--mu2); }
.gs-players { font-size: 11px; color: var(--mu0); min-width: 32px; text-align: right; }
.gs-lastres { font-size: 11px; color: var(--rd2); padding: 2px 0 4px; }
.gs-card-off { border-color: var(--rdb0); box-shadow: inset 3px 0 0 var(--rdb0); }
.gs-card-off .gs-sys, .gs-card-off .gs-svc, .gs-card-off .gs-lastres { opacity: .55; }
.gs-info { font-size: 10px; color: var(--mu3); margin: -3px 0 3px; padding-left: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* gsmon デスクトップウィジェット */
.gs-w-list { display: flex; flex-direction: column; gap: 6px; }
.gs-w-srv { border: 1px solid var(--bd0); border-radius: 8px; padding: 5px 8px; background: var(--sf6); }
.gs-w-srv-off { border-color: var(--rdb0); }
.gs-w-name { font-size: 12px; font-weight: 700; display: flex; align-items: center; gap: 6px; }
.gs-w-warn { font-size: 10px; padding: 0 6px; border-radius: 8px; background: var(--rdb4); color: var(--rd2); font-weight: 400; }
.gs-w-svc { font-size: 11px; color: var(--tx2); padding: 1px 0 0 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-w-none { color: var(--mu0); }
/* テンプレート選択 */
.tp-backdrop { position: fixed; inset: 0; background: var(--ov0); z-index: 9500; display: flex; align-items: center; justify-content: center; padding: 16px; }
.tp-panel { background: var(--sf0); border: 1px solid var(--bd0); border-radius: 12px; max-width: 860px; width: 100%; max-height: 86vh; overflow-y: auto; padding: 16px 18px; box-shadow: 0 16px 48px rgba(0,0,0,.5); }
.tp-head { display: flex; align-items: center; gap: 8px; }
.tp-title { font-size: 15px; font-weight: 700; flex: 1; }
.tp-close { background: none; border: none; color: var(--mu0); font-size: 20px; cursor: pointer; padding: 0 4px; }
.tp-note { font-size: 12px; color: var(--mu0); margin: 4px 0 8px; }
.tp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin-top: 10px; }
.tp-card { background: var(--sf5); border: 1px solid var(--bd0); border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 4px; }
.tp-card-head { display: flex; align-items: center; gap: 8px; }
.tp-card-ico { font-size: 20px; }
.tp-card-name { font-weight: 700; font-size: 14px; }
.tp-desc { font-size: 11px; color: var(--mu1); }
.tp-sec { font-size: 10px; color: var(--mu4); margin-top: 6px; }
.tp-apps { display: flex; flex-wrap: wrap; gap: 4px; }
.tp-app { font-size: 10px; background: var(--rz2); border-radius: 6px; padding: 1px 6px; white-space: nowrap; }
.tp-apply { margin-top: 10px; }
.tp-foot { display: flex; justify-content: center; margin-top: 12px; }
/* 4コマ管理アプリ */
.yk-root { display: flex; flex-direction: column; height: 100%; }
.yk-body { flex: 1; overflow-y: auto; padding: 14px 18px; display: flex; flex-direction: column; gap: 14px; }
.yk-sec { background: var(--sf5); border: 1px solid var(--bd0); border-radius: 10px; padding: 14px 16px; }
.yk-sec-title { font-size: 13px; font-weight: 700; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.yk-tabs { margin-left: auto; display: flex; gap: 6px; }
.yk-form { display: flex; flex-direction: column; gap: 8px; max-width: 560px; }
.yk-title { resize: vertical; }
.yk-msg { font-size: 12px; color: var(--tx2); }
.yk-draft { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-top: 1px solid var(--bd0); }
.yk-thumb { width: 72px; height: 72px; object-fit: cover; object-position: top; border-radius: 8px; border: 1px solid var(--bd0); background: var(--rz0); }
.yk-draft-info { flex: 1; min-width: 0; }
.yk-draft-title { font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.yk-draft-sub { font-size: 11px; color: var(--mu0); }
.yk-draft-btns { display: flex; gap: 6px; flex-wrap: wrap; }
.yk-frame { width: 100%; height: 520px; border: 1px solid var(--bd0); border-radius: 8px; background: #fff; }
.yk-diffs { display: flex; flex-direction: column; gap: 8px; }
.yk-diff-file { font-size: 12px; font-weight: 700; color: var(--tx2); }
.yk-diff { font-size: 11px; background: var(--rz0); border: 1px solid var(--bd0); border-radius: 8px; padding: 8px 10px; overflow-x: auto; max-height: 260px; color: var(--tx1); white-space: pre-wrap; }
.yk-note { font-size: 11px; color: var(--mu0); }
.yk-draft-wrap { border-top: 1px solid var(--bd0); }
.yk-draft-wrap .yk-draft { border-top: none; }
.yk-stage-urls { font-size: 12px; color: var(--tx2); padding: 0 0 8px 84px; }
.yk-stage-urls a { color: var(--bl0); text-decoration: underline; }
.yk-testenv { display: flex; flex-direction: column; gap: 8px; }
.yk-testenv-row { display: flex; align-items: center; gap: 10px; font-size: 13px; flex-wrap: wrap; }
.yk-testenv-row a { color: var(--bl0); text-decoration: underline; }

/* ── タスク管理 2026-08-28 追加: 並べ替え（列見出しクリック＋昇順/降順トグル） ──
   新クラスのみ。既存クラスは変更していないので、旧バンドル(prod)の見た目には影響しない。 */
.tk-sort { display: inline-flex; align-items: center; gap: 4px; }
.tk-sortdir { padding: 5px 9px; background: var(--sf9); border: 1px solid var(--bd2); border-radius: 7px; color: var(--tx1); font-size: 11px; line-height: 1.4; cursor: pointer; white-space: nowrap; }
.tk-sortdir:hover { background: var(--hv2); border-color: var(--hv0); color: var(--hv-tx); }
.tk-sortdir-off { opacity: .4; cursor: default; }
.tk-sortdir-off:hover { background: var(--sf9); border-color: var(--bd2); color: var(--tx1); }
/* 並べ替え可能な列見出し */
.tk-th-sort { cursor: pointer; user-select: none; white-space: nowrap; }
.tk-th-sort:hover { background: var(--hl2); color: var(--tx1); }
.tk-th-arw { margin-left: 4px; font-size: 9px; opacity: .3; }
.tk-th-sort:hover .tk-th-arw { opacity: .65; }
.tk-th-on { color: var(--tx0); }
.tk-th-on .tk-th-arw { opacity: 1; color: #7c6cf8; }
/* プロジェクト個別の並べ替えが効いているときの注記 */
.tk-sortnote { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 0 2px 6px; font-size: 11px; color: var(--mu0); }
.tk-sortnote-btn { padding: 2px 8px; background: var(--rz4); border: 1px solid var(--bd3); border-radius: 6px; color: var(--tx1); font-size: 11px; cursor: pointer; }
.tk-sortnote-btn:hover { background: var(--hv2); color: var(--hv-tx); }
/* 見出しに並べ替え矢印が入る分の列幅調整 */
.tk-ttable2 .tk-col-prio { width: 64px; }
.tk-ttable2 .tk-col-asg { width: 100px; }