/* ═══════════════════════════════════════════════════════════════════════
   NEXLY — вход, личный кабинет, приглашение, панель статистики
   ═══════════════════════════════════════════════════════════════════════

   Второй файл после nx.css и опирается только на его токены (--ink, --panel,
   --line, --indigo, --bone…). Своей палитры не заводит: две палитры на один
   сайт расходятся при первой же правке.

   Язык тот же, что у публичных страниц:
     • чернильный фон — рабочая среда;
     • индиго — сплошным полем там, где главное на экране (текущий тариф,
       правая колонка входа), а не свечением;
     • «бумага» (bone) — только для документов: удостоверение профиля на
       входе, уровень защиты, ключ шифрования и ключ 2FA. То, что человек
       должен сохранить или прочитать как бумагу, выглядит как бумага.

   Статусные цвета (--pass/--warn/--fail) — только для статусов.
   Моноширинный шрифт — только для данных: суммы, хеши, коды, IP.

   Порядок: совместимость и общие куски → полоса триала → диалоги → вход →
   кабинет → приглашение → панель статистики.
   ═══════════════════════════════════════════════════════════════════════ */

/* ─── совместимость со старыми именами переменных ───
   JS кабинета и строки словарей пишут цвета инлайном через старые имена:
   `color:var(--${sc})` с sc = green|amber|red в истории пополнений,
   var(--accent2) в сообщениях Telegram, var(--surface2) в коде /start.
   nx.css сводит основные (--t, --t1…--t4, --accent, --accent2, --surface,
   --card, --elevated, --shell, --base, --amber, --green, --red); здесь только
   те, которых там нет. Значения nx.css не переопределяем: у одного имени
   должен быть один владелец.
   Несуществующая переменная в инлайн-стиле не ругается — элемент просто
   остаётся неокрашенным, и заметно это только глазами. */
:root{
  --fg:var(--text); --fg2:var(--text-2);
  --accent3:var(--indigo-lo); --accent-glow:var(--indigo-soft); --accent-sub:var(--indigo-soft);
  --surface2:var(--panel-2); --hover:var(--panel-2); --border-e:var(--line-2); --cyan:var(--peri);

  /* поле ввода: на тон темнее панели, чтобы читалось как «лунка» */
  --field:#0F1422;
  --ring:0 0 0 3px rgba(91,92,240,.25);
  --t-150:150ms var(--ease-out);
}

.hidden{display:none!important}
.num{font-variant-numeric:tabular-nums}

/* ─── поля ввода ───
   Одно правило на весь кабинет, вход и панель: высота 44, радиус 10,
   фокус — рамка индиго и кольцо. Раньше у каждого блока был свой инлайн
   (padding 8/10/12, радиус 6/8/10), и соседние поля не совпадали по высоте. */
.field{display:grid;gap:8px;min-width:0}
.field label,.field-label{font-size:14px;font-weight:500;color:var(--text-2);line-height:1.3}
.field-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.field-hint{font-size:13px;color:var(--text-3);line-height:1.5}

