.hn-list { list-style:none; padding-left:0; margin:0; }
.hn-list > li { display:flex; align-items:center; margin:10px 0px; }

.item_favicon {
  width:26px; height:26px; border-radius:50%;
  border:1px solid #d2d2d2; background:#f3f5f6;
  display:inline-flex; justify-content:center; align-items:center; margin:0; vertical-align:middle;
}
.item-site { font-weight:600; }
.item-site a { color:#000; text-decoration:none; }
.item-site a:hover { text-decoration:underline; }
.item-title { color:#828282; font-weight:500; margin-left:6px; }

.item-meta { color:#828282; font-size:12px; margin-top:2px; }
.item-meta a { color:#828282; text-decoration:none; }
.item-meta a:hover { text-decoration:underline; }



.vote { display:inline-block; margin-right:8px; font-size:14px;color:#111827;}
.vote button { border:1px solid #eee; background:#fff; padding:0 6px; line-height:18px; cursor:pointer; border-radius:3px; }
.vote button.is-upvoted{ background:#e8f7ee; border-color:#79d29c; color:#1a7f37; }
.vote button.is-downvoted{ background:#fdeeee; border-color:#f2a3a3; color:#a40000; }
.vote .count { margin-left:0px;display:inline-block; text-align:center; font-size:13px; }


.item-left { display:flex; align-items:center; margin-right:8px; min-width:50px; }
.item-left .idx { font-size:12px; color:#828282; font-weight:bold; margin-right:2px; width:30px; text-align:center; }

.pager { margin-top:18px; }
.pager a { color:#828282; text-decoration:none; margin-right:10px; }
.pager a:hover { text-decoration:underline; }

/* New lighter filters UI */
.toolbar { margin-bottom:8px; display:flex; align-items:center; gap:10px; flex-wrap:wrap;margin-left:8px; margin-top:4px;}
.toolbar .spacer { flex:1; }
.chips {
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:0;
  padding:0;
  list-style:none; /* no bullets if it's a <ul> */
}

/* Base chip */
.chip{
  display:inline-flex;
  align-items:center;
  padding:6px 12px;
  border:1px solid #d5d7da;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
  color:#3f4856;
  text-decoration:none;
  background:#fff;
  transition:background .15s,border-color .15s,color .15s,box-shadow .15s,transform .05s;
}
.chip:hover{ background:#f8fafc; border-color:#c7cbd2; }
.chip:active{ transform:translateY(1px); }

/* Accessible focus */
.chip:focus{
  outline:none;
  box-shadow:0 0 0 2px #11182733, 0 0 0 4px #11182722;
}

/* Selected — bold & obvious */
.chip.active{
  background:#111827;
  color:#fff;
  border-color:#111827;
  box-shadow:none;
}

/* make sure you REMOVE any old conflicting rules like:
   .chip.active { background:#f6f6ef; border-color:#aaa; } */

.btn {
  border:1px solid #eee; background:#fff; padding:4px 10px;
  border-radius:14px; cursor:pointer; font-size:12px; color:#555; text-decoration:none;
}
.btn:hover { background:#f9f9f9; }

.pill { padding:2px 8px; border:1px solid #ccc; border-radius:14px; margin:0 6px 6px 0; display:inline-block; color:#555; text-decoration:none; }
.pill:hover { text-decoration:underline; }

.filters-drawer.open { display:block; }

details { margin:6px 0; }
details > summary {
  cursor:pointer; list-style:none; font-size:12px; color:#666; font-weight:600; text-transform:uppercase; letter-spacing:.02em;
}
details > summary::-webkit-details-marker { display:none; }
details[open] > summary { color:#444; }

.facet-collapsed .facet-item { display:none; }
.facet-collapsed .facet-item:nth-child(-n+8) { display:inline; }
.facet-toggle { margin-left:8px; color:#777; cursor:pointer; }

.summary-line { color:#666; font-size:12px;margin-left:8px;}


.item-subline { font-size:10px; color:#999; margin-top:2px; }
.item-subline a { color:#999; text-decoration:none; }
.item-subline a:hover { text-decoration:underline; }
.item-subline .sep { color:#bbb; margin:0 4px; }


.facet-nested .facet-nested { margin-left: 12px; }
.facet-list a { color:#828282; text-decoration:none; margin-right:10px; line-height:1.8; white-space:nowrap; }
.facet-list a:hover { text-decoration:underline; }


.facet-list label{
  display:inline-flex;           /* put checkbox + text on the same row */
  align-items:center;            /* vertically center both */
  gap:6px;                       /* space between box and text */
  line-height:1.2;               /* avoid tall lines pushing things off */
  font-size:12px;
  cursor:pointer;
}

.facet-list input[type="checkbox"]{
  margin:0;                      /* kill default top/bottom margins */
  vertical-align:middle;         /* extra help on older browsers */
  width:14px; height:14px;
}



/* Section wrapper */
.facet { margin:0px 0px; }

/* Summary looks like a button */
.facet summary {
  display:flex;
  align-items:center; 
  padding:8px 10px;
  font-size:12px; 
  font-weight:600; text-transform:uppercase; letter-spacing:.02em;
  cursor:pointer; list-style:none; user-select:none;
    border-top:1px solid #f1f1f1;
    border-bottom:1px solid #f1f1f1;
}
.facet summary:hover { background:#fafafa; }
.facet summary:focus { outline:2px solid #cbd5e1; outline-offset:2px; }
.facet summary::-webkit-details-marker { display:none; }

/* Chevron */
.facet summary::after{
  content:"▸";
  margin-left:auto; 
  transition:transform .15s ease-in-out;
  font-size:16px; 
}
.facet[open] summary::after { transform:rotate(90deg); }
.facet .facet-count {
  margin-left:4px; padding:2px 6px; border-radius:999px;
  background:#f3f4f6; color:#555; font-weight:600; font-size:11px;
  line-height:1; display:inline-block;
}


.facet-list { margin-top:6px; }
.facet .facet-list { 
    padding-left:4px;
    padding-top:8px;
    padding-bottom:8px;
   /* padding:8px 12px 10px;*/

}

/* Keep your existing checkbox alignment */
.facet .facet-list label{ display:inline-flex; align-items:center; gap:6px; line-height:1.2; font-size:12px; cursor:pointer; }
.facet .facet-list input[type="checkbox"]{ margin:0; width:14px; height:14px; }
.facet .facet-nested{ margin-left:8px; padding-left:8px; border-left:1px dotted #e0e0e0; }
.save-link.is-saved { font-weight:600; }