/* === Lead Scout design system (spec 2026-10-02 §2) === */
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/static/fonts/onest/onest-cyrillic-400.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/static/fonts/onest/onest-latin-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('/static/fonts/onest/onest-cyrillic-500.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('/static/fonts/onest/onest-latin-500.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('/static/fonts/onest/onest-cyrillic-600.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('/static/fonts/onest/onest-latin-600.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/static/fonts/onest/onest-cyrillic-700.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Onest'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/static/fonts/onest/onest-latin-700.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --bg: #F3F4FA; --surface: #FFFFFF; --surface-muted: #FAFAFD;
  --border: #E2E3EE; --border-soft: #ECECF4;
  --text: #15161C; --text-muted: #5B6170; --text-faint: #8A8EA0;
  --success-bg: #E8F7F0; --success-fg: #047857; --danger-bg: #FEF0F0; --danger-fg: #C62828;
  --warning-bg: #FFF4E0; --warning-fg: #B45309; --text-2: #2A2D38;
  --accent: #4F46E5; --accent-strong: #4338CA; --accent-soft: #EEF0FF; --dark: #15161C;
  --radius-lg: 24px; --radius-md: 18px; --radius-sm: 12px;
  --shadow-accent: 0 8px 20px rgba(79,70,229,.28);
  --shadow-pop: 0 18px 40px rgba(21,22,28,.12);
  --font: 'Onest', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mobile-nav-h: 69px; /* нижняя панель на телефоне: пункт 56px + отступы 12px + граница */
}
.icon { width: 20px; height: 20px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.icon-brand { fill: currentColor; stroke: none; }
.icon-sm { width: 16px; height: 16px; }

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font);
    background: var(--bg);
    color: var(--text);
    line-height: 1.5;
}

/* Layout / Sidebar */
.layout { display: flex; min-height: 100vh; background: var(--bg); }
.sidebar { position: fixed; top: 16px; bottom: 16px; left: 16px; width: 248px; box-sizing: border-box;
  display: flex; flex-direction: column; gap: 24px; padding: 20px 16px 16px; background: var(--surface);
  border-radius: var(--radius-lg); overflow: hidden; transition: width .2s ease; z-index: 20; }
/* На низком экране прокручивается только меню — логотип и профиль внизу всегда видны целиком */
.sidebar-logo, .sidebar-bottom { flex-shrink: 0; }
/* Меню — не ссылки в тексте: без подчёркивания ни в каком состоянии (глобальное a:hover его добавляет) */
.sidebar a, .sidebar a:hover, .mobile-nav a:hover, .mnav-sheet a:hover { text-decoration: none; }
.sidebar-logo { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 4px; border: 0; margin: 0; }
.sidebar-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; min-width: 0; }
.sidebar-logo-text { font-weight: 700; font-size: 19px; letter-spacing: -0.02em; color: var(--text); white-space: nowrap; }
.sidebar-logo-text span { color: var(--accent); }
.sidebar-toggle { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex-shrink: 0;
  border: 1px solid var(--border-soft); border-radius: 10px; background: var(--surface); color: var(--text-muted); cursor: pointer; }
.sidebar-toggle:hover { background: var(--bg); color: var(--text); }
.sidebar-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sidebar-nav { display: flex; flex-direction: column; gap: 4px; flex: 0 1 auto; min-height: 0; overflow-x: hidden; overflow-y: auto;
  margin: 0 -16px -12px; padding: 0 16px 12px; scrollbar-width: thin; }
.nav-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; color: #4A4F5E;
  text-decoration: none; font-size: 15px; font-weight: 500; transition: background .15s, color .15s; }
.nav-item svg { flex-shrink: 0; }
.nav-item:hover { background: var(--bg); color: var(--text); }
.nav-item.active { background: var(--accent); color: #fff; box-shadow: var(--shadow-accent); }
.nav-item.admin-link { margin-top: 12px; color: #B42318; }
.sidebar-bottom { margin-top: auto; display: flex; flex-direction: column; gap: 12px; }
/* Баланс — тихая строка над профилем: не спорит с меню за внимание */
.balance-row { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: var(--radius-sm);
  color: var(--text-muted); text-decoration: none; font-size: 13px; border: 1px solid var(--border-soft); background: var(--surface-muted); }
.balance-row:hover { background: var(--bg); color: var(--text); }
.balance-row:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.balance-row .icon { flex-shrink: 0; color: var(--text-faint); }
.balance-value { flex: 1; min-width: 0; font-weight: 600; color: var(--text-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.balance-value small { font-size: 13px; font-weight: 400; color: var(--text-muted); }
.balance-topup { flex-shrink: 0; font-weight: 600; color: var(--accent); }
.profile-row { display: flex; align-items: center; gap: 2px; }
.profile-link { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; min-height: 56px; padding: 8px 4px 8px 8px;
  border-radius: var(--radius-sm); color: var(--text); text-decoration: none; transition: background .15s; }
.profile-link:hover { background: var(--bg); }
.profile-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.avatar { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 50%;
  background: var(--accent-soft); color: var(--accent-strong); font-size: 13px; font-weight: 700; line-height: 1; }
.profile-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.profile-name, .profile-sub { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.profile-name { font-size: 14px; font-weight: 600; line-height: 18px; }
.profile-sub { font-size: 12px; line-height: 16px; color: var(--text-muted); }
.logout-btn { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex-shrink: 0; align-self: center;
  border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--text-muted); cursor: pointer; transition: background .15s, color .15s; }
.logout-btn:hover { background: var(--bg); color: var(--text); }
.logout-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.main { flex: 1; min-width: 0; margin-left: 280px; padding: 32px 40px; max-width: 1400px; transition: margin-left .2s ease; }

@media (min-width: 769px) {
  .sidebar-collapsed .sidebar { width: 76px; padding-left: 12px; padding-right: 12px; }
  .sidebar-collapsed .main { margin-left: 108px; }
  .sidebar-collapsed .sidebar-logo { flex-direction: column; gap: 12px; }
  .sidebar-collapsed .sidebar-logo-text, .sidebar-collapsed .nav-label, .sidebar-collapsed .profile-text,
  .sidebar-collapsed .balance-row .balance-value, .sidebar-collapsed .balance-row .balance-topup { display: none; }
  .sidebar-collapsed .balance-row { justify-content: center; padding: 10px 0; }
  .sidebar-collapsed .nav-item { justify-content: center; padding: 12px 0; }
  .sidebar-collapsed .profile-row { flex-direction: column; }
  .sidebar-collapsed .sidebar-nav { margin-left: -12px; margin-right: -12px; padding-left: 12px; padding-right: 12px; }
  .sidebar-collapsed .profile-link { flex: none; justify-content: center; min-height: 0; padding: 6px; }
}
@media (prefers-reduced-motion: reduce) { .sidebar, .main, .profile-link, .logout-btn { transition: none; } }

/* Email verification banner */
.email-verify-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fef3c7;
    border: 1px solid #fcd34d;
    color: #92400e;
    padding: 10px 16px;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 14px;
}

.email-verify-banner button {
    background: #f59e0b;
    color: #fff;
    border: none;
    padding: 6px 14px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    white-space: nowrap;
    font-weight: 500;
}

.email-verify-banner button:hover {
    background: #d97706;
}

.email-verify-banner button:disabled {
    opacity: 0.7;
    cursor: default;
}

.email-verify-banner .dismiss-btn {
    background: transparent;
    color: #92400e;
    font-size: 18px;
    padding: 2px 8px;
    margin-left: auto;
    line-height: 1;
}

.email-verify-banner .dismiss-btn:hover {
    background: rgba(0, 0, 0, 0.05);
}

/* Узкий экран (F19): текст на всю ширину, кнопка — строкой ниже, крестик — в углу */
@media (max-width: 640px) {
    .email-verify-banner { flex-wrap: wrap; align-items: flex-start; position: relative; padding-right: 44px; }
    .email-verify-banner .email-verify-text { flex: 1 1 100%; min-width: 0; }
    .email-verify-banner #resend-btn { white-space: normal; text-align: left; }
    .email-verify-banner .dismiss-btn { position: absolute; top: 6px; right: 6px; margin-left: 0; }
}

/* Page Header */
.page-header {
    margin-bottom: 32px;
}

.page-header h1 {
    font-size: 28px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 4px;
}

.page-header p {
    color: #6b7280;
    font-size: 15px;
}

/* Stats Cards */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.stat-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px 24px;
}

.stat-card .label {
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 8px;
}

.stat-card .value {
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
}

.stat-card .value.hot {
    color: #ef4444;
}

.stat-card .value.warm {
    color: #f59e0b;
}

.stat-card .value.cold {
    color: #3b82f6;
}

/* Cards */
.card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
    margin-bottom: 24px;
}

.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.card-title {
    font-size: 16px;
    font-weight: 600;
    color: #1a1a1a;
}

/* Forms */
.form-row {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
}

.form-group {
    flex: 1;
}

.form-group.small {
    flex: 0 0 140px;
}

.form-group label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 8px;
}

.form-group input,
.form-group select {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    color: #1a1a1a;
    background: #fff;
    transition: border-color 0.15s;
}

.form-group input:focus,
.form-group select:focus {
    outline: none;
    border-color: #1a1a1a;
}

.form-group input::placeholder {
    color: #9ca3af;
}

.checkbox-group {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
}

.checkbox-group input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #1a1a1a;
}

.checkbox-group label {
    font-size: 14px;
    color: #374151;
    cursor: pointer;
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 24px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.15s;
    text-decoration: none;
}

.btn-primary {
    background: #1a1a1a;
    color: #fff;
    width: 100%;
}

.btn-primary:hover {
    background: #333;
}

.btn-secondary {
    background: #fff;
    color: #374151;
    border-color: #e5e7eb;
}

.btn-secondary:hover {
    background: #f9fafb;
    border-color: #d1d5db;
}

.btn-danger {
    background: #fff;
    color: #ef4444;
    border-color: #fecaca;
}

.btn-danger:hover {
    background: #fef2f2;
}

.btn-sm {
    padding: 8px 16px;
    font-size: 13px;
}

.search-type-btn {
    padding: 8px 16px;
    font-size: 14px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    color: #374151;
    cursor: pointer;
}
.search-type-btn:hover {
    background: #f9fafb;
    border-color: #d1d5db;
}
.search-type-btn.active {
    background: #2563eb;
    border-color: #2563eb;
    color: #fff;
}

