/**
 * レジャー・地域スポットのサイト用スタイル（一覧spots.html・詳細ページ・管理画面の入力フォーム共通）。
 * 色・余白・角丸はすべてtokens.cssの値を使う。ダークモードは<html class="dark">（tokens.css参照）で
 * tokensが切り替わるため、ここでは色を直書きしない（ピンの色だけはテーマ色のため例外）。
 */

/* ── 地図の部品（Leaflet） ───────────────────────────────────────────── */
.leaflet-container { font-family: var(--font-family); background: var(--color-surface-muted); }
.leaflet-popup-content-wrapper { border-radius: var(--radius-card); box-shadow: var(--shadow-lg); }
.leaflet-popup-content { margin: 0; min-width: 220px; color: var(--color-text); }
.leaflet-control-layers, .leaflet-bar a { color: #1f2937; }
html.dark .leaflet-tile-pane { filter: brightness(0.82) contrast(1.05); }

.spot-pin-wrap { background: none; border: 0; }
.spot-pin {
  --pin: #64748B;
  position: relative; display: grid; place-items: center;
  width: 36px; height: 36px; border-radius: 50% 50% 50% 0;
  background: var(--pin); border: 3px solid #fff;
  transform: rotate(-45deg); box-shadow: 0 3px 8px rgb(0 0 0 / .35);
  transition: transform .15s ease, box-shadow .15s ease;
}
.spot-pin-emoji { transform: rotate(45deg); font-size: 17px; line-height: 1; }
.spot-pin-wrap:hover .spot-pin, .spot-pin.is-active { transform: rotate(-45deg) scale(1.18); box-shadow: 0 6px 14px rgb(0 0 0 / .4); }
.spot-pin-wrap:hover, .spot-pin-wrap:has(.is-active) { z-index: 900 !important; }

.user-dot-wrap { background: none; border: 0; }
.user-dot {
  display: block; width: 18px; height: 18px; border-radius: 50%;
  background: #1a73e8; border: 3px solid #fff; box-shadow: 0 0 0 0 rgb(26 115 232 / .5);
  animation: user-dot-pulse 2s ease-out infinite;
}
.user-accuracy { fill: #1a73e8; fill-opacity: .12; stroke: #1a73e8; stroke-opacity: .4; }
@keyframes user-dot-pulse { 0% { box-shadow: 0 0 0 0 rgb(26 115 232 / .5); } 70% { box-shadow: 0 0 0 16px rgb(26 115 232 / 0); } 100% { box-shadow: 0 0 0 0 rgb(26 115 232 / 0); } }
@media (prefers-reduced-motion: reduce) { .user-dot { animation: none; } .spot-pin { transition: none; } }

/* 地図の吹き出し */
.sp-pop { display: grid; }
.sp-pop-photo { width: 100%; height: 110px; object-fit: cover; border-radius: var(--radius-card) var(--radius-card) 0 0; display: block; background: var(--color-surface-muted); }
.sp-pop-body { padding: var(--space-3) var(--space-4) var(--space-4); display: grid; gap: var(--space-1); }
.sp-pop-cat { font-size: var(--fs-tiny); font-weight: 700; color: var(--pin, var(--color-primary)); }
.sp-pop-name { font-size: var(--fs-h3); font-weight: 700; line-height: 1.35; }
.sp-pop-meta { font-size: var(--fs-small); color: var(--color-text-sub); }
.sp-pop-link { margin-top: var(--space-2); justify-self: start; }

/* ── 一覧ページ（spots.html） ─────────────────────────────────────────── */
.lz-main { margin: 0; padding: var(--space-6) 0 var(--space-4); display: grid; gap: var(--space-5); min-width: 0; }
.lz-panel {
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-card);
  box-shadow: var(--shadow-card); padding: var(--space-4);
}
.lz-search-row { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.lz-search-row input[type="search"], .lz-search-row input[type="text"] { flex: 1 1 240px; }
.lz-field, .lz-search-row input, .lz-search-row select {
  padding: 10px var(--space-3); border: 1px solid var(--color-border-strong); border-radius: var(--radius-base);
  background: var(--color-surface); color: var(--color-text); font-size: var(--fs-body); font-family: inherit; min-height: 44px;
}
.lz-field:focus-visible, .lz-search-row input:focus-visible, .lz-search-row select:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 1px; }

/* 目的チップは折り返して全部見せる（横にはみ出してページ全体が広がるスマホの崩れの原因だった。D-902） */
.lz-themes { display: flex; flex-wrap: wrap; gap: var(--space-2); padding: var(--space-3) 2px var(--space-1); }
.lz-theme {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  border: 1px solid var(--color-border-strong); background: var(--color-surface); color: var(--color-text);
  border-radius: var(--radius-full); padding: 8px 14px; font-size: var(--fs-small); font-weight: 600; min-height: 40px;
  transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.lz-theme:hover { border-color: var(--color-primary); }
.lz-theme[aria-pressed="true"] { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-text-inverse); }
html.dark .lz-theme[aria-pressed="true"] { color: #06264D; }
.lz-theme-count { font-weight: 400; opacity: .75; }
/* スマホでは、絞り込みのチップを詰めて、1行に2つ並ぶようにする（D-928） */
@media (max-width: 520px) { .lz-theme { padding: 6px 10px; gap: 4px; } .lz-themes { gap: 6px; } }

.lz-filters { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); align-items: center; margin-top: var(--space-3); }
.lz-toggle { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-small); cursor: pointer; padding: 6px 4px; min-height: 36px; }
.lz-toggle input { width: 18px; height: 18px; accent-color: var(--color-accent); }
.lz-more { margin-top: var(--space-3); }
.lz-more summary { cursor: pointer; font-size: var(--fs-small); font-weight: 700; color: var(--color-primary); padding: 6px 0; min-height: 36px; }
.lz-more-grid { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); padding: var(--space-2) 0; }
.lz-field-label { display: grid; gap: 6px; font-size: var(--fs-small); font-weight: 600; }
.lz-inline { display: flex; gap: var(--space-2); }
.lz-inline .lz-field { flex: 1 1 auto; min-width: 0; }
.lz-near-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-top: var(--space-3); }
.lz-status { font-size: var(--fs-small); color: var(--color-text-sub); min-height: 1.4em; }
.lz-status.is-error { color: var(--color-danger); }


