.element-search-section {
            background-color: #fff;
            padding: 0rem 2.2rem 1rem 2.2rem;
            color: #333;
        }

        .element-search-section * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        /* 搜索头部 */
        .ess-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 40px;
            flex-wrap: wrap;
            gap: 20px;
        }

        .ess-page-title {
            font-size: max(0.36rem, 36px);
            font-weight: 800;
            line-height: 116.667%;
        }

        .ess-search-wrapper {
            position: relative;
            width: 100%;
            max-width: 500px;
            display: flex;
        }

        .ess-search-input {
            flex: 1;
            height: 46px;
            padding: 0 15px;
            border: 1px solid #b5b5b5;
            font-size: 18px;
            outline: none;
        }

        .ess-search-button {
            width: 66px;
            height: 46px;
            background-color: #2f67b3;
            border: none;
            border-radius: 0 8px 8px 0;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .ess-search-icon {
            width: 20px;
            height: 20px;
            fill: none;
            stroke: white;
            stroke-width: 2;
        }

        /* 列表展示 */
        .ess-table-header {
            display: grid;
            grid-template-columns: 1fr 2fr 1.5fr 50px;
            padding: 15px 20px;
            font-size: 18px;
            font-weight: 800;
            border-bottom: 1px solid #595959;
            text-align: center;
        }

        .ess-element-item {
            border-bottom: 1px solid rgba(183, 183, 183, 0.2);
        }

        .ess-element-row {
            display: grid;
            grid-template-columns: 1fr 2fr 1.5fr 50px;
            padding: 20px;
            cursor: pointer;
            transition: background 0.2s;
            align-items: center;
            font-size: 18px;
            text-align: center;
        }

        .ess-element-row:hover {
            background-color: #f9f9f9;
        }

        .ess-expand-icon {
            width: 14px;
            transition: transform 0.3s;
        }

        .ess-element-item.expanded .ess-expand-icon {
            transform: rotate(180deg);
        }

        /* 详情内容 */
        .ess-element-detail {
            max-height: 0;
            overflow: hidden;
            /* transition: all 0.4s ease-out; */
            background-color: #fafafa;
        }

        .ess-element-item.expanded .ess-element-detail {
            max-height: 1200px;
            padding: 30px 20px;
        }

        .ess-detail-flex {
            display: grid;
            gap: 0.44rem;
            grid-template-columns: 1fr 2.2fr 1.5fr 80px;
            align-items: flex-start;
            justify-items: center;
        }

        .ess-element-card {
            background: linear-gradient(135deg, #7D5C9C 0%, #9B7BB8 100%);
            width: 150px;
            height: 150px;
            color: white;
            border-radius: 4px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            flex-shrink: 0;
        }

        .ess-card-num {
            font-size: 20px;
            font-weight: 500;
            padding-left: 0.15rem;
        }

        .ess-card-sym {
            font-size: 60px;
            font-weight: 800;
            text-align: center;
        }

        .ess-card-name {
            font-size: 16px;
            text-align: center;
        }

        .ess-info-box {
            flex: 1;
        }

        .ess-description {
            font-size: max(0.18rem, 16px);
            line-height: 1.6;
            margin-bottom: 20px;
        }

        .ess-description p {
            margin-bottom: 10px;
        }

        .ess-properties {
            display: grid;
            gap: 15px 30px;
            font-size: 16px;
            width: 100%;
        }

        .ess-prop-row {
            display: flex;
            justify-content: space-between;
            line-height: 144.444%;
        }

        .ess-prop-label {
            font-weight: 800;
            font-size: max(0.18rem, 16px)
        }

        /* 默认隐藏除第一个以外的所有描述块 */
        .ess-description .sam-el-desc {
            display: none;
            margin-bottom: 0.15rem;
        }

        .ess-description .sam-el-desc:first-of-type {
            display: block;
        }

        /* 当父级拥有 .is-expanded 类时，显示所有 */
        .ess-description.is-expanded .sam-el-desc {
            display: block;
        }

        /* Read More 按钮样式 */
        .ess-read-more-btn {
            display: inline-block;
            color: #2f67b3;
            font-size: max(0.18rem, 16px);
            cursor: pointer;
            line-height: 150%;
        }

        .ess-read-more-btn:hover {
            color: #1a4a8d;
        }

        /* 过滤 */
        .element-filter-section {
            margin: 0rem 2.2rem 0.42rem 2.2rem;
            margin-top: 0;
            margin-bottom: 0.42rem;
            border-radius: 16px;
            background: #F8F8F8;
            padding: 0.31rem 0.32rem;
            align-items: center;
        }

        .blog-introduce {
            padding-bottom: 0.42rem;
        }

        .filter-title {
            color: #333;
            font-size: max(0.22rem, 16px);
            font-style: normal;
            font-weight: 800;
            line-height: 145.455%;
            /* 145.455% */
            text-transform: capitalize;
            margin-bottom: 0.2rem;
        }

        .filter-child {
            padding: 0.12rem 0.23rem;
            border-radius: 0.25rem;
            border: 1px solid #72A4E5;
            font-size: max(0.18rem, 14px);
            font-weight: 800;
            line-height: 144.444%;
            cursor: pointer;
        }

        .filter-item {
            display: flex;
            gap: 0.2rem;
            flex-wrap: wrap;
            justify-content: flex-end;
        }

        .metals-type,
        .states,
        .structure {
            display: flex;
            gap: 0.2rem;
            cursor: pointer;
            align-items: center;
        }

        .metals-type::after,
        .states::after {
            content: '';
            width: 1px;
            display: inline-block;
            background: #333;
            height: 0.31rem;
        }

        .filter-second-menu {
            display: none;
        }

        .filter-choose {
            color: white;
            background: #2F67B3;
        }

        .second-childs {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            flex-wrap: wrap;
            gap: 0.15rem;
            padding: 0.18rem 0.25rem;
            border-radius: 12px;
            border: 2px solid #2F67B3;
        }

        .element-title {
            display: none;
        }

        .filter-element-title {
            color: #333;
            font-size: max(0.19rem, 14px);
            font-style: normal;
            font-weight: 800;
            line-height: 144.444%;
        }

        .filter-element-desc {
            color: #333;
            font-size: max(0.18rem, 12px);
            font-style: normal;
            font-weight: 500;
            line-height: 150%;
        }

        /* 元素筛选 */
        .element-gray {
            background: #B8B8B8 !important;
        }

        .second-child-reset {
            margin-top: 0.18rem;
            color: #2F67B3;
            font-size: max(0.18rem, 14px);
            font-style: normal;
            font-weight: 800;
            line-height: 144.444%;
            text-decoration-line: underline;
            text-decoration-style: solid;
            text-decoration-skip-ink: none;
            text-decoration-thickness: auto;
            text-underline-offset: auto;
            text-underline-position: from-font;
            cursor: pointer;
        }

        @media screen and (max-width: 1400px) {
            .element-filter-section {
                margin: 0.6rem 1.2rem 0.25rem;
            }

            .element-search-section {
                padding: 0.6rem 1.2rem 0.25rem;
            }
        }

        @media (max-width: 1025px) {
            .ess-page-title {
                font-size: 18px;
            }

            .ess-search-input {
                font-size: 12px;
            }

            .ess-search-input {
                height: 23px;
            }

            .ess-search-button {
                height: 23px;
                width: 33px;
                border-radius: 0 4px 4px 0;
            }

            .ess-search-icon {
                width: 10px;
                height: 10px;
            }

            .ess-header {
                margin-bottom: 10px;
            }

            .element-filter-section {
                margin: 0.1rem 0.3rem 0.3rem 0.3rem;
            }

            .element-search-section {
                padding: 0.1rem 0.3rem 0.3rem 0.3rem;
            }

            .mobile-info-display {
                padding: 0.1rem 0.3rem 0.3rem 0.3rem;
            }

            .mobile-info-display .filter-element-title {
                color: #333;
                font-size: 15px;
                font-style: normal;
                font-weight: 800;
                line-height: 166.667%;
                /* 166.667% */
                text-transform: capitalize;
                margin-bottom: 7.5px;
            }

            .filter-element-desc {
                font-weight: 400;
            }
            .ess-detail-flex {
                grid-template-columns: 1fr;
            }

            .ess-properties {
                grid-template-columns: 1fr;
                width: 100%;
            }

            .ess-element-card {
                height: auto;
            }

            .ess-card-name {
                padding-bottom: 15px;
            }

            .ess-table-header,
            .ess-element-row {
                grid-template-columns: 1fr 1.5fr 1.5fr 10px;
                font-size: 15px;
                text-align: center;
            }

            .ess-search-input {
                color: #B5B5B5;
                border-color: #B5B5B5;
            }

            .filter-child {
                color: #333;
                text-align: center;
                font-size: 12px;
                font-style: normal;
                font-weight: 400;
                line-height: 150%;
            }

            .filter-choose {
                color: white;
            }
        }