.d214-map-app {
  --d214-blue: #004165;
  --d214-yellow: #f2df74;
  --d214-dark: #1f2933;
  --d214-muted: #5b6773;
  --d214-border: #d9dee4;
  --d214-bg: #ffffff;
  --d214-soft: #f7f8fa;
  font-family: inherit;
  color: var(--d214-dark);
  max-width: 1280px;
  margin: 0 auto;
}
.d214-map-header { margin-bottom: 1rem; }
.d214-map-header h2 { margin: 0 0 .35rem 0; font-size: clamp(1.6rem, 2.5vw, 2.4rem); }
.d214-map-header p { margin: 0; color: var(--d214-muted); max-width: 920px; }
.d214-map-layout { display: grid; grid-template-columns: minmax(260px, 330px) 1fr; gap: 1rem; align-items: stretch; }
.d214-map-controls { background: var(--d214-soft); border: 1px solid var(--d214-border); border-radius: 18px; padding: .9rem; display: flex; flex-direction: column; gap: .85rem; max-height: 720px; overflow: auto; }
.d214-map-main { min-width: 0; }
.d214-search-wrap { position: relative; }
.d214-search-wrap label { display: block; font-weight: 700; margin-bottom: .35rem; }
.d214-club-search { width: 100%; padding: .78rem .9rem; border: 1px solid var(--d214-border); border-radius: 12px; font-size: 1rem; background: #fff; }
.d214-reset-btn, .d214-division-btn, .d214-area-btn { border: 1px solid var(--d214-border); background: #fff; border-radius: 999px; padding: .58rem .75rem; cursor: pointer; font-weight: 700; transition: transform .12s ease, box-shadow .12s ease, background .12s ease; }
.d214-reset-btn { border-radius: 12px; background: var(--d214-blue); color: #fff; border-color: var(--d214-blue); width: 100%; }
.d214-reset-btn:hover, .d214-division-btn:hover, .d214-area-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,.08); }
.d214-division-btn.is-active, .d214-area-btn.is-active { background: var(--d214-yellow); color: #111; border-color: #d5c25e; }
.d214-filter-accordion { background: #fff; border: 1px solid var(--d214-border); border-radius: 14px; padding: .25rem .65rem .65rem; }
.d214-filter-accordion summary { cursor: pointer; font-weight: 800; padding: .55rem 0; color: var(--d214-blue); }
.d214-small-note { margin: 0 0 .65rem 0; font-size: .88rem; color: var(--d214-muted); }
.d214-division-buttons, .d214-area-buttons { display: flex; flex-wrap: wrap; gap: .42rem; }
.d214-division-btn, .d214-area-btn { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; }
.d214-division-dot { width: .72rem; height: .72rem; border-radius: 999px; display: inline-block; flex: 0 0 auto; border: 1px solid rgba(0,0,0,.18); }
.d214-map-status { font-weight: 700; margin: 0 0 .5rem 0; color: var(--d214-blue); }
.d214-map-canvas { border: 1px solid var(--d214-border); border-radius: 18px; overflow: hidden; min-height: 520px; background: #eef2f5; }
.d214-results-summary { margin: .85rem 0 1.2rem 0; color: var(--d214-muted); font-weight: 600; }
.d214-search-results { display: none; position: absolute; z-index: 5000; top: calc(100% + .25rem); left: 0; right: 0; background: #fff; border: 1px solid var(--d214-border); border-radius: 12px; box-shadow: 0 12px 30px rgba(0,0,0,.12); max-height: 280px; overflow: auto; }
.d214-search-results.is-open { display: block; }
.d214-search-result { padding: .75rem .9rem; border-bottom: 1px solid #edf0f3; cursor: pointer; }
.d214-search-result:hover { background: var(--d214-soft); }
.d214-search-result strong { display: block; }
.d214-search-result span { color: var(--d214-muted); font-size: .9rem; }
.d214-virtual-list-wrap { border-top: 3px solid var(--d214-yellow); padding-top: 1rem; margin-top: 1.25rem; }
.d214-virtual-list-wrap h3 { margin: 0 0 .35rem 0; font-size: 1.15rem; }
.d214-virtual-intro { margin: 0 0 .85rem 0; color: var(--d214-muted); }
.d214-virtual-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: .75rem; }
.d214-virtual-card { border: 1px solid var(--d214-border); border-radius: 14px; padding: .9rem; background: #fff; text-align: left; font: inherit; cursor: pointer; color: inherit; }
.d214-virtual-card:hover, .d214-virtual-card.is-active { border-color: var(--d214-blue); box-shadow: 0 6px 18px rgba(0,0,0,.08); }
.d214-card-head { display: flex !important; align-items: center; gap: .45rem; margin-bottom: .25rem; }
.d214-virtual-card strong { display: block; }
.d214-virtual-card span { display: block; color: var(--d214-muted); font-size: .92rem; }
.d214-virtual-card .d214-card-head strong { color: var(--d214-dark); font-size: .98rem; }
.d214-virtual-card .d214-card-meta { color: var(--d214-blue); font-weight: 800; }
.d214-virtual-card .d214-card-reason { margin-top: .35rem; font-size: .85rem; font-weight: 700; }
.d214-virtual-detail { margin-top: .9rem; }
.d214-virtual-detail .d214-popup-card { max-width: 680px; border: 1px solid var(--d214-border); border-radius: 14px; padding: 1rem; background: #fff; box-shadow: 0 6px 18px rgba(0,0,0,.06); }
.d214-popup-card { min-width: 240px; max-width: 330px; line-height: 1.4; }
.d214-popup-title { font-weight: 800; margin-bottom: .45rem; font-size: .98rem; color: #111827; }
.d214-popup-line { color: #374151; margin: .08rem 0; }
.d214-popup-sep { color: #9ca3af; margin: 0 .25rem; }
.d214-popup-spacer { height: .45rem; }
.d214-popup-section-title { font-weight: 800; margin: .85rem 0 .35rem 0; color: #111827; }
.d214-popup-location { margin-top: .7rem; font-style: italic; color: #4b5563; }
.d214-popup-card a { color: var(--d214-blue); font-weight: 700; word-break: break-word; }
@media (max-width: 980px) {
  .d214-map-layout { grid-template-columns: 1fr; }
  .d214-map-controls { max-height: none; }
  .d214-map-canvas { min-height: 500px; }
}
@media (max-width: 640px) {
  .d214-map-canvas { min-height: 460px; }
  .d214-virtual-list { grid-template-columns: 1fr; }
}
