/* Личный кабинет (lk/) — поверх style.css лендинга: те же карточки, кнопки и шрифты */
/* Полировка (unslop, 2026-11-02): плотные поверхности вместо стекла с размытием — свет чёрной дыры не идёт под текст;
   линии — волосяные, без свечения и цветных градиентов; заголовки и цифра срока — Unbounded сплошным цветом;
   подписи — строчные, без капса с разрядкой; цифры одной ширины; отступы — по сетке 4px. Яркое на экране — только дыра */
.lk, .lk-cookie, .lk-toast { --lk-surface: #0d1724; --lk-raised: #142232; --lk-field: #0a121d; --lk-hair: rgba(210,237,241,.08);
  --lk-hair-2: rgba(210,237,241,.14); --lk-ok: #7fd6a4; --lk-warn: #f0b35a; --lk-off: #e07a7a; }
.lk { font-variant-numeric: tabular-nums; }
/* карточки кабинета — одна плотная поверхность (у лендинга — градиент с подсветкой и полоской снизу) */
.lk .card { background: var(--lk-surface); border-color: var(--lk-hair-2); box-shadow: none; }
.lk .card::before, .lk .card::after { display: none; }
.lk .card h3 { font: 600 17px/1.3 var(--display); letter-spacing: -.01em; color: var(--text);
  background: none; -webkit-background-clip: border-box; background-clip: border-box; }
/* основная кнопка — светлая из той же гаммы, без градиента и свечения */
.lk .btn-primary, .lk-cookie .btn-primary { background: var(--ice); color: var(--space); border-color: transparent; box-shadow: none; }
@media (hover: hover) and (pointer: fine) {
  .lk .btn-primary:hover, .lk-cookie .btn-primary:hover { background: var(--text); box-shadow: none; }
  .lk .btn:not(.btn-primary):hover { background-color: var(--lk-raised); border-color: var(--lk-hair-2); }
}
.lk .btn:not(.btn-primary) { background: var(--lk-surface); border-color: var(--lk-hair-2); }
.lk { min-height: calc(100svh - 160px); }
/* как на лендинге: содержимое слева, справа — чёрная дыра (space.js рисует её у правого края) */
.lk #view, .lk .kicker { max-width: 760px; }
.lk .kicker { font-size: 14px; }
.lk .card + .card, .lk .card + p, .lk p + .card, .lk .lk-actions + .card { margin-top: 16px; }
.lk .grid > .card { margin-top: 0; }
.lk .card p { margin-top: 8px; }
.lk-card h3 { margin: 0 0 4px; }
.lk-rows { margin: 12px 0 0; display: grid; gap: 8px; }
.lk-rows div { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.lk-rows dt { color: var(--muted); font: 500 14px var(--mono); }
.lk-rows dt::after { content: ' —'; }
.lk-rows dd { margin: 0; font-weight: 500; color: var(--text); }
.lk-actions, .lk-plans { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.lk-plans .btn { flex: 1 1 200px; justify-content: center; }
.lk-disc { color: var(--caret); font: 600 13px var(--mono); margin-left: 4px; }
.lk-back { margin-top: 24px; }
.lk-muted { color: var(--muted); font-size: 14px; }
.lk a:not(.btn):not(.pill) { color: var(--accent-2); }
.lk-link { font: 500 13px var(--mono); color: var(--ice); word-break: break-all; padding: 12px 16px; margin-top: 16px;
  border: 1px solid var(--lk-hair-2); border-radius: 10px; background: var(--lk-field); }
.lk-qr { display: block; width: 200px; height: 200px; margin: 16px 0 0; border-radius: 10px; background: #fff; image-rendering: pixelated; }
.lk-stores { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; color: var(--muted); font: 500 13px var(--mono); }
.lk-dev { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--lk-hair); }
.lk-dev:last-child { border-bottom: 0; }
.lk-dev small { display: block; color: var(--muted); font: 500 12px var(--mono); margin-top: 2px; }
.lk-form { display: grid; gap: 12px; margin-top: 16px; }
.lk-form input { min-width: 0; padding: 12px 16px; border-radius: 10px; border: 1px solid var(--lk-hair-2);
  background: var(--lk-field); color: var(--text); font: 500 14px var(--mono); }
.lk-form input:focus { outline: none; border-color: var(--caret); }
.lk-form input::placeholder { color: var(--muted); opacity: 1; }   /* браузерный серый на карточке — контраст 2.8, ниже нормы */
.lk-form .btn { justify-self: start; }
.lk-tabs { display: flex; gap: 8px; }
.lk-tabs .btn { padding: 8px 16px; }
.lk-tabs .btn.is-on { border-color: var(--caret); color: var(--text); }
.lk-narrow { max-width: 520px; }
.lk-steps { margin: 12px 0 0; padding-left: 20px; color: var(--text-2); line-height: 1.6; }
.lk-steps li + li { margin-top: 8px; }
.lk-status { font: 500 14px var(--mono); color: var(--accent-2); }
/* красные кнопки (удалить, перевыпустить) — .btn в селекторе: сильнее общего правила кнопок кабинета вверху */
.lk .btn.lk-danger { border-color: rgba(224,122,122,.5); color: #f0b4b4; }
@media (hover: hover) and (pointer: fine) { .lk .btn.lk-danger:hover { border-color: rgba(224,122,122,.75); background: var(--lk-raised); } }
.lk-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); z-index: 20; max-width: min(520px, calc(100% - 32px));
  padding: 12px 20px; border-radius: 12px; background: var(--lk-raised); border: 1px solid var(--lk-hair-2); color: var(--text);
  box-shadow: 0 10px 30px -10px rgba(0,0,0,.8); font-size: 14px; }
.nav a[aria-current] { color: var(--text); }
@media (max-width: 640px) { .lk .grid-2 { grid-template-columns: 1fr; } .lk-actions .btn { flex: 1 1 100%; justify-content: center; } }
/* плашка аккаунта под кабинетом: кто вошёл + кнопки аккаунта (вместо строки ссылок) */
.lk .lk-account { margin-top: 24px; padding: 16px 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.lk-acc-id { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; min-width: 0; }
.lk-acc-label { font: 500 13px var(--mono); color: var(--muted); }
.lk-acc-name { font-weight: 500; color: var(--text); word-break: break-all; }
.lk-chip { display: inline-flex; align-items: center; gap: 8px; padding: 4px 12px; border-radius: 999px; font: 500 12px var(--mono);
  color: var(--text-2); border: 1px solid var(--lk-hair-2); background: var(--lk-raised); }
.lk-chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--lk-ok); }
.lk-chip-off { color: var(--muted); background: var(--lk-surface); }
.lk-chip-off i { background: var(--muted); }
.lk-acc-actions { display: flex; flex-wrap: wrap; gap: 8px; }
/* тихая кнопка (выйти, забыли пароль): та же кнопка с рамкой, только приглушённая — не ссылка */
.lk .btn.lk-ghost { border-color: var(--lk-hair); background: transparent; color: var(--muted); }
@media (hover: hover) and (pointer: fine) { .lk .btn.lk-ghost:hover { color: var(--text); border-color: var(--lk-hair-2); background: transparent; } }
/* запрос разрешения на cookie входа (bf_s): снизу поверх страницы, пока не ответили; тост на это время — сверху */
.lk-cookie { position: fixed; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 30; width: min(680px, calc(100% - 32px));
  padding: 16px 20px; border-radius: 14px; background: var(--lk-raised); border: 1px solid var(--lk-hair-2);
  box-shadow: 0 16px 40px -12px rgba(0,0,0,.85); color: var(--text-2); font-size: 14px; }
.lk-cookie p { margin: 0; line-height: 1.55; }
.lk-cookie b { color: var(--text); }
.lk-cookie code, .lk code { font: 500 13px var(--mono); color: var(--ice); }
.lk-cookie .lk-actions { margin-top: 12px; }
.cookie-open .lk-toast { top: 24px; bottom: auto; }
/* галочка согласия на обработку данных (отдельная, не отмечена заранее) и строка про соглашение */
.lk-check { display: flex; align-items: flex-start; gap: 8px; margin-top: 12px; font-size: 14px; line-height: 1.5; color: var(--text-2); cursor: pointer; }
.lk-check input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--caret); cursor: pointer; }
.lk-form .lk-check { margin-top: 2px; }
.lk-terms { margin-top: 16px; max-width: 760px; }
.lk-cookie a, .lk-check a, .lk-terms a { color: var(--accent-2); }
.lk .lk-consent { border-color: var(--caret); }
/* полный текст согласия в форме регистрации — прокручиваемый блок над галочкой; текст можно выделять */
.lk-consent-text { max-height: 192px; overflow-y: auto; padding: 12px 16px; border: 1px solid var(--lk-hair-2); border-radius: 10px;
  background: var(--lk-field); -webkit-user-select: text; user-select: text; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.lk-consent-text h3 { font-size: 13px !important; margin: 10px 0 0 !important; }
.lk-consent-text h3:first-child { margin-top: 0 !important; }
.lk-consent-text p { margin: 6px 0 0 !important; font-size: 13px !important; line-height: 1.55; color: var(--text-2); }
.lk-consent-text a { color: var(--accent-2); }
/* продление: напоминание над подпиской (скоро кончится / истекла / оплата прошла) и тарифы карточками */
.lk .lk-renew { border-color: var(--caret); }
.lk .lk-renew.is-off { border-color: rgba(214,104,104,.75); }
.lk .lk-renew.is-ok { border-color: rgba(127,214,164,.7); }
.lk .lk-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-top: 20px; }
.lk-plan { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 20px 16px 16px;
  text-align: left; cursor: pointer; font: inherit; color: var(--text); border-radius: 14px; border: 1px solid var(--lk-hair-2);
  background: var(--lk-surface); transition: border-color .2s ease, background-color .2s ease, transform 160ms var(--ease-out); }
