:root{
  --ink:#1a1a1a; --sub:#6b6b6b; --line:#e7e3da; --bg:#f6f3ec; --card:#fffdf8;
  --accent:#b3261e; --t1:#b3261e; --t2:#1b4965; --t3:#8a8a8a;
  --font:"Pretendard","Malgun Gothic","맑은 고딕",system-ui,sans-serif;
}
*{box-sizing:border-box}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--font);
  line-height:1.55; -webkit-font-smoothing:antialiased;}
.wrap{max-width:880px; margin:0 auto; padding:0 18px 80px}

/* 신문 제호 헤더 */
header.masthead{border-bottom:3px double var(--ink); padding:26px 0 14px; margin-bottom:4px; text-align:center;}
.kicker{letter-spacing:.35em; font-size:12px; color:var(--sub); text-transform:uppercase}
h1.title{font-size:clamp(28px,6vw,50px); margin:6px 0 8px; font-weight:800;
  letter-spacing:-.02em; word-break:keep-all;}
.dateline{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; font-size:13px; color:var(--sub);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:8px 0; margin-top:10px;}
.dateline b{color:var(--ink); font-weight:600}

/* 도구막대 */
.toolbar{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:18px 0;
  position:sticky; top:0; z-index:5; background:var(--bg); padding:10px 0; border-bottom:1px solid var(--line);}
.toolbar input[type=search]{flex:1; min-width:180px; padding:10px 14px; border:1px solid var(--line);
  border-radius:10px; font:inherit; background:var(--card);}
.toolbar input[type=search]:focus{outline:none; border-color:var(--accent);}
.seg{display:flex; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--card)}
.seg button{border:0; background:transparent; padding:9px 12px; font:inherit; cursor:pointer;
  color:var(--sub); font-size:13px; white-space:nowrap;}
.seg button.on{background:var(--ink); color:#fff}

/* 기사 리스트 */
.count{font-size:13px; color:var(--sub); margin:6px 2px 14px}
article.news{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px 18px;
  margin-bottom:12px; display:flex; gap:14px; transition:transform .08s ease, box-shadow .12s ease;}
article.news:hover{transform:translateY(-1px); box-shadow:0 6px 22px rgba(0,0,0,.06)}
.rank{font-size:18px; font-weight:800; color:var(--line); min-width:30px; text-align:right;
  padding-top:2px; font-variant-numeric:tabular-nums;}
.body{flex:1; min-width:0}
.news a.h{font-size:18px; font-weight:700; color:var(--ink); text-decoration:none;
  letter-spacing:-.01em; word-break:keep-all;}
.news a.h:hover{color:var(--accent); text-decoration:underline}
.desc{color:var(--sub); font-size:14px; margin:6px 0 8px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.meta{display:flex; gap:8px; align-items:center; flex-wrap:wrap; font-size:12px}
.badge{padding:2px 9px; border-radius:999px; font-weight:600; font-size:11px; border:1px solid transparent;}
.badge.t1{background:rgba(179,38,30,.10); color:var(--t1); border-color:rgba(179,38,30,.25)}
.badge.t2{background:rgba(27,73,101,.10); color:var(--t2); border-color:rgba(27,73,101,.25)}
.badge.t3{background:#f0eee8; color:var(--t3)}
.badge.gov{background:rgba(20,120,80,.10); color:#147850; border-color:rgba(20,120,80,.25)}
.src{color:var(--ink); font-weight:600}
.dot{color:var(--line)}
.rel,.prov{color:var(--sub)}
.empty{text-align:center; color:var(--sub); padding:50px 0}

.backlink{margin:18px 2px; font-size:14px}
.backlink a{color:var(--t2); text-decoration:none}
.backlink a:hover{text-decoration:underline}

footer{margin-top:30px; padding-top:16px; border-top:1px solid var(--line);
  font-size:12px; color:var(--sub); text-align:center; line-height:1.7}

@media (max-width:520px){
  .rank{display:none}
  article.news{padding:14px}
  .toolbar{gap:8px}
}