/* Mobile + refresh button polish. Loaded last. */
body.mail-shell,
body.mail-shell * {
  box-sizing: border-box !important;
}

body.mail-shell input,
body.mail-shell select,
body.mail-shell button,
body.mail-shell a.toolbar-btn {
  max-width: 100% !important;
}

body.mail-shell .address-card-pro,
body.mail-shell .mailbox-manage-card,
body.mail-shell .mailbox-history-card,
body.mail-shell .message-table,
body.mail-shell .mail-modal,
body.mail-shell .choice-card {
  min-width: 0 !important;
}

body.mail-shell .address-line.pro-address-line {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
}

body.mail-shell #aliasInput {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.mail-shell .copy-main {
  min-width: 86px !important;
  white-space: nowrap !important;
}

body.mail-shell .mailbox-manage-card,
body.mail-shell .mailbox-history-card {
  border-radius: 22px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(2,8,23,.24) !important;
}

body.mail-shell .history-controls {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 8px !important;
}

body.mail-shell .history-controls select {
  min-width: 0 !important;
  width: 100% !important;
  height: 44px !important;
}

body.mail-shell .history-controls button {
  min-width: 74px !important;
  height: 44px !important;
  padding: 0 14px !important;
  white-space: nowrap !important;
}

body.mail-shell .toolbar.toolbar-single {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 0 24px 18px !important;
  margin: 0 !important;
  gap: 0 !important;
}

body.mail-shell .refresh-only-btn {
  width: auto !important;
  min-width: 164px !important;
  max-width: 210px !important;
  height: 46px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto !important;
  padding: 0 22px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  text-align: center !important;
  line-height: 1 !important;
  box-shadow: 0 16px 34px rgba(96,165,250,.22) !important;
}

body.mail-shell .inbox-loader {
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  display: grid !important;
  place-items: center !important;
  padding: 18px !important;
  background: rgba(2,8,23,.50) !important;
  backdrop-filter: blur(10px) !important;
}

body.mail-shell .inbox-loader[hidden] {
  display: none !important;
}

body.mail-shell .loader-card {
  width: min(320px, 100%) !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(147,197,253,.22) !important;
  background: rgba(15,23,42,.92) !important;
  box-shadow: 0 20px 55px rgba(0,0,0,.35) !important;
}

body.mail-shell .loader-card strong,
body.mail-shell .loader-card small {
  display: block !important;
  color: #fff !important;
}

body.mail-shell .loader-card small {
  color: #aebbd0 !important;
  margin-top: 2px !important;
}

body.mail-shell .spinner {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  border-radius: 999px !important;
  border: 3px solid rgba(147,197,253,.22) !important;
  border-top-color: #93c5fd !important;
  animation: temprelaySpin .75s linear infinite !important;
}

@keyframes temprelaySpin {
  to { transform: rotate(360deg); }
}

body.mail-shell .message-table {
  position: relative !important;
}

body.mail-shell .message-row {
  cursor: pointer !important;
}

