.screencasts-hero{padding:calc(var(--space-4xl) + 60px) 0 var(--space-xl);text-align:center}.screencasts-hero__content{max-width:700px;margin:0 auto}.screencasts-hero__title{font-size:clamp(2rem,4vw,2.5rem);font-weight:800;line-height:1.1;margin-bottom:var(--space-md);letter-spacing:-.02em}.screencasts-hero__description{font-size:1.125rem;color:var(--color-text-secondary);line-height:1.6}.screencasts{padding:var(--space-lg) 0 var(--space-4xl)}.screencasts__layout{display:grid;grid-template-columns:1fr 360px;gap:var(--space-xl);align-items:start}.screencasts__player{position:sticky;top:100px}.screencasts__video-wrapper{position:relative;border-radius:var(--radius-md);overflow:hidden;background:#000;border:1px solid var(--color-border)}.screencasts__video{display:block;width:100%;height:auto;aspect-ratio:16 / 9;background:#000}.screencasts__video-info{margin-top:var(--space-lg)}.screencasts__video-title{font-size:1.25rem;font-weight:600;color:var(--color-text);margin-bottom:var(--space-xs);line-height:1.3}.screencasts__video-description{font-size:.9375rem;color:var(--color-text-secondary);line-height:1.6;margin-bottom:var(--space-sm)}.screencasts__video-meta{display:flex;align-items:center;gap:var(--space-md);font-size:.8125rem;color:var(--color-text-muted)}.screencasts__video-duration{display:flex;align-items:center;gap:4px}.screencasts__video-category{padding:2px 8px;background:#00806026;border-radius:var(--radius-sm);color:var(--color-primary-light);font-weight:500;font-size:.75rem}.screencasts__sidebar{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);max-height:calc(100vh - 120px);overflow:hidden;display:flex;flex-direction:column}.screencasts__sidebar-header{padding:var(--space-md);border-bottom:1px solid var(--color-border);background:var(--color-surface)}.screencasts__sidebar-title{font-size:.875rem;font-weight:600;color:var(--color-text);margin:0}.screencasts__sidebar-count{font-size:.75rem;color:var(--color-text-muted);margin-top:2px}.screencasts__sidebar-scroll{overflow-y:auto;flex:1}.screencasts__category-title{display:flex;align-items:center;gap:4px;padding:4px var(--space-md);font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--color-text-muted);background:#ffffff05;margin:0}.screencasts__category-icon{font-size:.625rem}.screencasts__list{list-style:none;padding:0;margin:0}.screencasts__item{display:flex;align-items:center;gap:6px;width:100%;padding:4px var(--space-sm) 4px var(--space-md);background:transparent;border:none;cursor:pointer;transition:background var(--transition-fast);text-align:left;font-family:var(--font-sans)}.screencasts__item:hover{background:var(--color-surface)}.screencasts__item--active{background:#0080601f}.screencasts__item--active .screencasts__item-title{color:var(--color-primary-light)}.screencasts__item-index{flex-shrink:0;width:16px;font-size:.6875rem;color:var(--color-text-muted);text-align:right}.screencasts__item--active .screencasts__item-index{color:var(--color-primary-light)}.screencasts__item--active .screencasts__item-index:before{content:"▶";font-size:.5rem}.screencasts__item--active .screencasts__item-index span{display:none}.screencasts__item-content{flex-grow:1;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm)}.screencasts__item-title{font-size:.8125rem;font-weight:400;color:var(--color-text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color var(--transition-fast)}.screencasts__item--active .screencasts__item-title{font-weight:500}.screencasts__item-duration{flex-shrink:0;font-size:.6875rem;color:var(--color-text-muted)}.screencasts__sidebar-scroll::-webkit-scrollbar{width:4px}.screencasts__sidebar-scroll::-webkit-scrollbar-track{background:transparent}.screencasts__sidebar-scroll::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:2px}.screencasts__sidebar-scroll::-webkit-scrollbar-thumb:hover{background:var(--color-border-hover)}@media(max-width:1200px){.screencasts__layout{grid-template-columns:1fr 320px;gap:var(--space-lg)}}@media(max-width:1024px){.screencasts__layout{grid-template-columns:1fr;gap:var(--space-xl)}.screencasts__player{position:relative;top:0}.screencasts__sidebar{max-height:400px}}@media(max-width:768px){.screencasts-hero{padding-top:calc(var(--space-3xl) + 60px);padding-bottom:var(--space-md)}.screencasts-hero__title{font-size:1.75rem}.screencasts-hero__description{font-size:1rem}.screencasts__video-title{font-size:1.125rem}.screencasts__video-meta{flex-wrap:wrap;gap:var(--space-sm)}.screencasts__sidebar{max-height:350px}}@media(max-width:480px){.screencasts__item{padding:4px var(--space-xs) 4px var(--space-sm)}.screencasts__category-title{padding:3px var(--space-sm)}.screencasts__item-title{font-size:.75rem}}