/* app.css — v1.1 (13.10.2026)
   v1.1: почта на ПК — список писем прокручивается внутри окна, нижние письма снова доступны */
/* Three theme token sets. One DOM, one stylesheet: only the custom
   properties below change between aurora, signal and atlas, so no
   template and no route ever branches on the active theme.

   aurora  light, blue and cyan      (default)
   signal  dark, navy neon and green
   atlas   light, blue and green

   The retired auto / light / dark values are mapped onto these in
   theme.py, so an old cookie still renders a real theme. */

:root,
html[data-theme="aurora"] {
  color-scheme: light;
  --bg: #eef4fc;
  --surface: #ffffff;
  --surface-2: #f5f9ff;
  --border: #dbe7f6;
  --text: #0b1b33;
  --muted: #5b7191;
  --accent: #0b7fd4;
  --accent-2: #21c7e8;
  --accent-soft: #e0f1fe;
  --ok: #10794a;
  --ok-soft: #d8f5e6;
  --warn: #a35a06;
  --warn-soft: #fdf0d5;
  --err: #b3211f;
  --err-soft: #fde5e3;
  --info: #5b45cf;
  --info-soft: #e9e6fd;
  --shadow: 0 1px 2px rgba(11, 27, 51, .06), 0 10px 28px rgba(11, 27, 51, .07);
  --radius: 14px;
  --tap: 44px;
}
html[data-theme="signal"] {
  color-scheme: dark;
  --bg: #060a17;
  --surface: #101831;
  --surface-2: #17213f;
  --border: #25335c;
  --text: #e6edff;
  --muted: #93a3c9;
  --accent: #4da6ff;
  --accent-2: #a78bfa;
  --accent-soft: #10294f;
  --ok: #3ddc97;
  --ok-soft: #0b2f22;
  --warn: #fbbf24;
  --warn-soft: #332608;
  --err: #ff6b6b;
  --err-soft: #3b1418;
  --info: #c4b5fd;
  --info-soft: #241a45;
  --shadow: 0 1px 2px rgba(0, 0, 0, .45), 0 12px 32px rgba(0, 0, 0, .4);
  --radius: 14px;
  --tap: 44px;
}
html[data-theme="atlas"] {
  color-scheme: light;
  --bg: #eef6f2;
  --surface: #ffffff;
  --surface-2: #f4faf7;
  --border: #d6e7de;
  --text: #0c2620;
  --muted: #55735f;
  --accent: #0e7c86;
  --accent-2: #2fae72;
  --accent-soft: #dcf2f2;
  --ok: #15733f;
  --ok-soft: #d9f2e2;
  --warn: #96580a;
  --warn-soft: #fbf0d8;
  --err: #a8261f;
  --err-soft: #fbe4e1;
  --info: #2c6d8e;
  --info-soft: #dceaf3;
  --shadow: 0 1px 2px rgba(12, 38, 32, .06), 0 10px 28px rgba(12, 38, 32, .07);
  --radius: 14px;
  --tap: 44px;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--text);
  font: 15px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  -webkit-text-size-adjust: 100%;
}
a { color: var(--accent); text-decoration: none; }
h1, h2, h3 { margin: 0; font-weight: 650; letter-spacing: -.01em; }
h1 { font-size: 1.3rem; }
h2 { font-size: 1.02rem; }
.skip {
  position: absolute; left: -999px; top: 0; z-index: 99;
  background: var(--accent); color: #fff; padding: 12px 16px; border-radius: 0 0 8px 0;
}
.skip:focus { left: 0; }
.shell { display: flex; min-height: 100vh; min-height: 100dvh; }
.sidebar {
  width: 250px; flex: 0 0 250px; background: var(--surface);
  border-right: 1px solid var(--border); position: sticky; top: 0;
  height: 100vh; height: 100dvh; display: flex; flex-direction: column;
  padding: 18px 12px; gap: 6px;
}
.brand { display: flex; align-items: center; gap: 10px; padding: 4px 10px 14px; }
.brand-mark {
  width: 38px; height: 38px; border-radius: 11px; flex: 0 0 38px;
  background: linear-gradient(135deg, var(--accent), #6366f1);
  color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 15px;
}
.brand-text strong { display: block; font-size: 15px; letter-spacing: -.01em; }
.brand-text span { color: var(--muted); font-size: 12px; }
.nav { display: flex; flex-direction: column; gap: 2px; overflow-y: auto; }
.nav a {
  display: flex; align-items: center; gap: 11px; min-height: var(--tap);
  padding: 0 12px; border-radius: 11px; color: var(--text); font-weight: 500;
}
.nav a:hover { background: var(--surface-2); }
.nav a.active { background: var(--accent-soft); color: var(--accent); font-weight: 620; }
.nav .ico { width: 20px; text-align: center; font-size: 15px; opacity: .9; }
.side-foot { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--border); }
.main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.topbar {
  position: sticky; top: 0; z-index: 20; background: var(--surface);
  border-bottom: 1px solid var(--border); display: flex; align-items: center;
  gap: 12px; padding: 10px 16px; min-height: 58px;
}
.topbar h1 { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topbar .mobile-brand { display: none; align-items: center; gap: 9px; }
.container { padding: 16px; max-width: 1180px; width: 100%; margin: 0 auto; }
.bottomnav { display: none; }
.grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.grid.wide { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }
.span-all { grid-column: 1 / -1; }
.card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px;
}
.card + .card, .grid + .card, .card + .grid, .grid + .grid { margin-top: 14px; }
.card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.card-head h2 { flex: 1 1 auto; }
.muted { color: var(--muted); }
.small { font-size: 12.5px; }
.stat-value { font-size: 1.9rem; font-weight: 680; letter-spacing: -.02em; line-height: 1.15; }
.stat-label { color: var(--muted); font-size: 12.5px; text-transform: uppercase; letter-spacing: .05em; }
.stat-sub { color: var(--muted); font-size: 13px; margin-top: 2px; }
.bar { height: 8px; border-radius: 99px; background: var(--surface-2); border: 1px solid var(--border); overflow: hidden; margin-top: 10px; }
.bar i { display: block; height: 100%; background: var(--accent); border-radius: 99px; }
.bar.is-warn i { background: var(--warn); }
.bar.is-err i { background: var(--err); }
.w-0 { width: 0; } .w-5 { width: 5%; } .w-10 { width: 10%; } .w-15 { width: 15%; }
.w-20 { width: 20%; } .w-25 { width: 25%; } .w-30 { width: 30%; } .w-35 { width: 35%; }
.w-40 { width: 40%; } .w-45 { width: 45%; } .w-50 { width: 50%; } .w-55 { width: 55%; }
.w-60 { width: 60%; } .w-65 { width: 65%; } .w-70 { width: 70%; } .w-75 { width: 75%; }
.w-80 { width: 80%; } .w-85 { width: 85%; } .w-90 { width: 90%; } .w-95 { width: 95%; }
.w-100 { width: 100%; }
.badge {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px;
  border-radius: 99px; font-size: 12.5px; font-weight: 600; white-space: nowrap;
  background: var(--surface-2); color: var(--muted); border: 1px solid var(--border);
}
.badge.ok { background: var(--ok-soft); color: var(--ok); border-color: transparent; }
.badge.warn { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
.badge.err { background: var(--err-soft); color: var(--err); border-color: transparent; }
.badge.info { background: var(--info-soft); color: var(--info); border-color: transparent; }
.badge.accent { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.dot { width: 8px; height: 8px; border-radius: 99px; background: currentColor; flex: 0 0 8px; }
.notice {
  display: flex; gap: 11px; align-items: flex-start; padding: 13px 15px;
  border-radius: var(--radius); border: 1px solid var(--border);
  background: var(--surface); margin-bottom: 14px; line-height: 1.45;
}
.notice.warn { background: var(--warn-soft); color: var(--warn); border-color: transparent; }
.notice.ok { background: var(--ok-soft); color: var(--ok); border-color: transparent; }
.notice.err { background: var(--err-soft); color: var(--err); border-color: transparent; }
.notice.info { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.notice b { font-weight: 660; }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 -4px; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { padding: 10px 10px; text-align: left; border-bottom: 1px solid var(--border); vertical-align: middle; }
th { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 650; white-space: nowrap; }
tr:last-child td { border-bottom: 0; }
td.nowrap, th.nowrap { white-space: nowrap; }
td.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; }
.list { list-style: none; margin: 0; padding: 0; }
.list li { display: flex; align-items: center; gap: 10px; padding: 11px 2px; border-bottom: 1px solid var(--border); min-height: var(--tap); }
.list li:last-child { border-bottom: 0; }
.list .grow { flex: 1 1 auto; min-width: 0; }
.list .grow b { display: block; font-weight: 600; }
form { margin: 0; }
.field { display: block; margin-bottom: 12px; }
.field > span { display: block; font-size: 13px; color: var(--muted); margin-bottom: 5px; font-weight: 550; }
input, select, textarea {
  width: 100%; min-height: var(--tap); padding: 10px 12px; font: inherit;
  color: var(--text); background: var(--surface-2);
  border: 1px solid var(--border); border-radius: 11px; outline: none;
}
textarea { min-height: 110px; resize: vertical; line-height: 1.5; }
input:focus, select:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.row { display: flex; gap: 10px; flex-wrap: wrap; }
.row > * { flex: 1 1 200px; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  min-height: var(--tap); min-width: var(--tap); padding: 0 16px; font: inherit;
  font-weight: 600; border-radius: 11px; border: 1px solid var(--border);
  background: var(--surface-2); color: var(--text); cursor: pointer;
}
.btn:hover { border-color: var(--accent); color: var(--accent); }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn.primary:hover { filter: brightness(1.08); color: #fff; }
.btn.danger { color: var(--err); }
.btn.danger:hover { border-color: var(--err); }
.btn.full { width: 100%; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; }
.chip {
  display: inline-flex; align-items: center; min-height: 38px; padding: 0 13px;
  border-radius: 99px; border: 1px solid var(--border); background: var(--surface-2);
  color: var(--muted); font-size: 13px; font-weight: 600;
}
.chip.active { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.pref-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pref-form select { min-width: 0; flex: 1 1 110px; }
.check-row { display: flex; align-items: flex-start; gap: 12px; padding: 12px 2px; border-bottom: 1px solid var(--border); }
.check-row:last-child { border-bottom: 0; }
.check-row .grow { flex: 1 1 auto; min-width: 0; }
.check-row .grow b { display: block; }
.check-row .val { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; color: var(--muted); word-break: break-all; }
.check-row .hint { font-size: 12.5px; color: var(--muted); margin-top: 3px; }
details.sheet { display: none; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
footer.page-foot { padding: 18px 16px 28px; color: var(--muted); font-size: 12.5px; text-align: center; }
@media (max-width: 900px) {
  .sidebar { display: none; }
  .topbar .mobile-brand { display: flex; }
  .topbar h1 { font-size: 1.08rem; }
  .container { padding: 14px 12px calc(84px + env(safe-area-inset-bottom)); }
  .grid { gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
  .grid.wide { grid-template-columns: 1fr; }
  .stat-value { font-size: 1.55rem; }
  .card { padding: 14px; border-radius: 13px; }
  th, td { padding: 9px 8px; }
  .bottomnav {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    background: var(--surface); border-top: 1px solid var(--border);
    padding: 4px 4px calc(4px + env(safe-area-inset-bottom));
    box-shadow: 0 -2px 16px rgba(15, 23, 42, .08);
  }
  .bottomnav > a, .bottomnav summary {
    flex: 1 1 0; min-width: 0; min-height: var(--tap);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 2px; padding: 5px 2px; border-radius: 12px; color: var(--muted);
    font-size: 11px; font-weight: 600; list-style: none; cursor: pointer;
  }
  .bottomnav summary::-webkit-details-marker { display: none; }
  .bottomnav > a .ico, .bottomnav summary .ico { font-size: 18px; line-height: 1; }
  .bottomnav > a.active { color: var(--accent); background: var(--accent-soft); }
  .bottomnav details.sheet { display: flex; flex: 1 1 0; min-width: 0; }
  .bottomnav details.sheet[open] summary { color: var(--accent); background: var(--accent-soft); }
  .sheet-body {
    position: fixed; left: 0; right: 0; bottom: calc(60px + env(safe-area-inset-bottom));
    background: var(--surface); border-top: 1px solid var(--border);
    border-radius: 18px 18px 0 0; padding: 10px 12px 14px;
    box-shadow: 0 -10px 40px rgba(15, 23, 42, .2); max-height: 62vh; overflow-y: auto;
  }
  .sheet-body .nav a { min-height: var(--tap); }
  .sheet-title { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; padding: 6px 12px; }
}
@media (min-width: 901px) {
  .topbar { background: transparent; border-bottom: 1px solid var(--border); }
}
@media (prefers-reduced-motion: no-preference) {
  .card, .btn, .nav a { transition: background .15s ease, border-color .15s ease, color .15s ease; }
}

/* Theme switcher. The same markup is mounted twice: once in the desktop
   topbar and once inside the mobile menu sheet. Which copy is visible is
   decided here, so there is still only one component. */
.theme-switch {
  display: flex; align-items: center; gap: 3px; flex-wrap: nowrap;
  background: var(--surface-2); border: 1px solid var(--border);
  border-radius: 999px; padding: 3px;
}
.theme-switch .tsw {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 34px; padding: 0 13px; border: 0; border-radius: 999px;
  background: transparent; color: var(--muted); font: inherit;
  font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.theme-switch .tsw:hover { color: var(--accent); }
.theme-switch .tsw[aria-pressed="true"] {
  background: var(--surface); color: var(--accent); box-shadow: var(--shadow);
}
.theme-switch .tsw:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sheet-body .theme-switch { margin: 4px 12px 10px; }
.sheet-body .theme-switch .tsw { flex: 1 1 0; min-height: var(--tap); }

/* Mail module */
.relay-state { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kv { display: flex; gap: 8px; align-items: baseline; font-size: 13px; }
.kv span { color: var(--muted); }
.kv b { font-weight: 600; word-break: break-all; }
.mail-body { min-height: 150px; }
.stack { display: flex; flex-direction: column; gap: 12px; }

/* Sign in and forced password change share one centred card. */
.auth-shell {
  min-height: 100vh; min-height: 100dvh; display: flex; align-items: center;
  justify-content: center; padding: 24px 16px; background: var(--bg);
}
.auth-card { width: 100%; max-width: 400px; }
.auth-card .brand { padding: 0 0 16px; }
.auth-foot { text-align: center; color: var(--muted); font-size: 12.5px; padding-top: 14px; }

@media (max-width: 900px) {
  .topbar .theme-switch { display: none; }
}
@media (min-width: 901px) {
  .bottomnav { display: none; }
}
fieldset.plain { border: 0; padding: 0; margin: 0; min-width: 0; }
fieldset.plain[disabled] { opacity: .55; }
.btn[disabled] { opacity: .55; cursor: not-allowed; }
input.tiny { width: auto; min-height: 0; flex: 0 0 auto; margin-top: 4px; }

/* Mail UX refresh */
.mail-status-banner{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px;margin-bottom:14px;background:linear-gradient(135deg,var(--surface),var(--accent-soft));border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.mail-status-banner.warn{background:linear-gradient(135deg,var(--surface),var(--warn-soft))}
.mail-status-icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-size:20px;font-weight:750}
.mail-status-copy{min-width:0;display:flex;flex-direction:column;gap:2px}.mail-status-copy strong{font-size:15px}.mail-status-copy span{color:var(--muted);font-size:13px;line-height:1.35}
.mail-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.mail-kpi{min-width:0;padding:15px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.mail-kpi>span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.04em}.mail-kpi>strong{display:block;margin-top:7px;font-size:1.75rem;line-height:1;letter-spacing:-.03em}.mail-kpi small{display:block;margin-top:7px;color:var(--muted)}.mail-kpi-state{min-height:38px;display:flex;align-items:center;margin-top:5px}
.mail-main-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:14px;margin-bottom:14px}.mail-main-grid .card{margin-top:0}.mail-card-sub{margin:3px 0 0;color:var(--muted);font-size:12.5px}
.mail-disabled-hint{display:flex;gap:10px;align-items:flex-start;margin-top:12px;padding:12px;border-radius:12px;background:var(--accent-soft);color:var(--accent);font-size:13px;line-height:1.35}
.mail-relay-list{display:grid}.mail-relay-list>div{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;border-bottom:1px solid var(--border)}.mail-relay-list>div:last-child{border-bottom:0}.mail-relay-list span{color:var(--muted);font-size:13px}.mail-relay-list b{max-width:60%;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-relay-actions{display:flex;gap:8px;align-items:center;margin-top:14px;flex-wrap:wrap}.mail-tech{margin-top:12px;border-top:1px solid var(--border);padding-top:10px;color:var(--muted);font-size:12.5px}.mail-tech summary{cursor:pointer;color:var(--text);font-weight:600}.mail-tech p{margin:8px 0 0}
.mail-history-card{margin-top:0!important}.mail-history-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.mail-filter-scroll{display:flex;gap:7px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:2px 0 9px;margin-bottom:6px}.mail-filter-scroll::-webkit-scrollbar{display:none}.mail-filter-scroll .chip{flex:0 0 auto;min-height:34px;padding:0 12px}
.mail-empty{min-height:150px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:13px;background:var(--surface-2)}.mail-empty-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:var(--accent-soft);color:var(--accent);font-size:20px;margin-bottom:10px}.mail-empty strong{color:var(--text);font-size:15px}.mail-empty span:last-child{margin-top:2px;font-size:12.5px}.mail-history-note{margin:10px 0 0;color:var(--muted);font-size:12px}#smtp-settings{scroll-margin-top:76px}
@media(max-width:900px){.mail-status-banner{grid-template-columns:40px minmax(0,1fr);padding:12px;gap:10px}.mail-status-icon{width:40px;height:40px;border-radius:12px}.mail-status-copy span{display:none}.mail-status-action{grid-column:1/-1;width:100%}.mail-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mail-kpi{padding:13px}.mail-kpi>strong{font-size:1.55rem}.mail-kpi small{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mail-main-grid{grid-template-columns:1fr;gap:12px}.mail-compose-card,.mail-relay-card,.mail-history-card{border-radius:16px}.mail-body{min-height:120px}.mail-tech{display:none}.mail-relay-actions .btn{flex:1 1 130px}.mail-history-card{padding:14px 12px}.mail-history-note{display:none}.mail-table{margin-top:2px}}

/* SMS Center — compact responsive message UI */
.sms-status-banner{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;background:linear-gradient(135deg,var(--surface),var(--surface-2));border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);padding:14px 16px;margin-bottom:14px}.sms-status-icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-size:20px}.sms-status-copy{min-width:0}.sms-status-copy strong{display:block;font-size:15px}.sms-status-copy span{display:block;color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sms-main-grid{align-items:start}.sms-compose-card,.sms-provider-card,.sms-history-card{border-radius:18px}.sms-filter-scroll{display:flex;gap:7px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:2px 0 10px;margin-bottom:4px}.sms-filter-scroll::-webkit-scrollbar{display:none}.sms-filter-scroll .chip{flex:0 0 auto;min-height:34px;padding:0 12px}.sms-history-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.sms-message-list{display:grid;gap:10px}.sms-message-card{border:1px solid var(--border);background:var(--surface-2);border-radius:15px;padding:13px}.sms-message-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.sms-recipient{display:block;font-size:14.5px}.sms-message-id{display:block;color:var(--muted);font-size:11.5px;margin-top:1px}.sms-message-body{margin:10px 0 9px;font-size:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word}.sms-message-meta{display:flex;gap:7px 12px;flex-wrap:wrap;color:var(--muted);font-size:11.5px}.sms-message-meta span{display:inline-flex;align-items:center;gap:4px}.sms-message-error,.sms-message-next{margin-top:8px;font-size:12px;color:var(--err)}.sms-message-next{color:var(--muted)}.sms-message-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}.sms-message-actions .btn{min-height:36px;padding:0 12px;font-size:12.5px}.sms-empty{min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:14px;background:var(--surface-2)}.sms-empty-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:var(--accent-soft);color:var(--accent);font-size:20px;margin-bottom:8px}
@media(max-width:900px){.sms-status-banner{grid-template-columns:40px minmax(0,1fr);padding:12px;gap:10px}.sms-status-icon{width:40px;height:40px;border-radius:12px}.sms-status-banner>.badge{grid-column:2;justify-self:start}.sms-status-copy span{display:none}.sms-tech-grid{display:none}.sms-main-grid{grid-template-columns:1fr}.sms-provider-card{display:none}.sms-compose-card,.sms-history-card{border-radius:16px}.sms-history-card{padding:14px 12px}.sms-history-head .btn{min-height:38px;padding:0 12px}.sms-message-card{padding:12px;border-radius:14px}.sms-message-body{font-size:13.5px}.sms-message-meta{font-size:11px}.sms-message-actions{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.sms-message-actions::-webkit-scrollbar{display:none}.sms-message-actions form{flex:0 0 auto}.sms-message-actions .btn{white-space:nowrap}.sms-compose-card .row{display:block}.sms-compose-card .actions .btn{width:100%}}

/* SKYNET WebMail — user mailbox shell (mail.skynet.am only) */
.mail-host .sidebar,.mail-host .topbar,.mail-host .page-foot{display:none}.mail-host .container{max-width:none;margin:0;padding:0}.mail-host .main{min-height:100vh;min-height:100dvh}.mail-host .shell{display:block}.wm-app{min-height:100vh;min-height:100dvh;background:var(--bg);color:var(--text)}
.wm-topbar{height:64px;display:flex;align-items:center;gap:22px;padding:0 24px;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:25}.wm-brand{display:flex;align-items:center;gap:10px;min-width:250px}.wm-brand .brand-mark{width:36px;height:36px;flex-basis:36px}.wm-brand>div{display:flex;flex-direction:column;min-width:0}.wm-brand strong{font-size:15px}.wm-brand span:last-child{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-searchbox{height:40px;max-width:560px;flex:1 1 560px;margin:auto;display:flex;align-items:center;gap:10px;padding:0 14px;border-radius:11px;background:var(--surface-2);border:1px solid var(--border);color:var(--muted)}.wm-searchbox:hover{border-color:var(--accent);color:var(--accent)}.wm-top-actions{display:flex;align-items:center;gap:8px}.wm-iconbtn,.wm-avatar{width:40px;height:40px;display:grid;place-items:center;border-radius:11px;color:var(--text)}.wm-iconbtn:hover{background:var(--surface-2)}.wm-avatar{border-radius:50%;background:linear-gradient(135deg,var(--accent),#6366f1);color:#fff;font-weight:750}
.wm-workspace{display:grid;grid-template-columns:280px minmax(360px,400px) minmax(0,1fr);height:calc(100dvh - 64px);overflow:hidden}.wm-sidebar{background:var(--surface-2);border-right:1px solid var(--border);padding:16px 12px;overflow-y:auto;display:flex;flex-direction:column}.wm-compose{height:44px;display:flex;align-items:center;justify-content:center;gap:9px;border-radius:11px;background:var(--accent);color:#fff;font-weight:700;box-shadow:var(--shadow);margin:0 4px 14px}.wm-compose:hover{filter:brightness(1.06);color:#fff}.wm-account{display:flex;align-items:center;gap:10px;padding:11px 10px;margin-bottom:7px}.wm-account-avatar{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:750}.wm-account>div{min-width:0}.wm-account strong,.wm-account span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-account strong{font-size:14px}.wm-account span{font-size:11.5px;color:var(--muted)}.wm-folder-nav{display:grid;gap:2px}.wm-folder-nav a{min-height:42px;display:flex;align-items:center;gap:11px;padding:0 11px;border-radius:9px;color:var(--text);font-size:14px}.wm-folder-nav a:hover{background:var(--surface)}.wm-folder-nav a.active{background:var(--accent-soft);color:var(--accent);font-weight:650}.wm-folder-nav a b{margin-left:auto;font-size:12px;color:var(--accent)}.wm-folder-icon{width:20px;text-align:center;font-size:17px}.wm-new-folder{color:var(--accent)!important}.wm-side-section{padding:17px 11px 7px;color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.wm-folder-nav.compact a{min-height:39px}.wm-dot{width:10px;height:10px;border-radius:50%;margin:0 5px}.wm-dot.blue{background:var(--accent)}.wm-dot.flag{width:20px;height:20px;margin:0;color:var(--warn);display:grid;place-items:center;font-size:12px}.wm-side-settings{margin-top:auto;min-height:42px;display:flex;align-items:center;gap:11px;padding:0 11px;color:var(--text);border-radius:9px}.wm-side-settings:hover{background:var(--surface)}
.wm-mainpane{background:var(--surface);border-right:1px solid var(--border);overflow-y:auto;position:relative}.wm-list-header{position:sticky;top:0;z-index:5;background:var(--surface);border-bottom:1px solid var(--border)}.wm-desktop-title{height:56px;padding:0 16px;display:flex;align-items:center;justify-content:space-between}.wm-desktop-title h1{font-size:18px}.wm-desktop-title>div:first-child>span{font-size:11.5px;color:var(--muted)}.wm-list-actions{display:flex;gap:6px}.wm-list-actions a,.wm-list-actions button{width:36px;height:36px;display:grid;place-items:center;border:0;background:transparent;border-radius:9px;color:var(--text);font-size:18px}.wm-list-actions a:hover,.wm-list-actions button:hover{background:var(--surface-2)}.wm-mobile-title{display:none}.wm-filter-row{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:10px 16px;border-bottom:1px solid var(--border);background:var(--surface)}.wm-filter-row::-webkit-scrollbar{display:none}.wm-filter-row a{flex:0 0 auto;min-height:32px;display:flex;align-items:center;padding:0 11px;border-radius:999px;border:1px solid var(--border);color:var(--muted);font-size:12px;font-weight:600;background:var(--surface-2)}.wm-filter-row a.active{background:var(--accent);border-color:var(--accent);color:#fff}.wm-connect-card{margin:14px 16px;padding:12px;display:flex;align-items:center;gap:11px;border-radius:12px;background:var(--accent-soft);color:var(--accent)}.wm-connect-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:var(--surface);font-size:18px;font-weight:750}.wm-connect-card strong,.wm-connect-card span{display:block}.wm-connect-card strong{font-size:13px}.wm-connect-card span{font-size:11.5px;color:var(--muted);margin-top:1px}.wm-message-list{min-height:300px}.wm-empty{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;color:var(--muted)}.wm-empty-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;background:var(--accent-soft);color:var(--accent);font-size:24px;margin-bottom:12px}.wm-empty strong{color:var(--text);font-size:15px}.wm-empty span{font-size:12.5px;margin-top:4px;max-width:270px}.wm-fab{display:none}.wm-message-row{min-height:84px;padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:flex-start;gap:12px}.wm-message-row:hover{background:var(--surface-2)}.wm-msg-avatar{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:750}.wm-msg-body{flex:1 1 auto;min-width:0}.wm-msg-line{display:flex;align-items:baseline;gap:10px}.wm-msg-line b{flex:1 1 auto;min-width:0;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-msg-date{flex:0 0 auto;font-size:11.5px;color:var(--muted)}.wm-msg-subject{margin-top:3px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-msg-from{margin-top:2px;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-msg-marks{flex:0 0 auto;display:flex;align-items:center;gap:6px;min-height:38px}.wm-message-row.is-unread .wm-msg-line b{font-weight:750}.wm-message-row.is-unread .wm-msg-subject{font-weight:700;color:var(--text)}.wm-connect-card.is-err{background:var(--err-soft);color:var(--err)}
.wm-reading-pane{background:var(--surface);overflow:auto;display:flex}.wm-reading-empty{margin:auto;text-align:center;color:var(--muted);padding:40px}.wm-reading-empty>div{width:64px;height:64px;display:grid;place-items:center;margin:0 auto 14px;border-radius:20px;background:var(--accent-soft);color:var(--accent);font-weight:800;font-size:20px;opacity:.75}.wm-reading-empty strong,.wm-reading-empty span{display:block}.wm-reading-empty strong{color:var(--text);font-size:16px}.wm-reading-empty span{font-size:12.5px;margin-top:3px}
.wm-section-head{padding:22px 24px 16px;border-bottom:1px solid var(--border)}.wm-section-head h1{font-size:21px}.wm-section-head span{display:block;color:var(--muted);font-size:12.5px;margin-top:3px}.wm-mobile-folders{display:grid;padding:8px 20px}.wm-mobile-folders>a,.wm-mobile-folders>button{min-height:54px;display:flex;align-items:center;gap:14px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);font:inherit;text-align:left}.wm-mobile-folders>a b{margin-left:auto;color:var(--accent)}.wm-folder-bigicon{width:24px;text-align:center;font-size:20px}.wm-mobile-filter-title{padding:22px 0 8px;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.wm-search-page{padding:18px}.wm-search-page>label,.wm-search-form>label{height:46px;display:flex;align-items:center;gap:10px;padding:0 13px;border-radius:11px;background:var(--surface-2);border:1px solid var(--border)}.wm-search-page input{border:0;box-shadow:none;background:transparent;padding:0;min-height:0}.wm-search-page .wm-filter-row{padding:14px 0;border:0}.wm-compose-form{padding:20px 24px;max-width:860px}.wm-compose-form label{display:block;margin-bottom:12px}.wm-compose-form label>span{display:block;color:var(--muted);font-size:12.5px;font-weight:600;margin-bottom:5px}.wm-compose-body textarea{min-height:300px}.wm-compose-actions{display:flex;align-items:center;gap:12px}.wm-compose-actions span{font-size:12px;color:var(--muted)}
.wm-settings-list{padding:8px 20px 30px;max-width:760px}.wm-settings-list>a{min-height:68px;display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--border);color:var(--text)}.wm-settings-list>a>span:nth-child(2){flex:1;min-width:0}.wm-settings-list b,.wm-settings-list small{display:block}.wm-settings-list b{font-size:15px}.wm-settings-list small{font-size:12px;color:var(--muted);margin-top:2px}.wm-settings-list i{font-style:normal;color:var(--muted);font-size:22px}.wm-setting-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;font-size:19px}.wm-setting-icon.pink{background:#fde6e9;color:#e45a70}.wm-setting-icon.green{background:#e1f6e9;color:#35a963}.wm-setting-icon.blue{background:var(--accent-soft);color:var(--accent)}.wm-setting-icon.violet{background:#f2e5f8;color:#9a50bb}.wm-setting-icon.yellow{background:#fff3d6;color:#c68a00}.wm-setting-icon.gray{background:#eceff3;color:#657083}.wm-setting-icon.wm-setting-app-icon{padding:3px;overflow:hidden;background:#090a0d}.wm-setting-app-icon img{width:100%;height:100%;object-fit:contain;border-radius:10px}.wm-add-account{margin-top:18px;border:0;background:transparent;color:var(--accent);font:inherit;font-weight:650;padding:12px 0}
@media(max-width:1279px) and (min-width:901px){.wm-workspace{grid-template-columns:220px minmax(360px,430px) minmax(0,1fr)}.wm-brand{min-width:195px}.wm-sidebar{padding-left:8px;padding-right:8px}}
@media(max-width:900px){.mail-host .container{padding:0 0 calc(64px + env(safe-area-inset-bottom))}.wm-topbar{display:none}.wm-workspace{display:block;height:auto;overflow:visible}.wm-sidebar,.wm-reading-pane{display:none}.wm-mainpane{min-height:calc(100dvh - 64px - env(safe-area-inset-bottom));border:0;overflow:visible}.wm-desktop-title{display:none}.wm-mobile-title{height:60px;display:flex;align-items:center;padding:0 16px;gap:14px}.wm-mobile-menu{font-size:22px;color:var(--text);width:30px}.wm-mobile-title>div:nth-child(2){display:flex;align-items:center;gap:7px;flex:1;min-width:0}.wm-mobile-title h1{font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-mobile-title>div:nth-child(2)>span{color:var(--accent);font-weight:750;font-size:16px}.wm-mobile-actions{display:flex!important;align-items:center!important;gap:12px!important;flex:0 0 auto!important}.wm-mobile-actions a,.wm-mobile-actions button{border:0;background:transparent;color:var(--text);font-size:21px;padding:4px}.wm-filter-row{padding:8px 16px}.wm-connect-card{margin:10px 16px}.wm-message-list{min-height:430px}.wm-empty{min-height:360px}.wm-fab{position:fixed;right:16px;bottom:calc(72px + env(safe-area-inset-bottom));z-index:35;min-width:56px;height:56px;padding:0 17px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:18px;background:var(--accent);color:#fff;box-shadow:0 10px 24px rgba(15,23,42,.2)}.wm-fab span{font-size:23px}.wm-fab b{font-size:13px}.wm-section-head{padding:18px 20px 14px}.wm-section-head h1{font-size:20px}.wm-search-page{padding:14px 16px}.wm-compose-form{padding:16px}.wm-compose-body textarea{min-height:260px}.wm-settings-list{padding:4px 18px 24px}.mail-host .bottomnav{height:auto}.mail-host .bottomnav>a{font-size:11px}.mail-host .bottomnav>a .ico{font-size:20px}}
/* WebMail account actions */
.wm-account-settings{margin-top:18px;border-top:1px solid var(--border);padding-top:14px;display:grid;gap:10px}.wm-account-current{display:flex;align-items:center;gap:12px;padding:12px;border-radius:13px;background:var(--surface-2);border:1px solid var(--border)}.wm-account-current>span:last-child{display:flex;flex-direction:column;min-width:0}.wm-account-current b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wm-account-current small{color:var(--muted)}.wm-add-account,.wm-logout{display:flex;align-items:center;justify-content:center;min-height:46px;border-radius:12px;font-weight:650;border:1px solid var(--border);background:var(--surface);padding:0 16px}.wm-add-account{color:var(--accent);background:var(--accent-soft);border-color:transparent}.wm-logout{color:var(--err)}
.wm-acc-form{padding:20px 24px 40px;max-width:640px}.wm-acc-note{display:flex;gap:11px;padding:12px 13px;border-radius:12px;background:var(--warn-soft);color:var(--warn);margin-bottom:18px}.wm-acc-note-icon{flex:0 0 22px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:var(--surface);font-weight:800;font-size:13px}.wm-acc-note>div{min-width:0}.wm-acc-note b,.wm-acc-note>div span{display:block}.wm-acc-note b{font-size:13px;margin-bottom:4px}.wm-acc-note>div span{font-size:12px;line-height:1.5}.wm-acc-note>div span+span{margin-top:6px;opacity:.85}.wm-acc-hint{color:var(--muted);font-size:12px;line-height:1.5;margin:0 0 14px}.wm-acc-adv{border:1px solid var(--border);border-radius:12px;background:var(--surface-2);margin:2px 0 18px}.wm-acc-adv>summary{min-height:48px;display:flex;align-items:center;padding:0 14px;cursor:pointer;font-weight:650;font-size:13.5px;color:var(--accent);list-style:none}.wm-acc-adv>summary::-webkit-details-marker{display:none}.wm-acc-adv>summary::after{content:"\203A";margin-left:auto;font-size:20px;line-height:1;transform:rotate(90deg)}.wm-acc-adv[open]>summary::after{transform:rotate(270deg)}.wm-acc-adv-body{padding:12px 14px 14px;border-top:1px solid var(--border)}.wm-acc-group{margin-top:14px}.wm-acc-group-title{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}.wm-acc-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1.4fr);gap:10px}.wm-acc-row .field{margin-bottom:0}.wm-acc-actions{display:flex;align-items:center;gap:10px;margin:4px 0 12px}
.wm-acc-list-title{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:2px}.wm-acc-card{border:1px solid var(--border);border-radius:13px;background:var(--surface);padding:13px}.wm-acc-card.is-active{border-color:var(--accent);background:var(--accent-soft)}.wm-acc-card-head{display:flex;align-items:center;gap:11px}.wm-acc-card-id{display:flex;flex-direction:column;min-width:0;flex:1 1 auto}.wm-acc-card-id b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.wm-acc-card-id small{font-size:11.5px;color:var(--muted)}.wm-acc-badge{flex:0 0 auto;padding:4px 10px;border-radius:999px;background:var(--accent);color:#fff;font-size:11px;font-weight:700}.wm-acc-card-meta{display:grid;gap:3px;margin:10px 0 12px;font-size:11.5px;color:var(--muted);word-break:break-word}.wm-acc-card-actions{display:flex;flex-wrap:wrap;gap:8px}.wm-acc-card-actions form{display:flex;flex:0 1 auto}.wm-acc-card-actions .btn{min-height:38px;padding:0 14px;font-size:12.5px;background:var(--surface)}.wm-acc-empty{padding:16px;border:1px dashed var(--border);border-radius:13px;color:var(--muted);font-size:12.5px;text-align:center}
@media(max-width:900px){.wm-acc-form{padding:16px 16px 32px}.wm-acc-row{grid-template-columns:1fr;gap:0}.wm-acc-row .field{margin-bottom:12px}.wm-acc-actions{flex-direction:column-reverse;align-items:stretch;gap:8px}.wm-acc-actions .btn{width:100%}.wm-acc-card-actions form{flex:1 1 30%}.wm-acc-card-actions .btn{width:100%}}

/* Mail Server Admin (/mail on center.skynet.am). Mobile first: the tab
   strip is the only thing allowed to scroll sideways, every card, form
   and row below it wraps instead of being cut off. */
.ms-tabs {
  display: flex; gap: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch;
  scrollbar-width: none; margin: 0 -4px 14px; padding: 2px 4px 6px;
}
.ms-tabs::-webkit-scrollbar { display: none; }
.ms-tab {
  display: inline-flex; align-items: center; flex: 0 0 auto; min-height: 40px;
  padding: 0 14px; border-radius: 999px; border: 1px solid var(--border);
  background: var(--surface); color: var(--muted); font-size: 13.5px;
  font-weight: 600; white-space: nowrap;
}
.ms-tab:hover { color: var(--accent); border-color: var(--accent); }
.ms-tab.is-on {
  background: var(--accent); border-color: var(--accent); color: #fff;
  box-shadow: var(--shadow);
}
.ms-kpis { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); margin-bottom: 14px; }
.ms-kpi {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px;
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.ms-kpi > span { color: var(--muted); font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; }
.ms-kpi > strong { font-size: 1.5rem; font-weight: 680; letter-spacing: -.02em; overflow-wrap: anywhere; }
.ms-kpi > small { color: var(--muted); font-size: 12.5px; overflow-wrap: anywhere; }
.ms-chiprow { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.ms-hint { color: var(--muted); font-size: 12.5px; margin: 8px 0 0; line-height: 1.45; }
.ms-empty {
  padding: 22px 14px; text-align: center; color: var(--muted); font-size: 13.5px;
  border: 1px dashed var(--border); border-radius: var(--radius);
}
.ms-form { margin-top: 4px; }
.ms-form .row > * { flex: 1 1 210px; min-width: 0; }
.ms-form fieldset.plain { border: 0; padding: 0; margin: 0; min-width: 0; }
.ms-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 12px; }
.ms-actions form { display: flex; }
.ms-rows{display:grid;gap:10px;margin-top:10px;min-width:0}
.ms-row{min-width:0;border:1px solid var(--border);background:var(--surface-2);border-radius:15px;padding:13px 14px;box-shadow:0 1px 0 rgba(15,23,42,.02)}
.ms-row-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}
.ms-row-title{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1 1 auto}
.ms-row-title>b{font-size:14px;line-height:1.3;overflow-wrap:anywhere;word-break:break-word}
.ms-row-title>.small{display:block;line-height:1.35;overflow-wrap:anywhere;word-break:break-word}
.ms-row-badges{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap;flex:0 1 auto;min-width:0}
.ms-row-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:11px}
.ms-row-actions form{display:flex;min-width:0}
.ms-row-actions .btn{min-height:37px;padding:0 13px;font-size:12.5px}
.ms-fold{margin-top:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden}
.ms-fold>summary{min-height:43px;display:flex;align-items:center;padding:0 13px;cursor:pointer;list-style:none;font-size:13px;font-weight:650;color:var(--text);user-select:none}
.ms-fold>summary::-webkit-details-marker{display:none}
.ms-fold>summary::after{content:"›";margin-left:auto;color:var(--muted);font-size:20px;line-height:1;transform:rotate(90deg);transition:transform .15s ease}
.ms-fold[open]>summary::after{transform:rotate(270deg)}
.ms-fold[open]>summary{border-bottom:1px solid var(--border);background:var(--surface-2)}
.ms-fold>.ms-form{padding:12px 13px 13px;margin:0}
.ms-fold.is-danger>summary{color:var(--err)}
.ms-fold.is-danger[open]{border-color:color-mix(in srgb,var(--err) 34%,var(--border))}
.ms-check{display:flex;align-items:flex-start;gap:9px;min-height:38px;padding:8px 0;color:var(--text);font-size:13px;line-height:1.35}
.ms-check input{width:18px;height:18px;min-height:0;flex:0 0 18px;margin:0;margin-top:1px;accent-color:var(--accent)}
.ms-pick{display:flex;align-items:flex-start;gap:11px;cursor:pointer}
.ms-pick>input{width:18px;height:18px;min-height:0;flex:0 0 18px;margin:2px 0 0;accent-color:var(--accent)}
.ms-pick-body{display:flex;flex-direction:column;gap:7px;min-width:0;flex:1 1 auto}
.ms-reason{display:block;margin-top:5px;color:var(--err);font-size:12px;line-height:1.4;overflow-wrap:anywhere;word-break:break-word}
.ms-dnsrec{min-width:0;border:1px solid var(--border);background:var(--surface-2);border-radius:14px;padding:13px}
.ms-dnsval{display:grid;grid-template-columns:minmax(100px,150px) minmax(0,1fr);gap:9px;align-items:start;margin-top:9px}
.ms-dnsval>span{color:var(--muted);font-size:12px;font-weight:650;padding-top:7px}
.ms-dnsval>code{display:block;min-width:0;padding:7px 9px;border-radius:9px;border:1px solid var(--border);background:var(--surface);font-size:11.5px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;color:var(--text)}
@media(max-width:900px){
  .ms-tabs{margin-left:-2px;margin-right:-2px;padding-left:2px;padding-right:2px}
  .ms-tab{min-height:38px;padding:0 12px;font-size:12.5px}
  .ms-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .ms-kpi{padding:12px;border-radius:15px}
  .ms-kpi>strong{font-size:1.35rem}
  .ms-kpi>small{font-size:11.5px;line-height:1.3}
  .ms-form .row{display:block}
  .ms-form .row>.field{margin-bottom:10px;width:100%}
  .ms-row{padding:12px;border-radius:14px}
  .ms-row-head{flex-direction:column;gap:8px}
  .ms-row-badges{justify-content:flex-start;width:100%}
  .ms-row-actions{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;padding-bottom:1px}
  .ms-row-actions::-webkit-scrollbar{display:none}
  .ms-row-actions form{flex:0 0 auto}
  .ms-fold>.ms-form{padding:11px}
  .ms-actions{align-items:stretch}
  .ms-actions .btn{flex:1 1 140px}
  .ms-dnsval{grid-template-columns:1fr;gap:4px}
  .ms-dnsval>span{padding-top:0}
  .ms-dnsval>code{font-size:11px}
  .ms-pick{gap:9px}
}
@media(max-width:420px){
  .ms-kpis{grid-template-columns:1fr 1fr}
  .ms-kpi{padding:11px}
  .ms-kpi>span{font-size:11px}
  .ms-kpi>strong{font-size:1.25rem}
  .ms-row-actions .btn{padding:0 11px}
}

/* Mail server admin rows and migration workspace */
.ms-rows{display:grid;gap:10px;margin-top:12px}.ms-row,.ms-dnsrec{border:1px solid var(--border);background:var(--surface-2);border-radius:14px;padding:13px;min-width:0}.ms-row-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.ms-row-title{display:flex;flex-direction:column;min-width:0;gap:2px;overflow-wrap:anywhere}.ms-row-title>b{font-size:14px}.ms-row-badges{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.ms-row-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.ms-row-actions form{display:flex}.ms-fold{margin-top:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}.ms-fold>summary{min-height:42px;display:flex;align-items:center;padding:0 12px;cursor:pointer;color:var(--accent);font-size:13px;font-weight:650;list-style:none}.ms-fold>summary::-webkit-details-marker{display:none}.ms-fold>summary::after{content:"›";margin-left:auto;font-size:20px;transform:rotate(90deg)}.ms-fold[open]>summary::after{transform:rotate(270deg)}.ms-fold>.ms-form,.ms-fold>form{padding:12px;border-top:1px solid var(--border)}.ms-fold.is-danger>summary{color:var(--err)}.ms-check{display:flex!important;align-items:flex-start!important;gap:9px!important;margin:9px 0!important;color:var(--text);font-size:13px;line-height:1.4}.ms-check input{width:auto;min-height:0;margin-top:3px;flex:0 0 auto}.ms-reason{margin-top:8px;padding:8px 10px;border-radius:9px;background:var(--err-soft);color:var(--err);font-size:12px;overflow-wrap:anywhere}.ms-pick{display:flex;gap:10px;align-items:flex-start}.ms-pick>input{width:auto;min-height:0;margin-top:4px}.ms-pick-body{display:flex;flex:1;min-width:0;flex-direction:column;gap:7px}.ms-dnsval{display:grid;grid-template-columns:120px minmax(0,1fr);gap:9px;margin-top:9px;align-items:start}.ms-dnsval>span{font-size:12px;color:var(--muted)}.ms-dnsval code{font-size:11px;overflow-wrap:anywhere;white-space:normal}
.mig-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px;padding:18px 20px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(135deg,var(--surface),var(--accent-soft));box-shadow:var(--shadow)}.mig-hero h2{margin:2px 0 5px;font-size:22px}.mig-hero p{margin:0;max-width:760px;color:var(--muted);font-size:13px;line-height:1.45}.mig-eyebrow{display:block;color:var(--accent);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.mig-source-tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:2px 0 10px;margin-bottom:4px}.mig-source-tabs::-webkit-scrollbar{display:none}.mig-source-tabs a{flex:0 0 auto;min-width:150px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);display:flex;flex-direction:column}.mig-source-tabs a span{font-weight:650;font-size:13px}.mig-source-tabs a small{margin-top:2px;color:var(--muted);font-size:11px}.mig-source-tabs a.is-on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.mig-source-tabs .mig-source-add{min-width:auto;justify-content:center;color:var(--accent)}.mig-source-actions,.mig-step-actions{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap;margin-top:12px}.mig-source-actions>form,.mig-step-actions>form{display:flex}.mig-source-actions>.ms-fold{margin:0;min-width:180px}.mig-mailboxes{display:grid;gap:10px;margin-top:14px}.mig-bulk{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}.mig-step-actions .btn{min-height:42px}.mig-jobs{margin-top:14px}.mig-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mig-check{display:flex;align-items:center;gap:9px;padding:11px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);color:var(--muted)}.mig-check>span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--border);font-size:13px}.mig-check b{font-size:12.5px}.mig-check.is-ok{color:var(--ok);background:var(--ok-soft);border-color:transparent}.mig-check.is-ok>span{border-color:var(--ok);background:var(--surface)}.mig-cutover{margin-top:14px;padding:14px;border:1px solid var(--err);border-radius:14px;background:var(--err-soft)}.mig-cutover strong{display:block;color:var(--err);font-size:14px}.mig-cutover p{margin:5px 0 10px;color:var(--muted);font-size:12.5px;line-height:1.45}.mig-cutover code{display:block;margin:4px 0;padding:8px;border-radius:9px;background:var(--surface);font-size:11.5px;overflow-wrap:anywhere}.mig-cutover .btn{margin-top:10px}.mig-readiness{margin-bottom:20px}
@media(max-width:900px){.ms-row-head{display:block}.ms-row-badges{justify-content:flex-start;margin-top:8px}.ms-row-actions{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.ms-row-actions::-webkit-scrollbar{display:none}.ms-row-actions form{flex:0 0 auto}.ms-dnsval{grid-template-columns:1fr}.mig-hero{padding:15px;display:block}.mig-hero>.badge{margin-top:10px}.mig-source-actions,.mig-step-actions{display:grid;grid-template-columns:1fr}.mig-source-actions>form,.mig-step-actions>form{width:100%}.mig-source-actions .btn,.mig-step-actions .btn{width:100%}.mig-source-actions>.ms-fold{width:100%}.mig-checks{grid-template-columns:1fr}.mig-mailboxes .ms-row{padding:12px}.mig-bulk .row{display:block}}

/* Primary one-click bulk migration */
.mig-bulk-launch{border-color:color-mix(in srgb,var(--accent) 30%,var(--border));background:linear-gradient(145deg,var(--surface),var(--accent-soft));}
.mig-bulk-launch .card-head{align-items:flex-start}.mig-bulk-launch h2{margin:3px 0 5px;font-size:20px}.mig-bulk-launch .mig-eyebrow{text-transform:none;letter-spacing:.02em;font-size:12px}.mig-bulk-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0}.mig-bulk-stats>div{display:flex;flex-direction:column;gap:2px;padding:11px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}.mig-bulk-stats strong{font-size:20px;line-height:1.1;color:var(--text)}.mig-bulk-stats span{font-size:11.5px;color:var(--muted)}.mig-bulk-message,.mig-bulk-safe{margin-top:10px}.mig-bulk-start{margin-top:12px}.mig-bulk-button{min-height:52px;font-size:15px;font-weight:750}.mig-bulk-button:disabled{opacity:.55;cursor:not-allowed}
@media(max-width:560px){.mig-bulk-stats{grid-template-columns:1fr 1fr}.mig-bulk-stats>div:last-child{grid-column:1/-1}.mig-bulk-button{min-height:54px;font-size:14px;white-space:normal;line-height:1.25}}

/* Migration connection card: make the first action unmistakable */
.mig-connect-card{border:1.5px solid color-mix(in srgb,var(--accent) 42%,var(--border));background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--accent-soft) 58%,var(--surface)));box-shadow:0 14px 34px rgba(15,23,42,.08)}
.mig-connect-head{margin-bottom:14px}.mig-connect-head>div:first-child{display:flex;align-items:flex-start;gap:12px}.mig-connect-head h2{font-size:20px;margin:0 0 4px}.mig-step-pill{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:11px;background:var(--accent);color:#fff;font-weight:800;font-size:15px;box-shadow:0 7px 18px color-mix(in srgb,var(--accent) 26%,transparent)}
.mig-connect-section{padding:13px 14px;margin-top:11px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.mig-connect-label{font-size:12px;font-weight:800;color:var(--accent);text-transform:uppercase;letter-spacing:.055em;margin-bottom:9px}.mig-connect-save{min-height:50px;margin-top:12px;font-size:14.5px;font-weight:750}
@media(max-width:560px){.mig-connect-card{padding:14px}.mig-connect-head{align-items:flex-start}.mig-connect-head>div:first-child{gap:10px}.mig-connect-head h2{font-size:18px}.mig-step-pill{width:31px;height:31px;flex-basis:31px}.mig-connect-section{padding:11px}.mig-connect-save{min-height:52px}}

/* Modern SMS Center workspace */
.sms-center-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:19px 20px;margin-bottom:12px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border));border-radius:19px;background:linear-gradient(145deg,var(--surface),var(--accent-soft));box-shadow:var(--shadow)}
.sms-center-hero h2{margin:2px 0 5px;font-size:23px;letter-spacing:-.02em}.sms-hero-title-row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;min-width:0}.sms-hero-title-row h2{flex:1 1 auto}.sms-hero-balance{flex:0 0 auto;color:var(--ok);font-size:23px;line-height:1.15;letter-spacing:-.02em;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}.sms-center-hero p{margin:0;max-width:720px;color:var(--muted);font-size:13px;line-height:1.45}.sms-eyebrow,.sms-section-tag{display:block;color:var(--accent);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.sms-hero-state{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.sms-toolnav{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:0 -3px 14px;padding:3px 3px 7px}.sms-toolnav::-webkit-scrollbar{display:none}.sms-toolnav a{flex:0 0 auto;min-height:46px;display:flex;align-items:center;gap:8px;padding:0 13px;border:1px solid var(--border);border-radius:13px;background:var(--surface);color:var(--text);font-size:12.5px;font-weight:650;box-shadow:0 1px 0 rgba(15,23,42,.02)}.sms-toolnav a:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}.sms-toolnav a span{width:22px;height:22px;display:grid;place-items:center;border-radius:7px;background:var(--accent-soft);color:var(--accent);font-size:13px}
.sms-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}.sms-kpi{min-width:0;padding:14px 15px;border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:var(--shadow);display:flex;flex-direction:column;gap:3px}.sms-kpi>span{color:var(--muted);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.sms-kpi>strong{font-size:25px;line-height:1.12;letter-spacing:-.03em}.sms-kpi>small{color:var(--muted);font-size:11.5px;line-height:1.3}
.sms-work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}.sms-work-grid>.card,.sms-campaign-card,.sms-history-card,#reports{margin:0}.sms-form{margin-top:8px}.sms-form .field{margin-bottom:11px}.sms-form .field>small{display:block;margin-top:5px;color:var(--muted);font-size:11.5px;line-height:1.35}.sms-text-field textarea{min-height:142px;resize:vertical}.sms-bulk-card textarea[name=recipients]{min-height:104px;resize:vertical}.sms-compose-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:2px}.sms-counter{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.sms-compose-foot .btn{min-width:130px;min-height:44px}.sms-inline-notice{margin:10px 0}
.sms-campaign-card{margin-bottom:12px}.sms-campaign-list{display:grid;gap:9px}.sms-campaign-row{padding:12px 13px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2)}.sms-campaign-main{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.sms-campaign-main>div{min-width:0}.sms-campaign-main strong,.sms-campaign-main span{display:block}.sms-campaign-main strong{font-size:13.5px;overflow-wrap:anywhere}.sms-campaign-main>div>span{margin-top:2px;color:var(--muted);font-size:11px}.sms-progress{height:7px;margin:10px 0 8px;border-radius:999px;background:var(--border);overflow:hidden}.sms-progress-fill{display:block;height:100%;border-radius:inherit;background:var(--accent)}.sms-campaign-stats{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:11.5px}.sms-campaign-stats span:last-child{margin-left:auto;color:var(--accent);font-weight:750}.sms-empty-compact{padding:16px;border:1px dashed var(--border);border-radius:12px;text-align:center;color:var(--muted);font-size:12.5px}
.sms-history-card{margin-bottom:12px}.sms-history-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.sms-history-head h2{margin:1px 0 2px}.sms-history-head small{color:var(--muted);font-size:11.5px}.sms-searchbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-bottom:9px}.sms-searchbar input{min-width:0}.sms-filter-scroll{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;margin:0 -2px 10px;padding:2px}.sms-filter-scroll::-webkit-scrollbar{display:none}.sms-filter-scroll .chip{flex:0 0 auto;min-height:36px;display:flex;align-items:center;padding:0 12px;border-radius:999px;border:1px solid var(--border);background:var(--surface-2);color:var(--muted);font-size:12px;font-weight:650}.sms-filter-scroll .chip.active{background:var(--accent);border-color:var(--accent);color:#fff}.sms-message-list{display:grid;gap:8px}.sms-message-card{padding:12px 13px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2)}.sms-message-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.sms-recipient,.sms-message-id{display:block}.sms-recipient{font-size:13.5px}.sms-message-id{margin-top:2px;color:var(--muted);font-size:10.5px}.sms-message-body{margin:8px 0;color:var(--text);font-size:12.5px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}.sms-message-meta{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:10.5px}.sms-message-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.sms-message-actions form{display:flex}.sms-message-actions .btn{min-height:36px;padding:0 11px;font-size:11.5px}.sms-message-error{margin-top:7px;color:var(--err);font-size:11.5px}.sms-empty{padding:24px;text-align:center;color:var(--muted)}.sms-empty-icon{display:block;font-size:24px;margin-bottom:5px}
.sms-lower-grid{align-items:start}.sms-stop-form{display:grid;grid-template-columns:minmax(120px,.8fr) minmax(160px,1.2fr) auto;gap:8px;margin:12px 0}.sms-stop-list,.sms-provider-list{display:grid;gap:8px}.sms-stop-row,.sms-provider-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 11px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2)}.sms-stop-row>div,.sms-provider-row>div{min-width:0}.sms-stop-row strong,.sms-stop-row span,.sms-provider-row strong,.sms-provider-row span{display:block}.sms-stop-row strong,.sms-provider-row strong{font-size:12.5px;overflow-wrap:anywhere}.sms-stop-row>div>span,.sms-provider-row>div>span{margin-top:2px;color:var(--muted);font-size:10.5px;overflow-wrap:anywhere}.sms-stop-row .btn{min-height:34px;padding:0 10px;font-size:11px}.sms-diagnostics{margin-top:10px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2)}.sms-diagnostics summary{min-height:42px;display:flex;align-items:center;padding:0 12px;cursor:pointer;color:var(--accent);font-size:12.5px;font-weight:650}.sms-diagnostics>div{display:grid;grid-template-columns:minmax(130px,1fr) minmax(0,1.5fr);gap:7px 10px;padding:11px 12px;border-top:1px solid var(--border);font-size:11px}.sms-diagnostics>div span{color:var(--muted)}.sms-diagnostics>div b{overflow-wrap:anywhere}
.sms-report-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.sms-report{padding:13px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2)}.sms-report>span{color:var(--muted);font-size:11.5px;font-weight:700}.sms-report>strong{display:block;margin:3px 0 9px;font-size:23px}.sms-report>div{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;color:var(--muted);font-size:11px}.sms-report b{color:var(--text)}
.sms-progress-fill.w-0{width:0}.sms-progress-fill.w-5{width:5%}.sms-progress-fill.w-10{width:10%}.sms-progress-fill.w-15{width:15%}.sms-progress-fill.w-20{width:20%}.sms-progress-fill.w-25{width:25%}.sms-progress-fill.w-30{width:30%}.sms-progress-fill.w-35{width:35%}.sms-progress-fill.w-40{width:40%}.sms-progress-fill.w-45{width:45%}.sms-progress-fill.w-50{width:50%}.sms-progress-fill.w-55{width:55%}.sms-progress-fill.w-60{width:60%}.sms-progress-fill.w-65{width:65%}.sms-progress-fill.w-70{width:70%}.sms-progress-fill.w-75{width:75%}.sms-progress-fill.w-80{width:80%}.sms-progress-fill.w-85{width:85%}.sms-progress-fill.w-90{width:90%}.sms-progress-fill.w-95{width:95%}.sms-progress-fill.w-100{width:100%}
@media(max-width:900px){.sms-center-hero{padding:15px;display:block}.sms-hero-state{margin-top:10px;justify-content:flex-start}.sms-kpi-grid{grid-template-columns:1fr 1fr;gap:8px}.sms-kpi{padding:12px}.sms-kpi>strong{font-size:21px}.sms-work-grid{grid-template-columns:1fr}.sms-report-grid{grid-template-columns:1fr}.sms-stop-form{grid-template-columns:1fr}.sms-stop-form .btn{min-height:44px}.sms-compose-foot{align-items:center}.sms-toolnav a{min-height:44px}.sms-history-head{align-items:flex-end}.sms-message-actions{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.sms-message-actions::-webkit-scrollbar{display:none}.sms-message-actions form{flex:0 0 auto}}
@media(max-width:460px){.sms-center-hero h2{font-size:20px}.sms-hero-balance{font-size:20px}.sms-kpi-grid{gap:7px}.sms-kpi>span{font-size:10.5px}.sms-kpi>strong{font-size:20px}.sms-kpi>small{font-size:10.5px}.sms-compose-foot{display:grid;grid-template-columns:1fr}.sms-compose-foot .btn{width:100%;min-height:48px}.sms-searchbar{grid-template-columns:1fr}.sms-searchbar .btn{min-height:44px}.sms-campaign-main{align-items:flex-start}.sms-campaign-stats{gap:8px}.sms-stop-row,.sms-provider-row{align-items:flex-start}.sms-diagnostics>div{grid-template-columns:1fr}.sms-report>div{grid-template-columns:1fr 1fr}.sms-history-head{align-items:flex-start}.sms-history-head .btn{min-height:40px}.container{padding-bottom:calc(86px + env(safe-area-inset-bottom))}}

/* MSG.AM provider card */
.msgam-card{margin-top:12px;padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)}.msgam-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.msgam-head h3{margin:2px 0 0;font-size:18px}.msgam-head small{display:block;margin-top:3px;color:var(--muted);font-size:10.5px;overflow-wrap:anywhere}.msgam-note{margin:10px 0}.msgam-checks{display:flex;gap:8px 14px;flex-wrap:wrap;margin:6px 0 12px}.msgam-checks label,.msgam-confirm{display:flex;align-items:center;gap:7px;font-size:12px;cursor:pointer}.msgam-checks input,.msgam-confirm input{width:18px;height:18px;accent-color:var(--accent)}.msgam-status-grid{display:grid;grid-template-columns:minmax(110px,.8fr) minmax(0,1.2fr);gap:6px 10px;padding:10px 11px;border:1px solid var(--border);border-radius:11px;background:var(--surface)}.msgam-status-grid span{font-size:11px;color:var(--muted)}.msgam-status-grid b{font-size:11px;overflow-wrap:anywhere}.msgam-status-grid b.msgam-balance-ok{color:var(--ok);font-weight:800;font-variant-numeric:tabular-nums}.msgam-actions{display:flex;justify-content:flex-end;margin-top:10px}.msgam-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}.msgam-test-send{margin-top:10px;border-top:1px solid var(--border);padding-top:9px}.msgam-test-send>summary{cursor:pointer;color:var(--accent);font-size:12.5px;font-weight:700}.msgam-test-send .sms-form{padding-top:10px}.msgam-test-send fieldset>.btn{width:100%;margin-top:10px}.msgam-ip{margin:10px 0 0}.msgam-confirm{margin:8px 0 2px;align-items:flex-start;line-height:1.4}@media(max-width:600px){.msgam-form .row{display:block}.msgam-actions .btn,.msgam-tools form,.msgam-tools .btn{width:100%}.msgam-tools{display:grid;grid-template-columns:1fr}.msgam-status-grid{grid-template-columns:1fr}.msgam-status-grid b{margin-bottom:3px}}

