/* Banh mi And Local（ご当地バインミー図鑑）— サイト共通の白黒・明朝見出しのトーンに合わせる */
.albm { --ink: #1a1a1a; --sub: #666; --line: #ddd; --bg: #fff; --empty: #eeebe6; color: var(--ink); }
.albm *, .albm-shop *, .albm-sources * { box-sizing: border-box; }
.albm button { font-family: inherit; }

.albm-lead { font-size: 15px; line-height: 2; margin-bottom: 32px; }
.albm-stats { font-size: 14px; color: var(--sub); letter-spacing: .08em; margin: 0 0 24px; }
.albm-stats strong { font-family: "Noto Serif JP", "Yu Mincho", YuMincho, serif; font-size: 28px; color: var(--ink); font-weight: 600; margin: 0 2px; }

.albm-top { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 40px; align-items: start; }
@media (max-width: 860px) { .albm-top { grid-template-columns: 1fr; gap: 28px; } }

/* タイルマップ: 14列 x 13行 */
.albm-map { display: grid; grid-template-columns: repeat(14, 1fr); grid-template-rows: repeat(13, auto); gap: 3px; max-width: 620px; }
.albm-tile { aspect-ratio: 1 / 1; border: 0; padding: 0; margin: 0; background: var(--empty); color: #b0aaa2; font-size: 10px; line-height: 1.1;
  display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: default; position: relative; min-width: 0; border-radius: 0; overflow: hidden; }
.albm-tile[data-pref="hokkaido"] { aspect-ratio: auto; }
.albm-tile.has { background: var(--c); color: #fff; cursor: pointer; transition: transform .12s, box-shadow .12s, opacity .12s; }
.albm-tile.has:hover, .albm-tile.has:focus-visible { transform: scale(1.08); z-index: 2; outline: none; box-shadow: 0 0 0 2px var(--ink); }
.albm-tile-name { writing-mode: horizontal-tb; white-space: nowrap; font-size: 10px; letter-spacing: -.02em; }
.albm-tile-n { font-family: "Noto Serif JP", serif; font-weight: 600; font-size: 13px; line-height: 1; margin-top: 2px; }
.albm-tile.is-dim { opacity: .28; }
.albm-tile.is-sel { box-shadow: 0 0 0 3px var(--ink); z-index: 3; }
@media (max-width: 560px) {
  .albm-map { gap: 2px; }
  .albm-tile-name { font-size: 8px; }
  .albm-tile-n { font-size: 11px; }
  .albm-tile:not(.has) .albm-tile-name { display: none; }
}

.albm-label { font-size: 12px; letter-spacing: .12em; color: var(--sub); margin: 18px 0 8px; padding: 0; }
.albm-label:first-child { margin-top: 0; }
.albm-label input { margin-right: 6px; vertical-align: -1px; }
.albm-regions { display: flex; flex-wrap: wrap; gap: 6px; }
.albm-chip { border: 1px solid var(--line); background: var(--bg); color: var(--ink); font-size: 13px; padding: 6px 12px; cursor: pointer; border-radius: 0; line-height: 1.4; }
.albm-chip[data-region]:not([data-region=""])::before { content: ""; display: inline-block; width: 8px; height: 8px; background: var(--c); margin-right: 6px; vertical-align: 1px; }
.albm-chip:hover { border-color: var(--ink); }
.albm-chip.is-on { background: var(--ink); color: #fff; border-color: var(--ink); }
.albm-select, .albm-input { width: 100%; border: 1px solid var(--line); border-radius: 0; padding: 10px 12px; font-size: 15px; background: var(--bg); color: var(--ink); font-family: inherit; }

.albm-result { margin: 40px 0 16px; padding-bottom: 12px; border-bottom: 1px solid var(--ink); font-family: "Noto Serif JP", "Yu Mincho", YuMincho, serif; font-size: 20px; }

.albm-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0 32px; }
.albm-card { border-bottom: 1px solid var(--line); list-style: none; margin: 0; padding: 0; }
.albm-card[hidden] { display: none; }
.albm-card a { display: block; padding: 20px 0 22px; color: inherit; text-decoration: none; }
.albm-card a:hover .albm-card-name { text-decoration: underline; text-underline-offset: 4px; }
.albm-card-area { font-size: 12px; color: var(--sub); letter-spacing: .06em; margin: 0 0 6px; padding: 0; }
.albm-card-area::before { content: ""; display: inline-block; width: 8px; height: 8px; background: var(--c); margin-right: 6px; vertical-align: 0; }
.albm-card-name { font-size: 18px !important; line-height: 1.5 !important; margin: 0 0 8px !important; padding: 0 !important; }
.albm-card-local { font-size: 13px; margin: 0 0 8px; padding: 0; line-height: 1.6; }
.albm-card-local span { display: inline-block; background: var(--c, var(--ink)); color: #fff; font-size: 11px; padding: 1px 6px; margin-right: 8px; letter-spacing: .08em; }
.albm-card-text { font-size: 13px; color: #444; line-height: 1.8; margin: 0; padding: 0; }
.albm-draft { display: inline-block; font-size: 10px; border: 1px solid #c33; color: #c33; padding: 0 4px; margin-left: 6px; }
.albm-empty { color: var(--sub); padding: 24px 0; }
.albm-notice { font-size: 12px; color: var(--sub); line-height: 1.8; margin-top: 40px; }

/* 店舗投稿 */
.albm-shop { margin: 0 0 32px; }
.albm-shop-local { font-size: 15px; margin-bottom: 16px; }
.albm-info { width: 100%; border-collapse: collapse; border-top: 1px solid #1a1a1a; font-size: 14px; }
.albm-info th, .albm-info td { border-bottom: 1px solid #ddd; padding: 10px 12px; text-align: left; vertical-align: top; line-height: 1.7; }
.albm-info th { width: 7.5em; font-weight: normal; color: #666; white-space: nowrap; }
.albm-info td { word-break: break-all; }
.albm-note { font-size: 13px; color: #8a5a00; margin: 10px 0 0; }
.albm-muted { color: #888; font-size: 13px; }
.albm-sources { margin-top: 40px; padding-top: 20px; border-top: 1px solid #ddd; font-size: 13px; }
.albm-sources h4 { font-size: 14px; margin: 0 0 8px; }
.albm-sources ul { margin: 0 0 12px 1.2em; }
.albm-back { font-size: 14px; }

/* 言語リンク・ベトナム語ページ */
.albm-lang { text-align: right; font-size: 14px; margin: 0 0 16px; }
.albm-card-body { padding: 20px 0 22px; }
.albm-card-addr { font-size: 13px; color: #444; margin: 8px 0 0; padding: 0; }
.albm-card-links { margin: 10px 0 0; padding: 0; font-size: 13px; display: flex; flex-wrap: wrap; gap: 8px 16px; }
.albm-vi .albm-list { margin-top: 8px; }
.alvi h2 { margin-top: 48px; padding-bottom: 8px; border-bottom: 1px solid #1a1a1a; }
.alvi-box { border: 1px solid #ddd; padding: 16px 20px; margin: 16px 0; }
.alvi-box h3 { font-size: 17px !important; margin: 0 0 8px !important; padding: 0 !important; }
.alvi-box p { margin: 0 0 6px; padding: 0; font-size: 14px; line-height: 1.8; }
.alvi-tel { font-size: 20px; font-weight: 600; letter-spacing: .04em; }
.alvi-emg { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 16px 0; }
.alvi-emg div { background: #1a1a1a; color: #fff; padding: 16px 20px; }
.alvi-emg strong { display: block; font-size: 32px; font-family: "Noto Serif JP", serif; line-height: 1.2; }
.alvi-src { font-size: 12px; color: #666; }

/* 店舗ページの言語タブ（日本語／English／Tiếng Việt）。JSが無いときは全言語を縦に並べる */
.albm-langs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.albm-langs a { border: 1px solid #ddd; padding: 6px 14px; font-size: 14px; color: #1a1a1a; text-decoration: none; line-height: 1.4; }
.albm-langs a:hover { border-color: #1a1a1a; }
.albm-langs a.is-on { background: #1a1a1a; color: #fff; border-color: #1a1a1a; }
.albm-lang-sec + .albm-lang-sec { margin-top: 40px; }
.albm-js .albm-lang-sec + .albm-lang-sec { margin-top: 0; }
.albm-lang-sec[hidden] { display: none; }