/* Learner video stories for the homepage (same design as the Placed Students page) */
.rev .ytt { --panel:#16203F; --panel-2:#1B2140; --line:#263056; --coral:#EF4444; --coral-lt:#F87171; --ink:#fff; --ink-2:#C3CADF; --ink-3:#8B93AE; --ink-4:#5C6482; --display:'Plus Jakarta Sans',system-ui,sans-serif; --body:'Plus Jakarta Sans',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace; --r-lg:24px; }
.rf-dot{width:7px;height:7px;border-radius:99px;background:var(--ink-4);opacity:.5;cursor:pointer;transition:all .25s ease;}
.rf-dot.on{opacity:1;width:22px;background:var(--coral);}
.ytt{max-width:1080px;margin:0 auto;}
.ytt-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:22px;align-items:start;}
.ytt-stage{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--r-lg);
  overflow:hidden;border:1px solid rgba(255,255,255,.14);
  box-shadow:0 34px 80px rgba(0,0,0,.6),0 0 0 1px rgba(239,68,68,.12),0 0 90px rgba(123,47,168,.3);}
.ytt-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ytt-stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.ytp-bigplay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:76px;height:76px;border-radius:50%;background:var(--coral);cursor:pointer;
  display:grid;place-items:center;box-shadow:0 10px 34px rgba(239,68,68,.55);transition:transform .2s ease;}
.ytp-bigplay::after{content:"";border-left:23px solid #fff;border-top:15px solid transparent;
  border-bottom:15px solid transparent;margin-left:5px;}
@media (hover:hover){ .ytt-stage:hover .ytp-bigplay{transform:translate(-50%,-50%) scale(1.08);} }
.ytp-nowcap{position:absolute;left:0;right:0;bottom:0;padding:24px 22px 18px;pointer-events:none;
  background:linear-gradient(transparent,rgba(4,6,14,.9));}
.ytp-nowcap b{font-family:var(--display);font-weight:800;font-size:1.2rem;color:#fff;display:block;}
.ytp-nowcap span{font-family:var(--mono);font-size:.74rem;color:var(--coral-lt);letter-spacing:.05em;}

/* desktop "Suggested stories" side list */
.ytt-side{display:flex;flex-direction:column;gap:12px;min-width:0;}
.ytt-stories{min-width:0;}
.ytt-side-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:2px;}
.ytt-side-title{font-family:var(--display);font-weight:700;font-size:1.02rem;color:var(--ink);}
.ytt-more{font-family:var(--mono);font-size:.76rem;color:var(--ink-4);}
.ytt-stories{display:flex;flex-direction:column;gap:11px;}
.ytt-story{display:flex;align-items:center;gap:13px;width:100%;min-width:0;text-align:left;cursor:pointer;
  padding:11px 13px;border-radius:14px;background:var(--panel);border:1px solid var(--line);
  transition:border-color .18s ease,background .18s ease,transform .18s ease;}
.ytt-story:hover{border-color:rgba(239,68,68,.5);transform:translateX(2px);}
.ytt-story.on{background:linear-gradient(90deg,rgba(239,68,68,.16),var(--panel));border-color:rgba(239,68,68,.55);}
.ytt-av{width:44px;height:44px;border-radius:12px;flex:none;display:grid;place-items:center;
  font-family:var(--display);font-weight:800;font-size:.92rem;color:#fff;}
.ytt-si{min-width:0;}
.ytt-si b{display:block;font-family:var(--display);font-weight:700;font-size:.96rem;color:var(--ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25;}
.ytt-si span{display:none;font-size:.82rem;color:var(--coral-lt);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px;}
.ytt-seemore{margin-top:3px;padding:13px;border-radius:14px;background:rgba(255,255,255,.04);
  border:1px solid var(--line);color:var(--coral-lt);font-family:var(--display);font-weight:700;font-size:.9rem;
  cursor:pointer;transition:all .18s ease;}
.ytt-seemore:hover{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.4);}
.ytt-seemore b{color:var(--ink-4);font-weight:500;margin-left:6px;}
.ytt-railwrap{display:none;}
.ytt-left{min-width:0;}
.ytt-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;}
.ytt-navbtn{padding:11px 20px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid var(--line);
  color:var(--ink-2);font-family:var(--display);font-weight:700;font-size:.9rem;cursor:pointer;transition:all .18s ease;}