/* Mail migration: quick add of one old Mail.ru mailbox (task #96). */
.mig-quick{border:1.5px solid color-mix(in srgb,var(--ok) 34%,var(--border));background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--ok-soft) 48%,var(--surface)))}
.mig-quick-head{margin-bottom:12px}.mig-quick-head>div:first-child{display:flex;align-items:flex-start;gap:11px}.mig-quick-head h2{margin:0 0 4px;font-size:18px}
.mig-quick-pill{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:11px;background:var(--ok);color:#fff;font-weight:800;font-size:16px;line-height:1}
.mig-quick-fields{display:grid;grid-template-columns:1fr;gap:0}.mig-quick-fields>.field{width:100%;margin-bottom:11px}
.mig-quick-add{min-height:52px;margin-top:2px;font-size:15px;font-weight:750}
.mig-quick-note{margin:10px 0 0;line-height:1.45}
@media(min-width:721px){.mig-quick-head h2{font-size:20px}.mig-quick-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.mig-quick-fields>.field{margin-bottom:6px}.mig-quick-add{min-height:48px}}


/* Mail server: Users tab (task #97). One full address, one password, the
   default quota — the long mailbox form stays on the Mailboxes tab. */
.ms-users{border:1.5px solid color-mix(in srgb,var(--accent) 30%,var(--border));background:linear-gradient(145deg,var(--surface),color-mix(in srgb,var(--accent-soft) 45%,var(--surface)))}
.ms-users-head{margin-bottom:12px}
.ms-users-head>div:first-child{display:flex;align-items:flex-start;gap:11px;min-width:0}
.ms-users-head h2{margin:0 0 4px;font-size:18px}
.ms-users-pill{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:11px;background:var(--accent);color:#fff;font-weight:800;font-size:16px;line-height:1}
.ms-users-form>.field{margin-bottom:11px}
.ms-users-fields{display:grid;grid-template-columns:1fr;gap:0}
.ms-users-fields>.field{width:100%;margin-bottom:11px}
.ms-users-add{min-height:52px;margin-top:2px;font-size:15px;font-weight:750}
.ms-userlist{margin-top:2px}
.ms-userlist li>.grow b{font-size:14px;overflow-wrap:anywhere}
.ms-userlist li>.badge{flex:0 0 auto}
.ms-users-foot{margin:10px 0 0}
@media(min-width:721px){.ms-users-head h2{font-size:20px}.ms-users-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.ms-users-fields>.field{margin-bottom:6px}.ms-users-add{min-height:48px}}
@media(max-width:360px){.ms-users-head h2{font-size:17px}.ms-users-add{font-size:14.5px}.ms-userlist li{gap:8px}}

/* Mail -> Users: show/hide control inside both password inputs. The button
   and the extra right padding only switch on once app.js has bound them, so
   with JS unavailable the two fields keep exactly their previous box. */
.field>span.pw-field{position:relative;display:block;margin-bottom:0;font-size:inherit;font-weight:inherit;color:inherit}
.pw-field>input{display:block}
.pw-field.is-ready>input{padding-right:46px}
.pw-eye{display:none}
.pw-eye.is-ready{position:absolute;top:0;right:0;display:grid;place-items:center;width:44px;height:100%;padding:0;border:0;border-radius:0 11px 11px 0;background:transparent;color:var(--muted);cursor:pointer;-webkit-appearance:none;appearance:none}
.pw-eye.is-ready:hover{color:var(--accent)}
.pw-eye.is-ready:focus-visible{outline:2px solid var(--accent);outline-offset:-3px;border-radius:11px}
.pw-eye[aria-pressed="true"]{color:var(--accent)}
.pw-ico{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.pw-eye .pw-ico-off{display:none}
.pw-eye[aria-pressed="true"] .pw-ico-on{display:none}
.pw-eye[aria-pressed="true"] .pw-ico-off{display:block}

/* WebMail -> Settings: the old Mail.ru synchronisation block inside the
   connected mailbox card. Mobile first: the status line, the password
   field and the button stack in one column and fill the card, and only
   a wide screen lets the buttons shrink back to their own width. The
   CSP here forbids inline style, so every rule lives in this file. */
.wm-sync{margin-top:12px;padding-top:12px;border-top:1px solid var(--border);display:grid;gap:9px}
.wm-sync-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wm-sync-icon{flex:0 0 auto;width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:var(--accent-soft);color:var(--accent);font-size:15px}
.wm-sync-head b{flex:1 1 auto;min-width:0;font-size:13.5px}
.wm-sync-badge{flex:0 0 auto;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;border:1px solid var(--border);background:var(--surface-2);color:var(--muted)}
.wm-sync-badge.is-prepared{background:var(--accent-soft);color:var(--accent);border-color:transparent}
.wm-sync-badge.is-syncing{background:var(--accent);color:#fff;border-color:transparent}
.wm-sync-badge.is-synced{background:#e1f6e9;color:#2f8f56;border-color:transparent}
.wm-sync-badge.is-error{background:#fde6e9;color:#d1485f;border-color:transparent}
.wm-sync-hint,.wm-sync-note{margin:0;font-size:11.5px;line-height:1.45;color:var(--muted)}
.wm-sync-meta{display:grid;gap:3px;font-size:11.5px;color:var(--muted);word-break:break-word}
.wm-sync-err{color:var(--err)}
.wm-sync-form{display:grid;gap:10px;margin:0}
.wm-sync-form .field{margin-bottom:0}
.wm-sync-now{margin:0;display:grid}
.wm-sync-btn{width:100%;min-height:48px;font-size:14.5px;font-weight:750}
.wm-sync-fold>summary{list-style:none;cursor:pointer;padding:4px 0;font-size:12.5px;font-weight:650;color:var(--accent)}
.wm-sync-fold>summary::-webkit-details-marker{display:none}
.wm-sync-fold[open]>summary{margin-bottom:9px}
@media(min-width:721px){.wm-sync-btn{width:auto;min-width:260px;min-height:44px;font-size:14px}.wm-sync-now{justify-items:start}}

.wm-sync-page{padding:18px 20px 30px;max-width:760px}.wm-sync-page .wm-sync{margin-top:0;padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--surface)}.wm-sync-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.wm-sync-actions .btn{min-height:46px}
@media(max-width:900px){.wm-sync-page{padding:14px 16px 28px}.wm-sync-actions{display:grid}.wm-sync-actions .btn{width:100%}}

.wm-message-row{color:inherit;text-decoration:none;cursor:pointer}
.wm-open-message{padding:0 18px 28px;max-width:980px;margin:0 auto}
.wm-open-toolbar{padding:14px 0;border-bottom:1px solid var(--border)}
.wm-open-toolbar a{font-weight:700;color:var(--accent);text-decoration:none}
.wm-open-head{padding:20px 0 14px;border-bottom:1px solid var(--border)}
.wm-open-head h2{font-size:22px;line-height:1.25;margin:0 0 14px;overflow-wrap:anywhere}
.wm-open-meta{font-size:13px;color:var(--muted);margin-top:4px;overflow-wrap:anywhere}
.wm-open-meta strong{color:var(--text)}
.wm-open-date{font-size:12px;color:var(--muted);margin-top:8px}
.wm-open-attachments{margin:14px 0;padding:10px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;font-size:13px;overflow-wrap:anywhere}
.wm-open-body{padding:18px 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.55;color:var(--text)}
.wm-open-actions{position:relative;display:flex;justify-content:flex-end;padding:10px 0 18px}
.wm-open-action-options{position:absolute;right:0;bottom:calc(100% + 12px);display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.wm-open-action-options[hidden]{display:none!important}
.wm-action-trigger{width:56px;height:56px;display:grid;place-items:center;border:0;border-radius:50%;background:var(--accent);color:#fff;font-size:28px;box-shadow:0 8px 20px rgba(15,23,42,.2);cursor:pointer}
.wm-action-trigger:hover{filter:brightness(1.06)}
.wm-message-action{display:inline-flex;align-items:center;gap:12px;min-height:56px;color:var(--text);font-size:16px;font-weight:600;text-decoration:none}
.wm-message-action:hover{color:var(--accent)}\n.wm-message-action>span:first-child{display:none}
.wm-message-action-icon{width:56px;height:56px;flex:0 0 56px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#fff;font-size:25px;line-height:1;box-shadow:0 8px 20px rgba(15,23,42,.2)}
@media(max-width:720px){.wm-open-message~.wm-fab{display:none}.wm-open-message{padding:0 16px 110px}.wm-open-head{padding-top:16px}.wm-open-head h2{font-size:19px}.wm-open-body{font-size:15px}.wm-open-actions{position:fixed;right:16px;bottom:calc(72px + env(safe-area-inset-bottom));z-index:36;padding:0}.wm-action-trigger{width:56px;height:56px}.wm-message-action{gap:12px;min-height:56px}}

.wm-smtp{margin-top:18px;padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--surface);display:grid;gap:9px}
.wm-smtp-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wm-smtp-icon{flex:0 0 auto;width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:var(--accent-soft);color:var(--accent);font-size:15px}
.wm-smtp-head b{flex:1 1 auto;min-width:0;font-size:13.5px}
.wm-smtp-hint,.wm-smtp-note{margin:0;font-size:11.5px;line-height:1.45;color:var(--muted)}
.wm-smtp-form{display:grid;gap:10px;margin:0}
.wm-smtp-form .field{margin-bottom:0}
.wm-smtp-btn{width:100%;min-height:48px;font-size:14.5px;font-weight:750}
.wm-smtp-status{margin:0;display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--muted)}
.wm-smtp-badge{flex:0 0 auto;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;border:1px solid var(--border);background:var(--surface-2);color:var(--muted)}
@media(min-width:721px){.wm-smtp-btn{width:auto;min-width:260px;min-height:44px;font-size:14px}.wm-smtp-form{justify-items:start}.wm-smtp-form .field{width:100%}}

.wm-search-form{margin:0}.wm-search-form>label{display:flex;align-items:center;gap:10px;padding:0 13px;border-radius:11px;background:var(--surface-2);border:1px solid var(--border)}.wm-search-form input{flex:1;min-width:0}.wm-search-submit{border:0;background:transparent;color:var(--text);font:inherit;font-size:19px;line-height:1;padding:4px;cursor:pointer}.wm-search-count{font-size:12px;color:var(--muted);padding:0 2px 10px}.wm-search-results{border-top:1px solid var(--border);margin:0 -18px}.wm-search-results .wm-message-row{padding-left:18px;padding-right:18px}

.wm-attachment-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin:16px 0}.wm-attachment-card{position:relative;display:flex;align-items:center;gap:12px;min-height:82px;padding:10px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2);color:var(--text);text-decoration:none;overflow:hidden}.wm-attachment-card:hover{border-color:var(--accent);background:var(--surface)}.wm-attachment-preview{width:64px;height:64px;flex:0 0 64px;border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--surface)}.wm-attachment-preview img{width:100%;height:100%;object-fit:cover}.wm-pdf-badge{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#f15b4f;color:#fff;font-size:18px;font-weight:850;letter-spacing:.04em}.wm-file-badge{font-size:28px}.wm-attachment-info{min-width:0;display:flex;flex-direction:column;gap:5px}.wm-attachment-info b{font-size:13px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}.wm-attachment-info small{font-size:11px;color:var(--muted)}.wm-attachment-download{margin-left:auto;align-self:flex-end;font-size:18px;color:var(--accent);padding:4px}.wm-open-attachments{display:none}@media(max-width:720px){.wm-attachment-grid{grid-template-columns:1fr;gap:10px;margin:14px 0}.wm-attachment-card{min-height:88px}.wm-attachment-preview{width:70px;height:70px;flex-basis:70px}}

.wm-msg-clip{flex:0 0 auto;font-size:14px;line-height:1;color:var(--muted);opacity:.8;filter:grayscale(1)}

.wm-file-input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.wm-attach-zone{width:100%;min-height:84px;border:1.5px dashed var(--border);border-radius:14px;background:var(--surface-2);display:flex;align-items:center;gap:13px;padding:13px 15px;color:var(--text);text-align:left;cursor:pointer;transition:border-color .15s,background .15s,transform .15s}.wm-attach-zone:hover,.wm-compose-form.is-dragging .wm-attach-zone{border-color:var(--accent);background:var(--accent-soft)}.wm-compose-form.is-dragging .wm-attach-zone{transform:scale(1.008)}.wm-attach-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:var(--surface);font-size:23px;flex:0 0 auto}.wm-attach-zone>span:last-child{display:flex;flex-direction:column;min-width:0}.wm-attach-zone b{font-size:14px}.wm-attach-zone small{font-size:12px;color:var(--muted);margin-top:2px}.wm-attach-zone em{font-style:normal;font-size:10.5px;color:var(--muted);margin-top:4px}.wm-compose-files{display:grid;gap:8px;margin:10px 0 0}.wm-compose-file{display:flex;align-items:center;gap:10px;min-height:54px;padding:8px 10px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}.wm-compose-file-preview{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;border-radius:9px;background:var(--surface-2);overflow:hidden;font-size:19px}.wm-compose-file-preview img{width:100%;height:100%;object-fit:cover}.wm-compose-file-info{min-width:0;flex:1;display:flex;flex-direction:column}.wm-compose-file-info b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wm-compose-file-info small{font-size:10.5px;color:var(--muted);margin-top:2px}.wm-compose-file-remove{width:34px;height:34px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:18px;cursor:pointer}.wm-compose-file-remove:hover{background:var(--surface-2);color:var(--err)}
@media(max-width:720px){.wm-attach-zone{min-height:74px;padding:11px 12px}.wm-attach-zone small{display:none}.wm-attach-zone em{font-size:10px}.wm-compose-file{min-height:58px}}

/* WebMail settings sub-pages */
.wm-settings-page{padding:0 28px 34px;max-width:860px;margin:0 auto}.wm-settings-back{display:inline-flex;align-items:center;gap:5px;margin:6px 0 16px;color:var(--accent);font-weight:750;text-decoration:none}.wm-settings-card{border:1px solid var(--border);background:var(--surface);border-radius:16px;padding:18px;margin-bottom:14px}.wm-settings-card>h2{font-size:15px;margin:0 0 14px}.wm-settings-card>p{font-size:13px;color:var(--muted);line-height:1.45;margin:0 0 14px}.wm-profile-form{display:grid;gap:13px}.wm-profile-form textarea{min-height:110px;resize:vertical}.wm-pref-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--border)}.wm-pref-row:last-child{border-bottom:0}.wm-pref-row>span{display:flex;flex-direction:column;min-width:0}.wm-pref-row b{font-size:14px}.wm-pref-row small{font-size:12px;color:var(--muted);margin-top:3px}.wm-pref-play{min-width:88px;border:1px solid var(--accent);border-radius:999px;background:var(--accent-soft);color:var(--accent);padding:8px 12px;font-weight:750;cursor:pointer}.wm-pref-play:active{opacity:.75}.wm-pref-toggle{min-width:88px;border:1px solid var(--border);border-radius:999px;background:var(--surface-2);color:var(--muted);padding:8px 12px;font-weight:750;cursor:pointer}.wm-pref-toggle.is-on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}.wm-settings-list.is-subpage{padding:0}.wm-density-choices{display:flex;gap:10px}.wm-density-choices button{flex:1;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);color:var(--text);padding:12px;font-weight:750;cursor:pointer}.wm-density-choices button.is-active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.wm-info-card>div{display:flex;justify-content:space-between;gap:18px;padding:11px 0;border-bottom:1px solid var(--border)}.wm-info-card>div span{color:var(--muted);font-size:12px}.wm-info-card>div b{font-size:12px;text-align:right;overflow-wrap:anywhere}.wm-info-card>p{margin:14px 0 0}
.mail-compact .wm-message-row{padding-top:9px!important;padding-bottom:9px!important;min-height:66px}.mail-compact .wm-msg-avatar{width:42px!important;height:42px!important;flex-basis:42px!important}.mail-compact .wm-msg-subject,.mail-compact .wm-msg-from{font-size:12px!important}.mail-compact .wm-msg-line b{font-size:13px!important}
@media(max-width:720px){.wm-settings-page{padding:0 16px 28px}.wm-settings-card{padding:15px}.wm-pref-row{align-items:flex-start}.wm-pref-toggle,.wm-pref-play{min-width:82px}.wm-info-card>div{flex-direction:column;gap:4px}.wm-info-card>div b{text-align:left}.wm-density-choices{display:grid;grid-template-columns:1fr 1fr}}
/* WebMail long-press multi-select actions */
.wm-bulkbar{min-height:56px;display:flex;align-items:center;gap:10px;padding:8px 14px;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:18;box-shadow:0 5px 18px rgba(15,23,42,.06)}
.wm-bulkbar[hidden]{display:none!important}.wm-bulk-cancel{width:38px;height:38px;border:0;background:transparent;border-radius:10px;color:var(--text);font-size:27px;line-height:1}.wm-bulkbar>strong{min-width:32px;font-size:17px;color:var(--text)}
.wm-bulk-actions{margin-left:auto;display:flex;align-items:center;gap:4px}.wm-bulk-actions button{width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:10px;background:transparent;color:var(--text);font-size:20px;cursor:pointer}.wm-bulk-actions button:hover{background:var(--surface-2)}.wm-bulk-actions button.is-danger{color:var(--err)}
.wm-select-indicator{display:none;flex:0 0 auto;width:38px;height:38px;place-items:center;border-radius:50%;border:2px solid var(--border);color:transparent;font-size:18px;font-weight:800;background:var(--surface)}
.mail-selecting .wm-message-row .wm-msg-avatar{display:none}.mail-selecting .wm-message-row .wm-select-indicator{display:grid}.mail-selecting .wm-message-row.is-selected .wm-select-indicator{background:var(--accent);border-color:var(--accent);color:#fff}.mail-selecting .wm-message-row.is-selected{background:var(--accent-soft)}.mail-selecting .wm-fab{display:none!important}.wm-message-row{-webkit-user-select:none;user-select:none;touch-action:pan-y}
@media(max-width:900px){.wm-bulkbar{height:60px;padding:0 12px;gap:8px}.wm-bulk-actions{gap:1px}.wm-bulk-actions button{width:38px;height:38px;font-size:19px}.wm-bulk-cancel{width:36px}.mail-selecting .wm-filter-row{display:none}}

/* SKYNET inbox read/unread contrast, approved mobile design 2026-09-19 */
/* The IMAP-backed is-unread class is supplied by the existing template. */
.wm-message-row:not(.is-unread){background:var(--surface)}
.wm-message-row:not(.is-unread) .wm-msg-line b{font-weight:500}
.wm-message-row:not(.is-unread) .wm-msg-subject{font-weight:400;color:var(--text)}
.wm-message-row:not(.is-unread) .wm-msg-from,
.wm-message-row:not(.is-unread) .wm-msg-date{color:var(--muted)}
.wm-message-row.is-unread{
  background:linear-gradient(100deg,var(--accent-soft) 0%,var(--surface) 100%);
  box-shadow:inset 4px 0 0 var(--accent);
}
.wm-message-row.is-unread .wm-msg-line b{font-weight:800;color:var(--text)}
.wm-message-row.is-unread .wm-msg-subject{font-weight:750;color:var(--text)}
.wm-message-row.is-unread .wm-dot.blue{
  width:11px;height:11px;flex-shrink:0;
  background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);
}
.wm-message-row:focus-visible{
  outline:2px solid var(--accent);outline-offset:-3px;position:relative;z-index:1;
}
@media(max-width:900px){
  .wm-message-list{padding:7px 0 86px}
  .wm-message-list .wm-message-row,
  .wm-search-results .wm-message-row{
    margin:8px 10px;padding:15px 13px;
    min-height:90px;border:1px solid var(--border);border-radius:14px;
    gap:11px;overflow:hidden;
  }
  .wm-message-list .wm-message-row.is-unread,
  .wm-search-results .wm-message-row.is-unread{
    border-color:var(--border);
  }
  .wm-message-row .wm-msg-avatar{width:42px;height:42px}
  .wm-message-row .wm-msg-line b{font-size:14px}
  .wm-message-row .wm-msg-subject{font-size:13.5px}
  .wm-message-row .wm-msg-marks{min-width:14px}
  .wm-message-row .wm-msg-marks .wm-dot.blue{margin:0 2px}
  .mail-compact .wm-message-list .wm-message-row,
  .mail-compact .wm-search-results .wm-message-row{
    min-height:69px;padding-top:10px!important;padding-bottom:10px!important;
  }
}

