.tutorials-page[data-v-c639c9dc]{padding:30px 0;background-color:#f8f9fa;min-height:calc(100vh - 60px)}.tutorials-container[data-v-c639c9dc]{display:flex;max-width:1200px;margin:0 auto;background-color:#fff;border-radius:8px;box-shadow:0 2px 12px rgba(0,0,0,.1);overflow:hidden}.tutorials-sidebar[data-v-c639c9dc]{width:280px;background-color:#f8f9fa;padding:20px 0;border-right:1px solid #eaeaea}.tutorials-sidebar h2[data-v-c639c9dc]{padding:0 20px 15px;margin-bottom:15px;border-bottom:1px solid #eaeaea;font-size:20px;color:#333}.tutorial-menu[data-v-c639c9dc]{list-style:none;padding:0;margin:0}.tutorial-category[data-v-c639c9dc]{margin-bottom:5px}.category-title[data-v-c639c9dc]{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;cursor:pointer;color:#333;font-weight:500;transition:background-color .3s}.category-title[data-v-c639c9dc]:hover{background-color:#e9ecef}.tutorial-submenu[data-v-c639c9dc]{list-style:none;padding:0;margin:0;background-color:#fff}.tutorial-submenu li[data-v-c639c9dc]{padding:10px 20px 10px 40px;cursor:pointer;transition:background-color .3s,color .3s;font-size:14px;color:#666}.tutorial-submenu li[data-v-c639c9dc]:hover{background-color:#e9ecef;color:#409eff}.tutorial-submenu li.active[data-v-c639c9dc]{background-color:#ecf5ff;color:#409eff;border-left:3px solid #409eff}.tutorials-content[data-v-c639c9dc]{flex:1;padding:30px;overflow-y:auto}.tutorial-header[data-v-c639c9dc]{margin-bottom:30px}.tutorial-header h1[data-v-c639c9dc]{margin:0 0 10px;font-size:28px;color:#333}.tutorial-meta[data-v-c639c9dc]{display:flex;gap:20px;color:#666;font-size:14px}.tutorial-meta span[data-v-c639c9dc]{display:flex;align-items:center}.tutorial-meta i[data-v-c639c9dc]{margin-right:5px}.tutorial-carousel-container[data-v-c639c9dc]{width:100%;background-color:#f8f9fa;border-radius:8px;overflow:hidden;margin-bottom:30px}.carousel-placeholder[data-v-c639c9dc]{width:100%;height:400px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#999}.carousel-placeholder i[data-v-c639c9dc]{font-size:48px;margin-bottom:15px}.carousel-image[data-v-c639c9dc]{width:100%;height:100%;-o-object-fit:contain;object-fit:contain;cursor:pointer;transition:opacity .3s}.carousel-image[data-v-c639c9dc]:hover{opacity:.9}.el-carousel__item[data-v-c639c9dc]{display:flex;justify-content:center;align-items:center;background-color:#f8f9fa}.preview-image[data-v-c639c9dc]{width:100%;max-height:80vh;-o-object-fit:contain;object-fit:contain}.tutorial-description[data-v-c639c9dc]{margin-bottom:30px}.tutorial-description h3[data-v-c639c9dc]{margin-bottom:15px;font-size:20px;color:#333}.tutorial-description p[data-v-c639c9dc]{line-height:1.6;color:#666}.tutorial-steps h3[data-v-c639c9dc]{margin-bottom:20px;font-size:20px;color:#333}.step-item[data-v-c639c9dc]{display:flex;margin-bottom:20px}.step-number[data-v-c639c9dc]{width:36px;height:36px;border-radius:50%;background-color:#409eff;color:#fff;display:flex;justify-content:center;align-items:center;font-weight:700;margin-right:15px;flex-shrink:0}.step-content[data-v-c639c9dc]{flex:1}.step-content h4[data-v-c639c9dc]{margin:0 0 10px;font-size:18px;color:#333}.step-content p[data-v-c639c9dc]{margin:0;line-height:1.6;color:#666}@media (max-width:768px){.tutorials-container[data-v-c639c9dc]{flex-direction:column}.tutorials-sidebar[data-v-c639c9dc]{width:100%;border-right:none;border-bottom:1px solid #eaeaea}.tutorial-carousel-container[data-v-c639c9dc]{margin:0 10px 20px}.carousel-placeholder[data-v-c639c9dc]{height:250px}}