.field input,.inline-form input,.team-invite-form input,.team-invite-form select,
.pf-search-input,.uikit-dialog__type-input{
  width:100%;min-width:0;height:44px;padding:0 14px;border-radius:var(--r-md);
  background:var(--field);border:1px solid var(--line-2);color:var(--text);
  font-size:15px;line-height:1.2;outline:none;
  transition-property:border-color,box-shadow,background-color;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.field input::placeholder,.inline-form input::placeholder,.team-invite-form input::placeholder,
.pf-search-input::placeholder,.uikit-dialog__type-input::placeholder{color:#5E667D}
.field input:hover,.inline-form input:hover,.team-invite-form input:hover,.team-invite-form select:hover,.pf-search-input:hover{border-color:#3D4966}
.field input:focus,.inline-form input:focus,.team-invite-form input:focus,.team-invite-form select:focus,
.pf-search-input:focus,.uikit-dialog__type-input:focus{border-color:var(--indigo);box-shadow:var(--ring)}
.field input[readonly],.inline-form input[readonly]{color:var(--text-2)}
.is-mono,.field input.is-mono,.inline-form input.is-mono{font-family:var(--mono);font-size:13px}
input[type="number"]{font-variant-numeric:tabular-nums}
input[type="number"]::-webkit-inner-spin-button{opacity:.4}

/* шесть цифр кода: крупно, по центру, моноширинно — чтобы каждая цифра
   стояла в своей клетке и опечатка была видна до отправки */
.field input.code-input,input.code-input{
  height:52px;text-align:center;font-family:var(--mono);font-size:22px;font-weight:600;
  letter-spacing:.42em;padding-left:calc(14px + .42em);font-variant-numeric:tabular-nums;
}
.field input.code-input::placeholder{color:#3A4461}

.inline-form{display:flex;gap:8px;align-items:center}
.inline-form input{flex:1}
.inline-form .btn{height:44px;flex:none}

/* текстовая кнопка: действие второго плана внутри формы */
.link-btn,.auth-link{
  display:inline;padding:0;border:0;background:none;color:var(--peri);
  font-size:14px;font-weight:500;cursor:pointer;text-align:left;
  text-underline-offset:.2em;justify-self:start;
}
.link-btn:hover,.auth-link:hover{text-decoration:underline}

/* сообщение под формой: JS красит его сам (style.color = var(--red|green)),
   здесь только место и шрифт. Пустое — не занимает строку. */
.auth-error,.topup-error{font-size:14px;line-height:1.45;color:#FF8A94;min-height:0}
.auth-error:empty,.topup-error:empty{display:none}
.auth-error code{font-size:13px}

.empty-text{margin:0;padding:22px 20px;color:var(--text-3);font-size:14px;text-align:center}

/* свой флажок: белый системный квадрат на тёмной форме был самым ярким
   пятном экрана и перетягивал взгляд с текста рядом с ним */
.pf-cb,.enc-check input[type="checkbox"]{
  appearance:none;-webkit-appearance:none;flex:none;margin:0;
  width:18px;height:18px;border-radius:5px;border:1.5px solid #3D4966;background:var(--field);
  display:grid;place-items:center;cursor:pointer;
  transition-property:background-color,border-color;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.pf-cb::after,.enc-check input[type="checkbox"]::after{
  content:"";width:10px;height:10px;transform:scale(0);transition:transform .12s var(--ease-out);
  background:#fff;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);
}
.pf-cb:checked,.enc-check input[type="checkbox"]:checked{background:var(--indigo);border-color:var(--indigo)}
.pf-cb:checked::after,.enc-check input[type="checkbox"]:checked::after{transform:scale(1)}
.pf-cb:indeterminate{background:var(--indigo);border-color:var(--indigo)}
.pf-cb:indeterminate::after{transform:none;clip-path:none;width:8px;height:2px;border-radius:1px}
.pf-cb:focus-visible,.enc-check input[type="checkbox"]:focus-visible{outline:2px solid var(--peri);outline-offset:2px}

/* ─── кнопки, которые рисует старый JS своими классами ───
   Вид берём у .btn из nx.css; здесь только сопоставление классов. */
.uikit-btn-danger,.btn-danger.is-solid{background:var(--fail);border-color:var(--fail);color:#fff}
.uikit-btn-danger:hover,.btn-danger.is-solid:hover{background:#E14B58;border-color:#E14B58}
.btn[disabled]{pointer-events:none}

/* ═══════════════════════════ ПОЛОСА ТРИАЛА ═══════════════════════════
   Создаёт main.js (showTrialBanner) на любой странице, когда триал
   кончается. Раньше — оранжевый градиент во всю ширину, теперь спокойная
   плашка под шапкой: точка предупреждения, текст, кнопка, крестик. */
.trial-banner{
  position:fixed;z-index:70;top:calc(var(--nav-h) + 12px);left:50%;transform:translateX(-50%);
  width:min(760px,calc(100% - 24px));display:flex;align-items:center;gap:12px;
  padding:8px 8px 8px 16px;border-radius:12px;background:var(--panel-2);border:1px solid var(--line-2);
  box-shadow:var(--shadow-1);color:var(--text);font-size:14px;
}
.trial-banner::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--warn)}
.trial-banner-msg{flex:1;min-width:0;line-height:1.4}
.trial-banner .btn{flex:none}
.trial-banner-close{
  flex:none;width:34px;height:34px;border:0;border-radius:8px;background:transparent;color:var(--text-3);
  font-size:22px;line-height:1;transition:background-color var(--t-150),color var(--t-150);
}
.trial-banner-close:hover{background:var(--panel);color:var(--text)}
/* в кабинете и в панели шапки сайта нет — плашка встаёт в правый угол */
body:has(#dashGrid) .trial-banner,body:has(.adm) .trial-banner{top:12px;left:auto;right:16px;transform:none;width:min(560px,calc(100% - 32px))}
@media (max-width:1024px){ body:has(#dashGrid) .trial-banner{top:68px;right:12px;width:calc(100% - 24px)} }
@media (max-width:560px){
  /* текст и крестик — первой строкой, кнопка — второй во всю ширину */
  .trial-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;padding:10px 8px 12px 16px;column-gap:10px;row-gap:8px}
  .trial-banner::before{align-self:start;margin-top:7px}
  .trial-banner .btn{grid-row:2;grid-column:1/-1;margin-right:4px}
}

/* ═══════════════════════════ ДИАЛОГИ И УВЕДОМЛЕНИЯ ═══════════════════════════
   js/modules/uikit.js: подтверждение, предупреждение, всплывающие сообщения.
   Подложка — простое затемнение без размытия: blur на всю страницу под
   диалогом заставлял перерисовывать фон на каждый символ в поле ввода. */
.uikit-overlay{
  position:fixed;inset:0;z-index:1100;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(5,7,12,.72);opacity:0;transition:opacity .18s var(--ease-out);
}
.uikit-overlay.is-open{opacity:1}
.uikit-dialog{
  width:min(460px,100%);padding:24px;border-radius:var(--r-xl);background:var(--panel);border:1px solid var(--line);
  box-shadow:var(--shadow-2);transform:translateY(8px) scale(.98);transition:transform .18s var(--ease-out);
}
.uikit-overlay.is-open .uikit-dialog{transform:none}
.uikit-dialog__head{display:flex;gap:14px;align-items:flex-start}
.uikit-dialog__icon{flex:none;margin-top:2px;color:var(--peri)}
.uikit-dialog__icon svg{width:22px;height:22px}
.uikit-dialog__icon.is-danger{color:var(--fail)}
.uikit-dialog__title-wrap{min-width:0}
.uikit-dialog__title{font-size:19px;line-height:1.25}
.uikit-dialog__message{margin-top:8px;color:var(--text-2);font-size:15px;line-height:1.5;white-space:pre-line}
.uikit-dialog__message:empty{display:none}
.uikit-dialog__body{margin-top:18px}
.uikit-dialog__type{margin-top:18px;display:grid;gap:8px}
.uikit-dialog__type label{font-size:14px;color:var(--text-2)}
.uikit-dialog__type code{padding:1px 6px;border-radius:5px;background:var(--panel-2);color:var(--text);font-size:13px}
.uikit-dialog__type-input{font-family:var(--mono);font-size:14px}
.uikit-dialog__actions{display:flex;justify-content:flex-end;gap:8px;margin-top:24px}
.uikit-dialog__actions .btn{--h:40px;font-size:14px}

.uikit-toasts{
  position:fixed;right:20px;bottom:20px;z-index:1200;display:flex;flex-direction:column;align-items:flex-end;gap:8px;
  pointer-events:none;max-width:calc(100% - 40px);
}
.uikit-toast{
  display:flex;align-items:center;gap:10px;min-width:240px;max-width:400px;padding:12px 16px 12px 14px;
  border-radius:12px;background:var(--panel-2);border:1px solid var(--line-2);box-shadow:var(--shadow-1);
  color:var(--text);font-size:14px;line-height:1.4;pointer-events:auto;
  opacity:0;transform:translateY(8px);transition-property:opacity,transform;transition-duration:.2s;transition-timing-function:var(--ease-out);
}
.uikit-toast.is-open{opacity:1;transform:none}
.uikit-toast__icon{flex:none;display:flex;color:var(--peri)}
.uikit-toast__icon svg{width:18px;height:18px}
.uikit-toast--success .uikit-toast__icon{color:var(--pass)}
.uikit-toast--error .uikit-toast__icon{color:var(--fail)}
.uikit-toast--warning .uikit-toast__icon,.uikit-toast--warn .uikit-toast__icon{color:var(--warn)}
@media (max-width:560px){
  .uikit-toasts{left:12px;right:12px;bottom:12px;max-width:none;align-items:stretch}
  .uikit-toast{max-width:none;min-width:0}
  .uikit-dialog{padding:20px}
  .uikit-dialog__actions{flex-direction:column-reverse}
  .uikit-dialog__actions .btn{width:100%;--h:44px}
}

/* ═══════════════════════════ ВХОД ═══════════════════════════ */
.auth-page{
  min-height:calc(100dvh - var(--nav-h));display:grid;place-items:center;padding:32px var(--gut) 48px;
  background:var(--ink);
}
.auth-card{
  width:min(980px,100%);min-height:600px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  border-radius:var(--r-xl);overflow:hidden;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-2);
}
.auth-left{padding:56px 48px 44px;display:flex;flex-direction:column;min-width:0}
/* секция прижата к верху, а не к центру: при переключении
   вход ↔ сброс заголовок не прыгает вверх-вниз */
.auth-section-body{min-width:0}
.auth-title{font-size:30px;letter-spacing:-.02em;line-height:1.1}
.auth-sub{margin-top:10px;color:var(--text-2);font-size:15px;line-height:1.5}
.auth-sub-strong{color:var(--text);font-weight:600;overflow-wrap:anywhere}
.auth-form{display:grid;gap:16px;margin-top:28px}
.auth-form .btn-lg{--h:50px;font-size:16px}
.auth-or{display:flex;align-items:center;gap:14px;color:var(--text-3);font-size:13px}
.auth-or::before,.auth-or::after{content:"";flex:1;height:1px;background:var(--line)}
.auth-google-btn svg{width:18px;height:18px}
.auth-switch{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;color:var(--text-3);font-size:14px;margin-top:4px}
.auth-switch .auth-link{font-size:14px}

/* правая колонка: сплошное индиго с документом профиля */
.auth-right{
  position:relative;background:var(--indigo);color:#fff;padding:44px 40px 36px;
  display:flex;flex-direction:column;justify-content:space-between;gap:32px;min-width:0;
}
.auth-id{
  width:min(380px,100%);align-self:center;margin-top:12px;
  background:var(--bone);color:var(--bone-ink);border-radius:var(--r-xl);padding:20px 20px 16px;
  box-shadow:0 2px 6px rgba(20,20,80,.25),0 24px 48px -16px rgba(20,20,80,.55);transform:rotate(-2deg);
}
.auth-id .id-print{background:#DADEEA}
.auth-id .id-mrz{border-color:rgba(21,26,43,.25)}
.auth-id .id-name,.auth-id .id-print,.auth-id dd,.auth-id .id-mrz{transition-property:opacity,filter;transition-duration:.16s;transition-timing-function:var(--ease-out)}
.auth-id .is-rolling{opacity:.15;filter:blur(3px)}
.auth-right-copy{display:grid;gap:14px}
.auth-right-lead{font-size:17px;line-height:1.45;color:#fff;font-weight:500;max-width:32ch}
.auth-features{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.auth-features li{
  display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;border-radius:999px;
  background:rgba(255,255,255,.14);color:#fff;font-size:13px;font-weight:500;
}

@media (max-width:900px){
  .auth-card{grid-template-columns:1fr;min-height:0;width:min(520px,100%)}
  .auth-right{display:none}
}
@media (max-width:560px){
  .auth-page{padding:0;place-items:stretch}
  .auth-card{border-radius:0;border:0;box-shadow:none;min-height:calc(100dvh - var(--nav-h))}
  .auth-left{padding:32px 20px 40px}
  .auth-title{font-size:26px}
  .field input,.inline-form input,.team-invite-form input,.team-invite-form select,.pf-search-input,.uikit-dialog__type-input{font-size:16px}
}

/* ═══════════════════════════ КАБИНЕТ: оболочка ═══════════════════════════
   Слева навигация 248px, справа панели. На ≤1024px (isMobile в auth.js)
   навигация скрывается, а бургер в #dashTopbar выдвигает её классом
   .overlay поверх #dashBackdrop. JS ещё и ставит gridTemplateColumns:1fr
   инлайном — правила ниже рассчитаны на это. */
.dash{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100dvh;background:var(--ink)}
.dash-side{
  position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;gap:6px;
  padding:18px 12px 16px;background:var(--ink-2);border-right:1px solid var(--line);overflow-y:auto;
}
.dash-logo{
  display:flex;align-items:center;gap:10px;height:40px;padding:0 10px;margin-bottom:14px;border-radius:var(--r-sm);
  color:var(--text);font-weight:700;font-size:16px;font-variation-settings:"SHRP" 100;
}
.dash-logo:hover{text-decoration:none;background:var(--panel)}
.dash-logo img{width:20px;height:24px}
.dash-nav{display:flex;flex-direction:column;gap:2px}
.dash-link{
  display:flex;align-items:center;gap:12px;width:100%;height:40px;padding:0 12px;border:0;border-radius:var(--r-sm);
  background:transparent;color:var(--text-2);font-size:15px;font-weight:500;text-align:left;cursor:pointer;
  transition-property:background-color,color;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.dash-link svg{flex:none;width:17px;height:17px;color:var(--text-3);transition:color var(--t-150)}
.dash-link:hover{background:var(--panel);color:var(--text);text-decoration:none}
.dash-link:hover svg{color:var(--text-2)}
.dash-link.active{background:var(--panel-2);color:var(--text)}
.dash-link.active svg{color:var(--peri)}
.dash-link:focus-visible{outline-offset:-2px}
.dash-link.danger:hover{color:#FF8A94;background:rgba(240,90,103,.08)}
.dash-link.danger:hover svg{color:#FF8A94}
.dash-side-foot{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:2px}

.dash-main{min-width:0;padding:44px clamp(20px,4vw,56px) 96px}
.dash-panel{max-width:1060px}
.dash-title{font-size:var(--t-2xl);letter-spacing:-.02em;line-height:1.1}
.dash-subtitle{margin-top:10px;margin-bottom:28px;color:var(--text-2);font-size:15px;max-width:68ch}
.dash-title+.sub-current,.dash-title+.dash-hero{margin-top:28px}
.dash-section-title{font-size:var(--t-lg);margin:44px 0 14px}

.dash-topbar{
  position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:10px;height:56px;
  margin:0 calc(-1 * var(--dash-gut,16px)) 24px;padding:0 12px;background:var(--ink);border-bottom:1px solid var(--line);
}
.dash-burger-btn{
  width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:var(--r-sm);background:transparent;color:var(--text);
  transition:background-color var(--t-150),transform var(--t-150);
}
.dash-burger-btn:hover{background:var(--panel)}
.dash-burger-btn:active{transform:scale(.96)}
.dash-topbar-title{flex:1;font-weight:600;font-size:16px}
.dash-topbar-logo{width:18px;height:21px;margin-right:6px}
.dash-backdrop{position:fixed;inset:0;z-index:59;background:rgba(5,7,12,.62)}

@media (max-width:1024px){
  .dash{grid-template-columns:minmax(0,1fr)}
  .dash-side:not(.overlay){display:none!important}
  .dash-side.overlay{
    display:flex!important;position:fixed;inset:0 auto 0 0;z-index:60;width:min(284px,86vw);height:100dvh;
    box-shadow:16px 0 48px -12px rgba(0,0,0,.7);
  }
  .dash-main{--dash-gut:16px;padding:0 16px 72px}
}
@media (max-width:1024px) and (prefers-reduced-motion:no-preference){
  .dash-side.overlay{animation:dashSlide .22s var(--ease-out)}
  @keyframes dashSlide{from{transform:translateX(-24px);opacity:.4}to{transform:none;opacity:1}}
}

/* ─── обзор ─── */
.dash-hero{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 40px;margin-bottom:28px}
.dash-hero h1{font-size:var(--t-2xl);letter-spacing:-.02em;line-height:1.1}
.dash-hero-email{display:inline-flex;align-items:center;gap:8px;margin-top:10px;color:var(--text-2);font-size:15px;overflow-wrap:anywhere}
.dash-hero-email svg{flex:none;color:var(--text-3)}
.dash-hero-stats{display:flex;gap:36px;margin:0}
.dash-hero-stat{display:grid;gap:2px}
.dash-hero-stat dd{margin:0}
.dash-hero-stat-label{font-size:13px;color:var(--text-3)}
.dash-hero-stat-value{font-size:28px;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums;font-variation-settings:"SHRP" 100}

.dash-cards{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;background:var(--ink-2);
}
.dcard{padding:20px 22px 22px;border-left:1px solid var(--line);min-width:0}
.dcard:first-child{border-left:0}
.dcard-label{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--text-3)}
.dcard-icon{flex:none;color:var(--text-3)}
.dcard-value{margin-top:10px;font-size:26px;font-weight:700;line-height:1.1;letter-spacing:-.01em;font-variation-settings:"SHRP" 100;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dcard-plan{background:var(--indigo);color:#fff;border-left-color:transparent}
.dcard-plan+.dcard{border-left-color:transparent}
.dcard-plan .dcard-label{color:rgba(255,255,255,.78)}

.dash-widgets{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px;margin-top:16px}
.dash-widget{padding:20px 22px 12px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line)}
.dash-widget-head h3{font-size:17px}
.dash-widget-head{margin-bottom:6px}
.dash-check-item{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.dash-checklist .dash-check-item:first-child{border-top:0}
.dash-check-mark{width:20px;height:20px;border-radius:50%;border:1.5px solid #3D4966;display:grid;place-items:center;color:var(--ink)}
.dash-check-mark svg{opacity:0}
.dash-check-text{font-size:15px;color:var(--text)}
.dash-check-action{font-size:14px;font-weight:500;white-space:nowrap}
.dash-check-item.is-done .dash-check-mark{background:var(--pass);border-color:var(--pass)}
.dash-check-item.is-done .dash-check-mark svg{opacity:1}
.dash-check-item.is-done .dash-check-text{color:var(--text-3)}
.dash-check-item.is-done .dash-check-action{display:none}
.dash-actions{display:grid;gap:8px;padding:6px 0 10px}
.dact{
  display:flex;align-items:center;gap:12px;height:48px;padding:0 14px;border-radius:var(--r-md);
  border:1px solid var(--line);background:var(--ink-2);color:var(--text);font-size:15px;font-weight:500;
  transition-property:background-color,border-color,transform;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.dact svg{flex:none;width:18px;height:18px;color:var(--text-3)}
.dact:hover{text-decoration:none;background:var(--panel-2);border-color:var(--line-2)}
.dact:active{transform:scale(.98)}

@media (max-width:1100px){ .dash-widgets{grid-template-columns:1fr} }
@media (max-width:860px){
  .dash-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dcard:nth-child(3){border-left:0}
  .dcard:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:560px){
  .dash-hero h1,.dash-title{font-size:26px}
  .dash-hero-stats{gap:28px}
  .dcard{padding:16px}
  .dcard-value{font-size:22px}
}

/* ─── подписка ─── */
.sub-current{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:24px 32px;align-items:center;
  padding:24px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);
}
.sub-plan-badge{
  min-width:112px;height:88px;padding:0 20px;border-radius:var(--r-md);display:grid;place-items:center;
  background:var(--indigo);color:#fff;font-size:26px;font-weight:800;letter-spacing:.02em;font-variation-settings:"SHRP" 100;
}
.sub-details{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0}
.sub-row{display:grid;gap:4px;min-width:0}
.sub-row dt{font-size:13px;color:var(--text-3)}
.sub-row dd{margin:0;font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:980px){
  .sub-current{grid-template-columns:auto minmax(0,1fr)}
  .sub-current .btn{grid-column:1/-1;justify-self:start}
  .sub-details{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .sub-current{grid-template-columns:1fr;padding:20px}
  .sub-plan-badge{justify-self:start;height:64px;min-width:96px;font-size:22px}
}

/* ─── история: платежи, пополнения, рефералы ───
   Строки рисует auth.js (.history-row). Таблица без зебры: разделители
   в волос, суммы моноширинные с табличными цифрами — разряды стоят
   друг под другом. */
.history-list{border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);overflow:hidden}
.history-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;border-top:1px solid var(--line)}
.history-row:first-child{border-top:0}
.history-left{display:grid;gap:2px;min-width:0}
.history-plan{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.history-meta{font-size:13px;color:var(--text-3)}
.history-right{display:flex;align-items:center;gap:14px;flex:none}
.history-amount{font-family:var(--mono);font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.history-status{font-size:13px;color:var(--text-3);white-space:nowrap}
.history-status.completed{color:var(--pass)}
.ref-list .history-list,#refList{border-radius:var(--r-md)}
#refList .history-row{padding:12px 14px}
@media (max-width:560px){
  .history-row{flex-wrap:wrap;gap:6px 12px;padding:12px 16px}
  .history-left{flex:1 1 60%}
}

/* ─── баланс ─── */
.bal-now{color:var(--text);font-size:20px;font-weight:700;font-variant-numeric:tabular-nums;margin-left:4px}
#panel-balance{max-width:760px}
.topup-block{display:grid;gap:16px;padding:24px;margin-bottom:16px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line)}
.topup-block h3{font-size:17px}
.topup-block .topup-sub{font-size:15px;margin-top:4px}
.topup-amounts{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.topup-amt{
  height:44px;border-radius:var(--r-md);border:1px solid var(--line-2);background:transparent;color:var(--text);
  font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;
  transition-property:background-color,border-color,transform;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.topup-amt:hover{background:var(--panel-2)}
.topup-amt:active{transform:scale(.96)}
.topup-amt.active{border-color:var(--indigo);background:var(--indigo-soft)}
.topup-methods{display:grid;gap:8px}
.topup-method{
  position:relative;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;
  border:1px solid var(--line-2);cursor:pointer;transition:border-color var(--t-150),background-color var(--t-150);
}
.topup-method input{position:absolute;opacity:0;pointer-events:none}
.topup-method:has(input:focus-visible){outline:2px solid var(--peri);outline-offset:2px}
.topup-method.active{border-color:var(--indigo);background:var(--indigo-soft)}
.tm-icon{flex:none;width:28px;text-align:center;font-size:22px;font-weight:600;color:var(--text-2)}
.tm-name{font-size:15px;font-weight:600}
.tm-desc{font-size:13px;color:var(--text-3);margin-top:2px}
.topup-pay{margin-top:4px}
.topup-note{font-size:13px;color:var(--text-3)}
#bonusDisplay{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
@media (max-width:560px){
  .topup-block{padding:18px}
  .topup-amounts{grid-template-columns:repeat(3,minmax(0,1fr))}
  .inline-form{flex-wrap:wrap}
  .inline-form .btn{flex:1}
}

/* ─── облачные профили (js/modules/profiles-list.js) ───
   Список виртуальный: строка ОБЯЗАНА быть ровно 64px (ROW_H в JS). Любой
   отступ или рамка, раздувающие строку, сдвинут прокрутку — видимые
   строки поедут относительно реальных, и клик уйдёт не в тот профиль. */
.pf-list{border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);overflow:hidden}
.pf-toolbar{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.pf-search{position:relative;flex:1 1 260px;min-width:0}
.pf-search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--text-3);pointer-events:none}
.pf-search-input{height:40px;padding-left:36px}
.pf-search-input::-webkit-search-cancel-button{filter:invert(.6)}
.pf-stats{font-size:13px;color:var(--text-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.pf-delete-all{color:#FF8A94;border-color:rgba(240,90,103,.35)}
.pf-delete-all:hover{background:rgba(240,90,103,.08);border-color:rgba(240,90,103,.55)}
.pf-delete-all svg{width:14px;height:14px}

.pf-ws-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line)}
.pf-ws-chip{
  display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 12px;border-radius:999px;
  border:1px solid var(--line-2);background:transparent;color:var(--text-2);font-size:13px;font-weight:500;
  transition-property:background-color,border-color,color;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.pf-ws-chip small{font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}
.pf-ws-chip:hover{background:var(--panel-2);color:var(--text)}
.pf-ws-dot{width:6px;height:6px;border-radius:50%;background:var(--text-3)}
.pf-ws-chip.is-active{border-color:var(--indigo);background:var(--indigo-soft);color:var(--text)}
.pf-ws-chip.is-active .pf-ws-dot{background:var(--peri)}
.pf-ws-share{
  margin-left:auto;height:32px;padding:0 12px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:transparent;
  color:var(--text);font-size:13px;font-weight:600;transition:background-color var(--t-150),transform var(--t-150);
}
.pf-ws-share:hover{background:var(--panel-2)}
.pf-ws-share:active{transform:scale(.96)}
.pf-ws-share.is-shared{color:var(--peri)}
/* Действия над пространством стоят справа одной группой: кнопки внутри
   группы отступ слева сами не берут, иначе вторая уезжала бы от первой. */
.pf-ws-tools{margin-left:auto;display:flex;gap:8px}
.pf-ws-tools:empty{display:none}
.pf-ws-tools .pf-ws-share{margin-left:0}
.pf-ws-del{color:#FF8A94;border-color:rgba(240,90,103,.35)}
.pf-ws-del:hover{background:rgba(240,90,103,.08);border-color:rgba(240,90,103,.55)}
.pf-ws-pick{display:grid;gap:2px;max-height:280px;overflow-y:auto;margin:0 -8px}
.pf-ws-pick-row{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:var(--r-sm);cursor:pointer;
  transition:background-color var(--t-150)}
.pf-ws-pick-row:hover{background:var(--panel-2)}
.pf-ws-pick-name{flex:1;min-width:0;font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-ws-pick-row small{font-size:13px;color:var(--text-3);font-variant-numeric:tabular-nums}

.pf-bulk{display:none;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--indigo-soft)}
.pf-bulk.is-active{display:flex}
.pf-bulk-label{flex:1;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.pf-bulk .btn svg{width:14px;height:14px}
.pf-bulk .btn span[style]{margin-left:0!important}

.pf-header,.pf-row{display:grid;grid-template-columns:18px 36px minmax(0,1fr) 168px 36px;column-gap:14px;align-items:center;padding:0 16px}
.pf-header{height:40px;border-bottom:1px solid var(--line);font-size:13px;color:var(--text-3);background:var(--ink-2)}
/* «Параметры» стоят в той же колонке, что имя (строкой ниже), своей
   колонки у них нет — подпись над ними лишняя */
.pf-h-name{grid-column:2/4}
.pf-h-meta{display:none}
.pf-viewport{position:relative;height:min(560px,62vh);overflow-y:auto;overscroll-behavior:contain}
.pf-spacer{position:relative;width:100%}
.pf-window{position:absolute;left:0;right:0;top:0;will-change:transform}
.pf-row{height:64px;min-height:64px;max-height:64px;box-sizing:border-box;border-bottom:1px solid var(--line);overflow:hidden;transition:background-color .12s var(--ease-out)}
.pf-row:hover{background:rgba(255,255,255,.02)}
.pf-row.is-selected{background:var(--indigo-soft)}
.pf-avatar{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:#fff;font-size:14px;font-weight:600}
.pf-main{min-width:0;display:grid;gap:4px}
.pf-name{display:flex;align-items:baseline;gap:8px;min-width:0;font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-hash{font-family:var(--mono);font-size:12px;font-weight:400;color:var(--text-3);flex:none}
.pf-meta{display:flex;gap:6px;min-width:0;overflow:hidden}
.pf-chip{
  display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 8px;border-radius:999px;flex:none;
  background:var(--panel-2);color:var(--text-2);font-size:12px;white-space:nowrap;
}
.pf-chip svg{flex:none;color:var(--text-3)}
.pf-chip span[style]{margin-left:0!important}
.pf-chip--proxy{font-family:var(--mono);font-size:11.5px;flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.pf-chip--proxy span{overflow:hidden;text-overflow:ellipsis}
.pf-chip--encrypted{color:var(--peri);background:var(--indigo-soft)}
.pf-chip--encrypted svg{color:var(--peri)}
.pf-date{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.pf-date-icon{display:flex}
.pf-actions{display:flex;justify-content:flex-end}
.pf-action-btn{
  width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:var(--r-sm);background:transparent;color:var(--text-3);
  transition-property:background-color,color,transform;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.pf-action-btn:hover{background:rgba(240,90,103,.12);color:#FF8A94}
.pf-action-btn:active{transform:scale(.96)}
.pf-empty{padding:56px 20px;text-align:center}
.pf-empty-title{font-size:16px;font-weight:600}
.pf-empty-hint{margin-top:6px;font-size:14px;color:var(--text-3)}
.pf-empty-hint:empty{display:none}
@media (max-width:760px){
  .pf-header,.pf-row{grid-template-columns:18px 36px minmax(0,1fr) 36px;column-gap:12px;padding:0 12px}
  .pf-h-date,.pf-date{display:none}
  .pf-toolbar{padding:12px}
  .pf-ws-bar,.pf-bulk{padding:10px 12px}
  .pf-viewport{height:min(460px,64vh)}
}
/* строка фиксированной высоты не переносится: на узком экране оставляем
   режим отпечатка, прокси и E2E, а «cookies» убираем — иначе прокси
   сжимался в пустую пилюлю */
@media (max-width:560px){
  .pf-chip--cookies{display:none}
  .pf-chip--proxy{flex:0 1 auto;min-width:72px}
  .pf-stats{flex:1}
}

/* ─── безопасность ─── */
/* Уровень защиты — светлая карточка: это справка о состоянии аккаунта,
   её читают как документ, а не как ещё одну плашку интерфейса. */
.sec-hero{
  display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px;margin-bottom:16px;
  border-radius:var(--r-xl);background:var(--bone);color:var(--bone-ink);
}
.sec-hero h2{font-size:22px;letter-spacing:-.01em}
.sec-hero p{margin-top:6px;color:var(--bone-mute);font-size:15px;max-width:52ch}
.sec-score{display:grid;justify-items:center;gap:6px;flex:none}
.sec-score-ring{position:relative;width:76px;height:76px}
.sec-score-ring svg{width:76px;height:76px;transform:rotate(-90deg)}
.sec-score-bg{fill:none;stroke:var(--bone-2);stroke-width:7}
.sec-score-fg{fill:none;stroke:var(--indigo);stroke-width:7;stroke-linecap:round;transition:stroke-dashoffset .6s var(--ease-out)}
.sec-score-val{position:absolute;inset:0;display:grid;place-items:center;font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;font-variation-settings:"SHRP" 100}
.sec-score-label{font-size:12px;color:var(--bone-mute)}

.sec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.sec-card{padding:20px 22px 22px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);min-width:0}
.sec-card-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.sec-card-icon{flex:none;color:var(--text-3)}
.sec-card-head h3{font-size:17px}
.sec-card-body,.sec-card-body>div:not(.sec-info-row):not(.sec-actions):not(.field):not(.auth-error):not(.sec-status){display:grid;gap:14px;align-content:start}
.sec-card-body p{margin:0}
.sec-info-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.sec-card-body>.sec-info-row:first-child{padding-top:0}
/* строки-пары идут сплошным списком: общий зазор тела карточки между ними
   не нужен, иначе список распадается на отдельные плашки */
.sec-info-row+.sec-info-row{margin-top:-14px}
.sec-card-body>.sec-info-row:last-child{border-bottom:0;padding-bottom:0}
.sec-info-row>span:first-child{color:var(--text-3);flex:none}
.sec-info-row>span:last-child{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.sec-info-row .is-money{font-family:var(--mono);font-size:14px}
.sec-hint{font-size:14px;color:var(--text-3);line-height:1.55}
.sec-hint b,.sec-hint strong{color:var(--text-2);font-weight:600}
.sec-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sec-stack{display:grid;gap:8px}
.sec-stack .btn{white-space:normal;text-align:center;line-height:1.25;height:auto;min-height:var(--h)}
.sec-step{font-size:14px;font-weight:600;color:var(--text)}

/* статус: точка + подпись. Цвет только статусный. */
.sec-status{
  display:inline-flex;align-items:center;gap:8px;justify-self:start;height:28px;padding:0 12px;border-radius:999px;
  font-size:13px;font-weight:600;background:var(--panel-2);color:var(--text-2);
}
.sec-status::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--text-3)}
.sec-status.is-bad{background:rgba(240,90,103,.1);color:#FF8A94}
.sec-status.is-bad::before{background:var(--fail)}
.sec-status.is-good,.sec-status.verified{background:rgba(61,214,140,.1);color:var(--pass)}
.sec-status.is-good::before,.sec-status.verified::before{background:var(--pass)}

/* плашка-пояснение с иконкой: код в Telegram, 2FA включена, шифрование включено */
.sec-callout{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:12px;border:1px solid var(--line-2);background:var(--ink-2)}
.sec-callout>svg{flex:none;margin-top:1px}
.sec-callout-title{font-size:14px;font-weight:600;color:var(--text)}
.sec-callout-text{margin-top:2px;font-size:13px;color:var(--text-2);line-height:1.5}
.sec-callout.is-ok{border-color:rgba(61,214,140,.35)}
.sec-callout.is-ok>svg{color:var(--pass)}
.sec-callout.is-tg{border-color:rgba(42,171,238,.4)}
.sec-callout.is-tg>svg{color:var(--tg)}
.sec-callout.is-accent{border-color:rgba(91,92,240,.55);background:var(--indigo-soft)}
.sec-callout.is-accent>svg{color:var(--peri)}

/* QR на белом: камере нужен контраст, это не оформление */
.tfa-qr{justify-self:start;display:flex;justify-content:center;padding:14px;border-radius:12px;background:#fff}
.tfa-qr-box{width:200px;height:200px}
.tfa-qr-box img,.tfa-qr-box canvas{width:200px;height:200px}

/* ключ 2FA и ключ шифрования — «бумажка», которую человек переписывает */
.key-slip{padding:12px 14px;border-radius:12px;background:var(--bone);color:var(--bone-ink)}
.key-slip-label{font-size:12px;color:var(--bone-mute)}
.key-slip-row{display:flex;align-items:center;gap:10px;margin-top:6px}
.key-slip code{flex:1;min-width:0;font-size:14px;font-weight:600;letter-spacing:.14em;word-break:break-all}
.key-slip .btn-ghost{border-color:rgba(21,26,43,.22);color:var(--bone-ink)}
.key-slip .btn-ghost:hover{background:var(--bone-2);border-color:rgba(21,26,43,.35)}

.ref-field{margin-top:4px}
.ref-list{display:grid;gap:8px;margin-top:4px}
.ref-list-title{font-size:14px;font-weight:600;color:var(--text-2)}

@media (max-width:900px){ .sec-grid{grid-template-columns:1fr} }
@media (max-width:560px){
  .sec-hero{flex-direction:column;align-items:flex-start;padding:20px}
  .sec-score{justify-items:start;grid-template-columns:auto auto;align-items:center;gap:12px}
  .sec-card{padding:18px}
}

/* ─── окно ключа шифрования ─── */
.enc-overlay{
  position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(5,7,12,.74);overflow-y:auto;
}
.enc-modal{
  width:min(540px,100%);max-height:calc(100dvh - 40px);overflow-y:auto;display:grid;gap:16px;
  padding:28px;border-radius:var(--r-xl);background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-2);
}
.enc-modal-head{display:flex;align-items:center;gap:12px}
.enc-modal-head svg{flex:none;color:var(--peri)}
.enc-modal-head h2{font-size:20px}
.enc-warn{font-size:14px;color:var(--text-2);line-height:1.55}
.enc-warn b{color:var(--text)}
.enc-key{padding:16px 18px;border-radius:12px;background:var(--bone);color:var(--bone-ink)}
.enc-key-code{font-family:var(--mono);font-size:14px;font-weight:600;line-height:1.8;letter-spacing:.04em;text-align:center;word-break:break-all;user-select:all}
.enc-key-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.enc-check{
  display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:var(--r-md);cursor:pointer;
  border:1px solid var(--line-2);background:var(--ink-2);font-size:13px;color:var(--text-2);line-height:1.5;
}
.enc-check input{margin-top:1px}
.enc-check.is-danger{border-color:rgba(240,90,103,.4);background:rgba(240,90,103,.05)}
.enc-check.is-danger b{color:#FF8A94}
.enc-modal-foot{display:grid;grid-template-columns:1fr 2fr;gap:8px;margin-top:4px}
@media (max-width:560px){
  .enc-overlay{padding:0;align-items:stretch}
  .enc-modal{max-height:none;min-height:100dvh;border-radius:0;border:0;padding:22px 18px}
  .enc-modal-foot{grid-template-columns:1fr}
  .enc-modal-foot #encRevealConfirmBtn{order:-1}
}

/* ─── устройства ─── */
.sessions-list{display:grid;gap:10px}
.session-card{
  display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 20px;
  border-radius:14px;background:var(--panel);border:1px solid var(--line);
}
.session-card.current-session{border-color:rgba(91,92,240,.55)}
.sess-icon{display:flex;color:var(--text-3)}
.current-session .sess-icon{color:var(--peri)}
.sess-body{min-width:0;display:grid;gap:3px}
.sess-device{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:15px;font-weight:600}
.sess-badge{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:999px;background:var(--indigo-soft);color:var(--peri);font-size:12px;font-weight:600}
.sess-meta{font-size:13px;color:var(--text-3);overflow-wrap:anywhere}
.sess-meta b{font-family:var(--mono);font-weight:500;color:var(--text-2);font-size:12.5px}
.sess-meta--dim{font-style:italic;opacity:.8}
.sess-right{display:grid;justify-items:end;gap:8px}
.sess-time{font-size:13px;color:var(--text-3);white-space:nowrap}
.btn-kill{
  height:32px;padding:0 12px;border-radius:var(--r-sm);border:1px solid rgba(240,90,103,.4);background:transparent;
  color:#FF8A94;font-size:13px;font-weight:600;
  transition-property:background-color,transform,opacity;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.btn-kill:hover{background:rgba(240,90,103,.1)}
.btn-kill:active{transform:scale(.96)}
.btn-kill[disabled]{opacity:.5}
@media (max-width:560px){
  .session-card{grid-template-columns:20px minmax(0,1fr);gap:12px;padding:14px 16px}
  .sess-right{grid-column:2;display:flex;justify-content:space-between;align-items:center}
}

/* старый запасной вывод облачных профилей (если модуль списка не загрузился) */
.cloud-profile-card{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}
.cloud-profile-info{flex:1;min-width:0}
.cloud-profile-name{font-weight:600}
.cloud-profile-meta{font-size:13px;color:var(--text-3)}
.cloud-badge{display:inline-flex;height:20px;align-items:center;padding:0 7px;border-radius:999px;background:var(--panel-2);font-size:12px;color:var(--text-2)}
.cloud-badge.green{color:var(--pass)}
.btn-cloud-delete{width:32px;height:32px;border:0;border-radius:8px;background:transparent;color:var(--text-3)}
.btn-cloud-delete:hover{background:rgba(240,90,103,.12);color:#FF8A94}

/* ─── Telegram ─── */
.tg-hero{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:20px;align-items:center;padding:22px 24px;
  border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);
}
/* знак Telegram — единственная цветная «таблетка» на экране: это логотип
   сервиса, к которому привязываются, а не украшение */
.tg-hero-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--tg);color:#fff}
.tg-hero-icon svg{margin-left:-2px}
.tg-hero-text h2{font-size:19px}
.tg-hero-text p{margin-top:6px;color:var(--text-2);font-size:14px;max-width:60ch}
.tg-hero-status{display:grid;justify-items:end;gap:6px}
.tg-hero-status-pill{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 12px;border-radius:999px;background:var(--panel-2);color:var(--text-2);font-size:13px;font-weight:600;white-space:nowrap}
.tg-hero-pill-dot{width:7px;height:7px;border-radius:50%;background:var(--text-3)}
.tg-hero-status-pill.is-linked{background:rgba(61,214,140,.1);color:var(--pass)}
.tg-hero-status-pill.is-linked .tg-hero-pill-dot{background:var(--pass)}
.tg-hero-status-handle{font-family:var(--mono);font-size:13px;color:var(--text-2)}

.tg-trial-note{
  display:flex;align-items:center;gap:14px;margin-top:12px;padding:14px 16px;border-radius:12px;
  background:var(--ink-2);border:1px solid var(--line-2);
}
.tg-trial-note-icon{flex:none;color:var(--peri)}
.tg-trial-note-text{flex:1;min-width:0}
.tg-trial-note-title{font-size:15px;font-weight:600}
.tg-trial-note-desc{margin-top:2px;font-size:13px;color:var(--text-2);line-height:1.5}
.tg-trial-note .btn{flex:none}

.tg-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding:28px 4px 28px}
.tg-feature-icon{color:var(--peri)}
.tg-feature h4{margin-top:12px;font-size:15px;font-weight:600;font-variation-settings:"SHRP" 0}
.tg-feature p{margin-top:4px;color:var(--text-2);font-size:14px;line-height:1.5}
#tgLinkBtn svg{margin:0!important;vertical-align:0!important}
#tgError:empty{display:none}
#tgError{color:var(--text-2)}
#tgError code{padding:2px 6px;border-radius:5px;background:var(--panel-2);font-family:var(--mono);font-size:13px}

.tg-steps-card{margin-top:16px;padding:22px 24px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line)}
.tg-steps-card h3{font-size:17px}
.tg-steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:18px}
.tg-step{display:flex;gap:12px;align-items:flex-start}
.tg-step-num{flex:none;width:28px;height:28px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;font-family:var(--mono);font-size:13px;color:var(--text-2)}
.tg-step h5{margin:3px 0 4px;font-size:15px;font-weight:600}
.tg-step p{font-size:14px;color:var(--text-3);line-height:1.5}
@media (max-width:860px){
  .tg-hero{grid-template-columns:auto minmax(0,1fr)}
  .tg-hero-status{grid-column:1/-1;justify-items:start;display:flex;align-items:center;gap:12px}
  .tg-features,.tg-steps{grid-template-columns:1fr}
  .tg-features{gap:20px;padding:24px 0}
}
@media (max-width:560px){
  .tg-hero{padding:18px}
  .tg-trial-note{flex-wrap:wrap}
  .tg-trial-note .btn{width:100%}
}

/* ─── команда (js/modules/team.js) ─── */
.team-hero{display:flex;gap:14px;align-items:flex-start;padding:20px 22px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line)}
.team-hero-icon{flex:none;display:flex;color:var(--peri);margin-top:2px}
.team-hero h2{font-size:18px}
.team-hero p{margin-top:6px;font-size:14px;color:var(--text-2);max-width:70ch}
.team-orgs{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.team-org-chip{
  display:inline-flex;align-items:center;gap:10px;height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);
  background:transparent;color:var(--text-2);font-size:14px;font-weight:500;
  transition-property:background-color,border-color,color,transform;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.team-org-chip:hover{background:var(--panel-2);color:var(--text)}
.team-org-chip:active{transform:scale(.97)}
.team-org-chip small{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}
.team-org-chip.is-active{border-color:var(--indigo);background:var(--indigo-soft);color:var(--text)}
/* число участников со значком человека — раньше рядом стоял эмодзи */
.team-org-count::before{
  content:"";width:12px;height:12px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1a7 7 0 0114 0v1'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1a7 7 0 0114 0v1'/%3E%3C/svg%3E") center/contain no-repeat;
}
.team-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px;align-items:start}
.team-grid>div{display:flex;flex-direction:column;gap:16px;min-width:0}
.team-card{padding:20px 22px 14px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);min-width:0}
.team-card>h3{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:17px;margin-bottom:12px}
.team-card>.empty-text{padding:14px 0 10px;text-align:left}
.team-card>.btn{margin-bottom:8px}
.team-seats{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:var(--panel-2);color:var(--text-2);font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;font-variation-settings:"SHRP" 0}
.team-seats.is-full{background:rgba(242,181,58,.12);color:var(--warn)}
.team-invite-form{display:grid;grid-template-columns:minmax(0,1fr) 150px auto;gap:8px;margin-bottom:8px}
.team-invite-form select{padding-right:32px;appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23848CA1' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:16px}
.team-invite-form .btn{--h:44px}
.team-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.team-invite-form+.team-row,.team-card>h3+.team-row{border-top:0}
.team-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:14px;font-weight:600}
.team-row-main{min-width:0}
.team-row-email{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-row-sub{font-size:13px;color:var(--text-3)}
.team-badge{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;background:var(--panel-2);color:var(--text-2);font-size:12px;font-weight:600;white-space:nowrap}
.team-badge--owner{background:var(--indigo-soft);color:var(--peri)}
.team-badge--pending{background:rgba(242,181,58,.12);color:var(--warn)}
.team-row-actions{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
/* у приглашения три кнопки: в строку с почтой они не влезают и сжимали
   саму почту в ноль — уводим их второй строкой под текст */
.team-row:has(.team-row-actions>:nth-child(2)){grid-template-columns:36px minmax(0,1fr) auto}
.team-row:has(.team-row-actions>:nth-child(2)) .team-row-actions{grid-column:2/-1;justify-content:flex-start}
.team-row-actions:empty{display:none}
.team-mini-btn{
  height:30px;padding:0 10px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:transparent;
  color:var(--text-2);font-size:12.5px;font-weight:600;white-space:nowrap;
  transition-property:background-color,color,border-color,transform;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.team-mini-btn:hover{background:var(--panel-2);color:var(--text)}
.team-mini-btn:active{transform:scale(.96)}
.team-mini-btn.is-danger{color:#FF8A94;border-color:rgba(240,90,103,.4)}
.team-mini-btn.is-danger:hover{background:rgba(240,90,103,.1)}
.team-audit{display:grid}
.team-audit-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;padding:9px 0;border-top:1px solid var(--line);font-size:13px}
.team-audit-row:first-child{border-top:0}
.team-audit-row time{font-family:var(--mono);font-size:12px;color:var(--text-3);white-space:nowrap}
.team-audit-row span{color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:1100px){ .team-grid{grid-template-columns:1fr} }
@media (max-width:560px){
  .team-invite-form{grid-template-columns:1fr}
  .team-row{grid-template-columns:36px minmax(0,1fr) auto}
  .team-row-actions{grid-column:2/-1;justify-content:flex-start}
  .team-card,.team-hero{padding:18px}
}

/* ═══════════════════════════ ПРИГЛАШЕНИЕ В КОМАНДУ ═══════════════════════════ */
.invite-page{padding:72px 0 96px}
.invite-page h1{font-size:var(--t-4xl);letter-spacing:-.03em;line-height:1.05;max-width:16ch}
.invite-page h1 em{font-style:normal;color:var(--peri)}
.invite-page .lead{margin-top:16px;font-size:var(--t-md)}
.invite-code{margin-top:28px;padding:20px;border-radius:var(--r-lg);background:var(--bone);color:var(--bone-ink)}
.invite-code-label{font-size:13px;color:var(--bone-mute)}
.invite-code-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:8px}
.invite-code code{flex:1 1 240px;min-width:0;font-size:14px;font-weight:600;line-height:1.6;word-break:break-all}
.invite-code .btn-ghost{border-color:rgba(21,26,43,.25);color:var(--bone-ink)}
.invite-code .btn-ghost:hover{background:var(--bone-2)}
.invite-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.invite-hint{margin-top:20px;font-size:14px;color:var(--text-3);max-width:62ch}
.invite-error{margin-top:24px;padding:16px 18px;border-radius:var(--r-lg);border:1px solid rgba(240,90,103,.4);background:rgba(240,90,103,.06);color:var(--text)}

/* ═══════════════════════════ ПАНЕЛЬ СТАТИСТИКИ ═══════════════════════════
   Одна страница для одного человека. Числа везде моноширинные с
   табличными цифрами: в колонке сумм пропорциональный шрифт даёт
   «прыгающие» разряды, и сравнить две строки глазом нельзя — а это
   единственное, зачем таблица нужна. */
.adm{min-height:100dvh;background:var(--ink);color:var(--text);position:relative}
.adm-hidden{display:none!important}
.adm-wrap{max-width:1280px;margin:0 auto;padding:24px var(--gut) 96px}

.adm-top{display:flex;align-items:center;flex-wrap:wrap;gap:16px;padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--line)}
.adm-brand{display:flex;align-items:center;gap:12px}
.adm-mark{display:flex;flex:none}
.adm-mark img{width:26px;height:30px}
.adm-brand-text h1{font-size:19px;letter-spacing:-.01em}
.adm-brand-text span{display:block;font-family:var(--mono);font-size:12px;color:var(--text-3)}
.adm-top-right{margin-left:auto;display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.adm-who{font-family:var(--mono);font-size:12px;color:var(--text-2);height:34px;display:inline-flex;align-items:center;padding:0 12px;border-radius:999px;border:1px solid var(--line)}

.adm-seg{display:inline-flex;padding:3px;gap:2px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
.adm-seg button{
  height:28px;padding:0 12px;border:0;border-radius:7px;background:transparent;color:var(--text-2);font-size:13px;font-weight:600;white-space:nowrap;
  transition-property:background-color,color;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.adm-seg button:hover{color:var(--text)}
.adm-seg button.on{background:var(--panel-2);color:var(--text);box-shadow:0 1px 2px rgba(0,0,0,.4)}

.adm-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;padding:0 14px;border-radius:var(--r-sm);
  border:1px solid var(--line-2);background:transparent;color:var(--text);font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer;
  transition-property:background-color,border-color,color,transform;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.adm-btn:hover{background:var(--panel-2)}
.adm-btn:active{transform:scale(.96)}
.adm-btn.primary{background:var(--indigo);border-color:var(--indigo);color:#fff}
.adm-btn.primary:hover{background:var(--indigo-hi);border-color:var(--indigo-hi)}
.adm-btn.danger{color:#FF8A94;border-color:rgba(240,90,103,.4)}
.adm-btn.danger:hover{background:rgba(240,90,103,.1)}
.adm-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}

/* вход в панель */
.adm-gate{min-height:100dvh;display:grid;place-items:center;padding:32px 20px}
.adm-gate-card{width:min(400px,100%);padding:32px 28px 26px;border-radius:var(--r-xl);background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-2)}
.adm-gate-mark{display:flex;margin-bottom:20px}
.adm-gate-mark img{width:30px;height:34px}
.adm-gate-card h2{font-size:24px;letter-spacing:-.02em}
.adm-gate-card>p{margin:8px 0 24px;color:var(--text-2);font-size:15px;line-height:1.5}
.adm-gate-card .adm-btn-full{width:100%;height:48px;font-size:15px;border-radius:var(--r-md)}
.adm-code{
  width:100%;height:56px;margin-bottom:12px;border-radius:var(--r-md);background:var(--field);border:1px solid var(--line-2);color:var(--text);
  font-family:var(--mono);font-size:24px;font-weight:600;letter-spacing:.4em;text-align:center;padding-left:.4em;outline:none;font-variant-numeric:tabular-nums;
  transition-property:border-color,box-shadow;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.adm-code:focus{border-color:var(--indigo);box-shadow:var(--ring)}
.adm-code::placeholder{color:#3A4461}
.adm-gate-msg{min-height:21px;margin-top:14px;font-size:14px;line-height:1.5;color:var(--text-3)}
.adm-gate-msg:empty{min-height:0;margin-top:0}
.adm-gate-msg.err{color:#FF8A94}
.adm-gate-msg.ok{color:var(--pass)}
.adm-gate-msg.hint{color:var(--text-2)}
.adm-gate-foot{margin-top:22px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;line-height:1.55;color:var(--text-3)}

/* показатели: первая карточка — индиговое поле (приход за период),
   остальные на панели. Цветных полосок по группам больше нет: группа
   и так читается по подписи, а четыре цвета над цифрами спорили с ними. */
.adm-kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-bottom:16px}
.adm-kpi{padding:18px 18px 16px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);min-width:0}
.adm-kpi:first-child{background:var(--indigo);border-color:var(--indigo);color:#fff}
.adm-kpi-label{font-size:13px;color:var(--text-3)}
.adm-kpi:first-child .adm-kpi-label,.adm-kpi:first-child .adm-kpi-sub{color:rgba(255,255,255,.78)}
.adm-kpi-value{margin-top:8px;font-family:var(--mono);font-size:25px;font-weight:600;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adm-kpi-sub{margin-top:8px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:12.5px;color:var(--text-3)}
.adm-kpi-sub b{color:var(--text);font-weight:600}
.adm-delta{font-family:var(--mono);font-size:12px;font-weight:600;font-variant-numeric:tabular-nums;padding:1px 7px;border-radius:999px}
.adm-delta.up{color:var(--pass);background:rgba(61,214,140,.12)}
.adm-delta.down{color:#FF8A94;background:rgba(240,90,103,.12)}
.adm-delta.flat{color:var(--text-3);background:var(--panel-2)}
.adm-kpi:first-child .adm-delta{background:rgba(255,255,255,.16);color:#fff}
.adm-kpi:first-child .adm-tag{background:rgba(255,255,255,.16);color:#fff}

.adm-grid{display:grid;gap:16px;margin-bottom:16px}
.adm-grid.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.adm-panel{padding:20px 22px 22px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);min-width:0;margin-bottom:0}
section.adm-panel:not(.adm-grid>*){margin-bottom:16px}
.adm-panel-head{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.adm-panel-head h3{font-size:17px}
.adm-panel-head .adm-seg{margin-left:auto}
.adm-note{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-size:13px;line-height:1.55;color:var(--text-3)}
.adm-note b{color:var(--text-2)}

.adm-chart{width:100%;display:block;overflow:visible}
.adm-chart .grid{stroke:var(--line);stroke-width:1}
.adm-chart .axis{fill:var(--text-3);font:500 11px var(--mono)}
.adm-chart .area{fill:url(#admGrad)}
.adm-chart .line{fill:none;stroke:var(--indigo-hi);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.adm-chart .ma{fill:none;stroke:var(--text-3);stroke-width:1.5;stroke-dasharray:4 3}
.adm-chart .dot{fill:var(--peri);stroke:var(--panel);stroke-width:2}
.adm-chart .hit{fill:transparent;cursor:crosshair}
.adm-legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:10px;font-size:13px;color:var(--text-3)}
.adm-legend i{display:inline-block;width:16px;height:2px;border-radius:2px;margin-right:6px;vertical-align:middle;background:var(--indigo-hi)}
.adm-legend i.is-ma{background:none;border-top:2px dashed var(--text-3);height:0}
.adm-tip{
  position:fixed;z-index:40;padding:10px 12px;border-radius:var(--r-md);background:var(--panel-2);border:1px solid var(--line-2);
  box-shadow:var(--shadow-1);font:500 12px/1.6 var(--mono);font-variant-numeric:tabular-nums;color:var(--text);
  pointer-events:none;opacity:0;transition:opacity .12s var(--ease-out);white-space:nowrap;
}
.adm-tip.on{opacity:1}
.adm-tip b{color:var(--peri);font-weight:600}

/* таблицы: без зебры, разделители в волос, шапка — приглушённый текст */
.adm-scroll{overflow-x:auto;margin:0 -22px;padding:0 22px}
.adm-tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.adm-tbl th{text-align:left;font-weight:500;font-size:13px;color:var(--text-3);padding:0 12px 10px 0;border-bottom:1px solid var(--line);white-space:nowrap}
.adm-tbl td{padding:10px 12px 10px 0;border-bottom:1px solid var(--line);color:var(--text-2);vertical-align:middle;font-variant-numeric:tabular-nums}
.adm-tbl th:last-child,.adm-tbl td:last-child{padding-right:0}
.adm-tbl tr:last-child td{border-bottom:0}
/* дата в первой колонке переносилась на три строки и раздувала таблицу */
.adm-tbl:not(.adm-cohort) td:first-child{white-space:nowrap}
.adm-tbl tbody tr:hover td{color:var(--text)}
.adm-tbl .num{text-align:right;font-family:var(--mono);font-size:13px;font-weight:500;color:var(--text);white-space:nowrap}
.adm-tbl th.num{font-family:var(--f);font-weight:500;color:var(--text-3)}
.adm-tbl .mail{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}
.adm-tag{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:5px;background:var(--panel-2);color:var(--text-2);font-size:11.5px;font-weight:600;white-space:nowrap;vertical-align:1px}
.adm-tag.ok{background:rgba(61,214,140,.12);color:var(--pass)}
.adm-tag.warn{background:rgba(242,181,58,.12);color:var(--warn)}
.adm-tag.bad{background:rgba(240,90,103,.12);color:#FF8A94}
.adm-tag.new{background:var(--indigo-soft);color:var(--peri)}
.adm-panel-head .adm-tag{height:auto;min-height:20px;padding:2px 8px;white-space:normal;line-height:1.35}

/* воронка: полоса — доля шага, наложенный диапазон — 95% интервал */
.adm-funnel-row{margin-bottom:16px}
.adm-funnel-row:last-child{margin-bottom:0}
.adm-funnel-top{display:flex;align-items:baseline;gap:10px;margin-bottom:7px;font-size:14px;color:var(--text-2)}
.adm-funnel-top .n{margin-left:auto;font-family:var(--mono);font-size:13px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.adm-bar{position:relative;height:8px;border-radius:999px;background:var(--ink);overflow:hidden}
.adm-bar .fill{position:absolute;inset:0 auto 0 0;border-radius:999px;background:var(--indigo)}
.adm-bar .ci{position:absolute;top:0;bottom:0;background:rgba(255,255,255,.18);border-left:1px solid rgba(255,255,255,.45);border-right:1px solid rgba(255,255,255,.45)}
.adm-funnel-sub{margin-top:6px;font-family:var(--mono);font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}

/* когорты: прозрачность индиго пропорциональна значению (admin.js) */
.adm-cohort{border-collapse:separate;border-spacing:3px;font-size:12px}
.adm-cohort th{font-family:var(--mono);font-size:11.5px;font-weight:500;color:var(--text-3);padding:3px 6px;text-align:center;border:0}
.adm-cohort th.lead{text-align:left}
.adm-cohort td{padding:7px 8px;text-align:center;border:0;border-radius:6px;font-family:var(--mono);font-size:12px;font-weight:600;color:#fff;min-width:48px}
.adm-cohort td.lead{text-align:left;background:transparent;color:var(--text-2);font-weight:500;white-space:nowrap}
.adm-cohort td.empty{background:transparent;color:var(--line-2)}
/* незакрытый месяц всегда занижен — отмечаем пунктиром и приглушаем,
   иначе его читают как обвал */
.adm-cohort td.partial{outline:1px dashed #5E667D;outline-offset:-1px;opacity:.6}
.adm-heat-legend{display:flex;align-items:center;gap:8px;margin-top:12px;font-family:var(--mono);font-size:12px;color:var(--text-3)}
.adm-heat-legend .sw{width:96px;height:8px;border-radius:999px;background:linear-gradient(90deg,rgba(91,92,240,.1),rgba(91,92,240,.95))}

.adm-perk{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.adm-perk:last-child{border-bottom:0}
.adm-perk-pct{min-width:52px;font-family:var(--mono);font-size:15px;font-weight:600;color:var(--peri);font-variant-numeric:tabular-nums}
.adm-perk-main{flex:1;min-width:0}
.adm-perk-main .who{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.adm-perk-main .meta{margin-top:2px;font-family:var(--mono);font-size:12px;color:var(--text-3)}
.adm-x{
  flex:none;width:28px;height:28px;margin-left:6px;border-radius:7px;border:1px solid var(--line-2);background:transparent;
  color:var(--text-3);font-size:15px;line-height:1;transition-property:border-color,color,background-color;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.adm-x:hover{border-color:rgba(240,90,103,.5);color:#FF8A94;background:rgba(240,90,103,.08)}
.adm-empty{padding:28px 12px;text-align:center;font-size:14px;color:var(--text-3)}
.adm-managed{margin-top:14px;padding:12px 14px;border-radius:var(--r-md);background:var(--ink-2);border:1px solid var(--line);font-size:13px;line-height:1.55;color:var(--text-3)}
.adm-err{padding:14px 16px;border-radius:var(--r-md);border:1px solid rgba(240,90,103,.35);background:rgba(240,90,103,.06);color:#FF8A94;font-size:14px;line-height:1.55}
.adm-err b{color:var(--text)}
.adm-skel{height:14px;border-radius:6px;background:var(--panel-2)}
@media (prefers-reduced-motion:no-preference){
  .adm-skel{animation:admPulse 1.4s var(--ease-io) infinite}
  @keyframes admPulse{50%{opacity:.5}}
}

/* блок управления: каждое нажатие здесь двигает деньги — поэтому он
   отделён от аналитики рамкой потемнее и пометкой «пишется в журнал» */
#admManage{border-color:var(--line-2)}
.adm-mgr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.adm-mgr-col{min-width:0}
.adm-lbl{display:block;margin-bottom:8px;font-size:14px;font-weight:500;color:var(--text-2)}
.adm-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.adm-inp{
  flex:1;min-width:0;height:40px;padding:0 12px;border-radius:var(--r-sm);background:var(--field);border:1px solid var(--line-2);
  color:var(--text);font-size:14px;outline:none;transition-property:border-color,box-shadow;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.adm-inp:focus{border-color:var(--indigo);box-shadow:var(--ring)}
.adm-inp::placeholder{color:#5E667D}
input.adm-inp[type="number"],#admDelta,#admBonus{font-family:var(--mono);font-variant-numeric:tabular-nums}
select.adm-inp{cursor:pointer}
.adm-narrow{flex:0 0 112px}
.adm-row .adm-btn{height:40px}
.adm-hint{margin-top:8px;font-size:13px;line-height:1.55;color:var(--text-3)}
.adm-hint b{color:var(--text-2)}
.adm-sep{height:1px;margin:24px 0 20px;background:var(--line)}
.adm-msg{min-height:21px;margin-top:16px;font-size:14px;line-height:1.55}
.adm-msg:empty{min-height:0}
.adm-msg.ok{color:var(--pass)}
.adm-msg.err{color:#FF8A94}
.adm-msg.busy{color:var(--text-3)}
.adm-find{margin-top:10px;display:grid;gap:6px}
.adm-find button{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;width:100%;padding:10px 12px;border-radius:var(--r-sm);
  border:1px solid var(--line);background:var(--ink-2);color:var(--text-2);font-size:13.5px;text-align:left;
  transition-property:border-color,color,background-color;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.adm-find button:hover{border-color:var(--line-2);color:var(--text)}
.adm-find button.on{border-color:var(--indigo);background:var(--indigo-soft);color:var(--text)}
.adm-find button b{font-weight:600;color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-find button span{flex:none;font-family:var(--mono);font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}
.adm-picked{margin-top:12px;padding:14px;border-radius:var(--r-md);background:var(--ink-2);border:1px solid var(--line-2)}
.adm-picked .mail{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-picked .facts{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px 16px;font-family:var(--mono);font-size:12.5px;color:var(--text-3);font-variant-numeric:tabular-nums}
.adm-picked .facts b{color:var(--text);font-weight:600}
.adm-pager{display:flex;align-items:center;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.adm-pager span{flex:1;text-align:center;font-family:var(--mono);font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}
.adm-pager button{
  height:32px;padding:0 12px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:transparent;color:var(--text-2);font-size:13px;font-weight:600;white-space:nowrap;
  transition-property:background-color,color;transition-duration:.15s;transition-timing-function:var(--ease-out);
}
.adm-pager button:hover:not(:disabled){background:var(--panel-2);color:var(--text)}
.adm-pager button:disabled{opacity:.35;cursor:default}

@media (max-width:980px){ .adm-grid.c2{grid-template-columns:1fr} }
@media (max-width:760px){
  .adm-mgr{grid-template-columns:1fr;gap:22px}
  .adm-narrow{flex:1 1 90px}
}
@media (max-width:560px){
  .adm-wrap{padding:16px 16px 72px}
  .adm-top-right{margin-left:0;width:100%}
  .adm-top-right .adm-seg{order:-1;width:100%}
  .adm-top-right .adm-seg button{flex:1}
  .adm-who{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .adm-panel{padding:18px 16px}
  .adm-scroll{margin:0 -16px;padding:0 16px}
  .adm-panel-head .adm-seg{margin-left:0;width:100%}
  .adm-panel-head .adm-seg button{flex:1;padding:0 6px}
  .adm-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .adm-kpi{padding:14px}
  .adm-kpi-value{font-size:20px}
  .adm-inp,.adm-code{font-size:16px}
  .adm-code{font-size:22px}
}
@media (max-width:380px){ .adm-kpis{grid-template-columns:1fr} }

/* Бейдж в карточке KPI (например «свои счета $40,00 — не в счёт») на телефоне
   шире колонки: разрешаем перенос, иначе вся страница уезжает вбок. */
@media (max-width:560px){ .adm .adm-tag{white-space:normal;max-width:100%;height:auto;min-height:20px;padding:2px 7px;line-height:1.35} }

/* Правая панель входа говорит одной фразой; три чипа-преимущества сняты. */
.auth-right .auth-features{display:none}