:root{
  --rcolor:#ff8c00;
  --rmuted:#cfcfcf;
  --rbg:#f5f5f5;
  --rborder:rgba(0,0,0,.08);
}

.rwrap{ margin-top:18px; font-family: inherit; }

/* 顶部条 */
.rbar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; background:var(--rbg); border-radius:10px;
  padding:12px; text-decoration:none !important; color:inherit;
}
.rbarleft{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.rbartext{ font-size:14px; color:rgba(0,0,0,.75); }
.rbarright{ display:flex; align-items:center; gap:10px; color:rgba(0,0,0,.55); }
.rbardate{ font-size:13px; }
.rbararrow{ font-size:22px; line-height:1; }

/* 半星 */
.rstars{ display:inline-flex; gap:2px; line-height:1; }
.rstar{ font-size:16px; position:relative; display:inline-block; color:var(--rmuted); }
.rstar::before{
  content:"★"; position:absolute; left:0; top:0;
  width:0%; overflow:hidden; color:var(--rcolor);
}
.rstar[data-fill="100"]::before{width:100%;}
.rstar[data-fill="50"]::before{width:50%;}
.rstar[data-fill="0"]::before{width:0%;}

/* 主卡片 */
.rcard{
  margin-top:12px; border:1px solid var(--rborder);
  border-radius:12px; background:#fff; padding:14px 14px 12px;
}
.rcardtitle{ font-weight:700; font-size:14px; margin-bottom:10px; }

.rmain{ display:flex; gap:14px; align-items:stretch; }
.rmainleft{ min-width:92px; }
.ravgnum{ font-size:34px; font-weight:800; line-height:1.05; }
.ravgstars{ margin-top:6px; }

.rmaindist{ flex:1; padding-top:4px; }
.rdrow{ display:flex; align-items:center; gap:10px; margin:6px 0; }
.rdlabel{ width:32px; font-size:12px; color:rgba(0,0,0,.6); text-align:right; }
.rdbar{ position:relative; height:8px; flex:1; border-radius:999px; overflow:hidden; }
.rdbarbg{ position:absolute; inset:0; background:#e6e6e6; }
.rdbarfg{ position:absolute; inset:0 auto 0 0; background:var(--rcolor); width:0%; }

.rbtns{ margin-top:12px; display:flex; gap:10px; }
.rbtn{
  appearance:none; border:1px solid rgba(0,0,0,.12);
  background:#000; border-radius:999px; padding:8px 14px;
  cursor:pointer; font-size:14px;
}
.rbtn.on{ border-color:var(--rcolor); color:var(--rcolor); }
.rbtn:disabled{ opacity:.6; cursor:not-allowed; }

/* 显示评语 */
.rshowcomments{
  display:inline-block;
  margin-top:10px;
  font-size:13px;
  color:rgba(0,0,0,.65);
  text-decoration:none;
}
.rshowcomments:hover{ color:rgba(0,0,0,.85); }

/* 弹窗 */
.rmodal{
  position:fixed; z-index:99999; inset:0;
  background:rgba(0,0,0,.45); padding:18px;
}
.rmodalcard{
  max-width:520px; margin:10vh auto 0;
  background:#fff; border-radius:14px;
  box-shadow:0 14px 40px rgba(0,0,0,.22);
  padding:14px 14px 12px;
}
.rmodaltop{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.rmodaltitle{ font-weight:800; font-size:16px; }
.rclose{
  border:none; background:transparent; font-size:22px;
  cursor:pointer; line-height:1; padding:2px 8px 8px 8px;
  color:rgba(0,0,0,.6);
}

.rpick{
  display:inline-flex; gap:6px; padding:8px 6px;
  border-radius:12px; background:rgba(0,0,0,.03);
}
.rpickstar{ font-size:28px; cursor:pointer; color:var(--rmuted); }
.rpickstar.on{ color:var(--rcolor); }

.rcomment{
  width:100%; margin-top:10px; min-height:90px;
  border-radius:12px; border:1px solid rgba(0,0,0,.12);
  padding:10px 12px; font-size:14px; outline:none;
}

.ractions{ margin-top:10px; display:flex; align-items:center; gap:12px; justify-content: flex-end;}
.rsubmit{
  border:none; background:var(--rcolor); color:#fff;
  border-radius:12px; padding:10px 14px;
  cursor:pointer; font-weight:800;
}
.rmsg{ font-size:13px; color:rgba(0,0,0,.65); }

/* 登录提示 */
.rlogintext{ font-size:14px; color:rgba(0,0,0,.75); margin:8px 0 2px; }
.rloginbtn{
  display:inline-block; background:var(--rcolor); color:#fff !important;
  border-radius:12px; padding:10px 14px; font-weight:800; text-decoration:none !important;
}

/* 评语列表 */
.rcommentloading,.rcommentempty{ padding:10px 2px; color:rgba(0,0,0,.65); font-size:13px; }
.rcommentitems{ display:flex; flex-direction:column; gap:10px; margin-top:4px; }
.rcommentitem{ display:flex; gap:10px; padding:10px; border:1px solid var(--rborder); border-radius:12px; }
.rciavatar img{ border-radius:999px; }
.rcibody{ flex:1; }
.rcitop{ display:flex; align-items:center; gap:10px; }
.rcidate{ font-size:12px; color:rgba(0,0,0,.55); }
.rcitxt{ margin-top:6px; font-size:14px; color:rgba(0,0,0,.75); word-break:break-word; }

/* pager */
.rpager{ display:flex; gap:6px; align-items:center; margin-top:10px; flex-wrap:wrap; }
.rpagebtn,.rpageprev,.rpagenext{
  border:1px solid rgba(0,0,0,.12); background:#000;
  border-radius:10px; padding:6px 10px; cursor:pointer; font-size:13px;
}
.rpagebtn.on{ border-color:var(--rcolor); color:var(--rcolor); }
.rpagegap{ color:rgba(0,0,0,.5); padding:0 4px; }
.rpageprev:disabled,.rpagenext:disabled{ opacity:.5; cursor:not-allowed; }

/* ===== 短代码榜单 ===== */
.rboard{ margin:14px 0; }
.rfilters{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
.rflabel{ font-size:13px; color:rgba(0,0,0,.65); }
.rfitem{
  border:1px solid rgba(0,0,0,.12); background:#000;
  border-radius:999px; padding:6px 10px; cursor:pointer; font-size:13px;
}
.rfitem.on{ border-color:var(--rcolor); color:var(--rcolor); }
.rboardloading,.rboardempty{ color:rgba(0,0,0,.65); padding:8px 2px; font-size:13px; }

.rboardol{ margin:0; padding-left:18px; }
.rboardli{
  display:flex; align-items:center; gap:10px;
  padding:8px 0;
}
.rboarda{ flex:1; text-decoration:none; color:inherit; }
.rboarda:hover{ text-decoration:underline; }
.rboardscore{ font-weight:800; }
.rboardstars .rstars{ transform:translateY(1px); }