:root{--aqua:#63bec1;--aqua-dark:#158f95;--lime:#9dce35;--ink:#174e55;--muted:#6b8587;--paper:#fff;--line:#d6e9e7;--shadow:0 13px 30px rgba(29,102,103,.11)}*{box-sizing:border-box}html,body{margin:0;background:#dff1ef;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Noto Sans KR",sans-serif}body{display:flex;justify-content:center}button,a{font:inherit}.app{width:min(100%,430px);min-height:100vh;background:#f9fcfb;box-shadow:0 0 42px rgba(32,99,99,.12)}.screen{display:none}.screen.active{display:block}
.compact-hero{height:218px;position:relative;overflow:hidden;background:#174e55}.hero-photo{width:100%;height:100%;object-fit:cover;object-position:52% 56%}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,46,48,.72),rgba(5,48,49,.17) 72%),linear-gradient(180deg,rgba(0,0,0,.03),rgba(2,42,43,.58))}.hero-logo{position:absolute;left:16px;top:15px;color:#fff;font-size:11px;font-weight:900;letter-spacing:.03em}.hero-copy{position:absolute;left:16px;right:14px;bottom:55px;color:#fff}.hero-copy small{font-size:9px;letter-spacing:.18em}.hero-copy h1{margin:5px 0 3px;font:900 31px/.92 Arial,sans-serif;color:#b3dc36;max-width:280px}.hero-copy p{margin:0;font-size:12px}.hero-foot{position:absolute;left:0;right:0;bottom:0;height:43px;background:rgba(92,188,192,.94);display:flex;align-items:center;justify-content:space-between;padding:6px 14px;color:#fff}.hero-icons{display:flex;gap:5px}.hero-icons img{width:25px;height:25px;object-fit:contain}.hero-foot strong{font-size:12px;letter-spacing:.02em}
.map-section{padding:18px 12px 8px}.section-heading{padding:0 4px 10px}.section-heading.compact{display:flex;justify-content:space-between;align-items:end;gap:10px}.section-heading small{display:block;color:var(--aqua-dark);font-size:9px;font-weight:900;letter-spacing:.13em}.section-heading h2{margin:4px 0 0;font:700 22px Georgia,"Noto Serif KR",serif}.section-heading p{margin:0;color:var(--muted);font-size:10.5px;text-align:right;max-width:150px;line-height:1.4}.map-card{background:#c9eaec;border-radius:23px;padding:10px 8px 8px;box-shadow:var(--shadow);overflow:visible}.interactive-map{display:block;width:100%;height:auto;overflow:visible}.region-shape{fill:#a7d158;stroke:#f6ffff;stroke-width:.58;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round;cursor:pointer;transition:fill .14s ease,filter .14s ease}.region-shape:hover,.region-shape.selected{fill:#159ca2;filter:drop-shadow(0 4px 5px rgba(14,101,105,.18))}.site-marker{pointer-events:none}.site-marker circle{stroke:#fff;stroke-width:1.35;vector-effect:non-scaling-stroke}.site-marker text{fill:#fff;font-size:6.1px;font-weight:900;text-anchor:middle;dominant-baseline:middle}.city-label{fill:#356d6b;font-size:12.5px;font-weight:900;text-anchor:middle;dominant-baseline:middle;pointer-events:none;paint-order:stroke;stroke:#edf9f5;stroke-width:3px}.city-count{fill:#487d77;font-size:8.8px;font-weight:800;text-anchor:middle;dominant-baseline:middle;pointer-events:none;paint-order:stroke;stroke:#edf9f5;stroke-width:3px}.city-label.active,.city-count.active{fill:#fff;stroke:#159ca2;stroke-width:2px}.selected-hint{margin-top:9px;border:1px solid var(--line);border-radius:999px;background:#fff;padding:9px 11px;text-align:center;color:#537574;font-size:12px}
.theme-section{padding:8px 12px 15px}.theme-head{padding-bottom:8px}.theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.theme-card{min-height:62px;display:flex;align-items:center;gap:6px;background:linear-gradient(180deg,var(--soft),#fff);border:1px solid var(--line);border-radius:15px;padding:8px 7px;box-shadow:0 7px 18px rgba(29,102,103,.07);cursor:pointer}.theme-card img{width:29px;height:29px;flex:0 0 29px}.theme-card small{display:block;font-size:8.4px;line-height:1.2;color:#607977;font-weight:800}.theme-card strong{display:block;font-size:12px;color:var(--theme);margin-top:2px}.partners{display:grid;grid-template-columns:1fr 1fr .72fr;gap:6px;padding:3px 12px 24px}.partners>div{height:46px;background:#fff;border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;padding:6px;box-shadow:0 7px 18px rgba(29,102,103,.07)}.partners img{max-width:100%;max-height:28px;object-fit:contain}.cosjob{flex-direction:column}.cosjob b{font-size:12px;color:#46714f}.cosjob span{font-size:7px;color:#899a91}
.topbar{position:sticky;top:0;z-index:10;background:rgba(250,253,252,.95);backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:space-between;padding:14px;border-bottom:1px solid var(--line)}.back-nav{display:flex;align-items:center;gap:4px;border:0;background:#fff;border-radius:999px;padding:9px 12px;color:#46706e;box-shadow:var(--shadow)}.back-nav span{font-size:20px;line-height:1}.back-nav b{font-size:13px}.topbar-copy small{display:block;color:var(--aqua-dark);font-size:10px;font-weight:900}.topbar-copy h2{margin:3px 0 0;font:700 23px Georgia,"Noto Serif KR",serif}.count-pill{background:#e3f4ef;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:900}.filters{padding:12px 14px;display:flex;gap:8px;overflow-x:auto}.filters button{white-space:nowrap;border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 14px;color:#527271}.filters button.on{background:var(--aqua-dark);color:#fff}.place-list{padding:0 14px 25px;display:grid;gap:13px}.place-card{background:#fff;border:1px solid var(--line);border-radius:21px;overflow:hidden;box-shadow:var(--shadow);cursor:pointer}.place-photo{height:190px;background:center/cover no-repeat;position:relative}.place-photo:after{content:"";position:absolute;inset:auto 0 0;height:50%;background:linear-gradient(transparent,rgba(12,65,64,.48))}.place-ribbon,.place-year,.place-number{position:absolute;top:12px;z-index:2;border-radius:999px;padding:6px 10px;font-size:10px;font-weight:900}.place-number{left:12px;background:#fff;color:#157f82}.place-ribbon{left:52px;color:#fff}.place-year{right:12px;background:#fff}.place-gallery-controls{position:absolute;z-index:3;left:10px;right:10px;top:50%;display:flex;justify-content:space-between;transform:translateY(-50%)}.place-gallery-controls button{width:34px;height:34px;border-radius:50%;border:0;background:#ffffffea;color:#386b68;font-size:24px;display:grid;place-items:center;line-height:1;padding:0;box-shadow:0 5px 14px rgba(0,0,0,.12)}.place-gallery-controls button span{display:block;transform:translateY(-1px)}.place-body{padding:15px}.place-body h3{margin:0 0 4px;font-size:18px}.place-body>p{margin:0;color:#7b8d8b;font-size:13px}.meta-grid{margin-top:10px;padding-top:10px;border-top:1px solid #edf3f1;display:grid;gap:7px}.meta-grid div{display:grid;grid-template-columns:70px 1fr;gap:8px;font-size:12px}.meta-grid span{color:#8b9b99}.meta-grid strong{line-height:1.5}.detail-hero{height:47vh;min-height:340px;background:center/cover no-repeat;position:relative;transition:background-image .2s}.detail-overlay{position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.18),transparent 48%,rgba(0,0,0,.25))}.back-nav.floating{position:absolute;left:15px;top:18px;z-index:4}.gallery-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;border:0;width:42px;height:42px;border-radius:50%;background:#ffffffee;color:#376d6a;box-shadow:var(--shadow);display:grid;place-items:center;padding:0;line-height:1}.gallery-arrow span{display:block;font-size:31px;line-height:1;transform:translateY(-1px)}.gallery-arrow.prev{left:14px}.gallery-arrow.next{right:14px}.detail-top{position:absolute;right:14px;top:18px;z-index:4;display:flex;gap:7px}.number-badge,.theme-badge{border-radius:999px;padding:7px 10px;font-size:11px;font-weight:900}.number-badge{background:#fff;color:#157f82}.gallery-dots{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:flex;gap:6px;z-index:4}.gallery-dots button{border:0;width:8px;height:8px;border-radius:50%;background:#ffffff8f;padding:0}.gallery-dots button.on{width:18px;border-radius:999px;background:#fff}.detail-content{position:relative;margin-top:-28px;background:#fff;border-radius:28px 28px 0 0;padding:24px 20px 36px}.detail-city{color:var(--aqua-dark);font-size:11px;font-weight:900}.detail-content h2{margin:6px 0 12px;font:700 28px/1.25 Georgia,"Noto Serif KR",serif}.official-copy,.healing-card,.program-panel,.info-table{border:1px solid var(--line);border-radius:18px;padding:15px;background:#fbfdfc;margin-bottom:13px}.official-copy small,.healing-card strong,.program-head{display:block;color:var(--aqua-dark);font-size:11px;font-weight:900;margin-bottom:6px}.official-copy p,.healing-card p{margin:0;line-height:1.7;color:#5d7472}.program-panel ul{margin:0;padding-left:18px;line-height:1.75}.info-table{padding:4px 15px}.info-table div{display:grid;grid-template-columns:72px 1fr;gap:11px;padding:12px 0;border-top:1px solid #edf3f1;font-size:13px;line-height:1.5}.info-table div:first-child{border-top:0}.info-table span{color:#879795}.info-table strong,.info-table a{color:#466561;text-decoration:none}.action-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.action-btn{text-align:center;text-decoration:none;border:1px solid #78acaa;border-radius:14px;padding:14px;color:#397573;font-weight:900}.action-btn.primary{background:var(--aqua-dark);color:#fff}.source-note,.notice{font-size:10.5px;color:#819391;line-height:1.55}.empty{background:#fff;border:1px solid var(--line);border-radius:18px;padding:25px;text-align:center}@media(max-width:430px){.app{box-shadow:none}}


/* V8 reference-map refinements */
.map-card{background:#c8e6e5;padding:8px;border-radius:23px;overflow:hidden}
.interactive-map{width:100%;height:auto;display:block;overflow:visible}
.map-reference{pointer-events:none}
.region-hit{fill:transparent;stroke:none;cursor:pointer;transition:fill .16s ease,filter .16s ease}
.region-hit:hover{fill:rgba(48,164,167,.24)}
.region-hit.selected{fill:rgba(33,150,154,.42);filter:drop-shadow(0 3px 4px rgba(20,106,109,.16))}
/* Hide legacy vector region styling because the visible linework now comes only from the uploaded map image. */
.region-shape{display:none}
.city-count-group{pointer-events:none;transition:opacity .16s ease}
.city-count-group rect{fill:rgba(255,255,255,.9);stroke:#a8d2cf;stroke-width:.7}
.city-count-group text{fill:#3b7776;font-size:9.5px;font-weight:900;text-anchor:middle;dominant-baseline:middle;paint-order:stroke;stroke:#fff;stroke-width:1.5px}
.city-count-group.active rect,.city-count-group.selected rect{fill:#168f94;stroke:#fff}
.city-count-group.active text,.city-count-group.selected text{fill:#fff;stroke:#168f94}
.site-marker{pointer-events:none}
.site-marker .marker-halo{fill:#fff;stroke:rgba(255,255,255,.95);stroke-width:1.6;filter:drop-shadow(0 1.5px 2px rgba(23,78,85,.24))}
.site-marker .marker-core{stroke:#fff;stroke-width:1}
.site-marker text{font-size:6.5px;font-weight:900;text-anchor:middle;dominant-baseline:middle;fill:#fff;paint-order:stroke;stroke:rgba(18,74,76,.35);stroke-width:.7px}
/* The uploaded reference map contains the complete outer edge, so the full shape is never clipped. */
#interactiveMap{overflow:visible}
/* Remove the former top logo text entirely. */
.hero-logo{display:none!important}
/* More colorful brochure number badges on cards and detail pages. */
.place-number{background:var(--number-color,#168f94)!important;color:#fff!important;border:2px solid rgba(255,255,255,.92);box-shadow:0 4px 12px rgba(0,0,0,.12)}
.number-badge{background:var(--number-color,#168f94)!important;color:#fff!important;border:2px solid rgba(255,255,255,.95);box-shadow:0 5px 14px rgba(0,0,0,.15);min-width:34px;text-align:center}

/* V9: 숫자 없는 색상 점 마커 + 지역명 가독성 개선 */
.site-marker text{display:none!important}
.site-marker .marker-halo{
  fill:rgba(255,255,255,.95)!important;
  stroke:rgba(255,255,255,.98)!important;
  stroke-width:1.05!important;
  filter:drop-shadow(0 1px 1.5px rgba(23,78,85,.18))!important
}
.site-marker .marker-core{stroke:#fff!important;stroke-width:.75!important}
.city-count-group rect{fill:rgba(255,255,255,.94)!important}
.city-count-group text{font-size:8.7px!important;stroke-width:1.2px!important}
.overlay-city-label{
  fill:#5a817e;
  font-size:12.4px;
  font-weight:900;
  text-anchor:middle;
  dominant-baseline:middle;
  pointer-events:none;
  paint-order:stroke;
  stroke:rgba(255,255,255,.98);
  stroke-width:4.2px;
  stroke-linejoin:round
}
.overlay-city-label.active,.overlay-city-label.selected{
  fill:#fff;
  stroke:#168f94;
  stroke-width:2.4px
}
.partners .cosjob{padding:7px 9px!important}
.partners .cosjob img{
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:30px;
  object-fit:contain
}

/* V10 refinements */
.overlay-city-label{font-size:13.6px!important;stroke-width:4.6px!important;fill:#557d7b!important}
.city-count-group text{font-size:9.4px!important;stroke-width:1.35px!important}
.city-count-group rect{stroke-width:.8!important}
.partners .cosjob img{max-height:26px!important}

/* V11 refinements */
.section-heading.compact{align-items:flex-start}
.section-heading p{max-width:132px;word-break:keep-all;white-space:normal;text-align:right;line-height:1.45}
.overlay-city-label.active,.overlay-city-label.selected,
.city-count-group.active text,.city-count-group.selected text{
  fill:#557d7b!important;
  stroke:rgba(255,255,255,.98)!important;
  stroke-width:4.6px!important;
}
.city-count-group.active rect,.city-count-group.selected rect{
  fill:rgba(255,255,255,.94)!important;
  stroke:#a8d2cf!important;
}
.partners{grid-template-columns:1fr 1fr .82fr!important}
.partners>div{height:48px!important}
.partners .cosjob{padding:5px 8px!important}
.partners .cosjob img{max-height:34px!important}

.place-kto{position:absolute;right:12px;top:12px;z-index:2;border-radius:999px;padding:6px 10px;font-size:9.5px;font-weight:900;background:rgba(255,255,255,.94);color:#b95c25;border:1px solid #f4c187;box-shadow:0 6px 16px rgba(0,0,0,.10);display:flex;align-items:center;gap:4px;white-space:nowrap}
.place-kto b{font-size:10px;line-height:1;color:#e28722}
.place-year{display:none!important}


/* V13: 테마 카드와 협력 기관 세로 라인 정렬 */
.theme-section{padding-left:12px!important;padding-right:12px!important}
.theme-grid,.partners{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  column-gap:7px!important;
  row-gap:7px!important;
}
.partners{padding:3px 12px 24px!important}
.partners>div{width:100%;min-width:0;height:48px!important;padding:6px!important}
.partners img{max-width:100%;height:auto;object-fit:contain}
.partners .cosjob{padding:5px 7px!important}
.partners .cosjob img{max-height:33px!important}

/* V13: 블러 배경 + 움직이는 힐링 링 인트로 */
body.intro-active{overflow:hidden}
body.intro-active .app{
  filter:blur(8px) saturate(.78);
  transform:scale(1.018);
  transition:filter .75s ease,transform .75s ease;
}
body:not(.intro-active) .app{
  filter:none;
  transform:none;
  transition:filter .75s ease,transform .75s ease;
}
.site-intro{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:rgba(238,248,235,.42);
  -webkit-backdrop-filter:blur(13px) saturate(.85);
  backdrop-filter:blur(13px) saturate(.85);
  opacity:1;
  visibility:visible;
  transition:opacity .78s ease,visibility .78s ease;
}
.site-intro.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.intro-skip{
  position:absolute;
  top:calc(18px + env(safe-area-inset-top));
  right:18px;
  z-index:4;
  border:1px solid rgba(77,123,66,.22);
  border-radius:999px;
  padding:8px 12px;
  background:rgba(255,255,255,.76);
  color:#4f7449;
  font-size:11px;
  font-weight:800;
  box-shadow:0 8px 22px rgba(55,93,50,.08);
}
.intro-scene{
  width:min(100%,430px);
  padding:0 20px;
  text-align:center;
  transform:translateY(-2vh);
}
.intro-track{
  position:relative;
  width:100%;
  height:146px;
  opacity:0;
  animation:introTrackIn .55s ease .18s forwards;
}
.intro-line{
  position:absolute;
  left:7%;
  right:7%;
  top:50%;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(108,158,86,.05),#8cbd70 18%,#6e9f5d 50%,#8cbd70 82%,rgba(108,158,86,.05));
  box-shadow:0 0 18px rgba(108,158,86,.22);
  transform:scaleX(0);
  transform-origin:center;
  animation:introLineGrow .85s cubic-bezier(.2,.8,.2,1) .28s forwards;
}
.ring-traveler{
  position:absolute;
  left:7%;
  top:50%;
  width:92px;
  height:92px;
  margin-top:-46px;
  margin-left:-46px;
  animation:ringTravel 3.15s cubic-bezier(.35,.02,.25,1) .58s forwards;
}
.healing-ring{
  position:relative;
  width:92px;
  height:92px;
  border:3px solid rgba(96,151,76,.92);
  border-radius:50%;
  background:rgba(251,255,249,.72);
  box-shadow:0 0 0 7px rgba(131,183,107,.11),0 14px 30px rgba(58,104,49,.18);
  animation:ringSpin 3.15s linear .58s forwards;
}
.ring-core{
  position:absolute;
  inset:50% auto auto 50%;
  width:13px;
  height:13px;
  border-radius:50%;
  transform:translate(-50%,-50%);
  background:#79ad61;
  box-shadow:0 0 0 7px rgba(121,173,97,.13);
}
.ring-icon{
  --angle:0deg;
  position:absolute;
  left:50%;
  top:50%;
  width:30px;
  height:30px;
  margin:-15px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.95);
  border:1px solid rgba(112,163,91,.26);
  box-shadow:0 5px 13px rgba(54,92,48,.12);
  transform:rotate(var(--angle)) translateY(-49px) rotate(calc(-1 * var(--angle)));
}
.ring-icon img{width:22px;height:22px;object-fit:contain}
.ring-icon-1{--angle:0deg}.ring-icon-2{--angle:60deg}.ring-icon-3{--angle:120deg}
.ring-icon-4{--angle:180deg}.ring-icon-5{--angle:240deg}.ring-icon-6{--angle:300deg}
.intro-message{
  margin-top:-7px;
  opacity:0;
  transform:translateY(12px);
  animation:introMessageIn .82s ease 1.18s forwards;
}
.intro-message small{
  display:block;
  margin-bottom:9px;
  color:#619153;
  font-size:10px;
  font-weight:900;
  letter-spacing:.2em;
}
.intro-message h1{
  margin:0;
  color:#36573d;
  font:700 28px/1.3 Georgia,"Noto Serif KR",serif;
  text-shadow:0 1px 0 rgba(255,255,255,.9);
}
@keyframes introTrackIn{to{opacity:1}}
@keyframes introLineGrow{to{transform:scaleX(1)}}
@keyframes ringTravel{
  0%{left:7%;transform:scale(.84);opacity:0}
  9%{opacity:1}
  50%{transform:scale(1.08)}
  91%{opacity:1}
  100%{left:93%;transform:scale(.84);opacity:0}
}
@keyframes ringSpin{to{transform:rotate(720deg)}}
@keyframes introMessageIn{to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){
  .ring-traveler,.healing-ring,.intro-track,.intro-line,.intro-message{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important}
  .ring-traveler{left:50%!important;opacity:1!important;transform:none!important}
}

/* V18: clean professional vector map */
.map-card{
  background:
    radial-gradient(circle at 78% 18%, rgba(255,255,255,.42), transparent 22%),
    linear-gradient(180deg,#cfecee 0%,#e9f6f6 100%) !important;
  border:1px solid rgba(141,205,205,.72) !important;
  border-radius:24px !important;
  padding:14px 12px 12px !important;
  overflow:hidden !important;
}
#interactiveMap{
  overflow:visible !important;
}
.map-reference{
  display:none !important;
}
#regionLayer,#regions{
  filter:drop-shadow(0 5px 8px rgba(56,104,116,.16));
}
.region-hit{
  fill:#ffffff !important;
  stroke:#d9e8e8 !important;
  stroke-width:1.05 !important;
  vector-effect:non-scaling-stroke;
  stroke-linejoin:round;
  stroke-linecap:round;
  cursor:pointer;
  transition:fill .18s ease, stroke .18s ease, filter .18s ease;
}
.region-hit:hover,
.region-hit.active{
  fill:#d9f0ef !important;
  stroke:#78c2c4 !important;
  filter:none !important;
}
.region-hit.selected{
  fill:#93d0d0 !important;
  stroke:#ffffff !important;
  filter:drop-shadow(0 4px 5px rgba(32,120,125,.16)) !important;
}
.city-count-group rect{
  fill:rgba(255,255,255,.96) !important;
  stroke:#8ccccc !important;
  stroke-width:.75 !important;
}
.city-count-group text{
  fill:#317173 !important;
  stroke:#fff !important;
  stroke-width:1.45 !important;
}
.city-count-group.active rect,
.city-count-group.selected rect{
  fill:rgba(255,255,255,.96) !important;
  stroke:#8ccccc !important;
}
.city-count-group.active text,
.city-count-group.selected text{
  fill:#317173 !important;
  stroke:#fff !important;
}
.overlay-city-label{
  fill:#506d68 !important;
  font-size:13.4px !important;
  font-weight:900 !important;
  stroke:rgba(255,255,255,.98) !important;
  stroke-width:4.6px !important;
  paint-order:stroke !important;
}
.overlay-city-label.active,
.overlay-city-label.selected{
  fill:#506d68 !important;
  stroke:rgba(255,255,255,.98) !important;
  stroke-width:4.6px !important;
}