/* 맛집찐 — 라이트 + 토마토 */
:root{
  --ink:#191f28; --sub:#4e5968; --faint:#8b95a1; --line:#e5e8eb;
  --tomato:#ff5d3a; --tomato-d:#e6482a; --mint:#00c471; --amber:#ff9500; --red:#f04452; --bg:#fff; --panel:#f9fafb;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:"Noto Sans KR",-apple-system,sans-serif; color:var(--ink); background:var(--bg); padding-bottom:80px;}
.wrap{max-width:680px; margin:0 auto; padding:0 18px;}

.top{text-align:center; padding:48px 0 6px;}
.top h1{font-size:44px; font-weight:900; margin:0; letter-spacing:-2px;}
.top h1 .t{color:var(--tomato)}
.top .tag{color:var(--sub); font-size:15px; margin:8px 0 0; line-height:1.8;}
.top .tag b{color:var(--ink)}

.searchbox{margin-top:20px;}
#f{display:flex; gap:10px;}
#q{flex:1; font:inherit; font-size:16.5px; padding:15px 18px; border:2px solid var(--line); border-radius:14px; outline:none;}
#q:focus{border-color:var(--tomato);}
#go{font:inherit; font-size:15.5px; font-weight:700; color:#fff; background:var(--tomato); border:0; border-radius:14px; padding:0 20px; cursor:pointer; white-space:nowrap;}
#go:hover{background:var(--tomato-d)} #go:disabled{opacity:.5}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; justify-content:center;}
.chip{font-size:13px; color:var(--sub); background:var(--panel); border:1px solid var(--line); border-radius:999px; padding:7px 13px; cursor:pointer;}
.chip:hover{border-color:var(--tomato); color:var(--tomato-d);}
.note{text-align:center; color:var(--faint); font-size:12px; margin-top:12px;}

#status{text-align:center; color:var(--sub); font-size:13.5px; margin-top:20px;}

#list{margin-top:14px;}
@keyframes pop{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
.place{border:1.5px solid var(--line); border-radius:16px; padding:16px 18px; margin:12px 0; background:#fff; animation:pop .35s; position:relative;}
.place.rank1{border-color:var(--tomato); box-shadow:0 4px 18px rgba(255,93,58,.12);}
.crown{position:absolute; top:-12px; left:16px; background:var(--tomato); color:#fff; font-size:11.5px; font-weight:900; border-radius:999px; padding:3px 11px;}
.phead{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;}
.pname{font-size:17px; font-weight:900;}
.pcat{font-size:11.5px; color:var(--faint); background:var(--panel); border-radius:6px; padding:2px 7px;}
.paddr{color:var(--faint); font-size:12px; margin-top:3px;}
.pone{font-size:14px; margin-top:9px; line-height:1.7;}
.pmenu{color:var(--sub); font-size:12.5px; margin-top:3px;}

.gauge{display:flex; align-items:center; gap:10px; margin-top:11px;}
.glabel{flex:0 0 auto; font-size:11.5px; font-weight:900; color:var(--faint); letter-spacing:.5px;}
.gtrack{flex:1; height:10px; border-radius:6px; background:#f0f2f4; overflow:hidden;}
.gfill{height:100%; border-radius:6px; transition:width .7s ease;}
.gpct{flex:0 0 74px; font-size:13px; font-weight:900; text-align:right;}
.gcnt{color:var(--faint); font-size:11.5px; margin-top:5px;}
.badge{display:inline-block; font-size:11px; font-weight:900; border-radius:6px; padding:2.5px 8px; margin-left:6px; vertical-align:1px;}
.badge.jjin{background:#e9fbf3; color:var(--mint);}
.badge.mid{background:#fff6e6; color:var(--amber);}
.badge.ad{background:#ffefef; color:var(--red);}
.badge.info{background:var(--panel); color:var(--faint);}
.pmap{font-size:12.5px; color:var(--tomato); text-decoration:none; font-weight:700; margin-top:9px; display:inline-block;}

.skel{border:1.5px dashed var(--line); border-radius:16px; padding:16px 18px; margin:12px 0; color:var(--faint); font-size:13.5px;}
.spinner{display:inline-block; animation:rot 1s steps(10) infinite;}
@keyframes rot{to{transform:rotate(360deg)}}

.actions{display:flex; gap:10px; margin-top:16px;}
.actions a,.actions button{flex:1; text-align:center; text-decoration:none; font:inherit; font-size:14.5px; font-weight:700; padding:13px; border-radius:12px; border:1.5px solid var(--line); color:var(--ink); background:#fff; cursor:pointer;}
.actions .prime{background:var(--tomato); border-color:var(--tomato); color:#fff;}

.recent{margin-top:38px;}
.recent .rh{font-weight:900; font-size:15px; margin-bottom:6px;}
.ritem{display:block; text-decoration:none; color:inherit; padding:10px 4px; border-bottom:1px solid var(--line); font-size:14px;}
.ritem:hover .rq{color:var(--tomato-d)}
.ritem .rt{color:var(--faint); font-size:12px; margin-top:2px;}
.foot{margin-top:44px; text-align:center; color:var(--faint); font-size:12px; line-height:1.9;}
.hidden{display:none}