.lz-listhead { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); flex-wrap: wrap; }
.lz-listhead h2 { font-size: var(--fs-h2); margin: 0; }
.lz-sort { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--fs-small); color: var(--color-text-sub); }
.lz-sort select { padding: 6px 10px; border: 1px solid var(--color-border-strong); border-radius: var(--radius-base); background: var(--color-surface); color: var(--color-text); min-height: 38px; }

.lz-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--space-4); }
.lz-card {
  --accent: #64748B;
  position: relative; display: flex; flex-direction: column; overflow: hidden; color: var(--color-text); text-decoration: none;
  background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-card);
  box-shadow: var(--shadow-sm); transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}
.lz-card-link { position: absolute; inset: 0; z-index: 1; border-radius: var(--radius-card); }
.lz-card-link:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 2px; }
.lz-card .lz-tag { position: relative; z-index: 2; }
.lz-card:hover, .lz-card.is-hot { box-shadow: var(--shadow-card-hover); transform: translateY(-2px); border-color: var(--accent); text-decoration: none; }
.lz-card-media { position: relative; aspect-ratio: 16 / 10; background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 55%, #000)); display: grid; place-items: center; overflow: hidden; }
.lz-card-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* 写真の場所に出すそのスポットの地図。見るだけ（触っても動かさず、カードのリンクが押せる） */
.lz-card-map { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; pointer-events: none; background: var(--color-surface-muted); }
.lz-card-media.has-map .lz-card-emoji { display: none; }
.lz-card-emoji { font-size: 3rem; position: relative; z-index: 0; filter: drop-shadow(0 4px 8px rgb(0 0 0 / .3)); }
.lz-card-cat, .lz-card-dist { z-index: 2; }
.lz-card-cat { position: absolute; left: var(--space-2); top: var(--space-2); background: rgb(255 255 255 / .94); color: #1f2937; font-size: var(--fs-tiny); font-weight: 700; padding: 3px 10px; border-radius: var(--radius-full); }
.lz-card-dist { position: absolute; right: var(--space-2); top: var(--space-2); background: #1a73e8; color: #fff; font-size: var(--fs-small); font-weight: 700; padding: 3px 10px; border-radius: var(--radius-full); box-shadow: var(--shadow-base); }
.lz-card-body { padding: var(--space-3) var(--space-4) var(--space-4); display: grid; gap: var(--space-2); flex: 1; align-content: start; }
.lz-card-name { font-size: var(--fs-h3); font-weight: 700; line-height: 1.4; margin: 0; }
.lz-card-sum { font-size: var(--fs-small); color: var(--color-text-sub); line-height: 1.7; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lz-facts { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: var(--fs-small); color: var(--color-text); }
.lz-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.lz-badge { font-size: var(--fs-tiny); font-weight: 600; background: var(--color-success-bg); color: var(--color-success); border-radius: var(--radius-full); padding: 3px 9px; }
.lz-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.lz-tag { font-size: var(--fs-tiny); background: var(--navy-100); color: var(--color-primary); border-radius: var(--radius-full); padding: 2px 9px; cursor: pointer; border: 0; font-family: inherit; }
.lz-tag:hover, .lz-tag:focus-visible { background: var(--color-primary); color: var(--color-text-inverse); outline: none; }
.lz-card-foot { display: flex; align-items: center; gap: var(--space-2); margin-top: auto; padding-top: var(--space-2); font-size: var(--fs-small); color: var(--color-text-muted); }
.lz-card-more { margin-left: auto; color: var(--accent); font-weight: 700; }

.lz-empty, .lz-error { text-align: center; padding: var(--space-10) var(--space-4); color: var(--color-text-sub); background: var(--color-surface); border: 1px dashed var(--color-border-strong); border-radius: var(--radius-card); grid-column: 1 / -1; }
.lz-empty strong { display: block; font-size: var(--fs-h2); color: var(--color-text); margin-bottom: var(--space-2); }
.lz-active-filters { grid-column: 1 / -1; display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; font-size: var(--fs-small); color: var(--color-text-sub); }
.lz-skel { height: 280px; border-radius: var(--radius-card); background: linear-gradient(90deg, var(--color-surface-muted), var(--color-surface), var(--color-surface-muted)); background-size: 200% 100%; animation: lz-shimmer 1.4s linear infinite; }
@keyframes lz-shimmer { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .lz-skel { animation: none; } .lz-card { transition: none; } }
.lz-credit { font-size: var(--fs-tiny); color: var(--color-text-muted); text-align: center; padding: var(--space-4) 0 var(--space-8); }

/* ── 詳細ページ（サーバーで組み立てるHTML） ───────────────────────────────── */
/* ヘッダー：一覧（地域の施設・スポット情報）と同じ「白地・虹の短い線のキッカー・紺の見出し」。種類の色は小さな印だけに使う（D-906） */
.sd-hero { --accent: #64748B; background: var(--color-surface); color: var(--color-text); border-bottom: 1px solid var(--color-border); }
.sd-hero-inner { max-width: var(--maxw-content); margin: 0 auto; padding: var(--space-8) var(--space-4) var(--space-6); display: grid; gap: var(--space-5); grid-template-columns: minmax(0, 1fr); align-items: center; }
@media (min-width: 861px) { .sd-hero.has-photo .sd-hero-inner { grid-template-columns: minmax(0, 1fr) minmax(0, 360px); } }
.sd-hero-text { min-width: 0; }
.sd-hero-photo { border-radius: var(--radius-card); overflow: hidden; aspect-ratio: 16 / 10; border: 1px solid var(--color-border); background: var(--color-surface-muted); }
.sd-hero-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sd-crumb { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); font-size: 13px; font-weight: 700; letter-spacing: 0.06em; color: var(--color-text-sub); margin: 0 0 var(--space-2); }
.sd-crumb::before { content: ""; width: 34px; height: 4px; border-radius: 2px; background: var(--agora-rainbow); }
.sd-crumb a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.sd-cat { display: inline-block; background: var(--color-surface); border: 1px solid var(--accent); color: var(--accent); border-radius: var(--radius-full); padding: 3px 12px; font-size: var(--fs-small); font-weight: 700; }
.sd-hero h1 { font-size: clamp(1.6rem, 4.6vw, 2.4rem); line-height: 1.25; letter-spacing: -0.02em; margin: var(--space-3) 0; font-weight: 800; color: var(--navy-900); }
.sd-lead { max-width: 680px; line-height: 1.85; margin: 0; color: var(--color-text); }
.sd-quick { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-3); margin-top: var(--space-4); }
.sd-chip { background: var(--color-surface-muted); border: 1px solid var(--color-border); border-radius: var(--radius-full); padding: 5px 14px; font-size: var(--fs-small); font-weight: 600; color: var(--color-text); }

.sd-main { max-width: var(--maxw-content); margin: 0 auto; padding: var(--space-6) var(--space-4) var(--space-12); display: grid; gap: var(--space-5); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 961px) { .sd-main { grid-template-columns: minmax(0, 1fr) 360px; align-items: start; } .sd-side { position: sticky; top: var(--space-4); } }
.sd-col { display: grid; gap: var(--space-5); min-width: 0; }
.sd-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-card); box-shadow: var(--shadow-sm); padding: var(--space-5); min-width: 0; }
.sd-card h2 { font-size: var(--fs-h2); margin: 0 0 var(--space-3); display: flex; align-items: center; gap: var(--space-2); }
.sd-map { height: 320px; border-radius: var(--radius-base); overflow: hidden; background: var(--color-surface-muted); }
.sd-map iframe { display: block; width: 100%; height: 100%; border: 0; }
.sd-map-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
.sd-dist { margin-top: var(--space-2); font-size: var(--fs-small); color: var(--color-text-sub); min-height: 1.4em; }
.sd-facts { display: grid; gap: var(--space-3); margin: 0; }
.sd-facts > div { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: var(--space-3); align-items: baseline; padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-border); }
.sd-facts > div:last-child { border-bottom: 0; padding-bottom: 0; }
.sd-facts dt { font-size: var(--fs-small); color: var(--color-text-muted); font-weight: 700; margin: 0; }
.sd-facts dd { margin: 0; line-height: 1.7; overflow-wrap: anywhere; }
/* 見どころ・楽しみ方（D-937）：ポータルトップの「どの立場でも、使えます」（.roles-grid）と同じ作りに。箱・影・角丸をやめ、
   大きな色つきの番号（01・02…）と、項目同士の間の細い線（縦線、2段になれば横線も）だけで見せる。色は番号だけに使う */
