/* Vemoni support tickets widget (assets/tickets.js) — self-contained, AccountsAllan look.
   Everything is scoped under .vt / .vt-* so it drops into any page without clashing. */
.vt{
  --vt-panel:rgba(30,41,59,.7); --vt-line:rgba(255,255,255,.1); --vt-line-2:#334155;
  --vt-text:#f8fafc; --vt-muted:#94a3b8; --vt-dim:#64748b; --vt-red:#f87171; --vt-amber:#fbbf24;
  color:var(--vt-text); font-family:ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  font-size:15px; line-height:1.5; text-align:left; display:flex; flex-direction:column; min-height:0;
}
.vt *{box-sizing:border-box}
.vt [hidden]{display:none!important}
.vt-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}
.vt-head h2{font-size:24px;font-weight:700;letter-spacing:-.01em;margin:0 0 4px;color:var(--vt-text)}
.vt-lead{color:var(--vt-muted);font-size:14.5px;margin:0}
.vt-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;font:inherit;font-weight:600;font-size:14.5px;
  padding:10px 18px;border-radius:8px;cursor:pointer;background:#1e293b;color:#cbd5e1;text-decoration:none;white-space:nowrap;transition:background .15s,color .15s}
.vt-btn:hover{background:#334155;color:#fff}
.vt-btn.primary{background:#4f46e5;color:#fff}
.vt-btn.primary:hover{background:#6366f1}
.vt-btn:disabled{opacity:.5;cursor:not-allowed}
.vt-btn.sm{padding:6px 12px;font-size:13.5px}
.vt-btn.full{width:100%}
.vt-input{width:100%;background:#0f172a;border:1px solid var(--vt-line-2);color:var(--vt-text);font:inherit;font-size:15px;padding:10px 12px;border-radius:8px;resize:vertical}
.vt-input::placeholder{color:var(--vt-dim)}
.vt-input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 1px #6366f1}
.vt-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.vt-fbtn{background:#1e293b;border:1px solid var(--vt-line-2);color:var(--vt-muted);border-radius:8px;padding:7px 13px;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.vt-fbtn:hover{color:var(--vt-text)}
.vt-fbtn.on{background:rgba(79,70,229,.2);border-color:rgba(99,102,241,.5);color:#818cf8}

.vt-body{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:20px;align-items:start;min-height:0}
.vt-list{display:flex;flex-direction:column;gap:8px;min-width:0}
.vt-empty,.vt-pick{color:var(--vt-muted);font-size:15px;padding:18px 4px}
.vt-pick{padding:18px;text-align:center}
.vt-row{position:relative;display:block;width:100%;text-align:left;background:var(--vt-panel);border:1px solid var(--vt-line);border-radius:12px;padding:13px 15px;
  cursor:pointer;font:inherit;color:var(--vt-text);transition:border-color .15s,background .15s}
.vt-row:hover{border-color:#475569}
.vt-row.on{border-color:rgba(99,102,241,.6);background:rgba(79,70,229,.14)}
.vt-row-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.vt-row-subj{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-row.unread .vt-row-subj{font-weight:800}
.vt-row-sub{display:flex;justify-content:space-between;gap:8px;margin-top:5px;color:var(--vt-muted);font-size:13px}
.vt-row-user{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-row-dot{position:absolute;top:9px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--vt-red)}
.vt-chip{flex:none;font-size:12px;font-weight:700;padding:3px 9px;border-radius:8px;white-space:nowrap}
.vt-chip.amber{color:#fcd34d;background:rgba(245,158,11,.15)}
.vt-chip.blue{color:#a5b4fc;background:rgba(99,102,241,.18)}
.vt-chip.dim{color:var(--vt-muted);background:rgba(255,255,255,.06)}

.vt-thread{background:var(--vt-panel);border:1px solid var(--vt-line);border-radius:12px;min-height:320px;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.vt-thread:not(.open){background:transparent;border:1px dashed var(--vt-line-2);align-items:center;justify-content:center}
.vt-th-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--vt-line);flex-wrap:wrap}
.vt-back{display:none;background:transparent;border:0;color:var(--vt-muted);font-size:24px;cursor:pointer;line-height:1;padding:0 6px 2px 0}
.vt-th-title{display:flex;align-items:center;gap:10px;min-width:0;flex:1}
.vt-th-title b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-th-user{color:var(--vt-muted);font-size:13px;font-weight:600}
.vt-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;max-height:52vh}
.vt-msg{max-width:88%;align-self:flex-start;background:#0f172a;border:1px solid var(--vt-line-2);border-radius:12px;padding:9px 13px}
.vt-msg.staff{align-self:flex-end;background:rgba(79,70,229,.16);border-color:rgba(99,102,241,.35)}
.vt-msg-head{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--vt-muted);margin-bottom:4px}
.vt-msg-head b{color:var(--vt-text);font-size:13.5px}
.vt-badge-staff{font-size:10px;font-weight:800;color:#a5b4fc;background:rgba(99,102,241,.22);border-radius:5px;padding:1px 6px;text-transform:uppercase;letter-spacing:.03em}
.vt-msg-time{margin-left:auto}
.vt-msg-body{font-size:15px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.vt-msg-body.vt-jumbo{font-size:34px;line-height:1.2}
.vt-msg-body.vt-jumbo .vt-emoji{width:44px;height:44px}
.vt-emoji{width:22px;height:22px;vertical-align:-5px;object-fit:contain}
.vt-sticker{width:140px;height:140px;object-fit:contain;display:block}
.vt-mention{color:#a5b4fc;background:rgba(99,102,241,.18);border-radius:4px;padding:0 3px}
.vt-msg-actions{display:inline-flex;align-items:center;gap:2px;opacity:0;transition:opacity .12s}
.vt-msg:hover .vt-msg-actions{opacity:1}
@media (hover:none){.vt-msg-actions{opacity:1}}
.vt-icon-btn{background:transparent;border:0;color:var(--vt-dim);cursor:pointer;padding:3px 5px;border-radius:6px;line-height:1;font-size:12px;display:inline-flex;align-items:center}
.vt-icon-btn svg{width:16px;height:16px;display:block}
.vt-icon-btn:hover{color:var(--vt-red);background:rgba(248,113,113,.12)}
.vt-icon-btn.amber:hover{color:var(--vt-amber);background:rgba(245,158,11,.12)}
.vt-atts{display:flex;flex-direction:column;gap:6px;margin-top:7px}
.vt-att-img{max-width:260px;max-height:280px;border-radius:10px;cursor:zoom-in;display:block}
.vt-att-vid{max-width:280px;max-height:300px;border-radius:10px;display:block}
.vt-att-file{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:9px;background:#0f172a;border:1px solid var(--vt-line-2);color:var(--vt-text);text-decoration:none;max-width:100%}
.vt-att-file span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-closed-note{padding:10px 16px;color:var(--vt-muted);font-size:14px;border-top:1px solid var(--vt-line)}
.vt-reply{border-top:1px solid var(--vt-line);padding:12px 16px;display:flex;flex-direction:column;gap:8px}
.vt-compose{display:flex;gap:8px;align-items:flex-end}
.vt-compose .vt-input{flex:1;min-height:44px;max-height:180px}
.vt-new .vt-compose .vt-input{min-height:120px}
.vt-new{padding:16px;display:flex;flex-direction:column;gap:12px}
.vt-status{color:var(--vt-red);font-size:14px}
.vt-pend{display:flex;flex-wrap:wrap;gap:6px}
.vt-pend:empty{display:none}
.vt-attchip{display:inline-flex;align-items:center;gap:4px;max-width:220px;background:#0f172a;border:1px solid var(--vt-line-2);border-radius:8px;padding:5px 9px;font-size:13px;
  color:var(--vt-text);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vt-attchip b{color:var(--vt-muted)}
.vt-attchip:hover b{color:var(--vt-red)}
.vt-tool,.vt-send{flex:none;width:44px;height:44px;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.vt-tool{background:#0f172a;border:1px solid var(--vt-line-2);color:var(--vt-muted)}
.vt-tool:hover{color:var(--vt-text);border-color:#475569}
.vt-send{background:#4f46e5;border:0;color:#fff}
.vt-send:hover{background:#6366f1}
.vt-send:disabled{opacity:.5;cursor:not-allowed}
.vt-tool svg,.vt-send svg{width:20px;height:20px}
.vt-login{padding:32px 16px;text-align:center;display:flex;flex-direction:column;gap:14px;align-items:center;color:var(--vt-muted);
  background:var(--vt-panel);border:1px solid var(--vt-line);border-radius:12px}
.vt-login p{margin:0;font-size:15px}

/* Dialog over any page (sits below the DMALL emoji picker's z-index 1300) */
.vt-overlay{position:fixed;inset:0;z-index:1250;background:rgba(2,6,23,.66);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;padding:24px}
.vt-dialog{position:relative;width:min(1080px,100%);max-height:calc(100vh - 48px);overflow:auto;background:#0f172a;border:1px solid #334155;border-radius:16px;
  box-shadow:0 40px 100px -30px rgba(0,0,0,.9);padding:22px 24px}
/* ✕ and «Новый тикет» share one 40px row on the dialog's padding line */
.vt-dialog .vt-head{padding-right:52px}
.vt-dialog .vt-head > .vt-btn{height:40px;padding-top:0;padding-bottom:0}
.vt-x{position:absolute;top:22px;right:24px;z-index:1;width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;
  border-radius:8px;border:0;background:#1e293b;color:#cbd5e1;font-size:17px;line-height:1;cursor:pointer}
.vt-x:hover{background:#334155;color:#fff}
.vt-lb{position:fixed;inset:0;z-index:1450;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;cursor:zoom-out}
.vt-lb img{max-width:92vw;max-height:88vh;border-radius:10px}
.vt-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:1500;background:#1e293b;border:1px solid #334155;color:#f8fafc;border-radius:10px;
  padding:10px 16px;font:600 14px/1.4 ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;box-shadow:0 20px 50px -20px rgba(0,0,0,.8)}
.vt-toast[hidden]{display:none}
.vt-toast.err{border-color:rgba(248,113,113,.5);color:#fecaca}
.vt-mute-menu{position:fixed;z-index:1460;background:#1e293b;border:1px solid #334155;border-radius:10px;padding:6px;min-width:190px;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.8);font:14px/1.4 ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif}
.vt-mute-title{font-size:12px;color:#94a3b8;padding:4px 10px 6px}
.vt-mute-menu button{display:block;width:100%;text-align:left;background:transparent;border:0;color:#f8fafc;font:inherit;padding:8px 10px;border-radius:6px;cursor:pointer}
.vt-mute-menu button:hover{background:#334155}
.vt-mute-menu .vt-mute-lift{color:#6ee7b7}

@media (max-width:820px){
  .vt-body{grid-template-columns:1fr}
  .vt-thread:not(.open){display:none}
  .vt-body.has-open .vt-list{display:none}
  .vt-back{display:inline-block}
  .vt-msgs{max-height:58vh}
}
@media (max-width:600px){
  .vt-overlay{padding:0;align-items:stretch}
  .vt-dialog{max-height:none;height:100%;border-radius:0;border:0;padding:16px 14px}
  .vt-x{top:16px;right:14px}
  .vt-head{flex-wrap:wrap}
  .vt-head h2{font-size:20px}
  .vt-att-img,.vt-att-vid{max-width:70vw}
}

/* ===================================================================
   The /pr/ look (body.prl — the homepage, /customtag/, /rating/): a near-black
   ground, the Helvetica Neue / Arial stack, hairline rules, light pill buttons,
   no indigo. An override layer — pages without the class keep the look above.
   =================================================================== */
body.prl .vt{
  --vt-panel:transparent; --vt-line:rgba(255,255,255,.09); --vt-line-2:rgba(255,255,255,.17);
  --vt-text:#f2f2f4; --vt-muted:#a3a3ad; --vt-dim:#797983;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
}
body.prl .vt-overlay{background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
body.prl .vt-dialog{background:#0a0a0c;border:1px solid rgba(255,255,255,.17);border-radius:20px;padding:28px 30px;box-shadow:0 40px 120px -30px rgba(0,0,0,.95)}
body.prl .vt-x{top:28px;right:30px}
body.prl .vt-head{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--vt-line)}
body.prl .vt-head h2{font-size:28px;font-weight:700;letter-spacing:-.03em;line-height:1.1;margin:0 0 8px}
body.prl .vt-lead{font-size:15px}
body.prl .vt-btn{border-radius:999px;font-weight:500;font-size:14px;padding:11px 20px;background:transparent;border:1px solid var(--vt-line-2);color:var(--vt-text)}
body.prl .vt-btn:hover{background:transparent;border-color:var(--vt-text);color:var(--vt-text)}
body.prl .vt-btn.primary{background:#f4f4f6;border-color:#f4f4f6;color:#0a0a0c}
body.prl .vt-btn.primary:hover{background:#fff;border-color:#fff;color:#0a0a0c}
body.prl .vt-btn.sm{padding:7px 14px;font-size:13.5px}
body.prl .vt-x,body.prl .vt-tool{border-radius:50%;background:transparent;border:1px solid var(--vt-line-2);color:var(--vt-muted)}
body.prl .vt-x:hover,body.prl .vt-tool:hover{background:transparent;border-color:var(--vt-text);color:var(--vt-text)}
body.prl .vt-send{border-radius:50%;background:#f4f4f6;color:#0a0a0c}
body.prl .vt-send:hover{background:#fff}
body.prl .vt-input{background:transparent;border:1px solid var(--vt-line-2);border-radius:12px;padding:11px 14px}
body.prl .vt-input:focus{border-color:var(--vt-text);box-shadow:none}
/* the filters: the pill switch of the language row */
body.prl .vt-filters{gap:2px;padding:2px;border:1px solid var(--vt-line-2);border-radius:999px;width:fit-content;max-width:100%;margin-bottom:18px}
body.prl .vt-fbtn{background:transparent;border:0;border-radius:999px;padding:7px 15px;font-size:13.5px;font-weight:500;color:var(--vt-muted)}
body.prl .vt-fbtn.on{background:#f4f4f6;color:#0a0a0c}
/* the list: hairline rows instead of cards */
body.prl .vt-body{gap:28px}
body.prl .vt-list{gap:0;border-top:1px solid var(--vt-line)}
body.prl .vt-row{background:transparent;border:0;border-bottom:1px solid var(--vt-line);border-radius:0;padding:15px 4px}
body.prl .vt-row:hover{background:rgba(255,255,255,.03)}
body.prl .vt-row.on{background:rgba(255,255,255,.045);border-color:var(--vt-line)}
body.prl .vt-row-subj{font-weight:500;letter-spacing:-.01em}
body.prl .vt-row.unread .vt-row-subj{font-weight:700}
body.prl .vt-row-dot{background:#f4f4f6;top:6px;right:0}
body.prl .vt-chip{border-radius:999px;font-weight:500;padding:3px 10px;border:1px solid var(--vt-line-2);background:transparent;color:var(--vt-muted)}
body.prl .vt-chip.amber{color:#f2f2f4;border-color:#f2f2f4;background:transparent}
body.prl .vt-chip.blue{color:#0a0a0c;background:#f4f4f6;border-color:#f4f4f6}
body.prl .vt-chip.dim{color:var(--vt-dim);background:transparent}
body.prl .vt-empty,body.prl .vt-pick{color:var(--vt-dim)}
/* the thread */
body.prl .vt-thread{background:transparent;border:1px solid var(--vt-line-2);border-radius:16px}
body.prl .vt-thread:not(.open){border:1px solid var(--vt-line)}
body.prl .vt-msg{background:transparent;border:1px solid var(--vt-line-2);border-radius:14px}
body.prl .vt-msg.staff{background:rgba(255,255,255,.06);border-color:var(--vt-line-2)}
body.prl .vt-badge-staff{color:#0a0a0c;background:#f4f4f6;border-radius:999px;padding:1px 8px;font-weight:700}
body.prl .vt-mention{color:#f2f2f4;background:rgba(255,255,255,.1)}
body.prl .vt-att-file,body.prl .vt-attchip{background:transparent;border-color:var(--vt-line-2)}
body.prl .vt-login{background:transparent;border:1px solid var(--vt-line);border-radius:16px}
body.prl .vt-toast,body.prl .vt-mute-menu{background:#111013;border-color:rgba(255,255,255,.17);border-radius:14px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:500}
body.prl .vt-mute-menu button:hover{background:rgba(255,255,255,.06)}
@media (max-width:600px){
  body.prl .vt-dialog{border-radius:0;border:0;padding:18px 16px}
  body.prl .vt-x{top:18px;right:16px}
  body.prl .vt-head h2{font-size:23px}
  body.prl .vt-filters{flex-wrap:nowrap;overflow-x:auto}
}

/* ---- The dialog never scrolls as a whole: the reply box is always on screen ----
   The dialog has a fixed height inside the window; the ticket list and the messages scroll
   inside it, the head, the filters and the reply row stay put. (Before, the whole dialog
   scrolled and the reply row sat below the fold — people did not find it.) */
.vt-dialog{display:flex;flex-direction:column;overflow:hidden;height:min(780px,calc(100vh - 48px));height:min(780px,calc(100dvh - 48px))}
.vt-dialog .vt-host{flex:1;min-height:0;display:flex;flex-direction:column}
.vt-dialog .vt{flex:1;min-height:0}
.vt-dialog .vt-head,.vt-dialog .vt-filters{flex:none}
.vt-dialog .vt-body{flex:1;min-height:0;align-items:stretch;grid-template-rows:minmax(0,1fr)}
.vt-dialog .vt-list{min-height:0;overflow-y:auto;overscroll-behavior:contain}
.vt-dialog .vt-thread{min-height:0;height:100%}
.vt-dialog .vt-msgs{max-height:none;min-height:0;overscroll-behavior:contain}
.vt-dialog .vt-th-head,.vt-dialog .vt-reply,.vt-dialog .vt-closed-note{flex:none}
.vt-dialog .vt-new{flex:1;min-height:0;overflow-y:auto}
.vt-dialog .vt-login{margin:auto 0}
@media (max-width:600px){
  .vt-dialog{height:100%;max-height:none}
}
/* a low window: the head gives its room to the messages */
@media (max-height:720px){
  .vt-dialog .vt-lead{display:none}
  .vt-dialog .vt-head,body.prl .vt-dialog .vt-head{margin-bottom:12px;padding-bottom:12px}
  .vt-dialog .vt-filters,body.prl .vt-dialog .vt-filters{margin-bottom:12px}
  .vt-dialog .vt-compose .vt-input{min-height:44px;height:44px}
}

/* ---- The dialog on a wide window: the filters sit above the ticket list, in its column, and
   the chat starts at their level — it gets the whole height on the right. ---- */
@media (min-width:821px){
  .vt-dialog .vt{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr);column-gap:20px}
  .vt-dialog .vt > *{grid-column:1 / -1}
  .vt-dialog .vt-body{display:contents}
  .vt-dialog .vt-filters{grid-column:1;grid-row:2;flex-wrap:nowrap;width:auto;max-width:none}
  /* each filter as wide as its word needs, the row filled edge to edge */
  .vt-dialog .vt-filters{gap:4px}
  .vt-dialog .vt-fbtn{flex:1 1 auto;min-width:0;padding-left:5px;padding-right:5px;text-align:center;white-space:nowrap;font-size:12.5px;letter-spacing:-.01em}
  body.prl .vt-dialog .vt-filters{gap:0}
  .vt-dialog .vt-list{grid-column:1;grid-row:3}
  .vt-dialog .vt-thread{grid-column:2;grid-row:2 / 4}
  body.prl .vt-dialog .vt{column-gap:28px}
  body.prl .vt-dialog .vt-filters{width:auto}
}

/* the unread badge (tickets.js → paintUnread): a red count on every ticket button / tab, a red dot on the
   button of a closed menu that holds the ticket link */
.vt-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px; border-radius: 999px; background: #ef4444; color: #fff; font: 700 11px/1 system-ui, -apple-system, 'Segoe UI', Arial, sans-serif; letter-spacing: 0; vertical-align: middle; flex: none; box-sizing: border-box; }
.vt-unread-dot { position: relative; }
.vt-unread-dot::before { content: ''; position: absolute; top: -1px; right: -1px; width: 11px; height: 11px; border-radius: 50%; background: #ef4444; box-shadow: 0 0 0 2px #0a0a0c; pointer-events: none; z-index: 1; }