/* Кабинет партнёра ЛайфСтатс — слой поверх общей дизайн-системы panel.css.

   Почему отдельный файл. panel.css обслуживает и админку, и кабинет: около
   восьмидесяти классов у них общие (side, nav, main, btn, field, card, chip,
   row, ov, cal). Макет кабинета переопределяет почти каждый каркасный класс,
   и правка «на месте» была бы одновременно правкой админки вслепую. Поэтому
   всё, что нужно кабинету, живёт здесь и пишется с префиксом `.pc` — класс
   стоит на <body> кабинета и больше нигде.

   Специфичность: `.pc .foo` — это (0,2,0) против (0,1,0) у базовых правил
   panel.css, поэтому перебивает без !important. Там, где panel.css сам пишет
   в две ступени (`.side--tabs .nav__item`), счёт равный — и выигрывает этот
   файл, потому что подключён после.

   Значения взяты из прототипа «Кабинет партнёра.dc.html» и его токенов. */

/* ===== Токены, которых нет в panel.css ===== */
:root{
  /* Свечение под главной кнопкой — в макете оно есть у каждой primary. */
  --sh-primary:0 2px 6px rgba(29,91,224,.22),0 8px 20px rgba(29,91,224,.18);
  /* Плавающая панель и тост поднимаются над контентом заметнее карточек. */
  --sh-float:0 8px 24px rgba(0,0,0,.12),0 2px 6px rgba(0,0,0,.06);
}

/* Межстрочный интервал. panel.css задаёт телу 1.55 — это верно для админки с
   её таблицами, но макет кабинета набран обычным (normal, около 1.2), и на
   полутора каждая карточка вырастала на десятки пикселей. Интерлиньяж, где он
   нужен по макету, проставлен точечно у абзацев. */
.pc{line-height:normal}

/* ===== Каркас: десктоп ===== */
/* Сайдбар кабинета светлый и держится тенью, а не рамкой справа. */
/* position не трогаем: базовый .side уже sticky, а на телефоне panel.css
   делает шапку fixed — правило с .pc перебило бы его по специфичности. */
.pc .side{padding:24px 12px 16px;border-right:0;box-shadow:var(--sh-card);z-index:1}
.pc .side__logo{gap:10px;padding:0 12px 28px;margin:0}
.pc .side__mark{width:26px;height:25px}
.pc .side__logo b{font-size:14px;font-weight:600;letter-spacing:-.02em}
.pc .side__logo i{font-size:18px;font-weight:800;letter-spacing:-.045em;margin-top:1px}
/* Логотип кабинета — знак и две строки под ним, поэтому не baseline-строка. */
.pc .side__word{gap:0;line-height:1}

.pc .nav{gap:2px}
.pc .nav__item{height:42px;padding:0 12px;border-radius:12px;gap:12px;
  font-size:14px;font-weight:500;color:var(--ls-ink-1)}
.pc .nav__item:hover{background:var(--ls-bg-soft)}
.pc .nav__item.is-on{background:var(--ls-accent-soft);color:var(--ls-accent);font-weight:600}
.pc .nav__item svg{width:18px;height:18px;opacity:1}

/* Распорка между разделами и подвалом — в макете подвал прижат к низу. */
.pc .side__foot{margin-top:auto;gap:0}
/* Уведомления в сайдбаре — такой же пункт меню, а не иконка. */
.pc .side__bell{display:flex;align-items:center;gap:12px;height:42px;padding:0 12px;
  border:0;border-radius:12px;background:transparent;color:var(--ls-ink-1);
  font-family:inherit;font-size:14px;font-weight:500;text-align:left;cursor:pointer;width:100%}
.pc .side__bell:hover{background:var(--ls-bg-soft)}
.pc .side__bell svg{flex:none}
.pc .side__bell .lbl{display:block}
/* Счётчик непрочитанных — число акцентом справа, без кружка. */
.pc .side__bell-n{margin-left:auto;min-width:0;height:auto;padding:0;border-radius:0;
  background:none;color:var(--ls-accent);font-size:12px;font-weight:600}
/* Обёртка иконки нужна ради точки непрочитанного в углу. */
.pc .bell-ic{position:relative;display:flex;width:18px;height:18px;flex:none}
.pc .bell-dot{position:absolute;top:-2px;right:-2px;width:8px;height:8px;border-radius:var(--r-pill);
  background:var(--ls-accent);border:2px solid var(--ls-surface)}

.pc .side__user{gap:10px;padding:10px 12px;border-radius:14px;border:0;width:100%;
  background:transparent;font-family:inherit;text-align:left;cursor:pointer}
