/*
 * Travel Hub 共通 CSS（1 本）。元の Planner（React + Tailwind、コーラル #EF600E）と同じ設計言語。
 * 構成: トークン → 基本 → アプリ枠（サイドバー・トップバー） → 部品 → ページ固有の互換 → 印刷。
 * 状態は色だけでなくテキストでも出す。JS なし（ドロップダウンは details、モバイルナビは checkbox）。
 */
:root {
  --color-primary: #EF600E; --color-primary-hover: #D45500; --color-primary-light: #FFF4ED; --color-secondary: #fb923c;
  --color-text: #1e293b; --color-text-secondary: #374151; --color-text-muted: #64748b; --color-text-placeholder: #9ca3af;
  --color-surface: #ffffff; --color-surface-secondary: #f8fafc; --color-surface-tertiary: #f1f5f9;
  --color-border: #e2e8f0; --color-border-dark: #cbd5e1;
  --color-success: #10b981; --color-success-bg: #dcfce7; --color-success-text: #166534;
  --color-error: #ef4444; --color-error-bg: #fef2f2; --color-error-text: #b91c1c;
  --color-warning: #f59e0b; --color-warning-bg: #fef3c7; --color-warning-text: #92400e;
  --color-info: #3b82f6; --color-info-bg: #dbeafe; --color-info-text: #1e40af;
  --font-sans: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Hiragino Sans', 'Noto Sans SC', 'Noto Sans KR', sans-serif;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 12px; --radius-2xl: 16px;
  --shadow-card: 0 1px 3px rgba(0,0,0,.1); --shadow-card-hover: 0 2px 8px rgba(0,0,0,.1);
  --shadow-modal: 0 20px 25px -5px rgba(0,0,0,.1), 0 10px 10px -5px rgba(0,0,0,.04);
  --shadow-focus: 0 0 0 3px rgba(239,96,14,.1);
  --transition: .15s ease; --sidebar-w: 220px; --topbar-h: 48px;
  /* 互換: 古いクラスが参照する名前は新しい変数に寄せる */
  --fg: var(--color-text); --muted: var(--color-text-muted); --bg: var(--color-surface-secondary); --card: var(--color-surface); --line: var(--color-border);
  --accent: var(--color-primary); --danger: var(--color-error-text); --ok: var(--color-success-text); --warn: var(--color-warning-text);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 400 15px/1.55 var(--font-sans); color: var(--color-text); background: var(--color-surface-secondary); }
a { color: var(--color-primary); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--color-primary-hover); text-decoration: underline; }
a:focus-visible, summary:focus-visible, button:focus-visible, label:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
h1, h2, h3 { color: var(--color-text); margin: 0; }
h2 { font-size: 20px; font-weight: 600; margin-top: var(--sp-6); margin-bottom: var(--sp-3); line-height: 1.4; }
h3 { font-size: 17px; font-weight: 600; margin: var(--sp-4) 0 var(--sp-2); }
p { margin: 0 0 var(--sp-3); }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; background: var(--color-surface-tertiary); padding: 1px 5px; border-radius: var(--radius-sm); }
.icon { flex: none; vertical-align: middle; }
.link-button { background: none; border: 0; padding: 0; font: inherit; color: var(--color-primary); cursor: pointer; }
.link-button:hover { color: var(--color-primary-hover); text-decoration: underline; }
.hint { color: var(--color-text-muted); margin: var(--sp-1) 0 0; font-size: 13px; }
.poll-status { color: var(--color-text-muted); }

/* ===== アプリ枠: 左固定サイドバー + 右のトップバー + 本文 ===== */
.app { display: flex; min-height: 100vh; }
.menu-toggle { position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; }
.app-sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar-w); z-index: 40; display: flex; flex-direction: column; background: var(--color-surface); border-right: 1px solid var(--color-border); overflow-y: auto; }
.sidebar-brand { display: flex; align-items: center; height: 56px; flex: none; padding: 0 var(--sp-4); border-bottom: 1px solid var(--color-border); }
.brand { display: inline-flex; align-items: center; gap: var(--sp-2); font-size: 16px; font-weight: 700; color: var(--color-text); text-decoration: none; min-width: 0; }
.brand:hover { color: var(--color-text); text-decoration: none; }
.brand img { border-radius: var(--radius-md); flex: none; }
.brand-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#main-nav { padding: var(--sp-3) var(--sp-2); flex: 1 1 auto; display: flex; flex-direction: column; }
#main-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-1); }
/* 一番下に寄せるナビ（ヘルプ）。主ナビとの間に線 */
#main-nav ul.nav-bottom { margin-top: auto; padding-top: var(--sp-2); border-top: 1px solid var(--color-border); }
#main-nav li { position: relative; margin: 0; padding: 0; }
#main-nav li.nav-group { padding: var(--sp-3) var(--sp-3) var(--sp-1); font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--color-text-muted); }
#main-nav li.nav-divider { margin-top: var(--sp-2); padding-top: var(--sp-2); border-top: 1px solid var(--color-border); }
#main-nav a { display: block; padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-md); font-size: 15px; color: var(--color-text-muted); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: background var(--transition), color var(--transition); }
/* アイコンは a の手前に置いて左へ重ねる。色は li の状態から当てる */
#main-nav .nav-icon { position: absolute; left: var(--sp-3); top: 50%; margin-top: -9px; color: var(--color-text-muted); pointer-events: none; transition: color var(--transition); }
#main-nav li.nav-divider .nav-icon { top: calc(50% + 4px); }
#main-nav li:has(> .nav-icon) > a { padding-left: calc(var(--sp-3) + 18px + var(--sp-2)); }
#main-nav a:hover { background: var(--color-surface-secondary); color: var(--color-text-secondary); }
#main-nav li:hover > .nav-icon { color: var(--color-text-secondary); }
#main-nav a[aria-current="page"] { background: var(--color-primary-light); color: var(--color-primary); font-weight: 500; }
#main-nav li:has(> a[aria-current="page"]) > .nav-icon { color: var(--color-primary); }
.app-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; margin-left: var(--sidebar-w); }
.app-plain .app-body { margin-left: 0; }
.app-topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: var(--sp-3); min-height: var(--topbar-h); padding: var(--sp-2) var(--sp-4); background: var(--color-surface); border-bottom: 1px solid var(--color-border); }
#page-title { flex: 1 1 auto; min-width: 0; margin: 0; font-size: 16px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.header-user { display: flex; align-items: center; gap: var(--sp-3); margin-left: auto; flex: none; }
.header-user form { margin: 0; max-width: none; }
.company-name { font-size: 13px; color: var(--color-text-muted); max-width: 16rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.icon-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: var(--radius-md); background: none; color: var(--color-text-muted); cursor: pointer; text-decoration: none; transition: background var(--transition), color var(--transition); }
.icon-btn:hover { background: var(--color-surface-tertiary); color: var(--color-text-secondary); text-decoration: none; }
.bell .badge { position: absolute; top: 0; right: 0; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px; background: var(--color-error); color: #fff; font-size: 11px; font-weight: 600; line-height: 16px; text-align: center; }
.nav-hamburger, .nav-backdrop { display: none; }
/* ユーザーメニュー（details/summary。JS なし） */
.user-menu { position: relative; }
.user-menu summary { display: flex; align-items: center; gap: var(--sp-2); list-style: none; cursor: pointer; padding: 2px var(--sp-2) 2px 2px; border-radius: 999px; color: var(--color-text-secondary); font-size: 14px; }
.user-menu summary::-webkit-details-marker { display: none; }
.user-menu summary:hover, .user-menu[open] summary { background: var(--color-surface-tertiary); }
.avatar { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--color-primary); color: #fff; font-size: 14px; font-weight: 600; }
.user-name { max-width: 10rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-menu-panel { position: absolute; right: 0; top: calc(100% + 6px); min-width: 14rem; padding: var(--sp-2); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-modal); z-index: 50; }
.user-menu-id { margin: 0; padding: var(--sp-2) var(--sp-3); border-bottom: 1px solid var(--color-border); margin-bottom: var(--sp-1); display: flex; flex-direction: column; word-break: break-all; font-size: 14px; }
.user-menu-label { font-size: 12px; color: var(--color-text-muted); }
.user-menu-item { display: flex; align-items: center; gap: var(--sp-2); width: 100%; padding: var(--sp-2) var(--sp-3); border: 0; border-radius: var(--radius-md); background: none; font: inherit; font-size: 15px; color: var(--color-text-secondary); text-align: left; cursor: pointer; text-decoration: none; }
.user-menu-item:hover { background: var(--color-surface-secondary); color: var(--color-text); text-decoration: none; }
main { flex: 1 1 auto; padding: var(--sp-4); }
.app-plain main { width: 100%; max-width: 44rem; margin: 0 auto; }
.site-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--sp-3); padding: var(--sp-3) var(--sp-5); font-size: 13px; color: var(--color-text-muted); }
.locale-switcher { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin: 0; max-width: none; }
.locale-switcher button { font-size: 13px; color: var(--color-text-muted); }
.locale-switcher [aria-current="true"] { font-weight: 600; color: var(--color-text); text-decoration: none; }

/* flash: 状態色の帯（左 4px + 薄い背景 + アイコン） */
.flash { display: flex; align-items: flex-start; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-4); border-radius: var(--radius-md); border-left: 4px solid var(--color-info); background: var(--color-info-bg); color: var(--color-info-text); font-size: 15px; }
.flash .icon { margin-top: 2px; }
.flash-success { border-left-color: var(--color-success); background: var(--color-success-bg); color: var(--color-success-text); }
.flash-error { border-left-color: var(--color-error); background: var(--color-error-bg); color: var(--color-error-text); }

/* ===== ボタン ===== */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 var(--sp-4); border: 1px solid transparent; border-radius: var(--radius-md); font: inherit; font-size: 15px; font-weight: 500; line-height: 1; cursor: pointer; text-decoration: none; white-space: nowrap; transition: background var(--transition), border-color var(--transition), color var(--transition), box-shadow var(--transition); }
.btn:hover { text-decoration: none; }
.btn:focus-visible { outline: none; box-shadow: var(--shadow-focus); border-color: var(--color-primary); }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.btn-primary { background: var(--color-primary); color: #fff; }
.btn-primary:hover:not(:disabled) { background: var(--color-primary-hover); color: #fff; }
.btn-secondary { background: var(--color-surface); color: var(--color-text-secondary); border-color: var(--color-border-dark); }
.btn-secondary:hover:not(:disabled) { background: var(--color-surface-secondary); color: var(--color-text); }
.btn-danger { background: var(--color-error-bg); color: var(--color-error-text); border-color: #fecaca; }
.btn-danger:hover:not(:disabled) { background: #fee2e2; color: var(--color-error-text); }
.btn-sm { height: 32px; padding: 0 var(--sp-3); font-size: 14px; }
.btn-block { display: flex; width: 100%; }
a.btn { display: inline-flex; }
.actions { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; margin: var(--sp-3) 0; }
.inline-form { display: inline-block; margin: 0; max-width: none; }

/* ===== フォーム ===== */
form { max-width: 40rem; }
form.wide { max-width: 60rem; }
.field { margin-bottom: var(--sp-4); }
.field label { display: block; font-size: 14px; font-weight: 600; color: var(--color-text-secondary); margin-bottom: 6px; }
.field .required { font-weight: 400; color: var(--color-text-muted); }
/* 必須の印: ラベルの右に小さな赤いバッジ。任意の項目には何も付けない */
.required-mark { margin-left: 3px; color: var(--color-error); font-weight: 700; font-size: 1em; line-height: 1; }
input, select, textarea { font: inherit; font-size: 15px; color: var(--color-text); }
.field input:not([type=checkbox]):not([type=radio]), .field select, .field textarea, table input, table select, .filters input, .filters select {
  width: 100%; height: 38px; padding: var(--sp-2) var(--sp-3); border: 1px solid var(--color-border-dark); border-radius: var(--radius-md); background: var(--color-surface); transition: border-color var(--transition), box-shadow var(--transition); }
.field textarea { height: auto; min-height: 76px; line-height: 1.5; resize: vertical; }
table input, table select { max-width: 11rem; height: 32px; }
input::placeholder, textarea::placeholder { color: var(--color-text-placeholder); }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--color-primary); box-shadow: var(--shadow-focus); }
input:disabled, select:disabled, textarea:disabled { background: var(--color-surface-tertiary); color: var(--color-text-muted); }
.field-error input, .field-error select, .field-error textarea, .field input[aria-invalid="true"], .field select[aria-invalid="true"], .field textarea[aria-invalid="true"] { border-color: var(--color-error); }
.field input[aria-invalid="true"]:focus, .field select[aria-invalid="true"]:focus, .field textarea[aria-invalid="true"]:focus { box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18); }
/* ブラウザ側の検証: 触ったあとに不正な入力だけ赤枠（初期表示で赤くしない） */
.field input:user-invalid, .field select:user-invalid, .field textarea:user-invalid { border-color: var(--color-error); }
.error { color: var(--color-error-text); margin: var(--sp-1) 0 0; font-size: 13px; }
.form-errors { padding: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-4); border: 1px solid #fecaca; border-left: 4px solid var(--color-error); border-radius: var(--radius-md); color: var(--color-error-text); background: var(--color-error-bg); }
.form-errors p { margin: 0 0 var(--sp-1); font-weight: 600; } .form-errors ul { margin: 0; padding-left: 1.2em; }
.checkbox { font-weight: 400; display: inline-flex; align-items: center; gap: var(--sp-2); }
.field-group { margin: 0 0 var(--sp-3); }
.field-group-title { margin: 0 0 var(--sp-1); font-size: 13px; font-weight: 600; color: var(--color-text-muted, var(--color-text)); }
.field-group .checkbox { margin-right: var(--sp-4); }
.field .checkbox input { width: auto; height: auto; accent-color: var(--color-primary); }
.filters { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: var(--sp-3); align-items: end; max-width: 48rem; margin-bottom: var(--sp-4); }
form:has(> .filters) { max-width: none; }
.filters .field { margin: 0; }
fieldset { border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); box-shadow: var(--shadow-card); margin: 0 0 var(--sp-4); padding: var(--sp-3) var(--sp-4); }
legend { font-size: 15px; font-weight: 600; padding: 0 var(--sp-2); }

/* ===== カード・統計・空状態・ページ見出し ===== */
.card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); padding: var(--sp-4); margin-bottom: var(--sp-4); }
.card > :last-child { margin-bottom: 0; }
.card-header { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-3); }
.card-title { margin: 0; font-size: 16px; font-weight: 600; }
.card-actions { display: flex; gap: var(--sp-2); align-items: center; }
.card-body > :first-child { margin-top: 0; }
.card-body > :last-child { margin-bottom: 0; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: var(--sp-3); margin: var(--sp-3) 0 var(--sp-4); }
.cards.compact { grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); }
.cards .card { margin: 0; padding: var(--sp-4); }
.card .figure { font-size: 24px; font-weight: 700; line-height: 1.2; color: var(--color-text); }
.cards .card .figure + div, .stat-hint { margin-top: var(--sp-1); font-size: 13px; color: var(--color-text-muted); }
.stat-label { display: flex; align-items: center; gap: 6px; margin-bottom: var(--sp-1); font-size: 13px; color: var(--color-text-muted); }
.stat-link { display: block; color: inherit; text-decoration: none; transition: box-shadow var(--transition); }
.stat-link:hover { box-shadow: var(--shadow-card-hover); color: inherit; text-decoration: none; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--color-text-muted); }
.dot-primary { background: var(--color-primary); } .dot-success { background: var(--color-success); } .dot-warning { background: var(--color-warning); } .dot-error { background: var(--color-error); } .dot-info { background: var(--color-info); }
.empty-state { display: flex; flex-direction: column; align-items: center; gap: var(--sp-2); padding: var(--sp-8) var(--sp-4); text-align: center; color: var(--color-text-muted); }
.empty-state .icon { color: var(--color-border-dark); }
.empty-state p { margin: 0; } .empty-title { font-size: 16px; font-weight: 600; color: var(--color-text-secondary); } .empty-desc { font-size: 15px; }
.empty-actions { margin-top: var(--sp-2); }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.page-header-title { margin: 0; font-size: 22px; font-weight: 600; }
.page-header-desc { margin: 2px 0 0; font-size: 15px; color: var(--color-text-muted); }
.page-header-actions { display: flex; gap: var(--sp-2); flex-wrap: wrap; margin-left: auto; }
section > h2:first-child { margin-top: var(--sp-6); }
main > section:first-of-type > h2:first-child, main > h2:first-child { margin-top: 0; }
dl.kv { display: grid; grid-template-columns: max-content 1fr; gap: var(--sp-2) var(--sp-6); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); padding: var(--sp-4); margin: var(--sp-3) 0; }
.card dl.kv { border: 0; box-shadow: none; padding: 0; margin: 0; }
dl.kv dt { color: var(--color-text-muted); font-size: 13px; padding-top: 2px; } dl.kv dd { margin: 0; font-size: 15px; }

