/* ===== 전국 법원 찾기 ===== */
/* 모바일 우선 · 고령자 포함 전 국민 UX: 큰 글씨, 고대비, 큰 터치 영역 */
/* 테마: 차분한 네이비 + 버건디 포인트 */

:root {
  --c-primary: #1f3a63;       /* 네이비 */
  --c-primary-dark: #142a49;
  --c-accent: #7a1f2b;        /* 버건디 (강조·경고성 링크) */
  --c-bg: #f5f6f8;
  --c-card: #ffffff;
  --c-text: #111417;
  --c-text-sub: #40474f;
  --c-line: #d4d9e0;
  --c-green: #1a7f37;
  --c-blue: #0b5cad;
  --c-sky: #1f7fbf;
  --c-purple: #6f42c1;
  --c-orange: #b54a00;
  --c-red: #b02a37;
  --c-call: #1a7f37;
  --fs-base: 18px;
  --fs-name: 23px;
  --fs-tab: 21px;
}

/* 글자 크게 모드 (JS로 body에 부여) */
body.font-lg {
  --fs-base: 21px;
  --fs-name: 26px;
  --fs-tab: 23px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--c-bg);
  color: var(--c-text);
  font-family: -apple-system, BlinkMacSystemFont, "Malgun Gothic", "맑은 고딕",
    "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  font-size: var(--fs-base);
  line-height: 1.55;
  -webkit-text-size-adjust: 100%;
  /* 더블탭 확대가 버튼 탭을 삼키지 않도록 (핀치 확대는 그대로 가능) */
  touch-action: manipulation;
}

/* 데스크톱 전용 커스텀 커서: 법봉(gavel) 실루엣 — 점잖은 단색 */
@media (pointer: fine) {
  body {
    cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'><g fill='%232e3a4d'><rect x='16.5' y='4' width='7' height='14' rx='3' transform='rotate(-45 20 11)'/><rect x='11.3' y='11' width='3.4' height='16' rx='1.7' transform='rotate(45 13 19)'/><rect x='4' y='27' width='15' height='3.2' rx='1.4'/></g></svg>") 6 6, auto;
  }
  a, button, [role="button"], select, input, .map-sido, .sub-sgg { cursor: pointer; }
  input[type="search"], input[type="text"] { cursor: text; }
}

