/* Cache-bypass /mail UI hotfix. This file loads after app.css. */
body.mail-shell {
  margin: 0;
  min-height: 100vh;
  color: #f8fafc !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(96,165,250,.28), transparent 34rem),
    radial-gradient(circle at 90% 10%, rgba(139,92,246,.22), transparent 34rem),
    linear-gradient(145deg, #07111f 0%, #0d1730 55%, #070b16 100%) !important;
}
body.mail-shell * { box-sizing: border-box; }
body.mail-shell [hidden] { display: none !important; }
body.mail-shell button, body.mail-shell input { font: inherit; }
body.mail-shell button { cursor: pointer; }
body.mail-shell .topbar,
body.mail-shell .mail-page,
body.mail-shell .auth-wrap { width: min(1160px, calc(100% - 32px)); margin-left: auto; margin-right: auto; }
body.mail-shell .topbar {
  margin-top: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 24px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.07)) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.35) !important;
}
body.mail-shell .app-logo { display: flex !important; align-items: center !important; gap: 10px !important; color: white !important; text-decoration: none !important; font-weight: 900 !important; }
body.mail-shell .app-logo span, body.mail-shell .logo-mark { display: grid !important; place-items: center !important; width: 42px !important; height: 42px !important; border-radius: 16px !important; background: linear-gradient(135deg, #60a5fa, #8b5cf6) !important; color: white !important; }
body.mail-shell .mail-page { margin-top: 24px !important; margin-bottom: 56px !important; display: grid !important; gap: 18px !important; }
body.mail-shell .panel-card, body.mail-shell .login-card {
  border: 1px solid rgba(255,255,255,.16) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.07)) !important;
  backdrop-filter: blur(22px) !important;
  -webkit-backdrop-filter: blur(22px) !important;
  border-radius: 30px !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.35) !important;
}
body.mail-shell .compose-panel { padding: 22px !important; display: grid !important; grid-template-columns: 1.05fr .95fr .95fr !important; gap: 18px !important; align-items: stretch !important; }
body.mail-shell .eyebrow { margin: 0 0 9px !important; color: #93c5fd !important; font-size: .74rem !important; font-weight: 950 !important; letter-spacing: .18em !important; text-transform: uppercase !important; }
body.mail-shell .compose-copy h1 { margin: 0 !important; color: white !important; font-size: clamp(2rem, 4.6vw, 4rem) !important; line-height: .97 !important; letter-spacing: -.07em !important; }
body.mail-shell .compose-copy p:last-child, body.mail-shell .hint { color: #aebbd0 !important; line-height: 1.55 !important; }
body.mail-shell .address-box, body.mail-shell .custom-box { min-width: 0 !important; padding: 18px !important; border: 1px solid rgba(255,255,255,.16) !important; border-radius: 24px !important; background: rgba(255,255,255,.08) !important; display: flex !important; flex-direction: column !important; justify-content: center !important; gap: 10px !important; }
body.mail-shell .mini-label { color: #aebbd0 !important; font-size: .78rem !important; font-weight: 900 !important; text-transform: uppercase !important; letter-spacing: .09em !important; }
body.mail-shell .address-line, body.mail-shell .custom-line { display: flex !important; align-items: center !important; gap: 10px !important; min-width: 0 !important; }
body.mail-shell input { min-width: 0 !important; border: 1px solid rgba(255,255,255,.14) !important; background: rgba(2,8,23,.48) !important; color: white !important; border-radius: 16px !important; padding: 13px 14px !important; outline: none !important; }
body.mail-shell input:focus { border-color: rgba(147,197,253,.72) !important; box-shadow: 0 0 0 4px rgba(96,165,250,.16) !important; }
body.mail-shell #aliasInput, body.mail-shell #customLocalInput { width: 100% !important; }
body.mail-shell #aliasInput { font-weight: 900 !important; }
body.mail-shell .domain-chip { flex: none !important; padding: 13px 14px !important; border-radius: 16px !important; background: rgba(96,165,250,.18) !important; color: #dbeafe !important; font-weight: 900 !important; border: 1px solid rgba(147,197,253,.20) !important; }
body.mail-shell .status-line { display: flex !important; justify-content: space-between !important; gap: 10px !important; color: #aebbd0 !important; font-size: .9rem !important; }
body.mail-shell #syncState { color: #34d399 !important; font-weight: 900 !important; }
body.mail-shell #syncState.active { color: #93c5fd !important; }
body.mail-shell #syncState.error { color: #fb7185 !important; }
body.mail-shell .secondary-btn,
body.mail-shell .ghost-btn,
body.mail-shell .toolbar-btn,
body.mail-shell .primary-btn { border: 0 !important; border-radius: 15px !important; padding: 12px 16px !important; font-weight: 900 !important; color: white !important; transition: transform .16s ease, opacity .16s ease, background .16s ease !important; }
body.mail-shell .secondary-btn, body.mail-shell .toolbar-btn, body.mail-shell .ghost-btn { background: rgba(255,255,255,.12) !important; border: 1px solid rgba(255,255,255,.13) !important; }
body.mail-shell .primary-btn, body.mail-shell .toolbar-btn.accent { background: linear-gradient(135deg, #60a5fa, #8b5cf6) !important; box-shadow: 0 14px 32px rgba(96,165,250,.22) !important; }
body.mail-shell .toolbar-btn.danger { color: #fecdd3 !important; background: rgba(244,63,94,.15) !important; }
body.mail-shell button:hover, body.mail-shell .toolbar-btn:hover { transform: translateY(-1px) !important; }
body.mail-shell button:disabled { opacity: .45 !important; cursor: not-allowed !important; transform: none !important; }
body.mail-shell .inbox-panel, body.mail-shell .detail-panel { padding: 20px !important; }
body.mail-shell .inbox-top, body.mail-shell .detail-actions { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 14px !important; flex-wrap: wrap !important; margin-bottom: 16px !important; }
body.mail-shell .inbox-top h2 { margin: 0 !important; color: white !important; font-size: clamp(1.7rem, 3vw, 2.35rem) !important; letter-spacing: -.05em !important; }
body.mail-shell .count-pill { display: inline-flex !important; align-items: center !important; padding: 8px 13px !important; border-radius: 999px !important; color: #dbeafe !important; background: rgba(96,165,250,.15) !important; border: 1px solid rgba(147,197,253,.18) !important; font-weight: 900 !important; }
body.mail-shell .toolbar { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; margin-bottom: 14px !important; }
body.mail-shell .message-table { overflow: hidden !important; border: 1px solid rgba(255,255,255,.16) !important; border-radius: 24px !important; background: rgba(2,8,23,.32) !important; }
body.mail-shell .message-table-head,
body.mail-shell .message-row { display: grid !important; grid-template-columns: minmax(220px,.95fr) minmax(220px,1.15fr) 150px !important; gap: 16px !important; align-items: center !important; }
body.mail-shell .message-table-head { padding: 14px 16px !important; color: #bfdbfe !important; font-size: .78rem !important; font-weight: 950 !important; text-transform: uppercase !important; letter-spacing: .12em !important; border-bottom: 1px solid rgba(255,255,255,.16) !important; background: rgba(255,255,255,.08) !important; }
body.mail-shell .message-table-body { display: grid !important; }
body.mail-shell .message-row { width: 100% !important; padding: 16px !important; border: 0 !important; border-bottom: 1px solid rgba(255,255,255,.10) !important; text-align: left !important; color: white !important; background: rgba(255,255,255,.055) !important; }
body.mail-shell .message-row:hover, body.mail-shell .message-row.selected { background: rgba(96,165,250,.14) !important; }
body.mail-shell .message-row:last-child { border-bottom: 0 !important; }
body.mail-shell .sender-cell, body.mail-shell .subject-cell, body.mail-shell .message-row time { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
body.mail-shell .sender-cell { font-weight: 900 !important; color: white !important; }
body.mail-shell .subject-cell { color: #dbeafe !important; }
body.mail-shell .message-row time { color: #aebbd0 !important; text-align: right !important; }
body.mail-shell .empty-state { padding: 44px 18px !important; text-align: center !important; color: #aebbd0 !important; }
body.mail-shell .empty-state h3 { margin: 0 0 7px !important; color: white !important; font-size: 1.3rem !important; }
body.mail-shell .empty-state p { margin: 0 !important; }
body.mail-shell .detail-panel { display: grid !important; gap: 16px !important; }
body.mail-shell .detail-meta { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 12px !important; }
body.mail-shell .detail-meta div { min-width: 0 !important; padding: 15px !important; border: 1px solid rgba(255,255,255,.16) !important; border-radius: 20px !important; background: rgba(255,255,255,.08) !important; }
body.mail-shell .detail-meta span { display: block !important; color: #aebbd0 !important; font-size: .78rem !important; font-weight: 950 !important; text-transform: uppercase !important; letter-spacing: .09em !important; margin-bottom: 6px !important; }
body.mail-shell .detail-meta strong { display: block !important; color: white !important; overflow-wrap: anywhere !important; }
body.mail-shell .message-render { min-height: 240px !important; padding: 20px !important; border: 1px solid rgba(255,255,255,.16) !important; border-radius: 24px !important; background: white !important; color: #0f172a !important; line-height: 1.65 !important; overflow-x: auto !important; }
body.mail-shell .message-render img { max-width: 100% !important; height: auto !important; border-radius: 12px !important; }
body.mail-shell .plain-email { white-space: pre-wrap !important; }
body.mail-shell .html-email a { color: #2563eb !important; text-decoration: underline !important; }
body.mail-shell .auth-wrap { min-height: calc(100vh - 120px) !important; display: grid !important; place-items: center !important; margin-top: 22px !important; }
body.mail-shell .login-card { width: min(960px, 100%) !important; display: grid !important; grid-template-columns: 1.05fr .95fr !important; gap: 18px !important; padding: 18px !important; }
body.mail-shell .login-copy { min-height: 460px !important; border-radius: 24px !important; padding: 28px !important; display: flex !important; flex-direction: column !important; justify-content: flex-end !important; color: white !important; background: linear-gradient(135deg, rgba(96,165,250,.95), rgba(139,92,246,.92)) !important; }
body.mail-shell .login-copy h1 { margin: 14px 0 10px !important; font-size: clamp(2.2rem,5vw,3.8rem) !important; line-height: .95 !important; letter-spacing: -.07em !important; }
body.mail-shell .login-copy p { color: rgba(255,255,255,.84) !important; }
body.mail-shell .feature-row { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; margin-top: 16px !important; }
body.mail-shell .feature-row span { padding: 8px 10px !important; border-radius: 999px !important; background: rgba(255,255,255,.16) !important; font-weight: 800 !important; }
body.mail-shell .login-form { padding: 28px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; gap: 15px !important; }
body.mail-shell .login-form h2 { margin: 0 !important; font-size: 2rem !important; color: white !important; letter-spacing: -.05em !important; }
body.mail-shell .login-form label { display: grid !important; gap: 7px !important; color: #aebbd0 !important; font-weight: 900 !important; }
body.mail-shell .alert { padding: 12px 14px !important; border-radius: 16px !important; font-weight: 850 !important; }
body.mail-shell .alert-error { color: #fecdd3 !important; background: rgba(244,63,94,.14) !important; }
body.mail-shell .full { width: 100% !important; }
@media (max-width: 960px) { body.mail-shell .compose-panel, body.mail-shell .login-card { grid-template-columns: 1fr !important; } body.mail-shell .detail-meta { grid-template-columns: 1fr !important; } body.mail-shell .login-copy { min-height: 320px !important; } }
@media (max-width: 680px) { body.mail-shell .topbar, body.mail-shell .mail-page, body.mail-shell .auth-wrap { width: min(100% - 18px, 1160px) !important; } 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-line, body.mail-shell .custom-line { flex-direction: column !important; align-items: stretch !important; } body.mail-shell .toolbar { display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; } body.mail-shell .message-table-head { display: none !important; } body.mail-shell .message-row { grid-template-columns: 1fr !important; gap: 5px !important; } body.mail-shell .message-row time { text-align: left !important; } body.mail-shell .subject-cell { white-space: normal !important; } body.mail-shell .detail-actions { align-items: stretch !important; flex-direction: column !important; } body.mail-shell .login-copy, body.mail-shell .login-form { padding: 20px !important; } }
