:root{
    --border:#e5e7eb;
    --text:#111827;
    --muted:#6b7280;
    --bg:#ffffff;
    --panel:#f9fafb;
    --btn:#111827;
    --btnText:#ffffff;
    --btnGhost:#ffffff;
}

*{ box-sizing:border-box; }
body{
    margin:0;
    font-family: ui-sans-serif, system-ui, -apple-system, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
    color:var(--text);
    background:var(--bg);
}

.wrap{
    max-width: 1200px;
    margin: 0 auto;
    padding: 18px 16px 22px;
}

.topbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:12px;
}
.topbar h1{
    margin:0;
    font-size:20px;
    letter-spacing:-0.2px;
}
.topbar a{
    text-decoration:none;
    color:var(--text);
    border:1px solid var(--border);
    background:#fff;
    padding:8px 10px;
    border-radius:10px;
    font-size:13px;
}

.panel{
    border:1px solid var(--border);
    background:var(--panel);
    border-radius:14px;
    padding:14px;
    margin-bottom:12px;
}

.panel-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:12px;
    margin-bottom:10px;
}
.panel-head .title{
    font-size:14px;
    font-weight:700;
    margin:0;
}
.panel-head .sub{
    font-size:12px;
    color:var(--muted);
    margin:0;
}

.group{
    border-top:1px dashed var(--border);
    padding-top:12px;
    margin-top:12px;
}
.group:first-of-type{
    border-top:none;
    padding-top:0;
    margin-top:0;
}
.group h3{
    margin:0 0 10px 0;
    font-size:13px;
    color:#374151;
    letter-spacing:-0.1px;
}

/* 반응형 그리드 */
.grid{
    display:grid;
    gap:10px;
}
.grid.two{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid.four{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid.five{ grid-template-columns: repeat(5, minmax(0, 1fr)); }

@media (max-width: 1024px){
    .grid.five{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .grid.four{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
    .grid.two,
    .grid.four,
    .grid.five{ grid-template-columns: 1fr; }
}

.field label{
    display:block;
    font-size:12px;
    color:#4b5563;
    margin-bottom:6px;
}
input, select{
    width:100%;
    padding:10px 10px;
    border-radius:10px;
    border:1px solid var(--border);
    background:#fff;
    font-size:13px;
    outline:none;
}
input:focus, select:focus{
    border-color:#c7cdd6;
    box-shadow: 0 0 0 3px rgba(17,24,39,0.06);
}

/* 최소~최대 한 줄 */
.range{
    display:grid;
    grid-template-columns: 1fr 22px 1fr;
    align-items:center;
    gap:8px;
}
.range .sep{
    text-align:center;
    color:var(--muted);
    font-size:12px;
}

.actions{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    margin-top:12px;
}
button{
    border:none;
    border-radius:10px;
    padding:10px 12px;
    font-size:13px;
    cursor:pointer;
}
.btn-primary{
    background:var(--btn);
    color:var(--btnText);
}
.btn-ghost{
    background:var(--btnGhost);
    border:1px solid var(--border);
    color:var(--text);
}

.hint{
    margin-top:10px;
    font-size:13px;
    color:var(--muted);
}

#map{
    width:100%;
    height:640px;
    border:1px solid var(--border);
    border-radius:14px;
    overflow:hidden;
    background:#fff;
}

/* InfoWindow 닫기 버튼: 깔끔한 X */
.iw-close{
    position:absolute;
    right:8px; top:8px;
    width:26px; height:26px;
    border-radius:8px;
    border:1px solid #e5e7eb;
    background:#fff;
    cursor:pointer;
    padding:0;
}
.iw-close:hover{ background:#f3f4f6; }
.iw-close:active{ transform: scale(0.98); }
.iw-close:focus{ outline:none; box-shadow: 0 0 0 3px rgba(17,24,39,0.08); }

.iw-close::before,
.iw-close::after{
    content:"";
    position:absolute;
    left:50%; top:50%;
    width:12px; height:2px;
    background:#6b7280;
    border-radius:2px;
    transform-origin:center;
}
.iw-close::before{ transform: translate(-50%,-50%) rotate(45deg); }
.iw-close::after { transform: translate(-50%,-50%) rotate(-45deg); }