/* みんマド（一覧・1つの質問のページ・診断画面の「みんなにも聞く」）。色は brand.css と同じ：緑1色＋オレンジは小さな印だけ */

/* ===== 一覧 ===== */
.mm-hero h1 { margin: 0; font-size: clamp(24px, 6.6vw, 30px); }
.mm-list { display: grid; gap: 12px; }
.mm-card { display: flex; gap: 14px; align-items: center; padding: 14px; background: var(--surface, #FFFFFF); border: 1px solid var(--line, #E7E5E0); border-radius: var(--radius, 14px); color: var(--text, #2B2F33); text-decoration: none; }
.mm-card:hover { border-color: #BFE0D9; }
.mm-thumb { flex: none; width: 76px; height: 76px; border-radius: 10px; overflow: hidden; background: #F3F2EE; }
.mm-thumb img { width: 100%; height: 100%; object-fit: cover; filter: blur(3px); transform: scale(1.08); }
.mm-card-body { min-width: 0; display: grid; gap: 4px; }
.mm-card-body b { font-size: 15px; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mm-card-body small { font-size: 12px; color: var(--muted, #6B6F76); }
.mm-date { font-size: 11px !important; }

/* 投稿した直後の「あなたの質問」 */
.mm-mine { box-shadow: none; }
.mm-mine.is-just { border-color: #BFE0D9; box-shadow: var(--shadow, none); }
#mmMine { display: grid; gap: 12px; }
#mmMine[hidden], .mm-cta[hidden] { display: none; }
.mm-mine-q { font-size: 17px; font-weight: 900; line-height: 1.55; color: var(--text, #2B2F33); text-decoration: none; white-space: pre-wrap; }
.mm-mine-btns { display: grid; gap: 8px; margin-top: 4px; }
.mm-mine-btns .btn { text-decoration: none; }
.mm-list-h { margin: 8px 0 0; font-size: 17px; font-weight: 900; }

/* ===== 1つの質問 ===== */
.mm-asked { margin: 0; display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; color: var(--main, #1F7F73); }
.mm-asked::before { content: ''; width: 18px; height: 2px; background: #E07B39; }
.mm-asked span { margin-left: auto; font-weight: 400; color: var(--muted, #6B6F76); }
.mm-q { margin: 0; font-size: clamp(19px, 5.2vw, 23px); line-height: 1.6; white-space: pre-wrap; word-break: normal; overflow-wrap: anywhere; }
.mm-choices { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.mm-choices span { font-size: 13px; font-weight: 700; color: var(--main, #1F7F73); background: var(--main-soft, #E6F4F1); border-radius: 99px; padding: 4px 12px; }
.mm-choices i { font-style: normal; color: var(--muted, #6B6F76); font-size: 12px; }
.mm-plan { position: relative; border-radius: 12px; overflow: hidden; background: #F3F2EE; border: 1px solid var(--line, #E7E5E0); }
.mm-plan-img { display: block; width: 100%; height: auto; min-height: 160px; object-fit: contain; background: #fff; }
.mm-plan-img.is-blur { filter: blur(10px); transform: scale(1.04); max-height: 340px; object-fit: cover; }
.mm-gate { position: absolute; inset: 0; display: grid; place-content: center; gap: 12px; padding: 20px; text-align: center; background: rgba(255, 255, 255, .55); }
.mm-gate[hidden] { display: none; }
.mm-gate b { font-size: 15px; }
.mm-gate small { font-size: 12px; color: var(--muted, #6B6F76); }
.mm-plan[hidden] { display: none; }
.mm-gate .btn { width: auto; margin: 0 auto; }
.mm-ai { border-left: 3px solid var(--main-soft, #E6F4F1); padding: 2px 0 2px 14px; display: grid; gap: 4px; }
.mm-ai p { margin: 0; }
.mm-ai-label { font-size: 12px; font-weight: 700; color: var(--main, #1F7F73); }
.mm-ai-label span { font-weight: 400; color: var(--muted, #6B6F76); }
.mm-ai-type { font-size: 17px; font-weight: 900; line-height: 1.5; }
.mm-ai-score { margin-left: 8px; font-size: 13px; font-weight: 700; color: var(--muted, #6B6F76); }
.mm-ai-catch { font-size: 14px; color: var(--muted, #6B6F76); }
.mm-ai-weak { font-size: 14px; }
.mm-ai-weak b { display: block; font-size: 12px; color: var(--accent-text, #B4561B); }
.mm-own-st { margin: 0; display: flex; align-items: center; gap: 8px; font-weight: 700; }
.mm-switch { display: flex; gap: 8px; align-items: center; font-size: 14px; }
.mm-edit summary { cursor: pointer; font-size: 14px; color: var(--main, #1F7F73); }
.mm-edit textarea, .mm-edit-ch input { width: 100%; margin-top: 8px; font: inherit; padding: 10px; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; }
.mm-edit-ch { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mm-edit .btn { margin-top: 8px; }
.mm-link { background: none; border: 0; padding: 0; font: inherit; font-size: 13px; color: var(--muted, #6B6F76); text-decoration: underline; cursor: pointer; justify-self: start; }
.mm-own-err { color: var(--error, #D9534F); margin: 0; }

/* ===== 診断画面の「みんなにも聞く」（待ち時間のカード・結果画面） ===== */
.pre-consult.mm-in-result { border: 0; padding: 0; margin: 0; }
.mm-f textarea { width: 100%; font: inherit; font-size: 16px; padding: 10px 12px; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; resize: vertical; }
.mm-ex { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.mm-ex button { font: inherit; font-size: 12px; padding: 5px 10px; border-radius: 99px; border: 1px solid #CDE8E2; background: #fff; color: #1F7F73; cursor: pointer; }
.mm-two { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.mm-two[hidden], .mm-crop-btns [hidden] { display: none; }
.mm-two input { flex: 1; min-width: 0; font: inherit; font-size: 16px; padding: 8px 10px; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; }
.mm-crop-h { margin: 0 0 8px; font-weight: 700; font-size: 14px; }
.mm-crop-h small { display: block; font-weight: 400; font-size: 12px; color: #6B6F76; }
.mm-crop { position: relative; width: fit-content; max-width: 100%; margin: 0 auto; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; overflow: hidden; background: #fff; user-select: none; -webkit-user-select: none; }
.mm-crop img { display: block; width: auto; height: auto; max-width: 100%; max-height: 60vh; pointer-events: none; } /* 枠と図面をぴったり同じ大きさにする（囲んだ位置がずれないように）。縦長の図面は画面の6割の高さまで */
.mm-crop.is-on { touch-action: none; cursor: crosshair; outline: 2px solid #1F7F73; outline-offset: -2px; }
.mm-crop-rect { position: absolute; border: 2px solid #1F7F73; border-radius: 4px; box-shadow: 0 0 0 9999px rgba(43, 47, 51, 0); pointer-events: none; display: none; }
.mm-crop.has-rect .mm-crop-rect { display: block; box-shadow: 0 0 0 9999px rgba(43, 47, 51, .45); }
.mm-crop-btns { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.mm-crop-btns .pc-skip { margin: 0; }
.mm-done { display: grid; gap: 8px; }
.mm-done p { margin: 0; }
.pre-consult .mm-crop-btns .btn { width: auto; }
.mm-crop-btns { justify-content: center; }
.mm-crop-btns .pc-skip { white-space: nowrap; width: auto; }

/* ===== 回答・返信・投票 ===== */
.mm-ans-n { margin-left: 8px; font-size: 14px; font-weight: 700; color: var(--muted, #6B6F76); }
#mmAnsBody { display: grid; gap: 14px; }
.mm-vote { display: grid; gap: 8px; }
.mm-vote[hidden] { display: none; }
.mm-vote-h { margin: 0; font-size: 13px; font-weight: 700; }
.mm-vote-h span { margin-left: 6px; font-weight: 400; color: var(--muted, #6B6F76); }
.mm-vote-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mm-vote-btns button { font: inherit; font-weight: 700; font-size: 15px; padding: 12px; border-radius: 12px; border: 1.5px solid var(--main, #1F7F73); background: #fff; color: var(--main, #1F7F73); cursor: pointer; }
.mm-bar { position: relative; overflow: hidden; display: flex; justify-content: space-between; gap: 8px; padding: 10px 12px; border-radius: 10px; background: #F3F2EE; font-size: 13px; }
.mm-bar > * { position: relative; }
.mm-bar-fill { position: absolute !important; left: 0; top: 0; bottom: 0; background: var(--main-soft, #E6F4F1); }
.mm-bar.is-mine { box-shadow: inset 0 0 0 1.5px var(--main, #1F7F73); }
.mm-bar span:last-child { color: var(--muted, #6B6F76); white-space: nowrap; }
.mm-thread { display: grid; gap: 8px; padding-bottom: 14px; border-bottom: 1px solid var(--line, #E7E5E0); }
.mm-a { display: grid; gap: 6px; }
.mm-a.is-reply { margin-left: 18px; padding-left: 12px; border-left: 2px solid var(--main-soft, #E6F4F1); }
.mm-a-head { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.mm-a-name { font-size: 14px; }
.mm-badge { font-size: 11px; font-weight: 700; color: var(--main, #1F7F73); background: var(--main-soft, #E6F4F1); border-radius: 99px; padding: 2px 8px; }
.mm-badge.op { color: var(--accent-text, #B4561B); background: var(--accent-soft, #FDF1E7); }
.mm-badge.owner { color: #4A4F55; background: #EEF0F2; }
.mm-a-time { margin-left: auto; font-size: 11px; color: var(--muted, #6B6F76); }
.mm-a-kind { justify-self: start; font-size: 12px; font-weight: 700; color: var(--accent-text, #B4561B); }
.mm-a-text { margin: 0; font-size: 15px; line-height: 1.75; white-space: pre-wrap; overflow-wrap: anywhere; }
.mm-a-acts { margin: 0; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.mm-a-acts button { background: none; border: 0; padding: 0; font: inherit; font-size: 12px; color: var(--muted, #6B6F76); cursor: pointer; }
.mm-a-acts button[aria-pressed="true"] { color: var(--main, #1F7F73); font-weight: 700; }
.mm-a-rep { font-size: 11px; color: var(--error, #D9534F); font-weight: 700; }
.mm-reply-box { margin-left: 18px; display: grid; gap: 8px; }
.mm-reply-box[hidden] { display: none; }
.mm-reply-box textarea, .mm-compose textarea { width: 100%; font: inherit; font-size: 16px; padding: 10px 12px; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; resize: vertical; }
.mm-compose, .mm-prof { display: grid; gap: 10px; padding-top: 4px; }
.mm-c-h { margin: 0; font-weight: 900; font-size: 15px; }
.mm-prof-edit, .mm-prof-cancel { margin-left: 6px; padding: 2px 10px; border: 1px solid var(--line, #D9DCD6); border-radius: 999px; background: #fff; color: var(--sub, #5C6166); font-size: 12px; font-weight: 700; cursor: pointer; vertical-align: 1px; }
.mm-prof-cancel { margin-left: 0; justify-self: start; }
.mm-c-err { margin: 0; color: var(--error, #D9534F); }
.mm-c-err[hidden] { display: none; }
.mm-kinds { display: flex; flex-wrap: wrap; gap: 6px; }
.mm-kinds button { font: inherit; font-size: 13px; padding: 6px 12px; border-radius: 99px; border: 1px solid #CDE8E2; background: #fff; color: var(--main, #1F7F73); cursor: pointer; }
.mm-kinds button[aria-pressed="true"] { background: var(--main, #1F7F73); color: #fff; border-color: var(--main, #1F7F73); }
.mm-roles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mm-roles label { display: flex; align-items: center; gap: 6px; padding: 10px; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; font-size: 14px; cursor: pointer; }
.mm-year, .mm-nick { display: grid; gap: 6px; font-size: 13px; font-weight: 700; }
.mm-year[hidden] { display: none; }
.mm-year select, .mm-nick input { font: inherit; font-size: 16px; padding: 8px 10px; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; }

/* ===== 認定プロ・面談のお誘い ===== */
.mm-badge.pro { color: #fff; background: var(--main, #1F7F73); }
.mm-a-org { font-size: 12px; color: var(--muted, #6B6F76); }
.mm-a-note { margin: -2px 0 0; font-size: 11.5px; color: var(--muted, #6B6F76); }
.mm-inv-pro { display: grid; gap: 8px; padding: 14px; border: 1px dashed #BFE0D9; border-radius: 12px; }
.mm-inv-pro textarea { width: 100%; font: inherit; font-size: 16px; padding: 8px 10px; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; }
.mm-inv-done { margin: 0; color: var(--main, #1F7F73); font-weight: 700; }
#mmInvites { display: grid; gap: 12px; }
.mm-inv { border-color: #BFE0D9; }

/* ===== 待ち時間の投票カード ===== */
.mm-wait-img { display: block; width: 100%; max-height: 42vh; object-fit: contain; background: #fff; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; }
.mm-wait-res { display: grid; gap: 6px; }

/* ===== プロとして参加する ===== */
.mm-pro-list { margin: 0; padding-left: 1.2em; display: grid; gap: 6px; font-size: 14.5px; line-height: 1.7; }
.mm-pro-hint { margin: 0; color: var(--muted, #6B6F76); }

/* ===== 一覧（掲示板とSNSの間くらい） ===== */
.mm-tabs { display: flex; gap: 6px; overflow-x: auto; }
.mm-tabs a { flex: none; font-size: 13px; font-weight: 700; padding: 7px 14px; border-radius: 99px; border: 1px solid var(--line, #E7E5E0); background: #fff; color: var(--text, #2B2F33); text-decoration: none; }
.mm-tabs a[aria-current] { background: var(--main, #1F7F73); border-color: var(--main, #1F7F73); color: #fff; }
.mm-feed { display: grid; gap: 14px; }
.mm-post-card { display: grid; gap: 10px; padding: 16px 18px; background: #fff; border: 1px solid var(--line, #E7E5E0); border-radius: 16px; color: var(--text, #2B2F33); text-decoration: none; }
.mm-post-card:hover { border-color: #BFE0D9; }
.mm-pc-head { display: flex; align-items: center; gap: 10px; }
.mm-avatar { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--main-soft, #E6F4F1); color: var(--main, #1F7F73); font-weight: 900; }
.mm-av-1 { background: #FDF0E4; color: #B5651D; }
.mm-av-2 { background: #EEF0FB; color: #4B5BA8; }
.mm-av-3 { background: #FBEDF1; color: #B04A68; }
.mm-av-4 { background: #F1F6E6; color: #5C7A23; }
.mm-av-5 { background: #F4EFE6; color: #7A6236; }
.mm-pc-who { display: grid; font-size: 13px; font-weight: 700; line-height: 1.3; }
.mm-pc-who small { font-weight: 400; font-size: 11.5px; color: var(--muted, #6B6F76); }
.mm-chip { margin-left: auto; flex: none; font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 99px; }
.mm-chip.open { color: var(--accent-text, #B4561B); background: var(--accent-soft, #FDF1E7); }
.mm-chip.pro { color: #fff; background: var(--main, #1F7F73); }
.mm-pc-q { font-size: 16.5px; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mm-pc-two { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.mm-pc-two span { font-size: 12.5px; font-weight: 700; color: var(--main, #1F7F73); border: 1px solid #CDE8E2; border-radius: 99px; padding: 3px 12px; }
.mm-pc-two i { font-style: normal; font-size: 11px; color: var(--muted, #6B6F76); }
.mm-pc-img { display: block; height: 150px; border-radius: 12px; overflow: hidden; background: #F3F2EE; }
.mm-pc-img img { width: 100%; height: 100%; object-fit: cover; filter: blur(4px); transform: scale(1.06); }
.mm-pc-ai { font-size: 12.5px; color: var(--muted, #6B6F76); }
.mm-pc-foot { display: flex; align-items: center; gap: 14px; font-size: 12.5px; color: var(--muted, #6B6F76); border-top: 1px solid var(--line, #E7E5E0); padding-top: 10px; }
.mm-pc-foot b { color: var(--text, #2B2F33); }
.mm-pc-go { margin-left: auto; color: var(--main, #1F7F73); font-weight: 700; }

/* スレッズの @ID（本人が選んだときだけ） */
.mm-a-th { font-size: 12px; color: var(--muted, #6B6F76); text-decoration: none; }
.mm-a-th:hover { text-decoration: underline; }
.mm-th-opt { display: flex; gap: 8px; align-items: center; font-size: 13px; }

/* ===== 募集の期限・締め切り ===== */
.mm-recruit { display: grid; gap: 8px; padding: 12px; border-radius: 10px; background: var(--main-soft, #E6F4F1); }
.mm-recruit p { margin: 0; }
.mm-recruit-st { font-size: 14px; }
.mm-recruit-dl { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.mm-recruit-dl select { font: inherit; font-size: 14px; padding: 6px 8px; border: 1px solid var(--line, #E7E5E0); border-radius: 8px; background: #fff; }
.mm-closed { margin: 0; padding: 10px 12px; border-radius: 10px; background: #F3F2EE; color: var(--muted, #6B6F76); }
.mm-chip.done { color: #4A4F55; background: #EEF0F2; }
.mm-days { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 700; }
.mm-days select { font: inherit; font-weight: 400; font-size: 15px; padding: 6px 8px; border: 1px solid var(--line, #E7E5E0); border-radius: 8px; background: #fff; }

/* 1タップで答えるカード（assets/minmado-vote.js。待ち時間・結果画面・質問のページ。2026-10-14） */
.mm-vote-btns.is-rx { grid-template-columns: repeat(2, 1fr); } /* 反応は4つ（いいね・アリだと思う・ちょっと気になる・うちも同じ）を2×2で */
.mm-vote-btns.is-rx button { font-size: 14px; padding: 11px 6px; line-height: 1.35; }
.mm-vote-btns button[aria-pressed="true"] { background: var(--main, #1F7F73); color: #fff; }
.mm-vote-q { margin: 4px 0 0; font-size: 13px; font-weight: 700; color: var(--muted, #6B6F76); }
.mm-near { display: inline-block; margin: 0; padding: 2px 8px; border-radius: 999px; background: #FFF4E5; color: #9A5B00; font-size: 12px; font-weight: 700; }
.mm-more { display: inline-block; font-size: 13px; font-weight: 700; color: var(--main, #1F7F73); text-decoration: none; }
.mm-more:hover { text-decoration: underline; }
.mm-res-done { margin: 0; font-size: 14px; }

/* プロのプロフィールページ（2026-10-16） */
.mm-pro-head { display: flex; gap: 12px; align-items: center; }
.mm-pro-head .mm-avatar { width: 52px; height: 52px; font-size: 22px; }
.mm-pro-name { font-size: 20px; margin: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mm-pro-org { margin: 2px 0 0; font-weight: 700; font-size: 14px; }
.mm-pro-svc { background: var(--main-soft, #E6F4F1); border-radius: 12px; padding: 12px 14px; font-size: 14px; }
.mm-pro-links { display: flex; flex-wrap: wrap; gap: 8px; }
.mm-pro-links .btn { width: auto; }
.mm-pro-qs { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.mm-pro-qs li { display: grid; gap: 2px; border-bottom: 1px solid var(--line, #E5E3DE); padding-bottom: 10px; }
.mm-pro-qs li:last-child { border-bottom: 0; padding-bottom: 0; }
.mm-pro-qs a { font-weight: 700; text-decoration: none; color: var(--text, #222); overflow-wrap: anywhere; }
a.mm-a-name { color: inherit; text-decoration: underline; text-decoration-color: var(--line, #ccc); text-underline-offset: 3px; }

/* =====================================================================
   デザインの見直し（2026-10-16）：みんマドの一覧・質問のページ・プロのページ（body.mm-page）
   ・箱を並べず、左にアイコンの列（会話のタイムライン）。区切りは細い線だけ
   ・図面は方眼紙の上に置く（このページのいちばんの見せ場）
   ・AIの見立ては小さな付箋。主役は人の回答
   ・下に固定の「ひとこと書く」
   診断画面（index.html）の部品には効かないよう、ここから下は .mm-page の中だけ
   ===================================================================== */
.mm-page { --mm-hair: #E9E7E2; --mm-faint: #9AA0A6; --mm-paper: #FCFDFC; --mm-grid: rgba(31, 127, 115, .08); font-feature-settings: "palt"; }
.mm-page .page.stack { padding-top: 0; }
.mm-page :where(.page.stack) > * + * { margin-top: 0; } /* 区切りは線で。すき間は部品ごとに決める */
.mm-page .mm-cta.card { margin-top: 22px; }
.mm-page #mmOwner:not([hidden]), .mm-page #mmInvites { margin-bottom: 12px; }
.mm-ic { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* 一覧の頭 */
.mm-page .mm-hero { padding: 22px 0 4px; }
.mm-page .mm-hero h1 { margin: 0; font-size: 22px; font-weight: 900; line-height: 1.4; }
.mm-page .mm-hero p { margin: 4px 0 0; font-size: 13px; line-height: 1.7; color: var(--muted); }
.mm-askbar { margin: 14px 0 4px; display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 14px; background: #fff; border: 1px solid var(--mm-hair); border-radius: 999px; color: var(--muted); font-size: 13.5px; text-decoration: none; }
.mm-askbar span { min-width: 0; flex: 1; }
.mm-askbar b { flex: none; padding: 7px 14px; border-radius: 999px; background: var(--main); color: #fff; font-size: 13px; }
.mm-askbar[hidden] { display: none; }

/* 並べ方：下線のタブ。スクロールしても上に残る */
.mm-page .mm-tabs { position: sticky; top: 0; z-index: 4; margin: 10px calc(-1 * var(--gutter)) 0; padding: 0 var(--gutter); gap: 22px; background: var(--bg); border-bottom: 1px solid var(--mm-hair); overflow-x: auto; }
.mm-page .mm-tabs a { padding: 12px 0 10px; border: 0; border-bottom: 2.5px solid transparent; border-radius: 0; background: none; font-size: 14px; color: var(--muted); }
.mm-page .mm-tabs a[aria-current] { background: none; color: var(--text); border-bottom-color: var(--text); }
.mm-page .mm-tabs a span { margin-left: 4px; font-size: 11px; color: var(--accent-text); }

/* フィード */
.mm-page .mm-feed { display: block; margin: 0 calc(-1 * var(--gutter)); }
.mm-row { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 0 12px; padding: 18px var(--gutter) 16px; background: #fff; border-bottom: 1px solid var(--mm-hair); color: var(--text); text-decoration: none; }
.mm-row:hover { background: #FDFDFB; }
.mm-row:focus-visible { outline: 3px solid rgba(31, 127, 115, .3); outline-offset: -3px; }
.mm-page .mm-avatar { width: 38px; height: 38px; font-size: 15px; }
.mm-page .mm-avatar.is-sm { width: 30px; height: 30px; font-size: 12px; }
.mm-row-body { min-width: 0; display: grid; }
.mm-row-who { display: flex; align-items: baseline; gap: 8px; font-size: 14px; line-height: 1.35; }
.mm-row-who time { font-size: 12px; color: var(--mm-faint); }
.mm-st { margin-left: auto; flex: none; display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; color: var(--accent-text); }
.mm-st::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.mm-st.done { color: var(--mm-faint); }
.mm-st.done::before { background: var(--mm-faint); }
.mm-row-q { margin-top: 6px; font-size: 16.5px; font-weight: 700; line-height: 1.65; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.mm-row-two { margin-top: 10px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.mm-row-two span { padding: 8px 10px; border-radius: 10px; background: var(--bg); border: 1px solid var(--mm-hair); font-size: 13px; font-weight: 700; text-align: center; line-height: 1.4; }
.mm-row-two i { font-style: normal; font-size: 11px; font-weight: 700; color: var(--mm-faint); }
.mm-row-ai { margin-top: 10px; display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); min-width: 0; }
.mm-row-ai b { flex: none; font-size: 10.5px; font-weight: 900; color: var(--main); border: 1px solid #BFE0D9; border-radius: 4px; padding: 0 5px; line-height: 1.6; }
.mm-row-meta { margin-top: 12px; display: flex; align-items: center; gap: 18px; font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.mm-row-meta > span { display: inline-flex; align-items: center; gap: 5px; }
.mm-row-pro { margin-left: auto; font-size: 11.5px; font-weight: 700; color: var(--main); background: var(--main-soft); border-radius: 999px; padding: 2px 10px; }
.mm-empty { margin: 0; padding: 28px var(--gutter); background: #fff; border-bottom: 1px solid var(--mm-hair); font-size: 14px; color: var(--muted); }
.mm-pro-join { margin: 18px 0 0; text-align: center; font-size: 13px; color: var(--muted); }
.mm-page .mm-list-h { margin: 18px 0 8px; font-size: 15px; }
.mm-page #mmMine { gap: 10px; margin-top: 8px; }

/* 図面：方眼紙の上に置く */
.mm-paper { position: relative; display: block; overflow: hidden; border-radius: 12px; border: 1px solid #DCE9E5; background-color: var(--mm-paper);
  background-image: linear-gradient(var(--mm-grid) 1px, transparent 1px), linear-gradient(90deg, var(--mm-grid) 1px, transparent 1px); background-size: 14px 14px; }
.mm-paper.is-thumb { margin-top: 12px; aspect-ratio: 4 / 3; }
.mm-paper.is-thumb img { position: absolute; inset: 9%; width: 82%; height: 82%; object-fit: contain; filter: blur(4px); opacity: .9; }
.mm-lock { position: absolute; left: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px 4px 8px; border-radius: 999px; background: rgba(255, 255, 255, .94); font-size: 11.5px; font-weight: 700; color: var(--muted); }
.mm-lock .mm-ic { width: 13px; height: 13px; }

/* 1つの質問 */
.mm-back { display: inline-flex; align-items: center; gap: 2px; padding: 16px 0 10px; font-size: 13px; color: var(--muted); text-decoration: none; }
.mm-back .mm-ic { width: 16px; height: 16px; }
.mm-page .mm-post { margin: 0 calc(-1 * var(--gutter)); padding: 16px var(--gutter) 20px; background: #fff; border-top: 1px solid var(--mm-hair); border-bottom: 1px solid var(--mm-hair); display: grid; gap: 14px; }
.mm-d-who { display: flex; align-items: center; gap: 10px; }
.mm-d-who > span:nth-child(2) { display: grid; line-height: 1.35; min-width: 0; }
.mm-d-who b { font-size: 14px; }
.mm-d-who small { font-size: 12px; color: var(--mm-faint); }
.mm-page .mm-q { font-size: 21px; font-weight: 900; line-height: 1.6; letter-spacing: .01em; }
.mm-page .mm-choices[hidden] { display: none; }
.mm-page .mm-plan { border-radius: 12px; border: 1px solid #DCE9E5; }
.mm-page .mm-plan-img { background: transparent; padding: 5%; }
.mm-page .mm-plan-img.is-blur { padding: 0; }
.mm-page .mm-gate { background: rgba(252, 253, 252, .6); }

/* 投票・反応 */
.mm-page .mm-vote-h { font-size: 13px; }
.mm-page .mm-vote-btns button { border-width: 1px; border-color: var(--mm-hair); color: var(--text); font-size: 14px; border-radius: 10px; }
.mm-page .mm-vote-btns button:hover { border-color: var(--main); color: var(--main); }
.mm-page .mm-bar { padding: 11px 14px; border-radius: 10px; background: #fff; border: 1px solid var(--mm-hair); font-size: 14px; }
.mm-page .mm-bar.is-mine { box-shadow: none; border-color: var(--main); }
.mm-page .mm-bar span:last-child { font-size: 12.5px; font-variant-numeric: tabular-nums; }

/* AIの見立て：付箋 */
.mm-page .mm-ai { border: 1px dashed #CFD8D5; border-radius: 10px; background: var(--bg); padding: 12px 14px; gap: 2px; }
.mm-page .mm-ai-label { font-size: 11px; }
.mm-page .mm-ai-label span { margin-left: 6px; font-weight: 400; color: var(--mm-faint); }
.mm-page .mm-ai-type { font-size: 15px; }
.mm-page .mm-ai-catch { font-size: 13px; }
.mm-page .mm-ai-weak { font-size: 13px; color: var(--muted); }
.mm-page .mm-ai-weak b { display: inline; font-size: inherit; color: var(--text); }

/* 回答：アイコンの列と、返信へつなぐ縦線 */
.mm-page .mm-answers { margin: 0 calc(-1 * var(--gutter)); }
.mm-ans-h { display: flex; align-items: baseline; gap: 8px; padding: 22px var(--gutter) 8px; }
.mm-ans-h h2 { margin: 0; font-size: 16px; font-weight: 900; }
.mm-page .mm-ans-n { margin: 0; font-size: 13px; font-weight: 400; }
.mm-page #mmAnsBody { gap: 0; background: #fff; border-top: 1px solid var(--mm-hair); border-bottom: 1px solid var(--mm-hair); }
.mm-page #mmAnsBody > p, .mm-page #mmAnsBody > a.btn, .mm-page #mmAnsBody > .mm-compose, .mm-page #mmAnsBody > .mm-prof, .mm-page #mmAnsBody > .mm-inv-pro, .mm-page #mmAnsBody > .mm-closed, .mm-page #mmAnsBody > .mm-inv-done { margin: 14px var(--gutter); }
.mm-page #mmAnsBody > a.btn { display: flex; }
.mm-page .mm-thread { gap: 0; padding: 0; border-bottom: 1px solid var(--mm-hair); }
.mm-page .mm-a { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 0 12px; padding: 14px var(--gutter) 6px; }
.mm-page .mm-a.is-reply { margin: 0; padding-top: 4px; border: 0; }
.mm-page .mm-a.is-del { display: block; padding: 12px var(--gutter); }
.mm-a-av { display: flex; flex-direction: column; align-items: center; }
.mm-page .mm-thread.has-rep > .mm-a:not(.is-reply) .mm-a-av::after { content: ''; flex: 1; width: 2px; margin-top: 6px; border-radius: 2px; background: var(--mm-hair); }
.mm-a-main { min-width: 0; display: grid; gap: 4px; padding-bottom: 6px; }
.mm-page .mm-a-head { gap: 4px 8px; align-items: baseline; }
.mm-page .mm-a-name { font-size: 14px; }
.mm-page .mm-badge { font-size: 11px; padding: 0; background: none; color: var(--muted); font-weight: 400; }
.mm-page .mm-badge.pro { padding: 0 6px; border-radius: 4px; background: var(--main); color: #fff; font-weight: 900; line-height: 1.7; }
.mm-page .mm-badge.op { padding: 0 6px; border-radius: 4px; background: var(--accent-soft); color: var(--accent-text); font-weight: 700; line-height: 1.7; }
.mm-page .mm-badge.owner { color: var(--muted); }
.mm-page .mm-a-time { color: var(--mm-faint); }
.mm-page .mm-a-org { flex-basis: 100%; font-size: 12px; font-weight: 700; color: var(--main); }
.mm-page .mm-a-org a { color: inherit; }
.mm-page .mm-a-kind { font-size: 12.5px; color: var(--accent-text); }
.mm-page .mm-a-text { font-size: 15px; line-height: 1.8; }
.mm-page .mm-a-acts { gap: 18px; margin-top: 2px; }
.mm-page .mm-a-acts button { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; min-height: 32px; }
.mm-page .mm-a-acts .mm-ic { width: 15px; height: 15px; }
.mm-page .mm-a.is-pro { background: linear-gradient(90deg, var(--main) 0 3px, #F7FBFA 3px); }
.mm-page .mm-reply-box { margin: 0 var(--gutter) 12px calc(var(--gutter) + 50px); }
.mm-page .mm-compose { padding: 4px 0; }
.mm-page .mm-c-h { font-size: 14px; }

/* 下に固定の「ひとこと書く」 */
.mm-dock { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: rgba(250, 250, 247, .95); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-top: 1px solid var(--mm-hair); transition: transform .2s ease; }
.mm-dock.is-off { transform: translateY(110%); }
.mm-dock-in { display: flex; align-items: center; width: 100%; max-width: 520px; margin: 0 auto; padding: 11px 8px 11px 16px; border-radius: 999px; background: #fff; border: 1px solid var(--mm-hair); font: inherit; font-size: 14px; color: var(--mm-faint); text-align: left; text-decoration: none; cursor: text; }
.mm-dock-in b { margin-left: auto; padding: 5px 12px; border-radius: 999px; background: var(--main); color: #fff; font-size: 12.5px; }
body.has-dock .page { padding-bottom: 96px; }
@media (prefers-reduced-motion: reduce) { .mm-dock { transition: none; } }

/* プロのページ */
.mm-page .mm-pro-page { margin-top: 0; }
.mm-page .mm-bar { flex-direction: column; align-items: flex-start; gap: 0; }
.mm-page .mm-bar b { line-height: 1.5; }
.mm-page .mm-a-time { order: 2; }
.mm-page .mm-a-org { order: 3; }
.mm-page #mmAnsBody > p { margin: 12px var(--gutter) !important; }
.mm-page .page > .card + .card { margin-top: 14px; }
.mm-st.is-open { color: var(--main); }
.mm-st.is-open::before { background: var(--main); }
/* 提携先のプロの回答の下の入口（2026-10-16） */
.mm-pro-cta { display: flex; align-items: center; gap: 10px; width: 100%; margin: 6px 0 2px; padding: 11px 14px; border-radius: 12px; border: 1px solid var(--main, #1F7F73); background: #fff; color: var(--main, #1F7F73); font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.mm-pro-cta span { display: grid; min-width: 0; }
.mm-pro-cta b { font-size: 14.5px; }
.mm-pro-cta small { font-size: 12px; color: var(--muted, #6B6F76); }
.mm-pro-cta i { margin-left: auto; font-style: normal; font-size: 20px; line-height: 1; }
.mm-pro-cta.is-sub { border-color: #CDE8E2; }
.mm-pro-cta:disabled { opacity: .6; }
.mm-pro-cta.is-preview { border-style: dashed; cursor: default; opacity: .85; }
/* プロの回答の下の「この人に個別相談する」（さりげなく。2026-10-16） */
.mm-pro-card { display: flex; align-items: center; gap: 10px; width: 100%; margin: 8px 0 2px; padding: 9px 12px; border-radius: 12px; border: 1px solid #CDE8E2; background: #fff; color: var(--text, #2B2F33); font: inherit; text-align: left; text-decoration: none; cursor: pointer; }
.mm-pro-card:hover { border-color: var(--main, #1F7F73); }
.mm-pc-av { flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--main-soft, #E6F4F1); color: var(--main, #1F7F73); font-size: 12px; font-weight: 900; }
.mm-pc-tx { display: grid; min-width: 0; line-height: 1.4; }
.mm-pc-tx b { font-size: 13.5px; color: var(--main, #1F7F73); }
.mm-pc-tx small { font-size: 11.5px; color: var(--muted, #6B6F76); }
.mm-pro-card i { margin-left: auto; font-style: normal; font-size: 18px; color: var(--main, #1F7F73); }
.mm-pro-card.is-preview { border-style: dashed; cursor: default; opacity: .85; }
.mm-pro-card:disabled { opacity: .6; }

/* 運営者だけ：AIの下書き（2026-10-16） */
.mm-opdraft { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 10px; border: 1px dashed var(--accent, #1F7F73); border-radius: 10px; background: #F1F8F5; margin: 6px 0 8px; }
.mm-opd-btn { flex: none; font: inherit; font-size: 14px; font-weight: 700; color: #fff; background: var(--accent, #1F7F73); border: 0; border-radius: 999px; padding: 8px 14px; cursor: pointer; }
.mm-opd-btn:disabled { opacity: .6; cursor: wait; }
.mm-opd-hint { flex: 1 1 180px; min-width: 0; font: inherit; font-size: 16px; padding: 7px 10px; border: 1px solid var(--line, #E7E5E0); border-radius: 8px; background: #fff; }
.mm-opd-st { flex-basis: 100%; margin: 0; }

/* スレッドの見せ方（2026-10-16）：返信ボタンを目立たせる・質問した人の返信・ワンタップのお礼・たたんだ返信 */
.mm-a-acts .mm-a-reply { color: var(--main, #1F7F73); font-weight: 700; border: 1px solid var(--main-soft, #CFE7E2); border-radius: 999px; padding: 2px 10px; }
.mm-a-nrep { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted, #6B6F76); }
.mm-a.is-owner .mm-a-main { background: #FFF8F1; border-radius: 10px; padding: 6px 10px; }
.mm-a-quick { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 2px; }
.mm-a-quick button { font: inherit; font-size: 13px; font-weight: 700; color: var(--main, #1F7F73); background: #F1F8F5; border: 1px solid var(--main-soft, #CFE7E2); border-radius: 999px; padding: 6px 12px; cursor: pointer; min-height: 34px; }
.mm-a-quick button:disabled { opacity: .5; }
.mm-rep-more { display: block; margin: 2px 0 4px 46px; background: none; border: 0; padding: 4px 0; font: inherit; font-size: 12.5px; font-weight: 700; color: var(--main, #1F7F73); cursor: pointer; text-align: left; }

/* 図面の読み込み中・失敗（ログイン中の人。2026-10-16） */
.mm-plan.is-loading::after { content: '図面を読み込んでいます…'; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 13px; color: var(--muted, #6B6F76); background: rgba(255,255,255,.85); padding: 6px 12px; border-radius: 999px; }
.mm-plan.is-failed::after { content: '図面を読み込めませんでした。開き直してみてください'; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 13px; color: var(--muted, #6B6F76); background: rgba(255,255,255,.9); padding: 6px 12px; border-radius: 999px; white-space: nowrap; }

/* ===== 図面を大きく見る（assets/zoom-viewer.js）2026-10-16 ===== */
.mm-plan { position: relative; }
.mm-plan.can-zoom img { cursor: zoom-in; }
.mm-zoom-hint { position: absolute; right: 10px; bottom: 10px; z-index: 2; display: inline-flex; align-items: center; gap: 4px; padding: 6px 12px; border: 0; border-radius: 99px; background: rgba(43, 47, 51, .78); color: #fff; font: 700 12px/1.2 inherit; cursor: zoom-in; }
.mm-zoom-hint::before { content: ''; width: 12px; height: 12px; border: 2px solid currentColor; border-radius: 50%; box-sizing: border-box; box-shadow: 4px 4px 0 -2.5px currentColor; }
.mm-zoom-hint[hidden] { display: none; }
img.mm-wait-img[data-zoom] { cursor: zoom-in; }

/* 質問のページの下の「ほかの人の質問」（2026-10-16 SEO：古い質問にもたどり着けるように） */
.mm-rel { margin: 28px 0 0; }
.mm-rel h2 { margin: 0 0 8px; font-size: 16px; }
.mm-rel ul { margin: 0; padding: 0; list-style: none; }
.mm-rel li { border-bottom: 1px solid var(--line, #e6e6e6); }
.mm-rel li a { display: block; padding: 12px 2px; color: inherit; font-size: 14px; line-height: 1.6; text-decoration: none; }
.mm-rel li a:hover { color: var(--main, #2f7d5b); }
.mm-rel-all { display: inline-block; margin-top: 10px; font-size: 13px; }

/* 回答の書き出し（ログインしていない人向け。2026-10-16 SEO） */
.mm-peek { display: grid; gap: 10px; margin: 0 0 12px; }
.mm-peek-a { padding: 12px 14px; border: 1px solid var(--line, #e6e6e6); border-radius: 14px; background: #fff; }
.mm-peek-a .mm-a-head { margin: 0 0 4px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 13px; }
.mm-peek-text { margin: 0; font-size: 14px; line-height: 1.7; }
.mm-peek-text .mm-a-kind { margin-right: 6px; }
.mm-peek-more { margin: 0; font-size: 12px; color: var(--muted, #6b6f76); }

/* 一覧の1件をコンパクトに（2026-10-16：マドラボの一覧を参考に）。図面は質問の右の小さい四角。ログイン中はぼかさない */
.mm-row-main { margin-top: 6px; display: flex; align-items: flex-start; gap: 12px; }
.mm-row-txt { flex: 1; min-width: 0; display: block; }
.mm-row-main .mm-row-q { margin-top: 0; }
.mm-row-main .mm-paper.is-thumb { flex: none; width: 84px; margin-top: 2px; aspect-ratio: 1 / 1; border-radius: 10px; }
.mm-row-main .mm-paper.is-thumb img { inset: 6%; width: 88%; height: 88%; filter: blur(2.5px); }
.mm-row-main .mm-paper.is-thumb.is-clear img { filter: none; opacity: 1; }
.mm-row-main .mm-lock { left: 50%; top: 50%; bottom: auto; transform: translate(-50%, -50%); padding: 6px; border-radius: 50%; }
.mm-row-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 5px; }
.mm-row-tags span { font-size: 11px; font-weight: 700; line-height: 1.5; padding: 1px 8px; border-radius: 999px; background: var(--main-soft, #E6F4F1); color: var(--main, #1F7F73); }
.mm-row-tags span.is-two { background: #FDEFE4; color: #C2601C; }

/* 質問した本人だけに出す、プロへの相談の入口（2026-10-24） */
.mm-own-bridge { display: grid; gap: 10px; margin: 6px 0 4px; padding: 12px 14px; border: 1px dashed var(--line, #D8D5CE); border-radius: 12px; background: #FBFAF7; }

/* プロを指名して添削をお願いする（2026-10-25） */
.mm-badge.nom { background: #FDF1E7; color: #B4561B; }
.mm-nom { display: grid; gap: 6px; border-top: 1px solid var(--line, #E3E1DB); padding-top: 10px; }
.mm-nom-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 8px; }
.mm-nom-list li { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; padding: 10px 12px; border: 1px solid var(--line, #E3E1DB); border-radius: 12px; background: #fff; }
.mm-nom-list .mm-badge { margin: 0 6px; }
@media (max-width: 520px) { .mm-nom-list li { grid-template-columns: 1fr; } }

/* 間取りをつくる との行き来（2026-10-26） */
.mm-tk[hidden], .mm-tk2[hidden] { display: none; }
.mm-tk { margin: 10px 0 2px; }
.mm-tk-btn { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid #CFE5DE; background: #F2FAF7; border-radius: 12px; color: var(--ink, #1f2a28); text-decoration: none; }
.mm-tk-btn b { display: block; font-size: 14px; font-weight: 800; line-height: 1.45; }
.mm-tk-btn small { display: block; font-size: 12px; color: var(--muted, #667); line-height: 1.5; margin-top: 1px; }
.mm-tk-i { font-size: 20px; flex: none; }
.mm-tk-go { margin-left: auto; font-size: 22px; color: var(--main, #1F7F73); flex: none; }
.mm-alt { margin: 6px 0 2px; border: 1px solid var(--mm-hair, #e6e4df); border-radius: 10px; padding: 6px; background: #fff; display: grid; gap: 6px; }
.mm-alt img { width: 100%; max-height: 360px; object-fit: contain; display: block; cursor: zoom-in; background: #fff; }
.mm-alt-open { font-size: 12.5px; font-weight: 700; color: var(--main, #1F7F73); text-decoration: none; justify-self: start; padding: 2px 4px; }
.mm-tk2 { margin: 8px 0 4px; display: flex; align-items: center; gap: 10px; padding: 8px 12px; border: 1px dashed #BFDCD3; border-radius: 999px; background: #fff; color: var(--muted, #667); font-size: 13px; text-decoration: none; }
.mm-tk2 span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mm-tk2 b { flex: none; color: var(--main, #1F7F73); font-size: 13px; }

/* 似た間取りで絞り込む（2026-10-26） */
.mm-filter { margin: 8px 0 4px; }
.mm-filter details { border: 1px solid var(--line, #E7E5E0); border-radius: 14px; background: #fff; padding: 10px 14px; }
.mm-filter summary { cursor: pointer; font-size: 14px; font-weight: 700; color: var(--main, #1F7F73); }
.mm-filter summary span { margin-left: 8px; font-size: 12px; color: var(--muted, #6B6B6B); font-weight: 400; }
.mm-filter-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 10px; }
.mm-filter-row select { font: inherit; font-size: 14px; padding: 7px 10px; border: 1px solid var(--line, #E7E5E0); border-radius: 10px; background: #fff; }
.mm-filter-row a { font-size: 13px; }
.mm-filter-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.mm-filter-chips label { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; padding: 5px 10px; border: 1px solid var(--line, #E7E5E0); border-radius: 99px; cursor: pointer; }
.mm-filter-chips input { margin: 0; accent-color: var(--main, #1F7F73); }
.mm-filter-chips label:has(input:checked) { border-color: var(--main, #1F7F73); background: var(--main-soft, #E6F4F1); font-weight: 700; }
.mm-filter-note { font-size: 11.5px; color: var(--muted, #6B6B6B); margin: 8px 0 0; }
.mm-q-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 6px; }
.mm-q-tags a { font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 99px; background: var(--main-soft, #E6F4F1); color: var(--main, #1F7F73); text-decoration: none; }
.mm-rel .mm-row-tags { margin-right: 6px; }

/* お返しの仕組み：似た間取りの人に答える（2026-10-26） */
.mm-help { display: grid; gap: 6px; border-top: 1px solid var(--line, #E3E1DB); padding-top: 10px; }
.mm-help-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 6px; }
.mm-help-list a { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid var(--line, #E3E1DB); border-radius: 12px; background: #fff; color: inherit; text-decoration: none; }
.mm-help-list b { font-size: 14px; line-height: 1.5; }
.mm-help-list small { font-size: 12px; color: #C2601F; }

/* 出し方を選ぶ（聞きたい／見てほしい。2026-10-26） */
.mm-kind { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.mm-kind button { font: inherit; font-size: 14px; font-weight: 700; text-align: left; padding: 10px 12px; border: 1.5px solid var(--line, #E7E5E0); border-radius: 12px; background: #fff; color: var(--text, #2B2F33); cursor: pointer; line-height: 1.4; }
.mm-kind button small { display: block; font-size: 11.5px; font-weight: 500; color: var(--muted, #6B6F76); }
.mm-kind button.on { border-color: var(--main, #1F7F73); background: #F1F8F5; box-shadow: inset 0 0 0 1px var(--main, #1F7F73); }
#mmAskOnly[hidden], #mmEx[hidden] { display: none; }
/* 一覧・ページの「作品」の札 */
.mm-row-tags .is-show, .mm-q-tags .is-show { background: #FFF4E8; color: #9A4F12; }

/* 「みんなの間取りに出す」の最初の画面の、回答の見本（2026-10-26） */
.mm-sample { display: grid; gap: 6px; }
.mm-sample[hidden] { display: none; }
.mm-sample-h { margin: 0; font-size: 12px; font-weight: 700; color: var(--muted, #6B6F76); }
.mm-sample-b { position: relative; padding: 10px 12px 10px 14px; border-radius: 12px; background: #F6F8F7; border-left: 3px solid var(--main, #1F7F73); }
.mm-sample-b b { font-size: 12px; color: var(--main, #1F7F73); }
.mm-sample-k { margin-left: 6px; font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 99px; background: #FFF1E6; color: #B4561F; }
.mm-sample-b p { margin: 4px 0 0; font-size: 13.5px; line-height: 1.7; color: var(--ink, #1C2B33); }
.mm-sample-f { margin: 0; display: flex; justify-content: space-between; gap: 8px; align-items: baseline; font-size: 11.5px; color: var(--muted, #6B6F76); }
.mm-sample-f button { flex: none; background: none; border: 0; padding: 2px 0; font: inherit; font-size: 12px; font-weight: 700; color: var(--main, #1F7F73); cursor: pointer; }
.mm-compose textarea.is-tpl { color: var(--muted, #8A8F94); }
/* いちばん迷っているところ（2026-10-27） */
.mm-focus { display: grid; gap: 6px; margin-top: 4px; }
.mm-focus-h { margin: 0; font-size: 13px; font-weight: 700; color: var(--ink, #1C2B33); }
.mm-focus-h small { display: block; font-weight: 400; font-size: 11.5px; color: var(--muted, #6B7378); }
.mm-focus-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.mm-focus-chips button { font: inherit; font-size: 12.5px; padding: 5px 11px; border-radius: 99px; border: 1px solid var(--line, #E2DFD8); background: #fff; color: var(--ink, #1C2B33); cursor: pointer; }
.mm-focus-chips button[aria-pressed="true"] { border-color: #1F7F73; background: #E8F4F1; color: #155E55; font-weight: 700; }
.mm-focus-chips i { font-style: normal; font-size: 10px; font-weight: 800; color: #fff; background: #E86A33; border-radius: 4px; padding: 0 4px; margin-right: 4px; }
.mm-focus-in { font: inherit; font-size: 16px; padding: 8px 10px; border: 1px solid var(--line, #E2DFD8); border-radius: 10px; }
/* 定型の質問に、あとからひとこと足す（2026-10-27） */
.mm-addline { border: 1px solid #F2D7BF; background: #FFF8F1; border-radius: 12px; padding: 12px 14px; display: grid; gap: 8px; }
.mm-addline p { margin: 0; }

/* ポイント・ベストアンサー・称号（2026-11-03） */
.mm-badge.rank { color: #8A5A00; background: #FFF4DA; text-decoration: none; }
.mm-best { margin: 0 0 4px; font-size: 12.5px; font-weight: 900; color: #8A5A00; }
.mm-best small { font-weight: 500; margin-left: 4px; }
.mm-badge.late { color: #5f5f5f; background: #EEF0F2; }
.mm-st.solved { color: #8A5A00; background: #FFF4DA; }
.mm-st.soon { color: var(--accent-text, #B4561B); background: var(--accent-soft, #FDF1E7); }
.mm-a:has(.mm-best) { background: #FFFBEF; border-radius: 12px; }
.mm-best-nudge { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: #FFF4DA; color: #5C4300; font-size: 13.5px; line-height: 1.7; }
.mm-a-acts .mm-a-best { color: #8A5A00; font-weight: 700; }
.mm-pt-hint { margin: 0; font-size: 12.5px; color: var(--main, #1F7F73); line-height: 1.6; }
.mm-pt-info { margin: 10px 0 0; font-size: 13px; color: var(--ink-muted, #5f5f5f); line-height: 1.7; }
.mm-ptbar { margin: 8px 0 0; font-size: 13px; }
.mm-ptbar a { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: #FFF4DA; color: #5C4300; text-decoration: none; }
.mm-ptbar em { font-style: normal; font-weight: 700; color: var(--accent-text, #B4561B); }
.mm-row-pt { font-size: 11.5px; font-weight: 700; color: #8A5A00; background: #FFF4DA; border-radius: 999px; padding: 2px 10px; }
.mm-pt-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 60; max-width: calc(100% - 32px); padding: 12px 18px; border-radius: 12px; background: #2B2A27; color: #fff; font-size: 14px; box-shadow: 0 8px 24px rgba(0,0,0,.18); transition: opacity .5s; }
.mm-pt-toast b { color: #FFD27A; }
.mm-pt-toast.is-out { opacity: 0; }
.mm-pt-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.mm-pt-table th { text-align: left; font-weight: 500; padding: 8px 8px 8px 0; border-bottom: 1px solid var(--line, #E8E4DC); }
.mm-pt-table td { text-align: right; white-space: nowrap; padding: 8px 0; border-bottom: 1px solid var(--line, #E8E4DC); color: #8A5A00; }

.mm-pt-welcome { margin: 12px 0 0; padding: 12px 14px; border-radius: 12px; background: #FFF4DA; color: #5C4300; font-size: 13.5px; line-height: 1.7; }
.mm-pt-welcome p { margin: 4px 0 0; }

/* 一覧をコンパクトに（2026-11-03 ユーザー：だらっと細長い）：図面は左に正方形・見出しは2行まで・名前やタグは1段・PC は2列 */
.mm-grid { display: grid; gap: 0; }
.mm-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; align-items: start; padding: 14px var(--gutter); background: #fff; border-bottom: 1px solid var(--mm-hair); color: var(--text); text-decoration: none; }
.mm-card:hover { background: #FDFDFB; }
.mm-card:focus-visible { outline: 3px solid rgba(31, 127, 115, .3); outline-offset: -3px; }
.mm-card .mm-paper.is-thumb { margin: 0; aspect-ratio: 1 / 1; }
.mm-rcard .mm-paper.is-thumb { margin: 0; aspect-ratio: 16 / 10; }
.mm-card-body { min-width: 0; display: grid; gap: 4px; }
.mm-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mm-card-k { font-size: 11.5px; font-weight: 700; color: var(--mm-faint); letter-spacing: .02em; }
.mm-card-q { font-size: 15.5px; font-weight: 700; line-height: 1.55; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mm-card-two { display: flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; }
.mm-card-two i { font-style: normal; font-size: 11px; color: var(--mm-faint); }
.mm-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 12px; color: var(--mm-faint); }
.mm-card-tag { padding: 1px 8px; border-radius: 999px; background: var(--main-soft, #E8F3F0); color: var(--main, #1F7F73); font-weight: 700; font-size: 11.5px; }
.mm-card-n { display: inline-flex; align-items: center; gap: 3px; }
.mm-card-n .mm-ic { width: 14px; height: 14px; }
.mm-card .mm-row-pro, .mm-card .mm-row-pt { margin-left: 0; font-size: 11px; padding: 1px 8px; }
.mm-card.is-more { display: none; }
.mm-grid.is-all .mm-card.is-more { display: grid; }
.mm-more { display: block; width: calc(100% - var(--gutter) * 2); margin: 14px auto 0; padding: 12px; border-radius: 12px; border: 1px solid var(--mm-hair); background: #fff; font-size: 14px; font-weight: 700; color: var(--main, #1F7F73); cursor: pointer; }
/* まだ回答がない質問：横にすべる帯 */
.mm-rail { margin: 4px 0 0; padding: 14px 0 16px; background: #FFF9EC; border-bottom: 1px solid var(--mm-hair); }
.mm-rail h2 { margin: 0 var(--gutter) 10px; font-size: 14.5px; font-weight: 900; display: flex; align-items: center; gap: 8px; }
.mm-rail h2 span { font-size: 12px; font-weight: 700; color: #8A5A00; background: #FFE9B8; border-radius: 999px; padding: 1px 8px; }
.mm-rail-row { display: flex; gap: 10px; overflow-x: auto; padding: 0 var(--gutter) 4px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.mm-rcard { flex: 0 0 156px; scroll-snap-align: start; display: grid; gap: 6px; align-content: start; padding: 10px; border-radius: 12px; background: #fff; border: 1px solid #F1DFAE; color: var(--text); text-decoration: none; }
.mm-rcard b { font-size: 13.5px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.mm-rcard-pt { font-size: 11.5px; font-weight: 700; color: #8A5A00; }
@media (min-width: 880px) {
  .mm-page main.page:has(.mm-grid) { max-width: 960px; }
  .mm-page .mm-feed.mm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0; padding: 12px 0 0; }
  .mm-grid .mm-card { border: 1px solid var(--mm-hair); border-radius: 14px; }
  .mm-grid.is-all .mm-card.is-more { display: grid; }
  .mm-more { width: 100%; }
  .mm-rail { border-radius: 14px; border: 1px solid #F1DFAE; }
}

/* 絞り込み：受付の状態・並べ方・プロの回答（2026-11-03） */
.mm-filter-h { margin: 10px 0 4px; font-size: 12px; font-weight: 700; color: var(--mm-faint); }
.mm-filter-pro { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; }

/* 収納の質問の「収納ぴったり計算」への1行（2026-11-05・控えめに） */
body.mm-page .mm-pittari { margin: 10px 0 0; font-size: 12.5px; }
body.mm-page .mm-pittari a { color: var(--muted, #6B7280); text-decoration: underline; text-underline-offset: 2px; }