/* design.css — 링크 카드 공용 스타일 (다크 공통) */
.dl-links-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.dl-links-card{
  background:#101010;
  border:1px solid #262626;
  border-radius:14px;
  padding:14px 16px;
  box-shadow:0 4px 18px rgba(0,0,0,.6);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
  display:flex;flex-direction:column;gap:10px;position:relative;
}
.dl-links-card:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(0,0,0,.85);
  border-color:#3b63ff;
}
.dl-links-head{display:flex;align-items:center;gap:8px}
.dl-links-favicon{width:22px;height:22px;border-radius:5px;flex:0 0 auto}
.dl-links-name{font-weight:700;font-size:16px;color:#f5f5f5}
.dl-links-url{
  color:#3ea6ff;
  text-decoration:none;
  font-size:14px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
}
.dl-links-url:hover{text-decoration:underline}
.dl-links-title{
  color:#c8c8c8;
  font-size:13px;line-height:1.4;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:36px;
}

/* 썸네일 16:9 고정 */
.dl-links-thumb{
  position:relative;width:100%;aspect-ratio:16/9;
  overflow:hidden;border-radius:10px;
  background:#000;
  margin:0;margin-top:auto;
  display:flex;justify-content:center;align-items:center;
}
.dl-links-thumb img{width:100%;height:100%;object-fit:cover;display:block}

/* 북마크 버튼 */
.dl-bm{
  position:absolute;top:10px;right:10px;
  width:34px;height:34px;border-radius:50%;
  background:#111;color:#f5f5f5;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 2px 10px rgba(0,0,0,.7);
  display:flex;align-items:center;justify-content:center;
  padding:0;
  box-sizing:border-box;
  font-size:18px;
  line-height:0;
  cursor:pointer;z-index:2;
  transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease,color .15s ease;
}
.dl-bm-icon{
  display:block;
  position:relative;
  top:-3px;           /* 별을 살짝 위로 올려서 시각적 센터 맞추기 */
}

/* is-on 상태에서도 똑같이 고정 (아래로 쳐지는 현상 방지) */
.dl-bm.is-on .dl-bm-icon{
  top:-3px;
}

.dl-bm:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 22px rgba(0,0,0,.9);
  border-color:#3b63ff;
}
.dl-bm.is-on{background:#0b6cff;color:#fff;border-color:#0b6cff}


/* 태그 */
.dl-links-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.dl-tag{
  display:inline-block;
  font-size:12px;line-height:1;
  border:1px solid #333;
  background:#181818;
  border-radius:999px;
  padding:6px 8px;
  color:#e0e0e0;
}

/* 검색 페이지 보강 (다크 공통) */
.search-links-wrap{
  max-width:1170px;
  margin-top:73px;
  margin-bottom:68px;

  padding:0;
}
.sl-hdr{display:flex;align-items:center;justify-content:space-between;margin:8px 0 14px}
.sl-title{font-size:18px;font-weight:800;color:#f5f5f5}
.sl-meta{font-size:13px;color:#a6a6a6}
.sl-q{font-weight:700;margin-right:6px}
.sl-count{opacity:.9}
.sl-empty{padding:40px 0;color:#777;text-align:center}

/* 페이지네이션 다크 */
.sl-pg{
  margin:18px 0 30px;
  display:flex;flex-wrap:wrap;gap:8px;justify-content:center;
}
.sl-pg a{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:34px;padding:0 10px;
  border:1px solid #333;border-radius:8px;
  text-decoration:none;
  color:#e0e0e0;
  background:#111;
}
.sl-pg a.on{
  color:#fff;
  background:#0b6cff;
  border-color:#0b6cff;
}

/* ==============================
   1024px 이하 레이아웃/보정만
   ============================== */
@media(max-width:1024px){
  html,body{background:#000!important;}
  #container,#wrapper,#content{background:#000!important;padding:0!important;margin:0!important;}
  .search-links-wrap{max-width:none;margin:45px 0 0;padding:12px 10px 20px;}
  .search-links-wrap .sl-hdr{margin:4px 0 10px;padding:0 4px;}
  .search-links-wrap .dl-links-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;}
  .search-links-wrap .dl-links-card{border-radius:12px;padding:10px 10px 12px;}
  .search-links-wrap .dl-links-head{gap:6px;}
  .search-links-wrap .dl-links-name{font-size:14px;}
  .search-links-wrap .dl-links-url{font-size:12px;}
  .search-links-wrap .dl-links-title{font-size:12px;}
  .search-links-wrap .dl-links-tags{margin-top:4px;}
  .search-links-wrap .dl-tag{font-size:11px;padding:4px 7px;}
  .search-links-wrap .sl-pg{margin:16px 0 24px;}

  .dl-viewport{margin-top:20px!important;}


}