.lk-devs { margin-top: 20px; }
.lk-devopts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; align-items: stretch; }
.lk-devopt { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-width: 104px; padding: 12px 16px; cursor: pointer; font: inherit;
  color: var(--text); text-align: left; border-radius: 14px; border: 1px solid var(--lk-hair-2); background: var(--lk-surface);
  transition: border-color .2s ease, background-color .2s ease, transform 160ms var(--ease-out); }
.lk-devopt b { font: 500 20px/1.2 var(--mono); }
.lk-devopt small { font-size: 12px; color: var(--text-2); }
.lk-devopt:active { transform: scale(.98); }
.lk-devopt.is-on, .lk-devown.is-on { border-color: var(--caret); background: var(--lk-raised); }
@media (hover: hover) and (pointer: fine) { .lk-devopt:hover { border-color: var(--accent-2); background: var(--lk-raised); } }
.lk-devown { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 14px; border: 1px solid var(--lk-hair-2); background: var(--lk-field); }
.lk-devown input { width: 128px; padding: 8px 12px; font: 500 15px var(--mono); color: var(--text); background: transparent; border: 0; outline: none; -moz-appearance: textfield; }
.lk-devown input::-webkit-outer-spin-button, .lk-devown input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.lk-devnote { margin: 8px 0 0; }
.lk-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.lk-plan:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) { .lk-plan:hover { border-color: var(--accent-2); background: var(--lk-raised); } }
.lk-plan.is-best { border-color: var(--caret); }
.lk-plan-tag { position: absolute; top: -10px; right: 12px; padding: 2px 8px; border-radius: 999px; font: 500 12px/1.4 var(--mono);
  color: var(--space); background: var(--ice); }
