@media (max-width: 768px) {
  html:has(body.admin-ai-models-app-page) {
    background: #f8fafc !important;
    background-color: #f8fafc !important;
  }

  html.dark:has(body.admin-ai-models-app-page) {
    background: #070707 !important;
    background-color: #070707 !important;
  }

  body.admin-ai-models-app-page {
    overflow: hidden !important;
    min-height: 100vh !important;
    min-height: 100dvh !important;
    background: #f8fafc !important;
    background-color: #f8fafc !important;
    color-scheme: light !important;
  }

  body.admin-ai-models-app-page #app,
  body.admin-ai-models-app-page .app-wrapper,
  body.admin-ai-models-app-page .main-container,
  body.admin-ai-models-app-page .app-main,
  body.admin-ai-models-app-page .app-scrollbar {
    background: #f8fafc !important;
    background-color: #f8fafc !important;
  }

  html.dark body.admin-ai-models-app-page,
  html.dark body.admin-ai-models-app-page #app,
  html.dark body.admin-ai-models-app-page .app-wrapper,
  html.dark body.admin-ai-models-app-page .main-container,
  html.dark body.admin-ai-models-app-page .app-main,
  html.dark body.admin-ai-models-app-page .app-scrollbar {
    background: #070707 !important;
    background-color: #070707 !important;
  }

  html.dark body.admin-ai-models-app-page {
    color-scheme: dark !important;
  }

  body.admin-ai-models-app-page .app-wrapper,
  body.admin-ai-models-app-page .main-container,
  body.admin-ai-models-app-page .app-main,
  body.admin-ai-models-app-page .app-scrollbar {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.admin-ai-models-app-page .app-main {
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 0 !important;
    padding-top: calc(var(--v3-header-height) + 8px) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.admin-ai-models-app-page .app-scrollbar,
  body.admin-ai-models-app-page .app-scrollbar > .el-scrollbar__wrap,
  body.admin-ai-models-app-page .app-scrollbar .el-scrollbar__view,
  body.admin-ai-models-app-page .app-container-grow {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .admin-ai-models-app {
    --page-bg: #f8fafc !important;
    --panel-bg: #ffffff !important;
    --panel-soft: rgba(15, 23, 42, .035) !important;
    --dialog-bg: #ffffff !important;
    --dialog-section: #f8fafc !important;
    --dialog-field: #ffffff !important;
    --line: rgba(15, 23, 42, .1) !important;
    --line-strong: rgba(15, 23, 42, .16) !important;
    --text: #111827 !important;
    --muted: #64748b !important;
    --gold: #2f6df6 !important;
    --el-bg-color: #ffffff !important;
    --el-bg-color-page: #f8fafc !important;
    --el-fill-color-blank: #ffffff !important;
    --el-fill-color-light: #f8fafc !important;
    --el-border-color: rgba(15, 23, 42, .1) !important;
    --el-border-color-light: rgba(15, 23, 42, .08) !important;
    --el-text-color-primary: #111827 !important;
    --el-text-color-regular: #334155 !important;
    --el-text-color-secondary: #64748b !important;
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    background: #f8fafc !important;
    background-color: #f8fafc !important;
  }

  html.dark .admin-ai-models-app {
    --page-bg: #070707 !important;
    --panel-bg: #18181b !important;
    --panel-soft: rgba(255, 255, 255, .055) !important;
    --dialog-bg: #18181b !important;
    --dialog-section: #202024 !important;
    --dialog-field: #161618 !important;
    --line: rgba(255, 255, 255, .1) !important;
    --line-strong: rgba(255, 255, 255, .16) !important;
    --text: #f5f7fb !important;
    --muted: #9ca3af !important;
    --gold: #5b7cff !important;
    --el-bg-color: #18181b !important;
    --el-bg-color-page: #070707 !important;
    --el-fill-color-blank: #161618 !important;
    --el-fill-color-light: #202024 !important;
    --el-border-color: rgba(255, 255, 255, .1) !important;
    --el-border-color-light: rgba(255, 255, 255, .07) !important;
    --el-text-color-primary: #f5f7fb !important;
    --el-text-color-regular: #d4d4d8 !important;
    --el-text-color-secondary: #9ca3af !important;
    background: #070707 !important;
    background-color: #070707 !important;
  }

  .admin-ai-models-app .model-panel {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  .admin-ai-models-app .toolbar {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .admin-ai-models-app .filters {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .admin-ai-models-app .filters > .el-input {
    width: 100% !important;
    min-width: 0 !important;
  }

  .admin-ai-models-app .filters > :not(.el-input) {
    display: none !important;
  }

  .admin-ai-models-app .actions {
    display: flex !important;
    width: auto !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    gap: 0 !important;
  }

  .admin-ai-models-app .actions > :not(.el-button--primary) {
    display: none !important;
  }

  .admin-ai-models-app .actions > .el-button--primary {
    display: inline-flex !important;
    width: auto !important;
    min-width: 84px !important;
    height: 36px !important;
    padding: 0 12px !important;
    justify-content: center !important;
    white-space: nowrap !important;
  }

  .admin-ai-models-app .mobile-list {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    padding-bottom: 8px !important;
    scroll-padding-bottom: 52px !important;
  }

  .admin-ai-models-app .mobile-card {
    flex: 0 0 auto !important;
  }

  .admin-ai-models-app .pagination-bar {
    flex: 0 0 44px !important;
    position: relative !important;
    bottom: auto !important;
    z-index: 4 !important;
    display: flex !important;
    align-items: center !important;
    min-height: 44px !important;
    height: 44px !important;
    max-height: 44px !important;
    padding: 6px 8px !important;
    justify-content: center !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border-top: 1px solid rgba(15, 23, 42, .1) !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    box-shadow: 0 -8px 18px rgba(15, 23, 42, .06) !important;
  }

  html.dark .admin-ai-models-app .pagination-bar {
    border-top-color: rgba(255, 255, 255, .1) !important;
    background: #18181b !important;
    background-color: #18181b !important;
    box-shadow: 0 -8px 18px rgba(0, 0, 0, .28) !important;
  }

  .admin-ai-models-app .pagination-bar .el-pagination {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
    gap: 4px !important;
    white-space: nowrap !important;
  }

  .admin-ai-models-app .pagination-bar .el-pagination .btn-prev,
  .admin-ai-models-app .pagination-bar .el-pagination .btn-next,
  .admin-ai-models-app .pagination-bar .el-pager,
  .admin-ai-models-app .pagination-bar .el-pager li {
    display: inline-flex !important;
  }

  .admin-ai-models-app .pagination-bar .el-pagination .btn-prev,
  .admin-ai-models-app .pagination-bar .el-pagination .btn-next,
  .admin-ai-models-app .pagination-bar .el-pager li {
    min-width: 28px !important;
    width: 28px !important;
    height: 28px !important;
    line-height: 28px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 1px !important;
    border: 1px solid rgba(15, 23, 42, .12) !important;
    border-radius: 6px !important;
    background: #f8fafc !important;
    background-color: #f8fafc !important;
    color: #334155 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
  }

  .admin-ai-models-app .pagination-bar .el-pagination .btn-prev:disabled,
  .admin-ai-models-app .pagination-bar .el-pagination .btn-next:disabled,
  .admin-ai-models-app .pagination-bar .el-pager li.is-disabled {
    opacity: .45 !important;
    color: #94a3b8 !important;
  }

  .admin-ai-models-app .pagination-bar .el-pager li.is-active,
  .admin-ai-models-app .pagination-bar .el-pager li.is-active.number {
    border-color: #409eff !important;
    background: #409eff !important;
    background-color: #409eff !important;
    color: #ffffff !important;
  }

  html.dark .admin-ai-models-app .pagination-bar .el-pagination .btn-prev,
  html.dark .admin-ai-models-app .pagination-bar .el-pagination .btn-next,
  html.dark .admin-ai-models-app .pagination-bar .el-pager li {
    border-color: rgba(255, 255, 255, .12) !important;
    background: #202024 !important;
    background-color: #202024 !important;
    color: rgba(255, 255, 255, .82) !important;
  }

  .model-frame-popover {
    display: none !important;
  }

  .admin-ai-models-app .mobile-list {
    align-content: start !important;
    align-items: start !important;
    grid-auto-rows: max-content !important;
  }

  .admin-ai-models-app .mobile-card {
    min-height: 0 !important;
    height: auto !important;
    align-content: start !important;
    border-radius: 8px !important;
    background: var(--panel-bg, #ffffff) !important;
    background-color: var(--panel-bg, #ffffff) !important;
    box-shadow: none !important;
  }

  html.dark .admin-ai-models-app .mobile-card {
    background: var(--panel-bg, #18181b) !important;
    background-color: var(--panel-bg, #18181b) !important;
  }

  .admin-ai-models-app .mobile-card header {
    align-items: center !important;
  }

  .admin-ai-models-app .mobile-grid {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    align-items: center !important;
  }

  .admin-ai-models-app .mobile-card footer {
    margin-top: 2px !important;
  }

  .ai-model-solid-dialog .form-help,
  .ai-model-dialog .form-help {
    margin-top: 5px !important;
    color: var(--ai-dialog-muted, var(--muted, #64748b)) !important;
    font-size: 11px !important;
    line-height: 1.45 !important;
    font-weight: 500 !important;
    opacity: .72 !important;
  }

  .ai-model-solid-dialog .model-form > .dialog-section:last-child .form-grid {
    grid-template-columns: minmax(0, 1fr) 86px !important;
    gap: 8px !important;
  }

  .ai-model-solid-dialog .model-form > .dialog-section:last-child .form-grid > .el-form-item {
    min-width: 0 !important;
  }

  .ai-model-solid-dialog .inline-switch-card {
    min-height: 34px !important;
    padding: 0 9px !important;
    gap: 8px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  .ai-model-solid-dialog .inline-switch-card > span {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .ai-model-solid-dialog .inline-switch-card .el-switch {
    flex: 0 0 auto !important;
  }

  .ai-model-solid-dialog .model-form > .dialog-section:last-child .el-input-number {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .ai-model-solid-dialog .model-form > .dialog-section:last-child .el-input-number .el-input__wrapper {
    width: 100% !important;
    min-width: 0 !important;
    padding-left: 6px !important;
    padding-right: 22px !important;
    box-sizing: border-box !important;
  }

  .ai-model-solid-dialog .model-form > .dialog-section:last-child .el-input-number .el-input__inner {
    min-width: 0 !important;
    text-align: center !important;
    font-size: 12px !important;
  }

  .ai-model-solid-dialog .model-form > .dialog-section:last-child .el-input-number__decrease,
  .ai-model-solid-dialog .model-form > .dialog-section:last-child .el-input-number__increase {
    width: 20px !important;
  }

  .ai-model-solid-dialog .billing-box > .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .ai-model-solid-dialog .billing-box > .form-grid > .span-2 {
    grid-column: 1 / -1 !important;
  }

  .ai-model-solid-dialog .billing-box > .form-grid > .el-form-item {
    min-width: 0 !important;
  }

  .ai-model-solid-dialog .el-form-item__label {
    line-height: 1.25 !important;
  }
}

@media (max-width: 720px) {
  .layout-header .navigation-bar {
    overflow: visible !important;
  }

  .layout-header .navigation-bar .right-menu {
    display: flex !important;
    flex: 0 0 auto !important;
    margin-left: auto !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 5 !important;
  }

  .navigation-bar .right-menu .user-dropdown {
    display: inline-flex !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    flex: 0 0 34px !important;
    overflow: visible !important;
  }

  .navigation-bar .right-menu .right-menu-avatar {
    width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
  }

  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar {
    display: inline-grid !important;
    width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    place-items: center !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar .el-avatar,
  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar .el-avatar[data-v-e7781e65],
  .navigation-bar[data-v-e7781e65] .right-menu .right-menu-avatar span.admin-nav-avatar[data-v-e7781e65] .el-avatar {
    display: inline-flex !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    flex: 0 0 30px !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar .el-avatar img,
  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar .el-avatar svg,
  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar .el-avatar .el-icon {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar .el-avatar img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: inherit !important;
  }

  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar .el-avatar svg,
  .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar .el-avatar .el-icon {
    width: 16px !important;
    height: 16px !important;
  }

  .navigation-bar .right-menu .right-menu-avatar > span:not(.admin-nav-avatar) {
    display: none !important;
  }

  .navigation-bar[data-v-e7781e65] .right-menu .right-menu-avatar span.admin-nav-avatar[data-v-e7781e65] {
    display: inline-grid !important;
    width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    place-items: center !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

@media (max-width: 900px) {
  body.admin-update-check-page .layout-header .navigation-bar {
    justify-content: space-between !important;
    padding: 0 8px 0 0 !important;
    overflow: visible !important;
  }

  body.admin-update-check-page .layout-header .navigation-bar .right-menu {
    display: flex !important;
    height: 44px !important;
    flex: 0 0 auto !important;
    margin-left: auto !important;
    align-items: center !important;
    gap: 2px !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 5 !important;
  }

  body.admin-update-check-page .layout-header .navigation-bar .right-menu .user-dropdown,
  body.admin-update-check-page .layout-header .navigation-bar .right-menu .right-menu-avatar {
    display: inline-flex !important;
  }

  body.admin-update-check-page .layout-header .navigation-bar .right-menu .right-menu-avatar .admin-nav-avatar {
    display: inline-grid !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}