/* desktop-portal-unification: shared desktop shell, layout and motion */

@keyframes portal-view-enter {
  from {
    opacity: 0.72;
    transform: translate3d(0, 8px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes portal-dialog-enter {
  from {
    opacity: 0;
    transform: translate3d(0, 10px, 0) scale(0.985);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes portal-toast-enter {
  from {
    opacity: 0;
    transform: translate3d(-50%, 8px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(-50%, 0, 0);
  }
}

@media (min-width: 981px) {
  body.admin-console-shell,
  body.client-shell,
  body.sales-shell {
    --portal-accent: #56d9ff;
    --portal-accent-rgb: 86, 217, 255;
    --portal-primary: #1677ff;
    --portal-bg: #061225;
    --portal-sidebar: #050f20;
    --portal-surface: rgba(10, 28, 55, 0.88);
    --portal-surface-strong: #0e2546;
    --portal-line: rgba(143, 199, 255, 0.2);
    --portal-line-strong: rgba(143, 199, 255, 0.36);
    --portal-text: #f2f8ff;
    --portal-muted: #a5bad1;
    --portal-ease: cubic-bezier(0.22, 1, 0.36, 1);
    grid-template-columns: 252px minmax(0, 1fr);
    color-scheme: dark;
    background:
      radial-gradient(circle at 82% 8%, rgba(38, 126, 255, 0.14), transparent 28%),
      radial-gradient(circle at 24% 92%, rgba(52, 203, 224, 0.09), transparent 30%),
      var(--portal-bg);
    color: var(--portal-text);
  }

  body.admin-console-shell {
    --portal-accent: #79f2c0;
    --portal-accent-rgb: 121, 242, 192;
  }

  body.sales-shell {
    --portal-accent: #5de4ff;
    --portal-accent-rgb: 93, 228, 255;
    --sales-bg: var(--portal-bg);
    --sales-card: var(--portal-surface);
    --sales-ink: var(--portal-text);
    --sales-muted: var(--portal-muted);
    --sales-line: var(--portal-line);
  }

  body.client-shell {
    --client-bg: var(--portal-bg);
    --client-card: var(--portal-surface);
    --client-ink: var(--portal-text);
    --client-muted: var(--portal-muted);
    --client-line: var(--portal-line);
  }

  body.client-shell.is-guest {
    --portal-accent: #ffd166;
    --portal-accent-rgb: 255, 209, 102;
    --client-accent: #ffd166;
  }

  body.admin-console-shell .sidebar,
  body.client-shell .sidebar,
  body.sales-shell .sidebar {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow-y: auto;
    border-right: 1px solid var(--portal-line);
    background:
      linear-gradient(180deg, rgba(var(--portal-accent-rgb), 0.055), transparent 32%),
      var(--portal-sidebar);
    padding: 24px 20px 22px;
  }

  body.admin-console-shell .brand,
  body.client-shell .brand,
  body.sales-shell .brand {
    min-height: 72px;
    margin: 0 0 20px;
    border-bottom: 1px solid var(--portal-line);
    padding: 0 4px 20px;
  }

  body.admin-console-shell .brand > span,
  body.client-shell .brand > span,
  body.sales-shell .brand > span {
    width: 48px;
    height: 48px;
    overflow: hidden;
    border-color: rgba(var(--portal-accent-rgb), 0.5);
    border-radius: 12px;
    background: #ffffff;
    box-shadow: none;
  }

  body.admin-console-shell .brand-logo,
  body.client-shell .brand-logo,
  body.sales-shell .brand-logo {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  body.admin-console-shell .brand h1,
  body.client-shell .brand h1,
  body.sales-shell .brand h1 {
    color: var(--portal-text);
    font-size: 20px;
    letter-spacing: -0.02em;
  }

  body.admin-console-shell .brand p,
  body.client-shell .brand p,
  body.sales-shell .brand p {
    color: var(--portal-muted);
  }

  body.admin-console-shell .nav,
  body.client-shell .nav,
  body.sales-shell .nav {
    gap: 6px;
  }

  body.admin-console-shell .sidebar .nav button,
  body.client-shell .sidebar .nav button,
  body.sales-shell .sidebar .nav button {
    position: relative;
    height: 44px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: #bfd0e2;
    padding: 0 14px 0 38px;
    font-size: 15px;
    font-weight: 700;
    transition:
      color 180ms ease,
      border-color 180ms ease,
      background-color 180ms ease,
      transform 200ms var(--portal-ease);
  }

  body.admin-console-shell .sidebar .nav button::before,
  body.client-shell .sidebar .nav button::before,
  body.sales-shell .sidebar .nav button::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 16px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.28;
    transform: translateY(-50%) scale(0.72);
    transition:
      opacity 180ms ease,
      transform 200ms var(--portal-ease),
      box-shadow 180ms ease;
  }

  body.admin-console-shell .sidebar .nav button:hover,
  body.client-shell .sidebar .nav button:hover,
  body.sales-shell .sidebar .nav button:hover {
    border-color: rgba(var(--portal-accent-rgb), 0.22);
    background: rgba(var(--portal-accent-rgb), 0.07);
    color: #ffffff;
    transform: translateX(2px);
  }

  body.admin-console-shell .sidebar .nav button.active,
  body.client-shell .sidebar .nav button.active,
  body.sales-shell .sidebar .nav button.active {
    border-color: rgba(var(--portal-accent-rgb), 0.44);
    background: rgba(var(--portal-accent-rgb), 0.12);
    color: #ffffff;
    transform: none;
  }

  body.admin-console-shell .sidebar .nav button.active::before,
  body.client-shell .sidebar .nav button.active::before,
  body.sales-shell .sidebar .nav button.active::before {
    background: var(--portal-accent);
    opacity: 1;
    box-shadow: 0 0 8px rgba(var(--portal-accent-rgb), 0.58);
    transform: translateY(-50%) scale(1);
  }

  body.admin-console-shell .demo-box,
  body.client-shell .demo-box,
  body.sales-shell .demo-box {
    margin-top: auto;
    border-color: var(--portal-line);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.025);
    color: var(--portal-muted);
    padding: 14px 15px;
  }

  body.admin-console-shell .demo-box strong,
  body.client-shell .demo-box strong,
  body.sales-shell .demo-box strong {
    color: var(--portal-text);
  }

  body.admin-console-shell .main,
  body.client-shell .main,
  body.sales-shell .main {
    height: 100vh;
    overflow-y: auto;
    background: transparent;
    padding: 0 clamp(26px, 3vw, 46px) 38px;
  }

  body.admin-console-shell .main > .topbar,
  body.admin-console-shell .main > .view,
  body.client-shell .main > .topbar,
  body.client-shell .main > .view,
  body.sales-shell .main > .topbar,
  body.sales-shell .main > .view {
    width: min(100%, 1480px);
    margin-inline: auto;
  }

  body.admin-console-shell .topbar,
  body.client-shell .topbar,
  body.sales-shell .topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: 112px;
    align-items: center;
    margin-bottom: 22px;
    border-bottom: 1px solid var(--portal-line);
    background: linear-gradient(180deg, rgba(6, 18, 37, 0.98) 78%, rgba(6, 18, 37, 0.86));
    padding: 22px 0 18px;
    backdrop-filter: blur(10px);
  }

  body.admin-console-shell .topbar h2,
  body.client-shell .topbar h2,
  body.sales-shell .topbar h2 {
    color: var(--portal-text);
    font-size: 29px;
    letter-spacing: -0.025em;
    line-height: 1.2;
    text-wrap: balance;
  }

  body.admin-console-shell .role-tag,
  body.admin-console-shell .panel-head > div > p,
  body.client-shell .role-tag,
  body.client-shell .panel-head > div > p,
  body.sales-shell .role-tag,
  body.sales-shell .panel-head > div > p {
    color: var(--portal-accent);
  }

  body.admin-console-shell .user-box span,
  body.client-shell .user-box span,
  body.sales-shell .user-box span {
    color: #d7e5f3;
  }

  body.admin-console-shell .view.active-view,
  body.client-shell .view.active-view,
  body.sales-shell .view.active-view {
    animation: portal-view-enter 220ms var(--portal-ease) both;
  }

  body.admin-console-shell .panel,
  body.admin-console-shell .overview-grid article,
  body.admin-console-shell .partner-admin-grid article,
  body.admin-console-shell .control-item,
  body.admin-console-shell .user-group,
  body.client-shell .panel,
  body.client-shell .client-identity-card,
  body.client-shell .client-metric-card,
  body.client-shell .guest-trial-card-mini,
  body.client-shell .application-card,
  body.client-shell .reward-profile article,
  body.client-shell .partner-share-card,
  body.client-shell .partner-stage-guide article,
  body.client-shell .reward-card,
  body.client-shell .tracking-order-card,
  body.sales-shell .panel,
  body.sales-shell .sales-overview article,
  body.sales-shell .tracking-order-card {
    border-color: var(--portal-line);
    border-radius: 14px;
    background: var(--portal-surface);
    box-shadow: 0 4px 8px rgba(0, 6, 18, 0.18);
    color: var(--portal-text);
  }

  body.admin-console-shell .panel,
  body.client-shell .panel,
  body.sales-shell .panel {
    padding: 24px;
  }

  body.admin-console-shell .panel-head,
  body.client-shell .panel-head,
  body.sales-shell .panel-head {
    align-items: center;
    margin-bottom: 20px;
  }

  body.admin-console-shell .panel-head h3,
  body.client-shell .panel-head h3,
  body.sales-shell .panel-head h3 {
    color: var(--portal-text);
    font-size: 21px;
    line-height: 1.35;
    text-wrap: balance;
  }

  body.admin-console-shell .overview-grid,
  body.client-shell .client-homebar,
  body.sales-shell .sales-overview {
    gap: 14px;
  }

  body.admin-console-shell .overview-grid article,
  body.client-shell .client-homebar article,
  body.sales-shell .sales-overview article {
    min-height: 112px;
    padding: 18px;
    transition:
      border-color 180ms ease,
      background-color 180ms ease,
      transform 200ms var(--portal-ease);
  }

  body.admin-console-shell .overview-grid article:hover,
  body.client-shell .client-homebar article:hover,
  body.sales-shell .sales-overview article:hover {
    border-color: rgba(var(--portal-accent-rgb), 0.4);
    background: var(--portal-surface-strong);
    transform: translateY(-2px);
  }

  body.admin-console-shell .system-grid,
  body.client-shell .system-grid,
  body.sales-shell .system-grid {
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 14px;
  }

  body.admin-console-shell .system-card,
  body.client-shell .system-card,
  body.sales-shell .system-card {
    min-height: 148px;
    align-content: start;
    border-color: var(--portal-line);
    border-radius: 14px;
    background: linear-gradient(150deg, rgba(var(--portal-accent-rgb), 0.09), rgba(8, 24, 48, 0.9));
    box-shadow: none;
    padding: 18px;
    transition:
      border-color 180ms ease,
      background-color 180ms ease,
      transform 220ms var(--portal-ease),
      box-shadow 180ms ease;
  }

  body.admin-console-shell .system-card:hover,
  body.client-shell .system-card:hover,
  body.sales-shell .system-card:hover {
    border-color: rgba(var(--portal-accent-rgb), 0.52);
    background: linear-gradient(150deg, rgba(var(--portal-accent-rgb), 0.14), rgba(10, 31, 60, 0.96));
    box-shadow: 0 4px 8px rgba(0, 6, 18, 0.2);
    transform: translateY(-3px);
  }

  body.admin-console-shell .system-card > span,
  body.client-shell .system-card > span,
  body.sales-shell .system-card > span {
    color: var(--portal-accent);
  }

  body.admin-console-shell .system-card > strong,
  body.client-shell .system-card > strong,
  body.sales-shell .system-card > strong {
    color: var(--portal-text);
    font-size: 21px;
  }

  body.admin-console-shell .system-card > p,
  body.client-shell .system-card > p,
  body.sales-shell .system-card > p,
  body.client-shell .application-card p,
  body.client-shell .reward-card p,
  body.sales-shell .tracking-order-card p {
    color: var(--portal-muted);
  }

  body.admin-console-shell .empty-state,
  body.client-shell .empty-state,
  body.sales-shell .empty-state {
    display: grid;
    min-height: 210px;
    align-content: center;
    border-color: var(--portal-line-strong);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.025);
    padding: 28px;
    transition:
      border-color 180ms ease,
      background-color 180ms ease;
  }

  body.admin-console-shell .empty-state:hover,
  body.client-shell .empty-state:hover,
  body.sales-shell .empty-state:hover {
    border-color: rgba(var(--portal-accent-rgb), 0.44);
    background: rgba(var(--portal-accent-rgb), 0.045);
  }

  body.admin-console-shell .empty-state strong,
  body.client-shell .empty-state strong,
  body.sales-shell .empty-state strong {
    color: var(--portal-text);
    font-size: 19px;
  }

  body.admin-console-shell .empty-state p,
  body.client-shell .empty-state p,
  body.sales-shell .empty-state p {
    max-width: 72ch;
    color: var(--portal-muted);
    line-height: 1.75;
  }

  body.client-shell #applicationsView > .panel,
  body.sales-shell #customersView > .panel {
    min-height: calc(100vh - 172px);
  }

  body.client-shell #applicationsView > .application-panel,
  body.sales-shell #customersView > .panel {
    display: flex;
    flex-direction: column;
  }

  body.client-shell #applicationsView .application-list,
  body.sales-shell #customersView > .panel > .empty-state {
    flex: 1;
  }

  body.client-shell #applicationsView .application-list:has(> .empty-state:only-child) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  body.client-shell #applicationsView .application-list > .empty-state:only-child {
    min-height: 320px;
  }

  body.admin-console-shell input,
  body.admin-console-shell select,
  body.client-shell input,
  body.client-shell select,
  body.sales-shell input,
  body.sales-shell select {
    border-color: var(--portal-line-strong);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.055);
    color: var(--portal-text);
    outline: none;
    transition:
      border-color 180ms ease,
      background-color 180ms ease,
      box-shadow 180ms ease;
  }

  body.admin-console-shell input::placeholder,
  body.client-shell input::placeholder,
  body.sales-shell input::placeholder {
    color: #9db2c9;
    opacity: 1;
  }

  body.admin-console-shell input:focus,
  body.admin-console-shell select:focus,
  body.client-shell input:focus,
  body.client-shell select:focus,
  body.sales-shell input:focus,
  body.sales-shell select:focus {
    border-color: rgba(var(--portal-accent-rgb), 0.72);
    background: rgba(var(--portal-accent-rgb), 0.055);
    box-shadow: 0 0 0 3px rgba(var(--portal-accent-rgb), 0.13);
  }

  body.admin-console-shell .user-box button,
  body.admin-console-shell button[type="submit"],
  body.client-shell .user-box button,
  body.client-shell button[type="submit"],
  body.sales-shell .user-box button,
  body.sales-shell button[type="submit"] {
    border-color: rgba(112, 219, 255, 0.58);
    border-radius: 10px;
    background: var(--portal-primary);
    color: #ffffff;
    box-shadow: none;
    transition:
      background-color 180ms ease,
      border-color 180ms ease,
      transform 180ms var(--portal-ease);
  }

  body.admin-console-shell .user-box button:hover,
  body.admin-console-shell button[type="submit"]:hover,
  body.client-shell .user-box button:hover,
  body.client-shell button[type="submit"]:hover,
  body.sales-shell .user-box button:hover,
  body.sales-shell button[type="submit"]:hover {
    border-color: #8ce9ff;
    background: #0f69e8;
    transform: translateY(-1px);
  }

  body.admin-console-shell button:active,
  body.admin-console-shell .ghost-link:active,
  body.client-shell button:active,
  body.client-shell .ghost-link:active,
  body.sales-shell button:active,
  body.sales-shell .ghost-link:active {
    transform: scale(0.985);
  }

  body.admin-console-shell button:focus-visible,
  body.admin-console-shell a:focus-visible,
  body.client-shell button:focus-visible,
  body.client-shell a:focus-visible,
  body.sales-shell button:focus-visible,
  body.sales-shell a:focus-visible {
    outline: 3px solid rgba(var(--portal-accent-rgb), 0.34);
    outline-offset: 2px;
  }

  body.admin-console-shell .table,
  body.client-shell .table,
  body.sales-shell .table {
    border-radius: 10px;
    background: transparent;
  }

  body.admin-console-shell .table > table,
  body.client-shell .table > table,
  body.sales-shell .table > table {
    border-collapse: separate;
    border-spacing: 0;
  }

  body.admin-console-shell .table > table th,
  body.client-shell .table > table th,
  body.sales-shell .table > table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #0c203d;
    color: #c0d2e5;
  }

  body.admin-console-shell .table > table tbody tr,
  body.client-shell .table > table tbody tr,
  body.sales-shell .table > table tbody tr {
    transition: background-color 160ms ease;
  }

  body.admin-console-shell .table > table tbody tr:hover,
  body.client-shell .table > table tbody tr:hover,
  body.sales-shell .table > table tbody tr:hover {
    background: rgba(var(--portal-accent-rgb), 0.055);
  }

  body.admin-console-shell .modal:not([hidden]) .modal-panel,
  body.client-shell .order-tracking-modal:not([hidden]) .order-tracking-panel,
  body.client-shell .invite-poster-modal:not([hidden]) .invite-poster-panel,
  body.sales-shell .order-tracking-modal:not([hidden]) .order-tracking-panel {
    animation: portal-dialog-enter 220ms var(--portal-ease) both;
  }

  body.admin-console-shell .toast:not(:empty),
  body.client-shell .toast:not(:empty),
  body.sales-shell .toast:not(:empty) {
    z-index: 80;
    border-color: rgba(var(--portal-accent-rgb), 0.4);
    background: #0d284d;
    box-shadow: 0 4px 8px rgba(0, 6, 18, 0.22);
    animation: portal-toast-enter 180ms var(--portal-ease) both;
  }

  body.client-shell .company-hero,
  body.client-shell .company-capabilities,
  body.client-shell .company-materials,
  body.client-shell .company-product-showcase {
    border-color: var(--portal-line);
  }

  body.client-shell .company-hero {
    box-shadow: 0 4px 8px rgba(0, 6, 18, 0.18);
  }

  body.client-shell .company-primary-action {
    transition:
      background-color 180ms ease,
      transform 200ms var(--portal-ease);
  }

  body.client-shell .company-primary-action:hover {
    transform: translateY(-2px);
  }

  body.client-shell .application-card,
  body.client-shell .reward-card,
  body.client-shell .partner-stage-guide article,
  body.sales-shell .tracking-order-card {
    transition:
      border-color 180ms ease,
      background-color 180ms ease,
      transform 200ms var(--portal-ease);
  }

  body.client-shell .application-card:hover,
  body.client-shell .reward-card:hover,
  body.client-shell .partner-stage-guide article:hover,
  body.sales-shell .tracking-order-card:hover {
    border-color: rgba(var(--portal-accent-rgb), 0.42);
    background: var(--portal-surface-strong);
    transform: translateY(-2px);
  }

  body.client-shell.is-guest .guest-trial-card-mini {
    border-color: rgba(255, 209, 102, 0.38);
    background: rgba(82, 58, 14, 0.46);
  }

  body.client-shell.is-guest .system-card {
    border-color: rgba(255, 209, 102, 0.24);
    background: linear-gradient(150deg, rgba(255, 209, 102, 0.09), rgba(31, 25, 13, 0.84));
  }
}

