body{background-color:#f9f9f9}.playlist-page-container{max-width:1600px;margin:0 auto;padding:20px;display:grid;grid-template-columns:1fr 400px;gap:24px;height:calc(100vh - 100px)}@media (max-width:1000px){.playlist-page-container{grid-template-columns:1fr;height:auto}}.primary-col{min-width:0;display:flex;flex-direction:column}.video-player-wrapper{position:relative;width:100%;padding-top:56.25%;background:#000;border-radius:12px;overflow:hidden;margin-bottom:20px;box-shadow:0 4px 12px rgba(0,0,0,.1)}.video-player-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}.video-title{font-size:1.5rem;font-weight:700;margin-bottom:10px;color:#0f0f0f}.playlist-title-context{font-size:.9rem;color:#606060;margin-bottom:5px}.playlist-sidebar{background:#fff;border:1px solid #e5e5e5;border-radius:12px;display:flex;flex-direction:column;height:100%;max-height:calc(100vh - 40px);overflow:hidden}.playlist-header{padding:15px;background:#f1f1f1;border-bottom:1px solid #e5e5e5}.playlist-header h2{font-size:1.1rem;font-weight:700;margin:0 0 5px 0;color:#0f0f0f}.playlist-meta{font-size:.85rem;color:#606060}.playlist-items{overflow-y:auto;flex:1}.playlist-item{display:flex;gap:10px;padding:10px;cursor:pointer;border-bottom:1px solid #f0f0f0;transition:background .2s;text-decoration:none;color:inherit}.playlist-item:hover{background:#f9f9f9}.playlist-item.active{background:#e8f0fe}.item-index{display:flex;align-items:center;justify-content:center;width:24px;color:#606060;font-size:.85rem}.item-thumbnail{position:relative;width:100px;height:56px;flex-shrink:0;border-radius:8px;overflow:hidden;background:#000}.item-thumbnail img{width:100%;height:100%;object-fit:cover}.item-info{flex:1;min-width:0}.item-title{font-size:.9rem;font-weight:600;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.3}.item-meta{font-size:.75rem;color:#606060}
