
:root{
  --bg: #f8fbff;
  --card: #ffffff;
  --accent: #4fa3ff;
  --text: #122233;
  --muted: #6b7f8f;
}

*{box-sizing:border-box}
body{font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; background:var(--bg); color:var(--text); margin:0; padding:0}
.container{max-width:980px;margin:28px auto;padding:0 16px}
.site-header{background:transparent;padding:18px 16px;border-bottom:1px solid rgba(20,40,60,0.04)}
.logo-wrap{display:flex;gap:12px;align-items:center}
.logo{width:64px;height:64px}
h1{margin:0;font-size:20px}
.tagline{margin:2px 0 0;color:var(--muted);font-size:13px}

.controls{display:flex;gap:12px;align-items:center;margin:18px 0}
.controls input, .controls select{padding:8px;border:1px solid rgba(20,40,60,0.06);border-radius:6px}

.news-list{display:grid;grid-template-columns:1fr;gap:12px}
.news-card{background:var(--card);padding:14px;border-radius:10px;box-shadow:0 6px 18px rgba(18,34,51,0.04);border:1px solid rgba(20,40,60,0.03)}
.news-title{margin:0 0 6px;font-size:16px}
.news-meta{font-size:12px;color:var(--muted);margin-bottom:8px}
.news-excerpt{color:#2b3b47;font-size:14px}

.news-source{display:inline-block;padding:4px 8px;border-radius:999px;background:rgba(79,163,255,0.08);color:var(--accent);font-weight:600;margin-right:8px;font-size:12px}

.site-footer{text-align:center;padding:26px 16px;color:var(--muted);border-top:1px solid rgba(20,40,60,0.04);margin-top:32px}
