/* 左右パネルの開閉ボタン */
#toggle-left, #toggle-right {
  position: absolute;
  top: 5px;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
  z-index: 1000;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
}

#toggle-left {
  left: 5px;  /* 画面左端 */
}

#toggle-right {
  right: 5px; /* 画面右端 */
}

#toggle-left:hover, #toggle-right:hover {
  background: rgba(255, 255, 255, 1); /* ホバーで濃く */
}

/* パネルの開閉アニメーション */
#container.collapsed-left #left {
  width: 0;
  padding: 0;
}

#container.collapsed-right #right {
  width: 0;
  padding: 0;
}

#left, #right {
  position: relative;
  transition: width 0.3s ease, padding 0.3s ease;
  overflow: hidden;
}

/* ドラッグリサイズ用ハンドル */
.resizer {
  position: absolute;
  width: 5px;
  top: 0;
  bottom: 0;
  background: #ddd;
  cursor: ew-resize;
  z-index: 999;
}

#left .resizer {
  right: 0;
}

#right .resizer {
  left: 0;
}

#toggle-info-panel {
  margin: 8px; /* ← コントロール領域内で8pxのマージン */
}

#toggle-info-panel.active {
  background-color: #000; /* 背景を黒に */
  color: #fff;           /* 文字とアイコンを白に */
  border-color: #666;    /* 枠線を少しグレーに */
}



.map-button {
  background-color: #25A1F4; /* 明るめブルー */
  color: #ffffff;
  border: none;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 1.4rem;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0 4px 6px rgba(0,0,0,0.2);
  transition: background-color 0.3s, transform 0.2s;
}

.map-button:hover {
  background-color: #1976D2; /* ホバー時は少し濃く */
  transform: translateY(-2px);
}

.map-button.active {
  background-color: #1565C0; /* さらに濃いブルー */
  color: #fff;
}

#toggle-estimate-dialog {
  position: fixed;            /* スクロールしても固定 */
  bottom: 30px;               /* 下からの距離 */
  left: 50%;                  /* 左端から50% */
  transform: translateX(-50%); /* 中央寄せ */
  z-index: 9999;              /* 地図より前面 */
}

.detail-link-button {
  background: none;
  border: none;
  color: #1976D2; /* 落ち着いたブルー */
  font-size: 1.2rem;
  text-decoration: underline;
  cursor: pointer;
  padding: 0;
  margin-top: 12px;
}

.detail-link-button:hover {
  color: #004BA0; /* ホバー時に濃いブルー */
  text-decoration: none;
}

.icon-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 10px;
  min-width: 72px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 10px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.2);
  cursor: pointer;
  user-select: none;
  touch-action: manipulation;
}

