function ConfirmLocationSheet({ post, onClose, onBlock, onDone, onDirect }) {
  const { BottomSheet, Button, Avatar } = window.SpotureDesignSystem_f7ad96;
  const params = new URLSearchParams(location.search);
  const [view, setView] = React.useState(params.get('cview') === 'map' ? 'map' : 'list');
  const [picked, setPicked] = React.useState(0);
  const [open, setOpen] = React.useState(params.get('cexp') === '1' ? 0 : -1);
  const cands = [
    { name: '청년다방 역삼점', category: '분식', top: true, proposers: ['역삼동토박이', '야식탐험가'], x: '58%', y: '30%' },
    { name: '역삼동 국밥집', category: '한식', proposers: ['국밥러버92'], x: '22%', y: '62%' }
  ];
  const total = cands.reduce((n, c) => n + c.proposers.length, 0);
  const Toggle = () => (
    <div style={{ display: 'flex', background: 'var(--surface-2)', borderRadius: 999, padding: 4, marginBottom: 14 }}>
      {['리스트', '지도'].map(t => {
        const key = t === '리스트' ? 'list' : 'map';
        const on = view === key;
        return <span key={t} onClick={() => setView(key)} 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>
  );
  return (
    <BottomSheet title={'위치 제보 확인 ' + total + '건'} onClose={onClose}
      footer={
        <div>
          <div style={{ marginBottom: 8 }}><Button variant="secondary" size="sm" onClick={() => onDirect && onDirect()}><i className="ti ti-search" style={{ fontSize: 15 }}></i>여기 없어요, 내가 직접 등록할게요</Button></div>
          <Button variant="primary" onClick={() => onDone && onDone(cands[picked].name)}>이 위치로 확정하기</Button>
          <p onClick={onClose} style={{ font: 'var(--text-caption)', color: 'var(--text-muted)', textAlign: 'center', margin: '12px 0 0', cursor: 'pointer' }}>나중에 하기</p>
        </div>
      }>
      <Toggle />
      <div style={{ display: 'flex', alignItems: 'center', gap: 12, background: 'var(--surface-2)', borderRadius: 'var(--radius-tile)', padding: 12, marginBottom: 16 }}>
        <div style={{ width: 48, height: 48, borderRadius: 12, flexShrink: 0, background: 'var(--surface-1)', display: 'flex', alignItems: 'center', justifyContent: 'center' }}><i className="ti ti-photo" style={{ fontSize: 20, color: 'var(--text-muted)' }}></i></div>
        <div style={{ minWidth: 0 }}>
          <span style={{ font: 'var(--text-body-strong)', display: 'block', marginBottom: 2 }}>내 게시물 · 장소 미지정</span>
          <span style={{ font: 'var(--text-small)', color: 'var(--text-secondary)' }}>이웃들이 알려준 곳 중에서 골라주세요</span>
        </div>
      </div>
      {view === 'list' ? (
        <div style={{ display: 'flex', flexDirection: 'column', gap: 10, marginBottom: 14 }}>
          {cands.map((c, i) => {
            const on = picked === i;
            const exp = open === i;
            return (
              <div key={c.name} style={{ border: on ? '1.5px solid var(--text-accent)' : '1px solid var(--border)', background: on ? 'var(--bg-accent)' : 'var(--surface-1)', borderRadius: 'var(--radius-tile)', padding: '14px 16px' }}>
                <div onClick={() => setPicked(i)} style={{ display: 'flex', alignItems: 'center', gap: 10, cursor: 'pointer' }}>
                  <span style={{ flex: 1, minWidth: 0, font: 'var(--text-body-strong)', color: on ? 'var(--text-accent)' : 'var(--text-primary)', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{c.name}</span>
                  <i className="ti ti-map-2" style={{ fontSize: 16, color: on ? 'var(--text-accent)' : 'var(--text-secondary)', flexShrink: 0 }}></i>
                  <span style={{ width: 17, flexShrink: 0, display: 'flex', justifyContent: 'center' }}>{on && <i className="ti ti-check" style={{ fontSize: 16, color: 'var(--text-accent)' }}></i>}</span>
                </div>
                <div onClick={() => setOpen(exp ? -1 : i)} style={{ display: 'inline-flex', alignItems: 'center', gap: 4, marginTop: 4, cursor: 'pointer' }}>
                  <span style={{ font: 'var(--text-small)', color: on ? 'var(--text-accent)' : 'var(--text-secondary)', borderBottom: '1px solid currentColor' }}>{c.category} · {c.proposers.length}명이 제안{c.top ? ' (가장 많음)' : ''}</span>
                  <i className={'ti ti-chevron-' + (exp ? 'up' : 'down')} style={{ fontSize: 13, color: on ? 'var(--text-accent)' : 'var(--text-secondary)' }}></i>
                </div>
                {exp && (
                  <div style={{ display: 'flex', flexDirection: 'column', gap: 10, marginTop: 12, paddingTop: 12, borderTop: '1px solid ' + (on ? 'var(--border-accent)' : 'var(--border)') }}>
                    {c.proposers.map(p => (
                      <div key={p} style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 10 }}>
                        <div style={{ display: 'flex', alignItems: 'center', gap: 8, minWidth: 0 }}>
                          <Avatar user={p} size={24} />
                          <span style={{ font: 'var(--text-caption)', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{p}</span>
                        </div>
                        <span onClick={() => onBlock && onBlock(p)} style={{ font: 'var(--text-small)', color: 'var(--text-danger)', cursor: 'pointer', flexShrink: 0, fontWeight: 600 }}>차단</span>
                      </div>
                    ))}
                  </div>
                )}
              </div>
            );
          })}
        </div>
      ) : (
        <div style={{ marginBottom: 14 }}>
          <div style={{ height: 200, borderRadius: 'var(--radius-card)', background: 'var(--surface-2)', position: 'relative', overflow: 'hidden' }}>
            {cands.map((c, i) => {
              const on = picked === i;
              return (
                <div key={c.name} onClick={() => setPicked(i)} style={{ position: 'absolute', left: c.x, top: c.y, transform: 'translate(-50%,-100%)', display: 'flex', flexDirection: 'column', alignItems: 'center', cursor: 'pointer' }}>
                  {on
                    ? <span style={{ width: 34, height: 34, borderRadius: '50%', background: 'var(--text-accent)', display: 'flex', alignItems: 'center', justifyContent: 'center', boxShadow: 'var(--shadow-float)' }}><i className="ti ti-map-pin" style={{ fontSize: 19, color: '#fff' }}></i></span>
                    : <span style={{ width: 28, height: 28, borderRadius: '50%', background: 'var(--surface-1)', border: '1px solid var(--border-strong)', display: 'flex', alignItems: 'center', justifyContent: 'center' }}><i className="ti ti-map-pin" style={{ fontSize: 15, color: 'var(--text-secondary)' }}></i></span>}
                  <span style={{ font: 'var(--text-micro)', color: on ? '#fff' : 'var(--text-secondary)', background: on ? 'var(--text-accent)' : 'var(--surface-1)', borderRadius: 999, padding: '4px 9px', marginTop: -3, whiteSpace: 'nowrap' }}>{c.name.split(' ')[0]}</span>
                </div>
              );
            })}
          </div>
          <p style={{ font: 'var(--text-small)', color: 'var(--text-muted)', textAlign: 'center', margin: '10px 0 0' }}>진한 핀이 선택된 후보예요 · 핀을 탭해 바꿀 수 있어요</p>
        </div>
      )}
    </BottomSheet>
  );
}
window.ConfirmLocationSheet = ConfirmLocationSheet;