.sd-points {
  counter-reset: sdp; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0;
  list-style: none; padding: 0; margin: var(--space-3) calc(-1 * var(--space-4)) 0;
  border-top: 1px solid var(--color-border-strong); overflow: hidden;
}
.sd-points li {
  --pt-ink: var(--pastel-blue-ink);
  counter-increment: sdp; display: flex; flex-direction: column; gap: var(--space-3);
  padding: var(--space-4); background: transparent;
  box-shadow: -1px 0 0 0 var(--color-border), 0 -1px 0 0 var(--color-border);
  font-size: var(--fs-body); font-weight: 600; line-height: 1.75; color: var(--color-text);
}
.sd-points li::before {
  content: counter(sdp, decimal-leading-zero); font-size: 30px; font-weight: 800; line-height: 1; letter-spacing: -0.02em;
  color: var(--pt-ink); font-variant-numeric: tabular-nums;
}
.sd-points li:nth-child(3n+2) { --pt-ink: var(--pastel-green-ink); }
.sd-points li:nth-child(3n) { --pt-ink: var(--pastel-orange-ink); }
.sd-photos { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-3); }
.sd-photos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-base); display: block; }
.sd-note { font-size: var(--fs-small); color: var(--color-text-muted); line-height: 1.7; }
.sd-card h3 { font-size: var(--fs-h3); margin: var(--space-5) 0 var(--space-2); }
.sd-text { line-height: 1.9; margin: 0; white-space: pre-line; }
.sd-address { margin: var(--space-3) 0 0; line-height: 1.7; overflow-wrap: anywhere; }
.sd-chips { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.sd-chips li { background: var(--color-surface-muted); border-radius: var(--radius-full); padding: 6px 14px; font-size: var(--fs-small); }
.leisure-rules { margin: 0; padding-left: 1.2em; line-height: 1.8; }
.rule-law, .a11y-note { color: var(--color-text-muted); }
.sd-card a:not(.btn) { color: var(--color-info); }
.favorite-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.favorite-actions label { font-size: var(--fs-small); color: var(--color-text-sub); display: flex; align-items: center; gap: var(--space-2); }
.favorite-actions input[type="date"] { padding: var(--space-1) var(--space-2); border: 1px solid var(--color-border-strong); border-radius: var(--radius-base); background: var(--color-surface); color: var(--color-text); min-height: 40px; }
.spot-map { width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--radius-base); background: var(--color-surface-muted); display: flex; align-items: center; justify-content: center; }
.no-photo { color: var(--color-text-muted); font-size: var(--fs-small); padding: var(--space-3) 0; }
.sd-tags { display: flex; flex-wrap: wrap; gap: var(--space-2); padding: 0; margin: 0; list-style: none; }
.sd-tags a { display: inline-block; background: var(--navy-100); color: var(--color-primary); border-radius: var(--radius-full); padding: 4px 12px; font-size: var(--fs-small); text-decoration: none; }
.sd-tags a:hover { background: var(--color-primary); color: var(--color-text-inverse); }

