/* 社内ポータル デザインガイドライン準拠 共通デザインシステム (agency / www 共用)
   コバルト #2B47D6 / 影なし / 1pxヘアライン / 角丸6px(部品)・12px(カード) / 8pxグリッド /
   数字は tabular-nums / カード上のアクセントバー禁止 */
:root{
  --accent:#2B47D6; --accent-weak:#EAEDFB; --accent-dark:#2138b0;
  --ink:#16181D; --muted:#6B7280; --border:#E5E7EC; --surface:#F4F5F8; --bg:#FCFCFD;
  --success:#128A5E; --success-weak:#E6F4EE;
  --warn:#B7791F; --warn-weak:#FBF1DE;
  --error:#D14343; --error-weak:#FBEAEA;
  --radius:6px; --radius-lg:12px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:"Yu Gothic","YuGothic","Noto Sans JP",system-ui,sans-serif;
  font-size:14px;line-height:1.7;}

/* ---------- ヘッダー ---------- */
header.appbar{position:sticky;top:0;z-index:20;background:#fff;
  border-bottom:1px solid var(--border);padding:0 24px;display:flex;align-items:center;gap:28px;
  min-height:56px;}
header.appbar .brand{font-weight:700;color:var(--ink);font-size:15px;letter-spacing:-.01em;
  text-decoration:none;white-space:nowrap;}
header.appbar .brand:hover{text-decoration:none;color:var(--accent);}
header.appbar nav{display:flex;gap:4px;font-size:13px;flex:1;}
header.appbar nav a{color:var(--muted);text-decoration:none;padding:6px 12px;border-radius:var(--radius);
  white-space:nowrap;transition:background .1s,color .1s;}
header.appbar nav a:hover{background:var(--surface);color:var(--ink);text-decoration:none;}
header.appbar nav a.active{color:var(--accent);background:var(--accent-weak);font-weight:700;}
header.appbar .me{color:var(--muted);font-size:12px;white-space:nowrap;display:flex;align-items:center;gap:12px;}
header.appbar .me a{color:var(--accent);text-decoration:none;}
header.appbar .me a:hover{text-decoration:underline;}
header.appbar .menu-toggle{display:none;background:none;border:1px solid var(--border);
  border-radius:var(--radius);font-size:18px;line-height:1;padding:6px 10px;cursor:pointer;color:var(--ink);}

main{max-width:1040px;margin:32px auto 64px;padding:0 24px;}

/* ---------- 見出し ---------- */
h1{font-size:24px;font-weight:700;line-height:1.35;letter-spacing:-.02em;margin:0;}
h2{font-size:16px;font-weight:700;line-height:1.4;letter-spacing:-.01em;margin:32px 0 12px;}
.page-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:8px;}
.page-head .count{color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;}
.page-lead{color:var(--muted);font-size:13px;margin:0 0 24px;}
a{color:var(--accent);text-decoration:none;} a:hover{text-decoration:underline;}
.back-link{display:inline-block;font-size:13px;color:var(--muted);margin-bottom:12px;}
.back-link:hover{color:var(--accent);}
.num{font-variant-numeric:tabular-nums;letter-spacing:0;}
.muted{color:var(--muted);font-size:12px;}

/* ---------- タイル ---------- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:16px;}
.tile{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;
  text-decoration:none;color:var(--ink);display:block;transition:border-color .1s,background .1s;}
.tile:hover{border-color:var(--accent);background:var(--accent-weak);text-decoration:none;}
.tile .name{font-weight:700;margin:12px 0 4px;font-size:15px;}
.tile .desc{font-size:12px;color:var(--muted);line-height:1.6;}
.tile.soon{opacity:.5;pointer-events:none;}

/* ---------- アイコン（線画SVG・絵文字は使わない） ---------- */
.icon{width:20px;height:20px;stroke:currentColor;stroke-width:1.5;fill:none;
  stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:-4px;}
.icon-wrap{line-height:0;}
.tile .icon{width:26px;height:26px;color:var(--accent);vertical-align:top;}
.tile:hover .icon{color:var(--accent-dark);}
.tile.soon .icon{color:var(--muted);}
.empty .icon-wrap{margin-bottom:4px;}
.empty .icon{width:34px;height:34px;color:var(--muted);opacity:.6;stroke-width:1.25;}
.card-title .icon{width:16px;height:16px;margin-right:6px;color:var(--muted);}

/* ---------- カード ---------- */
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;margin:0 0 20px;}
.card.tight{padding:16px 20px;}
.card-title{font-size:13px;font-weight:700;color:var(--muted);margin:0 0 12px;}

/* ---------- ボタン ---------- */
.btn{display:inline-block;padding:9px 20px;background:var(--accent);color:#fff;border:1px solid var(--accent);
  border-radius:var(--radius);cursor:pointer;font-size:13px;font-weight:700;text-decoration:none;
  font-family:inherit;line-height:1.6;white-space:nowrap;}