button {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

a { color: var(--c-primary); }

.wrap {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 12px 40px;
}

/* ===== 헤더 ===== */
header.site-head {
  background: var(--c-primary);
  color: #fff;
  padding: 14px 12px 12px;
}
.site-head .head-inner {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.site-title {
  font-size: 19px;
  font-weight: 800;
  margin: 0;
  letter-spacing: -0.5px;
  line-height: 1.25;
  word-break: keep-all;   /* 길어진 제목이 좁은 화면에서 자연스럽게 줄바꿈(가로 스크롤 방지) */
}
body.font-lg .site-title { font-size: 21px; }
.site-title a { color:#fff; text-decoration: none; }
.brand-year {
  display: inline-block;
  font-size: 0.72em;
  background: #fff;
  color: var(--c-primary-dark);
  padding: 1px 7px 0;
  border-radius: 8px;
  vertical-align: 2px;
}
@media (min-width: 700px) {
  .site-title { font-size: 24px; }
  body.font-lg .site-title { font-size: 26px; }
}

/* 헤더 컨트롤 (스킨 토글 + 글자 크기) */
.head-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.skin-btn {
  min-width: 50px;
  min-height: 44px;
  border: 2px solid #ffffff;
  background: transparent;
  border-radius: 10px;
  font-size: 22px;
  line-height: 1;
}
.skin-btn.on {
  background: #fff;
  box-shadow: 0 0 0 3px rgba(255, 214, 245, 0.55);
}

/* 글자 크기 토글 */
.font-toggle {
  display: flex;
  gap: 6px;
}
.font-toggle button {
  min-width: 52px;
  min-height: 44px;
  border: 2px solid #ffffff;
  background: transparent;
  color: #fff;
  border-radius: 10px;
  font-weight: 700;
  font-size: 17px;
}
.font-toggle button[aria-pressed="true"] {
  background: #fff;
  color: var(--c-primary);
}
.font-toggle .btn-big { font-size: 21px; }

/* ===== 서비스 탭 (단일 서비스라 현재 미사용, 확장 대비 유지) ===== */
nav.service-tabs {
  display: flex;
  background: var(--c-primary);
  padding: 0 12px;
}
nav.service-tabs .tabs-inner {
  max-width: 760px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  gap: 8px;
}
.service-tab {
  flex: 1;
  min-height: 60px;
  font-size: var(--fs-tab);
  font-weight: 800;
  border: none;
  border-radius: 14px 14px 0 0;
  background: var(--c-primary-dark);
  color: #dbe6f5;
}
.service-tab[aria-selected="true"] {
  background: var(--c-bg);
  color: var(--c-primary-dark);
}

/* ===== 하위 탭 (찾기 / 이용 안내) ===== */
nav.sub-tabs { display: flex; margin: 14px 0 4px; }
nav.sub-tabs .tabs-inner {
  width: 100%;
  display: flex;
  gap: 8px;
}
.sub-tab {
  flex: 1;
  min-height: 52px;
  font-size: 19px;
  font-weight: 700;
  border: 2px solid var(--c-primary);
  border-radius: 12px;
  background: #fff;
  color: var(--c-primary-dark);
}
.sub-tab[aria-selected="true"] {
  background: var(--c-primary);
  color: #fff;
}
body.font-lg .sub-tab { font-size: 21px; }

/* ===== 오늘 날짜 ===== */
.today-line {
  text-align: center;
  font-size: 17px;
  font-weight: 600;
  color: var(--c-text-sub);
  margin: 12px 0 0;
}
body.font-lg .today-line { font-size: 19px; }

/* ===== 라틴어 법언 (날짜 아래 랜덤) ===== */
.law-maxim {
  text-align: center;
  margin: 14px auto 0;
  max-width: 560px;
  line-height: 1.45;
}
.law-maxim .maxim-la {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-style: italic;
  font-size: 16px;
  color: var(--c-primary-dark);
  letter-spacing: 0.2px;
}
.law-maxim .maxim-ko {
  display: block;
  font-size: 15px;
  color: var(--c-text-sub);
}
body.font-lg .law-maxim .maxim-la { font-size: 18px; }
body.font-lg .law-maxim .maxim-ko { font-size: 17px; }

/* ===== 안내 문구 ===== */
.intro-line {
  text-align: center;
  font-size: var(--fs-base);
  font-weight: 600;
  color: var(--c-text);
  background: #fff8e6;
  border: 1px solid #f0dfae;
  border-radius: 12px;
  padding: 10px 14px;
  margin: 8px 0 10px;
}

/* ===== 검색 ===== */
.search-box { position: relative; margin: 0 0 10px; }
.search-box input {
  width: 100%;
  min-height: 58px;
  font-size: 20px;
  padding: 8px 52px 8px 16px;
  border: 2px solid var(--c-primary);
  border-radius: 14px;
  background: #fff;
}
body.font-lg .search-box input { font-size: 22px; }
.search-box input:focus { outline: 3px solid #9dbdea; }
.search-box .search-icon {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 24px;
  pointer-events: none;
}
.suggest-list {
  position: absolute;
  z-index: 30;
  left: 0; right: 0;
  top: calc(100% + 4px);
  background: #fff;
  border: 2px solid var(--c-primary);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.suggest-list button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 13px 16px;
  min-height: 50px;
  border: none;
  border-bottom: 1px solid var(--c-line);
  background: #fff;
  font-size: 19px;
}
.suggest-list button:last-child { border-bottom: none; }
.suggest-list button:hover, .suggest-list button:focus { background: #e8f0fc; }
.suggest-list .sug-type {
  font-size: 15px;
  color: var(--c-text-sub);
  margin-left: 8px;
}

/* ===== 내 주변 법원 버튼 (좌표 채워지면 활성화) ===== */
.near-btn {
  width: 100%;
  min-height: 56px;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  background: var(--c-green);
  border: none;
  border-radius: 14px;
  margin-top: 12px;
}
.near-btn:active { background: #14602a; }

/* ===== 지도 ===== */
.map-area {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 8px;
  transition: max-height .35s ease;
  overflow: hidden;
}
.map-area svg {
  display: block;
  width: 100%;
  height: auto;
}
.map-sido {
  fill: #cfe0f5;
  stroke: #fff;
  stroke-width: 1.5;
  transition: fill .15s;
}
.map-sido:hover, .map-sido:focus, .map-sido.hl {
  fill: #6ea3e6;
  outline: none;
}
.map-sido.selected { fill: var(--c-primary); }
.map-label {
  cursor: pointer;
  font-weight: 800;
  fill: #14243c;
}
.map-label .cnt { font-weight: 600; fill: #33445e; }

/* 축소 상태(목록 표시 중) */
.map-area.mini { padding: 4px; }
.map-area.mini svg { max-height: 210px; }
.map-area.mini .map-sido { fill: #e3eaf3; }
.map-area.mini .map-sido.selected { fill: var(--c-primary); }
.map-area.mini .map-label { display: none; }

/* ===== 시·군·구 지도 (시·도 선택 후) ===== */
.map-area.submap { padding: 6px; }
.map-area.submap svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 340px;
  margin: 0 auto;
}
.sub-sgg {
  fill: #cfe0f5;
  stroke: #fff;
  stroke-width: 1.5;
  transition: fill .15s;
}
.sub-sgg:hover, .sub-sgg:focus { fill: #6ea3e6; outline: none; }
.sub-sgg.selected { fill: var(--c-primary); }
.sub-sgg.empty { fill: #e8eaee; }
.sub-label {
  cursor: pointer;
  font-weight: 700;
  fill: #14243c;
}
.sub-label.empty { fill: #8a919a; pointer-events: none; }

/* ===== 시·도 큰 버튼 목록 ===== */
.sido-btns {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 12px;
}
.sido-btns button {
  min-height: 58px;
  font-size: 19px;
  font-weight: 700;
  background: #fff;
  border: 2px solid var(--c-primary);
  color: var(--c-primary-dark);
  border-radius: 12px;
  line-height: 1.25;
}
.sido-btns button small {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--c-text-sub);
}
.sido-btns button:active { background: #e8f0fc; }

/* ===== 목록 화면 ===== */
.list-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 14px 0 10px;
}
.back-btn {
  min-height: 52px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  background: #fff;
  color: var(--c-primary-dark);
  border: 2px solid var(--c-primary);
  border-radius: 12px;
}
.list-title {
  font-size: 21px;
  font-weight: 800;
  margin: 0;
}
body.font-lg .list-title { font-size: 23px; }

/* 종별 탭 */
.kind-tabs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 0 8px;
  -webkit-overflow-scrolling: touch;
}
.kind-tabs button {
  flex: 0 0 auto;
  min-height: 54px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  border: 2px solid var(--c-primary);
  background: #fff;
  color: var(--c-primary-dark);
  border-radius: 27px;
  white-space: nowrap;
}
.kind-tabs button[aria-selected="true"] {
  background: var(--c-primary);
  color: #fff;
}

/* 시·군·구 / 진료과목 필터 칩 */
.chip-row {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 0 8px;
  -webkit-overflow-scrolling: touch;
}
.chip-row-label {
  font-size: 16px;
  font-weight: 700;
  color: var(--c-text-sub);
  margin: 4px 0 2px;
}
.chip-row button {
  flex: 0 0 auto;
  min-height: 46px;
  padding: 0 16px;
  font-size: 17px;
  font-weight: 600;
  border: 1.5px solid var(--c-line);
  background: #fff;
  color: var(--c-text);
  border-radius: 23px;
  white-space: nowrap;
}
.chip-row button[aria-pressed="true"] {
  background: var(--c-text);
  border-color: var(--c-text);
  color: #fff;
}

/* ===== 법원 카드 ===== */
.cards { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; }
.card {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 16px;
}
.card h3 {
  margin: 0 0 6px;
  font-size: var(--fs-name);
  line-height: 1.3;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.badge {
  display: inline-block;
  font-size: 15px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 8px;
  color: #fff;
  white-space: nowrap;
}
/* 법원 유형 뱃지 (색 + 텍스트 병기) */
.badge.b-daebeop { background: #b8901f; color: #241c00; }  /* 대법원=금색 */
.badge.b-godeung { background: var(--c-purple); }          /* 고등·전문=보라 */
.badge.b-jibang { background: var(--c-blue); }             /* 지방법원=파랑 */
.badge.b-jiwon { background: var(--c-sky); }               /* 지원=하늘 */
.badge.b-sigun { background: var(--c-green); }             /* 시·군법원=초록 */
.badge.b-deunggi { background: var(--c-orange); }          /* 등기소=주황 */
/* 법원 카드 요소 */
.card .court-parent {
  margin: 2px 0;
  font-size: calc(var(--fs-base) - 2px);
  font-weight: 700;
  color: var(--c-primary-dark);
}
.card .court-hours {
  margin: 6px 0;
  font-size: calc(var(--fs-base) - 2px);
  color: var(--c-text-sub);
  background: #eef1f6;
  border-radius: 10px;
  padding: 8px 10px;
}
.card .dist {
  font-size: 17px;
  font-weight: 800;
  color: var(--c-green);
}
.card .depts, .card .addr {
  margin: 4px 0;
  color: var(--c-text-sub);
  font-size: calc(var(--fs-base) - 1px);
  overflow-wrap: anywhere;
}
.card .addr { color: var(--c-text); }
.card .homepage { font-size: calc(var(--fs-base) - 1px); word-break: break-all; }

.card-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 12px;
}
.btn-call {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  font-size: 22px;
  font-weight: 800;
  color: #fff !important;
  background: var(--c-call);
  border-radius: 14px;
  text-decoration: none;
}
.btn-call:active { background: #14602a; }
.sub-actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
}
.sub-actions a, .sub-actions button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  font-size: 17px;
  font-weight: 700;
  border-radius: 12px;
  text-decoration: none;
  border: 2px solid var(--c-line);
  background: #fff;
  color: var(--c-text);
  white-space: nowrap;
}
.sub-actions .btn-kakao-map { border-color: #f7c600; background: #fee500; color: #191600; }
.sub-actions .btn-naver { border-color: #03c75a; color: #026b32; }
.sub-actions .btn-share { border-color: #b8873b; color: #7a5310; }
/* 더 보기 */
.more-btn {
  width: 100%;
  min-height: 58px;
  margin-top: 14px;
  font-size: 20px;
  font-weight: 800;
  border: 2px solid var(--c-primary);
  background: #fff;
  color: var(--c-primary-dark);
  border-radius: 14px;
}
.more-btn:active { background: #e8f0fc; }
.empty-msg {
  text-align: center;
  padding: 30px 10px;
  color: var(--c-text-sub);
  font-size: 19px;
}

/* ===== 주변 공영주차장 (카드 인라인 펼침) ===== */
.parking-sec { margin-top: 12px; border-top: 1px solid var(--c-line); padding-top: 12px; }
.parking-toggle {
  width: 100%;
  min-height: 54px;
  font-size: 19px;
  font-weight: 800;
  border: 2px solid var(--c-primary);
  background: #eef1f6;
  color: var(--c-primary-dark);
  border-radius: 14px;
}
.parking-toggle.open { background: var(--c-primary); color: #fff; }
.parking-body { margin-top: 10px; display: flex; flex-direction: column; gap: 10px; }
.parking-item {
  background: #f7f9fc;
  border: 1px solid var(--c-line);
  border-radius: 12px;
  padding: 12px 14px;
}
.parking-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.parking-name { font-size: calc(var(--fs-base) + 1px); font-weight: 800; }
.pbadge {
  display: inline-block;
  font-size: 14px; font-weight: 800;
  padding: 3px 9px; border-radius: 8px; color: #fff;
}
.pbadge.p-noeo { background: var(--c-sky); }    /* 노외 */
.pbadge.p-nosang { background: var(--c-orange); } /* 노상 */
.parking-walk {
  margin: 6px 0 2px;
  font-size: calc(var(--fs-base) + 2px);
  font-weight: 800;
  color: var(--c-primary-dark);
}
.parking-fee { margin: 2px 0; font-size: var(--fs-base); font-weight: 700; color: var(--c-text); }
.parking-fee.free { color: var(--c-green); }
.parking-slots { margin: 2px 0; font-size: calc(var(--fs-base) - 2px); color: var(--c-text-sub); }
.parking-map {
  display: inline-flex; align-items: center; justify-content: center;
  margin-top: 8px; min-height: 48px; padding: 0 16px;
  font-size: 17px; font-weight: 700; text-decoration: none;
  border: 2px solid #f7c600; background: #fee500; color: #191600;
  border-radius: 12px;
}
.parking-empty { margin: 2px 0 4px; font-size: var(--fs-base); color: var(--c-text-sub); }
.parking-notice {
  margin: 4px 0 0;
  font-size: calc(var(--fs-base) - 3px);
  color: #8a919a;
  line-height: 1.5;
}

/* ===== 홈 하단 소개(SEO 겸용, 크롤링 가능한 본문) ===== */
.seo-intro {
  margin: 22px 0 6px;
  padding: 16px 18px;
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
}
.seo-intro h2 {
  margin: 0 0 8px;
  font-size: 19px;
  color: var(--c-primary-dark);
}
.seo-intro p {
  margin: 6px 0;
  font-size: calc(var(--fs-base) - 2px);
  color: var(--c-text-sub);
  line-height: 1.6;
}

/* ===== 이용 안내 탭 ===== */
.guide-card {
  background: var(--c-card);
  border: 1px solid var(--c-line);
  border-radius: 16px;
  padding: 18px;
  margin: 14px 0;
}
.guide-card h2 {
  margin: 0 0 10px;
  font-size: 22px;
  color: var(--c-primary-dark);
}
body.font-lg .guide-card h2 { font-size: 24px; }
.guide-card p, .guide-card li { font-size: var(--fs-base); }
.guide-card ul { padding-left: 22px; margin: 8px 0; }
.guide-card .stress { font-weight: 800; color: var(--c-red); }
.guide-steps { list-style: none; padding: 0; margin: 0; counter-reset: st; }
.guide-steps li {
  counter-increment: st;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px dashed var(--c-line);
}
.guide-steps li:last-child { border-bottom: none; }
.guide-steps li::before {
  content: counter(st);
  flex: 0 0 auto;
  width: 38px; height: 38px;
  border-radius: 50%;
  background: var(--c-primary);
  color: #fff;
  font-weight: 800;
  font-size: 20px;
  display: flex; align-items: center; justify-content: center;
}
.juris-phones { display: grid; grid-template-columns: 1fr; gap: 10px; }
.juris-phones a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 58px;
  padding: 0 18px;
  font-size: 19px;
  font-weight: 700;
  background: var(--c-green);
  color: #fff;
  border-radius: 14px;
  text-decoration: none;
}
.juris-phones a .num { font-size: 21px; }

.guide-card.note-card { background: #f6f7f9; }
.guide-card.note-card p { font-size: 16px; color: var(--c-text-sub); margin: 0; }

/* '법원에 안 가도 되는 일' 강조 카드 */
.guide-card.highlight-card { border: 2px solid var(--c-accent); }
.guide-card.highlight-card h2 { color: var(--c-accent); }
.nogo-list { list-style: none; padding: 0; margin: 8px 0 0; }
.nogo-list li {
  padding: 14px 0;
  border-top: 1px dashed var(--c-line);
  font-size: var(--fs-base);
  line-height: 1.55;
}
.nogo-list li:first-child { border-top: none; }
/* 안내 탭 외부 링크 버튼 (큰 터치 영역) */
.guide-link {
  display: inline-block;
  margin: 8px 8px 0 0;
  padding: 10px 16px;
  min-height: 46px;
  line-height: 26px;
  background: var(--c-primary);
  color: #fff !important;
  border-radius: 12px;
  text-decoration: none;
  font-weight: 700;
  font-size: calc(var(--fs-base) - 2px);
}
.guide-link:active { background: var(--c-primary-dark); }

/* 자주 묻는 질문 */
.faq-list { margin: 0; }
.faq-list dt {
  font-size: var(--fs-base);
  font-weight: 800;
  color: var(--c-primary-dark);
  padding: 14px 0 6px;
  border-top: 1px solid var(--c-line);
}
.faq-list dt:first-child { border-top: none; padding-top: 4px; }
.faq-list dt::before {
  content: "Q. ";
  color: var(--c-green);
  font-weight: 800;
}
.faq-list dd {
  margin: 0 0 8px;
  font-size: var(--fs-base);
  color: var(--c-text-sub);
  line-height: 1.6;
}

/* ===== 푸터 ===== */
footer.site-foot {
  margin-top: 30px;
  padding: 20px 12px 34px;
  border-top: 1px solid var(--c-line);
  text-align: center;
  color: var(--c-text-sub);
  font-size: 15px;
}
.visit-counter { font-size: 15px; margin-top: 6px; }
.visit-counter[hidden] { display: none; }
.region-links { margin: 10px 0 4px; line-height: 2; }
.region-links a { margin: 0 5px; font-size: 15px; color: var(--c-text-sub); }
.region-links.seo-pages { margin-top: 2px; font-size: 12px; color: #9aa1a9; line-height: 1.8; }
.region-links.seo-pages a { font-size: 12px; color: #9aa1a9; margin: 0 3px; }

/* ===== 데스크톱 확장 ===== */
@media (min-width: 700px) {
  .sido-btns { grid-template-columns: repeat(6, 1fr); }
  .card-actions { grid-template-columns: 220px 1fr; align-items: stretch; }
  .btn-call { min-height: 56px; }
  .juris-phones { grid-template-columns: 1fr 1fr; }
  .cards { gap: 16px; }
}

/* 접근성: 화면낭독기 전용 텍스트 */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}

[hidden] { display: none !important; }

/* ============================================================
   iOS 리퀴드 글래스 레이어
   (고령자 가독성 유지: 텍스트 면은 충분히 불투명, 핵심 CTA는 solid)
   - blur+saturate 강화, 반투명 그라데이션 패널,
     상단 스페큘러 하이라이트 엣지, 다층 소프트 섀도우
   ============================================================ */
:root {
  /* blur 값은 성능(구형 스마트폰)과 화질의 균형 — 과하면 저사양 기기에서 끊김 */
  --glass-blur: saturate(180%) blur(16px);
  --glass-blur-strong: saturate(190%) blur(20px);
  /* 유리 면(비텍스트: 지도 등) — 더 투명 */
  --glass-panel: linear-gradient(160deg, rgba(255,255,255,0.60), rgba(255,255,255,0.40));
  /* 텍스트 면(카드·안내·검색) — 가독성 위해 더 불투명 */
  --glass-solid: linear-gradient(160deg, rgba(255,255,255,0.92), rgba(255,255,255,0.80));
  --glass-border: rgba(255,255,255,0.72);
  /* 스페큘러: 위쪽 밝은 엣지 + 은은한 안쪽 테두리 광 */
  --glass-hi: inset 0 1px 0 rgba(255,255,255,0.85), inset 0 0 0 1px rgba(255,255,255,0.22);
  --glass-shadow: 0 12px 34px rgba(16,28,58,0.16), 0 2px 8px rgba(16,28,58,0.08);
  /* 활성(선택) 상태용 네이비 틴트 유리 */
  --glass-tint: linear-gradient(160deg,
      color-mix(in srgb, var(--c-primary) 94%, transparent),
      color-mix(in srgb, var(--c-primary) 76%, transparent));
  --glass-hi-tint: inset 0 1px 0 rgba(255,255,255,0.35);
}

/* 배경: 테마색 그라데이션 메시(블러가 비칠 컬러 바탕). 스킨색(--c-primary) 반영 */
body {
  background-color: #dde5f2;
  background-image:
    radial-gradient(60vw 55vw at 4% -6%, color-mix(in srgb, var(--c-primary) 55%, transparent), transparent 70%),
    radial-gradient(52vw 52vw at 102% 2%, color-mix(in srgb, var(--c-accent) 38%, transparent), transparent 68%),
    radial-gradient(54vw 50vw at 94% 55%, color-mix(in srgb, var(--c-primary) 44%, transparent), transparent 68%),
    radial-gradient(88vw 62vw at 36% 112%, color-mix(in srgb, var(--c-primary) 46%, transparent), transparent 72%),
    radial-gradient(72vw 64vw at 52% 42%, color-mix(in srgb, var(--c-primary) 14%, transparent), transparent 75%);
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* 상단 헤더·서비스 탭 바: 짙은 네이비 유리 (컨트롤센터 느낌) */
header.site-head,
nav.service-tabs {
  background: linear-gradient(160deg,
      color-mix(in srgb, var(--c-primary) 82%, transparent),
      color-mix(in srgb, var(--c-primary-dark) 82%, transparent));
  -webkit-backdrop-filter: var(--glass-blur-strong);
  backdrop-filter: var(--glass-blur-strong);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 6px 22px rgba(16,28,58,0.20);
}
.service-tab { background: transparent; color: rgba(255, 255, 255, 0.78); }
.service-tab[aria-selected="true"] {
  background: var(--glass-solid);
  color: var(--c-primary-dark);
  box-shadow: var(--glass-hi);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* 하위 탭 (찾기 / 이용 안내) */
.sub-tab {
  background: var(--glass-panel);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}
.sub-tab[aria-selected="true"] {
  background: var(--glass-tint);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--glass-hi-tint), var(--glass-shadow);
}

/* 검색창 (텍스트 면) */
.search-box input {
  background: var(--glass-solid);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}
.suggest-list {
  background: var(--glass-solid);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), 0 16px 40px rgba(16,28,58,0.22);
  -webkit-backdrop-filter: var(--glass-blur-strong);
  backdrop-filter: var(--glass-blur-strong);
}
.suggest-list button { background: transparent; }

/* 지도 패널 (비텍스트 → 더 투명한 유리) */
.map-area {
  background: var(--glass-panel);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), var(--glass-shadow);
  border-radius: 20px;
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* 시·도 버튼 · 종별 탭 · 뒤로/더보기 (텍스트 면) */
.sido-btns button,
.kind-tabs button,
.back-btn,
.more-btn {
  background: var(--glass-solid);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi), var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}
.kind-tabs button[aria-selected="true"] {
  background: var(--glass-tint);
  border-color: transparent;
  color: #fff;
  box-shadow: var(--glass-hi-tint), var(--glass-shadow);
}
.chip-row button {
  background: var(--glass-panel);
  border-color: var(--glass-border);
  box-shadow: var(--glass-hi);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}
.chip-row button[aria-pressed="true"] {
  background: linear-gradient(160deg,
      color-mix(in srgb, var(--c-text) 92%, transparent),
      color-mix(in srgb, var(--c-text) 80%, transparent));
  border-color: transparent;
  color: #fff;
  box-shadow: var(--glass-hi-tint);
}

/* 카드 · 안내 카드 (텍스트 면 → 불투명 유리 + 라운드 강화) */
.card,
.guide-card {
  background: var(--glass-solid);
  border-color: var(--glass-border);
  border-radius: 20px;
  box-shadow: var(--glass-hi), var(--glass-shadow);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* 보조 액션 버튼(길찾기·네이버·공유): 반투명 유리 */
.sub-actions a,
.sub-actions button {
  background: var(--glass-solid);
  box-shadow: var(--glass-hi);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* 안내 문구: 옅은 앰버 유리 */
.intro-line {
  background: linear-gradient(160deg,
      color-mix(in srgb, #fff4d6 82%, transparent),
      color-mix(in srgb, #ffe9b8 70%, transparent));
  box-shadow: var(--glass-hi);
  -webkit-backdrop-filter: var(--glass-blur);
  backdrop-filter: var(--glass-blur);
}

/* backdrop-filter 미지원 브라우저: 반투명이 과하지 않도록 더 불투명 처리 */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .card, .guide-card, .search-box input, .suggest-list,
  .sido-btns button, .kind-tabs button, .back-btn, .more-btn,
  .sub-actions a, .sub-actions button, .chip-row button,
  .service-tab[aria-selected="true"] { background: #ffffff; }
  .map-area { background: rgba(255, 255, 255, 0.94); }
}

/* ============================================================
   👑 공주님 스킨 (선택형 — 헤더 👑 버튼으로 켜고 끔, 저장 유지)
   파스텔 로즈 + 라벤더 + 골드. 고령자 가독성 원칙 유지:
   색만 바꾸고 글자 크기·대비·레이아웃은 그대로.
   ============================================================ */
body.skin-princess {
  --c-primary: #b03a72;        /* 로즈 (흰 글자 대비 확보) */
  --c-primary-dark: #8e2c5b;
  --c-accent: #7d5bbe;         /* 라벤더 */
  /* 글래스 틴트는 :root에서 계산·상속되므로 스킨색으로 재정의 필요 */
  --glass-tint: linear-gradient(160deg,
      color-mix(in srgb, #b03a72 94%, transparent),
      color-mix(in srgb, #b03a72 76%, transparent));
  background-color: #fdeff6;
  background-image:
    radial-gradient(60vw 55vw at 4% -6%, rgba(240, 140, 190, 0.55), transparent 70%),
    radial-gradient(52vw 52vw at 102% 2%, rgba(180, 150, 235, 0.48), transparent 68%),
    radial-gradient(54vw 50vw at 94% 55%, rgba(250, 180, 150, 0.35), transparent 68%),
    radial-gradient(88vw 62vw at 36% 112%, rgba(240, 140, 190, 0.45), transparent 72%),
    radial-gradient(72vw 64vw at 52% 42%, rgba(255, 214, 245, 0.35), transparent 75%);
}

/* 지도 채움색(하드코딩) → 파스텔 핑크로 */
body.skin-princess .map-sido,
body.skin-princess .sub-sgg { fill: #f7d3e4; }
body.skin-princess .map-sido:hover,
body.skin-princess .map-sido:focus,
body.skin-princess .map-sido.hl,
body.skin-princess .sub-sgg:hover,
body.skin-princess .sub-sgg:focus { fill: #dd7fae; }
body.skin-princess .map-area.mini .map-sido { fill: #f9e2ee; }
body.skin-princess .sub-sgg.empty { fill: #f3e8ee; }
body.skin-princess .map-label { fill: #6d2247; }
body.skin-princess .map-label .cnt { fill: #93446b; }
body.skin-princess .sub-label { fill: #6d2247; }

/* 골드 포인트: 연도 뱃지 + 카드 테두리 */
body.skin-princess .brand-year {
  background: linear-gradient(160deg, #ffe9a8, #f3c64e);
  color: #5d4300;
}
body.skin-princess .card,
body.skin-princess .guide-card { border: 2px solid #f3bcd6; }
body.skin-princess .search-box input { border-color: #d76a9f; }
body.skin-princess .sub-tab,
body.skin-princess .sido-btns button,
body.skin-princess .kind-tabs button,
body.skin-princess .back-btn,
body.skin-princess .more-btn { border-color: #d76a9f; }

/* 귀여운 장식 (레이아웃 영향 없는 텍스트 장식만) */
body.skin-princess .site-title a::after { content: " ✨"; }
body.skin-princess .intro-line::before { content: "🎀 "; }
body.skin-princess .list-title::after { content: " 💖"; }
body.skin-princess .parking-toggle::after { content: " 🌷"; }

/* 모서리 조금 더 둥글게 (소녀감성) */
body.skin-princess .card,
body.skin-princess .guide-card,
body.skin-princess .map-area { border-radius: 26px; }
body.skin-princess .search-box input { border-radius: 22px; }

/* 데스크톱 커서: 법봉 → 반짝이 별봉(요술봉) */
@media (pointer: fine) {
  body.skin-princess {
    cursor: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'><g fill='%23c2447e'><path d='M11 2l2.2 5.4L19 9l-5.8 1.6L11 16l-2.2-5.4L3 9l5.8-1.6z'/><rect x='14' y='14' width='4' height='16' rx='2' transform='rotate(-45 16 22)'/><circle cx='25' cy='7' r='1.6'/><circle cx='6' cy='19' r='1.3'/></g></svg>") 6 6, auto;
  }
}

/* ── 공주님 스킨 v2: 남아있던 기본색 요소까지 파스텔 통일 ── */

/* 안내 문구 → 핑크 톤 */
body.skin-princess .intro-line {
  background: linear-gradient(160deg, rgba(255, 228, 240, 0.88), rgba(255, 214, 233, 0.75));
  border-color: #eeaccb;
  color: #5f1f40;
}

/* 검색 포커스·자동완성 호버 → 핑크 */
body.skin-princess .search-box input:focus { outline-color: #f0b6d3; }
body.skin-princess .suggest-list button:hover,
body.skin-princess .suggest-list button:focus { background: #fdeaf3; }
body.skin-princess .sido-btns button:active,
body.skin-princess .more-btn:active,
body.skin-princess .back-btn:active { background: #fdeaf3; }

/* 법원 유형 뱃지 → 파스텔 배경 + 진한 글자 (가독성 유지) */
body.skin-princess .badge.b-daebeop { background: linear-gradient(160deg, #ffe9a8, #f3c64e); color: #5d4300; }
body.skin-princess .badge.b-godeung { background: #e6d9fb; color: #4a2d85; }
body.skin-princess .badge.b-jibang { background: #f9cfe1; color: #7c1d4e; }
body.skin-princess .badge.b-jiwon { background: #fde3ee; color: #93446b; }
body.skin-princess .badge.b-sigun { background: #d3f2df; color: #14532d; }
body.skin-princess .badge.b-deunggi { background: #ffe3cf; color: #7c3a00; }

/* 카드 내부 요소 → 핑크 틴트 */
body.skin-princess .card .court-hours { background: #fdeef5; color: #6d4356; }
body.skin-princess .card .dist { color: #b03a72; }
body.skin-princess .parking-toggle { background: #fdeef5; }
body.skin-princess .parking-toggle.open { background: var(--c-primary); }
body.skin-princess .parking-item { background: #fdf4f9; border-color: #f3d4e4; }
body.skin-princess .parking-walk { color: #8e2c5b; }
body.skin-princess .pbadge.p-noeo { background: #cfa5e8; }
body.skin-princess .pbadge.p-nosang { background: #f0a3bd; color: #5f1f40; }

/* 내 주변 버튼 → 딥로즈 (스킨 통일감) */
body.skin-princess .near-btn { background: #c2447e; }
body.skin-princess .near-btn:active { background: #a23367; }

/* 은은한 반짝이 장식 (화면 모서리, 터치 방해 없음) */
body.skin-princess::before,
body.skin-princess::after {
  content: "✨";
  position: fixed;
  z-index: 5;
  font-size: 22px;
  opacity: 0.55;
  pointer-events: none;
  animation: twinkle 2.8s ease-in-out infinite;
}
body.skin-princess::before { top: 84px; right: 14px; }
body.skin-princess::after { content: "🌸"; bottom: 18px; left: 12px; animation-delay: 1.4s; }
@keyframes twinkle {
  0%, 100% { opacity: 0.25; transform: scale(0.92); }
  50% { opacity: 0.75; transform: scale(1.08); }
}
@media (prefers-reduced-motion: reduce) {
  body.skin-princess::before, body.skin-princess::after { animation: none; }
}

/* 법언도 로즈 세리프로 */
body.skin-princess .law-maxim .maxim-la { color: #8e2c5b; }

/* 모바일: 고정 배경은 스크롤 성능(INP/CWV)을 떨어뜨려 해제 (시각 차이 미미) */
@media (max-width: 700px) {
  body { background-attachment: scroll; }
}

/* ============================================================
   🌙 다크 모드 (헤더 🌙 토글 · 저장 유지 · 첫 방문은 기기 설정)
   유리 변수를 어둡게 재정의 → 대부분 표면이 자동으로 따라오고,
   하드코딩된 밝은 면·SVG 지도만 개별 오버라이드. 고대비 유지.
   ============================================================ */
body.dark {
  --c-bg: #12151c;
  --c-card: #1b202a;
  --c-text: #e9ebee;
  --c-text-sub: #aab0bb;
  --c-line: #2d323d;
  --c-primary-dark: #cfe0f5;   /* 헤딩·텍스트용 → 밝게 */
  --glass-panel: linear-gradient(160deg, rgba(44,50,64,0.55), rgba(30,35,46,0.42));
  --glass-solid: linear-gradient(160deg, rgba(31,36,47,0.95), rgba(23,27,36,0.9));
  --glass-border: rgba(255,255,255,0.10);
  --glass-hi: inset 0 1px 0 rgba(255,255,255,0.08);
  --glass-shadow: 0 12px 30px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.35);
  --glass-tint: linear-gradient(160deg, rgba(46,80,130,0.95), rgba(33,60,102,0.85));
  --glass-hi-tint: inset 0 1px 0 rgba(255,255,255,0.14);
  background-color: #0f1218;
  background-image:
    radial-gradient(60vw 55vw at 4% -6%, rgba(46,80,130,0.30), transparent 70%),
    radial-gradient(52vw 52vw at 102% 2%, rgba(90,40,60,0.22), transparent 68%),
    radial-gradient(80vw 60vw at 40% 112%, rgba(40,60,100,0.26), transparent 72%);
}
body.dark a { color: #8fbaf0; }

/* 헤더 더 어둡게 */
body.dark header.site-head,
body.dark nav.service-tabs {
  background: linear-gradient(160deg, rgba(20,28,44,0.92), rgba(12,16,24,0.92));
}
body.dark .brand-year { background: #2c3444; color: #dbe6f5; }

/* 검색·자동완성 */
body.dark .search-box input,
body.dark .suggest-list,
body.dark .suggest-list button { color: var(--c-text); }
body.dark .suggest-list button:hover,
body.dark .suggest-list button:focus { background: rgba(255,255,255,0.07); }
body.dark .search-box input::placeholder { color: #7d8492; }

/* 안내 문구·접속 안내(앰버 → 어두운 앰버) */
body.dark .intro-line {
  background: linear-gradient(160deg, rgba(70,58,20,0.5), rgba(56,46,16,0.38));
  border-color: #5a4a2a; color: #f0e2b8;
}
/* 카드 내부·주차장 */
body.dark .card .court-hours { background: rgba(255,255,255,0.05); color: var(--c-text-sub); }
body.dark .parking-item { background: rgba(255,255,255,0.04); border-color: var(--c-line); }
body.dark .parking-toggle { background: rgba(255,255,255,0.06); color: var(--c-primary-dark); }
body.dark .parking-toggle.open { background: #2e5182; }
body.dark .parking-notice { color: #8b91a0; }

/* SVG 지도 (밝은 파랑 채움 → 어둡게, 라벨 후광 흰색 → 어둡게) */
body.dark .map-sido,
body.dark .sub-sgg { fill: #2b3444; }
body.dark .map-sido:hover, body.dark .map-sido:focus, body.dark .map-sido.hl,
body.dark .sub-sgg:hover, body.dark .sub-sgg:focus { fill: #40608f; }
body.dark .map-area.mini .map-sido { fill: #232a36; }
body.dark .sub-sgg.empty { fill: #1c2029; }
body.dark .map-label, body.dark .sub-label { fill: #dbe6f5; stroke: #12151c; }
body.dark .map-label .cnt { fill: #9fb4d0; }
body.dark .sub-label.empty { fill: #6b7280; }

/* 안내 탭 카드·FAQ */
body.dark .guide-card.note-card { background: rgba(255,255,255,0.04); }
body.dark .guide-link { background: #2e5182; }

/* 다크에서는 backdrop 미지원 폴백이 흰색으로 뜨지 않도록 */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  body.dark .card, body.dark .guide-card, body.dark .search-box input,
  body.dark .suggest-list, body.dark .sido-btns button, body.dark .kind-tabs button,
  body.dark .back-btn, body.dark .more-btn { background: #1b202a; }
  body.dark .map-area { background: #171b23; }
}

/* ============================================================
   🗺️ 인터랙티브 카카오맵 + 데스크톱 2단 레이아웃
   ============================================================ */
.finder-split { margin-top: 4px; }
.finder-map { position: relative; }
.kakao-map {
  width: 100%;
  height: 340px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--c-line);
  background: #e9eef5;
  box-shadow: var(--glass-shadow);
}
.finder-map .near-btn { margin-top: 10px; }

/* 카카오맵이 뜨면 기존 SVG 지도(전국·시군구)는 숨김 */
.has-kmap .map-area { display: none !important; }

/* 인포윈도우 내용 */
.kmap-iw {
  padding: 8px 10px 10px;
  font-size: 14px;
  line-height: 1.6;
  min-width: 190px;
  color: #111417;
}
.kmap-iw b { font-size: 15.5px; }
.kmap-iw .kmap-kind {
  display: inline-block; font-size: 12px; font-weight: 700;
  background: #1f3a63; color: #fff; border-radius: 6px; padding: 1px 7px; vertical-align: 2px;
}
.kmap-iw .kmap-addr { color: #40474f; font-size: 13px; }
.kmap-iw .kmap-detail { font-weight: 700; color: #0b5cad; }

/* ── 데스크톱: 리스트(왼쪽) + 지도(오른쪽 고정) 2단 ──
   카카오맵이 실제로 활성(.has-kmap)일 때만 2단으로. 폴백(SVG) 상태에서는
   기존 1단 레이아웃 그대로 유지(회귀 방지). */
@media (min-width: 1000px) {
  body.has-kmap .wrap { max-width: 1180px; }
  .has-kmap .finder-split {
    display: grid;
    grid-template-columns: minmax(360px, 430px) 1fr;
    gap: 18px;
    align-items: start;
  }
  .has-kmap .finder-main { grid-column: 1; grid-row: 1; min-width: 0; }
  .has-kmap .finder-map {
    grid-column: 2; grid-row: 1;
    position: sticky; top: 12px;
  }
  .has-kmap .kakao-map { height: calc(100vh - 150px); min-height: 520px; }
  .has-kmap .finder-main .back-btn { display: none; }
  .has-kmap .finder-main .sido-btns { grid-template-columns: repeat(3, 1fr); }
}

/* 다크모드 지도 컨테이너 */
body.dark .kakao-map { background: #1a1f28; border-color: var(--c-line); }
body.dark .kmap-iw { color: #111417; }  /* 인포윈도우는 흰 배경이라 본문 어둡게 유지 */