/* マチベース 私のまち */
.mbmc {
	--mbmc-bg: #f7f6f3;
	--mbmc-hero: #faf1e8;
	--mbmc-card: #ffffff;
	--mbmc-text: #2b2925;
	--mbmc-sub: #6f6253;
	--mbmc-muted: #8a7a68;
	--mbmc-line: #e6e2d8;
	--mbmc-line2: #c8beac;
	--mbmc-green: #4a6741;
	--mbmc-green-dark: #3d5636;
	--mbmc-pale: #eef2ea;
	--mbmc-pale2: #f4f7f1;
	--mbmc-red: #c4532e;
	background: var(--mbmc-bg);
	color: var(--mbmc-text);
	font-family: 'Zen Kaku Gothic New', 'Zen Maru Gothic', sans-serif;
	font-size: 15px;
	line-height: 1.7;
	padding-bottom: 48px;
	width: 100%;
}
.mbmc *, .mbmc *::before, .mbmc *::after { box-sizing: border-box; }
.mbmc a { color: var(--mbmc-green); }
.mbmc a:hover { color: var(--mbmc-green-dark); }
.mbmc img { max-width: 100%; display: block; }
.mbmc button { font-family: inherit; }
.mbmc [hidden] { display: none !important; }
.mbmc-hand { font-family: 'Zen Kurenaido', sans-serif; }
.mbmc-sp { display: inline; }
html.mbmc-lock, html.mbmc-lock body { overflow: hidden; }