/* SKYNET sound preview mobile button text fit 2026-09-19 */
.wm-pref-play{box-sizing:border-box;min-width:130px;max-width:100%;flex:0 0 auto;text-align:center;white-space:nowrap;font-size:13px;line-height:1.3;overflow:hidden;}
@media(max-width:720px){
  .wm-pref-row{gap:10px;}
  .wm-pref-row>span{flex:1 1 auto;min-width:0;overflow-wrap:anywhere;}
  .wm-pref-row>.wm-pref-play{flex:0 0 130px;min-width:130px;padding:10px 8px;}
}
@media(max-width:320px){.wm-pref-row>.wm-pref-play{flex-basis:116px;min-width:116px;font-size:12px;padding:10px 5px;}}


/* Direct camera capture for mailbox avatars. */
.wm-avatar-file-fallback{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none}
.wm-avatar-camera-panel{display:grid;gap:10px;width:100%}
.wm-avatar-camera-panel[hidden]{display:none!important}
.wm-avatar-camera-panel video{display:block;width:100%;max-height:42vh;min-height:210px;object-fit:cover;transform:scaleX(-1);background:#111;border-radius:12px}
.wm-avatar-camera-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wm-avatar-camera-actions .wm-avatar-action{min-height:44px;height:auto}
.wm-avatar-camera-cancel{min-height:44px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font-weight:700;cursor:pointer}
.wm-avatar-action:disabled{opacity:.5}

/* SKYNET Mail per-account camera / gallery avatar: small-screen safe. */
.wm-avatar img,.wm-account-avatar img,.wm-msg-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.wm-msg-avatar{position:relative;overflow:hidden}.wm-msg-avatar .wm-sender-initial{grid-area:1/1;line-height:1}.wm-msg-avatar img.wm-sender-domain-icon{position:absolute;inset:0;z-index:1;box-sizing:border-box;padding:4px;background:#fff;object-fit:contain;border:1px solid rgba(15,23,42,.08)}.wm-msg-avatar.has-sender-icon .wm-sender-initial{visibility:hidden}
.wm-profile-avatar-panel{display:grid;gap:13px;padding:18px;border:1px solid var(--border);border-radius:15px;background:var(--surface)}
.wm-profile-avatar-panel>b{font-size:15px}
.wm-profile-avatar-preview{width:100px;height:100px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);margin:0 auto}
.wm-profile-avatar-preview img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.wm-profile-avatar-initial{font-size:42px;font-weight:800}
.wm-profile-avatar-hint,.wm-avatar-privacy{margin:0;font-size:12px;color:var(--muted);line-height:1.5}
.wm-profile-avatar-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.wm-avatar-upload-form{display:flex;min-width:0;flex-direction:column;gap:10px;align-items:stretch}
.wm-avatar-action{position:relative;min-width:0;min-height:46px;display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 8px;box-sizing:border-box;border-radius:12px;border:1px solid var(--accent);background:var(--accent-soft);color:var(--accent);font-size:13px;font-weight:750;text-align:center;line-height:1.3;cursor:pointer}
.wm-avatar-action input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;font-size:0}
.wm-avatar-upload-preview{display:block;width:64px;height:64px;border-radius:50%;object-fit:cover;margin:0 auto}
.wm-avatar-upload-preview[hidden]{display:none}
.wm-avatar-submit{box-sizing:border-box;width:100%;padding:9px;border:0;border-radius:10px;background:var(--accent);color:#fff;font-weight:700;min-height:40px;cursor:pointer}
.wm-avatar-submit:disabled{opacity:.42;cursor:default}
.wm-avatar-delete button{background:none;border:0;color:var(--danger, #b33);padding:6px 0;font-weight:700;cursor:pointer}
@media(max-width:350px){.wm-profile-avatar-panel{padding:12px}.wm-profile-avatar-actions{gap:8px}.wm-avatar-action{font-size:12px;padding:9px 5px}}

/* SKYNET Mail avatar controls alignment 2026-09-19 */
.wm-profile-avatar-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
}
.wm-avatar-upload-form{
  display:flex;
  flex-direction:column;
  min-width:0;
  gap:10px;
}
.wm-avatar-upload-form .wm-avatar-action{
  height:60px;
  min-height:60px;
  width:100%;
  box-sizing:border-box;
  padding:8px 10px;
  line-height:1.3;
  text-wrap:balance;
  overflow-wrap:anywhere;
}
.wm-avatar-upload-form .wm-avatar-upload-preview[hidden]{display:none!important}
.wm-avatar-upload-form .wm-avatar-submit{
  height:44px;
  min-height:44px;
  width:100%;
  box-sizing:border-box;
  align-self:end;
  margin-top:auto;
}
@media(max-width:350px){
  .wm-profile-avatar-actions{gap:8px}
  .wm-avatar-upload-form .wm-avatar-action{padding:8px 5px;font-size:12px}
}

/* MSG.AM provider balance: low credit and transport failures are never shown as green. */
.sms-hero-balance.sms-balance-low,.msgam-status-grid b.sms-balance-low{color:#b42318}

/* SKYNET Center + SMS module: selected mobile concept 1 */
.center-home-v1{max-width:1020px;margin:0 auto 18px}
.center-home-hero{display:flex;align-items:center;gap:15px;padding:28px 24px;border-radius:21px;background:linear-gradient(125deg,#43239d,#7655de);color:#fff;box-shadow:var(--shadow)}
.center-home-hero h2{font-size:26px;margin:3px 0}.center-home-hero p{margin:0;color:#e9e1ff}
.center-home-hero .sms-eyebrow{color:#efe7ff}.center-logo{width:51px;height:51px;border-radius:16px;display:grid;place-items:center;font-weight:800;font-size:30px;color:#5033ba;background:#fff}
.center-home-services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-top:15px}
.center-service-card{min-width:0;min-height:164px;position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:20px;border:1px solid var(--border);border-radius:19px;background:var(--surface);box-shadow:var(--shadow);color:var(--text)}
.center-service-card strong{font-size:19px}.center-service-card small{line-height:1.4;color:var(--muted)}.center-service-card>b{position:absolute;right:15px;top:13px;color:var(--accent)}
.center-service-icon{height:45px;width:45px;display:grid;place-items:center;font-size:21px;color:var(--accent);background:var(--accent-soft);border-radius:14px}
.center-technical{max-width:1020px;margin:0 auto}.center-technical>summary{cursor:pointer;list-style:none;background:var(--surface);color:var(--muted);border:1px solid var(--border);border-radius:14px;padding:14px 17px;font-weight:700}
.center-technical>summary span{float:right}.center-technical-inner{margin-top:12px}
.sms-center-back{display:inline-flex;align-items:center;min-height:40px;margin:0 0 9px;padding:7px 12px;border-radius:11px;background:var(--accent-soft);color:var(--accent);font-size:13px;font-weight:750}
.sms-group-shortcut{margin-bottom:13px;padding:17px 19px;border-radius:18px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);display:grid;gap:12px}
.sms-group-shortcut h2{margin:3px 0;font-size:20px}.sms-group-shortcut p{margin:0;color:var(--muted);font-size:13px}
.sms-groups-chip-row{display:flex;gap:9px;flex-wrap:wrap}
.sms-groups-chip-row>a{min-width:112px;display:flex;gap:8px;align-items:center;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);color:var(--text);font-size:12px}
.sms-groups-chip-row>a span{color:var(--accent);font-size:19px}.sms-groups-chip-row>a small{color:var(--accent)}
.sms-group-shortcut>.btn{justify-self:start}
.sms-groups-page{max-width:780px;margin:0 auto;display:grid;gap:14px}
.sms-groups-intro{padding:9px 0}.sms-groups-intro h2{font-size:25px;margin:4px 0}.sms-groups-intro p{color:var(--muted);margin:0}
.sms-group-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sms-group-metrics>div{display:grid;gap:5px;padding:15px 17px;background:var(--surface);border:1px solid var(--border);border-radius:15px}.sms-group-metrics small{color:var(--muted)}.sms-group-metrics strong{font-size:24px}
.sms-billing-pending p{color:var(--muted);margin:0;font-size:13px}
.sms-group-list{display:grid;gap:8px;margin:12px 0}.sms-group-list>a{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--border);border-radius:13px;color:var(--text);background:var(--surface-2)}
.sms-group-list>a>span:nth-child(2){min-width:0;flex:1}.sms-group-list strong,.sms-group-list small{display:block;overflow-wrap:anywhere}.sms-group-list small{color:var(--muted);font-size:11px;margin-top:2px}
.sms-group-avatar{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border-radius:11px;color:var(--accent);background:var(--accent-soft)}
.sms-group-list b{color:var(--accent);font-variant-numeric:tabular-nums}.sms-group-list>a>span:last-child{color:var(--muted)}
.sms-center-hero{border-color:color-mix(in srgb,var(--accent) 35%,var(--border))}
#overview,#groups,#send,#bulk,#history,#providers,#campaigns,#reports{scroll-margin-top:90px}
@media(max-width:900px){.center-home-services{grid-template-columns:1fr 1fr;gap:10px}.center-home-hero{padding:20px}.center-home-hero h2{font-size:23px}.center-service-card{min-height:138px;padding:14px}.center-service-card strong{font-size:16px}.sms-only-nav{justify-content:space-around}.sms-only-nav>a,.sms-only-nav summary{font-size:10px;letter-spacing:-.03em}.sms-groups-page{padding-bottom:14px}}
@media(max-width:375px){.sms-only-nav>a,.sms-only-nav summary{font-size:9px}.sms-only-nav>a .ico,.sms-only-nav summary .ico{font-size:17px}}


/* Desktop mail: use the full workspace for folders and mail content. The mobile layout remains unchanged. */
@media (min-width: 901px) { .wm-workspace { grid-template-columns: 240px minmax(0, 1fr); } .wm-reading-pane { display: none; } }

/* Desktop mail: keep one search field on the Search page, not in the global header. */
@media (min-width: 901px) { .wm-searchbox { display: none; } .wm-top-actions { margin-left: auto; } }

.wm-list-actions .is-refreshing .wm-refresh-icon{color:var(--accent);animation:wm-refresh-spin .65s linear infinite}@keyframes wm-refresh-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.wm-list-actions .is-refreshing .wm-refresh-icon{animation:none}}

/* Desktop: let the unread accent follow the mobile card's rounded left edge. */
@media (min-width: 901px) {
  .wm-message-row.is-unread {
    border-radius: 14px;
    overflow: hidden;
    box-shadow: inset 4px 0 0 var(--accent);
  }
}

/* Date and time remain readable without crowding the sender. */
.wm-msg-date{white-space:pre-line;text-align:right;line-height:1.35}

/* Compact date column: the time no longer increases the sender line height. */
.wm-msg-line{position:relative;padding-right:94px;min-height:19px}
.wm-msg-date{position:absolute;right:0;top:1px;display:flex;flex-direction:column;align-items:flex-end;gap:3px;white-space:nowrap;line-height:1.15;font-variant-numeric:tabular-nums}
.wm-date-day{font-size:11px;font-weight:600;color:var(--muted)}
.wm-date-time{font-size:10px;font-weight:400;color:var(--muted);opacity:.72}
.wm-date-today{font-size:11px;font-weight:500;color:var(--muted)}
.wm-msg-subject{padding-right:78px}

/* Avatar import status and single save action. */
.wm-avatar-status{margin:0;font-size:12px;color:var(--muted);line-height:1.45}
.wm-avatar-submit{margin-top:2px}

/* Recent recipient suggestions in WebMail compose */
.wm-recipient-field{position:relative;z-index:3}
.wm-recipient-field:focus-within{z-index:12}
.wm-recipient-suggestions{position:absolute;left:0;right:0;top:calc(100% - 10px);z-index:20;max-height:min(360px,45vh);overflow:auto;padding:6px;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:0 14px 34px rgba(25,20,50,.16)}
.wm-recipient-suggestions[hidden]{display:none!important}
.wm-recipient-option{width:100%;min-height:56px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;padding:9px 12px;border:0;border-radius:10px;background:transparent;color:var(--text);text-align:left;cursor:pointer}
.wm-recipient-option:hover,.wm-recipient-option[aria-selected="true"]{background:var(--surface-2)}
.wm-recipient-option strong{font-size:14px;font-weight:700;line-height:1.25}
.wm-recipient-option span{max-width:100%;overflow:hidden;color:var(--muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}

/* Desktop WebMail scroll panes must stay inside the fixed-height grid. */
@media (min-width: 901px) { .wm-sidebar, .wm-mainpane, .wm-reading-pane { min-height: 0; overscroll-behavior: contain; } }


/* SKYNET Mail compose send action in the heading */
.wm-compose-head{display:flex;align-items:center;justify-content:space-between;gap:14px;position:sticky;top:0;z-index:12;background:var(--surface)}
.wm-compose-head>div{min-width:0}
.wm-compose-head h1{margin:0}
.wm-send-top{flex:0 0 auto;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:0 18px;border:0;border-radius:13px;background:linear-gradient(135deg,var(--accent),#168b91);color:#fff;font:inherit;font-size:14px;font-weight:750;box-shadow:0 7px 18px color-mix(in srgb,var(--accent) 25%,transparent);cursor:pointer;transition:transform .15s,filter .15s,box-shadow .15s}
.wm-send-top:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 10px 22px color-mix(in srgb,var(--accent) 30%,transparent)}
.wm-send-top:active{transform:translateY(0)}
.wm-send-top:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 40%,transparent);outline-offset:3px}
.wm-send-top:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}
.wm-send-top svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.wm-compose-actions{padding-top:3px}
@media(max-width:900px){.wm-compose-head{padding:12px 14px;min-height:68px}.wm-send-top{min-height:44px;padding:0 14px;border-radius:13px;font-size:13px}.wm-send-top svg{width:18px;height:18px}.wm-compose-form{padding:16px}}


/* Icon-only send action requested by the owner */
.wm-send-top{width:50px;height:50px;min-height:50px;padding:0;gap:0;border-radius:15px;font-size:0}
.wm-send-top svg{width:23px;height:23px}
@media(max-width:900px){.wm-send-top{width:50px;height:50px;min-height:50px;padding:0;border-radius:15px}.wm-send-top svg{width:23px;height:23px}}

/* Mobile mail compose: show the send plane without a colored square */
@media(max-width:900px){
  .wm-send-top,.wm-send-top:hover,.wm-send-top:active{background:transparent;box-shadow:none;color:var(--accent);filter:none;transform:none}
  .wm-send-top:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 35%,transparent);outline-offset:2px}
}