/* Tables */
.table-container {
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th {
    text-align: left;
    padding: 12px 16px;
    font-size: 11px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
}

td {
    padding: 16px;
    font-size: 14px;
    color: #1a1a1a;
    border-bottom: 1px solid #e5e7eb;
    vertical-align: top;
}

tr:last-child td {
    border-bottom: none;
}

tr:hover {
    background: #f9fafb;
}

/* Status badges */
.badge {
    display: inline-block;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 4px;
}

.badge-hot {
    background: #fef2f2;
    color: #dc2626;
}

.badge-warm {
    background: #fffbeb;
    color: #d97706;
}

.badge-cold {
    background: #eff6ff;
    color: #2563eb;
}

.badge-advertiser {
    background: #f0fdf4;
    color: #15803d;
    font-size: 11px;
    margin-left: 6px;
}

/* Links */
a {
    color: #2563eb;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* Company info in table */
.company-name {
    font-weight: 500;
    hyphens: auto;
    -webkit-hyphens: auto;
    overflow-wrap: break-word;
    color: #1a1a1a;
    margin-bottom: 2px;
}

.company-address {
    font-size: 13px;
    color: #6b7280;
}

/* Rating display */
.rating {
    display: flex;
    align-items: baseline;
    gap: 4px;
}

.rating-score {
    font-weight: 500;
}

.rating-count {
    font-size: 13px;
    color: #6b7280;
}

/* Problems list */
.problems {
    font-size: 13px;
    color: #6b7280;
    max-width: 240px;
    white-space: normal;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* Site */
.site-col {
    max-width: 105px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Phone */
.phone {
    font-size: 13px;
    white-space: nowrap;
}


/* Socials */
.socials {
    font-size: 13px;
}

td.socials {
    padding: 8px 4px;
}

.social-link {
    display: inline-block;
    padding: 2px 8px;
    background: #f3f4f6;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    color: #4b5563;
    text-decoration: none;
    margin: 2px;
}

.social-link:hover {
    background: #e5e7eb;
    text-decoration: none;
}

/* Actions */
.actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* How it works section */
.how-it-works {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 16px;
}

.step {
    padding: 20px;
    background: #f9fafb;
    border-radius: 8px;
}

.step-number {
    font-size: 12px;
    color: #6b7280;
    margin-bottom: 8px;
}

.step-title {
    font-weight: 500;
    color: #1a1a1a;
    margin-bottom: 4px;
}

.step-desc {
    font-size: 14px;
    color: #6b7280;
}

/* Progress bar */
.progress-bar {
    display: flex;
    height: 24px;
    border-radius: 6px;
    overflow: hidden;
    background: #e5e7eb;
}

.progress-segment {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
}

.progress-hot {
    background: #ef4444;
}

.progress-warm {
    background: #f59e0b;
}

.progress-cold {
    background: #3b82f6;
}

/* Distribution legend */
.distribution-legend {
    margin-top: 16px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 14px;
}

.legend-color {
    width: 16px;
    height: 16px;
    border-radius: 4px;
}

.legend-hot { background: #ef4444; }
.legend-warm { background: #f59e0b; }
.legend-cold { background: #3b82f6; }

/* Empty state */
.empty-state {
    text-align: center;
    padding: 60px 20px;
    color: #6b7280;
}

.empty-state h3 {
    font-size: 16px;
    color: #374151;
    margin-bottom: 8px;
}

/* Loading */
.loading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    color: #6b7280;
}

.spinner {
    width: 24px;
    height: 24px;
    border: 3px solid #e5e7eb;
    border-top-color: #1a1a1a;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
    margin-right: 12px;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Responsive */
@media (max-width: 1200px) {
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .how-it-works {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .sidebar {
        display: none;
    }

    .main {
        margin-left: 0;
        padding: 20px 16px;
    }

    .stats-grid {
        grid-template-columns: 1fr;
    }

    .form-row {
        flex-direction: column;
    }

    .form-group.small {
        flex: 1;
    }
}

/* ============================================================
   TOAST NOTIFICATIONS
   ============================================================ */

.toast-container {
    position: fixed;
    top: 24px;
    right: 24px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: none;
}

.toast {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 14px 18px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
    max-width: 420px;
    min-width: 320px;
    pointer-events: auto;
    opacity: 0;
    transform: translateX(100%);
    transition: all 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.toast-visible {
    opacity: 1;
    transform: translateX(0);
}

.toast-hiding {
    opacity: 0;
    transform: translateX(100%);
}

.toast-icon {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    margin-top: 1px;
}

.toast-icon svg {
    width: 22px;
    height: 22px;
}

.toast-message {
    flex: 1;
    font-size: 14px;
    line-height: 1.5;
    color: #1a1a1a;
}

.toast-action {
    display: block;
    width: fit-content;
    margin-top: 6px;
    color: var(--accent);
    font-weight: 600;
    text-decoration: none;
}

button.toast-action { padding: 0; border: 0; background: none; font: inherit; font-weight: 600; cursor: pointer; }
.toast-action:hover { color: var(--accent-strong); text-decoration: underline; }
.toast-action:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

.toast-close {
    flex-shrink: 0;
    background: none;
    border: none;
    font-size: 20px;
    line-height: 1;
    color: #9ca3af;
    cursor: pointer;
    padding: 0 2px;
    margin-top: -2px;
}

.toast-close:hover {
    color: #374151;
}

.toast-success {
    border-left: 4px solid #22c55e;
}

.toast-success .toast-icon {
    color: #22c55e;
}

.toast-error {
    border-left: 4px solid #ef4444;
}

.toast-error .toast-icon {
    color: #ef4444;
}

.toast-warning {
    border-left: 4px solid #f59e0b;
}

.toast-warning .toast-icon {
    color: #f59e0b;
}

.toast-info {
    border-left: 4px solid #3b82f6;
}

.toast-info .toast-icon {
    color: #3b82f6;
}

/* ============================================================
   SEARCH PROGRESS OVERLAY
   ============================================================ */

.search-progress {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 40px;
    margin-bottom: 24px;
    text-align: center;
}

.search-progress-animation {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 28px;
}

.search-progress-ring {
    width: 80px;
    height: 80px;
    position: relative;
}

.search-progress-ring svg {
    width: 80px;
    height: 80px;
    transform: rotate(-90deg);
}

.search-progress-ring .ring-bg {
    fill: none;
    stroke: #e5e7eb;
    stroke-width: 4;
}

.search-progress-ring .ring-fill {
    fill: none;
    stroke: #6c5ce7;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 220;
    stroke-dashoffset: 220;
    transition: stroke-dashoffset 1s ease;
}

.search-progress-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 28px;
    animation: pulse-icon 2s ease-in-out infinite;
}

@keyframes pulse-icon {
    0%, 100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
    50% { transform: translate(-50%, -50%) scale(1.15); opacity: 0.8; }
}

.search-progress-title {
    font-size: 20px;
    font-weight: 600;
    color: #1a1a1a;
    margin-bottom: 8px;
}

.search-progress-subtitle {
    font-size: 14px;
    color: #6b7280;
    margin-bottom: 24px;
}

.search-progress-steps {
    display: flex;
    justify-content: center;
    gap: 32px;
    margin-bottom: 28px;
}

.progress-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    opacity: 0.35;
    transition: all 0.5s ease;
}

.progress-step.active {
    opacity: 1;
}

.progress-step.done {
    opacity: 0.7;
}

.progress-step-dot {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    transition: all 0.5s ease;
}

.progress-step.active .progress-step-dot {
    background: #6c5ce7;
    box-shadow: 0 0 0 6px rgba(108, 92, 231, 0.15);
}

.progress-step.done .progress-step-dot {
    background: #22c55e;
}

.progress-step-label {
    font-size: 12px;
    font-weight: 500;
    color: #6b7280;
}

.progress-step.active .progress-step-label {
    color: #6c5ce7;
    font-weight: 600;
}

.search-progress-timer {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #f3f4f6;
    padding: 10px 20px;
    border-radius: 24px;
    font-size: 14px;
    color: #4b5563;
}

.search-progress-timer .timer-icon {
    font-size: 16px;
}

.timer-elapsed {
    font-weight: 600;
    color: #1a1a1a;
    font-variant-numeric: tabular-nums;
}

.timer-estimate {
    color: #9ca3af;
}

@media (max-width: 768px) {
    .search-progress-steps {
        gap: 16px;
    }

    .search-progress {
        padding: 28px 20px;
    }
}

/* Общий приглушённый текст (поиск, результаты) */
.muted { color: var(--text-muted); font-size: 13px; }

/* ЛПР (лицо, принимающее решение) */
.lpr-card { display: flex; gap: 8px; align-items: flex-start; min-width: 190px; }
.lpr-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.lpr-initials { display: inline-flex; align-items: center; justify-content: center; background: #E5E7EB; color: #374151; font-size: 13px; font-weight: 600; }
.lpr-name { font-weight: 600; }
.lpr-role, .lpr-more, .lpr-disclaimer { color: #6B7280; font-size: 12px; }
.lpr-links a { font-size: 12px; }
.lpr-pending { display: inline-flex; align-items: center; gap: 6px; color: inherit; font-size: 12px; }
.lpr-spinner { width: 12px; height: 12px; border: 2px solid #D1D5DB; border-top-color: #2563eb; border-radius: 50%; animation: lpr-spin 0.8s linear infinite; flex-shrink: 0; }
@keyframes lpr-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .lpr-spinner { animation: none; } }
.lpr-verified { display: inline-flex; align-items: center; gap: 3px; margin: 2px 0; padding: 1px 7px; font-size: 11px; font-weight: 600; line-height: 1.5; color: #15803d; background: #dcfce7; border-radius: 999px; white-space: nowrap; }
.lpr-verified svg { flex-shrink: 0; }
.lpr-verified .icon { width: 11px; height: 11px; stroke-width: 3; }
/* Пробный тариф: карточка-заглушка ЛПР — условные фигуры под размытием, реальных данных нет */
.lpr-card-locked { cursor: default; }
.lpr-locked-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.lpr-blur { display: block; background: var(--text-faint); opacity: .45; filter: blur(2.5px); user-select: none; pointer-events: none; }
.lpr-blur-avatar { background: linear-gradient(135deg, var(--accent), var(--text-faint)); opacity: .35; }
.lpr-blur-line { width: 112px; height: 10px; margin: 3px 0; border-radius: 999px; }
.lpr-blur-short { width: 72px; opacity: .3; }
.lpr-trial-banner { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 16px; padding: 12px 16px;
  background: var(--accent-soft); color: var(--text); border-radius: var(--radius-sm); font-size: 14px; line-height: 1.4; }
.lpr-trial-banner[hidden] { display: none; }
.results-actions [hidden] { display: none; }
.lpr-trial-banner > .icon { color: var(--accent); }
.lpr-trial-text { flex: 1 1 240px; min-width: 0; }
.lpr-trial-cta { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--radius-sm);
  background: var(--accent); color: #fff; font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.lpr-trial-cta:hover { background: var(--accent-strong); }
.lpr-trial-cta:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Оценка: цветная пилюля с баллами */
.score-pill { display: inline-block; min-width: 34px; padding: 3px 10px; text-align: center; font-size: 13px; font-weight: 700; border-radius: 999px; }
.score-hot { background: #dc2626; color: #fff; }
.score-warm { background: #fbbf24; color: #1f2937; }
.score-cold { background: #3b82f6; color: #fff; }

/* Проблемы: ограниченная высота + «ещё» */
.problems-text { max-height: 90px; overflow: hidden; position: relative; }
.problems-text.clamped { -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent); }
.problems-text.expanded { max-height: none; }

/* Info-tip */
.checkbox-label { cursor: pointer; line-height: 1.4; }
.checkbox-label input[type="checkbox"] { margin: 0 8px 0 0; vertical-align: -1px; }
.btn-emoji { margin-right: 8px; }
.checkbox-label .nobr { white-space: nowrap; display: inline-flex; align-items: center; }
.info-tip { position: relative; display: inline-flex; margin-left: 6px; }
.info-tip-btn { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; padding: 0; border: 1px solid #9CA3AF; border-radius: 50%; background: transparent; color: #6B7280; font: italic 700 11px/14px Georgia, serif; text-align: center; cursor: help; }
.info-tip-btn:hover, .info-tip.open .info-tip-btn, .info-tip-btn:focus-visible { color: #2563eb; border-color: #2563eb; }
.info-tip-body { display: none; position: absolute; z-index: 50; top: calc(100% + 8px); left: -8px; width: max-content; max-width: min(320px, calc(100vw - 48px)); padding: 10px 12px; background: #1f2937; color: #f9fafb; font-size: 13px; line-height: 1.45; border-radius: 8px; box-shadow: 0 6px 20px rgba(0,0,0,.2); text-align: left; font-weight: 400; white-space: normal; }
.info-tip-line { display: block; }
.info-tip-line + .info-tip-line { margin-top: 6px; }
.info-tip-body .info-tip-muted { color: #9CA3AF; font-size: 12px; }
.info-tip:hover .info-tip-body, .info-tip:focus-within .info-tip-body, .info-tip.open .info-tip-body { display: block; }
.info-tip.dismissed .info-tip-body { display: none; }
@media (max-width: 480px) {
    /* общий мобильный .form-row — колонкой по центру; здесь галочка и «i» в одну строку слева */
    #includeNoWebsiteRow, #findLprRow { position: relative; flex-direction: row !important; justify-content: flex-start !important; align-items: center !important; }
    .info-tip { position: static; }
    .info-tip-body { left: 0; right: 0; width: auto; max-width: none; }
}

/* Таблица лидов: чуть плотнее, чтобы колонка ЛПР помещалась без прокрутки */
.leads-table th, .leads-table td { padding-left: 12px; padding-right: 12px; }

/* Несколько адресов почты: первый виден, остальные под «ещё N» */
.email-col .email-link { display: block; }
.email-rest .email-link { margin-top: 4px; }

/* === Search screen (spec §5) === */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.search-header { display: flex; flex-direction: column; gap: 6px; margin-bottom: 20px; }
.search-header h1 { margin: 0; font-size: 34px; font-weight: 700; line-height: 1.15; letter-spacing: -0.03em; color: var(--text); }
.search-header p { margin: 0; font-size: 16px; color: var(--text-muted); }

.search-card { border: 0; border-radius: var(--radius-lg); padding: 24px; margin-bottom: 20px; }
.search-form { display: flex; flex-direction: column; gap: 18px; }

/* Режимы: сегментированный контрол */
.mode-switch { display: inline-flex; align-self: flex-start; flex-wrap: wrap; gap: 2px; padding: 4px; border-radius: 14px; background: var(--bg); }
.mode-switch .search-type-btn { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border: 0; border-radius: 10px;
  background: transparent; color: var(--text-muted); font: 500 14px/1 var(--font); cursor: pointer; transition: background .15s, color .15s, box-shadow .15s; }
.mode-switch .search-type-btn:hover { background: transparent; color: var(--text); }
.mode-switch .search-type-btn.active { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(21,22,28,.08); }
.mode-switch .search-type-btn.active .icon { color: var(--accent); }
.mode-switch .search-type-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }

/* Умное поле */
.smart-field-wrap { position: relative; }
.smart-field { display: flex; align-items: center; gap: 12px; height: 64px; padding: 0 8px 0 20px; border: 1.5px solid var(--border);
  border-radius: var(--radius-md); background: var(--surface-muted); transition: border-color .15s, box-shadow .15s, background .15s; }
.smart-field:focus-within { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: var(--surface); }
.smart-icon { width: 22px; height: 22px; color: var(--accent); }
.smart-input { position: relative; flex: 1; min-width: 0; height: 100%; display: flex; align-items: center; }
.smart-input input { width: 100%; height: 100%; padding: 0; border: 0; outline: none; background: transparent; font: 400 17px/1.3 var(--font); color: var(--text); }
.smart-input input::placeholder { color: var(--text-faint); }
.smart-placeholder { position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); display: flex; align-items: center; pointer-events: none;
  font-size: 17px; line-height: 1.3; color: var(--text-faint); white-space: nowrap; overflow: hidden; }
.smart-placeholder[hidden] { display: none; }
.smart-placeholder b { color: var(--text); font-weight: 500; }
@keyframes smart-caret { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
.smart-caret { display: inline-block; flex-shrink: 0; width: 2px; height: 1.1em; margin-left: 2px; background: var(--accent); animation: smart-caret 1s steps(1) infinite; }
@media (prefers-reduced-motion: reduce) { .smart-caret { animation: none; } }

.city-chip { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; max-width: 220px; height: 40px; padding: 0 14px; border: 0; border-radius: 12px;
  background: var(--accent-soft); color: #3730A3; font: 600 15px/1 var(--font); cursor: pointer; transition: background .15s; }
.city-chip:hover { background: #E3E6FF; }
.city-chip.is-flash { box-shadow: 0 0 0 3px var(--accent-soft); transition: box-shadow .2s; }
.city-chip:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.city-chip[hidden] { display: none; }
.city-chip #cityName { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.city-chip .city-chevron { width: 14px; height: 14px; transition: transform .15s; }
.city-chip[aria-expanded="true"] .city-chevron { transform: rotate(180deg); }

.btn-find { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex-shrink: 0; height: 48px; padding: 0 24px; border: 0; border-radius: 14px;
  background: var(--accent); color: #fff; font: 600 16px/1 var(--font); cursor: pointer; box-shadow: var(--shadow-accent); transition: background .15s, transform .15s; }
.btn-find .icon { width: 18px; height: 18px; }
.btn-find:hover { background: var(--accent-strong); }
.btn-find:active { transform: translateY(1px); }
.btn-find:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.btn-find:disabled { opacity: .7; cursor: default; }

/* Подсказки и выбор города */
.suggest-pop { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 30; max-height: 360px; overflow-y: auto; padding: 8px;
  background: var(--surface); border: 1px solid var(--border-soft); border-radius: 18px; box-shadow: var(--shadow-pop); }
.suggest-pop[hidden] { display: none; }
.suggest-title { padding: 8px 12px 6px; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.suggest-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; padding: 10px 12px; border: 0; border-radius: 12px;
  background: transparent; color: var(--text); font: 400 15px/1.35 var(--font); text-align: left; cursor: pointer; }
.suggest-item:hover, .suggest-item.is-active, .suggest-item:focus-visible { background: var(--bg); outline: none; }
.suggest-name { min-width: 0; }
.suggest-count { flex-shrink: 0; font-size: 13px; color: var(--accent-strong); }
.suggest-region { flex-shrink: 0; max-width: 55%; font-size: 13px; color: var(--text-muted); text-align: right; }
.suggest-empty { padding: 10px 12px; font-size: 14px; color: var(--text-muted); }
.city-pop { left: auto; right: 0; width: 340px; }
.city-pop input { width: 100%; height: 40px; margin-bottom: 4px; padding: 0 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-muted);
  font: 400 15px/1 var(--font); color: var(--text); outline: none; }
.city-pop input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); background: var(--surface); }

.search-type-hint { font-size: 14px; color: var(--text-muted); margin-top: -8px; }
.search-type-hint:empty { display: none; }
.profession-chips { flex-wrap: wrap; align-items: center; gap: 6px; margin-top: -8px; }
.profession-chips-label { font-size: 14px; color: var(--text-muted); margin-right: 4px; }
.search-form #cityRow { margin-bottom: 0; }

/* Переключатели и количество */
.search-options { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 28px; color: var(--text-2); }
.switch-row { align-items: center; }
.switch-label { position: relative; display: inline-flex; align-items: center; gap: 10px; padding: 6px 0; font-size: 14px; line-height: 1.4; cursor: pointer; user-select: none; }
.switch-input { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; opacity: 0; overflow: hidden; clip: rect(0 0 0 0); }
.switch { position: relative; flex-shrink: 0; width: 36px; height: 20px; margin-right: 0; border-radius: 999px; background: #D7D8E3; transition: background .2s; }
.switch::after { content: ''; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .2s; }
.switch-input:checked + .switch { background: var(--accent); }
.switch-input:checked + .switch::after { transform: translateX(16px); }
.switch-input:focus-visible + .switch { box-shadow: 0 0 0 4px var(--accent-soft), 0 0 0 1px var(--accent); }
.switch-label:hover .switch-input:not(:checked) + .switch { background: #C9CAD8; }
@media (prefers-reduced-motion: reduce) { .switch, .switch::after { transition: none; } }
.switch-label .nobr { white-space: nowrap; display: inline-flex; align-items: center; }
.switch-label .info-tip { margin-left: 8px; }
.switch-label .info-tip-btn { width: 18px; height: 18px; border: 0; border-radius: 50%; color: var(--text-faint); }
.switch-label .info-tip-btn .icon { width: 15px; height: 15px; }
.switch-label .info-tip-btn:hover, .switch-label .info-tip.open .info-tip-btn, .switch-label .info-tip-btn:focus-visible { color: var(--accent); }
.switch-label .info-tip-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.switch-label .info-tip-body { background: var(--dark); border-radius: 12px; padding: 12px 14px; cursor: default; }

.count-select { position: relative; display: inline-flex; align-items: center; margin-left: auto; color: var(--text-2); }
.count-select select { height: 38px; padding: 0 34px 0 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface);
  font: 400 14px/1 var(--font); color: inherit; cursor: pointer; appearance: none; -webkit-appearance: none; }
.count-select select:hover { border-color: #CFD0DE; }
.count-select select:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.count-select .icon { position: absolute; right: 12px; width: 14px; height: 14px; pointer-events: none; }

/* Готовые подборки */
.collections { display: flex; flex-direction: column; gap: 14px; margin-bottom: 24px; }
.collections[hidden] { display: none; }
.collections-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.collections-head h2 { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.collections-more { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; padding: 6px 12px; border: 1px solid var(--border-soft); border-radius: 999px;
  background: var(--surface); color: var(--accent); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; transition: border-color .15s, background .15s; }
.collections-more[hidden] { display: none; }
.collections-more:hover { border-color: var(--border); background: var(--accent-soft); }
.collections-more:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#collectionsTotal { font-size: 14px; color: var(--text-muted); }
.collections-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.collection-card { display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--border-soft); border-radius: 18px; background: var(--surface);
  color: var(--text); font-family: var(--font); text-align: left; cursor: pointer; transition: transform .15s, box-shadow .15s, border-color .15s; }
.collection-card:hover { transform: translateY(-1px); border-color: var(--border); box-shadow: 0 10px 24px rgba(21,22,28,.07); }
.collection-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.collection-card:hover .collection-arrow { color: var(--accent); transform: translateX(2px); }
.collection-icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: 14px; }
.collection-icon .icon { width: 22px; height: 22px; stroke-width: 1.8; }
.collection-text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.collection-title { font-size: 15px; font-weight: 600; line-height: 1.3; }
.collection-count { font-size: 13px; color: var(--text-muted); }
.collection-arrow { width: 18px; height: 18px; color: #9A9DB0; transition: color .15s, transform .15s; }
.tone-0 .collection-icon { background: #EEF0FF; color: #4338CA; }
.tone-1 .collection-icon { background: #FDEFF4; color: #B4235A; }
.tone-2 .collection-icon { background: #FFF3E6; color: var(--warning-fg); }
.tone-3 .collection-icon { background: var(--success-bg); color: var(--success-fg); }
.tone-4 .collection-icon { background: #EAF4FF; color: #1D5FBF; }
.tone-5 .collection-icon { background: #F3EEFF; color: #6D28D9; }
@media (prefers-reduced-motion: reduce) { .collection-card, .collection-arrow { transition: none; } .collection-card:hover { transform: none; } }

@media (max-width: 1024px) { .collections-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .search-header h1 { font-size: 28px; }
  .search-card { padding: 16px; }
  .mode-switch { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-self: stretch; }
  .mode-switch .search-type-btn { justify-content: center; height: auto; min-height: 40px; padding: 6px 6px; font-size: 13px; line-height: 1.2; text-align: center; }
  .mode-switch .search-type-btn .icon { display: none; }
  .smart-field { flex-wrap: wrap; height: auto; padding: 8px 8px 8px 16px; row-gap: 8px; }
  .smart-input { flex-basis: calc(100% - 40px); height: 48px; }
  .city-chip { flex: 1 1 auto; justify-content: center; min-width: 0; max-width: 100%; height: 48px; }
  .btn-find { flex: 1 1 auto; }
  .city-pop { left: 0; width: auto; }
  .search-options { gap: 4px 20px; }
  .count-select { margin-left: 0; }
  .collections-grid { grid-template-columns: 1fr; }
}
.btn-find .spinner { width: 16px; height: 16px; margin-right: 0; border-width: 2px; border-color: rgba(255,255,255,.35); border-top-color: #fff; }
.switch-text { display: inline; }
.search-form .form-group label { font-size: 14px; color: var(--text-muted); }
.search-form .form-group input { height: 48px; padding: 0 16px; border: 1.5px solid var(--border); border-radius: 14px; background: var(--surface-muted); font: 400 15px/1 var(--font); }
.search-form .form-group input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: var(--surface); }

/* Прогресс поиска: иконки спрайта вместо эмодзи */
.search-progress-icon .icon { width: 28px; height: 28px; color: #6c5ce7; }
.progress-step-dot .icon { color: #6b7280; }
.progress-step.active .progress-step-dot .icon, .progress-step.done .progress-step-dot .icon { color: #fff; }
.search-progress-timer .timer-icon { display: inline-flex; }
.search-error-icon { margin-bottom: 16px; color: #dc2626; }
.search-error-icon .icon { width: 48px; height: 48px; }
.search-pending { border-color: var(--accent-soft); }
.search-pending-icon { margin-bottom: 16px; color: var(--accent); }
.search-pending-icon .icon { width: 48px; height: 48px; }
.search-pending-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 16px; }
.search-pending-actions .btn { width: auto; min-width: 180px; }

/* Телефон ЛПР скрыт до клика (spec §6) */
.lpr-phone { display: flex; align-items: center; gap: 4px; }
.lpr-phone .icon { color: var(--text-faint); }
.lpr-phone-btn { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; text-align: left; }
.lpr-phone-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 2px; }
.lpr-phone-btn.is-masked .phone-tail { filter: blur(2px); -webkit-mask-image: linear-gradient(90deg, #000 0%, transparent 85%); mask-image: linear-gradient(90deg, #000 0%, transparent 85%); user-select: none; }
.lpr-phone-link { color: inherit; }
.lpr-copy-btn { display: inline-flex; align-items: center; gap: 3px; margin-left: 4px; padding: 0 4px; border: 0; background: none; font: inherit; font-size: 12px; color: var(--accent); cursor: pointer; border-radius: 4px; }
.lpr-copy-btn:hover { background: var(--accent-soft); }
.lpr-copy-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Ссылка «Как это работает →» под полем поиска (spec §7) */
.search-help-link { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; font-weight: 500; color: var(--text-muted); text-decoration: none; transition: color .15s; }
.search-help-link .icon { width: 14px; height: 14px; transition: transform .15s; }
.search-help-link:hover { color: var(--accent); }
.search-help-link:hover .icon { transform: translateX(2px); }
.search-help-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

/* === База знаний (spec §7) === */
.help-header { display: flex; flex-direction: column; gap: 6px; margin-bottom: 24px; }
.help-header h1 { margin: 0; font-size: 34px; font-weight: 700; line-height: 1.15; letter-spacing: -0.03em; color: var(--text); }
.help-header p { margin: 0; font-size: 16px; color: var(--text-muted); }
/* Одна колонка для чтения; разделы — горизонтальный ряд чипов над текстом, прилипает к верху при прокрутке */
.help-header, .help-layout { max-width: 820px; margin-left: auto; margin-right: auto; }
.help-layout { --help-toc-h: 64px; }
.help-toc { position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; padding: 12px 0;
  background: var(--bg); transition: box-shadow .15s; }
.help-toc.is-stuck { box-shadow: 0 1px 0 var(--border); }
.help-toc-title { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.help-toc a { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; padding: 7px 14px 7px 12px; border: 1px solid var(--border-soft); border-radius: 999px;
  background: var(--surface); color: #4A4F5E; font-size: 14px; font-weight: 500; line-height: 20px; white-space: nowrap; text-decoration: none;
  transition: background .15s, color .15s, border-color .15s; }
.help-toc a .icon { color: var(--text-faint); transition: color .15s; }
.help-toc a:hover { border-color: var(--border); color: var(--text); text-decoration: none; }
.help-toc a[aria-current="true"] { border-color: var(--accent-soft); background: var(--accent-soft); color: var(--accent-strong); }
.help-toc a[aria-current="true"] .icon, .help-toc a:hover .icon { color: var(--accent); }
.help-toc a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.help-content { display: flex; flex-direction: column; gap: 20px; min-width: 0; }

.help-card { padding: 28px; border-radius: var(--radius-lg); background: var(--surface); color: var(--text); scroll-margin-top: calc(var(--help-toc-h) + 12px); }
.help-card-head { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.help-card-head h2 { margin: 0; font-size: 22px; font-weight: 700; line-height: 1.25; letter-spacing: -0.02em; }
.help-card-icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: 14px; }
.help-card-icon .icon { width: 22px; height: 22px; stroke-width: 1.8; }
.help-card-icon.tone-0 { background: #EEF0FF; color: #4338CA; }
.help-card-icon.tone-1 { background: #FDEFF4; color: #B4235A; }
.help-card-icon.tone-2 { background: #FFF3E6; color: var(--warning-fg); }
.help-card-icon.tone-3 { background: var(--success-bg); color: var(--success-fg); }
.help-card-icon.tone-4 { background: #EAF4FF; color: #1D5FBF; }
.help-card-icon.tone-5 { background: #F3EEFF; color: #6D28D9; }
.help-card h3 { margin: 26px 0 12px; font-size: 16px; font-weight: 700; letter-spacing: -0.01em; }
.help-card p { margin: 0; }
.help-card a:not(.help-link) { color: var(--accent); text-decoration: underline; text-decoration-color: rgba(79,70,229,.35); text-underline-offset: 2px; }
.help-card a:not(.help-link):hover { text-decoration-color: currentColor; }
.help-lead { font-size: 16px; line-height: 1.6; color: var(--text-2); max-width: 720px; }
.help-lead + .help-list, .help-lead + .help-points, .help-lead + .help-tips { margin-top: 18px; }
.help-sub { margin-top: 14px !important; font-size: 14px; color: var(--text-muted); }

.help-steps { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 20px 0 0; padding: 0; }
.help-steps li { display: flex; flex-direction: column; gap: 6px; padding: 18px; border: 1px solid var(--border-soft); border-radius: var(--radius-md); background: var(--surface-muted); }
.help-step-num { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-bottom: 4px; border-radius: 9px; background: var(--accent); color: #fff; font-size: 14px; font-weight: 700; }
.help-step-title { font-size: 15px; font-weight: 600; }
.help-step-text { font-size: 14px; line-height: 1.5; color: var(--text-muted); }

.help-list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0 0 0 20px; font-size: 15px; line-height: 1.55; color: var(--text-2); }
.help-list li::marker { color: var(--text-faint); }
.help-list b { font-weight: 600; color: var(--text); }
.help-list-check { list-style: none; padding: 0; }
.help-list-check li { display: flex; gap: 10px; align-items: flex-start; }
.help-list-check li > .icon { margin-top: 3px; color: var(--accent); }

.help-note { display: flex; gap: 10px; align-items: flex-start; margin-top: 20px !important; padding: 14px 16px; border-radius: var(--radius-sm); background: var(--accent-soft); color: #312E81; font-size: 14px; line-height: 1.5; }
.help-note > .icon { margin-top: 2px; color: var(--accent); }

.help-tiers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
.help-tier { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 18px; border-radius: var(--radius-md); border: 1px solid var(--border-soft); }
.help-tier.tier-hot { background: #FEF4F4; border-color: #FBE1E1; }
.help-tier.tier-warm { background: #FFFAEB; border-color: #FBEFC8; }
.help-tier.tier-cold { background: #F1F6FF; border-color: #DCE8FD; }
.help-tier-name { font-size: 16px; font-weight: 700; }
.help-tier-text { font-size: 14px; color: var(--text-muted); }

.help-points { display: flex; flex-direction: column; margin: 0; border: 1px solid var(--border-soft); border-radius: var(--radius-md); overflow: hidden; }
.help-points > div { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 2px; padding: 12px 16px; }
.help-points > div + div { border-top: 1px solid var(--border-soft); }
.help-points dt { font-size: 15px; font-weight: 600; }
.help-points dd { margin: 0; font-size: 14px; line-height: 1.5; color: var(--text-muted); }

.help-prices { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.help-price { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border: 1px solid var(--border-soft); border-radius: var(--radius-md); }
.help-price-value { font-size: 24px; font-weight: 700; letter-spacing: -0.02em; color: var(--accent); }
.help-price-label { font-size: 14px; line-height: 1.45; color: var(--text-muted); }

.help-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
.help-plan { display: flex; flex-direction: column; gap: 4px; padding: 18px; border: 1px solid var(--border-soft); border-radius: var(--radius-md); background: var(--surface-muted); }
.help-plan-name { font-size: 14px; font-weight: 600; color: var(--text-muted); }
.help-plan-price { font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
.help-plan-price small { font-size: 14px; font-weight: 500; color: var(--text-muted); letter-spacing: 0; }
.help-plan-meta { font-size: 14px; color: var(--text-2); }
.help-plan-leads { font-size: 13px; color: var(--text-faint); }

.help-tips { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; counter-reset: tip; }
.help-tips li { position: relative; padding: 16px 18px 16px 52px; border: 1px solid var(--border-soft); border-radius: var(--radius-md); font-size: 14px; line-height: 1.55; color: var(--text-muted); counter-increment: tip; }
.help-tips li::before { content: counter(tip); position: absolute; left: 16px; top: 15px; display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 8px; background: var(--accent-soft); color: var(--accent-strong); font-size: 13px; font-weight: 700; }
.help-tips b { display: block; margin-bottom: 2px; font-size: 15px; font-weight: 600; color: var(--text); }

.help-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 20px; padding: 10px 16px; border-radius: 12px; background: var(--accent-soft); color: var(--accent-strong); font-size: 14px; font-weight: 600; text-decoration: none; transition: background .15s; }
.help-link:hover { background: #E3E6FF; }
.help-link:hover .icon { transform: translateX(2px); }
.help-link .icon { transition: transform .15s; }
.help-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
html:has(.help-layout) { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { .help-link .icon, .search-help-link .icon, .help-toc, .help-toc a, .help-toc a .icon { transition: none; } html:has(.help-layout) { scroll-behavior: auto; } }

@media (max-width: 768px) {
  .help-toc { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; margin: 0 -16px 8px; padding: 10px 16px;
    scroll-snap-type: x proximity; scroll-padding-inline: 16px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .help-toc::-webkit-scrollbar { display: none; }
  .help-toc a { scroll-snap-align: start; min-height: 40px; }
}
@media (max-width: 640px) {
  .help-header h1 { font-size: 28px; }
  .help-card { padding: 20px 16px; }
  .help-card-head h2 { font-size: 19px; }
  .help-steps, .help-tiers, .help-prices, .help-plans, .help-tips { grid-template-columns: minmax(0, 1fr); }
  .help-points > div { padding: 12px 14px; }
}

/* === Результаты поиска (spec B2) === */
.results-page { min-width: 0; }
.results-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.results-heading { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.results-kicker { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; color: var(--text-muted); }
.results-kicker .icon { color: var(--accent); }
.results-repeats { margin: 0; font-size: 14px; color: var(--text-muted); }
.results-header h1 { margin: 0; font-size: 34px; font-weight: 700; line-height: 1.15; letter-spacing: -0.03em; color: var(--text); overflow-wrap: anywhere; }
.results-new { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 18px; border-radius: 14px; background: var(--accent); color: #fff;
  font-size: 15px; font-weight: 600; text-decoration: none; box-shadow: var(--shadow-accent); transition: background .15s; white-space: nowrap; }
.results-new:hover { background: var(--accent-strong); text-decoration: none; }
.results-new:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.results-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 20px; }
.result-stat { display: flex; align-items: center; gap: 14px; padding: 18px 20px; border-radius: var(--radius-lg); background: var(--surface); min-width: 0; }
.result-stat-icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: 14px; }
.result-stat-icon .icon { width: 22px; height: 22px; stroke-width: 1.8; }
.result-stat-icon.tone-total { background: var(--accent-soft); color: var(--accent-strong); }
.result-stat-icon.tone-hot { background: var(--danger-bg); color: var(--danger-fg); }
.result-stat-icon.tone-warm { background: var(--warning-bg); color: var(--warning-fg); }
.result-stat-icon.tone-cold { background: #EAF2FF; color: #1D5FBF; }
.result-stat-text { min-width: 0; }
.result-stat .label { font-size: 14px; color: var(--text-muted); }
.result-stat .value { font-size: 28px; font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; color: var(--text); font-variant-numeric: tabular-nums; }

.results-card { border: 0; border-radius: var(--radius-lg); padding: 20px; margin-bottom: 20px; min-width: 0; }
.results-card-header { gap: 12px 20px; flex-wrap: wrap; margin-bottom: 16px; }
.results-card-header .card-title { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.results-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 20px; }
.results-lpr-filter { color: var(--text-2); }
.results-lpr-filter[hidden] { display: none; }
.results-lpr-filter.is-disabled { cursor: default; }
.results-lpr-filter.is-disabled .switch { opacity: .5; }
.results-lpr-hint { font-size: 13px; color: var(--text-muted); }
.results-lpr-hint[hidden] { display: none; }
.btn-soft { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 0; border-radius: 12px; background: var(--accent-soft);
  color: var(--accent-strong); font: 600 14px/1 var(--font); cursor: pointer; transition: background .15s; }
.btn-soft:hover { background: #E3E6FF; }
.btn-soft:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Таблица: на узком экране прокручивается внутри карточки, страница — нет */
.results-table-wrap { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--border-soft); border-radius: var(--radius-md); }
.results-card .leads-table th { padding-top: 12px; padding-bottom: 12px; background: var(--surface-muted); color: var(--text-faint); font-size: 11px;
  letter-spacing: .03em; border-bottom: 1px solid var(--border-soft); white-space: nowrap; }
.results-card .leads-table td { padding-top: 14px; padding-bottom: 14px; color: var(--text); border-bottom: 1px solid var(--border-soft); }
.results-card .leads-table th, .results-card .leads-table td { padding-left: 8px; padding-right: 8px; }
.results-card .leads-table th:first-child, .results-card .leads-table td:first-child { padding-left: 14px; }
.results-card .leads-table th:last-child, .results-card .leads-table td:last-child { padding-right: 14px; }
.results-card .leads-table tbody tr:last-child td { border-bottom: 0; }
.results-card .leads-table tbody tr:hover { background: var(--surface-muted); }
.results-card .leads-table a { color: var(--accent); }
.results-card .company-name { font-weight: 600; color: var(--text); min-width: 112px; -webkit-hyphens: manual; hyphens: manual; }
.results-card .company-address { color: var(--text-muted); }
.results-card .rating { display: grid; grid-template-columns: auto auto; align-items: center; justify-content: start; column-gap: 4px; white-space: nowrap; }
.results-card .rating-star { width: 14px; height: 14px; color: #E5A100; fill: #F5B400; stroke: #E5A100; }
.results-card .rating-count { grid-column: 1 / -1; font-size: 12px; color: var(--text-faint); }
.results-card .badge-advertiser { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; background: var(--success-bg); color: var(--success-fg); vertical-align: 1px; }
.results-card .badge-advertiser .icon { width: 12px; height: 12px; }
.phone-note, .muted-note { color: var(--text-muted); font-size: 12px; }
.muted-note { font-size: 13px; }
.results-state { text-align: center; color: var(--text-muted); }
.results-card td.empty-state { padding: 48px 20px; text-align: center; color: var(--text-muted); }
.results-loading { display: inline-flex; align-items: center; padding: 28px 0; }
.results-loading .spinner { border-color: var(--border); border-top-color: var(--accent); }

/* Соцсети — иконки спрайта */
.social-icons { display: grid; grid-template-columns: repeat(2, 28px); gap: 6px; width: max-content; }
.social-icon-link { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; background: var(--bg);
  color: var(--text-muted); text-decoration: none; transition: background .15s, color .15s; }
.social-icon-link .icon { width: 15px; height: 15px; }
.social-icon-link:hover { background: var(--accent-soft); color: var(--accent-strong); text-decoration: none; }
.social-icon-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.results-card td.socials { padding-left: 8px; padding-right: 8px; }
.results-card .site-col { max-width: 100px; }

/* Проблемы: список с цветной точкой вместо эмодзи */
.results-card .problems { color: var(--text-2); min-width: 130px; max-width: 220px; }
.problem-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.problem { display: flex; align-items: baseline; gap: 8px; line-height: 1.4; }
.problem-dot { position: relative; top: -1px; width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: var(--text-faint); }
.problem-high .problem-dot { background: #DC2626; }
.problem-mid .problem-dot { background: #E59500; }
.problems-toggle, .email-more { display: inline-block; margin-top: 4px; font-size: 12px; color: var(--text-muted); text-decoration: none; }
.problems-toggle { margin-top: 2px; }
.problems-toggle:hover, .email-more:hover { color: var(--accent); text-decoration: underline; }

/* Почта и вакансии */
td.email-col { min-width: 108px; max-width: 220px; font-size: 13px; vertical-align: top; word-break: break-word; white-space: normal; }
td.email-col a.email-link { word-break: break-word; white-space: normal; vertical-align: bottom; }
.salary-cell { font-size: 1.05rem; font-weight: 700; white-space: nowrap; }
th.vacancy-col, td.vacancy-col { text-align: left; }
td.skills-col { max-width: 180px; font-size: 0.85rem; color: var(--text-muted); vertical-align: top; }
td.skills-col .skill-item { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.35; }
td.skills-col .skill-more { margin-top: 2px; font-size: 0.8rem; opacity: 0.85; }

/* ЛПР в таблице — токены */
.results-card .lpr-card { min-width: 176px; gap: 6px; }
.results-card .lpr-avatar { width: 32px; height: 32px; }
.results-card .lpr-initials { background: var(--accent-soft); color: var(--accent-strong); }
.results-card .lpr-role, .results-card .lpr-more { color: var(--text-muted); }
.results-card .lpr-spinner { border-color: var(--border); border-top-color: var(--accent); }

@media (max-width: 1200px) { .results-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .results-header { align-items: stretch; flex-direction: column; gap: 14px; margin-bottom: 16px; }
  .results-header h1 { font-size: 26px; }
  .results-new { justify-content: center; }
  .results-stats { gap: 10px; margin-bottom: 16px; }
  .result-stat { gap: 10px; padding: 12px; border-radius: var(--radius-md); }
  .result-stat-icon { width: 34px; height: 34px; border-radius: 11px; }
  .result-stat-icon .icon { width: 18px; height: 18px; }
  .result-stat .label { font-size: 13px; line-height: 1.3; }
  .result-stat .value { font-size: 22px; }
  .results-card { padding: 16px; }
  .results-card-header .card-title { font-size: 18px; }
  .results-actions { width: 100%; justify-content: space-between; }
}

/* === Меню на телефоне (≤ 768px): нижняя панель и лист «Ещё» === */
/* Высота нижней панели (пункт 56px + отступы 12px + граница 1px) записана в :root как --mobile-nav-h —
   при её изменении поправьте токен: по нему над панелью поднимается плашка cookie. */
.mobile-nav, .mnav-backdrop, .mnav-sheet { display: none; }
@media (max-width: 768px) {
  .main { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
  .mobile-nav { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: flex; justify-content: space-around; gap: 4px;
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); background: var(--surface); border-top: 1px solid var(--border); }
  .mnav-item { flex: 1 1 0; min-width: 44px; min-height: 56px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    padding: 4px 2px; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--text-muted);
    font: inherit; font-size: 12px; font-weight: 500; line-height: 1.2; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .mnav-item .icon { width: 40px; height: 28px; padding: 4px 10px; border-radius: 999px; transition: background .15s, color .15s; }
  .mnav-item.active { color: var(--accent); font-weight: 600; }
  .mnav-item.active .icon { background: var(--accent-soft); }
  .mnav-item:focus-visible, .mnav-sheet-item:focus-visible, .mnav-close:focus-visible, .mnav-sheet .balance-row:focus-visible {
    outline: 2px solid var(--accent); outline-offset: 2px; }
  .mnav-label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }

  .mnav-backdrop:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 40; background: rgba(21,22,28,.4); }
  .mnav-sheet:not([hidden]) { display: flex; flex-direction: column; gap: 12px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 41;
    max-height: 85vh; overflow-y: auto; padding: 12px 16px calc(16px + env(safe-area-inset-bottom));
    background: var(--surface); border-radius: var(--radius-lg) var(--radius-lg) 0 0; box-shadow: var(--shadow-pop);
    animation: mnav-sheet-in .2s ease-out; }
  .mnav-sheet:focus { outline: none; }
  .mnav-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 4px; }
  .mnav-sheet-title { font-size: 18px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
  .mnav-close { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: var(--radius-sm);
    background: transparent; color: var(--text-muted); cursor: pointer; }
  .mnav-close:hover { background: var(--bg); color: var(--text); }
  .mnav-sheet .balance-row { min-height: 44px; }
  .mnav-sheet-list { display: flex; flex-direction: column; gap: 2px; }
  .mnav-sheet-item { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 12px 14px; border: 0; border-radius: 14px;
    background: transparent; color: #4A4F5E; font: inherit; font-size: 15px; font-weight: 500; text-align: left; text-decoration: none; cursor: pointer; }
  .mnav-sheet-item:hover { background: var(--bg); color: var(--text); }
  .mnav-sheet-item.active { background: var(--accent-soft); color: var(--accent-strong); }
  .mnav-sheet-item[hidden] { display: none; }
  .mnav-sheet-item.mnav-admin { color: #B42318; }
  .mnav-sheet-item.mnav-logout { margin-top: 4px; border-top: 1px solid var(--border-soft); border-radius: 0 0 14px 14px; color: var(--text-muted); }
  html.mnav-open, html.mnav-open body { overflow: hidden; }
}
@keyframes mnav-sheet-in { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .mnav-sheet:not([hidden]) { animation: none; } .mnav-item .icon { transition: none; } }

/* === История и Статистика (spec B2) === */
.page-card { border: 0; border-radius: var(--radius-lg); padding: 20px; margin-bottom: 20px; min-width: 0; }
.history-table th, .history-table td { padding-left: 10px; padding-right: 10px; }
.history-table th { padding-top: 12px; padding-bottom: 12px; background: var(--surface-muted); color: var(--text-faint); font-size: 11px;
  letter-spacing: .03em; border-bottom: 1px solid var(--border-soft); white-space: nowrap; }
.history-table td { padding-top: 14px; padding-bottom: 14px; color: var(--text); border-bottom: 1px solid var(--border-soft); vertical-align: middle; }
.history-table th:first-child, .history-table td:first-child { padding-left: 14px; }
.history-table th:last-child, .history-table td:last-child { padding-right: 14px; }
.history-table tbody tr:last-child td { border-bottom: 0; }
.history-table tbody tr:hover { background: var(--surface-muted); }
.history-table .num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.history-table .num.hot { color: var(--danger-fg); font-weight: 600; }
.history-table .num.warm { color: var(--warning-fg); font-weight: 600; }
.history-table .num.cold { color: #1D5FBF; font-weight: 600; }
.history-date { color: var(--text-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.history-query { display: flex; align-items: center; gap: 10px; min-width: 160px; }
.history-mode { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex-shrink: 0; border-radius: 10px;
  background: var(--accent-soft); color: var(--accent-strong); }
.history-mode .icon { width: 16px; height: 16px; }
.history-query a { color: var(--text); font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.history-query a:hover { color: var(--accent); }

.status-pill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.status-pill .icon { width: 13px; height: 13px; }
.status-running { background: #EAF2FF; color: #1D5FBF; }
.status-completed { background: var(--success-bg); color: var(--success-fg); }
.status-failed { background: var(--danger-bg); color: var(--danger-fg); }

.row-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.row-btn { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 0; border-radius: 10px; background: var(--accent-soft);
  color: var(--accent-strong); font: 600 13px/1 var(--font); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background .15s, color .15s; }
.row-btn .icon { width: 15px; height: 15px; }
.row-btn:hover { background: #E3E6FF; text-decoration: none; }
.row-btn-danger { background: transparent; color: var(--text-muted); }
.row-btn-danger:hover { background: var(--danger-bg); color: var(--danger-fg); }
.row-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.empty-block { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 48px 20px; text-align: center; color: var(--text-muted); }
.empty-block .empty-icon { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 16px; background: var(--accent-soft); color: var(--accent-strong); }
.empty-block .empty-icon .icon { width: 24px; height: 24px; }
.empty-block h3 { margin: 0; font-size: 18px; font-weight: 700; color: var(--text); }
.empty-block p { margin: 0; font-size: 14px; }

/* Статистика: распределение и категории */
.dist-legend { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 4px 0 14px; }
.dist-item { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text); }
.dist-dot { width: 10px; height: 10px; border-radius: 50%; }
.dist-bar { display: flex; height: 14px; border-radius: 999px; overflow: hidden; background: var(--border-soft); }
.dist-seg { height: 100%; }
.dist-hot { background: #E5484D; }
.dist-warm { background: #F5A524; }
.dist-cold { background: #4C8DF6; }
.dist-empty { color: var(--text-muted); font-size: 14px; }

@media (max-width: 640px) {
  .page-card { padding: 16px; }
  .history-table th, .history-table td { padding-left: 8px; padding-right: 8px; }
}

/* === Аудитории (spec B2) === */
/* Шапка, баннер «справочник готовится», вкладки */
.aud-lead { margin: 0; font-size: 16px; color: var(--text-muted); }
.aud-banner { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 20px; padding: 14px 16px; border-radius: var(--radius-md);
  background: var(--warning-bg); color: #7A3E00; font-size: 14px; line-height: 1.5; }
.aud-banner p { margin: 0; }
.aud-banner-icon { display: inline-flex; color: var(--warning-fg); }
.aud-tabs { margin-bottom: 20px; }
.aud-tabs .search-type-btn:disabled { opacity: .45; cursor: not-allowed; }
.audience-tab-panel[hidden] { display: none !important; }
.audience-preparing { pointer-events: none; opacity: .45; }
.audience-preparing::after { content: 'Справочник готовится…'; display: block; margin: 12px 0; color: var(--text-muted); font-size: 14px; }

/* Карточки: заголовок с иконкой */
.aud-page .page-card { margin-bottom: 20px; }
.aud-pane-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.aud-pane-head .result-stat-icon { width: 40px; height: 40px; border-radius: 12px; }
.aud-pane-head .result-stat-icon .icon { width: 20px; height: 20px; }
.aud-pane-head .card-title { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.result-stat-icon.tone-done { background: var(--success-bg); color: var(--success-fg); }
.aud-intro { margin: 0 0 16px; font-size: 15px; line-height: 1.55; color: var(--text-2); max-width: 760px; }

/* Ниши и география: поиск, наборы, дерево */
.audience-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.audience-layout .page-card { margin-bottom: 0; }
.aud-search { position: relative; display: flex; align-items: center; margin-bottom: 12px; }
.aud-search > .icon { position: absolute; left: 14px; color: var(--text-faint); pointer-events: none; }
.audience-search, .audience-history-search { width: 100%; height: 44px; padding: 0 14px 0 40px; border: 1.5px solid var(--border); border-radius: 14px;
  background: var(--surface-muted); font: 400 15px/1 var(--font); color: var(--text); outline: none; appearance: none; -webkit-appearance: none;
  transition: border-color .15s, box-shadow .15s, background .15s; }
.audience-search::placeholder, .audience-history-search::placeholder { color: var(--text-faint); opacity: 1; }
.audience-search:focus, .audience-history-search:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: var(--surface); }
.audience-presets { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.aud-chip { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border: 1px solid var(--border-soft); border-radius: 999px;
  background: var(--surface); color: var(--text-2); font: 500 14px/1 var(--font); cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.aud-chip:hover { border-color: var(--border); background: var(--bg); }
.aud-chip.active-preset { border-color: transparent; background: var(--accent-soft); color: var(--accent-strong); font-weight: 600; }
.aud-chip:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.audience-tree { max-height: 520px; overflow: auto; padding: 6px; border: 1px solid var(--border-soft); border-radius: var(--radius-md); font-size: 14px; }
.tree-node > summary { display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 6px 8px; border-radius: 10px; list-style: none;
  font-weight: 500; color: var(--text); cursor: pointer; user-select: none; }
.tree-node > summary:hover { background: var(--bg); }
.tree-node > summary:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.tree-node > summary::-webkit-details-marker { display: none; }
.tree-node > summary::marker { content: ''; }
.tree-root > summary { font-weight: 600; }
.tree-caret { width: 16px; height: 16px; color: var(--text-faint); transform: rotate(-90deg); transition: transform .15s; }
.tree-node[open] > summary > .tree-caret { transform: none; color: var(--accent); }
.tree-label { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.tree-count { flex-shrink: 0; padding: 2px 8px; border-radius: 999px; background: var(--bg); color: var(--text-muted); font-size: 12px; font-weight: 500; font-variant-numeric: tabular-nums; }
.tree-children { margin: 2px 0 4px 16px; padding-left: 10px; border-left: 1px solid var(--border-soft); }
.tree-leaf { display: flex; align-items: flex-start; gap: 10px; padding: 6px 8px; border-radius: 10px; font-weight: 400; color: var(--text-2); cursor: pointer; }
.tree-leaf:hover { background: var(--bg); }
.tree-leaf input { width: 16px; height: 16px; margin-top: 2px; flex-shrink: 0; accent-color: var(--accent); cursor: pointer; }
.tree-leaf-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; overflow-wrap: anywhere; }
.tree-path { font-size: 12px; color: var(--text-muted); }
.tree-leaf mark { padding: 0 1px; border-radius: 3px; background: var(--accent-soft); color: var(--accent-strong); font-weight: 600; }
.tree-placeholder { display: flex; align-items: center; gap: 8px; padding: 6px 8px; font-size: 13px; color: var(--text-muted); }
.niche-hits, .geo-hits { max-height: 240px; overflow: auto; }
.niche-hits:not(:empty), .geo-hits:not(:empty) { margin-bottom: 12px; padding: 6px; border: 1px solid var(--border-soft); border-radius: var(--radius-md); background: var(--surface-muted); }
.aud-state { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 20px 12px; font-size: 14px; color: var(--text-muted); text-align: center; }
.aud-state .icon { color: var(--text-faint); }
.aud-page .spinner { width: 16px; height: 16px; margin-right: 0; border-width: 2px; border-color: var(--border); border-top-color: var(--accent); flex-shrink: 0; }
.aud-page .results-loading { gap: 10px; }

/* Сегмент: счётчик, параметры, кнопка */
.audience-controls { margin-top: 20px; }
.aud-counter { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.aud-counter-item { display: flex; flex-direction: column; gap: 2px; padding: 16px 18px; border-radius: var(--radius-md); background: var(--surface-muted); border: 1px solid var(--border-soft); min-width: 0; }
.aud-counter-label { font-size: 14px; color: var(--text-muted); }
.aud-counter-value { font-size: 28px; font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; color: var(--text); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.aud-counter-sub { min-height: 1.4em; font-size: 13px; color: var(--text-muted); }
.aud-hint { margin: 10px 0 0; font-size: 14px; color: var(--text-muted); }
.aud-hint:empty { display: none; }
.aud-options { display: flex; flex-wrap: wrap; gap: 16px 32px; margin-top: 20px; }
.aud-field { min-width: 0; margin: 0; padding: 0; border: 0; }
.aud-field-label { margin-bottom: 8px; padding: 0; font-size: 13px; font-weight: 600; color: var(--text-muted); }

.aud-seg { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 4px; border-radius: 14px; background: var(--bg); }
.aud-seg-opt { position: relative; display: inline-flex; cursor: pointer; }
.aud-seg-input, .aud-check-input, .aud-file-input { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; opacity: 0; overflow: hidden; clip: rect(0 0 0 0); }
.aud-seg-opt span { display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 10px; color: var(--text-muted); font-size: 14px; font-weight: 500;
  transition: background .15s, color .15s, box-shadow .15s; }
.aud-seg-opt:hover span { color: var(--text); }
.aud-seg-input:checked + span { background: var(--surface); color: var(--text); box-shadow: 0 1px 3px rgba(21,22,28,.08); }
.aud-seg-input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 1px; }

.aud-checks { display: flex; flex-wrap: wrap; gap: 8px; }
.aud-check { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 14px 0 10px; border: 1px solid var(--border-soft); border-radius: 12px;
  background: var(--surface); color: var(--text-2); font-size: 14px; font-weight: 500; cursor: pointer; user-select: none; transition: border-color .15s, background .15s; }
.aud-check:hover { border-color: var(--border); }
.aud-check-box { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border: 1.5px solid #C9CAD8; border-radius: 6px; background: var(--surface);
  color: transparent; transition: background .15s, border-color .15s, color .15s; }
.aud-check-box .icon { width: 14px; height: 14px; stroke-width: 3; }
.aud-check:has(.aud-check-input:checked) { border-color: #C9CCF8; background: var(--accent-soft); color: var(--accent-strong); }
.aud-check-input:checked + .aud-check-box { border-color: var(--accent); background: var(--accent); color: #fff; }
.aud-check-input:focus-visible + .aud-check-box { outline: 2px solid var(--accent); outline-offset: 2px; }
.aud-toggles { display: flex; flex-wrap: wrap; gap: 4px 24px; color: var(--text-2); }

.aud-submit { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 12px 16px; margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--border-soft); }
.audience-name-field { display: flex; flex-direction: column; gap: 6px; flex: 1 1 280px; min-width: 0; max-width: 520px; }
.audience-name-field label { font-size: 13px; font-weight: 600; color: var(--text-muted); }
.audience-name-field input { width: 100%; height: 48px; padding: 0 16px; border: 1.5px solid var(--border); border-radius: 14px; background: var(--surface-muted);
  font: 400 15px/1 var(--font); color: var(--text); outline: none; transition: border-color .15s, box-shadow .15s, background .15s; }
.audience-name-field input::placeholder { color: var(--text-faint); }
.audience-name-field input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: var(--surface); }
.aud-submit .btn-find:disabled { opacity: .45; box-shadow: none; cursor: not-allowed; }
.aud-submit .btn-find:disabled:hover { background: var(--accent); }

/* Свой файл: область загрузки */
.audience-clean-inputs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
.audience-dropzone { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 200px; padding: 20px 16px;
  border: 1.5px dashed var(--border); border-radius: var(--radius-md); background: var(--surface-muted); text-align: center; cursor: pointer;
  transition: border-color .15s, background .15s; }
.audience-dropzone:hover { border-color: #C9CAD8; }
.audience-dropzone.is-dragover { border-color: var(--accent); background: var(--accent-soft); }
.aud-drop-icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; background: var(--accent-soft); color: var(--accent-strong); }
.aud-drop-icon .icon { width: 22px; height: 22px; }
.aud-drop-title { margin: 0; font-size: 15px; font-weight: 600; color: var(--text); }
.audience-file-label { position: relative; display: inline-flex; cursor: pointer; }
.audience-file-label .btn-soft { pointer-events: none; }
.audience-file-label:focus-within .btn-soft { outline: 2px solid var(--accent); outline-offset: 2px; }
.aud-drop-files { max-width: 100%; font-size: 13px; color: var(--text-2); overflow-wrap: anywhere; }
.audience-dropzone-hint { margin: 0; font-size: 12px; color: var(--text-muted); }
.audience-clean-text { width: 100%; min-height: 200px; padding: 14px 16px; border: 1.5px solid var(--border); border-radius: var(--radius-md); background: var(--surface-muted);
  font: 400 14px/1.5 var(--font); color: var(--text); resize: vertical; outline: none; transition: border-color .15s, box-shadow .15s, background .15s; }
.audience-clean-text::placeholder { color: var(--text-faint); }
.audience-clean-text:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: var(--surface); }

/* Итог сборки */
.audience-dialog { border: 1px solid #CBEBDC; }
.aud-summary { margin: 0; font-size: 16px; font-weight: 600; color: var(--text); }
.audience-badge { margin: 12px 0 0; padding: 12px 14px; border-radius: var(--radius-sm); background: var(--bg); color: var(--text-2); font-size: 13px; line-height: 1.5; }
.audience-dialog-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.audience-dialog-actions .btn-soft { height: 48px; padding: 0 20px; border-radius: 14px; font-size: 15px; }

/* История сборок */
.audience-history .results-card-header { align-items: center; }
.aud-history-search { flex: 0 1 320px; margin-bottom: 0; }
.audience-history-search::-webkit-search-decoration { -webkit-appearance: none; }
.audience-history-table td { vertical-align: middle; }
.audience-history-table td:last-child { width: 1%; white-space: nowrap; text-align: right; }
.audience-history-name { min-width: 140px; max-width: 280px; font-weight: 600; overflow-wrap: anywhere; }
.status-expired { background: var(--bg); color: var(--text-muted); }

@media (prefers-reduced-motion: reduce) { .tree-caret, .aud-chip, .aud-seg-opt span, .aud-check, .aud-check-box, .audience-dropzone { transition: none; } }
@media (max-width: 1024px) {
  .audience-layout, .audience-clean-inputs { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .aud-lead { font-size: 15px; }
  .aud-tabs.mode-switch { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aud-tabs.mode-switch .search-type-btn .icon { display: none; }
  .audience-tree { max-height: 360px; }
  .aud-pane-head .card-title { font-size: 18px; }
  .aud-counter { gap: 8px; }
  .aud-counter-item { padding: 12px; }
  .aud-counter-value { font-size: 22px; }
  .aud-options { gap: 16px; }
  .aud-seg { display: flex; }
  .aud-seg-opt { flex: 1 1 0; }
  .aud-seg-opt span { justify-content: center; width: 100%; padding: 0 8px; }
  .aud-field { width: 100%; }
  .aud-submit { flex-direction: column; align-items: stretch; }
  .audience-name-field { max-width: none; flex-basis: auto; }
  .aud-submit .btn-find, .audience-dialog-actions .btn-find, .audience-dialog-actions .btn-soft { width: 100%; justify-content: center; }
  .audience-clean-text, .audience-dropzone { min-height: 160px; }
  .aud-history-search { flex-basis: 100%; }
}

/* === Поля форм нового стиля (профиль, вход и регистрация) === */
.ls-form .form-group { margin-bottom: 16px; }
.ls-form .form-group label, .ls-label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 500; color: var(--text); }
.ls-input, .ls-form .form-group input { width: 100%; height: 48px; padding: 0 16px; border: 1.5px solid var(--border); border-radius: 14px;
  background: var(--surface-muted); font: 400 15px/1.2 var(--font); color: var(--text); outline: none; appearance: none; -webkit-appearance: none;
  transition: border-color .15s, box-shadow .15s, background .15s; }
.ls-input::placeholder, .ls-form .form-group input::placeholder { color: var(--text-faint); opacity: 1; }
.ls-input:focus, .ls-form .form-group input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: var(--surface); }
.ls-form .btn-find { width: 100%; margin-top: 4px; }

/* === Профиль (spec B2) === */
.prof-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.prof-grid > .page-card { margin-bottom: 20px; }
.prof-card { display: flex; flex-direction: column; }
.prof-card-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.prof-card-head .result-stat-icon { width: 40px; height: 40px; border-radius: 12px; }
.prof-card-head .result-stat-icon .icon { width: 20px; height: 20px; }
.prof-card-head .card-title { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.prof-card-head .plan-badge { margin-left: auto; }
.prof-fields { margin: 0; display: flex; flex-direction: column; }
.prof-field { display: flex; flex-direction: column; gap: 6px; padding: 12px 0; border-bottom: 1px solid var(--border-soft); }
.prof-field:first-child { padding-top: 0; }
.prof-field:last-child { border-bottom: 0; padding-bottom: 0; }
.prof-field dt { font-size: 13px; color: var(--text-muted); }
.prof-field dt label { font: inherit; color: inherit; }
.prof-field dd { margin: 0; font-size: 16px; font-weight: 500; color: var(--text); overflow-wrap: anywhere; }
.prof-name-row { display: flex; gap: 8px; align-items: center; }
.prof-name-row .ls-input { flex: 1; min-width: 0; height: 44px; }
.prof-name-row .btn-soft { height: 44px; flex-shrink: 0; }

.prof-plan-line { font-size: 15px; color: var(--text-muted); }
.prof-plan-line b { color: var(--text); font-weight: 600; }
.prof-balance { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; margin: 6px 0 14px; }
.prof-balance[hidden] { display: none; }
.prof-balance-value { font-size: 40px; font-weight: 700; line-height: 1.1; letter-spacing: -0.03em; color: var(--text); font-variant-numeric: tabular-nums; }
.prof-balance-cap { font-size: 15px; color: var(--text-muted); }
.prof-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-top: 1px solid var(--border-soft); }
.prof-row-label { font-size: 13px; color: var(--text-muted); }
.prof-row-value { font-size: 15px; font-weight: 600; color: var(--text); font-variant-numeric: tabular-nums; }
.prof-note { display: flex; align-items: flex-start; gap: 8px; margin: auto 0 0; padding-top: 14px; font-size: 13px; line-height: 1.5; color: var(--text-muted); }
.prof-note .icon { margin-top: 2px; color: var(--text-faint); }
.prof-text { margin: 0; font-size: 14px; line-height: 1.5; color: var(--text-muted); }

.plan-badge.trial, .status-trial { background: var(--warning-bg); color: var(--warning-fg); }
.plan-badge.paid { background: var(--success-bg); color: var(--success-fg); }
.plan-badge.unlimited { background: var(--accent-soft); color: var(--accent-strong); }
.plan-badge[hidden] { display: none; }

.prof-sub-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.prof-sub-cell { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border-radius: var(--radius-md); background: var(--surface-muted);
  border: 1px solid var(--border-soft); min-width: 0; }
.prof-sub-cell .status-pill { vertical-align: middle; }
.prof-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.prof-simple { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 14px 16px;
  border-radius: var(--radius-md); background: var(--surface-muted); border: 1px solid var(--border-soft); }
#btn-choose-tariff { text-decoration: none; }

.tariff-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.tariff-option { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 20px; border: 1.5px solid var(--border-soft);
  border-radius: var(--radius-md); background: var(--surface); min-width: 0; }
.tariff-option.tariff-current { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.tariff-name { font-size: 16px; font-weight: 700; color: var(--text); }
.tariff-price { font-size: 30px; font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; color: var(--text); font-variant-numeric: tabular-nums; }
.tariff-price span { font-size: 14px; font-weight: 500; letter-spacing: 0; color: var(--text-muted); }
.tariff-details { font-size: 14px; color: var(--text-muted); }
.tariff-action { margin-top: auto; padding-top: 12px; }
.tariff-action:empty { padding-top: 0; }
.btn-subscribe { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 44px; padding: 10px 14px; border: 0;
  border-radius: 12px; background: var(--accent); color: #fff; font: 600 14px/1.25 var(--font); text-align: center; cursor: pointer;
  box-shadow: var(--shadow-accent); transition: background .15s; }
.btn-subscribe:hover { background: var(--accent-strong); }
.btn-subscribe:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.tariff-current-badge { background: var(--accent-soft); color: var(--accent-strong); }

.prof-exit { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding-bottom: 16px; border-bottom: 1px solid var(--border-soft); }
.prof-danger { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding-top: 16px; }
.prof-delete { color: var(--danger-fg); }

/* Подтверждение отмены подписки */
.cancel-modal-overlay { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px;
  background: rgba(21,22,28,.45); }
.cancel-modal { width: 100%; max-width: 440px; max-height: calc(100vh - 32px); overflow-y: auto; padding: 24px; border-radius: var(--radius-lg);
  background: var(--surface); box-shadow: var(--shadow-pop); }
.cancel-modal-title { margin: 0 0 16px; font-size: 22px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); text-align: center; }
.cancel-modal:focus { outline: none; }
.cancel-modal-body { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.cancel-modal-body .prof-text { color: var(--text-2); }
.cancel-modal-body b { font-weight: 600; color: var(--text); }
.cancel-modal-actions { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
.btn-confirm-cancel-subscription { align-self: center; padding: 8px 12px; border: 0; border-radius: 10px; background: transparent; color: var(--text-muted);
  font: 500 13px/1.2 var(--font); cursor: pointer; }
.btn-confirm-cancel-subscription:hover { background: var(--bg); color: var(--text); }
.btn-confirm-cancel-subscription:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

@media (max-width: 1100px) { .tariff-grid { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .prof-grid { grid-template-columns: 1fr; gap: 0; } }
@media (max-width: 640px) {
  .prof-sub-grid { grid-template-columns: 1fr; gap: 8px; }
  .prof-balance-value { font-size: 34px; }
  .prof-card-head .plan-badge { margin-left: 0; }
  .prof-name-row { flex-wrap: wrap; }
  .prof-name-row .ls-input { flex-basis: 100%; }
}

/* === Админ-панель (spec B2) === */
.admin-kicker { display: flex; align-items: center; gap: 8px; margin: -8px 0 -12px; padding: 0 14px; font-size: 12px; font-weight: 600;
  letter-spacing: .04em; text-transform: uppercase; color: #B42318; white-space: nowrap; }
.nav-item.admin-back { margin-top: 12px; color: var(--text-muted); }
.admin-profile { cursor: default; }
.admin-profile:hover { background: transparent; }
@media (min-width: 769px) {
  .sidebar-collapsed .admin-kicker { justify-content: center; padding: 0; }
}

.admin-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.admin-grid > .page-card { margin-bottom: 0; }
.admin-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.admin-card-head .result-stat-icon { width: 40px; height: 40px; border-radius: 12px; }
.admin-card-head .result-stat-icon .icon { width: 20px; height: 20px; }
.admin-card-head .card-title, .admin-modal-head .card-title { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); overflow-wrap: anywhere; }
.admin-stats[aria-busy="true"] .value { color: var(--text-faint); }
.dist-item b { font-variant-numeric: tabular-nums; }
.dist-trial { background: #F5A524; }
.dist-paid { background: var(--accent); }
.admin-row { margin-bottom: 14px; }
.prof-row-value.is-muted { color: var(--text-muted); font-weight: 500; }
.admin-ext-link { width: max-content; }

.admin-toolbar { display: flex; align-items: center; gap: 12px; }
.admin-search { display: flex; align-items: center; gap: 8px; flex: 1 1 320px; max-width: 520px; min-width: 0; }
.admin-search-field { position: relative; display: flex; align-items: center; flex: 1; min-width: 0; color: var(--text-faint); }
.admin-search-field .icon { position: absolute; left: 14px; pointer-events: none; }
.admin-search-field .ls-input { height: 40px; padding-left: 38px; border-radius: 12px; font-size: 14px; }
.admin-search .btn-soft { flex-shrink: 0; }
/* .sr-only в заголовке таблицы позиционируется от обёртки, иначе раздвигает страницу на телефоне */
.admin-page .results-table-wrap { position: relative; }
.admin-users-table .history-date { white-space: nowrap; }
.admin-user-cell { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-width: 180px; }
.admin-email { font-weight: 600; overflow-wrap: anywhere; }
.history-table tr.is-inactive td { color: var(--text-muted); }
.status-admin { background: var(--danger-bg); color: #B42318; }
.status-neutral { background: var(--bg); color: #4A4F5E; }
.results-state.admin-error { padding: 28px 0; color: var(--danger-fg); }
.admin-pager { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 16px; font-size: 14px; color: var(--text-muted); }
.admin-pager b { color: var(--text); font-variant-numeric: tabular-nums; }
.admin-pager-nav { display: flex; align-items: center; gap: 10px; }
.admin-pager-info { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Окна админки: карточка пользователя и сообщения */
.admin-modal-overlay, .app-modal-overlay { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px;
  background: rgba(21,22,28,.45); }
.app-modal-overlay { z-index: 1100; }
.admin-modal { width: 100%; max-width: 560px; max-height: calc(100vh - 32px); overflow-y: auto; padding: 24px; border-radius: var(--radius-lg);
  background: var(--surface); box-shadow: var(--shadow-pop); }
.admin-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.admin-modal-close { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; flex-shrink: 0; border: 0; border-radius: var(--radius-sm);
  background: transparent; color: var(--text-muted); cursor: pointer; }
.admin-modal-close:hover { background: var(--bg); color: var(--text); }
.admin-modal-close:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.admin-modal .ls-form .form-group input:disabled, .admin-modal .ls-form .form-group input[readonly] { color: var(--text-muted); background: var(--bg); }
.admin-inline { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.admin-inline input { flex: 1 1 140px; min-width: 0; }
.admin-inline .btn-soft { height: 48px; border-radius: 14px; }
.admin-activate .count-select { margin-left: 0; }
.admin-activate .count-select select { height: 44px; }
.admin-activate .btn-soft { height: 44px; }
.admin-switches { display: flex; flex-direction: column; gap: 4px; margin-bottom: 16px; }
.admin-modal-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.admin-modal-actions .btn-soft { height: 48px; padding: 0 20px; border-radius: 14px; font-size: 15px; }
.admin-modal-actions .btn-find { width: auto; margin-top: 0; }
.admin-users-table td:nth-child(3) { min-width: 130px; }
.admin-modal-section { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border-soft); }
.admin-section-title { margin: 0 0 10px; font-size: 16px; font-weight: 700; color: var(--text); }
.admin-modal-section .prof-row:first-of-type { border-top: 0; padding-top: 4px; }
.admin-subs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.admin-sub { padding: 12px 14px; border-radius: var(--radius-sm); background: var(--surface-muted); border: 1px solid var(--border-soft); }
.admin-sub-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }

.app-modal { display: flex; flex-direction: column; align-items: center; gap: 10px; width: 100%; max-width: 400px; padding: 28px 24px 24px;
  border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-pop); text-align: center; }
.app-modal__icon:empty { display: none; }
.app-modal__icon { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 16px; background: var(--accent-soft); color: var(--accent-strong); }
.app-modal__icon .icon { width: 26px; height: 26px; }
.app-modal__icon--success { background: var(--success-bg); color: var(--success-fg); }
.app-modal__icon--error { background: var(--danger-bg); color: var(--danger-fg); }
.app-modal__title { font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.app-modal__message { font-size: 15px; line-height: 1.5; color: var(--text-muted); overflow-wrap: anywhere; }
.app-modal__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; width: 100%; margin-top: 8px; }
.app-modal__actions .btn-soft { height: 48px; padding: 0 20px; border-radius: 14px; font-size: 15px; }

@media (max-width: 1100px) { .admin-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) {
  .admin-toolbar { flex-direction: column; align-items: stretch; }
  .admin-search { max-width: none; flex-basis: auto; }
  .admin-toolbar .count-select { margin-left: 0; }
  .admin-toolbar .count-select select { width: 100%; }
  .admin-modal { padding: 20px 16px; }
  .admin-modal-actions > *, .app-modal__actions > * { flex: 1 1 auto; justify-content: center; }
  .admin-pager { justify-content: center; }
}
@media (max-width: 768px) { .admin-body .mnav-label { font-size: 11px; } }

/* === Вход, регистрация, восстановление пароля (spec B2) === */
.auth-page { min-height: 100vh; min-height: 100dvh; display: flex; align-items: center; justify-content: center; background: var(--bg); }
.auth-container { display: flex; flex-direction: column; align-items: center; gap: 20px; width: 100%; max-width: 448px; padding: 32px 16px; }
.auth-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.auth-brand:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 12px; }
.auth-brand .sidebar-logo-text { font-size: 22px; }
.auth-card { width: 100%; padding: 32px; border-radius: var(--radius-lg); background: var(--surface); box-shadow: 0 1px 3px rgba(21,22,28,.04), 0 12px 32px rgba(21,22,28,.06); }
.auth-header { margin-bottom: 24px; text-align: center; }
.auth-header h1 { margin: 0 0 6px; font-size: 26px; font-weight: 700; line-height: 1.2; letter-spacing: -0.02em; color: var(--text); }
.auth-header p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--text-muted); }
.auth-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.ls-form .auth-label-row label { margin-bottom: 0; }
.auth-link-sm { font-size: 13px; font-weight: 500; color: var(--accent); text-decoration: none; }
.auth-link-sm:hover { color: var(--accent-strong); text-decoration: underline; }
.btn-full { width: 100%; }
.error-message, .success-message { margin-bottom: 16px; padding: 12px 14px; border-radius: var(--radius-sm); font-size: 14px; line-height: 1.45; }
.error-message { background: var(--danger-bg); color: var(--danger-fg); }
.success-message { background: var(--success-bg); color: var(--success-fg); }
.auth-legal { margin: 14px 0 0; font-size: 13px; line-height: 1.5; color: var(--text-muted); text-align: center; }
.auth-legal a, .auth-footer a { color: var(--accent); font-weight: 500; text-decoration: none; }
.auth-legal a:hover, .auth-footer a:hover { color: var(--accent-strong); text-decoration: underline; }
.auth-footer { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border-soft); text-align: center; }
.auth-footer p { margin: 0; font-size: 14px; color: var(--text-muted); }
.auth-footer p + p { margin-top: 8px; }
.auth-back { display: inline-flex; align-items: center; gap: 6px; }
.trial-info { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-bottom: 24px; padding: 14px 16px; border-radius: var(--radius-md);
  background: var(--accent-soft); text-align: center; }
.trial-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: var(--surface);
  color: var(--accent-strong); font-size: 13px; font-weight: 600; }
.trial-info p { margin: 0; font-size: 14px; color: #3730A3; }
.auth-state { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 8px 0; text-align: center; }
.auth-state p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--text-muted); }
.auth-spinner { margin: 0; border-color: var(--border); border-top-color: var(--accent); }
.auth-result-icon { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 18px; }
.auth-result-icon .icon { width: 28px; height: 28px; }
.auth-result-icon.is-ok { background: var(--success-bg); color: var(--success-fg); }
.auth-result-icon.is-err { background: var(--danger-bg); color: var(--danger-fg); }
.auth-result-title { margin: 0; font-size: 24px; font-weight: 700; letter-spacing: -0.02em; color: var(--text); }
.auth-state .btn-find { margin-top: 8px; text-decoration: none; }
/* Вход через Яндекс ID: нейтральная кнопка в токенах сайта, без фирменных цветов */
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 20px 0 16px; font-size: 13px; color: var(--text-faint); }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--border-soft); }
.btn-yandex { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 18px;
  border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); color: var(--text);
  font: 600 15px/1 var(--font); text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s; }
.btn-yandex .icon { width: 20px; height: 20px; }
.btn-yandex:hover { background: var(--surface-muted); border-color: var(--text-faint); text-decoration: none; }
.btn-yandex:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (max-width: 480px) {
  .auth-page { align-items: flex-start; }
  .auth-container { padding: 24px 16px; }
  .auth-card { padding: 24px 20px; }
  .auth-header h1 { font-size: 23px; }
}

/* === Плашка согласия на cookie (spec D2) === */
.cookie-banner { position: fixed; left: 16px; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 35;
  max-width: 720px; margin: 0 auto; display: flex; align-items: center; gap: 16px; padding: 14px 16px;
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-pop);
  font-family: var(--font); color: var(--text); }
.cookie-banner[hidden] { display: none; }
.cookie-banner-text { flex: 1 1 auto; margin: 0; font-size: 14px; line-height: 1.5; color: var(--text-2); }
.cookie-banner-text a { color: var(--accent); font-weight: 500; text-decoration: underline; text-underline-offset: 2px; }
.cookie-banner-text a:hover { color: var(--accent-strong); }
.cookie-banner-actions { display: flex; gap: 8px; flex-shrink: 0; }
.cookie-btn { min-height: 44px; padding: 0 16px; border-radius: var(--radius-sm); font: inherit; font-size: 14px; font-weight: 600;
  white-space: nowrap; cursor: pointer; transition: background .15s, color .15s; }
.cookie-btn-primary { border: 0; background: var(--accent); color: #fff; }
.cookie-btn-primary:hover { background: var(--accent-strong); }
.cookie-btn-secondary { border: 1px solid var(--border); background: var(--surface); color: var(--text); }
.cookie-btn-secondary:hover { background: var(--bg); }
.cookie-btn:focus-visible, .cookie-banner-text a:focus-visible, [data-cookie-settings]:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.auth-footer .auth-cookie-link { color: var(--text-muted); font-weight: 400; }
@media (max-width: 768px) {
  .cookie-banner--app { bottom: calc(var(--mobile-nav-h) + 8px + env(safe-area-inset-bottom)); }
}
@media (max-width: 600px) {
  .cookie-banner { left: 12px; right: 12px; flex-direction: column; align-items: stretch; gap: 12px; padding: 14px; }
  .cookie-banner-actions .cookie-btn { flex: 1 1 0; padding: 0 12px; }
}

/* === Мини-CRM: «В клиентах · этап» и кнопка «В клиенты» / «Карточка» в выдаче, карточка клиента (crm-card.js) === */
.company-open { display: inline; padding: 0; border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.company-open:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.company-open:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
.company-title { overflow-wrap: anywhere; }
.crm-client-label { margin-top: 4px; font-size: 12px; line-height: 1.35; color: var(--text-muted); }
.results-card .results-table-wrap { position: relative; } /* .sr-only в заголовке «Действия» не раздвигает страницу */
.results-card .crm-action-col { width: 1%; white-space: nowrap; }
.crm-action-inline { display: none; }
.crm-add-btn { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 12px; border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--surface); color: var(--accent-strong); font: 600 13px/1 var(--font); white-space: nowrap; cursor: pointer; transition: border-color .15s, background .15s; }
.crm-add-btn .icon { width: 14px; height: 14px; }
.crm-add-btn:hover { border-color: var(--accent); background: var(--accent-soft); }
.crm-add-btn[aria-disabled="true"] { opacity: .6; cursor: progress; }
.crm-add-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.crm-open-btn { display: inline-flex; align-items: center; gap: 5px; min-height: 32px; padding: 0 2px; border: 0; background: none;
  color: var(--accent); font: 600 13px/1 var(--font); white-space: nowrap; cursor: pointer; }
.crm-open-btn .icon { width: 14px; height: 14px; }
.crm-open-btn:hover { color: var(--accent-strong); text-decoration: underline; text-underline-offset: 3px; }
.crm-open-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 8px; }
.crm-remove-row { padding-top: 4px; border-top: 1px solid var(--border-soft); }
.crm-remove { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 2px; border: 0; background: none;
  color: var(--danger-fg); font: 500 14px/1 var(--font); cursor: pointer; }
.crm-remove:hover { text-decoration: underline; text-underline-offset: 3px; }
.crm-remove:disabled { opacity: .6; cursor: default; }
.crm-remove:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 8px; }
/* следующий шаг в строке — на «Моих клиентах» (clients.js) */
.crm-row-step { display: flex; align-items: flex-start; gap: 6px; max-width: 220px; font-size: 12px; line-height: 1.4; color: var(--text-muted); }
.crm-row-step .icon { width: 14px; height: 14px; margin-top: 1px; }
.crm-row-step > span { display: flex; flex-direction: column; min-width: 0; }
.crm-row-step-when { font-weight: 600; white-space: nowrap; }
.crm-row-step-text { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow-wrap: anywhere; }
.crm-row-step.is-overdue { color: var(--warning-fg); }

/* Панель карточки: справа на компьютере, листом снизу на телефоне */
html.crm-open, html.crm-open body { overflow: hidden; }
.crm-backdrop:not([hidden]) { position: fixed; inset: 0; z-index: 60; background: rgba(21,22,28,.32); }
.crm-panel[hidden] { display: none; }
.crm-panel { position: fixed; top: 16px; right: 16px; bottom: 16px; z-index: 61; display: flex; flex-direction: column;
  width: min(460px, calc(100vw - 32px)); background: var(--surface); border-radius: var(--radius-lg); box-shadow: var(--shadow-pop);
  font-family: var(--font); color: var(--text); animation: crm-panel-in .2s ease-out; }
.crm-panel:focus { outline: none; }
.crm-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px 20px 14px; border-bottom: 1px solid var(--border-soft); }
.crm-panel-titles { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.crm-panel-kicker { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; color: var(--text-muted); }
.crm-panel-kicker .icon { color: var(--accent); }
.crm-panel-title { margin: 0; font-size: 20px; font-weight: 700; line-height: 1.25; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.crm-close { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 40px; height: 40px; border: 0; border-radius: var(--radius-sm);
  background: transparent; color: var(--text-muted); cursor: pointer; }
.crm-close:hover { background: var(--bg); color: var(--text); }
.crm-panel-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px 20px 20px; display: flex; flex-direction: column; gap: 20px; }
.crm-panel-state[hidden], .crm-panel-state:empty { display: none; }
.crm-loading { display: inline-flex; align-items: center; gap: 10px; color: var(--text-muted); }
.crm-loading .spinner { border-color: var(--border); border-top-color: var(--accent); }
.crm-error { margin: 0 0 12px; color: var(--danger-fg); }
.crm-retry, .crm-save { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; border: 0; border-radius: var(--radius-sm);
  font: 600 15px/1 var(--font); cursor: pointer; }
.crm-retry { background: var(--accent-soft); color: var(--accent-strong); }
.crm-save { background: var(--accent); color: #fff; }
.crm-save:hover { background: var(--accent-strong); }
.crm-save:disabled { opacity: .6; cursor: default; }
.crm-form { display: flex; flex-direction: column; gap: 18px; }
.crm-form[hidden] { display: none; }
.crm-field { display: flex; flex-direction: column; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.crm-label { padding: 0; font-size: 13px; font-weight: 600; color: var(--text-2); }
.crm-stages { display: flex; flex-wrap: wrap; gap: 6px; }
.crm-stage-opt { display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; border: 1px solid var(--border); border-radius: 999px;
  background: var(--surface); color: var(--text-2); font: 500 14px/1.2 var(--font); cursor: pointer;
  transition: background .15s, color .15s, border-color .15s; --stage-bg: var(--bg); --stage-fg: var(--text-2); }
.crm-stage-opt[data-stage="contacted"], .crm-stage-opt[data-stage="negotiation"] { --stage-bg: var(--accent-soft); --stage-fg: var(--accent-strong); }
.crm-stage-opt[data-stage="won"] { --stage-bg: var(--success-bg); --stage-fg: var(--success-fg); }
.crm-stage-opt[data-stage="lost"] { --stage-bg: var(--surface-muted); --stage-fg: var(--text-muted); }
.crm-stage-opt:hover { border-color: var(--accent); }
.crm-stage-opt[aria-checked="true"] { background: var(--stage-bg); color: var(--stage-fg); border-color: currentColor; font-weight: 600; }
.crm-stage-opt:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.crm-panel-title:focus { outline: none; }
.crm-panel-title:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
.crm-input { width: 100%; min-width: 0; min-height: 44px; padding: 10px 14px; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  background: var(--surface-muted); color: var(--text); font: 400 15px/1.4 var(--font); outline: none; transition: border-color .15s, box-shadow .15s, background .15s; }
.crm-input::placeholder { color: var(--text-faint); }
.crm-input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); background: var(--surface); }
.crm-input[aria-invalid="true"] { border-color: var(--danger-fg); }
.crm-notes { min-height: 96px; resize: vertical; }
.crm-step-row { display: grid; grid-template-columns: minmax(0, 200px) minmax(0, 1fr); gap: 8px; }
.crm-hint { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-faint); }
.crm-hint .icon { width: 13px; height: 13px; }
.crm-form-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; }
.crm-form-msg { font-size: 13px; color: var(--text-muted); }
.crm-form-msg.is-ok { color: var(--success-fg); }
.crm-form-msg.is-error { color: var(--danger-fg); }
.crm-journal[hidden] { display: none; }
.crm-journal { padding-top: 16px; border-top: 1px solid var(--border-soft); }
.crm-journal-title { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; font-size: 15px; font-weight: 700; }
.crm-journal-title .icon { color: var(--text-faint); }
.crm-journal-list { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.crm-journal-item { display: flex; flex-direction: column; gap: 2px; padding-left: 12px; border-left: 2px solid var(--border); }
.crm-journal-text { font-size: 14px; color: var(--text-2); overflow-wrap: anywhere; }
.crm-journal-time { font-size: 12px; color: var(--text-faint); }
.crm-journal-empty { font-size: 13px; color: var(--text-muted); }
.crm-close:focus-visible, .crm-retry:focus-visible, .crm-save:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@keyframes crm-panel-in { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes crm-sheet-in { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (max-width: 768px) {
  .crm-panel { top: auto; left: 0; right: 0; bottom: 0; width: auto; max-height: 90vh; max-height: 90dvh;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0; animation-name: crm-sheet-in; }
  .crm-panel-head { padding: 16px 16px 12px; }
  .crm-panel-body { padding: 14px 16px calc(20px + env(safe-area-inset-bottom)); }
  .crm-close { width: 44px; height: 44px; }
  .crm-step-row { grid-template-columns: minmax(0, 1fr); }
  .crm-save { flex: 1 1 100%; }
  .crm-add-btn, .crm-open-btn { min-height: 40px; }
  .results-card .crm-action-col { display: none; }
  .crm-action-inline { display: block; margin-top: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .crm-panel { animation: none; }
  .crm-add-btn, .crm-stage-opt, .crm-input { transition: none; }
}

/* === Мини-CRM: страница «Мои клиенты» (clients.js) === */
.clients-page .results-table-wrap { position: relative; } /* .sr-only в таблице не раздвигает страницу */
.clients-export { height: 44px; }
.clients-export[hidden] { display: none; }
.clients-state-card { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; color: var(--text-muted); }
.clients-state-card[hidden] { display: none; }
.clients-error-text { margin: 12px 0 0; color: var(--danger-fg); }
.clients-stats .value { overflow-wrap: anywhere; }
.stat-sub { margin-top: 2px; font-size: 13px; font-weight: 500; color: var(--text-muted); }
.stat-sub.is-danger { color: var(--danger-fg); font-weight: 600; }
.clients-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 20px; }
.clients-grid > .results-card { min-width: 0; }

/* Сегодня и просрочено */
.today-list { display: flex; flex-direction: column; gap: 8px; max-height: 360px; overflow-y: auto; margin: 0; padding: 0; list-style: none; }
.today-item { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm); background: var(--surface-muted); }
.today-item.is-overdue { border-color: var(--danger-bg); background: var(--danger-bg); }
.today-open { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; flex: 1 1 auto; min-width: 0; padding: 0; border: 0; background: none;
  font: inherit; color: var(--text); text-align: left; cursor: pointer; }
.today-open:hover .today-title { color: var(--accent); }
.today-open:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 6px; }
.today-when { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 13px; font-weight: 600; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.today-item.is-overdue .today-when { color: var(--danger-fg); }
.today-flag { padding: 1px 8px; border-radius: 999px; background: var(--surface); color: var(--danger-fg); font-size: 12px; }
.today-title { font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.today-step { font-size: 13px; color: var(--text-muted); overflow-wrap: anywhere; }
.today-empty { padding: 12px 0; font-size: 14px; color: var(--text-muted); }

/* Этап — плашка (те же цвета, что в «Работе») */
.crm-pill { display: inline-flex; align-items: center; flex-shrink: 0; padding: 4px 10px; border: 1px solid var(--stage-border); border-radius: 999px;
  background: var(--stage-bg); color: var(--stage-fg); font: 600 12px/1.2 var(--font); white-space: nowrap;
  --stage-bg: var(--bg); --stage-fg: var(--text-2); --stage-border: var(--border); }
.crm-pill[data-stage="contacted"] { --stage-bg: var(--accent-soft); --stage-fg: var(--accent-strong); --stage-border: transparent; }
.crm-pill[data-stage="negotiation"] { --stage-bg: var(--accent-soft); --stage-fg: var(--accent-strong); --stage-border: var(--accent); }
.crm-pill[data-stage="won"] { --stage-bg: var(--success-bg); --stage-fg: var(--success-fg); --stage-border: transparent; }
.crm-pill[data-stage="lost"] { --stage-bg: var(--surface-muted); --stage-fg: var(--text-faint); --stage-border: var(--border-soft); }

/* Воронка: полоса пропорциональна количеству */
.funnel-list { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.funnel-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "label amount" "track track" "count count"; gap: 4px 12px; align-items: center;
  --bar: var(--accent); }
.funnel-row[data-stage="new"] { --bar: var(--text-faint); }
.funnel-row[data-stage="won"] { --bar: var(--success-fg); }
.funnel-row[data-stage="lost"] { --bar: var(--border); }
.funnel-label { grid-area: label; font-size: 14px; font-weight: 600; color: var(--text-2); }
.funnel-amount { grid-area: amount; font-size: 14px; font-weight: 600; color: var(--text); white-space: nowrap; font-variant-numeric: tabular-nums; }
.funnel-track { grid-area: track; display: block; height: 10px; border-radius: 999px; background: var(--surface-muted); box-shadow: inset 0 0 0 1px var(--border-soft); overflow: hidden; }
.funnel-fill { display: block; height: 100%; border-radius: 999px; background: var(--bar); }
.funnel-count { grid-area: count; font-size: 13px; color: var(--text-muted); font-variant-numeric: tabular-nums; }

/* Фильтры и таблица */
.clients-total { font-size: 14px; color: var(--text-muted); }
.clients-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin-bottom: 16px; }
.clients-field { position: relative; display: inline-flex; align-items: center; min-width: 0; color: var(--text-2); }
.clients-field > .icon-sm { position: absolute; left: 12px; color: var(--text-faint); pointer-events: none; }
.clients-field.count-select { margin-left: 0; }
.clients-field.count-select select { max-width: 240px; text-overflow: ellipsis; }
.clients-field-q { flex: 1 1 240px; }
.clients-field-city { flex: 0 1 180px; }
.clients-input { width: 100%; min-width: 0; height: 38px; padding: 0 12px 0 34px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface);
  font: 400 14px/1 var(--font); color: var(--text); outline: none; }
.clients-input::placeholder { color: var(--text-faint); }
.clients-input:focus-visible { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.clients-step-filter { color: var(--text-2); }
#filtersReset[hidden] { display: none; }
.clients-table td { vertical-align: top; }
.clients-table tbody tr[data-lead] { cursor: pointer; }
.clients-company { min-width: 180px; max-width: 280px; }
.clients-company .company-open { font-weight: 600; }
.clients-sub { display: block; margin-top: 2px; font-size: 12px; color: var(--text-muted); overflow-wrap: anywhere; }
.clients-amount { white-space: nowrap; font-weight: 600; font-variant-numeric: tabular-nums; }
.clients-step { min-width: 160px; }
.clients-search { min-width: 140px; max-width: 220px; }
.clients-search a { color: var(--accent); overflow-wrap: anywhere; }
.clients-muted { color: var(--text-faint); }
.clients-state { padding: 32px 16px; }
.clients-pager { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 16px; }
.clients-pager[hidden] { display: none; }
.clients-pager .row-btn:disabled { opacity: .5; cursor: default; }
.clients-page-info { font-size: 14px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
@media (max-width: 1100px) { .clients-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) {
  .clients-export { justify-content: center; }
  .clients-stats .result-stat { flex-direction: column; align-items: flex-start; }
  .clients-stats .value { font-size: 19px; }
  .clients-filters { flex-direction: column; align-items: stretch; }
  .clients-field, .clients-field-q, .clients-field-city { flex: 0 0 auto; width: 100%; }
  .clients-field.count-select select { width: 100%; max-width: none; height: 44px; font-size: 16px; } /* iOS не увеличивает страницу */
  .clients-input { height: 44px; font-size: 16px; }
  .today-item { flex-direction: column; }
}

/* История: «Показать ещё» (F2) */
.history-more { display: flex; justify-content: center; padding: 16px; }
.history-more[hidden] { display: none; }
.prof-actions[hidden] { display: none; }
.prof-card .form-group[hidden], .prof-card .prof-text[hidden] { display: none; }