:root{
  --divider:#e8e6e0;
  --accent:#e94b22;
}
.reviews-wrap{ margin: 30px 0;}

.pickup-box{ background:#fff9ed; border:2px solid #fecc63; padding:20px 20px 5px;}
.pickup-label{ display:inline-block; background:#fecc63; font-size:17px; font-weight:bold; padding:2px 12px; border-radius:5px 5px 0 0;}
.pickup-box .review-item{ padding:0 0 20px;}
.pickup-box .review-item + .review-item{ border-top:1px solid rgba(0,0,0,0.08); padding-top:20px;}

.review-list .review-item{ padding:20px 0; border-bottom:1px solid var(--divider);}
.review-list .review-item:first-child{border-top:1px solid var(--divider);}
.review-head{ display:flex; align-items:center; gap:12px; margin-bottom:10px; flex-wrap:wrap;}

.avatar{ width:36px; height:36px; border-radius:50%; background:#d9d9d9; flex-shrink:0; display:flex; align-items:center; justify-content:center;}
.avatar svg{ width:20px; height:20px; fill:#aaa;}
.review-date{ font-weight: bold; min-width:80px;}

.stars{ display:inline-flex; gap:2px; font-size:16px; line-height:1;}
.star{ position:relative; display:inline-block; width:1em; color:#dedede;}
.star .fill{ position:absolute; top:0; left:0; overflow:hidden; color:#f5a623; white-space:nowrap;}

.rating-num{ font-size:17px; color:#f5a623; font-weight:bold;}
.review-tag{ margin-left:auto; background:#666; color:#fff; font-size:12px; padding:4px 10px;}
.review-body{ margin:0; white-space:pre-wrap; word-break:break-word;}

.action-btns{ display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:32px;}
.action-btn{ display:inline-flex; align-items:center; gap:8px; border:none; font-size:16px; font-weight:bold; padding:12px 26px; border-radius:24px; cursor:pointer; transition:background .15s ease, color .15s ease, border-color .15s ease, transform .1s ease;}
.action-btn:active{ transform:scale(0.97); }
.action-btn:focus-visible{outline:3px solid #333;outline-offset:2px;}
.action-btn svg{ width:16px; height:16px;}

.action-btn.primary{background:var(--accent); color:#fff;}
.action-btn.primary:hover, .action-btn.quiet:hover, .action-btn.outline:hover{opacity: 0.7; transition:.3s;}
.action-btn.outline{background:#fff; color:var(--accent); border:1px solid var(--accent);}
.action-btn.quiet{background:transparent; border:1px solid #dedede;}

.all-shown-msg{ text-align:center; font-size:14px; margin-top:32px;}

.student-reviews-heading{
  color:#333333;
  background:#D3DBDC;
  height:30px;
  display:flex;
  font:normal normal bold 13px/20px Meiryo, sans-serif;
  margin:0;
}
.student-reviews-heading span{
  padding:5px 11px;
}
.student-reviews-note{
  margin:6px 0 0;
  font-size:12px;
  color:#666;
  line-height:1.5;
  text-align:right;
}
.show-item .student-reviews-note{
  margin:6px 12px 0;
}
/* tighten space under note before reviews-wrap */
.student-reviews-note + [data-course-reviews-root] .reviews-wrap,
.student-reviews-note + .reviews-wrap{
  margin-top:8px;
}

.show-item .reviews-wrap{ margin: 8px 0 24px;}
.show-item .pickup-box{ padding: 16px 12px 5px;}