/* ScanLex — оболочка страниц входа, оплаты и кабинета: login, registr, forgot, reset,
   buy, cabinet, success, unsubscribe. Общая часть — css/ui.css (грузится первым).
   Здесь: узкая шапка, карточка-контейнер, формы, сообщения, тарифная врезка.
   ⚠️ Имена классов совпадают со старым /auth.css — разметка страниц не менялась. */

body{background:#F7F7F8;
     background:linear-gradient(135deg,color-mix(in oklab,var(--accent) 6%,#fff) 0%,#fff 45%,color-mix(in oklab,var(--accent) 4%,#fff) 100%);
     min-height:100vh}

/* Шапка — та же стеклянная полоса, что на публичных страницах, но без меню:
   у этих страниц одно действие, лишние ссылки уводят. */
.nav .brand{margin-right:auto}   /* всё, что правее логотипа, прижато к краю */
.nav .links{display:flex;align-items:center;gap:18px;font-weight:600;font-size:14px}
.nav .links a,.nav .back{color:var(--ink);font-weight:600;font-size:14px;white-space:nowrap}
.nav .links a:hover,.nav .back:hover{color:var(--accent)}
.nav .brand img{width:28px;height:28px}

/* Контейнер: узкий — форма, mid — кабинет и успех оплаты, wide — витрина тарифов */
.auth{max-width:460px;margin:44px auto 64px;padding:0 20px}
.auth.mid{max-width:640px}
.auth.wide{max-width:900px}
.auth .card{padding:32px 32px 28px;border-radius:22px}
.card h1{font-weight:600;font-size:26px;line-height:1.2;letter-spacing:-.02em;margin:0 0 8px}
.card .sub{color:var(--mute);font-size:15px;line-height:1.55;margin:0 0 22px}

/* Формы */
.fg{margin-bottom:16px}
.fg label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:7px}
.fg input,.fg select,.fg textarea{width:100%;padding:13px 15px;border:1px solid var(--line2);
  border-radius:12px;font-size:15px;font-family:var(--sans);background:#fff;color:var(--ink)}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(37,99,235,.15)}

/* Кнопки: на этих страницах основная кнопка — во всю ширину карточки.
   Инлайновые (в кабинете) помечены классом .sm. */
.btn{display:flex;width:100%;padding:14px 22px;font-size:15.5px;border:1.5px solid transparent;
     background:var(--accent);color:#fff;font-family:var(--sans);font-weight:600;cursor:pointer}
.btn:hover{filter:brightness(1.1);color:#fff}
.btn.ghost{background:transparent;border-color:var(--ink);color:var(--ink);filter:none}
.btn.ghost:hover{background:rgba(255,255,255,.85);color:var(--ink);filter:none}
.btn.sm{display:inline-flex;width:auto;padding:11px 18px;font-size:14px}

/* Сообщения */
.msg{padding:13px 16px;border-radius:14px;font-size:14.5px;line-height:1.5;margin-bottom:18px}
.msg.err{background:#FEF2F2;border:1px solid #FECACA;color:#991B1B}
.msg.ok{background:#ECFDF3;border:1px solid #BBF7D0;color:#137333}
.hint{font-size:13px;line-height:1.5;color:var(--mute);margin-top:6px}
.alt{text-align:center;margin-top:20px;font-size:14.5px;color:var(--mute)}

/* Врезка выбранного тарифа на оформлении заказа */
.tariff{background:rgba(255,255,255,.7);border:1px solid var(--glassb);border-radius:18px;
  padding:20px 22px;margin-bottom:22px}
.tariff .price{font-weight:600;font-size:32px;letter-spacing:-.03em;color:var(--ink)}
.tariff .price span{font-size:15px;font-weight:400;color:var(--mute);letter-spacing:0}
.tariff ul{margin:12px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.tariff li{position:relative;padding-left:20px;font-size:14.5px;line-height:1.45;color:var(--mute)}
.tariff li:before{content:"·";position:absolute;left:4px;top:-3px;color:var(--accent);
  font-weight:700;font-size:20px}

/* Плашки статуса — используются и в кабинете, и на успехе оплаты */
.pill{display:inline-block;padding:4px 11px;border-radius:999px;font-size:12.5px;font-weight:600;
  white-space:nowrap}
.pill.ok{background:#ECFDF3;color:#137333}
.pill.warn{background:#FFF3E0;color:#B45309}
.pill.err{background:#FEF2F2;color:#B42318}
.muted{color:var(--mute);font-size:14px}

@media(max-width:560px){
  .auth{margin-top:28px;padding:0 14px}
  .auth .card{padding:24px 20px 22px;border-radius:18px}
  .card h1{font-size:23px}
}