/* USVDA.com — 提案スライドの配色（紺・青・水色）に合わせる */
:root {
  --navy: #1f4e79; --blue: #2f80c4; --sky: #7db8e0; --amber: #f2c94c;
  --green: #2e8b57; --gray: #e8ecf1; --text: #1a2733; --muted: #6b7a89;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: "Hiragino Sans", "Noto Sans JP", "Yu Gothic UI",
  "Meiryo", sans-serif; color: var(--text); background: #f4f7fa;
  font-size: 15px; line-height: 1.7; -webkit-font-smoothing: antialiased; }
main { max-width: 1280px; margin: 0 auto; padding: 1.8em 1.6em 3em; }
footer { text-align: center; color: var(--muted); font-size: .8em; padding: 2em 1em; }
a { color: var(--blue); text-decoration: none; }
h1 { color: var(--navy); font-size: 1.55em; margin: .2em 0; letter-spacing: .01em; }
h2 { color: var(--navy); font-size: 1.05em; margin: 0 0 .9em;
  padding-bottom: .5em; border-bottom: 1px solid var(--gray); letter-spacing: .01em; }

.topbar { display: flex; align-items: center; gap: 1.6em; background: var(--navy);
  color: #fff; padding: .85em 1.6em; box-shadow: 0 1px 4px rgba(23,43,64,.15); }
.topbar .brand { color: #fff; font-weight: 700; font-size: 1.2em; }
.topbar .brand span { color: var(--sky); }
.topbar nav a { color: #dbe9f5; margin-right: 1em; }
.topbar .userbox { margin-left: auto; font-size: .85em; color: #dbe9f5; }
.topbar .userbox a { color: #fff; margin-left: .8em; }

.page-head { display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: .5em; }
.subnav a { margin-left: .8em; }

.kpi-row { display: flex; gap: .8em; flex-wrap: wrap; margin: 1em 0; }
.kpi { flex: 1 1 96px; min-width: 100px; background: #fff; border: 1px solid #e3e9ef;
  border-radius: 12px; padding: 1.1em .7em; text-align: center;
  box-shadow: 0 1px 2px rgba(23,43,64,.04); }
.kpi b { display: block; font-size: 1.8em; color: var(--navy); line-height: 1.15; }
.kpi span { display: block; font-size: .78em; color: var(--muted);
  /* 「VDAによる削減見込」が「込」だけ改行されるのを防ぐ */
  word-break: keep-all; overflow-wrap: normal; line-height: 1.35; }
/* 金額のカードは桁が多いので、件数のカードより広い幅を確保する */
.kpi-money, .kpi-save { flex: 2 1 190px; min-width: 178px; }
.kpi-money b, .kpi-save b { font-size: 1.3em; white-space: nowrap; }

.tile-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
  gap: .5em; margin: 1em 0; }
.tile { display: block; text-align: center; padding: .8em 0; border-radius: 8px;
  font-weight: 700; color: #fff; }
.st-paid { background: var(--green); }
.st-agreed { background: var(--navy); }
.st-submitted { background: var(--sky); }
.st-preparing { background: var(--amber); color: #5a4500; }
.st-not_started { background: #b9c4cf; }
.st-closed { background: #8898a8; }
.st-none { background: var(--gray); color: var(--muted); font-weight: 400; }

.legend { display: flex; gap: .6em; flex-wrap: wrap; font-size: .8em; margin: .6em 0 1.4em; }
.legend .lg { padding: .25em .7em; border-radius: 5px; color: #fff; }
.legend .st-none, .legend .st-preparing { color: var(--text); }

.badge { padding: .2em .6em; border-radius: 5px; color: #fff; font-size: .78em; }
.badge.st-preparing { color: #5a4500; }

.role { padding: .15em .55em; border-radius: 4px; font-size: .78em; color: #fff; }
.role-opti { background: var(--navy); }
.role-customer { background: #c0392b; }
.role-us_firm { background: #7f8c8d; }

table.data { width: 100%; border-collapse: collapse; background: #fff;
  border: 1px solid var(--gray); }
table.data { border-radius: 10px; overflow: hidden; border-color: #e3e9ef; }
table.data th { background: #f7f9fb; color: var(--navy); padding: .8em 1em;
  text-align: left; font-size: .82em; font-weight: 700; letter-spacing: .02em;
  border-bottom: 2px solid #e3e9ef; }
table.data td { padding: .8em 1em; border-top: 1px solid #eef2f6; font-size: .9em; }
table.data tr:hover td { background: #fafcfe; }
table.kv th { text-align: left; color: var(--muted); font-weight: 500;
  padding: .3em .8em .3em 0; vertical-align: top; white-space: nowrap; }
tr.row-vda { background: #eef7ee; }
tr.row-done { opacity: .55; }

.panel { background: #fff; border: 1px solid #e3e9ef; border-radius: 12px;
  padding: 1.5em 1.7em; margin: 1.2em 0; box-shadow: 0 1px 2px rgba(23,43,64,.04); }
.cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1em; }
@media (max-width: 800px) { .cols { grid-template-columns: 1fr; } }

.stack-form label { display: block; margin: .5em 0; font-size: .88em; }
.stack-form input, .stack-form select, .inline-form select {
  padding: .35em .5em; border: 1px solid #c4d0dc; border-radius: 6px; font-size: .95em; }
.calc-form label { display: inline-block; margin: .3em .6em .3em 0; font-size: .85em; }
.calc-form input { width: 110px; padding: .35em .5em; border: 1px solid #c4d0dc;
  border-radius: 6px; }
.btn { background: #fff; border: 1px solid #c9d6e2; color: var(--text);
  padding: .62em 1.4em; border-radius: 8px; cursor: pointer; font-size: .92em;
  font-family: inherit; transition: .12s; }
.btn:hover { background: #f4f8fc; border-color: var(--blue); }
.btn-primary { background: var(--blue); color: #fff; border-color: var(--blue); }
.btn-primary:hover { background: #276ba6; border-color: #276ba6; }

.timeline { list-style: none; padding: 0; }
.timeline li { padding: .35em 0; border-bottom: 1px dashed var(--gray); font-size: .9em; }
.muted { color: var(--muted); }

.login-card { max-width: 420px; margin: 8vh auto; background: #fff; text-align: center;
  border: 1px solid var(--gray); border-radius: 12px; padding: 2.5em 2em; }
.login-card h1 { font-size: 2em; }
.login-card .accent { color: var(--blue); }
.login-card .btn { display: inline-block; margin: 1em 0; }

/* ガント */
.g-wrap { background: #fff; border: 1px solid var(--gray); border-radius: 10px;
  padding: .6em .8em; margin: 1em 0; max-height: 70vh; overflow-y: auto; }
.g-row { display: flex; align-items: center; min-height: 1.75em; }
.g-label { width: 210px; flex-shrink: 0; font-size: .85em; padding-right: .6em; }
/* タスク名の行。州の見出しより一段下げて字を小さくする */
.g-task-label { font-size: .78em; color: var(--muted); padding-left: 1em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-group { margin-top: .35em; }
.g-group .g-label { font-weight: 700; display: flex; align-items: center; gap: .4em; }
.g-group .g-track { background: none; border-bottom: 1px solid #cfd8e0; }
.g-track { position: relative; flex: 1; height: 1.55em; background: #fff;
  border-bottom: 1px solid #eef2f6; overflow: hidden; }
.g-axis { position: sticky; top: 0; background: #fff; z-index: 2; }
.g-axis .g-track { background: none; border: none; height: 1.4em; }
.g-month { position: absolute; font-size: .7em; color: var(--muted);
  border-left: 1px solid #d7dee6; padding-left: 3px; height: 100%; }
.g-bar { position: absolute; top: .28em; height: 1em; border-radius: 4px; }
.g-bar.role-opti { background: var(--navy); }
.g-bar.role-customer { background: #c0392b; }
.g-bar.role-us_firm { background: #7f8c8d; }
.g-done { opacity: .35; }
.g-late { outline: 2px solid #e74c3c; outline-offset: 1px; }
.g-today { position: absolute; top: 0; bottom: 0; width: 2px;
  background: #c0392b; opacity: .55; }

.warn { color: #c0392b; }
td.warn { background: #fdeded; }
.ok { color: var(--green); font-size: .9em; }

/* 米国地図（州別VDA進捗） */
.map-wrap { background: #fff; border: 1px solid var(--gray); border-radius: 10px;
  padding: .5em; margin: 1em 0; }
.us-map { width: 100%; height: auto; display: block; }
.mp { stroke: #fff; stroke-width: 1; transition: opacity .12s; }
.us-map a:hover .mp { opacity: .72; }
.us-map a { cursor: pointer; }
.mp.st-paid { fill: var(--green); }
.mp.st-agreed { fill: var(--navy); }
.mp.st-submitted { fill: var(--sky); }
.mp.st-preparing { fill: var(--amber); }
.mp.st-not_started { fill: #b9c4cf; }
.mp.st-closed { fill: #8898a8; }
.mp.st-none { fill: #dde4ea; }
.mp.st-notax { fill: #f2f5f8; }
.mp-label { font-size: 11px; fill: #fff; text-anchor: middle; dominant-baseline: middle;
  pointer-events: none; font-weight: 600;
  paint-order: stroke; stroke: rgba(0,0,0,.3); stroke-width: 2px; }
/* 淡い塗りの州は白抜き文字だと読めないため、濃色＋白フチにする */
.mp-label.on-light { fill: #3d4d5c; stroke: rgba(255,255,255,.9); }
.legend .st-notax, .legend .st-none { color: var(--text); }
.lg.st-notax { background: #f2f5f8; }
.kpi-save { background: #eaf6ee; border-color: #b8ddc4; }
.kpi-save b { color: var(--green); }
.mp-lead { stroke: #9aabbb; stroke-width: 1; }

/* 看板（カンバン）ビュー */
.board { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8em; margin: 1em 0; }
@media (max-width: 900px) { .board { grid-template-columns: repeat(2, 1fr); } }
.bcol { background: #eef2f6; border: 1px solid var(--gray); border-radius: 10px;
  display: flex; flex-direction: column; min-height: 200px; }
.bcol.drop-on { background: #dceaf7; border-color: var(--blue); }
.bcol-head { display: flex; align-items: baseline; gap: .5em; padding: .6em .8em;
  border-radius: 9px 9px 0 0; color: #fff; }
.kb-before    { background: #8898a8; }
.kb-submitted { background: var(--sky); }
.kb-paid      { background: var(--navy); }
.kb-done      { background: var(--green); }
.bcol-title { font-weight: 700; }
.bcol-count { background: rgba(255,255,255,.28); border-radius: 10px;
  padding: 0 .5em; font-size: .8em; }
.bcol-sum { margin-left: auto; font-size: .78em; opacity: .95; }
.bcol-body { padding: .5em; display: flex; flex-direction: column; gap: .45em; flex: 1; }
.bcol-empty { color: var(--muted); font-size: .82em; text-align: center; margin: 1em 0; }
.bcard { background: #fff; border: 1px solid #d7dee6; border-radius: 8px;
  padding: .5em .65em; cursor: grab; }
.bcard.dragging { opacity: .45; }
.bcard-code { font-weight: 700; color: var(--navy); margin-right: .4em; }
.bcard-amt { font-size: .92em; color: var(--navy); margin-top: .25em; font-weight: 600; }
.bcard-due { font-size: .75em; color: var(--muted); margin-top: .15em; }
.bcard-due.overdue { color: #c0392b; font-weight: 600; }
.bcard-reg { font-size: .72em; color: var(--muted); }

/* PITRA ダッシュボード */
.page-head .sub { margin: .2em 0 0; font-size: .85em; }
.cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1em; }
@media (max-width: 1000px) { .cols2 { grid-template-columns: 1fr; } }
table.data td.num, table.data th.num { text-align: right;
  font-variant-numeric: tabular-nums; white-space: nowrap; }
td.int { color: #b9770e; }
td.pen { color: #c0392b; }
td.ok-num { color: var(--green); }
tr.row-total td { border-top: 2px solid var(--navy); background: #f2f6fa; font-weight: 600; }
.kpi-int b { color: #b9770e; }
.kpi-pen b { color: #c0392b; }
.kpi-danger { background: #fdeeec; border-color: #f0c2bb; }
.kpi-danger b { color: #c0392b; }
.note { font-size: .8em; margin-top: .8em; }
.empty-state { text-align: center; padding: 2.5em 1em; }

/* ヒートマップの凡例 */
.heat-legend { display: flex; align-items: center; gap: .5em; flex-wrap: wrap;
  font-size: .78em; color: var(--muted); margin-top: .4em; }
.hl-bar { width: 160px; height: 12px; border-radius: 3px;
  background: linear-gradient(to right, rgba(31,78,121,.12), rgba(31,78,121,1)); }
.hl-max { margin-left: .3em; }
.hl-item { display: inline-flex; align-items: center; gap: .3em; margin-left: .6em; }
.hl-none { width: 14px; height: 12px; border-radius: 3px;
  background: #f2f5f8; border: 1px solid var(--gray); display: inline-block; }

/* ---- 全体の余白と可読性 ---- */
main { max-width: 1280px; }
.topbar nav a { margin-right: .85em; white-space: nowrap; }
.topbar nav { display: flex; flex-wrap: wrap; }
/* バッジ類が途中で改行されるのを防ぐ */
.badge, .role, .lg { white-space: nowrap; display: inline-block; }
table.data td, table.data th { vertical-align: middle; }
.mt { margin-top: .8em; }

/* ---- 問診 ---- */
.stepper { display: flex; list-style: none; padding: 0; margin: 1em 0; gap: .4em;
  flex-wrap: wrap; }
.step a { display: flex; align-items: center; gap: .45em; padding: .5em .9em;
  background: #eef2f6; border: 1px solid var(--gray); border-radius: 999px;
  color: var(--muted); font-size: .85em; }
.step-no { display: inline-flex; align-items: center; justify-content: center;
  width: 1.5em; height: 1.5em; border-radius: 50%; background: #c9d4de;
  color: #fff; font-size: .8em; font-weight: 700; }
.step.done a { background: #e8f1fa; border-color: #c4d9ec; color: var(--navy); }
.step.done .step-no { background: var(--sky); }
.step.current a { background: var(--navy); border-color: var(--navy); color: #fff; }
.step.current .step-no { background: #fff; color: var(--navy); }

.intake-panel { padding: 1.4em 1.6em; }
.q { padding: 1em 0; border-bottom: 1px solid #eef2f6; }
.q:last-of-type { border-bottom: none; }
.q-label { font-weight: 600; margin-bottom: .2em; }
.q-label .req { background: #c0392b; color: #fff; font-size: .65em; border-radius: 3px;
  padding: .12em .45em; margin-left: .5em; vertical-align: middle; }
.q-help { font-size: .8em; color: var(--muted); margin: .1em 0 .5em; }
.q input[type=text], .q input[type=month], .q textarea, .inline-label select {
  width: 100%; max-width: 520px; padding: .5em .6em; border: 1px solid #c4d0dc;
  border-radius: 7px; font-size: .95em; font-family: inherit; }
.opts { display: flex; flex-wrap: wrap; gap: .45em; margin-top: .3em; }
.opt { display: inline-flex; align-items: center; gap: .35em; padding: .4em .8em;
  border: 1px solid #c4d0dc; border-radius: 7px; background: #fff;
  font-size: .88em; cursor: pointer; }
.opt:has(input:checked) { background: #e8f1fa; border-color: var(--blue); font-weight: 600; }
.opt-warn:has(input:checked) { background: #fdeeec; border-color: #e0a99f; }
.opt-sm { padding: .28em .55em; font-size: .8em; }
.opts-states { max-width: 100%; }
.inline-label { display: block; margin: 1em 0; font-size: .9em; }

.intake-actions { display: flex; align-items: center; gap: .6em; margin-top: 1.4em;
  padding-top: 1em; border-top: 1px solid var(--gray); flex-wrap: wrap; }
.intake-actions .spacer { flex: 1; }
.save-note { font-size: .8em; color: var(--muted); }
.banner { padding: .7em 1em; border-radius: 8px; font-size: .88em; margin: .8em 0; }
.ok-banner { background: #eaf6ee; border: 1px solid #b8ddc4; color: #1e6b3f; }
.draft-banner { background: #fdf6e3; border: 1px solid #e8d9a0; color: #7a5c00; }
.warn-box { background: #fdeeec; border: 1px solid #f0c2bb; border-radius: 8px;
  padding: .8em 1em; margin-top: 1.2em; font-size: .87em; }
.warn-box ul { margin: .4em 0 0; padding-left: 1.2em; }
.warn-box.hidden { display: none; }

/* ---- アップロード（ドロップゾーン） ---- */
.upload-help { background: #f6f9fc; border: 1px solid var(--gray); border-radius: 9px;
  padding: 1em 1.2em; margin-bottom: 1em; font-size: .9em; }
.dropzone { border: 2px dashed #b9c9d8; border-radius: 12px; background: #fbfdff;
  text-align: center; padding: 2.2em 1em; cursor: pointer; transition: .15s; }
.dropzone:hover, .dropzone.over { border-color: var(--blue); background: #eef6fd; }
.dropzone.busy { opacity: .6; pointer-events: none; }
.dz-icon { font-size: 1.8em; color: var(--blue); line-height: 1; }
.dz-main { font-weight: 600; margin: .5em 0 .2em; }
.dz-sub { font-size: .88em; color: var(--muted); margin: 0; }
.dz-note { font-size: .76em; color: var(--muted); margin-top: .6em; }
.linkbtn { background: none; border: none; color: var(--blue); cursor: pointer;
  font-size: 1em; text-decoration: underline; padding: 0; font-family: inherit; }

/* 案件詳細：書類パネル */
.doclist { list-style: none; padding: 0; margin: 0 0 1em; }
.doclist li { padding: .45em 0; border-bottom: 1px solid #eef2f6; font-size: .9em;
  display: flex; align-items: center; gap: .5em; flex-wrap: wrap; }
.doc-type { background: #eef2f6; color: var(--muted); font-size: .75em;
  padding: .12em .5em; border-radius: 4px; }
.doc-meta { color: var(--muted); font-size: .75em; margin-left: auto; }
.dz-sm { padding: 1.2em 1em; }
.dz-sm .dz-icon { font-size: 1.3em; }
.dz-sm .dz-main { font-size: .9em; margin: .35em 0 .15em; }
.doc-fields { display: flex; gap: .5em; margin: .6em 0; flex-wrap: wrap; }
.doc-fields input { flex: 1 1 180px; padding: .45em .6em;
  border: 1px solid #c4d0dc; border-radius: 7px; font-size: .9em; }
/* 案件詳細の2カラムが窮屈だったので、狭い画面では早めに1カラムへ落とす */
@media (max-width: 1100px) { .cols { grid-template-columns: 1fr; } }
.bcard-name { font-size: .74em; color: var(--muted); }

/* 地図のモード切替 */
.map-head { display: flex; align-items: center; gap: .8em; flex-wrap: wrap; margin-top: 1em; }
.segmented { display: inline-flex; background: #e8ecf1; border-radius: 8px; padding: 3px; }
.seg { border: none; background: none; padding: .45em 1em; border-radius: 6px;
  cursor: pointer; font-size: .88em; color: var(--muted); font-family: inherit; }
.seg.current { background: #fff; color: var(--navy); font-weight: 700;
  box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.map-note { font-size: .8em; color: var(--muted); }
.legend.hidden { display: none; }

/* エコノミックネクサスの配色（VDA進捗とは別系統の色で混同を避ける） */
.map-wrap[data-mode="nexus"] .mp.nx-exceeded    { fill: #c0392b; }
.map-wrap[data-mode="nexus"] .mp.nx-approaching { fill: #e8a33d; }
.map-wrap[data-mode="nexus"] .mp.nx-under       { fill: #dde4ea; }
.map-wrap[data-mode="nexus"] .mp.nx-registered  { fill: #2e8b57; }
.map-wrap[data-mode="nexus"] .mp.nx-unknown     { fill: #eef2f6; }
.map-wrap[data-mode="nexus"] .mp.nx-notax       { fill: #f2f5f8; }
.map-wrap[data-mode="nexus"] .mp-label { fill: #fff; stroke: rgba(0,0,0,.3); }
.map-wrap[data-mode="nexus"] .mp-label.nx-light { fill: #3d4d5c; stroke: rgba(255,255,255,.9); }
.lg-nx-exceeded { background: #c0392b; }
.lg-nx-approaching { background: #e8a33d; }
.lg-nx-under { background: #dde4ea; color: var(--text); }
.lg-nx-registered { background: #2e8b57; }
.lg-nx-unknown { background: #eef2f6; color: var(--text); }

/* 税務エンジン導入ガント */
.e-row { min-height: 2.3em; }
.e-label { display: flex; align-items: center; gap: .5em; font-size: .86em; font-weight: 600; }
.e-seq { display: inline-flex; align-items: center; justify-content: center;
  width: 1.5em; height: 1.5em; border-radius: 50%; background: var(--navy);
  color: #fff; font-size: .72em; flex-shrink: 0; }
.e-bar { position: absolute; top: .35em; height: 1.5em; border-radius: 5px;
  overflow: hidden; display: flex; align-items: center; }
.e-bar.role-opti { background: #c3d3e2; }
.e-bar.role-customer { background: #eec6c0; }
.e-bar.role-vendor { background: #d2d7da; }
.e-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 5px; }
.e-bar.role-opti .e-fill { background: var(--navy); }
.e-bar.role-customer .e-fill { background: #c0392b; }
.e-bar.role-vendor .e-fill { background: #7f8c8d; }
.e-text { position: relative; font-size: .68em; color: #33414d; padding: 0 .5em;
  margin-left: auto; font-weight: 700; }
.e-blocked { outline: 2px solid #e74c3c; }
.lg-vendor { background: #7f8c8d; }
.phase-form { display: flex; gap: .35em; align-items: center; flex-wrap: wrap; }
.phase-form input, .phase-form select { padding: .3em .45em; border: 1px solid #c4d0dc;
  border-radius: 5px; font-size: .82em; }
.w-70 { width: 70px; } .w-100 { width: 100px; }
.sm { font-size: .78em; }
.create-engine { max-width: 420px; margin: 1em auto 0; text-align: left; }

/* チケット */
.tk-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8em; margin: 1em 0; }
@media (max-width: 800px) { .tk-quick { grid-template-columns: repeat(2, 1fr); } }
.tk-card { display: block; background: #fff; border: 1px solid var(--gray);
  border-radius: 10px; padding: .9em; text-align: center; color: var(--text); }
.tk-card b { display: block; font-size: 1.7em; color: var(--navy); line-height: 1.1; }
.tk-card span { font-size: .8em; color: var(--muted); }
.tk-card.current { border-color: var(--blue); box-shadow: 0 0 0 2px rgba(47,128,196,.18); }
.tk-card.tk-bug b { color: #c0392b; }
.tk-card.tk-status b { color: #b9770e; }
.tk-badge { font-size: .74em; padding: .18em .55em; border-radius: 4px;
  white-space: nowrap; display: inline-block; color: #fff; }
.tk-engine_bug { background: #c0392b; }
.tk-status_check { background: #b9770e; }
.tk-question { background: var(--blue); }
.tk-other { background: #8898a8; }
.tks-open { background: #c0392b; }
.tks-in_progress { background: var(--blue); }
.tks-waiting { background: var(--amber); color: #5a4500; }
.tks-resolved { background: var(--green); }
.tks-closed { background: #8898a8; }
.pri { font-size: .74em; padding: .15em .5em; border-radius: 4px; white-space: nowrap; }
.pri-urgent { background: #c0392b; color: #fff; }
.pri-high { background: #f2c94c; color: #5a4500; }
.pri-normal { background: #eef2f6; color: var(--muted); }
.pri-low { background: #f6f8fb; color: var(--muted); }
.tk-form .tk-row { display: flex; gap: .8em; flex-wrap: wrap; margin-bottom: .5em; }
.tk-form label.block { display: block; margin: .5em 0; font-size: .88em; }
.tk-form input[type=text], .tk-form input:not([type]), .tk-form textarea {
  width: 100%; padding: .5em .6em; border: 1px solid #c4d0dc; border-radius: 7px;
  font-family: inherit; font-size: .95em; }
.tk-form select, .tk-form input[type=date] { padding: .4em .5em;
  border: 1px solid #c4d0dc; border-radius: 6px; }
.tk-body { white-space: pre-wrap; background: #f6f9fc; border-radius: 8px;
  padding: .9em 1.1em; font-size: .92em; }
.tk-comment { white-space: pre-wrap; margin-top: .25em; font-size: .9em; }
.timeline li.internal { background: #fffbe9; border-left: 3px solid var(--amber);
  padding-left: .6em; }
.tk-internal { background: var(--amber); color: #5a4500; font-size: .7em;
  padding: .1em .45em; border-radius: 3px; }
.chk { display: flex; align-items: center; gap: .4em; font-size: .85em; }
.intake-kind { margin: .8em 0; }
.intake-kind .seg { text-decoration: none; }

/* 顧客管理・サービス・個人設定 */
.cs-active { background: var(--green); }
.cs-prospect { background: var(--sky); }
.cs-on_hold { background: var(--amber); color: #5a4500; }
.cs-closed { background: #8898a8; }
.muted-light { color: #a8c0d6; font-size: .9em; }
.big-chk { align-items: flex-start; gap: .6em; padding: .7em 0;
  border-bottom: 1px solid #eef2f6; }
.big-chk input { margin-top: .3em; }
label.block { display: block; margin: .6em 0; font-size: .88em; }
label.block input, label.block textarea, label.block select {
  width: 100%; max-width: 460px; padding: .5em .6em; border: 1px solid #c4d0dc;
  border-radius: 7px; font-family: inherit; font-size: .95em; }

.svc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: .9em; margin: 1em 0; }
.svc-card { background: #fff; border: 1px solid var(--gray); border-radius: 10px;
  padding: 1em 1.1em; border-top: 4px solid var(--gray); }
.svc-card header { display: flex; align-items: center; gap: .5em; }
.svc-card h3 { margin: 0; font-size: 1em; color: var(--navy); }
.svc-count { margin-left: auto; background: #eef2f6; border-radius: 10px;
  padding: .1em .6em; font-size: .8em; color: var(--muted); }
.svc-desc { font-size: .78em; color: var(--muted); margin: .4em 0 .8em; }
.svc-items { list-style: none; padding: 0; margin: 0; }
.svc-items li { padding: .5em 0; border-top: 1px solid #eef2f6; font-size: .86em; }
.svc-name { display: flex; align-items: center; gap: .4em; flex-wrap: wrap; }
.svc-meta { font-size: .75em; color: var(--muted); margin-top: .15em; }
.svc-bar { height: 4px; background: #eef2f6; border-radius: 2px; margin-top: .35em; }
.svc-bar span { display: block; height: 100%; background: var(--blue); border-radius: 2px; }
.svc-link { display: inline-block; margin-top: .7em; font-size: .82em; }
.svc-vda { border-top-color: var(--navy); }
.svc-registration { border-top-color: var(--sky); }
.svc-engine { border-top-color: #8e6fbf; }
.svc-refund { border-top-color: var(--green); }
.svc-advisory { border-top-color: var(--amber); }
.svc-badge-vda { background: var(--navy); }
.svc-badge-registration { background: var(--sky); }
.svc-badge-engine { background: #8e6fbf; }
.svc-badge-refund { background: var(--green); }
.svc-badge-advisory { background: var(--amber); color: #5a4500; }
.svs-planning { background: #b9c4cf; }
.svs-running { background: var(--blue); }
.svs-waiting { background: var(--amber); color: #5a4500; }
.svs-done { background: var(--green); }
.svs-on_hold { background: #8898a8; }
.svs-cancelled { background: #cfd8e0; color: var(--muted); }


/* ---- ログイン画面（日本のSaaSに寄せた余白と情報設計） ---- */
.auth-wrap { min-height: calc(100vh - 4em); display: flex; flex-direction: column;
  align-items: center; justify-content: center; padding: 3em 1.2em; }
.auth-card { width: 100%; max-width: 480px; background: #fff; border: 1px solid #e3e9ef;
  border-radius: 16px; padding: 3em 3em 2.4em; box-shadow: 0 4px 20px rgba(23,43,64,.07); }
.auth-brand { text-align: center; margin-bottom: 2em; }
.auth-logo { font-size: 2em; font-weight: 700; color: var(--navy); letter-spacing: .01em; }
.auth-logo .accent { color: var(--blue); }
.auth-tagline { color: var(--muted); font-size: .88em; margin: .6em 0 0; }

.auth-notice { border-radius: 10px; padding: 1em 1.2em; margin-bottom: 1.6em;
  font-size: .88em; line-height: 1.7; }
.auth-notice b { display: block; margin-bottom: .3em; }
.auth-notice p { margin: 0; }
.auth-notice.ok { background: #eef8f1; border: 1px solid #bfe0c9; color: #1e6b3f; }
.auth-notice.err { background: #fdefec; border: 1px solid #f1c9c1; color: #a63a2a; }

.auth-google { display: flex; align-items: center; justify-content: center; gap: .7em;
  width: 100%; padding: .95em 1em; border: 1px solid #d3dde6; border-radius: 10px;
  background: #fff; color: var(--text); font-size: .98em; font-weight: 600;
  transition: .12s; }
.auth-google:hover { background: #f6f9fc; border-color: var(--blue);
  box-shadow: 0 2px 8px rgba(47,128,196,.12); }
.g-mark { width: 24px; height: 24px; border-radius: 50%; background: #fff;
  border: 1px solid #e3e9ef; display: inline-flex; align-items: center;
  justify-content: center; font-weight: 700; color: #4285f4; font-size: .95em; }

.auth-sep { display: flex; align-items: center; gap: 1em; margin: 1.8em 0 1.4em;
  color: var(--muted); font-size: .8em; }
.auth-sep::before, .auth-sep::after { content: ""; flex: 1; height: 1px; background: #e3e9ef; }

.auth-form label { display: block; font-size: .85em; font-weight: 600;
  color: var(--text); margin-bottom: .4em; }
.auth-form input { width: 100%; padding: .85em 1em; border: 1px solid #d3dde6;
  border-radius: 10px; font-size: 1em; font-family: inherit; transition: .12s; }
.auth-form input:focus { outline: none; border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(47,128,196,.14); }
.auth-submit { width: 100%; margin-top: 1em; padding: .95em 1em; border: none;
  border-radius: 10px; background: var(--blue); color: #fff; font-size: .98em;
  font-weight: 600; cursor: pointer; font-family: inherit; transition: .12s; }
.auth-submit:hover { background: #276ba6; }

.auth-help { text-align: center; color: var(--muted); font-size: .8em;
  line-height: 1.8; margin: 1.8em 0 0; padding-top: 1.4em;
  border-top: 1px solid #eef2f6; }
.auth-footer { color: var(--muted); font-size: .78em; margin-top: 2em; }

/* ログイン画面ではヘッダーとフッターを出さない */
body:has(.auth-wrap) .topbar, body:has(.auth-wrap) footer { display: none; }
body:has(.auth-wrap) main { max-width: none; padding: 0; }

/* 機能ごとの権限 */
.feat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: .5em; margin: .8em 0 1.2em; }
.feat-item { display: flex; align-items: center; gap: .55em; padding: .65em .9em;
  border: 1px solid #dbe4ec; border-radius: 9px; background: #fff; cursor: pointer;
  font-size: .88em; transition: .12s; }
.feat-item:has(input:checked) { background: #eef6fd; border-color: var(--blue);
  font-weight: 600; }
.feat-item input { accent-color: var(--blue); width: 16px; height: 16px; }
.member-feat { border: 1px solid #e3e9ef; border-radius: 10px; padding: .8em 1em;
  margin-bottom: .6em; background: #fafcfe; }
.member-feat summary { cursor: pointer; display: flex; align-items: center;
  gap: .6em; flex-wrap: wrap; }
.opts-states { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: .4em; }
.opt-state { padding: .45em .7em; font-size: .82em; gap: .45em; }
.opt-state b { color: var(--navy); font-size: .95em; }

/* 免責・機密表示 */
.site-footer { max-width: 1280px; margin: 3em auto 0; padding: 0 1.6em 3em;
  text-align: left; }
.confid { background: #3d4d5c; color: #fff; font-size: .78em; font-weight: 700;
  letter-spacing: .04em; text-align: center; padding: .55em 1em;
  border-radius: 6px 6px 0 0; }
.disclaimer { background: #fbfcfd; border: 1px solid #dfe6ec; border-top: none;
  border-radius: 0 0 6px 6px; padding: 1.2em 1.5em; font-size: .76em;
  line-height: 1.85; color: #4a5b6b; }
.disclaimer p { margin: 0 0 .7em; }
.disclaimer p:last-child { margin-bottom: 0; }
.disclaimer b { color: #2c3b4a; }
.disclaimer .en { color: #7b8a99; font-size: .95em; border-top: 1px dashed #e3e9ef;
  padding-top: .7em; margin-top: .9em; }
.copy { text-align: center; color: var(--muted); font-size: .75em; margin-top: 1em; }

.disc-box { background: #fdf7e6; border: 1px solid #e8d9a0; border-radius: 10px;
  padding: 1.1em 1.4em; margin: 1.2em 0; font-size: .85em; line-height: 1.8; }
.disc-box b { color: #7a5c00; }
.disc-box ul { margin: .5em 0 0; padding-left: 1.3em; }
.disc-box li { margin: .25em 0; }