/* ── 入力フォーム（選ぶだけ） ────────────────────────────────────────── */
.slf { display: grid; gap: var(--space-4); }
.slf-lead { font-size: var(--fs-small); color: var(--color-text-sub); margin: 0; line-height: 1.7; }
.slf-group { display: grid; gap: var(--space-3); padding: var(--space-4); background: var(--color-surface-muted); border-radius: var(--radius-card); }
.slf-group-title { font-weight: 700; font-size: var(--fs-h4); color: var(--color-primary); }
.slf-grid { display: grid; gap: var(--space-3); grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); align-items: start; }
.slf-field { display: grid; gap: 6px; align-content: start; font-size: var(--fs-small); font-weight: 600; border: 0; padding: 0; margin: 0; min-width: 0; }
.slf-field legend { padding: 0; margin-bottom: 6px; font-size: var(--fs-small); font-weight: 600; }
.slf-hint { font-weight: 400; color: var(--color-text-muted); margin-left: 8px; }
.slf-field .form-input { width: 100%; box-sizing: border-box; }
.slf-other[hidden] { display: none; }
.slf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.slf-chip, .slf-seg { position: relative; cursor: pointer; }
.slf-chip input, .slf-seg input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.slf-chip span, .slf-seg span {
  display: inline-flex; align-items: center; min-height: 40px; padding: 6px 14px; border-radius: var(--radius-full);
  border: 1px solid var(--color-border-strong); background: var(--color-surface); color: var(--color-text);
  font-size: var(--fs-small); font-weight: 600; transition: background .12s, border-color .12s, color .12s;
}
.slf-chip input:checked + span, .slf-seg input:checked + span { background: var(--color-primary); border-color: var(--color-primary); color: var(--color-text-inverse); }
html.dark .slf-chip input:checked + span, html.dark .slf-seg input:checked + span { color: #06264D; }
.slf-chip input:focus-visible + span, .slf-seg input:focus-visible + span { outline: 3px solid var(--color-accent); outline-offset: 2px; }
.slf-segs { display: flex; flex-wrap: wrap; gap: 8px; }
.slf-chip-groups { display: grid; gap: var(--space-3); }
.slf-chip-group-label { font-size: var(--fs-tiny); font-weight: 700; color: var(--color-text-muted); margin-bottom: 6px; letter-spacing: .04em; }
.slf-loc { display: grid; gap: var(--space-3); padding: var(--space-4); background: var(--color-surface-muted); border-radius: var(--radius-card); }
.slf-loc-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.slf-loc-map { height: 280px; border-radius: var(--radius-base); overflow: hidden; border: 1px solid var(--color-border); }

/* ── スマホ ─────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .lz-grid { grid-template-columns: minmax(0, 1fr); }
  .lz-search-row input[type="search"], .lz-search-row input[type="text"], .lz-search-row select { flex: 1 1 100%; }
  .sd-facts > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .sd-card { padding: var(--space-4); }
  .sd-map { height: 260px; }
}

/* スマホ・タブレット（1列）では、地図と基本情報を先に出す（「どこにあるか」が一番知りたいため） */
@media (max-width: 960px) {
  .sd-main { display: flex; flex-direction: column; gap: var(--space-5); }
  .sd-col { display: contents; }
  .sd-card { order: 4; }
  .sd-card-map { order: 1; }
  .sd-card-basics { order: 2; }
  .leisure-info { order: 3; }
  .favorite-actions { order: 5; }
  .dashboard-rail { order: 6; }
}

/* .btn等のdisplay指定に負けず、hidden属性で確実に隠す */
.lz-main [hidden], .slf [hidden], .slf-loc [hidden] { display: none !important; }

/* 「地図を動かす」ボタン（一覧の地図。D-901）。固定中は、ページのスクロール・ピンチが地図に奪われない */
.spot-map-lock {
  margin-top: 6px; padding: 6px 10px; border: 1px solid var(--color-border-strong, #b8c0cc); border-radius: 8px;
  background: var(--color-surface, #fff); color: var(--color-text, #1f2937); font: inherit; font-size: 13px; font-weight: 700;
  cursor: pointer; box-shadow: 0 1px 4px rgb(0 0 0 / 20%);
}
.spot-map-lock:hover { border-color: var(--color-primary, #06264d); }
.spot-map-lock:focus-visible { outline: 3px solid var(--color-accent, #0146d1); outline-offset: 2px; }
.leaflet-container.is-locked { cursor: default; touch-action: pan-y pinch-zoom; }

.lz-morewrap { display: flex; justify-content: center; margin-top: var(--space-5); }
/* 並びの親が中身の幅に引っ張られないように（スマホで横にはみ出さない） */
.lz-main, .lz-panel, .lz-search-row, .lz-filters { min-width: 0; max-width: 100%; }

/* この場所でイベントを企画する（D-912） */
.sd-plan-lead { margin: 0 0 var(--space-3); line-height: 1.8; }

/* 体験するの小分類（狩り・収穫／〜づくり／〜遊び・釣り。D-914） */
.lz-subthemes { margin-top: var(--space-2); padding-left: var(--space-3); }
.lz-subthemes[hidden] { display: none; }

/* この地域の決まり（条例）（D-915） */
.sd-localrules { margin: 0; padding-left: 1.3em; line-height: 2; }

/* 情報の修正依頼・場所の情報提供フォーム（D-918） */
.pr-box { margin-top: var(--space-2); }
.pr-box > summary { cursor: pointer; font-weight: 700; color: var(--navy-900); }
.pr-form { display: grid; gap: var(--space-2); margin-top: var(--space-2); }
.pr-form select, .pr-form input[type="text"], .pr-form textarea { width: 100%; padding: var(--space-2); border: 1px solid var(--color-border); border-radius: var(--radius-base); background: var(--color-surface); color: var(--color-text); font: inherit; box-sizing: border-box; }
.pr-row { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.pr-field { display: grid; gap: 4px; }
.pr-label { font-size: var(--fs-small); font-weight: 700; color: var(--color-text); }
.pr-hint { font-size: var(--fs-tiny); color: var(--color-text-muted); }
.pr-mine { font-size: var(--fs-small); color: var(--color-info); }
.pr-lead, .pr-note, .pr-pos { margin: 0; font-size: var(--fs-small); color: var(--color-text-sub); line-height: 1.7; }
.pr-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pr-msg { margin: 0; font-size: var(--fs-small); min-height: 1.2em; }
.pr-ok { color: var(--status-active, #1a7f37); }
.pr-err { color: var(--color-danger, #b3261e); }