/* v2.17 북리뷰 MAIN — 첫 화면처럼 NEW(최신순) | BEST 두 칸 (2026-11-04 이상준님)
   「리뷰 메인을 플로스 메인처럼 최신순과 NEW와 BEST 두 가지를 동시에 볼 수 있는 구조로 … 베스트는 보상순 도움순 두 가지로 버튼을 나눠서 … 휴대폰에서도 양쪽으로 다 보이게」
   - 줄(.rv2-row)은 예전 리뷰 줄(.rv-row)의 색 돌려쓰기·왼쪽 띠를 그대로 가져와 좁은 칸에 맞게 줄였다
   - 두 칸은 휴대폰에서도 나란히(좁아서 글자만 줄임) */
.rv2-boards{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;
  max-width:1120px;margin:0 auto 14px;align-items:start;scroll-margin-top:12px;
}
.rv2-board{
  min-width:0;padding:12px 12px 10px;border-radius:20px;border:1.5px solid #f1dfe6;
  background:linear-gradient(160deg,#fff7fa 0%,#fffdfd 40%);box-shadow:0 10px 24px rgba(214,140,160,.13);
}
.rv2-best{border-color:#f3e6bf;background:linear-gradient(160deg,#fff9e8 0%,#fffefb 40%)}
.rv2-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px;padding:0 2px}
.rv2-badgeimg{width:34px;height:34px;object-fit:contain;flex:none}
.rv2-head h2{margin:0;font-family:var(--font-serif);font-size:19px;letter-spacing:.1em;color:#3b2a3f}
.rv2-sub{margin-left:auto;font-size:12px;color:#8a8175}
.rv2-tabs{display:flex;gap:5px;margin-left:auto}
.rv2-tabs a{
  display:inline-flex;align-items:center;gap:5px;padding:4px 12px 4px 7px;border-radius:999px;
  border:1.5px solid #e6d7a8;background:#fffdf5;color:#6d6252;font-size:12.5px;font-weight:700;white-space:nowrap;
}
.rv2-tabs a img{width:20px;height:20px;object-fit:contain}
.rv2-tabs a.on{background:#3a3128;border-color:#3a3128;color:#fff8ea}

.rv2-list{list-style:none;margin:0;padding:0}
.rv2-row{
  --c:#ef4c68;--cl:#fff2f5;--cd:#cf3d58;--cs:rgba(236,67,96,.14);
  position:relative;margin:0 0 12px;padding:11px 11px 9px 17px;
  border:1.5px solid color-mix(in srgb,var(--c) 50%,#fff);border-radius:14px;
  background:linear-gradient(150deg,var(--cl) 0%,#fff 48%,#fffdfa 100%);
  box-shadow:0 3px 0 color-mix(in srgb,var(--cd) 65%,#fff),0 8px 16px var(--cs);
}
.rv2-row::before{
  content:"";position:absolute;left:6px;top:11px;bottom:11px;width:4px;border-radius:999px;
  background:linear-gradient(180deg,#fff 0%,var(--c) 20%,var(--c) 80%,#fff 100%);
}
.rv2-list > .rv2-row:nth-child(5n+2){--c:#3b86ec;--cl:#eef6ff;--cd:#2e70c8;--cs:rgba(63,137,232,.14)}
.rv2-list > .rv2-row:nth-child(5n+3){--c:#28a77a;--cl:#ecfbf3;--cd:#218661;--cs:rgba(37,166,120,.13)}
.rv2-list > .rv2-row:nth-child(5n+4){--c:#8759d2;--cl:#f5f0ff;--cd:#7045ba;--cs:rgba(134,86,211,.13)}
.rv2-list > .rv2-row:nth-child(5n+5){--c:#dc8d18;--cl:#fff7e2;--cd:#bc7410;--cs:rgba(225,146,24,.14)}

.rv2-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.rv2-title{
  min-width:0;font-family:var(--font-serif);font-size:16.5px;line-height:1.35;color:#2c2230;word-break:keep-all;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.rv2-badge{
  flex:none;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:800;white-space:nowrap;
  background:#f3eef7;color:#6b5a85;
}
.rv2-badge.cp{background:linear-gradient(180deg,#fff3c9,#ffe39a);border:1px solid #f0cf73;color:#8a5b07}
.rv2-badge.help{background:#e7f6ee;border:1px solid #b9e3cd;color:#217a52}
.rv2-by{margin:4px 0 6px;font-size:12px;line-height:1.4;color:#8a8175;display:flex;gap:6px;flex-wrap:wrap}
.rv2-nick{font-weight:700;color:var(--cd)}
.rv2-book{color:#7a7060;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.rv2-book span{color:#a39a8b}
.rv2-quote{margin:0 0 6px;font-size:13px;line-height:1.5;color:var(--cd);font-weight:600;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rv2-row .row-preview{margin:0}
.rv2-row .row-body{font-size:13.5px;line-height:1.55;color:#413c42;max-height:4.65em;overflow-y:auto;white-space:pre-wrap;word-break:break-word}
.rv2-row .row-track{background:rgba(43,38,34,.11)}
.rv2-row .row-thumb{background:var(--c)}
.rv2-meta{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;margin-top:7px;font-size:11.5px;color:#8a8175}
.rv2-cp{padding:1px 8px;border-radius:999px;font-weight:800;color:#8a5b07;background:linear-gradient(180deg,#fff3c9,#ffe39a);border:1px solid #f0cf73}

.rv2-pager{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:4px;font-size:12.5px}
.rv2-pager a{padding:4px 12px;border:1.5px solid #d8c9a8;border-radius:999px;background:#fffdf8;color:#3a3128}
.rv2-pager .off{padding:4px 12px;color:#c5bdae}
.rv2-pager strong{color:#3a3128}
.rv2-board .rv-empty{padding:20px 6px 10px}
.rv2-board .rv-empty img{width:110px}

/* 휴대폰 — 두 칸 그대로 나란히. 글자·여백만 줄인다 */
@media (max-width:759px){
  .rv2-boards{gap:7px;margin:0 -4px 12px}
  .rv2-board{padding:8px 7px 7px;border-radius:15px}
  .rv2-head{gap:5px;margin-bottom:7px}
  .rv2-badgeimg{width:24px;height:24px}
  .rv2-head h2{font-size:14.5px;letter-spacing:.07em}
  .rv2-sub{font-size:10.5px}
  .rv2-tabs{width:100%;margin:0;gap:3px}
  .rv2-tabs a{flex:1;justify-content:center;padding:3px 4px;font-size:10.5px;gap:3px}
  .rv2-tabs a img{width:13px;height:13px}
  .rv2-row{margin-bottom:9px;padding:8px 7px 6px 12px;border-radius:11px}
  .rv2-row::before{left:4px;top:8px;bottom:8px;width:3px}
  .rv2-top{flex-direction:column;gap:3px}
  .rv2-title{font-size:13px;-webkit-line-clamp:3}
  .rv2-badge{font-size:10px;padding:1px 6px}
  .rv2-by{margin:3px 0 4px;font-size:10.5px;gap:1px 5px}
  .rv2-quote{font-size:11px;-webkit-line-clamp:2;margin-bottom:4px}
  .rv2-row .row-body{font-size:11.5px;line-height:1.5;max-height:4.5em}
  .rv2-meta{font-size:10px;gap:3px 6px;margin-top:5px}
  .rv2-cp{padding:0 6px}
  .rv2-pager{gap:6px;font-size:10.5px}
  .rv2-pager a,.rv2-pager .off{padding:3px 7px}
  .rv2-board .rv-empty p{font-size:12px}
  .rv2-board .rv-empty img{width:80px}
}

/* v2.40 BEST editor/model review picks: fixed positions before rewarded/helpful rankings */
.rv2-list > .rv2-row.is-editor-pick{--c:#b77b19;--cl:#fff7dd;--cd:#8a5b12;--cs:rgba(183,123,25,.14);border-color:#d6ad68;background:linear-gradient(145deg,#fff4d1,#fffdf7 68%);box-shadow:0 3px 0 #deb96e,0 8px 16px rgba(183,123,25,.14)}
.rv2-featured-tag{display:inline-flex;align-items:center;max-width:100%;border:1px solid #e3be70;border-radius:999px;background:#ffefbe;color:#78500d;font-weight:800;font-size:11.5px;padding:3px 9px;margin-bottom:6px}
@media (max-width:759px){.rv2-featured-tag{font-size:9.5px;padding:3px 6px;line-height:1.3;white-space:normal}}