/* account-settings-responsive: one information architecture for client, sales and admin */
.account-settings-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  width: 100%;
  min-width: 0;
}

.account-settings-card {
  min-width: 0;
}

.account-settings-card > .form-card,
.account-settings-card > .form-grid,
.account-settings-card > .account-settings-form {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.account-settings-card .panel-head span {
  display: block;
  max-width: 64ch;
  margin-top: 4px;
  line-height: 1.65;
}

.account-summary {
  display: grid;
  margin: 0;
}

.account-summary > div {
  display: grid;
  grid-template-columns: minmax(96px, 0.34fr) minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  min-height: 48px;
  padding: 12px 0;
  border-bottom: 1px solid color-mix(in srgb, currentColor 16%, transparent);
}

.account-summary > div:first-child {
  border-top: 1px solid color-mix(in srgb, currentColor 16%, transparent);
}

.account-summary dt {
  font-weight: 700;
  opacity: 0.72;
}

.account-summary dd {
  min-width: 0;
  margin: 0;
  font-weight: 800;
  overflow-wrap: anywhere;
}

[data-password-section][hidden] {
  display: none !important;
}

@media (min-width: 981px) {
  .account-settings-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;
  }
}

@media (max-width: 760px) {
  .account-settings-layout {
    gap: 12px;
  }

  body.admin-console-shell .account-settings-card,
  body.client-shell .account-settings-card,
  body.sales-shell .account-settings-card {
    width: 100% !important;
    min-width: 0 !important;
    padding: 16px !important;
    border-radius: 14px !important;
    box-sizing: border-box !important;
  }

  .account-settings-card .panel-head {
    margin-bottom: 16px !important;
  }

  .account-settings-card .panel-head h3 {
    font-size: 20px !important;
  }

  .account-settings-card .panel-head span {
    font-size: 14px !important;
    line-height: 1.55 !important;
  }

  body.admin-console-shell .account-settings-card .form-card label span,
  body.client-shell .account-settings-card .form-card label span,
  body.sales-shell .account-settings-card .form-card label span {
    color: #0b5f59 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
  }

  .account-summary > div {
    grid-template-columns: 88px minmax(0, 1fr);
    gap: 10px;
    min-height: 44px;
    padding: 10px 0;
    font-size: 14px;
  }

  .account-settings-card form {
    gap: 14px !important;
  }

  .account-settings-card input,
  .account-settings-card button[type="submit"] {
    min-height: 46px !important;
  }

  .account-settings-card button[type="submit"] {
    width: 100% !important;
  }

  body.client-shell > nav.mobile-bottom-nav {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (min-width: 981px) {
  body.login-shell .visual-stage {
    max-height: calc(100svh - 24px);
    border: 1px solid rgba(128, 221, 255, 0.18);
    border-radius: 16px;
    box-shadow: 0 8px 28px rgba(0, 4, 18, 0.34);
  }

  body.login-shell .hot-input input,
  body.login-shell .hot-button,
  body.login-shell .login-actions button {
    transition:
      color 180ms ease,
      border-color 180ms ease,
      background-color 180ms ease,
      box-shadow 180ms ease,
      transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  body.login-shell .hot-input input:focus {
    box-shadow: 0 0 0 3px rgba(104, 220, 255, 0.15);
  }

  body.login-shell .modal:not([hidden]) .modal-panel {
    animation: portal-dialog-enter 220ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  body.login-shell .modal-panel {
    border-radius: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.admin-console-shell *,
  body.admin-console-shell *::before,
  body.admin-console-shell *::after,
  body.client-shell *,
  body.client-shell *::before,
  body.client-shell *::after,
  body.sales-shell *,
  body.sales-shell *::before,
  body.sales-shell *::after,
  body.login-shell .modal-panel,
  body.login-shell .hot-input input,
  body.login-shell .hot-button,
  body.login-shell .login-actions button {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}