@media (max-width: 640px) {
    html {
        scroll-padding-bottom: 92px;
    }

    body.cj-theme {
        padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
        overflow-x: hidden;
    }

    .cj-ai-home {
        overflow-x: hidden;
    }

    .cj-ai-search {
        position: relative;
        z-index: 4;
        width: min(100%, 378px) !important;
        height: 50px !important;
        margin: 0 auto !important;
        padding: 0 6px 0 18px !important;
        grid-template-columns: minmax(0, 1fr) 42px !important;
        border-radius: 999px !important;
        box-shadow: 0 12px 26px rgba(35, 93, 178, .1) !important;
    }

    .cj-ai-search input {
        min-width: 0;
        font-size: 13px !important;
    }

    .cj-ai-search button {
        width: 38px !important;
        height: 38px !important;
    }

    .cj-category-grid-section {
        width: min(100% - 24px, 390px) !important;
        margin-top: 18px !important;
        padding: 10px 0 8px !important;
    }

    .cj-category-grid-section.is-slider {
        grid-template-columns: 26px minmax(0, 1fr) 26px !important;
        gap: 7px !important;
    }

    .cj-category-grid-section.is-slider .cj-category-grid {
        width: 100% !important;
        margin-top: 0 !important;
        padding: 4px 0 !important;
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: calc(25% - 8px) !important;
        grid-template-columns: none !important;
        grid-template-rows: none !important;
        gap: 10px !important;
    }

    .cj-category-grid-section.is-wrap .cj-category-grid {
        width: 100% !important;
        margin-top: 0 !important;
        padding: 4px 0 !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .cj-category-grid-section.is-marquee .cj-category-grid {
        margin-top: 0 !important;
        padding: 4px 0 !important;
    }

    .cj-category-card {
        min-width: 0 !important;
        min-height: 68px !important;
        padding: 8px 3px !important;
        display: grid !important;
        grid-template-rows: 34px auto !important;
        grid-template-columns: minmax(0, 1fr) !important;
        place-items: center !important;
        gap: 5px !important;
        overflow: visible !important;
    }

    .cj-category-card span {
        width: 34px !important;
        height: 34px !important;
        margin: 0 !important;
        display: grid !important;
        place-items: center !important;
        border-radius: 11px !important;
        flex: 0 0 34px !important;
    }

    .cj-category-card span .cj-ant-icon,
    .cj-category-card svg {
        width: 17px !important;
        height: 17px !important;
        max-width: 17px !important;
        max-height: 17px !important;
    }

    .cj-category-card strong {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        overflow: hidden !important;
        color: #16233c !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        text-align: center !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .cj-category-card small {
        display: none !important;
    }

    .cj-category-rail {
        width: min(100% - 24px, 390px) !important;
        margin-top: 16px !important;
        padding: 10px 8px 9px !important;
        overflow: hidden !important;
        border-radius: 15px !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .cj-category-rail > button {
        display: none !important;
    }

    .cj-category-rail div {
        width: 100% !important;
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: minmax(70px, 1fr) !important;
        grid-template-columns: none !important;
        gap: 6px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 0 2px 5px !important;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
    }

    .cj-category-rail div::-webkit-scrollbar {
        display: none;
    }

    .cj-category-rail a {
        min-width: 70px !important;
        padding: 6px 2px 4px !important;
        display: grid !important;
        grid-template-rows: 28px auto !important;
        justify-items: center !important;
        gap: 5px !important;
        overflow: hidden !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
        text-align: center !important;
        white-space: nowrap !important;
        scroll-snap-align: start;
    }

    .cj-category-rail a span {
        width: 28px !important;
        height: 28px !important;
        margin: 0 !important;
    }

    .cj-category-rail a span .cj-ant-icon,
    .cj-category-rail svg {
        width: 15px !important;
        height: 15px !important;
    }

    .cj-platform-notice {
        width: min(100% - 24px, 390px) !important;
        min-height: 38px !important;
        margin-top: 14px !important;
        padding: 0 10px !important;
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 8px !important;
        overflow: hidden !important;
        border-radius: 999px !important;
    }

    .cj-notice-label {
        min-width: max-content !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 4px !important;
        font-size: 13px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .cj-platform-notice p {
        min-width: max-content !important;
        max-width: none !important;
        margin: 0 !important;
        display: inline-block !important;
        overflow: visible !important;
        color: #64748b !important;
        font-size: 12px !important;
        line-height: 38px !important;
        white-space: nowrap !important;
        animation: cjNoticeMarquee 13s linear infinite !important;
        will-change: transform;
    }

    .cj-platform-notice a {
        position: relative !important;
        z-index: 2 !important;
        min-width: max-content !important;
        padding-left: 8px !important;
        color: #6f7f99 !important;
        background: #fff !important;
        font-size: 12px !important;
        line-height: 38px !important;
        white-space: nowrap !important;
    }

    .cj-platform-notice a::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -18px;
        width: 18px;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0), #fff);
        pointer-events: none;
    }

    .cj-mobile-tabbar {
        position: fixed !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        z-index: 999 !important;
        width: auto !important;
        height: calc(58px + env(safe-area-inset-bottom)) !important;
        min-height: calc(58px + env(safe-area-inset-bottom)) !important;
        padding: 5px 10px calc(5px + env(safe-area-inset-bottom)) !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: stretch !important;
        gap: 2px !important;
        border: 1px solid rgba(225, 232, 244, .95) !important;
        border-width: 1px 0 0 !important;
        border-radius: 16px 16px 0 0 !important;
        background: rgba(255, 255, 255, .98) !important;
        box-shadow: 0 -8px 24px rgba(29, 78, 138, .1) !important;
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
    }

    .cj-mobile-tabbar a {
        min-width: 0 !important;
        min-height: 46px !important;
        padding: 5px 2px 4px !important;
        display: grid !important;
        grid-template-rows: 22px 18px !important;
        place-items: center !important;
        gap: 2px !important;
        border-radius: 13px !important;
        color: #7a879b !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        line-height: 1 !important;
        text-align: center !important;
        text-decoration: none !important;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
    }

    .cj-mobile-tabbar a .cj-ant-icon,
    .cj-mobile-tabbar a svg {
        width: 21px !important;
        height: 21px !important;
        max-width: 21px !important;
        max-height: 21px !important;
        display: block !important;
        margin: 0 auto !important;
        color: currentColor !important;
        fill: none;
        stroke: currentColor;
    }

    .cj-mobile-tabbar a span {
        width: 100% !important;
        display: block !important;
        overflow: hidden !important;
        font-size: 11px !important;
        line-height: 18px !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .cj-mobile-tabbar a.is-active,
    .cj-mobile-tabbar a:active {
        color: #2368ff !important;
        background: linear-gradient(180deg, rgba(35, 104, 255, .16), rgba(35, 104, 255, .06)) !important;
        font-weight: 800 !important;
    }

    body.cj-night .cj-mobile-tabbar {
        border-color: rgba(255, 255, 255, .1) !important;
        background: rgba(18, 18, 18, .98) !important;
        box-shadow: 0 -8px 24px rgba(0, 0, 0, .32) !important;
    }

    body.cj-night .cj-mobile-tabbar a {
        color: #aeb8ca !important;
    }

    body.cj-night .cj-mobile-tabbar a.is-active,
    body.cj-night .cj-mobile-tabbar a:active {
        color: #6fa4ff !important;
        background: rgba(35, 104, 255, .14) !important;
    }

    .cj-auth-modal {
        align-items: center !important;
        justify-items: center !important;
        padding: 14px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    .cj-auth-dialog {
        width: min(100%, 360px) !important;
        max-width: calc(100vw - 28px) !important;
        max-height: calc(100dvh - 28px) !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
        padding: 22px 18px 18px !important;
        border-radius: 20px !important;
        box-shadow: 0 24px 70px rgba(15, 42, 86, .28) !important;
    }

    .cj-auth-close {
        top: 10px !important;
        right: 10px !important;
        width: 34px !important;
        height: 34px !important;
        border-radius: 50% !important;
        color: #9aa6b8 !important;
        background: #f4f7fb !important;
        line-height: 34px !important;
    }

    .cj-auth-logo {
        margin-bottom: 14px !important;
        text-align: center !important;
    }

    .cj-auth-logo span {
        width: 48px !important;
        height: 48px !important;
        margin-bottom: 6px !important;
        font-size: 24px !important;
    }

    .cj-auth-logo strong {
        font-size: 24px !important;
        line-height: 1.1 !important;
    }

    .cj-auth-tabs {
        margin-bottom: 12px !important;
        gap: 16px !important;
    }

    .cj-auth-tabs button {
        padding-bottom: 6px !important;
        font-size: 16px !important;
    }

    .cj-auth-form.is-active {
        gap: 10px !important;
    }

    .cj-auth-form h2 {
        font-size: 21px !important;
        line-height: 1.2 !important;
    }

    .cj-auth-form p {
        margin: -2px 0 4px !important;
        font-size: 12px !important;
        line-height: 1.5 !important;
    }

    .cj-auth-form label {
        min-width: 0 !important;
        display: block !important;
    }

    .cj-auth-form input {
        width: 100% !important;
        max-width: 100% !important;
        height: 42px !important;
        box-sizing: border-box !important;
        border: 1px solid #e7edf6 !important;
        border-radius: 12px !important;
        padding: 0 12px !important;
        background: #f8fbff !important;
        font-size: 13px !important;
    }

    .cj-auth-meta {
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 8px !important;
        font-size: 12px !important;
    }

    .cj-auth-meta label {
        display: inline-flex !important;
        align-items: center !important;
        gap: 5px !important;
    }

    .cj-auth-meta input {
        width: 14px !important;
        height: 14px !important;
        padding: 0 !important;
        border-radius: 3px !important;
    }

    .cj-code-row {
        grid-template-columns: minmax(0, 1fr) 96px !important;
        gap: 8px !important;
    }

    .cj-code-row button {
        width: 96px !important;
        height: 40px !important;
        padding: 0 8px !important;
        border-radius: 12px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }

    .cj-auth-submit {
        width: 100% !important;
        height: 44px !important;
        margin-top: 2px !important;
        border-radius: 14px !important;
        font-size: 14px !important;
        font-weight: 800 !important;
    }

    .cj-header-user {
        max-width: 42px !important;
    }

    .cj-header-avatar {
        width: 38px !important;
        height: 38px !important;
        justify-content: center !important;
        padding: 0 !important;
    }

    .cj-header-avatar span,
    .cj-header-user-menu {
        display: none !important;
    }

    .cj-user-center-v2 {
        width: min(100% - 24px, 390px) !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
        margin-top: 18px !important;
    }

    .cj-user-menu-v2 {
        position: static !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        padding: 12px !important;
    }

    .cj-user-hero-card {
        grid-column: 1 / -1 !important;
        padding: 16px 12px !important;
    }

    .cj-user-menu-v2 button,
    .cj-user-logout {
        min-height: 38px !important;
        justify-content: center !important;
        padding: 0 8px !important;
        font-size: 12px !important;
    }

    .cj-user-panel-v2 {
        border-radius: 16px !important;
    }

    .cj-user-stats-v2 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        padding: 12px !important;
    }

    .cj-user-stats-v2 span {
        padding: 12px !important;
    }

    .cj-profile-grid,
    .cj-favorite-list-v2 {
        grid-template-columns: 1fr !important;
    }

    .cj-user-table {
        display: block !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    .cj-user-table-head,
    .cj-user-table-row {
        min-width: 620px !important;
    }

    .cj-user-table-three .cj-user-table-head,
    .cj-user-table-three .cj-user-table-row {
        min-width: 430px !important;
    }

    .cj-category-grid-section.is-mobile-slider {
        grid-template-columns: 26px minmax(0, 1fr) 26px !important;
    }

    .cj-category-grid-section.is-mobile-slider .cj-category-grid {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: calc(50% - 5px) !important;
        grid-template-rows: repeat(2, 76px) !important;
        gap: 10px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory;
    }

    .cj-category-grid-section.is-mobile-slider .cj-category-card {
        scroll-snap-align: start;
    }

    .cj-category-grid-section.is-mobile-wrap .cj-category-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: none !important;
    }

    .cj-category-rail.is-mobile-marquee div {
        animation: cjCategoryMarquee 18s linear infinite !important;
    }

    .cj-category-rail.is-mobile-marquee:hover div,
    .cj-category-rail.is-mobile-marquee:focus-within div {
        animation-play-state: paused !important;
    }

    .cj-ai-plan-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        overflow: visible !important;
        scroll-snap-type: none !important;
    }

    .cj-ai-plan {
        width: 100% !important;
        min-height: 230px !important;
        grid-template-columns: 1fr !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 22px !important;
    }

    .cj-ai-plan > div {
        min-height: 156px !important;
    }

    .cj-ai-plan ul {
        display: grid !important;
        gap: 4px !important;
    }

    .cj-ai-plan i {
        right: 18px !important;
        top: 58px !important;
        opacity: .18 !important;
    }

    .cj-ai-plan button {
        position: static !important;
        width: 100% !important;
        margin-top: 14px !important;
    }

    .cj-mobile-tabbar {
        height: calc(64px + env(safe-area-inset-bottom)) !important;
        border-radius: 20px 20px 0 0 !important;
        padding: 6px 10px calc(6px + env(safe-area-inset-bottom)) !important;
        box-shadow: 0 -12px 30px rgba(30, 78, 138, .16) !important;
    }

    .cj-mobile-tabbar a.is-active {
        border-radius: 16px !important;
        box-shadow: inset 0 0 0 1px rgba(35, 104, 255, .12), 0 8px 18px rgba(35, 104, 255, .12) !important;
    }

    .cj-user-center-page {
        width: min(100% - 24px, 430px) !important;
        margin-top: 12px !important;
    }

    .cj-user-shell-card {
        padding: 12px !important;
        border-radius: 18px !important;
    }

    .cj-user-hero-panel {
        min-height: 192px !important;
        border-radius: 16px !important;
    }

    .cj-user-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        padding: 12px 0 0 !important;
    }

    .cj-user-feature-grid a {
        min-height: 50px !important;
        font-size: 13px !important;
    }

    .cj-user-stats-v3 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .cj-user-stats-v3 span {
        min-height: 82px !important;
        padding: 14px !important;
    }

    .cj-user-section-v3 {
        padding: 16px !important;
        border-radius: 16px !important;
    }

    .cj-profile-edit-form {
        grid-template-columns: 1fr !important;
    }

    .cj-profile-edit-form small {
        grid-column: auto !important;
    }

    .cj-message-topbar {
        top: 58px !important;
        grid-template-columns: 42px 1fr 42px !important;
    }

    .cj-message-topbar h1 {
        font-size: 24px !important;
    }

    .cj-message-card {
        grid-template-columns: 86px minmax(0, 1fr) !important;
        gap: 14px !important;
        padding: 18px 14px !important;
        border-radius: 18px !important;
    }

    .cj-message-bell {
        width: 72px !important;
        height: 72px !important;
    }

    .cj-message-bell .cj-ant-icon {
        width: 32px !important;
        height: 32px !important;
    }

    .cj-message-card h2 {
        font-size: 17px !important;
    }

    .cj-message-card p,
    .cj-message-card time {
        font-size: 14px !important;
    }
}

