/* required styles */

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg {
	max-width: none !important;
	max-height: none !important;
	}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	width: auto;
	padding: 0;
	}

.leaflet-container img.leaflet-tile {
	/* See: https://bugs.chromium.org/p/chromium/issues/detail?id=600120 */
	mix-blend-mode: plus-lighter;
}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
svg.leaflet-zoom-animated {
	will-change: transform;
}

.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline-offset: 1px;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1.5;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(images/layers.png);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(images/layers-2x.png);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	font-size: 13px;
	font-size: 1.08333em;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */
	background-image: url(images/marker-icon.png);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.8);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	line-height: 1.4;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
	text-decoration: underline;
	}
.leaflet-attribution-flag {
	display: inline !important;
	vertical-align: baseline !important;
	width: 1em;
	height: 0.6669em;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	white-space: nowrap;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	background: rgba(255, 255, 255, 0.8);
	text-shadow: 1px 1px #fff;
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 24px 13px 20px;
	line-height: 1.3;
	font-size: 13px;
	font-size: 1.08333em;
	min-height: 1px;
	}
.leaflet-popup-content p {
	margin: 17px 0;
	margin: 1.3em 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-top: -1px;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;
	pointer-events: auto;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	text-align: center;
	width: 24px;
	height: 24px;
	font: 16px/24px Tahoma, Verdana, sans-serif;
	color: #757575;
	text-decoration: none;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
	color: #585858;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	-ms-zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-interactive {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}

/* Printing */

@media print {
	/* Prevent printers from removing background-images of controls. */
	.leaflet-control {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
		}
	}
/* =========================================================
   KOREA69 디자인 시스템 — 무드 C 플럼 & 샴페인
   폰(<768) 2열·하단 탭 / 태블릿(768~1023) 3열·하단 탭 / PC(≥1024) 4열·상단 메뉴
   ========================================================= */
:root{
	/* 색 — 보라(주색) · 골드(강조) · 핑크(보조) + 중립색. 팔레트를 바꿀 때는 이 블록만 고친다 */
	/* 카카오 로그인 버튼 — 카카오 디자인 가이드의 노랑 · 글자색 (2026-10-31) */
	--kakao:#fee500;
	--kakao-ink:#191919;
	/* 「탈퇴 신청하기」 버튼 (2026-11-01 사용자 「탈퇴신청난에 #752ADF 이색으로 해줘」) */
	--withdraw:#752adf;
	--primary:#7427e0;
	--primary-strong:#5316a8;
	--primary-soft:#f3ecff;
	--primary-ink:#fbf8f3;
	--primary-rgb:116,39,224;
	/* 보라 면 위의 연한 보라 글씨·아이콘 */
	--primary-lite:#d4bdff;
	--ink-rgb:251,248,243;
	--shadow-rgb:83,22,168;
	/* 큰 보라 면(히어로·배너·카드형 안내) / 상단 막대 */
	--hero-bg:linear-gradient(140deg,#4b1497 0%,#6a22d4 50%,#8f3df2 100%);
	--bar-bg:#5316a8;
	/* 골드 — 중요한 곳에만: 로고 69 · 골드 버튼(CTA) · 선택된 카테고리 · 히어로 강조어. 작은 글씨는 밝은 골드(accent-hi) */
	--accent:#e6c15a;
	--accent-rgb:230,193,90;
	--accent-hi:#f6de96;
	--gold-grad:linear-gradient(135deg,#fff3c4 0%,#f3d479 24%,#e0b44a 50%,#c8962a 74%,#f1d47e 100%);
	--on-gold:#2a1640;
	--star:#e2a714;
	--pink:#c81d70;
	--pink-rgb:200,29,112;
	--pink-soft:#fcebf3;
	--pink-lite:#f7a8cb;
	/* 핫핑크 그라데이션 — 이벤트 배너·쿠폰 강조에만 */
	--hot-grad:linear-gradient(135deg,#6a15a0 0%,#ac1c93 55%,#d4287c 100%);
	--hot-rgb:212,40,124;
	/* 첫 화면 큰 사진 광고 카드 — 사진 뒤 바탕 · 사진을 어둡게 덮는 그림자 색 · 「광고」 표시 바탕 (2026-10-05 예전 카드로 되돌리며 되살림) */
	--ad-bg:#241238;
	--ad-shade-rgb:18,8,32;
	--badge-bg:rgba(253,252,255,.92);
	/* 첫 화면 최근 방문후기 칸의 「Review」 · 「more >」 글자 (2026-10-26 사용자가 정한 색) */
	--rev-head:#6522C7;
	/* 첫 화면 내 주변 칩 바탕 · 마우스를 올렸을 때 바탕 (2026-11-02 사용자가 정한 색) */
	--near-chip:#6120BF;
	--near-chip-hover:#9D58ED;
	--surface:#f8f6fc;
	--card:#fefcff;
	/* 첫 화면 「광고」 카드 바탕 — 따뜻한 크림색 (2026-11-01 고급 카드 그림) */
	--card-cream:#fbf7f0;
	--text:#1d1330;
	--muted:#6a6080;
	--border:#e9e3f3;
	--band:#f1ebf9;
	--line-2:#d9d0ea;
	--ph:#8a80a0;
	--info-ink:color-mix(in srgb,var(--primary-strong) 72%,var(--text));
	--danger:#a3413f;
	--danger-soft:#fbeeec;
	--ok:#2f6b4f;
	--me-dot:#1a73e8;
	--r-card:20px;
	--r-photo:22px;
	--r-chip:10px;
	--r-field:12px;
	--shadow:0 16px 30px -20px rgba(var(--shadow-rgb),.45);
	--shadow-sm:0 6px 16px -12px rgba(var(--shadow-rgb),.35);
	--ease:cubic-bezier(.16,1,.3,1);
	--font:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic','맑은 고딕',sans-serif;
	--serif:Georgia,'Times New Roman',serif;
	--tab-h:64px;
	--safe-b:env(safe-area-inset-bottom,0px);
}

/* ---------- 기본 ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
/* PC 는 스크롤 막대 자리를 항상 비워 둔다 — 내용이 긴 화면 · 짧은 화면을 오갈 때 막대가 생겼다 사라지며 화면이 옆으로 밀리지 않게 (2026-11-02 사용자 「여러 메뉴를 클릭해보면 왔다갔다 불안정하다」). 폰 · 태블릿은 막대가 화면 위에 겹쳐 나와 그대로 */
@media (min-width:1024px){html{scrollbar-gutter:stable}}
body{font-family:var(--font);font-size:15px;line-height:1.6;background:var(--surface);color:var(--text);-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:anywhere;min-height:100vh}
/* 폰·태블릿 — 바탕색(html·body)을 위 띠 색과 같은 보라로: 새 아이폰 사파리는 맨 위 줄(시계·LTE) 색을 바탕색에서 따오고, 화면을 당겨 내릴 때 보이는 바탕도 이 색이다.
   연한 화면 바탕은 .app 이 칠하므로 화면 모습은 그대로 (2026-10-13 사용자 「위에 LTE 있는 데가 검은색인데 아래 사이트 색과 같게 해줘」 → 「사파리만 맞춤」) */
@media (max-width:1023px){html,body{background-color:var(--bar-bg)}.app{background-color:var(--surface)}}
/* 지역 쪽 글자(③ lib/area, 2026-11-03) — 검색 로봇이 읽고, 화면 프로그램이 켜지기 전에 잠깐 보인다. 폰 보라 바탕 위에서도 읽히게 연한 바탕 */
.area-pre{min-height:100vh;padding:16px 16px 40px;background:var(--surface)}
.area-pre h1{font-size:20px;margin:8px 0 4px}
.area-pre h2{font-size:16px;margin:16px 0 6px}
.area-pre ul{list-style:none}
.area-pre li{padding:3px 0}
.area-pre a{color:var(--primary)}
body::before{content:'';position:fixed;inset:0;opacity:.03;pointer-events:none;z-index:90;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:inherit}
button:disabled{cursor:not-allowed;opacity:.55}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
input,select,textarea{font:inherit;color:inherit}
/* 아이폰 · 아이패드(사파리 · 크롬 모두 WebKit)는 입력칸 글자가 16px 보다 작으면 누를 때 화면을 확대한다 — 그런 기기에서만 입력칸 글자를 16px 로
   (2026-10-26 사용자 「폰에서 검색 글자를 넣으면 화면 커져 버리네 점검해줘」). 매장 확인번호 칸(30px)은 그대로, 검색창 안내 글은 지금 크기 그대로. 안드로이드 · PC 는 바뀌지 않는다 */
@supports (-webkit-touch-callout:none){
	input:not(.pin-input),select,textarea{font-size:16px!important}
	.hero .search input::placeholder{font-size:14.5px}
}
img{display:block;max-width:100%}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{list-style:none}
svg.lucide{flex:none;stroke-width:1.9}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:6px}
.topbar :focus-visible,.hero :focus-visible,.promo :focus-visible,.locate-card :focus-visible,.profile :focus-visible,.ed-head :focus-visible{outline-color:var(--primary-ink)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.muted{color:var(--muted)}
.only-wide{display:none}
@media (min-width:768px){.only-wide{display:inline}.only-narrow{display:none}}

/* ---------- 셸 ---------- */
.app{min-height:100vh;display:flex;flex-direction:column}
/* 보기 방식 전환 (시안 시연용) — 폰에서 PC 배치 보기 / 되돌리기
   왼쪽 끝 맨 아래에 붙은 세로 글씨 손잡이(그림 아래 글자가 한 글자씩) + 그 밑 ✕(손잡이와 같은 보라에 흰 ✕ · 누르면 숨음, 새로고침하면 다시).
   아래 탭 바로 위에 딱 붙고, 아래 버튼 막대(업체 · 글쓰기)가 있는 화면은 그 바로 위. 창 · 알림은 이 손잡이 위로 덮는다.
   (2026-10-27 맨 위 연보라 띠 → 오른쪽 아래 둥근 버튼 → 「세로 글씨 손잡이」 → 사용자 「좌측 제일 아래에 붙여주고 X도 같은색으로」 · 「X는 하얀글씨로」) */
.view-switch{position:fixed;left:0;bottom:calc(var(--tab-h) + var(--safe-b));z-index:55;display:flex;flex-direction:column;align-items:center}
.view-switch.is-full{bottom:calc(var(--safe-b) + 70px)}
.view-tab{display:flex;flex-direction:column;align-items:center;gap:6px;width:34px;padding:12px 0;border-radius:0 14px 14px 0;background:var(--primary);color:var(--primary-ink);font-size:13px;font-weight:700;line-height:1;box-shadow:inset -1px 1px 0 rgba(var(--ink-rgb),.2),0 10px 22px -8px rgba(var(--shadow-rgb),.75);transition:background-color .2s var(--ease)}
.view-tab:hover{background:var(--primary-strong)}
.view-tab-text{writing-mode:vertical-rl;text-orientation:upright;letter-spacing:1px}
.view-x{margin-top:6px;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:var(--primary-ink);box-shadow:inset 0 1px 0 rgba(var(--ink-rgb),.2),0 6px 14px -6px rgba(var(--shadow-rgb),.6);transition:background-color .2s var(--ease)}
.view-x:hover{background:var(--primary-strong)}
/* PC 화면 보기(폭 1280 을 폰에 0.29 배쯤으로 줄여 보임) — 줄어 보여도 읽고 누르기 쉽게 크게(글자는 전 [폰 화면으로] 버튼과 같은 38px) */
.view-switch.is-pc{bottom:0}
.view-switch.is-pc .view-tab{width:112px;padding:36px 0;gap:18px;border-radius:0 44px 44px 0;font-size:38px;font-weight:800;box-shadow:inset -2px 2px 0 rgba(var(--ink-rgb),.2),0 24px 50px -18px rgba(var(--shadow-rgb),.8)}
.view-switch.is-pc .view-tab-text{letter-spacing:3px}
.view-switch.is-pc .view-x{margin-top:22px;width:76px;height:76px}
/* 맨 위로 — 화면을 400px 넘게 내리면 오른쪽 아래에 나오는 보라 동그라미(위 막대 + 위 화살표). 왼쪽 아래 손잡이와 같은 보라에 흰 그림.
   태블릿은 아래 탭(또는 아래 버튼 막대) 바로 위, PC 는 화면 오른쪽 아래, 폰 화면(폭 768 미만)에는 없다. 창 · 알림은 이 버튼 위로 덮는다
   (2026-10-30 사용자 「스크롤 내리면 올릴 수 있는 것 만들어줘 이 그림처럼 메인 바탕색으로」 → 색은 「보라 + 흰 화살표」 선택
    → 같은 날 「폰에서는 이거 없애줘」 → 「폰 화면에서만 없앰」 선택 — 폰의 PC화면보기(폭 1280)에는 그대로) */
.to-top{position:fixed;right:16px;bottom:calc(var(--tab-h) + var(--safe-b) + 16px);z-index:55;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:var(--primary-ink);box-shadow:inset 0 1px 0 rgba(var(--ink-rgb),.2),0 10px 22px -8px rgba(var(--shadow-rgb),.75);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s var(--ease),transform .2s var(--ease),background-color .2s var(--ease),visibility 0s linear .2s}
.to-top.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .2s var(--ease),transform .2s var(--ease),background-color .2s var(--ease)}
.to-top:hover{background:var(--primary-strong)}
.to-top.is-full{bottom:calc(var(--safe-b) + 86px)}
@media (max-width:767px){.to-top{display:none}}
@media (min-width:1024px){.to-top,.to-top.is-full{bottom:28px;right:28px}}
/* PC 화면 보기(폭 1280 을 폰에 0.29 배쯤으로 줄여 보임)에서는 손잡이처럼 크게 — 위 PC 규칙보다 뒤에 둬야 이긴다 */
.to-top.is-pc{width:136px;height:136px;right:40px;bottom:40px}
.screen{flex:1;width:100%;animation:enter .42s var(--ease)}
@keyframes enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 18px}
.has-tabbar .screen{padding-bottom:calc(var(--tab-h) + var(--safe-b) + 12px)}

/* 상단 메뉴 (PC) */
.topbar{display:none}
@media (min-width:1024px){
	.topbar{display:block;position:sticky;top:0;z-index:40;background:var(--bar-bg);color:var(--primary-ink);box-shadow:0 1px 0 rgba(0,0,0,.08)}
	.topbar-in{max-width:1200px;margin:0 auto;padding:0 24px;height:68px;display:flex;align-items:center;gap:24px}
	.topnav{display:flex;gap:4px;margin-left:12px;flex:none}
	/* 로고 옆 업계 게시판(구인구직·임대·매매·용품판매)과 오른쪽 주 메뉴(내 주변·찜·커뮤니티·마이)는 같은 모양 — 주 메뉴만 오른쪽에 붙인다 */
	.topnav-main{margin-left:auto}
	.topnav button{display:flex;align-items:center;gap:7px;height:40px;padding:0 14px;border-radius:12px;font-size:14.5px;font-weight:600;white-space:nowrap;color:rgba(var(--ink-rgb),.78);transition:background-color .2s var(--ease),color .2s var(--ease)}
	.topnav button:hover{background:rgba(var(--ink-rgb),.08);color:var(--primary-ink)}
	.topnav button.is-on{color:var(--primary-ink);background:rgba(var(--ink-rgb),.16)}
	.topbar .btn-reg{flex:none}
}
/* 1024~1279px 에서도 메뉴가 한 줄에 들어가게 간격·안쪽 여백만 줄인다 */
@media (min-width:1024px) and (max-width:1279px){
	.topbar-in{gap:10px;padding:0 18px}
	.topnav{gap:2px}
	.topnav-boards{margin-left:0}
	.topnav button{padding:0 9px;gap:5px;font-size:14px}
	/* 로그인·업체 등록이 들어가도 한 줄 — 두 버튼 안쪽 여백을 줄인다 (아래 기본 규칙보다 먼저 나오므로 .topbar 를 붙여 이기게, 2026-10-05) */
	.topbar .btn-login,.topbar .btn-reg{padding:0 11px}
}
.brand{font-family:var(--serif);font-weight:700;letter-spacing:.07em;font-size:21px;line-height:1;white-space:nowrap}
/* 왼쪽 위 로고 KOREA69.com — .com 은 같은 크기의 보통 굵기 소문자 (2026-10-04 시안) */
.brand small{font-size:1em;font-weight:400;letter-spacing:.02em;margin-left:3px}
/* 로고 KOREA69 = 형이 고른 시안을 딴 SVG(2026-10-04 · ui/LogoMark) — KOREA 대문자 높이 ≈ .9em(높이 1.38em × 277/424), 기준선을 글자 기준선에 맞춤(아래 77/424 = .25em)
   69 의 위아래 꼬리는 줄 밖으로 살짝 나가도 되게 — 위쪽 여백을 당겨 줄 높이가 늘지 않게 한다 */
.brand-logo{display:inline-block;height:1.38em;width:auto;vertical-align:-.25em;margin-top:-.25em;overflow:visible}
/* 로고 금색 69 위로 흐르는 은은한 빛 — 왼쪽 위 ↔ 오른쪽 아래를 쉬지 않고 왕복한다(한쪽 2.5초, 2026-11-02 사용자 「69도 은은하게 빛이 흐르게 해줘」 → 「빛이 연속적으로 와다갔다 하게해줘」). 양 끝에서 빛 가운데가 69 끝에 닿아 69 밖으로 나가 쉬는 때가 없다. px 은 로고 그림 단위(ui/LogoMark 의 viewBox). 움직임을 줄인 기기는 사이트 전체 규칙대로 69 밖에 숨은 채 멈춘다 */
.logo-flow{transform:translate(-260px,-260px);animation:logo-flow 2.5s ease-in-out infinite alternate}
@keyframes logo-flow{from{transform:translate(-114px,-114px)}to{transform:translate(114px,114px)}}
.btn-reg{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:999px;font-size:13px;font-weight:700;color:var(--accent-hi);background:rgba(var(--ink-rgb),.08);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.55);transition:background-color .2s var(--ease),color .2s var(--ease)}
.btn-reg:hover{background:var(--gold-grad);color:var(--on-gold)}
/* PC 상단 막대 오른쪽 끝 — 로그인 · 업체 등록 (2026-10-05 「이쯤에 로그인 만들고」, ui/LoginButton). 로그인했으면 이름 → 마이 */
.head-actions{display:flex;align-items:center;gap:8px;flex:none}
.btn-login{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:999px;font-size:13px;font-weight:700;white-space:nowrap;color:var(--primary-ink);background:rgba(var(--ink-rgb),.08);box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb),.32);transition:background-color .2s var(--ease)}
.btn-login:hover{background:rgba(var(--ink-rgb),.18)}
/* 로그인한 이름은 4글자쯤에서 「…」로 줄인다(마우스를 올리면 전체 이름) — 긴 업체 이름이 상단 막대를 밀어내지 않게. 줄이려면 inline-block 이어야 한다 */
.btn-login-text{display:inline-block;vertical-align:top;max-width:4.5em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand-row{display:flex;align-items:center;gap:8px}

/* 골드 버튼(중요한 행동) · 진한 바탕 위 테두리 버튼 — 2026-10-05 첫 진입 성인 확인 화면(.age-*)을 없애며 그 화면 전용 스타일은 뺐다 */
.btn-gold{background:var(--gold-grad);color:var(--on-gold);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 14px 30px -14px rgba(var(--accent-rgb),.9);transition:filter .2s var(--ease),box-shadow .2s var(--ease),transform .15s var(--ease)}
.btn-gold:hover{filter:brightness(1.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 16px 36px -12px rgba(var(--accent-rgb),1)}
.btn-ghost{color:rgba(var(--ink-rgb),.84);box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb),.28)}
.btn-ghost:hover{background:rgba(var(--ink-rgb),.08);color:var(--primary-ink);box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb),.5)}

