.video-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}.video-card{overflow:hidden;transition:transform .2s,background-color .2s,box-shadow .2s;height:100%;display:flex;flex-direction:column}.video-card-link{text-decoration:none;color:inherit;display:flex;flex-direction:column;height:100%}.video-card-link:focus-visible{outline:4px solid var(--focus-color);outline-offset:4px;border-radius:2px}.video-thumbnail-wrapper{position:relative;width:100%;padding-top:56.25%;background-color:#000;overflow:hidden}.video-thumbnail-wrapper img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.video-card-link:hover img{transform:scale(1.05)}.play-icon-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;background:var(--primary-fill);color:var(--on-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,.5);transition:background-color .2s,border-color .2s}.video-card-link:hover .play-icon-overlay{background:var(--primary-strong);border-color:var(--primary-strong)}.lesson-number-badge{position:absolute;top:10px;left:10px;background:#000000b8;color:#fff;font-size:.72rem;font-weight:700;padding:3px 8px;border-radius:var(--radius-sm);z-index:1}.video-info{padding:20px;flex:1;display:flex;flex-direction:column}.video-info h3{font-size:1.1rem;font-weight:600;margin-bottom:10px;color:var(--text-main);line-height:1.4}.video-info p{font-size:.9rem;color:var(--text-muted);margin:0 0 12px;line-height:1.6;flex:1}.transcript-status{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:600;padding:3px 8px;border-radius:var(--radius-md);margin-top:auto;width:fit-content}.transcript-status--available{background:var(--primary-wash);color:var(--accent-color)}.transcript-status--pending{background:#a8a8b314;color:var(--text-muted)}.course-breadcrumb{margin-bottom:24px}.course-breadcrumb a{color:var(--text-muted);text-decoration:none;font-size:.9rem;display:inline-flex;align-items:center;gap:6px;transition:color .2s}.course-breadcrumb a:hover{color:var(--accent-color)}.course-header{margin-bottom:40px}.course-page-title{font-size:var(--fs-title-page-compact);font-weight:var(--fw-title-display);color:var(--text-main);margin-bottom:12px;line-height:var(--lh-title-sm)}.course-description{font-size:1rem;color:var(--text-muted);max-width:640px;margin:0 0 16px;line-height:1.6}.course-lesson-count{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600;color:var(--primary);background:var(--primary-wash);padding:6px 14px;border-radius:var(--radius-md)}.video-list-heading{font-size:var(--fs-title-sub-compact);font-weight:var(--fw-title);color:var(--text-main);margin:0 0 20px;padding-top:24px}.lesson-breadcrumb{margin-bottom:24px}.lesson-breadcrumb ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;align-items:center;font-size:.78rem;line-height:1}.lesson-breadcrumb li{display:flex;align-items:center;color:var(--text-muted)}.lesson-breadcrumb li:not(:last-child) .breadcrumb-separator{margin:0 8px;color:#555;font-size:1em}.lesson-breadcrumb a{color:var(--text-muted);text-decoration:none;transition:color .2s}.lesson-breadcrumb a:hover{color:var(--primary)}.lesson-breadcrumb li[aria-current=page]{color:var(--text-main)}@media(max-width:575.98px){.lesson-breadcrumb li:nth-child(2) a{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block;vertical-align:middle}}.lesson-layout{display:grid;grid-template-columns:1fr;gap:var(--space-7);margin-bottom:var(--space-10)}@media(min-width:992px){.lesson-layout{grid-template-columns:1fr 300px;gap:var(--space-9);align-items:start}}.lesson-primary{min-width:0;display:flex;flex-direction:column;gap:var(--space-6)}.lesson-video-card{border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border-control);box-shadow:0 4px 20px var(--shadow-color);background:#000}.lesson-info{padding:0 2px}.lesson-info-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:6px}.lesson-page-title{font-size:var(--fs-title-page-inline);font-weight:var(--fw-title-display);color:var(--text-main);margin:0;line-height:var(--lh-title-sm);letter-spacing:-.02em}.lesson-progress-badge{flex-shrink:0;font-size:.7rem;font-weight:700;color:var(--primary);background:var(--primary-wash);padding:4px 12px;border-radius:var(--radius-sm);white-space:nowrap;margin-top:4px}.lesson-page-desc{font-size:.9rem;color:var(--text-muted);margin:0;line-height:1.65}.lesson-nav{display:flex;align-items:center;gap:12px}.btn-lesson-nav{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;font-family:inherit;font-size:.82rem;line-height:1.5;font-weight:600;border-radius:var(--radius-sm);text-decoration:none;cursor:pointer;transition:background-color .2s,border-color .2s,box-shadow .2s;white-space:nowrap}.btn-lesson-nav:focus-visible{outline:3px solid var(--focus-color);outline-offset:2px}.transcript-summary:focus-visible,.lesson-sidebar-item:focus-visible{outline:3px solid var(--focus-color);outline-offset:2px;border-radius:4px}.btn-lesson-nav i{font-size:.85rem}.transcript-status .material-icons,.course-breadcrumb .material-icons,.course-lesson-count .material-icons,.lesson-transcript-pending .material-icons{font-size:1em}.btn-lesson-nav--prev{background:transparent;border:1px solid var(--border-control);color:var(--text-main)}.btn-lesson-nav--prev:hover{border-color:var(--primary);color:var(--primary)}.btn-lesson-nav--next{background:var(--primary-fill);border:1px solid var(--primary-fill);color:var(--on-primary)}.btn-lesson-nav--next:hover{background:var(--primary-strong);border-color:var(--primary-strong);color:var(--on-primary)}.btn-lesson-nav--disabled{opacity:.25;cursor:not-allowed;pointer-events:none}.lesson-transcript{margin:0;max-width:56rem}.transcript-summary{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-radius:var(--radius-md);background:var(--bg-card);border:1px solid var(--border-control);cursor:pointer;font-weight:600;font-size:.85rem;color:var(--text-main);list-style:none;user-select:none;transition:background-color .2s,border-color .2s}.transcript-summary-left{display:flex;align-items:center;gap:8px}.transcript-summary-left i{color:var(--accent-color);font-size:1rem}.transcript-summary:hover{background:var(--bg-hover);border-color:var(--primary-soft-ring)}.transcript-summary::-webkit-details-marker{display:none}.transcript-chevron{font-size:.75rem;transition:transform .2s ease;flex-shrink:0;color:var(--text-muted)}details[open] .transcript-chevron{transform:rotate(180deg)}details[open] .transcript-summary{border-radius:var(--radius-sm);border-bottom-color:transparent}.transcript-content{padding:var(--space-7) var(--space-6);font-size:.9rem;color:var(--text-muted);line-height:1.85;background:var(--bg-card);border:1px solid var(--border-control);border-top:0;border-radius:var(--radius-md);margin-top:-2px}.transcript-content h2{font-size:var(--fs-label-lg);font-weight:var(--fw-title);color:var(--text-main);margin-top:1.8rem;margin-bottom:.6rem}.transcript-content h2:first-child{margin-top:0}.transcript-content p{margin-bottom:1rem}.transcript-content ul,.transcript-content ol{padding-left:1.4rem;margin-bottom:1rem}.transcript-content a{color:var(--primary);text-decoration:underline;text-underline-offset:2px}.transcript-content a:hover{color:var(--primary-dark)}.lesson-transcript-pending{display:flex;align-items:center;gap:8px;padding:20px 24px;border-radius:var(--radius-md);background:var(--bg-card);border:1px solid var(--border-color);font-size:.85rem;color:var(--text-muted)}.lesson-sidebar{background:var(--bg-card);border:1px solid var(--border-control);border-radius:var(--radius-md);overflow:hidden;height:fit-content;scrollbar-width:thin;scrollbar-color:var(--border-color) transparent}@media(min-width:992px){.lesson-sidebar{position:sticky;top:24px;max-height:calc(100vh - 48px);overflow-y:auto}}.lesson-sidebar::-webkit-scrollbar{width:6px}.lesson-sidebar::-webkit-scrollbar-track{background:transparent}.lesson-sidebar::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.lesson-sidebar::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.lesson-sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border-color)}.lesson-sidebar-title{font-size:var(--fs-label);font-weight:var(--fw-title);color:var(--text-main);margin:0}.lesson-sidebar-count{font-size:.7rem;font-weight:600;color:var(--text-muted);background:var(--bg-hover);padding:3px 10px;border-radius:var(--radius-sm)}.lesson-sidebar-list{list-style:none;padding:8px;margin:0;display:flex;flex-direction:column;gap:2px}.lesson-sidebar-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);text-decoration:none;color:var(--text-muted);font-size:.82rem;transition:background-color .15s,color .15s;position:relative}.lesson-sidebar-item:hover{background:var(--bg-hover);color:var(--text-main)}.lesson-sidebar-item--active{background:var(--primary-wash);color:var(--text-main);font-weight:600}.lesson-sidebar-item--active:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;border-radius:var(--radius-sm);background:var(--accent-color)}.lesson-sidebar-item--active:hover{background:var(--primary-soft-ring)}.lesson-sidebar-number{flex-shrink:0;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);font-size:.7rem;font-weight:700;background:var(--surface-inset);color:var(--text-muted)}.lesson-sidebar-item--active .lesson-sidebar-number{background:var(--primary-fill);color:var(--on-primary)}.lesson-sidebar-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.lesson-sidebar-playing{display:flex;align-items:flex-end;gap:2px;height:14px;flex-shrink:0}.lesson-sidebar-playing span{display:block;width:3px;background:var(--accent-color);border-radius:2px;animation:playing-bar .8s ease-in-out infinite alternate}.lesson-sidebar-playing span:nth-child(1){height:6px;animation-delay:0s}.lesson-sidebar-playing span:nth-child(2){height:10px;animation-delay:.2s}.lesson-sidebar-playing span:nth-child(3){height:4px;animation-delay:.4s}@keyframes playing-bar{0%{height:4px}to{height:14px}}@media(max-width:575.98px){.video-list{grid-template-columns:1fr;gap:16px}.lesson-info-top{flex-direction:column;gap:6px}.lesson-primary{gap:20px}.lesson-nav{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){.video-card,.video-card-link:hover .video-card,.video-card-link:hover img,.transcript-chevron,.btn-lesson-nav,.lesson-sidebar-item,.lesson-sidebar-number,.lesson-sidebar-playing span{transition:none!important;transform:none!important;animation:none!important}}.transcript-content>*{max-width:68ch}@media(forced-colors:active){.lesson-sidebar-item--active{border-left:3px solid Highlight;forced-color-adjust:none}.lesson-sidebar-item--active .lesson-sidebar-number{background:Highlight;color:HighlightText}.play-icon-overlay{border:1px solid ButtonText}}@media(prefers-contrast:more),(prefers-contrast:high){.lesson-sidebar-item--active{border-left:3px solid var(--primary)}.transcript-content,.lesson-video-card,.lesson-sidebar{border-color:var(--border-control)}}
