/* Local compatibility layer for narrow screens and fixed-width legacy views. */

#kuaijing-mobile-menu,
#kuaijing-mobile-backdrop {
  display: none;
}

@media (max-width: 767px) {
  html,
  body {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
  }

  #pageBox,
  #app,
  #workAI {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  #workAI > .layout-box {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  #workAI > .layout-box > .ss-layout-sider {
    position: fixed !important;
    inset: 0 auto 0 -280px;
    z-index: 10001;
    width: min(84vw, 280px) !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: none !important;
    box-shadow: 2px 0 14px rgb(0 0 0 / 18%);
    transition: left 0.2s ease;
  }

  #workAI > .layout-box > .ss-layout-sider.kuaijing-mobile-nav-open {
    left: 0 !important;
  }

  #kuaijing-mobile-menu {
    position: fixed;
    top: 12px;
    left: 12px;
    z-index: 10002;
    display: flex;
    width: 40px;
    height: 40px;
    padding: 9px 8px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: #2878ff;
    background: #fff;
    border: 1px solid #e7eefb;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgb(30 80 150 / 14%);
    cursor: pointer;
  }

  #kuaijing-mobile-menu span {
    display: block;
    width: 20px;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
  }

  #kuaijing-mobile-backdrop {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: block;
    background: rgb(0 0 0 / 32%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
  }

  #kuaijing-mobile-backdrop.is-visible {
    opacity: 1;
    pointer-events: auto;
  }

  #workAI > .layout-box > section {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
  }

  #workAI .layout-header {
    flex: 0 0 64px;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
    padding: 0 12px 0 58px !important;
  }

  #workAI .route-layout {
    flex: 1 1 auto;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: auto !important;
    overscroll-behavior: contain;
  }

  #workAI .route-layout > *,
  #workAI .route-layout .page-content,
  #workAI .route-layout .page-container,
  #workAI .route-layout .container,
  #workAI .route-layout .content,
  #workAI .route-layout .box {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  #workAI .route-layout img,
  #workAI .route-layout video,
  #workAI .route-layout canvas,
  #workAI .route-layout iframe {
    max-width: 100%;
  }

  /* Keep data tables usable: the table itself may remain wide, while its
     wrapper provides the horizontal scroll instead of clipping columns. */
  #workAI .route-layout .ss-table-wrapper,
  #workAI .route-layout .ss-table-container,
  #workAI .route-layout .ant-table-wrapper,
  #workAI .route-layout .ant-table-container,
  #workAI .route-layout .table-content,
  #workAI .route-layout .table_box {
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  #workAI .route-layout .search-area,
  #workAI .route-layout .filter-area,
  #workAI .route-layout .n-grid,
  #workAI .route-layout .form-row,
  #workAI .route-layout .toolbar {
    min-width: 0 !important;
    max-width: 100% !important;
    flex-wrap: wrap;
  }

  /* Several legacy components set these widths inline or in scoped CSS. */
  #workAI .route-layout [style*="width: 1200px"],
  #workAI .route-layout [style*="width: 1180px"],
  #workAI .route-layout [style*="width: 1000px"],
  #workAI .route-layout [style*="width: 960px"],
  #workAI .route-layout [style*="width: 900px"],
  #workAI .route-layout [style*="width: 800px"],
  #workAI .route-layout [style*="width: 712px"],
  #workAI .route-layout [style*="width: 600px"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Home dashboard */
  #workAI .home {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
    padding: 0 12px !important;
  }

  #workAI .home .header-content {
    width: 100% !important;
    height: auto !important;
    min-height: 250px;
    box-sizing: border-box;
    padding: 24px 14px !important;
    background-size: cover !important;
  }

  #workAI .home .h-content-title {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    font-size: 27px !important;
    line-height: 1.3 !important;
    text-align: center;
    overflow-wrap: anywhere;
  }

  #workAI .home .h-content-desc {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    text-align: center;
  }

  #workAI .home .h-content-serch-box {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
    margin-bottom: 15px !important;
  }

  #workAI .home .h-content-platform-list {
    flex-wrap: wrap;
    justify-content: center;
  }

  #workAI .home .content-func-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 10px !important;
    overflow: visible !important;
  }

  #workAI .home .content-func-list .c-f-l-item {
    width: auto !important;
    min-width: 0 !important;
    overflow: hidden;
  }

  #workAI .home .content-func-list .c-f-l-item .c-f-l-i-img img {
    width: 100% !important;
    height: auto !important;
    max-height: 100px;
    object-fit: contain;
  }

  #workAI .home .content-nav-data {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 12px !important;
  }

  #workAI .home .content-nav-data .c-n-d-left,
  #workAI .home .content-nav-data .c-n-d-right {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  #workAI .home .content-nav-data .c-n-d-left .c-n-d-l-content {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 12px !important;
  }

  #workAI .home .content-nav-data .c-n-d-left .content-item {
    min-width: 0 !important;
    gap: 8px !important;
  }

  #workAI .home .content-nav-data .c-n-d-left .c-n-d-l-c-i-right {
    min-width: 0 !important;
  }

  #workAI .home .content-nav-data .c-n-d-left .c-n-d-l-c-i-r-title,
  #workAI .home .content-nav-data .c-n-d-left .c-n-d-l-c-i-r-desc {
    overflow-wrap: anywhere;
  }

  #workAI .home .creative-reference {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
    overflow: hidden;
  }

  #workAI .home .creative-reference .r-c-list {
    min-width: 0 !important;
  }

  /* Login and other centered dialogs must never create a page-level
     horizontal scrollbar on a phone. */
  .ss-modal-wrap,
  .ant-modal-wrap {
    box-sizing: border-box;
    padding: 12px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .ss-modal,
  .ant-modal {
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
    margin: 0 !important;
    box-sizing: border-box;
  }

  .ss-modal-content,
  .ant-modal-content {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    overflow: hidden;
  }

  .ss-drawer-content-wrapper,
  .ant-drawer-content-wrapper {
    max-width: 100vw !important;
  }

  .login_modal .ss-modal-content,
  .login_modal .ss-modal-body,
  .login_modal .modal-content {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .login_modal .modal-content {
    padding: 28px 18px 20px !important;
  }

  .login_modal .modal-content .phone-input-wrap,
  .login_modal .modal-content .code-input-wrap {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .login_modal .modal-content button[style*="width: 360px"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .login_modal .info,
  .login_modal .info label {
    max-width: 100% !important;
    white-space: normal !important;
  }

  .login_modal .info label > span:last-child {
    display: block;
    min-width: 0;
    flex: 1 1 auto;
    white-space: normal !important;
    line-height: 1.5;
  }

  .login_modal .login_type {
    flex: 0 0 auto !important;
    min-width: 70px !important;
  }

  .login_modal .login_type > div {
    min-width: 70px !important;
    padding: 0 8px !important;
    white-space: nowrap !important;
  }

  .login_modal .ss-row .ss-col.flex.justify-between {
    gap: 4px;
  }

  .login_modal .ss-row .ss-col.flex.justify-between > div:last-child {
    display: flex !important;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
  }

  .login_modal .switch-type,
  .login_modal .switch-type .switch-type-img {
    width: 60px !important;
    height: 60px !important;
  }

  /* Membership cards use a two-column desktop split. Stack the panes on
     narrow screens so the package details and payment controls remain usable. */
  .activate_member_ship,
  .activate_member_ship .top_bar,
  .activate_member_ship .tab_main,
  .activate_member_ship .tab_main .left_package_detail,
  .activate_member_ship .tab_main .right_set_package {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .activate_member_ship .top_bar {
    min-height: 64px;
    height: auto !important;
    padding: 10px 44px 10px 12px;
  }

  .activate_member_ship .top_bar .right_tips {
    margin-right: 0 !important;
    font-size: 12px;
    text-align: right;
  }

  .activate_member_ship .tab_con {
    height: 42px !important;
  }

  .activate_member_ship .tab_main {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px;
    padding: 12px !important;
    overflow: auto !important;
  }

  .activate_member_ship .tab_main .left_package_detail,
  .activate_member_ship .tab_main .right_set_package {
    height: auto !important;
    min-height: 0 !important;
    padding: 16px !important;
    border-radius: 8px !important;
  }

  .activate_member_ship .tab_main .left_package_detail .bottom_con {
    position: static !important;
    width: 100% !important;
    margin-top: 16px;
    box-sizing: border-box;
  }

  .activate_member_ship .tab_main .right_set_package .package_con {
    height: 180px !important;
  }

  .activate_member_ship .tab_main .right_set_package .pay_con {
    height: auto !important;
    min-height: 131px;
    flex-wrap: wrap;
  }

  /* Current membership dialog (the site also keeps the legacy
     .activate_member_ship implementation above). */
  .vip-modal-wrap .ss-modal {
    top: 0 !important;
    padding: 0 !important;
  }

  .vip-modal-wrap .ss-modal-content,
  .vip-modal-wrap .ss-modal-body {
    max-height: calc(100dvh - 24px) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
  }

  .vip-main {
    width: 100% !important;
    height: calc(100dvh - 24px) !important;
    max-height: calc(100dvh - 24px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .vip-main .vip-header {
    min-height: 150px;
    height: auto !important;
    padding: 16px 42px 58px 12px !important;
    align-items: flex-start !important;
  }

  .vip-main .header-left {
    min-width: 0;
    margin: 0 !important;
    align-items: flex-start !important;
  }

  .vip-main .avatar-icon {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px;
  }

  .vip-main .team-info,
  .vip-main .team-name,
  .vip-main .team-tip {
    min-width: 0;
    max-width: 100%;
  }

  .vip-main .team-name,
  .vip-main .team-tip {
    display: flex;
    flex-wrap: wrap;
    gap: 3px 8px;
    line-height: 1.45;
  }

  .vip-main .team-name > *,
  .vip-main .team-tip > * {
    margin-left: 0 !important;
  }

  .vip-main .header-right {
    position: absolute !important;
    top: 0;
    right: 0;
    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    transform: none !important;
  }

  .vip-main .close-icon {
    margin: 11px !important;
  }

  .vip-main .tabs {
    margin-top: -42px !important;
  }

  .vip-main .tabs .tabs-container {
    height: 42px !important;
    border-radius: 8px 8px 0 0 !important;
  }

  .vip-main .tabs .tabs-list .tabs-list-item .tabs-list-item-img {
    top: 0 !important;
    height: 42px !important;
  }

  .vip-main .tabs .tabs-list .tabs-list-item .tabs-list-item-text {
    width: 100%;
    padding: 0 6px;
    transform: none !important;
    text-align: center;
    font-size: 15px;
  }

  .vip-main .tabs .title_content_text {
    font-size: 15px !important;
  }

  .vip-main .tabs .title_tips {
    display: none;
  }

  .vip-main .vip-content {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .vip-main .vip-left-content,
  .vip-main .vip-right-content {
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  .vip-main .vip-left-content {
    max-height: 220px;
    padding: 14px 16px !important;
    border-radius: 0 0 8px 8px !important;
    overflow-y: auto !important;
  }

  .vip-main .vip-left-content .package_content_box {
    min-height: 110px;
    padding-bottom: 8px !important;
  }

  .vip-main .vip-left-content .bottom_con {
    height: auto !important;
    min-height: 76px;
    margin-top: 8px !important;
  }

  .vip-main .vip-right-content {
    padding: 12px !important;
  }

  .vip-main .package_list_container {
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .vip-main .package_list {
    width: 100% !important;
    max-width: 100% !important;
    padding-bottom: 8px !important;
    overflow-x: auto !important;
  }

  .vip-main .package_list .package_item {
    width: min(275px, calc(100vw - 62px)) !important;
  }

  .vip-main .pay-area {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 14px !important;
    box-sizing: border-box;
  }

  .vip-main .pay-qr-code {
    align-self: center;
  }

  .vip-main .pay-content-area,
  .vip-main .pay-moneny-area,
  .vip-main .methods_tab,
  .vip-main .pay-bottom {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
  }

  .vip-main .pay-moneny-area {
    gap: 4px;
  }

  .vip-main .pay-moneny-area .discount,
  .vip-main .methods_tab .methods_item {
    margin-left: 4px !important;
  }

  /* Team, profile and password forms. */
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout > div,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout > div,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout > div,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout .content,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout .content,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout .content {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item-row,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item-row,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item-row,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item-label,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item-label,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item-label,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item-control,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item-control,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item-control,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item-control-input,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item-control-input,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item-control-input,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item-control-input-content,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item-control-input-content,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item-control-input-content,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form input,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form input,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form input,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .info-display {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item-row,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item-row,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item-row {
    display: block !important;
  }

  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item-label,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item-label,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item-label,
  html[data-kuaijing-route="/workShotstack/info"] #workAI .route-layout form.ss-form .ss-form-item-control,
  html[data-kuaijing-route="/workShotstack/userinfo"] #workAI .route-layout form.ss-form .ss-form-item-control,
  html[data-kuaijing-route="/workShotstack/changePassword"] #workAI .route-layout form.ss-form .ss-form-item-control {
    flex: 0 0 100% !important;
  }

  /* Digital-human list pages share a fixed desktop banner and filter row. */
  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .smart-clip-header {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 20px !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .smart-clip-header-title_top,
  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .smart-clip-header-desc {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere;
  }

  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .smart-clip-header-title_top {
    font-size: 22px !important;
  }

  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_title_box,
  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_title,
  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_left {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_title {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_left {
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_left .serch_item {
    flex: 1 1 140px;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_left .serch_item > *,
  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_left .ss-picker,
  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_left .ss-select,
  html[data-kuaijing-route^="/workShotstack/digitalHuman/"] #workAI .route-layout .serch_left .ss-input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHuman"] #workAI .route-layout .digitalHumanComponents,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHuman"] #workAI .route-layout .AIdigitalHuman_content,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHuman"] #workAI .route-layout .ss-spin-nested-loading,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHuman"] #workAI .route-layout .ss-spin-container,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SoundCloning"] #workAI .route-layout .box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SoundCloning"] #workAI .route-layout .personal-voice,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SoundCloning"] #workAI .route-layout .ss-spin-nested-loading,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SoundCloning"] #workAI .route-layout .ss-spin-container {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHuman"] #workAI .route-layout .AIdigitalHuman_content,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SoundCloning"] #workAI .route-layout .personal-voice {
    padding: 14px !important;
    overflow-x: hidden !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHuman"] #workAI .route-layout .empty_box {
    width: 100% !important;
    min-width: 0 !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SoundCloning"] #workAI .route-layout .voice-list-container {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* Single digital-human video creator: select, edit and preview in sequence. */
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .AIdigitalHumanCreatVideo {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 100%;
    overflow: visible !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .AIdigitalHumanCreatVideo > form,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .content_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .left_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .right_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .tab_text,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .tab_text_left,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .tab_text_right {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .AIdigitalHumanCreatVideo > form,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .content_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .tab_text {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .left_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .right_box {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .left_box .list_box {
    min-height: 280px;
    max-height: 480px;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .left_box .list_box .list_item {
    width: calc(50% - 8px) !important;
    min-width: 0 !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .tab_text,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .editor_operation,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .text_controls,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .ss-radio-group {
    flex-wrap: wrap !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanCreatVideo"] #workAI .route-layout .view_content {
    height: auto !important;
    max-height: 520px;
    aspect-ratio: 9 / 16;
  }

  /* Batch creator: each scene becomes a vertical, independently readable unit. */
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .AIdigitalHumanMassProduction,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .content_left,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .content_left_list_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .content_left_list_scroll_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .content_left_list_item,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_content,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_content_center,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_content_right,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .content_right {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .AIdigitalHumanMassProduction,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_content {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .content_left_list_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .content_left_list_scroll_box {
    height: auto !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .top_controls,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_top {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .top_controls_right,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_top_left,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_top_left_right,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .text_controls {
    width: 100% !important;
    min-width: 0 !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_content_left {
    width: min(180px, 100%) !important;
    min-width: 0 !important;
    height: 250px !important;
    margin: 0 auto;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_content_center {
    min-height: 340px;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .editor_component,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .editor_component > .content,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .editor_component .btn_box,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .editor_component .editor_operation,
  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .editor_component .edit_show_msg {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .editor_component .btn_box {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .editor_component .editor_operation {
    flex-wrap: wrap !important;
    gap: 8px 12px !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .editor_component .edit_show_msg {
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/AIdigitalHumanMassProduction"] #workAI .route-layout .cart_content_right {
    height: auto !important;
    min-height: 260px;
  }

  /* IP talking-head studio: task list, material steps and output settings stack. */
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .sense-video-page,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .studio-layout,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .task-rail,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .preview-stage,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .creation-flow,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .config-panel {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .sense-video-page,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .studio-layout {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .studio-layout {
    display: flex !important;
    flex-direction: column !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .workbench-header,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .header-context {
    height: auto !important;
    min-height: 54px;
    flex-wrap: wrap !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .task-title-input {
    width: auto !important;
    min-width: 0 !important;
    flex: 1 1 150px;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .task-rail {
    flex: 0 0 260px !important;
    height: 260px !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--sense-border);
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .task-rail.collapsed {
    flex-basis: 60px !important;
    height: 60px !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .preview-stage,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .config-panel,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .panel-body {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    flex: 0 0 auto !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .config-panel {
    border-top: 1px solid var(--sense-border);
    border-left: 0 !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .flow-section,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-cards,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-card,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-empty,
  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-empty .asset-actions {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-cards {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-empty {
    grid-template-columns: 40px minmax(0, 1fr) !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-empty .asset-actions {
    grid-column: 1 / -1;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-empty .asset-actions:not(.primary-source-actions) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-kuaijing-route="/workShotstack/digitalHuman/SenseVideo"] #workAI .route-layout .asset-empty .asset-actions .small-button {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* Matrix pages keep data tables wide inside a dedicated scroll container. */
  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .serch_title,
  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .serch_left {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .serch_item {
    flex: 1 1 140px;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .serch_item > *,
  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .serch_item .ss-input,
  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .serch_item .ss-select,
  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .serch_item .ss-picker {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .ss-table-wrapper,
  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .ss-table-container,
  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .ss-table-content,
  html[data-kuaijing-route^="/workShotstack/matrixMarketing/"] #workAI .route-layout .ss-table-body {
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/ReleaseList"] #workAI .route-layout .ss-tabs-nav-wrap {
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/ReleaseList"] #workAI .route-layout .ss-tabs-nav-list {
    min-width: max-content;
    transform: none !important;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/PreciseReleaseCreate"] #workAI .route-layout .platform-card,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/PreciseReleaseCreate"] #workAI .route-layout .platform-card-head,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/PreciseReleaseCreate"] #workAI .route-layout .pch-left,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/PreciseReleaseCreate"] #workAI .route-layout .pch-right {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/PreciseReleaseCreate"] #workAI .route-layout .pch-right {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px !important;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/PreciseReleaseCreate"] #workAI .route-layout .pch-right .ss-btn {
    width: 100% !important;
    min-width: 0 !important;
    padding-inline: 6px !important;
  }

  /* Data center: compact summary grids and stack desktop card pairs. */
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout > .box,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .data-top-list,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .top_list_left,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .top_list_right {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    box-sizing: border-box;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .data-top-list {
    flex-direction: column !important;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .top_list_left > .ss-row,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .video-data-trend,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .detail-data-toolbar,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .detail-data-filters {
    flex-wrap: wrap !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 10px !important;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .top_list_left .notice-text {
    position: static !important;
    width: 100%;
    padding: 0 20px 8px !important;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .left_top,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .left_bottom,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .video-data {
    width: 100% !important;
    min-width: 0 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    height: auto !important;
    gap: 10px !important;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .cart_item,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .platform-num,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .content_num_bottom {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout > .box > .ss-row > .ss-col-12 {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .video-data-trend {
    align-items: stretch !important;
    padding: 18px 12px !important;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .detail-data-toolbar {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .detail-data-filters .ant-input-search,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .detail-data-filters .ant-picker,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .detail-data-filters .ss-input-search,
  html[data-kuaijing-route="/workShotstack/datacenter"] #workAI .route-layout .detail-data-filters .ss-picker {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* AI reproduction: the legacy desktop template grid and filter row need
     to become fluid before the cards can fit on a phone. */
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .template_content,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .flow-wrapper,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .ss-tabs,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .ss-tabs-nav,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .ss-tabs-nav-wrap,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .template-content-box,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .template-square-container,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .template-grid {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .flow-wrapper,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .template-content-box {
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .ss-tabs-nav-wrap {
    overflow-x: auto !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .ss-tabs-nav-list {
    width: max-content !important;
    min-width: max-content !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box {
    flex-wrap: wrap !important;
    gap: 8px !important;
    overflow-x: hidden !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box > * {
    flex: 1 1 140px;
    min-width: 0 !important;
    max-width: 100% !important;
    width: auto !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box .ss-select,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box .ss-select-selector,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box .ss-select-selection-search,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box .ss-select-selection-search-input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .flow-wrapper > div:nth-child(2) {
    overflow-x: hidden !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box .ss-select,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/AIReproduction"] #workAI .route-layout .serch_box .ss-select-selector {
    overflow: hidden !important;
  }

  /* One-click film production: keep the creation steps and image upload
     controls in a readable single column. */
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .scenario-shell,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .scenario-workspace,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .template_content,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .ai-film-page,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .workspace-view,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-workspace,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-layout,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-main,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .create-box,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .form-container,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .ss-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .scenario-workspace,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .template_content,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .ai-film-page,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .workspace-view {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-workspace,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-layout {
    display: block !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-layout {
    padding: 12px !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-stepper,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-step,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .product-image-field,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .split-upload,
  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .split-upload-col {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .creation-stepper {
    flex-wrap: wrap !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .split-upload {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  html[data-kuaijing-route="/workShotstack/AiVideoCreation/aIOneClickFilmProduction"] #workAI .route-layout .split-divider {
    display: none !important;
  }

  /* Legacy creativity tools share a two-pane desktop form. */
  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content {
    flex-direction: column !important;
    align-items: stretch !important;
    height: auto !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
    box-sizing: border-box;
    margin: 0 0 12px !important;
  }

  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder form,
  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form,
  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form-item,
  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form-item-row,
  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form-item-control,
  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form-item-control-input,
  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form-item-control-input-content {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form-item-row {
    display: block !important;
  }

  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form-item-label,
  html[data-kuaijing-route^="/workShotstack/CreativityToolsList/"] #workAI .route-layout .form-content > .content > .box > .content > .video_broder .ss-form-item-control {
    display: block !important;
    flex: 0 0 100% !important;
  }

  /* Text-to-speech has a fixed two-column editor and a non-wrapping voice
     tab bar in the upstream build. */
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 14px 12px 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .main-layout,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .left-sider,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .right-content,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .left-card,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .right-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .main-layout {
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .left-sider,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .right-content,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .left-card,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .right-card {
    height: auto !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .voice_type_box .ss-tabs-nav-wrap {
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .voice_type_box .ss-tabs-nav-list {
    min-width: max-content !important;
    width: max-content !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .copywriting-content {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .textarea-wrapper,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .editor_component,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .editor_component .content,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .editor_component .btn_box {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .editor_component .btn_box {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .editor_component .editor_operation,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .operation-text-actions,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .operation-text-actions .left-actions,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/textToSpeech"] #workAI .route-layout > .smart-clip .operation-text-actions .right-actions {
    min-width: 0 !important;
    flex-wrap: wrap !important;
  }

  html[data-kuaijing-route^="/workShotstack/creationCenter/"] #workAI .route-layout .TemplateList_content .title_serch_box {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route^="/workShotstack/creationCenter/"] #workAI .route-layout .TemplateList_content .banner-inner {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    padding: 14px !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route^="/workShotstack/creationCenter/"] #workAI .route-layout .TemplateList_content .banner-left,
  html[data-kuaijing-route^="/workShotstack/creationCenter/"] #workAI .route-layout .TemplateList_content .banner-right {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route^="/workShotstack/creationCenter/"] #workAI .route-layout .TemplateList_content .banner-right {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  html[data-kuaijing-route^="/workShotstack/creationCenter/"] #workAI .route-layout .TemplateList_content .banner-right .serch_box,
  html[data-kuaijing-route^="/workShotstack/creationCenter/"] #workAI .route-layout .TemplateList_content .banner-right > .ss-btn {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Material center: put the storage summary below the main tab labels and
     stack the project/detail panes on narrow screens. */
  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-list-entry,
  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-list-entry .content,
  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-list-entry .left-content,
  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-list-entry .right-content {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-list-entry .content {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    overflow: visible !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-list-entry .left-content,
  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-list-entry .right-content {
    flex: 0 0 auto !important;
    height: auto !important;
    padding: 0 !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-list-entry .right-content {
    margin-top: 12px !important;
    min-height: 180px !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .ss-tabs-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    min-width: 0 !important;
    align-items: stretch !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .ss-tabs-nav-wrap {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .ss-tabs-nav-list {
    width: max-content !important;
    min-width: max-content !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .ss-tabs-nav-operations {
    display: none !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .ss-tabs-extra-content,
  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .memory {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .memory > .ss-row {
    width: 100% !important;
    min-width: 0 !important;
    flex-wrap: wrap !important;
    gap: 6px 10px !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .memory > .ss-row > .ss-col:first-child {
    margin-right: 0 !important;
  }

  html[data-kuaijing-route="/workShotstack/creationCenter/materialList"] #workAI .route-layout .material-title-tabs .memory .ss-space {
    max-width: 100% !important;
    flex-wrap: wrap !important;
  }

  /* Standalone GPT pages ship a separate desktop header. On phones retain
     the brand and avatar, while collapsing the desktop menu/search controls. */
  #workGpt-basic-layout {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  #workGpt-basic-layout .basic-layout-header,
  #workGpt-basic-layout .layout-header {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 64px !important;
    min-height: 64px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  #workGpt-basic-layout .layout-header {
    display: flex !important;
    align-items: center !important;
    padding: 0 12px !important;
  }

  #workGpt-basic-layout .header-left {
    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 52px) !important;
    height: 64px !important;
    flex: 1 1 auto !important;
    align-items: center !important;
    overflow: hidden !important;
  }

  #workGpt-basic-layout .header-logo {
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
    object-fit: contain !important;
  }

  #workGpt-basic-layout .title-txt {
    min-width: 0 !important;
    max-width: 160px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 16px !important;
  }

  #workGpt-basic-layout .header-left-tip,
  #workGpt-basic-layout .menu-list,
  #workGpt-basic-layout .search-box,
  #workGpt-basic-layout .header-right > .ant-row {
    display: none !important;
  }

  #workGpt-basic-layout .header-right {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 64px !important;
    flex: 0 0 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    overflow: hidden !important;
  }

  #workGpt-basic-layout .user-wrap,
  #workGpt-basic-layout .user {
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 44px !important;
    box-sizing: border-box !important;
  }

  #workGpt-basic-layout .user {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  #workGpt-basic-layout .user-avatar {
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
  }

  #workGpt-basic-layout .user-nickname {
    display: none !important;
  }

  #workGpt-basic-layout .route-layout {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: auto !important;
  }

  #workGpt-basic-layout .route-layout > * {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* The settings pages keep a 400px Ant form inline on desktop. Let every
     card, row and control shrink with the phone viewport. */
  #workGpt-basic-layout .app-list-page,
  #workGpt-basic-layout .page-center,
  #workGpt-basic-layout .ant-card,
  #workGpt-basic-layout .ant-card-body,
  #workGpt-basic-layout form,
  #workGpt-basic-layout .ant-form-item,
  #workGpt-basic-layout .ant-form-item-row,
  #workGpt-basic-layout .ant-row,
  #workGpt-basic-layout .ant-col,
  #workGpt-basic-layout .ant-form-item-control-input,
  #workGpt-basic-layout .ant-form-item-control-input-content,
  #workGpt-basic-layout .ant-input,
  #workGpt-basic-layout .ant-input-affix-wrapper,
  #workGpt-basic-layout .ant-upload-wrapper,
  #workGpt-basic-layout .ant-upload-list {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #workGpt-basic-layout .team-setting .ant-card-body {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }

  #workGpt-basic-layout .team-setting .left,
  #workGpt-basic-layout .team-setting .right,
  #workGpt-basic-layout .team-setting .left-side {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
  }

  #workGpt-basic-layout .team-setting .left-side .menu {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    overflow: visible !important;
  }

  #workGpt-basic-layout .team-setting .left-side .menu > *,
  #workGpt-basic-layout .team-setting .left-side .menu a,
  #workGpt-basic-layout .team-setting .left-side .menu button {
    flex: 1 1 120px !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  #workGpt-basic-layout .team-setting .right .right-content {
    padding: 12px 0 !important;
  }

  /* WorkAI's legacy login view has a 446px absolutely positioned panel. */
  #workGpt-basic-layout > .ant-layout-has-sider > .ant-layout-sider {
    display: none !important;
  }

  #workGpt-basic-layout > .ant-layout-has-sider > .ant-layout {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  #workGpt-basic-layout .big_box,
  #workGpt-basic-layout .login_box,
  #workGpt-basic-layout .systemLogo,
  #workGpt-basic-layout .modal-content {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #workGpt-basic-layout .login_box {
    position: static !important;
    margin: 16px auto !important;
    padding: 0 12px !important;
  }

  #workGpt-basic-layout .modal-content {
    padding: 28px 12px 20px !important;
  }

  #workGpt-basic-layout .phone-input-wrap,
  #workGpt-basic-layout .code-input-wrap,
  #workGpt-basic-layout .login_box button,
  #workGpt-basic-layout .zhuce_btn,
  #workGpt-basic-layout .ok_btn,
  #workGpt-basic-layout .Verificode_btn {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #workGpt-basic-layout .login_box .ant-row,
  #workGpt-basic-layout .login_box .ant-col,
  #workGpt-basic-layout .login_box .info,
  #workGpt-basic-layout .login_box .info label {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* The policy content contains authored 750px paragraphs without inline
     styles. Force all direct rich-text children to the viewport width. */
  html[data-kuaijing-route="/UseAgreement"] .text > *,
  html[data-kuaijing-route="/PrivacyAgreement"] .text > * {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  /* Material cards are intentionally fixed-width on desktop, but should
     become a single readable column in the project list on phones. */
  html[data-kuaijing-route="/workShotstack/materialCenter/shopList"] #workAI .route-layout .material-list,
  html[data-kuaijing-route="/workShotstack/materialCenter/shopList"] #workAI .route-layout .sub-list,
  html[data-kuaijing-route="/workShotstack/materialCenter/shopList"] #workAI .route-layout .material-list > *,
  html[data-kuaijing-route="/workShotstack/materialCenter/shopList"] #workAI .route-layout .sub-list > * {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    flex: 1 1 100% !important;
  }

  html[data-kuaijing-route="/workShotstack/materialCenter/shopList"] #workAI .route-layout .material-list,
  html[data-kuaijing-route="/workShotstack/materialCenter/shopList"] #workAI .route-layout .sub-list {
    flex-direction: column !important;
    gap: 8px !important;
  }

  html[data-kuaijing-route="/workShotstack/materialCenter/shopList"] #workAI .route-layout .sub-content {
    min-width: 0 !important;
    overflow-wrap: anywhere !important;
  }

  /* Stack the form and preview panes on the multi-platform release view. */
  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .MultiplatformRelease,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .content_box,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .content_left,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .content_right {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .content_box {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    gap: 12px !important;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .content_left,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .content_right {
    flex: 0 0 auto !important;
    height: auto !important;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .movies_add,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .movies_add > *,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .movies_add .upload_desc,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/MultiplatformRelease"] #workAI .route-layout .movies_add .select_material_box {
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  html[data-kuaijing-route="/workShotstack/matrixMarketing/ReleaseList"] #workAI .route-layout > .box,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/ReleaseList"] #workAI .route-layout > .box > .ss-tabs,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/ReleaseList"] #workAI .route-layout > .box > .ss-tabs .ss-tabs-content-holder,
  html[data-kuaijing-route="/workShotstack/matrixMarketing/ReleaseList"] #workAI .route-layout > .box > .ss-tabs .ss-tabs-content {
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  /* Query/export controls were placed in ant-col-1 (13px) columns. */
  html[data-kuaijing-route="/createCenter"] #workAI .route-layout .right-box > .ant-row > .ant-col-1 {
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    flex: 0 0 64px !important;
  }

  html[data-kuaijing-route="/createCenter"] #workAI .route-layout .right-box > .ant-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  html[data-kuaijing-route="/createCenter"] #workAI .route-layout .right-box > .ant-row .ant-btn {
    min-width: 64px !important;
    max-width: 100% !important;
  }

  /* On narrow screens these search forms are more usable as one control per
     row; keeping two desktop columns squeezes the date picker to 30px. */
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/videoToTextList"] #workAI .route-layout .search-area .n-grid,
  html[data-kuaijing-route="/workShotstack/itemTag"] #workAI .route-layout .search-area .n-grid {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    gap: 8px !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/videoToTextList"] #workAI .route-layout .search-area .n-grid-item,
  html[data-kuaijing-route="/workShotstack/itemTag"] #workAI .route-layout .search-area .n-grid-item,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/videoToTextList"] #workAI .route-layout .search-area .n-input-group,
  html[data-kuaijing-route="/workShotstack/itemTag"] #workAI .route-layout .search-area .n-input-group,
  html[data-kuaijing-route="/workShotstack/CreativityToolsList/videoToTextList"] #workAI .route-layout .search-area .ss-picker,
  html[data-kuaijing-route="/workShotstack/itemTag"] #workAI .route-layout .search-area .ss-picker {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  html[data-kuaijing-route="/workShotstack/CreativityToolsList/videoToTextList"] #workAI .route-layout .search-area .n-grid-item,
  html[data-kuaijing-route="/workShotstack/itemTag"] #workAI .route-layout .search-area .n-grid-item {
    flex: 0 0 auto !important;
  }

  html[data-kuaijing-route="/workShotstack/personalCenter/businessRecord"] #workAI .route-layout .business_record,
  html[data-kuaijing-route="/workShotstack/personalCenter/businessRecord"] #workAI .route-layout .business_record .ss-tabs,
  html[data-kuaijing-route="/workShotstack/personalCenter/businessRecord"] #workAI .route-layout .business_record .ss-tabs-content-holder,
  html[data-kuaijing-route="/workShotstack/personalCenter/businessRecord"] #workAI .route-layout .business_record .top_search,
  html[data-kuaijing-route="/workShotstack/personalCenter/businessRecord"] #workAI .route-layout .business_record .top_search form,
  html[data-kuaijing-route="/workShotstack/personalCenter/robotMessage"] #workAI .route-layout .box,
  html[data-kuaijing-route="/workShotstack/personalCenter/robotMessage"] #workAI .route-layout .box .content,
  html[data-kuaijing-route="/workShotstack/personalCenter/robotMessage"] #workAI .route-layout .box form {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  html[data-kuaijing-route="/workShotstack/personalCenter/businessRecord"] #workAI .route-layout .business_record .top_search form,
  html[data-kuaijing-route="/workShotstack/personalCenter/robotMessage"] #workAI .route-layout .box form {
    width: calc(100% - 8px) !important;
  }

  html[data-kuaijing-route="/workShotstack/operationCenter/TextImitation"] #workAI .route-layout .quick-fill-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  html[data-kuaijing-route="/workShotstack/operationCenter/TextImitation"] #workAI .route-layout .quick-fill-list .ss-btn {
    min-width: 0 !important;
    max-width: 100% !important;
    padding-inline: 8px !important;
    box-sizing: border-box !important;
  }

  #workGpt-basic-layout .app-list {
    min-width: 0 !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* Standalone agreements contain rich text authored at a fixed 750px. */
  html[data-kuaijing-route="/UseAgreement"] #pageBox,
  html[data-kuaijing-route="/PrivacyAgreement"] #pageBox,
  html[data-kuaijing-route="/UseAgreement"] #app,
  html[data-kuaijing-route="/PrivacyAgreement"] #app,
  html[data-kuaijing-route="/UseAgreement"] .content,
  html[data-kuaijing-route="/PrivacyAgreement"] .content,
  html[data-kuaijing-route="/UseAgreement"] .text,
  html[data-kuaijing-route="/PrivacyAgreement"] .text,
  html[data-kuaijing-route="/UseAgreement"] .text .title,
  html[data-kuaijing-route="/PrivacyAgreement"] .text .title,
  html[data-kuaijing-route="/UseAgreement"] .text [style*="width"],
  html[data-kuaijing-route="/PrivacyAgreement"] .text [style*="width"] {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box;
    overflow-wrap: anywhere;
  }

  body:has(.vip-main) #kuaijing-mobile-menu,
  body:has(.vip-main) .pwa-install-banner {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 1100px) {
  #workAI .home .header-content {
    min-height: 280px;
  }

  #workAI .home .content-nav-data .c-n-d-left .c-n-d-l-content {
    gap: 28px 24px;
  }

  .ss-modal,
  .ant-modal {
    max-width: calc(100vw - 32px) !important;
  }
}