.xu5-archive-tutorial{min-height:100vh;padding-top:0;padding-bottom:0px}.archive-container-full{max-width:none;margin:0;padding:0}.xu5-tutorial-archive-wrapper{max-width:1100px}.archive-content-wrapper{background:transparent;border-radius:0;box-shadow:none;padding:8px 20px 24px}.archive-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.tutorial-search{position:relative;margin:0 0 16px}.tutorial-search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:#aaa;pointer-events:none}.tutorial-search-input{width:100%;height:34px;border-radius:4px;border:1px solid #e8e8e8;font-size:13px;padding:0 32px 0 32px;outline:none;background:#f8f9fa;transition:border-color .2s,box-shadow .2s,background .2s;box-sizing:border-box}.tutorial-search-input::-webkit-search-cancel-button,.tutorial-search-input::-webkit-search-decoration,.tutorial-search-input::-ms-clear{-webkit-appearance:none;appearance:none;display:none}.tutorial-search-input:focus{border-color:#409eff;background:#fff;box-shadow:0 0 0 3px rgba(64,158,255,0.12)}.tutorial-search-clear{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:22px;height:22px;border:0;background:transparent;font-size:16px;color:#999;cursor:pointer;line-height:1;padding:0}.tutorial-search-clear[hidden]{display:none}.tutorial-search-info,.tutorial-search-empty{text-align:center;color:#666;margin:0 0 16px;font-size:14px;padding:12px;background:#f5f5f5;border-radius:4px}.tutorial-search-info[hidden],.tutorial-search-empty[hidden],.tutorial-search-results[hidden]{display:none !important}.xu5-archive-tutorial.is-searching .tutorial-list-default,.xu5-archive-tutorial.is-searching .archive-pagination-default,.xu5-archive-tutorial.is-searching .no-tutorials{display:none}.tutorial-search-pager[hidden]{display:none !important}.xu5-archive-tutorial .xu5-hl{background:rgba(64,158,255,0.22);color:inherit;border-radius:3px;padding:0 1px}.archive-container-sidebar{display:grid;grid-template-columns:1fr 260px;gap:24px;align-items:start}.archive-main{order:1;min-width:0}.archive-sidebar{order:2;position:sticky;top:80px}.sidebar-widget{background:transparent;border:1px solid #e9ecef;border-radius:8px;padding:10px 12px;margin-bottom:0;box-shadow:none}.sidebar-widget+.sidebar-widget{margin-top:10px}.widget-title{font-size:16px;font-weight:400;margin:0 0 8px;padding-bottom:6px;border-bottom:1px solid #eee;color:#333}.popular-list{list-style:none;margin:0;padding:0}.popular-list li{margin:0;padding:0;border-bottom:1px solid #f5f5f5}.popular-list li:last-child{margin:0;padding:0;border-bottom:none}.popular-list a{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:7px 0;text-decoration:none;color:#333}.popular-list a:hover .popular-title{color:#409eff}.popular-title{flex:1;min-width:0;font-size:13px;font-weight:400;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.popular-meta{flex-shrink:0;font-size:11px;color:#999}.tutorial-list{display:flex;flex-direction:column;gap:0}.tutorial-item{border-bottom:1px solid #f5f5f5}.tutorial-item:last-child{border-bottom:none}.tutorial-item .item-link{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 0;text-decoration:none;color:inherit}.item-title{flex:1;min-width:0;font-size:15px;font-weight:400;margin:0;color:#333;line-height:1.45}.tutorial-item .item-link:hover .item-title{color:#409eff}.tutorial-list .meta-date{flex-shrink:0;font-size:12px;color:#999}.pinned-badge{display:inline-block;margin-right:6px;padding:0 5px;border:1px solid #e6a23c;border-radius:4px;background:transparent;color:#e6a23c;font-size:11px;font-weight:500;line-height:1.4;vertical-align:middle}.archive-pagination{margin-top:28px;display:flex;justify-content:center}.archive-pagination .page-numbers{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px;list-style:none;margin:0;padding:0}.archive-pagination .page-numbers li{display:flex}.archive-pagination a,.archive-pagination .xu5-page-num,.archive-pagination .xu5-page-nav{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 8px;border:0;background:transparent;box-shadow:none;border-radius:8px;color:#606266;font-size:13px;font-weight:400;line-height:1;text-decoration:none;cursor:pointer;font-family:inherit;transition:color .15s ease,background .15s ease}.archive-pagination a::before,.archive-pagination a::after,.archive-pagination .xu5-page-nav::before,.archive-pagination .xu5-page-nav::after{content:none !important;display:none !important}.archive-pagination a.xu5-page-num:hover{color:#409eff;background:#ecf5ff}.archive-pagination .xu5-page-num.is-current{background:#409eff;color:#fff;font-weight:600;cursor:default}.archive-pagination .xu5-page-num.is-dots{min-width:18px;color:#c0c4cc;background:none;cursor:default}.archive-pagination .xu5-page-nav{min-width:auto;padding:0 12px;color:#909399;background:none}.archive-pagination .xu5-page-nav:hover{color:#409eff;background:none;transform:none;box-shadow:none}.no-tutorials{text-align:center;color:#999;padding:48px 12px}.no-icon{font-size:2rem;margin-bottom:8px;display:block}.no-tutorials p{font-size:14px;color:#999;margin:0}@media (max-width:992px){.archive-container-full{padding:0 5px}.archive-container-sidebar{grid-template-columns:1fr;gap:20px}.archive-sidebar{position:static;display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}.sidebar-widget+.sidebar-widget{margin-top:0}}@media (max-width:768px){.archive-container-full{margin:3px auto;padding:0 10px}.archive-content-wrapper{padding:4px 12px 16px}.tutorial-search-input{height:40px;font-size:16px}.archive-sidebar{grid-template-columns:1fr}.tutorial-item .item-link{padding:9px 0;gap:8px}.item-title{font-size:14px}.archive-pagination a,.archive-pagination .xu5-page-num{min-width:30px;height:30px;padding:0 6px;font-size:12px}.archive-pagination .xu5-page-nav{padding:0 8px}}@media (max-width:640px){.tutorial-item .item-link{flex-wrap:wrap}.tutorial-list .meta-date{width:100%;margin-top:-2px}}@media (max-width:480px){.archive-container-full{margin:5px auto;padding:0 8px}.archive-content-wrapper{padding:12px}}.xu5-tutorial-archive-wrapper .archive-container-full{margin:0;max-width:none}