@media (max-width: 640px) {
    .cj-footer-qrcode {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .cj-footer-qrcode span {
        width: auto !important;
        flex: initial !important;
        min-width: 0 !important;
    }

    .cj-mobile-menu-item > a,
    .cj-mobile-submenu a {
        justify-content: flex-start !important;
        gap: 8px !important;
        text-align: left !important;
    }

    .cj-mobile-menu-item > a .cj-ant-icon,
    .cj-mobile-menu-item > a svg,
    .cj-mobile-submenu a .cj-ant-icon,
    .cj-mobile-submenu a svg {
        width: 17px !important;
        height: 17px !important;
        flex: 0 0 17px !important;
    }

    .cj-mobile-submenu a {
        padding-left: 24px !important;
    }

    .cj-mobile-member-cta {
        min-height: 32px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 2px 0 !important;
        border-radius: 11px !important;
        font-size: 12px !important;
    }

    .cj-mobile-drawer-card.is-user .cj-mobile-drawer-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    .cj-user-profile-hero {
        grid-template-columns: 1fr !important;
    }

    .cj-user-hero-member-link {
        min-height: 32px !important;
        padding: 0 14px !important;
        font-size: 12px !important;
    }

    .cj-user-promotion-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .cj-user-promotion-stats span {
        min-height: 62px !important;
        padding: 10px !important;
    }

    .cj-user-promotion-stats strong {
        font-size: 16px !important;
    }

    .cj-withdraw-dialog {
        width: min(360px, calc(100vw - 24px)) !important;
        gap: 10px !important;
        border-radius: 18px !important;
        padding: 18px !important;
    }

    .cj-paid-member-link {
        width: 100% !important;
    }

    .cj-mobile-member-cta {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

@media (max-width: 980px) {
    .cj-menu-button {
        display: grid !important;
        flex: 0 0 40px !important;
    }

    .cj-main-nav {
        display: none !important;
    }

    .cj-header-inner {
        gap: 10px !important;
    }

    .cj-brand {
        max-width: min(66vw, 320px) !important;
    }

    .cj-brand-mark {
        width: 42px !important;
        height: 42px !important;
        flex-basis: 42px !important;
    }

    .cj-brand-text {
        max-width: min(42vw, 180px) !important;
    }

    .cj-mobile-drawer {
        position: fixed !important;
        top: 76px !important;
        bottom: 12px !important;
        left: 12px !important;
        z-index: 1000 !important;
        width: min(78vw, 300px) !important;
        display: grid !important;
        grid-template-rows: minmax(0, 1fr) auto !important;
        align-content: stretch !important;
        gap: 8px !important;
        overflow-y: auto !important;
        border-radius: 22px !important;
        padding: 14px !important;
        background: rgba(255, 255, 255, .98) !important;
        box-shadow: 18px 20px 58px rgba(15, 23, 42, .24) !important;
        transform: translateX(calc(-100% - 28px)) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: transform .24s ease, opacity .24s ease, visibility .24s ease !important;
    }

    .cj-mobile-drawer.is-open {
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .cj-mobile-drawer a {
        min-height: 38px !important;
        border-radius: 12px !important;
        padding: 0 12px !important;
        font-size: 13px !important;
    }

    .cj-mobile-drawer-card {
        margin-bottom: 6px !important;
        border-radius: 18px !important;
        padding: 14px !important;
    }

    .cj-product-redesign-grid {
        grid-template-columns: 1fr !important;
    }

    .cj-product-aside-v2 {
        position: static !important;
        grid-row: 1 !important;
    }

    .cj-product-main-card {
        grid-template-columns: 1fr !important;
        border-radius: 20px !important;
        padding: 12px !important;
    }

    .cj-product-meta-v2 {
        grid-template-columns: 1fr !important;
    }

    .cj-product-buy-row {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .cj-product-actions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .cj-product-actions button,
    .cj-product-actions a {
        width: 100% !important;
        padding-inline: 10px !important;
    }
}

@media (max-width: 640px) {
    .cj-category-grid-section,
    .cj-category-grid-section.is-slider,
    .cj-category-grid-section.is-wrap,
    .cj-category-grid-section.is-mobile-slider,
    .cj-category-grid-section.is-mobile-wrap {
        width: min(100% - 24px, 430px) !important;
        display: block !important;
        margin-top: 16px !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    .cj-category-grid-section > button {
        display: none !important;
    }

    .cj-category-grid,
    .cj-category-grid-section.is-slider .cj-category-grid,
    .cj-category-grid-section.is-wrap .cj-category-grid,
    .cj-category-grid-section.is-mobile-slider .cj-category-grid,
    .cj-category-grid-section.is-mobile-wrap .cj-category-grid {
        width: 100% !important;
        display: grid !important;
        grid-auto-flow: row !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: none !important;
        grid-auto-columns: unset !important;
        gap: 10px !important;
        overflow: visible !important;
        padding: 0 !important;
    }

    .cj-category-card {
        min-height: 82px !important;
        grid-template-columns: 40px minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        justify-items: start !important;
        align-items: center !important;
        gap: 3px 10px !important;
        border-radius: 16px !important;
        padding: 12px !important;
        text-align: left !important;
    }

    .cj-category-card span {
        grid-row: 1 / span 2 !important;
        width: 38px !important;
        height: 38px !important;
        border-radius: 13px !important;
    }

    .cj-category-card strong {
        color: #17233d !important;
        font-size: 13px !important;
        text-align: left !important;
    }

    .cj-category-card small {
        display: block !important;
        width: 100% !important;
        overflow: hidden !important;
        color: #718096 !important;
        font-size: 11px !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .cj-category-rail a {
        width: max-content !important;
        min-width: max-content !important;
        max-width: none !important;
        padding: 6px 12px 4px !important;
    }

    .cj-all-resources-page {
        width: min(100% - 24px, 430px) !important;
        padding-top: 24px !important;
    }

    .cj-all-category-filter {
        gap: 10px !important;
    }

    .cj-all-category-filter a {
        min-width: 88px !important;
        padding: 10px 16px !important;
        font-size: 14px !important;
    }

    .cj-ai-resource-grid,
    .cj-ai-resource-grid.is-grid,
    .cj-ai-resource-grid.is-list,
    .cj-archive-resource-grid.is-list {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-resource-card,
    .cj-archive-resource-card,
    .cj-ai-resource-card {
        display: grid !important;
        grid-template-columns: 34% minmax(0, 1fr) !important;
        min-height: 118px !important;
        border-radius: 16px !important;
    }

    .cj-ai-thumb img,
    .cj-ai-resource-grid.is-list .cj-ai-thumb img {
        width: 100% !important;
        height: 100% !important;
        min-height: 118px !important;
        aspect-ratio: auto !important;
    }

    .cj-ai-resource-card > div {
        min-width: 0 !important;
        padding: 12px !important;
    }

    .cj-ai-resource-card h3 {
        min-height: 40px !important;
        font-size: 15px !important;
    }

    .cj-ai-resource-card p {
        min-height: 36px !important;
        font-size: 12px !important;
    }

    .cj-ai-plan-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .cj-ai-plan {
        min-height: 0 !important;
        padding: 18px !important;
    }

    .cj-ai-plan .cj-plan-body {
        min-height: 210px !important;
    }

    .cj-plan-benefits {
        min-height: 88px !important;
    }

    .cj-plan-price {
        min-height: 48px !important;
    }

    .cj-plan-price strong {
        font-size: 30px !important;
    }

    .cj-product-redesign {
        width: min(100% - 24px, 430px) !important;
        padding-top: 14px !important;
    }

    .cj-service-steps-v2 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .cj-service-steps-v2 div {
        min-width: 0 !important;
        padding: 10px 4px !important;
    }

    .cj-service-steps-v2 strong {
        font-size: 11px !important;
    }

    .cj-service-steps-v2 span {
        display: none !important;
    }

    .cj-user-center-rebuild {
        width: min(100% - 24px, 430px) !important;
        padding-top: 14px !important;
    }

    .cj-user-profile-hero {
        grid-template-columns: 1fr !important;
    }

    .cj-user-quick-stats,
    .cj-user-function-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .cj-user-function-grid a {
        min-height: 112px !important;
        padding: 14px !important;
    }

    .cj-user-order-card {
        grid-template-columns: 42px minmax(0, 1fr) auto !important;
        gap: 10px !important;
    }

    .cj-user-order-card b,
    .cj-user-order-card a,
    .cj-user-order-card button[data-cj-resume-order] {
        grid-column: 2 / -1 !important;
        justify-self: start !important;
    }

    .cj-user-order-card a,
    .cj-user-order-card button[data-cj-resume-order] {
        min-width: 88px !important;
        min-height: 32px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        padding: 8px 13px !important;
        border-radius: 999px !important;
        font-size: 12px !important;
        line-height: 1 !important;
        writing-mode: horizontal-tb !important;
        letter-spacing: .2px !important;
    }

    .cj-message-card {
        grid-template-columns: 70px minmax(0, 1fr) !important;
    }

    body.cj-night .cj-category-card strong {
        color: #f6f7f9 !important;
    }

    body.cj-night .cj-category-card small {
        color: #b7bec9 !important;
    }
}

@media (max-width: 980px) {
    html,
    body {
        overflow-x: hidden !important;
    }

    body.cj-mobile-menu-open {
        overflow: hidden !important;
    }

    body.cj-mobile-menu-open .cj-site-header {
        z-index: 10020 !important;
    }

    body.cj-mobile-menu-open .cj-mobile-drawer,
    .cj-mobile-drawer.is-open {
        z-index: 10000 !important;
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .cj-mobile-drawer {
        position: fixed !important;
        top: 66px !important;
        bottom: auto !important;
        left: 12px !important;
        right: auto !important;
        width: min(80vw, 310px) !important;
        height: calc(100vh - 154px) !important;
        height: calc(100dvh - 154px) !important;
        max-height: calc(100vh - 154px) !important;
        max-height: calc(100dvh - 154px) !important;
        display: grid !important;
        align-content: start !important;
        gap: 8px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        padding: 14px !important;
    }

    .cj-menu-button {
        width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        border-radius: 12px !important;
    }

    .cj-menu-button span {
        width: 17px !important;
        height: 2px !important;
    }

    .cj-mobile-menu-item {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 32px !important;
        gap: 6px !important;
        align-items: center !important;
    }

    .cj-mobile-menu-item > a {
        min-width: 0 !important;
        justify-content: flex-start !important;
    }

    .cj-mobile-menu-item > a span {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .cj-mobile-menu-item > button {
        width: 32px !important;
        height: 32px !important;
        display: grid !important;
        place-items: center !important;
        border: 0 !important;
        border-radius: 10px !important;
        color: #26344d !important;
        background: #eef3fb !important;
        cursor: pointer !important;
    }

    .cj-mobile-menu-item > button .cj-ant-icon,
    .cj-mobile-menu-item > button svg {
        width: 13px !important;
        height: 13px !important;
        transition: transform .18s ease !important;
    }

    .cj-mobile-menu-item.is-open > button .cj-ant-icon,
    .cj-mobile-menu-item.is-open > button svg {
        transform: rotate(90deg) !important;
    }

    .cj-mobile-submenu {
        grid-column: 1 / -1 !important;
        display: grid !important;
        gap: 6px !important;
        padding: 0 0 0 12px !important;
    }

    .cj-mobile-submenu[hidden] {
        display: none !important;
    }

    .cj-mobile-submenu a {
        min-height: 34px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
        background: rgba(35, 104, 255, .07) !important;
    }

    .cj-mobile-tabbar {
        position: fixed !important;
        left: 10px !important;
        right: 10px !important;
        bottom: 10px !important;
        z-index: 9990 !important;
        display: grid !important;
    }

    .cj-product-clean-grid {
        grid-template-columns: 1fr !important;
        width: 100% !important;
        overflow: visible !important;
    }

    .cj-product-clean-aside {
        position: static !important;
        grid-row: auto !important;
    }

    .cj-product-brief-card {
        grid-template-columns: minmax(136px, 36%) minmax(0, 1fr) !important;
        align-items: center !important;
        padding: 12px !important;
    }

    .cj-product-brief-cover img {
        aspect-ratio: 1 / 1 !important;
    }
}

@media (max-width: 640px) {
    .cj-brand.is-logo-only .cj-brand-mark.has-logo-image img {
        width: auto !important;
        max-width: 138px !important;
        height: 42px !important;
        object-fit: contain !important;
    }

    .cj-category-grid-section,
    .cj-category-grid-section.is-wrap,
    .cj-category-grid-section.is-mobile-wrap {
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        padding: 0 !important;
    }

    .cj-category-grid,
    .cj-category-grid-section .cj-category-grid,
    .cj-category-grid-section.is-wrap .cj-category-grid,
    .cj-category-grid-section.is-mobile-wrap .cj-category-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        overflow: visible !important;
        padding: 0 !important;
    }

    .cj-category-card {
        min-height: 66px !important;
        display: grid !important;
        grid-template-columns: 36px minmax(0, 1fr) !important;
        grid-template-rows: auto auto !important;
        place-items: initial !important;
        align-items: center !important;
        justify-items: start !important;
        gap: 2px 10px !important;
        border-radius: 16px !important;
        padding: 8px 10px !important;
        text-align: left !important;
        background: rgba(255, 255, 255, .38) !important;
        backdrop-filter: blur(16px) !important;
    }

    .cj-category-card span {
        grid-row: 1 / span 2 !important;
        width: 36px !important;
        height: 36px !important;
        margin: 0 !important;
    }

    .cj-category-card span .cj-ant-icon,
    .cj-category-card span svg {
        width: 20px !important;
        height: 20px !important;
    }

    .cj-category-card strong,
    .cj-category-card small {
        max-width: 100% !important;
        text-align: left !important;
    }

    .cj-category-card strong {
        align-self: end !important;
        font-size: 13px !important;
        line-height: 1.12 !important;
    }

    .cj-category-card small {
        align-self: start !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    .cj-category-rail div,
    .cj-category-rail.is-slider div,
    .cj-category-rail.is-mobile-marquee div {
        display: flex !important;
        grid-auto-flow: unset !important;
        grid-auto-columns: unset !important;
        gap: 8px !important;
        overflow-x: auto !important;
    }

    .cj-category-rail a,
    .cj-category-rail.is-slider a {
        width: max-content !important;
        min-width: max-content !important;
        max-width: none !important;
        flex: 0 0 auto !important;
        white-space: nowrap !important;
        min-height: 30px !important;
        padding: 6px 10px !important;
        border-radius: 999px !important;
        font-size: 12px !important;
        text-align: center !important;
    }

    .cj-ai-plan {
        box-sizing: border-box !important;
        width: 100% !important;
        min-height: 0 !important;
        overflow: hidden !important;
        padding: 14px !important;
    }

    .cj-ai-plan .cj-plan-body {
        min-height: 0 !important;
        display: grid !important;
        gap: 7px !important;
    }

    .cj-plan-benefits {
        min-height: 0 !important;
        margin: 0 0 4px !important;
    }

    .cj-ai-plan i {
        width: 76px !important;
        height: 76px !important;
        opacity: .14 !important;
    }

    .cj-ai-plan button {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-top: 8px !important;
    }

    .cj-product-clean {
        width: min(100% - 24px, 430px) !important;
        padding-top: 14px !important;
        overflow: hidden !important;
    }

    .cj-product-brief-card {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .cj-product-brief-cover {
        max-width: 100% !important;
    }

    .cj-product-brief-cover img {
        aspect-ratio: 16 / 9 !important;
        max-height: 210px !important;
    }

    .cj-product-brief-info h1 {
        font-size: 21px !important;
        line-height: 1.25 !important;
    }

    .cj-product-brief-info p,
    .cj-product-brief-info small {
        font-size: 13px !important;
        line-height: 1.55 !important;
    }

    .cj-product-clean-buy {
        align-items: stretch !important;
        flex-direction: column !important;
        gap: 10px !important;
    }

    .cj-product-clean-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        margin-left: 0 !important;
    }

    .cj-product-clean-actions button,
    .cj-product-clean-actions a {
        width: 100% !important;
        padding-inline: 10px !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .cj-product-article-card {
        padding: 16px !important;
        overflow-wrap: anywhere !important;
    }

    .cj-detail-user-card {
        grid-template-columns: 52px minmax(0, 1fr) !important;
        padding: 14px !important;
    }

    .cj-detail-user-card img,
    .cj-detail-user-icon {
        width: 52px !important;
        height: 52px !important;
    }

    .cj-footer-qrcode {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    .cj-footer-qrcode span {
        width: 104px !important;
        flex: 0 0 104px !important;
    }

    .cj-user-hero-panel {
        min-height: 150px !important;
        background: rgba(255, 255, 255, .72) !important;
        color: #17233d !important;
    }

    .cj-user-quick-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .cj-user-quick-stats span {
        min-height: 58px !important;
        grid-template-columns: 32px minmax(0, 1fr) !important;
        padding: 9px 10px !important;
    }

    .cj-user-quick-stats span > .cj-ant-icon,
    .cj-user-quick-stats span > svg {
        width: 18px !important;
        height: 18px !important;
        padding: 7px !important;
        border-radius: 12px !important;
    }

    .cj-user-quick-stats small {
        font-size: 11px !important;
    }

    .cj-user-quick-stats strong {
        font-size: 14px !important;
    }

    .cj-user-function-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .cj-user-function-grid a,
    .cj-user-function-grid a.is-wide {
        grid-column: auto !important;
        min-height: 58px !important;
        grid-template-columns: 36px minmax(0, 1fr) auto 14px !important;
        gap: 10px !important;
        padding: 9px 10px !important;
    }

    .cj-user-function-grid a > span {
        width: 36px !important;
        height: 36px !important;
    }

    .cj-user-function-grid a strong,
    .cj-user-function-grid a small {
        white-space: nowrap !important;
    }

    .cj-user-function-grid a strong {
        font-size: 13px !important;
    }

    .cj-user-function-grid a small {
        font-size: 11px !important;
    }

    .cj-message-topbar {
        min-height: 46px !important;
        padding: 8px 10px !important;
    }

    .cj-message-topbar h1 {
        font-size: 18px !important;
    }

    .cj-message-topbar a,
    .cj-message-topbar span {
        width: 34px !important;
        height: 34px !important;
    }

    .cj-message-card {
        min-height: 64px !important;
        grid-template-columns: 38px minmax(0, 1fr) !important;
        padding: 10px !important;
    }

    .cj-message-bell {
        width: 38px !important;
        height: 38px !important;
    }

    .cj-message-bell span {
        display: none !important;
    }

    .cj-user-logout-wide {
        margin-top: 12px !important;
    }
}

@media (max-width: 782px) {
    body.cj-theme {
        padding-bottom: calc(62px + env(safe-area-inset-bottom)) !important;
    }

    .cj-menu-button {
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        border-radius: 11px !important;
        gap: 3px !important;
    }

    .cj-menu-button span {
        width: 14px !important;
        height: 1.6px !important;
        border-radius: 999px !important;
    }

    .cj-mobile-drawer {
        top: 58px !important;
        bottom: calc(58px + env(safe-area-inset-bottom)) !important;
        left: 10px !important;
        width: min(78vw, 292px) !important;
        height: auto !important;
        max-height: none !important;
        padding: 10px !important;
        gap: 7px !important;
    }

    .cj-mobile-menu-item {
        grid-template-columns: minmax(0, 1fr) 30px !important;
        gap: 0 !important;
        overflow: hidden !important;
        border: 1px solid rgba(220, 229, 242, .78) !important;
        border-radius: 13px !important;
        background: rgba(246, 249, 254, .95) !important;
    }

    .cj-mobile-menu-item > a {
        min-height: 38px !important;
        padding: 0 11px !important;
        border-radius: 0 !important;
        background: transparent !important;
        font-size: 13px !important;
    }

    .cj-mobile-menu-item > button {
        width: 30px !important;
        height: 38px !important;
        border-radius: 0 !important;
        color: #334155 !important;
        background: transparent !important;
    }

    .cj-mobile-menu-item > button .cj-ant-icon,
    .cj-mobile-menu-item > button svg {
        width: 11px !important;
        height: 11px !important;
    }

    .cj-mobile-submenu {
        gap: 4px !important;
        padding: 0 8px 8px !important;
        background: transparent !important;
    }

    .cj-mobile-submenu a {
        min-height: 30px !important;
        padding: 0 10px !important;
        border-radius: 10px !important;
        font-size: 12px !important;
        background: rgba(35, 104, 255, .07) !important;
    }

    .cj-mobile-tabbar {
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        border-radius: 18px 18px 0 0 !important;
        padding-bottom: max(6px, env(safe-area-inset-bottom)) !important;
    }

    .cj-category-rail a,
    .cj-category-rail.is-slider a,
    .cj-all-category-filter a,
    .cj-category-filter a {
        min-height: 28px !important;
        padding: 5px 9px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 999px !important;
        font-size: 12px !important;
        line-height: 1.1 !important;
        text-align: center !important;
    }

    .cj-menu-button {
        width: 28px !important;
        height: 28px !important;
        flex-basis: 28px !important;
        padding: 0 !important;
        background: transparent !important;
    }

    .cj-menu-button span {
        width: 12px !important;
        height: 1.5px !important;
    }

    body.cj-mobile-menu-open .cj-mobile-drawer,
    .cj-mobile-drawer.is-open {
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .cj-mobile-drawer {
        position: fixed !important;
        top: 54px !important;
        bottom: calc(62px + env(safe-area-inset-bottom)) !important;
        left: 10px !important;
        right: auto !important;
        width: min(82vw, 304px) !important;
        height: auto !important;
        max-height: calc(100dvh - 116px - env(safe-area-inset-bottom)) !important;
        display: grid !important;
        align-content: start !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-radius: 18px !important;
        padding: 10px !important;
        background: rgba(255, 255, 255, .98) !important;
        box-shadow: 16px 18px 48px rgba(15, 23, 42, .22) !important;
    }

    .cj-ai-plan {
        display: flex !important;
        flex-direction: column !important;
        min-height: 0 !important;
        padding: 14px !important;
    }

    .cj-ai-plan .cj-plan-body {
        min-height: 0 !important;
        flex: 0 0 auto !important;
        display: grid !important;
        gap: 6px !important;
    }

    .cj-plan-price {
        min-height: 0 !important;
        margin-top: 2px !important;
        align-content: start !important;
    }

    .cj-ai-plan i {
        position: absolute !important;
        right: 24px !important;
        bottom: 58px !important;
        width: 54px !important;
        height: 54px !important;
        opacity: .1 !important;
        pointer-events: none !important;
    }

    .cj-ai-plan button {
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin-top: 6px !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 980px) {
    .cj-header-inner {
        display: grid !important;
        grid-template-columns: 30px minmax(0, 1fr) auto !important;
        justify-items: start !important;
        gap: 8px !important;
    }

    .cj-brand,
    .cj-brand.is-logo-only {
        justify-self: start !important;
        margin: 0 !important;
        max-width: min(50vw, 210px) !important;
    }

    .cj-brand-mark {
        width: 38px !important;
        height: 38px !important;
        flex-basis: 38px !important;
    }

    .cj-brand-text {
        max-width: min(34vw, 142px) !important;
        text-align: left !important;
    }

    .cj-header-actions {
        justify-self: end !important;
    }

    .cj-menu-button {
        width: 28px !important;
        height: 28px !important;
        flex: 0 0 28px !important;
        display: inline-grid !important;
        place-items: center !important;
        border: 0 !important;
        border-radius: 10px !important;
        color: #17233d !important;
        background: rgba(255, 255, 255, .72) !important;
        box-shadow: none !important;
    }

    .cj-menu-button span {
        display: none !important;
    }

    .cj-menu-button .cj-ant-icon,
    .cj-menu-button svg {
        width: 15px !important;
        height: 15px !important;
        display: block !important;
    }

    .cj-mobile-drawer {
        position: fixed !important;
        top: 60px !important;
        bottom: calc(74px + env(safe-area-inset-bottom)) !important;
        left: 10px !important;
        right: auto !important;
        z-index: 10050 !important;
        width: min(82vw, 304px) !important;
        height: auto !important;
        max-height: none !important;
        display: grid !important;
        grid-template-rows: minmax(0, 1fr) auto !important;
        align-content: stretch !important;
        gap: 7px !important;
        overflow-x: hidden !important;
        overflow-y: hidden !important;
        overscroll-behavior: contain !important;
        box-sizing: border-box !important;
        border: 1px solid rgba(220, 229, 242, .86) !important;
        border-radius: 18px !important;
        padding: 10px !important;
        background: rgba(255, 255, 255, .98) !important;
        box-shadow: 16px 18px 48px rgba(15, 23, 42, .22) !important;
        transform: translateX(calc(-100% - 24px)) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: transform .22s ease, opacity .22s ease, visibility .22s ease !important;
    }

    body.cj-mobile-menu-open .cj-mobile-drawer,
    .cj-mobile-drawer.is-open {
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .cj-mobile-drawer-card {
        align-self: end !important;
        gap: 7px !important;
        margin: 8px 0 0 !important;
        border: 1px solid rgba(220, 229, 242, .8) !important;
        border-radius: 14px !important;
        padding: 10px !important;
        color: #17233d !important;
        background: linear-gradient(135deg, rgba(248, 251, 255, .98), rgba(255, 255, 255, .98)) !important;
        box-shadow: none !important;
    }

    .cj-mobile-drawer-card p,
    .cj-mobile-drawer-card span {
        color: #667287 !important;
        font-size: 12px !important;
        line-height: 1.45 !important;
    }

    .cj-mobile-drawer-card > strong {
        color: #17233d !important;
        font-size: 14px !important;
    }

    .cj-mobile-drawer-actions {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .cj-mobile-drawer-card.is-user .cj-mobile-drawer-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .cj-mobile-drawer-actions a,
    .cj-mobile-drawer a {
        min-height: 32px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        border-radius: 10px !important;
        padding: 0 9px !important;
        color: #26344d !important;
        background: #f5f7fb !important;
        font-size: 12px !important;
        font-weight: 800 !important;
    }

    .cj-mobile-drawer-actions a {
        justify-content: center !important;
        text-align: center !important;
    }

    .cj-mobile-menu-item {
        min-height: 36px !important;
        border-radius: 12px !important;
        background: #f7f9fd !important;
    }

    .cj-mobile-menu-item > a {
        min-height: 36px !important;
        padding: 0 10px !important;
        justify-content: flex-start !important;
        text-align: left !important;
    }

    .cj-mobile-menu-item > a span {
        width: 100% !important;
        text-align: left !important;
    }

    .cj-mobile-menu-item > button {
        height: 36px !important;
    }

    .cj-mobile-menu-list {
        min-height: 0 !important;
        display: grid !important;
        align-content: start !important;
        gap: 7px !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        padding-right: 2px !important;
    }

    .cj-mobile-submenu {
        padding: 0 0 7px 16px !important;
    }

    .cj-mobile-submenu a {
        min-height: 30px !important;
        justify-content: flex-start !important;
        padding: 0 10px !important;
        text-align: left !important;
    }

    .cj-mobile-tabbar a {
        grid-template-rows: 28px 18px !important;
    }

    .cj-mobile-tabbar {
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: calc(66px + env(safe-area-inset-bottom)) !important;
        min-height: calc(66px + env(safe-area-inset-bottom)) !important;
        display: grid !important;
        grid-template-columns: repeat(var(--cj-mobile-tab-count, 5), minmax(0, 1fr)) !important;
        gap: 0 !important;
        padding: 7px 10px calc(7px + env(safe-area-inset-bottom)) !important;
        border: 0 !important;
        border-top: 1px solid rgba(216, 226, 240, .92) !important;
        border-radius: 18px 18px 0 0 !important;
        background: rgba(255, 255, 255, .98) !important;
        box-shadow: 0 -10px 26px rgba(31, 48, 86, .12) !important;
        backdrop-filter: blur(18px) !important;
        -webkit-backdrop-filter: blur(18px) !important;
        box-sizing: border-box !important;
    }

    .cj-mobile-tabbar a {
        min-width: 0 !important;
        min-height: 50px !important;
        display: grid !important;
        place-items: center !important;
        gap: 2px !important;
        padding: 3px 2px 2px !important;
        border: 0 !important;
        border-radius: 0 !important;
        color: #5d6a7d !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .cj-mobile-tabbar a::before,
    .cj-mobile-tabbar a::after {
        display: none !important;
        content: none !important;
    }

    .cj-mobile-tabbar a .cj-ant-icon,
    .cj-mobile-tabbar a svg,
    .cj-mobile-tabbar a .cj-menu-image-icon {
        width: 26px !important;
        height: 26px !important;
        max-width: 26px !important;
        max-height: 26px !important;
        object-fit: contain !important;
        display: block !important;
        margin: 0 auto !important;
    }

    .cj-mobile-tabbar a .cj-ant-icon,
    .cj-mobile-tabbar a svg {
        fill: currentColor !important;
        stroke: none !important;
    }

    .cj-mobile-tabbar a:nth-child(1) .cj-ant-icon,
    .cj-mobile-tabbar a:nth-child(1) svg {
        color: #2368ff !important;
    }

    .cj-mobile-tabbar a:nth-child(2) .cj-ant-icon,
    .cj-mobile-tabbar a:nth-child(2) svg {
        color: #12b76a !important;
    }

    .cj-mobile-tabbar a:nth-child(3) .cj-ant-icon,
    .cj-mobile-tabbar a:nth-child(3) svg {
        color: #f59e0b !important;
    }

    .cj-mobile-tabbar a:nth-child(4) .cj-ant-icon,
    .cj-mobile-tabbar a:nth-child(4) svg {
        color: #f04444 !important;
    }

    .cj-mobile-tabbar a:nth-child(5) .cj-ant-icon,
    .cj-mobile-tabbar a:nth-child(5) svg {
        color: #7c3aed !important;
    }

    .cj-mobile-tabbar a.is-active {
        color: #17233d !important;
        background: transparent !important;
        font-weight: 900 !important;
        transform: none !important;
    }

    .cj-mobile-tabbar a span {
        color: inherit !important;
        font-size: 11px !important;
        font-weight: 800 !important;
    }

    .cj-platform-notice .cj-notice-marquee p {
        color: #e60012 !important;
        font-weight: 900 !important;
    }

    .cj-pay-product-membership {
        grid-template-columns: 58px minmax(0, 1fr) !important;
        align-items: center !important;
    }

    .cj-pay-product .cj-pay-plan-icon {
        width: 58px !important;
        height: 58px !important;
        min-width: 58px !important;
        display: grid !important;
        place-items: center !important;
        align-self: center !important;
        justify-self: center !important;
        overflow: visible !important;
        line-height: 0 !important;
        text-overflow: clip !important;
        white-space: normal !important;
    }

    .cj-pay-product .cj-pay-plan-icon .cj-ant-icon,
    .cj-pay-product .cj-pay-plan-icon svg {
        width: 30px !important;
        height: 30px !important;
        max-width: 30px !important;
        max-height: 30px !important;
        display: block !important;
        margin: auto !important;
        overflow: visible !important;
        transform: none !important;
        fill: currentColor !important;
        stroke: none !important;
    }
}

@media (max-width: 640px) {
    .cj-footer-qrcode {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .cj-footer-qrcode span {
        width: auto !important;
        flex: initial !important;
        min-width: 0 !important;
    }

    .cj-mobile-menu-item > a,
    .cj-mobile-submenu a {
        justify-content: flex-start !important;
        gap: 8px !important;
        text-align: left !important;
    }

    .cj-mobile-menu-item > a .cj-ant-icon,
    .cj-mobile-menu-item > a svg,
    .cj-mobile-submenu a .cj-ant-icon,
    .cj-mobile-submenu a svg {
        width: 17px !important;
        height: 17px !important;
        flex: 0 0 17px !important;
    }

    .cj-mobile-submenu a {
        padding-left: 24px !important;
    }

    .cj-mobile-member-cta {
        min-height: 32px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 2px 0 !important;
        border-radius: 11px !important;
        font-size: 12px !important;
    }

    .cj-mobile-drawer-card.is-user .cj-mobile-drawer-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    .cj-user-profile-hero {
        grid-template-columns: 1fr !important;
    }

    .cj-user-hero-member-link {
        min-height: 32px !important;
        padding: 0 14px !important;
        font-size: 12px !important;
    }

    .cj-user-promotion-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .cj-user-promotion-stats span {
        min-height: 62px !important;
        padding: 10px !important;
    }

    .cj-user-promotion-stats strong {
        font-size: 16px !important;
    }

    .cj-withdraw-dialog {
        width: min(360px, calc(100vw - 24px)) !important;
        gap: 10px !important;
        border-radius: 18px !important;
        padding: 18px !important;
    }

    .cj-paid-member-link {
        width: 100% !important;
    }
}

@media (max-width: 768px) {
    .cj-category-rail {
        max-width: 100% !important;
        overflow: visible !important;
    }

    .cj-category-rail > div,
    .cj-category-rail [data-cj-category-rail] {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        padding: 2px 12px 8px 2px !important;
        scroll-snap-type: x proximity !important;
        scrollbar-width: none !important;
    }

    .cj-category-rail > div::-webkit-scrollbar,
    .cj-category-rail [data-cj-category-rail]::-webkit-scrollbar {
        display: none !important;
    }

    .cj-category-rail a {
        width: max-content !important;
        min-width: max-content !important;
        max-width: none !important;
        min-height: 31px !important;
        display: inline-flex !important;
        grid-template-rows: none !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        flex: 0 0 auto !important;
        padding: 6px 11px !important;
        overflow: visible !important;
        white-space: nowrap !important;
        text-align: center !important;
    }

    .cj-category-rail a span {
        width: 22px !important;
        height: 22px !important;
        flex: 0 0 22px !important;
    }

    .cj-category-rail.is-mobile-marquee {
        overflow: hidden !important;
    }

    .cj-category-rail.is-mobile-marquee > div,
    .cj-category-rail.is-mobile-marquee [data-cj-category-rail] {
        width: max-content !important;
        max-width: none !important;
        min-width: max-content !important;
        overflow: visible !important;
        animation: cjCategoryMarquee 12s linear infinite !important;
    }

    .cj-category-rail.is-mobile-marquee:hover > div,
    .cj-category-rail.is-mobile-marquee:focus-within > div,
    .cj-category-rail.is-mobile-marquee:hover [data-cj-category-rail],
    .cj-category-rail.is-mobile-marquee:focus-within [data-cj-category-rail] {
        animation-play-state: paused !important;
    }

    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+1) > a .cj-ant-icon,
    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+1) > a svg {
        color: #2368ff !important;
    }

    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+2) > a .cj-ant-icon,
    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+2) > a svg {
        color: #12b76a !important;
    }

    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+3) > a .cj-ant-icon,
    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+3) > a svg {
        color: #f59e0b !important;
    }

    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+4) > a .cj-ant-icon,
    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+4) > a svg {
        color: #f04444 !important;
    }

    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+5) > a .cj-ant-icon,
    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n+5) > a svg {
        color: #7c3aed !important;
    }

    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n) > a .cj-ant-icon,
    .cj-mobile-menu-list > .cj-mobile-menu-item:nth-child(6n) > a svg {
        color: #0ea5e9 !important;
    }

    .cj-mobile-submenu a:nth-child(5n+1) .cj-ant-icon,
    .cj-mobile-submenu a:nth-child(5n+1) svg {
        color: #2368ff !important;
    }

    .cj-mobile-submenu a:nth-child(5n+2) .cj-ant-icon,
    .cj-mobile-submenu a:nth-child(5n+2) svg {
        color: #12b76a !important;
    }

    .cj-mobile-submenu a:nth-child(5n+3) .cj-ant-icon,
    .cj-mobile-submenu a:nth-child(5n+3) svg {
        color: #f59e0b !important;
    }

    .cj-mobile-submenu a:nth-child(5n+4) .cj-ant-icon,
    .cj-mobile-submenu a:nth-child(5n+4) svg {
        color: #f04444 !important;
    }

    .cj-mobile-submenu a:nth-child(5n) .cj-ant-icon,
    .cj-mobile-submenu a:nth-child(5n) svg {
        color: #7c3aed !important;
    }

    .cj-mobile-menu-item > a .cj-menu-image-icon,
    .cj-mobile-submenu a .cj-menu-image-icon {
        width: 18px !important;
        height: 18px !important;
        flex: 0 0 18px !important;
        object-fit: contain !important;
        display: block !important;
    }

    body.cj-mobile-menu-open .cj-site-header {
        z-index: 2147482600 !important;
    }

    .cj-mobile-drawer {
        position: fixed !important;
        top: calc(58px + env(safe-area-inset-top)) !important;
        bottom: calc(66px + env(safe-area-inset-bottom)) !important;
        left: 10px !important;
        right: auto !important;
        width: min(82vw, 304px) !important;
        height: auto !important;
        max-height: none !important;
        z-index: 2147483000 !important;
        display: grid !important;
        grid-template-rows: minmax(0, 1fr) auto !important;
        overflow: hidden !important;
        transform: translate3d(calc(-100% - 24px), 0, 0) !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    body.cj-mobile-menu-open .cj-mobile-drawer,
    .cj-mobile-drawer.is-open {
        transform: translate3d(0, 0, 0) !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .cj-mobile-menu-list {
        min-height: 0 !important;
        max-height: none !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        -webkit-overflow-scrolling: touch !important;
        padding-top: 0 !important;
    }

    .cj-message-topbar span {
        color: #fff !important;
        background: radial-gradient(circle at 32% 24%, #ffe8a3 0 16%, #ffbf3f 34%, #ff9300 68%, #ff7a00 100%) !important;
        box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .52), 0 10px 24px rgba(255, 141, 0, .24) !important;
    }

    .cj-message-bell {
        background: transparent !important;
        box-shadow: none !important;
    }

    .cj-message-bell > span,
    .cj-message-bell .cj-ant-icon,
    .cj-message-bell svg {
        display: none !important;
    }

    .cj-message-bell img {
        width: 100% !important;
        height: 100% !important;
        display: block !important;
        object-fit: contain !important;
        filter: drop-shadow(0 8px 18px rgba(255, 141, 0, .22)) !important;
    }

    .cj-message-inline-emoji {
        margin-right: 6px !important;
        font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
        font-size: 1.08em !important;
        line-height: 1 !important;
    }
}

@media (max-width: 782px) {
    .cj-message-topbar a {
        display: grid !important;
        place-items: center !important;
        font-size: 0 !important;
        line-height: 1 !important;
    }

    .cj-message-topbar a::before {
        content: "\2039" !important;
        color: #111827 !important;
        font-size: 26px !important;
        font-weight: 900 !important;
        line-height: .8 !important;
        transform: translateY(-1px) !important;
    }

    .cj-message-topbar .cj-message-top-icon {
        overflow: visible !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .cj-message-topbar .cj-message-top-icon img {
        width: 100% !important;
        height: 100% !important;
        display: block !important;
        object-fit: contain !important;
        filter: drop-shadow(0 8px 18px rgba(255, 141, 0, .2)) !important;
    }

    .cj-message-card {
        align-items: start !important;
        cursor: pointer !important;
    }

    .cj-message-bell {
        align-self: start !important;
        margin-top: 1px !important;
    }

    .cj-message-card p {
        display: -webkit-box !important;
        white-space: normal !important;
        overflow: hidden !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    .cj-message-detail-modal {
        padding: 14px !important;
        align-items: center !important;
    }

    .cj-message-detail-dialog {
        width: min(100%, calc(100vw - 28px)) !important;
        max-height: 76vh !important;
        border-radius: 22px !important;
        padding: 22px 18px !important;
    }

    .cj-message-detail-dialog > button {
        top: 12px !important;
        right: 12px !important;
        width: 30px !important;
        height: 30px !important;
        font-size: 20px !important;
    }

    .cj-message-detail-icon {
        width: 58px !important;
        height: 58px !important;
        margin-bottom: 10px !important;
    }

    .cj-message-detail-dialog h2 {
        margin: 0 34px 12px !important;
        font-size: 18px !important;
    }

    .cj-message-detail-dialog p {
        font-size: 14px !important;
        line-height: 1.75 !important;
    }

    body.cj-night .cj-message-topbar a::before {
        color: #f6f7f9 !important;
    }
}

@media (max-width: 782px) {
    .cj-product-clean-actions {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        margin-left: 0 !important;
    }

    .cj-product-clean-actions button,
    .cj-product-clean-actions a {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 0 10px !important;
        border-radius: 12px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    .cj-paid-content-card {
        overflow: hidden !important;
    }

    .cj-paid-content-card [data-cj-copy],
    .cj-paid-content-card .cj-paid-member-link,
    .cj-detail-user-card > a,
    .cj-detail-user-card > button {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 42px !important;
        box-sizing: border-box !important;
        border-radius: 12px !important;
        padding: 0 12px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
        text-align: center !important;
    }

    .cj-product-post-nav {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        margin-top: 16px !important;
    }

    .cj-product-post-nav a {
        border-radius: 14px !important;
        padding: 12px !important;
    }

    .cj-product-post-nav-next {
        text-align: left !important;
    }

    .cj-message-card {
        align-items: center !important;
    }

    .cj-message-bell {
        align-self: center !important;
        margin-top: 0 !important;
    }
}

@media (max-width: 782px) {
    .cj-ai-resource-grid.is-list .cj-ai-resource-card,
    .cj-archive-resource-card,
    .cj-ai-resource-card {
        gap: 10px !important;
        padding: 10px !important;
        border-radius: 18px !important;
    }

    .cj-ai-thumb,
    .cj-ai-resource-grid.is-list .cj-ai-thumb,
    .cj-archive-resource-grid.is-list .cj-ai-thumb {
        overflow: hidden !important;
        border-radius: 16px !important;
    }

    .cj-ai-thumb img,
    .cj-ai-resource-grid.is-list .cj-ai-thumb img,
    .cj-archive-resource-grid.is-list .cj-ai-thumb img,
    .cj-archive-resource-card .cj-ai-thumb img {
        width: 100% !important;
        height: 100% !important;
        display: block !important;
        min-height: 108px !important;
        border-radius: 16px !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    .cj-ai-resource-card > div {
        padding: 6px 4px !important;
    }

    .cj-message-card {
        grid-template-columns: 56px minmax(0, 1fr) !important;
        gap: 12px !important;
    }

    .cj-message-bell {
        width: 52px !important;
        height: 52px !important;
        align-self: center !important;
        margin-top: 0 !important;
    }
}

@media (max-width: 782px) {
    .cj-ai-resource-grid.is-list .cj-ai-resource-card,
    .cj-archive-resource-card,
    .cj-ai-resource-card {
        grid-template-columns: 42% minmax(0, 1fr) !important;
        min-height: 108px !important;
    }

    .cj-ai-thumb img,
    .cj-ai-resource-grid.is-list .cj-ai-thumb img,
    .cj-archive-resource-grid.is-list .cj-ai-thumb img,
    .cj-archive-resource-card .cj-ai-thumb img {
        min-height: 98px !important;
    }

    .cj-message-topbar {
        top: 58px !important;
        min-height: 62px !important;
        grid-template-columns: 44px 1fr 44px !important;
        margin-bottom: 12px !important;
        padding: 8px 0 14px !important;
        border-bottom: 1px solid rgba(15, 23, 42, .06) !important;
        background: color-mix(in srgb, var(--cj-bg) 96%, transparent) !important;
    }

    .cj-message-topbar h1 {
        font-size: 22px !important;
        font-weight: 900 !important;
        letter-spacing: .04em !important;
    }

    .cj-message-topbar a,
    .cj-message-settings {
        width: 38px !important;
        height: 38px !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .cj-message-topbar a::before {
        font-size: 34px !important;
        font-weight: 400 !important;
        transform: translateY(-2px) !important;
    }

    .cj-message-settings {
        border: 0 !important;
        color: #111827 !important;
        font-size: 26px !important;
    }

    .cj-message-list {
        gap: 12px !important;
    }

    .cj-message-card {
        grid-template-columns: 88px minmax(0, 1fr) !important;
        gap: 12px !important;
        min-height: 128px !important;
        border-radius: 18px !important;
        padding: 16px 14px !important;
        background: rgba(255, 255, 255, .95) !important;
        box-shadow: 0 12px 30px rgba(15, 23, 42, .08) !important;
    }

    .cj-message-bell {
        width: 82px !important;
        height: 82px !important;
    }

    .cj-message-card h2 {
        margin-bottom: 8px !important;
        font-size: 15px !important;
        line-height: 1.38 !important;
        white-space: normal !important;
        display: -webkit-box !important;
        overflow: hidden !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    .cj-message-card p {
        margin-bottom: 8px !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
        -webkit-line-clamp: 1 !important;
    }

    .cj-message-card time {
        font-size: 12px !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
    }

    .cj-message-detail-modal {
        padding: 0 34px !important;
        box-sizing: border-box !important;
    }

    .cj-message-detail-dialog {
        width: min(100%, calc(100vw - 68px)) !important;
        max-width: 360px !important;
        border-radius: 18px !important;
        padding: 24px 18px !important;
    }

    .cj-message-pagination {
        margin-top: 14px !important;
    }

    .cj-favorite-list-v2 .cj-mini-resource-link {
        min-height: 68px !important;
        border-radius: 14px !important;
        padding: 7px !important;
    }

    .cj-mini-resource-link img {
        width: 72px !important;
        height: 52px !important;
        flex-basis: 72px !important;
        border-radius: 11px !important;
    }

    .cj-mini-resource-link span {
        font-size: 13px !important;
        line-height: 1.35 !important;
    }
}

@media (max-width: 782px) {
    .cj-message-card > div:last-child {
        min-width: 0 !important;
    }

    .cj-message-card h2 {
        display: block !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        -webkit-box-orient: initial !important;
        -webkit-line-clamp: unset !important;
    }

    .cj-message-card h2 a {
        display: inline !important;
    }

    .cj-message-card p {
        display: block !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        -webkit-box-orient: initial !important;
        -webkit-line-clamp: unset !important;
    }
}

@media (max-width: 782px) {
    .cj-category-rail.is-mobile-marquee > div,
    .cj-category-rail.is-mobile-marquee [data-cj-category-rail] {
        animation-duration: var(--cj-secondary-marquee-duration, 20s) !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-resource-card,
    .cj-archive-resource-card,
    .cj-ai-resource-card {
        grid-template-columns: 46% minmax(0, 1fr) !important;
        min-height: 104px !important;
        padding: 8px !important;
    }

    .cj-ai-thumb,
    .cj-ai-resource-grid.is-list .cj-ai-thumb,
    .cj-archive-resource-grid.is-list .cj-ai-thumb {
        border-radius: 14px !important;
    }

    .cj-ai-thumb img,
    .cj-ai-resource-grid.is-list .cj-ai-thumb img,
    .cj-archive-resource-grid.is-list .cj-ai-thumb img,
    .cj-archive-resource-card .cj-ai-thumb img {
        min-height: 96px !important;
        aspect-ratio: 1.45 / 1 !important;
        border-radius: 14px !important;
    }

    .cj-ai-resource-card > div {
        padding: 4px 2px !important;
    }

    .cj-ai-resource-card h3 {
        min-height: 36px !important;
        margin-bottom: 4px !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .cj-ai-resource-card p {
        min-height: 32px !important;
        margin-bottom: 6px !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
    }

    .cj-ai-plan {
        min-height: 0 !important;
        padding: 14px !important;
    }

    .cj-ai-plan .cj-plan-body {
        min-height: 168px !important;
    }

    .cj-plan-benefits {
        min-height: 62px !important;
        margin-bottom: 8px !important;
    }

    .cj-plan-price {
        min-height: 38px !important;
    }

    .cj-ai-plan button {
        margin-top: 8px !important;
    }

    .cj-user-promotion-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .cj-profile-password-block {
        display: grid !important;
        gap: 4px !important;
        padding: 9px 10px !important;
    }

    body.cj-night .cj-category-grid-section,
    body.cj-night .cj-category-grid-section.is-wrap,
    body.cj-night .cj-category-grid-section.is-mobile-wrap {
        border-color: rgba(255, 255, 255, .08) !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.cj-night .cj-category-card {
        border-color: rgba(255, 255, 255, .12) !important;
        background: linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .035)) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 28px rgba(0, 0, 0, .28) !important;
        backdrop-filter: blur(14px) !important;
    }

    body.cj-night .cj-category-card span {
        background: rgba(255, 255, 255, .1) !important;
    }

    body.cj-night .cj-category-card strong {
        color: #f8fafc !important;
    }

    body.cj-night .cj-category-card small {
        color: #cbd5e1 !important;
    }

    .cj-ai-plan .cj-plan-badge,
    .cj-plan-badge {
        align-self: center !important;
        margin: 0 auto 10px !important;
        border-radius: 999px !important;
    }

    .cj-ai-hero.has-slides,
    .cj-ai-hero.has-slides .cj-ai-hero-inner,
    body.cj-night .cj-ai-hero.has-slides,
    body.cj-night .cj-ai-hero.has-slides .cj-ai-hero-inner {
        background: transparent !important;
    }

    .cj-hero-slides::after,
    body.cj-night .cj-hero-slides::after {
        background: linear-gradient(180deg, rgba(0, 0, 0, .16), rgba(0, 0, 0, .06)) !important;
    }

    .cj-ai-plan-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .cj-ai-plan {
        min-height: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 46px !important;
        gap: 10px !important;
        padding: 14px !important;
        border-radius: 16px !important;
    }

    .cj-ai-plan .cj-plan-body {
        min-height: 0 !important;
        gap: 5px !important;
    }

    .cj-ai-plan .cj-plan-badge,
    .cj-plan-badge {
        justify-self: start !important;
        align-self: start !important;
        margin: 0 0 5px !important;
        min-height: 22px !important;
        padding: 4px 11px !important;
        font-size: 11px !important;
    }

    .cj-ai-plan h3 {
        font-size: 17px !important;
    }

    .cj-plan-benefits {
        min-height: 0 !important;
        margin-bottom: 2px !important;
    }

    .cj-plan-price strong {
        font-size: 24px !important;
    }

    .cj-ai-plan i {
        width: 44px !important;
        height: 44px !important;
        align-self: center !important;
    }

    .cj-ai-plan button {
        grid-column: 1 / -1 !important;
        min-height: 34px !important;
        margin-top: 6px !important;
    }

    body.cj-night .cj-category-grid-section .cj-category-card,
    body.cj-night .cj-category-card {
        border-color: rgba(255, 255, 255, .14) !important;
        background: linear-gradient(145deg, rgba(30, 41, 59, .82), rgba(15, 23, 42, .7)) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 24px rgba(0, 0, 0, .32) !important;
    }
}

@media (max-width: 782px) {
    .cj-membership .cj-ai-plan-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .cj-membership .cj-ai-plan {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 7px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        padding: 42px 14px 12px !important;
        border-radius: 16px !important;
    }

    .cj-membership .cj-ai-plan .cj-plan-badge,
    .cj-membership .cj-plan-badge {
        top: 10px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        min-width: 76px !important;
        min-height: 24px !important;
        padding: 4px 16px !important;
        font-size: 11px !important;
    }

    .cj-membership .cj-ai-plan .cj-plan-body {
        width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 5px !important;
        text-align: left !important;
    }

    .cj-membership .cj-ai-plan h3 {
        font-size: 17px !important;
        line-height: 1.25 !important;
        text-align: left !important;
    }

    .cj-membership .cj-plan-subline,
    .cj-membership .cj-plan-benefits li {
        font-size: 12px !important;
        line-height: 1.35 !important;
        text-align: left !important;
    }

    .cj-membership .cj-plan-benefits {
        min-height: 48px !important;
        gap: 2px !important;
    }

    .cj-membership .cj-plan-price strong {
        font-size: 23px !important;
    }

    .cj-membership .cj-ai-plan i {
        display: none !important;
    }

    .cj-membership .cj-ai-plan button {
        min-height: 34px !important;
        margin-top: 6px !important;
        border-radius: 10px !important;
        font-size: 12px !important;
    }
}

@media (max-width: 782px) {
    .cj-membership .cj-ai-plan-grid {
        gap: 9px !important;
    }

    .cj-membership .cj-ai-plan {
        gap: 4px !important;
        padding: 39px 14px 11px !important;
        border-radius: 16px !important;
    }

    .cj-membership .cj-ai-plan .cj-plan-badge,
    .cj-membership .cj-plan-badge {
        top: 9px !important;
        width: clamp(108px, 36%, 136px) !important;
        min-width: 108px !important;
        min-height: 24px !important;
        padding: 4px 18px !important;
    }

    .cj-membership .cj-ai-plan .cj-plan-body {
        flex: 0 1 auto !important;
        gap: 4px !important;
    }

    .cj-membership .cj-ai-plan h3 {
        font-size: 16px !important;
        line-height: 1.2 !important;
    }

    .cj-membership .cj-plan-subline,
    .cj-membership .cj-plan-benefits li {
        font-size: 11px !important;
        line-height: 1.28 !important;
    }

    .cj-membership .cj-ai-plan .cj-plan-benefits {
        min-height: 38px !important;
        gap: 2px !important;
        margin-top: 1px !important;
    }

    .cj-membership .cj-ai-plan .cj-plan-price {
        width: 100% !important;
        justify-items: start !important;
        margin: 4px 0 0 !important;
        text-align: left !important;
    }

    .cj-membership .cj-ai-plan .cj-plan-price strong {
        font-size: 22px !important;
        line-height: 1.08 !important;
    }

    .cj-membership .cj-ai-plan .cj-plan-price del {
        display: block !important;
        margin: 1px 0 0 !important;
        font-size: 10px !important;
        text-align: left !important;
    }

    .cj-membership .cj-ai-plan button {
        position: static !important;
        inset: auto !important;
        min-height: 32px !important;
        margin-top: 5px !important;
        font-size: 12px !important;
    }

    body.cj-night .cj-platform-notice a {
        border: 1px solid rgba(255, 255, 255, .1) !important;
        border-radius: 999px !important;
        padding: 0 10px !important;
        color: #ffd166 !important;
        background: rgba(255, 255, 255, .08) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
    }

    body.cj-night .cj-platform-notice a::before {
        background: linear-gradient(90deg, rgba(15, 23, 42, 0), rgba(15, 23, 42, .96)) !important;
    }
}

@media (max-width: 782px) {
    .cj-brand,
    .cj-brand.is-logo-only {
        max-width: min(58vw, 230px) !important;
    }

    .cj-brand .cj-brand-mark.has-logo-image {
        width: auto !important;
        min-width: 0 !important;
        max-width: min(46vw, 176px) !important;
        height: 38px !important;
        flex: 0 1 auto !important;
        flex-basis: auto !important;
        overflow: visible !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .cj-brand .cj-brand-mark.has-logo-image img {
        width: auto !important;
        max-width: min(46vw, 176px) !important;
        height: 100% !important;
        max-height: 38px !important;
        object-fit: contain !important;
        object-position: left center !important;
    }

    body.cj-night .cj-platform-notice > a {
        min-height: 26px !important;
        height: 26px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 3px !important;
        box-sizing: border-box !important;
        padding: 0 9px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
    }

    body.cj-night .cj-platform-notice > a::before {
        content: none !important;
        display: none !important;
    }
}

/* Final mobile header/resource polish: home search is enough, give card text more room. */
@media (max-width: 782px) {
    .cj-header-search,
    .cj-header-search-popover {
        display: none !important;
    }

    .cj-header-actions {
        gap: 7px !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-resource-card,
    .cj-archive-resource-card,
    .cj-ai-resource-card {
        grid-template-columns: 38% minmax(0, 1fr) !important;
        min-height: 96px !important;
    }

    .cj-ai-thumb,
    .cj-ai-resource-grid.is-list .cj-ai-thumb,
    .cj-archive-resource-grid.is-list .cj-ai-thumb {
        min-height: 88px !important;
        border-radius: 13px !important;
    }

    .cj-ai-thumb img,
    .cj-ai-resource-grid.is-list .cj-ai-thumb img,
    .cj-archive-resource-grid.is-list .cj-ai-thumb img,
    .cj-archive-resource-card .cj-ai-thumb img {
        min-height: 88px !important;
        aspect-ratio: 1.32 / 1 !important;
        border-radius: 13px !important;
    }

    .cj-ai-resource-card > div {
        padding: 4px 6px !important;
    }

    .cj-ai-resource-card h3 {
        margin-bottom: 4px !important;
        font-size: 13px !important;
    }

    .cj-ai-resource-card p {
        margin-bottom: 5px !important;
        font-size: 11px !important;
    }
}

@media (max-width: 430px) {
    .cj-ai-resource-grid.is-list .cj-ai-resource-card,
    .cj-archive-resource-card,
    .cj-ai-resource-card {
        grid-template-columns: 36% minmax(0, 1fr) !important;
    }
}

/* Emergency mobile behavior fixes for fixed header, iOS input zoom and layout-mode parity. */
@media (max-width: 782px) {
    html {
        scroll-padding-top: calc(58px + env(safe-area-inset-top)) !important;
    }

    body.cj-theme {
        padding-top: calc(58px + env(safe-area-inset-top)) !important;
    }

    .cj-site-header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 2147482600 !important;
        transform: translateZ(0) !important;
    }

    .cj-header-inner {
        height: calc(58px + env(safe-area-inset-top)) !important;
        min-height: calc(58px + env(safe-area-inset-top)) !important;
        padding-top: env(safe-area-inset-top) !important;
        box-sizing: border-box !important;
        align-items: center !important;
    }

    .cj-menu-button,
    .cj-header-actions,
    .cj-header-actions > *,
    .cj-brand,
    .cj-brand.is-logo-only,
    .cj-brand .cj-brand-mark,
    .cj-brand .cj-brand-mark.has-logo-image {
        align-items: center !important;
        justify-content: center !important;
    }

    .cj-brand,
    .cj-brand.is-logo-only {
        display: inline-flex !important;
        min-height: 38px !important;
        line-height: 1 !important;
    }

    .cj-brand .cj-brand-mark,
    .cj-brand .cj-brand-mark.has-logo-image {
        display: inline-flex !important;
        line-height: 0 !important;
    }

    .cj-brand .cj-brand-mark.has-logo-image img {
        display: block !important;
        margin: 0 !important;
        vertical-align: middle !important;
    }

    .cj-ai-search input,
    .cj-header-search-popover input,
    .cj-auth-form input {
        font-size: 16px !important;
    }

    .cj-ai-resource-grid.is-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    .cj-ai-resource-grid.is-grid .cj-ai-resource-card {
        display: block !important;
        min-height: 0 !important;
        padding: 8px !important;
    }

    .cj-ai-resource-grid.is-grid .cj-ai-thumb,
    .cj-ai-resource-grid.is-grid .cj-ai-thumb img {
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        aspect-ratio: 1.32 / 1 !important;
    }

    .cj-ai-resource-grid.is-grid .cj-ai-resource-card > div {
        padding: 8px 2px 2px !important;
    }

    .cj-ai-resource-grid.is-grid .cj-ai-resource-card h3 {
        min-height: calc(1.35em * 2) !important;
        font-size: 12px !important;
    }

    .cj-ai-resource-grid.is-grid .cj-ai-resource-card p {
        display: -webkit-box !important;
        min-height: calc(1.35em * 2) !important;
        overflow: hidden !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        font-size: 11px !important;
    }
}

body.cj-night .cj-auth-dialog {
    background: #151922 !important;
    color: #f6f7fb !important;
}

body.cj-night .cj-auth-logo,
body.cj-night .cj-auth-logo strong,
body.cj-night .cj-auth-tabs button.is-active,
body.cj-night .cj-auth-form h2,
body.cj-night .cj-auth-meta,
body.cj-night .cj-auth-meta a {
    color: #f6f7fb !important;
}

body.cj-night .cj-auth-tabs button,
body.cj-night .cj-auth-form p,
body.cj-night .cj-auth-form p button {
    color: #b7bfcc !important;
}

body.cj-night .cj-auth-form input {
    border-color: rgba(255, 255, 255, .16) !important;
    background: rgba(255, 255, 255, .08) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    caret-color: #ffffff !important;
}

body.cj-night .cj-auth-form input::placeholder {
    color: rgba(255, 255, 255, .58) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, .58) !important;
}

body.cj-night .cj-auth-close {
    color: #eef2ff !important;
    background: rgba(255, 255, 255, .12) !important;
}

.cj-auth-logo .has-auth-logo-image {
    width: min(148px, 72vw) !important;
    height: 54px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.cj-auth-logo .has-auth-logo-image img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: contain !important;
    object-position: center !important;
}

.cj-copy-hidden-source {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Keep mobile list layout visually separate from card layout. */
@media (max-width: 782px) {
    .cj-ai-resource-grid.is-list {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-resource-card {
        display: grid !important;
        grid-template-columns: 42% minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: 10px !important;
        min-height: 104px !important;
        padding: 10px !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-thumb {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: 16 / 9 !important;
        border-radius: 14px !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-thumb img {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        aspect-ratio: 16 / 9 !important;
        border-radius: 14px !important;
        object-fit: cover !important;
        object-position: center !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-resource-card > div {
        min-width: 0 !important;
        padding: 2px 0 !important;
        display: grid !important;
        align-content: space-between !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-resource-card h3 {
        min-height: 0 !important;
        margin: 0 0 4px !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-resource-card p {
        min-height: 0 !important;
        margin: 0 0 8px !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
    }

    .cj-ai-resource-grid.is-list .cj-ai-resource-card footer {
        gap: 8px !important;
    }

    .cj-message-detail-dialog {
        background: #fff !important;
        color: #111827 !important;
    }

    .cj-message-detail-dialog h2 {
        color: #111827 !important;
    }

    .cj-message-detail-dialog p {
        color: #374151 !important;
    }

    body.cj-night .cj-message-detail-dialog {
        background: rgba(18, 18, 18, .96) !important;
        color: #f6f7f9 !important;
    }

    body.cj-night .cj-message-detail-dialog h2 {
        color: #f6f7f9 !important;
    }

    body.cj-night .cj-message-detail-dialog p {
        color: rgba(255, 255, 255, .8) !important;
    }
}

/* iOS and mobile browsers zoom focused fields below 16px; keep all front-end form fields stable. */
@media (max-width: 782px) {
    input,
    select,
    textarea,
    .cj-profile-edit-form input,
    .cj-withdraw-dialog input,
    .cj-withdraw-dialog textarea,
    .cj-auth-form input,
    .cj-header-search-popover input,
    .cj-ai-search input {
        font-size: 16px !important;
        line-height: 1.35 !important;
        -webkit-text-size-adjust: 100%;
    }
}

/* Final mobile header alignment guard: keep the centered logo on the same visual axis as the side buttons. */
@media (max-width: 980px) {
    .cj-header-inner {
        position: relative !important;
        align-items: center !important;
    }

    .cj-menu-button,
    .cj-header-actions,
    .cj-header-actions > * {
        align-self: center !important;
    }

    .cj-menu-button,
    .cj-header-actions {
        position: relative !important;
        z-index: 2 !important;
    }

    .cj-header-actions {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        min-height: 40px !important;
    }

    .cj-brand,
    .cj-brand.is-logo-only {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        z-index: 1 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        max-width: min(46vw, 190px) !important;
        height: 40px !important;
        min-height: 0 !important;
        margin: 0 !important;
        line-height: 1 !important;
        transform: translate(-50%, -50%) !important;
    }

    .cj-brand .cj-brand-mark,
    .cj-brand .cj-brand-mark.has-logo-image {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: min(46vw, 190px) !important;
        height: 40px !important;
        flex: 0 1 auto !important;
        line-height: 0 !important;
    }

    .cj-brand .cj-brand-mark.has-logo-image img {
        display: block !important;
        width: auto !important;
        max-width: min(46vw, 190px) !important;
        height: auto !important;
        max-height: 40px !important;
        margin: 0 !important;
        object-fit: contain !important;
        object-position: center center !important;
        vertical-align: middle !important;
    }
}

@media (max-width: 782px) {
    .cj-brand,
    .cj-brand.is-logo-only {
        top: calc(env(safe-area-inset-top) + 29px) !important;
    }
}

/* Final night-mode guard for the mobile side drawer. */
@media (max-width: 980px) {
    body.cj-night .cj-mobile-drawer {
        border-color: rgba(80, 105, 150, .34) !important;
        color: #eef4ff !important;
        background: #0b111d !important;
        box-shadow: 16px 18px 48px rgba(0, 0, 0, .58), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    body.cj-night .cj-mobile-menu-list {
        gap: 8px !important;
        padding-right: 0 !important;
        background: transparent !important;
    }

    body.cj-night .cj-mobile-menu-item {
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.cj-night .cj-mobile-menu-item > a,
    body.cj-night .cj-mobile-submenu a,
    body.cj-night .cj-mobile-drawer-actions a {
        width: 100% !important;
        box-sizing: border-box !important;
        border: 1px solid rgba(120, 145, 190, .2) !important;
        color: #edf4ff !important;
        background: rgba(255, 255, 255, .055) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
    }

    body.cj-night .cj-mobile-menu-item > button {
        border: 1px solid rgba(120, 145, 190, .2) !important;
        color: #dce8ff !important;
        background: rgba(255, 255, 255, .055) !important;
        box-shadow: none !important;
    }

    body.cj-night .cj-mobile-menu-item > a.is-active,
    body.cj-night .cj-mobile-menu-item > a:hover,
    body.cj-night .cj-mobile-submenu a.is-active,
    body.cj-night .cj-mobile-submenu a:hover,
    body.cj-night .cj-mobile-drawer-actions a:hover,
    body.cj-night .cj-mobile-menu-item > button:hover {
        color: #ffffff !important;
        border-color: rgba(74, 144, 255, .45) !important;
        background: rgba(38, 98, 217, .26) !important;
    }

    body.cj-night .cj-mobile-submenu {
        margin-top: 6px !important;
        border: 0 !important;
        background: transparent !important;
    }

    body.cj-night .cj-mobile-drawer-card {
        border-color: rgba(120, 145, 190, .22) !important;
        color: #f8fafc !important;
        background: #0f1727 !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
    }

    body.cj-night .cj-mobile-drawer-card.is-guest,
    body.cj-night .cj-mobile-drawer-card.is-user {
        background: #0f1727 !important;
    }

    body.cj-night .cj-mobile-drawer-card > strong,
    body.cj-night .cj-mobile-user-mini strong {
        color: #f8fafc !important;
    }

    body.cj-night .cj-mobile-drawer-card p,
    body.cj-night .cj-mobile-drawer-card span {
        color: #cbd5e1 !important;
    }
}