/* 하단 탭 (폰·태블릿) */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:50;height:calc(var(--tab-h) + var(--safe-b));padding:4px 6px var(--safe-b);display:grid;grid-template-columns:repeat(5,1fr);background:var(--card);background:color-mix(in srgb,var(--card) 92%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--border)}
.tabbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:600;color:var(--muted);position:relative;transition:color .18s var(--ease)}
.tabbar button:hover{color:var(--text)}
.tabbar button.is-on{color:var(--primary)}
.tabbar button.is-on svg{stroke-width:2.3}
.tabbar button.is-on::after{content:'';position:absolute;bottom:5px;width:4px;height:4px;border-radius:50%;background:var(--primary)}
.tabbar .cnt{position:absolute;top:6px;left:calc(50% + 6px);min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--pink);color:var(--primary-ink);font-size:10px;font-weight:800;display:grid;place-items:center}
@media (min-width:1024px){.tabbar{display:none}.has-tabbar .screen{padding-bottom:0}}

/* 토스트 */
.toast{position:fixed;left:50%;bottom:calc(var(--tab-h) + var(--safe-b) + 18px);transform:translateX(-50%);z-index:80;max-width:calc(100% - 32px);display:flex;align-items:center;gap:8px;padding:11px 16px;border-radius:14px;background:var(--text);color:var(--primary-ink);font-size:13.5px;font-weight:600;box-shadow:0 14px 30px -12px rgba(0,0,0,.4);animation:toast .35s var(--ease)}
.toast svg{color:var(--primary-lite)}
/* 실패·주의 알림 — 느낌표를 핑크로 (성공 체크와 구분) */
.toast.is-warn svg{color:var(--pink-lite)}
@keyframes toast{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}
@media (min-width:1024px){.toast{bottom:28px}}

/* ---------- 공통 부품 ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:46px;padding:0 18px;border-radius:14px;font-size:14.5px;font-weight:700;transition:background-color .2s var(--ease),border-color .2s var(--ease),color .2s var(--ease),box-shadow .2s var(--ease),transform .15s var(--ease)}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--primary);color:var(--primary-ink);box-shadow:inset 0 1px 0 rgba(var(--ink-rgb),.18),0 12px 24px -14px var(--primary)}
.btn-primary:hover{background:var(--primary-strong);box-shadow:inset 0 1px 0 rgba(var(--ink-rgb),.22),0 14px 30px -12px var(--primary)}
.btn-line{border:1px solid var(--primary);color:var(--primary);background:var(--card)}
.btn-line:hover{background:var(--primary-soft)}
.btn-soft{background:var(--primary-soft);color:var(--primary)}
.btn-soft:hover{background:var(--primary);color:var(--primary-ink)}
.btn-sm{height:36px;padding:0 13px;border-radius:11px;font-size:13px}
.btn-block{width:100%}
.btn-kakao{background:var(--kakao);color:var(--kakao-ink)}
.btn-kakao:hover{filter:brightness(.97)}
.icon-btn{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;transition:background-color .2s var(--ease)}
.icon-btn:hover{background:rgba(120,110,150,.12)}
.badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;padding:3px 8px;border-radius:6px;background:var(--primary);color:var(--primary-ink);line-height:1.4}
.badge.soft{background:var(--primary-soft);color:var(--primary)}
.badge.line{background:none;border:1px dashed var(--line-2);color:var(--muted)}
.badge.band{background:var(--band);color:var(--text)}
.stars{display:inline-flex;gap:1px;color:var(--star)}
.stars svg{width:14px;height:14px;fill:currentColor;stroke:none}
.stars svg.off{color:var(--line-2)}
.note{font-size:12px;color:var(--muted);line-height:1.65}
.alert{display:flex;align-items:flex-start;gap:8px;padding:11px 13px;border-radius:12px;font-size:13px;line-height:1.6;background:var(--danger-soft);color:var(--danger)}
.alert button{margin-left:auto;font-weight:700;text-decoration:underline;flex:none}
.info-box{padding:14px 15px;border-radius:14px;background:var(--primary-soft);color:var(--info-ink);font-size:13px;line-height:1.8}
.info-box strong{display:block;color:var(--primary);margin-bottom:2px}

/* 칩 */
.chips{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:2px 0}
.chips::-webkit-scrollbar{display:none}
.chips.wrap{flex-wrap:wrap;overflow:visible}
.chip{flex:none;display:inline-flex;align-items:center;gap:5px;height:36px;padding:0 14px;border-radius:var(--r-chip);font-size:13.5px;font-weight:600;background:var(--card);color:var(--muted);border:1px solid var(--border);transition:background-color .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease),transform .18s var(--ease)}
.chip em{font-style:normal;font-size:11.5px;font-weight:800;color:var(--primary)}
.chip:hover{border-color:var(--primary);color:var(--text)}
.chip:active{transform:scale(.95)}
.chip.is-on{background:var(--primary);border-color:var(--primary);color:var(--primary-ink);box-shadow:0 6px 14px -10px var(--primary)}
.chip.is-on em{color:rgba(var(--ink-rgb),.78)}
/* 0개 칩 — 투명도로 흐리게 하면 글자 대비가 약 2.3:1로 떨어져(누를 수 있는 칩이라 4.5:1 대상) 점선 테두리·빈 바탕으로 구분한다 (리뷰 L5) */
.chip.is-dim{border-style:dashed;background:transparent}
.chip.sm{height:32px;padding:0 12px;font-size:12.5px}
/* 첫 화면 지역 칩 맨 앞 내 주변 칩 (2026-11-02 사용자 그림) — 바탕 #6120BF · 마우스를 올리면 #9D58ED (같은 날 사용자가 정한 색), 글자 · 핀은 밝게. 폰에서 누른 뒤 .chip:hover 가 글자를 진하게 바꾸지 않게 :hover 도 같이 적는다 */
.chip-near,.chip-near:hover{background:var(--near-chip);border-color:var(--near-chip);color:var(--primary-ink);font-weight:700}
.chip-near svg{flex:none;width:16px;height:16px}
@media (hover:hover){.chip-near:hover{background:var(--near-chip-hover);border-color:var(--near-chip-hover)}}
/* 내 주변 칩 빛 — 왼쪽 위에서 오른쪽 아래로 3초마다 흐른다(앞 1.2초 지나가고 쉼, 2026-11-02 사용자 「내주변 아이콘 좌측위에 우측아래로 빛 흘러가게 해줘」). 빛줄기가 칩 안에서 잘리지 않게 칩보다 3배 큰 칸을 옮긴다. 움직임을 줄인 기기에서도 흐른다 — 사이트 전체 규칙(아래 prefers-reduced-motion)에서 이 빛만 !important 로 뺐다(같은 날 사용자 「항상 흐르게 해줘」) */
.chip-near{position:relative;overflow:hidden;isolation:isolate}
.chip-near::after{content:'';position:absolute;inset:-100%;pointer-events:none;background:linear-gradient(135deg,transparent 43%,rgba(255,250,240,.6) 50%,transparent 57%);transform:translate(-34%,-34%);animation:near-shine 3s ease-in-out infinite!important}
@keyframes near-shine{0%{transform:translate(-34%,-34%)}40%,100%{transform:translate(34%,34%)}}

/* ---------- 홈 ---------- */
/* 보라 머리 — 2026-10-05 형님 의견으로 예전 구조로 되돌림: 폰 = 로고·업체 등록 + 큰 검색창 / PC = 큰 제목·부제·큰 검색창 + 오른쪽 큰 사진 광고 카드 */
.hero{background:var(--hero-bg);color:var(--primary-ink);border-radius:0 0 26px 26px;padding:10px 0 18px;position:relative;overflow:hidden}
.hero::after{content:'';position:absolute;right:-60px;top:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(var(--ink-rgb),.18),transparent 68%);pointer-events:none}
/* 보라 머리 사진(2026-10-19 넣음)은 뺐다 — 2026-10-26 사용자 「메인 여자 이미지 삭제 해줘」 · 「PC·폰 둘 다」. 사진 때문에 깔았던 [업체 등록] 반투명 보라 바탕도 뺐다 */
.hero-head{display:flex;align-items:center;gap:10px;padding:6px 0 14px;position:relative;z-index:10}
.hero-head .btn-reg{margin-left:auto;flex:none;white-space:nowrap}
/* 폰 머리 메뉴 (2026-11-01 ui/HeadMenu) — 탭바 · 화면 전환 위, 시트 아래 */
.head-menu-label{display:inline-block;max-width:6em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.head-menu{z-index:58;width:260px;max-width:calc(100vw - 32px);padding:6px;border-radius:16px;background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow);animation:rp-down .18s var(--ease)}
.head-menu-item{display:flex;align-items:center;gap:12px;min-height:52px;padding:6px 10px;border-radius:12px;color:var(--text);outline:none;cursor:pointer}
.head-menu-item[data-highlighted]{background:var(--band)}
.head-menu-ic{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--band);color:var(--primary)}
.head-menu-text{display:flex;flex-direction:column;gap:1px;min-width:0}
.head-menu-text b{font-size:15px;font-weight:700}
.head-menu-text small{font-size:12px;color:var(--muted)}
.search{display:flex;align-items:center;gap:10px;height:48px;padding:0 8px 0 16px;border-radius:14px;background:var(--primary-ink);color:var(--text);position:relative;z-index:10}
.search svg{color:var(--primary)}
.search input{flex:1;min-width:0;height:100%;border:0;outline:none;background:none;font-size:14.5px}
.search input::placeholder{color:var(--ph)}
.search .clear{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;color:var(--muted)}
.search .clear:hover{background:var(--band)}
/* 돋보기 단추 — 누르면 검색(엔터와 같음, 2026-10-26 「돋보기를 누르면 검색하게 하구 엔터를 쳐도 검색할수있게 해줘」) */
.search .search-go{flex:none;width:32px;height:32px;display:grid;place-items:center;border-radius:10px;color:var(--primary)}
.search .search-go:hover{background:var(--band)}
/* 첫 화면 큰 검색창(폰·PC) — 돋보기는 오른쪽 끝 (2026-10-26 사용자 「검창에 돋보기하구 글 우측으로 해줘」 → 「둘 다 오른쪽 끝으로」 · 「PC·폰 첫 화면 둘 다」)
   글은 그림 바로 다음부터, 글 지우기 ✕ 는 돋보기 옆 (2026-11-01 사용자 「검색 글씨앞 이미지 다음부터 하게 해줘」 — 오른쪽 맞춤을 뺐다)
   돋보기가 32px 단추라 오른쪽 여백은 10px(돋보기 그림 자리는 전과 같다). 흰 검색창 안의 키보드 초점 테두리는 보라(보라 머리의 흰 테두리가 흰 칸에 묻히지 않게) */
.hero .search{flex-direction:row-reverse;padding:0 10px 0 8px}
.hero .search :focus-visible{outline-color:var(--primary)}
/* 검색창 맨 왼쪽 그림(폰·PC) — 검색창 높이에 맞추고 왼쪽 끝에 붙여 둥근 모서리를 맞춘다 (2026-10-26 「이런식으로 이미지 넣어줘」 → 「PC·폰 둘 다」 · 「보낸 그림 통째로」)
   오른쪽 끝은 검색창 바탕에 녹아들게 오른쪽에서 왼쪽으로 그라데이션(같은 날 「이미지에서 우측에서 좌측으로 그라데이션 안들어 갔잖아~」 → 「그라데이션 조금 약하게 해」로 흐려지기 시작하는 곳 55% → 70% → 「사람이미지 좀더 그라데이션을 약하게 해줘」로 80%) */
