.tutorial-filters{display:flex;flex-wrap:wrap;gap:1.5rem;background-color:#f8fafc;border-radius:0.75rem;padding:1.25rem;margin-top:2rem;margin-bottom:1.5rem;box-shadow:0 2px 10px rgba(0,0,0,0.05);border:1px solid rgba(0,0,0,0.05);position:relative}.tutorial-filters::before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(to bottom,#4a00e0,#8e2de2);border-top-left-radius:0.75rem;border-bottom-left-radius:0.75rem}.filter-group{flex:1;min-width:200px}.filter-group label{display:block;margin-bottom:0.5rem;font-weight:600;color:#1e293b;font-size:0.9rem}.filter-select{width:100%;padding:0.75rem 1rem;border:1px solid #e2e8f0;border-radius:0.5rem;background-color:white;color:#334155;font-size:0.95rem;transition:all 0.3s ease;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%234a00e0' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-size:12px;cursor:pointer}.filter-select:focus{outline:none;border-color:#4a00e0;box-shadow:0 0 0 3px rgba(74,0,224,0.1)}.filter-select:hover{border-color:#cbd5e1}.no-tutorials{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;background-color:#f8fafc;border-radius:0.75rem;text-align:center;grid-column:1 / -1}.no-tutorials i{font-size:3rem;color:#94a3b8;margin-bottom:1rem}.no-tutorials p{color:#64748b;font-size:1.1rem;max-width:400px}@media (max-width:768px){.tutorial-filters{flex-direction:column;gap:1rem}.filter-group{width:100%}}