@charset "utf-8";

.latest-recommend {position:relative;color:var(--rb-ui-text,#1f2328)}
.latest-recommend .bbs_main_wrap_tit {display:flex!important;align-items:center;width:100%;margin-bottom:8px;box-sizing:border-box}
.latest-recommend .bbs_main_wrap_tit_l {float:none}
.latest-recommend .bbs_main_wrap_tit_l {width:100%;min-width:0}
.latest-recommend .bbs_main_wrap_tit_l a {display:flex;align-items:center;width:100%;min-width:0}
.latest-recommend .bbs_main_wrap_tit_l h2 {display:flex;align-items:center;gap:6px;width:100%;min-width:0;line-height:1.3}
.latest-recommend-title-icon {display:block;align-self:center;flex:0 0 30px;width:30px;height:30px;object-fit:contain;object-position:center}
.latest-recommend-title-text {display:block;overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}
.latest-recommend-grid {display:grid;grid-template-columns:repeat(var(--latest-cols, 1), minmax(0, 1fr));gap:12px;max-height:320px;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:transparent transparent}
.latest-recommend-grid::-webkit-scrollbar {width:6px}
.latest-recommend-grid::-webkit-scrollbar-track {background:transparent}
.latest-recommend-grid::-webkit-scrollbar-thumb {border-radius:999px;background:transparent}
.latest-recommend:hover .latest-recommend-grid,
.latest-recommend:focus-within .latest-recommend-grid {scrollbar-width:thin;scrollbar-color:var(--rb-ui-line,#e6e9ed) transparent}
.latest-recommend:hover .latest-recommend-grid::-webkit-scrollbar-thumb,
.latest-recommend:focus-within .latest-recommend-grid::-webkit-scrollbar-thumb {background:var(--rb-ui-line,#e6e9ed)}
@supports (overflow: overlay) {
    .latest-recommend-grid {overflow-y:overlay}
}
.latest-recommend-col {display:flex;flex-direction:column;min-width:0}
.latest-recommend-col + .latest-recommend-col {padding-left:12px;border-left:1px solid var(--rb-ui-line,#e6e9ed)}
.latest-recommend-item {border-top:1px solid #f0f2f4;box-sizing:border-box}
.latest-recommend-row {display:grid;grid-template-columns:22px minmax(0,1fr) 20px;align-items:center;gap:4px;width:100%;min-height:32px;padding:4px 0;box-sizing:border-box;color:var(--rb-ui-text,#1f2328)}
.latest-recommend.has-hit .latest-recommend-row {grid-template-columns:22px minmax(0,1fr) auto 20px}
.latest-recommend.has-rank .latest-recommend-row {grid-template-columns:22px 24px minmax(0,1fr) 20px}
.latest-recommend.has-rank.has-hit .latest-recommend-row {grid-template-columns:22px 24px minmax(0,1fr) auto 20px}
.latest-recommend-subject:hover {color:var(--rb-main-color)}
.latest-recommend-rank {display:inline-flex;align-items:center;justify-content:center;width:22px;height:20px;color:#777;font-family:"Roboto",sans-serif;font-size:13px;font-weight:700}
.latest-recommend-rank.top {color:var(--rb-main-color);font-size:15px;font-style:italic}
.latest-recommend-move {display:inline-flex;align-items:center;justify-content:center;min-width:24px;color:var(--rb-ui-muted,#8a919b);font-size:11px;font-weight:600;line-height:1;white-space:nowrap}
.latest-recommend-move.new,
.latest-recommend-move.up {color:#ff5a5a}
.latest-recommend-move.down {color:#3f86d9}
.latest-recommend-subject {display:flex;align-items:center;gap:5px;min-width:0;overflow:hidden;color:var(--rb-ui-text,#1f2328);font-size:13px;line-height:1.35;white-space:nowrap;text-decoration:none;text-overflow:ellipsis}
.latest-recommend-subject .rb-site-icon {width:16px;height:16px;border-radius:4px;object-fit:cover;flex:0 0 auto}
.latest-recommend-subject .rb-site-icon-text {display:block;min-width:0;overflow:hidden;text-overflow:ellipsis}
.latest-recommend-comment {margin-left:6px;color:var(--rb-main-color);font-weight:700}
.latest-recommend-meta {display:flex;align-items:center;flex-shrink:0;gap:3px;color:var(--rb-ui-muted,#8a919b);font-size:12px;white-space:nowrap}
.latest-recommend-meta i {color:#aaa}
.latest-recommend-post-link {display:flex;align-items:center;justify-content:center;width:20px;height:20px;color:var(--rb-ui-muted,#8a919b);opacity:0;visibility:hidden;transition:opacity .15s ease;text-decoration:none}
.latest-recommend-post-link svg {display:block;width:16px;height:16px}
.latest-recommend-item:hover .latest-recommend-post-link,
.latest-recommend-post-link:focus-visible {opacity:1;visibility:visible}
.latest-recommend .no_data {width:100%;margin:0;padding:14px 0 12px!important;border-top:1px solid #f0f2f4;border-bottom:0;color:var(--rb-ui-muted,#8a919b);font-size:12px;line-height:1.5;text-align:center}
@media (max-width: 768px) {
    .latest-recommend-grid {grid-template-columns:repeat(var(--latest-mo-cols, 1), minmax(0, 1fr));gap:0}
    .latest-recommend-col + .latest-recommend-col {padding-left:0;border-left:0}
    .latest-recommend-row {grid-template-columns:22px minmax(0,1fr) 20px}
    .latest-recommend-meta {grid-column:2;margin-top:-2px}
    .latest-recommend.has-rank .latest-recommend-meta {grid-column:3}
    .latest-recommend-post-link {opacity:1;visibility:visible}
}
