:root {
  /* MAX brandbook: https://go.max.ru/brandbook; dark surfaces keep dense text readable. */
  --bg: #0d001a;
  --panel: #19161f;
  --panel-2: #24202e;
  --sidebar: #15121c;
  --hover: #30293f;
  --active: #35225d;
  --active-hover: #432d74;
  --bubble-in: #211b2d;
  --bubble-out: #33234f;
  --text: #f5f1ff;
  --muted: #b7acc9;
  --accent: #b598ff;
  --badge: #6548ce;
  --line: rgba(196, 176, 226, .14);
  --border: #484052;
  --field: #15111e;
  --selected-text: #e2d8f8;
  --primary-gradient: linear-gradient(108deg, #471aff 0%, #6e1aff 54%, #9500ff 100%);
  --primary-hover-gradient: linear-gradient(108deg, #592fff 0%, #7c32ff 54%, #a020ff 100%);
  --progress-gradient: linear-gradient(90deg, #00bfff, #a46cff);
  --scrollbar: #42384f;
  --scrollbar-hover: #574869;
  --success: #87dda9;
  --warning: #f1c778;
  --danger: #ff9cad;
  --danger-fill: #b93f65;
  --danger-hover: #a73359;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --rail-w: 320px;
  color-scheme: dark;
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

body {
  margin: 0;
  font: 15px/1.45 var(--sans);
  color: var(--text);
  background: var(--bg);
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}

button, input { font: inherit; color: inherit; }

button {
  border: 0;
  background: var(--primary-gradient);
  color: #fff;
  padding: 7px 16px;
  border-radius: 6px;
  cursor: pointer;
}
button:hover:not(:disabled) { background: var(--primary-hover-gradient); }
button:disabled { opacity: .35; cursor: default; }
button.ghost { background: transparent; color: var(--muted); padding: 7px 12px; }
button.ghost:hover:not(:disabled) { background: var(--hover); color: var(--text); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

input[type="search"], input[type="password"] {
  border: 1px solid transparent;
  border-radius: 18px;
  padding: 8px 14px;
  background: var(--panel-2);
  color: var(--text);
  width: 100%;
}
input::placeholder { color: var(--muted); }
input:focus { outline: none; border-color: var(--accent); }
input[type="checkbox"], input[type="radio"] { accent-color: #7956e8; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--scrollbar); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--scrollbar-hover); }
::-webkit-scrollbar-track { background: transparent; }
* { scrollbar-width: thin; scrollbar-color: var(--scrollbar) transparent; }

.avatar {
  flex: none;
  width: 46px; height: 46px;
  border-radius: 50%;
  display: grid; place-items: center;
  color: #fff; font-weight: 500; font-size: 18px;
  user-select: none;
}
.avatar.small { width: 38px; height: 38px; font-size: 15px; }

/* ---------------------------------------------------------------- enter */

.gate { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.gate-card {
  width: min(360px, 100%);
  background: var(--panel);
  border-radius: 12px;
  padding: 32px;
}
.gate-card h1 { font-size: 20px; margin: 0 0 6px; font-weight: 500; }
.gate-card p { color: var(--muted); margin: 0 0 22px; font-size: 14px; }
.gate-card label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.gate-card button { width: 100%; margin-top: 18px; padding: 10px; }
.error { color: var(--danger); font-size: 13px; margin: 10px 0 0; }

/* ---------------------------------------------------------------- header */

.shell { display: flex; flex-direction: column; height: 100vh; }

.top { background: var(--panel); border-bottom: 1px solid var(--line); padding: 10px 16px 0; flex: none; }
.top-line { display: flex; align-items: center; gap: 12px; }
.brand { font-weight: 500; font-size: 15px; }
.top-actions { margin-left: auto; display: flex; gap: 4px; }
.auto-files-toggle {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: var(--muted);
  font-size: 13px;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.auto-files-toggle:hover {
  color: var(--text);
  background: rgba(255,255,255,.035);
  border-color: var(--line);
}
.auto-files-toggle input {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  width: 34px;
  height: 18px;
  margin: 0;
  flex: 0 0 auto;
  border: 1px solid #645775;
  border-radius: 999px;
  background: #3a3248;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease;
}
.auto-files-toggle input::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #d5cbe1;
  transition: transform .18s ease, background .18s ease;
}
.auto-files-toggle input:checked {
  background: var(--primary-gradient);
  border-color: #9276ff;
}
.auto-files-toggle input:checked::after {
  transform: translateX(16px);
  background: #fff;
}
.auto-files-toggle:has(input:checked) {
  color: var(--text);
}

.link { font-size: 12.5px; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.link::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.link[data-state="on"] { color: var(--success); }
.link[data-state="on"]::before { background: var(--success); }

.accounts { display: flex; gap: 8px; overflow-x: auto; padding: 10px 0; }
.account {
  flex: 0 0 auto;
  background: var(--panel-2);
  border-radius: 10px;
  padding: 7px 14px 7px 8px;
  color: var(--text);
  display: flex; align-items: center; gap: 10px;
  text-align: left;
}
.account:hover:not(:disabled) { background: var(--hover); }
.account[aria-pressed="true"] { background: var(--active); }
.account[aria-pressed="true"]:hover:not(:disabled) { background: var(--active-hover); }
.account .lines { display: grid; }
.account .name { font-size: 14px; font-weight: 500; }
.sub { font-size: 12px; color: var(--muted); }
.account[aria-pressed="true"] .sub { color: var(--selected-text); }
.account.broken .name { color: var(--danger); }
.account .badge {
  font-size: 12px; font-weight: 600; color: #fff; background: var(--badge);
  border-radius: 10px; padding: 1px 7px; min-width: 20px; text-align: center;
}
.account[aria-pressed="true"] .badge { background: #fff; color: var(--active); }

/* ---------------------------------------------------------------- body */

.shell > .body { flex: 1; display: grid; grid-template-columns: var(--rail-w) 1fr; min-height: 0; }

.rail { background: var(--panel); display: flex; flex-direction: column; min-height: 0; }
.rail-head { padding: 10px 12px; display: flex; gap: 8px; align-items: center; }
.rail-head button { flex: none; }

.dialogs { overflow-y: auto; flex: 1; padding: 0 6px 8px; }
.dialog {
  display: flex; align-items: center; gap: 11px;
  width: 100%; text-align: left; background: none; color: var(--text);
  border-radius: 10px; padding: 8px 9px; margin-bottom: 1px;
}
.dialog:hover { background: var(--hover); }
.dialog[aria-pressed="true"] { background: var(--active); }
.dialog-main { flex: 1; min-width: 0; display: grid; gap: 3px; }
.dialog .row { display: flex; align-items: center; gap: 8px; }
.dialog .title {
  font-weight: 500; font-size: 14.5px; flex: 1;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dialog .time { font-size: 12px; color: var(--muted); flex: none; }
.dialog .snippet {
  font-size: 13px; color: var(--muted); flex: 1;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dialog .count {
  flex: none; font-size: 12px; font-weight: 600; color: #fff; background: var(--badge);
  border-radius: 11px; padding: 1px 7px; min-width: 21px; text-align: center;
}
.dialog[aria-pressed="true"] .time,
.dialog[aria-pressed="true"] .snippet { color: var(--selected-text); }
.dialog[aria-pressed="true"] .count { background: #fff; color: var(--active); }

/* ---------------------------------------------------------------- messages */

.pane { display: flex; flex-direction: column; min-height: 0; background: var(--bg); }
.pane-head {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 16px; background: var(--panel); border-bottom: 1px solid var(--line);
}
.pane-title { flex: 1; min-width: 0; }
.pane-title h2 {
  font-size: 15px; font-weight: 500; margin: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pane-title p { margin: 0; font-size: 12.5px; color: var(--muted); }
.pane-actions { display: flex; gap: 4px; }
.back { display: none; }

.messages { flex: 1; overflow-y: auto; padding: 14px 16px 24px; }
.empty { color: var(--muted); text-align: center; margin-top: 18vh; font-size: 14px; }

.msg {
  max-width: min(70%, 62ch);
  background: var(--bubble-in);
  border-radius: 12px;
  padding: 6px 11px 5px;
  margin-bottom: 3px;
  width: fit-content;
}
.msg.out { background: var(--bubble-out); margin-left: auto; }
.msg .who { font-size: 13.5px; font-weight: 500; color: var(--accent); display: block; }
.msg.out .who { display: none; }
.msg .text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14.5px; }
.msg .when { font-size: 11.5px; color: var(--muted); text-align: right; margin-top: 1px; }
.msg.out .when { color: #cbbde6; }
.msg .attach { margin-top: 4px; font-size: 13.5px; }
.msg .attach a { color: var(--accent); }
.msg .attach button { background: rgba(255,255,255,.08); color: var(--text); padding: 5px 11px; font-size: 13px; }
.msg .attach button:hover { background: rgba(255,255,255,.14); }
.msg img { max-width: 100%; border-radius: 8px; margin-top: 5px; display: block; }
.msg .where { font-size: 12px; color: var(--muted); margin-top: 3px; }

.day { text-align: center; margin: 14px 0 8px; }
.day span {
  background: rgba(0, 0, 0, .35); color: #ded4ed;
  font-size: 12.5px; padding: 3px 12px; border-radius: 12px;
}

/* ---------------------------------------------------------------- uploads and notifications */

.jobs-open { display: inline-flex; align-items: center; gap: 6px; }
.jobs-badge {
  min-width: 18px; height: 18px; padding: 0 5px; border-radius: 10px;
  display: inline-grid; place-items: center; background: var(--badge); color: #fff;
  font-size: 11px; font-weight: 700;
}

.jobs-mini {
  position: fixed; left: 16px; bottom: 14px; z-index: 40;
  width: min(340px, calc(100vw - 32px)); display: grid; gap: 7px;
}
.job-mini {
  width: 100%; text-align: left; background: rgba(36,32,46,.96);
  border: 1px solid var(--line); box-shadow: 0 10px 30px rgba(0,0,0,.28);
  border-radius: 10px; padding: 9px 11px;
}
.job-mini:hover:not(:disabled) { background: var(--hover); }
.job-mini-top { display: flex; align-items: center; gap: 8px; }
.job-mini .name {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 12.5px; font-weight: 500;
}
.job-mini .pct { flex: none; color: var(--accent); font-size: 12px; }
.job-mini .note {
  color: var(--muted); font-size: 11.5px; margin-top: 3px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.job-mini .bar, .job .bar {
  height: 4px; background: rgba(255,255,255,.12); margin-top: 7px;
  border-radius: 3px; overflow: hidden;
}
.job-mini .bar i, .job .bar i {
  display: block; height: 100%; background: var(--progress-gradient); transition: width .2s;
}
.job-mini .bar i.indeterminate, .job .bar i.indeterminate {
  animation: task-indeterminate 1.2s ease-in-out infinite alternate;
}
@keyframes task-indeterminate {
  from { transform: translateX(-25%); }
  to { transform: translateX(430%); }
}

.task-center {
  background: var(--panel); color: var(--text); border: 1px solid var(--border);
  border-radius: 16px; padding: 20px; width: min(900px, 100%);
  max-height: 90vh; overflow: hidden; display: flex; flex-direction: column;
  box-shadow: 0 20px 80px #0008;
}
.task-center h2 { margin: 0 0 3px; font-size: 19px; }
.task-center .jobs {
  margin-top: 14px; overflow-y: auto; display: grid; gap: 9px; min-height: 80px;
  padding-right: 2px;
}
.tasks-empty {
  color: var(--muted); text-align: center; padding: 42px 18px;
  border: 1px dashed var(--line); border-radius: 10px;
}
.job { background: var(--panel-2); border-radius: 10px; padding: 11px 12px; font-size: 13px; border: 1px solid var(--line); }
.job .head { display: flex; align-items: center; gap: 8px; }
.job .name { flex: 1; min-width: 0; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-status {
  flex: none; border-radius: 10px; padding: 2px 7px; color: var(--muted);
  background: rgba(255,255,255,.06); font-size: 11px;
}
.job-status.running { color: var(--accent); }
.job-status.failed { color: var(--danger); }
.job-status.done { color: var(--success); }
.job .delete-task { flex: none; color: var(--danger); font-size: 12px; padding: 5px 8px; }
.job .note { margin-top: 4px; font-size: 12px; color: var(--accent); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job .stop { margin-top: 7px; margin-right: 6px; padding: 4px 10px; font-size: 12.5px; }
.job .links { margin-top: 7px; display: flex; gap: 12px; flex-wrap: wrap; }
.job a { color: var(--accent); }
.job.failed { box-shadow: inset 3px 0 0 var(--danger); }
.job.failed .name { color: var(--danger); }

.toasts {
  position: fixed; right: 12px; bottom: 12px; z-index: 30;
  display: grid; gap: 6px;
  width: min(290px, calc(100vw - 24px));
  pointer-events: none;
}
.toast {
  position: relative;
  min-width: 0;
  background: var(--panel-2);
  border: 1px solid rgba(255,255,255,.055);
  border-radius: 8px;
  padding: 8px 32px 8px 10px;
  display: flex; gap: 8px; align-items: flex-start;
  box-shadow: 0 8px 26px rgba(0,0,0,.24);
  pointer-events: auto;
}
.toast:hover { background: var(--hover); }
.toast .lines { min-width: 0; flex: 1; }
.toast .from { font-weight: 600; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.toast .toast-body { margin-top: 2px; font-size: 11.5px; line-height: 1.25; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.toast .sub { font-size: 10.5px; }
.toast-close {
  position: absolute; top: 4px; right: 5px;
  width: 22px; height: 22px; padding: 0;
  display: grid; place-items: center;
  border: 0; border-radius: 5px; background: transparent;
  color: var(--muted); font-size: 18px; line-height: 1; cursor: pointer;
}
.toast-close:hover { background: rgba(255,255,255,.08); color: var(--text); }
.toast.alert { box-shadow: inset 3px 0 0 var(--danger), 0 8px 26px rgba(0,0,0,.24); }
.toast.alert .toast-body { white-space: normal; overflow: visible; }

/* Toast geometry reset. Keep notifications content-sized even if an older cached JS uses class="body". */
.toast {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  align-self: start;
}
.toast .lines,
.toast .toast-body,
.toast .body {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
.toast .body {
  display: block !important;
  margin-top: 2px;
  font-size: 11.5px;
  line-height: 1.25;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.toasts { align-items: start; }

/* ---------------------------------------------------------------- window */

@media (max-width: 760px) {
  .shell > .body { grid-template-columns: 1fr; }
  .shell[data-view="chat"] .rail { display: none; }
  .shell[data-view="chat"] .back { display: inline-block; }
  .shell[data-view="rail"] .pane { display: none; }
  .msg { max-width: 85%; }
  .pane-actions { gap: 0; }
  .toasts { right: 8px; bottom: 8px; width: min(290px, calc(100vw - 16px)); }
  .jobs-mini { width: calc(100vw - 32px); }
}

@media (prefers-reduced-motion: no-preference) {
  .toast, .job, .job-mini { animation: rise .16s ease-out; }
  @keyframes rise { from { transform: translateY(6px); opacity: 0; } }
}

.bulk-export { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 8px 0 12px; font-size: 13px; }
.bulk-export label { display: inline-flex; align-items: center; gap: 6px; }
.bulk-export input[type="number"] { width: 95px; padding: 6px 8px; }
.bulk-export input[type="checkbox"] { width: auto; }
.job .links { flex-wrap: wrap; }

.export-overlay{position:fixed;inset:0;z-index:1000;background:#000a;display:flex;align-items:center;justify-content:center;padding:16px}
.export-overlay[hidden]{display:none}
.export-settings{background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:16px;padding:22px;width:min(860px,100%);max-height:90vh;overflow:auto;box-shadow:0 20px 80px #0008}
.settings-top,.export-fields{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.export-fields label{display:flex;flex-direction:column;gap:6px}
.export-settings input[type=number]{width:160px}
.export-settings select{min-width:300px;max-width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--field);color:var(--text)}
.export-settings input[type=checkbox]{width:auto;margin-right:8px}
.export-settings fieldset{display:flex;flex-wrap:wrap;gap:14px;margin:12px 0;border:1px solid var(--border);border-radius:8px}
.export-preview-list{max-height:34vh;min-height:60px;overflow:auto;margin:12px 0;border:1px solid var(--border);border-radius:8px}
.export-preview-row{display:flex;gap:10px;padding:12px;border-bottom:1px solid var(--border);align-items:flex-start;overflow-wrap:anywhere}
.export-preview-row.excluded{opacity:.65}
.export-preview-row input{flex-shrink:0;margin-top:5px}
.export-preview-row .sub{display:block}
@media(max-width:600px){.export-overlay{padding:6px}.export-settings{padding:14px;max-height:96vh}.export-preview-list{max-height:30vh}}

@media (max-width: 600px) {
  .task-center { padding: 13px; max-height: 96vh; border-radius: 12px; }
  .job .head { flex-wrap: wrap; }
  .job .name { flex-basis: calc(100% - 90px); }
  .job .delete-task { margin-left: auto; }
  .jobs-mini { bottom: 10px; }
}

.storage-center {
  background: var(--panel);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 16px;
  width: min(1180px, calc(100vw - 28px));
  height: min(94vh, 960px);
  max-height: 94vh;
  padding: 18px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 80px #0008;
}
.storage-center h2 { margin: 0 0 3px; font-size: 19px; }
.storage-head { flex: 0 0 auto; }
.storage-head-actions { display: flex; gap: 7px; flex-wrap: wrap; }
.storage-summary {
  flex: 0 0 auto;
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.storage-stat {
  border: 1px solid var(--line);
  background: var(--panel-2);
  border-radius: 10px;
  padding: 10px 12px;
  min-width: 0;
}
.storage-stat span, .storage-stat b { display: block; }
.storage-stat b { margin-top: 3px; font-size: 15px; overflow-wrap: anywhere; }
.storage-disk-bar {
  grid-column: 1 / -1;
  height: 7px;
  border-radius: 5px;
  overflow: hidden;
  background: rgba(255,255,255,.1);
}
.storage-disk-bar i { display: block; height: 100%; background: var(--progress-gradient); }
.storage-danger-row {
  flex: 0 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 12px 0 10px;
}
.storage-danger { color: var(--danger) !important; border-color: rgba(255,156,173,.35) !important; }
.storage-danger:hover:not(:disabled) { background: rgba(255,156,173,.12) !important; }

/* The only outer scroll area of the storage dialog. */
.storage-accounts {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 7px 6px 0;
  scrollbar-gutter: stable;
}
.storage-orphan {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 3px;
  border: 1px solid rgba(241,199,120,.35);
  background: rgba(241,199,120,.07);
  padding: 10px 12px;
  border-radius: 10px;
}
.storage-account {
  flex: 0 0 auto;
  min-width: 0;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.025);
  border-radius: 12px;
  overflow: hidden;
}
.storage-account-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 14px;
  background: rgba(255,255,255,.015);
}
.storage-account-title,
.storage-export-main,
.storage-chat-main { min-width: 0; }
.storage-account-title { flex: 1 1 auto; }
.storage-account-title b,
.storage-account-title span,
.storage-export-main b,
.storage-export-main span,
.storage-chat-main b,
.storage-chat-main span { display: block; }
.storage-account-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.storage-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  white-space: nowrap;
}
.storage-download-all { font-weight: 600; }
.storage-empty-account { margin: 0; padding: 11px 14px 13px; border-top: 1px solid var(--line); }

/* Custom expandable sections. No <details>, no flex sizing quirks. */
.storage-section { border-top: 1px solid var(--line); min-width: 0; }
.storage-section-toggle {
  appearance: none;
  width: 100%;
  min-height: 42px;
  border: 0;
  border-radius: 0;
  padding: 9px 14px;
  display: grid;
  grid-template-columns: 18px minmax(0, auto) 1fr;
  align-items: center;
  gap: 7px;
  text-align: left;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
}
.storage-section-toggle:hover:not(:disabled) { background: rgba(255,255,255,.045); color: var(--text); }
.storage-section.open > .storage-section-toggle {
  color: var(--text);
  background: rgba(117, 74, 180, .18);
  border-bottom: 1px solid var(--line);
}
.storage-section-arrow { width: 18px; color: var(--accent); }
.storage-section-title { font-weight: 600; color: inherit; }
.storage-section-meta { justify-self: end; color: var(--muted); font-size: 12.5px; }
.storage-section-body[hidden] { display: none !important; }
.storage-section-body {
  display: block;
  min-width: 0;
  background: rgba(15, 11, 22, .2);
}

/* Each expanded section has a real workspace. */
.storage-export-list,
.storage-chat-list {
  height: clamp(300px, 44vh, 560px);
  min-height: 300px;
  max-height: 560px;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.storage-export-row,
.storage-chat-row {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-bottom: 1px solid rgba(255,255,255,.055);
}
.storage-export-row { align-items: flex-start; min-height: 58px; }
.storage-export-row:last-child,
.storage-chat-row:last-child { border-bottom: 0; }
.storage-export-main,
.storage-chat-main { flex: 1 1 auto; min-width: 0; }
.storage-export-main b {
  font-size: 13px;
  font-weight: 600;
  overflow: hidden;
  overflow-wrap: anywhere;
  white-space: normal;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}
.storage-export-main .sub,
.storage-chat-main .sub {
  margin-top: 3px;
  overflow-wrap: anywhere;
  line-height: 1.4;
}
.storage-export-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.storage-chat-main b {
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.storage-chat-row > .storage-danger { flex: 0 0 auto; }

@media (max-height: 760px) {
  .storage-center { height: 96vh; max-height: 96vh; padding: 14px; }
  .storage-export-list, .storage-chat-list {
    height: clamp(230px, 38vh, 380px);
    min-height: 230px;
  }
}
@media (max-width: 760px) {
  .storage-center {
    width: calc(100vw - 12px);
    height: 97vh;
    max-height: 97vh;
    padding: 12px;
    border-radius: 12px;
  }
  .storage-summary { grid-template-columns: 1fr 1fr; }
  .storage-danger-row,
  .storage-account-head,
  .storage-export-row,
  .storage-chat-row { align-items: stretch; flex-direction: column; }
  .storage-head { align-items: flex-start; }
  .storage-head-actions,
  .storage-account-actions,
  .storage-export-actions { justify-content: flex-start; }
  .storage-account-actions { width: 100%; }
  .storage-account-actions > * { flex: 1 1 auto; text-align: center; }
  .storage-section-toggle { grid-template-columns: 18px minmax(0,1fr); }
  .storage-section-meta { grid-column: 2; justify-self: start; }
  .storage-export-list, .storage-chat-list {
    height: clamp(260px, 48vh, 480px);
    min-height: 260px;
  }
  .storage-chat-row > .storage-danger { width: 100%; }
}
@media (max-width: 480px) {
  .storage-summary { grid-template-columns: 1fr; }
}

/* contacts */
.contacts-center {
  background: var(--panel); color: var(--text); border: 1px solid var(--border);
  border-radius: 16px; padding: 20px; width: min(960px, 100%);
  max-height: 92vh; overflow: hidden; display: flex; flex-direction: column;
  box-shadow: 0 20px 80px #0008;
}
.contacts-center h2 { margin: 0 0 3px; font-size: 19px; }
.contacts-head-actions { display: flex; gap: 7px; flex-wrap: wrap; }
.contacts-tools { display: flex; align-items: center; gap: 12px; margin: 14px 0 10px; }
.contacts-tools input { flex: 1; min-width: 180px; }
.contacts-table-wrap { min-height: 100px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.contacts-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.contacts-table th, .contacts-table td { text-align: left; padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,.06); vertical-align: middle; }
.contacts-table th { position: sticky; top: 0; z-index: 1; background: var(--panel-2); color: var(--muted); font-size: 12px; font-weight: 500; }
.contacts-table tbody tr:last-child td { border-bottom: 0; }
.contacts-table tbody tr:hover { background: rgba(255,255,255,.035); }
.contacts-name { font-weight: 500; }
.contacts-username { color: var(--accent); }
.contacts-phone { white-space: nowrap; }
@media (max-width: 650px) {
  .contacts-center { padding: 13px; max-height: 97vh; border-radius: 12px; }
  .contacts-head { align-items: flex-start; }
  .contacts-head-actions { width: 100%; }
  .contacts-head-actions button { flex: 1; }
  .contacts-tools { align-items: stretch; flex-direction: column; }
  .contacts-table { min-width: 620px; }
}

/* Local Console: fixed desktop regions and keyed, stable rows. */
body {font-size:14px;}
.shell {height:100dvh;min-height:500px;}
.top {padding:10px 16px;}
.top-line {min-height:34px;flex-wrap:wrap;}
.top-actions {flex-wrap:wrap;}
.brand {font-weight:650;}
.telegram-state {font-size:12px;color:var(--success);white-space:nowrap;}
.telegram-state[data-state="wait"] {color:var(--warning);}
.telegram-state[data-state="off"] {color:var(--muted);}
.link {font-size:11px;}
.shell > .body {display:grid;grid-template-columns:215px 310px minmax(0,1fr);flex:1;min-height:160px;overflow:hidden;}
.account-sidebar {background:var(--sidebar);border-right:1px solid var(--line);overflow:auto;display:flex;flex-direction:column;}
.sidebar-label {font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--muted);padding:18px 16px 10px;}
.accounts {display:flex;flex-direction:column;gap:2px;overflow:visible;padding:0 6px;flex:none;}
.account {width:100%;min-width:0;max-width:none;border-radius:6px;padding:10px 8px;gap:9px;white-space:normal;background:transparent;box-shadow:none;border:0;text-align:left;}
.account .lines {min-width:0;}
.account .name {font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.account .sub {font-size:11px;}
.account .account-status {font-size:10px;color:var(--muted);margin-top:3px;}
.account[aria-pressed="true"] {background:var(--active);}
.account-section {font-size:9px;font-weight:700;letter-spacing:.1em;color:var(--muted);padding:8px 8px 5px;user-select:none;}
.account-section--active {padding-top:4px;}
.account-section--pending {margin-top:8px;padding-top:10px;border-top:1px solid var(--line);}
.bulk-export {display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:18px 12px;margin-top:auto;border-top:1px solid var(--line);}
.bulk-export button {font-size:12px;padding:9px;}
.bulk-export .sub {font-size:11px;text-align:center;}
.rail {width:auto;min-width:0;display:flex;flex-direction:column;border-right:1px solid var(--line);overflow:hidden;}
.rail-head {padding:10px;}
.rail-head input {font-size:12px;}
.filter-tabs {display:flex;flex-wrap:wrap;gap:3px;padding:5px 9px 9px;border-bottom:1px solid var(--line);flex:none;}
.filter-tabs button {font-size:11px;padding:4px 7px;background:transparent;color:var(--muted);border-radius:5px;}
.filter-tabs button:hover:not(:disabled) {background:var(--hover);color:var(--text);}
.filter-tabs button[aria-pressed="true"] {background:var(--active);color:var(--selected-text);}
.dialogs {overflow:auto;min-height:0;flex:1;}
.dialog-section {font-size:10px;color:var(--accent);font-weight:650;letter-spacing:.03em;padding:9px 12px 4px;}
.dialog-row {position:relative;display:flex;align-items:center;min-height:58px;border-bottom:1px solid rgba(255,255,255,.025);}
.dialog {padding:9px 29px 9px 10px;gap:10px;flex:1;width:100%;min-width:0;min-height:58px;}
.dialog .title {font-size:13px;font-weight:550;}
.dialog .time {font-size:10px;}
.dialog .snippet {font-size:11px;}
.dialog .count {font-size:10px;min-width:16px;}
.dialog-row .favorite {position:absolute;right:3px;bottom:7px;padding:0 4px;background:transparent;font-size:17px;color:var(--muted);}
.favorite[aria-pressed="true"] {color:var(--warning);}
.pane {width:auto;min-width:0;display:flex;flex-direction:column;}
.pane-head {padding:11px 16px;gap:10px;flex-wrap:wrap;}
.pane-title {min-width:100px;}
.pane-title h2 {font-size:15px;}
.pane-actions {gap:4px;}
.pane-actions button {font-size:11px;padding:6px 8px;}
.messages {flex:1;min-height:0;}
.download-manager {flex:none;background:var(--panel);border-top:1px solid var(--border);max-height:42vh;display:flex;flex-direction:column;}
.download-manager .task-center {width:100%;max-width:none;margin:0;padding:8px 16px;background:transparent;border:0;border-radius:0;box-shadow:none;max-height:inherit;display:flex;flex-direction:column;}
.download-manager .settings-top {margin:0;gap:10px;flex-wrap:wrap;}
.download-manager h2 {font-size:14px;margin:0;}
.download-manager h2 .sub {font-weight:400;font-size:11px;margin-left:10px;}
.download-manager .settings-top button {font-size:11px;}
.download-manager .filter-tabs {padding:2px 0 6px;}
.download-manager .jobs {overflow:auto;min-height:0;padding:0;display:flex;flex-direction:column;gap:0;max-height:25vh;}
.download-row {display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) minmax(240px,1.4fr) auto;align-items:center;gap:18px;padding:9px 2px;border-bottom:1px solid var(--line);}
.download-title {font-size:12px;}
.download-status,.download-note,.download-speed {font-size:11px;color:var(--muted);}
.download-note {max-width:380px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.download-actions {display:flex;flex-wrap:wrap;gap:2px;justify-content:flex-end;}
.download-actions button {padding:4px 6px;font-size:11px;color:var(--selected-text);}
.download-links {display:flex;gap:8px;flex-wrap:wrap;font-size:11px;}
.download-links a {color:var(--accent);}
progress {width:100%;height:6px;border:0;appearance:none;border-radius:3px;background:#3b304b;}
progress::-webkit-progress-bar {background:#3b304b;border-radius:3px;}
progress::-webkit-progress-value {background:var(--progress-gradient);border-radius:3px;}
progress::-moz-progress-bar {background:var(--progress-gradient);border-radius:3px;}
.jobs-mini {display:none!important;}
.empty {font-size:12px;padding:14px;color:var(--muted);}
@media(max-width:1100px) {
 .shell > .body {grid-template-columns:175px 270px minmax(0,1fr);}
 .download-row {grid-template-columns:1fr 1fr;gap:5px 16px;}
 .download-actions {justify-content:flex-start;}
 .top-actions {margin-left:0;}
}
@media(max-width:760px) {
 .shell > .body {grid-template-columns:1fr;}
 .account-sidebar {max-height:100px;display:block;}
 .account-sidebar .sidebar-label,.account-sidebar .bulk-export {display:none;}
 .accounts {flex-direction:row;overflow:auto;}
 .account {min-width:160px;width:160px;}
 .account-section--active {display:none;}
 .account-section--pending {display:flex;align-items:center;align-self:stretch;flex:0 0 auto;margin:0 0 0 5px;padding:0 10px 0 12px;border-top:0;border-left:1px solid var(--line);white-space:nowrap;}
 .rail {width:100%;}
 .shell[data-view="chat"] .rail,.shell[data-view="chat"] .account-sidebar {display:none;}
 .shell:not([data-view="chat"]) .pane {display:none;}
 .shell:not([data-view="chat"]) > .body {grid-template-rows:auto 1fr;}
 .download-manager .jobs {max-height:23vh;}
 .download-row {grid-template-columns:1fr;}
 .download-actions {gap:4px;}
 .download-manager {max-height:40vh;}
 .top-actions button,.top-actions label {font-size:10px;}
 .back {display:block;}
}

/* Export dialog local chat filter. Uses already cached dialog metadata; no MAX requests. */
.export-chat-tools {
  margin: 12px 0 4px;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(0,0,0,.08);
}
.export-chat-tools > input[type="search"] {
  display: block;
  width: calc(100% - 18px);
  margin: 9px;
}
.export-filter-tabs {
  border-bottom: 0;
  border-top: 1px solid var(--line);
  padding: 7px 9px;
}
.export-preview-row[hidden] { display: none !important; }

/* Manual local MAX-session management. */
.session-actions { padding: 8px 8px 2px; }
.session-actions button { width: 100%; }

/* ---------------------------------------------------------------- dialog list compact/fixed rows
   Keep the chat rail vertically scrollable, but never allow long titles or
   message previews to create a horizontal scrollbar. */
.dialogs {
  overflow-y: auto;
  overflow-x: hidden;
  max-width: 100%;
  overscroll-behavior-x: none;
}

.dialog-row {
  width: 100%;
  min-width: 0;
  height: 58px;
  min-height: 58px;
  max-height: 58px;
  overflow: hidden;
}

.dialog {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: 58px;
  min-height: 58px;
  max-height: 58px;
  overflow: hidden;
}

.dialog-main,
.dialog .row {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}

.dialog .title,
.dialog .snippet {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Global button:hover is intentionally bright for normal buttons; dialogs
   need a much subtler hover so their text stays readable. */
.dialog:hover:not(:disabled) {
  background: var(--hover);
  color: var(--text);
}

.dialog[aria-pressed="true"]:hover:not(:disabled) {
  background: var(--active-hover);
}

.dialog-row .favorite:hover:not(:disabled) {
  background: rgba(255, 255, 255, .045);
  color: var(--text);
}

/* Configurable export priorities. Entirely local UI; MAX is not queried here. */
.priority-panel {
  margin: 12px 0;
  padding: 12px;
  border: 1px solid var(--line, var(--border));
  border-radius: 10px;
  background: rgba(15, 11, 22, .3);
}
.priority-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 9px;
}
.priority-head label { display: flex; flex-direction: column; gap: 5px; }
.priority-fixed,
.priority-row {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 38px;
  padding: 7px 9px;
  border-top: 1px solid rgba(255,255,255,.055);
}
.priority-fixed {
  border-top: 0;
  border-radius: 7px;
  background: rgba(117, 74, 180, .2);
}
.priority-fixed span { display: flex; flex-direction: column; gap: 1px; }
.priority-fixed small { color: var(--muted); font-size: 11px; }
.priority-list { margin-top: 5px; }
.priority-row input[type="checkbox"] { width: auto; flex: none; }
.priority-label { min-width: 0; flex: 1; font-size: 12.5px; }
.priority-controls { display: inline-flex; gap: 4px; flex: none; }
.priority-move { min-width: 30px; padding: 4px 7px !important; }
.priority-panel > .sub { margin: 8px 2px 0; }
@media (max-width:600px) {
  .priority-head { align-items: stretch; }
  .priority-head label { width: 100%; }
  .priority-head select { width: 100%; min-width: 0; }
}

/* Logout is intentionally separated from the operational toolbar. */
#logoutBtn.logout-btn {
  margin-left: auto;
  flex: 0 0 auto;
  color: #fff !important;
  background: var(--danger-fill) !important;
  border: 1px solid var(--danger-fill) !important;
  padding-left: 15px;
  padding-right: 15px;
}
#logoutBtn.logout-btn:hover:not(:disabled) {
  color: #fff !important;
  background: var(--danger-hover) !important;
  border-color: var(--danger-hover) !important;
}
#logoutBtn.logout-btn:active:not(:disabled) {
  transform: translateY(1px);
}

/* MAX-specific authorization uses the same overlay and panel styling. */
.session-actions { display: grid; gap: 3px; }
.session-actions button { font-size: 11px; text-align: left; }
.max-account-dialog { width: min(480px, calc(100vw - 32px)); }
.max-account-modes { border: 1px solid var(--line); border-radius: 8px; margin-bottom: 18px; }
.max-account-modes button { flex: 1; font-size: 13px; }
.max-account-field { display: grid; gap: 6px; margin: 12px 0; color: var(--muted); font-size: 13px; }
.max-account-field input { width: 100%; padding: 10px 12px; color: var(--text); background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px; }
.max-account-field input:focus { border-color: var(--accent); }
.max-auth-qr { display: block; width: min(260px, 100%); height: auto; margin: 14px auto; padding: 8px; border-radius: 8px; background: #fff; }
#maxAccountAuthBody > .sub { text-align: center; }
#maxAccountError { margin-top: 14px; }
.auto-files-toggle:has(input:disabled) { cursor: default; opacity: .55; }
@media (max-width:760px) {
  .account-sidebar .session-actions { display: flex; flex-wrap: wrap; padding: 3px 8px 8px; gap: 4px; }
  .account-sidebar .session-actions button { width: auto; }
  .account-sidebar { max-height: 168px; overflow: auto; }
}

/* Account-level download queue. Rank is persisted by the backend, not localStorage. */
.download-order-hint {margin: 3px 0 7px; font-size: 11px; line-height: 1.4;}
.download-account {flex: 0 0 auto; min-width: 0; border-bottom: 1px solid var(--line);}
.download-account-head {display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; padding: 8px 4px; background: var(--panel-2); border-top: 1px solid var(--border);}
.download-account.is-running > .download-account-head {box-shadow: inset 3px 0 0 var(--accent);}
.download-account-toggle.ghost {display: flex; align-items: center; gap: 8px; text-align: left; padding: 3px 6px; min-width: 0; flex: 0 1 auto; color: var(--text); font-weight: 600;}
.download-account-arrow {flex: 0 0 12px; color: var(--muted);}
.download-account-label {font-size: 12px; overflow-wrap: anywhere;}
.download-account-meta {font-size: 11px; color: var(--muted); overflow-wrap: anywhere;}
.download-account-actions {display: flex; flex-wrap: wrap; gap: 4px; margin-left: auto; flex: 0 0 auto;}
.download-account-actions button {padding: 5px 9px; font-size: 11px;}
.download-account-body {min-width: 0;}
.download-account-body[hidden], .download-account-actions[hidden] {display: none !important;}
.download-account .download-row {padding-left: 12px; padding-right: 4px;}
.download-info, .download-meter {min-width: 0;}
.download-title {display: block; overflow-wrap: anywhere; line-height: 1.45;}
.download-status {overflow-wrap: anywhere;}
@media(max-width:760px) {
  .download-manager {max-height: 55vh;}
  .download-manager .jobs {max-height: 38vh;}
  .download-order-hint {font-size: 10px; margin-bottom: 5px;}
  .download-account-head {gap: 5px 8px; padding: 7px 3px;}
  .download-account-toggle.ghost {flex: 1 1 100%;}
  .download-account-meta {flex: 1 1 100%; padding-left: 6px; font-size: 10px;}
  .download-account-actions {margin-left: 5px;}
  .download-account-actions button {min-height: 32px; padding: 5px 12px;}
  .download-account .download-row {padding-left: 6px;}
}

/* Storage v2: account data first; no ambiguous totals or destructive one-click clears. */
.toasts { z-index: 2300 !important; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.storage-center.storage-v2 { position:relative; width:min(1280px,calc(100vw - 32px));height:min(94dvh,1060px);max-height:94dvh;padding:0;background:var(--panel);border:1px solid var(--border);border-radius:18px; }
.storage-v2-head { display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 26px 12px;flex:none; }
.storage-eyebrow { letter-spacing:.13em;font-size:10px;font-weight:700;color:var(--accent);margin-bottom:6px; }
.storage-v2 h2 { font-size:25px;letter-spacing:-.025em;font-weight:650;margin:0 0 4px; }
.storage-v2 p { margin:6px 0; }
.storage-v2 .sub { color:var(--muted);font-size:12px;line-height:1.55; }
.storage-v2 button.ghost { color:var(--text); }
.storage-v2 .storage-summary { grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:8px 26px 16px; }
.storage-v2 .storage-stat { padding:13px 15px;background:#1b2b38;border-color:#31414e;border-radius:11px; }
.storage-v2 .storage-stat b { font-size:22px;letter-spacing:-.025em;margin:5px 0 4px; }
.storage-v2 .storage-stat small { display:block;font-size:11px;line-height:1.5;color:#8c9fac; }
.storage-v2-tabs { display:flex;flex:none;gap:10px;padding:10px 26px 0;border-bottom:1px solid #32404d; }
.storage-v2-tabs button { background:transparent;color:#9ab0c3;border-radius:9px 9px 0 0;border:1px solid transparent;border-bottom:2px solid transparent;padding:10px 12px;font-size:13px;line-height:1.2;user-select:none;transition:background .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease; }
.storage-v2-tabs button:hover { color:#d4e7f7;background:rgba(122,185,233,.08); }
.storage-v2-tabs button:focus-visible { outline:none;box-shadow:0 0 0 2px rgba(122,185,233,.35); }
.storage-v2-tabs button[aria-selected="true"] { color:#e8f5ff;background:#2f79b8;border-color:#7ab9e9 #7ab9e9 transparent #7ab9e9; }
#storageServiceCount:not(:empty) { display:inline-block;border-radius:5px;background:#2b4254;color:#afcce0;padding:1px 6px;font-size:11px;margin-left:5px; }
.storage-v2-scroll { overflow:auto;min-height:0;flex:1;padding:18px 26px 20px; }
.storage-v2-toolbar { display:grid;grid-template-columns:minmax(180px,1fr) auto auto;gap:10px;align-items:center; }
.storage-v2-toolbar input[type="search"] { border-radius:8px;background:#1d2e3c;border-color:var(--hover);height:38px; }
.storage-v2 select { background:#1d2e3c;border:1px solid var(--hover);border-radius:8px;color:#d7e4ed;padding:9px 10px;font:inherit;font-size:12px;max-width:100%; }
.storage-list-caption { display:flex;justify-content:space-between;align-items:center;gap:10px;margin:12px 0 9px; }
.storage-list-caption button { font-size:12px; }
.storage-v2 .storage-accounts { overflow:visible;display:block;padding:0;margin:0; }
.storage-v2-account { border:1px solid #30424f;border-radius:12px;overflow:hidden;background:#1b2a36;margin-bottom:12px; }
.storage-v2-account-head { display:flex;align-items:center;gap:16px;justify-content:space-between;padding:17px 18px; }
.storage-v2-identity { flex:1;min-width:0; }
.storage-v2-identity>b { display:block;font-size:16px;font-weight:650;overflow-wrap:anywhere; }
.storage-v2-identity>.sub { display:block;font-size:10px;overflow-wrap:anywhere;margin-top:2px;color:#7d96aa; }
.storage-v2-pills { display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:9px;font-size:12px;color:#a8bccd; }
.storage-head-actions { align-items:center; }
.storage-primary, .storage-v2 button.storage-primary { background:#356a90;color:#edf6ff;padding:9px 14px;font-size:12px;white-space:nowrap;border:1px solid #497ea3;border-radius:7px; }
.storage-primary:hover:not(:disabled) { background:#467fa6; }
.storage-v2-account-head .ghost { font-size:12px; }
.storage-v2-details { border-top:1px solid #30424f; }
.storage-v2-details>summary { cursor:pointer;display:flex;align-items:center;gap:10px;list-style:none;padding:12px 18px;font-size:13px;font-weight:600; }
.storage-v2-details>summary::-webkit-details-marker { display:none; }
.storage-v2-details>summary::before { content:'›';color:#82b7dd;font-size:19px;line-height:15px;transform:rotate(0deg); }
.storage-v2-details[open]>summary::before { transform:rotate(90deg); }
.storage-v2-details>summary>.sub { margin-left:auto;font-weight:400;font-size:10px; }
.storage-v2-details[open]>summary { background:#20323f; }
.storage-v2-chat { display:flex;gap:16px;align-items:center;justify-content:space-between;padding:11px 18px 11px 38px;border-top:1px solid #2b3b48; }
.storage-v2-chat>div:first-child { flex:1;min-width:0; }
.storage-v2-chat b { display:block;font-size:14px;overflow-wrap:anywhere; }
.storage-v2-chat .sub { display:block;font-size:12px; }
.storage-v2-chat button { font-size:12px;padding:7px 10px; }
.storage-v2-chat-list>button { margin:9px 18px; }
.storage-history-row { border-top:1px solid #2b3b48;padding:13px 18px 13px 38px; }
.storage-history-row>b { display:block;font-size:13px;overflow-wrap:anywhere; }
.storage-history-row>.sub { display:block;margin:4px 0 8px;font-size:12px; }
.storage-history-row .storage-head-actions { align-items:flex-start; }
.storage-secondary-link { color:#a2c9ec;text-decoration:none;overflow-wrap:anywhere;font-size:11px;padding:6px 0; }
.storage-history-row button { font-size:10px; }
.storage-v2-tech { padding:10px 18px!important; }
.storage-footnote { font-size:10px;color:#8298aa;margin-top:16px!important; }
.storage-service-heading { margin:0 0 13px; }
.storage-service-heading p:empty { display:none; }
.storage-service-heading h3 { font-size:15px;font-weight:600;margin:20px 0 5px; }
.storage-service-heading:first-child h3 { margin-top:0; }
.storage-service-row { display:flex;justify-content:space-between;align-items:center;gap:15px;border:1px solid #314352;border-radius:10px;padding:14px 16px;margin-bottom:8px;background:#1b2b38; }
.storage-service-row>div:first-child { min-width:0;flex:1; }
.storage-service-row b { display:block;font-size:13px;overflow-wrap:anywhere; }
.storage-service-row .sub { display:block; }
.storage-service-empty { padding:12px 0; }
.storage-orphan-actions { margin-bottom:10px; }
.storage-orphan-row { display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 14px;border:1px solid #665d41;border-radius:9px;background:#292c26;margin-bottom:8px;cursor:pointer; }
.storage-orphan-row b,.storage-orphan-row span.sub { display:block;overflow-wrap:anywhere;font-size:12px; }
.storage-orphan-row strong { font-size:12px; }
.storage-orphan-row input { accent-color:#90c5eb; }
.storage-inline-message { margin:0 26px 10px;background:#213c4d;border:1px solid #3e6278;padding:10px 12px;border-radius:8px;font-size:12px;overflow-wrap:anywhere;flex:none; }
.storage-inline-message.is-error { background:#392a2b;border-color:#7f5256;color:#ffd1d1; }
.storage-scan-progress { margin:0 26px 12px;padding:12px 14px;border:1px solid #36546a;border-radius:10px;background:#1b3040;flex:none; }
.storage-scan-head { display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:8px;font-size:12px;color:#d9e8f2; }
.storage-scan-head strong { flex:none;color:#9dd2f5;font-variant-numeric:tabular-nums; }
.storage-scan-progress progress { display:block;width:100%;height:8px;border:0;border-radius:999px;overflow:hidden;background:#2b4152;accent-color:#6fb5e5; }
.storage-scan-progress progress::-webkit-progress-bar { background:#2b4152;border-radius:999px; }
.storage-scan-progress progress::-webkit-progress-value { background:#6fb5e5;border-radius:999px;transition:width .2s ease; }
.storage-scan-progress progress::-moz-progress-bar { background:#6fb5e5;border-radius:999px; }
/* Show visible movement while awaiting the very first storage API response. */
.storage-scan-progress progress:indeterminate {
  -webkit-appearance:none;appearance:none;
  background:linear-gradient(90deg,#2b4152 0%,#6fb5e5 46%,#2b4152 92%);
  background-size:240% 100%;
  animation:storage-scan-wait 1.5s linear infinite;
}
.storage-scan-progress progress:indeterminate::-webkit-progress-bar { background:transparent; }
.storage-scan-progress progress:indeterminate::-webkit-progress-value { background:transparent; }
.storage-scan-progress progress:indeterminate::-moz-progress-bar { background:transparent; }
@keyframes storage-scan-wait { from { background-position:100% 0; } to { background-position:-100% 0; } }
@media (prefers-reduced-motion:reduce) {
  .storage-scan-progress progress:indeterminate { animation:none; background:#508bac; }
}

.storage-scan-meta { display:flex;justify-content:space-between;gap:16px;margin-top:7px;min-width:0; }
.storage-scan-meta .sub { margin:0;min-width:0;overflow-wrap:anywhere; }
.storage-scan-meta .sub:last-child { text-align:right; }
@media (max-width:700px) { .storage-scan-progress { margin-left:14px;margin-right:14px; } .storage-scan-meta { flex-direction:column;gap:2px; } .storage-scan-meta .sub:last-child { text-align:left; } }
.storage-warning { padding:10px 12px;border:1px solid #746342;background:#322f26;color:#e8d7af;border-radius:8px;margin:10px 0;font-size:12px;overflow-wrap:anywhere; }
.storage-warning p { margin:5px 0; }
.storage-safe-note { padding:10px 12px;border-left:2px solid #689cae;background:#203440;color:#b8d0df;font-size:12px; }
.storage-action-overlay { position:absolute;inset:0;display:grid;place-items:center;background:rgba(5,12,19,.82);z-index:10;padding:22px; }
.storage-action-dialog { display:flex;flex-direction:column;max-height:100%;width:min(720px,100%);min-height:160px;border:1px solid #4f6375;background:#1a2a37;box-shadow:0 16px 50px #0008;border-radius:14px;overflow:hidden; }
.storage-action-dialog>header { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 20px;border-bottom:1px solid var(--border); }
.storage-action-dialog h3 { font-size:17px;line-height:1.4;margin:0;overflow-wrap:anywhere; }
.storage-action-body { padding:16px 20px;min-height:0;overflow:auto; }
.storage-action-body h4 { font-size:19px;margin:4px 0 12px; }
.storage-action-body progress { width:100%;height:14px;accent-color:#80b7df;margin:15px 0 5px; }
.storage-action-stats { display:flex;flex-wrap:wrap;gap:4px 16px;padding:12px 14px;background:#243e4f;border:1px solid #385569;border-radius:9px;margin:10px 0;font-size:15px;font-weight:600; }
.storage-action-dialog>footer { display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:10px;padding:14px 20px;background:#1c303f;border-top:1px solid var(--border); }
.storage-action-dialog>.storage-inline-message { margin:0 20px 14px; }
.storage-destructive { background:#84454b;color:#fff;border:1px solid #a5686f;padding:9px 14px;font-size:12px; }
.storage-destructive:hover:not(:disabled) { background:#a25962; }
.storage-check { display:flex;align-items:flex-start;gap:11px;margin:12px 0;font-size:13px;line-height:1.55;cursor:pointer; }
.storage-check input { margin-top:3px;flex:none;width:16px;height:16px;accent-color:#77b4e3; }
.storage-preview-list { max-height:280px;overflow:auto;background:#15232e;border-radius:8px; }
.storage-preview-item { display:flex;flex-direction:column;padding:9px 12px;border-bottom:1px solid #2c3f4e;overflow-wrap:anywhere; }
.storage-preview-item b { font-size:12px;font-weight:500; }
.storage-preview-item .sub { font-size:11px; }
.storage-action-body .storage-v2-details { border:1px solid var(--border);border-radius:8px;margin:12px 0; }
.storage-primary-link { display:inline-flex;justify-content:center;background:var(--badge);color:var(--text);padding:9px 13px;border-radius:7px;text-decoration:none;font-size:12px; }
.storage-primary-link:hover { background:var(--active-hover); }
@media(max-width:700px) {
  .storage-center.storage-v2 { width:100vw;height:100dvh;max-height:100dvh;border-radius:0;border:0; }
  .storage-v2-head { padding:14px 14px 7px;gap:8px;align-items:flex-start; }
  .storage-v2 h2 { font-size:23px; }
  .storage-v2-head .sub { font-size:10px;max-width:260px; }
  .storage-v2-head .storage-head-actions { flex-wrap:nowrap;gap:1px; }
  .storage-v2-head button { padding:7px!important;font-size:11px; }
  .storage-v2 .storage-summary { grid-template-columns:repeat(2,minmax(0,1fr));margin:6px 14px 10px;gap:7px; }
  .storage-v2 .storage-stat { padding:8px 10px; }
  .storage-v2 .storage-stat b { font-size:18px;margin:3px 0; }
  .storage-v2 .storage-stat .sub { font-size:10px; }
  .storage-v2 .storage-stat small { font-size:10px; }
  .storage-v2-tabs { padding:10px 14px 0;gap:8px; }
  .storage-v2-tabs button { font-size:12px;padding:9px 10px; }
  .storage-v2-scroll { padding:12px 14px; }
  .storage-v2-toolbar { grid-template-columns:1fr 1fr;gap:7px; }
  .storage-search { grid-column:1/-1; }
  .storage-v2-toolbar label:not(:first-child),.storage-v2-toolbar select { width:100%; }
  .storage-list-caption { align-items:flex-start;flex-direction:column;gap:3px; }
  .storage-list-caption button { padding-left:0; }
  .storage-v2-account-head { flex-direction:column;align-items:stretch;padding:13px;gap:11px; }
  .storage-v2-account-head .storage-head-actions { justify-content:flex-start; }
  .storage-v2-identity>b { font-size:14px; }
  .storage-v2-pills { gap:6px 10px;font-size:11px; }
  .storage-v2-details>summary { padding:11px 12px;flex-wrap:wrap;gap:4px 7px; }
  .storage-v2-details>summary>.sub { margin-left:20px;width:100%; }
  .storage-v2-chat { padding:11px 12px;align-items:flex-start;flex-direction:column;gap:6px; }
  .storage-v2-chat button { padding:5px 8px; }
  .storage-history-row { padding:10px 12px; }
  .storage-service-row { align-items:flex-start;flex-direction:column;gap:8px;padding:12px; }
  .storage-orphan-row { grid-template-columns:18px minmax(0,1fr); }
  .storage-orphan-row>strong { grid-column:2; }
  .storage-inline-message { margin:0 14px 8px; }
  .storage-action-overlay { padding:12px; }
  .storage-action-dialog>header,.storage-action-body,.storage-action-dialog>footer { padding:13px; }
  .storage-action-dialog h3 { font-size:15px; }
  .storage-action-dialog>.storage-inline-message { margin:0 13px 12px; }
  .storage-action-stats { font-size:13px; }
}

/* Export status belongs to the ordinary chat list, not Storage. */
.dialog-row .chat-activity-badge { position:absolute;right:3px;top:3px;display:inline-flex;align-items:center;justify-content:center;width:23px;height:23px;padding:3px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--muted); }
.dialog-row .chat-activity-badge:hover:not(:disabled) { background:var(--hover);border-color:var(--border); }
.dialog-row .chat-activity-badge:focus-visible { outline:2px solid var(--accent);outline-offset:-2px; }
.dialog-row .chat-activity-badge[data-state="running"] { color:#93d0ff;background:rgba(99,180,239,.12); }
.dialog-row .chat-activity-badge[data-state="done"] { color:#64de9c;background:rgba(82,193,135,.12); }
.dialog-row .chat-activity-badge:is([data-state="queued"],[data-state="cooldown"],[data-state="paused"],[data-state="partial"]) { color:#f1c97a;background:rgba(211,168,74,.10); }
.dialog-row .chat-activity-badge[data-state="failed"] { color:#ff9494;background:rgba(219,99,99,.12); }
.chat-activity-tooltip { position:fixed;z-index:1300;width:max-content;max-width:min(370px,calc(100vw - 20px));max-height:calc(100vh - 24px);overflow:auto;padding:13px 15px;border:1px solid #466277;border-radius:11px;background:#101d29;box-shadow:0 10px 32px rgba(0,0,0,.45);color:#cfdeea;font-size:12px;line-height:1.5;overflow-wrap:anywhere; }
.chat-activity-tooltip>b { display:block;font-size:13px;font-weight:600;color:#f0f7fc;margin-bottom:7px; }
.chat-activity-tooltip>div+div { margin-top:5px; }
.chat-activity-tooltip .chat-activity-note { color:#94adc1;font-size:11px; }
.download-manager button.download-chat-link { padding:2px 0;background:transparent;color:var(--text);border:0;border-radius:3px;text-align:left;font-size:12px;font-weight:650;line-height:1.45;max-width:100%;white-space:normal; }
.download-manager button.download-chat-link:hover:not(:disabled) { background:transparent;color:#b2dcff;text-decoration:underline;text-underline-offset:3px; }
.download-manager button.download-chat-link:focus-visible { outline:2px solid var(--accent);outline-offset:2px; }
.download-manager button.download-chat-link:disabled { opacity:1;color:var(--text);cursor:default; }
#chatTitle:focus { outline:none; }
#storageUpdatedAt { display:block;margin-top:4px; }
@media (max-width:640px) { .dialog-row .chat-activity-badge {width:26px;height:26px;top:1px;} }

/* Export selection: filter attachments without suppressing message text. */
.export-extra-options { display:grid; gap:10px; margin:12px 0; }
.export-extra-options label { display:flex; align-items:center; gap:9px; color:var(--text); font-size:13px; }
.export-extra-options input[type="checkbox"] { width:16px; height:16px; margin:0; flex:none; }
.export-extra-options p { margin:0; line-height:1.5; }
.chat-file-settings { width:min(560px,calc(100vw - 28px)); max-height:calc(100dvh - 28px); overflow:auto; }
.chat-file-settings p { line-height:1.5; }
#chatFileError:empty { display:none; }

/* MTProto proxy center */
.proxy-center{width:min(900px,calc(100vw - 28px));max-height:min(850px,calc(100vh - 28px));overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 24px 80px rgba(0,0,0,.35)}
.proxy-account-box{display:flex;align-items:end;gap:10px;flex-wrap:wrap;padding:14px;margin:12px 0;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}
.proxy-account-box label{min-width:min(360px,100%);display:grid;gap:6px}.proxy-account-box select{width:100%}
.proxy-list{display:grid;gap:9px;margin:14px 0}.proxy-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}
.proxy-row-main{min-width:0}.proxy-row-name{font-weight:700}.proxy-row-meta{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.proxy-row-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.proxy-ok{color:#6fd58b}.proxy-bad{color:#ef7777}
.proxy-form{border-top:1px solid var(--line);padding-top:16px}.proxy-form h3{margin:0 0 12px}.proxy-form-grid{display:grid;grid-template-columns:1fr 1fr 120px;gap:10px}.proxy-form-grid label{display:grid;gap:6px}.proxy-secret-field{grid-column:1/-1}.proxy-enabled{display:flex!important;gap:8px;align-items:center;margin:10px 0}
@media(max-width:650px){.proxy-row{grid-template-columns:1fr}.proxy-row-actions{justify-content:flex-start}.proxy-form-grid{grid-template-columns:1fr}.proxy-secret-field{grid-column:auto}.proxy-account-box{align-items:stretch}.proxy-account-box>*{width:100%}}

/* Stable diagnostics trigger for rapidly updating download rows. */
.download-info-head { display:flex;align-items:flex-start;gap:7px;min-width:0; }
.download-info-head .download-title { flex:1;min-width:0; }
.download-info-button { flex:0 0 20px;width:20px;height:20px;padding:0;margin:0;border:1px solid #45657b;border-radius:50%;background:#1c3343;color:#9dcced;font:700 12px/18px ui-sans-serif,system-ui,sans-serif;text-align:center;cursor:help; }
.download-info-button:hover,.download-info-button:focus-visible,.download-info-button[data-pinned="true"] { color:#e9f7ff;background:#28506a;border-color:#6ca7cf;outline:none; }
.download-job-tooltip { min-width:260px;max-width:min(430px,calc(100vw - 20px)); }
.download-job-tooltip[data-pinned="true"] { border-color:#679cc0;box-shadow:0 12px 34px rgba(0,0,0,.5),0 0 0 1px rgba(103,156,192,.15); }
@media (max-width:700px) { .download-info-button { width:24px;height:24px;flex-basis:24px;line-height:22px; } .download-job-tooltip { max-width:calc(100vw - 18px); } }

/* MAX Console parity controls. */
.attach {display:flex;flex-direction:column;align-items:flex-start;gap:8px;}
.attach video,.attach audio {max-width:100%;width:min(420px,100%);border-radius:8px;}
.attach img {max-height:480px;object-fit:contain;}
.attachment-download,.message-location {font-size:12px;color:var(--accent);}
.message-reply {font-size:11px;border-left:2px solid var(--accent)!important;text-align:left;padding:5px 9px!important;}
.message-highlight {outline:2px solid var(--accent);}
.proxy-center {padding:20px;max-height:90dvh;overflow:auto;}
.proxy-account,.proxy-row {display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:12px 0;}
.proxy-account select {flex:1;min-width:130px;}
.proxy-row {padding:12px;border:1px solid var(--border);border-radius:9px;}
.proxy-row .lines {flex:1;min-width:150px;overflow-wrap:anywhere;}
.proxy-form {display:grid;gap:12px;padding-top:14px;border-top:1px solid var(--border);}
.proxy-form label {display:grid;gap:6px;}
.proxy-form input {width:100%;}
.max-account-modes {flex-wrap:wrap;}

.export-extra-options {display:flex;flex-direction:column;gap:7px;margin:12px 0;}
.export-extra-options label {display:flex;align-items:center;gap:8px;font-size:12px;}
.export-extra-options input {width:auto;}
.export-document-extensions {display:grid;gap:6px;margin:12px 0;font-size:12px;}