*{box-sizing:border-box}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;margin:0;padding:16px;background:#fafafa;color:#222}
header h1{margin:0 0 8px 0;font-size:22px}
header p{margin:0 0 12px 0;color:#555}
.search-box{display:flex;flex-direction:column;gap:8px;margin:8px 0 4px}
.search-box input{padding:10px 12px;border:1px solid #ddd;border-radius:10px;font-size:16px;outline:none}
.search-box input:focus{border-color:#999;box-shadow:0 0 0 3px rgba(0,0,0,.05)}
.tips{font-size:12px;color:#777}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.chip{border:none;background:#eee;border-radius:999px;padding:6px 10px;font-size:12px;cursor:pointer}
.chip:hover{background:#e0e0e0}
.results{overflow:auto;background:#fff;border:1px solid #eee;border-radius:12px;padding:8px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{border-bottom:1px solid #f0f0f0;padding:8px 10px;text-align:left;vertical-align:top}
th{position:sticky;top:0;background:#fff;z-index:1}
tr:hover{background:#fafcff}
mark{background:#ffeb99;padding:0 2px;border-radius:3px}
#count{margin:8px 0 0;color:#666;font-size:12px}


.synonyms-panel{margin:8px 0 12px}
.syn-wrap{border:1px dashed #ddd; padding:10px; border-radius:12px; background:#fff}
.syn-stats{display:flex; gap:8px; align-items:center; margin-top:8px; font-size:12px; color:#555}


.data-panel{margin:8px 0 12px}


/* Extra hover support if used with older index */
.item{ transition: background-color .25s ease, color .25s ease, transform .12s ease, box-shadow .25s ease, border-color .25s ease; }
.item:hover{ background:#ff6400; color:#fff; border-color:#ff6400; box-shadow:0 6px 16px rgba(0,144,164,.18); }
.item:hover .muted,.item:hover .meta,.item:hover .code{ color:#fff; }
.item:active{ transform: scale(.985); }


/* Transparent hover support */
.item{
  transition: background-color .25s ease, color .25s ease, transform .12s ease, 
              box-shadow .25s ease, border-color .25s ease;
}
.item:hover{
  background:rgba(0,144,164,0.85);
  color:#fff;
  border-color:#ff6400;
  box-shadow:0 6px 16px rgba(0,144,164,0.25);
}
.item:hover .muted,.item:hover .meta,.item:hover .code{ color:#fff; }
.item:active{ transform: scale(.985); }

hr{display:none!important;}


/* Modal popup styles */
.modal {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.4);
}
.modal-content {
  background: #fff;
  margin: 10% auto;
  padding: 20px;
  border-radius: 8px;
  max-width: 600px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.2);
}
.close {
  float: right;
  font-size: 22px;
  cursor: pointer;
}
#copyCode {
  margin-top: 15px;
  padding: 8px 16px;
  background: #ff6400;
  color: #fff;
  border: none;
  border-radius: 6px;
  cursor: pointer;
}