/* C. Editorial Neo-Brutal — 오프화이트 · 굵은 외곽선 · 하드 섀도 · 라임 포인트 */
:root { --bg: #f4f3ec; --panel: #fff; --text: #0d0d0d; --muted: #5d5d55; --line: #0d0d0d; --primary: #0d0d0d; --primary-dark: #000; --accent: #ff4d2e; --radius: 14px; --lime: #c9f25a; }
body { background: #f4f3ec; background-image: radial-gradient(rgba(13, 13, 13, .09) 1px, transparent 1px); background-size: 22px 22px; color: #0d0d0d; font-feature-settings: "ss01"; }
h1 { font-size: 34px; font-weight: 900; letter-spacing: -.045em; } h2 { font-size: 22px; font-weight: 900; letter-spacing: -.04em; }

.hd { background: #fff; border-bottom: 2px solid #0d0d0d; backdrop-filter: none; -webkit-backdrop-filter: none; }
.logo { background: #c9f25a; -webkit-background-clip: border-box; background-clip: border-box; color: #0d0d0d; -webkit-text-fill-color: #0d0d0d; padding: 2px 12px; border: 2px solid #0d0d0d; border-radius: 12px; box-shadow: 3px 3px 0 #0d0d0d; font-weight: 900; font-size: 22px; transform: rotate(-1.5deg); }
.gnb a { color: #0d0d0d; font-weight: 700; border: 2px solid transparent; } .gnb a:hover { background: #fff; border-color: #0d0d0d; }
.gnb a.on { background: #0d0d0d; color: #c9f25a; border-color: #0d0d0d; }
.hd .hd-search input[type=search] { border: 2px solid #0d0d0d; background: #fff; border-right: 0; }
.hd-search button { background: #0d0d0d; color: #c9f25a; border: 2px solid #0d0d0d; }
.acct .btn-sm { background: #c9f25a; color: #0d0d0d; border: 2px solid #0d0d0d; box-shadow: 2px 2px 0 #0d0d0d; border-radius: 10px; }

.home-grid { gap: 22px; } .grid2 { gap: 22px; }
.box { background: #fff; border: 2px solid #0d0d0d; border-radius: 16px; padding: 22px 24px; box-shadow: 6px 6px 0 #0d0d0d; margin-bottom: 26px; }
.bg-sec::before { height: 76px; background: var(--c, #c9f25a); opacity: 1; -webkit-mask-image: none; mask-image: none; border-bottom: 2px solid #0d0d0d; }
.bg-kw { --c: #c9f25a; } .bg-tag { --c: #ffd1e8; } .bg-pop { --c: #bfe4ff; } .bg-prod { --c: #ffd58a; } .bg-col { --c: #bff0d4; } .bg-stay { --c: #e0d4ff; } .bg-post { --c: #ffc9bd; }
.box-hd { margin: -6px 0 30px; min-height: 40px; } .bg-sec > .box-hd { margin-bottom: 34px; }
.box-hd h2 { display: flex; align-items: center; }
.live { background: #0d0d0d; color: #c9f25a; border-radius: 6px; padding: 2px 8px; font-size: 11px; letter-spacing: .06em; }
.box-hd .sub, .stay-sub { color: #0d0d0d; font-weight: 600; opacity: .75; }

.tabs { gap: 6px; } .tab { border: 2px solid #0d0d0d; background: #fff; color: #0d0d0d; font-weight: 700; border-radius: 10px; padding: 3px 14px; }
.tab.on { background: #0d0d0d; color: #c9f25a; }

.rank-list li { border-bottom: 2px dashed rgba(13, 13, 13, .15); padding: 9px 0; }
.rank-list .no { font-size: 17px; font-weight: 900; width: 28px; color: #0d0d0d; } .rank-list li:nth-child(n+4) .no { color: #8a8a80; font-weight: 800; }
.rank-list li:nth-child(-n+3) .no { background: #c9f25a; border: 2px solid #0d0d0d; border-radius: 8px; width: 28px; height: 28px; display: grid; place-items: center; font-size: 14px; }
.rank-list a { font-weight: 700; } .rank-list a:hover { background: #c9f25a; text-decoration: none; }
.kw-more, .btn.ghost { background: #fff; border: 2px solid #0d0d0d; color: #0d0d0d; font-weight: 800; border-radius: 12px; box-shadow: 3px 3px 0 #0d0d0d; }

.tag { background: #fff; color: #0d0d0d; border: 2px solid #0d0d0d; padding: 3px 11px; font-weight: 700; border-radius: 10px; }
.tag.lv1 { background: #fff; color: #5d5d55; border-color: rgba(13, 13, 13, .35); font-weight: 600; } .tag.lv2 { background: #ffe58a; color: #0d0d0d; }
.tag.lv3 { background: #c9f25a; color: #0d0d0d; box-shadow: 3px 3px 0 #0d0d0d; font-weight: 900; }
.tag.lv3.src-shop { background: #ff9a6b; color: #0d0d0d; } .tag.lv3.src-google { background: #8de8b0; color: #0d0d0d; } .tag.lv3.src-x { background: #0d0d0d; color: #fff; } .tag.lv3.src-site { background: #c7a8ff; color: #0d0d0d; } .tag.lv2.src-x { background: #e5e5dc; }
.tag-legend .lg { background: #fff; border: 1.5px solid #0d0d0d; color: #0d0d0d; border-radius: 8px; }

.pop-group h3 { color: #0d0d0d; font-size: 15px; font-weight: 900; display: inline-block; background: #c9f25a; padding: 0 8px; border-radius: 6px; margin-bottom: 8px; }
.pop-group .no { color: #0d0d0d; font-weight: 900; } .pop-group li:first-child .no { color: var(--accent); }
.got { border: 1.5px solid #0d0d0d; color: #0d0d0d; background: #bff0d4; border-radius: 6px; }
.prod { background: #fff; border: 2px solid #0d0d0d; border-radius: 16px; padding: 8px 8px 12px; box-shadow: 4px 4px 0 #0d0d0d; transition: transform .15s, box-shadow .15s; }
.prod:hover { transform: translate(-3px, -3px); box-shadow: 7px 7px 0 #0d0d0d; }
.thumb { border-radius: 10px; border: 2px solid #0d0d0d; } .mall b { background: #0d0d0d; color: #c9f25a; padding: 0 7px; border-radius: 6px; } .price { font-weight: 900; font-size: 17px; }
.post-list li { border-bottom: 2px dashed rgba(13, 13, 13, .15); } .post-list .bd { background: #ffd58a; color: #0d0d0d; border: 1.5px solid #0d0d0d; font-weight: 800; border-radius: 6px; } .post-list a:hover { background: #c9f25a; text-decoration: none; }

.tbl { border: 2px solid #0d0d0d; border-radius: 16px; box-shadow: 6px 6px 0 #0d0d0d; } .tbl thead th { background: #c9f25a; color: #0d0d0d; font-weight: 800; border-bottom: 2px solid #0d0d0d; } .tbl th, .tbl td { border-bottom: 1.5px solid rgba(13, 13, 13, .12); }
.c-ti a { font-weight: 800; } .c-ti a:hover { background: #c9f25a; text-decoration: none; } .tags-inline { color: #0d0d0d; opacity: .6; }
.pager a { border: 2px solid #0d0d0d; border-radius: 8px; font-weight: 800; } .pager a.on { background: #0d0d0d; color: #c9f25a; }
.stay-card.has-hotels, .stay-card a { border: 2px solid #0d0d0d; border-radius: 16px; box-shadow: 4px 4px 0 #0d0d0d; background: #fff; }
.stay-card .hotels a { border: 0; box-shadow: none; } .stay-card .hotels a:hover { background: #f2f9d8; }
.stay-card .hotels img, .stay-card .hotels .noimg { border: 2px solid #0d0d0d; border-radius: 10px; } .stay-card .hp { color: #0d0d0d; background: #c9f25a; display: inline-block; justify-self: start; padding: 0 7px; border-radius: 6px; font-weight: 900; }
.stay-hd .nm { font-weight: 900; font-size: 17px; } .stay-card.top .stay-hd .no { color: var(--accent); } .stay-card .ck { color: #0d0d0d; background: #ffe58a; padding: 0 6px; border-radius: 6px; font-weight: 700; }
.stay-jump a { color: #0d0d0d; font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-decoration-color: #c9f25a; text-underline-offset: 3px; }
.btn, .btn-sm { background: #c9f25a; color: #0d0d0d; border: 2px solid #0d0d0d; border-radius: 12px; box-shadow: 3px 3px 0 #0d0d0d; font-weight: 800; } .btn:hover, .btn-sm:hover { background: #d8ff6e; }
input[type=text], input[type=password], input[type=email], input[type=search], textarea { border: 2px solid #0d0d0d; border-radius: 12px; }
.post, .doc, .card, .auth form { border: 2px solid #0d0d0d; border-radius: 16px; box-shadow: 6px 6px 0 #0d0d0d; }
.crumb { color: #0d0d0d; font-weight: 800; background: #c9f25a; display: inline-block; padding: 0 8px; border-radius: 6px; } .updated { color: #5d5d55; }
.ft { background: #0d0d0d; color: #bdbdb2; border-top: 6px solid #c9f25a; } .ft-brand { color: #c9f25a; font-size: 26px; font-weight: 900; } .ft-links a { color: #fff; }

/* 서브 페이지 보강 */
.col-card { border: 2px solid #0d0d0d; border-radius: 14px; background: #fff; box-shadow: 4px 4px 0 #0d0d0d; }
.col-kw { color: #0d0d0d; background: #c9f25a; padding: 0 7px; border-radius: 6px; } .col-prods .th { border: 2px solid #0d0d0d; border-radius: 8px; }
.pricebox .orig, .cp .orig { color: #6b6b62; } .pct { color: #e0381d; }
.notice { border: 2px solid #0d0d0d; border-radius: 12px; background: #c9f25a; color: #0d0d0d; font-weight: 600; } .error { border: 2px solid #0d0d0d; border-radius: 12px; background: #ffc9bd; color: #0d0d0d; font-weight: 600; }
#editor { border: 2px solid #0d0d0d; border-radius: 14px; } .ed-bar { background: #c9f25a; border-bottom: 2px solid #0d0d0d; } .ed-bar button { border: 2px solid #0d0d0d; font-weight: 700; } .ed-bar .mode.on { background: #0d0d0d; color: #c9f25a; }
.img-box { border: 2px dashed #0d0d0d; border-radius: 14px; } .gallery img, .post-body img { border: 2px solid #0d0d0d; border-radius: 10px; }
.post-body blockquote { border-left: 4px solid #c9f25a; } select { border: 2px solid #0d0d0d; border-radius: 12px; }