.lk-plan-m { font: 600 13px var(--mono); color: var(--muted); }
.lk-plan-p { font: 600 26px/1.15 var(--display); letter-spacing: -.02em; color: var(--text); }
.lk-plan-s { font-size: 13px; color: var(--text-2); }
.lk-plan-d { margin-top: 8px; font: 500 12px var(--mono); color: var(--caret); }
/* всё, на что можно нажать, — курсор-рука: у <button> браузер по умолчанию оставляет стрелку */
.lk button, .lk [data-act], .lk a, .lk-cookie button, .lk-cookie a, .lk-tabs .btn { cursor: pointer; }
.lk button:disabled { cursor: not-allowed; }
/* подсказка «задайте пароль» */
.lk .lk-pass { border-color: var(--line); }
/* оплата (шаг 2): товар и сумма наверху, ниже — платёжки карточками: иконка, название с подписью, переключатель */
.lk-checkout .lk-sum { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 16px; padding-top: 16px;
  border-top: 1px solid var(--lk-hair); }
.lk-sum span { color: var(--muted); font: 500 14px var(--mono); }
.lk-sum b { font: 600 28px/1.1 var(--display); letter-spacing: -.02em; color: var(--text); }
.lk .lk-methods { display: grid; gap: 8px; margin-top: 24px; }
.lk-method { display: flex; align-items: center; gap: 12px; width: 100%; padding: 16px;
  border-radius: 14px; border: 1px solid var(--lk-hair-2); background: var(--lk-surface); color: var(--text); font: 600 15px var(--sans);
  text-align: left; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease; }
