/* ============================================================
   games_site — Mistake Bank / Review
   ============================================================ */

.rv-hero{
  padding:20px 16px; margin-bottom:16px; text-align:center;
  border-radius:var(--radius-lg);
  background:linear-gradient(145deg,rgba(124,58,237,.12),rgba(47,79,181,.06));
  border:1px solid rgba(124,58,237,.28);
}
.rv-hero-ic{ font-size:44px; margin-bottom:8px; filter:drop-shadow(0 6px 16px rgba(124,58,237,.34)); }
.rv-hero h2{ margin:0 0 5px; font-size:22px; font-weight:800; letter-spacing:-.4px; }
.rv-hero p{ margin:0; font-size:13.5px; color:var(--text-dim); line-height:1.55; }

.rv-cta{ margin-top:15px; }

.rv-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:16px; }
.rv-stat{
  padding:14px 5px; border-radius:var(--radius); text-align:center;
  background:var(--surface); border:1px solid var(--border);
}
.rv-stat .n{ font-size:22px; font-weight:800; letter-spacing:-.5px; }
.rv-stat .l{ font-size:10.5px; color:var(--text-dim); margin-top:2px; }
.rv-stat.due .n{ color:var(--purple-ink); }
.rv-stat.mast .n{ color:var(--green-ink); }

.rv-boxes{
  padding:14px 14px; margin-bottom:16px; border-radius:var(--radius);
  background:var(--surface); border:1px solid var(--border);
}
.rv-boxes h3{
  margin:0 0 11px; font-size:13px; font-weight:900;
  display:flex; align-items:center; justify-content:space-between;
}
.rv-boxes h3 small{ font-size:11px; font-weight:600; color:var(--text-dim); }
.rv-box-row{ display:flex; align-items:center; gap:9px; margin-bottom:7px; }
.rv-box-n{
  width:26px; flex:0 0 26px; text-align:center;
  font-size:11px; font-weight:800; color:var(--text-dim);
}
.rv-box-bar{ flex:1; height:20px; border-radius:7px; background:var(--surface-2); overflow:hidden; }
.rv-box-fill{
  height:100%; border-radius:7px; min-width:2px;
  transition:width .5s var(--ease);
}
.rv-box-fill.b1{ background:linear-gradient(90deg,#f87171,#dc2626); }
.rv-box-fill.b2{ background:linear-gradient(90deg,#fbbf24,#f59e0b); }
.rv-box-fill.b3{ background:linear-gradient(90deg,#a3e635,#84cc16); }
.rv-box-fill.b4{ background:linear-gradient(90deg,#4ade80,#16a34a); }
.rv-box-fill.b5{ background:linear-gradient(90deg,#34d399,#059669); }
.rv-box-c{
  width:34px; flex:0 0 34px; text-align:start;
  font-size:12px; font-weight:800; color:var(--text-dim);
}
.rv-box-legend{
  margin-top:10px; padding-top:9px; border-top:1px dashed var(--border);
  font-size:11.5px; color:var(--text-dim); line-height:1.55;
}

.rv-weak{ margin-bottom:16px; }
.rv-weak-row{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:11px 13px; margin-bottom:7px; border-radius:12px;
  background:var(--surface); border:1px solid var(--border);
}
.rv-weak-t{ font-size:13.5px; font-weight:700; }
.rv-weak-c{
  font-size:11.5px; font-weight:800; padding:3px 9px; border-radius:100px;
  background:rgba(124,58,237,.12); border:1px solid rgba(124,58,237,.25);
  color:var(--purple-ink); white-space:nowrap;
}

.rv-list{ margin-bottom:14px; }
.rv-item{
  display:flex; align-items:center; gap:11px;
  padding:12px 13px; margin-bottom:8px; border-radius:12px;
  background:var(--surface); border:1px solid var(--border);
}
.rv-item-box{
  width:30px; height:30px; flex:0 0 30px;
  display:flex; align-items:center; justify-content:center;
  border-radius:9px; font-size:11px; font-weight:900; color:#fff;
}
.rv-item-b{ flex:1; min-width:0; }
.rv-item-q{
  display:block; font-size:13.5px; font-weight:700;
  unicode-bidi:plaintext; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.rv-item-a{
  display:block; font-size:12px; color:var(--green-ink); margin-top:2px;
  unicode-bidi:plaintext;
}
.rv-item-due{ font-size:10.5px; color:var(--text-dim); margin-top:2px; display:block; }
.rv-item-x{
  flex:0 0 28px; width:28px; height:28px; border-radius:8px;
  background:var(--surface-2); border:1px solid var(--border);
  color:var(--text-dim); font-size:13px; cursor:pointer; font-family:inherit;
}

.rv-cap{
  padding:14px 14px; margin-bottom:16px; border-radius:var(--radius);
  background:linear-gradient(150deg,rgba(245,158,11,.10),transparent);
  border:1px dashed var(--gold);
}
.rv-cap-t{ font-size:14px; font-weight:900; margin-bottom:4px; }
.rv-cap-s{ font-size:12.5px; color:var(--text-dim); line-height:1.55; margin-bottom:10px; }
.rv-cap-bar{ height:7px; border-radius:100px; background:var(--border); overflow:hidden; margin-bottom:9px; }
.rv-cap-fill{
  height:100%; border-radius:100px;
  background:linear-gradient(90deg,var(--gold),var(--gold-d));
  transition:width .5s var(--ease);
}
.rv-cap-fill.is-full{ background:linear-gradient(90deg,#f87171,var(--red)); }

.rv-clear{ text-align:center; padding:40px 20px; }
.rv-clear-ic{ font-size:52px; margin-bottom:10px; }
.rv-clear h3{ margin:0 0 6px; font-size:18px; font-weight:900; }
.rv-clear p{ margin:0 0 16px; font-size:14px; color:var(--text-dim); line-height:1.6; }

.gs-tab{ position:relative; }
.gs-tab-badge{
  position:absolute; top:6px; inset-inline-end:calc(50% - 20px);
  min-width:17px; height:17px; padding:0 4px;
  display:flex; align-items:center; justify-content:center;
  border-radius:100px; background:var(--purple); color:#fff;
  font-size:10px; font-weight:800; line-height:1;
  box-shadow:0 2px 6px rgba(124,58,237,.4);
}