.icon-btn:hover { box-shadow: 0 2px 10px rgba(0,0,0,0.25); }
.icon-btn.is-active { background:#f3f4f6; border-color:#bbb; }

.icon-btn .icon-wrap { width: 28px; height: 28px; display: grid; place-items: center; }
.icon-btn .icon-wrap svg { width: 28px; height: 28px; stroke-width: 2; pointer-events: none;}
.icon-btn .label { font-size: 13px; line-height: 1; white-space: nowrap; }

/* 作図モードの見た目強調 */
.icon-btn.is-drawing {
  background: #2196F3;    /* 概算見積書依頼ボタンと同じ青 */
  border-color: #2196F3;
  color: #fff;
  box-shadow: 0 0 0 3px rgba(37,99,235,.25), 0 4px 10px rgba(0,0,0,.15);
  transform: translateY(0);
  transition: background .2s, transform .1s, box-shadow .2s;
}
.icon-btn.is-drawing:active {
  background: #1e40af;   /* 押下時 */
  transform: translateY(0);
}
.icon-btn.is-drawing:hover {
  background: #2196F3;
}
.icon-btn.is-drawing .icon-wrap svg {
  stroke: #fff;
}
.icon-btn.is-drawing .label {
  color: #fff;
}

/* 右上スタック */
.map-top-right-stack{
  display:flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0;
  margin: 8px 16px 0 0;
}

/* サブボタン */
.sub-buttons{
  display:flex;
  margin-top: 0;
  gap: 6px;
}

/* ===== 測定方法関係 ===== */
.map-top-right-row { display:flex; gap:8px; margin:8px 16px 0 0; }
.icon-btn .mini-badge { font-size: 11px; line-height:1; color:#111; opacity:.8; }
.method-panel{
  position: fixed; top: 80px; right: 20px; width: 360px;
  background:#fff; border:1px solid #ccc; border-radius:10px;
  box-shadow: 0 8px 18px rgba(0,0,0,.2);
  padding:14px; z-index: 9999; display:none;
}
.method-header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.method-grid{
  display: flex;
  flex-wrap: nowrap;      /* 折り返さない */
  gap: 8px;
  margin-bottom: 10px;
  overflow-x: auto;       /* 横スクロール */
  padding-bottom: 4px;    /* スクロールバー分の余白 */
}
.method-card{
  flex: 0 0 106px;        /* 1枚あたりの横幅 */
  border: 1px solid #ccc;
  border-radius:8px;
  padding:10px;
  text-align:center;
  cursor:pointer;
  user-select:none;
  background:#fafafa;
  box-sizing: border-box;
}
.method-card.is-selected{
  border: 3px solid #2563eb;
  background:#eef6ff;
}
.method-card:hover{ box-shadow:0 1px 6px rgba(0,0,0,.15); }
.method-actions{ display:flex; justify-content:center; gap:8px; margin-top:10px; }

/* --- 計測手法：説明欄の画像 + テキスト --- */
.method-desc{
  font-size: 12px;
  color: #333;
  padding-top: 10px;
  border-top: 1px solid #e5e7eb;
  min-height: 72px;
  text-align: left;
  white-space: normal;
}
.method-hero{
  display: grid;
  place-items: center;
  padding: 8px 0 10px;
}
.method-hero img{
  max-width: 100%;
  max-height: 160px;
  object-fit: contain;
  display: block;
}
.method-text{
  font-size: 13px;
  line-height: 1.6;
}
.method-note{   /* 常時表示の注意書き（コンパクト） */
  font-size: 11px;
  color: #555;
  line-height: 1.6;
  margin-top: 8px;
  text-align: left;
  background: #fff;
  border-left: 3px solid #f59e0b;   /* 目立ちすぎない左線アクセント */
  padding: 6px 8px;
}
.method-note2{   /* 常時表示の注意書き（コンパクト） */
  font-size: 11px;
  color: #555;
  line-height: 1.6;
  margin-top: 8px;
  text-align: left;
  background: #fff;
  border-left: 3px solid #f59e0b;   /* 目立ちすぎない左線アクセント */
  padding: 6px 8px;
}
/* ===== 測定方法関係 END ===== */

/* ステータスバー */
.status-bar{
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 32px);   /* 両端8pxマージン相当 */
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  z-index: 1;             /* 地図より前面 */
  pointer-events: none;       /* バー自体はクリック貫通 */
  background: rgba(255,255,255,0.85);
  -webkit-backdrop-filter: saturate(1.2) blur(6px);
  backdrop-filter: saturate(1.2) blur(6px);
  padding: 6px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(0,0,0,.12);
}
.status-bar .sb-group{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  pointer-events: auto;       /* 子要素はクリック可能 */
}
/* 既存の .icon-btn をそのまま流用 */
.status-bar .icon-btn{ margin: 0; }
.status-bar .map-top-right-stack{
  margin: 0 !important;     /* 元CSSの margin: 8px 16px 0 0 を無効化 */
  align-items: center;       /* 下がって見えるのを防ぐ */
  gap: 0;
}
.status-bar .map-top-right-row{ margin: 0 !important; } /* 念のため */
.status-bar .map-top-right-stack .icon-btn{ margin: 0; } /* 余白の二重取り防止 */




/* ── StatusBar内のアイコンを「ボタン風→フラット」へ ───────────────── */
.status-bar .icon-btn{
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 2px 6px;       /* コンパクトに */
  min-width: auto;
  border-radius: 6px;     /* 角丸はごく控えめ */
  align-self: flex-start; /* 上付きに */
  gap: 4px;
  position: relative;
  border-bottom: 2px solid transparent;
}
.status-bar .icon-btn:hover{
  background: rgba(0,0,0,.06);  /* うっすらホバーのみ */
}

/* アイコンとラベルも小さめに */
.status-bar .icon-btn .icon-wrap{ width: 22px; height: 22px; }
.status-bar .icon-btn .icon-wrap svg{ width: 20px; height: 20px; stroke-width: 2; }
.status-bar .icon-btn .label{ font-size: 12px; line-height: 1; color:#111; }

/* アクティブ表現：塗りつぶしをやめ、下線で控えめに可視化 */
.status-bar .icon-btn.is-drawing,
.status-bar .icon-btn.is-active{
  background: transparent;
  border: 0;
  box-shadow: none;
}

/* 作図中（新規作成ON）はアクセント色で下線＆色替え */
.status-bar .icon-btn.is-drawing{
  border-bottom: 2px solid #2563eb;
}
.status-bar .icon-btn.is-drawing .label{ color:#2563eb; }
.status-bar .icon-btn.is-drawing .icon-wrap svg{ stroke:#2563eb; }

/* 頂点編集ONや計測手法パネルOPEN中はニュートラル下線 */
.status-bar .icon-btn.is-active{
  border-bottom: 2px solid #111;
}
.status-bar .icon-btn.is-active .label{ color:#111; }
.status-bar .icon-btn.is-active .icon-wrap svg{ stroke:#111; }


/* StatusBar内のレイヤーパネルをフラット化して馴染ませる */
.status-bar .map-layer-panel{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

/* 中のUIをツールバーサイズに寄せる */
.status-bar .map-layer-panel #map-type-select{
  width: auto !important;
  margin: 0 !important;
  height: 28px;
  font-size: 12px;
  padding: 2px 6px;
}

.status-bar .map-layer-panel label{
  margin: 0 !important;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  line-height: 1;
}

.status-bar .map-layer-panel input[type="checkbox"]{
  transform: scale(0.9);
}


/* StatusBar 内のレイヤーパネルは縦積みで表示 */
.status-bar .map-layer-panel{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;

  display: flex !important;
  flex-direction: column !important;  /* ← ここを column に */
  align-items: flex-start !important;
  gap: 6px !important;                /* 各行の間隔 */
}

/* 各行（航空写真 / DID / NFZ）は1行にまとまる（チェックと文字は横並び） */
.status-bar .map-layer-panel label{
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
  font-size: 12px;
  line-height: 1.2;
}

/* セレクト（航空写真など）も“1行”として収まる */
.status-bar .map-layer-panel #map-type-select{
  width: auto !important;
  margin: 0 !important;
  height: 28px;
  font-size: 12px;
  padding: 2px 6px;
}

/* チェックボックスは軽く縮小（任意） */
.status-bar .map-layer-panel input[type="checkbox"]{
  transform: scale(0.9);
}

/* StatusBarのレイヤーパネル幅のベース（お好みで 220–300px に調整可） */
.status-bar .map-layer-panel{
  min-width: unset !important;
}

/* セレクトはパネル幅いっぱいに */
.status-bar .map-layer-panel #map-type-select{
  width: 100% !important;
  box-sizing: border-box;
}

/* 狭い画面では少しだけ詰める（任意） */
@media (max-width: 640px){
  .status-bar .map-layer-panel{ min-width: 220px !important; }
}




/* ── StatusBar 左端のブランド表示（ロゴ＋名前＋バージョン） ── */
.status-bar .brand-pill{
  position: relative;          /* ポップオーバーの起点にする */
  display: inline-flex;
  align-items: flex-start;      /* 上付きでバーになじませる */
  gap: 8px;
  padding: 2px 6px;
  border-radius: 6px;
  background: transparent;      /* フラット */
}

.status-bar .brand-pill:hover{
  background: rgba(0,0,0,.06);  /* うっすらホバー */
}

.status-bar .brand-pill img{
  height: 22px;                 /* アイコン高さをボタン群に合わせる */
  width: auto;
  display: block;
}

.status-bar .brand-text{
  line-height: 1.1;
}

.status-bar .brand-name{
  font-size: 12px;
  font-weight: 600;
  color: #111;
  white-space: nowrap;
}

.status-bar .brand-meta{
  font-size: 11px;
  color: #555;
  white-space: nowrap;
}

.status-bar .brand-license-link{
  margin-left: 6px;
  background: transparent;
  border: 0;
  padding: 0;
  font-size: 11px;
  color: #2563eb;
  cursor: pointer;
  white-space: nowrap;
}
.status-bar .brand-license-link:hover{ text-decoration: underline; }

/* ライセンスの小さなポップオーバー（任意で使う） */
.status-bar .brand-license-popover{
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 220px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.95);
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0,0,0,.15);
  font-size: 12px; line-height: 1.4; color:#111;
  z-index: 100;          /* バーの子なのでこれで十分前面 */
}
.status-bar .brand-license-popover[hidden]{ display:none; }
.status-bar .brand-license-popover h4{
  margin: 0 0 6px 0; font-size: 12px;
}
.status-bar .brand-license-popover ul{
  margin: 0; padding-left: 16px;
}
.status-bar .brand-license-popover a{
  color:#2563eb; text-decoration: none;
}
.status-bar .brand-license-popover a:hover{
  text-decoration: underline;
}


/* === About モーダル === */
.about-modal-backdrop[hidden]{ display:none; }
.about-modal-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.2);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  z-index: 100000;                 /* どのUIよりも前面に */
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 72px;               /* 画面上から少し下げて中央寄せ */
}
.about-modal{
  width: min(370px, calc(100% - 32px));
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
  padding: 16px;
}
.about-header{
  display:flex; align-items:flex-start; gap:12px;
}
.about-logo{ width:auto; height:40px; display:block; }
.about-titles{ line-height:1.2; }
.about-name{ font-size:16px; font-weight:700; color:#111; }
.about-version{ font-size:12px; color:#555; margin-top:2px; }
.about-close{
  margin-left:auto;
  background:transparent; border:0; cursor:pointer; font-size:14px; line-height:1;
  width:28px; height:28px; border-radius:6px;
}
.about-close:hover{ background:rgba(0,0,0,.06); }
.about-section{ margin-top:12px; }
.about-section h4{ margin:0 0 6px 0; font-size:12px; color:#111; }
.about-license-list{ margin:0; padding-left: 18px; }
.about-license-list a{ color:#2563eb; text-decoration:none; }
.about-license-list a:hover{ text-decoration:underline; }


/* BrandInfo：コンパクト表示（アイコンのみ） */
.status-bar .brand-pill.is-compact{
  padding: 0;              /* 余白ゼロでフラットに */
  gap: 0;
  background: transparent;
}
.status-bar .brand-pill.is-compact:hover{
  background: transparent; /* ホバーの薄色も消す（完全に溶け込むなら） */
}
.status-bar .brand-pill.is-compact img{
  height: 20px;            /* 他のツールバーアイコンに合わせて小さめ */
  width: auto;
}

/* 好みで変えられるように変数化（標準は 26px に） */
.status-bar { --brand-icon-size: 26px; }

/* コンパクト表示時のブランドアイコンサイズを変数で統一 */
.status-bar .brand-pill.is-compact img{
  height: var(--brand-icon-size);
  width: auto;
}


/* ステータスバー END*/




/* ===== 領域プロパティパネル ===== */
.prop-panel {
  position: fixed;
  right: 12px;
  top: 70px;
  width: 360px;
  max-width: calc(100vw - 24px);
  background: #fff;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0,0,0,.15);
  z-index: 2500;
  display: none;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
.prop-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 12px; border-bottom: 1px solid #f0f0f0;
}
.prop-title { font-size: 14px; font-weight: 600; }
.prop-close { border: none; background: transparent; font-size: 14px; cursor: pointer; opacity: .7; }
.prop-close:hover { opacity: 1; }
.prop-body { padding: 12px; }
.prop-row { display: grid; grid-template-columns: 110px 1fr; gap: 8px; margin-bottom: 10px; }
.prop-label { color: #666; font-size: 12px; line-height: 20px; }
.prop-val { font-size: 13px; line-height: 20px; word-break: break-word; }
.prop-sep { border: none; border-top: 1px solid #f0f0f0; margin: 10px 0; }
#prop-urban-slider { width: 100%; }
.prop-urban-readout { margin-top: 4px; font-size: 12px; color: #333; }
.prop-note { margin-top: 10px; font-size: 12px; color: #444; line-height: 1.6; }
.prop-actions { display: flex; justify-content: center; margin-top: 12px; }
.prop-actions .prop-apply {
  padding: 6px 14px; border-radius: 8px; border: 1px solid #d0d0d0; background: #f7f7f7; cursor: pointer;
}
.prop-actions .prop-apply:hover { background: #efefef; }

/* ===== 領域プロパティパネル END ===== */


/* ===== 案件プロファイル ===== */
.profile-panel {
  position: fixed;
  top: 68px;           /* 既存ステータスバーの下あたりに */
  right: 16px;
  width: min(720px, calc(100vw - 32px));
  max-height: calc(100vh - 96px);
  overflow: auto;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.12);
  padding: 12px 14px;
  display: none;
  z-index:12000;
}

.profile-header{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:8px;
}

.profile-grid{
  display:grid; grid-template-columns: 1.11fr 0.89fr; gap: 12px;
}
@media (max-width: 860px){
  .profile-grid{ grid-template-columns: 1fr; }
}

.profile-left{ display:flex; flex-direction:column; gap:10px; }

.profile-section{ display:flex; flex-direction:column; gap:8px; }

.profile-sep{
  border:0; height:1px; background: #eee; margin: 6px 0;
}

.profile-card{
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 10px 12px;
  cursor: pointer;
  background:#fff;
  display:flex; align-items:center; justify-content:space-between;
}
.profile-card.is-selected{
  background:#0ea5e9;           /* 既存UIに合わせた反転 */
  color:#fff;
  border-color:#0ea5e9;
}
.profile-card .count-input-wrap{
  display:flex; align-items:center; gap:8px;
}
.profile-card .count-input{
  width:84px; padding:6px 8px; border:1px solid #d1d5db; border-radius:6px;
}
.profile-card.is-selected .count-input{
  background:#fff; color:#111; border-color:#fff;
}
.profile-card-label{ font-weight:600; }

.profile-desc{
  border:1px solid #e5e7eb; border-radius:8px; padding:12px; min-height:140px;
  font-size: 14px; line-height:1.6; text-align:left;
}

.profile-actions{
  display:flex; justify-content:center; margin-top:10px;
}
.profile-actions .profile-apply{
  background:#2563eb; color:#fff; border:none; border-radius:8px; padding:8px 16px; cursor:pointer;
}










/* ---- 案件プロファイル：コンパクト版（縦方向圧縮） ---- */
.profile-panel{
  padding: 8px 10px;                 /* 12→8 */
  max-height: calc(100vh - 140px);   /* 下に余白を確保（ボタンと重なりにくく） */
  overflow: auto;
}

.profile-header{ margin-bottom: 6px; }

.profile-grid{ gap: 8px; }           /* 12→8 */
.profile-section{ gap: 6px; }        /* 8→6 */

.profile-card{
  display: grid;
  grid-template-columns: 1fr auto;   /* ラベル / 操作 */
  align-items: center;
  padding: 6px 8px;                  /* 10→6 */
}
.profile-card-label{ font-weight:600; cursor:pointer; }
.profile-card-controls{ display:flex; align-items:center; gap:6px; }
.profile-card .count-input{ width: 72px; padding: 4px 6px; } /* 84→72 */

.profile-desc{
  padding: 8px;                      /* 12→8 */
  min-height: 100px;                 /* 140→100 */
  font-size: 14px; line-height: 1.5; text-align: left;
}

/* 視覚ルール：説明選択中＝薄い強調、ON＝枠色で控えめ強調 */
.profile-card.is-selected{
  background: #eff6ff;               /* 薄い青で“いま説明を見ている”を表示 */
  border-color: #93c5fd;
  color:#111;
}
.profile-card.is-on{
  border-color: #60a5fa;             /* ON は枠色で控えめに */
}

.profile-intro{
  font-size: 12px;
  color: #444;
  line-height: 1.6;
  margin: 6px 0 10px;
  text-align: left;
}


/* === 案件プロファイル：冒頭説明 & ウィザード === */
.profile-intro{
  font-size: 13px;
  color: #444;
  line-height: 1.6;
  margin-bottom: 6px;
  text-align: left;
}

.wizard-btn{
  display: inline-block;
  width: 100%;
  padding: 8px 12px;
  border: 1px solid #d0d0d0;
  border-radius: 8px;
  background: #f8fafc;
  cursor: pointer;
  font-size: 14px;
}
.wizard-btn:hover{ background: #f1f5f9; }
.wizard-help{
  margin-top: 6px;
  font-size: 12px;
  color: #555;
  line-height: 1.6;
  text-align: left;
}

/* === ウィザード・モーダル（黒板風） === */
.wizard-board{
  background: #111;
  color: #fff;
  width: min(720px, 90vw);
  border: 1px solid #333;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.6);
}
.wizard-board-header{
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px;
  border-bottom: 1px solid #222;
}
.wizard-board-body{
  padding: 28px 18px 32px;
  text-align: center;
}
.wizard-under-construction{
  font-size: 18px; font-weight: 700; letter-spacing: .02em;
}

/* 案件プロファイル：解説欄の画像 */
.profile-desc { text-align: left; }  /* 既に left の場合はそのままでOK */
.profile-hero{
  width: 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 8px;
}
.profile-hero img{
  max-width: 100%;
  max-height: 220px;   /* お好みで 160–280px 程度 */
  height: auto;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,.12);
}
.profile-desc-text{
  font-size: 12px;
  line-height: 1.6;
}

/* ==== イメージ拡大表示ボックス ==== */
.profile-hero img{ cursor: zoom-in; }

.img-zoom-backdrop[hidden]{ display:none; }
.img-zoom-backdrop{
  position: fixed; inset: 0;
  background: rgba(0,0,0,.5);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  z-index: 120000;                /* 既存UIより前面に */
  display: flex; align-items: center; justify-content: center;
}
.img-zoom-box{
  max-width: min(90vw, 920px);
  max-height: 85vh;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 12px 28px rgba(0,0,0,.6);
  padding: 8px;
}
.img-zoom-box img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.img-zoom-box img{
  cursor: zoom-out;
}


/* ===== 案件プロファイル END ===== */


/* ===== 地図メニュー ===== */
.status-bar .map-layer-panel{
  position: relative;
  display: flex !important;
  flex-direction: column !important; /* 1行のメニューだけ */
  gap: 0 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* トリガー（コンパクトな擬似セレクト） */
.status-bar .map-layer-trigger{
  height: 36px;
  padding: 4px 8px;
  font-size: 12px;
  border: 1px solid #d0d0d0;
  border-radius: 6px;
  background: rgba(255,255,255,0.95);
  cursor: pointer;
}
.status-bar .map-layer-trigger:hover{ background: #fff; }
.status-bar .map-layer-trigger .ml-caret{ margin-left: 6px; opacity: .6; }

/* メニュー本体（Chromeのメニュー風） */
.status-bar .map-layer-menu{
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 220px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 10px 24px rgba(0,0,0,.15);
  padding: 6px;
  z-index: 2000;
  display: none; /* JSで切替 */
}
.status-bar .map-layer-menu .ml-sep{
  border: 0; height: 1px; background: #eee; margin: 6px 0;
}
.status-bar .map-layer-menu .ml-section{ padding: 2px; }

/* 項目（ベースマップ／オーバーレイ共通） */
.status-bar .map-layer-menu .ml-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 8px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
}
.status-bar .map-layer-menu .ml-item:hover{
  background: #f3f4f6;
}
.status-bar .map-layer-menu .ml-item .ml-indicator{
  width: 1.2em;
  text-align: center;
  opacity: 0;           /* 非選択時は見せない */
  transition: opacity .15s;
}
.status-bar .map-layer-menu .ml-item.is-on .ml-indicator{
  opacity: 1;           /* 選択/ONは ✓ を見せる */
}
/* ===== 地図メニュー END ===== */

/* ===== 頂点編集パネル ===== */
.vertex-panel{
  position: fixed; 
  top: 80px; 
  right: 20px; 
  width: 150px;
  background:#fff; 
  border:1px solid #ccc; 
  border-radius:10px;
  box-shadow: 0 8px 18px rgba(0,0,0,.2);
  padding: 12px; 
  z-index: 9999; 
  display:none;
}

.vertex-panel-content{
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.vertex-row{
  display: grid;
  grid-template-columns: 28px auto;  /* ← ラベル列を“自動”にして伸びすぎ防止 */
  align-items: center;
  gap: 8px;
  padding: 4px 2px;                   /* ← 行の余白も控えめに */
  border: 0;                          /* ← 内枠を撤去 */
  background: transparent;            /* ← 背景色も撤去 */
}

.square-btn{
  width: 32px;
  height: 32px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #fff;
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}
.square-btn.is-active{
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}

.control-label{
  user-select: none;
  pointer-events: none; /* ← ラベルは“プレート”として非クリック */
  font-size: 14px;
}
/* ===== 頂点編集パネル END ===== */

/* ===== 案件プロファイル内：市街地率ブロック ===== */
.profile-urban .profile-row{
  display: grid;
  grid-template-columns: 86px 1fr;  /* 「市街地率」ラベル / コントロール */
  align-items: center;
  gap: 10px;
}
.profile-urban .profile-row-ctrl input[type="range"]{
  width: 100%;
}
.profile-urban .profile-urban-readout{
  margin-top: 4px;
  font-size: 12px;
  color: #333;
}
.profile-urban .profile-urban-note{
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid #e5e7eb;
  font-size: 12px;
  color: #333;
  line-height: 1.5;
}
/* ===== 案件プロファイル内：市街地率ブロック END ===== */

/* ===== ProjectProfile 初期ガイド ===== */
@keyframes ppPulse {
  0%   { box-shadow: 0 0 0 0 rgba(37,99,235,.35); }
  70%  { box-shadow: 0 0 0 8px rgba(37,99,235,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,99,235,0); }
}

/* ステータスバー上のボタンを控えめに発光させる */
.status-bar .icon-btn.pp-attention {
  animation: ppPulse 1.6s ease-out infinite;
  border-bottom: 2px solid #2563eb !important; /* 下線も軽く強調 */
}

/* 吹き出し */
.pp-hint {
  position: fixed;
  z-index: 100000;
  background: #fff;
  color: #111;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 8px 22px rgba(0,0,0,.18);
  padding: 10px 12px;
  max-width: 260px;
  line-height: 1.4;
}
.pp-hint::after {
  content: "";
  position: absolute;
  top: -6px;
  left: 14px;            /* JSで左座標を合わせるのでお好みで */
  border-width: 6px;
  border-style: solid;
  border-color: transparent transparent #fff transparent;
  filter: drop-shadow(0 -1px 0 #e5e7eb);
}
.pp-hint .pp-hint-close {
  position: absolute;
  top: 6px;
  right: 6px;
  background: transparent;
  border: 0;
  font-size: 14px;
  width: 24px; height: 24px;
  border-radius: 6px;
  cursor: pointer;
}
.pp-hint .pp-hint-close:hover { background: rgba(0,0,0,.06); }
/* ===== ProjectProfile 初期ガイド END ===== */


/* ==== リリースノート ==== */
.release-modal-backdrop[hidden]{ display:none; }
.release-modal-backdrop{
  position: fixed; inset: 0;
  background: rgba(0,0,0,.25);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  z-index: 100000;
  display: flex; align-items: flex-start; justify-content: center;
  padding-top: 80px;
}
.release-modal{
  width: min(860px, calc(100% - 32px));
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
  padding: 12px;
}
.release-header{ display:flex; align-items:center; }
.release-title{ font-size:16px; font-weight:700; color:#111; }
.release-close{
  margin-left: auto; background: transparent; border: 0; cursor: pointer;
  width: 28px; height: 28px; border-radius: 6px; font-size: 16px; line-height: 1;
}
.release-close:hover{ background: rgba(0,0,0,.06); }
.release-body{ display: grid; grid-template-columns: 220px 1fr; gap: 12px; margin-top: 10px; }
.release-list{ display:flex; flex-direction:column; gap:6px; }
.release-list-item{
  text-align:left; padding:6px 8px; border:1px solid #e5e7eb; border-radius:8px; background:#f8fafc; cursor:pointer;
  font-size:13px;
}
.release-list-item:hover{ background:#f1f5f9; }
.release-list-item.is-active{ background:#eef2ff; border-color:#c7d2fe; }
.release-content{ min-height: 260px; padding: 6px; overflow: auto; border: 1px solid #f0f0f0; border-radius: 8px; text-align: left;}
.release-content h1{ font-size:18px; margin:.3em 0 .2em; }
.release-content h2{ font-size:16px; margin:.6em 0 .2em; }
.release-content h3{ font-size:15px; margin:.5em 0 .2em; }
.release-content p{ margin:.5em 0; }
.release-pre{ background:#0f172a; color:#f8fafc; padding:8px 10px; border-radius:6px; overflow:auto; font-size:12px; }
/* リリースノート：フッターを縦積みに */
.release-footer{
  display: flex;                 /* 念のため明示 */
  flex-direction: column;        /* カード → ボタン の縦並び */
  align-items: stretch;          /* カードを横幅いっぱい */
  gap: 8px;                      /* 間隔 */
}
.release-footer .release-close-btn{
  align-self:flex-end;
  padding:6px 14px;
  border-radius:8px;
  border:1px solid #d0d0d0;
  background:#f7f7f7;
  cursor:pointer;
}
.release-footer .release-close-btn:hover{ background:#efefef; }
.release-loading, .release-error{ color:#555; font-size:13px; }
/* フッター表示のアンケート告知カード */
.release-footer .release-survey-card{
  padding: 10px 12px;
  background: #f1f5f9;
  border: 1px solid #C0C0C0;
  border-radius: 8px;
}
.release-footer .release-survey-card .rsc-title{
  font-size: 15px; font-weight: 700; color: #7c2d12; margin: 0 0 2px 0;
}
.release-footer .release-survey-card .rsc-text{
  font-size: 13px; color: #111; margin: 0 0 8px 0; line-height: 1.6;
}
.release-footer .release-survey-card .rsc-btn{
  display: inline-flex; align-items: center; gap: 6px;
  background: #143893; color: #fff; text-decoration: none;
  border: none; border-radius: 8px; padding: 6px 12px; cursor: pointer;
}
.release-footer .release-survey-card .rsc-btn:hover{ background: #1e40af; }

/* ==== リリースノート END ==== */


/* ===== 問い合わせ先パネル ===== */
.contact-panel{
  position: fixed;
  top: 68px;
  right: 16px;
  width: min(520px, calc(100vw - 32px));
  max-height: calc(100vh - 120px);
  overflow: auto;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(0,0,0,.15);
  z-index: 3000;
}
.contact-header{
  display:flex; align-items:center; justify-content:space-between;
  padding: 10px 12px; border-bottom: 1px solid #f0f0f0;
}
.contact-title{ font-size: 14px; font-weight: 700; }
.contact-close{ border:none; background:transparent; font-size:16px; cursor:pointer; opacity:.75; }
.contact-close:hover{ opacity:1; }
.contact-body{ padding: 12px; }
.contact-section{ margin-bottom: 12px; }

.contact-section-title{
  background: #eef2f7;
  border: 1px solid #e1e5ea;
  border-radius: 6px;
  padding: 6px 8px;
  font-weight: 700;
  font-size: 14px;
  color: #0f172a;
  margin-bottom: 6px;
}

.contact-mail{
  font-size: 15px;
  font-weight: 600;
  padding: 8px 10px;
  color: #111827;
}

.contact-detail{
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  min-height: 120px;
}

/* アクセシビリティ用（画面には出さないラベル） */
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* プルダウン行 */
.pref-select-row{ margin-bottom: 10px; }

.pref-select{
  width: 100%;
  height: 36px;                  /* 住所検索ボックス等と高さ感を揃えるなら調整 */
  padding: 6px 10px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  font-size: 14px;
}

/* 右側の詳細は既存の contact-detail を再利用 */
.contact-detail .row{ display:flex; gap:12px; margin:4px 0; }
.contact-detail .label{ width:90px; color:#374151; font-weight:700; }
.contact-detail .hint{ color:#6b7280; font-size:12px; }

/* ===== 問い合わせ先パネル ===== END */
/* 案件プロファイル：業務種別のセレクトをラベルと同じ見た目＋中央寄せ */
.profile-panel .pp-job-select{
  font-family: inherit;          /* プロファイル内と同一フォント */
  font-size: 14px;
  font-weight: 600;              /* 「オリジナル点群データ」などと同じ太さ */
  height: 36px;
  padding: 6px 10px;
  border: 1px solid #d0d0d0;
  border-radius: 8px;
  background: #fff;

  /* セレクト内の表示テキストを中央揃え */
  text-align: center;            /* 一部ブラウザ用 */
  text-align-last: center;       /* 表示中の項目を中央 */
}
.profile-panel .pp-job-select option{
  text-align: center;            /* ドロップダウン内の各項目も中央（対応ブラウザ） */
}

/* 左カラム内でセレクト自体を中央に配置（横位置） */
.profile-left > .pp-job-select{
  align-self: center;            /* .profile-left は flex-column */
}

/* ==== 案件プロファイル追加分 END ==== */


/* ==== 案件ウィザード ==== */

.wiz-summary-title{ font-weight:700; margin-bottom:8px; }
.wiz-summary-list{ margin:0 0 10px 18px; }
.wiz-method-apply{ display:flex; align-items:center; gap:8px; margin:6px 0 12px; }
.wiz-actions{ display:flex; justify-content:flex-end; gap:8px; }
.wiz-actions .wiz-apply{ padding:6px 12px; border-radius:6px; background:#2563eb; color:#fff; border:none; cursor:pointer; }
.wiz-actions .wiz-back-summary{ padding:6px 12px; border-radius:6px; border:1px solid #d1d5db; background:#f9fafb; cursor:pointer; }



/* モーダルの全画面オーバーレイ */
.wizard-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 200000 !important;               /* 他UIより前面 */
  display: flex;
  align-items: center;          /* 垂直中央 */
  justify-content: center;      /* 水平中央 */
}

/* 中央に出るモーダル本体 */
.wizard-modal {
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  background: #fff;
  width: min(720px, calc(100vw - 32px));
  max-height: min(80vh, 720px);
  overflow: auto;               /* はみ出しは内部スクロール */
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0,0,0,.22);
  padding: 16px 16px 12px;
  position: relative;
  z-index: 13000; 
}
.wizard-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  padding: 10px 14px;
}
.wizard-title {
  font-weight: 600;
  font-size: 12px;
  color: #555;
  opacity: .85;
  letter-spacing: .05em;
}
.wizard-close {
  color: #fff;
  border: none;
  background: transparent;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 2px 6px;
  opacity: .8;
}
.wizard-close:hover { opacity: 1; }

/* 本文とフッター */
.wizard-body { padding: 14px; padding-top: 4px; }
.wizard-step { display: grid; gap: 12px; }
.wizard-nav {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 12px;
}
.wizard-nav button{ padding:6px 12px; border-radius:6px; border:1px solid #d1d5db; background:#f9fafb; cursor:pointer; }
.wizard-nav .wiz-next{ background:#2563eb; color:#fff; border-color:#2563eb; }

/* 背景のスクロールを止める */
body.modal-open {
  overflow: hidden;
}

/* ラジオ項目の並び・押しやすさ */
.wiz-q{ font-weight:600; margin-bottom:8px; }
.wiz-opts { display: grid; gap: 8px; }
.wiz-opt { padding:8px 10px; border:1px solid #e5e7eb; border-radius:8px; display: flex; align-items: center; gap: 8px; cursor: pointer; }
.wiz-opt input { transform: translateY(1px); }
/* ==== 案件ウィザード END ==== */


/* ===== 問い合わせ先：資料ダウンロード ===== */
.contact-download{
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 10px;
  background: #f8fafc;
}
.contact-download .download-desc{
  font-size: 12px;
  color: #555;
  margin-bottom: 8px;
}
.download-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 8px;
  background: #143893;
  color: #fff;
  text-decoration: none;
}
.download-btn:hover{
  background: #0F0F56;
  text-decoration: none;
}
.download-btn .icon{
  width: 1.1em;
  height: 1.1em;
  display: inline-grid;
  place-items: center;
}
/* ===== 問い合わせ先：資料ダウンロード END ===== */


/* ===== 概算見積フォーム：個人情報 同意UI =====　*/
.policy-consent{
  font-size: 12px;
  color: #333;
  margin: 8px 0 4px;
}
.policy-consent label{ display: inline-flex; align-items: center; gap: 6px; }
.policy-consent a{ color:#2563eb; text-decoration:none; }
.policy-consent a:hover{ text-decoration:underline; }

.policy-note{
  font-size: 11px;
  color: #555;
  background: #f8fafc;
  border-left: 3px solid #e5e7eb;
  padding: 6px 8px;
  margin-bottom: 8px;
  line-height: 1.6;
}

#send-estimate-request[disabled]{
  opacity: .55;
  cursor: not-allowed;
}

.privacy-credit{ /* ページ常時のプライバシークレジット（概算ボタンの少し下） */
  position: fixed;
  left: 50%;
  bottom: 8px;               /* 概算ボタンより少し下に */
  transform: translateX(-50%);
  z-index: 9999;
  font-size: 11px;
  color: #555;
  background: rgba(255,255,255,0.9);
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding: 4px 8px;
  text-decoration: none;
}
.privacy-credit:hover{ text-decoration: underline; }

/* ===== 概算見積フォーム：個人情報 同意UI END =====　*/


/* ===== 送信中 スピナー ===== */
#send-estimate-request.is-loading,
#open-estimate-request.is-loading{
  position: relative;
  pointer-events: none;
  opacity: .85;
}
#send-estimate-request.is-loading::after,
#open-estimate-request.is-loading::after{
  content: '';
  position: absolute;
  right: 8px; top: 50%;
  width: 16px; height: 16px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: spin .7s linear infinite;
}
@keyframes spin {
  from { transform: translateY(-50%) rotate(0deg); }
  to   { transform: translateY(-50%) rotate(360deg); }
}
/* ===== 送信中 spinner END===== */


/* ===== 任意パネルを モーダル化するための共通スタイル ===== */
/* バックドロップは BrandInfo と同じ .about-modal-backdrop を共用 */
.about-modal-backdrop .as-modal{
  position: relative !important;       /* もとの fixed/top/right を無効化 */
  top: auto !important;
  right: auto !important;
  margin: 10vh auto 0;                 /* 画面上部から少し下げて中央寄せ */
  width: min(640px, calc(100% - 32px));
  max-height: 80vh;
  overflow: auto;
  box-shadow: 0 8px 28px rgba(0,0,0,.22);
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  display: block !important;
}

/* 各パネル固有の元レイアウト（右上固定など）を as-modal 中は打ち消す */
.method-panel.as-modal,
.profile-panel.as-modal,
.contact-panel.as-modal{
  background: #fff;            /* BrandInfoのカードと同調 */
  padding: 14px;
}

/* Contact：右上 80/20・幅360px（計測手法と同じ見た目で） */
.contact-backdrop .contact-panel.as-modal{
  position: absolute !important;
  top: 80px !important;
  right: 20px !important;
  margin: 0 !important;
  width: 360px;
  max-width: calc(100% - 40px);
  display: block !important; /* backdrop内で確実に可視に */
}

/* Profile：従来の right上固定レイアウトを維持（style.css の profile-panel と同値） */
.profile-backdrop .profile-panel.as-modal{
  position: absolute !important;
  top: 68px !important;
  right: 16px !important;
  margin: 0 !important;
  width: min(720px, calc(100vw - 32px));
  max-height: calc(100vh - 96px);
  overflow: auto;
  display: block !important;
}

/* MethodSelector：モーダル時も“右上: 80/20px・幅360px”を維持（Method専用） */
.method-backdrop .method-panel.as-modal{
  position: absolute !important;  /* 共通の position:relative !important を打ち消す */
  top: 80px !important;
  right: 20px !important;
  margin: 0 !important;           /* 中央寄せの余白を打ち消す */
  width: 360px;
  max-width: calc(100% - 40px);   /* 画面が狭い時だけ安全に縮む（左右20px合計） */
}

/* ===== 任意パネルを モーダル化するための共通スタイル END ===== */


/* ===== 概算見積 吹き出しポップ（統合版） ===== */
/* パネル内ボタン行：中央寄せ */
.cta-row{
  display:flex; align-items:center; gap:6px; flex-wrap:wrap;
  justify-content:center;
}

/* ボタンのラッパ（ポップの基準点） */
.cta-wrap{ position: relative; display: inline-block; }

/* 吹き出し本体（幅・位置はCSS変数で微調整可） */
.cta-popover{
  position: absolute;
  right:  var(--cta-pop-right,  -270px);                /* → +で右へ */
  bottom: var(--cta-pop-bottom,  54px);                 /* → +で上へ */

  width: var(--cta-pop-width, clamp(200px, 56vw, 250px));
  max-width: none;
  padding: 10px 12px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  font-size: 13px; line-height: 1.7; color:#111;
  z-index: 10;
  transform-origin: bottom right;
  animation: cta-pop-in .18s ease-out both;
}
.cta-popover::after{
  content: '';
  position: absolute;
  right: var(--cta-pop-arrow-right, 22px);              /* 三角の横位置 */
  bottom: -8px;
  width: 0; height: 0;
  border: 8px solid transparent;
  border-top-color: #fff;
  filter: drop-shadow(0 -1px 0 #e5e7eb);
}
@keyframes cta-pop-in{
  from{ opacity:0; transform: translateY(6px) scale(.98); }
  to  { opacity:1; transform: translateY(0)   scale(1); }
}

/* ×ボタンは非表示 */
.cta-popover .cta-pop-close{ display:none !important; }

/* 指さしアイコン（位置・サイズも変数で微調整可） */
.cta-popover .cta-pointer{
  position: absolute;
  font-size: 36px;
  right: 248px;
  bottom: -42px;                /* 吹き出しの外側に少しはみ出す */

  transform: rotate(-18deg);
  pointer-events: none;
  animation: cta-point 1.2s ease-in-out infinite;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.15));
}
@keyframes cta-point{
  0%   { transform: translate(2px,2px) rotate(-18deg); opacity:.85; }
  50%  { transform: translate(0,0)     rotate(-18deg); opacity:1;   }
  100% { transform: translate(2px,2px) rotate(-18deg); opacity:.85; }
}

/* 注目リング（上下左右オフセット可／既定2回） */
.cta-wrap.attn::after{
  content:'';
  position:absolute;
  top:    calc(-6px + var(--cta-ring-offset-y, 14px));
  right:  calc(-6px + var(--cta-ring-offset-x, 0px));
  bottom: calc(-6px - var(--cta-ring-offset-y, 0px));
  left:   calc(-6px - var(--cta-ring-offset-x, -4px));
  border-radius: 12px;
  box-shadow: 0 0 0 0 rgba(37,99,235,.35);
  animation: cta-pulse 1.4s ease-out 0s 2; /* 2回 */
}
@keyframes cta-pulse{
  0%   { box-shadow: 0 0 0 0 rgba(37,99,235,.35); }
  70%  { box-shadow: 0 0 0 10px rgba(37,99,235,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,99,235,0); }
}

/* モバイルははみ出し防止 */
@media (max-width: 480px){
  .cta-popover{
    right: var(--cta-pop-right, -8px);
    bottom: var(--cta-pop-bottom, 56px);
    width: min(94vw, 420px);
  }
}

/* ===== 概算見積 吹き出しポップ END ===== */


/* ===== 面積入力(#prop-area-input)の↑↓スピンを消す ===== */
#prop-area-input::-webkit-outer-spin-button,
#prop-area-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
#prop-area-input {
  -moz-appearance: textfield; /* Firefox */
  appearance: textfield;      /* 仕様準拠 */
}

/* ===== 面積入力(#prop-area-input)の↑↓スピンを消す END ===== */


/* ===== 脚注マーク（※） ===== */
.fn { 
  font-size: .4em;   /* フォントサイズ */
  line-height: 1;    /* 余白の暴れ防止 */
}
/* ===== 脚注マーク（※）END ===== */

/* ===== 概算見積結果プレートの幅 ===== */
#estimate-panel{
  width: 700px;                 /* プレートの横幅 */
  max-width: calc(100vw - 32px);/* 画面が狭い時はみ出さないようにする */
  box-sizing: border-box;
}
/* ===== 概算見積結果プレートの幅 END ===== */


/* ===== 計測手法選択時の表示制御 ===== */
/* プロファイルのグリッド全体をマスクの基準にする */
.profile-grid {
  position: relative;
}

/* ぼかし用のマスク */
.profile-grid-mask {
  position: absolute;
  inset: 0; /* top/right/bottom/left: 0 */
  background: rgba(255, 255, 255, 0.75);
  backdrop-filter: blur(3px);
  display: flex;          /* デフォルトは表示（methodConfirmed=false） */
  align-items: center;
  justify-content: center;
  z-index: 10;
  pointer-events: auto;   /* 下のUIをクリック不可にする */
}

/* マスクの中のメッセージボックス */
.profile-grid-mask-inner {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 8px;
  padding: 12px 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  font-size: 13px;
  line-height: 1.4;
  color: #374151;
  text-align: center;
}
/* ===== 計測手法選択時の表示制御 END ===== */

/* ===== 計測手法選択確定表示用パネル ===== */
.profile-method-confirm {
  margin-top: 4px;
  padding: 10px 14px;
  border-radius: 999px;          /* カプセル型に */
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  cursor: pointer;
  text-align: center;
}

.profile-method-confirm:hover {
  background: #e0e7ff;
}

/* 中央にラベル表示 */
.profile-method-confirm .pmc-label-big {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .02em;
  color: #111827;
}
/* ===== 計測手法選択確定表示用パネル END ===== */

/* ===== 案件プロファイル：セクション見出し付きグループ ===== */
.profile-section-group {
  margin-top: 6px;
  padding: 6px 8px 8px;
  border-radius: 8px;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.profile-section-title {
  font-size: 14px;          /* 大きめに */
  font-weight: 700;         /* 太字のまま */
  color: #111827;           /* 文字色を濃く */
  margin-bottom: 4px;       /* 下に少し余白 */
  text-align: left;         /* 念のため左寄せを指定 */
  letter-spacing: .03em;    /* ほんの少し字間を広く */
}
/* ===== 案件プロファイル：セクション見出し付きグループ END ===== */


/* ===== GCP 自動配点ボタン ===== */
.profile-card .gcp-auto-wrap{
  grid-column: 1 / -1;       /* 2カラムをまたいで下段に並べる */
  margin-top: 4px;
  display: flex;
  justify-content: flex-end;
}

.gcp-auto-btn{
  padding: 4px 8px;
  font-size: 12px;
  border-radius: 999px;
  border: 1px solid #60a5fa;
  background: #eff6ff;
  cursor: pointer;
}
.gcp-auto-btn:hover{
  background: #dbeafe;
}
/* ===== GCP 自動配点ボタン END ===== */


/* ===== 見積り内訳 デバッグ小窓 ===== */
.estimate-debug {
  position: fixed;
  right: 12px;
  bottom: 12px;
  width: 340px;
  max-height: 70vh;     /* 画面高さの 70% まで伸びる */
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.18);
  font-size: 11px;
  z-index: 9999;
  overflow-y: auto;
}

.estimate-debug-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 8px;
  border-bottom: 1px solid #e5e7eb;
  font-weight: 600;
  background: #f9fafb;
}

.estimate-debug-close {
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  padding: 0 4px;
}

/* 以下表形式の表示 */
.estimate-debug-body{
  padding: 6px 8px;
}

.estimate-debug-summary{
  font-size: 11px;
  margin-bottom: 6px;
}
.estimate-debug-summary .summary-row{
  display: flex;
  justify-content: space-between;
  margin-bottom: 2px;
}
.estimate-debug-summary .summary-label{
  color: #555;
}
.estimate-debug-summary .summary-value{
  font-weight: 600;
}

.estimate-debug-table-wrap {
  max-height: none;
  overflow-y: visible;
}
.estimate-debug-table{
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}
.estimate-debug-table th,
.estimate-debug-table td{
  padding: 2px 4px;
  border-bottom: 1px solid #eee;
}
.estimate-debug-table th{
  text-align: left;
  background: #f9fafb;
}
.estimate-debug-table td.align-right{
  text-align: right;
}
.estimate-debug-table tr.is-zero{
  color: #999;              /* 0円の行は薄く */
}
.estimate-debug-table tfoot .estimate-debug-total-row{
  border-top: 2px solid #ddd;
  font-weight: 600;
  background: #f9fafb;
}
/* ===== 見積り内訳 デバッグ小窓 END ===== */

/* ===== GCP 自動配点プレビュー ===== */
.gcp-preview {
  border-top: 1px dashed #e5e7eb;
  padding-top: 4px;
  font-size: 11px;
}
/* タイトル行（左上） */
.gcp-preview-header {
  margin-bottom: 4px;
}
/* canvas とテキストを横並びにするコンテナ */
.gcp-preview-body {
  display: flex;
  align-items: flex-start;
  gap: 8px;           /* canvas とテキストの間隔 */
}
/* 模式図 */
.gcp-preview-canvas {
  width: 100%;
  max-width: 260px;
  height: auto;
  border: 1px solid #e5e7eb;
  background: #fafafa;
  display: block;
  flex: 0 0 auto;     /* 幅を固定気味に */
}
/* 右側の点数テキスト */
.gcp-preview-text {
  font-size: 11px;
  line-height: 1.4;
  white-space: nowrap;  /* 折り返しさせたくなければ */
}
/* ===== GCP 自動配点プレビュー END ===== */

/* ===== 案件プロファイル：要件（写真測量）の行レイアウト ===== */
/* 「要求精度」「位置座標補正方法」の行をラベル左 / プルダウン右にする */
.profile-photo-options .profile-row {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr); /* ラベル幅 / プルダウン */
  align-items: center;
  gap: 8px;
}

/* コントロール側が変に広がらないように */
.profile-photo-options .profile-row-ctrl {
  min-width: 0;
}

/* ラベルは少し小さめ＆太字で */
.profile-photo-options .profile-row-label {
  font-size: 13px;
  font-weight: 600;
}

/* プルダウンのフォントをやや小さく＆高さも少し抑える */
.profile-photo-options .pref-select {
  font-size: 13px;
  height: 32px;        /* 既存36pxより少し低め */
  padding: 4px 8px;    /* 既存より少しタイトに */
  width: 100%;         /* 行内いっぱいを使う */
}

/* ドロップダウン内の各 option も同じくらいに */
.profile-photo-options .pref-select option {
  font-size: 13px;
}
/* ===== 案件プロファイル：要件（写真測量）の行レイアウト END ===== */