.mbmc-wrap { width: 100%; max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.mbmc-narrow { max-width: 640px; }

/* 見出し */
.mbmc-hero { background: var(--mbmc-hero); padding: 22px 0 26px; }
.mbmc-hero-inner { max-width: 1120px; margin: 0 auto; padding: 0 16px; }
.mbmc-hero-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mbmc-chip { display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--mbmc-line); border-radius: 999px; padding: 4px 12px; font-size: 13px; }
.mbmc-chip a { font-size: 12px; }
.mbmc-badge { font-size: 12px; font-weight: 700; color: var(--mbmc-green-dark); background: var(--mbmc-pale); border-radius: 4px; padding: 3px 8px; }
.mbmc-title { margin: 16px 0 0; font-size: 28px; line-height: 1.4; font-weight: 500; letter-spacing: .01em; }
.mbmc-lead { margin: 8px 0 0; color: #4d453b; }
.mbmc-h2 { margin: 0 0 10px; font-size: 16px; font-weight: 500; }
.mbmc-section { margin-top: 28px; }
.mbmc-section-head { display: flex; align-items: center; justify-content: space-between; }
.mbmc-note { font-size: 12px; color: var(--mbmc-sub); margin: 14px 0 0; }
.mbmc-center { text-align: center; margin: 16px 0 0; }
.mbmc-alert { background: #fdecea; border: 1px solid #f0c2b6; border-radius: 8px; padding: 10px 14px; margin: 16px 0 0; font-size: 14px; }

/* ボタン：塗り＝いちばん大事な操作、線＝その次 */
.mbmc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; padding: 0 18px; border-radius: 6px; border: 1px solid var(--mbmc-green); background: var(--mbmc-green); color: #fff !important; font-size: 15px; font-weight: 700; text-decoration: none; cursor: pointer; line-height: 1.3; }
.mbmc-btn:hover { background: var(--mbmc-green-dark); border-color: var(--mbmc-green-dark); }
.mbmc-btn:disabled { background: var(--mbmc-line); border-color: var(--mbmc-line); color: var(--mbmc-sub) !important; cursor: default; }
.mbmc-btn-secondary { background: #fff; color: var(--mbmc-green) !important; font-weight: 500; }
.mbmc-btn-secondary:hover { background: var(--mbmc-pale2); color: var(--mbmc-green-dark) !important; }
.mbmc-btn-secondary:disabled { background: #fff; border-color: var(--mbmc-line); }
.mbmc-btn-small { min-height: 36px; padding: 0 12px; font-size: 13px; }
.mbmc-btn-block { display: flex; width: 100%; }
.mbmc-btn + .mbmc-btn-block, .mbmc-btn-block + .mbmc-btn-block { margin-top: 10px; }
.mbmc-btn.is-picked { background: var(--mbmc-pale); border-color: var(--mbmc-pale); color: var(--mbmc-green-dark) !important; }
.mbmc-icon-btn { width: 40px; height: 40px; flex-shrink: 0; border: none; background: transparent; color: var(--mbmc-muted); font-size: 20px; line-height: 1; padding: 0; cursor: pointer; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; }
.mbmc-icon-btn:hover { background: var(--mbmc-bg); }
.mbmc-icon-btn:disabled { opacity: .3; cursor: default; }
.mbmc-link { border: none; background: none; padding: 6px 4px; color: var(--mbmc-sub); font-size: 13px; text-decoration: underline; cursor: pointer; }
.mbmc-link-danger { border: none; background: none; padding: 8px 0; color: #a3412a; font-size: 13px; text-decoration: underline; cursor: pointer; }

/* 入力 */
.mbmc-label { display: block; margin-top: 18px; font-size: 15px; font-weight: 500; }
.mbmc-label small { font-weight: 400; color: var(--mbmc-sub); font-size: 12px; }
.mbmc-input { display: block; width: 100%; margin-top: 6px; border: 1px solid var(--mbmc-line2); border-radius: 8px; padding: 10px 12px; background: #fff; font-size: 16px; color: var(--mbmc-text); font-family: inherit; resize: vertical; }
textarea.mbmc-hand { font-size: 17px; line-height: 1.6; }
.mbmc-input:focus { outline: 2px solid var(--mbmc-green); outline-offset: 1px; }
.mbmc-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

/* 9マス */
.mbmc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 20px; }
.mbmc-tile { position: relative; aspect-ratio: 1 / 1; border-radius: 6px; overflow: hidden; display: block; text-decoration: none; }
.mbmc-tile img { width: 100%; height: 100%; object-fit: cover; }
.mbmc-tile.is-empty { border: 1.5px dashed var(--mbmc-line2); background: #fff; color: var(--mbmc-muted); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; cursor: pointer; padding: 0; width: 100%; }
.mbmc-tile.is-empty:hover { border-color: var(--mbmc-green); background: var(--mbmc-pale2); }
.mbmc-tile-plus { font-size: 24px; line-height: 1; color: var(--mbmc-green); }
.mbmc-tile-num { font-size: 12px; }
.mbmc-tile-no { position: absolute; top: 6px; left: 6px; width: 22px; height: 22px; border-radius: 50%; background: #fff; color: var(--mbmc-text); font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.mbmc-tile-name { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px 8px 6px; font-size: 12px; line-height: 1.35; font-weight: 500; color: #fff; background: linear-gradient(to top, rgba(30,26,20,.82), rgba(30,26,20,0)); }
.mbmc-tile-label { position: absolute; top: 8px; left: 8px; font-size: 11px; font-weight: 700; background: var(--mbmc-red); color: #fff; border-radius: 3px; padding: 1px 7px; }

.mbmc-progress { display: flex; align-items: center; justify-content: space-between; margin-top: 14px; }
.mbmc-dots { display: inline-flex; gap: 5px; }
.mbmc-dot { width: 10px; height: 10px; border-radius: 50%; background: #ddd6c8; }
.mbmc-dot.is-on { background: var(--mbmc-green); }
.mbmc-progress-text { font-size: 14px; }
.mbmc-progress-text b { font-size: 18px; color: var(--mbmc-green); }

/* 投稿ボタン（スマホでは画面の下に固定） */
.mbmc-actionbar { background: rgba(255,255,255,.97); border-top: 1px solid var(--mbmc-line); padding: 10px 16px calc(12px + env(safe-area-inset-bottom)); }
.mbmc-actionbar.is-fixed { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; }
.mbmc-dock { margin-top: 28px; }
.mbmc-actionbar .mbmc-btn { min-height: 52px; font-size: 16px; }
.mbmc-actionbar-note { margin: 6px 0 0; text-align: center; font-size: 12px; color: var(--mbmc-sub); }
.mbmc-error { margin: 0 0 8px; font-size: 13px; color: #a3412a; background: #fdecea; border-radius: 6px; padding: 8px 10px; }
.mbmc-create { padding-bottom: 0; }

/* 選んだ場所 */
.mbmc-chosen { display: flex; flex-direction: column; gap: 10px; }
.mbmc-pick { background: var(--mbmc-card); border: 1px solid var(--mbmc-line); border-radius: 8px; padding: 12px; }
.mbmc-pick-head { display: flex; align-items: center; gap: 10px; }
.mbmc-pick-thumb { width: 52px; height: 52px; border-radius: 6px; object-fit: cover; flex-shrink: 0; }
.mbmc-pick-name { flex-grow: 1; min-width: 0; font-size: 15px; }
.mbmc-pick-name b { font-weight: 500; }
.mbmc-pick-label { display: block; margin-top: 10px; font-size: 12px; color: var(--mbmc-sub); }
.mbmc-pick-label .mbmc-input { background: #fbfaf7; border-color: var(--mbmc-line); }
.mbmc-pick-photo { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.mbmc-add-more { margin-top: 12px; width: 100%; min-height: 54px; border: 1.5px dashed var(--mbmc-green); border-radius: 8px; background: var(--mbmc-pale2); color: var(--mbmc-green-dark); font-size: 15px; font-weight: 500; cursor: pointer; }

/* よく選ばれている場所 */
.mbmc-search-open { display: flex; align-items: center; gap: 8px; width: 100%; height: 46px; border: 1px solid var(--mbmc-line2); border-radius: 8px; padding: 0 12px; background: #fff; color: var(--mbmc-muted); font-size: 15px; cursor: pointer; text-align: left; }
.mbmc-popular { display: flex; gap: 10px; overflow-x: auto; margin: 12px -16px 0; padding: 2px 16px 6px; scroll-snap-type: x proximity; }
.mbmc-pop { flex: 0 0 140px; background: #fff; border: 1px solid var(--mbmc-line); border-radius: 8px; overflow: hidden; scroll-snap-align: start; display: flex; flex-direction: column; }
.mbmc-pop img { width: 100%; height: 100px; object-fit: cover; }
.mbmc-pop-body { padding: 8px 10px 10px; display: flex; flex-direction: column; flex-grow: 1; }
.mbmc-pop-name { font-size: 13px; font-weight: 500; line-height: 1.4; flex-grow: 1; }
.mbmc-pop-count { font-size: 11px; color: var(--mbmc-sub); margin-top: 2px; }
.mbmc-pop .mbmc-btn { margin-top: 8px; width: 100%; }
.mbmc-photo-add { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 14px; background: #fff; border: 1px solid var(--mbmc-line); border-radius: 8px; text-decoration: none; color: var(--mbmc-text) !important; }
.mbmc-photo-add-icon { width: 40px; height: 40px; border-radius: 50%; background: var(--mbmc-pale); color: var(--mbmc-green); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.mbmc-photo-add-text { flex-grow: 1; line-height: 1.5; }
.mbmc-photo-add-text b { display: block; font-size: 14px; font-weight: 500; }
.mbmc-photo-add-text small { display: block; font-size: 12px; color: var(--mbmc-sub); }
.mbmc-delete { margin: 18px 0 0; }

/* 選ぶ画面（下から出るシート） */
.mbmc-sheet { position: fixed; inset: 0; z-index: 1000; }
.mbmc-sheet-backdrop { position: absolute; inset: 0; background: rgba(43,41,37,.5); }
.mbmc-sheet-panel { position: absolute; left: 0; right: 0; bottom: 0; top: 64px; background: #fff; border-radius: 16px 16px 0 0; display: flex; flex-direction: column; padding: 0 16px; }
.mbmc-sheet-handle, .mbmc-sheet-head, .mbmc-sheet-search { flex-shrink: 0; }
.mbmc-sheet-handle { width: 40px; height: 4px; border-radius: 2px; background: #ddd6c8; margin: 8px auto 0; }
.mbmc-sheet-head { display: flex; align-items: center; justify-content: space-between; font-size: 14px; color: var(--mbmc-sub); padding-top: 4px; }
.mbmc-sheet-search { position: relative; }
.mbmc-sheet-search svg { position: absolute; left: 12px; top: 14px; color: var(--mbmc-muted); }
.mbmc-sheet-search input { width: 100%; height: 46px; margin: 0; box-shadow: none; border: 1px solid var(--mbmc-line2); border-radius: 8px; padding: 0 12px 0 40px; font-size: 16px; font-family: inherit; background: #fff; }
.mbmc-genres { display: flex; gap: 6px; overflow-x: auto; padding: 10px 0 8px; flex-shrink: 0; }
.mbmc-genre { flex-shrink: 0; font-size: 13px; border-radius: 999px; padding: 6px 12px; background: #fff; color: #4d453b; border: 1px solid var(--mbmc-line); cursor: pointer; }
.mbmc-genre.is-on { background: var(--mbmc-green); border-color: var(--mbmc-green); color: #fff; }
.mbmc-sheet-list { flex-grow: 1; overflow-y: auto; padding-bottom: calc(20px + env(safe-area-inset-bottom)); -webkit-overflow-scrolling: touch; }
.mbmc-row { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid #efebe3; }
.mbmc-row img { width: 52px; height: 52px; border-radius: 6px; object-fit: cover; flex-shrink: 0; }
.mbmc-row-name { flex-grow: 1; min-width: 0; font-size: 15px; font-weight: 500; line-height: 1.4; }
.mbmc-row .mbmc-btn { min-width: 72px; }
.mbmc-sheet-list > .mbmc-btn { margin-top: 12px; }
.mbmc-none { padding: 24px 0; color: var(--mbmc-sub); font-size: 14px; }

.mbmc-toast { position: fixed; left: 50%; bottom: 140px; transform: translate(-50%, 10px); background: rgba(43,41,37,.92); color: #fff; font-size: 14px; padding: 10px 16px; border-radius: 999px; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 1100; max-width: calc(100% - 32px); }
.mbmc-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* みんなの○○市 */
.mbmc-others { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.mbmc-other { text-decoration: none; color: var(--mbmc-text) !important; }
.mbmc-mini { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; border-radius: 4px; overflow: hidden; background: var(--mbmc-line); }
.mbmc-mini img { aspect-ratio: 1 / 1; width: 100%; object-fit: cover; }
.mbmc-other-name { display: block; margin-top: 6px; font-size: 12px; line-height: 1.4; }

/* 投稿完了 */
.mbmc-done { padding-top: 24px; }
.mbmc-done-head { text-align: center; }
.mbmc-done-kicker { margin: 0; font-size: 14px; font-weight: 700; color: var(--mbmc-green); }
.mbmc-done .mbmc-title { margin-top: 6px; font-size: 26px; }
.mbmc-card-wrap { padding: 24px 24px 8px; }
.mbmc-card { position: relative; background: #fff; border-radius: 10px; padding: 12px; box-shadow: 0 12px 30px rgba(43,41,37,.12); transform: rotate(-2deg); max-width: 360px; margin: 0 auto; }
.mbmc-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.mbmc-card-cell { aspect-ratio: 1 / 1; border-radius: 4px; overflow: hidden; display: block; }
.mbmc-card-cell img { width: 100%; height: 100%; object-fit: cover; }
.mbmc-card-cell.is-empty { border: 1.5px dashed var(--mbmc-line2); }
.mbmc-card-foot { padding: 10px 4px 2px; }
.mbmc-card-name { font-size: 17px; font-weight: 500; }
.mbmc-hanko { position: absolute; right: -10px; bottom: 18px; width: 70px; height: 70px; border-radius: 50%; border: 3px solid var(--mbmc-red); color: var(--mbmc-red); background: rgba(255,255,255,.85); display: flex; align-items: center; justify-content: center; font-size: 24px; font-weight: 700; transform: rotate(-12deg); line-height: 1; }
.mbmc-hanko small { font-size: 13px; }
.mbmc-hanko.is-complete { font-size: 32px; }
.mbmc-box { margin-top: 26px; background: #fff; border: 1px solid var(--mbmc-line); border-radius: 12px; padding: 20px 18px; }
.mbmc-box-title { margin: 0; font-size: 18px; line-height: 1.5; font-weight: 500; }
.mbmc-box-text { margin: 8px 0 16px; font-size: 14px; color: #4d453b; }

/* 共有 */
.mbmc-share { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 12px 0 16px; }
.mbmc-share-btn { white-space: nowrap; display: flex; align-items: center; justify-content: center; min-height: 46px; border-radius: 8px; border: 1px solid var(--mbmc-line); background: #fff; color: var(--mbmc-text) !important; font-size: 12px; text-decoration: none; cursor: pointer; font-family: inherit; }
.mbmc-share-btn:hover { background: var(--mbmc-bg); }

/* 私の○○市 */
.mbmc-view { padding-top: 20px; }
.mbmc-view-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mbmc-avatar { width: 40px; height: 40px; border-radius: 50%; background: #d9a77a; color: #fff; font-size: 18px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.mbmc-count { margin-left: auto; font-size: 12px; font-weight: 700; border: 1px solid var(--mbmc-green); color: var(--mbmc-green); border-radius: 999px; padding: 2px 10px; }
.mbmc-count.is-complete { background: var(--mbmc-green); color: #fff; }
.mbmc-view-title { font-size: 32px; line-height: 1.3; margin-top: 14px; }
.mbmc-quote { margin: 12px 0 0; font-size: 20px; line-height: 1.6; color: #3d342c; }
.mbmc-view-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 20px; }
.mbmc-view-grid.is-big-first .mbmc-tile:first-child { grid-column: span 2; grid-row: span 2; }
.mbmc-view-grid.is-big-first .mbmc-tile:first-child .mbmc-tile-name { font-size: 15px; padding: 28px 10px 8px; }
.mbmc-owner { margin-top: 18px; background: var(--mbmc-pale2); border: 1px solid #dfe7d9; border-radius: 10px; padding: 14px; }
.mbmc-owner-text { margin: 0 0 10px; font-size: 13px; }
.mbmc-owner-actions .mbmc-btn { width: 100%; }
.mbmc-reasons { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.mbmc-reason { display: flex; gap: 12px; background: #fff; border: 1px solid var(--mbmc-line); border-radius: 8px; padding: 12px; }
.mbmc-reason-img { flex-shrink: 0; }
.mbmc-reason-img img { width: 76px; height: 76px; border-radius: 6px; object-fit: cover; }
.mbmc-reason-body { min-width: 0; }
.mbmc-reason-name { font-size: 16px; font-weight: 500; text-decoration: none; color: var(--mbmc-text) !important; }
.mbmc-reason-text { margin: 4px 0 0; font-size: 17px; line-height: 1.55; }
.mbmc-reason-same { margin: 4px 0 0; font-size: 12px; color: var(--mbmc-sub); }
.mbmc-match { margin-top: 20px; display: flex; align-items: center; gap: 12px; border: 1.5px solid var(--mbmc-text); border-radius: 10px; padding: 14px 16px; }
.mbmc-match-num { font-size: 36px; font-weight: 700; line-height: 1; }
.mbmc-match-text { font-size: 14px; }
.mbmc-cta { margin-top: 24px; background: var(--mbmc-hero); border-radius: 12px; padding: 20px 16px; text-align: center; }
.mbmc-cta-text { margin: 0 0 12px; font-size: 18px; font-weight: 500; }

/* まちを選ぶ */
.mbmc-area-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 24px; }
.mbmc-area-link { display: block; background: #fff; border: 1px solid var(--mbmc-line); border-radius: 10px; padding: 14px; font-size: 20px; font-weight: 500; text-decoration: none; color: var(--mbmc-text) !important; }
.mbmc-area-link small { display: block; font-size: 12px; color: var(--mbmc-sub); }

/* PC */
@media (min-width: 960px) {
	.mbmc-sp { display: none; }
	.mbmc-hero { padding: 34px 0 32px; }
	.mbmc-title { font-size: 38px; }
	.mbmc-layout { display: grid; grid-template-columns: 440px minmax(0, 1fr); gap: 56px; align-items: start; padding-top: 12px; }
	.mbmc-col-board { position: sticky; top: 90px; }
	.mbmc-col-main > .mbmc-section:first-child, .mbmc-col-main > .mbmc-section[hidden] + .mbmc-section { margin-top: 20px; }
	.mbmc-actionbar { position: static; background: none; border: none; padding: 20px 0 0; }
	.mbmc-create { padding-bottom: 60px; }
	.mbmc-dock { display: none; }
	.mbmc-popular { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 12px 0 0; padding: 0; overflow: visible; }
	.mbmc-pop { flex: none; }
	.mbmc-pick { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4px 16px; }
	.mbmc-pick-head { grid-column: 1; grid-row: 1; }
	.mbmc-pick-label { grid-column: 2; grid-row: 1 / span 2; margin-top: 0; }
	.mbmc-pick-photo { grid-column: 1; grid-row: 2; }
	.mbmc-sheet-panel { top: 50%; left: 50%; right: auto; bottom: auto; width: 560px; height: min(720px, 86vh); transform: translate(-50%, -50%); border-radius: 14px; }
	.mbmc-sheet-handle { visibility: hidden; }
	.mbmc-toast { bottom: 40px; }
	.mbmc-view-title { font-size: 40px; }
}

/* 確認中の場所 */
.mbmc-pending { display: inline-block; margin-left: 6px; font-size: 11px; font-weight: 500; color: #8a5a2e; background: #faf1e8; border-radius: 3px; padding: 0 6px; vertical-align: middle; }
.mbmc-pick-name .mbmc-pending { display: block; width: fit-content; margin: 2px 0 0; }

/* 写真で追加（入口） */
.mbmc-addspot { display: flex; align-items: center; gap: 12px; width: 100%; margin-top: 12px; padding: 12px; background: var(--mbmc-pale2); border: 1.5px dashed var(--mbmc-green); border-radius: 10px; color: var(--mbmc-text); text-align: left; cursor: pointer; font-family: inherit; }
.mbmc-addspot:hover { background: var(--mbmc-pale); opacity: 1; }
.mbmc-addspot-visual { position: relative; width: 56px; height: 56px; flex-shrink: 0; border-radius: 8px; background: #fff; border: 1px solid #dfe7d9; color: var(--mbmc-green); display: flex; align-items: center; justify-content: center; }
.mbmc-addspot-plus { position: absolute; right: -6px; bottom: -6px; width: 22px; height: 22px; border-radius: 50%; background: var(--mbmc-green); color: #fff; font-size: 16px; line-height: 22px; text-align: center; font-weight: 700; }
.mbmc-addspot-text { flex-grow: 1; min-width: 0; line-height: 1.5; }
.mbmc-addspot-text b { display: block; font-size: 15px; font-weight: 700; color: var(--mbmc-green-dark); }
.mbmc-addspot-text small { display: block; font-size: 12px; color: var(--mbmc-sub); margin-top: 2px; }
.mbmc-addspot-go { flex-shrink: 0; font-size: 13px; font-weight: 700; color: #fff; background: var(--mbmc-green); border-radius: 999px; padding: 6px 12px; }
.mbmc-addspot-small { margin-top: 0; padding: 8px 10px; border-width: 1px; }
.mbmc-addspot-small .mbmc-addspot-visual { width: 40px; height: 40px; }
.mbmc-addspot-small .mbmc-addspot-text b { font-size: 14px; font-weight: 500; }
.mbmc-sheet-foot { flex-shrink: 0; border-top: 1px solid var(--mbmc-line); padding: 10px 0 calc(12px + env(safe-area-inset-bottom)); background: #fff; }
.mbmc-none .mbmc-btn { margin-top: 4px; }

/* 写真で追加（フォーム） */
.mbmc-sheet-body { flex-grow: 1; overflow-y: auto; padding-bottom: 12px; -webkit-overflow-scrolling: touch; }
.mbmc-ns-title { font-size: 16px; font-weight: 700; color: var(--mbmc-text); }
.mbmc-ns-step { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid #efebe3; }
.mbmc-ns-num { width: 24px; height: 24px; flex-shrink: 0; border-radius: 50%; background: var(--mbmc-green); color: #fff; font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-top: 2px; }
.mbmc-ns-main { flex-grow: 1; min-width: 0; }
.mbmc-ns-label { display: block; margin: 0 0 6px; font-size: 14px; font-weight: 500; }
.mbmc-ns-label small { font-weight: 400; color: var(--mbmc-sub); }
.mbmc-ns-main .mbmc-ns-label + .mbmc-input { margin-top: 0; }
.mbmc-ns-main textarea + .mbmc-ns-label, .mbmc-ns-dup + .mbmc-ns-label, .mbmc-input + .mbmc-ns-label { margin-top: 14px; }
.mbmc-req { display: inline-block; font-size: 11px !important; color: #fff !important; background: var(--mbmc-red); border-radius: 3px; padding: 0 5px; margin-left: 4px; }
.mbmc-ns-sub { margin-top: 8px; }
.mbmc-ns-drop { display: block; position: relative; border: 1.5px dashed var(--mbmc-line2); border-radius: 10px; background: #fbfaf7; cursor: pointer; overflow: hidden; }
.mbmc-ns-drop:hover { border-color: var(--mbmc-green); }
.mbmc-ns-drop-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 22px 12px; color: var(--mbmc-green); text-align: center; }
.mbmc-ns-drop-empty b { font-size: 15px; }
.mbmc-ns-drop-empty small { font-size: 12px; color: var(--mbmc-sub); }
.mbmc-ns-drop img { width: 100%; max-height: 260px; object-fit: cover; }
.mbmc-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mbmc-check { display: flex; align-items: center; gap: 8px; margin-top: 10px; font-size: 14px; cursor: pointer; }
.mbmc-check input { width: 20px; height: 20px; margin: 0; padding: 0; accent-color: var(--mbmc-green); }
.mbmc-ns-ai { gap: 8px; }
.mbmc-ns-status { margin: 6px 0 0; font-size: 13px; color: var(--mbmc-sub); min-height: 0; }
.mbmc-ns-status:empty { display: none; }
.mbmc-ns-status.is-busy { color: var(--mbmc-green); }
.mbmc-ns-status.is-ok { color: var(--mbmc-green-dark); }
.mbmc-ns-status.is-ng { color: #a3412a; }
.mbmc-ns-dup { margin-top: 8px; background: #fffaf0; border: 1px solid #f0dfbf; border-radius: 8px; padding: 6px 10px; }
.mbmc-ns-dup-title { margin: 4px 0 0; font-size: 13px; font-weight: 700; color: #8a5a2e; }
.mbmc-ns-dup .mbmc-row:last-child { border-bottom: none; }
.mbmc-ns-dup .mbmc-row img { width: 40px; height: 40px; }
@media (max-width: 479px) {
	.mbmc-addspot:not(.mbmc-addspot-small) .mbmc-addspot-go { display: none; }
	.mbmc-toast { white-space: nowrap; max-width: none; }
}

/* v0.4 D-inspired: photo-first create page. Scoped to create only. */
.mbmc-create{--mbmc-bg:#f5f7fa;--mbmc-hero:#f5f7fa;--mbmc-text:#1c395d;--mbmc-sub:#64768c;--mbmc-line:#dce4ed;--mbmc-line2:#bccbdc;--mbmc-green:#2a578e;--mbmc-green-dark:#20446e;--mbmc-pale:#eaf0f7;--mbmc-pale2:#f4f7fb;font-family:'Yu Gothic','Hiragino Kaku Gothic ProN',Meiryo,sans-serif}
.mbmc-create .mbmc-hero{background:transparent;padding:25px 0 12px}
.mbmc-create .mbmc-title{font-size:clamp(23px,2.7vw,34px);font-weight:750;letter-spacing:.03em}
.mbmc-create .mbmc-lead{font-size:13px;line-height:2;color:#607287}
.mbmc-create .mbmc-lead strong{color:#244c7d}
.mbmc-create .mbmc-layout{max-width:1200px}
.mbmc-create .mbmc-note-eyebrow{font-size:10px;letter-spacing:.09em;color:#6483a2;font-weight:700;margin:0 0 8px}
.mbmc-create .mbmc-board-title{font-size:22px;margin:0;font-weight:750}
.mbmc-create .mbmc-board-intro{font-size:12px;color:#6a7c90;margin:6px 0}
.mbmc-create .mbmc-inline-controls{display:flex;gap:8px;align-items:stretch;margin-top:15px}
.mbmc-create .mbmc-inline-search{flex:1;min-width:0}
.mbmc-create .mbmc-inline-search input{width:100%;min-height:48px;border:1px solid #d5e0ea;background:white;border-radius:6px;font-size:16px;padding:9px 13px;color:#284766}
.mbmc-create .mbmc-inline-search input:focus{outline:2px solid #2a578e;outline-offset:1px}
.mbmc-create .mbmc-inline-add{flex:none;font-size:12px;min-height:48px}
.mbmc-create .mbmc-inline-genres{display:flex;gap:8px;overflow-x:auto;padding:12px 0 8px}
.mbmc-create .mbmc-inline-filter{flex:none;min-height:38px;border-radius:24px;border:1px solid #dae3ed;background:white;padding:6px 13px;color:#385978;font-size:12px;cursor:pointer}
.mbmc-create .mbmc-inline-filter.is-on{background:#294e7c;color:white}
.mbmc-create .mbmc-inline-help{color:#78899c;font-size:12px;margin:3px 0 15px}
.mbmc-create .mbmc-catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:21px 13px}
.mbmc-create .mbmc-catalog-card{display:block;width:100%;text-align:left;padding:0;border:none;background:transparent;color:#1f3b5e;cursor:pointer;min-width:0}
.mbmc-create .mbmc-catalog-photo{display:block;aspect-ratio:1.38;background:#e4e9ef;position:relative;overflow:hidden;border-radius:5px}
.mbmc-create .mbmc-catalog-photo img{width:100%;height:100%;object-fit:cover}
.mbmc-create .mbmc-catalog-mark{position:absolute;top:8px;right:8px;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:white;color:#2a578e;font-size:25px;box-shadow:0 1px 8px #102c4430}
.mbmc-create .mbmc-catalog-card.is-selected .mbmc-catalog-photo{outline:3px solid #2a578e;outline-offset:-3px}
.mbmc-create .mbmc-catalog-card.is-selected .mbmc-catalog-mark{background:#2a578e;color:white;font-size:18px}
.mbmc-create .mbmc-catalog-name{display:block;font-size:13px;font-weight:700;line-height:1.5;margin-top:6px;overflow-wrap:anywhere}
.mbmc-create .mbmc-catalog-none{grid-column:1/-1;padding:22px;border:1px dashed #aebccd;border-radius:6px;color:#617a95}
.mbmc-create .mbmc-catalog-more{width:100%;margin-top:22px}
.mbmc-create .mbmc-legacy-search{display:none!important}
.mbmc-create .mbmc-col-board{background:white;border:1px solid #e1e7ed;border-radius:8px;padding:22px;box-shadow:0 8px 30px #1d42610a}
.mbmc-create .mbmc-tile.is-empty{background:#f2f6fa;border-color:#cbd9e8}
.mbmc-create .mbmc-tile.is-filled .mbmc-tile-name{font-size:10px}
.mbmc-create .mbmc-addspot{margin-top:26px}
.mbmc-create .mbmc-personalize{background:#fff;border:1px solid #dfe8f0;border-radius:8px;padding:15px 18px;margin-top:22px}
.mbmc-create .mbmc-personalize summary{cursor:pointer;font-weight:700;color:#294e7c;min-height:44px;padding:8px 0}
.mbmc-create .mbmc-selected-details{background:#fff;padding:18px;border:1px solid #e2e8ee;border-radius:7px}
.mbmc-create .mbmc-actionbar-note{text-align:center}
.mbmc-create .mbmc-others{gap:15px}
.mbmc-create .mbmc-other{background:white}
@media (min-width:960px){
.mbmc-create .mbmc-layout{grid-template-columns:minmax(0,1fr) 300px;gap:30px;padding-top:12px}
.mbmc-create .mbmc-col-main{grid-column:1;grid-row:1}
.mbmc-create .mbmc-col-board{grid-column:2;grid-row:1;position:sticky;top:30px}
.mbmc-create .mbmc-col-main>.mbmc-section:first-child,.mbmc-create .mbmc-col-main>.mbmc-section[hidden]+.mbmc-section{margin-top:0}
.mbmc-create .mbmc-actionbar{margin-top:16px}
}
@media (max-width:959px){
.mbmc-create .mbmc-col-board{margin-top:10px;margin-bottom:18px}
.mbmc-create .mbmc-layout{display:flex;flex-direction:column;gap:0}
.mbmc-create .mbmc-col-main{order:1;width:100%}
.mbmc-create .mbmc-col-board{order:0;width:100%}
.mbmc-create .mbmc-grid{grid-template-columns:repeat(9,minmax(0,1fr));gap:4px}
.mbmc-create .mbmc-tile{aspect-ratio:1}
.mbmc-create .mbmc-catalog{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
.mbmc-create .mbmc-hero{padding:18px 0 0}
.mbmc-create .mbmc-title{font-size:25px}
.mbmc-create .mbmc-col-board{padding:14px}
.mbmc-create .mbmc-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.mbmc-create .mbmc-inline-add{padding:0 10px;font-size:11px}
.mbmc-create .mbmc-catalog{gap:17px 10px}
.mbmc-create .mbmc-catalog-photo{aspect-ratio:1.12}
.mbmc-create .mbmc-catalog-name{font-size:12px}
.mbmc-create .mbmc-inline-filter{font-size:11px}
}
.mbmc-create .mbmc-section-head{display:block;margin-bottom:6px}
.mbmc-create .mbmc-section-head .mbmc-h2{font-size:22px;font-weight:750;margin-top:4px}
@media(max-width:959px){.mbmc-create .mbmc-col-board .mbmc-board-intro{margin-bottom:5px}.mbmc-create .mbmc-col-board .mbmc-actionbar{display:none}}

/* GPT-preview baseline: edit-only controls and bottom spacing */
.mbmc-create .mbmc-edit-danger { clear: both; margin: 20px 0 0; padding: 15px 18px 0; border-top: 1px solid #dfe8f0; }
.mbmc-create .mbmc-edit-danger-note { margin: 0 0 6px; font-size: 12px; color: #657991; }
.mbmc-create .mbmc-edit-danger .mbmc-link-danger { padding: 8px 0; min-height: 40px; }
.mbmc-create .mbmc-col-main > :last-child { margin-bottom: 0; }
.mbmc-create .mbmc-layout { margin-bottom: 0; }
@media (min-width: 960px) {
  .mbmc.mbmc-create { padding-bottom: 16px; }
}
@media (max-width: 959px) {
  .mbmc.mbmc-create { padding-bottom: 12px; }
  .mbmc-create .mbmc-edit-danger { padding: 14px 6px 0; }
}

/* v0.4.3: 地域への導線・編集ページ下部の間隔 */
.mbmc-create .mbmc-area-chip-link { text-decoration: none; color: #244c7d; cursor: pointer; transition: border-color .15s, background-color .15s; }
.mbmc-create .mbmc-area-chip-link:hover { background: #f4f7fb; border-color: #8daeca; color: #20446e; }
.mbmc-create .mbmc-area-chip-link:focus-visible { outline: 2px solid #2a578e; outline-offset: 3px; }
/* v0.4.4: v0.4.3の過剰な下余白削除を撤回。v0.4.2の間隔を維持。 */

/* v0.4.5 - mycityページのみ: 画面が短い場合にフッターの下へ白い空間が残らないようにする。
   「ひとこと」枠とフッターの間の余白には触れない。 */
body.mbmc-page { margin-bottom: 0; padding-bottom: 0; }
body.mbmc-page #page.site { min-height: 100vh; display: flex; flex-direction: column; }
body.mbmc-page #page.site > main#mbmc-create { flex: 1 0 auto; }
body.mbmc-page #page.site > footer#colophon { flex-shrink: 0; }

/* v0.4.6: 写真カードの選択SVGを円の正確な中央へ */
.mbmc-create .mbmc-catalog-mark{display:flex;align-items:center;justify-content:center;line-height:1;padding:0}
.mbmc-create .mbmc-catalog-mark svg{display:block;flex:none;width:22px;height:22px}

/* v0.4.7: create-page only — gentle introduction and photo-note cards. */
.mbmc-create .mbmc-hero {
  background: #eef3f8;
  border-bottom: 1px solid #dce5ef;
  padding: 32px 0 31px;
  margin-bottom: 17px;
}
.mbmc-create .mbmc-hero-inner { max-width: 1200px; }
.mbmc-create .mbmc-hero .mbmc-title { margin-top: 14px; }
.mbmc-create .mbmc-hero .mbmc-lead { margin-top: 10px; }
.mbmc-create .mbmc-community { padding-top: 25px; padding-bottom: 12px; max-width: 1200px; }
.mbmc-create .mbmc-community-heading { margin-bottom: 18px; }
.mbmc-create .mbmc-community-eyebrow { margin: 0 0 5px; font-size: 12px; letter-spacing: .06em; font-weight: 700; color: #607a98; }
.mbmc-create .mbmc-community-heading .mbmc-h2 { font-size: 22px; font-weight: 750; line-height: 1.5; margin: 0; color: #24476f; }
.mbmc-create .mbmc-community-description { font-size: 13px; color: #657a91; margin: 6px 0 0; }
.mbmc-create .mbmc-community .mbmc-others { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.mbmc-create .mbmc-community-card { display: block; min-width: 0; padding: 12px; border: 1px solid #dce5ee; border-radius: 10px; background: #fff; box-shadow: 0 5px 22px rgba(28,57,93,.05); text-decoration: none; transition: box-shadow .15s, transform .15s; }
.mbmc-create .mbmc-community-card:hover { transform: translateY(-2px); box-shadow: 0 10px 27px rgba(28,57,93,.11); }
.mbmc-create .mbmc-community-card:focus-visible { outline: 2px solid #2a578e; outline-offset: 2px; }
.mbmc-create .mbmc-community-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 3px; overflow: hidden; background: #e5edf4; border-radius: 5px; }
.mbmc-create .mbmc-community-grid img, .mbmc-create .mbmc-community-empty { display: block; width: 100%; aspect-ratio: 1/1; height: auto; object-fit: cover; min-width: 0; }
.mbmc-create .mbmc-community-empty { background: #f0f4f8; }
.mbmc-create .mbmc-community-card-footer { display:flex; align-items: center; gap: 8px; justify-content: space-between; margin-top: 10px; }
.mbmc-create .mbmc-community-card-footer .mbmc-other-name { margin:0; font-size: 13px; font-weight:700; color: #26486f; }
.mbmc-create .mbmc-community-count { white-space: nowrap; font-size: 12px; color: #6d8197; }
@media (max-width: 959px) {
  .mbmc-create .mbmc-community .mbmc-others { display: flex; overflow-x: auto; gap: 12px; scroll-snap-type: x proximity; padding: 3px 4px 14px; }
  .mbmc-create .mbmc-community-card { flex: 0 0 min(72vw, 270px); scroll-snap-align: start; }
}
@media (max-width: 600px) {
  .mbmc-create .mbmc-hero { padding: 23px 0 25px; margin-bottom: 13px; }
  .mbmc-create .mbmc-community-heading .mbmc-h2 { font-size: 19px; }
  .mbmc-create .mbmc-community { padding-top: 20px; }
}

/* v0.5.3: スマホの投稿ページのみ、フッター直前の薄い余白を解消。
   投稿ボタン内側の余白、マイページ、PCのレイアウトには影響させない。 */
@media (max-width: 600px) {
  body.mbmc-page main#mbmc-create.mbmc-create,
  body.mbmc-page .mbmc.mbmc-create {
    padding-bottom: 0;
    margin-bottom: 0;
  }
  body.mbmc-page .mbmc-create .mbmc-layout {
    margin-bottom: 0;
  }
}
