* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.5 system-ui, sans-serif; color: #1a1a2e; background: #f5f6fa; }
header { background: #1a1a2e; color: #fff; padding: 1.5rem 1rem; }
header h1 { margin: 0 0 .25rem; font-size: 1.4rem; }
#meta { margin: 0 0 1rem; opacity: .7; font-size: .9rem; }
.controls { display: flex; gap: .5rem; flex-wrap: wrap; }
#q { flex: 1 1 16rem; padding: .55rem .8rem; border: none; border-radius: 8px; font-size: 1rem; }
#loc { padding: .55rem .8rem; border: none; border-radius: 8px; font-size: 1rem; }
main { max-width: 46rem; margin: 1rem auto; padding: 0 1rem; }
article { background: #fff; border-radius: 10px; padding: 1rem 1.2rem; margin-bottom: .8rem;
          box-shadow: 0 1px 3px rgba(0,0,0,.08); }
article h2 { margin: 0; font-size: 1.05rem; }
article h2 a { color: #16437e; text-decoration: none; }
article h2 a:hover { text-decoration: underline; }
.sub { margin: .2rem 0 .5rem; color: #666; font-size: .85rem; }
.label { margin: .5rem 0 0; font-size: .8rem; font-weight: 600; color: #888; text-transform: uppercase; }
article ul { margin: .3rem 0; padding-left: 1.2rem; }
article li { margin: .15rem 0; font-size: .93rem; }
.tags { margin: .5rem 0 0; }
.tags span { display: inline-block; background: #eef2f8; color: #16437e; border-radius: 999px;
             padding: .15rem .7rem; font-size: .8rem; margin-right: .4rem; }
.empty { text-align: center; color: #888; padding: 2rem; }