@media (max-width: 760px) {
  body.mail-shell .topbar,
  body.mail-shell .mail-page,
  body.mail-shell .auth-wrap {
    width: min(100% - 24px, 1180px) !important;
  }

  body.mail-shell .topbar {
    min-height: 64px !important;
    border-radius: 22px !important;
    margin-top: 12px !important;
    padding: 10px 12px !important;
  }

  body.mail-shell .app-logo span {
    width: 38px !important;
    height: 38px !important;
    border-radius: 14px !important;
  }

  body.mail-shell .mail-page {
    margin-top: 16px !important;
    gap: 16px !important;
  }

  body.mail-shell .panel-card,
  body.mail-shell .compose-panel,
  body.mail-shell .inbox-panel,
  body.mail-shell .detail-panel,
  body.mail-shell .login-card {
    border-radius: 22px !important;
    padding: 14px !important;
  }

  body.mail-shell .address-hero {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  body.mail-shell .compose-copy {
    min-height: auto !important;
    padding: 6px 2px 2px !important;
  }

  body.mail-shell .compose-copy h1 {
    font-size: clamp(2rem, 12vw, 3.1rem) !important;
    line-height: .98 !important;
  }

  body.mail-shell .compose-copy p {
    margin-top: 12px !important;
    font-size: .98rem !important;
  }

  body.mail-shell .hero-badges {
    margin-top: 16px !important;
  }

  body.mail-shell .hero-badges span {
    padding: 8px 10px !important;
    font-size: .82rem !important;
  }

  body.mail-shell .address-card-pro {
    min-height: auto !important;
    padding: 16px !important;
    border-radius: 22px !important;
    gap: 12px !important;
  }

  body.mail-shell .address-card-head,
  body.mail-shell .status-line {
    gap: 8px !important;
    flex-wrap: wrap !important;
  }

  body.mail-shell .address-line.pro-address-line {
    grid-template-columns: 1fr !important;
  }

  body.mail-shell .copy-main {
    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;
  }

  body.mail-shell .mailbox-manage-card,
  body.mail-shell .mailbox-history-card {
    padding: 12px !important;
    border-radius: 18px !important;
  }

  body.mail-shell .new-mailbox-hero,
  body.mail-shell .delete-mailbox-btn {
    min-height: 44px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: normal !important;
  }

  body.mail-shell .history-controls {
    grid-template-columns: 1fr 1fr !important;
  }

  body.mail-shell .history-controls select {
    grid-column: 1 / -1 !important;
  }

  body.mail-shell .history-controls button {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.mail-shell .inbox-top {
    padding: 16px 16px 12px !important;
    align-items: flex-start !important;
  }

  body.mail-shell .inbox-top h2 {
    font-size: 1.7rem !important;
  }

  body.mail-shell .count-pill {
    padding: 7px 11px !important;
    font-size: .82rem !important;
  }

  body.mail-shell .toolbar.toolbar-single {
    display: flex !important;
    grid-template-columns: none !important;
    justify-content: center !important;
    padding: 2px 16px 16px !important;
    margin: 0 !important;
  }

  body.mail-shell .refresh-only-btn {
    width: auto !important;
    min-width: 156px !important;
    max-width: 190px !important;
    height: 44px !important;
    padding: 0 18px !important;
    margin-inline: auto !important;
    font-size: .92rem !important;
  }

  body.mail-shell .message-table {
    border-radius: 18px !important;
  }

  body.mail-shell .message-row {
    padding: 14px !important;
    border-radius: 0 !important;
  }

  body.mail-shell .sender-cell::before,
  body.mail-shell .subject-cell::before,
  body.mail-shell .message-row time::before {
    display: block !important;
    margin-bottom: 3px !important;
    color: #93c5fd !important;
    font-size: .68rem !important;
    font-weight: 950 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
  }

  body.mail-shell .sender-cell::before { content: "Sender"; }
  body.mail-shell .subject-cell::before { content: "Subject"; }
  body.mail-shell .message-row time::before { content: "Time"; }

  body.mail-shell .mail-modal-backdrop {
    padding: 12px !important;
  }

  body.mail-shell .mail-modal {
    width: 100% !important;
    max-height: calc(100dvh - 24px) !important;
    overflow-y: auto !important;
    border-radius: 24px !important;
    padding: 16px !important;
  }

  body.mail-shell .modal-head {
    align-items: flex-start !important;
    gap: 12px !important;
  }

  body.mail-shell .choice-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  body.mail-shell .modal-custom-line {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  body.mail-shell .domain-chip {
    width: 100% !important;
    text-align: center !important;
  }
}

@media (max-width: 420px) {
  body.mail-shell .topbar,
  body.mail-shell .mail-page,
  body.mail-shell .auth-wrap {
    width: min(100% - 16px, 1180px) !important;
  }

  body.mail-shell .panel-card,
  body.mail-shell .compose-panel,
  body.mail-shell .inbox-panel,
  body.mail-shell .detail-panel,
  body.mail-shell .login-card {
    padding: 12px !important;
  }

  body.mail-shell .address-card-pro {
    padding: 14px !important;
  }

  body.mail-shell .compose-copy h1 {
    font-size: 2rem !important;
  }

  body.mail-shell .refresh-only-btn {
    min-width: 150px !important;
    max-width: 180px !important;
  }
}