.pc .side__user:hover{background:var(--ls-bg-soft)}
.pc .side__user.is-on{background:var(--ls-accent-soft)}
.pc .ava{width:32px;height:32px;font-size:12px}
.pc .side__handle{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc .side__role{font-size:11px;color:var(--ls-ink-muted)}
.pc .side__exit{height:36px;padding:0 12px;border-radius:12px;background:none;border:0;
  font-family:inherit;font-size:13px;color:var(--ls-err);text-align:left;cursor:pointer;
  display:flex;align-items:center;width:100%}
.pc .side__exit:hover{background:var(--ls-err-bg)}

/* Колонка контента: полоса до 1040 и одинаковый шаг между блоками.
   Колонкой служит сама секция раздела — отдельная обёртка не нужна, а
   атрибут hidden гасит неактивные (см. [hidden] в panel.css). */
.pc .main{padding:28px 32px 80px}
/* Страховка: что бы ни оказалось шире экрана, оно обрезается, а не утаскивает
   страницу вбок. На телефоне .main — сам прокручиваемый блок, и в Safari его
   можно было сдвинуть пальцем. clip, а не hidden: на ПК не превращает .main в
   прокручиваемый блок и не ломает sticky. */
.pc .main{overflow-x:clip}
/* Ширину не ограничиваем: на большом мониторе полоса в 1040px оставляла
   справа пустое поле, а разделу есть чем его занять. */
.pc .main > section[data-page]{display:flex;flex-direction:column;gap:16px}
/* Собственные отступы блоков внутри колонки не нужны — шаг задаёт gap. */
.pc .main > section[data-page] > *{margin-top:0;margin-bottom:0}
.pc .page__title{font-size:26px;font-weight:600;letter-spacing:-.03em;line-height:1.1;margin:0;color:var(--ls-ink-1)}
/* Базовый .card в panel.css делает из карточки контейнер с прокруткой ради
   таблиц админки. В кабинете таблиц нет, а прокрутка резала тёмные карточки
   с абсолютным свечением внутри. Поля по макету — 20px. */
.pc .card{overflow-x:visible;padding:20px}

/* ===== Каркас: телефон ===== */
@media (max-width:860px){
  .pc .side--tabs{position:fixed;top:0;left:0;right:0;width:auto;
    height:52px;padding:0 16px;display:flex;align-items:center;
    justify-content:space-between;gap:8px;background:var(--ls-surface);
    border-bottom:0;border-radius:0 0 20px 20px;box-shadow:var(--sh-nav);z-index:20}
  /* Логотип слева одной строкой: знак, слово, «Partners». */
  .pc .side--tabs .side__logo{display:flex;gap:6px;padding:0;margin:0;height:auto}
  .pc .side--tabs .side__mark{width:20px;height:19px}
  .pc .side--tabs .side__word{flex-direction:row;align-items:baseline;gap:5px}
  .pc .side--tabs .side__logo b{font-size:14px;letter-spacing:-.01em}
  .pc .side--tabs .side__logo i{font-size:15px;letter-spacing:-.04em;margin:0}
  /* Заголовка раздела в мобильной шапке макет не предусматривает. */
  .pc .side--tabs .side__page{display:none}

  .pc .side--tabs .side__foot{margin:0;flex-direction:row;align-items:center;gap:6px;width:auto}
  .pc .side--tabs .side__bell{width:40px;height:40px;padding:0;justify-content:center;
    border-radius:var(--r-pill)}
  .pc .side--tabs .side__bell .lbl{display:none}
  .pc .side--tabs .side__bell-n{display:none}
  .pc .side--tabs .bell-ic{width:20px;height:20px}
  .pc .side--tabs .bell-dot{top:0;right:0}
  /* Аватар ведёт в профиль — «Выйти» в мобильной шапке макет убирает. */
  .pc .side--tabs .side__user{width:auto;padding:0;background:none}
  .pc .side--tabs .side__user .side__word{display:none}
  .pc .side--tabs .side__exit{display:none}

  /* Нижняя панель: подписи 11/500, активность передаётся только цветом. */
  /* 56px — полезная высота самих пунктов. В standalone Web App safe area
     существует реально; если оставить общую высоту 56px, её нижний inset
     вычитается из места для иконок и подписей и ломает ряд меню. */
  .pc .side--tabs .nav{height:calc(56px + env(safe-area-inset-bottom,0px));padding:0;background:var(--ls-surface);
    border-top:1px solid var(--ls-border);align-items:stretch;
    padding-bottom:env(safe-area-inset-bottom,0px)}
  .pc .side--tabs .nav__item{flex:1;flex-direction:column;justify-content:center;gap:3px;
    height:auto;padding:0;border-radius:0;font-size:11px;font-weight:500;
    color:var(--ls-ink-faint);background:none}
  .pc .side--tabs .nav__item.is-on{color:var(--ls-accent);background:none;font-weight:500}
  .pc .side--tabs .nav__item svg{width:22px;height:22px;stroke-width:1.5}
  /* Пятый раздел (профиль) открывается из шапки, в панели ему места нет. */
  .pc .side--tabs .nav__item--hidden{display:none}

  /* panel.css уже физически ограничивает .main измеренными границами шапки и
     нижнего меню. Здесь оставляем только обычный отступ контента: повторное
     добавление высоты обеих панелей создавало большие пустые зоны сверху и
     снизу страницы. */
  .pc .main{padding:16px}
  .pc .main > section[data-page]{max-width:none}
  /* Заголовок раздела на телефоне не показывается — он есть только на десктопе. */
  .pc .page__title{display:none}
}

/* ===== Примитивы ===== */
/* Кнопка по шкале дизайн-системы: xs 40 / sm 44 / md 52 / lg 56. Базовый .btn
   в panel.css — это md, кабинету чаще нужен sm. */
.pc .btn{height:44px;padding:0 18px;font-size:16px;gap:10px;white-space:nowrap;
  font-variant-numeric:tabular-nums}
.pc .btn--xs{height:40px;padding:0 14px;font-size:13px}
.pc .btn--md{height:52px;padding:0 24px}
.pc .btn--lg{height:56px;padding:0 36px;font-size:17px}
.pc .btn--primary{box-shadow:var(--sh-primary)}
.pc .btn--primary[disabled]{box-shadow:none}
/* Белая кнопка на тёмной карточке — главное действие «Запросить выплату». */
.pc .btn--white{background:var(--ls-surface);color:var(--ls-ink-1)}
.pc .btn--white:hover{background:#F2F2F4}
.pc .btn--sec{background:var(--ls-bg-soft);color:var(--ls-ink-1)}
.pc .btn--sec:hover{background:#E5E5E8}
.pc .btn[disabled]{opacity:1;background:var(--ls-bg-soft);color:var(--ls-ink-faint);
  box-shadow:none;cursor:not-allowed}
.pc .btn--white[disabled]{background:rgba(255,255,255,.35);color:rgba(255,255,255,.55)}

/* Кнопка-ссылка: акцентный текст без подложки. */
.pc .linkish{border:0;background:none;padding:0;font-family:inherit;font-size:13px;
  font-weight:600;color:var(--ls-accent);cursor:pointer}
.pc .linkish:hover{color:var(--ls-accent-hover)}
.pc .linkish--danger{color:var(--ls-err)}

.pc .field{margin:0}
.pc .field__label{font-size:13px;color:var(--ls-ink-muted);margin-bottom:6px}
.pc .field__input{height:48px;padding:0 14px;border:1px solid var(--ls-border-strong);
  border-radius:var(--r-field);font-size:16px;background:var(--ls-surface)}
/* Поле суммы — крупнее и с моно-цифрами: в него смотрят, когда считают деньги. */
.pc .field__input--amount{height:52px;font-size:22px;font-weight:600;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* Чип-фильтр. */
.pc .chip{height:36px;padding:0 14px;border-radius:var(--r-pill);font-size:13px;font-weight:600}

/* Тумблер профиля. */
.pc .sw{position:relative;width:44px;height:26px;flex:none;border:0;padding:0;cursor:pointer;
  border-radius:var(--r-pill);background:var(--ls-border-strong);transition:background .18s var(--ease-out)}
.pc .sw::after{content:'';position:absolute;left:3px;top:3px;width:20px;height:20px;
  border-radius:var(--r-pill);background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);
  transition:left .18s var(--ease-out)}
.pc .sw.is-on{background:var(--ls-accent)}
/* Одинаковые 3px до края трека в обоих положениях. */
.pc .sw.is-on::after{left:calc(100% - 23px)}
.pc .prow[role="switch"]:focus-visible{outline:2px solid var(--ls-accent);outline-offset:-2px;border-radius:8px}
.pc #password-form .field{margin-top:12px}
.pc #password-form .ov__p{margin-bottom:16px}
.pc .device-push{padding:20px 0;border-bottom:1px solid var(--ls-border);min-width:0}
.pc .device-push h2{font-size:16px;font-weight:600;margin:0 0 8px}
.pc .device-push p{font-size:13px;line-height:1.5;color:var(--ls-ink-3);margin:0;overflow-wrap:anywhere}
.pc .device-push .device-push__status{margin:12px 0;padding:12px;border-radius:12px;background:var(--ls-bg);color:var(--ls-ink-1)}
.pc .device-push__actions{display:flex;flex-wrap:wrap;gap:8px}
.pc .device-push__actions .btn{min-height:44px;height:auto;white-space:normal;padding:11px 16px;max-width:100%}
.pc .device-push__refresh{color:var(--ls-accent);font:inherit;font-size:13px;min-height:44px;margin-top:4px;border:0;background:transparent;padding:0;cursor:pointer;text-align:left}
@media(max-width:600px){.pc .device-push__actions .btn{width:100%}}

/* Скелетон загрузки. */
@keyframes pc-sk{0%{opacity:1}50%{opacity:.45}100%{opacity:1}}
.pc .sk{background:var(--ls-bg-soft);border-radius:8px;animation:pc-sk 1.5s infinite}
.pc .sk--dark{background:rgba(255,255,255,.12)}
@media (prefers-reduced-motion:reduce){.pc .sk{animation:none}}

/* ===== Экран «Профиль» ===== */
.pc .prof-head{display:flex;align-items:center;gap:12px}
.pc .prof-ava{width:52px;height:52px;flex:none;border-radius:var(--r-pill);
  background:var(--ls-accent-soft);color:var(--ls-accent);
  display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:600}
.pc .prof-id{display:flex;flex-direction:column;gap:3px;min-width:0}
.pc .prof-id b{font-size:22px;font-weight:600;letter-spacing:-.025em;line-height:1.2}
.pc .prof-id .sub{font-size:13px;color:var(--ls-ink-muted);margin:0}
/* Карточка не тянется на всю колонку: в макете она 640 и на десктопе. */
.pc .prof-card{max-width:640px;padding:0 20px}
.pc .prow{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
  min-height:56px;padding:0;border:0;border-top:1px solid var(--ls-hairline);background:none;
  font-family:inherit;font-size:15px;text-align:left;color:var(--ls-ink-1);cursor:pointer}
.pc .prow:first-child{border-top:0}
.pc .prow--exit{color:var(--ls-err)}
.pc .prow__l{display:flex;flex-direction:column;gap:2px;min-width:0}
.pc .prow__s{font-size:12px;color:var(--ls-ink-faint)}
.pc .prow__r{display:flex;align-items:center;gap:8px;flex:none;font-size:13px;color:var(--ls-ink-muted)}
.pc .prow__arr{color:var(--ls-ink-faint)}

/* ===== Тост ===== */
/* Держится у нижнего края на телефоне и у правого верхнего на десктопе —
   там, где он не перекрывает то, о чём сообщает. */
.pc .toast{position:fixed;z-index:60;left:16px;right:16px;bottom:calc(72px + env(safe-area-inset-bottom,0px));
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:var(--ls-dark);color:#fff;border-radius:var(--r-pill);
  padding:12px 8px 12px 18px;font-size:14px;box-shadow:var(--sh-float);
  animation:pc-fade .18s var(--ease-out)}
.pc .toast__x{flex:none;height:28px;padding:0 12px;border:0;border-radius:var(--r-pill);
  background:rgba(255,255,255,.1);color:var(--ls-accent-on-dark);
  font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}
@keyframes pc-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.pc .toast{animation:none}}
@media (min-width:861px){
  .pc .toast{left:auto;right:28px;top:24px;bottom:auto;max-width:420px}
}

/* ===== Плашки состояния аккаунта ===== */
/* Пауза: тёплый бежевый, бейдж и одна фраза. Радиус 16, а не 20, — плашка
   не карточка, а условие над карточками. */
.pc .pause{display:flex;gap:10px;align-items:flex-start;padding:12px 16px;
  background:var(--ls-wait-bg);border-radius:var(--r-md);
  font-size:14px;line-height:1.45;color:var(--ls-wait)}
.pc .pause__b{flex:none;height:20px;padding:0 8px;border-radius:var(--r-pill);
  background:var(--ls-wait);color:#fff;font-size:11px;font-weight:600;
  display:inline-flex;align-items:center;margin-top:1px}
/* Блокировка: серая, без цветовой тревоги — доступ к деньгам сохранён. */
.pc .locked{display:flex;gap:10px;align-items:center;padding:12px 16px;
  background:var(--ls-bg-soft);border-radius:var(--r-md);
  font-size:14px;color:var(--ls-ink-muted)}
.pc .locked svg{flex:none;color:var(--ls-ink-muted)}
.pc .locked b{color:var(--ls-ink-1);font-weight:700}

/* ===== Обзор: плашка периодов ===== */
/* Сегменты и календарь — два отдельных элемента: кнопка календаря после
   выбора диапазона подписывается датами и растёт, сегменты при этом не едут. */
.pc .pbar{display:flex;gap:8px;max-width:520px}
.pc .pseg{flex:1;min-width:0;display:flex;gap:2px;background:var(--ls-surface);
  border-radius:var(--r-pill);padding:3px;box-shadow:var(--sh-card)}
.pc .pseg button{flex:1;height:32px;padding:0 8px;border:0;border-radius:var(--r-pill);
  background:transparent;color:var(--ls-ink-muted);font-family:inherit;
  font-size:12px;font-weight:600;white-space:nowrap;cursor:pointer}
.pc .pseg button.is-on{background:var(--ls-dark);color:#fff}
.pc .pcal{flex:none;height:38px;min-width:38px;padding:0 11px;display:inline-flex;
  align-items:center;justify-content:center;gap:0;border:0;border-radius:var(--r-pill);
  background:var(--ls-surface);color:var(--ls-ink-muted);box-shadow:var(--sh-card);
  font-family:inherit;font-size:12px;font-weight:600;line-height:1;cursor:pointer}
.pc .pcal.is-on{padding:0 12px;gap:6px;background:var(--ls-dark);color:#fff}

/* ===== Обзор: сетка экрана =====
   Слева баланс и статистика, справа два показателя и последние продажи.
   Области названы явно: так правая колонка тянется до низа графика, а на
   телефоне тот же порядок раскладывается в один столбец. */
/* Верхний ряд — три блока: баланс и два показателя. Минимумы заданы явно:
   сумма в тёмной карточке набрана 44-м кеглем, и ниже 240px она не влезает. */
.pc .ov-top{display:grid;gap:16px;
  grid-template-columns:minmax(240px,1.3fr) minmax(140px,1fr) minmax(140px,1fr)}
.pc .ov-top > *{min-width:0}

/* Экран целиком: слева ряд блоков и «Статистика» под ним той же ширины,
   справа «Последние продажи» во всю высоту. */
.pc .ov-data{display:grid;gap:16px;grid-template-columns:1fr;
  grid-template-areas:'top' 'chart' 'last'}
.pc .ov-data > *{min-width:0}
.pc .ov-data > .ov-top{grid-area:top}
.pc .ov-data > .chart{grid-area:chart}
.pc .ov-data > .last{grid-area:last;align-self:stretch}
@media (min-width:1151px){
  /* Второй столбец появляется, только когда обеим колонкам хватает места:
     ряду блоков нужно 548px, списку продаж — 320. */
  .pc .ov-data{grid-template-columns:minmax(548px,1fr) minmax(320px,.62fr);
    grid-template-areas:'top last' 'chart last'}
}
.pc .otop{display:grid;grid-template-columns:1.15fr 1fr;gap:16px;align-items:stretch}
.pc .otop > *{min-width:0}
/* Значок «?» сидит в углу карточки «На проверке» и объясняет холд. */
.pc .mini__head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.pc .mini__head .qbtn--round{margin:-6px -6px 0 0}

/* Тёмная карточка баланса. */
.pc .bal{position:relative;overflow:hidden;background:var(--ls-dark);
  border-radius:var(--r-card);padding:20px 22px;box-shadow:var(--sh-card)}
.pc .bal__glow{position:absolute;right:-60px;top:-70px;width:220px;height:220px;
  border-radius:var(--r-pill);pointer-events:none;
  background:radial-gradient(closest-side,rgba(29,91,224,.35),transparent)}
.pc .bal__in{position:relative}
.pc .bal__eyebrow{margin:0;font-size:11px;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--on-dark-50)}
.pc .bal__sum{margin:8px 0 18px;font-size:44px;font-weight:600;line-height:1.05;
  letter-spacing:-.035em;color:#fff;font-variant-numeric:tabular-nums}
.pc .bal__note{margin:10px 0 0;font-size:12px;color:var(--on-dark-50);text-align:center}

/* Два показателя справа. */
/* Карточка тянется по высоте тёмной, поэтому число прижимаем к низу —
   иначе сверху надпись, а под ней полкарточки пустоты. */
.pc .mini{background:var(--ls-surface);border-radius:var(--r-card);padding:16px;
  box-shadow:var(--sh-card);display:flex;flex-direction:column}
.pc .mini__eyebrow{margin:0;font-size:11px;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ls-ink-faint)}
/* margin-top:auto прижимает число к низу высокой карточки, padding держит
   минимальный зазор от надписи, когда места нет (телефон). */
.pc .mini__val{margin:auto 0 0;padding-top:8px;font-size:24px;font-weight:600;
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.pc .mini__sub{margin:4px 0 0;font-size:12px;color:var(--ls-ink-muted)}
.pc .mini__sub--ok{color:var(--ls-ok)}

/* Кнопка-пояснение лежит на фоне страницы, не внутри карточки. */
.pc .qbtn{display:flex;align-items:center;gap:6px;height:36px;padding:0 4px;border:0;
  background:none;font-family:inherit;font-size:13px;color:var(--ls-ink-faint);cursor:pointer}
.pc .qbtn--round{width:32px;height:32px;margin:-6px;padding:0;justify-content:center;
  border-radius:var(--r-pill)}

/* ===== Обзор: карточка процента ===== */
.pc .pct{padding:20px}
.pc .pct__head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.pc .pct__l{display:flex;align-items:center;gap:8px}
.pc .pct__chip{height:20px;padding:0 8px;border-radius:var(--r-pill);
  background:var(--ls-accent-soft);color:var(--ls-accent);font-size:11px;font-weight:600;
  display:inline-flex;align-items:center}
/* Строка не переносится целиком — переносится содержимое каждой половины,
   иначе «22 из 30 продаж» уезжает под процент и теряет правый край. */
.pc .pct__row{display:flex;align-items:baseline;justify-content:space-between;
  gap:8px;margin-top:6px;flex-wrap:nowrap}
.pc .pct__lead{display:flex;align-items:baseline;gap:8px;flex-wrap:nowrap;min-width:0;flex:1 1 auto}
/* Подпись переносится внутри себя, а не уезжает под процент целой строкой. */
.pc .pct__of{min-width:0}
.pc .pct__val{flex:none}
/* Правая подпись уступает место левой: на 360px «с оплаченной суммы» иначе
   не помещается даже в две строки и обрезается. */
.pc .pct__count{text-align:right;min-width:0;flex:0 1 auto;max-width:46%}
.pc .pct__val{font-size:30px;font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.pc .pct__val--sm{font-size:26px;letter-spacing:-.025em}
.pc .pct__of{font-size:13px;color:var(--ls-ink-muted)}
.pc .pct__count{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
.pc .pct__bar{height:8px;border-radius:var(--r-pill);background:var(--ls-bg-soft);
  margin-top:12px;overflow:hidden}
.pc .pct__fill{display:block;height:100%;border-radius:var(--r-pill);background:var(--ls-accent);
  transition:width .4s var(--ease-out)}
.pc .pct__scale{display:flex;justify-content:space-between;margin-top:8px;font-size:12px;
  color:var(--ls-ink-faint);font-variant-numeric:tabular-nums}
.pc .pct__scale--manual{justify-content:flex-end}
.pc .pct__scale .is-on{color:var(--ls-accent);font-weight:600}
.pc .pct__next{margin:10px 0 0;font-size:13px;color:var(--ls-ink-muted)}

/* ===== Обзор: график столбцами ===== */
/* Столбцы рисуются DOM-ом, а не Chart.js: рядов всего два, зато график
   перестал зависеть от внешнего CDN и от загрузки библиотеки. */
/* Заголовок не переносим: он короткий, а место уступает легенда. */
.pc .chart__head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:16px;
  flex-wrap:wrap}
.pc .chart__tools{display:flex;align-items:center;gap:12px;min-width:0}
/* Канал — фильтр той же статистики, без дополнительной карточки под графиком. */
.pc #chart-stats .chart__head{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:12px 20px}
.pc #chart-stats .chart__tools{justify-content:flex-end;flex-wrap:wrap}
.pc .chart__channels{display:flex;align-items:center;padding:3px;gap:2px;border-radius:999px;
  background:var(--ls-bg-soft);width:max-content}
.pc .chart__channels button{border:0;border-radius:999px;padding:6px 12px;min-height:28px;
  background:transparent;color:var(--ls-ink-muted);font-size:12px;line-height:16px;font-weight:500;font-family:inherit;cursor:pointer;
  transition:background .15s,color .15s,box-shadow .15s}
.pc .chart__channels button[aria-pressed="true"]{background:var(--ls-surface);color:var(--ls-accent);
  box-shadow:0 1px 4px #142c5314;font-weight:600}
.pc .chart__channels button:hover{color:var(--ls-accent)}
.pc .chart__channels button:focus-visible{outline:2px solid var(--ls-accent);outline-offset:2px}
.pc #chart-stats[aria-busy="true"] .bars,.pc #chart-stats[aria-busy="true"] .bars__ax,
.pc #chart-stats[aria-busy="true"] .metrics{opacity:.4;pointer-events:none}
@media(max-width:1100px){
  .pc #chart-stats .chart__head{grid-template-columns:1fr auto;gap:12px}
  .pc #chart-stats .chart__tools{grid-column:1/-1;justify-content:space-between}
}
@media(max-width:600px){
  .pc .chart__channels button{padding:6px 10px}
  .pc #chart-stats .chart__tools{gap:8px}
  .pc #chart-stats .lsel__btn{max-width:145px}
}
@media(max-width:380px){
  .pc #chart-stats .chart__head{column-gap:8px}
  .pc #chart-stats .chart__title{font-size:14px}
  .pc #chart-stats .chart__channels button{padding:6px 8px;font-size:11px}
  .pc #chart-stats .legend{font-size:10px;gap:6px}
  .pc #chart-stats .lsel__btn{font-size:11px;padding:0 8px;max-width:116px}
  .pc #chart-stats .bars__ax span{font-size:10px}
  .pc #chart-stats .bars__ax span:nth-child(even){visibility:hidden}
}
/* Выбор ссылки — своё меню: системный список <select> выпадает
   нестилизованным и рядом с чипами выглядит чужеродно. */
.pc .lsel{position:relative;flex:none}
.pc .lsel__btn{display:flex;align-items:center;gap:6px;height:32px;padding:0 10px 0 12px;
  border:1px solid var(--ls-border-strong);border-radius:var(--r-pill);background:var(--ls-surface);
  color:var(--ls-ink-1);font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;
  max-width:180px}
.pc .lsel__btn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc .lsel__btn svg{flex:none;color:var(--ls-ink-muted);transition:transform .15s var(--ease-out)}
.pc .lsel.is-open .lsel__btn{border-color:var(--ls-accent);color:var(--ls-accent)}
.pc .lsel.is-open .lsel__btn svg{transform:rotate(180deg);color:var(--ls-accent)}
.pc .lsel__menu{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:190px;max-width:260px;
  padding:6px;background:var(--ls-surface);border-radius:var(--r-md);box-shadow:var(--sh-float)}
.pc .lsel__i{display:flex;align-items:center;gap:8px;width:100%;min-height:36px;padding:0 10px;
  border:0;border-radius:10px;background:none;font-family:inherit;font-size:13px;
  text-align:left;color:var(--ls-ink-1);cursor:pointer}
.pc .lsel__i:hover{background:var(--ls-bg-soft)}
.pc .lsel__i.is-on{color:var(--ls-accent);font-weight:600}
.pc .lsel__i svg{margin-left:auto;flex:none}
.pc .chart__title{white-space:nowrap;flex:none}
.pc .legend{min-width:0;flex-wrap:nowrap}
.pc .chart__title{margin:0;font-size:16px;font-weight:600;letter-spacing:-.01em}
.pc .chart__sub{margin:2px 0 0;font-size:13px;color:var(--ls-ink-muted)}
.pc .legend{display:flex;gap:10px;font-size:11px;color:var(--ls-ink-muted)}
.pc .legend span{display:flex;align-items:center;gap:4px}
.pc .legend i{width:12px;height:3px;border-radius:2px}
/* Поля под подписи осей: слева переходы, справа продажи. */
.pc .bars{margin-top:0;position:relative;padding:0 44px 0 48px}
.pc .bars__grid{position:absolute;left:48px;right:44px;top:0;bottom:0;display:flex;
  flex-direction:column;justify-content:space-between;pointer-events:none}
.pc .bars__grid i{display:block;height:1px;background:var(--ls-hairline)}
.pc .bars__grid i.bars__grid--base{background:var(--ls-border)}
/* Подписи стоят ровно на линиях: первая прижата верхом, последняя низом. */
.pc .bars__ay{position:absolute;left:0;top:0;bottom:0;width:44px;display:flex;
  flex-direction:column;justify-content:space-between;align-items:flex-end;
  font-size:11px;color:var(--ls-data-3);font-variant-numeric:tabular-nums;pointer-events:none}
.pc .bars__ay--r{left:auto;right:0;width:40px;align-items:flex-start;color:var(--ls-accent)}
.pc .bars__ay span{display:block;line-height:1;transform:translateY(-50%)}
.pc .bars__ay span:first-child{transform:none}
.pc .bars__ay span:last-child{transform:translateY(-100%)}
.pc .bars__row{position:relative;display:flex;align-items:flex-end;height:104px}
.pc .bgroup{flex:1;min-width:0;height:100%;position:relative;border:0;padding:0;background:none;
  cursor:pointer;border-radius:8px;transition:background .15s var(--ease-out)}
.pc .bgroup:hover,.pc .bgroup:focus-visible{background:rgba(29,91,224,.05)}

/* Подсказка по колонке. */
.pc .btip{position:absolute;z-index:5;transform:translate(-50%,-100%);
  background:var(--ls-dark);color:#fff;border-radius:10px;padding:7px 10px;
  font-size:12px;white-space:nowrap;pointer-events:none;box-shadow:var(--sh-float)}
.pc .btip--down{transform:translate(-50%,0)}
/* Линия вместо столбиков: у периода появляется форма, а не набор отдельных
   колонок, которые приходилось сравнивать глазами по одной. Картинка
   открывается слева направо — и заливка, и обе линии разом. */
.pc .bars__plot{position:absolute;inset:0;width:100%;height:100%;overflow:visible;
  pointer-events:none;animation:bpl-reveal .65s var(--ease-out)}
.pc .bpl__line{fill:none;stroke:var(--ls-data-1);stroke-width:2;stroke-linecap:round;
  stroke-linejoin:round;vector-effect:non-scaling-stroke}
.pc .bpl__line--v{stroke:var(--ls-data-2);stroke-width:1.5}
.pc .bpl__area{fill:url(#bars-grad)}
.pc .bpl__g0{stop-color:var(--ls-data-1);stop-opacity:.24}
.pc .bpl__g1{stop-color:var(--ls-data-1);stop-opacity:0}
/* Точка последнего дня — обычным элементом: растянутый svg сделал бы из круга овал. */
.pc .bars__dot{position:absolute;width:9px;height:9px;border-radius:50%;background:var(--ls-data-1);
  box-shadow:0 0 0 2px #fff,0 2px 8px rgba(29,91,224,.35);transform:translate(-50%,-50%);
  pointer-events:none;animation:bpl-in .3s var(--ease-out) .45s backwards}
@keyframes bpl-reveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes bpl-in{from{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .pc .bars__plot,.pc .bars__dot,.pc .bgroup{animation:none;transition:none}
}
.pc .bars__ax{display:flex;margin-top:8px;padding:0 44px 0 48px}
.pc .bars__ax span{flex:1;text-align:center;font-size:11px;color:var(--ls-ink-faint)}
/* Восемь метрик: воронка сверху, деньги снизу; на телефоне — пары. */
.pc .metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px 12px;margin-top:20px;padding-top:16px;border-top:1px solid var(--ls-hairline)}
.pc .chart .metrics{grid-template-areas:"clicks payment" "sales conv" "revenue share" "average per100"}
@media (min-width:1151px){
  .pc .chart .metrics{grid-template-columns:repeat(4,minmax(0,1fr));
    grid-template-areas:"clicks payment sales conv" "revenue share average per100"}
}
.pc .metric{display:flex;flex-direction:column;min-width:0}
.pc .metric b{font-size:22px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pc .metric span{font-size:13px;color:var(--ls-ink-muted);margin-top:2px}
.pc .metric>span{margin-top:auto;padding-top:2px}
.pc .metric .d{font-size:12px;font-weight:500;margin-left:8px}
.pc .metric .d--up{color:var(--ls-ok)}
.pc .metric .d--down{color:var(--ls-err)}
.pc .metric--clicks{grid-area:clicks}
.pc .metric--payment{grid-area:payment}
.pc .metric--average{grid-area:average}
.pc .metric--sales{grid-area:sales}
.pc .metric--conv{grid-area:conv}
.pc .metric--revenue{grid-area:revenue}
.pc .metric--share{grid-area:share}
.pc .metric--per100{grid-area:per100}
/* Не влезла дельта рядом с числом — уходит под него целиком, а не рвётся
   посередине: у сумм в рублях она длинная. */
.pc .metric b{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px}
.pc .metric .d{margin-left:0;white-space:nowrap}

/* ===== Обзор: последние продажи ===== */
.pc .last{padding:20px 20px 4px}
.pc .last__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:4px}
.pc .last__head .chart__title{flex:none}
.pc .last__head .wmeth__sub{text-align:right;min-width:0}
.pc .srow{display:flex;align-items:center;gap:12px;width:100%;min-height:60px;padding:10px 0;
  border:0;border-top:1px solid var(--ls-hairline);background:none;font-family:inherit;
  text-align:left;color:inherit;cursor:pointer}
.pc .srow__ico{flex:none;width:36px;height:36px;border-radius:10px;background:var(--ls-bg-soft);
  background-image:repeating-linear-gradient(135deg,rgba(0,0,0,.04) 0 4px,transparent 4px 8px)}
.pc .srow__m{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.pc .srow__t{font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .srow__s{font-size:13px;color:var(--ls-ink-muted)}
.pc .srow__r{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:none}
.pc .srow__parts{max-width:140px;white-space:normal;overflow-wrap:anywhere;text-align:right;line-height:1.4}
.pc .srow__a{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
/* Чип статуса фиксированной ширины: иначе колонка справа пляшет от длины слова. */
.pc .st{display:inline-flex;align-items:center;justify-content:center;gap:5px;
  width:104px;height:22px;border-radius:var(--r-pill);font-size:12px;font-weight:600}
.pc .st i{width:6px;height:6px;border-radius:var(--r-pill);background:currentColor}
.pc .st--wait{background:var(--ls-wait-bg);color:var(--ls-wait)}
.pc .st--ok{background:var(--ls-ok-bg);color:var(--ls-ok)}
.pc .st--paid{background:var(--ls-neutral-bg);color:var(--ls-neutral)}
.pc .st--err{background:var(--ls-err-bg);color:var(--ls-err)}

/* ===== Обзор: пусто ===== */
.pc .start{background:var(--ls-accent-soft);border:1px solid rgba(29,91,224,.2);
  border-radius:var(--r-card);padding:20px}
.pc .start__t{display:block;font-size:18px;font-weight:600;letter-spacing:-.02em}
.pc .start__s{margin:6px 0 0;font-size:15px;line-height:1.5;color:var(--ls-ink-muted)}
.pc .start__code{display:flex;align-items:center;gap:10px;background:var(--ls-surface);
  border-radius:var(--r-md);padding:12px 14px;margin-top:14px}
.pc .start__code .mono{flex:1;font-family:var(--font-mono);font-size:22px;font-weight:600;
  letter-spacing:.02em;min-width:0;overflow:hidden;text-overflow:ellipsis}
.pc .ccopy{flex:none;height:32px;padding:0 12px;border:0;border-radius:var(--r-pill);
  background:var(--ls-accent-soft);color:var(--ls-accent);font-family:inherit;
  font-size:13px;font-weight:600;cursor:pointer}
.pc .ghost{display:flex;align-items:flex-end;gap:8px;height:96px;animation:pc-sk 1.5s infinite}
.pc .ghost i{flex:1;border-radius:4px 4px 0 0;background:var(--ls-bg-soft)}
.pc .ghost__t{margin:12px 0 0;font-size:13px;color:var(--ls-ink-muted)}
@media (prefers-reduced-motion:reduce){.pc .ghost{animation:none}}

/* Состояния обзора — каждое своя колонка с тем же шагом, что у страницы. */
.pc .ov-empty,.pc .ov-load{display:flex;flex-direction:column;gap:16px}
.pc .ov-data[hidden],.pc .ov-empty[hidden],.pc .ov-load[hidden]{display:none}

@media (max-width:860px){
  .pc .otop{grid-template-columns:1fr}
  /* На телефоне тёмная карточка во всю ширину, показатели парой под ней. */
  .pc .ov-top{grid-template-columns:1fr 1fr;gap:12px}
  .pc .ov-top > .bal{grid-column:1 / -1;margin-bottom:4px}
  .pc .bars__row{height:104px}
  .pc .pbar{max-width:none}
  /* Пять периодов и календарь на 390 — кнопкам нужен весь ряд. */
  .pc .pseg button{padding:0 4px;font-size:11px}
}
@media (min-width:861px){
  .pc .bars__row{height:180px}
}

/* ===== Окна кабинета ===== */
/* Подложка без размытия — в макете она просто затемняет. */
.pc .ov{background:rgba(0,0,0,.4);backdrop-filter:none}
.pc .ov__p{margin:0;font-size:15px;line-height:1.5;color:var(--ls-ink-muted)}
.pc .ov__p--s{margin-top:12px;font-size:13px;color:var(--ls-ink-faint)}
.pc .ov__foot .btn{flex:1}
/* Ступени процента: строка «сколько продаж → какой процент». */
.pc .tiers{display:flex;flex-direction:column;gap:6px;margin-top:16px}
.pc .tier{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--r-md);
  background:var(--ls-bg-soft);font-size:14px}
.pc .tier.is-on{background:var(--ls-accent-soft);color:var(--ls-accent);font-weight:600}
.pc .tier__n{flex:1;min-width:0}
.pc .tier__p{font-variant-numeric:tabular-nums;font-weight:600}
/* «Ты здесь» — подпись, а не наклейка поверх процента: в макете она
   перекрывала само число, и текущую ступень было не прочитать. */
.pc .tier__you{flex:none;height:20px;padding:0 8px;border-radius:var(--r-pill);
  background:var(--ls-accent);color:#fff;font-size:11px;font-weight:600;
  display:inline-flex;align-items:center}

/* ===== Продажи ===== */
/* Три итога держатся в ряд и на 390: они короткие, а в столбик занимали бы
   пол-экрана до самого списка. */
.pc .stat3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pc .s3{background:var(--ls-surface);border-radius:var(--r-md);padding:14px 16px;box-shadow:var(--sh-card)}
.pc .s3__k{margin:0;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ls-ink-faint);white-space:nowrap}
.pc .s3__v{display:block;margin-top:4px;font-size:22px;font-weight:600;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums}
/* Чипы листаются вбок и доезжают до края экрана — поэтому отрицательные поля. */
.pc .chips{display:flex;gap:6px;overflow-x:auto;margin:0 -16px;padding:2px 16px;
  flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.pc .chips::-webkit-scrollbar{display:none}
.pc .chip{flex:none;height:36px;padding:0 14px;border:1px solid var(--ls-border-strong);
  border-radius:var(--r-pill);background:var(--ls-surface);color:var(--ls-ink-1);
  font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;box-shadow:none}
.pc .chip.is-on{background:var(--ls-dark);color:#fff;border-color:var(--ls-dark)}
/* Карточка-список: высоту держат строки, поэтому вертикальных полей почти нет. */
.pc .list{padding:4px 20px}
.pc .list__none{margin:0;padding:24px 0;text-align:center;font-size:13px;color:var(--ls-ink-muted)}
.pc .list .srow:first-child{border-top:0}

/* Пустой экран раздела. */
.pc .blank{display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:80px 24px 0;max-width:420px;margin:0 auto;color:var(--ls-ink-faint)}
.pc .blank__t{margin-top:16px;font-size:16px;font-weight:600;color:var(--ls-ink-1)}
.pc .blank__s{margin:6px 0 0;font-size:13px;line-height:1.4;color:var(--ls-ink-muted)}

/* ===== Карточка одной продажи ===== */
.pc .ov__card--sale{max-width:520px}
.pc .sale__top{position:relative;overflow:hidden;background:var(--ls-dark);border-radius:var(--r-md);
  padding:16px;display:flex;gap:14px;align-items:center}
.pc .sale__cover{flex:none;width:72px;height:54px;border-radius:10px;background:var(--ls-dark-soft);
  background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 8px,transparent 8px 16px)}
/* Значок продажи — фирменная звезда: чем дороже заказ, тем мощнее. Одна система для
   строк продаж и карточки продажи, ступени задаёт saleTier в кабинете. Правила идут
   после заглушек .srow__ico и .sale__cover, чтобы их перекрыть. */
.pc .sprite{position:absolute;width:0;height:0;overflow:hidden}
.pc .sico{display:block;overflow:hidden;background:var(--ls-accent-soft);color:var(--ls-accent)}
.pc .sico svg{display:block;width:100%;height:100%;transition:transform .25s var(--ease-out)}
.pc .sico .tw{color:var(--ls-accent)}
.pc .sico .tw--dim{opacity:.7}
.pc .sico .orb{fill:none;stroke:var(--ls-accent-on-dark);stroke-width:1.3;stroke-linecap:round;opacity:.6}
.pc .sico--3{background:radial-gradient(circle at 28% 18%,rgba(255,255,255,.32),transparent 58%),var(--ls-accent);color:#fff}
.pc .sico--3 .tw{color:#fff}
.pc .sico--4{background:radial-gradient(circle at 74% 20%,rgba(29,91,224,.8),transparent 64%),var(--ls-dark);color:#fff}
.pc .sico--4 .tw{color:var(--ls-accent-on-dark)}
.pc .sico--back{background:var(--ls-neutral-bg);color:var(--ls-ink-faint)}
.pc .sale__cover.sico{width:56px;height:56px;border-radius:14px}
/* Аккаунт владельца проекта: доли и выплат у него нет — прячем баланс, фильтры по
   выплатам и в карточке продажи всё про долю и холд. Суммы продаж — целиком. */
.pc.pc--owner .ov-top,.pc.pc--owner #s-filters,.pc.pc--owner .sale__of,.pc.pc--owner .sale__split,
.pc.pc--owner .sale__legend,.pc.pc--owner .sale__tl,.pc.pc--owner .sale__grid,
.pc.pc--owner .prow[data-pref="payout"],.pc.pc--owner .prow[data-pref="rate"]{display:none}
/* Без ряда баланса «Статистика» поднимается на его место: пустая область сетки
   оставила бы над ней лишний отступ. */
.pc.pc--owner .ov-data{grid-template-areas:'chart' 'last'}
@media (min-width:1151px){ .pc.pc--owner .ov-data{grid-template-areas:'chart last'} }
/* Строка кликается: при наведении звезда чуть поворачивается. */
.pc .srow:hover .sico svg,.pc .srow:focus-visible .sico svg{transform:rotate(-12deg) scale(1.06)}
@media (prefers-reduced-motion:reduce){
  .pc .sico svg{transition:none}
  .pc .srow:hover .sico svg,.pc .srow:focus-visible .sico svg{transform:none}
}
.pc .sale__sum{display:flex;flex-direction:column;min-width:0}
.pc .sale__k{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--on-dark-50)}
.pc .sale__sum b{font-size:28px;font-weight:600;letter-spacing:-.03em;line-height:1.1;color:#fff;
  font-variant-numeric:tabular-nums}
.pc .sale__of{font-size:12px;color:var(--ls-accent-on-dark)}
.pc .sale__head{margin-top:16px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.pc .sale__t{font-size:18px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.pc .sale__id{margin-top:2px;font-size:13px;color:var(--ls-ink-muted)}
.pc .sale__price{margin:14px 0 0;font-size:14px;color:var(--ls-ink-muted);font-variant-numeric:tabular-nums}
.pc .sale__split{display:flex;height:10px;border-radius:var(--r-pill);overflow:hidden;
  background:var(--ls-bg-soft);margin-top:8px}
.pc .sale__split i{background:var(--ls-accent)}
.pc .sale__legend{margin-top:8px;display:flex;gap:14px;font-size:12px;color:var(--ls-ink-muted);flex-wrap:wrap}
.pc .sale__legend span{display:flex;align-items:center;gap:5px}
.pc .sale__sq{width:8px;height:8px;border-radius:2px;background:var(--ls-accent)}
.pc .sale__sq--o{background:var(--ls-bg-soft);border:1px solid var(--ls-border)}
.pc .sale__tl{margin-top:14px;padding:12px 14px;background:var(--ls-surface-alt);border-radius:var(--r-field)}
.pc .sale__tlh{display:flex;justify-content:space-between;gap:8px;font-size:11px;font-weight:600;
  letter-spacing:.05em;text-transform:uppercase;color:var(--ls-ink-faint)}
.pc .sale__track{position:relative;height:6px;border-radius:var(--r-pill);background:var(--ls-bg-soft);margin-top:10px}
.pc .sale__track i{display:block;height:100%;border-radius:var(--r-pill)}
.pc .sale__track b{position:absolute;top:-4px;margin-left:-7px;width:14px;height:14px;
  border-radius:var(--r-pill);background:#fff;border:3px solid currentColor}
.pc .sale__tlb{display:flex;justify-content:space-between;gap:8px;font-size:12px;margin-top:8px;
  font-variant-numeric:tabular-nums;font-weight:500}
.pc .sale__tlm{color:var(--ls-ink-muted);font-weight:400}
.pc .sale__unlock{display:flex;justify-content:space-between;gap:6px 12px;flex-wrap:wrap;margin:12px 0;font-size:12px;line-height:1.5}
.pc .sale__unlock>span{color:var(--ls-ink-muted)}
.pc .sale__unlock>b{font-weight:600;font-variant-numeric:tabular-nums}
.pc .sale__grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.pc .sale__k2{display:block;font-size:12px;color:var(--ls-ink-muted)}
.pc .sale__grid b{display:block;font-size:14px;font-weight:500;margin-top:2px}

@media (min-width:861px){
  .pc .stat3{gap:16px}
}

/* ===== Выплаты ===== */
/* align-items:start — правая карточка не тянется по высоте левой колонки. */
/* min-width:0 обязателен: у грид-трека 1fr автоминимум — min-content, и
   нерасщепляемые подписи внутри (nowrap-суммы, чипы) раздували колонку
   шире экрана. */
/* Колонки тянутся до общей высоты: остаток с формой слева и способы справа
   заканчиваются на одной линии, иначе нижний край рвётся посередине экрана. */
.pc .wgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch}
.pc .wgrid > *{min-width:0}
.pc .wcol{display:flex;flex-direction:column;gap:16px;min-width:0}
.pc .wform{flex:1;padding:20px 22px}
/* Здесь у тёмной карточки нет кнопки — только сумма, и свечение мягче. */
.pc .bal--flat .bal__sum{margin-bottom:0}
.pc .bal__glow--soft{background:radial-gradient(closest-side,rgba(29,91,224,.3),transparent)}

.pc .amount{position:relative;display:block}
/* Поле суммы: слева 16, справа место под знак рубля. */
.pc .amount input{padding:0 44px 0 16px}
.pc .amount i{position:absolute;right:16px;top:14px;transform:none;font-size:20px;font-weight:600;
  font-style:normal;color:var(--ls-ink-faint)}
.pc .amount__row{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;
  font-size:13px;margin-top:6px}
.pc .wnote{line-height:1.4;min-width:0;color:var(--ls-ink-faint);font-size:13px}
.pc .wnote--err{color:var(--ls-err)}
.pc .wnote--m{display:block;margin-top:14px;color:var(--ls-ink-muted);line-height:1.45}
.pc .amount__row .linkish{flex:none;font-size:13px}

/* Способ: две кнопки-пилюли на всю ширину. */
.pc .wkind{display:flex;gap:8px}
.pc .wkind button{flex:1;min-width:0;height:44px;display:flex;align-items:center;justify-content:center;
  gap:6px;padding:0 8px;border:1px solid var(--ls-border-strong);border-radius:var(--r-pill);
  background:transparent;color:var(--ls-ink-muted);font-family:inherit;font-size:13px;font-weight:600;
  white-space:nowrap;cursor:pointer}
.pc .wkind button.is-on{background:var(--ls-accent-soft);border-color:var(--ls-accent);color:var(--ls-accent)}
.pc .wkind svg{flex:none}

.pc .wpicks{display:flex;flex-direction:column;gap:6px;margin-top:10px}
/* height:auto и margin:0 гасят наследство из panel.css: там строка 56px
   с собственным отступом сверху, а в макете 44 и зазор задаёт контейнер. */
.pc .pick{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;height:auto;min-height:44px;
  margin:0;padding:10px 12px;border:1px solid var(--ls-border-strong);border-radius:var(--r-field);
  background:var(--ls-surface);font-family:inherit;text-align:left;cursor:pointer}
.pc .pick.is-on{background:var(--ls-accent-soft);border-color:var(--ls-accent)}
.pc .pick i{width:18px;height:18px;flex:none;border-radius:var(--r-pill);
  border:1.5px solid var(--ls-border-strong);display:flex;align-items:center;justify-content:center}
.pc .pick.is-on i{border-color:var(--ls-accent)}
.pc .pick.is-on i::after{content:'';width:10px;height:10px;border-radius:var(--r-pill);background:var(--ls-accent)}
.pc .pick b{flex:1;min-width:0;font-size:14px;font-weight:500;font-variant-numeric:tabular-nums}
.pc .pick span{font-size:12px;color:var(--ls-ink-muted);font-variant-numeric:tabular-nums;white-space:nowrap}

.pc .wsplit{margin-top:14px;padding:12px 14px;background:var(--ls-surface-alt);border-radius:var(--r-field)}
.pc .wsplit__k{margin:0;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--ls-ink-faint)}
.pc .wsplit__r{display:flex;justify-content:space-between;gap:10px;font-size:14px;margin-top:8px;
  font-variant-numeric:tabular-nums}
.pc .wsplit__r b{font-weight:600}
.pc .wsplit__r span{color:var(--ls-ink-muted);text-align:right}
.pc .wsplit-err{margin:10px 0 0;font-size:13px;color:var(--ls-err);line-height:1.45}

/* Полоса «сколько осталось до минимума» — серая: это не достижение. */
.pc .wbar{height:8px;border-radius:var(--r-pill);background:var(--ls-bg-soft);margin-top:14px;overflow:hidden}
.pc .wbar i{display:block;height:100%;border-radius:var(--r-pill);background:var(--ls-data-3)}
/* Плашка «заявка уже в работе» — единственное цветное пятно в этом состоянии. */
.pc .winfo{display:flex;gap:10px;margin-top:14px;padding:12px 14px;background:var(--ls-accent-soft);
  border-radius:var(--r-field);font-size:13px;line-height:1.45;color:var(--ls-accent)}
.pc .winfo svg{flex:none;margin-top:1px}

/* ===== Карты и кошельки ===== */
.pc .wmeth{padding:20px 22px;display:flex;flex-direction:column}
/* Кнопка на полный список прижата к низу карточки. */
.pc .wmeth__all{margin-top:auto;height:40px;padding:0 14px;
  border:1px solid var(--ls-border-strong);border-radius:var(--r-pill);
  background:var(--ls-surface);color:var(--ls-accent);font-family:inherit;
  font-size:13px;font-weight:600;cursor:pointer}
.pc .wmeth__all:hover{background:var(--ls-accent-soft)}
.pc .wmeth__all[hidden]{display:none}
.pc .ov__card--wall{max-width:520px}
.pc .ov__card--wall .pm:first-of-type{border-top:0;margin-top:6px;padding-top:0}
/* Отбивка от списка, когда способов ровно столько, что карточка не тянется. */
.pc .wmeth:has(.wmeth__all:not([hidden])) #w-methods{padding-bottom:14px}
.pc .wmeth__head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pc .wmeth__sub{margin:2px 0 0;font-size:13px;color:var(--ls-ink-muted);line-height:1.4}
.pc .wmeth__none{margin:0;padding:20px 0 4px;text-align:center;font-size:13px;color:var(--ls-ink-muted)}
.pc .wadd{display:flex;align-items:center;gap:4px;height:40px;border:0;background:none;padding:0;
  font-family:inherit;font-size:13px;font-weight:600;color:var(--ls-accent);cursor:pointer}
/* На пределе кнопка гаснет: отказ после ввода реквизитов раздражает сильнее,
   чем недоступная кнопка с подсказкой. */
.pc .wadd[disabled]{color:var(--ls-ink-faint);cursor:default}
/* Волосок есть и у первой строки — он отделяет её от подписи про лимит.
   display:block обязателен: в panel.css .pm — это флекс-ряд старого кабинета,
   а здесь внутри лежат ряд, подсказка и полоса лимита друг под другом. */
.pc .pm{display:block;padding:14px 0 0;margin-top:12px;border-top:1px solid var(--ls-hairline)}
.pc .pm:first-of-type{border-top:1px solid var(--ls-hairline)}
/* Гасим мобильное правило panel.css, разворачивавшее действия на всю ширину. */
.pc .pm__acts{width:auto;padding-left:0;padding-top:0}
.pc .pm__row{display:flex;align-items:center;gap:12px}
.pc .pm__plate{width:40px;height:28px;flex:none;border-radius:7px;display:flex;align-items:center;
  justify-content:center;color:#fff;font-size:10px;font-weight:600;letter-spacing:.04em}
.pc .pm__plate--mir{background:#2E7D32}
.pc .pm__plate--visa{background:#1A1F71}
.pc .pm__plate--mc{background:#EB001B}
.pc .pm__plate--usdt{background:#26A17B}
.pc .pm__main{display:flex;flex-direction:column;min-width:0;flex:1}
.pc .pm__t{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:500;
  font-variant-numeric:tabular-nums;min-width:0;white-space:nowrap}
.pc .pm__n{min-width:0;overflow:hidden;text-overflow:ellipsis}
.pc .pm__t .tag{flex:none}
.pc .pm__s{font-size:12px;color:var(--ls-ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .tag{height:18px;padding:0 7px;border-radius:var(--r-pill);background:var(--ls-accent-soft);
  color:var(--ls-accent);font-size:11px;font-weight:600;display:inline-flex;align-items:center}
.pc .pm__acts{display:flex;gap:4px;flex:none}
.pc .wlink{height:36px;padding:0 8px;border:0;background:none;font-family:inherit;font-size:13px;
  font-weight:600;color:var(--ls-accent);cursor:pointer}
.pc .wlink--danger{color:var(--ls-err)}
.pc .wlink[disabled]{color:var(--ls-ink-faint);cursor:default}
.pc .pm__hint{margin:6px 0 0;font-size:12px;color:var(--ls-ink-faint);text-align:right}
.pc .lim{margin-top:10px}
.pc .lim__t{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--ls-ink-muted);
  font-variant-numeric:tabular-nums}
.pc .lim__t b{font-weight:600;color:var(--ls-ink-1)}
.pc .lim__t b.lim--hot{color:var(--ls-wait)}
.pc .lim__bar{height:6px;border-radius:var(--r-pill);background:var(--ls-bg-soft);margin-top:6px;overflow:hidden}
.pc .lim__bar i{display:block;height:100%;border-radius:var(--r-pill);background:var(--ls-accent)}
.pc .lim__bar i.lim--hot-bar{background:var(--ls-wait)}

/* ===== История выплат ===== */
.pc .whist{padding:20px 22px 4px}
/* В пустой истории сохраняем высоту: 20 + 4 + margin 4 = 14 + 14.
   Меняем только положение заголовка, заполненный список остаётся прежним. */
.pc .whist:has(> #w-rows:empty){padding-block:14px}
.pc .whist:has(> #w-rows:empty) .last__head{margin-bottom:0}
.pc .whist .srow{border-top:1px solid var(--ls-hairline)}
.pc .whist .srow__s{white-space:normal;overflow-wrap:anywhere;line-height:1.4}
.pc .wico{width:36px;height:36px;flex:none;border-radius:var(--r-pill);display:flex;
  align-items:center;justify-content:center}
.pc .st--acc{background:var(--ls-accent-soft);color:var(--ls-accent)}

/* ===== Окна выплат ===== */
.pc .ask__rows{margin-top:14px;border-top:1px solid var(--ls-hairline)}
.pc .ask__r{display:flex;justify-content:space-between;gap:10px;font-size:15px;padding:10px 0;
  border-bottom:1px solid var(--ls-hairline);font-variant-numeric:tabular-nums}
.pc .ask__r b{font-weight:600}
.pc .req__top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pc .req__sum{font-size:22px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pc .req__rows{margin-top:14px;border-top:1px solid var(--ls-hairline)}
.pc .req__r{display:flex;justify-content:space-between;gap:12px;font-size:14px;padding:10px 0;
  border-bottom:1px solid var(--ls-hairline)}
.pc .req__r span{color:var(--ls-ink-muted)}
.pc .req__r b{font-weight:500;text-align:right;min-width:0;word-break:break-word}
.pc .req__hash{margin-top:14px}
.pc .req__hash .mono{display:block;margin-top:2px;font-family:var(--font-mono);font-size:13px;
  word-break:break-all;font-weight:400}
.pc .req__why{margin-top:12px;padding:12px 14px;background:var(--ls-err-bg);border-radius:var(--r-field);
  font-size:14px;line-height:1.45;color:var(--ls-ink-1);display:flex;flex-direction:column}
/* Заголовок блока — эйбрау, как у остальных подписей карточек. */
.pc .req__why b{font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--ls-err);margin-bottom:4px}
.pc .req__back{color:var(--ls-ink-muted);font-size:13px;margin-top:4px}

@media (max-width:860px){
  .pc .wgrid{grid-template-columns:1fr}
  .pc .wform,.pc .wmeth{padding:16px}
  .pc .whist{padding:16px 16px 4px}
  .pc .whist:has(> #w-rows:empty){padding-block:12px}
}

@media (max-width:520px){
  /* На узком экране подпись у «Истории выплат» съедала заголовок в две
     строки — она пояснительная, без неё список читается так же. */
  .pc .whist .wmeth__sub{display:none}
}

/* Кнопки окна остаются в строку и на телефоне: в макете это две равные
   половины, а column-reverse из panel.css ставил их друг над другом. */
@media (max-width:860px){
  .pc .ov__foot{flex-direction:row;gap:10px}
  .pc .ov__foot .btn{flex:1;width:auto;min-height:44px}
  .pc .ov__foot .btn--block{width:auto}
}

/* ===== Промо ===== */
.pc .ptop{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.pc .ptop > *{min-width:0}
/* Карточка стоит в паре с «Моими ссылками» и тянется по её высоте: код
   встаёт по центру остатка, кнопка прижимается к низу. */
.pc .promo-code{padding:20px 22px;display:flex;flex-direction:column}
.pc .promo-code .bal__in{display:flex;flex-direction:column;flex:1}
.pc .pcode{flex:1;display:flex;align-items:center;
  margin:8px 0 0;font-family:var(--font-mono);font-size:34px;font-weight:600;
  line-height:1;letter-spacing:.02em;color:#fff;word-break:break-all}
.pc .pc3{display:flex;justify-content:space-between;gap:10px;margin-top:16px;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.12)}
.pc .pc3 > div{display:flex;flex-direction:column;min-width:0}
.pc .pc3 b{font-size:20px;font-weight:600;color:#fff;font-variant-numeric:tabular-nums}
.pc .pc3 span{font-size:12px;color:var(--on-dark-50)}
.pc .pc3--light{margin-top:14px;padding-top:12px;border-top-color:var(--ls-hairline)}
.pc .pc3--light b{font-size:18px;color:var(--ls-ink-1)}
.pc .pc3--light span{color:var(--ls-ink-muted)}

/* ===== Мои ссылки ===== */
/* Карточка тянется по высоте промокода: они стоят парой в одной строке. */
.pc .mylinks{padding:20px 22px;display:flex;flex-direction:column}
.pc .mylinks__head{display:flex;align-items:center;justify-content:space-between;
  gap:12px;margin-bottom:12px}
.pc .mylinks__head .chart__title{margin:0}
.pc .mylinks__add{display:flex;align-items:center;gap:4px;height:32px;padding:0 4px;
  border:0;background:none;font-family:inherit;font-size:13px;font-weight:600;
  color:var(--ls-accent);cursor:pointer}
.pc .mylinks__add:hover{color:var(--ls-accent-hover)}
/* flex:1 забирает остаток высоты, когда соседняя карточка выше: строки
   остаются вверху, а карточка не съёживается по содержимому. */
.pc .mylinks__list{flex:1;display:flex;flex-direction:column;gap:8px}

.pc .lrow{display:flex;align-items:center;gap:10px;padding:10px 12px 10px 14px;
  background:var(--ls-bg-soft);border-radius:var(--r-field);cursor:pointer;
  transition:background .15s var(--ease-out)}
.pc .lrow:hover{background:var(--ls-border)}
.pc .lrow:focus-visible{outline:2px solid var(--ls-accent);outline-offset:2px}
.pc .lrow__ic{flex:none;width:32px;height:32px;border-radius:var(--r-pill);
  background:var(--ls-surface);color:var(--ls-ink-1);
  display:flex;align-items:center;justify-content:center}
.pc .lrow__t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pc .lrow__n{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .lrow__s{font-size:12px;color:var(--ls-ink-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .lrow__c{flex:none;width:36px;height:36px;border:0;border-radius:var(--r-pill);
  background:var(--ls-surface);box-shadow:var(--sh-card);color:var(--ls-accent);
  display:flex;align-items:center;justify-content:center;cursor:pointer}
.pc .lrow__c:hover{color:var(--ls-accent-hover)}
.pc .lrow__none{margin:0;padding:14px 2px 4px;font-size:13px;line-height:1.5;
  color:var(--ls-ink-faint)}

/* На широком экране в «Моих ссылках» только две последние: полный список
   со статистикой стоит ниже, во «Всех ссылках». */
@media (min-width:861px){
  .pc .mylinks__list .lrow:nth-child(n+3){display:none}
  .pc .pcode{font-size:52px}
}

/* ===== Все ссылки ===== */
/* На телефоне те же ссылки уже перечислены выше — второй список был бы повтором. */
/* Сравнение ссылок: горизонтальные столбики читаются и с длинными названиями. */
.pc .promo-stats{padding:22px;min-width:0;margin:16px 0}
.pc .promo-stats__head{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.pc .promo-stats__head .chart__title{margin:0}
.pc .promo-stats__sub{margin:6px 0 0;font-size:13px;color:var(--ls-ink-muted);line-height:1.4}
.pc .promo-stats__period{margin:0;gap:8px;max-width:100%;flex-wrap:wrap}
.pc .promo-stats__period .pseg{background:var(--ls-bg-soft)}
.pc .promo-stats__period .pcal{background:var(--ls-bg-soft);max-width:100%;height:auto;min-height:38px}
.pc .promo-stats__period .pcal.is-on{background:var(--ls-dark);color:#fff}
.pc .promo-stats__period .pcal__t{white-space:normal}
.pc .promo-stats__summary{display:flex;gap:32px;margin:16px 0;padding:0;background:none}
.pc .promo-stats__summary>div{min-width:0;display:flex;flex-direction:column;gap:8px}
.pc .promo-stats__summary span{font-size:12px;color:var(--ls-ink-muted)}
.pc .promo-stats__summary b{font-size:22px;font-weight:600;line-height:1.2;overflow-wrap:anywhere}
.pc .promo-stats__summary small{font-size:15px;font-weight:400;color:var(--ls-ink-muted)}
.pc .promo-stats__summary .promo-stats__leader b{font-size:17px;line-height:1.5}
.pc .promo-stats__labels{display:flex;justify-content:space-between;gap:12px;padding-bottom:10px;font-size:11px;color:var(--ls-ink-muted)}
.pc .promo-stats__views{display:inline-flex;gap:4px;padding:3px;margin-bottom:12px;background:var(--ls-bg-soft);border-radius:20px}
.pc .promo-stats__views button{border:0;border-radius:18px;padding:7px 16px;background:none;color:var(--ls-ink-muted);font:inherit;font-size:12px;cursor:pointer}
.pc .promo-stats__views button[aria-pressed="true"]{background:var(--ls-dark);color:white}
.pc .promo-time{margin:0;min-width:0}
.pc .promo-time__filters{margin:8px 0 10px;font-size:12px;color:var(--ls-ink-muted)}
.pc .promo-time__filters summary,.pc .promo-stats__note summary{cursor:pointer;width:fit-content;padding:4px 0}
.pc .promo-time__head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}
.pc .promo-time__head h3{margin:0;font-size:15px;font-weight:600}
.pc .promo-time__head>span,.pc .promo-time__hint{font-size:12px;color:var(--ls-ink-muted);line-height:1.5}
.pc .promo-time__legend{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0;max-height:112px;overflow:auto;padding:3px}
.pc .promo-time__legend button{display:inline-flex;align-items:center;gap:7px;max-width:240px;min-width:0;border:1px solid var(--ls-hairline);border-radius:20px;padding:7px 10px;background:var(--ls-surface);font:inherit;font-size:12px;color:var(--ls-ink-1);cursor:pointer}
.pc .promo-time__legend button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc .promo-time__legend button[aria-pressed="false"]{opacity:.45;text-decoration:line-through}
.pc .promo-time i{width:8px;height:8px;flex:none;border-radius:50%}
.pc .promo-time__body{position:relative}
.pc .promo-time__plot{position:relative;height:200px;width:100%;outline-offset:3px;cursor:crosshair;touch-action:pan-y}
.pc .promo-time__plot:focus-visible{outline:2px solid var(--ls-accent);border-radius:8px}
.pc .promo-time__plot svg{display:block;width:100%;height:100%;overflow:visible}
.pc .promo-time__grid{stroke:var(--ls-hairline);stroke-width:1;vector-effect:non-scaling-stroke}
.pc .promo-time__cursor{stroke:var(--ls-ink-muted);stroke-width:1;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.pc .promo-time__ytick,.pc .promo-time__xtick{position:absolute;font-size:11px;color:var(--ls-ink-muted);pointer-events:none;font-variant-numeric:tabular-nums}
.pc .promo-time__ytick{left:0;transform:translateY(-50%)}
.pc .promo-time__xtick{bottom:0;transform:translateX(-50%);white-space:nowrap}
.pc .promo-time__compare{position:static;margin-top:12px;width:100%;padding:10px 12px;border:1px solid var(--ls-hairline);border-radius:12px;background:var(--ls-bg-soft);font-size:12px;box-sizing:border-box}
.pc .promo-time__compare[hidden]{display:none}
.pc .promo-time__compare-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pc .promo-time__compare-head button{background:none;border:0;font:inherit;font-size:22px;line-height:1;cursor:pointer;color:var(--ls-ink-muted);padding:0 4px}
.pc .promo-time__unit{display:block;margin:4px 0;font-size:10px;color:var(--ls-ink-muted)}
.pc .promo-time__values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 20px}
.pc .promo-time__values.is-expanded{max-height:210px;overflow:auto;overscroll-behavior:contain}
.pc .promo-time__expand{padding:4px 0;border:0;background:none;color:var(--ls-accent);font:inherit;font-size:12px;cursor:pointer}
.pc .promo-time__value{display:flex;gap:8px;align-items:baseline;padding:8px 0;border-top:1px solid var(--ls-hairline)}
.pc .promo-time__value>span{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}
.pc .promo-time__values.is-expanded .promo-time__value>span{white-space:normal;overflow-wrap:anywhere}
.pc .promo-time__value small{display:block;font-size:10px;color:var(--ls-ink-muted)}
.pc .promo-time__value>b{flex:none;font-size:14px}
.pc .promo-time__hint{margin:10px 0 0}
@media(max-width:600px){
  .pc .promo-time__plot{height:170px}
  .pc .promo-time__values{grid-template-columns:1fr}
  .pc .promo-time__value{padding:5px 0}
  .pc .promo-time__xtick{font-size:9px}
  .pc .promo-time__legend button{max-width:100%;min-height:36px}
  .pc .promo-time__compare{margin-top:12px}
}
.pc .promo-stats__bars{list-style:none;padding:0;margin:0;max-height:360px;overflow:auto;overscroll-behavior:contain}
.pc .promo-bar{display:grid;grid-template-columns:24px minmax(130px,1fr) minmax(0,1.7fr);gap:14px;align-items:center;padding:15px 0;border-top:1px solid var(--ls-hairline)}
.pc .promo-bar__rank{font-size:12px;color:var(--ls-ink-muted)}
.pc .promo-bar__link{min-width:0;display:flex;flex-direction:column;gap:5px;overflow-wrap:anywhere}
.pc .promo-bar__link>b{font-size:14px;font-weight:600;line-height:1.4}
.pc .promo-bar__link>span{font-size:12px;line-height:1.4;color:var(--ls-ink-muted)}
.pc .promo-bar__plot{display:flex;align-items:center;gap:14px;min-width:0}
.pc .promo-bar__plot>b{flex:none;min-width:40px;text-align:right;font-size:16px;font-weight:600}
.pc .promo-bar__track{height:14px;flex:1;min-width:0;overflow:hidden;border-radius:5px;background:var(--ls-bg-soft)}
.pc .promo-bar__track>i{display:block;height:100%;border-radius:5px;background:var(--ls-accent)}
.pc .promo-stats__note{margin:16px 0 0;padding-top:16px;border-top:1px solid var(--ls-hairline);font-size:12px;line-height:1.6;color:var(--ls-ink-muted)}
.pc .promo-stats__message{padding:30px 0;margin:0;font-size:14px;line-height:1.6;color:var(--ls-ink-muted)}
.pc .promo-stats__empty{padding:12px 16px;margin:0 0 16px;border-radius:12px;background:var(--ls-accent-soft);color:var(--ls-accent);font-size:13px;line-height:1.5}
.pc .promo-stats__more,.pc .promo-stats__retry{font:inherit;font-size:13px;font-weight:500;color:var(--ls-accent);background:none;border:0;cursor:pointer;padding:12px 0}
.pc .promo-stats__more{display:block;width:100%;min-height:44px}
.pc .promo-stats__more[hidden]{display:none}
.pc .promo-stats button:focus-visible{outline:2px solid var(--ls-accent);outline-offset:3px}
@media(max-width:600px){
  .pc .promo-stats{padding:20px 16px}
  .pc .promo-stats__head{gap:16px}
  .pc .promo-stats__period{width:100%}
  .pc .promo-stats__period .pseg{min-width:0;flex:1;display:flex}
  .pc .promo-stats__period .pseg button{min-width:0;flex:1;padding:0 4px;font-size:11px;min-height:38px}
  .pc .promo-stats__summary{gap:24px;padding:0;margin:14px 0}
  .pc .promo-stats__leader{grid-column:1/-1;border-top:1px solid var(--ls-hairline);padding-top:12px}
  .pc .promo-stats__summary b{font-size:22px}
  .pc .promo-bar{grid-template-columns:18px minmax(0,1fr);gap:8px 10px}
  .pc .promo-bar__plot{grid-column:2}
  .pc .promo-bar__plot>b{font-size:14px}
  .pc .promo-bar__track{height:12px}
}
@media(max-width:360px){
  .pc .promo-stats__period .pseg button{padding:0 3px;font-size:11px;flex:1 1 auto}
}
.pc .alinks{padding:20px 22px}
@media (max-width:860px){ .pc .alinks{display:none} }
.pc .alinks[hidden]{display:none}
.pc .alinks__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.pc .alinks__head .chart__title{margin:0}
.pc .alinks__tot{font-size:13px;color:var(--ls-ink-muted)}
.pc .alinks__list{margin-top:8px}
.pc .arow{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:10px 14px;align-items:center;padding:14px 0;
  border-top:1px solid var(--ls-hairline);cursor:pointer}
.pc .arow:focus-visible{outline:2px solid var(--ls-accent);outline-offset:-2px}
.pc .arow__l{display:flex;align-items:center;gap:12px;min-width:0}
.pc .arow__ic{flex:none;width:40px;height:40px;border-radius:var(--r-pill);
  background:var(--ls-accent-soft);color:var(--ls-accent);
  display:flex;align-items:center;justify-content:center}
.pc .arow__t{display:flex;flex-direction:column;gap:3px;min-width:0}
.pc .arow__n{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .arow__s{font-size:12px;color:var(--ls-ink-muted);font-variant-numeric:tabular-nums;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .arow__r{display:flex;align-items:center;gap:12px;min-width:0}
/* Колонки фиксированной ширины, а не 1fr: на растяжке три числа расползались
   по половине строки. Ширина одна на все строки — числа стоят столбиком. */
.pc .arow__st{flex:none;margin-left:auto;display:grid;grid-template-columns:repeat(3,76px);gap:6px}
.pc .arow__st span{display:flex;flex-direction:column;min-width:0}
.pc .arow__st b{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums}
.pc .arow__st i{font-size:11px;font-style:normal;color:var(--ls-ink-muted)}
.pc .arow__c{flex:none;height:32px;padding:0 14px;display:flex;align-items:center;gap:6px;
  border:1px solid var(--ls-border-strong);border-radius:var(--r-pill);
  background:var(--ls-surface);color:var(--ls-accent);font-family:inherit;
  font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.pc .arow__c:hover{background:var(--ls-accent-soft)}
.pc .arow__c svg{width:14px;height:14px}
/* Доля переходов этой ссылки от всех — под строкой во всю её ширину. */
.pc .arow__bar{grid-column:1/-1;height:6px;border-radius:var(--r-pill);
  background:var(--ls-bg-soft);overflow:hidden}
.pc .arow__bar i{display:block;height:100%;border-radius:var(--r-pill);background:var(--ls-data-1)}

/* ===== A/B-тест цен на обзоре =====
   Карточка во всю ширину сетки. Слева итог словами и ход теста, справа цены
   столбиками по возрастанию: высота — деньги с перехода, лидер подсвечен
   колонкой. На узкой карточке всё встаёт одно под другим. Ссылки свёрнуты, а
   длинное имя обрезается: у грид-трека минимум — ширина самого длинного слова,
   и адрес канала в названии растягивал страницу вбок. */
.pc .ov-data > .abt{grid-column:1/-1;min-width:0}
.pc .abt{padding:20px 22px;container-type:inline-size}
.pc .abt[hidden]{display:none}
.pc .abt__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.pc .abt__meta{font-size:13px;color:var(--ls-ink-muted);white-space:nowrap}
.pc .abt__body{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:14px;
  grid-template-areas:'sum' 'cmp' 'runs' 'note'}
.pc .abt__body > *{min-width:0}
.pc .abt__sum{grid-area:sum}
.pc .abt__cmp{grid-area:cmp}
.pc .abt__runs{grid-area:runs}
.pc .abt__note{grid-area:note}
.pc .abt__title{margin:0;font-size:20px;font-weight:600;letter-spacing:-.015em;line-height:1.2;text-wrap:balance}
.pc .abt__text{margin:8px 0 0;max-width:56ch;font-size:14px;line-height:1.5;color:var(--ls-ink-muted)}
.pc .abt__conf{display:flex;align-items:baseline;gap:8px;margin:12px 0 0;font-size:13px;line-height:1.45;color:var(--ls-ink-1)}
.pc .abt__conf i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--ls-ink-faint)}
.pc .abt__conf--few i{background:var(--ls-wait)}
/* Сводка теста: цифры, из которых сделан итог, — покупки, выручка, сколько идёт.
   Стоит под итогом и заполняет его колонку, а не висит внизу отдельно. */
.pc .abt__kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:18px;
  padding-top:14px;border-top:1px solid var(--ls-hairline)}
.pc .abt__kpi{display:flex;flex-direction:column;gap:3px;min-width:0}
.pc .abt__kpi b{font-size:20px;font-weight:600;letter-spacing:-.01em;line-height:1.2;white-space:nowrap}
.pc .abt__kpi span{font-size:12px;line-height:1.35;color:var(--ls-ink-muted)}
/* Цены столбиками. Колонка лидера — мягкой подложкой от столбика до покупок. */
.pc .abt__cmp{overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--ls-border-strong) transparent}
.pc .abt__grid{display:grid;grid-template-columns:88px repeat(var(--n),minmax(76px,1fr));
  min-width:calc(88px + var(--n) * 76px);max-width:calc(88px + var(--n) * 180px)}
.pc .abt__k{display:flex;align-items:center;padding-right:8px;font-size:12px;color:var(--ls-ink-muted)}
.pc .abt__c{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 4px;
  font-size:13px;color:var(--ls-ink-1);text-align:center}
.pc .abt__c.is-best{background:var(--ls-accent-soft)}
.pc .abt__r-bar{height:152px}
.pc .abt__k.abt__r-bar{align-items:flex-end;padding-bottom:2px}
.pc .abt__c.abt__r-bar{justify-content:flex-end;gap:6px;padding-top:12px}
.pc .abt__c.abt__r-bar.is-best{border-radius:16px 16px 0 0}
.pc .abt__r-price{height:46px;border-top:1px solid var(--ls-border)}
.pc .abt__r-price b{font-size:15px;font-weight:600}
.pc .abt__r-num{height:36px;border-top:1px solid var(--ls-hairline)}
.pc .abt__c.abt__r-price.is-best,.pc .abt__c.abt__r-num.is-best{border-top-color:rgba(29,91,224,.14)}
.pc .abt__c.abt__r-last.is-best{border-radius:0 0 16px 16px}
.pc .abt__val{font-size:13px;font-weight:600;color:var(--ls-ink-muted);
  animation:abt-in .4s var(--ease-out) both;animation-delay:calc(var(--i, 0) * 70ms + 200ms)}
.pc .abt__c.is-best .abt__val{color:var(--ls-accent)}
.pc .abt__col{display:block;flex:none;width:min(52px,70%);border-radius:10px 10px 3px 3px;background:var(--ls-data-3);
  transform-origin:bottom;animation:abt-grow .6s var(--ease-out) both;animation-delay:calc(var(--i, 0) * 70ms)}
.pc .abt__c.is-best .abt__col{background:var(--ls-data-1)}
@keyframes abt-grow{from{transform:scaleY(0)}}
@keyframes abt-in{from{opacity:0}}
/* Ход теста и ссылки под раскрывашкой. */
.pc .abt__prog-t{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0;
  font-size:13px;color:var(--ls-ink-muted)}
.pc .abt__prog-t b{font-weight:600;color:var(--ls-ink-1);white-space:nowrap}
.pc .abt__track{display:block;height:4px;margin-top:8px;border-radius:var(--r-pill);background:var(--ls-bg-soft);overflow:hidden}
.pc .abt__track i{display:block;height:100%;border-radius:var(--r-pill);background:var(--ls-ink-1)}
.pc .abt__more{margin-top:10px}
.pc .abt__more-s{display:inline-flex;align-items:center;gap:6px;padding:4px 0;border-radius:6px;cursor:pointer;
  list-style:none;font-size:13px;font-weight:600;color:var(--ls-accent)}
.pc .abt__more-s::-webkit-details-marker{display:none}
.pc .abt__more-s:hover{color:var(--ls-accent-hover)}
.pc .abt__more-s:focus-visible{outline:2px solid var(--ls-accent);outline-offset:2px}
.pc .abt__more-s svg{transition:transform .2s var(--ease-out)}
.pc .abt__more[open] .abt__more-s svg{transform:rotate(180deg)}
.pc .abt__list{margin:6px 0 0;padding:0;list-style:none}
.pc .abt__li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:12px;
  padding:8px 0;border-top:1px solid var(--ls-hairline);font-size:13px}
.pc .abt__li-n{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ls-ink-1)}
.pc .abt__li-v{white-space:nowrap;color:var(--ls-ink-muted)}
.pc .abt__gh{padding:10px 0 4px;font-size:12px;font-weight:600;color:var(--ls-ink-muted)}
.pc .abt__note{margin:0;font-size:12px;line-height:1.5;color:var(--ls-ink-muted)}
@container (min-width:760px){
  .pc .abt__body{grid-template-columns:minmax(260px,.9fr) minmax(0,1.1fr);column-gap:48px;row-gap:18px;
    grid-template-rows:auto 1fr auto;grid-template-areas:'sum cmp' 'runs cmp' 'note note'}
  .pc .abt__title{font-size:24px}
  .pc .abt__grid{margin-left:auto}
}
/* Наборов цен несколько: на разных ссылках идут тесты с разными ценами. Общий
   ряд из всех цен читался кашей — половина колонок пустая, а победитель
   выбирался между ценами, которые друг друга не видели. Каждый набор идёт
   своим блоком со своим итогом; внутри блока раскладка та же, что у одного
   теста: итог словами слева, столбики справа. */
.pc .abt__body--multi{grid-template-rows:auto;grid-template-areas:'sum' 'groups' 'runs' 'note'}
.pc .abt__groups{grid-area:groups;display:grid;gap:22px;min-width:0}
.pc .abt__g{display:grid;gap:14px;min-width:0;padding-top:18px;border-top:1px solid var(--ls-hairline)}
.pc .abt__g > *{min-width:0}
.pc .abt__g .abt__cmp{grid-area:auto}
.pc .abt__gmeta{margin:0 0 6px;font-size:11px;font-weight:600;letter-spacing:.07em;
  text-transform:uppercase;color:var(--ls-ink-faint)}
.pc .abt__gtitle{margin:0;font-size:17px;font-weight:600;letter-spacing:-.015em;line-height:1.25;text-wrap:balance}
.pc .abt__g--empty .abt__gtitle{color:var(--ls-ink-muted)}
@container (min-width:760px){
  .pc .abt__body--multi{grid-template-columns:minmax(0,1fr);column-gap:0;
    grid-template-areas:'sum' 'groups' 'runs' 'note'}
  .pc .abt__g{grid-template-columns:minmax(240px,.85fr) minmax(0,1.15fr);column-gap:48px;align-items:start}
  .pc .abt__gtitle{font-size:19px}
}
@media (max-width:860px){
  .pc .abt{padding:18px 16px}
  .pc .abt__kpi b{font-size:18px}
  /* До пяти цен влезают в ширину телефона без прокрутки: после перезапуска теста
     в блоке бывают цены и прошлого, и нового теста. */
  .pc .abt__grid{grid-template-columns:58px repeat(var(--n),minmax(46px,1fr));min-width:calc(58px + var(--n) * 46px)}
  .pc .abt__k{font-size:11px;padding-right:6px}
  .pc .abt__c{font-size:12px;padding:0 1px}
  .pc .abt__r-price b{font-size:13px}
  .pc .abt__val{font-size:12px}
}
@media (prefers-reduced-motion:reduce){
  .pc .abt__col,.pc .abt__val{animation:none}
  .pc .abt__more-s svg{transition:none}
}

/* ===== Окна ссылок ===== */
.pc .field__input--b{font-weight:600}
.pc .plats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pc .ov__net{margin:0 0 14px;font-size:13px;line-height:1.45;color:var(--ls-ink-muted)}
.pc .ov__net b{color:var(--ls-ink-1);font-weight:600}
.pc .plat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  height:64px;border:1px solid var(--ls-border-strong);border-radius:14px;
  background:var(--ls-surface);color:var(--ls-ink-1);font-family:inherit;
  font-size:13px;font-weight:600;cursor:pointer}
.pc .plat:hover{border-color:var(--ls-ink-faint)}
.pc .plat.is-on{border-color:var(--ls-accent);background:var(--ls-accent-soft);color:var(--ls-accent)}
/* Адрес: неизменяемая часть слева, хвост набирает партнёр. */
.pc .slug{display:flex;align-items:center;height:48px;overflow:hidden;
  border:1px solid var(--ls-border-strong);border-radius:var(--r-field);background:var(--ls-surface)}
.pc .slug:focus-within{border-color:var(--ls-accent);box-shadow:0 0 0 3px var(--ls-accent-soft)}
.pc .slug.is-err{border-color:var(--ls-err)}
.pc .slug.is-err:focus-within{box-shadow:0 0 0 3px rgba(163,42,42,.15)}
.pc .slug__pre{flex:none;padding-left:14px;font-size:15px;color:var(--ls-ink-faint);
  font-variant-numeric:tabular-nums}
.pc .slug__in{flex:1;min-width:0;height:100%;padding:0 14px 0 0;border:0;background:transparent;
  font-family:inherit;font-size:15px;font-weight:600;color:var(--ls-ink-1)}
.pc .slug__in:focus{outline:none;box-shadow:none}
.pc .slug__msg{margin:6px 0 0;min-height:16px;font-size:12px;line-height:1.35;color:var(--ls-ink-faint)}
/* Подпись под адресом и так отбита, поэтому кнопкам хватает 18. */
.pc #nl-ov .ov__foot{margin-top:18px}
.pc .slug__msg.is-err{color:var(--ls-err)}
/* Адрес в настройках менять нельзя: он уже разошёлся по роликам. */
.pc .slugro{margin:10px 0 0;padding:12px 14px;background:var(--ls-bg-soft);border-radius:14px;
  font-size:14px;line-height:1.4;word-break:break-all}
.pc .slugro span{color:var(--ls-ink-muted)}
.pc .delbox{display:flex;flex-direction:column;gap:4px;margin-top:14px;padding:12px 14px;
  background:var(--ls-bg-soft);border-radius:14px}
.pc .delbox b{font-size:15px;font-weight:600;word-break:break-all}
.pc .delbox b span{color:var(--ls-ink-muted);font-weight:400}
.pc .delbox > span{font-size:12px;color:var(--ls-ink-muted)}
.pc .ov__p--14{margin-top:12px;font-size:14px}


@media (max-width:860px){
  .pc .ptop{grid-template-columns:1fr}
}

/* ===== Уведомления ===== */
.pc .nv__head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pc .nv__list{display:flex;flex-direction:column;margin-top:8px}
.pc .nv__none{margin:0;padding:32px 0;text-align:center;font-size:13px;color:var(--ls-ink-muted)}
/* Линия есть и у первой строки — она отделяет список от заголовка. */
.pc .note{display:flex;gap:12px;align-items:flex-start;width:100%;padding:12px 0;border:0;
  border-top:1px solid var(--ls-hairline);background:none;font-family:inherit;
  text-align:left;color:inherit;cursor:pointer}
.pc .note__ico{flex:none;width:36px;height:36px;border-radius:var(--r-pill);display:flex;
  align-items:center;justify-content:center;background:var(--ls-bg-soft);color:var(--ls-ink-muted)}
/* Тон кружка говорит о прочитанности, а не о типе события. */
.pc .note--new .note__ico{background:var(--ls-accent-soft);color:var(--ls-accent)}
.pc .note__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pc .note__t{font-size:14px;line-height:1.4}
.pc .note--new .note__t{font-weight:600}
.pc .note__d{font-size:12px;color:var(--ls-ink-faint)}
.pc .note__dot{flex:none;width:8px;height:8px;border-radius:var(--r-pill);
  background:var(--ls-accent);margin-top:6px}

/* ===== Вход и сброс пароля ===== */
/* На телефоне карточки входа нет — поля лежат прямо на фоне страницы. */
.pc .auth__card{width:100%;max-width:400px;background:transparent;padding:0;box-shadow:none;
  border-radius:24px}
.pc .auth__logo{display:flex;align-items:center;gap:8px;margin-bottom:24px}
.pc .auth__logo b{font-size:16px;font-weight:600;letter-spacing:-.01em}
.pc .auth__logo i{font-size:17px;font-weight:800;font-style:italic;letter-spacing:-.04em;
  color:var(--ls-accent)}
.pc .auth__title{margin:0;font-size:26px;font-weight:600;letter-spacing:-.025em;line-height:1.12;color:var(--ls-ink-1)}
.pc .auth form{margin-top:20px;display:flex;flex-direction:column;gap:12px}
.pc .auth .field{margin:0}
.pc .auth .btn{margin-top:8px}
.pc .auth__err{margin:6px 0 0;font-size:13px;color:var(--ls-err);min-height:0}
.pc .auth__err:empty{display:none}
/* Кнопка-ссылка под формой: «Забыл пароль», «Вернуться ко входу». */
.pc .auth__link{display:block;width:100%;height:44px;margin-top:6px;border:0;background:none;
  font-family:inherit;font-size:14px;font-weight:600;color:var(--ls-accent);cursor:pointer}
.pc .auth__ok{display:flex;gap:12px;align-items:flex-start;margin-top:16px;padding:14px;
  background:var(--ls-ok-bg);border-radius:var(--r-md);font-size:14px;line-height:1.45;
  color:var(--ls-ok)}
.pc .auth__ok svg{flex:none;margin-top:2px}
.pc .auth__ok b{font-weight:600}
@media (min-width:861px){
  .pc .auth__card{background:var(--ls-surface);padding:32px;box-shadow:var(--sh-card)}
}

/* Индикатор «потянуть — обновить» висит под шапкой кабинета: она 52px,
   а базовое правило считает от админской в 60. */
.pc .ptr{top:58px}

/* ===== Календарь ===== */
/* Разметку рисует общий panel.js — здесь только оформление под макет кабинета.
   Отрезок выглядит одной полосой: скругляются только внешние края. */
.pc .cal__d{border-radius:12px}
.pc .cal__d.is-in{background:var(--ls-accent-soft);color:var(--ls-accent);border-radius:0}
.pc .cal__d.is-edge{background:var(--ls-dark);color:#fff;font-weight:600}
.pc .cal__d.is-start{border-radius:12px 0 0 12px}
.pc .cal__d.is-end{border-radius:0 12px 12px 0}
.pc .cal__d.is-start.is-end{border-radius:12px}
/* Недоступные дни — бледной рамочной серостью, а не приглушённым текстом. */
.pc .cal__d[disabled]{color:var(--ls-border-strong);opacity:1}
/* Сегодня отмечаем цветом текста, а не заливкой: выбранным он от этого не станет. */
.pc .cal__d.is-today:not(.is-edge){color:var(--ls-accent);font-weight:600}
.pc .cal__head{margin-bottom:12px}
.pc .cal__title{font-size:16px}
.pc .cal__week{margin-bottom:4px}
.pc .cal__week span{padding-bottom:0;letter-spacing:normal}
.pc .cal__sum{margin-top:14px;font-size:13px;color:var(--ls-ink-muted);font-weight:400}
.pc .ov__card--cal .ov__foot{margin-top:14px}

@media (max-width:860px){
  /* panel.css на телефоне ставит шапке графика колонку — заголовок уезжал в
     центр, а легенда под него. В макете это строка на любой ширине. */
  .pc .chart__head{flex-direction:row;align-items:center;justify-content:space-between}
}

/* Кнопка копирования промокода — 15px, как в макете: она внутри тёмной
   карточки и не должна спорить с размером кода. */
.pc .promo-code .btn{margin-top:14px;height:44px;font-size:15px}
/* Пока кода нет, карточка остаётся на месте: пустое место на её месте
   читалось бы как поломка, а не как «владелец ещё не выдал». */
.pc .promo-code--none .pcode{color:var(--on-dark-50)}

/* Поля страницы входа по макету: 24 сверху и снизу, 20 по бокам. */
.pc .auth{padding:24px 20px}

@media (max-width:400px){
  /* На 360px правой подписи нужно уступить ещё немного: иначе «оплаченной»
     не влезает в свою колонку и обрезается. */
  .pc .pct__count{max-width:42%}
}

/* ===== Правки по замерам с прототипа =====
   Ниже — только гашение того, что протекает из panel.css: там у базовых
   классов свои поля и отступы, рассчитанные на админку. */
/* Эйбрау внутри карточек кабинета не отбивается снизу: расстояние задаёт
   следующий блок (в макете 6px, а не 10). */
.pc .pct .eyebrow{margin:0}
/* «с оплаченной суммы» отбивалось дважды: gap флекса плюс собственный отступ. */
.pc .pct__of{margin:0}
/* Квадратик легенды получал ещё 6px справа — легенда становилась шире макета. */
.pc .legend i{margin-right:0}
/* Дельта в метрике наследовала разрядку числа: в макете она обычная. */
.pc .metric .d{letter-spacing:normal}
/* Подпись поля — абзац, у него от браузера остаётся верхний отступ в 13px. */
.pc .field__label{margin:0 0 8px}
/* Ритм окон: между блоками 16 сверху и 8 до поля. Правило стоит ПОСЛЕ базового
   `.field__label` — у них одна специфичность, и раньше побеждал базовый,
   из-за чего все блоки в окне слипались в одну кашу. */
.pc .field__label--sp{margin:16px 0 8px}
/* Бейдж «основной» отбивался и gap'ом строки, и собственным margin. */
.pc .tag{margin:0}
/* У истории выплат волосок есть и над первой строкой. */
.pc .whist .srow:first-child{border-top:1px solid var(--ls-hairline)}
/* Выключенная кнопка выплаты в макете на кегль мельче активной. */
.pc .wform .btn[disabled]{font-size:15px}
/* Между полосой и подписью в состоянии «мало денег» — 8px, а не 14. */
.pc #w-mode-low .wnote--m{margin-top:8px}
/* Неактивные пилюли сетей — с тёмной рамкой и обычным текстом. */
.pc .tabs--pill button:not(.is-on){border-color:var(--ls-border-strong);color:var(--ls-ink-1)}
/* Вторичная кнопка окна — белая с тонкой рамкой, а не залитая серым. */
.pc .ov__foot .btn--ghost,.pc .ov__foot .btn--sec{background:var(--ls-surface);
  border:1px solid rgba(0,0,0,.12);color:var(--ls-ink-1)}
.pc .ov__foot .btn--ghost:hover,.pc .ov__foot .btn--sec:hover{background:var(--ls-bg-soft)}

@media (max-width:860px){
  /* Шторка не оставляет запаса под нижнюю панель: подложка .ov (z-index 60)
     и так перекрывает панель (z-index 20), а в макете под кнопками ровно 28px.
     Клиренс из panel.css давал 86px белой полосы. */
  .pc .ov__card{padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))}
}
@media (min-width:861px){
  /* Обычные окна — 520px, лента уведомлений шире для длинных сообщений. */
  .pc .ov__card{max-width:520px;max-height:92%}
  .pc .ov__card.nv{max-width:680px;scrollbar-width:none}
  .pc .ov__card.nv::-webkit-scrollbar{display:none}
}

/* Заголовок окна отбит от следующего блока на 8px — как в макете. */
.pc .ov__title{margin:0 0 8px}
.pc .ov__title + .tabs{margin-top:14px}
/* Кнопки календаря отбиты на 14px, а не на 20. */
.pc .ov__card--cal .btn{height:44px}
/* Способ перевода — строкой под суммой, а не пунктом таблицы. */
.pc .req__method{margin-top:4px;font-size:13px;color:var(--ls-ink-muted);overflow-wrap:anywhere}
/* Хэш — обычная строка таблицы с моноширинным значением и усечением. */
.pc .req__r b.mono{font-family:var(--font-mono);font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%}

/* Подвал сайдбара: колокольчик, профиль и «Выйти» идут вплотную — базовый
   .side__bell в panel.css отбивается снизу ради админской вёрстки. */
.pc .side__bell,.pc .side__user{margin:0}

@media (max-width:1100px){
  /* Две колонки выплат рассчитаны на 1280. На 900–1100 карточка способов
     ужимается так, что номер карты не помещается рядом с действиями —
     ниже этого порога раскладываем в одну колонку. */
  .pc .wgrid{grid-template-columns:1fr}
}

@media (min-width:861px){
  /* На большом экране число в показателях крупнее — карточка высокая, и
     24-й кегль в ней терялся. */
  .pc .mini__val{font-size:32px;letter-spacing:-.03em}
  .pc .mini__sub{margin-top:6px;font-size:13px}
}

/* Источник продажи в её карточке: ссылка с названием или промокод. Строка во
   всю ширину — названия ссылок бывают длинными (у YouTube — целый адрес канала). */
.pc .sale__src{display:flex;align-items:center;gap:10px;width:100%;margin-top:14px;padding:10px 12px;
  border:0;border-radius:var(--r-sm);background:var(--ls-bg-soft);text-align:left;font:inherit;color:inherit}
.pc .sale__srcv{flex:1;min-width:0;display:flex;flex-direction:column}
.pc .sale__srcv b{display:block;margin-top:2px;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc .sale__srcc{font-size:12px;color:var(--ls-ink-muted);font-family:var(--font-mono)}
.pc .sale__src--go{cursor:pointer}
.pc .sale__src--go:active{filter:brightness(.96)}
.pc .sale__src--go:focus-visible{outline:2px solid var(--ls-accent);outline-offset:2px}
.pc .sale__srcgo{flex:none;font-size:22px;line-height:1;color:var(--ls-ink-faint)}
.pc .sale__src + .sale__grid{margin-top:10px}