.lk-method:active { transform: scale(.99); }
.lk-method-ico { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px;
  border: 1px solid var(--lk-hair); background: var(--lk-field); color: var(--accent-2);
  transition: color .2s ease, border-color .2s ease, background-color .2s ease; }
.lk-method-ico svg { width: 20px; height: 20px; }
.lk-method-txt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.lk-method-txt b { font: 600 15px/1.3 var(--sans); color: var(--text); }
.lk-method-txt small { font: 400 13px/1.35 var(--sans); color: var(--muted); }
.lk-method i { flex: none; margin-left: auto; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--line);
  transition: border-color .2s ease, background .2s ease; }
.lk-method.is-on { border-color: var(--caret); background: var(--lk-raised); }
.lk-method.is-on .lk-method-ico { color: var(--ice); border-color: var(--lk-hair-2); }
.lk-method.is-on i { border-color: var(--caret); background: radial-gradient(circle, var(--caret) 0 42%, transparent 46%); }
@media (hover: hover) and (pointer: fine) { .lk-method:hover { border-color: var(--accent-2); } }
@media (prefers-reduced-motion: reduce) { .lk-method, .lk-method-ico, .lk-method i { transition: none; } .lk-method:active { transform: none; } }
.lk .lk-paynow { flex: 1 1 100%; justify-content: center; padding: 16px 24px; font-size: 15px; }
/* Промокод: поле и кнопка в строку */
.lk-inline { display: flex; gap: 8px; margin-top: 16px; }
.lk-inline input { flex: 1; min-width: 0; text-transform: uppercase; }
.lk-checkout .lk-promo { margin-top: 16px; }
.lk-promo .lk-fl { flex: 1; min-width: 0; }

