.page-contet{backdrop-filter:blur(2px);padding:0 20px;position:relative;min-height:300px}.fixed-box{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;top:32px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.hero-desc{font-family:PingFangSC,PingFang SC;font-weight:400;font-size:14px;color:#606266;line-height:16px;text-align:left;font-style:normal;margin-top:17px;white-space:nowrap}.filter-bar{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;gap:16px;margin-top:85px}.filter-bar,.tab-group{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.tab-group{-ms-flex-negative:0;flex-shrink:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:4px;width:188px;height:40px;-webkit-box-sizing:border-box;box-sizing:border-box;padding:4px;background:#fff;border:1px solid #ebebee;border-radius:8px}.tab-btn{-webkit-box-flex:0;-ms-flex:0 0 88px;flex:0 0 88px;width:88px;height:32px;margin:0;padding:0;border:none;outline:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;-webkit-transition:background .2s ease,color .2s ease;transition:background .2s ease,color .2s ease;color:#13151f;background-color:#fff}.tab-btn:hover{color:#2a5af9}.tab-btn.active{font-weight:600;background:rgba(42,90,249,.06);color:#2a5af9}.search-box{position:relative;-ms-flex-negative:0;flex-shrink:0;width:200px;height:32px;-webkit-box-sizing:border-box;box-sizing:border-box}.search-icon{position:absolute;right:10px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);color:#909399;pointer-events:none}.search-input{width:100%;height:32px;padding:6px 30px 6px 12px;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px solid #ebebee;border-radius:6px;font-size:13px;color:#13151f;outline:none;background:#fff;-webkit-transition:border-color .2s ease;transition:border-color .2s ease}.search-input:hover{border:1px solid #2a5af9}.search-input::-webkit-input-placeholder{color:#c0c4cc}.search-input::-moz-placeholder{color:#c0c4cc}.search-input:-ms-input-placeholder{color:#c0c4cc}.search-input::-ms-input-placeholder{color:#c0c4cc}.search-input::placeholder{color:#c0c4cc}.search-input:focus{border-color:#2a5af9}.skill-grid{display:grid;width:100%;-webkit-box-sizing:border-box;box-sizing:border-box;grid-template-columns:repeat(auto-fill,minmax(min(100%,252px),1fr));gap:16px;margin-top:16px;min-height:200px;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.empty-state{grid-column:1/-1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:160px 0;color:#94a3b8}.empty-text{font-size:14px;margin:0;color:#606266}.skill-card{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%;min-width:0;padding:16px 16px 14px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#fff;border:1px solid #fff;border-radius:12px;-webkit-box-shadow:0 1px 4px rgba(19,21,31,.06);box-shadow:0 1px 4px rgba(19,21,31,.06);-webkit-transition:-webkit-box-shadow .2s ease;transition:-webkit-box-shadow .2s ease;transition:box-shadow .2s ease;transition:box-shadow .2s ease,-webkit-box-shadow .2s ease}.skill-card:hover{-webkit-box-shadow:0 4px 12px rgba(19,21,31,.08);box-shadow:0 4px 12px rgba(19,21,31,.08)}.card-header{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;margin-bottom:10px;padding-right:52px}.card-header,.free-tag{display:-webkit-box;display:-ms-flexbox;display:flex}.free-tag{position:absolute;top:0;right:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:48px;height:24px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#f2f9ff;border-radius:0 12px 0 12px;font-size:12px;font-weight:500;color:#189cfd;line-height:1}.card-content{-webkit-box-flex:1;-ms-flex:1;flex:1;min-height:0;margin-bottom:10px;overflow:hidden}.skill-name{max-width:100%;min-height:24px;margin:0 0 6px 0;font-size:16px;font-weight:500;color:#13151f;line-height:24px;text-overflow:ellipsis;white-space:nowrap}.skill-desc,.skill-name{font-family:PingFang SC,PingFangSC,sans-serif;overflow:hidden;text-align:left}.skill-desc{margin:0;font-size:13px;font-weight:400;color:#606266;line-height:22px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.action-btn{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:100%;max-width:100%;height:36px;margin:0;-ms-flex-item-align:stretch;align-self:stretch;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;-webkit-transition:background .2s ease,border-color .2s ease,color .2s ease;transition:background .2s ease,border-color .2s ease,color .2s ease;border:1px solid rgba(42,90,249,.12);background:#eef2ff;color:#2a5af9}.action-btn:hover:not(.added):not(:disabled){background:#2a5af9;color:#fff}.action-btn__icon{margin-right:4px;font-size:16px}.action-btn.added{border:1px solid #ebebee;background:#f8f8fa;color:#606266}.action-btn.is-remove{border:1px solid rgba(255,67,64,.2);background:rgba(255,67,64,.08);color:#ff4340}.action-btn:disabled{opacity:.6;cursor:not-allowed}