/* Sorta Stupid - extras on single reaction pages (up next, merch, roulette). */

/* The fixed header overlapped the top ~16px of video-page content (the
   season selector label was half-hidden). Give both columns breathing room. */
body .entry__column--left,body .entry__column--right{padding-top:20px !important}

/* Keep watching (series / franchise in watch order) */
.ss-keepwatch{margin:26px 0 8px}
.ss-keepwatch h3{font-size:18px;margin:0 0 12px;color:#fff}
.ss-kwrow{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity}
.ss-kwitem{flex:0 0 210px;text-decoration:none;color:inherit;scroll-snap-align:start}
.ss-kwimg{position:relative;display:block;aspect-ratio:16/9;border-radius:8px;background:#1a1a20 center/cover no-repeat}
.ss-kwitem:hover .ss-kwimg{outline:2px solid #7b2ff2}
.ss-kwitem.cur .ss-kwimg{outline:2px solid #7b2ff2;box-shadow:0 0 14px rgba(123,47,242,.5)}
.ss-kwnum{position:absolute;left:6px;top:6px;background:rgba(10,8,16,.85);color:#fff;font-size:11.5px;font-weight:800;
  border-radius:6px;padding:2px 7px}
.ss-kwcur{position:absolute;right:6px;bottom:6px;background:#7b2ff2;color:#fff;font-size:10.5px;font-weight:800;
  border-radius:6px;padding:2px 7px}
.ss-kwt{display:block;font-size:13px;line-height:1.35;margin-top:6px;color:#e8e8ee;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Merch shelf */
.ss-merchshelf{margin:26px 0 8px}
.ss-merchrow{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px}
.ss-merchitem{flex:0 0 132px;text-decoration:none;color:inherit}
.ss-merchimg{display:block;width:132px;height:132px;border-radius:10px;background:#1a1a20 center/cover no-repeat}
.ss-merchitem:hover .ss-merchimg{outline:2px solid #7b2ff2}
.ss-merchname{display:block;font-size:12.5px;color:#e8e8ee;margin-top:6px;line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ss-merchprice{display:block;font-size:12px;color:#9a9aa2;margin-top:2px}

/* Roulette bar */
.ss-roulbar{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;z-index:9500;
  display:flex;align-items:center;gap:12px;background:rgba(18,14,28,.95);border:1px solid #3a2f55;
  border-radius:26px;padding:9px 12px 9px 16px;box-shadow:0 8px 26px rgba(0,0,0,.5);backdrop-filter:blur(6px)}
.ss-roulbadge{font-weight:800;font-size:14px;color:#fff;white-space:nowrap}
.ss-roultxt{color:#b9b3cc;font-size:12.5px;white-space:nowrap;text-transform:capitalize}
.ss-roulnext{background:#7b2ff2;color:#fff;border:none;border-radius:18px;padding:8px 16px;
  font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap}
.ss-roulnext:hover{background:#8f4bf5}
.ss-roulstop{background:none;border:none;color:#8a8398;font-size:18px;cursor:pointer;line-height:1;padding:2px 6px}
.ss-roulstop:hover{color:#fff}
@media (max-width:640px){
  .ss-roulbar{left:8px;right:8px;transform:none;justify-content:space-between}
  .ss-roultxt{display:none}
}

/* Homepage roulette strip */
.ss-roulsec{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:linear-gradient(90deg,#1d1430,#14101f);border:1px solid #2c2344;border-radius:12px;padding:14px 18px}
.ss-roulsec .ss-roulhead{margin-right:auto}
.ss-roulsec .ss-roulhead b{display:block;font-size:16px;color:#fff}
.ss-roulsec .ss-roulhead span{font-size:12.5px;color:#9a92b2}
.ss-roulbtn{display:inline-flex;align-items:center;gap:8px;background:#7b2ff2;color:#fff;border:none;
  border-radius:20px;padding:10px 18px;font-size:13.5px;font-weight:700;cursor:pointer;white-space:nowrap}
.ss-roulbtn:hover{background:#8f4bf5}
.ss-roulbtn.alt{background:#232036;border:1px solid #3a2f55}
.ss-roulbtn.alt:hover{background:#2c2743}
.ss-roulgenre{background:#141118;color:#ddd;border:1px solid #3a2f55;border-radius:10px;padding:9px 10px;font-size:13px}
@media (max-width:640px){
  .ss-roulsec{padding:12px}
  .ss-roulsec .ss-roulhead{flex:1 1 100%}
  .ss-roulbtn{flex:1;justify-content:center}
}

/* Video-finished prompt (roulette single mode) */
.ss-roulendov{position:fixed;inset:0;z-index:9600;background:rgba(8,6,14,.72);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.ss-roulend{background:#171226;border:1px solid #3a2f55;border-radius:16px;padding:28px 30px;display:flex;flex-direction:column;gap:12px;min-width:300px;box-shadow:0 18px 50px rgba(0,0,0,.6);text-align:center}
.ss-roulend b{color:#fff;font-size:18px;margin-bottom:4px}
.ss-roulend button{border:none;border-radius:22px;padding:12px 20px;font-size:14px;font-weight:700;cursor:pointer}
.ss-re-one{background:#7b2ff2;color:#fff}
.ss-re-one:hover{background:#8f4bf5}
.ss-re-loop{background:#232036;color:#e6dff5;border:1px solid #4a3d6b !important}
.ss-re-loop:hover{background:#2c2743}
.ss-re-x{background:none;color:#8a8398}
.ss-re-x:hover{color:#fff}
.ss-roulloopon{color:#b9a8e8;font-size:12.5px;white-space:nowrap}

/* keep the loop toggle vertically centered with the buttons */
.ss-roulsec{align-items:center}
.ss-roulsec .ss-roulloop{align-self:center}

/* loop toggle (shared by the homepage strip + the video-page roulette bar,
   which loads only this stylesheet) */
.ss-roulloop{display:inline-flex;align-items:center;gap:8px;color:#cfc7e4;font-size:13px;font-weight:700;cursor:pointer;user-select:none;white-space:nowrap}
.ss-roulloop input{display:none}
.ss-roulloop__track{width:34px;height:19px;border-radius:10px;background:#2c2740;border:1px solid #4a3d6b;position:relative;transition:background .15s;display:inline-block}
.ss-roulloop__dot{position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;background:#8d8d98;transition:left .15s,background .15s}
.ss-roulloop input:checked + .ss-roulloop__track{background:#7b2ff2;border-color:#8f4bf5}
.ss-roulloop input:checked + .ss-roulloop__track .ss-roulloop__dot{left:17px;background:#fff}

/* ---- mobile: tidy, uniform roulette strip (was: mismatched button sizes) ---- */
@media (max-width:640px){
  .ss-roulsec{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px}
  .ss-roulsec .ss-roulhead{grid-column:1/-1;margin-right:0}
  .ss-roulsec .ss-roulgenre{grid-column:1/-1;width:100%;padding:10px;box-sizing:border-box}
  .ss-roulsec .ss-roulbtn{width:100%;justify-content:center;padding:10px 4px;font-size:12.5px;
    white-space:normal;line-height:1.2;min-height:44px;box-sizing:border-box}
  .ss-roulsec .ss-roulloop{grid-column:1/-1;justify-content:center}
  .ss-roulbar{gap:8px;padding:8px 10px}
}

/* whole like pill clickable (beta bug fix) */
.wp_ulike_general_class{cursor:pointer}
.wp_ulike_general_class .count-box{cursor:pointer}

/* title row + Recommended heading share a grid row; drop the 16px
   top padding so the title text lines up with the heading (beta bug fix) */
body .video__info{padding-top:0}