.hero .search .search-pic{flex:none;height:100%;width:auto;aspect-ratio:288/151;object-fit:cover;margin-left:-8px;border-radius:14px 0 0 14px;pointer-events:none;user-select:none;mask-image:linear-gradient(90deg,#000 80%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 80%,transparent)}
/* 아주 좁은 폰(320px 등)은 안내 글(「지역, 업체명, 관리 종류 검색」)이 잘리지 않게 그림을 정사각(두 사람 부분)으로 */
@media (max-width:349px){.hero .search .search-pic{aspect-ratio:1/1;object-position:28% 50%}}
.hero .search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
/* 큰 제목 — 폰은 화면에 안 보이게 하되 화면 읽기용으로는 남긴다, PC 는 보인다 */
.hero-copy{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (min-width:1024px){
	.hero{border-radius:0;padding:34px 0 30px}
	.hero-head{display:none}
	.hero-copy{position:relative;z-index:10;width:auto;height:auto;margin:0 0 16px;overflow:visible;clip:auto;white-space:normal}
	.hero-copy h1{font-size:26px;font-weight:800;letter-spacing:-.03em;line-height:1.4}
	.hero-copy h1 em{font-style:normal;color:var(--accent-hi)}
	.hero-copy p{font-size:14px;color:rgba(var(--ink-rgb),.72);margin-top:4px}
	.hero .search{max-width:640px;height:54px}
	/* 히어로 두 칸 — 왼쪽 제목·검색창, 오른쪽 큰 사진 광고 카드 */
	.hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) 440px;column-gap:56px;align-items:center}
	.hero-main{min-width:0}
}
/* 큰 사진 광고 카드 (ui/HeroAd) — PC 히어로 오른쪽 칸만. 폰·태블릿은 숨김(관리 종류 아래 광고 줄이 대신). 여러 개면 그 칸 안에서 넘어간다 */
.hero-ad{display:none}
@media (min-width:1024px){
	.hero-ad{display:block;position:relative;z-index:10;height:176px;border-radius:20px;overflow:hidden;background:var(--ad-bg);box-shadow:0 16px 30px -18px rgba(var(--ad-shade-rgb),.7),inset 0 0 0 1px rgba(var(--ink-rgb),.14)}
	.hero-ad-track{position:relative;height:100%}
	/* 광고를 겹쳐 두고 한 장(is-cur)만 보인다 — 넘어갈 때는 보이던 광고(is-out)가 왼쪽으로 밀려 나가며 아래에 있던 다음 광고가 드러난다
	   (2026-10-12 「3초 머물다 우측으로 슬라이드 효과 사라지고 다음 광고가 보이게」 · 나가는 시간 1s 는 lib/ad 의 AD_HERO_SLIDE 와 같게 — 같은 날 「넘어가는 동작 1초로」) */
	.hero-ad-slide{position:absolute;inset:0;z-index:0;display:block;text-align:left;color:var(--primary-ink);overflow:hidden;visibility:hidden}
	.hero-ad-slide.is-cur{visibility:visible;z-index:1}
	.hero-ad-slide.is-out{visibility:visible;z-index:2;pointer-events:none;box-shadow:16px 0 28px -14px rgba(var(--ad-shade-rgb),.7);animation:hero-ad-out 1s cubic-bezier(.65,0,.35,1) both}
	@keyframes hero-ad-out{from{transform:none}to{transform:translateX(-102%)}}
	/* 카드가 바깥을 잘라서(overflow:hidden) 초점 테두리는 안쪽에 그린다 */
	.hero-ad-slide:focus-visible{outline-offset:-4px;border-radius:16px}
	.hero-ad-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
	.hero-ad-slide:hover img{transform:scale(1.04)}
	.hero-ad-slide::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--ad-shade-rgb),.82) 0%,rgba(var(--ad-shade-rgb),.42) 58%,rgba(var(--ad-shade-rgb),.08) 100%);pointer-events:none}
	/* 빛 반사 — 아래 업체 카드(.card::before)와 같은 빛: 마우스를 올리면 사진 위로 은은한 빛이 한 번 지나간다. 카드 전체가 사진이라 높이는 전체, 글자(z-index 20)보다는 아래
	   (2026-10-13 사용자 「슬라이드 광고도 아래 업체 이미지에 마우스 올릴 때 번쩍하는 효과 넣어줘」) */
	.hero-ad-slide::before{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;z-index:10;pointer-events:none;background:linear-gradient(105deg,transparent,rgba(255,250,240,.28),transparent);transform:skewX(-12deg);opacity:0;transition:left .7s var(--ease),opacity .3s var(--ease)}
	.hero-ad-slide:hover::before{left:120%;opacity:1}
	/* 광고가 넘어갈 때도 같은 빛 — 넘어가는 동작(1초, lib/ad AD_HERO_SLIDE)이 끝나 새 광고가 자리 잡는 때에 한 번 지나간다. 끝나면 원래 자리로 돌아가므로 마우스 올릴 때의 빛은 그대로 된다
	   (2026-10-13 사용자 「그러니까 페이지가 바뀔때 효과를 줘」) */
	@keyframes hero-ad-shine{from{left:-60%;opacity:1}to{left:120%;opacity:1}}
	.hero-ad-slide.is-cur::before{animation:hero-ad-shine .9s var(--ease) 1s 1}
	/* 「광고」 표시 — 유료 노출 영역은 알아보기 쉽게 (2026-09-27 운영 결정) · 「예시」 = 가상 업체 */
	.hero-ad-tags{position:absolute;left:14px;top:14px;z-index:20;display:flex;gap:4px}
	.hero-ad-tags span{font-size:10.5px;font-weight:800;letter-spacing:.02em;line-height:1;padding:4px 7px;border-radius:6px}
	.hero-ad .ad-badge{background:var(--badge-bg);color:var(--text)}
	.hero-ad .ad-tag-sample{background:var(--primary-soft);color:var(--primary-strong)}
	.hero-ad .disc{left:auto;right:14px;top:14px;bottom:auto}
	/* 글은 왼쪽 아래 — 점(여러 개일 때만)과 겹치지 않게 그때만 오른쪽을 비운다 */
	.hero-ad-body{position:absolute;left:20px;right:20px;bottom:18px;z-index:20;display:flex;flex-direction:column;gap:2px;min-width:0}
	.hero-ad.has-dots .hero-ad-body{right:80px}
	.hero-ad-body b{font-size:20px;font-weight:800;letter-spacing:-.02em;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
	.hero-ad-meta{font-size:13px;color:rgba(var(--ink-rgb),.82);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
	.hero-ad-body em{font-style:normal;font-size:14px;font-weight:800;color:var(--accent-hi)}
	.hero-ad-dots{position:absolute;right:12px;bottom:12px;z-index:20;display:flex;gap:4px}
	.hero-ad-dots i{width:6px;height:6px;border-radius:3px;background:var(--primary-ink);opacity:.4;transition:width .3s var(--ease),opacity .3s var(--ease)}
	.hero-ad-dots i.is-on{width:16px;opacity:.95}
}
/* 첫 화면 광고 카드 줄 — 한 줄 3칸, 관리 종류 아래와 업체 목록 중간 두 군데 (2026-10-04 「카드 3개 정도 광고 자리를 두어 군데」 · ui/AdCards)
   운영자가 넣은 업체가 먼저, 남는 칸은 「예시」 광고. 폰은 정사각 사진의 작은 카드, 넓은 화면은 가로로 긴 사진 + 시설 한 줄 */
.ad-row{margin-top:14px}
.ad-row.is-mid{margin:28px 0 6px}
.ad-row-head{display:flex;align-items:center;gap:6px;margin-bottom:8px;min-width:0}
.ad-row-title{flex:none;font-size:14px;font-weight:800;letter-spacing:-.02em;line-height:1.3}
.ad-row-note{min-width:0;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-row-more{flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:1px;font-size:12px;font-weight:600;color:var(--muted);transition:color .2s var(--ease)}
.ad-row-more:hover{color:var(--primary)}
.ad-row-more svg{width:14px;height:14px}
.ad-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ad-cards li{position:relative;min-width:0;transition:transform .25s var(--ease)}
.ad-card{position:relative;display:flex;flex-direction:column;height:100%;overflow:hidden;background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);transition:transform .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease)}
.ad-cards li:hover{transform:translateY(-3px)}
.ad-card:hover{border-color:rgba(var(--primary-rgb),.35);box-shadow:var(--shadow)}
.ad-card:focus-visible{border-radius:14px}
.ad-card-photo{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;background:var(--band)}
.ad-card-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.ad-card:hover .ad-card-photo img{transform:scale(1.05)}
/* 「광고」 표시 — 유료 노출 영역은 알아보기 쉽게 (2026-09-27 운영 결정) · 「예시」 = 가상 업체 */
.ad-card-tags{position:absolute;left:6px;top:6px;z-index:10;display:flex;gap:3px}
.ad-card-tags span{font-size:10px;font-weight:800;line-height:1;padding:3px 5px;border-radius:5px}
.ad-badge{background:var(--text);color:var(--primary-ink)}
.ad-tag-sample{background:rgba(var(--ink-rgb),.94);color:var(--text)}
.ad-card-body{display:flex;flex-direction:column;flex:1;min-width:0;padding:7px 8px 9px}
.ad-card-name{font-size:12.5px;font-weight:700;letter-spacing:-.025em;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-card-meta{margin-top:1px;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-card-foot{display:flex;align-items:baseline;gap:8px;margin-top:3px;min-width:0}
.ad-card-price{flex:none;font-size:13px;font-weight:800;color:var(--primary);letter-spacing:-.03em;line-height:1.3}
.ad-card-price.none{font-size:11px;font-weight:600;color:var(--muted)}
.ad-card-pitch{display:none}
/* 빈 광고 자리 — 줄마다 예시 하나만 두고 나머지는 비워 둔다 (2026-10-04 「여기 두 개는 비워 놓으라고」) · 누르면 광고 안내 */
.ad-card.is-empty{align-items:center;justify-content:center;gap:6px;padding:12px 8px;text-align:center;background:transparent;border:1.5px dashed var(--line-2);box-shadow:none;color:var(--muted)}
.ad-card.is-empty::before{display:none}
.ad-card.is-empty:hover{background:var(--primary-soft);border-color:rgba(var(--primary-rgb),.45);color:var(--primary);box-shadow:none}
.ad-empty-ic{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--primary-soft);color:var(--primary)}
.ad-empty-ic svg{width:17px;height:17px}
.ad-card.is-empty b{font-size:12.5px;font-weight:800;color:var(--text);letter-spacing:-.02em}
.ad-empty-sub{font-size:11px;line-height:1.45}
/* PC 보다 좁으면 2칸씩 2줄(앞 4곳 — lib/ad adPhoneRow), 폰 카드는 크림색 바탕 · 화살표 동그라미 없이 (2026-11-01 사용자 「폰에서도 PC 처럼 … 광고 4를 보여주도록」 → 「2칸씩 2줄 4개」) */
@media (max-width:1023px){.ad-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.ad-card{background:var(--card-cream)}.ad-card-go{display:none}}
@media (min-width:768px){
	.ad-empty-ic{width:48px;height:48px}
	.ad-empty-ic svg{width:22px;height:22px}
	.ad-card.is-empty b{font-size:16px}
	.ad-empty-sub{font-size:12.5px}
	.ad-row{margin-top:18px}
	.ad-row-head{margin-bottom:10px}
	.ad-row-title{font-size:18px}
	.ad-row-note{font-size:12px}
	.ad-row-more{font-size:13px}
	.ad-cards{gap:14px}
	/* 고급 카드 (2026-11-01 고급 카드 그림) — 넓은 화면 값. 폰은 칸이 좁아 크기는 위의 폰 값 그대로 */
	.ad-card,.ad-card:focus-visible{border-radius:20px}
	.ad-card{background:var(--card-cream);box-shadow:var(--shadow)}
	.ad-card-photo{aspect-ratio:4/3}
	.ad-card-tags{left:14px;top:14px;gap:4px}
	.ad-card-tags span{font-size:12px;padding:5px 10px;border-radius:8px}
	.ad-card-photo .disc{left:14px;bottom:12px;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:600;color:var(--text);background:rgba(251,247,240,.94)}
	.ad-cards .heart{right:14px;top:14px;width:38px;height:38px}
	.ad-card-body{position:relative;padding:14px 68px 16px 18px}
	.ad-card-name{font-size:18px;font-weight:800}
	.ad-card-meta{margin-top:3px;font-size:13px}
	.ad-card-foot{margin-top:8px;gap:6px}
	.ad-card-price{font-size:14px;font-weight:700;color:var(--text)}
	.ad-card-price.none{font-size:13px;font-weight:500}
	.ad-card-pitch{display:block;min-width:0;font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
	.ad-card-pitch::before{content:'· '}
	.ad-card-go{position:absolute;right:16px;top:50%;width:38px;height:38px;margin-top:-19px;border-radius:50%;display:grid;place-items:center;color:var(--text);background:rgba(var(--accent-rgb),.14);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.5);transition:background-color .2s var(--ease),color .2s var(--ease)}
	.ad-card-go svg{width:18px;height:18px}
	.ad-card:hover .ad-card-go{background:var(--primary);color:var(--primary-ink);box-shadow:none}
}
@media (min-width:1024px){.ad-cards{gap:18px}}
.filters{padding:14px 0 2px}
.filters .chips+.chips{margin-top:8px}
/* 지역 고르기 — 예전(9/28) 알약 칩 줄을 그대로 쓴다(.chips region-grid): 폰·태블릿은 한 줄로 두고 손가락으로 옆으로 밀기, PC 는 줄을 바꿔 18개가 전부 보이게
   (2026-10-05 「지역이 바둑판이 아니었잖아, 옆으로 밀면 가게」 · 「PC 원래 이랬었나?」 → 「예전 알약 칩으로」). 시·도를 고르면 아래에 시·군·구 칩 줄 */
/* 보라 안내 배너 — 3장 자동 넘김(업체 홍보글 · 후기 정책 · 내 주변). 2026-10-04 개편 때 뺐다가 2026-10-05 형님 의견으로 되돌림 */
.promo{margin:14px 0 2px;border-radius:16px;overflow:hidden;position:relative;background:var(--hero-bg);color:var(--primary-ink);box-shadow:0 14px 28px -18px rgba(var(--shadow-rgb),.6)}
.promo::after{content:'';position:absolute;right:-36px;top:-50px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(var(--ink-rgb),.22),transparent 70%);pointer-events:none}
/* 넘어가는 동작 1초 — lib/promo PROMO_SLIDE 와 같게 (2026-10-12 「동작속도는 1초로 해줘」) */
.promo-track{position:relative;z-index:10;display:flex;transition:transform 1s var(--ease)}
.promo-slide{flex:0 0 100%;display:flex;align-items:center;gap:12px;padding:15px 18px 17px;text-align:left}
.promo-slide div{flex:1;min-width:0}
.promo-slide b{display:block;font-size:14.5px;letter-spacing:-.02em;color:var(--primary-ink)}
.promo-slide span{display:block;font-size:12.5px;opacity:.82}
.promo-slide svg{flex:none;opacity:.8}
.promo-slide svg:last-child{transition:transform .25s var(--ease)}
.promo-slide:hover svg:last-child{transform:translateX(3px)}
.promo-dots{position:absolute;right:14px;bottom:10px;display:flex;gap:4px;z-index:10}
.promo-dots i{width:6px;height:6px;border-radius:3px;background:currentColor;opacity:.35;transition:width .3s var(--ease),opacity .3s var(--ease)}
.promo-dots i.is-on{width:16px;opacity:.95}
/* 지역검색 — 「지역검색 | 시·도 ▾ | 시·군·구 ▾」 막대 + 두 칸 목록 (2026-10-04 사용자 제안 구조 · ui/RegionPicker)
   한 줄 칩은 PC 에서 뒤쪽 시·도(세종~제주)가 가려졌고(「이렇게 지역검색하면 누구 써서 넣니」), 바둑판은 자리를 많이 차지했다 */