.btn:hover{background:var(--accent-dark);border-color:var(--accent-dark);text-decoration:none;color:#fff;}
.btn.ghost{background:#fff;color:var(--ink);border-color:var(--border);}
.btn.ghost:hover{background:var(--surface);color:var(--ink);border-color:var(--muted);}
.btn.sm{padding:5px 12px;font-size:12px;}
.btn[disabled],.btn.disabled{background:var(--surface);color:var(--muted);border-color:var(--border);
  cursor:not-allowed;pointer-events:none;}

/* ---------- テーブル ---------- */
.table-wrap{background:#fff;border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;}
.table-scroll{overflow-x:auto;}
table.data{width:100%;border-collapse:collapse;font-size:13px;}
table.data th{background:var(--surface);text-align:left;font-size:11px;font-weight:700;color:var(--muted);
  padding:10px 14px;border-bottom:1px solid var(--border);white-space:nowrap;letter-spacing:.02em;}
table.data td{padding:12px 14px;border-bottom:1px solid var(--border);vertical-align:middle;}
table.data tbody tr:last-child td{border-bottom:0;}
table.data tbody tr:hover{background:var(--accent-weak);}
table.data td.num,table.data th.num{font-variant-numeric:tabular-nums;white-space:nowrap;}
table.data td.right,table.data th.right{text-align:right;}
table.data td.strong{font-weight:700;}
table.data .sub{display:block;color:var(--muted);font-size:11px;margin-top:2px;}
/* 定義リスト風テーブル(詳細画面) */
table.kv{width:100%;border-collapse:collapse;font-size:13px;}
table.kv th{width:132px;text-align:left;font-weight:400;color:var(--muted);font-size:12px;
  padding:8px 0;vertical-align:top;}
table.kv td{padding:8px 0 8px 16px;vertical-align:top;}
table.kv tr+tr th,table.kv tr+tr td{border-top:1px solid var(--border);}

/* ---------- バッジ ---------- */
.badge{display:inline-block;font-size:11px;border-radius:20px;padding:3px 10px;
  background:var(--surface);color:var(--muted);white-space:nowrap;line-height:1.5;}
.badge.success{background:var(--success-weak);color:var(--success);}
.badge.warn{background:var(--warn-weak);color:var(--warn);}
.badge.error{background:var(--error-weak);color:var(--error);}
.badge.accent{background:var(--accent-weak);color:var(--accent);}

/* ---------- フォーム ---------- */
form.filter{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;}
form.filter .field{display:flex;flex-direction:column;gap:4px;}
form.filter .field.grow{flex:1;min-width:200px;}
form.filter label{font-size:11px;color:var(--muted);font-weight:700;}
input[type=date],input[type=text],input[type=email],input[type=search],select,textarea{
  border:1px solid var(--border);border-radius:var(--radius);padding:8px 10px;font:inherit;font-size:13px;
  background:#fff;color:var(--ink);min-height:36px;}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent-weak);outline-offset:0;
  border-color:var(--accent);}
textarea{width:100%;}
.radio-row{display:flex;gap:16px;flex-wrap:wrap;}
.radio-row label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ink);font-weight:400;}
.filter-actions{display:flex;gap:8px;align-items:center;}
.applied{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;align-items:center;}
.applied .chip{background:var(--accent-weak);color:var(--accent);border-radius:20px;
  padding:3px 10px;font-size:11px;}

/* ---------- 空状態 ---------- */
.empty{text-align:center;padding:56px 24px;color:var(--muted);}
.empty .title{font-size:14px;font-weight:700;color:var(--ink);margin:12px 0 4px;}
.empty .desc{font-size:12px;}

/* ---------- その他 ---------- */
footer.site{max-width:1040px;margin:56px auto 32px;padding:16px 24px 0;color:var(--muted);font-size:11px;
  border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.messages{list-style:none;padding:0;margin:0 0 20px;}
.messages li{border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;margin-bottom:8px;
  font-size:13px;}
.messages li.error{background:var(--error-weak);border-color:var(--error);color:var(--error);}
.pager{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:20px;font-size:13px;}
.pager .current{color:var(--muted);font-variant-numeric:tabular-nums;}

/* ---------- モバイル ---------- */
@media (max-width:820px){
  header.appbar{flex-wrap:wrap;padding:8px 16px;gap:12px;}
  header.appbar .menu-toggle{display:block;order:2;margin-left:auto;}
  header.appbar .brand{order:1;font-size:14px;}
  header.appbar nav{order:3;flex-basis:100%;display:none;flex-direction:column;gap:0;padding-bottom:8px;}
  header.appbar.open nav{display:flex;}
  header.appbar nav a{padding:10px 8px;border-bottom:1px solid var(--border);border-radius:0;}
  header.appbar .me{order:4;flex-basis:100%;display:none;padding-bottom:8px;}
  header.appbar.open .me{display:flex;}
  main{margin:20px auto 40px;padding:0 16px;}
  h1{font-size:20px;}
  form.filter .field.grow{min-width:100%;}
  table.kv th{width:96px;}
}