/* クラウドソーシング案件のカード（#cs）。⭐ オーナーの /jobs-watch と外注のマイページで**同じ1枚**を使う。
   ⛔ 画面ごとに書き写さない（2026-09-27 代表「新たに作らずにオーナーの画面と同じUIに」）。
   ⚠️ マイページには別の .card / .hint があるので、全部 #cs の下に閉じ込めている。 */
#cs.card{background:#fff;border:1px solid #dce7e2;border-radius:14px;overflow:hidden;padding:0;margin:0}
#cs .lead.in{color:#71807b;margin:0;padding:12px 16px;border-bottom:1px solid #edf1ef;font-size:12px;line-height:1.9}
#cs .tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:10px;background:#f5faf8;border-bottom:1px solid #dce7e2}
#cs .tabs.three{grid-template-columns:repeat(3,1fr)}
#cs .tab{position:relative;appearance:none;border:1px solid transparent;border-radius:8px;padding:9px 4px;background:transparent;color:#71807b;font:inherit;font-size:12px;font-weight:bold;cursor:pointer;line-height:1.35}
#cs .tab b{display:block;font-size:17px;color:#26302f}
#cs .tab[aria-selected="true"]{background:#fff;border-color:#dce7e2;color:#238f7b}
#cs .tab[aria-selected="true"] b{color:#238f7b}
#cs .badge{position:absolute;top:2px;right:6px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#e0544a;color:#fff;font-size:11px;line-height:18px;text-align:center}
#cs .bar{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid #edf1ef;font-size:12px;color:#71807b}
#cs .bar[hidden]{display:none}
#cs .bar input{border:1px solid #dce7e2;border-radius:8px;padding:6px 8px;font:inherit}
#cs .cp{appearance:none;background:#edf8f3;border:1px solid #cfe6dd;border-radius:7px;color:#1d7866;font:inherit;font-size:13px;font-weight:bold;padding:5px 10px;cursor:pointer;white-space:nowrap}
#cs .cp:hover{background:#ddf0e8}
#cs .cp.mini{font-size:11px;padding:3px 7px}
#cs .off{color:#9aa8a3;font-size:12px}
#cs .freelancer-table-wrap{margin-top:0;border:0;border-radius:0}
#cs .freelancer-table-wrap td small{display:block;margin-top:3px;color:#9aa8a3;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#cs .freelancer-table-wrap td.truncate{max-width:26em}
#cs .freelancer-table-wrap td a{color:#26302f;font-weight:bold;text-decoration:none}
#cs .freelancer-table-wrap td a:hover{color:#238f7b;text-decoration:underline;text-underline-offset:3px}
#cs .act{background:#238f7b;border:0;border-radius:7px;color:#fff;font:inherit;font-size:12px;font-weight:bold;padding:6px 12px;cursor:pointer;white-space:nowrap}
#cs .act.undo{background:#fff;color:#9a4b43;border:1px solid #f0d5cf}
#cs .tag{display:inline-block;border-radius:999px;background:#e6f4f0;color:#1d7866;border:1px solid #dce7e2;font-size:10.5px;font-weight:bold;padding:2px 7px;line-height:1.3}
#cs .tag.w{background:#fdf2e6;color:#9a5b18;border-color:#f0dcc2}
#cs .empty{color:#71807b;padding:20px 16px;margin:0;font-size:13px}
#cs #msg{margin:10px 16px 0;color:#238f7b;font-size:12px;font-weight:bold}
#cs .foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;background:#fafcfb;border-top:1px solid #dce7e2;color:#71807b;font-size:12px}
#cs .foot button{background:#edf8f3;border:1px solid #dce7e2;border-radius:7px;color:#238f7b;font:inherit;font-size:12px;font-weight:bold;padding:6px 10px;cursor:pointer}
#cs .foot button:disabled{opacity:.4;cursor:default}