/* ===== 表 ===== */
.table-wrap { overflow-x: auto; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); margin: var(--sp-3) 0; }
table { border-collapse: collapse; width: 100%; background: var(--color-surface); }
.table-wrap > table { margin: 0; }
/* 表の見出しは節・ページの見出しと重なるので、画面では隠し、読み上げにだけ残す */
caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
th { padding: 11px var(--sp-3); background: var(--color-surface-secondary); border-bottom: 1px solid var(--color-border); font-size: 13px; font-weight: 600; color: var(--color-text-muted); text-align: left; white-space: nowrap; }
td { padding: 11px var(--sp-3); border-bottom: 1px solid var(--color-border); font-size: 15px; text-align: left; vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover td { background: var(--color-surface-secondary); }
td a { color: var(--color-text); font-weight: 500; } td a:hover { color: var(--color-primary); }
.num { text-align: right; font-variant-numeric: tabular-nums; }
td[data-empty] { color: var(--color-text-muted); text-align: center; padding: var(--sp-8) var(--sp-3); }
tr.empty-row:hover td { background: transparent; }

/* ===== チップ（状態） ===== */
.status { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 500; line-height: 1.5; white-space: nowrap; background: var(--color-surface-tertiary); color: #475569; }
.chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.status[data-status="quote_requested"], .status[data-status="warning"], .status[data-status="pending"], .status[data-status="in_progress"], .status[data-status="warn"] { background: var(--color-warning-bg); color: var(--color-warning-text); }
.status[data-status="quote_received"] { background: #ede9fe; color: #5b21b6; }
.status[data-status="accepted"], .status[data-status="approved"], .status[data-status="paid"], .status[data-status="active"] { background: #d1fae5; color: #065f46; }
.status[data-status="completed"], .status[data-status="success"], .status[data-status="done"], .status[data-status="ok"] { background: var(--color-success-bg); color: var(--color-success-text); }
.status[data-status="cancelled"], .status[data-status="rejected"], .status[data-status="error"], .status[data-status="failed"], .status[data-status="danger"], .status[data-status="expired"], .status[data-status="overdue"] { background: #fee2e2; color: #991b1b; }
.status[data-status="proposed"], .status[data-status="sent"], .status[data-status="info"], .status[data-status="open"] { background: var(--color-info-bg); color: var(--color-info-text); }
.status[data-status="planning"], .status[data-status="draft"] { background: var(--color-surface-tertiary); color: #475569; }
.status-accepted, .status-draft, .status-danger, .status-failed, .status-warn { font-weight: 500; }
.unread { font-weight: 700; }

/* ===== ページ送り ===== */
.pagination { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; margin: var(--sp-3) 0; font-size: 14px; color: var(--color-text-muted); }
.pagination .summary { margin-right: auto; }
.pagination .page-link, .pagination .disabled, .pagination .current { display: inline-flex; align-items: center; height: 30px; padding: 0 var(--sp-3); border-radius: var(--radius-md); border: 1px solid var(--color-border-dark); background: var(--color-surface); color: var(--color-text-secondary); text-decoration: none; }
.pagination .page-link:hover { background: var(--color-surface-secondary); }
.pagination .current { background: var(--color-primary); border-color: var(--color-primary); color: #fff; font-weight: 500; }
.pagination .disabled { color: var(--color-text-placeholder); background: var(--color-surface-secondary); }

/* ===== タブ（下線型） ===== */
nav.tabs ul { display: flex; flex-wrap: wrap; gap: 0 var(--sp-1); list-style: none; margin: 0 0 var(--sp-4); padding: 0; border-bottom: 1px solid var(--color-border); }
nav.tabs li { display: block; margin: 0; padding: 0; }
.tabs a { display: inline-flex; align-items: center; gap: 6px; padding: var(--sp-2) var(--sp-3); margin-bottom: -1px; border-bottom: 2px solid transparent; font-size: 15px; font-weight: 500; color: var(--color-text-muted); text-decoration: none; }
.tabs a:hover { color: var(--color-text-secondary); }
.tabs a[aria-current="page"] { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.tabs .count { min-width: 20px; padding: 0 6px; border-radius: 999px; background: var(--color-surface-tertiary); color: var(--color-text-muted); font-size: 12px; font-weight: 500; line-height: 18px; text-align: center; }
.tabs a[aria-current="page"] .count { background: var(--color-primary-light); color: var(--color-primary); }

/* ===== ログイン（AuthLayout） ===== */
.auth-body { background: var(--color-surface-secondary); }
.auth-wrap { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--sp-4); padding: var(--sp-6) var(--sp-4); }
.auth-card { position: relative; width: 100%; max-width: 420px; margin: 0; padding: var(--sp-8); border-radius: var(--radius-xl); box-shadow: var(--shadow-modal); }
.auth-lang { position: absolute; top: var(--sp-3); right: var(--sp-4); }
.auth-lang .locale-switcher { gap: var(--sp-2); } .auth-lang .locale-switcher button { font-size: 12px; }
.auth-brand { display: flex; flex-direction: column; align-items: center; gap: var(--sp-1); margin: var(--sp-4) 0 var(--sp-5); text-align: center; }
.auth-brand .brand { font-size: 20px; gap: var(--sp-3); }
.auth-tagline { margin: 0; color: var(--color-text-muted); font-size: 15px; }
.auth-card #page-title { flex: none; font-size: 16px; font-weight: 600; margin: 0 0 var(--sp-4); text-align: center; white-space: normal; }
.auth-card form { max-width: none; }
.auth-card .hint { margin: 0 0 var(--sp-3); }
.auth-links { text-align: center; margin: var(--sp-4) 0 0; font-size: 14px; }
.auth-alt { margin: var(--sp-3) 0 0; }
.auth-apply { margin-top: var(--sp-5); padding-top: var(--sp-4); border-top: 1px solid var(--color-border); text-align: center; font-size: 14px; color: var(--color-text-muted); }
.auth-apply p { margin: 0 0 var(--sp-1); } .auth-apply a { font-weight: 600; }
.auth-footer { justify-content: center; }

/* ===== エラーページ・devui ===== */
.error-card { max-width: 32rem; margin: var(--sp-8) auto; padding: var(--sp-8); text-align: center; }
.error-icon { display: inline-flex; padding: var(--sp-3); border-radius: 50%; background: var(--color-primary-light); color: var(--color-primary); }
.error-status { margin: var(--sp-2) 0 0; font-size: 13px; color: var(--color-text-muted); }
.icon-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: var(--sp-2); list-style: none; margin: 0; padding: 0; }
.icon-grid li { display: flex; align-items: center; gap: var(--sp-2); padding: var(--sp-2); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); }

/* ===== 画面固有の互換（各ページの作り替え前でも自然に見えるように） ===== */
.prose { white-space: pre-wrap; }
ol.messages { list-style: none; padding: 0; } ol.messages li { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-2); }
ol.messages li[data-sender="USER"] { border-left: 4px solid var(--color-primary); } ol.messages li[data-sender="SUPPORT"] { border-left: 4px solid var(--color-success); }
.document { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--sp-4) var(--sp-6); margin-top: var(--sp-4); } .document h2 { border-bottom: 2px solid var(--brand, var(--color-primary)); }
.doc-brand { display: flex; align-items: center; gap: .6rem; margin-bottom: .6rem; }
/* お客様向け資料（提案書＋見積書）: 表紙・概要・行程表・お見積り・ご利用条件・運営者情報。ページ区切りは CSS（印刷／PDF） */
.document .doc-cover { position: relative; display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-6) 0 var(--sp-4); border-bottom: 1px solid var(--color-border); margin-bottom: var(--sp-6); }
.document .doc-cover-band { height: 14px; border-radius: 2px; background: linear-gradient(90deg, var(--brand, #1f5fbf) 70%, var(--brand-2, #475569) 70%); margin-bottom: var(--sp-4); }
.document .doc-cover-kind { margin: var(--sp-6) 0 0; font-size: 15px; letter-spacing: .08em; color: var(--brand, #1f5fbf); font-weight: 600; }
.document .doc-cover-title { margin: 0; font-size: 28px; line-height: 1.3; border-bottom: 0; }
.document .doc-cover-for { margin: 0; font-size: 18px; }
.document .doc-cover-operator { margin: var(--sp-6) 0 0; font-weight: 600; }
.document .doc-cover .kv { margin: var(--sp-4) 0 0; }
.document .doc-section { margin: 0 0 var(--sp-6); }
.document .doc-section h3 { margin: 0 0 var(--sp-3); padding-bottom: 4px; border-bottom: 2px solid var(--brand, #1f5fbf); font-size: 18px; }
.document .doc-section h4 { margin: var(--sp-3) 0 4px; font-size: 14px; color: var(--brand-2, #475569); }
.document .doc-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.document .doc-day-title { margin: 0; padding: 6px 8px; background: color-mix(in srgb, var(--brand, #1f5fbf) 10%, #fff); border: 1px solid var(--color-border); border-bottom: 0; font-size: 14px; color: inherit; break-after: avoid; page-break-after: avoid; }
.document .doc-table th, .document .doc-table td { border: 1px solid var(--color-border); padding: 5px 8px; vertical-align: top; text-align: left; }
.document .doc-table thead th { background: var(--brand, #1f5fbf); color: #fff; font-weight: 600; }
.document .doc-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.document .doc-day-table .col-time { width: 13%; white-space: nowrap; }
.document .doc-day-title { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px var(--sp-4); }
.document .doc-day-head { display: inline-flex; flex-wrap: wrap; gap: 0 10px; } .document .doc-day-name::before { content: "—"; margin-right: 6px; color: var(--color-text-muted); }
.document .doc-day-meta { display: inline-flex; flex-wrap: wrap; gap: 0 14px; font-weight: 400; font-size: 13px; }
.document .doc-kind { color: var(--color-text-muted); font-size: 12px; } .document .doc-note { display: block; color: var(--color-text-secondary); }
/* 日の表は途中で改ページしてよい（1 日 1 ページに膨らまない）。行の途中と、日の見出し＋表頭の直後では切らない */
.document .doc-day { margin-bottom: var(--sp-4); }
.document .doc-day-table tr { break-inside: avoid; page-break-inside: avoid; }
.document .doc-day-table thead { display: table-header-group; }
.document .doc-day-table tbody tr:first-child { break-before: avoid; page-break-before: avoid; }
.document .doc-cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); } .document .doc-cols ul { margin: 0; padding-left: 1.2em; }
.document #doc-terms, .document #doc-contact { break-inside: avoid; page-break-inside: avoid; }
.document #doc-footer { margin-top: var(--sp-4); text-align: center; }
@media print { .document .doc-cover { min-height: 250mm; break-after: page; page-break-after: always; } .document .doc-break { break-before: page; page-break-before: always; } }
.print-view .document { border: 0; border-radius: 0; padding: 0; margin: 0; } .print-view .document .doc-cover { min-height: 250mm; break-after: page; page-break-after: always; } .print-view .document .doc-break { break-before: page; page-break-before: always; }
/* 表紙（印刷）: 帯と種類は上、題名と要点は中ほど、運営者名は下に寄せて 1 ページを使う */
.print-view .document .doc-cover { display: flex; flex-direction: column; border-bottom: 0; }
.print-view .document .doc-cover-kind { margin-top: 40mm; font-size: 16px; }
.print-view .document .doc-cover-title { font-size: 34px; line-height: 1.25; }
.print-view .document .doc-cover-for { font-size: 20px; }
.print-view .document .doc-cover .kv { margin-top: var(--sp-5); font-size: 15px; }
.print-view .document .doc-cover-operator { margin-top: auto; padding-top: var(--sp-6); font-size: 16px; }
.color-row { display: flex; align-items: center; gap: var(--sp-2); } .field.color-field .color-row input[type=color], .color-row input[type=color] { width: 56px; max-width: 56px; flex: none; height: 36px; padding: 2px; cursor: pointer; }
.color-swatch { display: inline-block; width: 28px; height: 28px; border-radius: 6px; border: 1px solid var(--color-border); } .color-hex { font-size: 14px; }
.logo-preview img { display: block; max-width: 240px; max-height: 56px; object-fit: contain; border: 1px solid var(--color-border); border-radius: 6px; padding: 4px; background: #fff; } .logo-preview .label { display: block; font-size: 14px; font-weight: 600; color: var(--color-text-secondary); margin-bottom: 6px; }
.doc-cover-sample { max-width: 320px; aspect-ratio: 1 / 1.414; display: flex; flex-direction: column; gap: 8px; padding: 16px; background: #fff; border: 1px solid var(--color-border); border-radius: 6px; box-shadow: var(--shadow-card); }
.doc-cover-sample .doc-cover-band { height: 12px; border-radius: 2px; background: linear-gradient(90deg, var(--brand) 70%, var(--brand-2) 70%); } .doc-cover-sample img { max-height: 40px; max-width: 160px; object-fit: contain; align-self: flex-start; }
.doc-cover-sample .doc-cover-kind { margin: 24px 0 0; font-size: 12px; color: var(--brand); font-weight: 600; } .doc-cover-sample .doc-cover-title { margin: 0; font-size: 20px; } .doc-cover-sample .doc-cover-operator { margin: auto 0 0; font-weight: 600; font-size: 13px; }
.print-view { background: #fff; } .print-view main { max-width: 52rem; margin: 0 auto; }
.print-only { display: none; }

/* ===== 画面の部品（ui.tsx）: 幅・戻る・チップ・メタ・フォーム区画・タブ・段階・帯・グラフ ===== */
:root {
  /* 案件の状態色（1 か所）。チップ・TripCard の上辺・統計カードの点・段階表示がここを使う */
  --st-planning: #3b82f6; --st-quote_requested: #f59e0b; --st-quote_received: #10b981; --st-accepted: #8b5cf6; --st-completed: #6b7280; --st-cancelled: #ef4444;
  --st-planning-bg: #dbeafe; --st-quote_requested-bg: #fef3c7; --st-quote_received-bg: #dcfce7; --st-accepted-bg: #ede9fe; --st-completed-bg: #f3f4f6; --st-cancelled-bg: #fee2e2;
  --st-planning-fg: #1e40af; --st-quote_requested-fg: #92400e; --st-quote_received-fg: #166534; --st-accepted-fg: #5b21b6; --st-completed-fg: #374151; --st-cancelled-fg: #991b1b;
}
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.page-w { width: 100%; margin: 0 auto; }
/* 横幅の上限: 読み物（sm/720/md）は読みやすい幅で止め、一覧・詳細（lg/xl）は画面いっぱいに使う（2026-10-20 CEO 指摘: 余白が多い） */
.page-w-sm { max-width: 880px; } .page-w-720 { max-width: 960px; } .page-w-md { max-width: 1100px; } .page-w-lg { max-width: none; } .page-w-xl { max-width: none; }
.back-button { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 var(--sp-3) calc(-1 * var(--sp-2)); padding: 6px var(--sp-2); border-radius: var(--radius-md); font-size: 15px; font-weight: 500; color: var(--color-text-muted); text-decoration: none; }
.back-button:hover { background: var(--color-surface-tertiary); color: var(--color-text); text-decoration: none; }
.btn-lg { height: 40px; padding: 0 var(--sp-5); font-size: 15px; border-radius: var(--radius-lg); }
.btn-success { background: var(--color-success); color: #064e3b; border-color: var(--color-success); }
.btn-success:hover:not(:disabled) { background: #059669; color: #fff; }
.btn-ghost { background: transparent; color: var(--color-text-secondary); }
.btn-ghost:hover:not(:disabled) { background: var(--color-surface-tertiary); }
.btn .icon { flex: none; }

.pill { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; font-weight: 500; line-height: 1.4; white-space: nowrap; background: var(--color-surface-tertiary); color: #475569; }
.pill-sm { padding: 2px 8px; font-size: 13px; } .pill-md { padding: 3px 10px; font-size: 14px; } .pill-lg { padding: 6px 12px; font-size: 15px; }
.pill-primary { background: var(--color-primary-light); color: #b24a08; }
.pill-success { background: var(--color-success-bg); color: var(--color-success-text); }
.pill-warning { background: var(--color-warning-bg); color: var(--color-warning-text); }
.pill-error { background: #fee2e2; color: #991b1b; }
.pill-info { background: var(--color-info-bg); color: var(--color-info-text); }
.pill-purple { background: #ede9fe; color: #5b21b6; }
.pill-orange { background: #ffedd5; color: #9a3412; }

.meta-row { display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-4); align-items: center; color: var(--color-text-muted); font-size: 15px; }
.meta-item { display: inline-flex; align-items: center; gap: 6px; }
.meta-item .icon { color: var(--color-text-placeholder); }
.meta-strong { color: #b91c1c; font-weight: 700; } .meta-strong .icon { color: #b91c1c; }

/* フォームの区画: 白カード・角丸 12・見出し 18px・2 列 */
fieldset.form-section { position: relative; margin: 0 0 var(--sp-4); padding: var(--sp-4) var(--sp-5) var(--sp-5); border: 1px solid var(--color-border); border-radius: var(--radius-xl); background: var(--color-surface); box-shadow: var(--shadow-card); min-width: 0; }
fieldset.form-section > legend { float: left; width: 100%; padding: 0; margin: 0 0 var(--sp-3); font-size: 18px; font-weight: 600; line-height: 1.4; color: var(--color-text); }
fieldset.form-section > legend + * { clear: both; }
.form-section-desc { margin: calc(-1 * var(--sp-2)) 0 var(--sp-3); font-size: 15px; color: var(--color-text-muted); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--sp-4); align-items: start; }
.form-grid > .field, .form-grid > .span-2 { min-width: 0; }
.form-grid > .span-2, .form-grid > .field:is([data-field="description"], [data-field="destinations"], [data-field="special_requests"], [data-field="freeform_notes"]) { grid-column: 1 / -1; }
.form-section textarea { height: 72px; min-height: 72px; }
.form-grid > .field { margin-bottom: var(--sp-3); }
.form-grid > .hint { grid-column: 1 / -1; }
.form-actions { display: flex; justify-content: flex-end; align-items: center; gap: var(--sp-2); flex-wrap: wrap; margin: var(--sp-4) 0 0; }
form.form-wide { max-width: none; }

/* JS なしのタブ（radio + :checked）。パネルはすべて DOM に入っている */
.panel-tabs { position: relative; }
.pt-radio { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.pt-bar { display: flex; flex-wrap: wrap; gap: 0 var(--sp-1); margin: 0 0 var(--sp-4); border-bottom: 1px solid var(--color-border); }
.pt-bar label { display: inline-flex; align-items: center; gap: 6px; padding: 10px var(--sp-4); margin-bottom: -1px; border-bottom: 2px solid transparent; font-size: 15px; font-weight: 500; color: var(--color-text-muted); cursor: pointer; transition: color var(--transition); }
.pt-bar label:hover { color: var(--color-text-secondary); }
.pt-bar .count { min-width: 20px; padding: 0 6px; border-radius: 999px; background: var(--color-surface-tertiary); color: var(--color-text-muted); font-size: 13px; line-height: 20px; text-align: center; }
.pt-panel { display: none; }
.pt-radio:nth-of-type(1):checked ~ .pt-panels .pt-panel:nth-child(1), .pt-radio:nth-of-type(2):checked ~ .pt-panels .pt-panel:nth-child(2), .pt-radio:nth-of-type(3):checked ~ .pt-panels .pt-panel:nth-child(3),
.pt-radio:nth-of-type(4):checked ~ .pt-panels .pt-panel:nth-child(4), .pt-radio:nth-of-type(5):checked ~ .pt-panels .pt-panel:nth-child(5), .pt-radio:nth-of-type(6):checked ~ .pt-panels .pt-panel:nth-child(6) { display: block; }
.pt-radio:nth-of-type(1):checked ~ .pt-bar label:nth-child(1), .pt-radio:nth-of-type(2):checked ~ .pt-bar label:nth-child(2), .pt-radio:nth-of-type(3):checked ~ .pt-bar label:nth-child(3),
.pt-radio:nth-of-type(4):checked ~ .pt-bar label:nth-child(4), .pt-radio:nth-of-type(5):checked ~ .pt-bar label:nth-child(5), .pt-radio:nth-of-type(6):checked ~ .pt-bar label:nth-child(6) { color: var(--color-primary); border-bottom-color: var(--color-primary); font-weight: 600; }
.pt-radio:nth-of-type(1):checked ~ .pt-bar label:nth-child(1) .count, .pt-radio:nth-of-type(2):checked ~ .pt-bar label:nth-child(2) .count, .pt-radio:nth-of-type(3):checked ~ .pt-bar label:nth-child(3) .count,
.pt-radio:nth-of-type(4):checked ~ .pt-bar label:nth-child(4) .count { background: var(--color-primary-light); color: var(--color-primary); }
.pt-radio:focus-visible ~ .pt-bar { outline: 2px solid var(--color-primary); outline-offset: 2px; border-radius: var(--radius-md); }
.pt-panel > :first-child { margin-top: 0; }

/* 区切り型のタブ（設定画面） */
.segment-tabs { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin: 0 0 var(--sp-4); padding: 4px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.segment-tabs a { flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px var(--sp-3); border-radius: var(--radius-md); font-size: 15px; font-weight: 500; color: var(--color-text-muted); text-decoration: none; white-space: nowrap; }
.segment-tabs a:hover { background: var(--color-surface-secondary); color: var(--color-text-secondary); }
.segment-tabs a[aria-current="page"] { background: var(--color-primary); color: #fff; }

/* 段階表示 */
.steps { display: flex; align-items: flex-start; list-style: none; margin: 0; padding: 0; --step-size: 32px; }
.steps-40 { --step-size: 40px; }
.steps li { position: relative; flex: 1 1 0; display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; text-align: center; }
.steps li + li::before { content: ""; position: absolute; top: calc(var(--step-size) / 2 - 1px); right: 50%; width: 100%; height: 2px; background: var(--color-border); z-index: 0; }
.steps li[data-done="true"] + li[data-done="true"]::before, .steps li[data-done="true"] + li[aria-current="step"]::before { background: var(--step-color, var(--color-primary)); }
.step-dot { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: var(--step-size); height: var(--step-size); border-radius: 50%; background: var(--color-border); color: #475569; font-size: 15px; font-weight: 600; }
.steps li[data-done="true"] .step-dot { background: var(--step-color, var(--color-primary)); color: #fff; }
.steps li[aria-current="step"] .step-dot { box-shadow: 0 0 0 4px color-mix(in srgb, var(--step-color, var(--color-primary)) 22%, transparent); }
.step-label { font-size: 13px; color: var(--color-text-muted); line-height: 1.3; }
.steps li[aria-current="step"] .step-label { color: var(--color-text); font-weight: 600; }

/* 帯 */
.banner { display: flex; gap: var(--sp-3); align-items: flex-start; padding: var(--sp-3) var(--sp-4); margin: 0 0 var(--sp-4); border: 1px solid #bfdbfe; border-radius: var(--radius-lg); background: #eff6ff; color: #1e40af; font-size: 15px; }
.banner .icon { margin-top: 2px; }
.banner-body > :last-child { margin-bottom: 0; } .banner-body p { margin: 0 0 var(--sp-1); }
.banner-title { display: block; font-weight: 600; }
.banner-warning { background: #fffbeb; border-color: #fde68a; color: var(--color-warning-text); }
.banner-error { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.banner-orange { background: #fff7ed; border-color: #fdba74; color: #9a3412; }
.banner-success { background: #f0fdf4; border-color: #86efac; color: var(--color-success-text); }

/* グラフ（サーバー側で描く CSS の横棒・SVG の折れ線） */
.bar-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.bar-list li { display: grid; grid-template-columns: minmax(80px, 30%) 1fr auto; gap: var(--sp-3); align-items: center; font-size: 15px; }
.bar-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--color-text-secondary); }
.bar-track { height: 12px; border-radius: 999px; background: var(--color-surface-tertiary); overflow: hidden; }
.bar { display: block; height: 100%; border-radius: 999px; }
.bar-value { min-width: 3.5em; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.line-chart { width: 100%; height: auto; display: block; }
.line-chart .grid { stroke: var(--color-border); stroke-dasharray: 3 4; }
.line-chart .axis { font-size: 12px; fill: var(--color-text-muted); }
.legend { display: flex; flex-wrap: wrap; gap: var(--sp-4); margin: var(--sp-2) 0 0; padding: 0; list-style: none; font-size: 14px; color: var(--color-text-secondary); }
.legend li { display: inline-flex; align-items: center; gap: 6px; }
.legend .swatch { width: 10px; height: 10px; border-radius: 2px; }

/* >>> dash */
/* ===== Planner: 案件の状態チップ・一覧の行・TripCard・ダッシュボード ===== */
.status[data-trip-status="planning"] { background: var(--st-planning-bg); color: var(--st-planning-fg); }
.status[data-trip-status="quote_requested"] { background: var(--st-quote_requested-bg); color: var(--st-quote_requested-fg); }
.status[data-trip-status="quote_received"] { background: var(--st-quote_received-bg); color: var(--st-quote_received-fg); }
.status[data-trip-status="accepted"] { background: var(--st-accepted-bg); color: var(--st-accepted-fg); }
.status[data-trip-status="completed"] { background: var(--st-completed-bg); color: var(--st-completed-fg); }
.status[data-trip-status="cancelled"] { background: var(--st-cancelled-bg); color: var(--st-cancelled-fg); }
.status[data-proposal-status="generating"] { background: #ede9fe; color: #5b21b6; }
.status[data-proposal-status="generation_failed"] { background: #fee2e2; color: #991b1b; }
.status[data-proposal-status="draft"] { background: #f3f4f6; color: #374151; }
.status[data-proposal-status="proposed"] { background: #dbeafe; color: #1e40af; }
.status[data-proposal-status="quote_requested"] { background: #fef3c7; color: #92400e; }
.status[data-proposal-status="quote_received"], .status[data-proposal-status="accepted"] { background: #d1fae5; color: #065f46; }
.status[data-proposal-status="rejected"] { background: #fee2e2; color: #991b1b; }
.status[data-proposal-status="cancelled"] { background: #f3f4f6; color: #374151; }
.dot-st { background: var(--color-text-muted); }
.stat-card[data-status="PLANNING"] .dot { background: var(--st-planning); } .stat-card[data-status="QUOTE_REQUESTED"] .dot { background: var(--st-quote_requested); }
.stat-card[data-status="QUOTE_RECEIVED"] .dot { background: var(--st-quote_received); } .stat-card[data-status="ACCEPTED"] .dot { background: var(--st-accepted); }
.stat-card[data-status="COMPLETED"] .dot { background: var(--st-completed); } .stat-card[data-status="CANCELLED"] .dot { background: var(--st-cancelled); }
.stat-card[data-status] .stat-label::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--color-text-muted); flex: none; }
.stat-card[data-status="PLANNING"] .stat-label::before { background: var(--st-planning); } .stat-card[data-status="QUOTE_REQUESTED"] .stat-label::before { background: var(--st-quote_requested); }
.stat-card[data-status="QUOTE_RECEIVED"] .stat-label::before { background: var(--st-quote_received); } .stat-card[data-status="ACCEPTED"] .stat-label::before { background: var(--st-accepted); }
.stat-card[data-status="COMPLETED"] .stat-label::before { background: var(--st-completed); } .stat-card[data-status="CANCELLED"] .stat-label::before { background: var(--st-cancelled); }
.stat-label { font-size: 14px; }
.count-text { font-size: 14px; font-weight: 500; color: var(--color-text-muted); }
.count-chip { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 22px; padding: 0 8px; border-radius: 999px; background: var(--color-primary-light); color: #b24a08; font-size: 14px; font-weight: 700; flex: none; }

.days-left { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--color-text-muted); white-space: nowrap; }
.days-left.days-soon { color: #b45309; font-weight: 600; } .days-left.days-over { color: #b91c1c; font-weight: 700; }
.meta-sm { font-size: 14px; }

/* ダッシュボード */
.page-header-desc { font-size: 15px; }
.dash-two { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(400px, 100%), 1fr)); gap: var(--sp-4); margin-bottom: var(--sp-4); }
.dash-two .card { margin: 0; display: flex; flex-direction: column; }
.dash-two .card-body { display: flex; flex-direction: column; flex: 1; }
.dash-main { display: grid; grid-template-columns: minmax(0, 2fr) minmax(220px, 1fr); gap: var(--sp-4); margin-bottom: var(--sp-4); align-items: start; }
.dash-main .card { margin: 0; }
.card-title { font-size: 16px; }
.case-rows { list-style: none; margin: 0; padding: 0; }
.case-row-item { margin: 0; border-bottom: 1px solid var(--color-surface-tertiary); }
.case-row-item:last-child { border-bottom: 0; }
.case-row { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-3) var(--sp-2); color: inherit; text-decoration: none; border-radius: var(--radius-md); }
.case-row:hover { background: var(--color-surface-secondary); text-decoration: none; color: inherit; }
.case-row-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.case-row-head { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2); }
.case-row-title { font-size: 15px; font-weight: 500; color: var(--color-text); overflow-wrap: anywhere; }
.case-row-dest { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; color: var(--color-text-muted); }
.case-row-arrow { color: var(--color-text-placeholder); flex: none; }
.case-row:hover .case-row-arrow { color: var(--color-primary); }
.view-all { display: block; margin-top: auto; padding: var(--sp-2) var(--sp-3); background: var(--color-surface-secondary); border-radius: var(--radius-md); text-align: center; font-size: 15px; font-weight: 500; text-decoration: none; }
.view-all:hover { background: var(--color-primary-light); text-decoration: none; }
.case-rows + .view-all, .empty-state + .view-all { margin-top: var(--sp-2); }
.dash-two .empty-state { padding: var(--sp-6) var(--sp-3); flex: 1; }
.next-rows { list-style: none; margin: 0; padding: 0; border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; }
.next-rows li { margin: 0; border-bottom: 1px solid var(--color-border); } .next-rows li:last-child { border-bottom: 0; }
.next-text { flex: 1 1 auto; min-width: 0; font-size: 15px; }
.next-actions .card-title::before { content: none; }
.ai-usage-head { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--color-text-muted); margin-bottom: var(--sp-1); }
.ai-usage .figure { font-size: 26px; }
.ai-usage dl.kv { margin: var(--sp-2) 0; }
.attention { border-color: #fca5a5; }
.attention-title { display: inline-flex; align-items: center; gap: var(--sp-2); }
.attention-title .icon { color: var(--color-error); }
.attention-rows { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.attention-rows li { margin: 0; }
.attention-rows a { display: block; color: var(--color-text); text-decoration: none; }
.attn-row { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border: 1px solid #fecaca; border-radius: var(--radius-md); }
.attn-high { background: #fef2f2; } .attn-low { background: #fffbeb; border-color: #fde68a; }
.attention-rows a:hover { text-decoration: none; filter: brightness(.97); }
.attn-title { font-size: 15px; font-weight: 500; flex: 1 1 auto; min-width: 0; }
.attn-reason { font-size: 14px; color: #b91c1c; }
.attn-low .attn-reason { color: #b45309; }
.attention-empty { border-color: var(--color-border); }
.onboarding { padding: var(--sp-6); background: linear-gradient(135deg, var(--color-primary-light), #fff 60%); border-color: #fed7aa; }
.onboarding-head { display: flex; gap: var(--sp-4); align-items: flex-start; margin-bottom: var(--sp-4); }
.onboarding-head h2 { margin: 0 0 4px; font-size: 20px; } .onboarding-head p { margin: 0; color: var(--color-text-secondary); }
.onboarding-icon { color: var(--color-primary); margin-top: 2px; }
.onboarding-steps { list-style: none; margin: 0 0 var(--sp-5); padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--sp-3); }
.onboarding-steps li { position: relative; display: flex; flex-direction: column; gap: 4px; padding: var(--sp-4); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); font-size: 14px; color: var(--color-text-muted); }
.onboarding-steps strong { font-size: 15px; color: var(--color-text); }
.onboarding-step-icon { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 10px; background: var(--color-primary-light); color: var(--color-primary); margin-bottom: 4px; }
.onboarding-step-no { position: absolute; top: var(--sp-3); right: var(--sp-3); font-size: 13px; font-weight: 700; color: var(--color-text-muted); }

/* 案件一覧: TripCard（約 90px。左の縦線が状態色。色は 状態・緊急度・行動 の 3 系統だけ） */
.trip-cards { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.trip-card { position: relative; margin: 0; padding: var(--sp-2) var(--sp-4); display: flex; flex-direction: column; gap: 4px; background: var(--color-surface); border: 1px solid var(--color-border); border-left: 5px solid var(--color-border-dark); border-radius: var(--radius-lg); box-shadow: 0 1px 2px rgba(0,0,0,.05); transition: box-shadow var(--transition); }
.trip-card:hover { box-shadow: 0 3px 10px rgba(0,0,0,.1); }
.trip-card[data-trip-status="planning"] { border-left-color: var(--st-planning); } .trip-card[data-trip-status="quote_requested"] { border-left-color: var(--st-quote_requested); }
.trip-card[data-trip-status="quote_received"] { border-left-color: var(--st-quote_received); } .trip-card[data-trip-status="accepted"] { border-left-color: var(--st-accepted); }
.trip-card[data-trip-status="completed"] { border-left-color: var(--st-completed); } .trip-card[data-trip-status="cancelled"] { border-left-color: var(--st-cancelled); }
.tc-row { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); min-width: 0; }
.trip-card-title { font-size: 16px; font-weight: 700; color: var(--color-text); text-decoration: none; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trip-card-title::after { content: ""; position: absolute; inset: 0; border-radius: var(--radius-lg); }
.trip-card-title:hover { color: var(--color-primary); text-decoration: none; }
.tc-meta, .tc-acts, .tc-dest { display: flex; align-items: center; gap: var(--sp-3); flex: none; white-space: nowrap; }
.tc-meta { color: var(--color-text-secondary); }
.tc-dest { flex: 1 1 auto; min-width: 0; color: var(--color-text-secondary); }
.tc-dest > span:first-child { overflow: hidden; text-overflow: ellipsis; }
.tc-amount { display: inline-flex; align-items: baseline; gap: 4px; color: var(--color-text); }
.tc-amount small, .tc-muted { color: var(--color-text-muted); font-size: 13px; }
.tc-acts { position: relative; z-index: 1; }
.days-chip { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 13px; font-weight: 600; background: var(--color-surface-tertiary); color: #475569; }
.days-chip-red { background: #fee2e2; color: #991b1b; } .days-chip-yellow { background: #fef3c7; color: #92400e; }
.ball-pill { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.ball-ours { background: var(--color-primary-hover); color: #fff; }
.ball-theirs { background: transparent; color: #475569; border: 1px solid var(--color-border-dark); padding: 1px 9px; }
.tc-last { justify-content: space-between; }
.trip-request { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; color: var(--color-text-secondary); }
.tc-last .tc-muted { flex: none; }
.filters-band { display: flex; flex-wrap: wrap; align-items: end; gap: var(--sp-3) var(--sp-4); margin: 0 0 var(--sp-4); padding: var(--sp-3) var(--sp-4); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-xl); }
.filters-band .filters { display: contents; }
.filters-band .field { margin: 0; flex: 0 1 190px; min-width: 150px; }
.filters-band .field label { display: flex; align-items: center; gap: 5px; font-size: 13px; color: var(--color-text-muted); }
.filters-band .btn { align-self: end; }
@media (max-width: 900px) { .dash-main { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .onboarding { padding: var(--sp-4); } .tc-row { flex-wrap: wrap; } .tc-meta, .tc-acts { flex-wrap: wrap; white-space: normal; } .trip-card-title { white-space: normal; } }
form.filters-band { max-width: none; }
.case-rows { margin-bottom: var(--sp-2); }
.dash-two .view-all { margin-top: auto; }
.case-row { padding: 10px var(--sp-2); }
.filters-band .field { flex: 1 1 140px; max-width: 190px; min-width: 130px; }
.filters-band .field:first-child { max-width: 240px; flex-basis: 200px; }
.trip-route { padding: 10px 14px; }
.next-hero { border-color: #fdba74; background: linear-gradient(180deg, #fffaf5, #fff 70%); }
.next-hero .card-title { display: flex; align-items: center; gap: var(--sp-2); font-size: 17px; }
.next-hero .card-title .icon { color: var(--color-primary); }
.next-rows li { display: flex; align-items: center; gap: var(--sp-3); padding: 10px var(--sp-3); background: var(--color-surface); }
.next-rows { background: var(--color-surface); }
.next-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.next-case { font-size: 15px; font-weight: 600; color: var(--color-text); text-decoration: none; } .next-case:hover { color: var(--color-primary); }
.next-text small { font-size: 14px; color: var(--color-text-muted); }
/* <<< dash */

/* >>> case */
/* ===== Planner: 案件詳細・案件フォーム ===== */
/* 案件ページ: 本文＋右の AI 相談パネル。パネルは画面の右に固定（自分でスクロール）し、左端のハンドルで幅を変えられる（resize.js。2026-10-20 CEO 指示） */
.case-layout { --aside-w: 420px; display: grid; grid-template-columns: minmax(0, 1fr) var(--aside-w); gap: var(--sp-4); align-items: start; }
.case-main { min-width: 0; }
/* パネルは画面の右に固定（fixed）。sticky だとページ末尾のフッターに押されてトップバーの下に潜るため。グリッドの右列は場所取りだけ */
.case-aside { position: fixed; top: calc(var(--topbar-h, 48px) + var(--sp-4)); right: var(--sp-4); bottom: var(--sp-4); width: var(--aside-w); overflow: hidden; overscroll-behavior: contain; z-index: 1; }
.aside-resizer { position: absolute; left: -6px; top: 0; bottom: 0; width: 10px; cursor: col-resize; z-index: 2; touch-action: none; }
.aside-resizer::after { content: ""; position: absolute; left: 4px; top: 0; bottom: 0; width: 2px; border-radius: 2px; background: transparent; transition: background var(--transition); }
.aside-resizer:hover::after, body.is-resizing .aside-resizer::after { background: var(--color-primary); }
body.is-resizing { cursor: col-resize; user-select: none; }
.case-head { padding: var(--sp-4); border-radius: var(--radius-xl); }
.case-head-top { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-3); }
.case-head-title { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; min-width: 0; }
.case-head-title h2 { margin: 0; font-size: 20px; font-weight: 600; overflow-wrap: anywhere; }
/* 見出し横の操作ボタン群（HeaderActions）。中のボタンは size="sm" でも通常の大きさ */
.head-actions, .case-head-actions { display: flex; gap: var(--sp-2); flex-wrap: wrap; }
.head-actions .btn, .page-header-actions .btn { height: 36px; padding: 0 var(--sp-4); font-size: 15px; }
.request-box { margin: var(--sp-3) 0 0; padding: var(--sp-3); background: var(--color-surface-secondary); border-radius: var(--radius-md); font-size: 15px; color: var(--color-text-secondary); white-space: pre-wrap; }
.request-special { display: flex; gap: var(--sp-2); background: #f0f9ff; color: #075985; margin-top: var(--sp-2); }
.request-special .icon { margin-top: 3px; flex: none; }
.chat-card { margin: 0; }
.chat-card-head { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-3); color: var(--color-primary); }
.chat-card-head h2 { margin: 0; font-size: 15px; font-weight: 700; color: var(--color-text); }
.chat-card .banner { margin-bottom: var(--sp-3); font-size: 14px; }
.chat-card .btn { width: 100%; }
.overview-kv { margin-top: var(--sp-4) !important; grid-template-columns: max-content 1fr; }
.policy-lines { margin: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.policy-lines > div { display: grid; grid-template-columns: 9em 1fr; gap: var(--sp-3); font-size: 15px; }
.policy-lines dt { color: var(--color-text-muted); } .policy-lines dd { margin: 0; }
.req-grid { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--sp-3); }
.req-cell { position: relative; padding: var(--sp-3) var(--sp-3) var(--sp-3); background: var(--color-surface-secondary); border: 1px solid var(--color-border); border-radius: var(--radius-md); min-height: 74px; }
.req-cell[data-confirmed="false"] { background: #fff7ed; border-color: #fdba74; }
.req-cell dt { font-size: 13px; font-weight: 600; color: var(--color-text-muted); margin-bottom: 4px; padding-right: 3.5em; }
.req-cell dd { margin: 0; font-size: 15px; overflow-wrap: anywhere; white-space: pre-wrap; }
.req-state { position: absolute; top: 8px; right: 8px; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #dcfce7; color: #15803d; }
.req-cell[data-confirmed="false"] .req-state { background: #ffedd5; color: #c2410c; }
.proposal-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr)); gap: var(--sp-4); }
.proposal-card { margin: 0; display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-4); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.proposal-card[data-proposal-status="generating"] { background: linear-gradient(135deg, #ede9fe, #ddd6fe); border-color: #c4b5fd; }
.proposal-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-2); }
.proposal-card-title { font-size: 15px; font-weight: 600; color: var(--color-text); text-decoration: none; overflow-wrap: anywhere; }
.proposal-card-title:hover { color: var(--color-primary); }
.proposal-route { margin: 0; padding: var(--sp-2) var(--sp-3); background: var(--color-surface-secondary); border-radius: var(--radius-md); font-size: 14px; color: var(--color-text-secondary); }
.proposal-route span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.proposal-sub { margin: 0; font-size: 14px; color: var(--color-text-muted); }
.proposal-price { display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; padding-top: var(--sp-2); border-top: 1px solid var(--color-surface-tertiary); font-size: 14px; color: var(--color-text-muted); }
.proposal-price strong { font-size: 18px; color: var(--color-text); }
.proposal-card-actions { display: flex; gap: var(--sp-2); flex-wrap: wrap; margin-top: auto; }
.empty-inline { margin: 0; padding: var(--sp-5); text-align: center; color: var(--color-text-muted); background: var(--color-surface-secondary); border-radius: var(--radius-md); }
.link-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--sp-3); }
.link-card { display: flex; align-items: center; gap: var(--sp-3); padding: 14px var(--sp-4); background: var(--color-surface-secondary); border: 1px solid var(--color-border); border-radius: 10px; color: var(--color-text); text-decoration: none; }
.link-card:hover { background: var(--color-primary-light); border-color: #fdba74; text-decoration: none; color: var(--color-text); }
.link-card > .icon:first-child { color: var(--color-primary); }
.link-card span { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.link-card small { color: var(--color-text-muted); font-size: 13px; }
.danger-card { border-color: #fecaca; }
.clarify-card { border-color: #fdba74; background: #fffaf5; }
form.form-wide { max-width: none; }
.card .table-wrap { margin: var(--sp-3) 0 0; }
@media (max-width: 1000px) { .case-layout { grid-template-columns: 1fr; } .case-aside { position: static; width: auto; height: auto; overflow: visible; } .aside-resizer { display: none; } .consult-panel { height: auto; } .consult-thread { max-height: 520px; } }
.form-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* 新規案件フォーム: 担当者は右上の小さなセレクト、予算の切り替えは 1 行 */
.case-form-assignee { display: flex; justify-content: flex-end; margin-bottom: var(--sp-2); }
.case-form-assignee .field { margin: 0; display: flex; align-items: center; gap: var(--sp-2); }
.case-form-assignee .field select { width: auto; min-width: 12em; }
.choice-row { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); align-items: center; }
.choice-row .checkbox input { width: auto; height: auto; accent-color: var(--color-primary); }
.prev-inputs .request-box { margin-top: var(--sp-2); }
.req-cell[data-ai-draft="true"] { background: #f5f3ff; border-color: #c4b5fd; }
.req-cell[data-ai-draft="true"] .req-state { background: #ede9fe; color: #6d28d9; }
.inquiry-items { margin-top: var(--sp-4); }
.inquiry-items > summary { cursor: pointer; font-weight: 600; font-size: 14px; margin-bottom: var(--sp-3); }
.more-conditions { margin: 0 0 var(--sp-4); }
.more-conditions > summary { display: flex; align-items: center; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4); background: var(--color-surface); border: 1px dashed var(--color-border-dark); border-radius: var(--radius-xl); cursor: pointer; font-size: 15px; font-weight: 600; list-style: none; }
.more-conditions > summary::-webkit-details-marker { display: none; }
.more-conditions > summary small { margin-left: var(--sp-2); font-weight: 400; font-size: 14px; color: var(--color-text-muted); }
.more-conditions > summary .icon { transition: transform var(--transition); color: var(--color-primary); }
.more-conditions[open] > summary { margin-bottom: var(--sp-3); border-style: solid; }
.more-conditions[open] > summary .icon { transform: rotate(90deg); }
@media (max-width: 767px) { .form-grid-3 { grid-template-columns: 1fr; } }
.next-step { padding: var(--sp-4) var(--sp-5); border-color: #fdba74; background: #fffdfa; }
.next-step .steps { margin-bottom: var(--sp-4); }
.next-step-guide { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; padding: var(--sp-3) var(--sp-4); background: #fffbeb; border: 1px solid #fde68a; border-radius: var(--radius-lg); color: #78350f; }
.next-step-guide .icon { color: #d97706; flex: none; }
.next-step-guide p { flex: 1 1 280px; margin: 0; font-size: 15px; font-weight: 500; }
/* <<< case */

/* >>> itin */
/* ===== 行程（スケジュール）の表示 ===== */
.itinerary { display: flex; flex-direction: column; gap: var(--sp-4); }
.day-card { padding: var(--sp-5); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-xl); box-shadow: var(--shadow-card); }
.day-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.day-head h3 { margin: 0; font-size: 18px; font-weight: 600; }
.day-date { font-size: 15px; color: var(--color-text-muted); }
.day-empty { margin: 0; padding: var(--sp-6); text-align: center; background: var(--color-surface-secondary); border-radius: var(--radius-lg); color: var(--color-text-muted); font-size: 15px; }
.sched { list-style: none; margin: 0 0 var(--sp-3); padding: 0; }
.sched > li { display: grid; grid-template-columns: 56px 24px minmax(0, 1fr); column-gap: var(--sp-2); margin: 0; }
.sched-time { text-align: right; padding-top: 11px; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 15px; color: #475569; }
.sched-time strong { font-weight: 600; font-variant-numeric: tabular-nums; }
.sched-time-dep { font-size: 14px; color: var(--color-text-muted); font-variant-numeric: tabular-nums; }
.sched-time-none { color: var(--color-text-placeholder); }
.sched-rail { position: relative; display: flex; justify-content: center; min-height: 60px; }
.sched-rail::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; margin-left: -1px; background: var(--color-border); }
.sched > li:first-child .sched-rail::before { top: 17px; }
.sched > li:last-child .sched-rail::before { bottom: auto; height: 18px; }
.sched > li:first-child:last-child .sched-rail::before { display: none; }
.sched-dot { position: relative; z-index: 1; margin-top: 11px; width: 14px; height: 14px; border-radius: 50%; background: var(--kind, #3b82f6); border: 3px solid #fff; box-shadow: 0 0 0 2px color-mix(in srgb, var(--kind, #3b82f6) 40%, transparent); }
.sched-card { display: flex; flex-direction: column; gap: 4px; margin: 0 0 var(--sp-2) var(--sp-2); padding: 10px var(--sp-4); background: var(--color-surface); border: 1px solid var(--color-border); border-left: 4px solid var(--kind, #3b82f6); border-radius: 10px; }
.sched-title { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; font-size: 15px; font-weight: 600; }
.sched-title .icon { color: var(--kind, #3b82f6); }
.sched-kind { padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 500; color: var(--color-text-muted); background: var(--color-surface-tertiary); }
.sched-cost { margin-left: auto; font-size: 14px; font-weight: 500; color: var(--color-text-secondary); font-variant-numeric: tabular-nums; }
.sched-note { font-size: 15px; color: var(--color-text-muted); padding-left: 26px; }
[data-item-kind="SPOT"] { --kind: #3b82f6; } [data-item-kind="ACTIVITY"] { --kind: #f97316; } [data-item-kind="MEAL"] { --kind: #22c55e; }
[data-item-kind="ACCOMMODATION"] { --kind: #a855f7; } [data-item-kind="TRANSPORT"] { --kind: #64748b; } [data-item-kind="SHOPPING"] { --kind: #ec4899; } [data-item-kind="REST"] { --kind: #78716c; }
/* 移動: 行の間に点線と移動バッジ */
.move-row .sched-rail { min-height: 52px; }
.move-row .sched-rail::before { background: none; border-left: 2px dotted var(--color-border-dark); width: 0; margin-left: -1px; }
.move-row .sched-time { padding-top: 14px; font-size: 14px; color: var(--color-text-muted); }
.move-body { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; padding: 8px 0 8px var(--sp-2); }
.move-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--color-surface-tertiary); border: 1px dashed var(--color-border-dark); border-radius: 16px; font-size: 15px; color: #475569; }
.move-badge span { font-weight: 500; } .move-badge strong { font-weight: 600; color: var(--color-text-muted); }
.move-text { font-size: 14px; color: var(--color-text-muted); }
.day-box { display: flex; gap: var(--sp-3); align-items: flex-start; margin: var(--sp-2) 0 0; padding: 14px var(--sp-4); border: 1px solid; border-radius: 10px; font-size: 15px; }
.day-box .icon { margin-top: 3px; flex: none; }
.day-box strong { display: block; margin-bottom: 2px; font-size: 14px; }
.day-box small { display: block; font-size: 14px; opacity: .85; margin-top: 2px; }
.day-meals { background: #f0fdf4; border-color: #bbf7d0; color: #166534; } .day-meals .icon { color: #22c55e; }
.day-lodging { background: #faf5ff; border-color: #e9d5ff; color: #6b21a8; } .day-lodging .icon { color: #a855f7; }
.day-notes { background: #fefce8; border-color: #fef08a; color: #713f12; } .day-notes .icon { color: #ca8a04; }
@media (max-width: 767px) { .day-card { padding: var(--sp-3); } .sched > li { grid-template-columns: 44px 20px minmax(0, 1fr); } .sched-card { margin-left: 4px; padding: 8px var(--sp-3); } }
/* <<< itin */

/* >>> plan */
/* ===== Planner: 企画詳細 ===== */
.proposal-overview { padding: 0; border-radius: var(--radius-xl); overflow: hidden; }
.proposal-overview > * { padding-left: var(--sp-6); padding-right: var(--sp-6); }
.po-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; padding-top: var(--sp-5); padding-bottom: var(--sp-3); }
.po-title { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; min-width: 0; }
.po-title h2 { margin: 0; font-size: 24px; font-weight: 700; overflow-wrap: anywhere; line-height: 1.3; }
.status-banner { display: flex; align-items: center; gap: var(--sp-4); margin: 0 var(--sp-6) var(--sp-4); padding: 14px var(--sp-5); border: 2px solid var(--sb-border, #cbd5e1); border-radius: var(--radius-xl); background: var(--sb-bg, #f8fafc); color: var(--sb-fg, #475569); }
.status-banner-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: none; background: #fff; border-radius: 10px; box-shadow: 0 1px 3px rgba(0,0,0,.12); color: var(--sb-icon, #64748b); }
.status-banner-text { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.status-banner-text strong { font-size: 16px; font-weight: 700; } .status-banner-text span { font-size: 15px; }
.status-banner-code { padding: 3px 12px; border-radius: 999px; background: #fff; font-size: 14px; font-weight: 600; letter-spacing: .02em; }
.status-banner[data-banner="generating"], .status-banner[data-banner="generation_failed"] { --sb-bg: #fef2f2; --sb-border: #f87171; --sb-fg: #991b1b; --sb-icon: #ef4444; }
.status-banner[data-banner="generating"] { --sb-bg: #f5f3ff; --sb-border: #a78bfa; --sb-fg: #5b21b6; --sb-icon: #8b5cf6; }
.status-banner[data-banner="draft"] { --sb-bg: #f8fafc; --sb-border: #cbd5e1; --sb-fg: #475569; --sb-icon: #64748b; }
.status-banner[data-banner="proposed"] { --sb-bg: #fffbeb; --sb-border: #fbbf24; --sb-fg: #92400e; --sb-icon: #f59e0b; }
.status-banner[data-banner="quote_requested"] { --sb-bg: #eff6ff; --sb-border: #60a5fa; --sb-fg: #1e40af; --sb-icon: #3b82f6; }
.status-banner[data-banner="quote_received"] { --sb-bg: #ecfdf5; --sb-border: #34d399; --sb-fg: #065f46; --sb-icon: #10b981; }
.status-banner[data-banner="accepted"] { --sb-bg: #f0fdf4; --sb-border: #4ade80; --sb-fg: #166534; --sb-icon: #22c55e; }
.status-banner[data-banner="rejected"] { --sb-bg: #fef2f2; --sb-border: #f87171; --sb-fg: #991b1b; --sb-icon: #ef4444; }
.status-banner[data-banner="cancelled"] { --sb-bg: #f3f4f6; --sb-border: #9ca3af; --sb-fg: #374151; --sb-icon: #6b7280; }
.po-meta { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; padding-bottom: var(--sp-4); }
.po-badges { display: flex; gap: var(--sp-2); flex-wrap: wrap; }
.po-prices { display: flex; gap: var(--sp-3); flex-wrap: wrap; }
.price-box { display: flex; flex-direction: column; gap: 1px; padding: 8px 14px; border: 1px solid #fcd34d; border-radius: var(--radius-lg); background: #fffbeb; min-width: 128px; }
.price-box .price-label { font-size: 12px; font-weight: 600; color: #92400e; }
.price-box strong { font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; }
.price-box.price-total { background: #fef3c7; border-color: #fbbf24; }
.price-box[data-confirmed="true"] { background: #f0fdf4; border-color: #86efac; } .price-box[data-confirmed="true"] .price-label { color: #166534; }
.price-box.price-total[data-confirmed="true"] { background: #eff6ff; border-color: #93c5fd; } .price-box.price-total[data-confirmed="true"] .price-label { color: #1e40af; }
.po-summary { padding-bottom: var(--sp-4); }
.po-summary .prose { margin: 0; padding: var(--sp-3) var(--sp-4); background: var(--color-surface-secondary); border-radius: var(--radius-lg); font-size: 15px; line-height: 1.7; }
.po-two { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--sp-5); padding-bottom: var(--sp-5); }
.po-two h3 { display: flex; align-items: center; gap: 6px; margin: 0 0 var(--sp-2); font-size: 15px; }
.num-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); counter-reset: n; }
.num-list li { display: flex; gap: var(--sp-3); align-items: flex-start; font-size: 15px; counter-increment: n; }
.num-list li::before { content: counter(n); flex: none; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; font-size: 13px; font-weight: 700; }
.num-ok li::before { background: #dcfce7; color: #166534; } .num-warn li::before { background: #ffedd5; color: #9a3412; }
.actions-card { display: flex; gap: var(--sp-2); flex-wrap: wrap; align-items: center; padding: var(--sp-3) var(--sp-4); }
.actions-card .actions-moves, .actions-card .actions-delete { display: inline-flex; gap: var(--sp-2); }
.actions-card .actions-delete { margin-left: auto; }
.cost-rows { list-style: none; margin: 0 0 var(--sp-3); padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.cost-row { display: flex; align-items: center; gap: var(--sp-3); margin: 0; padding: 10px var(--sp-3); background: var(--color-surface-secondary); border-radius: var(--radius-lg); }
.cost-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; background: #fff; border: 1px solid var(--color-border); color: var(--color-primary); }
.cost-name { flex: 1; font-size: 15px; } .cost-row strong { font-variant-numeric: tabular-nums; }
.cost-total { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--sp-4); padding: var(--sp-4) var(--sp-5); background: #1e293b; color: #fff; border-radius: var(--radius-xl); }
.cost-total div { display: flex; flex-direction: column; gap: 2px; } .cost-total span { font-size: 14px; color: #cbd5e1; }
.cost-total strong { font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; }
.note-estimate { margin: var(--sp-3) 0 0; padding: var(--sp-2) var(--sp-3); background: #fffbeb; border-radius: var(--radius-md); font-size: 14px; color: #92400e; }
.price-detail { margin-top: var(--sp-4); } .price-detail summary { cursor: pointer; font-size: 15px; font-weight: 600; color: var(--color-text-secondary); margin-bottom: var(--sp-2); }
.price-detail dl.kv { margin: var(--sp-2) 0; }
.include-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--sp-4); margin-bottom: var(--sp-4); }
.include-box { padding: var(--sp-4); border-radius: var(--radius-xl); border: 1px solid; }
.include-box h3 { display: flex; align-items: center; gap: 6px; margin: 0 0 var(--sp-2); font-size: 15px; }
.include-box ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; font-size: 15px; }
.include-box li { padding-left: 18px; position: relative; } .include-box li::before { content: ""; position: absolute; left: 4px; top: .65em; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.include-box p { margin: 0; }
.include-yes { background: #f0fdf4; border-color: #bbf7d0; color: #166534; } .include-yes h3 { color: #166534; }
.include-no { background: #fef2f2; border-color: #fecaca; color: #991b1b; } .include-no h3 { color: #991b1b; }
.include-box .hint { color: inherit; opacity: .8; }
@media (max-width: 767px) { .proposal-overview > * { padding-left: var(--sp-4); padding-right: var(--sp-4); } .status-banner { margin-left: var(--sp-4); margin-right: var(--sp-4); flex-wrap: wrap; } .po-title h2 { font-size: 20px; } .actions-card .actions-delete { margin-left: 0; } }
/* <<< plan */

/* >>> edit */
/* ===== Planner: 企画の編集・作成（2 ペイン）・企画の管理 ===== */
.edit-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--sp-4); align-items: start; }
.edit-main { min-width: 0; }
.edit-aside { position: sticky; top: calc(var(--topbar-h) + var(--sp-4)); }
.ai-guide { margin: 0; }
.ai-guide h2 { display: flex; align-items: center; gap: 6px; margin: 0 0 var(--sp-3); font-size: 16px; color: var(--color-text); }
.ai-guide h2 .icon { color: var(--color-primary); }
.ai-guide .btn { width: 100%; margin-top: var(--sp-2); }
.suggest-list { list-style: none; margin: 0 0 var(--sp-3); padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.suggest-list li { padding: 4px 10px; border-radius: 999px; background: var(--color-primary-light); color: #b24a08; font-size: 14px; }
.guide-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); counter-reset: s; }
.guide-steps li { position: relative; padding-left: 36px; display: flex; flex-direction: column; gap: 2px; font-size: 14px; color: var(--color-text-muted); counter-increment: s; }
.guide-steps li::before { content: counter(s); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--color-primary); color: #fff; font-weight: 700; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; }
.guide-steps strong { font-size: 15px; color: var(--color-text); }
.method-card { padding: var(--sp-5); border-radius: var(--radius-xl); }
.method-ai { border-color: #fdba74; }
.method-head { display: flex; gap: var(--sp-4); align-items: flex-start; margin-bottom: var(--sp-4); }
.method-head h2 { display: flex; align-items: center; gap: var(--sp-2); margin: 0 0 4px; font-size: 18px; }
.method-head .hint { margin: 0; font-size: 15px; }
.method-icon { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; flex: none; border-radius: 12px; background: var(--color-primary-light); color: var(--color-primary); }
.method-icon-muted { background: var(--color-surface-tertiary); color: #475569; }
.choice-box { margin: 0 0 var(--sp-4); background: var(--color-surface-secondary); box-shadow: none; }
.days-edit > h2 { margin: var(--sp-6) 0 var(--sp-1); }
fieldset.day-edit > legend { font-size: 16px; }
.edit-items { margin: 0 0 var(--sp-2); box-shadow: none; }
.edit-items table input, .edit-items table select { width: 100%; max-width: none; min-width: 5.5rem; }
.edit-items td { padding: 6px var(--sp-2); vertical-align: top; }
.edit-items td:first-child { min-width: 6.5rem; } .edit-items td:first-child input { display: block; margin-bottom: 4px; }
.edit-items td:nth-child(2) { min-width: 11rem; }
form.delete-day { margin: calc(-1 * var(--sp-2)) 0 var(--sp-4); text-align: right; }
.row-actions { display: inline-flex; gap: var(--sp-2); flex-wrap: wrap; }
@media (max-width: 1000px) { .edit-layout { grid-template-columns: 1fr; } .edit-aside { position: static; } .form-grid { grid-template-columns: 1fr; } }
section.ai-guide > h2:first-child { margin-top: 0; }
.export-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: var(--sp-4); align-items: start; }
.export-side { position: sticky; top: calc(var(--topbar-h) + var(--sp-4)); }
.export-side .card { margin: 0 0 var(--sp-3); }
.export-side { max-height: calc(100vh - var(--topbar-h) - var(--sp-6)); overflow-y: auto; }
.export-side .fx-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-2); }
.export-side .fx-list details { margin-top: var(--sp-1); }
.export-side .fx-list table { width: 100%; font-size: 13px; }
.export-side .fx-list td:last-child, .export-side .fx-list th:last-child { text-align: right; }
.translation-table { width: 100%; border-collapse: collapse; }
.translation-table th, .translation-table td { vertical-align: top; text-align: left; padding: var(--sp-2); border-bottom: 1px solid var(--border, #e5e7eb); }
.translation-table td:first-child { width: 45%; white-space: pre-wrap; }
.translation-table textarea { width: 100%; box-sizing: border-box; }
.export-preview > h2 { margin: 0 0 var(--sp-2); font-size: 16px; }
.export-preview .document { margin-top: 0; border-radius: var(--radius-xl); padding: var(--sp-6); box-shadow: var(--shadow-card); }
.stack-actions { display: flex; flex-direction: column; gap: var(--sp-2); margin-bottom: var(--sp-3); }
.stack-actions .btn { width: 100%; }
@media (max-width: 1000px) { .export-layout { grid-template-columns: 1fr; } .export-side { position: static; } }
/* <<< edit */

/* >>> quotes */
/* ===== Planner: 見積・確認書・見積依頼 ===== */
.detail-top { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-2); }
.detail-top .back-button { margin-bottom: 0; }
.quote-cards, .confirm-cards { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.quote-card { display: flex; align-items: center; gap: var(--sp-5); flex-wrap: wrap; margin: 0; padding: var(--sp-4) var(--sp-5); background: var(--color-surface); border: 1px solid var(--color-border); border-left: 4px solid var(--color-border-dark); border-radius: var(--radius-xl); box-shadow: var(--shadow-card); }
.quote-card[data-quote-state="latest"] { border-left-color: var(--color-success); } .quote-card[data-quote-state="accepted"] { border-left-color: var(--st-accepted); }
.quote-card[data-quote-state="expired"] { border-left-color: var(--color-error); } .quote-card[data-quote-state="superseded"] { opacity: .8; }
.quote-card-main { flex: 1 1 280px; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.quote-card-head { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.quote-card-title { font-size: 16px; font-weight: 700; color: var(--color-text); text-decoration: none; }
.quote-card-title:hover { color: var(--color-primary); }
.quote-card-plan { font-size: 15px; color: var(--color-text-secondary); }
.quote-card-price { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.quote-card-price .price-label { font-size: 13px; color: var(--color-text-muted); } .quote-card-price strong { font-size: 22px; font-variant-numeric: tabular-nums; } .price-sub { font-size: 14px; color: var(--color-text-muted); }
.quotes-foot { display: flex; align-items: center; gap: 6px; }
.quote-hero { padding: var(--sp-5); border-radius: var(--radius-xl); }
.quote-hero-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-1); }
.quote-hero-head h2 { margin: 0; font-size: 20px; }
.quote-hero-names { display: flex; align-items: center; gap: 4px; margin: 0 0 var(--sp-4); font-size: 15px; color: var(--color-text-muted); flex-wrap: wrap; }
.quote-amount, .amount-line { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: var(--sp-3); margin-bottom: var(--sp-4); }
.amount-box { display: flex; flex-direction: column; gap: 2px; padding: var(--sp-3) var(--sp-4); background: var(--color-surface-secondary); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.amount-box span { font-size: 13px; font-weight: 600; color: var(--color-text-muted); } .amount-box strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.amount-main { background: var(--color-primary-light); border-color: #fdba74; } .amount-main strong { font-size: 26px; color: #9a3412; }
.terms-rows { margin: 0; display: flex; flex-direction: column; gap: 1px; background: var(--color-border); border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: hidden; }
.terms-rows > div { display: grid; grid-template-columns: minmax(120px, 30%) 1fr; gap: var(--sp-3); padding: 10px var(--sp-3); background: var(--color-surface); font-size: 15px; }
.terms-rows dt { color: var(--color-text-muted); overflow-wrap: anywhere; } .terms-rows dd { margin: 0; overflow-wrap: anywhere; }
.quote-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: var(--sp-6); padding: var(--sp-5); border-radius: var(--radius-xl); }
.quote-action h2 { margin: 0 0 var(--sp-2) !important; font-size: 16px; }
.request-names { margin: 0 0 var(--sp-3); display: flex; flex-direction: column; gap: 4px; }
.request-names > div { display: grid; grid-template-columns: 7em 1fr; gap: var(--sp-3); font-size: 15px; } .request-names dt { color: var(--color-text-muted); } .request-names dd { margin: 0; font-weight: 500; }
.amount-line { margin-top: var(--sp-4); }
.confirm-card { margin: 0; padding: var(--sp-4) var(--sp-5); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-xl); box-shadow: var(--shadow-card); }
.confirm-head { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; margin-bottom: var(--sp-3); }
.confirm-icon { color: var(--color-success); }
.confirm-title { flex: 1; display: flex; flex-direction: column; min-width: 0; } .confirm-title strong { font-size: 16px; } .confirm-title a { font-size: 15px; }
.confirm-grid { margin: 0 0 var(--sp-3); display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--sp-2); }
.confirm-grid > div { padding: var(--sp-2) var(--sp-3); background: var(--color-surface-secondary); border-radius: var(--radius-md); }
.confirm-grid dt { font-size: 13px; color: var(--color-text-muted); } .confirm-grid dd { margin: 0; font-size: 15px; font-weight: 500; overflow-wrap: anywhere; }
.confirm-foot { display: flex; justify-content: flex-end; }
.confirm-section { margin: var(--sp-4) 0 0; box-shadow: none; }
.confirm-section .quote-amount { margin-bottom: var(--sp-3); }
.confirm-reference, .confirm-pdfs { margin: 0 0 var(--sp-3); padding-left: var(--sp-5); }
.confirm-suppliers td:first-child { white-space: nowrap; font-weight: 500; }
@media (max-width: 767px) { .quote-card-price { align-items: flex-start; } }
/* <<< quotes */

/* >>> chat */
/* ===== Planner: チャット・通知・お客様情報 ===== */
.chat-head { display: flex; gap: var(--sp-5); justify-content: space-between; align-items: flex-start; flex-wrap: wrap; border-radius: var(--radius-xl); }
.chat-head h2 { margin: 0 0 2px; font-size: 20px; } .chat-head .hint { margin: 0; font-size: 15px; }
.chat-info { margin: 0; padding: var(--sp-3); background: var(--color-surface-secondary); border-radius: var(--radius-lg); display: grid; grid-template-columns: repeat(2, minmax(150px, 1fr)); gap: var(--sp-2) var(--sp-5); font-size: 14px; }
.chat-info dt { display: flex; align-items: center; gap: 4px; color: var(--color-text-muted); font-size: 13px; } .chat-info dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }
.chat-pane { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-xl); overflow: hidden; }
ol.chat-thread { list-style: none; margin: 0; padding: var(--sp-4) var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-3); min-height: 240px; background: var(--color-surface-secondary); }
ol.chat-thread li, ol.chat-thread li[data-sender] { background: none; border: 0; border-left: 0; padding: 0; margin: 0; }
.chat-day { display: flex; align-items: center; gap: var(--sp-3); font-size: 13px; color: var(--color-text-muted); }
.chat-day::before, .chat-day::after { content: ""; flex: 1; height: 1px; background: var(--color-border); }
.chat-day span { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 999px; }
.bubble-row { display: flex; justify-content: flex-start; }
.bubble-row[data-sender="USER"] { justify-content: flex-end; }
.bubble-row[data-sender="SYSTEM"] { justify-content: center; }
.bubble { max-width: 70%; padding: 10px 14px; border-radius: 12px; background: var(--color-surface); border: 1px solid var(--color-border); box-shadow: var(--shadow-card); font-size: 15px; line-height: 1.6; }
.bubble-row[data-sender="USER"] .bubble { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.bubble-row[data-sender="USER"] .bubble a, .bubble-row[data-sender="USER"] .bubble-meta { color: #fff; }
.bubble-row[data-sender="SYSTEM"] .bubble { background: var(--color-surface-tertiary); box-shadow: none; text-align: center; max-width: 85%; }
.bubble-meta { margin-bottom: 2px; font-size: 13px; color: var(--color-text-muted); } .bubble p { margin: 0; }
.bubble-row[data-sender="USER"] .bubble-meta { opacity: .92; }
.chat-pane .empty-state { background: var(--color-surface-secondary); }
form.chat-input { max-width: none; padding: var(--sp-3) var(--sp-5); border-top: 1px solid var(--color-border); background: var(--color-surface); flex: none; }
form.chat-input .field { margin-bottom: var(--sp-2); }
form.chat-input .hint { font-size: 12px; }
/* 担当者チャット: 画面の高さいっぱいに「見出し／やり取り／入力」を縦に並べ、入力を画面の下に固定する。やり取りだけがスクロールする */
.chat-layout { display: flex; flex-direction: column; gap: var(--sp-3); height: calc(100dvh - var(--topbar-h, 48px) - var(--sp-4) * 2); min-height: 420px; }
.chat-layout .chat-head { flex: none; }
.chat-layout .chat-pane { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
.chat-layout ol.chat-thread { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.chat-layout .chat-pane .empty-state { flex: 1 1 auto; }
.chat-layout .chat-pane > .hint, .chat-layout .chat-pane > .poll-status { flex: none; }
.app-body:has(.chat-layout) .site-footer { display: none; }
.chat-input-row { display: flex; gap: var(--sp-4); align-items: flex-end; flex-wrap: wrap; }
.chat-input-row .field { flex: 1 1 260px; margin: 0; }
@media (max-width: 767px) { .bubble { max-width: 90%; } .chat-info { grid-template-columns: 1fr 1fr; } }
.notif-list { list-style: none; margin: 0 0 var(--sp-4); padding: 0; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; }
.notif-row { display: flex; gap: var(--sp-3); align-items: flex-start; margin: 0; padding: var(--sp-3) var(--sp-4); border-bottom: 1px solid var(--color-border); }
.notif-row:last-child { border-bottom: 0; }
.notif-row[data-unread="true"] { background: var(--color-primary-light); }
.notif-row[data-unread="true"] strong { font-weight: 700; }
.notif-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--color-surface-tertiary); color: var(--color-text-muted); }
.notif-row[data-unread="true"] .notif-icon { background: #fff; color: var(--color-primary); }
.notif-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.notif-type { font-size: 13px; color: var(--color-text-muted); }
.notif-body strong a { color: var(--color-text); } .notif-body .hint { margin: 0; font-size: 14px; }
.notif-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font-size: 13px; color: var(--color-text-muted); flex: none; }
.notif-side form { margin: 0; }
.status.status-unread { background: #fee2e2; color: #991b1b; } .status.status-read { background: var(--color-surface-tertiary); color: #475569; }
.muted-count { color: var(--color-text-muted); font-size: 14px; }
.lead { font-size: 15px; margin: 0 0 var(--sp-3); }
/* <<< chat */

/* >>> settings */
/* ===== Planner: 設定系・アカウント ===== */
.page-lead { margin: 0 0 var(--sp-3); font-size: 15px; color: var(--color-text-muted); }
form.form-cols { max-width: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--sp-4); align-items: start; }
form.form-cols > .btn, form.form-cols > button { grid-column: 1 / -1; justify-self: start; }
form.form-cols > .hint, form.form-cols > p { grid-column: 1 / -1; }
.center-card { text-align: center; padding: var(--sp-6); }
.center-card .kv { text-align: left; }
.center-card form { text-align: left; }
.center-note { margin: var(--sp-3) 0 0; text-align: center; font-size: 14px; }
.apply-done-card { display: flex; flex-direction: column; align-items: center; gap: var(--sp-3); margin-top: var(--sp-4); }
.done-circle { display: inline-flex; align-items: center; justify-content: center; width: 80px; height: 80px; border-radius: 50%; background: var(--color-success-bg); color: #059669; }
.steps-40 { max-width: 420px; margin: 0 auto var(--sp-4); }
.legal-card .prose { font-family: inherit; white-space: pre-wrap; font-size: 15px; line-height: 1.8; }
.legal-body { font-size: 15px; line-height: 1.9; overflow-wrap: anywhere; }
.legal-body h1 { font-size: 22px; margin: var(--sp-4) 0 var(--sp-3); }
.legal-body h2 { font-size: 17px; margin: var(--sp-6) 0 var(--sp-2); padding-bottom: var(--sp-1); border-bottom: 1px solid var(--color-border); scroll-margin-top: var(--sp-6); }
.legal-body h3 { font-size: 15px; margin: var(--sp-4) 0 var(--sp-2); scroll-margin-top: var(--sp-6); }
.legal-body p { margin: 0 0 var(--sp-3); }
.legal-body ul, .legal-body ol { margin: 0 0 var(--sp-3); padding-left: 1.6em; }
.legal-body li { margin: 2px 0; }
.legal-body table { border-collapse: collapse; margin: 0 0 var(--sp-3); font-size: 14px; display: block; overflow-x: auto; }
.legal-body th, .legal-body td { border: 1px solid var(--color-border); padding: var(--sp-1) var(--sp-3); text-align: left; vertical-align: top; }
.legal-body th { background: var(--color-surface-secondary); }
.legal-body a { text-decoration: underline; }
.legal-toc { background: var(--color-surface-secondary); border-radius: var(--radius-lg); padding: var(--sp-3) var(--sp-4); margin: var(--sp-3) 0; font-size: 14px; }
.legal-toc ol { margin: var(--sp-2) 0 0; padding-left: 1.6em; columns: 2 260px; }
.legal-details { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 0 var(--sp-4); margin: var(--sp-2) 0; }
.legal-details > summary { cursor: pointer; padding: var(--sp-3) 0; font-weight: 600; }
.legal-details .legal-card { max-height: 420px; overflow-y: auto; padding-bottom: var(--sp-3); }
.faq-list { display: flex; flex-direction: column; gap: var(--sp-2); }
.faq-item { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 0 var(--sp-4); }
.faq-item > summary { cursor: pointer; padding: var(--sp-3) 0; font-size: 15px; font-weight: 600; }
.faq-item[open] > summary { border-bottom: 1px solid var(--color-surface-tertiary); margin-bottom: var(--sp-3); }
.faq-item .prose { margin: 0 0 var(--sp-3); font-size: 15px; color: var(--color-text-secondary); }
/* プラン */
.plan-band { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; margin: 0 0 var(--sp-4); padding: var(--sp-5) var(--sp-6); border-radius: var(--radius-xl); color: #fff; background: linear-gradient(135deg, var(--color-primary), #fb923c); }
.plan-band[data-plan="contract"], .plan-band[data-plan="standard"] { background: linear-gradient(135deg, #7c3aed, #4f46e5); }
.plan-band[data-state="expired"], .plan-band[data-state="exhausted"] { background: linear-gradient(135deg, #dc2626, #ea580c); }
.plan-band[data-state="none"] { background: linear-gradient(135deg, #94a3b8, #64748b); }
.plan-band h2 { margin: 0 0 2px; font-size: 22px; color: #fff; } .plan-band p { margin: 0; font-size: 15px; opacity: .95; }
.plan-band .plan-balance { text-align: right; } .plan-band .plan-balance strong { display: block; font-size: 26px; font-variant-numeric: tabular-nums; } .plan-band .plan-balance span { font-size: 14px; }
/* お知らせ */
.news-list { display: flex; flex-direction: column; gap: var(--sp-3); }
.news-card { margin: 0; border-left: 4px solid var(--color-info); }
.news-card[data-severity="warning"] { border-left-color: var(--color-warning); } .news-card[data-severity="critical"], .news-card[data-severity="error"] { border-left-color: var(--color-error); }
.news-card h2 { margin: 0 0 var(--sp-1) !important; font-size: 16px; }
.news-meta { display: flex; align-items: center; gap: var(--sp-2); margin: 0 0 var(--sp-2); font-size: 14px; color: var(--color-text-muted); }
@media (max-width: 767px) { form.form-cols { grid-template-columns: 1fr; } }
/* <<< settings */

/* ===== モバイル（<768px）: サイドバーは隠し、ハンバーガー（checkbox + label）で開く ===== */
@media (max-width: 767px) {
  .app-sidebar { transform: translateX(-100%); transition: transform .2s ease; box-shadow: var(--shadow-modal); }
  .app:has(#menu-toggle:checked) .app-sidebar { transform: none; }
  .app-body { margin-left: 0; }
  .nav-hamburger { display: inline-flex; }
  .app:has(#menu-toggle:checked) .nav-backdrop { display: block; position: fixed; inset: 0; z-index: 35; background: rgba(15,23,42,.4); }
  .company-name, .user-name { display: none; }
  main { padding: var(--sp-3); }
  .site-footer { padding: var(--sp-3); }
  .page-header-actions { margin-left: 0; }
  .auth-card { padding: var(--sp-5); }
}

@media print {
  .site-header, .app-sidebar, .nav-backdrop, .site-footer, .no-print, .flash { display: none !important; }
  .app-body { margin-left: 0; }
  .print-only { display: block; }
  body { background: #fff; }
  main { padding: 0; }
  .confirm-card { border: 0; box-shadow: none; padding: 0; break-after: page; }
  .confirm-card:last-child { break-after: auto; }
  .confirm-section, .day-card, .confirm-suppliers tr { break-inside: avoid; }
  .confirm-section { border: 1px solid #ccc; }
  a { color: inherit; text-decoration: none; }
}

/* ===== 運営コンソール向けの共通部品（Alert・要対応カード・丸アイコンの統計・pills タブ・タブ付きカード・横棒・ナビのバッジ） ===== */
.nav-badge { position: absolute; right: var(--sp-3); top: 50%; transform: translateY(-50%); min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; font-size: 12px; font-weight: 600; line-height: 20px; text-align: center; pointer-events: none; }
#main-nav li.nav-divider .nav-badge { top: calc(50% + 4px); }
.nav-badge-urgent { background: var(--color-error); color: #fff; }
.nav-badge-warn { background: #fbbf24; color: #451a03; }
#main-nav li:has(> .nav-badge) > a { padding-right: calc(var(--sp-3) + 28px); }
.chip-operator { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border-radius: 999px; background: var(--color-primary-light); color: var(--color-primary); font-size: 13px; font-weight: 600; white-space: nowrap; }

.page-header-text { min-width: 0; }
.page-back { display: inline-flex; align-items: center; gap: 4px; margin-bottom: var(--sp-2); font-size: 14px; color: var(--color-text-muted); }
.page-back:hover { color: var(--color-primary); text-decoration: none; }
.page-header-line { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-3); }

.alert { display: flex; align-items: flex-start; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-4); border: 1px solid; border-radius: var(--radius-lg); font-size: 15px; }
.alert .icon { margin-top: 2px; }
.alert-body { flex: 1 1 auto; min-width: 0; }
.alert-title { margin: 0; font-weight: 600; }
.alert-text { margin-top: 2px; } .alert-text > :last-child { margin-bottom: 0; }
.alert-actions { flex: none; display: flex; gap: var(--sp-2); align-items: center; }
.alert-actions form { margin: 0; max-width: none; }
.alert-info { background: #eff6ff; border-color: #bfdbfe; color: var(--color-info-text); }
.alert-success { background: #f0fdf4; border-color: #bbf7d0; color: var(--color-success-text); }
.alert-warning { background: #fefce8; border-color: #fef08a; color: #854d0e; }
.alert-error { background: var(--color-error-bg); border-color: #fecaca; color: #991b1b; }
.alert a { font-weight: 600; word-break: break-all; }

.attention { padding: 0; overflow: hidden; border-color: #fde68a; background: #fffbeb; }
.attention-head { display: flex; align-items: center; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4); color: #b45309; border-bottom: 1px solid #fde68a; }
.attention-head .card-title { color: #92400e; font-size: 15px; }
.attention-list { list-style: none; margin: 0; padding: 0; background: var(--color-surface); }
.attention-list li { margin: 0; border-bottom: 1px solid var(--color-border); } .attention-list li:last-child { border-bottom: 0; }
.attention-row { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); color: var(--color-text); text-decoration: none; }
.attention-row:hover { background: var(--color-surface-secondary); color: var(--color-text); text-decoration: none; }
.attention-row > .icon { color: var(--color-text-placeholder); }
.attention-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.attention-dot-urgent { background: var(--color-error); } .attention-dot-warn { background: var(--color-warning); }
.attention-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.attention-label { font-size: 15px; font-weight: 500; }
.attention-count { margin-left: var(--sp-2); font-weight: 700; font-variant-numeric: tabular-nums; }
.attention-impact { font-size: 13px; color: var(--color-text-muted); }
.attention-clear { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-4); background: #f0fdf4; border-color: #bbf7d0; color: var(--color-success-text); }
.attention-clear-text { margin: 0; font-weight: 500; }

.stat-round { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.stat-round .stat-main { min-width: 0; }
.stat-round .stat-label { margin-bottom: 2px; font-size: 14px; }
.stat-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; color: #fff; background: var(--color-primary); }
.stat-icon-success { background: #22c55e; } .stat-icon-warning { background: #f59e0b; } .stat-icon-error { background: #ef4444; } .stat-icon-info { background: #3b82f6; } .stat-icon-muted { background: #94a3b8; }

.tabs-pills ul { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; margin: 0 0 var(--sp-4); border: 0; border-radius: var(--radius-lg); background: var(--color-surface-tertiary); }
.tabs-pills a { margin: 0; padding: 6px var(--sp-3); border: 0; border-radius: var(--radius-md); font-size: 14px; }
.tabs-pills a[aria-current="page"] { background: var(--color-primary); color: #fff; }
.tabs-pills .count { background: var(--color-surface); }
.tabs-pills a[aria-current="page"] .count { background: rgba(255,255,255,.25); color: #fff; }

.tab-panels { padding: 0; }
.tab-radio { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.tabs-labels { display: flex; flex-wrap: wrap; gap: 0 var(--sp-1); padding: 0 var(--sp-4); border-bottom: 1px solid var(--color-border); }
.tabs-labels label { display: inline-flex; align-items: center; gap: 6px; padding: var(--sp-3); margin-bottom: -1px; border-bottom: 2px solid transparent; font-size: 15px; font-weight: 500; color: var(--color-text-muted); cursor: pointer; }
.tabs-labels label:hover { color: var(--color-text-secondary); }
.tab-panel { display: none; padding: var(--sp-4); }
.tab-panel > :first-child { margin-top: 0; }
.tab-panel .table-wrap { box-shadow: none; }
.tab-radio:nth-of-type(1):checked ~ .tab-panel:nth-of-type(1), .tab-radio:nth-of-type(2):checked ~ .tab-panel:nth-of-type(2), .tab-radio:nth-of-type(3):checked ~ .tab-panel:nth-of-type(3), .tab-radio:nth-of-type(4):checked ~ .tab-panel:nth-of-type(4), .tab-radio:nth-of-type(5):checked ~ .tab-panel:nth-of-type(5) { display: block; }
.tab-radio:nth-of-type(1):checked ~ .tabs-labels label:nth-child(1), .tab-radio:nth-of-type(2):checked ~ .tabs-labels label:nth-child(2), .tab-radio:nth-of-type(3):checked ~ .tabs-labels label:nth-child(3), .tab-radio:nth-of-type(4):checked ~ .tabs-labels label:nth-child(4), .tab-radio:nth-of-type(5):checked ~ .tabs-labels label:nth-child(5) { color: var(--color-primary); border-bottom-color: var(--color-primary); }
.tab-radio:focus-visible ~ .tabs-labels { outline: 2px solid var(--color-primary); outline-offset: -2px; }

.bar { display: block; width: 100%; min-width: 80px; height: 8px; border-radius: 999px; background: var(--color-border); overflow: hidden; }
.bar-fill { display: block; height: 100%; border-radius: 999px; background: var(--color-primary); }
.bar-success .bar-fill { background: var(--color-success); } .bar-warning .bar-fill { background: var(--color-warning); } .bar-error .bar-fill { background: var(--color-error); }
td .bar { min-width: 120px; }

.cell-with-icon { display: inline-flex; align-items: center; gap: var(--sp-2); }
.cell-with-icon .icon { color: var(--color-text-placeholder); }
.cell-sub { display: block; font-size: 13px; color: var(--color-text-muted); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; word-break: break-all; }
.cell-actions { display: flex; gap: var(--sp-2); align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.cell-actions form { margin: 0; max-width: none; }
.status[data-status="suspended"], .status[data-status="archived"], .status[data-status="dead"] { background: #fee2e2; color: #991b1b; }
.status[data-status="scheduled"] { background: #ede9fe; color: #5b21b6; }
.status[data-status="published"], .status[data-status="live"] { background: var(--color-success-bg); color: var(--color-success-text); }

.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4); align-items: start; }
.grid-2 > .card { margin-bottom: 0; }
.grid-7-5 { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sp-4); align-items: start; }
.grid-7-5 > .card { margin-bottom: 0; }
.card-flush { padding: 0; } .card-flush .card-header { padding: var(--sp-4) var(--sp-4) 0; }
.card-flush .table-wrap { border: 0; box-shadow: none; border-radius: 0; margin: 0; }
.card-flush .card-body { padding: 0; }
.toolbar { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-4); }
.toolbar form { margin: 0; max-width: none; }
.toolbar .filters { margin: 0; display: flex; gap: var(--sp-3); max-width: none; align-items: end; }
.toolbar .filters .field { min-width: 14rem; }
.form-actions { display: flex; gap: var(--sp-2); justify-content: flex-end; margin-top: var(--sp-4); }
form.card-form, form.wide-form { max-width: none; }
.card-form .field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--sp-4); }
.card-form .field-grid .field:has(textarea) { grid-column: 1 / -1; }
.kv-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6); }
.kv-cols h3 { margin-top: 0; font-size: 15px; color: var(--color-text-secondary); }
.kv-cols dl.kv { margin-bottom: 0; }
.stat-gap { margin-top: var(--sp-2); }
.list-plain { list-style: none; margin: 0; padding: 0; }
.list-plain li { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-3) 0; border-bottom: 1px solid var(--color-border); }
.list-plain li:last-child { border-bottom: 0; }
.list-plain .meta { font-size: 13px; color: var(--color-text-muted); }
.link-more { display: inline-flex; align-items: center; gap: 4px; margin-top: var(--sp-3); font-size: 14px; font-weight: 500; }
@media (max-width: 1023px) { .grid-7-5, .grid-2, .kv-cols { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) { .card-form .field-grid { grid-template-columns: minmax(0, 1fr); } .alert { flex-wrap: wrap; } .alert-actions { width: 100%; } }
.toolbar .tabs ul { margin: 0; }
.inline-fields { display: flex; flex-wrap: wrap; gap: var(--sp-3); align-items: end; max-width: none; margin-top: var(--sp-2); }
.inline-fields .field { margin: 0; min-width: 10rem; }
.alert .inline-fields input { background: var(--color-surface); }
.empty-success .icon { color: var(--color-success); }
.empty-success { background: #f0fdf4; border-color: #bbf7d0; }
.status[data-status="low"], .status[data-status="critical"] { background: var(--color-info-bg); color: var(--color-info-text); }
.cell-actions { flex-wrap: nowrap; }
td[data-col="createdAt"], td[data-col="representative"], td[data-col="plan"], td[data-col="country"], td[data-col="publishAt"] { white-space: nowrap; }

form.form-cols .field { margin-bottom: var(--sp-3); }
details.fold { margin-top: var(--sp-3); } details.fold > summary { cursor: pointer; font-size: 14px; color: var(--color-text-muted); margin-bottom: var(--sp-2); }

/* ===== Planner: 案件詳細の AI 相談パネル（右ペイン 340） ===== */
.case-aside { display: flex; flex-direction: column; gap: var(--sp-3); }
/* パネルは縦に 見出し／履歴（ここだけスクロール）／入力欄（最下部に固定）の 3 段。2026-10-20 CEO 指示 */
.consult-panel { margin: 0; padding: 0; overflow: hidden; display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; height: 100%; }
.consult-head { display: flex; align-items: center; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4); background: var(--color-primary-light); color: var(--color-primary); border-bottom: 1px solid var(--color-border); }
.consult-head h2 { margin: 0; font-size: 15px; font-weight: 700; color: var(--color-text); }
.consult-new { margin: 0 0 0 auto; }
.consult-new-btn { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border: 1px solid var(--color-border); border-radius: 999px; background: var(--color-surface); color: var(--color-primary); font: inherit; font-size: 13px; cursor: pointer; }
.consult-new-btn:hover { background: var(--color-surface-secondary); }
.consult-empty { padding: var(--sp-4) var(--sp-3); flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.consult-empty h3 { margin: 0 0 var(--sp-3); text-align: center; font-size: 15px; font-weight: 700; color: var(--color-text); }
.consult-empty p { margin: 0; font-size: 14px; color: var(--color-text-secondary); }
.consult-cards { display: flex; flex-direction: column; gap: var(--sp-2); }
.consult-cards form { margin: 0; }
.consult-card { display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left; padding: 10px 14px; border: 1px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-surface); font: inherit; cursor: pointer; }
.consult-card:hover { border-color: var(--color-primary); background: var(--color-primary-light); }
.consult-card strong { font-size: 15px; font-weight: 700; color: var(--color-text); }
.consult-card span { font-size: 13px; color: var(--color-text-muted); }
.consult-thread { list-style: none; margin: 0; padding: var(--sp-3); display: flex; flex-direction: column; gap: var(--sp-2); flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.consult-end { height: 1px; margin: 0; padding: 0; list-style: none; }
.consult-day { text-align: center; font-size: 12px; color: var(--color-text-muted); margin: 4px 0; }
.consult-day span { padding: 0 10px; background: var(--color-surface); }
.consult-row { display: flex; justify-content: flex-start; }
.consult-row[data-sender="USER"] { justify-content: flex-end; }
.consult-bubble { max-width: 92%; padding: 8px 12px; border-radius: 12px; background: var(--color-surface); border: 1px solid var(--color-border); font-size: 14px; line-height: 1.6; }
.consult-row[data-sender="USER"] .consult-bubble { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.consult-row[data-type="error"] .consult-bubble { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
.consult-bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.consult-thinking { color: var(--color-text-muted); }
.consult-time { display: block; margin-top: 2px; font-size: 12px; color: var(--color-text-muted); }
.consult-proposal { display: flex; flex-direction: column; gap: 4px; margin-top: var(--sp-2); padding: var(--sp-2) var(--sp-3); background: var(--color-surface-secondary); border: 1px solid var(--color-border); border-radius: var(--radius-md); color: var(--color-text); }
.consult-proposal span { font-size: 13px; color: var(--color-text-secondary); }
.consult-foot { flex: none; border-top: 1px solid var(--color-border); padding: var(--sp-2) var(--sp-3) var(--sp-3); background: var(--color-surface); }
.consult-chips { display: flex; flex-direction: column; gap: 6px; padding-bottom: var(--sp-2); }
.consult-chips form, .consult-ctx form { margin: 0; }
.consult-viewing { margin: 0 0 6px; font-size: 12px; color: var(--color-text-muted); }
.consult-viewing strong { color: var(--color-text-secondary); font-weight: 600; }
.consult-ctx { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: var(--sp-2); }
.chip { width: 100%; text-align: left; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-primary); font: inherit; font-size: 14px; cursor: pointer; }
.chip:hover { background: var(--color-primary-light); }
.chip.chip-sm { width: auto; padding: 3px 10px; font-size: 13px; }
.consult-input { display: flex; flex-direction: column; gap: var(--sp-2); }
.consult-input textarea { width: 100%; resize: vertical; font: inherit; font-size: 14px; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.consult-note { margin: var(--sp-2) 0 0; font-size: 12px; color: var(--color-text-muted); }
.consult-panel .poll-status { margin: 0 var(--sp-3) var(--sp-2); font-size: 13px; color: var(--color-text-muted); }
.chat-ai-note { margin-top: 4px !important; font-size: 12px; }
.legend-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 4px 0 12px; vertical-align: baseline; }
.memo-list { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.memo-list li { border: 1px solid var(--color-border); border-radius: 8px; padding: var(--sp-3) var(--sp-4); }
.memo-head { display: flex; align-items: center; gap: var(--sp-3); font-size: 14px; color: var(--color-text-muted); }
.memo-head strong { color: var(--color-text); }
.memo-head .inline-form { margin-left: auto; }
.memo-body { margin: var(--sp-2) 0 0; white-space: pre-wrap; }
.compare-pick { display: inline-flex; align-items: center; margin-right: var(--sp-2); }
.compare-bar { display: flex; align-items: center; gap: var(--sp-3); margin-top: var(--sp-3); }
.compare-list { margin: 0; padding-left: 1.1em; }
.compare-links { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-3); }
.chat-files { list-style: none; margin: var(--sp-2) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2); font-size: 14px; }
.chat-files li { display: flex; flex-direction: column; gap: 4px; }
.chat-files img { max-width: 200px; max-height: 140px; border-radius: 6px; border: 1px solid var(--color-border); display: block; }
.footer-links { display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.footer-links a { color: var(--color-text-muted); text-decoration: none; }
.footer-links a:hover { text-decoration: underline; }
.help-steps { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.help-steps li { display: flex; flex-direction: column; gap: 2px; padding: var(--sp-3) var(--sp-4); border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface, #fff); }
.help-steps span { color: var(--color-text-muted); font-size: 15px; }
.photo-grid { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--sp-3); }
.photo-grid li { display: flex; flex-direction: column; gap: var(--sp-2); align-items: flex-start; }
.photo-grid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; border: 1px solid var(--color-border); display: block; }

/* ヘルプ（/planner/help）: 左に目次、右に本文。本文は画面幅いっぱい（CEO 指摘 2026-10-20: 余白を作らない）。狭い画面では 1 カラム */
.help-layout { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: var(--sp-5, 24px); align-items: start; }
.help-toc { position: sticky; top: var(--sp-3); display: flex; flex-direction: column; gap: 2px; padding: var(--sp-2); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface, #fff); }
.help-toc ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1px; }
.help-toc a { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 6px; color: var(--color-text); text-decoration: none; font-size: 14px; line-height: 1.35; }
.help-toc a .icon { flex: none; color: var(--color-text-muted); }
.help-toc a:hover { background: var(--color-surface-alt, rgba(0,0,0,.04)); }
.help-toc a[aria-current="page"] { background: var(--color-primary-soft, #e8f0fe); color: var(--color-primary, #1a56db); font-weight: 600; }
.help-toc a[aria-current="page"] .icon { color: var(--color-primary, #1a56db); }
.help-toc-index { font-weight: 600; }
.help-toc-group { padding: var(--sp-3) 10px 4px; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--color-text-muted); }
.help-toc-sub { margin: 2px 0 4px 20px !important; padding-left: 8px !important; border-left: 2px solid var(--color-primary-soft, #e8f0fe); }
.help-toc-sub a { padding: 3px 8px; font-size: 13px; color: var(--color-text-secondary); }
.help-main { min-width: 0; display: flex; flex-direction: column; gap: var(--sp-4); }
/* ヘルプはナビ無しの枠（app-plain）でも画面幅を使う */
.app-plain main:has(.help-layout) { max-width: none; }
/* 目次ページ */
.help-start-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--sp-4); padding: var(--sp-4) var(--sp-5); border: 1px solid var(--color-primary, #1a56db); border-radius: var(--radius-lg); background: var(--color-primary-soft, #e8f0fe); color: inherit; text-decoration: none; }
.help-start-card:hover { text-decoration: none; box-shadow: var(--shadow-sm); }
.help-start-card strong { font-size: 17px; }
.help-start-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.help-start-cta { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; background: var(--color-primary, #1a56db); color: #fff; font-size: 14px; font-weight: 600; white-space: nowrap; }
.help-card-icon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 40px; height: 40px; border-radius: 10px; background: var(--color-primary-soft, #e8f0fe); color: var(--color-primary, #1a56db); }
.help-list-title { margin: var(--sp-2) 0 0; font-size: 18px; }
.help-groups { display: flex; flex-direction: column; gap: var(--sp-4); }
.help-group-head { display: flex; align-items: baseline; gap: var(--sp-3); margin-bottom: var(--sp-2); }
.help-group-head h3 { margin: 0; font-size: 16px; }
.help-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: var(--sp-3); }
.help-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface, #fff); color: inherit; text-decoration: none; }
.help-card:hover { border-color: var(--color-primary, #1a56db); text-decoration: none; }
.help-card .help-card-icon { width: 36px; height: 36px; }
.help-card-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.help-card-sum { display: block; color: var(--color-text-muted); font-size: 14px; line-height: 1.45; }
.help-card-meta { font-size: 12px; color: var(--color-text-muted); }
.help-card-arrow { color: var(--color-text-muted); }
.help-contact { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-alt, #f8f9fb); font-size: 14px; }
.help-contact .icon { flex: none; color: var(--color-text-muted); }
.help-contact span { flex: 1 1 auto; }
/* 個別ページ */
.help-head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-3) var(--sp-4); align-items: center; padding: var(--sp-4) var(--sp-5); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface, #fff); }
.help-head-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; background: var(--color-primary-soft, #e8f0fe); color: var(--color-primary, #1a56db); }
.help-head-title { margin: 0; font-size: 22px; }
.help-summary { margin: 2px 0 0; color: var(--color-text-secondary); font-size: 15px; }
.help-jump { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: var(--sp-2); padding-top: var(--sp-3); border-top: 1px solid var(--color-border); }
.help-jump a { padding: 4px 12px; border-radius: 999px; background: var(--color-surface-alt, #f1f3f5); color: var(--color-text-secondary); font-size: 13px; text-decoration: none; }
.help-jump a:hover { background: var(--color-primary-soft, #e8f0fe); color: var(--color-primary, #1a56db); }
.help-section { padding: var(--sp-4) var(--sp-5); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface, #fff); scroll-margin-top: var(--sp-4); }
.help-section-title { display: flex; align-items: center; gap: 8px; margin: 0 0 var(--sp-3); font-size: 17px; }
.help-section-title .icon { color: var(--color-primary, #1a56db); }
.help-can { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2) var(--sp-5); }
.help-can li { display: flex; gap: 8px; align-items: flex-start; font-size: 15px; line-height: 1.5; }
.help-can .icon { flex: none; margin-top: 3px; color: var(--color-success, #16a34a); }
.help-procedure { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.help-procedure li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: var(--sp-2) var(--sp-3); align-items: start; padding: var(--sp-3) 0; border-top: 1px solid var(--color-border); }
.help-procedure li:first-child { border-top: 0; padding-top: 0; }
.help-procedure li.has-shot { grid-template-columns: 32px minmax(0, 1fr) minmax(280px, 38%); }
.help-step-no { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--color-primary, #1a56db); color: #fff; font-size: 14px; font-weight: 700; }
.help-step-body { display: flex; flex-direction: column; gap: 4px; padding-top: 3px; font-size: 15px; line-height: 1.55; }
.help-screen { align-self: flex-start; padding: 1px 8px; border-radius: 999px; background: var(--color-surface-alt, #f1f3f5); color: var(--color-text-muted); font-size: 12px; }
.help-step-shots { display: flex; flex-direction: column; gap: var(--sp-2); }
.help-shot { margin: 0; }
.help-shot img { display: block; max-width: 100%; border: 1px solid var(--color-border); border-radius: 8px; }
.help-shot-box { display: flex; align-items: center; justify-content: center; min-height: 120px; padding: var(--sp-3); border: 2px dashed var(--color-border); border-radius: 8px; background: var(--color-surface-alt, #f1f3f5); color: var(--color-text-muted); font-size: 13px; text-align: center; }
.help-shot figcaption { margin-top: 3px; color: var(--color-text-muted); font-size: 12px; }
.help-faq { gap: var(--sp-2); }
.help-faq .faq-item > summary { padding: 10px 0; font-size: 15px; }
.help-related { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.help-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--color-border); border-radius: 999px; color: var(--color-text); font-size: 14px; text-decoration: none; background: var(--color-surface, #fff); }
.help-chip:hover { border-color: var(--color-primary, #1a56db); color: var(--color-primary, #1a56db); text-decoration: none; }
.help-trouble { background: var(--color-surface-alt, #f8f9fb); }
.help-trouble p { margin: 0 0 var(--sp-2); font-size: 14px; }
.help-trouble-actions { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.page-help { display: inline-flex; align-items: center; gap: 4px; color: var(--color-text-muted); font-size: 14px; text-decoration: none; }
.page-help:hover { color: var(--color-primary, #1a56db); }
@media (max-width: 860px) {
  .help-layout { grid-template-columns: minmax(0, 1fr); }
  .help-toc { position: static; }
  .help-procedure li.has-shot { grid-template-columns: 32px minmax(0, 1fr); }
  .help-can { grid-template-columns: minmax(0, 1fr); }
  .help-step-shots { grid-column: 2; }
  .help-start-card { grid-template-columns: auto minmax(0, 1fr); }
  .help-start-cta { grid-column: 1 / -1; justify-self: start; }
}

/* 状態などのチェックボックスを横に並べる絞り込み（手配先の追加の候補一覧など） */
.filter-checks { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-4); }
.filter-checks .checkbox { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; margin: 0; }

/* AI 相談の返答（Markdown）。吹き出しの中で詰めて出す。.prose（pre-wrap）は付けない＝HTML の改行が空行にならないように */
.consult-bubble .md { white-space: normal; font-size: 14px; line-height: 1.55; }
.consult-bubble .md > :first-child { margin-top: 0; }
.consult-bubble .md > :last-child { margin-bottom: 0; }
.consult-bubble .md p { margin: 0 0 6px; }
.consult-bubble .md h2, .consult-bubble .md h3, .consult-bubble .md h4 { font-size: 14px; font-weight: 700; margin: 10px 0 4px; color: var(--color-text); }
.consult-bubble .md ul, .consult-bubble .md ol { margin: 0 0 6px; padding-left: 1.3em; }
.consult-bubble .md li { margin: 1px 0; }
/* marked は項目の間に空行がある箇条書きを <li><p> で出す。吹き出しの中では詰める */
.consult-bubble .md li > p { margin: 0; }
.consult-bubble .md li + li { margin-top: 3px; }
.consult-bubble .md table { width: 100%; border-collapse: collapse; margin: 6px 0 10px; font-size: 12px; }
.consult-bubble .md th, .consult-bubble .md td { padding: 3px 5px; border: 1px solid var(--color-border); text-align: left; vertical-align: top; }
.consult-bubble .md th { background: var(--color-surface-secondary); font-weight: 600; }
.consult-bubble .md strong { font-weight: 700; }

/* 分析: 期間の切り替えと月次の売上の棒 */
.analytics-modes { display: flex; gap: var(--sp-1); border-bottom: 1px solid var(--color-border); margin-bottom: var(--sp-4); }
.analytics-modes a { padding: var(--sp-2) var(--sp-4); color: var(--color-text-muted); text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-weight: 500; }
.analytics-modes a:hover { color: var(--color-text); }
.analytics-modes a.active { color: var(--color-primary); border-bottom-color: var(--color-primary); }
/* 月ごとの期間: 「‹ 前の月」「月」「次の月 ›」「この月を見る」を横 1 列に（filters-band の flex に並べる） */
.analytics-month-filters .btn { width: auto; flex: 0 0 auto; }
.analytics-month-filters .btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }
.analytics-summary-cards .figure { font-size: 26px; }
.analytics-sub { font-size: 15px; margin: var(--sp-4) 0 var(--sp-2); color: var(--color-text-secondary); }
.rev-bars { list-style: none; margin: 0 0 var(--sp-4); padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.rev-bars li { display: grid; grid-template-columns: 5.5rem 1fr minmax(6rem, auto); gap: var(--sp-3); align-items: center; font-size: 15px; padding: 2px var(--sp-2); border-radius: var(--radius-md); }
.rev-bars li.selected { background: var(--color-surface-secondary); }
.rev-bars .rev-month { font-variant-numeric: tabular-nums; }
.rev-bars .rev-track { display: block; height: 18px; background: var(--color-surface-secondary); border-radius: 4px; overflow: hidden; }
.rev-bars li.selected .rev-track { background: var(--color-border); }
.rev-bars .rev-bar { display: block; height: 100%; background: #6366f1; border-radius: 4px; min-width: 0; }
.rev-bars .rev-value { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 640px) { .rev-bars li { grid-template-columns: 4.5rem 1fr; } .rev-bars .rev-value { grid-column: 1 / -1; text-align: left; } }

/* 行程の編集（itinerary-edit.js）: 行の操作列・並べ替え中の見た目・未保存の表示 */
.edit-items td.row-actions { white-space: nowrap; min-width: 11.5rem; }
.edit-items .row-actions .btn { width: auto; min-width: 32px; padding: 0 var(--sp-2); margin-left: 2px; }
.edit-items .row-grip { display: inline-block; width: 1.2em; cursor: grab; color: var(--color-text-muted); user-select: none; text-align: center; vertical-align: middle; }
.edit-items tr.dragging { opacity: .45; background: var(--color-primary-light); }
.edit-items input:invalid { border-color: var(--color-error); }
.edit-items + .add-row { width: auto; margin: 0 0 var(--sp-2); }
.edit-status { margin-left: var(--sp-3); align-self: center; }
.edit-status.is-dirty { color: var(--color-warning-text); font-weight: 600; }
/* AI 相談の提案（行程・費用・案件情報の更新案） */
.consult-days { display: flex; flex-direction: column; gap: 4px; }
.consult-days-sum { display: flex; align-items: center; gap: 4px; margin: 0; font-size: 13px; font-weight: 600; color: var(--color-text); }
.consult-day-box { font-size: 13px; border-top: 1px solid var(--color-border); padding-top: 4px; }
.consult-day-box summary { cursor: pointer; }
.consult-day-box ul { margin: 4px 0 0; padding-left: 0; list-style: none; }
.consult-time-col { display: inline-block; min-width: 3em; color: var(--color-text-secondary); font-variant-numeric: tabular-nums; }
.consult-pricing { display: grid; gap: 2px; margin: 0; font-size: 13px; }
.consult-pricing div { display: flex; justify-content: space-between; gap: var(--sp-2); }
.consult-pricing dt { color: var(--color-text-secondary); }
.consult-pricing dd { margin: 0; font-weight: 600; }
.consult-applied { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.consult-applied-mark { display: inline-flex; align-items: center; gap: 2px; font-size: 12px; color: var(--color-success, #1a7f37); }
.consult-trip-updates { display: flex; flex-direction: column; gap: 4px; margin-top: var(--sp-2); padding: var(--sp-2) var(--sp-3); background: var(--color-surface-secondary); border: 1px solid var(--color-border); border-radius: var(--radius-md); }
.consult-trip-updates ul { list-style: none; margin: 0 0 var(--sp-2); padding: 0; display: flex; flex-direction: column; gap: 6px; }
.consult-trip-updates label { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; font-size: 13px; }
.consult-trip-updates .tu-field { font-weight: 600; }
.consult-trip-updates .tu-reason { display: block; color: var(--color-text-secondary); margin-left: 24px; }
/* 資料出力: 企画の切替（select と「切り替え」を横並び） */
form.plan-switch { display: flex; align-items: flex-end; gap: var(--sp-2); max-width: 640px; margin-bottom: var(--sp-2); } form.plan-switch .field { flex: 1 1 auto; margin: 0; } form.plan-switch .btn { flex: none; }
/* AI 相談の反映ボタン: 企画名が長くても折り返す（パネルからはみ出さない） */
.consult-proposal .btn, .consult-applied .btn, .consult-trip-updates .btn { white-space: normal; height: auto; min-height: 36px; padding: 6px 12px; line-height: 1.3; text-align: left; max-width: 100%; }

/* 企画の費用タブ: 合計の箱 → 内訳の表 → 行程の項目の費用（チップ） */
.cost-h { margin: var(--sp-4) 0 var(--sp-2); font-size: 15px; font-weight: 700; }
.cost-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.cost-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--color-surface-secondary); border: 1px solid var(--color-border); border-radius: 999px; font-size: 14px; }
.cost-chip .icon { color: var(--color-primary); } .cost-chip strong { font-variant-numeric: tabular-nums; }
.cost-chip-sum { background: var(--color-surface); border-color: var(--color-text-muted); }

/* 手配先・商品の詳細（ヘッダー＋下線タブ＋プロフィール）。2026-10-20 */
.detail-head { margin-bottom: var(--sp-3); }
.detail-head .detail-tags { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin: var(--sp-2) 0 0; }
.detail-profile > .card, #contacts-tab > .card, #documents-tab > .card { margin-bottom: var(--sp-3); }
.detail-profile dl.kv dd .pill { margin: 0 var(--sp-1) var(--sp-1) 0; }
.detail-profile dl.kv dd a + a { margin-left: var(--sp-2); }
.doc-thumb { display: block; width: 72px; height: 72px; object-fit: cover; border-radius: var(--radius-md); border: 1px solid var(--color-border); }
.row-actions { display: inline-flex; align-items: center; gap: var(--sp-2); white-space: nowrap; }
.intake-section { margin: var(--sp-3) 0 0; padding-top: var(--sp-2); border-top: 1px solid var(--color-border); }
.intake-section h4 { margin: 0 0 var(--sp-2); font-size: 15px; font-weight: 600; color: var(--color-text-secondary); }
.intake-docs { margin: 0 0 var(--sp-2); padding-left: var(--sp-5); }

/* 案件詳細の企画一覧: 1 企画 1 行の表（名前と要約／状態／日数・担当・更新／1 人あたり・合計／操作） */
.proposal-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.proposal-table th { padding: 6px 10px; text-align: left; font-size: 13px; font-weight: 600; color: var(--color-text-muted); border-bottom: 1px solid var(--color-border); }
.proposal-table td { padding: 10px; vertical-align: top; border-bottom: 1px solid var(--color-surface-tertiary); }
.proposal-table tr:last-child td { border-bottom: 0; }
.proposal-table .num { text-align: right; }
.proposal-table .col-pick { width: 32px; padding-right: 0; } .proposal-table .col-pick .compare-pick { margin: 0; }
.proposal-table .col-plan { min-width: 260px; }
.proposal-table .proposal-summary { display: block; margin-top: 2px; font-size: 13px; color: var(--color-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 52ch; }
.proposal-table .col-meta { white-space: nowrap; font-size: 13px; color: var(--color-text-muted); } .proposal-table .col-meta span { display: block; }
.proposal-table .col-price { white-space: nowrap; } .proposal-table .col-price strong { font-size: 16px; } .proposal-table .proposal-total { display: block; font-size: 12px; color: var(--color-text-muted); }
.proposal-table .col-actions { white-space: nowrap; text-align: right; } .proposal-table .col-actions .btn { margin-left: 4px; }
.proposal-table tr[data-proposal-status="generating"] td { background: #f5f3ff; }
@media (max-width: 900px) { .proposal-table .col-meta, .proposal-table thead { display: none; } .proposal-table .proposal-summary { white-space: normal; max-width: none; } }
#compare-form { max-width: none; }
.filters-band .field[data-field="mine_turn"] { align-self: end; flex: none; padding-bottom: 8px; min-width: 0; }

/* 環境の表示名（APP_ENV_LABEL。staging など）。本番ではない目印 */
.env-badge { display: inline-block; margin-left: 10px; padding: 2px 10px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #7a3e00; background: #ffe7b3; border: 1px solid #f0c060; border-radius: 999px; vertical-align: middle; white-space: nowrap; }
.auth-brand .env-badge { margin: 6px 0 0; }

/* デモ用の「デモデータを入れる」ボタン（demoMode のときだけ出る） */
.demo-fill-row { display: flex; justify-content: flex-end; margin: 0 0 8px; }