@import "https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap";
:root{color:#111827;font-synthesis:none;text-rendering:optimizeLegibility;background:#fff;font-family:Poppins,Inter,Arial,sans-serif}*{box-sizing:border-box}body{background:#fff;margin:0}.app{background:#fff;width:100%;min-height:100vh}.container{max-width:1280px;margin:0 auto;padding:0 24px}.toast-notice{color:#fff;z-index:1000;background:#299ee8;border-radius:10px;align-items:center;gap:10px;padding:12px 20px;font-weight:500;animation:.3s slideIn;display:flex;position:fixed;top:20px;right:20px;box-shadow:0 4px 14px #00000026}.toast-notice button{color:#fff;cursor:pointer;background:0 0;border:none;align-items:center;padding:0;display:flex}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.popular-main{padding-top:28px;padding-bottom:48px}.popular-heading-row{justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.popular-title{color:#111827;letter-spacing:-.3px;margin:0;font-size:24px;font-weight:700}.query-highlight{color:#111827;font-weight:800}.date-selector{background:#fff;border:1px solid #e2e8f0;border-radius:20px;align-items:center;height:38px;padding:2px 4px;display:flex;box-shadow:0 1px 3px #00000005}.year-dropdown-wrapper{border-right:1px solid #e2e8f0;height:100%;padding-right:4px;position:relative}.year-button{color:#4b5563;cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;height:100%;padding:0 12px;font-size:13px;font-weight:600;display:flex}.year-dropdown{z-index:100;background:#fff;border:1px solid #e2e8f0;border-radius:10px;min-width:90px;position:absolute;top:calc(100% + 6px);left:0;overflow:hidden;box-shadow:0 4px 12px #0000001a}.year-dropdown button{text-align:left;color:#4b5563;cursor:pointer;background:0 0;border:none;border-bottom:1px solid #f1f5f9;width:100%;padding:8px 14px;font-size:13px}.year-dropdown button.active,.year-dropdown button:hover{color:#1598e5;background:#eff9ff;font-weight:600}.month-tabs-container{scrollbar-width:none;align-items:center;gap:2px;padding-left:4px;display:flex;overflow-x:auto}.month-tabs-container::-webkit-scrollbar{display:none}.month-button{color:#4b5563;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:15px;height:30px;padding:0 10px;font-size:13px;font-weight:500;transition:all .15s}.month-button.selected{color:#1598e5;background:#eff9ff;font-weight:600}.popular-toolbar{justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px;display:flex}.category-tabs{background:#fff;border:1px solid #e2e8f0;border-radius:22px;align-items:center;gap:4px;padding:4px;display:flex;box-shadow:0 1px 3px #00000008}.category-tab{color:#4b5563;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:17px;height:32px;padding:0 18px;font-size:13px;font-weight:500;transition:all .2s}.category-tab.active{color:#fff;background:#299ee8;font-weight:600;box-shadow:0 2px 6px #299ee840}.view-controls{align-items:center;gap:6px;display:flex}.view-button{color:#9ca3af;cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:32px;height:32px;transition:all .15s;display:flex}.view-button.active{color:#299ee8;background:#eff8fd}.search-bar-wrapper{align-items:center;gap:14px;margin-bottom:24px;display:flex}.search-container{background:#f8fafc;border:1px solid #e5e7eb;border-radius:24px;flex:1;align-items:center;height:48px;padding:0 20px;display:flex}.search-icon{color:#6b7280;flex-shrink:0;margin-right:12px}.search-container input{color:#1f2937;background:0 0;border:none;outline:none;width:100%;font-size:14px}.search-container input::placeholder{color:#6b7280}.clear-search-btn{color:#9ca3af;cursor:pointer;background:0 0;border:none;align-items:center;padding:0;display:flex}.clear-search-btn:hover{color:#4b5563}.advance-search-btn{color:#374151;cursor:pointer;white-space:nowrap;background:#f8fafc;border:1px solid #e2e8f0;border-radius:24px;align-items:center;gap:8px;height:48px;padding:0 20px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.advance-search-btn:hover,.advance-search-btn.active{color:#1598e5;background:#eff8fd;border-color:#299ee8}.advance-search-panel{background:#fff;border:1px solid #e2e8f0;border-radius:16px;margin-bottom:24px;padding:18px 24px;animation:.25s slideIn;box-shadow:0 4px 12px #0000000a}.panel-header{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.panel-title{color:#111827;align-items:center;gap:6px;font-size:14px;font-weight:600;display:flex}.reset-btn{color:#6b7280;cursor:pointer;background:0 0;border:none;align-items:center;gap:4px;font-size:12px;display:flex}.reset-btn:hover{color:#299ee8}.panel-filters-grid{flex-wrap:wrap;gap:28px;display:flex}.filter-group{flex-direction:column;gap:8px;display:flex}.filter-group label{color:#4b5563;font-size:12px;font-weight:600}.filter-pills{flex-wrap:wrap;gap:6px;display:flex}.filter-pill{color:#4b5563;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:14px;height:28px;padding:0 12px;font-size:12px;font-weight:500;transition:all .15s}.filter-pill.active,.filter-pill:hover{color:#fff;background:#299ee8;border-color:#299ee8}.empty-search-state{text-align:center;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;margin:20px 0 36px;padding:48px 24px;display:flex}.empty-icon-wrapper{color:#299ee8;background:#eff8fd;border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;margin-bottom:16px;display:flex;box-shadow:0 4px 12px #299ee826}.empty-search-state h3{color:#111827;margin:0 0 8px;font-size:20px;font-weight:700}.empty-search-state p{color:#64748b;max-width:480px;margin:0 0 24px;font-size:14px;line-height:1.5}.suggested-searches-box{flex-direction:column;align-items:center;gap:10px;margin-bottom:24px;display:flex}.suggested-title{color:#475569;align-items:center;gap:6px;font-size:12px;font-weight:600;display:flex}.suggested-pills{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.suggested-pill{color:#299ee8;cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:16px;height:32px;padding:0 16px;font-size:13px;font-weight:600;transition:all .2s}.suggested-pill:hover{color:#fff;background:#299ee8;border-color:#299ee8}.clear-search-action-btn{color:#fff;cursor:pointer;background:#299ee8;border:none;border-radius:20px;height:40px;padding:0 24px;font-size:14px;font-weight:600;transition:all .2s;box-shadow:0 2px 8px #299ee84d}.clear-search-action-btn:hover{background:#1587cd}.search-results-container{flex-direction:column;gap:24px;display:flex}.search-result-card{border-bottom:1px solid #f1f5f9;flex-direction:column;gap:12px;padding-bottom:24px;display:flex}.search-result-card:last-child{border-bottom:none}.search-author-header{align-items:center;gap:12px;display:flex}.author-avatar{object-fit:cover;border-radius:50%;width:34px;height:34px}.author-meta{flex-direction:column;display:flex}.author-name{color:#111827;font-size:14px;font-weight:700;line-height:1.2}.author-link{color:#168fd5;font-size:12px;text-decoration:none}.author-link:hover{text-decoration:underline}.search-item-content{align-items:flex-start;gap:20px;margin-top:4px;display:flex}.search-thumbnail-wrapper{background:#e2e8f0;border-radius:10px;flex-shrink:0;width:180px;height:110px;overflow:hidden}.search-thumbnail{object-fit:cover;width:100%;height:100%}.search-item-details{flex-direction:column;gap:4px;display:flex}.search-item-title{color:#111827;margin:0;font-size:16px;font-weight:700;line-height:1.3}.highlighted-term{color:#111827;font-weight:800}.search-item-author{color:#6b7280;font-size:13px}.search-rating-row{align-items:center;gap:6px;margin:2px 0;display:flex}.search-item-price{color:#111827;margin-top:2px;font-size:15px;font-weight:700}.search-actions-row{flex-wrap:wrap;align-items:center;gap:10px;margin-top:4px;display:flex}.search-action-btn{color:#374151;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:16px;height:32px;padding:0 16px;font-size:12px;font-weight:500;transition:all .2s;box-shadow:0 1px 2px #00000005}.search-action-btn:hover{color:#299ee8;background:#eff8fd;border-color:#299ee8}.cards-container{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;display:grid}.class-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;flex-direction:column;min-width:0;padding:16px;transition:transform .2s,box-shadow .2s;display:flex;position:relative}.class-card:hover{box-shadow:0 6px 16px #0000000f}.card-heading{justify-content:space-between;align-items:flex-start;min-height:44px;margin-bottom:12px;display:flex}.card-title{overflow-wrap:anywhere;color:#111827;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;padding-right:8px;font-size:15px;font-weight:700;line-height:1.25;display:-webkit-box;overflow:hidden}.more-menu-wrapper{position:relative}.more-button{color:#6b7280;cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;padding:2px;display:flex}.more-menu{z-index:20;background:#fff;border:1px solid #e2e8f0;border-radius:8px;min-width:110px;padding:4px 0;position:absolute;top:100%;right:0;box-shadow:0 4px 12px #0000001a}.more-menu button{text-align:left;color:#4b5563;cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:8px 12px;font-size:12px;display:flex}.more-menu button:hover{color:#1598e5;background:#eff9ff}.card-tags-row{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.tag-pill{color:#1d4ed8;background:#eff6ff;border-radius:10px;padding:2px 8px;font-size:11px;font-weight:500}.card-image-wrapper{background:#e2e8f0;border-radius:12px;width:100%;height:145px;margin-bottom:12px;position:relative;overflow:hidden}.card-image-wrapper.yellow-banner{background:#facc15;border-radius:14px;padding:4px}.card-image{object-fit:cover;border-radius:10px;width:100%;height:100%}.card-body{flex-direction:column;flex:1;min-width:0;display:flex}.card-author{overflow-wrap:anywhere;color:#6b7280;margin-bottom:6px;font-size:13px;font-weight:500}.card-rating-row{align-items:center;gap:6px;margin-bottom:12px;display:flex}.popular-card-detail{color:#64748b;min-height:36px;margin:0 0 12px;font-size:12px;line-height:1.45}.rating-num{color:#111827;font-size:13px;font-weight:700}.star-icons{align-items:center;gap:2px;display:flex}.card-footer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-top:auto;padding-top:8px;display:flex}.card-price-info{overflow-wrap:anywhere;color:#111827;min-width:0;font-size:14px;font-weight:700}.card-action-btn{color:#374151;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:16px;flex:none;height:32px;padding:0 16px;font-size:12px;font-weight:600;transition:all .2s;box-shadow:0 1px 2px #00000008}.card-action-btn:hover{color:#299ee8;background:#eff8fd;border-color:#299ee8}.cards-container.list-view{grid-template-columns:1fr;gap:16px}.cards-container.list-view .class-card{flex-direction:row;align-items:center;gap:20px;padding:16px 20px}.cards-container.list-view .card-heading{flex:1;min-height:auto;margin-bottom:0}.cards-container.list-view .card-image-wrapper{flex-shrink:0;width:180px;height:110px;margin-bottom:0}.cards-container.list-view .card-body{flex-direction:row;flex:2;justify-content:space-between;align-items:center;gap:20px}.cards-container.list-view .card-footer{gap:16px;margin-top:0;padding-top:0}.load-more-container{justify-content:center;margin-top:36px;display:flex}.load-more-btn{color:#111827;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:20px;height:40px;padding:0 32px;font-size:14px;font-weight:600;transition:all .2s;box-shadow:0 1px 3px #0000000a}.load-more-btn:hover{color:#299ee8;background:#eff8fd;border-color:#299ee8}@media (max-width:1024px){.cards-container{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:768px){.cards-container{grid-template-columns:repeat(2,minmax(0,1fr))}.popular-heading-row{flex-direction:column;align-items:flex-start}.date-selector{width:100%;max-width:100%;overflow-x:auto}.popular-toolbar{align-items:flex-start}.category-tabs{min-width:0;overflow-x:auto}}@media (max-width:600px){.popular-main{padding-top:16px;padding-bottom:32px}.popular-heading-row{margin-bottom:14px}.popular-title{font-size:20px}.date-selector{width:100%;display:flex}.popular-toolbar{margin-bottom:14px}.category-tabs{scrollbar-width:none;width:100%;max-width:100%;overflow-x:auto}.category-tabs::-webkit-scrollbar{display:none}.search-bar-wrapper{flex-direction:column;align-items:stretch;gap:10px}.advance-search-btn{justify-content:center}.search-item-content{flex-direction:column;gap:12px}.search-thumbnail-wrapper{width:100%;height:160px}.search-actions-row{scrollbar-width:none;flex-wrap:nowrap;padding-bottom:4px;overflow-x:auto}.search-action-btn{flex-shrink:0}.cards-container{grid-template-columns:1fr;gap:16px}.class-card{flex-direction:column;padding:12px;display:flex}.card-image-wrapper{order:-1;height:160px;margin-bottom:12px}.card-heading{min-height:auto;margin-bottom:4px}.card-title{font-size:15px}.view-controls{flex:none}.popular-toolbar{flex-wrap:wrap}.category-tabs{flex:100%}.card-footer{align-items:flex-start}.card-price-info{flex:100%}.card-action-btn{width:100%}.advance-search-panel{padding:16px}.panel-header{align-items:flex-start;gap:12px}.filter-pills{gap:8px}}.tab-count-badge{border-radius:10px;justify-content:center;align-items:center;margin-left:6px;padding:1px 7px;font-size:11px;font-weight:700;transition:all .2s;display:inline-flex}.tab-count-badge.has-count{color:#fff;background:#299ee8}.category-tab.active .tab-count-badge.has-count{color:#299ee8;background:#fff}.tab-count-badge.zero-count{color:#94a3b8;background:#e2e8f0}.quick-search-pills-row{flex-wrap:wrap;align-items:center;gap:12px;margin-top:10px;margin-bottom:20px;display:flex}.pills-label{color:#64748b;align-items:center;gap:4px;font-size:12px;font-weight:600;display:flex}.pills-list{flex-wrap:wrap;gap:8px;display:flex}.quick-pill{color:#475569;cursor:pointer;background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;height:28px;padding:0 14px;font-size:12px;font-weight:500;transition:all .2s}.quick-pill:hover,.quick-pill.active{color:#0284c7;background:#e0f2fe;border-color:#38bdf8;font-weight:600}.cross-category-alert{background:#eff6ff;border:1px solid #bfdbfe;border-radius:12px;justify-content:space-between;align-items:center;gap:12px;width:100%;max-width:520px;margin-bottom:20px;padding:14px 20px;display:flex}.cross-category-alert p{color:#1e40af;margin:0;font-size:13px}.switch-category-btn{color:#fff;cursor:pointer;white-space:nowrap;background:#2563eb;border:none;border-radius:8px;align-items:center;gap:6px;padding:6px 14px;font-size:12px;font-weight:600;transition:background .2s;display:inline-flex}.switch-category-btn:hover{background:#1d4ed8}