:root{
  --kht-radius: 16px;
  --kht-border: rgba(0,0,0,0.10);
  --kht-muted: rgba(0,0,0,0.62);
  --kht-bg: #fff;
  --kht-surface: #fafafa;
  --kht-shadow: 0 10px 25px rgba(0,0,0,0.04);
}

/* Page */
.kht-page{max-width:1200px;margin:0 auto;padding:16px;}

/* Search bar */
.kht-filters{ margin-bottom:0; }
.kht-filters .form-item{margin:0;}
.kht-filters .form-item-q label{
  display:block;
  margin-bottom:6px;
  font-size:.85rem;
  color:var(--kht-muted);
}
.kht-filters .form-item-q input[type="text"]{
  width:100%;
  height:44px;
  border-radius:12px;
  border:1px solid var(--kht-border);
  padding:10px 14px;
  font-size:1rem;
  box-sizing:border-box;
  transition:border-color 150ms ease, box-shadow 150ms ease;
}
.kht-filters .form-item-q input[type="text"]:focus{
  outline:none;
  border-color:rgba(0,0,0,0.28);
  box-shadow:0 0 0 3px rgba(0,0,0,0.06);
}

/* Advanced filters container */
.kht-advanced{
  margin-top:12px;
  margin-bottom:0;
}
.kht-advanced-details summary{cursor:pointer;user-select:none;}
.kht-pills-wrap{padding-top:8px;}

/* Pill group */
.kht-pillgroup{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:8px;
  align-items:center;
}

/* JS-rendered pill labels  (<label class="kht-pill-label"> wrapping a hidden <input>) */
.kht-pill-label{
  display:inline-flex;
  align-items:center;
  gap:5px;
  border:1px solid var(--kht-border);
  background:rgba(0,0,0,0.02);
  border-radius:999px;
  padding:7px 13px;
  font-size:.88rem;
  line-height:1;
  cursor:pointer;
  transition:filter 130ms ease, border-width 130ms ease, font-weight 130ms ease;
  white-space:nowrap;
  user-select:none;
}
.kht-pill-label input[type="checkbox"]{
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  overflow:hidden;
  pointer-events:none;
}
.kht-pill-label:hover{ filter:brightness(0.96); }
.kht-pill-label.is-active{
  filter:brightness(0.72) saturate(2);
  font-weight:600;
  border-width:2px;
  padding:6px 12px; /* compensate for thicker border */
}
.kht-pill-label.is-active::before{
  content:'\2713\00a0';
  font-size:.8em;
  opacity:.9;
}

/* Spacing above results */
#kht-results-wrapper{ margin-top:20px; }

/* Card wrapper */
.kht-card{
  border:1px solid rgba(0,0,0,0.08);
  border-radius:var(--kht-radius);
  background:var(--kht-bg);
  overflow:hidden;
  box-shadow:var(--kht-shadow);
}
.kht-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}

/* Table */
table.kht-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:.95rem;
}
table.kht-table thead th{
  position:sticky;
  top:0;
  z-index:1;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:.78rem;
  background:var(--kht-surface);
  border-bottom:1px solid rgba(0,0,0,0.08);
  padding:14px 16px;
  white-space:nowrap;
}
table.kht-table tbody td{
  padding:14px 16px;
  border-bottom:1px solid rgba(0,0,0,0.06);
  vertical-align:top;
}
table.kht-table tbody tr:hover{background:rgba(0,0,0,0.015);}

/* Sort button */
.kht-sortbtn{
  background:transparent;
  border:0;
  padding:0;
  margin:0;
  cursor:pointer;
  color:inherit;
  font:inherit;
  text-transform:inherit;
  letter-spacing:inherit;
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.kht-sortbtn:hover{ text-decoration:underline; }
.kht-sortbtn.is-active{ font-weight:700; }
.kht-sorticon{font-size:.85em;opacity:.7;}

/* Taxonomy badges / tags */
.kht-badge, .kht-tag{
  display:inline-block;
  padding:4px 10px;
  border-radius:999px;
  font-size:.78rem;
  line-height:1.2;
  white-space:nowrap;
  border:1px solid rgba(0,0,0,0.10);
}
.kht-tags{display:flex;flex-wrap:wrap;gap:6px;}

/* Website chip */
.kht-linkchip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,0.10);
  background:rgba(0,0,0,0.02);
  font-size:.85rem;
  text-decoration:none;
}
.kht-linkchip:hover{text-decoration:underline;}

.kht-heartbeat{opacity:.92;line-height:1.35;max-width:56ch;}

/* Pager */
.kht-pager{
  padding:14px 16px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.kht-pagebtn{
  border:1px solid #d0d0d0;
  background:#ffffff;
  color:#333333;
  border-radius:10px;
  padding:7px 13px;
  cursor:pointer;
  font-size:0.9rem;
  font-weight:400;
  line-height:1.2;
  text-shadow:none;
  box-shadow:none;
  transition:background 100ms ease, border-color 100ms ease;
}
.kht-pagebtn:hover{
  background:#f0f0f0;
  border-color:#b0b0b0;
  color:#111111;
}
.kht-pagebtn[disabled]{
  opacity:0.38;
  cursor:not-allowed;
  pointer-events:none;
}
.kht-pagebtn.is-active{
  background:#1a1a1a;
  border-color:#1a1a1a;
  color:#ffffff;
  font-weight:600;
}
.kht-pager-spacer{color:#888;padding:0 4px;line-height:1;}
.kht-pager-count{color:#888;font-size:.85rem;margin-left:4px;}

/* Mobile cards */
@media (max-width:720px){
  .kht-filters .form-item-q input[type="text"]{font-size:.95rem;}

  table.kht-table thead{display:none;}
  table.kht-table,
  table.kht-table tbody,
  table.kht-table tr,
  table.kht-table td{display:block;width:100%;}
  table.kht-table tr{padding:14px 16px;border-bottom:1px solid rgba(0,0,0,0.06);}
  table.kht-table tbody td{border:0;padding:10px 0;}
  table.kht-table tbody td::before{
    content:attr(data-label);
    display:block;
    font-size:.75rem;
    text-transform:uppercase;
    letter-spacing:.04em;
    opacity:.65;
    margin-bottom:4px;
  }
  .kht-tags{gap:8px;}
}