.screencasts-page .page-content{padding-top:70px;padding-bottom:var(--space-2xl);}.screencasts{padding:0 0 var(--space-2xl);}.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:0.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:0.8125rem;color:var(--color-text-muted);}.screencasts__video-duration{display:flex;align-items:center;gap:4px;}.screencasts__video-category{padding:2px 8px;background:rgba(0,128,96,0.15);border-radius:var(--radius-sm);color:var(--color-primary-light);font-weight:500;font-size:0.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:0.875rem;font-weight:600;color:var(--color-text);margin:0;}.screencasts__sidebar-count{font-size:0.75rem;color:var(--color-text-muted);margin-top:2px;}.screencasts__sidebar-scroll{overflow-y:auto;flex:1;}.screencasts__category{}.screencasts__category-title{display:flex;align-items:center;gap:4px;padding:4px var(--space-md);font-size:0.625rem;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;color:var(--color-text-muted);background:rgba(255,255,255,0.02);margin:0;}.screencasts__category-icon{font-size:0.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:rgba(0,128,96,0.12);}.screencasts__item--active .screencasts__item-title{color:var(--color-primary-light);}.screencasts__item-index{flex-shrink:0;width:16px;font-size:0.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:0.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:0.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:0.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-page .page-content{padding-top:60px;}.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:0.75rem;}}