.rp{position:relative;max-width:640px}
.filters .chips+.rp{margin-top:10px}
.rp-bar{display:flex;align-items:stretch;height:46px;border-radius:14px;background:var(--card);border:1.5px solid var(--primary);box-shadow:var(--shadow-sm);overflow:hidden}
.rp-label{flex:none;display:flex;align-items:center;gap:5px;padding:0 13px;background:var(--primary);color:var(--primary-ink);font-size:13.5px;font-weight:800;white-space:nowrap}
.rp-btn{flex:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 12px;font-size:14px;font-weight:700;color:var(--text);transition:background-color .2s var(--ease)}
.rp-btn+.rp-btn{border-left:1px solid var(--border)}
.rp-btn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.rp-btn svg{flex:none;color:var(--primary);transition:transform .2s var(--ease)}
.rp-btn:hover{background:var(--primary-soft)}
.rp.is-open .rp-btn svg{transform:rotate(180deg)}
.rp-panel{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);max-height:min(60vh,420px);border-radius:14px;background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow);overflow:hidden;animation:rp-down .18s var(--ease)}
.rp-col{overflow-y:auto;padding:6px 0;overscroll-behavior:contain}
.rp-col+.rp-col{border-left:1px solid var(--border);background:var(--surface)}
.rp-col button{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:11px 14px;font-size:14px;font-weight:600;color:var(--text);text-align:left;transition:background-color .15s var(--ease),color .15s var(--ease)}
.rp-col button:hover{background:var(--primary-soft)}
.rp-col button.is-on{color:var(--primary);font-weight:800}
.rp-col button.is-dim{color:var(--muted)}
.rp-col em{font-style:normal;font-size:11.5px;font-weight:800;color:var(--primary)}
.rp-hint{padding:12px 14px;font-size:12.5px;line-height:1.6;color:var(--muted)}
@keyframes rp-down{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* PC(마우스)는 옆으로 밀기 어렵다 — 칩 줄은 줄을 바꿔 전부 보이게 (폰·태블릿은 손가락으로 밀기) */
@media (min-width:1024px){.chips{flex-wrap:wrap;overflow:visible}}
/* 관리 종류 — 폰은 한 줄로 두고 손가락으로 옆으로 밀기(2026-10-15 지압·테라피를 넣어 8칸이 되며 사용자 「한 줄 옆으로 밀기」 — 지역 칩 줄과 같이).
   한 칸 58px 라 360~375px 폰에서는 5칸 반쯤 보여 옆에 더 있는 것을 알 수 있다. (예전: 6칸 한 줄, 2026-10-05 「모바일은 이전의 저 레이아웃으로」) */
.cats{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:14px 0 4px}
.cats::-webkit-scrollbar{display:none}
.cat{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--text);padding:2px 0;min-width:0;flex:none;width:58px}
.cat>span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
/* 관리 종류 아이콘 — 사용자 그림(2026-10-04, app/assets/category)을 원으로 오려 보여 준다 */
.cat-ic{display:block;width:50px;height:50px;border-radius:50%;overflow:hidden;background:var(--card);box-shadow:0 4px 10px -6px rgba(var(--shadow-rgb),.4);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.cat-img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.cat:hover .cat-ic{transform:translateY(-2px)}
/* 선택된 칸 = 골드 테두리 (그림을 3px 안쪽으로 줄여 골드가 둘러싸게) */
.cat.is-on .cat-ic{padding:3px;background:var(--gold-grad);box-shadow:0 6px 14px -6px rgba(var(--accent-rgb),.9)}
/* 넓은 화면은 한 줄에 왼쪽부터 — PC 는 그림을 조금 크게(2026-10-04 「약간 크게」), 칸 사이는 예전처럼 촘촘히(2026-10-05 「이전처럼 간격 좀 더 붙이고」) */
@media (min-width:768px){.cats{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:18px;overflow:visible}.cat{width:64px}}
@media (min-width:1024px){.cats{gap:14px;padding:20px 0 6px}.cat{width:76px;font-size:13px;gap:9px}.cat-ic{width:68px;height:68px}}
/* 최근 방문후기 칸 (2026-10-26 사용자 그림 「Review · more >」 — 「PC만」 · 「사이트 글꼴」 · 「점 빼기」) — PC 첫 화면 오른쪽, 지역 칩 둘째 줄부터 관리 종류 옆까지
   폭은 400px(좁은 PC 는 38%) — 처음에는 위 광고 카드 칸과 같은 440px 였고, 같은 날 「리뷰 우측으로 조금만 줄여줘」로 오른쪽 끝은 그대로 두고 40px 줄였다. 지역 칩 첫 줄은 가로 전체를 쓰게, 폭 0 짜리 받침(칩 한 줄 높이 — 위 여백 14 + 2 · 칩 36 · 줄 사이 7)을 먼저 띄우고 그 아래에 칸을 띄운다.
   칩이 칸 둘레로 줄을 바꾸도록 PC 에서는 칩을 글줄(inline)로 놓는다(flex 칸은 띄운 칸 옆으로 통째로 좁아져서). 관리 종류 줄은 칸 옆 남은 폭(8칸 706px)에 들어간다 */
@media (min-width:1024px){
	.home-top{display:flow-root}
	.home-top::before{content:'';float:right;width:0;height:59px}
	/* 폭은 화면이 지역 칩 첫 줄 「세종」 칩 왼쪽 테두리에 맞춰 재어 넣은 값(--rev-w, 2026-10-26 「위 세종 데두리 좌측으로 리뷰 맞춰줘」), 못 재면 400px */
	.recent-rev{float:right;clear:right;width:var(--rev-w,min(400px,38%));margin-left:16px;color:var(--text)}
	.home-top .region-grid{display:block;font-size:0;margin-bottom:-7px}
	.home-top .region-grid .chip{display:inline-flex;vertical-align:top;margin:0 7px 7px 0}
	.recent-rev-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:6px 2px 7px;border-bottom:1.5px solid var(--primary-strong)}
	.recent-rev-head b{font-size:15px;font-weight:800;letter-spacing:-.01em;color:var(--rev-head)}
	.recent-rev-head button{font-size:13px;font-weight:700;color:var(--rev-head)}
	.recent-rev-head button:hover{color:var(--primary)}
	.recent-rev ol{list-style:none;margin:0;padding:6px 0 0}
	/* 후기 줄 글자는 흐린 색(2026-10-26 「리뷰 글씨는 좀 흐리게 해줘」 — 전에는 본문 색), 마우스를 올리면 보라 */
	.recent-rev li button{display:flex;align-items:center;gap:16px;width:100%;padding:4px 2px;font-size:14px;line-height:1.5;text-align:left;color:var(--muted)}
	.recent-rev .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
	.recent-rev .n{flex:none;max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
	.recent-rev li button:hover .t{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
	.recent-rev-empty{padding:12px 2px;font-size:13.5px;color:var(--muted)}
}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 0 4px}
.sec-head h2{font-size:18px;font-weight:800;letter-spacing:-.03em}
.sec-head h2 span{color:var(--primary);margin-left:5px}
/* 첫 화면 검색(돋보기 · 엔터)으로 목록 머리에 내려올 때 — PC 는 위 막대(68px)에 가리지 않게 그만큼 띄운다 */
@media (min-width:1024px){.sec-head{scroll-margin-top:68px}}
.select-wrap{position:relative;flex:none}
.select-wrap select{appearance:none;-webkit-appearance:none;height:34px;padding:0 30px 0 12px;border-radius:10px;border:1px solid var(--border);background:var(--card);font-size:13px;font-weight:600;color:var(--text);cursor:pointer}
.select-wrap svg{position:absolute;right:9px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--muted);width:15px;height:15px}
.data-note{font-size:12px;color:var(--muted);margin:2px 0 14px}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}
@media (min-width:768px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 16px}}
@media (min-width:1024px){.grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:26px 18px}}
.card-link{display:block;color:inherit}
.card{display:block;width:100%;background:var(--card);border-radius:var(--r-card);box-shadow:var(--shadow);overflow:hidden;position:relative;border:1px solid transparent;text-align:left;transition:transform .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease)}
.card:hover{transform:translateY(-3px);border-color:rgba(var(--primary-rgb),.35)}
.thumb{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--band);border-radius:var(--r-photo) var(--r-photo) 6px 6px}
.thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,30,.2),transparent 32%);pointer-events:none}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.card:hover .thumb img{transform:scale(1.05)}
.disc{position:absolute;left:8px;bottom:8px;font-size:9.5px;color:#fdfcff;background:rgba(20,16,30,.52);padding:2px 6px;border-radius:5px;z-index:10}
.kind{position:absolute;left:8px;top:8px;font-size:10.5px;font-weight:700;color:var(--primary-ink);background:rgba(var(--primary-rgb),.86);padding:3px 7px;border-radius:6px;z-index:10}
.heart{position:absolute;right:7px;top:7px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fdfcff;background:rgba(20,16,30,.26);z-index:10;transition:transform .2s var(--ease),color .2s var(--ease)}
.heart svg{width:18px;height:18px}
.heart:active{transform:scale(.82)}
.heart.is-on,.fav-on{color:var(--pink)}
.heart.is-on svg,.fav-on svg{fill:currentColor}
.card-body{padding:11px 12px 13px}
.card h3{font-size:15px;font-weight:700;letter-spacing:-.025em;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.meta{font-size:12px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.price{margin-top:7px;font-size:16.5px;font-weight:800;color:var(--primary);letter-spacing:-.03em;line-height:1.3}
.price.none{font-size:12.5px;font-weight:600;color:var(--muted)}
.rate{display:flex;align-items:center;gap:3px;font-size:12px;font-weight:700;margin-top:3px}
.rate svg{width:13px;height:13px;color:var(--star);fill:currentColor;stroke:none}
.rate span{color:var(--muted);font-weight:500}
.rate.none{color:var(--muted);font-weight:500}
.tags{display:flex;gap:4px;margin-top:8px;flex-wrap:wrap;min-height:20px}
.tags span{font-size:10.5px;font-weight:600;padding:2px 7px;border-radius:6px;border:1px solid var(--border);color:var(--muted)}
.empty{text-align:center;padding:48px 20px;border:1px dashed var(--line-2);border-radius:18px;background:var(--card);display:flex;flex-direction:column;align-items:center;gap:10px}
.empty svg{color:var(--primary);width:34px;height:34px}
.empty h3{font-size:16px;font-weight:800}
.empty p{font-size:13px;color:var(--muted);line-height:1.7}
.empty .btn{margin-top:6px}
.more-row{display:flex;justify-content:center;margin-top:22px}
.footer{margin-top:40px;padding:26px 0 30px;border-top:1px solid var(--border);font-size:12px;color:var(--muted);line-height:1.8}
.footer .brand{font-size:17px;color:var(--primary);display:inline-block;margin-bottom:6px}
.footer a{text-decoration:underline}
/* 공통 푸터 — 약관 링크 · 통신판매중개 고지 · 사업자 정보 · 신고 접수 */
.site-footer .footer-brand{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.site-footer .footer-brand .brand{margin-bottom:0}
.footer-links{display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:12px}
.footer-links a{font-size:12.5px;font-weight:600;color:var(--text);text-decoration:none}
.footer-links a.strong{font-weight:800}
/* 지역·관리 종류 바로가기 (2026-10-05 기본 SEO) */
.footer-areas{display:grid;gap:4px;margin:0 0 12px;font-size:12px;line-height:1.8;color:var(--muted)}
.footer-areas b{margin-right:8px;color:var(--text);font-weight:700}
.footer-areas a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}
.footer-areas a:hover{color:var(--primary)}
/* 사업자 정보 — 「관리 종류별」 줄 아래, 바로가기 줄과 같은 크기 · 색. 항목 사이는 띄우고 좁으면 다음 줄로 (2026-10-30) */
.footer-company{display:flex;flex-wrap:wrap;gap:0 16px;margin:0 0 12px;font-size:12px;line-height:1.8;color:var(--muted)}
.footer-links a:hover{text-decoration:underline}
.footer-notice{padding:10px 12px;border-radius:12px;background:var(--primary-soft);color:var(--info-ink);font-weight:600;line-height:1.7;margin-bottom:10px}
/* 운영 원칙 — 통신판매 고지 바로 위, 같은 상자 모양에 제목만 굵게 */
.footer-principle{padding:10px 12px;border-radius:12px;background:var(--primary-soft);color:var(--info-ink);line-height:1.75;margin-bottom:8px}
.footer-principle b{display:block;font-weight:800;color:var(--primary-strong);margin-bottom:2px}
/* 「운영 원칙」 글자 = 운영(관리자) 화면으로 가는 링크 — 겉모습은 글자 그대로 (2026-10-11) */
.footer-principle b a{color:inherit;text-decoration:none}
.footer-biz{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;margin-bottom:8px}
.footer-biz dt{font-weight:700;color:var(--text);white-space:nowrap}
.footer-copy{margin:0 0 12px}

/* 약관·정책 — 목록 · 본문 */
.menu-group>.menu-row:first-child{border-top:0}
.policy-view{padding-top:4px;padding-bottom:48px;max-width:760px}
.policy-sec{padding:16px 0;border-top:1px solid var(--border)}
.policy-sec:first-of-type{border-top:0;padding-top:4px}
.policy-sec h2{font-size:15.5px;font-weight:800;letter-spacing:-.02em;line-height:1.5;margin-bottom:8px}
.policy-sec p{font-size:14px;line-height:1.85}
.policy-sec p+p{margin-top:6px}
.policy-sec ul{display:grid;gap:5px;margin-top:6px;padding-left:18px}
.policy-sec li{font-size:14px;line-height:1.8}
.policy-sec li::marker{color:var(--primary)}
.policy-others{margin-top:18px;padding-top:18px;border-top:1px solid var(--border)}
.policy-others h2{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:10px}
.policy-links{display:flex;flex-wrap:wrap;gap:7px}
/* PC 약관 본문 왼쪽 세로선 — 본문 글자에서 60px 왼쪽, 본문 칸 위(첫 조항)부터 끝(다른 약관·정책)까지. 제목 줄까지 올리면 긴 제목(개인정보 처리방침 · 광고·쿠폰 운영정책)을 가로질러서 본문 칸에서 시작 (2026-10-19 사용자 「선을 넣어줘」) */
@media (min-width:1024px){.policy-view{position:relative}.policy-view::before{content:'';position:absolute;left:-42px;top:4px;bottom:48px;width:1px;background:var(--line-2)}}

/* ---------- 페이지 머리 (내 주변·찜·후기·마이·운영자) ---------- */
.page-head{position:sticky;top:0;z-index:30;background:var(--surface);background:color-mix(in srgb,var(--surface) 92%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.page-head .wrap{display:flex;align-items:center;gap:10px;min-height:58px}
.page-head h1{font-size:19px;font-weight:800;letter-spacing:-.03em;flex:1;min-width:0}
.page-head h1 small{font-size:13px;color:var(--muted);font-weight:600;margin-left:6px}
@media (min-width:1024px){.page-head{position:static;background:none;backdrop-filter:none;-webkit-backdrop-filter:none}.page-head .wrap{min-height:84px}.page-head h1{font-size:24px}}
.page-intro{font-size:13px;color:var(--muted);margin:-4px 0 14px}

/* ---------- 업체 홍보글 (상세) ---------- */
.detail{background:var(--surface)}
.detail-grid{display:block}
.gallery{position:relative;aspect-ratio:4/5;background:#15121c;overflow:hidden;max-height:78vh}
/* 키가 작은 폰(640px 등)에서도 가격·지역·영업상태·후기가 첫 화면(아래 문의 막대 위)에 들어오게 사진 높이를 화면 키에 맞춘다 — 보통 폰(360×780 이상)은 그대로 (2026-10-05) */
/* 너비를 100% 로 못박아야 높이를 줄여도 4:5 비율 때문에 너비까지 줄어들지 않는다(사진은 흐린 배경으로 잘림 없이 맞춤) */
.gallery{width:100%;max-height:min(78vh,calc(100vh - 300px))}
@supports (height:100svh){.gallery{max-height:min(78svh,calc(100svh - 300px))}}
.gal-track{display:flex;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.gal-track::-webkit-scrollbar{display:none}
.gal-slide{flex:0 0 100%;height:100%;position:relative;scroll-snap-align:center;overflow:hidden;margin:0}
.gal-bg{position:absolute;inset:-24px;width:calc(100% + 48px);height:calc(100% + 48px);max-width:none;object-fit:cover;filter:blur(20px) brightness(.55) saturate(1.1)}
.gal-fg{position:relative;width:100%;height:100%;object-fit:contain}
.gal-top{position:absolute;top:12px;left:12px;right:12px;display:flex;gap:8px;align-items:center;z-index:10}
.gal-top .sp{flex:1}
.round{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(20,16,30,.38);color:#fdfcff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background-color .2s var(--ease),transform .2s var(--ease),color .2s var(--ease)}
.round:hover{background:rgba(20,16,30,.58)}
.round:active{transform:scale(.9)}
.round.fav-on{color:var(--pink-lite)}
.gal-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;display:none}
.gal-arrow.prev{left:12px}
.gal-arrow.next{right:12px}
@media (hover:hover){.gal-arrow{display:grid}}
.gal-count{position:absolute;right:12px;bottom:30px;font-size:12px;font-weight:700;color:#fdfcff;background:rgba(20,16,30,.5);padding:3px 10px;border-radius:999px;z-index:10}
.gal-note{position:absolute;left:12px;bottom:30px;font-size:10.5px;color:#fdfcff;background:rgba(20,16,30,.5);padding:3px 8px;border-radius:6px;z-index:10;max-width:calc(100% - 110px)}
.d-head{padding:18px 18px 16px;background:var(--card);border-radius:22px 22px 0 0;margin-top:-18px;position:relative;z-index:20}
.d-badges{display:flex;gap:5px;flex-wrap:wrap}
.d-head h1{font-size:23px;font-weight:800;letter-spacing:-.03em;margin:9px 0 4px;line-height:1.3}
.d-addr{display:flex;align-items:flex-start;gap:4px;font-size:13px;color:var(--muted);line-height:1.55}
.d-addr svg{margin-top:2px;width:15px;height:15px}
.d-rate{display:flex;align-items:center;gap:5px;margin-top:6px;font-size:13px;color:var(--muted)}
.d-rate b{color:var(--text);font-weight:800}
.d-rate i{width:3px;height:3px;border-radius:50%;background:var(--line-2)}
.d-rate svg{width:14px;height:14px;color:var(--star);fill:currentColor;stroke:none}
/* 첫 화면 가격(매장 결제) · 영업상태 (2026-10-05 — 사진 → 가격 → 지역 → 영업상태 → 후기) */
.d-price{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:2px 0 6px}
.d-price b{font-size:20px;font-weight:800;color:var(--primary);letter-spacing:-.03em;line-height:1.3}
.d-price b.none{font-size:15px;font-weight:700;color:var(--muted)}
.pay-tag{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;background:var(--band);color:var(--primary-strong);font-size:11.5px;font-weight:700;white-space:nowrap}
.d-open{display:flex;align-items:flex-start;gap:4px;margin-top:3px;font-size:13px;color:var(--muted);line-height:1.55}
.d-open svg{margin-top:2px;width:15px;height:15px;flex:none}
.d-open b{font-weight:800;color:var(--text)}
.d-open.is-open b,.d-open.is-always b{color:var(--ok)}
.pay-note{display:flex;align-items:flex-start;gap:6px;margin-top:12px;padding:10px 12px;border-radius:12px;background:var(--surface);font-size:12.5px;line-height:1.6;color:var(--muted)}
.pay-note svg{flex:none;margin-top:2px}
/* 카카오 예약 — 업체가 실제 예약 주소(카카오 https)를 넣은 매장만 (2026-10-05 네이버 예약 → 2026-10-18 카카오 예약) */
.d-head .booking-btn{margin-top:12px}
.booking-note{margin-top:6px;font-size:12px;line-height:1.6;color:var(--muted)}
.facts{display:grid;grid-template-columns:1fr 1.35fr .85fr .85fr;gap:6px;margin-top:14px}
.facts div{background:var(--surface);border-radius:12px;padding:9px 4px;text-align:center;min-width:0}
.facts small{display:block;font-size:10.5px;color:var(--muted)}
.facts b{display:block;font-size:12px;font-weight:700;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.02em}
.facts div:first-child b{color:var(--primary);font-size:13px}
.d-tabs{position:sticky;top:0;z-index:30;display:flex;background:var(--card);border-bottom:1px solid var(--border);padding:0 6px}
.d-tabs button{flex:1;text-align:center;font-size:13.5px;font-weight:700;color:var(--muted);padding:12px 0 11px;position:relative;transition:color .2s var(--ease)}
.d-tabs button:hover{color:var(--text)}
.d-tabs button.is-on{color:var(--text)}
.d-tabs button::after{content:'';position:absolute;left:24%;right:24%;bottom:-1px;height:2px;border-radius:2px;background:var(--primary);transform:scaleX(0);transition:transform .25s var(--ease)}
.d-tabs button.is-on::after{transform:scaleX(1)}
/* 폰 머리줄 — 사진이 위로 지나가면 얇은 흰 줄(‹ 업체명 · 공유 · 찜)이 나오고 업체 탭은 그 아래 붙는다 (2026-10-05, 높이 48px = ShopView BAR_H) */
.d-bar{position:fixed;top:0;left:0;right:0;z-index:45;height:48px;display:flex;align-items:center;gap:2px;padding:0 6px;background:var(--card);border-bottom:1px solid var(--border);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s linear .2s}
.d-bar.is-on{opacity:1;visibility:visible;transform:none;transition:opacity .2s var(--ease),transform .2s var(--ease)}
.d-bar-name{flex:1;min-width:0;padding:0 4px;font-size:16px;font-weight:800;letter-spacing:-.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d-bar-btn{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:12px;color:var(--text);transition:background-color .2s var(--ease),color .2s var(--ease)}
.d-bar-btn:hover{background:var(--band)}
.d-bar-btn.fav-on{color:var(--pink)}
@media (max-width:1023px){.d-tabs.under-bar{top:48px}}
@media (min-width:1024px){.d-bar{display:none}}
.d-sec{padding:20px 18px 22px;background:var(--card);border-bottom:8px solid var(--band);scroll-margin-top:48px}
.d-sec>h2{display:flex;align-items:center;gap:6px;font-size:16.5px;font-weight:800;letter-spacing:-.03em;margin-bottom:12px}
.d-sec>h2 span{color:var(--primary)}
.d-sec>h2 .btn{margin-left:auto}
.price-list{border:1px solid var(--border);border-radius:14px;overflow:hidden}
.price-list li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:13px 14px;border-top:1px solid var(--border)}
.price-list li:first-child{border-top:0}
.price-list b{font-size:14px;font-weight:700}
.price-list small{font-size:12px;color:var(--muted);margin-left:6px}
.price-list strong{font-size:15px;font-weight:800;letter-spacing:-.02em;white-space:nowrap}
.price-list strong.ask{font-size:13px;color:var(--muted);font-weight:600}
.price-list li.low{background:var(--primary-soft)}
.price-list li.low strong{color:var(--primary)}
.low-tag{font-size:10px;font-weight:800;color:var(--primary-ink);background:var(--primary);border-radius:5px;padding:1px 5px;margin-left:6px;vertical-align:1px}
.price-none{padding:16px;border-radius:14px;background:var(--surface);font-size:13.5px;line-height:1.8}
.price-none b{display:block;font-size:15px;color:var(--primary);margin-bottom:2px}
.fac-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.fac-grid span{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;border-radius:14px;background:var(--surface);font-size:12px;font-weight:600;text-align:center}
.fac-grid svg{width:22px;height:22px;color:var(--primary)}
.fac-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}
.fac-photos button{border-radius:12px;overflow:hidden;aspect-ratio:1}
.fac-photos img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}
.fac-photos button:hover img{transform:scale(1.05)}
.intro{font-size:14.5px;line-height:1.9;white-space:pre-wrap}
/* 소개 4줄 + 더보기/접기 (2026-10-05) */
.intro.is-clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden}
.intro-more{display:inline-flex;align-items:center;gap:2px;height:32px;margin-top:4px;font-size:13.5px;font-weight:700;color:var(--muted);transition:color .2s var(--ease)}
.intro-more:hover{color:var(--text)}
.writer{display:flex;align-items:center;gap:4px;font-size:11.5px;color:var(--muted);margin-top:12px}
.writer svg{color:var(--primary);width:14px;height:14px}
/* isolation — 지도(Leaflet) 안쪽 층(z-index 400~1000)을 칸 안에 가둬 아래 탭 · 시트 위로 올라오지 않게 (2026-10-27) */
.map-box{border-radius:14px;overflow:hidden;border:1px solid var(--border);background:var(--band);isolation:isolate}
.map-box iframe{display:block;width:100%;height:220px;border:0;background:var(--band)}
/* 내 주변 업체 점 지도(src/ui/ShopMap) — 구글 지도 칸과 같은 높이, 점 이름표는 화면 글꼴 · 색 */
.shop-map{width:100%;height:220px;background:var(--band);font:inherit}
.shop-map .leaflet-popup-content{margin:10px 12px}
.map-pop{display:grid;gap:3px;min-width:140px;font-size:12.5px;color:var(--muted);line-height:1.4}
.map-pop b{font-size:14px;color:var(--text);font-weight:800}
.map-pop-go{justify-self:start;margin-top:4px;padding:5px 10px;border-radius:999px;background:var(--primary);color:var(--primary-ink);font-size:12px;font-weight:700}
.map-pop-go:hover{background:var(--primary-strong)}
.shop-map .leaflet-control-attribution{font-size:10.5px}
/* 점 위 업체 이름(확대했을 때만 — src/ui/ShopMap NAME_ZOOM) — 10-27 사용자 「조금 작게 · 가는 글씨체」로 11.5px 굵게(800) → 10.5px 보통(400) */
.shop-map .leaflet-tooltip.map-name{padding:2px 6px;border:1px solid var(--border);border-radius:8px;background:var(--card);color:var(--primary-strong);font-size:10.5px;font-weight:400;line-height:1.35;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.shop-map .leaflet-tooltip.map-name::before{display:none}
.map-name{max-width:160px;overflow:hidden;text-overflow:ellipsis}
.shop-map.names-off .map-name{display:none}
/* 내 위치 파란 점의 「내 위치」 이름표(멀리 봐도 보임) · 위치도 지역도 없을 때 지도 자리 안내 (2026-10-28) */
.shop-map .leaflet-tooltip.map-me{padding:1px 6px;border:0;border-radius:8px;background:var(--me-dot);color:#fff;font-size:10.5px;font-weight:700;line-height:1.4;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.shop-map .leaflet-tooltip.map-me::before{display:none}
.map-wait{display:grid;place-content:center;justify-items:center;gap:6px;height:220px;padding:16px;text-align:center;background:var(--band);color:var(--muted);font-size:12.5px;line-height:1.5}
.map-wait svg{color:var(--primary)}
.map-wait b{color:var(--text);font-size:14px;font-weight:700}
.map-cap{display:flex;justify-content:space-between;gap:10px;padding:9px 12px;font-size:12px;color:var(--muted);background:var(--card);border-top:1px solid var(--border)}
.map-cap b{color:var(--text);font-weight:700}
/* 길찾기 — 카카오맵(웹·폰) · 네이버 지도(폰 앱). 폰은 위아래, 480 이상 나란히, PC 는 카카오 하나 (2026-10-05) */
.route-row{display:grid;gap:8px;margin-top:12px}
.route-row .btn{min-width:0;white-space:nowrap}
.route-note{margin-top:8px;font-size:12px;line-height:1.6;color:var(--muted)}
@media (min-width:480px){.route-row{grid-template-columns:1fr 1fr}}
@media (min-width:1024px){.route-row{grid-template-columns:auto;justify-content:start}.route-naver{display:none}}
.link-row{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.link-row a,.link-row button{flex:1;min-width:88px;height:40px;display:flex;align-items:center;justify-content:center;gap:5px;border-radius:12px;border:1px solid var(--border);font-size:12.5px;font-weight:700;background:var(--card);transition:border-color .2s var(--ease),color .2s var(--ease)}
.link-row a:hover,.link-row button:hover{border-color:var(--primary);color:var(--primary)}
.addr-line{font-size:13.5px;margin-top:10px;line-height:1.6}
.source-box{margin-top:14px;padding:13px 14px;border-radius:12px;background:var(--surface);font-size:12.5px;line-height:1.7}
.source-box strong{margin-right:8px}
.source-box a{display:inline-flex;align-items:center;gap:4px;text-decoration:underline;color:var(--primary);font-weight:600}
/* 원문 링크 옆 오픈스트리트맵 저작권 링크 */
.source-box a+a{margin-left:12px}
.source-box p{color:var(--muted);margin-top:4px;font-size:12px}
.cta-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:7px;padding:10px 14px calc(10px + var(--safe-b));background:var(--card);background:color-mix(in srgb,var(--card) 94%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--border)}
/* 버튼 글자는 한 줄 — 320px 폰에서도 [길찾기] [문자 문의] [전화 문의]가 들어가게 안쪽 여백을 줄이고, 360px 미만은 문자·전화를 같은 너비로 (2026-10-05) */
.cta-bar .btn{flex:1;height:50px;padding:0 12px;white-space:nowrap}
.cta-bar .btn-primary{flex:1.35}
@media (max-width:359px){.cta-bar .btn-primary{flex:1}}
/* 아래 막대 왼쪽 — 길찾기(좌표가 있으면 카카오맵·네이버 지도 고르기 창) · 위치(좌표가 없으면 위치 칸으로). 찜은 위 머리줄·사진 위에 (2026-10-05) */
.cta-bar .cta-route{width:54px;height:50px;flex:none;border-radius:14px;border:1px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:11px;font-weight:700;color:var(--text);background:var(--card);white-space:nowrap;transition:color .2s var(--ease),border-color .2s var(--ease)}
.cta-bar .cta-route:hover{border-color:var(--primary);color:var(--primary)}
.btn-soft.fav-on{color:var(--pink)}
.cta-bar .no-phone{flex:1.35;display:flex;flex-direction:column;justify-content:center;padding:0 10px;font-size:12px;line-height:1.45;color:var(--muted);border-radius:14px;background:var(--surface)}
.cta-bar .no-phone b{color:var(--text);font-size:13px}
.cta-space{height:calc(84px + var(--safe-b))}
.d-aside{display:none}
.detail-back{display:none}
.owner-cta{display:flex;align-items:center;gap:8px;width:100%;margin-top:14px;padding:12px 14px;border-radius:14px;background:var(--primary-soft);color:var(--primary);font-size:13px;font-weight:700;text-align:left;transition:background-color .2s var(--ease)}
.owner-cta span{flex:1;min-width:0}
.owner-cta:hover{background:color-mix(in srgb,var(--primary) 14%,var(--card))}
.map-ph{height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--muted);font-size:12.5px}
@media (min-width:1024px){
	.detail{padding:14px 0 60px}
	.detail-back{display:block;max-width:1200px;margin:0 auto 12px;padding:0 24px}
	.detail-back button{display:inline-flex;align-items:center;gap:4px;height:34px;padding:0 10px 0 6px;border-radius:10px;font-size:13.5px;font-weight:700;color:var(--muted);transition:background-color .2s var(--ease),color .2s var(--ease)}
	.detail-back button:hover{background:var(--band);color:var(--text)}
	.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;max-width:1200px;margin:0 auto;padding:0 24px;align-items:start}
	.gallery{border-radius:22px;max-height:none;aspect-ratio:16/11}
	.gal-top{top:14px}
	.gal-top .back-btn{display:none}
	.d-head{margin-top:16px;border-radius:22px}
	.d-tabs{top:68px;border-radius:14px;margin-top:16px;border:1px solid var(--border)}
	.d-sec{border-radius:20px;border:1px solid var(--border);margin-top:14px;scroll-margin-top:130px}
	.cta-bar,.cta-space{display:none}
	.d-aside{display:block;position:sticky;top:88px;background:var(--card);border-radius:22px;box-shadow:var(--shadow);border:1px solid var(--border);padding:20px}
	.d-aside h2{font-size:19px;font-weight:800;letter-spacing:-.03em;line-height:1.35}
	.d-aside .price{font-size:22px;margin-top:10px}
	.d-aside dl{display:grid;grid-template-columns:70px 1fr;gap:8px 10px;margin:16px 0;font-size:13px}
	.d-aside dt{color:var(--muted)}
	.d-aside dd{font-weight:600}
	.d-aside .btn{width:100%;margin-top:8px}
	.d-aside .aside-note{font-size:12px;color:var(--muted);margin-top:12px;line-height:1.6}
}

/* ---------- 후기 ---------- */
.rev-list{display:grid;gap:10px}
.rev{padding:14px 15px;border-radius:16px;background:var(--card);border:1px solid var(--border)}
.d-sec .rev{background:var(--surface);border:0}
.rev-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px}
.rev-top b{font-weight:700}
.rev-shop{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700;color:var(--primary);margin-bottom:6px}
.rev-shop:hover{text-decoration:underline}
.rev p{font-size:14px;line-height:1.8;margin-top:6px;white-space:pre-wrap}
.rev small{display:block;font-size:11.5px;color:var(--muted);margin-top:6px}
/* 후기 날짜 줄 — 관리자에게는 오른쪽에 [수정] [삭제] (2026-11-01 ui/ReviewAdmin) */
.rev-foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px}
.rev-foot small{margin:0 auto 0 0}
.rev-admin{display:flex;gap:6px;margin-left:auto}
.rev-admin:empty{display:none}
.rev-sum{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.rev-sum>b{font-size:28px;font-weight:800;letter-spacing:-.03em;color:var(--primary)}
.rev-sum small{display:block;font-size:12px;color:var(--muted)}
/* 사장님 답글 · 답글 쓰기 (2026-10-05 업체는 답글만) */
.rev-reply{margin-top:10px;padding:10px 12px;border-radius:12px;background:var(--primary-soft)}
.rev-reply b{font-size:12.5px;font-weight:800;color:var(--primary)}
.rev-reply span{margin-left:6px;font-size:11.5px;color:var(--muted)}
.rev .rev-reply p{margin-top:4px;font-size:13.5px;line-height:1.7}
.my-rev{display:grid;gap:8px}
/* 제휴문의 한 건 — 커뮤니티 「제휴문의」 · 운영 관리 「제휴문의」 (2026-10-19, 후기 카드 모양 그대로) */
.iq-kind{display:flex;align-items:center;gap:6px;min-width:0}
.iq-kind b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.iq-plan{flex:none;font-size:12.5px;font-weight:800;color:var(--primary);white-space:nowrap}
.iq-state{flex:none;font-size:11.5px;font-weight:800;padding:2px 8px;border-radius:999px;background:var(--surface);color:var(--muted);box-shadow:inset 0 0 0 1px var(--border)}
.iq-state.is-done{background:var(--primary-soft);color:var(--primary);box-shadow:none}
/* 광고 신청 「반려」 표시 · 운영 관리 「광고승인」의 [반려] [승인] 줄 (2026-10-30) */
.iq-state.is-no{background:var(--danger-soft);color:var(--danger);box-shadow:none}
.iq-decide{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.iq p,.iq small{overflow-wrap:anywhere}
.form.iq-answer{margin-top:10px;gap:8px}
.iq-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:8px}
.my-rev>.btn{justify-self:end}
.reply-quote{margin:0 0 12px;padding:10px 12px;border-radius:12px;background:var(--band);font-size:13px}
.reply-quote p{margin-top:4px;line-height:1.7;white-space:pre-wrap;max-height:7em;overflow:auto}
.admin-row .mod-reply{color:var(--primary)}

/* ---------- 시트 (후기 쓰기 등) ---------- */
.sheet-overlay{position:fixed;inset:0;z-index:60;background:rgba(24,16,36,.5);animation:fade .25s var(--ease)}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:70;max-height:92vh;overflow-y:auto;background:var(--card);border-radius:22px 22px 0 0;padding:10px 18px calc(18px + var(--safe-b));box-shadow:0 -20px 40px -20px rgba(0,0,0,.35);animation:rise .38s var(--ease);outline:none}
/* 아이폰 사파리 · 안드로이드 크롬은 vh 를 주소창이 접혔을 때 키로 재서, 주소창이 펼쳐져 있으면 92vh 창의 맨 위(제목 · X)가 화면 밖으로 밀린다 — 펼쳐졌을 때 키(svh)로 (2026-10-29 「업체등록 클릭하면 상단에 회원가입 폰트하구 X 잘 안보이는데」) */
@supports (height:100svh){.sheet{max-height:92svh}}
.sheet::before{content:'';display:block;width:40px;height:4px;border-radius:2px;background:var(--line-2);margin:0 auto 12px;cursor:grab}
.sheet h2{font-size:18px;font-weight:800;letter-spacing:-.03em}
.sheet .sheet-desc{font-size:12.5px;color:var(--muted);margin-top:4px;line-height:1.6}
.sheet-close{position:absolute;right:10px;top:12px;width:36px;height:36px;display:grid;place-items:center;border-radius:10px;color:var(--muted)}
.sheet-close:hover{background:var(--band)}
/* 회원 정보 창(마이 [회원 정보] — 2026-10-18) — 아이디·회원 종류는 보기만, 이름 · 비밀번호 바꾸기 */
.acct-id{display:grid;gap:4px;margin-top:14px;padding:10px 12px;border-radius:12px;background:var(--surface);font-size:13px}
.acct-id div{display:flex;gap:10px}
.acct-id dt{min-width:64px;color:var(--muted)}
.acct-id dd{font-weight:700;overflow-wrap:anywhere}
.acct-form{margin-top:14px}
.acct-sec{margin-top:18px;padding-top:16px;border-top:1px solid var(--border)}
.acct-sec h3{font-size:15px;font-weight:800}
.acct-sec .acct-form{margin-top:10px}
/* 마이 업체 회원 메뉴(광고안내 · 광고신청 · 회원탈퇴) — 「마이」 제목 줄 오른쪽 끝, 커뮤니티 탭과 같은 흰 칩. 좁은 폰에서는 칩 줄만 옆으로 밀린다 (2026-10-30) */
.my-menu{flex:0 1 auto;min-width:0}
/* 칩 그림 — 업계 게시판 메뉴의 그림 칸(.menu-row .mi)처럼 연보라 네모에 보라 그림, 칩 안 왼쪽에 작게. 「마이」 글자는 줄지 않고 칩 줄이 오른쪽 끝에
   폰은 칩을 조금 작게 해서 360 · 375 에서도 제목 줄 한 줄에 (2026-10-30 「이 메뉴에 이런식으로 이미지를 넣어줘」 → 「칩 안 왼쪽에 작게」) */
.my-page .page-head h1{flex:none}
.my-menu{margin-left:auto}
.my-menu .chip{gap:6px;padding:0 13px 0 6px}
.my-ic{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:var(--primary-soft);color:var(--primary);flex:none}
@media (max-width:767px){.my-menu{gap:5px}.my-menu .chip{height:32px;gap:4px;padding:0 9px 0 4px;font-size:12.5px}.my-ic{width:22px;height:22px;border-radius:7px}}
/* 회원 탈퇴 창 — 지워지는 것 목록 · 「탈퇴 신청하기」는 보라(토큰 --withdraw, 2026-11-01 사용자가 정한 색), 운영 관리 「탈퇴 승인」은 빨강 */
.withdraw-list{margin:4px 0 14px;padding:12px 14px 12px 30px;border-radius:12px;background:var(--danger-soft);color:var(--text);font-size:13px;line-height:1.65;list-style:disc}
.withdraw-list li+li{margin-top:4px}
.btn-withdraw{background:var(--withdraw);color:var(--primary-ink)}
.btn-withdraw:hover{background:color-mix(in srgb,var(--withdraw) 88%,#000)}
.btn-danger{background:var(--danger);color:#fff}
.btn-danger:hover{background:color-mix(in srgb,var(--danger) 88%,#000)}
/* 탈퇴 신청 중 — 마이 보라 칸 아래 알림 + [신청 취소] · 운영 관리 회원 줄의 「탈퇴 신청」 표시 (2026-10-30 관리자 승인 방식) */
.withdraw-wait{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-4px 0 14px;padding:10px 12px 10px 14px;border-radius:12px;background:var(--danger-soft);color:var(--danger);font-size:13px;font-weight:700;line-height:1.5}
.withdraw-wait .btn{flex:none}
.badge.withdraw{margin-left:6px;background:var(--danger-soft);color:var(--danger)}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes rise{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
@media (min-width:768px){
	.sheet{left:50%;top:50%;bottom:auto;right:auto;width:min(520px,calc(100% - 40px));transform:translate(-50%,-50%);border-radius:22px;padding:22px 24px 24px;animation:pop .3s var(--ease)}
	.sheet::before{display:none}
}
@keyframes pop{from{opacity:0;transform:translate(-50%,-46%)}to{opacity:1;transform:translate(-50%,-50%)}}

/* ---------- 로그인·회원가입 창 (ui/AuthModal, 2026-10-05) — 요즘 흔한 단순한 모양. 폰은 아래에서 올라오고 PC 는 가운데(폭 420) ---------- */
@media (min-width:768px){.auth-sheet{width:min(420px,calc(100% - 40px))}}
/* 업체 전용 로그인 창(「광고 안내」) — 가입 종류 「바꾸기>」를 숨긴다(업체 가입만, 2026-10-30) */
.auth-only .role-chosen button{display:none}
/* 비밀번호 칸 + 보기 버튼 (.field>span 규칙이 이 칸에도 걸리지 않게 되돌린다) */
.field>.pw-input{position:relative;display:block;margin:0;font-size:inherit;font-weight:inherit}
.pw-input input{padding-right:46px}
.pw-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:38px;height:38px;display:grid;place-items:center;border-radius:10px;color:var(--muted);transition:background-color .2s var(--ease),color .2s var(--ease)}
.pw-eye:hover{background:var(--band);color:var(--text)}
.auth-switch{margin-top:14px;text-align:center;font-size:13.5px;color:var(--muted)}
.auth-switch button{margin-left:4px;font-weight:800;color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.auth-examples{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line-2)}
.auth-or{display:block;text-align:center;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:10px}
.auth-example-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.auth-example-row .btn{padding:0 6px;white-space:nowrap}
/* 회원가입 첫 단계 — 고객 / 업체 두 칸 */
.role-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}
.role-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 10px 18px;border-radius:16px;border:1.5px solid var(--border);background:var(--card);text-align:center;transition:border-color .2s var(--ease),background-color .2s var(--ease),transform .15s var(--ease)}
.role-card:hover{border-color:var(--primary);background:var(--primary-soft)}
.role-card:active{transform:scale(.98)}
.role-ic{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary)}
.role-card b{font-size:16px;font-weight:800}
.role-card>span:last-child{font-size:12px;color:var(--muted);line-height:1.5}
.role-chosen{margin-top:12px;font-size:13.5px;font-weight:700;color:var(--primary-strong)}
/* 「바꾸기>」 밑줄은 2026-11-02 사용자 「바꾸기 밑줄 없애줘」로 뺐다 */
.role-chosen button{margin-left:6px;font-size:12.5px;font-weight:600;color:var(--muted)}
.auth-sheet .pledge{margin-top:0}
/* 폰 로그인 · 회원가입 창 — 머리 바로 밑까지 올리고, 생긴 자리만큼 칸 · 버튼을 키운다(46 → 최대 60px) (2026-10-31 사용자 「하단 모달도 좀 더 위로 헤드 밑에까지는 올라가게 해야지 더 잘보일거 아냐 ! 그나만 작은 휴대폰 화면인데 !」 → 「칸과 버튼을 키움」 · 「로그인·회원가입 창만」)
   머리 키는 제목 줄 58px · 첫 화면 66px 중 큰 쪽. 화면이 짧으면 칸은 46px 그대로이고 창 안에서 스크롤, 더 남는 자리는 칸 사이로 나눈다. dvh 를 모르는 옛 브라우저는 지금처럼 내용만큼 */
@media (max-width:767px){
	@supports (height:100dvh){
		.auth-sheet{display:flex;flex-direction:column;height:calc(100dvh - 66px);max-height:none}
		.auth-sheet::before,.auth-sheet>*{flex:none}
		.auth-sheet .form{flex:1 0 auto;display:flex;flex-direction:column;justify-content:space-between}
		.auth-sheet .form>.field{flex:1 0 auto;display:flex;flex-direction:column;max-height:87px}
		.auth-sheet .form>.btn{flex:1 0 46px;max-height:60px;font-size:15.5px}
		.auth-sheet .field input{flex:1 1 46px;min-height:46px;max-height:60px;font-size:16px}
		.auth-sheet .field>.pw-input{flex:1 1 46px;display:flex;align-items:stretch;min-height:46px;max-height:60px}
		.auth-sheet .pw-input input{height:auto}
		.auth-sheet .role-pick{margin-top:auto;margin-bottom:auto}
	}
}
/* 로그인 창 위 안내 한 줄 — 왜 로그인해야 하는지 (예: 후기를 쓰려면 로그인해 주세요, 2026-10-05) */
.auth-notice{margin-top:12px;padding:10px 12px;border-radius:12px;background:var(--primary-soft);color:var(--info-ink);font-size:13.5px;font-weight:700;line-height:1.5}
/* 업체 화면 위 상태 줄 — 입점 심사 중(골드) · 숨김(회색) — 그 매장 주인(업체)과 관리자에게만 보인다 */
.shop-state{display:flex;align-items:center;gap:8px;margin:8px 16px 0;padding:11px 14px;border-radius:12px;background:var(--band);color:var(--muted);font-size:13.5px;font-weight:700;line-height:1.5}
.shop-state svg{flex:none}
.shop-state.is-pending{background:rgba(var(--accent-rgb),.22);color:var(--on-gold)}
@media (min-width:1024px){.shop-state{max-width:1152px;margin:12px auto 0}}

/* ---------- 입력 양식 ---------- */
.form{display:grid;gap:14px;margin-top:16px}
.field{display:block;min-width:0}
.field>span,.field>label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;margin-bottom:6px}
.field>span em{font-style:normal;color:var(--pink);font-size:12px}
.field input,.field select,.field textarea{width:100%;border-radius:var(--r-field);border:1px solid var(--border);background:var(--surface);padding:0 12px;height:46px;font-size:15px;color:var(--text);transition:border-color .2s var(--ease),background-color .2s var(--ease)}
.field textarea{height:auto;min-height:130px;padding:12px;line-height:1.75;resize:vertical}
.field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 20px,calc(100% - 13px) 20px;background-size:5px 5px;background-repeat:no-repeat;padding-right:32px}
.field input::placeholder,.field textarea::placeholder{color:var(--ph);font-size:13.5px}
/* 홍보글 작성 업체명 칸 오른쪽 돋보기 — 누르면 업체 불러오기(엔터와 같음), 새 매장 등록에서만 (2026-10-30) */
.name-search{position:relative}
.name-search.has-go input{padding-right:46px}
.name-search-go{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:36px;height:36px;display:grid;place-items:center;border-radius:10px;color:var(--primary)}
.name-search-go:hover{background:var(--band)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--primary);background:var(--card)}
.field .help{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.6}
/* 칸 아래 주의 안내 — 제휴문의 연락처에 숫자가 아닌 글자를 쳤을 때 (2026-11-01 사용자 「한글을 쓰면 … 아래에 안문구넣어줘」) */
.field .help.is-warn{color:var(--danger)}
/* 업체 불러오기(매장 등록 업체명 — 2026-10-18) — 「필수」 옆 안내는 좁으면 다음 줄로, 찾은 업체는 눌러서 그 업체 고치기로 */
.field>label.with-hint{flex-wrap:wrap;row-gap:2px}
.field-hint{font-size:12px;font-weight:500;line-height:1.5;color:var(--muted)}
.lookup{margin-top:8px;padding:10px;border:1px solid var(--border);border-radius:var(--r-field);background:var(--card)}
.lookup-head{font-size:12.5px;line-height:1.6;color:var(--muted)}
.lookup-list{display:grid;gap:6px;margin-top:8px;max-height:320px;overflow:auto}
.lookup-item{display:block;width:100%;text-align:left;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);cursor:pointer;transition:border-color .2s var(--ease)}
.lookup-item:hover:not(:disabled){border-color:var(--primary)}
.lookup-item b{display:block;font-size:14px;color:var(--text)}
.lookup-item span{display:block;margin-top:2px;font-size:12px;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}
.lookup-item em{display:block;margin-top:4px;font-style:normal;font-size:12px;font-weight:700;color:var(--primary)}
.lookup-item:disabled{cursor:default;opacity:.6}
.lookup-item:disabled em{color:var(--muted)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.star-pick{display:flex;gap:4px}
.star-pick button{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;color:var(--line-2);transition:color .15s var(--ease),transform .15s var(--ease)}
.star-pick button.on{color:var(--star)}
.star-pick button svg{width:28px;height:28px;fill:currentColor;stroke:none}
.star-pick button:hover{transform:scale(1.1)}
.count{font-size:11.5px;color:var(--muted);text-align:right;margin-top:4px}

/* ---------- 내 주변 ---------- */
.locate-card{display:flex;align-items:center;gap:12px;padding:14px;border-radius:18px;background:var(--hero-bg);color:var(--primary-ink);box-shadow:0 14px 28px -18px rgba(var(--shadow-rgb),.6);margin-bottom:12px}
.locate-card div{flex:1;min-width:0}
.locate-card b{display:block;color:var(--primary-ink);font-size:15px}
.locate-card span{display:block;font-size:12.5px;opacity:.82;line-height:1.5}
.locate-card .btn{background:var(--gold-grad);color:var(--on-gold);box-shadow:none;flex:none}
.locate-card .btn:hover{filter:brightness(1.06)}
.geo-msg{font-size:12.5px;line-height:1.6;padding:10px 12px;border-radius:12px;background:var(--primary-soft);color:var(--info-ink);margin-bottom:12px}
.near-layout{display:grid;gap:12px}
/* 핀을 누르면 지도로 내려가는데, 폰의 위 머리(58px, 붙어 있음)에 지도 위쪽 · 이름표가 가리지 않게 (2026-10-27) */
.near-map{scroll-margin-top:66px}
@media (min-width:1024px){.near-layout{grid-template-columns:minmax(0,1fr) 420px;align-items:start}.near-map{position:sticky;top:90px}.map-box iframe,.shop-map,.map-wait{height:420px}}
.near-list{display:grid;gap:8px}
.near-row{display:flex;align-items:stretch;width:100%;border-radius:16px;background:var(--card);border:1px solid var(--border);overflow:hidden;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.near-row:hover{border-color:rgba(var(--primary-rgb),.35)}
.near-row.is-on{border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary)}
.near-main{flex:1;min-width:0;display:flex;align-items:center;gap:12px;padding:10px;text-align:left}
.near-main img{width:64px;height:64px;border-radius:12px;object-fit:cover;flex:none}
.near-main div{flex:1;min-width:0}
.near-main b{display:block;font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.near-main span{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.near-main .dist{flex:none;font-size:13px;font-weight:800;color:var(--primary);background:var(--primary-soft);padding:4px 8px;border-radius:8px}
.near-main .go{flex:none;color:var(--muted)}
.near-pin{width:52px;flex:none;display:grid;place-items:center;border-left:1px solid var(--border);color:var(--primary);transition:background-color .2s var(--ease)}
.near-pin:hover,.near-row.is-on .near-pin{background:var(--primary-soft)}
.map-go{display:inline-flex;align-items:center;gap:2px;font-weight:800;color:var(--primary);flex:none}
.map-go:hover{text-decoration:underline}

/* ---------- 마이 · 운영자 ---------- */
.menu-group{background:var(--card);border-radius:18px;border:1px solid var(--border);overflow:hidden;margin-bottom:14px}
.menu-group h2{font-size:12.5px;font-weight:700;color:var(--muted);padding:14px 16px 6px}
.menu-row{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;border-top:1px solid var(--border);text-align:left;font-size:14.5px;font-weight:600;transition:background-color .2s var(--ease)}
.menu-group h2+.menu-row{border-top:0}
.menu-row:hover{background:var(--surface)}
.menu-row .mi{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);flex:none}
.menu-row div{flex:1;min-width:0}
.menu-row small{display:block;font-size:12px;color:var(--muted);font-weight:500;line-height:1.5}
.menu-row .go{color:var(--muted)}
.profile{display:flex;align-items:center;gap:14px;padding:18px;border-radius:20px;background:var(--hero-bg);color:var(--primary-ink);margin-bottom:14px;box-shadow:0 14px 28px -18px rgba(var(--shadow-rgb),.6)}
.profile .av{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--ink-rgb),.12);color:var(--primary-ink)}
.profile b{display:block;font-size:16px}
.profile span{display:block;font-size:12.5px;opacity:.8}
/* 마이 로그인 상태 — 폰은 버튼을 아래 줄에 꽉 차게, 넓은 화면은 오른쪽에 (2026-10-05) */
.profile{flex-wrap:wrap}
.profile-text{flex:1;min-width:0}
.profile-actions{display:flex;gap:8px;width:100%}
.profile-actions .btn{flex:1}
.profile-actions.is-one{width:auto;margin-left:auto}
.profile-actions.is-one .btn{flex:none}
@media (min-width:480px){.profile-actions{width:auto;margin-left:auto}.profile-actions .btn{flex:none}}
.credits{display:grid;gap:4px;font-size:12px;color:var(--muted);padding:6px 16px 14px}
.credits a{text-decoration:underline}
.admin-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-top:1px solid var(--border)}
.admin-row:first-child{border-top:0}
.admin-row img{width:48px;height:48px;border-radius:10px;object-fit:cover;flex:none}
.admin-row div{flex:1;min-width:0}
.admin-row b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-row span{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-row.is-hidden b,.admin-row.is-hidden img{opacity:.45}
/* 운영자 — 첫 화면 광고 넣기·빼기 */
.ad-admin{margin:18px 0 22px}
.ad-admin-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.ad-admin-head h2{display:flex;align-items:center;gap:6px;font-size:16px;font-weight:800;letter-spacing:-.02em}
.ad-admin-head h2 svg{color:var(--primary)}
.ad-count{flex:none;font-size:12.5px;font-weight:800;color:var(--primary);background:var(--primary-soft);padding:3px 10px;border-radius:999px}
.ad-admin>.note{margin-bottom:10px}
.ad-admin .menu-group{margin-bottom:10px}
.ad-no{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:800;color:var(--primary);background:var(--primary-soft)}
.ad-empty{padding:14px}
/* 목록 중간 줄 광고의 남은 칸 — 사진 있는 줄과 같은 높이, 글자는 흐리게 (2026-10-30 두 곳 따로 관리) */
.admin-row.ad-slot{min-height:73px}
.admin-row.ad-slot b{color:var(--muted);font-weight:600}
.ad-pick{display:flex;gap:8px;align-items:center}
.ad-pick .select-wrap{flex:1;min-width:0}
.ad-pick .select-wrap select{width:100%;height:36px}
/* 광고 넣을 업체 검색 칸 — 「광고로 넣을 업체 고르기」 바로 위, 아래 「전체 업체」 검색 칸과 같은 모양 (2026-10-19) */
.ad-search{background:var(--card);border:1px solid var(--border);height:42px;margin-bottom:8px;z-index:auto}
.ad-search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.switch{position:relative;width:44px;height:26px;border-radius:13px;background:var(--line-2);flex:none;transition:background-color .2s var(--ease)}
.switch::after{content:'';position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:var(--card);box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s var(--ease)}
.switch.on{background:var(--primary)}
.switch.on::after{transform:translateX(18px)}
.admin-tools{display:flex;gap:8px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.admin-tools .search{background:var(--card);border:1px solid var(--border);height:42px;flex:1;min-width:200px}
/* 운영 화면 탭 — 매장·광고 · 입점 승인 · 회원 · 후기·게시글 · 쿠폰 현황 (2026-10-05) */
.admin-tabs{margin:4px 0 14px}
.admin-sub{margin:2px 0 12px}
.admin-h2{display:flex;align-items:baseline;gap:6px;font-size:16px;font-weight:800;letter-spacing:-.02em;margin:6px 0 6px}
.admin-h2 small{font-size:12.5px;font-weight:700;color:var(--muted)}
.admin-sec>.note{margin-bottom:10px}
.admin-h3{display:flex;align-items:baseline;gap:6px;font-size:14px;font-weight:800;margin:16px 0 8px}
/* 회원 제재 — 경고(금색) · 글쓰기 제한(옅은 빨강) · 정지(빨강), 고르기 칸은 늘어나지 않게 (2026-10-05) */
.badge.sanction{border:0}
.badge.s-warn{background:rgba(var(--accent-rgb),.28);color:var(--on-gold)}
.badge.s-limit{background:var(--danger-soft);color:var(--danger)}
.badge.s-suspend{background:var(--danger);color:#fff}
.admin-row .member-sanction{flex:none;width:118px}
.admin-row .member-sanction select{width:100%;height:34px;font-size:12.5px}
.member-row{flex-wrap:wrap}
.member-row>div:not(.member-sanction){flex:1 1 180px}
.member-row .member-sanction{margin-left:auto}
.profile-alert{margin:-4px 0 14px}
.my-revs{padding:0 16px}
.menu-group .my-note{padding:2px 16px 10px}
.admin-h3 small{font-size:12px;font-weight:700;color:var(--muted)}
.admin-row .mi{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--primary-soft);color:var(--primary);flex:none}
.admin-row b .badge{display:inline-flex;margin-left:6px;vertical-align:1px}
.admin-row .row-actions{display:flex;gap:6px;flex:none}
.admin-row .row-actions .btn{white-space:nowrap}
/* 승인·숨기기 줄 — 좁은 폭에서는 버튼이 다음 줄 오른쪽으로 (이름·사업자 정보가 잘리지 않게) */
.approve-row,.mod-row{flex-wrap:wrap}
.approve-row>div:not(.row-actions),.mod-row>div:not(.row-actions){flex:1 1 200px}
.approve-row .row-actions,.mod-row .row-actions{margin-left:auto}
/* 승인할 때 보는 사업자 정보·서약 줄은 잘리지 않게 접는다 */
.admin-row.approve-row span{white-space:normal}
.admin-row .mod-text{margin-top:4px;font-size:13px;line-height:1.5;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.admin-row .coupon-nums{display:grid;grid-template-columns:auto auto;gap:0 5px;align-items:baseline;flex:none}
.admin-row .coupon-nums b{font-size:16px;text-align:right}
.admin-row .coupon-nums small{font-size:11.5px;color:var(--muted)}

/* ---------- 업체 글쓰기 ---------- */
.write-layout{display:block}
.ed-head{position:sticky;top:0;z-index:30;background:var(--bar-bg);color:var(--primary-ink)}
.ed-head .wrap{display:flex;align-items:center;gap:6px;min-height:56px}
.ed-head h1{flex:1;text-align:center;font-size:17px;font-weight:800;letter-spacing:-.02em}
.ed-head .icon-btn:hover{background:rgba(var(--ink-rgb),.12)}
.ed-head .txt{font-size:13px;font-weight:700;color:var(--primary-ink);padding:8px 6px}
/* 소유 신청 안내 — 주인 없는 매장을 업체 회원이 고칠 때 (2026-10-05) */
.ed-claim{display:flex;align-items:flex-start;gap:8px;margin:8px 0 4px;padding:11px 13px;border-radius:12px;background:rgba(var(--accent-rgb),.22);color:var(--on-gold);font-size:12.5px;font-weight:600;line-height:1.6}
.ed-claim svg{flex:none;margin-top:2px}
.ed-hint{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;color:var(--primary);background:var(--primary-soft);padding:10px 12px;border-radius:12px;margin:14px 0 4px}
.ed-sec{padding:18px 0;border-bottom:8px solid var(--band)}
.ed-sec:last-of-type{border-bottom:0}
.ed-sec>h2{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:800;letter-spacing:-.02em;margin-bottom:12px}
.ed-sec>h2 em{font-style:normal;width:24px;height:24px;border-radius:8px;background:var(--primary);color:var(--primary-ink);font-size:12.5px;display:grid;place-items:center}
.ed-sec>h2 small{font-size:12px;color:var(--muted);font-weight:600;margin-left:auto}
/* 기본 정보 안의 소제목 — 사업자 정보 */
.ed-sub{display:flex;align-items:baseline;gap:8px;margin-top:8px;padding-top:14px;border-top:1px dashed var(--line-2);font-size:14px;font-weight:800}
.ed-sub small{font-size:12px;font-weight:600;color:var(--muted)}
.ed-photos{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media (min-width:768px){.ed-photos{grid-template-columns:repeat(5,1fr)}}
.ed-add{position:relative;aspect-ratio:1;border-radius:12px;border:1.5px dashed var(--primary);color:var(--primary);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11.5px;font-weight:700;background:var(--primary-soft);cursor:pointer;transition:background-color .2s var(--ease)}
.ed-add:hover{background:var(--card)}
.ed-add input{position:absolute;inset:0;opacity:0;cursor:pointer}
.ed-add.busy{opacity:.6}
.ed-ph{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--band)}
.ed-ph img{width:100%;height:100%;object-fit:cover}
.ed-ph .rep{position:absolute;left:0;right:0;bottom:0;font-size:10.5px;text-align:center;background:var(--primary);color:var(--primary-ink);padding:2px 0;font-weight:700}
.ed-ph .ratio{position:absolute;left:4px;top:4px;font-size:9.5px;font-weight:700;color:#fdfcff;background:rgba(20,16,30,.58);padding:1px 5px;border-radius:4px}
.ed-ph .ph-tools{position:absolute;right:3px;top:3px;display:flex;flex-direction:column;gap:3px}
.ed-ph .ph-tools button{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;background:rgba(20,16,30,.58);color:#fdfcff}
.ed-ph .ph-tools button:hover{background:rgba(20,16,30,.8)}
.ed-ph .ph-tools svg{width:14px;height:14px}
.course-head,.course{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr) minmax(0,1fr) 36px;gap:6px;align-items:center}
.course-head span{font-size:11.5px;font-weight:700;color:var(--muted);padding-left:4px}
.course{margin-top:6px}
.course input{height:44px;border-radius:10px;border:1px solid var(--border);background:var(--surface);padding:0 10px;font-size:14px;width:100%;min-width:0;transition:border-color .2s var(--ease)}
.course input:focus{outline:none;border-color:var(--primary);background:var(--card)}
.course .del{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;color:var(--muted)}
.course .del:hover{background:var(--danger-soft);color:var(--danger)}
.ed-btns{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.ghost-btn{flex:1;min-width:130px;height:42px;border-radius:12px;border:1px dashed var(--line-2);font-size:13px;font-weight:700;color:var(--primary);display:flex;align-items:center;justify-content:center;gap:5px;transition:border-color .2s var(--ease),background-color .2s var(--ease)}
.ghost-btn:hover{border-color:var(--primary);background:var(--primary-soft)}
.samples{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.samples>span{font-size:12px;font-weight:700;color:var(--muted);margin-right:2px}
.pill{font-size:12.5px;font-weight:700;padding:7px 12px;border-radius:999px;border:1px solid var(--border);color:var(--muted);background:var(--card);transition:border-color .2s var(--ease),color .2s var(--ease)}
.pill:hover,.pill.is-on{border-color:var(--primary);color:var(--primary)}
.ai-btn{margin-top:9px;width:100%;height:46px;border-radius:12px;background:var(--primary-soft);color:var(--primary);font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;gap:6px;transition:background-color .2s var(--ease),color .2s var(--ease)}
.ai-btn:hover{background:var(--primary);color:var(--primary-ink)}
.typing::after{content:'';display:inline-block;width:2px;height:15px;margin-left:1px;background:var(--primary);vertical-align:-2px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.admin-fold{margin-top:4px;border:1px solid var(--border);border-radius:14px;background:var(--card)}
.admin-fold summary{display:flex;align-items:center;gap:8px;padding:13px 14px;font-size:13.5px;font-weight:700;cursor:pointer;list-style:none}
.admin-fold summary::-webkit-details-marker{display:none}
.admin-fold summary small{font-weight:500;color:var(--muted)}
.admin-fold .form{margin:0;padding:0 14px 14px}
.check{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;cursor:pointer}
.check input{width:20px;height:20px;accent-color:var(--primary)}
/* 광고신청 창 — 안내 · 기간과 가격 고르기(보라 글자), 둘 중 하나만 골라지지만 모양은 보낸 그림의 네모 칸 (2026-11-01 사용자 그림 · 「가격체크는 둘중 하나를 선택」), 은행 입금 안내(검정 글자 — 같은 날 「글씨색은 검정색으로 해줘」) */
.ad-plan{display:grid;gap:4px;color:var(--primary);font-size:13px;font-weight:700;line-height:1.6}
.ad-plan-opts{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:8px}
.check.ad-plan-opt{font-size:13.5px;font-weight:700;color:var(--primary)}
.ad-plan-opt input{-webkit-appearance:none;appearance:none;flex:none;display:grid;place-items:center;margin:0;border:1.5px solid var(--muted);border-radius:5px;background:var(--card);cursor:pointer}
.ad-plan-opt input:checked{background:var(--primary);border-color:var(--primary)}
.ad-plan-opt input:checked::after{content:'';width:5px;height:10px;margin-top:-2px;border:solid var(--primary-ink);border-width:0 2px 2px 0;transform:rotate(45deg)}
.ad-pay{color:var(--text);font-size:13px;font-weight:700;line-height:1.6}
.ad-pay span{white-space:nowrap}
.write-actions{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:7px;padding:10px 14px calc(10px + var(--safe-b));background:var(--card);background:color-mix(in srgb,var(--card) 94%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-top:1px solid var(--border)}
.write-actions .btn{flex:1;height:50px}
.write-actions .btn-primary{flex:1.4}
.preview-pane{display:none}
.preview-overlay{position:fixed;inset:0;z-index:70;background:var(--surface);overflow-y:auto;animation:fade .25s var(--ease)}
.preview-bar{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--text);color:var(--primary-ink);font-size:13px;font-weight:700}
.preview-bar span{flex:1}
.preview-bar button{height:34px;padding:0 12px;border-radius:10px;background:rgba(var(--ink-rgb),.14);font-size:13px;font-weight:700}
@media (min-width:1024px){
	.write-layout{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:28px;max-width:1200px;margin:0 auto;padding:18px 24px 40px;align-items:start}
	.write-layout .wrap{padding:0}
	.write-form{background:var(--card);border-radius:22px;border:1px solid var(--border);padding:6px 24px 10px}
	.ed-head{position:static;background:none;color:var(--text)}
	.ed-head .wrap{max-width:1200px;padding:0 24px;min-height:74px}
	.ed-head h1{text-align:left;font-size:24px}
	.ed-head .txt{color:var(--primary)}
	.ed-head .icon-btn:hover{background:var(--band)}
	.write-actions{position:static;padding:14px 0 6px;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;border-top:1px solid var(--border);margin-top:4px}
	.write-actions .preview-btn{display:none}
	.preview-pane{display:block;position:sticky;top:88px}
	.preview-pane>p{font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:8px;display:flex;align-items:center;gap:6px}
	.phone-frame{width:100%;height:calc(100vh - 150px);max-height:820px;border-radius:40px;background:#17151d;padding:9px;box-shadow:0 30px 60px -28px rgba(var(--shadow-rgb),.5)}
	.phone-screen{width:100%;height:100%;border-radius:32px;overflow-y:auto;overflow-x:hidden;background:var(--surface);scrollbar-width:none;position:relative}
	.phone-screen::-webkit-scrollbar{display:none}
	.phone-screen .detail{padding:0}
	.phone-screen .detail-grid{display:block;padding:0}
	.phone-screen .gallery{border-radius:0;aspect-ratio:4/5}
	.phone-screen .d-head{margin-top:-18px;border-radius:22px 22px 0 0}
	.phone-screen .d-tabs{top:0;border-radius:0;margin:0;border-width:0 0 1px}
	.phone-screen .d-sec{border-radius:0;border:0;border-bottom:8px solid var(--band);margin:0}
	.phone-screen .d-aside{display:none}
	.phone-screen .gal-arrow{display:none}
	.phone-screen .detail{pointer-events:none}
	.phone-screen .cta-bar{display:flex;position:sticky;bottom:0}
	.phone-screen .cta-space{display:none}
	.phone-screen .gal-top .back-btn{display:grid}
}

/* ---------- 스크롤 진입 ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .5s var(--ease),transform .7s var(--ease)}
.reveal.is-in{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
	*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
	.reveal{opacity:1;transform:none}
	/* 움직임을 줄인 기기 — 나가는 광고는 밀려 나가지 않고 바로 사라진다 */
	.hero-ad-slide.is-out{visibility:hidden}
}
/* 폰 미리보기 창: 위쪽 안내 줄 아래에 상세 탭이 붙게 */
.preview-overlay .d-tabs{top:54px}
.preview-overlay .detail-back{display:none}
@media (min-width:1024px){.ed-head .txt{display:none}}
.credits-fold{border-top:1px solid var(--border)}
.credits-fold summary{padding:13px 16px;font-size:13.5px;font-weight:700;cursor:pointer;list-style:none}
.credits-fold summary::-webkit-details-marker{display:none}
.credits-fold summary::after{content:' 펼치기';font-size:12px;font-weight:600;color:var(--muted)}
.credits-fold[open] summary::after{content:' 접기'}
.credits a{display:inline-flex;align-items:center;gap:3px}
.info-dl{display:grid;grid-template-columns:72px 1fr;gap:8px 12px;font-size:13.5px;line-height:1.6;margin-bottom:12px}
.info-dl dt{color:var(--muted)}
.info-dl dd{font-weight:600;min-width:0}
/* 아주 좁은 폰(≤360px)에서 관리 종류 동그라미를 줄이던 규칙은 2026-10-15 한 줄 밀기로 바꾸며 뺐다 — 크기 그대로 밀어서 본다 */
/* ---------- 마감: 깊이감·반응 보강 (premium-design 품질 게이트) ---------- */
.phone-screen{isolation:isolate}
/* 카드 빛 반사 — 마우스를 올리면 사진 위로 은은한 빛이 한 번 지나간다 */
.card::before,.ad-card::before{content:'';position:absolute;top:0;left:-60%;width:40%;height:62%;z-index:10;pointer-events:none;background:linear-gradient(105deg,transparent,rgba(255,250,240,.28),transparent);transform:skewX(-12deg);opacity:0;transition:left .7s var(--ease),opacity .3s var(--ease)}
.card:hover::before,.ad-card:hover::before{left:120%;opacity:1}
/* 진한 자주색 영역의 점 무늬 */
.hero::before,.promo::before,.locate-card::before,.profile::before{content:'';position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(var(--ink-rgb),.12) 1px,transparent 1.2px);background-size:18px 18px;mask-image:linear-gradient(90deg,transparent,#221a2c 70%);-webkit-mask-image:linear-gradient(90deg,transparent,#221a2c 70%)}
.locate-card,.profile{position:relative;overflow:hidden}
.locate-card>*,.profile>*{position:relative;z-index:10}
/* 빠져 있던 마우스 올림 반응 */
.heart:hover{background:rgba(20,16,30,.45)}
.switch:hover{filter:brightness(.94)}
.select-wrap select:hover{border-color:var(--primary)}
.credits-fold summary:hover{color:var(--primary)}
/* ---------- 커뮤니티 게시판 ---------- */
.board-tabs{padding-top:2px}
/* 커뮤니티 탭 줄 끝 「업계 게시판 ›」 — 폰 전용 입구 (PC 는 상단 메뉴 세 버튼). 다른 화면으로 가는 칩이라 점선 테두리 */
.biz-entry{gap:2px;color:var(--primary);border-style:dashed;border-color:rgba(var(--primary-rgb),.45)}
@media (min-width:1024px){.biz-entry{display:none}}
/* ---------- 업계 게시판 (구인구직·임대·매매·용품판매, 2026-10-04 커뮤니티에서 분리) ---------- */
/* 폰: 머리(고정) 아래 게시판 이동 탭은 고정하지 않는다(머리와 겹치지 않게) → 안내 → 목록 */
.biz-tabs{position:static}
.biz-layout{padding-top:14px}
.biz-aside .page-intro{margin:0 0 10px}
.biz-aside .board-rule{margin:0 0 12px;display:flex;align-items:flex-start;gap:8px;font-weight:600}
.biz-aside .board-rule svg{flex:none;margin-top:3px;color:var(--primary)}
/* PC: 상단 세 버튼이 게시판 이동을 맡아 탭·뒤로는 숨기고, 왼쪽 목록 / 오른쪽 안내 상자(업체 상세 옆 상자와 같은 모양) */
@media (min-width:1024px){
	.biz-back,.biz-tabs{display:none}
	.biz-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start;padding-top:0}
	.biz-aside{grid-column:2;grid-row:1;position:sticky;top:88px;background:var(--card);border-radius:22px;box-shadow:var(--shadow);border:1px solid var(--border);padding:20px}
	.biz-aside .board-rule{margin-bottom:0}
	.biz-list{grid-column:1;grid-row:1;min-width:0}
}
/* 업계 게시판 글쓰기 — 칸 밖 도움말 줄(면적 단위 안내) · 샘플 안내(샘플 버튼 바로 아래) · 면적 단위 고르기(면적 칸 바로 아래) */
.form>.help{font-size:12px;color:var(--muted);line-height:1.6;margin-top:-8px}
.form>.sample-note{margin-top:-14px;padding:9px 12px;border-radius:12px;background:var(--primary-soft);color:var(--info-ink);font-size:12.5px}
.seg.area-unit{margin:-6px 0 0}
/* 업계 게시판 목록 — 거르기 칩 두 줄(말머리·지역) + 결과 개수 / 글 줄 ② 핵심 줄: 돈은 굵은 보라, 보조는 작은 본문색 (돈이 잘리지 않게 줄바꿈 허용) */
.biz-filter{display:grid;gap:6px;margin-bottom:10px}
.biz-count{font-size:12.5px;font-weight:700;color:var(--muted);margin-top:2px}
.biz-row .badge{flex:none}
.biz-key{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px;margin-top:6px;line-height:1.5}
.biz-key b{font-size:14px;font-weight:800;color:var(--primary);letter-spacing:-.01em}
.biz-key b>span{white-space:nowrap}
.biz-key>span{font-size:12.5px;color:var(--text);min-width:0}
/* 업계 글 상세 — 핵심 칸(업체 상세 .facts 모양, 폰 2×2 · 3칸이면 마지막 칸을 길게 · 넓은 화면은 한 줄) · 연락 + 복사 · 확정 문구 + 예방 안내 */
.facts.biz-facts{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:16px}
.biz-facts div{padding:10px 8px;background:var(--card);border:1px solid var(--border)}
.biz-facts div:last-child:nth-child(odd){grid-column:1/-1}
/* 업계 글 값은 말줄임 대신 줄바꿈 — 매매 시설·긴 동네 이름이 잘리면 끝까지 볼 방법이 없다 (리뷰 M2) */
.biz-facts b{font-size:13px;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.45}
@media (min-width:768px){
	.facts.biz-facts{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
	.biz-facts div:last-child:nth-child(odd){grid-column:auto}
}
.biz-contact{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.biz-contact>span{min-width:0}
.biz-contact small{display:block;font-size:11.5px;font-weight:600;color:var(--muted)}
.biz-contact .pill{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;flex:none}
.biz-guard{display:grid;gap:8px;margin-top:22px}
.biz-guard .board-rule{margin:0}
.biz-tip{display:flex;align-items:flex-start;gap:8px;padding:10px 12px;border-radius:12px;background:var(--danger-soft);color:var(--danger);font-size:12.5px;font-weight:600;line-height:1.7}
.biz-tip svg{flex:none;margin-top:3px}
.board-notice{display:flex;align-items:flex-start;gap:8px;padding:11px 13px;border-radius:12px;background:var(--primary-soft);box-shadow:inset 0 0 0 1px rgba(var(--primary-rgb),.28);color:var(--primary-strong);font-size:13px;font-weight:700;line-height:1.7;margin:-4px 0 10px}
.board-notice svg{flex:none;margin-top:3px;color:var(--primary)}
.board-rule{font-size:12.5px;line-height:1.7;padding:10px 12px;border-radius:12px;background:var(--primary-soft);color:var(--info-ink);margin:-4px 0 12px}
.post-list{display:grid;gap:8px}
.post-row{position:relative;display:block;width:100%;text-align:left;padding:13px 40px 12px 14px;border-radius:16px;background:var(--card);border:1px solid var(--border);transition:border-color .2s var(--ease),transform .2s var(--ease)}
.post-row:hover{border-color:rgba(var(--primary-rgb),.35);transform:translateY(-1px)}
.post-row.is-pinned{background:var(--primary-soft);border-color:color-mix(in srgb,var(--primary) 22%,var(--card))}
.post-row .go{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--muted)}
.post-top{display:flex;align-items:center;gap:6px;min-width:0}
.post-top b{font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.post-top svg{color:var(--primary);flex:none}
.post-row small{display:block;font-size:12px;color:var(--muted);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.post-tag{flex:none;font-size:11px;font-weight:800;padding:2px 7px;border-radius:6px;background:var(--primary-soft);color:var(--primary)}
.post-tag.tag-notice{background:var(--primary);color:var(--primary-ink)}
.post-tag.tag-event{background:var(--pink-soft);color:var(--pink)}
.post-tag.tag-job{background:#eef4ff;color:#3b5aa8}
.post-tag.tag-trade{background:#eef7f0;color:#2f6b4f}
.post-tag.tag-goods{background:#fff3e3;color:#94541a}
.post-tag.tag-feedback{background:var(--band);color:var(--muted)}
.post-view{padding-top:6px;padding-bottom:40px;max-width:760px}
/* PC 공지 글 본문 왼쪽 세로선 — 약관 화면 세로선과 같은 자리 · 색 (2026-10-19 사용자 「그것처럼 공지에 넣어줘」) */
@media (min-width:1024px){.post-view.is-notice{position:relative}.post-view.is-notice::before{content:'';position:absolute;left:-42px;top:6px;bottom:40px;width:1px;background:var(--line-2)}}
.post-meta{display:flex;gap:6px;align-items:center}
.post-view h2{font-size:21px;font-weight:800;letter-spacing:-.03em;line-height:1.4;margin:10px 0 4px}
.post-by{font-size:12.5px;color:var(--muted)}
.post-info{margin:16px 0 0;padding:14px;border-radius:14px;background:var(--card);border:1px solid var(--border)}
.post-body{margin-top:16px;font-size:15px;line-height:1.9;white-space:pre-wrap}
/* 내 글 지우기 — 쓴 회원에게만 (2026-10-31) */
.post-actions{display:flex;justify-content:flex-end;margin-top:20px}
.post-shop{display:flex;align-items:center;gap:12px;width:100%;margin-top:20px;padding:10px;border-radius:16px;background:var(--card);border:1px solid var(--border);text-align:left;transition:border-color .2s var(--ease)}
.post-shop:hover{border-color:rgba(var(--primary-rgb),.35)}
.post-shop img{width:56px;height:56px;border-radius:12px;object-fit:cover;flex:none}
.post-shop div{flex:1;min-width:0}
.post-shop b{display:block;font-size:14.5px}
.post-shop span{display:block;font-size:12px;color:var(--muted)}
.ev-banner{display:flex;align-items:center;gap:10px;width:100%;margin-top:12px;padding:11px 12px;border-radius:14px;background:var(--hot-grad);color:var(--primary-ink);text-align:left;box-shadow:0 12px 26px -16px rgba(var(--hot-rgb),.8);transition:filter .2s var(--ease)}
.ev-banner:hover{filter:brightness(1.06)}
.ev-banner div{flex:1;min-width:0}
.ev-banner b{display:block;font-size:13.5px}
.ev-banner span{display:block;font-size:12.5px;color:rgba(var(--ink-rgb),.86);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- 쿠폰 — 핫핑크 그라데이션은 쿠폰 강조에만 (2026-09-28 확정) ---------- */
/* 업체 상세 쿠폰 카드 — 티켓 모양, 절취선 양끝 홈(--notch = 놓인 곳 바탕색) */
.coupon-card{margin-top:12px}
.coupon-ticket{--notch:var(--card);position:relative;display:flex;align-items:stretch;min-height:96px;border-radius:16px;background:var(--hot-grad);color:var(--primary-ink);box-shadow:0 14px 28px -16px rgba(var(--hot-rgb),.85);overflow:hidden}
.coupon-ticket::before,.coupon-ticket::after{content:'';position:absolute;right:97px;width:16px;height:16px;border-radius:50%;background:var(--notch)}
.coupon-ticket::before{top:-8px}
.coupon-ticket::after{bottom:-8px}
.coupon-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;padding:13px 14px 13px 16px}
.coupon-brand{font-size:10.5px;font-weight:700;letter-spacing:.04em;color:rgba(var(--ink-rgb),.82)}
.coupon-amount{font-size:22px;font-weight:900;letter-spacing:-.03em;line-height:1.3}
.coupon-title{font-size:13.5px;font-weight:700}
.coupon-until{font-size:11.5px;color:rgba(var(--ink-rgb),.86);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.coupon-side{flex:none;width:105px;display:grid;place-items:center;padding:8px;border-left:2px dashed rgba(var(--ink-rgb),.45)}
.coupon-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px;border-radius:12px;font-size:12.5px;font-weight:800;color:var(--primary-ink);transition:background-color .2s var(--ease),transform .15s var(--ease)}
.coupon-btn svg{width:24px;height:24px}
.coupon-btn small{font-size:10.5px;font-weight:600;opacity:.85}
button.coupon-btn:hover{background:rgba(var(--ink-rgb),.14)}
button.coupon-btn:active{transform:scale(.96)}
.coupon-btn.is-ghost{opacity:.8}
.coupon-more{margin-top:8px;border:1px solid var(--border);border-radius:14px;background:var(--card)}
.coupon-more summary{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 14px;font-size:13px;font-weight:700;cursor:pointer;list-style:none;transition:color .2s var(--ease)}
.coupon-more summary::-webkit-details-marker{display:none}
.coupon-more summary span{font-size:11.5px;font-weight:700;color:var(--pink)}
.coupon-more summary:hover{color:var(--primary)}
.coupon-lines{display:grid;grid-template-columns:92px minmax(0,1fr);gap:6px 12px;padding:2px 14px 12px;font-size:13px;line-height:1.6}
.coupon-lines dt{color:var(--muted)}
.coupon-lines dd{font-weight:600;min-width:0}
.coupon-howto{padding:0 14px 12px;font-size:12px;line-height:1.6;color:var(--muted)}
/* PC 오른쪽 문의 카드의 쿠폰 버튼 */
.aside-coupon{display:flex;align-items:center;gap:10px;width:100%;margin-bottom:10px;padding:11px 12px;border-radius:14px;background:var(--hot-grad);color:var(--primary-ink);text-align:left;box-shadow:0 10px 22px -14px rgba(var(--hot-rgb),.8);transition:filter .2s var(--ease)}
.aside-coupon span{flex:1;min-width:0;font-size:12px;font-weight:600}
.aside-coupon b{display:block;font-size:15px;font-weight:800}
.aside-coupon:hover{filter:brightness(1.06)}
.aside-coupon:disabled{cursor:default;filter:none}
/* 목록 카드의 쿠폰 표시 */
.card-coupon{display:inline-flex;align-items:center;gap:4px;margin-top:6px;padding:2px 8px;border-radius:999px;background:var(--hot-grad);color:var(--primary-ink);font-size:11px;font-weight:800}

/* 쿠폰함 */
.coupon-list{display:grid;gap:10px;margin-top:4px;padding-bottom:24px}
.coupon-row{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border-radius:16px;background:var(--card);border:1px solid var(--border);text-align:left;transition:border-color .2s var(--ease),transform .2s var(--ease)}
.coupon-row:hover{border-color:rgba(var(--primary-rgb),.35);transform:translateY(-1px)}
.coupon-row-amt{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:78px;min-height:66px;padding:6px;border-radius:12px;background:var(--hot-grad);color:var(--primary-ink);font-size:12.5px;font-weight:800;line-height:1.3;text-align:center}
.coupon-row>div{flex:1;min-width:0}
.coupon-row b{display:block;font-size:14.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.coupon-row>div span{display:block;margin-top:2px;font-size:12px;color:var(--muted)}
.coupon-row .go{flex:none;color:var(--muted)}
.coupon-row.is-off .coupon-row-amt{filter:grayscale(1);opacity:.7}
.coupon-state{display:inline-block;margin-top:5px;padding:2px 8px;border-radius:999px;font-style:normal;font-size:11px;font-weight:800}
.coupon-state.st-ready{background:var(--primary-soft);color:var(--primary)}
.coupon-state.st-used,.coupon-state.st-expired{background:var(--band);color:var(--muted)}

/* 쿠폰 화면 (매장에서 보여 주는 티켓) */
.coupon-view{padding-top:6px;padding-bottom:40px;max-width:520px}
.coupon-big{--notch:var(--surface);position:relative;border-radius:22px;background:var(--hot-grad);color:var(--primary-ink);box-shadow:0 22px 44px -22px rgba(var(--hot-rgb),.9);overflow:hidden}
.coupon-big::before,.coupon-big::after{content:'';position:absolute;top:calc(100% - 96px);width:22px;height:22px;margin-top:-11px;border-radius:50%;background:var(--notch)}
.coupon-big::before{left:-11px}
.coupon-big::after{right:-11px}
.coupon-big-top{display:flex;flex-direction:column;gap:2px;padding:22px 22px 18px}
.coupon-big .coupon-amount{font-size:clamp(26px,8vw,32px)}
.coupon-big .coupon-title{font-size:15px}
.coupon-shop{display:flex;align-items:center;gap:5px;margin-top:6px;font-size:13px;font-weight:600;color:rgba(var(--ink-rgb),.92)}
.coupon-big-bottom{height:96px;display:flex;flex-direction:column;justify-content:center;gap:1px;padding:0 22px;border-top:2px dashed rgba(var(--ink-rgb),.45)}
.coupon-big-bottom small{font-size:11px;color:rgba(var(--ink-rgb),.8)}
.coupon-big-bottom b{font-size:22px;font-weight:800;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.coupon-big-bottom span{font-size:12px;color:rgba(var(--ink-rgb),.86)}
.coupon-big.is-off{filter:grayscale(.9)}
/* 사용 완료·기간 만료 도장 자리 — 금액 글씨와 겹치지 않게 오른쪽을 비운다 (좁은 폰은 도장도 작게) */
.coupon-big.is-off .coupon-big-top{padding-right:150px}
@media (max-width:360px){.coupon-stamp{padding:6px 9px;font-size:15px}.coupon-stamp small{font-size:9.5px}}
.coupon-stamp{position:absolute;right:16px;top:18px;display:flex;flex-direction:column;align-items:center;padding:8px 12px;border:3px solid var(--primary-ink);border-radius:12px;background:rgba(var(--ink-rgb),.08);color:var(--primary-ink);font-size:18px;font-weight:900;transform:rotate(-10deg)}
.coupon-stamp small{font-size:10.5px;font-weight:700}
.coupon-guide{margin:16px 0 10px;font-size:13.5px;line-height:1.7;text-align:center}
.coupon-cond{margin:18px 0 12px;padding-top:12px;border:1px solid var(--border);border-radius:16px;background:var(--card)}
.coupon-cond h2{padding:0 14px 8px;font-size:14px;font-weight:800}
.pin-input{width:100%;height:64px;padding-left:.5em;border-radius:14px;border:1px solid var(--border);background:var(--surface);text-align:center;font-size:30px;font-weight:800;letter-spacing:.5em;font-variant-numeric:tabular-nums}
.pin-input:focus{outline:none;border-color:var(--primary);background:var(--card)}

/* 홍보글 쓰기 6번 쿠폰 칸 */
.coupon-toggle{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;background:var(--primary-soft)}
.coupon-toggle div{flex:1;min-width:0}
.coupon-toggle b{display:block;font-size:14.5px;font-weight:800}
.coupon-toggle span{display:block;margin-top:2px;font-size:12px;line-height:1.6;color:var(--muted)}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin-bottom:8px;border-radius:12px;background:var(--band)}
.seg button{height:36px;border-radius:9px;font-size:13.5px;font-weight:700;color:var(--muted);transition:background-color .2s var(--ease),color .2s var(--ease)}
.seg button:hover{color:var(--text)}
.seg button.is-on{background:var(--card);color:var(--primary);box-shadow:var(--shadow-sm)}
/* 운영(관리자) 화면 잠금 — 비밀번호 한 칸 (2026-10-11) */
.admin-gate{max-width:360px;margin:36px auto 0;padding:22px 20px;border-radius:16px;background:var(--card);box-shadow:var(--shadow-sm)}
/* 방문 수 창 — 아래 엠블럼 5번 (2026-10-11): 기간 4칸 + 숫자 두 칸 */
.seg.four{grid-template-columns:repeat(4,1fr);margin-top:14px}
.stat-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.stat-tile{padding:18px 8px;border-radius:14px;background:var(--band);text-align:center;min-width:0}
.stat-tile b{display:block;font-size:30px;font-weight:800;line-height:1.2;color:var(--primary);letter-spacing:-.03em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.stat-tile span{font-size:12.5px;color:var(--muted)}
/* 접속 통계(운영 화면 탭) — 기간 세 칸 · 막대 그래프(연한 막대 = 들어온 횟수, 진한 막대 = 방문자) · 나라·국내 지역 가로 막대 (2026-10-13 사용자 「숫자와 그래프로」) */
.seg.three{grid-template-columns:repeat(3,1fr);margin-top:10px}
.seg.three button{text-align:center}
.acc .stat-tiles{margin-bottom:12px}
.acc-card{padding:14px 14px 12px;border-radius:18px;border:1px solid var(--border);background:var(--card);margin-bottom:12px;min-width:0}
.acc-card .admin-h3{margin:0 0 10px;flex-wrap:wrap}
.acc-legend{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--muted)}
.acc-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.acc-legend i.v{margin-left:6px}
.acc-legend i.u,.acc-bar i.u{background:var(--primary)}
.acc-legend i.v,.acc-bar i.v{background:color-mix(in srgb,var(--primary) 26%,var(--card))}
.acc-chart{display:flex;align-items:stretch;gap:2px;height:168px;min-width:0}
.acc-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px}
.acc-bar{position:relative;flex:1;width:100%;border-bottom:1px solid var(--line-2)}
.acc-bar i{position:absolute;left:0;right:0;bottom:0;border-radius:3px 3px 0 0;transition:height .4s var(--ease)}
.acc-bar i.u{left:22%;right:22%}
.acc-col small{height:14px;font-size:10px;line-height:14px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.acc-col:hover .acc-bar i.u{background:var(--primary-strong)}
.acc-table{margin-top:8px;font-size:12.5px}
.acc-table summary{cursor:pointer;color:var(--primary);font-weight:700;padding:4px 0}
.acc-table table{width:100%;border-collapse:collapse;margin-top:6px;font-variant-numeric:tabular-nums}
.acc-table th,.acc-table td{padding:5px 6px;border-top:1px solid var(--border);text-align:right;font-weight:500}
.acc-table th:first-child{text-align:left}
.acc-table thead th{border-top:0;color:var(--muted);font-weight:700}
.acc-rows{list-style:none;display:grid;gap:8px}
.acc-rows li{display:grid;grid-template-columns:minmax(64px,30%) minmax(0,1fr) auto 38px;align-items:center;gap:8px;font-size:13px;min-width:0}
.acc-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.acc-track{height:10px;border-radius:5px;background:var(--band);overflow:hidden}
.acc-track i{display:block;height:100%;border-radius:5px;background:var(--primary);transition:width .4s var(--ease)}
.acc-rows b{font-variant-numeric:tabular-nums;font-weight:800}
.acc-rows small{font-size:11.5px;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}
.acc-foot a{color:var(--primary);text-decoration:underline;white-space:nowrap}
@media (min-width:1024px){.acc-chart{height:220px;gap:4px}.acc-col small{font-size:11.5px}.acc .acc-geo{display:grid;grid-template-columns:1fr 1fr;gap:12px}}
.stat-foot{margin-top:12px;font-size:12px;color:var(--muted);text-align:center;line-height:1.6}
.unit-input{position:relative}
.field .unit-input input{padding-right:44px}
.unit-input b{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:14px;font-weight:700;color:var(--muted);pointer-events:none}
.chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
/* 마이 › 사장님 쿠폰 통계 줄 */
.menu-row small.stat-line{margin-top:2px;color:var(--pink);font-weight:700}

/* 홍보글 쓰기 — 입점 서약 (필수, 광고·쿠폰 운영정책 1번) */
.pledge{display:flex;align-items:flex-start;gap:10px;margin-top:18px;padding:14px;border-radius:14px;border:1px solid var(--border);background:var(--card);cursor:pointer;transition:border-color .2s var(--ease),background-color .2s var(--ease)}
.pledge:hover{border-color:rgba(var(--primary-rgb),.4)}
.pledge.is-on{border-color:var(--primary);background:var(--primary-soft)}
.pledge input{flex:none;width:20px;height:20px;margin-top:2px;accent-color:var(--primary)}
.pledge span{font-size:13px;line-height:1.7}
.pledge b{display:block;margin-bottom:2px;font-size:14px;font-weight:800}
.pledge em{margin-left:4px;font-style:normal;font-size:12px;color:var(--pink)}
