.video-frame > div { position:absolute; inset:0; width:100%; height:100%; }
.back-button { background:transparent; color:#15263b; padding-left:0; margin-bottom:20px; }
.day-hero { display:flex; justify-content:space-between; align-items:center; gap:30px; background:linear-gradient(120deg,#fff,#f8fafc); border:1px solid #dfe4ea; border-radius:18px; padding:30px; }
.day-hero h1 { font-size:clamp(28px,4vw,44px); margin-bottom:8px; }
.day-hero p { margin:0; color:#697586; }
.day-progress-summary { min-width:150px; text-align:center; padding:18px; background:#15263b; color:#fff; border-radius:14px; }
.day-progress-summary strong,.day-progress-summary span { display:block; }
.day-progress-summary strong { font-size:30px; }
.progress-track,.video-progress { height:8px; background:#dfe4ea; border-radius:999px; overflow:hidden; }
.progress-track { margin:16px 0 28px; }
.progress-track span,.video-progress span { display:block; height:100%; background:#e51b2a; transition:width .3s; }
.video-list { display:grid; gap:20px; max-width:1050px; }
.video-card.wide { display:grid; grid-template-columns:minmax(320px,48%) 1fr; }
.video-card.completed { border-color:#83c7a1; box-shadow:0 0 0 2px #dff4e8; }
.video-heading { display:flex; justify-content:space-between; gap:15px; }
.video-status { font-size:12px; color:#16834a; }
.video-progress { margin:22px 0 7px; }
.progress-label { color:#697586; font-weight:700; }
@media(max-width:900px) { .video-card.wide { grid-template-columns:1fr; } }
@media(max-width:600px) { .day-hero { align-items:flex-start; flex-direction:column; } .day-progress-summary { width:100%; } }