.ytt-navbtn:hover{background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.4);color:var(--ink);}
.ytt-navbtn.next{background:var(--coral);border-color:var(--coral);color:#fff;}
.ytt-navbtn.next:hover{filter:brightness(1.08);background:var(--coral);}
.ytt-pos{font-family:var(--body);font-size:.88rem;color:var(--ink-3);text-align:center;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ytt-pos b{color:var(--ink);font-weight:600;}
@media (max-width:960px){ .ytt-navbtn{padding:10px 16px;font-size:.84rem;} .ytt-pos{font-size:.8rem;} }
.ytt-stories{max-height:420px;overflow-y:auto;overscroll-behavior:contain;padding-right:6px;
  scrollbar-width:none;}
/* desktop list: soft fade at the bottom hints that it scrolls (no scrollbar shown) */
@media (min-width:961px){
  .ytt-stories{-webkit-mask-image:linear-gradient(180deg,#000 88%,transparent);mask-image:linear-gradient(180deg,#000 88%,transparent);}
}
@media (max-width:960px){ .ytt-stories{max-height:340px;padding-right:4px;} }

/* mobile and tablets: suggested stories as swipeable pages of 4 */
@media (max-width:960px){
  .ytt-stories.paged{display:flex;flex-direction:row;gap:10px;max-height:none;overflow-x:auto;overflow-y:hidden;
    padding:2px 0 4px;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
  .ytt-stories.paged::-webkit-scrollbar{display:none;}
  .ytt-page{flex:0 0 100%;scroll-snap-align:start;scroll-snap-stop:always;
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-content:start;}
  /* thumbnail cards */
  .ytt-story.ytt-card{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden;
    border-radius:14px;background:var(--panel);border:1px solid var(--line);}
  .ytt-story.ytt-card:hover{transform:none;}
  .ytt-cthumb{position:relative;display:block;aspect-ratio:16/9;background:#000;overflow:hidden;}
  .ytt-cini{display:none;position:absolute;inset:0;place-items:center;font-family:var(--display);
    font-weight:800;font-size:1.5rem;color:rgba(255,255,255,.35);}
  .ytt-cthumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease;}
  .ytt-cthumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.45));}
  .ytt-cplay{position:absolute;left:50%;top:50%;z-index:1;width:34px;height:34px;border-radius:50%;
    transform:translate(-50%,-50%);background:rgba(239,68,68,.92);box-shadow:0 4px 14px rgba(0,0,0,.35);}
  .ytt-cplay::before{content:"";position:absolute;left:13px;top:10px;border-style:solid;
    border-width:7px 0 7px 11px;border-color:transparent transparent transparent #fff;}
  .ytt-cnow{position:absolute;left:7px;top:7px;z-index:1;display:none;padding:3px 7px;border-radius:99px;
    background:var(--coral);color:#fff;font-family:var(--display);font-weight:700;font-size:.58rem;
    letter-spacing:.04em;text-transform:uppercase;}
  .ytt-cname{display:block;padding:9px 10px 10px;font-family:var(--display);font-weight:700;font-size:.8rem;
    color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;}
  .ytt-story.ytt-card.on{border-color:var(--coral);box-shadow:0 0 0 1px var(--coral),0 8px 22px rgba(239,68,68,.18);
    background:var(--panel);}
  .ytt-story.ytt-card.on .ytt-cnow{display:block;}
  .ytt-story.ytt-card.on .ytt-cplay{opacity:0;}
  .ytt-story.ytt-card:active .ytt-cthumb img{transform:scale(1.04);}
  .ytt-more.swipe{font-family:var(--display);font-weight:700;font-size:.8rem;color:var(--coral-lt);
    display:inline-flex;align-items:center;gap:4px;}
  .ytt-more.swipe i{font-style:normal;font-size:1.05rem;line-height:1;display:inline-block;
    animation:yttNudge 1.3s ease-in-out infinite;}
  .ytt-more.swipe.seen i{animation:none;}
}
@keyframes yttNudge{0%,100%{transform:translateX(0);}50%{transform:translateX(5px);}}
@media (prefers-reduced-motion:reduce){ .ytt-more.swipe i{animation:none;} }

.ytt-railhead{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:26px 0 14px;}
.ytt-count{font-family:var(--body);font-size:1rem;color:var(--ink-3);}
.ytt-count b{font-family:var(--display);font-weight:800;font-size:1.7rem;color:var(--coral);margin-right:6px;}
.ytt-arrows{display:flex;gap:10px;flex:none;}
.ytt-arrow{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.07);
  border:1px solid var(--line);color:#fff;font-size:1.3rem;display:grid;place-items:center;transition:all .18s ease;}
.ytt-arrow:hover{background:var(--coral);border-color:var(--coral);}
.ytt-arrow[disabled]{opacity:.3;pointer-events:none;}

.ytt-rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 6px;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-behavior:smooth;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 2.5%,#000 97.5%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 2.5%,#000 97.5%,transparent);}
.ytt-rail::-webkit-scrollbar{display:none;}
.ytt-thumb{position:relative;flex:0 0 auto;width:210px;aspect-ratio:16/9;border-radius:12px;
  overflow:hidden;background:#000;cursor:pointer;scroll-snap-align:start;
  border:2px solid transparent;transition:border-color .18s ease,transform .18s ease;}
.ytt-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease;}
.ytt-thumb.on{border-color:var(--coral);}
@media (hover:hover){ .ytt-thumb:hover{transform:translateY(-3px);border-color:rgba(239,68,68,.55);}
  .ytt-thumb:hover img{transform:scale(1.05);} }
.ytt-thumb .pl{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.55);display:grid;place-items:center;
  opacity:0;transition:opacity .15s ease;}
.ytt-thumb:hover .pl,.ytt-thumb.on .pl{opacity:1;}
.ytt-thumb .pl::after{content:"";border-left:11px solid #fff;border-top:7px solid transparent;
  border-bottom:7px solid transparent;margin-left:3px;}
.ytt-thumb .num{position:absolute;top:6px;left:6px;font-family:var(--mono);font-size:.66rem;color:#fff;
  background:rgba(4,6,14,.72);border:1px solid rgba(255,255,255,.14);padding:1px 7px;border-radius:999px;}
.ytt-bar{height:3px;background:rgba(255,255,255,.08);border-radius:99px;margin-top:14px;overflow:hidden;}
.ytt-bar i{display:block;height:100%;width:14%;background:var(--coral);border-radius:99px;transition:width .15s ease;}
.ytp-empty{padding:24px;text-align:center;color:var(--ink-4);font-family:var(--mono);font-size:.82rem;}
.yt-cta{text-align:center;}

@media (max-width:960px){
  .ytt-grid{grid-template-columns:1fr;}
  .ytt-side{display:flex;margin-top:22px;}
  .ytt-railwrap{display:none;}
  /* 4 name cells in a 2 x 2 grid */
  .ytt-stories{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .ytt-story{padding:11px 10px;gap:9px;}
  .ytt-av{width:34px;height:34px;font-size:.72rem;border-radius:10px;}
  .ytt-si b{font-size:.66rem;}
}
.ytt-dots{display:flex;justify-content:center;margin:14px auto 0;overflow:hidden;padding:2px 0;}
.ytt-dotrow{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;width:max-content;
  transition:transform .3s ease;}
.ytt-dotrow .rf-dot{flex:none;}
.ytt-dotrow .rf-dot.sm{transform:scale(.7);}
.ytt-dotrow .rf-dot.xs{transform:scale(.45);}

/* >>> desktop story thumbnails */
/* Desktop "Suggested stories": a small video thumbnail beside each name (same idea as the tablet cards). */
@media (min-width:961px){
  .ytt-story{padding:8px;gap:14px;}
  .ytt-dthumb{position:relative;flex:none;width:clamp(120px, 34%, 176px);aspect-ratio:16/9;border-radius:10px;overflow:hidden;
    display:grid;place-items:center;}
  .ytt-dini{font-family:var(--display);font-weight:800;font-size:1.1rem;color:rgba(255,255,255,.4);}
  .ytt-dthumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease;}
  .ytt-dthumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.4));}
  .ytt-dplay{position:absolute;left:50%;top:50%;z-index:1;width:30px;height:30px;border-radius:50%;
    transform:translate(-50%,-50%);background:rgba(239,68,68,.92);box-shadow:0 4px 14px rgba(0,0,0,.35);transition:opacity .18s ease;}
  .ytt-dplay::before{content:"";position:absolute;left:11px;top:9px;border-style:solid;
    border-width:6px 0 6px 10px;border-color:transparent transparent transparent #fff;}
  .ytt-dnow{position:absolute;left:6px;top:6px;z-index:1;display:none;padding:2px 7px;border-radius:99px;
    background:var(--coral);color:#fff;font-family:var(--display);font-weight:700;font-size:.58rem;
    letter-spacing:.04em;text-transform:uppercase;}
  .ytt-story.on .ytt-dnow{display:block;}
  .ytt-story.on .ytt-dplay{opacity:0;}
  .ytt-story:hover .ytt-dthumb img{transform:scale(1.05);}
  .ytt-si b{font-size:1rem;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
}
/* <<< desktop story thumbnails */