/* Mobile compose floating button: pencil only */
@media(max-width:900px){
  .wm-fab{width:56px;min-width:56px;height:56px;padding:0;border-radius:50%}
  .wm-fab b{display:none}
  .wm-fab span{font-size:25px}
}

/* SKYNET Mail inbox readability: designer 1 variant, Android and mobile web. */
@media (max-width: 900px) {
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title {
    box-sizing: border-box; height: auto; min-height: 88px; margin: 12px 14px 8px;
    padding: 14px 16px; gap: 12px; border: 1px solid #e7def7; border-radius: 20px;
    background: linear-gradient(135deg, #f3edff 0%, #ffffff 100%);
    box-shadow: 0 6px 18px rgba(73, 45, 112, .08);
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title h1 { font-size: 27px; line-height: 1.12; font-weight: 800; letter-spacing: -.025em; }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title>div:nth-child(2)>span {
    min-width: 30px; min-height: 30px; display: inline-flex; align-items: center; justify-content: center;
    box-sizing: border-box; padding: 0 8px; border-radius: 999px; background: #6a35c6;
    color: #fff; font-size: 16px; font-weight: 800;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-menu { font-size: 25px; width: 32px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-actions { gap: 8px !important; }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-actions a,
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-actions button { width: 42px; height: 42px; display: grid; place-items: center; font-size: 24px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-filter-row { gap: 9px; padding: 8px 14px 12px; border-bottom: 0; background: transparent; }
  .wm-mainpane[data-mail-section="inbox"] .wm-filter-row a { min-height: 42px; padding: 0 15px; font-size: 14px; font-weight: 700; }
  .wm-mainpane[data-mail-section="inbox"] .wm-filter-row a.active { background: #6a35c6; border-color: #6a35c6; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-list .wm-message-row {
    min-height: 112px; margin: 8px 12px; padding: 17px 15px; gap: 13px; border-radius: 18px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-avatar { width: 52px; height: 52px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-line b { font-size: 17px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-subject { font-size: 16px; line-height: 1.3; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-from { font-size: 14px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-date { font-size: 13px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-date-day { font-size: 13px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-date-time { font-size: 12px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-line { padding-right: 74px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-subject { padding-right: 56px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-marks { min-width: 12px; }
}
@media (max-width: 360px) {
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title { margin-left: 10px; margin-right: 10px; padding: 12px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title h1 { font-size: 24px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-list .wm-message-row { margin-left: 9px; margin-right: 9px; padding-left: 12px; padding-right: 12px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-avatar { width: 46px; height: 46px; }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-line b { font-size: 15px; }
}

/* Inbox header: keep the complete folder name visible on narrow phones. */
@media (max-width: 900px) {
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title {
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 10px;
    row-gap: 0;
    height: auto;
    min-height: 82px;
    padding: 12px 14px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-menu {
    flex: 0 0 32px;
    width: 32px;
    text-align: center;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title > div:nth-child(2) {
    display: flex !important;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px !important;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title h1 {
    max-width: 100%;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
    font-size: clamp(19px, 6.2vw, 26px);
    line-height: 1.12;
    letter-spacing: -.02em;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title > div:nth-child(2) > span {
    min-width: 0;
    min-height: 22px;
    padding: 0 8px;
    font-size: 13px;
    line-height: 1;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-actions {
    gap: 4px !important;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-actions a,
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-actions button {
    width: 36px;
    height: 40px;
    padding: 0;
  }
}
@media (max-width: 360px) {
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title {
    grid-template-columns: 30px minmax(0, 1fr) auto;
    column-gap: 7px;
    padding-left: 11px;
    padding-right: 11px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title h1 {
    font-size: clamp(18px, 6vw, 22px);
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-actions a,
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-actions button {
    width: 33px;
  }
}

@media (max-width: 900px) {
  .wm-mainpane[data-mail-section="inbox"] .wm-mobile-title > div:nth-child(2) > span {
    max-width: 100%; white-space: nowrap; font-size: 12px;
  }
}


/* Restore the compact inbox message-card sizing from the earlier mobile layout. */
@media (max-width: 900px) {
  .wm-mainpane[data-mail-section="inbox"] .wm-message-list .wm-message-row {
    min-height: 90px;
    margin: 8px 10px;
    padding: 15px 13px;
    gap: 11px;
    border-radius: 14px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-avatar {
    width: 42px; height: 42px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-line b {
    font-size: 14px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-subject {
    font-size: 13.5px; line-height: 1.3;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-from {
    font-size: 11.5px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-date,
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-date-day {
    font-size: 11px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-date-time {
    font-size: 10px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-line {
    padding-right: 94px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-subject {
    padding-right: 78px;
  }
}
@media (max-width: 360px) {
  .wm-mainpane[data-mail-section="inbox"] .wm-message-list .wm-message-row {
    margin: 8px 10px; padding: 15px 13px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-avatar {
    width: 42px; height: 42px;
  }
  .wm-mainpane[data-mail-section="inbox"] .wm-message-row .wm-msg-line b {
    font-size: 14px;
  }
}

/* Task 452: preserve email tables instead of stacking their cells as plain text. */
.wm-open-message{box-sizing:border-box;width:100%;min-width:0}
.wm-open-body.wm-open-html{white-space:normal;overflow-x:auto;overflow-wrap:anywhere}
.wm-open-html p{margin:0 0 1em}
.wm-open-html div{max-width:100%}
.wm-open-html h1,.wm-open-html h2,.wm-open-html h3,.wm-open-html h4,.wm-open-html h5,.wm-open-html h6{margin:1em 0 .5em;line-height:1.3}
.wm-open-html table{width:100%;max-width:100%;border-collapse:collapse;margin:12px 0;font:inherit}
.wm-open-html td,.wm-open-html th{padding:8px 10px;border:1px solid var(--border);white-space:normal;overflow-wrap:anywhere;vertical-align:top;color:inherit;font-size:inherit;text-align:left}
.wm-open-html th{font-weight:700;background:var(--surface-2)}
.wm-open-html table table{margin:0}
.wm-open-html ul,.wm-open-html ol{margin:0 0 1em;padding-left:24px}
.wm-open-html blockquote{margin:12px 0;padding:4px 14px;border-left:3px solid var(--border);color:var(--muted)}
.wm-open-html pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--surface-2);padding:12px;border-radius:8px}
.wm-open-html a{color:var(--accent);text-decoration:underline}
@media(max-width:900px){.wm-open-html table{min-width:560px}.wm-open-html table table{min-width:0}}

/* Mail desktop window auto-fit: keep the workspace inside the current window
   and let long messages scroll within the reading area. */
@media (min-width: 901px) {
  .mail-host .main {
    height: 100dvh; min-height: 0; overflow: hidden;
    display: flex; flex-direction: column;
  }
  .mail-host .container {
    flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column;
  }
  .mail-host .wm-app {
    flex: 1 1 auto; height: auto; min-height: 0; display: flex; flex-direction: column;
    overflow: hidden;
  }
  .wm-topbar { flex: 0 0 64px; min-height: 64px; }
  .wm-workspace {
    height: auto; min-height: 0; flex: 1 1 auto;
    grid-template-columns: clamp(210px, 18vw, 280px) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr); overflow: hidden;
  }
  .wm-mainpane {
    min-width: 0; min-height: 0; height: auto; max-height: 100%;
    overflow-y: auto; overscroll-behavior-y: contain;
  }
  .wm-open-message {
    width: 100%; max-width: min(100%, 1200px);
    padding-left: clamp(16px, 2vw, 32px);
    padding-right: clamp(16px, 2vw, 32px);
  }
  .wm-open-body, .wm-open-html { max-width: 100%; overflow-wrap: anywhere; }
  .wm-open-html img, .wm-open-html video {
    max-width: 100% !important; height: auto !important;
  }
  .wm-open-html table { max-width: 100%; }
}
@media (max-width: 900px) {
  .wm-open-html img, .wm-open-html video {
    max-width: 100% !important; height: auto !important;
  }
}


/* Mail desktop: explicit visible scrolling for the folder rail and message list. */
@media (min-width: 901px) {
  .mail-host .wm-sidebar,
  .mail-host .wm-mainpane {
    min-height: 0;
    overflow-y: scroll !important;
    scrollbar-gutter: stable;
    scrollbar-width: auto;
    scrollbar-color: #8972b2 #f2eff7;
  }
  .mail-host .wm-sidebar::-webkit-scrollbar,
  .mail-host .wm-mainpane::-webkit-scrollbar { width: 14px; display: block; }
  .mail-host .wm-sidebar::-webkit-scrollbar-track,
  .mail-host .wm-mainpane::-webkit-scrollbar-track { background: #f2eff7; border-radius: 8px; }
  .mail-host .wm-sidebar::-webkit-scrollbar-thumb,
  .mail-host .wm-mainpane::-webkit-scrollbar-thumb { background: #8972b2; border: 3px solid #f2eff7; border-radius: 8px; }
  .mail-host .wm-sidebar::-webkit-scrollbar-thumb:hover,
  .mail-host .wm-mainpane::-webkit-scrollbar-thumb:hover { background: #68459c; }
}

/* Explicit, localized attachment download action */
.wm-attachment-card{display:grid;grid-template-columns:70px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;gap:6px 12px;min-height:100px}
.wm-attachment-preview{grid-column:1;grid-row:1 / span 2;width:70px;height:70px;flex-basis:70px}
.wm-attachment-info{grid-column:2;grid-row:1}
.wm-attachment-download{grid-column:2;grid-row:2;justify-self:start;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;margin:0;padding:0 14px;border:0;border-radius:10px;background:var(--accent);color:#fff;text-decoration:none;font-size:13px;font-weight:750;white-space:nowrap;cursor:pointer}
.wm-attachment-download:hover{filter:brightness(.94);color:#fff}
.wm-attachment-download:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 35%,transparent);outline-offset:2px}
.wm-attachment-download svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:720px){.wm-attachment-card{min-height:104px}.wm-attachment-preview{width:70px;height:70px;flex-basis:70px}.wm-attachment-download{min-height:42px}}

/* Preview and download actions for mail attachments */
.wm-attachment-actions{grid-column:2;grid-row:2;display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.wm-attachment-download,.wm-attachment-open{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;margin:0;padding:0 12px;border:1px solid var(--accent);border-radius:10px;background:var(--accent);color:#fff;text-decoration:none;font-size:13px;font-weight:750;white-space:nowrap;cursor:pointer}
.wm-attachment-open{background:var(--surface);color:var(--accent)}
.wm-attachment-open:hover{border-color:var(--accent);background:var(--surface-2);color:var(--accent)}
.wm-attachment-download:hover{filter:brightness(.94);color:#fff}
.wm-attachment-download:focus-visible,.wm-attachment-open:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.wm-attachment-actions svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:720px){.wm-attachment-actions a{min-height:42px;padding:0 10px;font-size:12px}}

/* Keep Open and Download buttons in one aligned, equal-width row */
.wm-attachment-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;align-items:stretch;gap:8px}
.wm-attachment-actions a{grid-column:auto;grid-row:auto;justify-self:stretch;align-self:stretch;width:100%;min-width:0;box-sizing:border-box;padding:0 6px}
.wm-attachment-actions a span{overflow:hidden;text-overflow:ellipsis}
@media(max-width:720px){.wm-attachment-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.wm-attachment-actions a{min-height:42px;padding:0 5px;font-size:12px}}

/* Desktop attachment cards: give filenames and actions enough room. */
@media (min-width: 721px) {
  .wm-attachment-grid { grid-template-columns: minmax(0, 1fr); }
  .wm-attachment-actions { grid-template-columns: repeat(2, minmax(0, 220px)); width: 100%; }
  .wm-attachment-actions a:only-child { grid-column: 1 / -1; justify-self: start; max-width: 220px; }
}


/* Desktop-only Open action for file types browsers cannot preview inline. */
.wm-attachment-open.is-desktop-only { display: none; }
@media (min-width: 721px) { .wm-attachment-open.is-desktop-only { display: inline-flex; } }