  /* 🎨 2026-07-29 "설렘의 티켓" 리디자인(사장님 방향 확정) — 브랜드 색을 웜 코랄 하나로 통일(주황↔초록 그라데이션 충돌 제거).
     ⚠️ --emerald를 딥코랄로 재정의한 건 의도: 기존 linear-gradient(--orange,--emerald) 수십 곳이 한 줄로 전부
     '노을 그라데이션'(코랄→딥코랄)이 되게 하는 트릭. 초록이 필요한 새 UI는 --emerald 말고 별도 색을 쓸 것. */
  /* 🔤 2026-09-07 가독성 감사: 회색 글자 두 색이 흰 배경 대비 WCAG AA(4.5:1)에 한참 못 미쳤다 —
     --sub #8A93A6 = 3.04:1, --muted #A39B8F = 2.70:1. 둘 다 11~12px 작은 글자(코스 시각·메모·메타)에
     쓰여 "작고 흐린 글자" 최악 조합이었다. 색 계열(차가운 회색/따뜻한 회색)은 그대로 두고 명도만 낮춰
     각각 4.68:1 / 4.73:1로 통과시킴. ⚠️ 더 밝게 되돌리지 말 것(되돌리면 AA 미달로 회귀). */
  :root{ --orange:#FF6B4A; --emerald:#E8503A; --coral:#FF6B4A; --stamp:#E8503A; --ink:#26324B; --sub:#6B7385; --muted:#78716A; --line:#EFE6DA; --bg:#FAF5EE; --paper:#FFFDF9; }
  @font-face{ font-family:'GmarketSans'; src:url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff'); font-weight:700; font-style:normal; font-display:swap; }
  /* 🧭 첫 화면 스플래시(2026-09-03 전면 재설계) — 광안대교 야경 사진 + 마크 네온 점등 + 금박 글자 + 반짝이.
     ⚠️ 사진: splash-new.webp(104KB) 우선, 못 읽는 브라우저만 splash-new.jpg. 교체하면 아래 ?v= 값을 반드시 올릴 것.
     ⚠️ 장식 요소 좌표는 전부 .sp-wrap(사진 상자) 기준 %다 — 사진을 바꾸면 마크·글자·다리 위치를 다시 재야 한다.
        현재 기준값(사진 768x1376): 마크 중심 74.4%/19.6%, 다리 상판 y53%, 인물 가로 36~60%. */
  #splash{ position:fixed; inset:0; z-index:9999; background:#040A14; cursor:pointer; transition:opacity .5s ease; overflow:hidden; }
  #splash.gone{ opacity:0; pointer-events:none; }
  #splash .sp-wrap{ position:absolute; top:-6.5%; left:-5%; width:110%; aspect-ratio:768/1376; }
  /* 가로 화면(PC·태블릿)에서는 사진을 세로 꽉 채워 가운데로 — 안 그러면 마크가 잘린다 */
  @media (min-aspect-ratio:9/16){
    #splash .sp-wrap{ top:50%; left:50%; width:auto; height:113%; transform:translate(-50%,-50%); }
    #splash .sp-bg{ display:block; }
  }
  #splash .sp-bg{ display:none; position:absolute; inset:0; background:url(/splash-new.jpg?v=1) center/cover no-repeat; filter:blur(28px) brightness(.5); transform:scale(1.15); }
  /* 즉시 뜨는 초저용량 사진(1.4KB) — 진짜 사진 받기 전 검은 화면을 안 보여주려고 */
  #splash .sp-lqip{ position:absolute; inset:0; background:url("data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAASABIAAD/4QBMRXhpZgAATU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAGKADAAQAAAABAAAAKwAAAAD/7QA4UGhvdG9zaG9wIDMuMAA4QklNBAQAAAAAAAA4QklNBCUAAAAAABDUHYzZjwCyBOmACZjs+EJ+/8AAEQgAKwAYAwEiAAIRAQMRAf/EAB8AAAEFAQEBAQEBAAAAAAAAAAABAgMEBQYHCAkKC//EALUQAAIBAwMCBAMFBQQEAAABfQECAwAEEQUSITFBBhNRYQcicRQygZGhCCNCscEVUtHwJDNicoIJChYXGBkaJSYnKCkqNDU2Nzg5OkNERUZHSElKU1RVVldYWVpjZGVmZ2hpanN0dXZ3eHl6g4SFhoeIiYqSk5SVlpeYmZqio6Slpqeoqaqys7S1tre4ubrCw8TFxsfIycrS09TV1tfY2drh4uPk5ebn6Onq8fLz9PX29/j5+v/EAB8BAAMBAQEBAQEBAQEAAAAAAAABAgMEBQYHCAkKC//EALURAAIBAgQEAwQHBQQEAAECdwABAgMRBAUhMQYSQVEHYXETIjKBCBRCkaGxwQkjM1LwFWJy0QoWJDThJfEXGBkaJicoKSo1Njc4OTpDREVGR0hJSlNUVVZXWFlaY2RlZmdoaWpzdHV2d3h5eoKDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uLj5OXm5+jp6vLz9PX29/j5+v/bAEMABwcHBwcHDAcHDBEMDAwRFxEREREXHhcXFxcXHiQeHh4eHh4kJCQkJCQkJCsrKysrKzIyMjIyODg4ODg4ODg4OP/bAEMBCQkJDg0OGQ0NGTsoISg7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O//dAAQAAv/aAAwDAQACEQMRAD8A8Gjty4yOoqzDpz3MgjiU7j2qzbIUYE8YrqNOuI7a5jvFcKdwDEkjqepxziu6cfdbjucsW3KzOTv9CurJQ0yEZ9ayfsx9K9d8U6tFqkMexopCCQTG3QcdRgVw3kpXPS5pRvNWZtOydos//9DzBNMdmUMwGSBjI71Yt9Pdb27hfKG2K7P94jIyf1piyDAJjJYd/wD69al7qP2qFV8oKFVRuHViB3/pW0m+goqK3M6y06e6dYLdd7Mccf8A1ua2/wDhE9Y/54H/AMe/wqnEyqiyqPKOd24YDfn2q39vl/5+Zf8Av6aOd9CVCPU//9HkH2oqOxAAwWGOv9Kmtws6PKyhYweOgJ56VlwAPHhujMQan092CyLnjjinYdzSJODLF5Yz/AQOPocU3zbn+4n/AI7/AIVXuXZW2KcDK/rik/OpcQ0P/9k=") center/100% 100% no-repeat; filter:blur(12px); transform:scale(1.05); }
  #splash .sp-photo{ position:absolute; inset:0; width:100%; height:100%; display:block; opacity:0; transition:opacity .3s ease; }
  #splash .sp-photo.ready{ opacity:1; }
  #splash .sp-lqip, #splash .sp-photo{ -webkit-mask-image:linear-gradient(180deg,#000 0 86%,rgba(0,0,0,.35) 95%,transparent 100%); mask-image:linear-gradient(180deg,#000 0 86%,rgba(0,0,0,.35) 95%,transparent 100%); }
  /* 사진에 인쇄돼 있던 옛 "역마살" 글자 지우개 — 같은 사진을 옆으로 39% 밀어 깨끗한 하늘로 덮는다 */
  #splash .sp-patch{ position:absolute; inset:0; background-size:100% 100%; background-repeat:no-repeat; transform:translateX(39%);
    -webkit-mask-image:radial-gradient(ellipse 20% 4.4% at 35.4% 31.3%, #000 72%, transparent 100%); mask-image:radial-gradient(ellipse 20% 4.4% at 35.4% 31.3%, #000 72%, transparent 100%); }
  /* 마크가 실제로 밝아졌다 어두워지게 — 위에 빛만 얹으면 이미 밝은 금색이라 변화가 안 보인다 */
  #splash .sp-flare{ position:absolute; inset:0; background-size:100% 100%; background-repeat:no-repeat; pointer-events:none; opacity:0;
    filter:brightness(1.42) saturate(1.12);
    -webkit-mask-image:radial-gradient(ellipse 21% 9% at 74.4% 19.6%, #000 42%, transparent 100%); mask-image:radial-gradient(ellipse 21% 9% at 74.4% 19.6%, #000 42%, transparent 100%); }
  #splash .sp-halo{ position:absolute; left:56%; top:11.5%; width:37%; height:16%; pointer-events:none; opacity:0;
    background:radial-gradient(ellipse 50% 50% at 50% 50%, rgba(255,243,214,.18) 0%, rgba(255,217,138,.30) 34%, rgba(255,201,138,0) 76%); filter:blur(11px); }
  /* 광안대교 — 상판 빛 띠(인물 구간은 끊어야 몸을 통과하지 않는다) + 조명 점 */
  #splash .sp-bar{ position:absolute; left:0; right:0; top:52.2%; height:2.4%; pointer-events:none; opacity:0;
    background:linear-gradient(90deg, rgba(255,201,138,0) 0%, rgba(255,226,180,.55) 12%, rgba(255,243,214,.75) 50%, rgba(255,226,180,.55) 88%, rgba(255,201,138,0) 100%); filter:blur(5px);
    -webkit-mask-image:linear-gradient(90deg,#000 0 33%,transparent 37%,transparent 60%,#000 64%); mask-image:linear-gradient(90deg,#000 0 33%,transparent 37%,transparent 60%,#000 64%); }
  #splash .sp-lights{ position:absolute; inset:0; pointer-events:none; opacity:0; }
  #splash .sp-lights i{ position:absolute; display:block; width:4.5px; height:4.5px; margin:-2.25px 0 0 -2.25px; border-radius:50%; background:#FFF3D6;
    filter:drop-shadow(0 0 4px #FFC98A) drop-shadow(0 0 10px rgba(255,201,138,.95)) drop-shadow(0 0 18px rgba(255,180,100,.5)); animation:spBlink ease-in-out infinite; }
  #splash .sp-water{ position:absolute; left:0; right:0; top:56%; height:13%; pointer-events:none; opacity:0;
    background:linear-gradient(180deg, rgba(255,201,138,.30) 0%, rgba(255,201,138,0) 78%); filter:blur(7px);
    -webkit-mask-image:repeating-linear-gradient(90deg,#000 0 2px,rgba(0,0,0,.25) 2px 6px,transparent 6px 13px); mask-image:repeating-linear-gradient(90deg,#000 0 2px,rgba(0,0,0,.25) 2px 6px,transparent 6px 13px); }
  /* 금박 "역마살" — 글자 폭은 JS가 마크 폭(27%)에 맞춰 계산해 넣는다 */
  #splash .sp-brand{ position:absolute; left:74.4%; top:34.2%; transform:translate(-50%,-50%); opacity:0;
    filter:drop-shadow(0 0 9px rgba(255,201,110,.45)) drop-shadow(0 2px 4px rgba(0,0,0,.85)); }
  #splash .sp-brand b{ display:block; font-family:'GmarketSans','Apple SD Gothic Neo',sans-serif; font-weight:700; letter-spacing:.02em; line-height:1; white-space:nowrap; font-size:34px;
    background:linear-gradient(100deg,#D9A44E 0%,#E7B25A 18%,#FFDF9C 34%,#FFFFFF 44%,#FFF7E4 50%,#FFDF9C 62%,#E7B25A 80%,#D9A44E 100%); background-size:280% 100%; background-position:-60% 0;
    -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-stroke:.9px rgba(72,44,12,.62); }
  #splash .sp-sparks{ position:absolute; inset:0; overflow:hidden; z-index:2; pointer-events:none; }
  #splash .sp-spk{ position:absolute; display:block; opacity:0; animation:spRise linear infinite; }
  #splash .sp-spk i{ display:block; width:100%; height:100%; background:#FFF4DC;
    clip-path:polygon(50% 0%,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0% 50%,42% 42%);
    filter:drop-shadow(0 0 4px rgba(255,240,200,.95)) drop-shadow(0 0 9px rgba(255,201,138,.6)); animation:spTwinkle ease-in-out infinite; }
  #splash .sp-scrim{ position:absolute; left:0; right:0; bottom:0; height:34%; z-index:3; pointer-events:none;
    background:linear-gradient(180deg, rgba(4,10,20,0) 0%, rgba(4,10,20,.55) 42%, #040A14 92%); }
  /* ── 등장 순서: 하늘 → 다리 불빛 → 마크 네온 → 글자 → 버튼 ── */
  #splash .sp-wrap{ animation:spFade .7s ease both; }
  #splash .sp-lights{ animation:spFade .8s ease .55s both; }
  #splash .sp-bar{ animation:spFade .9s ease .5s both, spBar 3.6s ease-in-out 1.4s infinite; }
  #splash .sp-water{ animation:spFade .8s ease .8s both, spWater 5s ease-in-out 1.6s infinite; }
  #splash .sp-flare, #splash .sp-halo{ animation:spNeon 1.5s steps(1,end) 1.15s both, spHum 6s ease-in-out 2.7s infinite; }
  #splash .sp-brand{ animation:spNeon 1.25s steps(1,end) 1.95s both, spBrandGlow 5s ease-in-out 3.3s infinite; }
  #splash .sp-brand b{ animation:spShine 5s ease-in-out 3.5s infinite; }
  #splash .sp-go{ position:absolute; left:50%; bottom:6%; transform:translateX(-50%); z-index:4; background:linear-gradient(135deg,#FF6B4A,#E8503A); color:#fff; border:0; border-radius:30px; padding:15px 42px; font-size:17px; font-weight:800; cursor:pointer; box-shadow:0 8px 26px rgba(0,0,0,.45); opacity:0; animation:spFade .5s ease 2.6s both; }
  #splash .sp-hint{ position:absolute; left:0; right:0; bottom:2.4%; text-align:center; color:rgba(255,255,255,.9); font-size:12.5px; z-index:4; text-shadow:0 1px 4px rgba(0,0,0,.5); opacity:0; animation:spFade .5s ease 2.9s both; }
  @keyframes spFade{ from{opacity:0} to{opacity:1} }
  /* 진짜 네온처럼 — 껌뻑, 껌뻑, 탁! */
  @keyframes spNeon{ 0%{opacity:0} 8%{opacity:.85} 13%{opacity:.05} 22%{opacity:1} 28%{opacity:.1} 34%{opacity:.95} 39%{opacity:.25} 47%{opacity:1} 52%{opacity:.4} 60%{opacity:1} 100%{opacity:1} }
  @keyframes spHum{ 0%,100%{opacity:.82} 34%{opacity:1} 52%{opacity:.88} 71%{opacity:1} }
  @keyframes spBar{ 0%,100%{opacity:.5} 50%{opacity:1} }
  @keyframes spWater{ 0%,100%{opacity:.55} 50%{opacity:1} }
  @keyframes spBlink{ 0%,100%{opacity:.35} 45%{opacity:1} 70%{opacity:.6} }
  @keyframes spTwinkle{ 0%,100%{opacity:.1; transform:scale(.55) rotate(0deg)} 50%{opacity:1; transform:scale(1.15) rotate(50deg)} }
  @keyframes spRise{ 0%{transform:translateY(0); opacity:0} 10%{opacity:1} 90%{opacity:1} 100%{transform:translateY(calc(-1 * var(--rise,300px))); opacity:0} }
  @keyframes spBrandGlow{ 0%,100%{ filter:drop-shadow(0 0 8px rgba(255,201,110,.38)) drop-shadow(0 2px 4px rgba(0,0,0,.85)) } 50%{ filter:drop-shadow(0 0 17px rgba(255,216,142,.9)) drop-shadow(0 0 30px rgba(255,190,90,.35)) drop-shadow(0 2px 4px rgba(0,0,0,.85)) } }
  @keyframes spShine{ 0%{background-position:160% 0} 20%{background-position:-60% 0} 100%{background-position:-60% 0} }
  @media (prefers-reduced-motion:reduce){
    #splash .sp-wrap,#splash .sp-lights,#splash .sp-bar,#splash .sp-water,#splash .sp-flare,#splash .sp-halo,#splash .sp-brand,#splash .sp-go,#splash .sp-hint{ animation:none; opacity:1; }
    #splash .sp-spk{ display:none; }
  }
  /* 🏠 귀인 서비스 선택 — 스플래시 다음(방문마다, 2026-07-17 사장님 요청). 2026-09-15 개편(지침서 25 §6):
     어두운 파랑+작은 가로카드(설명 줄바꿈 깨짐) → 밝은 바탕+세로 리스트 카드. 목록은 gwiin-services.json. */
  #svcChoice{ position:fixed; inset:0; z-index:9999; background:#F2F3F6; display:none; align-items:center; justify-content:center; transition:opacity .4s ease; overflow-y:auto; }
  #svcChoice.gone{ opacity:0; pointer-events:none; }
  #svcChoice .svc-wrap{ width:100%; max-width:440px; padding:32px 16px calc(24px + env(safe-area-inset-bottom)); box-sizing:border-box; }
  #svcChoice .svc-logo{ font-size:24px; font-weight:800; color:#212124; letter-spacing:-.4px; padding:0 4px; }
  #svcChoice .svc-sub{ font-size:15px; color:#6B7079; margin:6px 0 20px; padding:0 4px; }
  #svcChoice .svc-cards{ display:flex; flex-direction:column; gap:10px; }
  #svcChoice .svc-card{ display:flex; align-items:center; gap:14px; width:100%; min-height:80px; padding:14px 14px 14px 16px; background:#fff; border:0; border-radius:16px; cursor:pointer; text-align:left; font-family:inherit; color:#212124; box-shadow:0 1px 2px rgba(0,0,0,.04); transition:transform .12s ease; }
  #svcChoice .svc-card:active{ transform:scale(.98); }
  #svcChoice .svc-card img{ width:52px; height:52px; border-radius:14px; object-fit:cover; flex:none; background:#F2F3F6; box-shadow:0 0 0 1px rgba(0,0,0,.06); }
  #svcChoice .svc-name{ font-size:17px; font-weight:800; }
  #svcChoice .svc-desc{ font-size:13.5px; color:#6B7079; margin-top:3px; word-break:keep-all; }
  #svcChoice .svc-card svg{ margin-left:auto; color:#B0B3BA; flex:none; }
  #svcChoice .svc-foot{ display:block; margin:18px auto 0; padding:10px; border:0; background:none; font-family:inherit; font-size:13px; color:#868B94; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
  *{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
  html,body{ margin:0; height:100%; background:var(--bg); color:var(--ink); overscroll-behavior:none;
    /* 📏 2026-09-07: 줄간격이 전역으로 없어(브라우저 기본 normal≈1.2) 한글 두 줄 이상 텍스트가 답답했다.
       한글 권장 1.5로 기본값을 준다. 개별 규칙의 line-height가 있으면 그게 이긴다(기존 화면 영향 최소). */
    line-height:1.5;
    font-family:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Segoe UI",Roboto,sans-serif; }
  #app{ max-width:600px; margin:0 auto; height:100dvh; display:flex; flex-direction:column; background:#fff; overscroll-behavior:none; }
  /* 헤더 */
  header{ flex:0 0 auto; padding:9px 14px; border-bottom:1px solid var(--line); display:flex; align-items:center; gap:8px;
    background:var(--paper); position:sticky; top:0; z-index:5; }
  .logo{ width:27px;height:27px;border-radius:50%; display:grid;place-items:center; font-size:14px;
    background:linear-gradient(135deg,var(--coral),var(--stamp)); color:#fff; flex:0 0 auto; box-shadow:0 2px 8px rgba(232,80,58,.28); }
  /* 🔴 2026-09-07: ❤️찜 버튼이 늘고 터치타깃을 키우자 390px에서 헤더가 모자라 "역마살"이 두 줄로 밀렸다.
     제목은 절대 줄바꿈 금지(줄어들지도 않게 flex-shrink:0). */
  header .t{ font-family:'GmarketSans',inherit; font-weight:700; font-size:16px; letter-spacing:-.3px; padding-top:2px; white-space:nowrap; flex:0 0 auto; }
  /* 🚩 2026-07-31: 오류/개선신고가 ☰메뉴 안에만 있어 눈에 안 띈다는 지적 — 나침판 로고 바로 옆에 상시 노출 */
  header .hdr-report{ flex:0 0 auto; width:34px;height:34px; border:1px solid var(--line); background:#fff; border-radius:9px; font-size:12px; line-height:1; cursor:pointer; padding:0; color:#b06a00; }
  header .hdr-report:active{ transform:scale(.92); }
  /* 라벨은 한 줄 유지(밀림 금지). 터치 높이는 세로 패딩(8px)으로 확보하고 가로 패딩은 줄여 공간을 아낀다. */
  header .prof{ font-size:12px; color:var(--ink); background:#fff; border:1.5px solid var(--line); padding:8px 9px; border-radius:20px; cursor:pointer; font-weight:700; font-family:inherit; white-space:nowrap; flex:0 0 auto; }
  header #conqBtn{ color:var(--stamp); border-color:#F6D7CE; background:#FFF3EE; }
  header #conqBtn{ margin-left:auto; } /* 오른쪽 그룹 시작 */
  header .ham{ margin-left:6px; font-size:18px; line-height:1; color:#444; background:#fff; border:1px solid var(--line); border-radius:10px; width:34px; height:34px; cursor:pointer; padding:0; }
  header .ham:active{ transform:scale(.94); }
  /* ☰ 귀인 통합 메뉴(지침서 25 §2, 2026-09-15) — 역마살·부동산귀인·소참이 같은 위치(헤더 오른쪽 ☰)·같은 구조로 연다.
     당근 "나의 당근"식: 회색 바탕 위 흰 카드 ①내 정보 ②이 앱 기능 그리드 ③귀인 서비스 ④설정·도움.
     폰=전체화면, 600px 이상=오른쪽 400px 서랍. 전체화면이라 저장잠김 띠(--persist-bar-h) 위치와 무관하게 맨 위부터 덮는다. */
  #gmenu{ position:fixed; inset:0; z-index:10001; display:none; }
  #gmenu.on{ display:block; }
  #gmenu .gm-dim{ position:absolute; inset:0; background:rgba(0,0,0,.38); opacity:0; transition:opacity .24s ease; }
  #gmenu .gm-panel{ position:absolute; top:0; right:0; bottom:0; width:100%; background:#F2F3F6; transform:translateX(100%); transition:transform .24s cubic-bezier(.2,.8,.2,1); overflow-y:auto; overscroll-behavior:contain; padding-bottom:calc(24px + env(safe-area-inset-bottom)); box-sizing:border-box; }
  @media (min-width:600px){ #gmenu .gm-panel{ max-width:400px; box-shadow:-8px 0 30px rgba(0,0,0,.12); } }
  #gmenu.open .gm-dim{ opacity:1; }
  #gmenu.open .gm-panel{ transform:none; }
  #gmenu .gm-top{ position:sticky; top:0; z-index:1; display:flex; align-items:center; justify-content:space-between; padding:calc(10px + env(safe-area-inset-top)) 6px 10px 20px; background:#F2F3F6; }
  #gmenu .gm-top h2{ margin:0; font-size:20px; font-weight:800; color:#212124; letter-spacing:-.3px; }
  #gmenu .gm-x{ width:44px; height:44px; border:0; background:none; cursor:pointer; color:#212124; display:flex; align-items:center; justify-content:center; padding:0; }
  #gmenu .gm-card{ background:#fff; border-radius:16px; margin:0 16px 12px; padding:16px; }
  #gmenu .gm-h{ margin:0 0 14px; font-size:15px; font-weight:800; color:#212124; }
  #gmenu .gm-me{ display:flex; align-items:center; gap:12px; width:100%; padding:0; border:0; background:none; text-align:left; cursor:pointer; font-family:inherit; color:#212124; }
  #gmenu .gm-av{ width:52px; height:52px; border-radius:50%; background:#FFF1EC; display:flex; align-items:center; justify-content:center; font-size:24px; flex:none; }
  #gmenu .gm-nick{ font-size:17px; font-weight:800; line-height:1.3; word-break:keep-all; }
  #gmenu .gm-st{ font-size:12.5px; color:#868B94; margin-top:3px; line-height:1.4; word-break:keep-all; }
  #gmenu .gm-chev{ margin-left:auto; color:#B0B3BA; flex:none; }
  #gmenu .gm-login{ display:flex; gap:8px; margin-top:14px; }
  #gmenu .gm-login button{ flex:1; min-height:44px; border-radius:10px; font-family:inherit; font-size:14px; font-weight:700; cursor:pointer; }
  #gmenu .gm-kakao{ background:#FEE500; color:#191919; border:0; }
  #gmenu .gm-google{ background:#fff; color:#212124; border:1px solid #DCDEE3; }
  #gmenu .gm-grid{ display:grid; grid-template-columns:repeat(4,1fr); row-gap:18px; }
  #gmenu .gm-grid button, #gmenu .gm-grid a{ display:flex; flex-direction:column; align-items:center; gap:8px; padding:0 2px; border:0; background:none; font-family:inherit; font-size:13px; font-weight:500; color:#212124; text-decoration:none; cursor:pointer; line-height:1.3; text-align:center; word-break:keep-all; }
  #gmenu .gm-grid svg{ width:30px; height:30px; display:block; }
  #gmenu .gm-grid button:active, #gmenu .gm-grid a:active, #gmenu .gm-list > *:active{ opacity:.55; }
  #gmenu .gm-svc img{ width:44px; height:44px; border-radius:12px; object-fit:cover; background:#F2F3F6; box-shadow:0 0 0 1px rgba(0,0,0,.06); }
  #gmenu .gm-svc .gm-sn{ font-weight:700; }
  #gmenu .gm-svc .gm-sd{ font-size:11px; color:#868B94; margin-top:-5px; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  #gmenu .gm-svc .gm-chip{ font-size:10px; font-weight:700; padding:1px 6px; border-radius:6px; margin-top:-4px; }
  #gmenu .gm-svc .gm-here{ background:#FFF1EC; color:var(--stamp); }
  #gmenu .gm-svc .gm-badge{ background:#F2F3F6; color:#6B7079; }
  #gmenu .gm-svc [aria-current="true"]{ cursor:default; }
  #gmenu .gm-list{ padding:4px 0; }
  #gmenu .gm-list > a, #gmenu .gm-list > button{ display:flex; align-items:center; justify-content:space-between; width:100%; min-height:52px; padding:0 16px; border:0; background:none; font-family:inherit; font-size:15px; font-weight:500; color:#212124; text-decoration:none; cursor:pointer; text-align:left; box-sizing:border-box; }
  #gmenu .gm-list > * + *{ border-top:1px solid #F2F3F6; }
  #gmenu .gm-list .gm-danger{ color:#6B7079; }
  /* 대화 영역 */
  #chat{ flex:1 1 auto; overflow-y:auto; padding:16px 7px 174px; display:flex; flex-direction:column; }
  /* 🏠 홈 대시보드(2026-07-19, 여기어때·Trip.com 벤치마킹 목업 반영) — 챗 앞단에 검색창+카테고리그리드.
     기존 챗/위저드 로직은 전혀 안 바꾸고, 이 화면 위에서 카테고리를 누르거나 검색하면 그대로 quickStart/freeText로 넘어간다. */
  #homeDash{ display:none; flex:1 1 auto; overflow-y:auto; padding:16px 14px 70px; flex-direction:column; }
  /* 🎟️ "설렘의 티켓" 히어로 */
  #homeDash .hHero{ flex:0 0 auto; margin-bottom:18px; animation:rise .45s ease both; }
  #homeDash .hGreet{ font-size:13px; font-weight:700; color:var(--coral); letter-spacing:.2px; margin:2px 2px 6px; }
  #homeDash .hHeadline{ font-family:'GmarketSans',inherit; font-size:27px; line-height:1.28; color:var(--ink); margin:0; letter-spacing:-.5px; }
  /* ❓ 2026-08-04 사장님 요청: 헤드라인 우측에 사용법 버튼 — 처음 쓰는 사람이 FROM/TO·메뉴·일정짜기 흐름을 바로 알 수 있게 */
  #homeDash .hHeadRow{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin:0 2px 14px; }
  #homeDash .hHowtoBtn{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:1px; background:#fff;
    border:1.5px solid var(--line); border-radius:13px; padding:7px 11px; font-family:inherit; font-size:11px;
    font-weight:700; color:var(--coral); cursor:pointer; box-shadow:0 2px 7px rgba(38,50,75,.08); white-space:nowrap; margin-top:3px; }
  #homeDash .hHowtoBtn .e{ font-size:17px; line-height:1; }
  #homeDash .hHowtoBtn:active{ transform:scale(.94); }
  #howtoModal{ position:fixed; inset:0; background:rgba(0,0,0,.55); display:none; align-items:flex-end; justify-content:center; z-index:85; }
  #howtoModal.on{ display:flex; }
  #howtoModal .box{ width:100%; max-width:600px; max-height:84vh; background:#fff; border-radius:20px 20px 0 0; overflow-y:auto; padding:18px 20px 28px; animation:rise .25s ease both; }
  #howtoModal .hd{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
  #howtoModal .hd b{ font-family:'GmarketSans',inherit; font-size:18px; }
  #howtoModal .hd button{ border:none; background:#F6F1E9; width:30px; height:30px; border-radius:50%; font-size:16px; cursor:pointer; color:#555; }
  #howtoModal .step{ display:flex; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); }
  #howtoModal .step:last-child{ border-bottom:none; }
  #howtoModal .step .n{ flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--coral); color:#fff; display:grid; place-items:center; font-weight:800; font-size:13px; }
  #howtoModal .step .tt{ font-weight:800; font-size:14.5px; margin-bottom:3px; color:var(--ink); }
  #howtoModal .step .ds{ font-size:13px; color:#5b6b8c; line-height:1.55; }
  #homeDash .ticket{ position:relative; background:var(--paper); border-radius:18px; box-shadow:0 8px 26px rgba(38,50,75,.09), 0 1.5px 4px rgba(38,50,75,.06); overflow:hidden; }
  #homeDash .tk-head{ display:flex; justify-content:space-between; align-items:center; padding:12px 16px 0; }
  #homeDash .tk-brand{ font-size:10px; font-weight:800; letter-spacing:2.2px; color:var(--coral); }
  #homeDash .tk-no{ font-size:10px; font-weight:700; letter-spacing:1px; color:var(--sub); }
  /* 🔘 2026-08-04 사장님 재요청: 작은 칩 두 개 대신, "내주변 가게 알아보기"/"내가 가고싶은곳 알아보기"
     라고 바로 읽히는 큰 버튼 두 개(2열)로. 각자 독립된 <button>이라 FROM은 GPS 요청, TO는 지역선택을
     각자 직접 처리(이전엔 하나의 큰 버튼 안에서 stopPropagation으로 갈랐던 것을 아예 분리). */
  #homeDash .tk-route2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:12px 16px 16px; }
  #homeDash .tk-bigbtn{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:3px;
    background:#fff; border:1.5px solid var(--line); border-radius:16px; padding:16px 8px 13px; cursor:pointer;
    font-family:inherit; box-shadow:0 3px 10px rgba(38,50,75,.08); }
  #homeDash .tk-bigbtn:active{ transform:scale(.96); }
  #homeDash .tk-bigbtn-ico{ font-size:26px; line-height:1; }
  #homeDash .tk-bigbtn-tt{ font-size:13px; font-weight:800; color:var(--ink); line-height:1.35; }
  #homeDash .tk-bigbtn-val{ font-family:'GmarketSans',inherit; font-size:16px; font-weight:700; color:var(--coral);
    margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
  #homeDash .tk-perf{ position:relative; border-top:2px dashed var(--line); margin:0 8px; }
  #homeDash .tk-perf::before, #homeDash .tk-perf::after{ content:''; position:absolute; top:-9px; width:18px; height:18px; border-radius:50%; background:var(--bg); }
  #homeDash .tk-perf::before{ left:-17px; } #homeDash .tk-perf::after{ right:-17px; }
  #homeDash .hSearch{ display:flex; align-items:center; gap:10px; background:#F5EFE7; border:none; border-radius:12px; padding:11px 8px 11px 14px; margin:14px 16px 16px; flex:0 0 auto; }
  #homeDash .hSearch input{ flex:1; border:none; outline:none; font-size:14px; font-family:inherit; min-width:0; background:none; color:var(--ink); }
  #homeDash .hSearch input::placeholder{ color:#B4AA9C; }
  #homeDash .hSearch button{ width:34px;height:34px;border-radius:50%;background:var(--coral);color:#fff;border:none;cursor:pointer;flex:0 0 auto;display:grid;place-items:center;box-shadow:0 3px 10px rgba(255,107,74,.35); }
  #homeDash .hRegionPick, #listView .hRegionPick{ display:flex; flex-wrap:wrap; gap:7px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:10px; margin-bottom:10px; flex:0 0 auto; } /* 🔴 2026-07-28: #listView #lvRegionPick(리스트 안 지역피커)가 이 클래스만 쓰고 #homeDash 밖이라 규칙이 안 먹어 세로로 찌그러진 알약(글자 한 줄에 한 자씩) 버그 — 스코프를 리스트뷰까지 넓힘 */
  #homeDash .hCats{ display:grid; grid-template-columns:repeat(5,1fr); gap:6px 0; background:#fff; border-radius:16px; padding:14px 4px 10px; border:1px solid var(--line); margin-bottom:6px; flex:0 0 auto; }
  #homeDash .hCat{ text-align:center; padding:6px 0; cursor:pointer; border:none; background:none; font-family:inherit; }
  #homeDash .hCat .e{ display:block; font-size:23px; margin-bottom:4px; }
  #homeDash .hCat .l{ font-size:10.5px; font-weight:700; color:var(--ink); }
  /* 📍 2026-08-04 사장님 요청: FROM(내 위치)이 아직 안 잡혔을 때 카테고리 메뉴 대신 안내 카드 — 잡히면 메뉴가 그 자리에 튀어나옴(.hBig의 rise 애니메이션 재사용, 새 DOM이라 자동 재생). */
  /* 📍 2026-08-04: 티켓(FROM/TO) 바로 위 안내 배너 — "아래 FROM을 누르면 열려요"를 먼저 보게(재피드백: 검색창 밑에 있어 눈에 안 띔). */
  #homeDash .hLockedHint{ display:flex; align-items:flex-start; gap:8px; background:#FFF4EF; border:1px solid #F6D7CE; border-radius:13px; padding:10px 13px; margin-bottom:10px; animation:rise .4s ease both; }
  #homeDash .hLockedHint-ico{ font-size:16px; line-height:1.4; flex:0 0 auto; }
  #homeDash .hLockedHint-tx{ font-size:12.5px; color:#8a5a45; line-height:1.5; font-weight:600; }
  #homeDash .hLockedHint-tx b{ color:var(--stamp); }
  /* 🍚🎯 홈 1단계 — "놀러 갈 곳"/"먹을 곳" 큰 갈래 2개(배민 벤치마킹: 큰 문맥 먼저, 그 다음 세부종류). 사장님 요청 2026-07-20. */
  #homeDash .hBig{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:6px; flex:0 0 auto; animation:rise .45s .08s ease both; } /* 큰메뉴 4개 → 2×2 그리드(2026-07-29 카페·술집 추가) */
  #homeDash .hBigCard.cafe{ background:linear-gradient(160deg,#F3EFE7,var(--paper) 70%); }
  #homeDash .hBigCard.wide{ grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:9px; padding:14px 8px; }
  #homeDash .hBigCard.wide .e{ margin:0; font-size:26px; }
  #homeDash .hBigCard.wide .s{ margin:0; }
  #homeDash .hBigCard.stay{ background:linear-gradient(160deg,#EAF2F0,var(--paper) 70%); }
  #homeDash .hBigCard.night{ background:linear-gradient(160deg,#EFEAF5,var(--paper) 70%); }
  #homeDash .hBigCard{ flex:1; min-width:0; border:none; border-radius:18px; padding:20px 8px 18px; text-align:center; cursor:pointer; font-family:inherit; background:var(--paper); word-break:keep-all; box-shadow:0 4px 14px rgba(38,50,75,.06); transition:transform .12s ease; }
  #homeDash .hBigCard:active{ transform:scale(.96); }
  #homeDash .hBigCard.play{ background:linear-gradient(160deg,#FFF1EC,var(--paper) 70%); }
  #homeDash .hBigCard.eat{ background:linear-gradient(160deg,#FDF3E3,var(--paper) 70%); }
  #homeDash .hBigCard .e{ display:block; font-size:32px; margin-bottom:8px; }
  #homeDash .hBigCard .l{ font-family:'GmarketSans',inherit; font-size:15px; font-weight:700; color:var(--ink); }
  #homeDash .hBigCard .s{ font-size:11.5px; color:var(--sub); margin-top:5px; display:block; }
  /* 🍚🎯 홈 2단계 — 세부종류 그리드 헤더(뒤로+타이틀) */
  #homeDash .hTier2Head{ display:flex; align-items:center; gap:8px; margin-bottom:8px; flex:0 0 auto; }
  #homeDash .hTier2Back{ border:1px solid var(--line); background:#fff; border-radius:11px; padding:6px 11px; font-size:12.5px; font-weight:700; cursor:pointer; font-family:inherit; color:#555; }
  #homeDash .hTier2Title{ font-size:14.5px; font-weight:800; color:var(--ink); }
  /* 🧭 하단 탭바 5개 — 기존 #foot(입력창) 위가 아니라 그 아래 새 층. 모달(#pickfull z-index:55 등)이 항상 위에 뜨도록 낮은 z-index. */
  #tabbar2{ position:fixed; left:0; right:0; bottom:0; max-width:600px; margin:0 auto; background:var(--paper); border-top:1px solid var(--line); display:flex; z-index:6; height:56px; }
  /* 🔤 2026-09-07: 상시 노출되는 하단 탭 라벨이 10px라 작았다 → 11.5px. 색도 #B0A99F(대비 2.3)는 너무 흐려 --sub로. */
  #tabbar2 button{ flex:1; border:none; background:none; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; font-size:11.5px; font-weight:700; color:var(--sub); cursor:pointer; font-family:inherit; }
  #tabbar2 button .ic{ display:grid; place-items:center; } #tabbar2 button .ic svg{ width:21px; height:21px; }
  #tabbar2 button .ic{ position:relative; } /* 배지 위치기준 */
  .tbBadge{ position:absolute; top:-5px; right:-9px; background:var(--coral,#E8503A); color:#fff; font-size:10px; font-weight:800; min-width:16px; height:16px; border-radius:8px; display:flex; align-items:center; justify-content:center; padding:0 3px; line-height:1; box-shadow:0 1px 3px rgba(0,0,0,.25); } /* 담은 곳 수 배지(사장님 요청 2026-07-29 — 일정짜기를 하단 탭으로) */
  .tbBadge.tbDot{ min-width:10px; width:10px; height:10px; padding:0; top:-3px; right:-5px; border:2px solid var(--paper); box-sizing:content-box; } /* 🆕 2026-09-13 채팅 탭 안읽음 점(숫자 없음 — GET /api/my-chats 60초 캐시) */
  #tabbar2 button.on{ color:var(--coral); }
  #tabbar2 button:active{ transform:scale(.92); }
  /* 🎯 피드 보는 중 항상 보이는 카테고리 전환 바(영상 위) — 한 종류 골라도 다른 종류로 바로 점프 */
  #catbar2{ flex:0 0 auto; display:flex; gap:6px; padding:7px 10px; border-bottom:1px solid var(--line); background:#FCFAF6; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  #catbar2 button{ flex:0 0 auto; border:1.5px solid var(--line); background:#fff; border-radius:15px; padding:6px 11px; font-size:12.5px; font-weight:700; cursor:pointer; white-space:nowrap; color:#444; }
  #catbar2 button.on{ background:#FFEDE7; border-color:#E8503A; color:#C4452B; }
  #catbar2 .catg{ flex:0 0 auto; align-self:center; font-size:11.5px; font-weight:800; color:#8a98a0; padding:0 4px 0 6px; white-space:nowrap; }
  #catbar2 .catg:first-child{ padding-left:2px; }
  #chat::before{ content:''; margin-top:auto; } /* 🔽 대화를 밑에서부터 채움(메시지 적을 때 위가 비고 최신글이 아래) */
  .row{ display:flex; margin:10px 0; animation:rise .28s ease both; }
  .row.me{ justify-content:flex-end; }
  .row.them{ flex-direction:column; align-items:flex-start; gap:3px; } /* 봇: 말풍선/카드 전체 너비 */
  @keyframes rise{ from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;} }
  .bub{ max-width:80%; padding:11px 14px; border-radius:18px; font-size:15px; line-height:1.5; }
  #calBub{ max-width:97%; width:97%; padding:15px 16px; } /* 📅 2026-08-06 사장님 요청: 날짜 고르는 달력이 좁아서 잘못 눌리기 쉬움 — 챗 말풍선 폭 제한(80%)을 풀고 크게 */
  .them .bub{ background:#F3EDE4; border-top-left-radius:5px; }
  .me .bub{ background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; border-top-right-radius:5px; }
  /* 타이핑 */
  .typing{ display:inline-flex; gap:4px; padding:13px 16px; }
  .typing i{ width:7px;height:7px;border-radius:50%; background:#c2c9d4; animation:blink 1.2s infinite both; }
  .typing i:nth-child(2){ animation-delay:.2s } .typing i:nth-child(3){ animation-delay:.4s }
  @keyframes blink{ 0%,60%,100%{opacity:.3; transform:translateY(0)} 30%{opacity:1; transform:translateY(-3px)} }
  /* 선택 칩 */
  #chips{ display:flex; flex-wrap:wrap; gap:8px; padding:4px 14px 6px; }
  #chips .chip-group{ flex-basis:100%; font-size:12.5px; font-weight:800; color:var(--muted); margin:6px 2px 0; letter-spacing:.2px; } /* 그룹 헤더(🎯 놀 곳 / 🍴 먹을 곳) — 줄바꿈으로 묶음 구분 */
  .chip{ border:1.5px solid #E7DFD4; background:#fff; color:var(--ink); padding:10px 15px; border-radius:22px;
    font-size:14px; font-weight:600; cursor:pointer; transition:.15s; }
  .chip:hover{ border-color:var(--emerald); color:var(--emerald); transform:translateY(-1px); }
  .chip.go{ background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; border:none; }
  /* 🧭 위저드 카드 칩 — 누구랑·몇명·며칠·분위기(핵심 질문 funnel)만 크고 명확하게(04-plan 목업의 Trip.com식 단계 카드 참고). 그 외 칩(지역·무드 등 목록 긴 것)은 기존 그대로. */
  .chip.wiz{ flex:1 1 calc(50% - 4px); padding:15px 10px; border-radius:16px; border-width:1.5px; font-size:15px; font-weight:800; background:#FCFAF6; text-align:center; }
  .chip.wiz:hover{ background:#eefaf4; }
  /* 장소 카드 */
  .card{ background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; width:100%; max-width:100%; box-sizing:border-box;
    box-shadow:0 6px 22px rgba(20,30,50,.07); }
  .card .thumb{ position:relative; display:block; }
  .card .thumb .vnav2{ display:flex; align-items:center; justify-content:center; gap:14px; padding:7px; background:#111; }
  .card .thumb .vnav2 button{ background:#fff; color:#111; border:0; border-radius:14px; padding:6px 13px; font-weight:800; font-size:13px; cursor:pointer; }
  .card .thumb .vnav2 span{ color:#fff; font-size:13px; font-weight:700; }
  .card .thumb img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; background:#e9edf2; } /* 🔴 감사 2026-07-20: 유튜브 hqdefault 실제 원본이 480x360(4:3)인데 16:9 박스에 욱여넣어 위아래를 잘라내던 것 수정 — 원본 비율에 맞춰 크롭 없이, 영상이 더 크게(목업 "영상이 곧 얼굴" 의도) */
  .card .play{ position:absolute; inset:0; display:grid; place-items:center; }
  .card .play span{ width:52px;height:52px;border-radius:50%; background:rgba(0,0,0,.55); color:#fff; display:grid;place-items:center; font-size:22px; }
  /* 🔴 2026-09-10: 영상 나브바(◀이전/다음▶)가 있는 카드에선 이 딱지가 나브 위에 겹쳐 "다음 ▶"을 가렸다(390px 실측). 나브 높이만큼 띄운다. */
  .card .vcount.up{ bottom:50px; }
  .card .vcount{ position:absolute; right:8px; bottom:8px; background:rgba(0,0,0,.65); color:#fff; font-size:11px; padding:3px 8px; border-radius:12px; }
  /* 사진 없는 카드(다음 지도) — 휑하지 않게 카테고리 플레이스홀더(+네이버 사진 lazy 교체) */
  .card .thumb.ph{ aspect-ratio:4/3; display:grid; place-items:center; background:linear-gradient(135deg,#F3ECE2,#EDE4D6); position:relative; } /* 위 .thumb img와 비율 통일(같은 피드에서 카드마다 높이 들쭉날쭉 안 하게) */
  .card .thumb.ph .ph-emoji{ font-size:46px; opacity:.9; }
  .card .thumb.ph .ph-tag{ position:absolute; left:8px; bottom:8px; background:rgba(255,255,255,.82); color:#566; font-size:11px; font-weight:700; padding:3px 9px; border-radius:12px; }
  .card .body{ padding:10px 13px 12px; }
  .card .nm{ font-weight:800; font-size:15px; letter-spacing:-.2px; }
  .card .badge{ display:inline-block; background:#fff1ea; color:var(--orange); font-size:11px; font-weight:700; padding:2px 8px; border-radius:10px; margin-left:6px; vertical-align:middle; }
  .card .meta{ font-size:12px; color:var(--sub); margin-top:3px; }
  .pchip{ display:inline-block; font-size:11px; font-weight:700; padding:2px 7px; border-radius:9px; }
  /* 한 줄 말줄임 — 해시태그 길게 늘어져 카드가 화면 넘기던 것 방지(영상+버튼 한 화면) */
  .card .why{ font-size:12.5px; color:#3a4458; margin-top:6px; background:#FBF3EC; border-left:3px solid var(--emerald); padding:5px 9px; border-radius:0 10px 10px 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  /* 🔴 2026-07-28: 상세페이지 전체 소개글용 — .why(한 줄 말줄임)에 <br>+긴 텍스트를 같이 넣었더니 뒷부분이 통째로 안 보이고 "..."로 잘려 사라지던 버그. 줄바꿈 허용하는 별도 박스로 분리. */
  .card .why-full{ font-size:12.5px; color:#3a4458; margin-top:6px; padding:2px 9px; line-height:1.55; white-space:normal; word-break:keep-all; overflow-wrap:break-word; }
  .card .nearby-others{ margin-top:10px; padding-top:9px; border-top:1px dashed var(--line); } /* 🔍 이 근처 다른 곳(Trip.com 벤치마킹 §4-7) — 2026-08-06: 개별장소 나열 대신 홈 큰메뉴(hBig) 재사용 */
  .card .nearby-others .no-h{ font-size:12px; font-weight:700; color:var(--sub); margin-bottom:6px; }
  .card .nearby-others .hBig{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .card .nearby-others .hBigCard{ flex:1; min-width:0; border:none; border-radius:15px; padding:14px 6px 12px; text-align:center; cursor:pointer; font-family:inherit; background:var(--paper); word-break:keep-all; box-shadow:0 3px 10px rgba(38,50,75,.06); transition:transform .12s ease; }
  .card .nearby-others .hBigCard:active{ transform:scale(.96); }
  /* ⚠️ 카드 안에선 홈의 play/eat/... 클래스를 그대로 못 씀 — `.card .play`(영상 재생버튼 오버레이,
     absolute+inset:0)와 충돌해 버튼이 카드 전체를 덮는 실사고(2026-08-06). nb- 접두로 격리. */
  .card .nearby-others .hBigCard.nb-play{ background:linear-gradient(160deg,#FFF1EC,var(--paper) 70%); }
  .card .nearby-others .hBigCard.nb-eat{ background:linear-gradient(160deg,#FDF3E3,var(--paper) 70%); }
  .card .nearby-others .hBigCard.nb-cafe{ background:linear-gradient(160deg,#F3EFE7,var(--paper) 70%); }
  .card .nearby-others .hBigCard.nb-night{ background:linear-gradient(160deg,#EFEAF5,var(--paper) 70%); }
  .card .nearby-others .hBigCard.nb-stay{ background:linear-gradient(160deg,#EAF2F0,var(--paper) 70%); }
  .card .nearby-others .hBigCard.nb-wide{ grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:8px; padding:12px 8px; }
  .card .nearby-others .hBigCard.nb-wide .e{ margin:0; font-size:22px; }
  .card .nearby-others .hBigCard.nb-wide .s{ margin:0; }
  .card .nearby-others .hBigCard .e{ display:block; font-size:24px; margin-bottom:5px; }
  .card .nearby-others .hBigCard .l{ font-family:'GmarketSans',inherit; font-size:13.5px; font-weight:700; color:var(--ink); }
  .card .nearby-others .hBigCard .s{ font-size:10.5px; color:var(--sub); margin-top:3px; display:block; }
  .card .nearby-others .hCats{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px 0; background:#fff; border-radius:14px; padding:12px 4px 8px; border:1px solid var(--line); }
  .card .nearby-others .hCat{ text-align:center; padding:5px 0; cursor:pointer; border:none; background:none; font-family:inherit; }
  .card .nearby-others .hCat .e{ display:block; font-size:20px; margin-bottom:3px; }
  .card .nearby-others .hCat .l{ font-size:10px; font-weight:700; color:var(--ink); }
  .card .nearby-others .hTier2Head{ display:flex; align-items:center; gap:7px; margin-bottom:7px; }
  .card .nearby-others .hTier2Back{ border:1px solid var(--line); background:#fff; border-radius:10px; padding:5px 10px; font-size:11.5px; font-weight:700; cursor:pointer; font-family:inherit; color:#555; }
  .card .nearby-others .hTier2Title{ font-size:13px; font-weight:800; color:var(--ink); }
  .acts{ display:flex; flex-direction:column; gap:6px; margin-top:8px; }
  .acts-top{ display:flex; gap:6px; }
  .acts-top .b-keep{ flex:1.4; border:none; border-radius:12px; padding:12px 0; font-size:15px; font-weight:800; cursor:pointer; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; }
  .acts-top .b-next{ flex:1; border:none; border-radius:12px; padding:12px 0; font-size:14px; font-weight:700; cursor:pointer; background:#EFE6DA; color:#55607a; }
  .acts2{ display:flex; gap:6px; }
  .acts2 button{ flex:1; border:none; border-radius:12px; padding:9px 0; font-size:12.5px; font-weight:700; cursor:pointer; background:#EFE6DA; color:#55607a; white-space:nowrap; }
  .acts2 .b-stop, .acts2 .b-toggle{ background:#e8f5ef; color:#C4452B; }
  .acts2 .b-other{ background:#eef3ff; color:#3b5bdb; }
  .decided{ text-align:center; padding:10px 0 2px; font-weight:800; font-size:14px; }
  .decided.keep{ color:#C4452B; } .decided.skip{ color:#8a93a3; } .decided.no{ color:#e05555; }
  /* 🆕 2026-07-20: 리스트형 탐색(사장님 실사용 피드백 — 1장씩 스와이프가 불편) — 여러 장 컴팩트 카드를 한번에 스크롤 */
  .flist{ display:flex; flex-direction:column; gap:9px; width:100%; }
  .fl-card{ display:flex; gap:10px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:8px; width:100%; box-sizing:border-box; cursor:pointer; }
  .fl-card .fl-th{ position:relative; width:92px; height:92px; border-radius:10px; overflow:hidden; flex:0 0 auto; background:linear-gradient(135deg,#F3ECE2,#EDE4D6); display:flex; align-items:center; justify-content:center; }
  .fl-card .fl-th img{ width:100%; height:100%; object-fit:cover; display:block; }
  .fl-card .fl-th .fl-ph{ font-size:30px; }
  .fl-card .fl-th .fl-play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:20px; text-shadow:0 1px 6px rgba(0,0,0,.5); pointer-events:none; }
  .fl-card .fl-th .fl-vn{ position:absolute; right:4px; bottom:4px; background:rgba(0,0,0,.65); color:#fff; font-size:9.5px; font-weight:700; padding:2px 6px; border-radius:10px; }
  .fl-card .fl-body{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; }
  .fl-card .fl-nm{ font-weight:800; font-size:14.5px; letter-spacing:-.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .fl-card .fl-meta{ font-size:11.5px; color:var(--sub); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  /* 📐 2026-09-07 실측: 리스트 카드의 추천 이유가 한 줄 강제라 "밥 한 끼 하기 좋은 곳이에요 🍚"조차
     잘렸다(138건). 이유는 읽으라고 있는 문장이므로 2줄까지 허용한다. */
  .fl-card .fl-why{ font-size:12px; color:#3a4458; margin-top:4px; background:#FBF3EC; border-left:3px solid var(--emerald); padding:4px 8px; border-radius:0 8px 8px 0; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:keep-all; }
  /* 🗺️ 2026-08-04 사장님 요청: 담기 버튼 밑에 지도보기 버튼 — 그 장소 위치+내 위치를 같이 보여줌(showPlaceMap 확장) */
  .fl-card .fl-mapbtn{ margin-top:5px; align-self:flex-start; border:1.5px solid #cfe0fb; background:#fff; border-radius:10px; padding:5px 13px; font-weight:700; font-size:11.5px; cursor:pointer; color:#2E7CF6; }
  /* 🏨 숙소 예약 아웃링크(제휴) — 카드/상세/지도팝업/일정 공용. stayBookHtml()이 생성.
     🔴 2026-07-31: "🛏️ 예약하기" 버튼 → 세로 드롭다운(플랫폼이 숨어 있었음)을 **가로 펼침**으로 교체.
       플랫폼 3개가 처음부터 보여야 "여기서 비교해서 고른다"로 읽힌다(사장님 지적).
     ⚠️ 우리는 요금·공실 데이터를 가질 방법이 구조적으로 없다 — 금액/최저가는 여기에 절대 넣지 말 것(환각0). */
  .stayBook{ margin-top:6px; display:block; }
  /* 🔴 2026-07-31 감사 수정: 예전엔 flex:1 1 92px + min-width:88px + wrap이었는데, 카드 본문(.fl-body)
     가용폭이 320px 기기에서 ~176px밖에 안 돼 3개가 2줄·3줄로 무너졌다(= "비교사이트처럼 나란히"가
     대부분의 폰에서 실제로는 안 만들어짐). → 상위 3개는 nowrap + flex:1 1 0/min-width:0으로 폭을 n등분해
     좁아도 항상 한 줄. 이름이 잘려도 title/aria-label에 전체 문구가 남아 라벨 정직성은 유지된다. */
  /* 🔴 2026-08-03: 기본 노출이 4개가 되면서 한 줄 4등분은 폰에서 글자가 다 잘린다 → 2×2 격자.
     지도 팝업처럼 좁은 컨테이너에서도 안전하고, 나중에 각 사 로고를 넣을 자리도 확보된다. */
  .stayRow{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
  .stayPf{ min-width:0; max-width:100%; display:flex; flex-direction:column; align-items:center; gap:1px; border:1.5px solid var(--line,#E7DFD4); background:#fff; border-radius:10px; padding:7px 6px; text-decoration:none; color:var(--ink,#222); }
  .stayPf:active{ background:#f2f5f9; }
  .stayPf .stayPfLogo{ width:26px; height:26px; border-radius:7px; object-fit:contain; display:block; margin-bottom:1px; }
  .stayPf .stayPfName{ font-weight:800; font-size:12.5px; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .stayPf .stayPfTag{ font-weight:700; font-size:10.5px; color:var(--sub,#8a98a0); }
  /* 파란 강조 = 숙소 이름이 실제로 그 플랫폼 검색에 전달되는 곳(바로예약). 나머지는 회색(검색) — 라벨 정직성 */
  .stayPf.isSearch{ border-color:#2E7CF6; }
  .stayPf.isSearch .stayPfTag{ color:#2E7CF6; }
  .stayBook .stayMoreBtn{ margin-top:5px; border:none; background:transparent; padding:3px 2px; border-radius:8px; font-family:inherit; font-weight:700; font-size:11.5px; color:var(--sub,#8a98a0); cursor:pointer; }
  .stayBook .stayMore{ display:none; }
  .stayBook .stayMore.on{ display:flex; flex-wrap:wrap; gap:6px; margin-top:5px; }
  /* 펼친 "다른 곳"은 개수가 많아(5개) 한 줄에 n등분하면 글자가 전부 잘린다 — 여긴 기존대로 줄바꿈 */
  .stayBook .stayMore .stayPf{ flex:1 1 88px; }
  .stayBook .stayDisc{ margin-top:5px; font-size:10.5px; color:var(--sub,#999); line-height:1.35; }
  /* 📍 "이 숙소가 내 일정에 맞는 이유" 한 줄(일정 화면 숙소 아이템 아래) */
  .lodgeFit{ margin-top:3px; font-size:11.5px; color:#3a4458; font-weight:600; }
  /* 🔁 P2: 숙소 바꾸기(동선 앵커 기반 대안, GET/POST /api/trips/:id/lodging*) */
  .lodgeSwapBtn{ border:1.5px solid #cfd6de; background:#fff; color:#5b6b8c; border-radius:9px; padding:5px 10px; font-weight:800; font-size:11.5px; cursor:pointer; font-family:inherit; margin-left:4px; }
  .lodgeSwapBox{ display:none; margin-top:6px; border:1px solid var(--line,#E7DFD4); border-radius:10px; padding:7px 8px; background:#fbf9f5; }
  .lodgeAltRow{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:6px 2px; border-bottom:1px solid #eee; font-size:12.5px; }
  .lodgeAltRow:last-child{ border-bottom:none; }
  .lodgeAltImg{ width:40px; height:40px; border-radius:50%; object-fit:cover; flex:none; }
  .lodgeAltPick{ flex:0 0 auto; border:none; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; border-radius:8px; padding:6px 10px; font-weight:800; font-size:11.5px; cursor:pointer; font-family:inherit; }
  /* 🔴 2026-07-28 사장님 요청: AI 추천 결과(챗 전용, 리스트뷰는 기존 세로목록 유지)는 홈 선반처럼 카드를 가로로
     나란히 보여주고 담기 버튼은 카드마다 그대로 — 한 장씩 아래로 훑는 대신 옆으로 넘기며 다양하게 비교하게. */
  .flist.flist-shelf{ flex-direction:row; overflow-x:auto; gap:10px; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
  .flist-shelf .fl-card{ flex:0 0 45%; width:45%; flex-direction:column; gap:0; padding:0; overflow:hidden; }
  .flist-shelf .fl-card .fl-th{ width:100%; height:140px; border-radius:0; }
  .flist-shelf .fl-card .fl-body{ padding:9px 10px 10px; }
  .flist-shelf .fl-card .fl-why{ white-space:nowrap; }
  /* 🏨 2026-07-31 감사 수정: 잠깐 `.flist-shelf .fl-card .stayBook{display:none}`으로 감췄었는데,
     .flist-shelf는 홈 선반 전용이 아니라 리스트뷰(#listView, 홈 🏨 숙소 큰메뉴)·챗 피드까지 쓰는 클래스라
     숙소를 훑는 주 화면에서 예약 진입점이 통째로 사라졌다(기존 "🛏️ 예약하기"까지 없어진 순수 회귀 + 제휴 클릭 유실).
     → 숨기지 말고, 좁은 선반 카드(45% 폭 ≈ 내부 113px)에서는 타일을 "이름 ─ 태그" 한 줄짜리 가로 행으로 눕혀
     세 곳을 전부 읽히게 한다(세로로 3행). 폭 넉넉한 상세/지도팝업/전체폭 목록은 위의 가로 3등분 그대로. */
  /* 🏨 숙소 전용 세로 큰카드 피드(사장님 지시 2026-08-03 "이 화면 너무 작아 — 상세 크기로, 밑으로 계속") —
     여기어때/피터팬식: 사진 크게 + 정보 큼직 + 무한스크롤. 다른 카테고리 선반식(.flist-shelf)은 그대로.
     사진 없는 숙소(부산 모텔 429곳 중 428곳)가 대부분이라 **빈 이모지 대신 종류별 웜톤 그라데이션 커버**가 디자인의 핵심. */
  .stayFeed{ display:flex; flex-direction:column; gap:14px; }
  /* ⚠️ .fl-card 기본은 display:flex(썸네일 왼쪽·본문 오른쪽 가로배치)라 그대로 두면 사진이 왼쪽 반쪽에 갇힌다
     (2026-08-03 실기기에서 확인) — 큰카드는 block+패딩0으로 전부 덮어써 사진이 전폭 상단에 오게 한다. */
  .sb-card{ display:block; gap:0; padding:0; background:#fff; border:1px solid var(--line,#E7DFD4); border-radius:18px; overflow:hidden; box-shadow:0 3px 14px rgba(60,42,20,.07); cursor:pointer; }
  .sb-card .sb-th{ position:relative; width:100%; height:200px; border-radius:0; flex:none; background:#EFE7DB; display:block; }
  .sb-card .sb-th img{ width:100%; height:100%; object-fit:cover; display:block; }
  .sb-card .sb-th .fl-ph{ display:none; } /* wireFeedCards의 lazyFeedThumb 표적(마크업 계약) — 숙소는 trustPhoto 게이트로 어차피 교체 안 됨 */
  .sb-card .sb-cover{ width:100%; height:132px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; }
  .sb-card .sb-cover .sb-emoji{ font-size:46px; filter:drop-shadow(0 3px 6px rgba(0,0,0,.14)); }
  .sb-card .sb-cover .sb-covertxt{ font-size:11.5px; font-weight:800; color:rgba(255,255,255,.92); letter-spacing:.14em; }
  .sb-card .sb-th.short{ height:132px; }
  .sb-card .sb-badge{ position:absolute; top:10px; left:10px; background:rgba(20,16,12,.55); color:#fff; font-size:11.5px; font-weight:800; padding:4px 10px; border-radius:99px; backdrop-filter:blur(2px); }
  .sb-card .sb-vn{ position:absolute; right:10px; bottom:10px; background:rgba(20,16,12,.6); color:#fff; font-size:12px; font-weight:800; padding:4px 9px; border-radius:9px; }
  /* 🏛️ 공공누리 사진 출처 마이크로 캡션(지침서13 ①단계) — 앱 사진의 93.6%가 관광공사 사진이라 "사진 보이는 곳마다 표기"가 라이선스 조건.
     .shPlay/.sb-vn와 같은 자리(썸네일 우하단)·같은 방식(반투명 검정 pill)이라 레이아웃 리스크 0. 9px 마이크로라 사진을 안 가린다.
     ⚠️ 작은 썸네일(.fl-th 92×92 · .ci-thumb · .ps-th 84 · .ot-th 96×72 · lodgeAltImg 40)에는 붙이지 않는다 — 대신 그 화면에 .imgCreditNote 한 줄. */
  .imgPick{ position:absolute; left:5px; top:5px; z-index:3; background:rgba(154,90,10,.95); color:#fff; font-size:11.5px; line-height:1.25; font-weight:800; padding:2px 7px; border-radius:8px; pointer-events:none; white-space:nowrap; } /* ⭐ 사장님이 모셔간 손님 사진(2026-09-15 T4) */
  .imgCredit{ position:absolute; right:5px; bottom:5px; z-index:3; background:rgba(0,0,0,.5); color:#fff; font-size:11px; line-height:1.25; font-weight:700; letter-spacing:-.3px; padding:1px 6px; border-radius:7px; pointer-events:none; white-space:nowrap; max-width:calc(100% - 10px); overflow:hidden; text-overflow:ellipsis; }
  .imgCreditNote{ font-size:11px; color:var(--muted,#8a98a0); padding:8px 12px 12px; text-align:center; line-height:1.4; }
  .sb-card .sb-play{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:46px; height:46px; border-radius:50%; background:rgba(20,16,12,.5); color:#fff; display:flex; align-items:center; justify-content:center; font-size:18px; padding-left:3px; }
  .sb-card .sb-body{ padding:12px 14px 13px; }
  .sb-card .sb-nm{ font-size:17px; font-weight:900; color:var(--ink,#232323); line-height:1.3; }
  .sb-card .sb-meta{ margin-top:4px; font-size:12.5px; color:var(--sub,#8a98a0); }
  .sb-card .sb-meta b{ color:var(--coral,#E8694F); }
  .sb-card .sb-why{ margin-top:7px; font-size:12.5px; color:#3a4458; background:#FBF3EC; border-left:3px solid var(--emerald); padding:5px 9px; border-radius:0 9px 9px 0; }
  .sb-card .sb-foot{ display:flex; align-items:center; gap:8px; margin-top:10px; }
  .stayFeed .sb-sentinel{ height:1px; }
  /* 🗂️ OTA식 리스트 화면(#listView) — 홈 카테고리 탭 → 챗 없이 바로 목록(trip.com/여기어때식, 2026-07-28 사장님 요청) */
  /* 🥕 당근 동네지도 벤치마킹(2026-08-26, 4차) — #pickfull의 peek시트 구조를 그대로 이식.
     시도 1~3(중첩스크롤·-webkit-overflow-scrolling 제거·sticky헤더)이 전부 "스크롤이 지도를
     지나가면 카카오맵 SDK가 터치를 가로챈다"는 근본 원인을 못 없앴다 — 지도와 스크롤 콘텐츠가
     같은 터치 경로(문서 흐름)에 있는 한 이 충돌은 계속 재발한다. 그래서 #pickfull과 완전히 동일한
     구조로 바꾼다: 지도(#lvMap)는 고정 크기 블록(스크롤 없음)이고, 목록은 별도 오버레이 시트
     (#lvSheet, absolute)가 그 위를 덮으며 그립으로 드래그 리사이즈된다 — 지도와 시트의 스크롤/드래그
     영역이 물리적으로 분리돼 있어 터치 가로채기가 구조적으로 불가능하다(#pickfull에서 실기기로
     이미 검증된 패턴 그대로). */
  #listView{ display:none; flex:1 1 auto; position:relative; overflow:hidden; padding:0; flex-direction:column; min-height:0; }
  #listView .lvHead{ display:flex; align-items:center; gap:8px; flex:0 0 auto; background:var(--bg,#FAF5EE); z-index:2; padding:8px 12px; position:relative; }
  #listView #lvMap{ flex:1 1 auto; min-height:0; width:100%; position:relative; background:#e9e4da; }
  #listView .lv-maptoggle{ display:none; align-items:center; gap:6px; position:absolute; left:50%; top:56px; transform:translateX(-50%); z-index:8; background:#232323; color:#fff; border:none; border-radius:24px; padding:11px 22px; font-weight:800; font-size:13.5px; box-shadow:0 6px 18px rgba(0,0,0,.3); cursor:pointer; white-space:nowrap; }
  /* 🥕 2026-09-13 실기기 재검증에서 잡은 잔여 구멍 — 본문(.ps-body/.lvBody)에만 touch-action:none을 걸었더니
     아이콘 그리드(.pf-cats)·칩 줄처럼 **스크롤 컨테이너가 아닌 자식**은 기본값 그대로라 거기서 끌면
     브라우저가 또 제스처를 가져가 드래그가 죽었다(사장님이 실제로 끈 곳이 바로 이 아이콘 줄이다).
     → 시트 루트에 걸어 자식 전체를 덮고, 스크롤이 필요한 곳만 아래에서 pan-y/pan-x로 되살린다. */
  #listView .lv-sheet{ touch-action:none; position:absolute; z-index:5; background:#fff; display:flex; flex-direction:column; box-shadow:0 -6px 24px rgba(0,0,0,.16); transition:height .26s ease; overflow:hidden; left:0; right:0; bottom:0; height:40vh; max-height:88vh; border-radius:18px 18px 0 0; }
  #listView .lv-sheet.on{ height:88vh; }
  #listView .lv-sheet .ps-grip{ flex:0 0 auto; padding:14px 0 10px; cursor:grab; touch-action:none; -webkit-user-select:none; user-select:none; }
  #listView .lvBody{ flex:1 1 auto; min-height:0; overflow-y:auto; padding:0 12px 140px; -webkit-overflow-scrolling:touch; touch-action:none; overscroll-behavior:contain; }
  /* 🥕 2026-09-13 사장님 지적("당근은 시트 밑 메뉴가 위아래로 자유롭게 이동되는데 우리는 점(그립)을 눌러야만 된다"):
     본문이 touch-action 기본값이면 브라우저가 세로 스크롤 제스처를 먼저 확정하고 pointercancel을 쏴서
     JS 시트 드래그가 통째로 죽는다(그립만 살아남던 이유 = .ps-grip에만 touch-action:none이 있었기 때문).
     → 접힘(peek)일 땐 본문 세로 제스처의 소유권을 JS로 가져오고(none), 펼침(.on)일 땐 네이티브 세로
     스크롤로 돌려준다(pan-y). 시트 안 가로 캐러셀은 pan-x를 명시해 스와이프를 되살린다. */
  /* 🔴 2026-09-14 사장님 신고("밑으로 안 내려가서 밑에 메뉴를 볼 수가 없어") — 펼친 시트 본문이 거의 전부
     가로 선반(.flist-shelf/.shRow)이라, 아래 pan-x 한 줄이 **화면 대부분의 세로 스크롤을 통째로 막고 있었다.**
     `touch-action:pan-x`는 "가로만 허용"이라 그 위에선 손가락을 위로 올려도 1px도 안 내려간다.
     가로 캐러셀을 세로 스크롤 안에 두는 건 브라우저가 원래 알아서 하는 일(중첩 스크롤러)이므로,
     **펼침 상태에선 touch-action을 아예 손에서 놓는다**(auto). 접힘(peek)은 그대로 루트 none =
     JS 소유라 당근식 "아무 데나 잡아 끌기"는 유지된다. 그립만 예외로 계속 none(펼침에서도 끌어야 함). */
  #listView .lv-sheet:not(.on) .lvBody .flist-shelf, #listView .lv-sheet:not(.on) .lvBody .shRow{ touch-action:pan-x; }
  #listView .lv-sheet.on, #listView .lv-sheet.on *{ touch-action:auto; }
  #listView .lv-sheet.on .ps-grip{ touch-action:none; }
  #listView .lvBack{ border:1px solid var(--line); background:#fff; border-radius:11px; padding:7px 12px; font-size:13px; font-weight:700; cursor:pointer; font-family:inherit; color:#555; flex:0 0 auto; }
  #listView .lvTitle{ font-size:15.5px; font-weight:800; color:var(--ink); flex:1 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  #listView .lvRegion{ flex:0 0 auto; font-size:12.5px; }
  #listView .lvHead .chip{ white-space:nowrap; flex:0 0 auto; padding:7px 10px; font-size:12px; } /* 좁은 폰에서 "거리순/지도" 두 줄 꺾임 방지(사장님 지적 2026-07-29) */
  #listView .lvNote{ background:#fff8f0; border:1px solid #f2dfc8; border-radius:12px; padding:10px 12px; font-size:13px; color:#6b5a3e; margin-bottom:8px; flex:0 0 auto; }
  .hShelfNote{ background:#fff8f0; border:1px solid #f2dfc8; border-radius:12px; padding:10px 12px; font-size:13px; color:#6b5a3e; margin:0 2px 12px; } /* 홈 선반 동→구 폴백 안내(#listView 밖이라 위 .lvNote 재사용 불가, 같은 톤) */
  #listView .lvOpts{ display:flex; flex-wrap:wrap; gap:7px; background:transparent; border:none; padding:2px 0; }
  #listView .lvLoad{ text-align:center; color:var(--sub); font-size:13.5px; padding:26px 0; }
  #listView .fl-more{ width:100%; margin-top:10px; padding:12px; border:1.5px solid var(--line); background:#fff; border-radius:12px; font-weight:800; font-size:13.5px; cursor:pointer; font-family:inherit; color:#333; }
  #homeDash .hAiCard{ display:block; width:100%; border:1.5px dashed #F1C9BD; background:linear-gradient(135deg,#FFF4EF,var(--paper)); border-radius:16px; padding:14px 12px; margin-top:8px; text-align:left; cursor:pointer; font-family:inherit; font-size:13.5px; font-weight:800; color:var(--stamp); flex:0 0 auto; animation:rise .45s .14s ease both; }
  #homeDash .hAiCard:active{ transform:scale(.98); }
  /* 🎠 홈 큐레이션 선반(가로 캐러셀) + 리스트 필터칩(P2) */
  #hShelves{ flex:0 0 auto; margin-top:10px; }
  /* 🔴 2026-08-05: 장소 상세를 내리면 홈 선반이 이어서 나오게(renderHomeShelves를 새 컨테이너에 재사용) —
     #hShelves 전용이던 스코프를 .hShelfReuse 클래스에도 똑같이 적용(추가만, 기존 홈 스타일은 안 건드림). */
  #hShelves .shelf, .hShelfReuse .shelf{ margin-bottom:18px; animation:rise .5s ease both; }
  #hShelves .shelf:nth-child(1){ animation-delay:.18s; } #hShelves .shelf:nth-child(2){ animation-delay:.26s; } #hShelves .shelf:nth-child(3){ animation-delay:.34s; }
  #hShelves .shTitle, .hShelfReuse .shTitle{ font-family:'GmarketSans',inherit; font-size:15px; font-weight:700; color:var(--ink); margin:0 2px 9px; letter-spacing:-.3px; display:flex; align-items:center; justify-content:space-between; gap:8px; }
  /* 🔴 2026-08-05: 선반 제목 옆 "🗺️ 지도보기" */
  #hShelves .shMapBtn, .hShelfReuse .shMapBtn{ font-family:inherit; font-size:12px; font-weight:700; color:var(--emerald); background:#fff; border:1px solid var(--line); border-radius:12px; padding:4px 9px; cursor:pointer; white-space:nowrap; flex:0 0 auto; }
  @media (prefers-reduced-motion:reduce){ #homeDash .hHero,#homeDash .hBig,#homeDash .hAiCard,#hShelves .shelf{ animation:none; } }
  #hShelves .shRow, .hShelfReuse .shRow{ display:flex; gap:9px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
  /* 🔴 2026-07-28 사장님 요청: 한 화면에 4개 뜨던 작은 카드 → 여기어때/야놀자 벤치마킹처럼 2개(+옆 카드 살짝)만 보이는 큼직한 카드로. */
  #hShelves .shCard, .hShelfReuse .shCard{ flex:0 0 45%; width:45%; background:var(--paper); border:none; border-radius:15px; overflow:hidden; cursor:pointer; box-shadow:0 3px 12px rgba(38,50,75,.07); transition:transform .12s ease; }
  #hShelves .shCard:active, .hShelfReuse .shCard:active{ transform:scale(.96); }
  /* ⏳ 첫 방문 스켈레톤(2026-09-06 사장님 지적 "기다릴 동안 지루함 없게 하던지 즉각 화면이 나오게 하던지") —
     데이터 오기 전 빈 화면 대신 반짝이는 자리표시 + 진행 메시지. 데이터 도착 시 innerHTML 교체로 통째 사라짐. */
  .skCard{ pointer-events:none; }
  .skSh{ display:block; width:100%; height:96px; }
  .skSh,.skLine{ background:linear-gradient(90deg,#ececf1 25%,#f8f8fb 45%,#ececf1 65%); background-size:400% 100%; animation:skShine 1.1s linear infinite; }
  .skLine{ height:12px; border-radius:6px; margin:8px 10px 0; }
  .skLine.s{ width:55%; margin-bottom:12px; }
  .skLine.t{ display:inline-block; width:150px; height:15px; }
  .skMsg{ font-size:13px; color:#8a8f9c; margin:2px 2px 10px; }
  @keyframes skShine{ 0%{ background-position:100% 0; } 100%{ background-position:0 0; } }
  /* 🔴 2026-08-05: 상세 아래 이어진 선반(quickAdd)의 "+담기" — 카드 열지 않고 바로 담기/취소 */
  .hShelfReuse .shCard{ position:relative; }
  .hShelfReuse .shAdd{ position:absolute; top:8px; right:8px; z-index:2; border:none; border-radius:14px; padding:5px 10px;
    font-size:12px; font-weight:800; color:#fff; background:rgba(38,50,75,.72); cursor:pointer; }
  .hShelfReuse .shAdd.on{ background:var(--emerald); }
  #hShelves .shMore, .hShelfReuse .shMore{ flex:0 0 30%; width:30%; height:184px; display:flex; align-items:center; justify-content:center; text-align:center; background:#F8F3EC; border:1.5px dashed var(--line); border-radius:13px; cursor:pointer; font-size:13.5px; font-weight:800; color:var(--emerald); line-height:1.5; }
  #hShelves .shTh, .hShelfReuse .shTh{ position:relative; width:100%; height:140px; background:linear-gradient(135deg,#F3ECE2,#EDE4D6); display:flex; align-items:center; justify-content:center; }
  #hShelves .shTh img, .hShelfReuse .shTh img{ width:100%; height:100%; object-fit:cover; display:block; }
  #hShelves .shTh .shPlay, .hShelfReuse .shTh .shPlay{ position:absolute; right:6px; bottom:6px; background:rgba(0,0,0,.62); color:#fff; font-size:12px; font-weight:700; padding:3px 7px; border-radius:10px; }
  /* 📐 2026-09-07 실측: 카드 폭이 45%(약 156px)라 한글 12자쯤에서 잘렸다 — "윈덤그랜드부산 더델리&카…"
     처럼 어디인지 알 수 없게 됨(실데이터 다수). 한 줄 강제를 풀고 2줄까지 허용(넘치면 말줄임).
     높이는 2줄로 고정해 카드 높이가 들쭉날쭉해지지 않게 한다. */
  #hShelves .shNm, .hShelfReuse .shNm{ font-size:14.5px; font-weight:800; padding:9px 10px 3px; line-height:1.3; height:calc(2 * 1.3em + 12px); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:keep-all; }
  /* 🔴 2026-07-28 사장님 요청: 리스트뷰에서 세부종류 미선택("먹을 곳" 전체)이면 flat 세로목록 대신 종류별 가로 선반(홈과 동일 감성) */
  #listView .lvShelf{ margin-bottom:16px; }
  #listView .lvShelf .shTitle{ font-size:14.5px; font-weight:800; color:var(--ink); margin:0 2px 8px; }
  #listView .lvShelf .shMore{ flex:0 0 30%; width:30%; display:flex; align-items:center; justify-content:center; text-align:center; background:#F8F3EC; border:1.5px dashed var(--line); border-radius:13px; cursor:pointer; font-size:13.5px; font-weight:800; color:var(--emerald); line-height:1.5; }
  /* 📐 2026-09-07 실측: 📺유명인 배지가 붙으면 한 줄에 배지+종류+동네가 다 안 들어가 "자…"처럼 잘렸다.
     배지는 그 자체로 한 줄을 차지하게 하고(블록), 종류·동네는 아랫줄에서 온전히 보이게 한다. */
  #hShelves .shMeta, .hShelfReuse .shMeta{ font-size:12px; color:var(--sub); padding:0 10px 10px; line-height:1.45; }
  #hShelves .shMeta .celebTag, .hShelfReuse .shMeta .celebTag{ display:block; margin:0 0 3px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #hShelves .shMeta .shMetaTxt, .hShelfReuse .shMeta .shMetaTxt{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  /* 🥕 당근 동네지도 카테고리 그리드 벤치마킹(2026-08-26) — 가로 알약칩 대신 아이콘+글자 그리드(5열). */
  #listView #lvChips{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px 2px; padding:10px 2px 8px; flex:0 0 auto; }
  #listView #lvChips:empty{ display:none; }
  #listView #lvChips .lvCatCell{ box-sizing:border-box; display:flex; flex-direction:column; align-items:center; gap:5px; border:none; background:none; padding:2px; border-radius:12px; cursor:pointer; }
  #listView #lvChips .lvCatCell .e{ width:48px; height:48px; border-radius:50%; background:transparent; font-size:24px; display:flex; align-items:center; justify-content:center; }
  #listView #lvChips .lvCatCell.on .e{ background:linear-gradient(135deg,var(--orange),var(--emerald)); }
  #listView #lvChips .lvCatCell .l{ font-size:11px; font-weight:700; color:#3a4250; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; max-width:100%; }
  #listView #lvChips .lvCatCell.on .l{ color:var(--orange); font-weight:800; }
  #listView #lvRegionPick{ margin-bottom:8px; }
  .fl-more{ width:100%; padding:12px; border:1.5px dashed #cfd6de; background:#fff; border-radius:12px; font-weight:800; font-size:13.5px; color:#5b6b8c; cursor:pointer; margin-top:2px; }
  .fl-more:disabled{ opacity:.6; }
  .fl-swipe{ text-align:center; font-size:12px; color:#8a98a0; margin-top:6px; cursor:pointer; text-decoration:underline; }
  /* 하단 입력 + 장바구니 */
  #foot{ position:fixed; left:0; right:0; bottom:54px; max-width:600px; margin:0 auto; background:#fff; border-top:1px solid var(--line); }
  #foot.bare{ border-top:none; background:none; } /* 🔴 2026-08-05: 홈 화면에선 #cartFab만 남기고 다 숨기는데, 빈 #foot 테두리선이 스치지 않게 */
  #cartbar{ display:none; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid var(--line);
    background:linear-gradient(135deg,#fff7f2,#f0fbf8); }
  #cartbar .n{ font-weight:800; font-size:14px; }
  #cartbar button{ margin-left:auto; border:none; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff;
    font-weight:800; font-size:14px; padding:10px 16px; border-radius:22px; cursor:pointer; }
  /* 🧭 2026-08-04: 담긴 곳이 있을 때만 우측하단에 뜨는 동그란 일정짜기 버튼(탭바 위, 화면 안 가림).
     2026-08-05: #foot의 자식으로 옮기고 position:absolute; bottom:100%로 — #foot(position:fixed라 그 자체가
     containing block)가 칩·안내문구로 커져도 브라우저가 항상 그 바로 위에 재계산해줌(JS 필요 없음).
     2026-08-05 재수정: 동그란 모양은 그대로(사장님 확정) — "일정짜기" 글자를 원 밖 말풍선이 아니라
     원 안에 두 줄로 직접 넣음(사장님 지시: "동그라미 안에 넣어달라"). 원을 살짝 키워서 글자 공간 확보. */
  #cartFab{ display:none; position:absolute; right:14px; bottom:100%; margin-bottom:12px; z-index:7;
    width:62px; height:62px; align-items:center; justify-content:center; border:2.5px solid #fff; border-radius:50%; padding:0;
    background:linear-gradient(135deg,var(--coral),var(--stamp)); color:#fff; font-family:inherit;
    cursor:pointer; box-shadow:0 8px 20px rgba(232,80,58,.38); text-align:center; line-height:1.25; }
  #cartFab.show{ display:flex; }
  #cartFab .fabtxt{ font-size:15px; font-weight:900; }
  #cartFab b{ position:absolute; top:-4px; right:-4px; background:#fff; color:var(--stamp); border:2px solid var(--stamp);
    border-radius:50%; min-width:20px; height:20px; line-height:16px; padding:1px 4px; font-size:11px; font-weight:800; }
  #cartFab:active{ transform:scale(.94); }
  #navbar{ display:none; padding:7px 14px 0; }
  #navbar button{ border:1px solid var(--line); background:#fff; color:var(--muted); font-weight:700; font-size:13px;
    padding:6px 13px; border-radius:16px; cursor:pointer; }
  #navbar button:hover{ background:#f5f7f9; }
  #acbar{ display:none; gap:7px; padding:6px 12px 0; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  #acbar .ac-chip{ flex:0 0 auto; border:1px solid var(--line); background:#FBF4EA; color:#C4452B; border-radius:15px; padding:7px 12px; font-size:13px; font-weight:700; cursor:pointer; white-space:nowrap; }
  #inputbar{ display:flex; gap:8px; padding:10px 12px; align-items:center; }
  #inputbar input{ flex:1; border:1.5px solid #E7DFD4; border-radius:22px; padding:11px 15px; font-size:15px; outline:none; }
  #inputbar input:focus{ border-color:var(--emerald); }
  #inputbar .send{ width:42px;height:42px;border-radius:50%; border:none; cursor:pointer; font-size:18px; color:#fff;
    background:linear-gradient(135deg,var(--orange),var(--emerald)); flex:0 0 auto; }
  .summary{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:14px 16px; width:100%; max-width:100%; box-sizing:border-box;
    box-shadow:0 6px 22px rgba(20,30,50,.07); }
  .summary h3{ margin:0 0 8px; font-size:16px; }
  .summary ol{ margin:0; padding-left:18px; }
  .summary li{ margin:9px 0; font-size:14px; line-height:1.5; }
  .summary li a{ color:var(--emerald); font-size:12px; text-decoration:none; }
  /* 코스 결과 항목 썸네일(피드·공유와 동일 톤) */
  .summary li .ci{ display:flex; gap:10px; align-items:flex-start; }
  .summary li .ci-thumb,.summary li .ci-ph{ width:46px; height:46px; border-radius:9px; flex:0 0 auto; }
  .summary li .ci-thumb{ object-fit:cover; background:#F3ECE2; }
  .summary li .ci-ph{ display:grid; place-items:center; background:linear-gradient(135deg,#F3ECE2,#EDE4D6); font-size:20px; }
  .summary li .ci-body{ flex:1; min-width:0; }
  .ci-thumb-wrap .ci-tplay,.ci-thumb-wrap .ci-tzoom{ position:absolute; right:2px; bottom:2px; background:rgba(0,0,0,.62); color:#fff; font-size:9px; border-radius:5px; padding:0 3px; line-height:1.5; }
  /* ✅ 우측 상단 저장 토스트 */
  #saveToast{ position:fixed; top:64px; right:14px; z-index:120; background:#C4452B; color:#fff; font-weight:800; font-size:14px; padding:12px 16px; border-radius:13px; box-shadow:0 6px 22px rgba(18,122,99,.4); max-width:78vw; opacity:0; transform:translateY(-10px); transition:opacity .25s,transform .25s; pointer-events:none; }
  #saveToast.on{ opacity:1; transform:translateY(0); }
  .ci-cat{ display:inline-block; font-size:11px; font-weight:700; color:#5b6b8c; background:#eef1f7; border-radius:8px; padding:1px 7px; margin-left:3px; vertical-align:middle; } /* 🏷️ 종류 라벨(밥집·술집·카페) */
  .mini{ font-size:12px; color:var(--sub); margin-top:10px; }
  /* 👤 내 정보 입력 폼(profModal) — 2026-08-17 챗 문답 → 한 화면 폼으로 교체 */
  .pf-sec{margin-bottom:13px}
  .pf-lbl{font-size:12.5px;font-weight:800;color:#555;margin-bottom:6px}
  .pf-in{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:10px;font-family:inherit;font-size:14px;box-sizing:border-box}
  .pf-in:focus{outline:none;border-color:var(--orange)}
  .pf-chips{display:flex;flex-wrap:wrap;gap:6px}
  .pf-c{border:1.5px solid var(--line);background:#fff;border-radius:16px;padding:7px 13px;font:inherit;font-size:13px;font-weight:700;color:#555;cursor:pointer}
  .pf-c.on{background:var(--orange);border-color:var(--orange);color:#fff}
  /* 🏆 내 정보·정복 대시보드(showMyConquest, 06-my.html 목업 반영) — 등급 히어로 카드 + 통계 3분할 + 정복지역/모임(.summary 재사용) */
  .myhero-card{ background:var(--bg); border:1px solid var(--line); border-radius:16px; overflow:hidden; width:100%; max-width:100%; box-sizing:border-box; box-shadow:0 6px 22px rgba(20,30,50,.07); }
  .myhero-top{ background:linear-gradient(135deg,var(--orange),#ff9d6c); color:#fff; padding:16px 18px 18px; }
  .myhero-top .mh-row{ display:flex; align-items:center; gap:11px; }
  .myhero-top .mh-av{ width:46px; height:46px; border-radius:50%; background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; font-size:22px; flex:0 0 auto; }
  .myhero-top .mh-nick{ font-size:16px; font-weight:800; }
  .myhero-top .mh-grade{ display:inline-block; font-size:11px; font-weight:800; background:rgba(255,255,255,.24); border:1px solid rgba(255,255,255,.55); border-radius:100px; padding:3px 10px; margin-top:4px; }
  .myhero-top .mh-prog{ margin-top:14px; }
  .myhero-top .mh-lbl{ display:flex; justify-content:space-between; gap:8px; font-size:11.5px; font-weight:700; opacity:.95; }
  .myhero-top .mh-lbl span:last-child{ flex:0 0 auto; }
  .myhero-top .mh-bar{ height:8px; background:rgba(255,255,255,.28); border-radius:100px; margin-top:6px; overflow:hidden; }
  .myhero-top .mh-fill{ height:100%; background:#fff; border-radius:100px; }
  .mh-stats{ display:flex; gap:8px; padding:14px 14px 4px; }
  .mh-stat{ flex:1; background:#fff; border:1px solid var(--line); border-radius:13px; text-align:center; padding:11px 4px; min-width:0; }
  .mh-stat .mh-v{ font-size:18px; font-weight:800; color:var(--ink); }
  .mh-stat .mh-k{ font-size:10.5px; color:var(--sub); font-weight:700; margin-top:2px; }
  .mh-sec{ padding:12px 14px 2px; }
  .mh-sec h5{ font-size:13px; font-weight:800; margin:0 0 8px; color:var(--ink); }
  .mh-sec .summary li{ margin:7px 0; }
  .mh-regions{ display:flex; flex-wrap:wrap; gap:6px; }
  .mh-rchip{ display:inline-block; font-size:11.5px; font-weight:700; border-radius:100px; padding:5px 11px; background:#FFEDE7; color:#C4452B; white-space:nowrap; }
  .mh-empty{ font-size:12.5px; color:var(--sub); background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px; text-align:center; }
  .myhero-card .mh-menu{ border-top:1px solid var(--line); margin-top:8px; }
  .myhero-card .mh-menu a, .myhero-card .mh-menu button{ display:flex; align-items:center; width:100%; text-align:left; padding:12px 14px; font-size:13.5px; font-weight:700; color:var(--ink); text-decoration:none; background:#fff; border:none; border-bottom:1px solid var(--line); cursor:pointer; font-family:inherit; box-sizing:border-box; }
  .myhero-card .mh-menu a:last-child, .myhero-card .mh-menu button:last-child{ border-bottom:none; }
  .myhero-card .mh-menu .mh-ar{ margin-left:auto; color:#c4cfd4; }
  .coursemap{ width:100%; height:280px; border-radius:12px; margin:10px 0 4px; overflow:hidden; border:1px solid var(--line); }
  .pickmap{ width:100%; height:calc(100dvh - 260px); min-height:320px; max-height:760px; border-radius:12px; margin:8px 0 4px; overflow:hidden; border:1px solid var(--line); } /* 헤더~고정칩 사이에 딱 맞게(핸드폰 fit) */
  .weather{ background:#f4f8fb; border:1px solid var(--line); border-radius:14px; padding:10px 8px; margin:2px 0; max-width:calc(100vw - 24px); box-sizing:border-box; } /* 폰: 7일 스트립이 뷰포트 넘어 잘리던 것 → 폭 제한해 .wstrip(overflow-x:auto)가 스와이프되게(감사 Q4) */
  .weather .wtitle{ font-weight:800; font-size:13px; color:var(--muted); padding:0 4px 8px; }
  .wstrip{ display:flex; gap:6px; overflow-x:auto; }
  .wday{ flex:0 0 auto; width:62px; text-align:center; background:#fff; border:1px solid var(--line); border-radius:10px; padding:7px 2px; }
  .wday.today{ border-color:var(--orange); box-shadow:0 0 0 1.5px var(--orange) inset; }
  .wdow{ font-weight:800; font-size:12px; } .wdate{ font-size:10px; color:var(--muted); }
  .wicon{ font-size:20px; margin:3px 0; } .wtemp{ font-size:12px; } .wtemp b{ color:#e8590c; } .wtemp span{ color:#1c7ed6; }
  .wrain{ font-size:10px; color:#1c7ed6; }
  .timepick{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:14px; max-width:90%; }
  .timepick .trow{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; font-weight:700; font-size:14px; }
  .timepick input[type=time]{ border:1.5px solid #E7DFD4; border-radius:10px; padding:8px 12px; font-size:16px; font-weight:700; }
  .timepick .tok{ width:100%; border:none; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; font-weight:800; font-size:15px; padding:11px; border-radius:12px; cursor:pointer; margin-top:4px; }
  .coursemap .leaflet-container{ background:#EDE8DF; }
  /* 🎭 공연·축제 이벤트 카드 */
  .evcard{ display:flex; gap:11px; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; padding:9px; width:100%; box-sizing:border-box; }
  .evcard .ev-img{ flex:0 0 88px; width:88px; height:118px; border-radius:9px; overflow:hidden; background:#EFE6DA; }
  .evcard .ev-img img{ width:100%; height:100%; object-fit:cover; display:block; }
  .evcard .ev-body{ flex:1; min-width:0; display:flex; flex-direction:column; }
  .evcard .ev-tag{ font-size:11.5px; font-weight:700; color:#b1573a; background:#fff1ea; align-self:flex-start; padding:2px 8px; border-radius:9px; margin-bottom:4px; }
  .evcard .ev-nm{ font-weight:800; font-size:14.5px; line-height:1.3; margin-bottom:4px; }
  .evcard .ev-meta{ font-size:12px; color:var(--sub); line-height:1.5; }
  .evcard .ev-acts{ margin-top:auto; padding-top:8px; display:flex; gap:8px 11px; align-items:center; flex-wrap:wrap; }
  .evcard .ev-keep{ border:none; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; font-weight:800; font-size:12.5px; padding:6px 13px; border-radius:14px; cursor:pointer; }
  .evcard .ev-keep.done{ background:#F6D7CE; color:#C4452B; }
  .evcard .ev-copy{ color:#C4452B; font-weight:700; font-size:12.5px; cursor:pointer; }
  .evcard .ev-link{ color:#1e8e5a; font-weight:700; font-size:12.5px; text-decoration:none; }
  .evcard .ev-map{ color:#C4452B; font-weight:700; font-size:12.5px; cursor:pointer; }
  /* ▶ 큰 영상 모달 */
  #vmodal{ position:fixed; inset:0; background:rgba(0,0,0,.88); display:none; align-items:center; justify-content:center; z-index:80; padding:10px; }
  #vmodal.on{ display:flex; }
  #vmodal .box{ width:96vw; max-width:1200px; }
  #vmodal iframe{ width:100%; aspect-ratio:16/9; border:0; border-radius:12px; display:block; background:#000; }
  #vmodal .x{ position:absolute; top:12px; right:16px; color:#fff; font-size:32px; background:none; border:0; cursor:pointer; line-height:1; }
  #vmodal #vnav{ display:none; align-items:center; justify-content:center; gap:14px; margin-top:12px; }
  #vmodal #vnav .vbtn{ background:#fff; color:#111; border:0; border-radius:999px; padding:10px 18px; font-weight:800; font-size:14px; cursor:pointer; }
  #vmodal #vpos{ color:#fff; font-weight:700; font-size:14px; min-width:54px; text-align:center; }
  #naverModal{ position:fixed; inset:0; background:rgba(0,0,0,.6); display:none; align-items:center; justify-content:center; z-index:78; padding:14px; }
  #naverModal.on{ display:flex; }
  #naverModal .nv-card{ width:100%; max-width:440px; max-height:86vh; overflow-y:auto; background:#fff; border-radius:18px; position:relative; box-shadow:0 12px 40px rgba(0,0,0,.3); }
  #naverModal .nv-x{ position:absolute; top:10px; right:14px; color:#888; font-size:26px; background:none; border:0; cursor:pointer; line-height:1; z-index:2; }
  #naverModal .nv-photo{ width:100%; height:200px; object-fit:cover; display:block; border-radius:18px 18px 0 0; background:#f0f2f5; }
  #naverModal .nv-photo-ph{ width:100%; height:140px; display:flex; align-items:center; justify-content:center; font-size:54px; background:#FBF3EC; border-radius:18px 18px 0 0; }
  #naverModal .nv-body{ padding:16px 18px 18px; }
  #naverModal .nv-name{ font-weight:800; font-size:19px; line-height:1.3; }
  /* 📐 2026-09-07 감사: 네이버 카테고리는 "음식점>한식>육류,고기요리"처럼 계층형으로 길게 오는데
     nowrap만 있고 말줄임이 없어 카드 밖으로 삐져나갔다(390px에서 특히). 최대폭+말줄임으로 가둔다. */
  #naverModal .nv-cat{ font-size:12px; color:#5b6b8c; background:#eef1f7; border-radius:7px; padding:2px 8px; font-weight:700; margin-left:6px; white-space:nowrap; display:inline-block; max-width:60%; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; }
  #naverModal .nv-acts{ display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; }
  #naverModal .nv-btn{ flex:1; min-width:120px; text-align:center; border:1px solid #e2e6ee; background:#fff; color:#222; padding:11px 12px; border-radius:11px; font-weight:700; cursor:pointer; text-decoration:none; font-size:14px; }
  #naverModal .nv-btn.tel{ color:#1ec800; border-color:#cdeccd; }
  #naverModal .nv-blog{ margin-top:14px; background:#f7f8fa; border-left:3px solid #E8503A; border-radius:0 10px 10px 0; padding:10px 12px; font-size:13.5px; color:#3a4458; line-height:1.55; }
  #naverModal .nv-more{ display:inline-block; margin-top:14px; font-size:12.5px; color:#9aa3b2; text-decoration:none; }
  #naverModal .nv-load{ padding:48px 18px; text-align:center; color:#888; font-size:15px; }
  /* 🔘 2026-08-04 사장님 피드백: 지도/주소복사/네이버보기/공유가 밋밋한 텍스트 나열이라 좁은 화면에서 줄바꿈되며
     지저분해 보임 → 칩(pill) 버튼으로. 오류/개선신고는 이 줄에서 빼서 썸네일 우상단 배지로 이동(아래 .rep-badge). */
  .maplink{ margin:8px 0 0; display:flex; flex-wrap:wrap; gap:7px; }
  .maplink span{ white-space:nowrap; display:inline-flex; align-items:center; gap:3px; padding:6px 11px;
    border-radius:20px; background:#F6F1E9; border:1px solid var(--line); font-size:12.5px; font-weight:700; }
  .evcard .b-report{ color:#b06a00; font-weight:700; font-size:11.5px; cursor:pointer; }
  .maplink .b-map{ color:var(--emerald); font-weight:800; font-size:12.5px; cursor:pointer; }
  /* 🚩 장소 카드 오류/개선신고 — 썸네일 우상단 배지(상단 우측 배치 요청). photo/video 배경 어디서나 잘 보이게 반투명 검정. */
  .card .thumb .rep-badge{ position:absolute; top:8px; right:8px; z-index:2; background:rgba(0,0,0,.55); color:#fff;
    font-size:11px; font-weight:700; padding:5px 9px; border-radius:12px; cursor:pointer; white-space:nowrap; }
  .card .thumb .rep-badge:active{ transform:scale(.94); }
  #mapmodal{ position:fixed; inset:0; background:rgba(0,0,0,.8); display:none; align-items:center; justify-content:center; z-index:80; padding:14px; }
  #mapmodal.on{ display:flex; }
  /* 📗 네이버 인라인 임베드 — 대화창 안에 네이버 플레이스를 끼워 보여줌 */
  .naverEmbed{ width:100%; max-width:calc(100vw - 24px); border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#fff; box-sizing:border-box; }
  .naverEmbed .ne-head{ display:flex; align-items:center; gap:8px; padding:8px 11px; font-size:13px; background:#f1faf1; border-bottom:1px solid var(--line); }
  .naverEmbed .ne-head .ne-tab{ color:#1ec800; font-weight:700; font-size:12px; text-decoration:none; white-space:nowrap; }
  .naverEmbed .ne-head .ne-x{ cursor:pointer; font-size:16px; color:#888; padding:0 2px; }
  /* 메뉴 패널만 보이게 크롭: 네이버 PC 지도(왼쪽툴바 ~62px·상단검색바 ~57px·오른쪽 지도)를 잘라낸다. iframe을 크게 띄우고 음수 위치로 끌어와 패널(~375px)만 노출. */
  .naverEmbed .ne-crop{ position:relative; width:100%; max-width:375px; height:540px; overflow:hidden; background:#fff; }
  .naverEmbed .ne-crop iframe{ position:absolute; left:-62px; top:-57px; width:1180px; height:760px; border:0; }
  #mapmodal .box{ width:97vw; max-width:1100px; background:#fff; border-radius:14px; overflow:hidden; }
  #mapmodal .mhead{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:11px 14px; font-weight:800; border-bottom:1px solid var(--line); }
  #mapmodal .mhead .mx{ background:none; border:0; font-size:22px; cursor:pointer; line-height:1; color:#333; }
  #mapmodal .mhead .kakao{ font-size:12px; font-weight:700; color:#E8503A; text-decoration:none; white-space:nowrap; }
  #mapmodal #pmapWrap{ width:100%; height:82vh; }
  /* 🗺️ 전체화면 지도(지도에서 직접찾기) — 대화 카드가 아니라 네모 전체를 지도로 */
  /* 🧭 2026-08-05: 일정 저장 결과 전용 큰 화면 — 인라인 챗의 280px 작은 지도 대신, 큰 지도+순서목록을 스크롤로. */
  #courseResult{ position:fixed; inset:0; z-index:56; background:#fff; display:none; flex-direction:column; }
  #courseResult.on{ display:flex; }
  #courseResult .cr-head{ display:flex; align-items:center; gap:10px; padding:13px 15px; border-bottom:1px solid var(--line); flex:0 0 auto; }
  #courseResult .cr-back{ background:#F3EDE4; border:0; border-radius:20px; padding:8px 13px; font-weight:800; font-size:13.5px; cursor:pointer; color:#555; }
  #courseResult .cr-title{ font-weight:800; font-size:15.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  /* 🥕 2026-09-14 사장님 지시("나는 코스가 저런(지도 탭 바텀시트) 기능으로 되길 원해") — 지도가 화면의 42%를
     고정으로 먹고 목록은 남은 좁은 칸에 갇혀 390×699에서 코스가 2곳밖에 안 보이던 구조를,
     #pickfull/#listView와 완전히 동일한 "지도=배경 + 목록=끌어올리는 바텀시트"로 교체.
     드래그 로직은 새로 짜지 않고 공통 헬퍼 wireSheetDrag()를 세 시트가 같이 쓴다. */
  #courseResult .cr-body{ flex:1 1 auto; min-height:0; position:relative; overflow:hidden; }
  /* 🔴 z-index:0 필수 — 지도 SDK(카카오·Leaflet)는 내부 레이어에 z-index 400~800을 쓴다. 지도가 stacking
     context를 안 만들면 그 내부 레이어가 같은 문맥에서 시트(z-index:60)를 덮어 **시트가 통째로 안 보인다**
     (390px 캡처에서 지도만 찍혀 발견). z-index를 주면 지도의 내부 레이어가 이 문맥 안에 갇힌다. */
  #courseResult .cr-map{ position:absolute; inset:0; width:100%; height:100%; z-index:0; }
  #courseResult .cr-sheet{ touch-action:none; position:absolute; z-index:60; left:0; right:0; bottom:0; background:#fff; display:flex; flex-direction:column; box-shadow:0 -6px 24px rgba(0,0,0,.16); transition:height .26s ease; overflow:hidden; height:62vh; max-height:92vh; border-radius:18px 18px 0 0; }
  #courseResult .cr-sheet.on{ height:92vh; }
  #courseResult .cr-sheet .ps-grip{ flex:0 0 auto; padding:12px 0 8px; cursor:grab; touch-action:none; -webkit-user-select:none; user-select:none; }
  #courseResult .cr-list{ flex:1 1 auto; min-height:0; overflow-y:auto; padding:6px 14px 24px; -webkit-overflow-scrolling:touch; touch-action:none; overscroll-behavior:contain; }
  /* 접힘=JS가 세로 제스처 소유(어디를 잡아도 시트가 끌림) / 펼침(.on)=네이티브 스크롤 복귀 — #lvSheet·#pfSheet와 동일 계약. */
  /* 펼치면 "🗺️ 지도보기" pill이 시트 맨 위에 겹쳐 뜬다(지도가 안 보이는 상태의 유일한 복귀 수단) —
     첫 줄 이름을 가리지 않도록 그만큼 위 여백을 준다(390px 캡처로 겹침 확인 후 추가). */
  #courseResult .cr-sheet.on .cr-list{ touch-action:pan-y; padding-top:48px; }
  /* 🔴 함정: 아래 `.cr-stop.cr-drag{touch-action:pan-y}`는 시트 루트의 touch-action:none보다 구체적이라 이긴다
     — 그대로 두면 접힘 상태에서 줄 위를 잡았을 때 브라우저가 세로를 가져가 시트 드래그가 통째로 죽는다.
     접힘일 때만 none으로 덮고, 펼침일 땐 pan-y(스크롤)를 돌려준다(롱프레스 순서변경은 양쪽 다 살아있음 — 롱프레스가
     성립하는 순간 시트 드래그를 cancel()로 접는다, wireReviewDrag 참고). */
  #courseResult .cr-sheet:not(.on) .cr-stop.cr-drag{ touch-action:none; }
  #courseResult .cr-sheet.on .cr-stop.cr-drag{ touch-action:pan-y; }
  #courseResult .cr-maptoggle{ display:none; align-items:center; gap:6px; position:absolute; left:50%; top:14px; transform:translateX(-50%); z-index:70; background:#232323; color:#fff; border:none; border-radius:24px; padding:11px 22px; font-weight:800; font-size:13.5px; box-shadow:0 6px 18px rgba(0,0,0,.3); cursor:pointer; white-space:nowrap; font-family:inherit; }
  .cr-review-bar{ flex:0 0 auto; display:flex; gap:8px; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:#fff; } /* 시트 안 맨 아래 고정(ps-foot과 같은 자리) */
  .cr-review-bar .cr-more{ flex:0 0 auto; border:1.5px solid var(--line); background:#fff; color:#556; border-radius:12px; padding:0 14px; font-weight:700; font-size:13.5px; cursor:pointer; white-space:nowrap; }
  #crSavedBar.cr-review-bar .cr-more{ flex:1 1 0; padding:0 6px; font-size:12.5px; } /* 버튼 3개(더담기·동선수정·일정보기)라 균등폭+살짝 축소 */
  #crSavedBar.cr-review-bar .cr-confirm{ flex:1.2 1 0; font-size:12.5px; padding:12px 6px; }
  #crEditBtn.on{ background:var(--emerald); color:#fff; border-color:transparent; } /* 동선 수정 중일 때 강조 */
  .cr-review-bar .cr-confirm{ flex:1 1 auto; border:none; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; border-radius:12px; padding:12px; font-weight:800; font-size:14.5px; cursor:pointer; }
  .cr-stop{ display:flex; gap:10px; align-items:flex-start; background:#fff; border:1px solid var(--line); border-radius:14px; padding:11px; margin-bottom:2px; cursor:pointer; }
  /* 🖐️ 리뷰 화면 줄 드래그(2026-08-06) — 🔴 2026-09-14 사장님 지적("밑에 여행 코스를 보려는데 안 내려가네"):
     예전엔 touch-action:none이라 줄 위에서는 **세로 스크롤이 통째로 불가능**했다(카드 사이 좁은 틈에서만 됐다).
     → pan-y로 되돌려 스크롤을 살리고, 순서 변경은 "꾹 눌렀다가 끌기"(롱프레스)로 바꾼다. 모바일 표준 패턴이고
     "줄 아무 데나 잡고 끌면 순서변경"이라는 원래 요구도 그대로 지켜진다. */
  .cr-stop.cr-drag{ touch-action:pan-y; cursor:grab; user-select:none; -webkit-user-select:none; }
  .cr-stop.cr-armed{ background:#FFF8F2; box-shadow:0 0 0 2px var(--coral,#E8694F) inset; } /* 롱프레스 성립 = 이제 끌면 순서가 바뀐다는 신호 */
  .cr-stop.cr-dragging{ opacity:.75; background:#FFF8F2; box-shadow:0 4px 14px rgba(0,0,0,.15); position:relative; z-index:5; }
  .cr-stop .cr-rm{ flex:0 0 auto; align-self:center; border:1px solid var(--line); background:#fff; border-radius:9px; padding:6px 9px; font-size:13px; cursor:pointer; color:#c0392b; }
  .cr-stop:active{ background:#FFF8F2; }
  .cr-stop .cr-num{ flex:0 0 auto; width:26px; height:26px; border-radius:50%; background:var(--coral); color:#fff; font-weight:800; font-size:13px; display:flex; align-items:center; justify-content:center; }
  .cr-stop .ci-thumb,.cr-stop .ci-ph{ width:52px; height:52px; border-radius:10px; flex:0 0 auto; object-fit:cover; background:#F3ECE2; display:flex; align-items:center; justify-content:center; font-size:22px; }
  .cr-drag img{ -webkit-user-drag:none; user-drag:none; } /* PC 마우스로 줄 드래그 시 이미지 기본 드래그가 가로채지 않게(2026-08-06) */
  .cr-stop .ci-thumb-wrap{ flex:0 0 auto; }
  .cr-stop .ci-thumb-wrap .ci-thumb{ display:block; }
  .cr-stop .cr-body{ flex:1 1 auto; min-width:0; }
  .cr-stop .cr-name{ font-weight:800; font-size:14.5px; } .cr-stop .cr-cat{ font-size:12px; color:var(--muted); margin-top:2px; }
  .cr-stop .cr-time{ color:var(--stamp); font-size:12.5px; margin-right:5px; }
  .cr-stop .cr-note{ font-size:12px; color:#8a98a0; margin-top:3px; }
  /* 🗓️ 담은 곳 휴무 경고(T5) */
  .closedWarn{display:flex;flex-wrap:wrap;align-items:center;gap:6px;background:#FFF4E5;color:#9A4B00;border-radius:9px;padding:6px 9px;font-size:13px;font-weight:700;margin-top:4px;line-height:1.4}
  .closedWarn .cwT{flex:1 1 150px;min-width:0}
  .closedWarn .cwBtn{flex:0 0 auto;border:1px solid #E7B77A;background:#fff;color:#9A4B00;border-radius:8px;padding:5px 9px;font:inherit;font-size:12.5px;font-weight:800;cursor:pointer}
  .cr-stop .cr-copy{ color:#C4452B; font-weight:700; cursor:pointer; white-space:nowrap; }
  #courseResult .cr-share{ margin-left:auto; background:#FFF3EE; border:1px solid #F6D7CE; color:var(--stamp); border-radius:18px; padding:7px 13px; font-weight:800; font-size:13px; cursor:pointer; }
  #courseResult .cr-from{ margin-left:auto; background:#EAF2F0; border:1px solid #CDE3DC; color:var(--emerald); border-radius:18px; padding:7px 13px; font-weight:800; font-size:13px; cursor:pointer; white-space:nowrap; } /* 📍 리뷰 화면에서 내 위치=출발지 설정(2026-08-06) */
  .cr-leg{ display:flex; align-items:center; gap:6px; padding:8px 0 8px 13px; margin-left:13px; border-left:2px dashed var(--line); font-size:12.5px; color:#8a98a0; font-weight:700; }
  /* 🎯 원탭 코스(2026-09-12, 02-product/one-tap-course-design.md) — 홈 "AI 맞춤 코스 짜기" 탭 한 번에 코스 3장.
     풀페이지(헤더·하단탭 위를 통째로 덮음, courseResult(56)보다 아래라 [이 코스로 갈래]가 그 위에 뜸).
     내용 DOM은 첫 클릭 때 채움(부팅 비용 0). 글자 하한 12px·회색은 --sub/--muted(AA) — 지침서 08 §7. */
  #oneTapView{ position:fixed; inset:0; z-index:54; background:var(--bg); display:none; flex-direction:column; }
  #oneTapView.on{ display:flex; }
  #oneTapView .ot-head{ display:flex; align-items:center; gap:10px; padding:11px 14px; border-bottom:1px solid var(--line); background:#fff; flex:0 0 auto; }
  #oneTapView .ot-back{ background:#F3EDE4; border:0; border-radius:20px; padding:8px 13px; font-weight:800; font-size:13.5px; cursor:pointer; color:#555; flex:0 0 auto; font-family:inherit; }
  #oneTapView .ot-ttl{ flex:1 1 auto; min-width:0; }
  #oneTapView .ot-t{ font-weight:800; font-size:16px; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #oneTapView .ot-sub{ font-size:12.5px; color:var(--sub); font-weight:700; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #oneTapView .ot-with{ display:none; flex:0 0 auto; font-size:12.5px; font-weight:800; color:#C4452B; background:#FFF3EE; padding:7px 14px; border-bottom:1px solid var(--line); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } /* 👫 "민지와 같이 갈 코스" 얇은 줄(friends.html 같이 갈래? 진입) */
  #oneTapView .ot-with.on{ display:block; }
  #oneTapView .ot-body{ flex:1 1 auto; min-height:0; overflow-y:auto; padding:12px 14px calc(24px + env(safe-area-inset-bottom)); -webkit-overflow-scrolling:touch; }
  #oneTapView .ot-note{ font-size:13px; font-weight:700; color:#7A4E12; background:#FFF6DF; border:1px solid #F5E3B8; border-radius:12px; padding:9px 12px; margin-bottom:10px; line-height:1.45; word-break:keep-all; }
  #oneTapView .ot-chips{ display:flex; gap:7px; margin:0 0 12px; overflow-x:auto; scrollbar-width:none; }
  #oneTapView .ot-chips::-webkit-scrollbar{ display:none; }
  #oneTapView .ot-chip{ flex:0 0 auto; border:1.5px solid var(--line); background:#fff; color:var(--ink); border-radius:20px; padding:8px 13px; font-weight:800; font-size:13px; cursor:pointer; font-family:inherit; white-space:nowrap; min-height:34px; }
  #oneTapView .ot-chip:active{ background:#FFF4EF; }
  #oneTapView .ot-card{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:14px 13px; margin-bottom:12px; box-shadow:0 2px 8px rgba(38,50,75,.05); }
  #oneTapView .ot-ct{ font-weight:800; font-size:16px; color:var(--ink); line-height:1.3; word-break:keep-all; }
  #oneTapView .ot-cr{ font-size:12.5px; color:var(--muted); font-weight:700; margin-top:4px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:keep-all; }
  #oneTapView .ot-strip{ display:flex; gap:8px; overflow-x:auto; margin:11px -13px 0; padding:0 13px 4px; scrollbar-width:none; }
  #oneTapView .ot-strip::-webkit-scrollbar{ display:none; }
  #oneTapView .ot-stop{ flex:0 0 96px; width:96px; }
  #oneTapView .ot-th{ width:96px; height:72px; border-radius:11px; background:#F3ECE2; object-fit:cover; display:flex; align-items:center; justify-content:center; font-size:26px; overflow:hidden; }
  #oneTapView .ot-th img{ width:100%; height:100%; object-fit:cover; display:block; }
  #oneTapView .ot-sn{ font-size:12.5px; font-weight:800; color:var(--ink); margin-top:5px; line-height:1.3; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:keep-all; }
  #oneTapView .ot-st{ font-size:12px; font-weight:700; color:var(--stamp); margin-top:2px; white-space:nowrap; }
  #oneTapView .ot-sum{ font-size:12.5px; color:var(--sub); font-weight:700; margin-top:9px; }
  #oneTapView .ot-meal{ font-size:13px; color:#7A4E12; background:#FFF8EC; border-radius:10px; padding:7px 10px; margin-top:10px; line-height:1.45; word-break:keep-all; }
  #oneTapView .ot-nbh{ font-weight:800; font-size:15px; color:var(--ink); margin:6px 0 8px; }
  #oneTapView .ot-nb{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:12px 13px; margin-bottom:10px; }
  #oneTapView .ot-nbt{ font-size:15px; color:var(--ink); display:flex; align-items:center; gap:8px; }
  #oneTapView .ot-nbd{ font-size:12.5px; color:var(--sub); font-weight:700; }
  #oneTapView .ot-nbp{ font-size:12.5px; color:var(--muted); font-weight:700; margin-top:4px; line-height:1.4; word-break:keep-all; }
  #oneTapView .ot-nbgo{ margin-top:9px; border:1.5px solid var(--line); background:#fff; color:var(--ink); border-radius:11px; padding:9px 13px; font-weight:800; font-size:13px; cursor:pointer; font-family:inherit; min-height:38px; }
  #oneTapView .ot-go{ display:block; width:100%; margin-top:10px; border:none; background:linear-gradient(135deg,var(--coral),var(--stamp)); color:#fff; border-radius:12px; padding:13px; font-weight:800; font-size:14.5px; cursor:pointer; font-family:inherit; min-height:44px; }
  #oneTapView .ot-go:active{ opacity:.85; }
  /* 🎲 원탭 2차(2026-09-13) — 카드마다 [🔄 다른 코스 볼래?][👎 별로예요] 한 줄(390px에서 두 버튼 나란히, 글자 13px·터치 40px). 3회 뒤 세부 조정 안내. */
  #oneTapView .ot-acts{ display:flex; gap:8px; margin-top:8px; }
  #oneTapView .ot-alt, #oneTapView .ot-down{ flex:1 1 0; min-width:0; border:1.5px solid var(--line); background:#fff; color:var(--ink); border-radius:11px; padding:10px 6px; font-weight:800; font-size:13px; cursor:pointer; font-family:inherit; min-height:40px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  #oneTapView .ot-down{ color:var(--sub); }
  #oneTapView .ot-alt:active, #oneTapView .ot-down:active{ background:#FFF4EF; }
  #oneTapView .ot-alt:disabled, #oneTapView .ot-down:disabled{ opacity:.45; cursor:default; }
  #oneTapView .ot-hint{ font-size:12.5px; color:var(--sub); font-weight:700; margin-top:8px; line-height:1.45; word-break:keep-all; }
  #oneTapView .ot-hint button{ background:none; border:0; padding:0; font:inherit; font-weight:800; color:var(--coral); text-decoration:underline; cursor:pointer; }
  /* 🏆 이번 주 1위 카드 — 금색 테두리·담음/다녀감/주인 닉 한 줄·[공유 페이지 보기] */
  #oneTapView .ot-card.top{ border:2px solid #D4A017; background:linear-gradient(180deg,#FFFBEA 0%,#fff 62%); box-shadow:0 2px 12px rgba(212,160,23,.18); }
  #oneTapView .ot-topmeta{ font-size:12.5px; color:#7A4E12; font-weight:800; margin-top:5px; line-height:1.45; word-break:keep-all; }
  #oneTapView .ot-share{ display:block; width:100%; box-sizing:border-box; margin-top:8px; border:1.5px solid #E5C877; background:#fff; color:#7A4E12; border-radius:12px; padding:11px; font-weight:800; font-size:13.5px; cursor:pointer; font-family:inherit; min-height:40px; text-align:center; text-decoration:none; }
  #oneTapView .ot-fine{ display:block; text-align:center; font-size:13px; font-weight:700; color:var(--sub); text-decoration:underline; padding:10px 0 4px; cursor:pointer; background:none; border:0; width:100%; font-family:inherit; }
  #oneTapView .ot-fail{ text-align:center; font-size:14px; font-weight:700; color:#C4452B; padding:28px 12px; line-height:1.5; word-break:keep-all; }
  #oneTapView .ot-retry{ margin-top:12px; border:1.5px solid var(--line); background:#fff; border-radius:12px; padding:10px 18px; font-weight:800; font-size:13.5px; cursor:pointer; font-family:inherit; color:var(--ink); }
  #oneTapView .ot-sk{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:14px 13px; margin-bottom:12px; }
  #oneTapView .ot-sk .b{ background:linear-gradient(90deg,#F1EAE0 25%,#FAF5EE 50%,#F1EAE0 75%); background-size:200% 100%; animation:otSk 1.2s linear infinite; border-radius:8px; height:14px; margin-bottom:8px; }
  #oneTapView .ot-sk .b.t{ height:18px; width:62%; } #oneTapView .ot-sk .b.r{ width:88%; }
  #oneTapView .ot-sk .row{ display:flex; gap:8px; margin:11px 0 4px; } #oneTapView .ot-sk .row .b{ width:96px; height:72px; border-radius:11px; margin:0; flex:0 0 auto; }
  #oneTapView .ot-sk .b.btn{ height:44px; margin-top:12px; border-radius:12px; margin-bottom:0; }
  @keyframes otSk{ 0%{ background-position:200% 0; } 100%{ background-position:-200% 0; } }
  @media (prefers-reduced-motion:reduce){ #oneTapView .ot-sk .b{ animation:none; } }
  #pickfull{ position:fixed; inset:0; z-index:55; background:#fff; display:none; flex-direction:column; }
  #pickfull.on{ display:flex; }
  #pickfull .pf-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:13px 15px; border-bottom:1px solid var(--line); font-weight:800; font-size:15.5px; flex:0 0 auto; }
  #pickfull .pf-head .pf-x{ background:#F3EDE4; border:0; width:32px; height:32px; border-radius:50%; font-size:16px; cursor:pointer; line-height:1; color:#555; flex:0 0 auto; }
  /* 📍 제보 = 헤더의 작은 원형 아이콘 버튼(2026-08-25: 사장님 지적 "제보·목록·일정짜기 바가 화면을
     너무 많이 차지" — 목록·일정짜기는 이미 헤더에 있던 것과 중복이라 그 둘+하단 바 전체를 삭제하고,
     유일하게 다른 진입로가 없던 제보만 여기로 옮김) */
  #pickfull .pf-head .pf-submit{ background:#FFF0E9; border:0; width:32px; height:32px; border-radius:50%; font-size:15px; cursor:pointer; line-height:1; color:var(--orange); flex:0 0 auto; }
  #pickfull .pf-head .pf-region{ flex:0 0 auto; border:1.5px solid #d7dde4; border-radius:10px; padding:6px 6px; font-size:14px; font-weight:800; color:#1c2330; background:#fff; max-width:108px; }
  #pickfull .pf-head .pf-count{ flex:0 1 auto; font-size:12px; color:#8a98a0; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  #pickfull .pf-head .pf-head-sp{ flex:1 1 auto; }
  #pickfull .pf-head .pf-plan{ flex:0 0 auto; border:none; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; border-radius:11px; padding:8px 11px; font-weight:800; font-size:13px; cursor:pointer; white-space:nowrap; box-shadow:0 2px 8px rgba(255,107,53,.28); }
  #pickfull .pf-head .pf-plan b{ font-size:13.5px; }
  #pickfull #pfMap{ flex:1 1 auto; min-height:0; width:100%; position:relative; } /* 📍 제보 중앙핀(absolute) 기준 컨테이너 */
  /* 🅰️ 큰 분류(놀곳/먹을곳/기타) — 지도 좌상단 떠 있는 세그먼트 컨트롤(한 묶음·크기 통일) */
  #pickfull .pf-groups{ position:absolute; top:52px; left:10px; z-index:6; display:inline-flex; gap:3px; padding:4px; max-width:calc(100% - 20px); overflow:hidden; background:rgba(255,255,255,.97); border-radius:15px; box-shadow:0 5px 18px rgba(20,30,50,.22); }
  #pickfull .pf-groups:empty{ display:none; }
  /* 🌦️ 지도 위 날씨(우상단) */
  #pickfull .pf-weather{ position:absolute; top:52px; right:10px; z-index:6; display:flex; gap:5px; background:rgba(255,255,255,.97); border-radius:13px; box-shadow:0 5px 18px rgba(20,30,50,.2); padding:4px 7px; }
  #pickfull .pf-weather:empty{ display:none; }
  #pickfull .pf-weather .pw-d{ text-align:center; min-width:34px; font-size:10px; color:#5b6470; line-height:1.15; }
  #pickfull .pf-weather .pw-d .pw-ic{ font-size:15px; }
  #pickfull .pf-weather .pw-d b{ color:#1c2330; font-size:11px; }
  #pickfull .pf-weather .pw-d .pw-rain{ color:#2b8ad8; }
  #pickfull .pf-weather .pw-d.pw-today{ background:#eef6ff; border-radius:8px; }
  #pickfull .pf-groups .pf-grp-btn{ flex:0 0 auto; border:0; background:transparent; color:#5b6470; border-radius:11px; padding:8px 13px; font-size:13.5px; font-weight:800; cursor:pointer; white-space:nowrap; }
  #pickfull .pf-groups .pf-grp-btn.on{ background:#23272e; color:#fff; box-shadow:0 2px 7px rgba(20,30,50,.28); }
  /* 🥕 우측 플로팅 버튼(찜/집/내위치) — 당근 동네지도 벤치마킹(2026-08-26). 지도가 항상 위에 보이고
     아래 시트가 항시 살짝 열려있는 레이아웃으로 바뀌면서, 시트가 가리지 않는 그 여백에 떠 있는다. */
  #pickfull .pf-fab-col{ position:absolute; right:10px; bottom:calc(40vh + 12px); z-index:6; display:flex; flex-direction:column; gap:9px; }
  #pickfull .pf-fab{ width:42px; height:42px; border-radius:50%; border:none; background:rgba(255,255,255,.97); box-shadow:0 3px 10px rgba(20,30,50,.24); font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; }
  @media (min-width:760px){ #pickfull .pf-fab-col{ bottom:14px; } }
  /* 칩 줄(세부종류=.pf-subs) — 행 고정(지도만 줄어듦)·세로 안 잘림(overflow-y 숨김)·스크롤바 감춤 */
  /* 🔴 2026-08-27 실기기 지적("국밥한식,고깃집,횟집,해산물만 있게 보여") — 가로 스크롤 줄인데 더
     있다는 표시가 전혀 없어 잘려 보였다. 오른쪽 끝을 흐리게 마스킹해 "더 있다"는 신호를 준다. */
  #pickfull .pf-subs{ display:flex; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; -webkit-overflow-scrolling:touch; flex:0 0 auto;
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 28px), transparent); mask-image:linear-gradient(to right, #000 calc(100% - 28px), transparent); }
  /* 🥕 당근처럼 검색창을 지도 위에 띄운다(2026-08-26) — 예전엔 지도 아래 별도 줄이라 지도가 그만큼 좁았다.
     pf-groups/pf-weather(top:52px)와 안 겹치게 그 아래 줄에 둔다. */
    /* 🔴 2026-09-10: 390px 실측에서 검색줄이 오른쪽 날씨 카드와 겹쳐 [검색] 버튼이 날씨 위에 올라탔다.
     날씨(top:52 + 높이 약 61 = 113)의 아래로 내린다. 116px는 여유가 3px뿐이라 강수확률 줄이
     생기면 다시 겹쳐서 124px로(여유 11px). 날씨 카드 높이를 바꾸면 이 값도 같이 재측정할 것. */
#pickfull .pf-search{ position:absolute; top:124px; left:10px; right:10px; z-index:6; display:flex; gap:6px; padding:0; border-top:none; }
  #pickfull .pf-search input{ flex:1; min-width:0; border:none; border-radius:22px; padding:11px 16px; font-size:14px; background:rgba(255,255,255,.97); box-shadow:0 5px 18px rgba(20,30,50,.18); }
  #pickfull .pf-search button{ flex:0 0 auto; border:none; background:#2b2f36; color:#fff; border-radius:22px; padding:11px 16px; font-weight:800; font-size:13px; cursor:pointer; box-shadow:0 5px 18px rgba(20,30,50,.18); }
  #pickfull .pf-clarify{ display:flex; align-items:center; gap:7px; padding:8px 12px; border-top:1px solid var(--line); flex:0 0 auto; flex-wrap:wrap; background:#fff8ec; }
  #pickfull .pf-clarify b{ font-size:13px; font-weight:800; color:#a05a00; }
  #pickfull .pf-clarify button{ border:1.5px solid #f0b429; background:#fff; color:#a05a00; border-radius:20px; padding:6px 13px; font-weight:800; font-size:13px; cursor:pointer; }
  #pickfull .pf-clarify button:hover{ background:#fff3e0; }
  #pickfull .pf-subs::-webkit-scrollbar{ display:none; }
  /* 🥕 종류 선택 = 당근 동네지도처럼 지도 아래가 아니라 시트 안 아이콘 그리드로(2026-08-26, .pf-cats를
     지도 밖 시트(.pf-sheet) 안으로 옮겨 렌더 — renderPfCats()가 그리는 대상만 바뀌고 클릭 로직은 그대로). */
  #pickfull .pf-sheet .pf-cats{ display:grid; grid-template-columns:repeat(5,1fr); gap:10px 2px; padding:10px 10px 4px; flex:0 0 auto; }
  #pickfull .pf-sheet .pf-cats:empty{ display:none; }
  #pickfull .pf-sheet .pf-cats .pf-catcell{ box-sizing:border-box; display:flex; flex-direction:column; align-items:center; gap:5px; border:none; background:none; padding:4px 2px; border-radius:12px; cursor:pointer; }
  #pickfull .pf-sheet .pf-cats .pf-catcell .e{ width:50px; height:50px; border-radius:50%; background:transparent; font-size:24px; display:flex; align-items:center; justify-content:center; } /* 2026-08-26: 당근처럼 평소엔 배경 없이 플랫, 선택시에만 원형 강조(.on) */
  #pickfull .pf-sheet .pf-cats .pf-catcell.on .e{ background:linear-gradient(135deg,var(--orange),var(--emerald)); }
  #pickfull .pf-sheet .pf-cats .pf-catcell .l{ font-size:11px; font-weight:700; color:#3a4250; white-space:nowrap; }
  #pickfull .pf-sheet .pf-cats .pf-catcell.on .l{ color:var(--orange); font-weight:800; }
  #pickfull .pf-subs{ gap:7px; padding:0 13px 11px; }
  #pickfull .pf-subs:empty{ display:none; }
  #pickfull .pf-subs .pf-sub{ box-sizing:border-box; flex:0 0 auto; border:1px solid transparent; background:#F1EBE2; color:#5b6470; border-radius:16px; padding:7px 13px; font-size:12.5px; font-weight:600; cursor:pointer; white-space:nowrap; }
  #pickfull .pf-subs .pf-sub.on{ background:#23272e; color:#fff; }
  /* 출처 뱃지 색 — 유튜브(빨강·기본 .badge) / 네이버(초록) / 다음(카카오 노랑) */
  .card .badge.src-naver{ background:#eafaf0; color:#119a4e; }
  .card .badge.src-daum{ background:#fff7e0; color:#b07a00; }
  /* 📍 제보 핀 모드(사장님 2026-08-24 지적: "지도가 너무 좁아") — 지도만 남기고 카테고리·검색
     전부 숨겨서 #pfMap(flex:1)이 그만큼 넓게 자란다. 지도 위 오버레이(pf-groups·pf-weather)는
     absolute라 높이엔 영향 없지만 핀 찍는 동안 의미가 없어 같이 숨긴다.
     2026-08-25: 하단 [담음/제보/목록/일정짜기] 큰 바(.pf-foot) 자체를 삭제함(사장님: "무식하게 큰
     화면을 차지") — 목록·일정짜기는 헤더에 이미 있던 것과 중복이었고, 제보만 헤더 원형 아이콘(.pf-submit)
     으로 옮겨서 지도가 핀 모드가 아닐 때도 항상 넓게 보인다. */
  #pickfull.pinMode .pf-groups, #pickfull.pinMode .pf-weather, #pickfull.pinMode .pf-cats,
  #pickfull.pinMode .pf-subs, #pickfull.pinMode .pf-search, #pickfull.pinMode .pf-clarify,
  #pickfull.pinMode .pf-sheet, #pickfull.pinMode .pf-fab-col, #pickfull.pinMode .pf-maptoggle{ display:none !important; } /* 핀 모드는 시트도 접어 지도 전체를 준다(2026-08-26 — 시트가 상시노출로 바뀌며 추가) */
  /* 🥕 당근 동네지도 벤치마킹(2026-08-26) — 지도는 항상 위에 전부 보이고, 시트는 늘 하단에 살짝
     열려있다(peek, 40vh)가 탭/펼치면 82dvh까지 커진다. 예전엔 display:none으로 완전히 숨겼다가 리스트를
     열 때만 등장했는데, 그러면 지도 아래 아무것도 안 보이는 당근과 다른 모습이었다. */
  #pickfull .pf-sheet{ touch-action:none; position:absolute; z-index:60; background:#fff; display:flex; flex-direction:column; box-shadow:0 -6px 24px rgba(0,0,0,.16); transition:height .26s ease; overflow:hidden; left:0; right:0; bottom:0; height:40vh; max-height:94dvh; border-radius:18px 18px 0 0; }
  #pickfull .pf-sheet:empty{ display:none; } /* 첫 렌더 전(장소 아직 없음)에는 접힘 */
  /* 🔴 2026-08-26 실기기(adb) 조작 확인: 당근은 끝까지 끌면 지도가 아예 안 보일 만큼(거의 풀스크린)
     커지고, 그 자리에 "지도보기" 복귀 pill(#pfToggleBtn)이 뜬다 — 82dvh(지도가 슬쩍 보임)는 추측으로
     짐작한 값이었고 실제와 달랐다. */
  #pickfull .pf-sheet.on{ height:94dvh; }
  #pickfull .pf-sheet .ps-grip{ flex:0 0 auto; padding:14px 0 10px; cursor:grab; touch-action:none; -webkit-user-select:none; user-select:none; }
  #pickfull .pf-sheet .ps-grip::before, #listView .lv-sheet .ps-grip::before, #courseResult .cr-sheet .ps-grip::before{ content:''; display:block; width:52px; height:5px; margin:0 auto; border-radius:3px;
    background-image:repeating-linear-gradient(to right,#aab2bd 0 7px,transparent 7px 11px); } /* 🥕 2026-08-26: 밋밋한 회색 막대라 위아래로 끌 수 있다는 게 안 보인다는 지적 — 점선(끌 수 있음 표시)으로 */
  /* 🔴 2026-08-26 실기기 재발견: 하단(bottom)에 두면 스크롤된 피드의 재생 중인 유튜브 iframe이
     z-index와 무관하게 하드웨어 오버레이로 이 pill 위에 그려져 탭이 영상으로 새 버렸다(실측 확인).
     비디오·목록이 절대 스크롤해 올 수 없는 그립·헤더 구역(상단)에 고정해 원천 차단. */
  #pickfull .pf-maptoggle{ display:none; align-items:center; gap:6px; position:absolute; left:50%; top:58px; transform:translateX(-50%); z-index:70; background:#232323; color:#fff; border:none; border-radius:24px; padding:11px 22px; font-weight:800; font-size:13.5px; box-shadow:0 6px 18px rgba(0,0,0,.3); cursor:pointer; white-space:nowrap; }
  @media (min-width:760px){ #pickfull .pf-sheet{ display:none; left:auto; top:0; right:0; bottom:auto; height:100%; max-height:100%; width:380px; border-radius:0; box-shadow:-6px 0 24px rgba(0,0,0,.14); } #pickfull .pf-sheet.on{ display:flex; } #pickfull .pf-maptoggle{ display:none !important; } }
  #pickfull .pf-sheet .ps-head{ display:flex; align-items:center; gap:8px; padding:11px 14px; border-bottom:1px solid var(--line); flex:0 0 auto; touch-action:none; }
  #pickfull .pf-sheet .ps-title{ font-weight:800; font-size:16.5px; flex:1; min-width:0; }
  #pickfull .pf-sheet .ps-x{ background:none; border:0; font-size:21px; cursor:pointer; color:#333; white-space:nowrap; }
  #pickfull .pf-sheet .ps-cartn{ flex:0 0 auto; font-size:12.5px; font-weight:800; color:var(--orange); background:#fff3ea; border-radius:13px; padding:5px 10px; cursor:pointer; white-space:nowrap; }
  /* ↕️ 목록 정렬 pill(추천순·가까운순·평점순) — 배민 정렬줄 벤치마킹(지침서 06 §D4), 기존 .pf-sub 색감 재사용 */
  #pickfull .pf-sheet .ps-sort{ display:flex; gap:6px; padding:8px 14px; border-bottom:1px solid var(--line); flex:0 0 auto; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
  #pickfull .pf-sheet .ps-sort::-webkit-scrollbar{ display:none; }
  #pickfull .pf-sheet .ps-sort:empty{ display:none; }
  #pickfull .pf-sheet .ps-sort button{ flex:0 0 auto; box-sizing:border-box; border:1px solid transparent; background:#F1EBE2; color:#5b6470; border-radius:16px; padding:6px 12px; font-size:12.5px; font-weight:700; cursor:pointer; white-space:nowrap; }
  #pickfull .pf-sheet .ps-sort button.on{ background:#23272e; color:#fff; }
  #pickfull .pf-sheet .ps-body{ overflow-y:auto; padding:8px 12px; -webkit-overflow-scrolling:touch; flex:1 1 auto; touch-action:none; overscroll-behavior:contain; }
  /* 🥕 2026-09-13 — #listView .lvBody와 동일한 이유(접힘=JS가 세로 소유 / 펼침=네이티브 스크롤 복귀). */
  /* 🔴 2026-09-14 — #listView와 같은 사고(가로 선반 위에서 세로 스크롤이 막힘). 펼침은 브라우저에 맡긴다. */
  #pickfull .pf-sheet:not(.on) .pf-subs, #pickfull .pf-sheet:not(.on) .ps-sort,
  #pickfull .pf-sheet:not(.on) .ps-body .flist-shelf, #pickfull .pf-sheet:not(.on) .ps-body .shRow{ touch-action:pan-x; }
  #pickfull .pf-sheet.on, #pickfull .pf-sheet.on *{ touch-action:auto; }
  #pickfull .pf-sheet.on .ps-grip, #pickfull .pf-sheet.on .ps-head{ touch-action:none; }
  /* 🥕 2026-08-28 사장님 요청: 리스트 쭉 내리면 우측에 맨위로/원위치 토글 버튼(가려짐 방지로 ps-foot 위에 띄움) */
  #pickfull .pf-sheet .ps-totop{ position:absolute; right:14px; bottom:84px; z-index:8; width:40px; height:40px; border-radius:50%; border:none; background:#232323; color:#fff; font-size:17px; display:none; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(0,0,0,.28); cursor:pointer; }
  #pickfull .pf-sheet .ps-foot{ flex:0 0 auto; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); }
  #pickfull .pf-sheet .ps-add-all{ width:100%; border:none; border-radius:12px; padding:15px; font-weight:800; font-size:16.5px; cursor:pointer; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; }
  #pickfull .pf-sheet .ps-add-all:disabled{ background:#cfd6de; cursor:default; color:#fff; }
  .ps-item{ display:flex; gap:12px; align-items:center; width:100%; border:1px solid var(--line); background:#fff; border-radius:12px; padding:10px; margin-bottom:9px; box-sizing:border-box; }
  .ps-item .ps-th,.ps-item .ps-ph{ width:84px; height:84px; border-radius:11px; flex:0 0 auto; object-fit:cover; background:#F3ECE2; cursor:pointer; }
  .ps-item .ps-ph{ display:grid; place-items:center; font-size:34px; background:linear-gradient(135deg,#F3ECE2,#EDE4D6); }
  .ps-item .ps-info{ flex:1; min-width:0; cursor:pointer; }
  .ps-item .ps-nm{ font-weight:800; font-size:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ps-item .ps-meta{ font-size:13px; color:var(--sub); margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ps-item .ps-chk{ flex:0 0 auto; width:38px; height:38px; border-radius:9px; border:2px solid #cfd6de; background:#fff; cursor:pointer; display:grid; place-items:center; font-size:20px; color:transparent; }
  .ps-item .ps-chk.on{ background:linear-gradient(135deg,var(--orange),var(--emerald)); border-color:transparent; color:#fff; }
  /* 큰 카드 목록(쭈루루 스크롤) */
  .ps-sectitle{ font-size:12.5px; font-weight:800; color:#8a98a0; padding:14px 2px 8px; border-top:1px solid var(--line); margin-top:4px; }
  .ps-card{ border:1px solid var(--line); background:#fff; border-radius:14px; overflow:hidden; margin-bottom:13px; box-shadow:0 1px 4px rgba(20,40,80,.05); }
  .ps-card-media{ position:relative; width:100%; height:185px; background:#000; cursor:pointer; }
  .ps-card-media img{ width:100%; height:100%; object-fit:cover; }
  .ps-card-media.ph{ display:grid; place-items:center; font-size:56px; background:linear-gradient(135deg,#F3ECE2,#EDE4D6); cursor:default; }
  /* 📷 사진 캐러셀(영상 없는 곳·네이버 이미지) — ◀▶ 넘기기 */
  .pcar{ position:relative; width:100%; overflow:hidden; background:linear-gradient(135deg,#F3ECE2,#EDE4D6); display:grid; place-items:center; }
  .pcar img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; display:block; } /* 잘림·확대 없이 비율 맞게 */
  .pcar .pcar-ph{ font-size:54px; line-height:1; padding:28px 0; }
  .pcar-nav{ position:absolute; top:50%; transform:translateY(-50%); width:30px; height:30px; border-radius:50%; border:none; background:rgba(0,0,0,.45); color:#fff; font-size:15px; cursor:pointer; display:grid; place-items:center; z-index:2; }
  .pcar-nav:active{ background:rgba(0,0,0,.7); }
  .pcar-prev{ left:7px; } .pcar-next{ right:7px; }
  .pcar-ct{ position:absolute; right:8px; bottom:8px; background:rgba(0,0,0,.62); color:#fff; font-size:12px; font-weight:700; padding:3px 9px; border-radius:10px; z-index:2; }
  .ps-card-play{ position:absolute; inset:0; display:grid; place-items:center; color:#fff; font-size:42px; text-shadow:0 1px 8px rgba(0,0,0,.6); pointer-events:none; }
  .ps-card-vn{ position:absolute; right:9px; bottom:9px; background:rgba(0,0,0,.66); color:#fff; font-size:12px; padding:3px 9px; border-radius:10px; font-weight:700; }
  .ps-card-body{ padding:11px 13px 13px; }
  .ps-card-nm{ font-weight:800; font-size:18px; line-height:1.3; }
  .ps-card-addr{ font-size:13.5px; color:var(--sub); margin-top:5px; }
  .ps-card-why{ font-size:14px; color:#3a4458; margin-top:8px; background:#FBF3EC; border-left:3px solid var(--emerald); border-radius:0 9px 9px 0; padding:8px 11px; }
  .ps-card-chk{ width:100%; margin-top:11px; border:2px solid #cfd6de; background:#fff; border-radius:11px; padding:12px; font-weight:800; font-size:15.5px; cursor:pointer; color:#5b6b8c; }
  .ps-card-chk.on{ border-color:transparent; background:linear-gradient(135deg,var(--orange),var(--emerald)); color:#fff; }
  .ps-card-chk:disabled{ background:#eef3f3; border-color:transparent; color:#0d8f63; cursor:default; }
  .ps-card-links{ display:flex; gap:14px; margin-top:9px; }
  .ps-card-links .ps-card-lk{ font-size:13px; font-weight:700; cursor:pointer; color:#C4452B; text-decoration:none; }
  .ps-card-rep{ margin-top:9px; text-align:center; font-size:12px; color:#b06a00; font-weight:700; cursor:pointer; }
  /* 지도 가까이서 마커 위 가게 이름표 */
  .mlabel{ background:#fff; border:1.5px solid #2b2f36; border-radius:8px; padding:1px 6px; font-size:10.5px; font-weight:800; color:#1c2330; white-space:nowrap; box-shadow:0 1px 5px rgba(0,0,0,.3); pointer-events:none; max-width:130px; overflow:hidden; text-overflow:ellipsis; }
  .pick-toast{ position:fixed; left:50%; bottom:108px; transform:translateX(-50%); background:rgba(20,25,35,.93); color:#fff; padding:10px 17px; border-radius:22px; font-size:14px; font-weight:800; z-index:90; opacity:0; transition:opacity .2s; pointer-events:none; box-shadow:0 4px 16px rgba(0,0,0,.34); }
  .pick-toast.on{ opacity:1; }
  .pf-sheet .psd .psd-media{ position:relative; width:100%; height:230px; border-radius:11px; overflow:hidden; background:#000; margin-bottom:12px; cursor:pointer; }
  .pf-sheet .psd .psd-media img{ width:100%; height:100%; object-fit:cover; }
  .pf-sheet .psd .psd-media.psd-ph{ display:grid; place-items:center; font-size:54px; background:linear-gradient(135deg,#F3ECE2,#EDE4D6); }
  /* 🏛️ 옛 .psd-credit(상세뷰 전용)은 전 화면 공통 .imgCredit으로 통합됨(2026-09-13). 캐시된 옛 마크업 대비 셀렉터만 남겨 둔다. */
  .pf-sheet .psd .psd-media .psd-credit{ position:absolute; right:6px; bottom:6px; background:rgba(0,0,0,.45); color:#fff; font-size:10px; padding:2px 7px; border-radius:8px; pointer-events:none; }
  .pf-sheet .psd .psd-play{ position:absolute; inset:0; display:grid; place-items:center; color:#fff; font-size:30px; text-shadow:0 1px 6px rgba(0,0,0,.5); pointer-events:none; }
  .pf-sheet .psd .psd-vn{ position:absolute; right:8px; bottom:8px; background:rgba(0,0,0,.65); color:#fff; font-size:11px; padding:3px 8px; border-radius:10px; }
  .pf-sheet .psd .psd-nm{ font-weight:800; font-size:19px; }
  .pf-sheet .psd .psd-addr{ font-size:14px; color:var(--sub); margin-top:6px; }
  .pf-sheet .psd .psd-why{ font-size:14.5px; color:#3a4458; margin-top:9px; background:#FBF3EC; border-left:3px solid var(--emerald); border-radius:0 9px 9px 0; padding:9px 11px; }
  .pf-sheet .psd .psd-links{ margin-top:11px; display:flex; flex-wrap:wrap; gap:12px; }
  .pf-sheet .psd .psd-lk{ font-size:12.5px; font-weight:700; cursor:pointer; color:#C4452B; text-decoration:none; }
