function SetPlaceSheet({ post, onClose, onDone, mode: kind }) {
  const sg = kind === 'suggest';
  const t = sg
    ? { title: '위치 알려주기', aside: '이웃 제보', head: ((post && post.user) || '야식탐험가') + '님의 사진', sub: '어디인지 아시는 곳을 골라주세요', headIcon: 'photo', verb: ' 제보하기', empty: '제보할 곳을 골라주세요', nameEmpty: '상호명을 입력해주세요', note: '제보는 작성자가 승인하면 반영돼요', later: '잘 모르겠어요' }
    : kind === 'register'
      ? { title: '내가 직접 등록하기', aside: '내 게시물', head: '내 게시물 · 장소 미지정', sub: '등록할 음식점을 검색해 주세요', headIcon: 'map-pin-off', verb: ' 등록하기', empty: '등록할 곳을 골라주세요', nameEmpty: '상호명을 입력해주세요', note: '등록하면 기다리는 제보는 자동으로 정리돼요', later: '제보 목록으로 돌아가기' }
      : { title: '음식점 지정', aside: '내 게시물', head: '장소 미지정 · 제보 없음', sub: (post && post.time ? post.time + ' 올린 사진' : '내가 올린 사진') + '이에요', headIcon: 'map-pin-off', verb: ' 지정하기', empty: '음식점을 골라주세요', nameEmpty: '상호명을 입력해주세요', note: '지정하면 바로 게시물에 반영돼요', later: '나중에 하기' };
  const { BottomSheet, Button, RestaurantCard } = window.SpotureDesignSystem_f7ad96;
  const params = new URLSearchParams(location.search);
  const [q, setQ] = React.useState(params.get('spq') || '');
  const [picked, setPicked] = React.useState(null);
  const [mode, setMode] = React.useState(params.get('spmap') === '1' ? 'map' : 'list');
  const [mq, setMq] = React.useState('');
  const [off, setOff] = React.useState({ x: 0, y: 0 });
  const [dragging, setDragging] = React.useState(false);
  const drag = React.useRef(null);
  const [name, setName] = React.useState('');
  const [detail, setDetail] = React.useState('');
  const [cat, setCat] = React.useState(null);

  const [region, setRegion] = React.useState(params.get('spreg') || 'seoul');
  const [regOpen, setRegOpen] = React.useState(params.get('spregopen') === '1');
  const reg = window.SPOTURE_REGION ? window.SPOTURE_REGION(region) : { city: '서울', country: '대한민국', domestic: true };
  const seoulNear = [
    { name: '할매순대국 강남점', category: '한식', distance: '45m' },
    { name: '역삼동 국밥집', category: '한식', distance: '180m' },
    { name: '청년다방 역삼점', category: '분식', distance: '80m', proposals: 2 }
  ];
  const seoulWider = [
    { name: '역삼 참숯갈비', category: '한식', distance: '260m' },
    { name: '우나기야 역삼', category: '일식', distance: '90m' },
    { name: '스시노아지 역삼', category: '일식', distance: '210m' },
    { name: '나무가나길 커피', category: '카페', distance: '180m' },
    { name: '분짜하노이 역삼', category: '베트남', distance: '120m' },
    { name: '할매순대국 역삼점', category: '한식', distance: '320m' },
    { name: '할매순대국 논현점', category: '한식', distance: '540m' }
  ];
  const regionPlaces = ((window.SPOTURE_PLACES_BY_REGION || {})[region] || []).map(p => ({ name: p.name, category: p.category, distance: p.area || null }));
  const near = region === 'seoul' ? seoulNear : regionPlaces.slice(0, 3);
  const wider = region === 'seoul' ? seoulWider : regionPlaces.slice(3);
  const hit = (p) => (p.name + ' ' + p.category).replace(/\s/g, '').includes(q.replace(/\s/g, ''));
  const results = q ? near.concat(wider).filter(hit) : [];
  const roads = ['테헤란로', '역삼로', '언주로', '논현로'];
  const awayRoads = ['중앙로', '시장로', '역전로', '큰길로'];
  const moved = mq.trim();
  const base = region === 'seoul' ? '서울 강남구 ' : reg.city + ' ';
  const addr = (moved ? moved + ' ' : base) + (moved || region !== 'seoul' ? awayRoads : roads)[Math.abs(Math.round(off.x / 90)) % 4] + ' ' + (11 + Math.abs(Math.round(off.y / 12)) * 2);
  const onMapDown = (ev) => { drag.current = { px: ev.clientX, py: ev.clientY, ox: off.x, oy: off.y }; setDragging(true); ev.currentTarget.setPointerCapture && ev.currentTarget.setPointerCapture(ev.pointerId); };
  const onMapMove = (ev) => { const d = drag.current; if (!d) return; setOff({ x: d.ox + (ev.clientX - d.px), y: d.oy + (ev.clientY - d.py) }); };
  const onMapUp = () => { drag.current = null; setDragging(false); };
  const chosen = mode === 'map' ? (name.trim() || null) : picked;
  const valid = chosen && (mode !== 'map' || !!cat);
  const ro = (w) => { const c = (w || '').charCodeAt((w || '').length - 1) - 44032; return (c >= 0 && c < 11172 && c % 28 !== 0) ? '으로' : '로'; };
  const cta = chosen ? (mode === 'map' && !cat ? '업종을 골라주세요' : '「' + chosen + '」' + ro(chosen) + t.verb) : (mode === 'map' ? t.nameEmpty : t.empty);
  return (
    <BottomSheet title={t.title} titleAside={<span style={{ font: 'var(--text-small)', color: 'var(--text-muted)' }}>{t.aside}</span>} onClose={onClose}
      footer={
        <div>
          <Button variant={sg ? 'accent' : 'primary'} disabled={!valid} onClick={() => valid && onDone && onDone(chosen, { addr: mode === 'map' ? addr : null, detail: mode === 'map' ? detail.trim() : '', category: mode === 'map' ? cat : null })}>{cta}</Button>
          <p style={{ font: 'var(--text-micro)', color: 'var(--text-muted)', textAlign: 'center', margin: '10px 0 0' }}>{t.note}</p>
          <p onClick={onClose} style={{ font: 'var(--text-caption)', color: 'var(--text-muted)', textAlign: 'center', margin: '10px 0 0', cursor: 'pointer' }}>{t.later}</p>
        </div>
      }>
      <div style={{ display: 'flex', alignItems: 'center', gap: 12, background: 'var(--surface-2)', borderRadius: 'var(--radius-tile)', padding: 12, marginBottom: 14 }}>
        <div style={{ width: 48, height: 48, borderRadius: 12, flexShrink: 0, background: 'var(--surface-1)', display: 'flex', alignItems: 'center', justifyContent: 'center' }}><i className={'ti ti-' + t.headIcon} style={{ fontSize: 20, color: 'var(--text-muted)' }}></i></div>
        <div style={{ minWidth: 0 }}>
          <span style={{ font: 'var(--text-body-strong)', display: 'block', marginBottom: 2 }}>{t.head}</span>
          <span style={{ font: 'var(--text-small)', color: 'var(--text-secondary)' }}>{t.sub}</span>
        </div>
      </div>
      <div onClick={() => setRegOpen(true)} style={{ display: 'flex', alignItems: 'center', gap: 12, background: 'var(--surface-1)', border: '1.5px solid var(--border-accent)', borderRadius: 'var(--radius-tile)', padding: '13px 14px', boxShadow: 'var(--shadow-card)', marginBottom: 14, cursor: 'pointer' }}>
        <div style={{ width: 36, height: 36, borderRadius: 12, flexShrink: 0, background: 'var(--bg-accent)', display: 'flex', alignItems: 'center', justifyContent: 'center' }}><i className={reg.domestic ? 'ti ti-map-pin' : 'ti ti-world'} style={{ fontSize: 17, color: 'var(--text-accent)' }}></i></div>
        <div style={{ flex: 1, minWidth: 0 }}>
          <span style={{ font: 'var(--text-small)', color: 'var(--text-muted)', display: 'block', marginBottom: 2 }}>검색할 지역</span>
          <span style={{ font: 'var(--text-body-strong)' }}>{reg.city} · {reg.country}</span>
        </div>
        <span style={{ font: 'var(--text-small)', color: 'var(--text-accent)', flexShrink: 0, display: 'inline-flex', alignItems: 'center', gap: 3 }}>변경<i className="ti ti-chevron-right" style={{ fontSize: 14 }}></i></span>
      </div>
      <div style={{ display: 'flex', background: 'var(--surface-2)', borderRadius: 999, padding: 4, marginBottom: 14 }}>
        {[['list', '검색해서 찾기'], ['map', '지도에서 핀 찍기']].map(([k, t]) => {
          const on = mode === k;
          return <span key={k} onClick={() => setMode(k)} style={{ flex: 1, textAlign: 'center', font: on ? '600 13px/1 var(--font-family)' : '400 13px/1 var(--font-family)', color: on ? '#fff' : 'var(--text-secondary)', background: on ? 'var(--bg-ink)' : 'transparent', borderRadius: 999, padding: '11px 0', cursor: 'pointer', transition: 'all .16s ease' }}>{t}</span>;
        })}
      </div>
      {mode === 'list' ? (
        <div>
          <div style={{ display: 'flex', alignItems: 'center', gap: 10, background: 'var(--surface-1)', border: '1px solid var(--border)', borderRadius: 'var(--radius-chip)', padding: '13px 16px', marginBottom: 14 }}>
            <i className="ti ti-search" style={{ fontSize: 17, color: 'var(--text-muted)', flexShrink: 0 }}></i>
            <input value={q} onChange={ev => { setQ(ev.target.value); setPicked(null); }} placeholder={reg.city + '에서 음식점 이름으로 찾기'} style={{ flex: 1, minWidth: 0, border: 'none', outline: 'none', background: 'transparent', font: 'var(--text-body)', color: 'var(--text-primary)', fontFamily: 'var(--font-family)' }} />
            {q && <i className="ti ti-x" onClick={() => { setQ(''); setPicked(null); }} style={{ fontSize: 16, color: 'var(--text-muted)', cursor: 'pointer', flexShrink: 0 }}></i>}
          </div>
          <div style={{ display: 'flex', alignItems: 'baseline', gap: 8, marginBottom: 10 }}>
            <span style={{ font: 'var(--text-body-strong)' }}>{q ? '검색 결과' : (region === 'seoul' ? (sg ? '이웃들이 제보한 곳' : '사진 찍은 시간대에 다녀온 곳') : reg.city + '에서 많이 찾는 곳')}</span>
            <span style={{ font: 'var(--text-small)', color: 'var(--text-muted)' }}>{q ? results.length + '곳' : '추천'}</span>
          </div>
          {!q && <p style={{ font: 'var(--text-small)', color: 'var(--text-muted)', margin: '-4px 0 12px', lineHeight: 1.6 }}>{region !== 'seoul' ? reg.city + '에 등록된 가게만 보여드려요. 다른 도시라면 위에서 지역을 바꿔주세요.' : (sg ? '이 사진에는 위치 정보가 없어 주변 후보를 보여드릴 수 없어요. 아는 곳을 검색해 주세요.' : '사진의 시간 정보로 추린 후보예요. GPS가 없어 정확하지 않을 수 있어요.')}</p>}
          {window.SPOTURE_MANY_BRANCHES && window.SPOTURE_MANY_BRANCHES(results, q) && (
            <div style={{ display: 'flex', gap: 8, background: 'var(--surface-2)', borderRadius: 'var(--radius-tile)', padding: '10px 12px', marginBottom: 10 }}>
              <i className="ti ti-info-circle" style={{ fontSize: 15, color: 'var(--text-muted)', flexShrink: 0, marginTop: 1 }}></i>
              <span style={{ font: 'var(--text-small)', color: 'var(--text-secondary)', lineHeight: 1.6 }}>지점이 많아요. 점포명이나 동을 붙여 주세요</span>
            </div>
          )}
          <div style={{ display: 'flex', flexDirection: 'column', gap: 10 }}>
            {(q ? results : near).map((p, i) => <RestaurantCard key={p.name} {...p} distance={sg ? null : p.distance} imageId={'sp-' + i} selected={picked === p.name} onClick={() => setPicked(p.name)} onMap={() => { setName(p.name); setOff({ x: -60 * i, y: 24 * i }); setMode('map'); }} />)}
            {((q && results.length === 0) || (!q && near.length === 0)) && (
              <div style={{ textAlign: 'center', padding: '30px 0' }}>
                <i className="ti ti-map-pin-question" style={{ fontSize: 30, color: 'var(--text-muted)' }}></i>
                <p style={{ font: 'var(--text-caption)', color: 'var(--text-secondary)', margin: '10px 0 14px', lineHeight: 1.6 }}>{q ? '「' + q + '」' : reg.city}에 등록된 가게가 없어요<br />지역을 바꾸거나 지도에서 직접 찍어주세요</p>
                <div style={{ display: 'flex', justifyContent: 'center', gap: 8 }}>
                  <Button variant="secondary" size="sm" onClick={() => setRegOpen(true)}><i className="ti ti-world" style={{ fontSize: 16 }}></i>지역 바꾸기</Button>
                  <Button variant="secondary" size="sm" onClick={() => { setName(q); setMode('map'); }}><i className="ti ti-map-2" style={{ fontSize: 16 }}></i>지도에서 핀 찍기</Button>
                </div>
              </div>
            )}
          </div>
        </div>
      ) : (
        <div>
          <div style={{ display: 'flex', alignItems: 'center', gap: 10, background: 'var(--surface-1)', border: '1px solid var(--border)', borderRadius: 'var(--radius-chip)', padding: '13px 16px', marginBottom: 12 }}>
            <i className="ti ti-search" style={{ fontSize: 17, color: 'var(--text-muted)', flexShrink: 0 }}></i>
            <input value={mq} onChange={ev => setMq(ev.target.value)} placeholder={reg.city + ' 안에서 건물 · 역 이름으로 이동'} style={{ flex: 1, minWidth: 0, border: 'none', outline: 'none', background: 'transparent', font: 'var(--text-body)', color: 'var(--text-primary)', fontFamily: 'var(--font-family)' }} />
            {mq && <i className="ti ti-x" onClick={() => setMq('')} style={{ fontSize: 16, color: 'var(--text-muted)', cursor: 'pointer', flexShrink: 0 }}></i>}
          </div>
          <div onPointerDown={onMapDown} onPointerMove={onMapMove} onPointerUp={onMapUp} onPointerCancel={onMapUp}
            style={{ height: 230, borderRadius: 'var(--radius-card)', background: 'var(--surface-2)', position: 'relative', overflow: 'hidden', cursor: dragging ? 'grabbing' : 'grab', touchAction: 'none' }}>
            <div style={{ position: 'absolute', inset: '-50%', backgroundImage: 'linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px)', backgroundSize: '38px 38px', transform: 'translate(' + (off.x % 38) + 'px,' + (off.y % 38) + 'px)' }}></div>
            <div style={{ position: 'absolute', left: '50%', top: '50%', transform: 'translate(-50%,-100%)', pointerEvents: 'none', display: 'flex', flexDirection: 'column', alignItems: 'center', zIndex: 2, transition: dragging ? 'none' : 'transform .16s ease' }}>
              <span style={{ width: 38, height: 38, background: 'var(--text-accent)', borderRadius: '50% 50% 50% 0', transform: 'rotate(-45deg)', display: 'flex', alignItems: 'center', justifyContent: 'center', boxShadow: 'var(--shadow-float)', marginBottom: dragging ? 16 : 6, transition: 'margin .16s ease' }}><i className="ti ti-tools-kitchen-2" style={{ fontSize: 17, color: '#fff', transform: 'rotate(45deg)' }}></i></span>
            </div>
            <span style={{ position: 'absolute', left: '50%', top: '50%', width: 14, height: 14, borderRadius: '50%', background: 'rgba(227,30,36,.18)', border: '1.5px solid rgba(227,30,36,.45)', boxSizing: 'border-box', transform: 'translate(-50%,-50%)', pointerEvents: 'none', zIndex: 1 }}></span>
            <span style={{ position: 'absolute', left: 12, top: 12, display: 'inline-flex', alignItems: 'center', gap: 5, font: 'var(--text-micro)', color: '#fff', background: 'rgba(26,26,26,.72)', borderRadius: 999, padding: '7px 11px', pointerEvents: 'none' }}>
              <i className={mq ? 'ti ti-map-search' : 'ti ti-drag-drop'} style={{ fontSize: 12 }}></i>{mq ? '「' + mq + '」 주변으로 이동했어요' : '지도를 움직여 위치를 맞춰주세요'}
            </span>
          </div>
          <div style={{ marginTop: 12, display: 'flex', flexDirection: 'column', gap: 10 }}>
            <div style={{ display: 'flex', gap: 10, background: 'var(--surface-2)', borderRadius: 'var(--radius-tile)', padding: '13px 14px' }}>
              <i className="ti ti-map-pin-check" style={{ fontSize: 16, color: 'var(--text-success)', flexShrink: 0, marginTop: 1 }}></i>
              <div style={{ minWidth: 0 }}>
                <span style={{ font: 'var(--text-small)', color: 'var(--text-muted)', display: 'block', marginBottom: 3 }}>핀이 놓인 자리의 도로명 주소</span>
                <span style={{ font: 'var(--text-body-strong)' }}>{addr}</span>
              </div>
            </div>
            <div>
              <span style={{ font: 'var(--text-small)', color: 'var(--text-secondary)', display: 'block', marginBottom: 6 }}>상호명 <span style={{ color: 'var(--text-accent)' }}>· 필수</span></span>
              <input value={name} onChange={ev => setName(ev.target.value.slice(0, 30))} placeholder="예: 할매순대국 강남점" style={{ width: '100%', boxSizing: 'border-box', background: 'var(--surface-1)', border: '1px solid ' + (name.trim() ? 'var(--border-accent)' : 'var(--border)'), borderRadius: 'var(--radius-chip)', padding: '14px 16px', outline: 'none', font: 'var(--text-body)', color: 'var(--text-primary)', fontFamily: 'var(--font-family)' }} />
            </div>
            <div>
              <span style={{ font: 'var(--text-small)', color: 'var(--text-secondary)', display: 'block', marginBottom: 8 }}>업종 <span style={{ color: 'var(--text-accent)' }}>· 필수</span></span>
              <CategoryPicker value={cat} onChange={setCat} />
            </div>
            <div>
              <span style={{ font: 'var(--text-small)', color: 'var(--text-secondary)', display: 'block', marginBottom: 6 }}>상세 주소 <span style={{ color: 'var(--text-muted)' }}>· 선택</span></span>
              <input value={detail} onChange={ev => setDetail(ev.target.value.slice(0, 40))} placeholder="예: 2층 · 지하상가 B동 14호" style={{ width: '100%', boxSizing: 'border-box', background: 'var(--surface-1)', border: '1px solid var(--border)', borderRadius: 'var(--radius-chip)', padding: '14px 16px', outline: 'none', font: 'var(--text-body)', color: 'var(--text-primary)', fontFamily: 'var(--font-family)' }} />
              <p style={{ font: 'var(--text-micro)', color: 'var(--text-muted)', margin: '7px 0 0', lineHeight: 1.6 }}>{sg ? '층·호수까지 적어주면 작성자가 확인하기 쉬워요.' : '층·호수까지 적어주면 이웃이 찾기 쉬워요. 새 가게로 등록되고 확인 후 지도에 반영돼요.'}</p>
            </div>
          </div>
        </div>
      )}
      {regOpen && <RegionPickerSheet current={region} onClose={() => setRegOpen(false)} onPick={(k) => { setRegion(k); setQ(''); setMq(''); setPicked(null); setOff({ x: 0, y: 0 }); setRegOpen(false); }} />}
    </BottomSheet>
  );
}
window.SetPlaceSheet = SetPlaceSheet;