/* ---------- Вход и регистрация (с 2026-10-21): по центру, без карточки — прямо на звёздном фоне ---------- */
.lk.lk-center .kicker, .lk.lk-center #view { max-width: 460px; margin-left: auto; margin-right: auto; }
/* «// вход» над заголовком «Вход в кабинет» — дубль: прячем с экрана, h1 остаётся для скринридеров */
.lk.lk-center .kicker { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.lk.lk-center .lk-terms { text-align: center; }
.lk-auth { padding: 8px 0 0; }
.lk-auth-title { margin: 0; text-align: center; font: 600 30px/1.2 var(--display); letter-spacing: -.02em; color: var(--text); }
.lk-auth-sub { margin: 8px 0 0; text-align: center; color: var(--text-2); font-size: 15px; }
.lk-auth-tg { margin-top: 28px; }
.lk .btn.lk-tg-btn { width: 100%; padding: 16px 20px; gap: 8px; font-size: 15px; color: var(--text);
  border-color: var(--lk-hair-2); background: var(--lk-raised); }
@media (hover: hover) and (pointer: fine) {
  .lk .btn.lk-tg-btn:hover { border-color: var(--caret); background: var(--lk-raised); }
}
.lk-tg-btn svg { color: var(--accent-2); }
.lk-auth-hint { margin: 8px 0 0; font-size: 13.5px; line-height: 1.55; text-align: center; }
.lk-auth-consent { margin: 8px 0 0; font-size: 12.5px; line-height: 1.5; text-align: center; }
.lk-auth-form .lk-auth-consent { margin-top: -4px; }
.lk-or { display: flex; align-items: center; gap: 16px; margin: 28px 0 20px; color: var(--muted); font: 500 13px var(--mono); }
.lk-or::before, .lk-or::after { content: ''; flex: 1; height: 1px; background: var(--lk-hair-2); }
/* переключатель «вход | регистрация» — капсула с двумя половинами */
.lk-seg { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 12px; border: 1px solid var(--lk-hair-2);
  background: var(--lk-surface); }
.lk-seg-btn { padding: 10px 12px; border: 0; border-radius: 9px; background: transparent; color: var(--muted); cursor: pointer;
  font: 500 14px var(--mono); transition: background-color .2s ease, color .2s ease; }
.lk-seg-btn.is-on { background: var(--lk-raised); color: var(--text); box-shadow: inset 0 0 0 1px var(--lk-hair-2); }
@media (hover: hover) and (pointer: fine) { .lk-seg-btn:not(.is-on):hover { color: var(--text); } }
.lk-seg-btn:focus-visible, .lk-pw-eye:focus-visible, .lk-link-btn:focus-visible { outline: 2px solid var(--caret); outline-offset: 2px; }
.lk-auth-form { gap: 16px; margin-top: 16px; }
/* поле с подписью внутри: подпись уезжает вверх при фокусе или вводе (CSS — работает и при автозаполнении),
   буквы допечатывает floatLabels() в lk.js */
.lk-fl { position: relative; display: block; }
.lk-fl input { width: 100%; box-sizing: border-box; min-height: 56px; padding: 24px 16px 8px; font-size: 15px; background: var(--lk-field); }
.lk-fl-pw input { padding-right: 52px; }
.lk-fl-label { position: absolute; left: 17px; top: 50%; transform: translateY(-50%); pointer-events: none;
  font: 500 15px var(--mono); color: var(--muted); transform-origin: left center;
  transition: transform .25s var(--ease-out), color .2s ease; }
.lk-fl input:focus ~ .lk-fl-label, .lk-fl input:not(:placeholder-shown) ~ .lk-fl-label, .lk-fl input:-webkit-autofill ~ .lk-fl-label {
  transform: translateY(calc(-50% - 12px)) scale(.78); color: var(--accent-2); }
.lk-fl input:focus { border-color: var(--caret); box-shadow: 0 0 0 3px rgba(131,197,212,.14); }
.lk-fl-label .caret { margin-left: 1px; }
.lk-fl:not(.is-focus) .lk-fl-label .caret { visibility: hidden; }
.lk-field-help { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin-top: 8px; min-height: 20px;
  font: 500 12.5px var(--mono); color: var(--muted); }
.lk-field-help .lk-link-btn { margin-left: auto; }
.lk-link-btn { padding: 0; border: 0; background: none; color: var(--accent-2); font: 500 13px var(--mono); cursor: pointer;
  text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(131,197,212,.4); }
@media (hover: hover) and (pointer: fine) { .lk-link-btn:hover { color: var(--text); } }
.lk-pw-eye { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; display: grid; place-items: center;
  border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; }
.lk-pw-eye.is-on, .lk-pw-eye:hover { color: var(--caret); }
.lk-auth-form .lk-submit { justify-self: stretch; width: 100%; padding: 16px 20px; margin-top: 4px; font-size: 15px; }
.lk-submit[aria-busy="true"] { opacity: .7; cursor: progress; }
.lk-auth-note { margin-top: 16px; text-align: center; }
@media (max-width: 640px) { .lk-auth-title { font-size: 24px; } }
@media (prefers-reduced-motion: reduce) { .lk-seg-btn, .lk-fl-label { transition: none; } }

/* ---------- Главный экран кабинета (с 2026-10-21): как вход — по центру, без карточки, на звёздном фоне ---------- */
.lk.lk-dash .kicker, .lk.lk-dash #view { max-width: 620px; margin-left: auto; margin-right: auto; }
/* «// кабинет» над главным экраном не нужен: прячем с экрана, h1 остаётся для скринридеров */
.lk.lk-dash .kicker { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.lk-hero { text-align: center; padding: 8px 0 4px; }
.lk-state { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; font: 500 13px var(--mono);
  color: var(--text-2); border: 1px solid var(--lk-hair-2); background: var(--lk-surface); }
.lk-state i { width: 8px; height: 8px; border-radius: 50%; background: var(--lk-ok); }
.lk-state.is-warn i { background: var(--lk-warn); }
.lk-state.is-off { border-color: rgba(224,122,122,.4); }
.lk-state.is-off i { background: var(--lk-off); }
.lk .lk-big { margin: 16px 0 0; font: 600 44px/1.1 var(--display); letter-spacing: -.02em; text-wrap: balance; color: var(--text); }
.lk .lk-hero-sub { margin: 8px 0 0; color: var(--text-2); font: 500 15px var(--mono); }
/* трафик и устройства — две полупрозрачные плитки */
.lk-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; }
.lk-stat { display: grid; gap: 4px; align-content: start; padding: 16px 20px; border-radius: 14px; border: 1px solid var(--lk-hair-2);
  background: var(--lk-surface); }
.lk-stat-label { font: 500 13px var(--mono); color: var(--muted); }
.lk-stat b { font: 500 22px/1.25 var(--mono); color: var(--text); }
.lk-stat small { font: 500 12.5px var(--mono); color: var(--muted); }
.lk-bar { display: block; height: 4px; margin-top: 8px; border-radius: 99px; background: var(--lk-hair-2); overflow: hidden; }
.lk-bar i { display: block; height: 100%; border-radius: inherit; background: var(--caret); }
.lk-dots { display: flex; gap: 6px; margin-top: 8px; }
.lk-dots i { width: 8px; height: 8px; border-radius: 50%; border: 1px solid var(--lk-hair-2); }
.lk-dots i.is-on { background: var(--caret); border-color: var(--caret); }
/* главное действие и плитки остальных */
.lk .lk-connect { width: 100%; margin-top: 16px; padding: 16px 24px; gap: 8px; font-size: 15px; }
/* все плитки в один ряд; на телефоне — по две, последняя без пары растягивается */
.lk-quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.lk-quick > * { flex: 1 1 0; min-width: 104px; }
.lk-q { display: grid; justify-items: center; align-content: center; gap: 8px; min-height: 88px; padding: 16px 12px; border-radius: 14px;
  border: 1px solid var(--lk-hair-2); background: var(--lk-surface);
  color: var(--text-2); font: 500 13px/1.25 var(--mono); white-space: nowrap; text-align: center; text-decoration: none; cursor: pointer;
  transition: border-color .2s ease, background-color .2s ease, color .2s ease, transform 160ms var(--ease-out); }
.lk a.lk-q { color: var(--text-2); }
.lk-q svg { color: var(--caret); }
@media (hover: hover) and (pointer: fine) { .lk-q:hover, .lk a.lk-q:hover { border-color: var(--lk-hair-2); background: var(--lk-raised); color: var(--text); } }
.lk-q:active { transform: scale(.97); }
.lk-q:focus-visible { outline: 2px solid var(--caret); outline-offset: 2px; }
/* напоминания, промокод и аккаунт на этом экране — легче обычных карточек: без точек и полоски снизу */
.lk-dash .card { padding: 20px 24px; }
.lk-dash .card::before, .lk-dash .card::after { display: none; }
.lk-dash .lk-renew { border-color: var(--caret); }
.lk-dash .lk-renew.is-off { border-color: rgba(214,104,104,.75); }
.lk-dash .lk-renew + .lk-hero { margin-top: 28px; }
.lk-dash .lk-quick + .card { margin-top: 24px; }
.lk-dash .card h3 { font-size: 17px; }
@media (max-width: 640px) {
  .lk .lk-big { font-size: 36px; }
  .lk-stat { padding: 16px; }
  .lk-stat b { font-size: 20px; }
  .lk-quick > * { flex: 1 1 40%; }
}
@media (prefers-reduced-motion: reduce) { .lk-q { transition: none; } .lk-q:active { transform: none; } }
/* промокод в кабинете: только поле с плавающей подписью и кнопка */
.lk-promo-card .lk-promo { margin-top: 0; }
/* Компьютер (с 2026-10-21): весь кабинет — на один экран. Два столбца: срок | трафик и устройства, «подключить» и плитки —
   на всю ширину (плитки ниже: иконка слева), «задайте пароль», промокод и аккаунт — строками. Телефон — как был, столбцом */
@media (min-width: 900px) {
  .lk.lk-dash { padding-top: 28px; padding-bottom: 32px; }
  .lk.lk-dash #view { max-width: 960px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  .lk-dash #view > * { grid-column: 1 / -1; margin-top: 0; }
  .lk-dash #view > .lk-hero { grid-column: 1; align-self: center; text-align: left; padding: 0 0 0 4px; }
  .lk-dash #view > .lk-stats { grid-column: 2; }
  .lk-dash .lk-promo-card { padding: 16px 24px; }
  .lk-dash #view > .lk-account { padding: 12px 24px; }
  .lk-dash .lk-big { margin-top: 12px; }
  .lk-dash .lk-quick { margin-top: -4px; }
  .lk-dash .lk-quick > * { flex: 1 1 auto; }
  .lk-dash .lk-q { display: flex; justify-content: center; align-items: center; gap: 8px; min-height: 56px; padding: 12px 16px; }
  .lk-dash .lk-pass { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 20px; }
  .lk-dash .lk-pass h3, .lk-dash .lk-pass p { grid-column: 1; }
  .lk-dash .lk-pass p { margin-top: 4px; font-size: 14px; }
  .lk-dash .lk-pass .lk-actions { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
}
/* Телефон: чёрная дыра (space.js) — вверху экрана, как на лендинге; содержимое кабинета начинается под ней (там — .hero 29svh) */
@media (max-width: 760px) { .lk.section { padding-top: 24svh; } }
/* Настройки и другие страницы кабинета в новом виде (с 2026-10-21): по центру, заголовок вместо «// раздел»,
   карточки — лёгкие, как на главном экране кабинета */
.lk.lk-page .kicker { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.lk.lk-page #view { max-width: 620px; margin-left: auto; margin-right: auto; }
.lk .lk-page-title { margin-bottom: 24px; }
.lk-page .card { padding: 20px 24px; }
.lk-page .card::before, .lk-page .card::after { display: none; }
.lk-page .card h3 { font-size: 17px; }
.lk-page .card + .card { margin-top: 14px; }
.lk-set-id { margin-top: 10px; }
.lk-row-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.lk-row-card p { margin-top: 4px; }
.lk-row-card .btn { flex: none; }
.lk-page .lk-danger-card { border-color: rgba(214,104,104,.45); }
.lk-page .lk-auth-form { margin-top: 14px; }
/* «назад» на страницах по центру — тоже по центру */
.lk.lk-center .lk-back, .lk.lk-page .lk-back { display: flex; width: fit-content; margin: 24px auto 0; }
/* ожидание подтверждения владельцем подписки */
.lk-claim .lk-steps { text-align: left; margin-top: 16px; }
.lk-claim .lk-submit { width: 100%; margin-top: 16px; padding: 16px 20px; }
@media (max-width: 640px) { .lk-row-card { flex-direction: column; align-items: flex-start; } }
/* Разделы кабинета в новом виде (с 2026-10-26): подпись под заголовком, списки (устройства, оплаты, подписки) — строками
   с иконкой и плашкой статуса, пояснения — отдельной карточкой */
.lk .lk-page-sub { margin: -12px 0 16px; text-align: center; color: var(--muted); font: 500 14px var(--mono); }
.lk .lk-page-sub b { color: var(--text); }
.lk-page .card > .lk-first:first-child { margin-top: 0; }
.lk-page .lk-list { padding: 4px 24px; }
.lk-item { justify-content: flex-start; padding: 12px 0; }
.lk-item-ico { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px;
  border: 1px solid var(--lk-hair); color: var(--accent-2); background: var(--lk-field); }
.lk-item-main { flex: 1; min-width: 0; }
.lk-item-main b { display: block; font-weight: 500; color: var(--text); overflow-wrap: anywhere; }
.lk-item .btn { flex: none; }
.lk-badge { flex: none; padding: 4px 10px; border-radius: 999px; font: 500 12px var(--mono); white-space: nowrap;
  border: 1px solid var(--lk-hair-2); color: var(--muted); }
.lk-badge.is-ok { border-color: rgba(110,200,160,.5); color: #a6e3c6; }
.lk-badge.is-wait { border-color: rgba(230,190,110,.5); color: #f0d49a; }
.lk-page .lk-note p { margin: 0 0 8px; font-size: 15px; color: var(--muted); }
.lk-page .lk-note p b { color: var(--text); }
.lk-page .lk-note .lk-actions { margin-top: 16px; }
@media (max-width: 640px) {
  .lk-page .lk-list { padding: 4px 16px; }
  .lk-item { gap: 8px; }
  .lk-item-ico { width: 36px; height: 36px; border-radius: 10px; }
  .lk-item .btn { padding-left: 12px; padding-right: 12px; }
  .lk-item:has(.lk-badge + .btn) { flex-wrap: wrap; }
  .lk-item:has(.lk-badge + .btn) .lk-item-main { flex-basis: 100%; }
  .lk-item:has(.lk-badge + .btn) .lk-badge { margin-left: auto; }
}
.lk-page #view > p { text-align: center; margin-left: auto; margin-right: auto; }
.lk-page .lk-plans { grid-template-columns: repeat(2, 1fr); }
/* сумма с комиссией кассы у способа оплаты (с 2026-10-26) */
.lk-method-txt small.lk-method-fee { margin-top: 2px; font: 600 12.5px/1.35 var(--mono); color: var(--accent-2); }
/* запасная ссылка подписки под «подключить устройство» (с 2026-10-26): тихая строка, не кнопка */
.lk-backup { display: block; width: 100%; margin: 8px 0 0; padding: 8px 4px; border: 0; background: none; cursor: pointer;
  font: 500 13px var(--mono); color: var(--muted); text-align: center; }
.lk-backup b { color: var(--accent-2); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(159,201,220,.4); }
@media (hover: hover) and (pointer: fine) { .lk-backup:hover b { color: var(--text); } }
.lk-dash .lk-backup { margin-top: -6px; }