/*
 * W3.7: CSS-consolidation notes
 * -----------------------------------------------------------------------------
 *  - Все исторические `root-блоки` объединены в один (см. строку 130). Порядок
 *    объявлений сохранён, поэтому каскад «later wins» эквивалентен исходному.
 *  - 22 `!important` сохранены умышленно. Их роли (упорядочено по группам):
 *      1) `.hidden { display:none !important }` — утилитарный класс, кото-
 *         рому *необходимо* перебить любые inline / specificity-сильные стили.
 *      2) Hotfix-блок dark-theme (~ строки 1267, 1276): перебивают defaults из
 *         «menu redesign» секции для appShell в dark-cascade.
 *      3) `@media (prefers-reduced-motion)` блок (~1471-1474): рекомендованный
 *         MDN паттерн — `!important` нужен, чтобы перебить любые анимации,
 *         в т.ч. вендорные / inline.
 *      4) `[data-integration-filter] :not(...)` (~531): перебивает inline
 *         display: block, который ставит JS при render.
 *      5) Auto-fill overrides для input/select (~1809-1837): браузеры
 *         применяют autofill через inline стили высокой specificity.
 *      6) `[hidden]` overrides на `.team-invite-*` (~1959-2092): нужны для
 *         перебивания `display:flex` /  `display:grid` родителя.
 *      7) `.ap-mini-grid[hidden]` — `.ap-mini-grid { display:grid }` иначе
 *         перебивает HTML `hidden` и показывает нули портфеля вместе с hint.
 *      8) `[data-an-staff-only][hidden]` / `.an-illiquid[hidden]` — flex сетки
 *         иначе показывает неликвид ЛПР.
 *  Любое НОВОЕ `!important` должно сопровождаться комментарием с обоснованием.
 */
/* Self-hosted Jost and Inter (OFL). Same family names as the cabinet already uses. */
@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/pwa/static/fonts/jost-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/pwa/static/fonts/jost-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/pwa/static/fonts/inter-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/pwa/static/fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
*{box-sizing:border-box}
/* Резервируем место под вертикальный скроллбар, чтобы контент не «ездил»
   по горизонтали при переключении между короткими и длинными вкладками. */
html{scrollbar-gutter:stable;background-color:#060d1c;min-height:100%;min-height:-webkit-fill-available;min-height:100dvh}
body{font-family:Arial,sans-serif;margin:0;background:#f7f8fc;color:#1f2937}
.wrap{max-width:1180px;margin:0 auto;padding:16px}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:14px;margin-bottom:12px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.hero{background:linear-gradient(135deg,#f5f3ff,#eef2ff);border-color:#ddd6fe}
button{padding:9px 13px;cursor:pointer;border-radius:10px;border:1px solid #d1d5db;background:#fff}
button:hover{opacity:.95}
pre{white-space:pre-wrap}
.danger{background:#fee2e2;border:1px solid #ef4444}
.primary{background:#6d28d9;color:#fff;border:1px solid #6d28d9}
.line{display:flex;gap:8px;flex-wrap:wrap}
.acc{display:flex;gap:12px;align-items:center}
.acc img{width:46px;height:46px;border-radius:50%;object-fit:cover;background:#ddd}
input,select{padding:9px;border:1px solid #d1d5db;border-radius:10px;min-height:38px}
label{font-size:12px;color:#374151}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.shell-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:12px}
.tabs{display:flex;gap:8px;flex-wrap:wrap}
.tab-btn{background:#eef2ff;border:1px solid #c7d2fe}
.tab-btn.active{background:#6d28d9;color:#fff;border-color:#6d28d9}
.hidden{display:none !important}
.hint{font-size:13px;color:#667085;margin-top:8px;line-height:1.35}
.topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap}
.hero-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap}
.hero-copy{min-width:280px;flex:1 1 420px}
.hero-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.hero-actions button{white-space:nowrap}
.hello-title{font-size:20px;line-height:1.25;margin:0 0 6px 0;font-weight:700}
.hello-subtitle{font-size:13px;color:#667085;line-height:1.4;margin:0}
.topbar .line{justify-content:flex-end}
.topbar .line button{min-height:36px;padding:8px 12px}

/* Split Screen Login Styles */
.login-split{display:grid;grid-template-columns:1fr 1fr;min-height:500px;border-radius:16px;overflow:hidden;box-shadow:0 20px 40px rgba(0,0,0,0.1)}
.login-left{background:linear-gradient(135deg,#6d28d9 0%,#7c3aed 50%,#8b5cf6 100%);padding:48px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.login-left::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,0.1) 0%,transparent 70%);animation:pulse 15s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1);opacity:0.5}50%{transform:scale(1.1);opacity:0.8}}
.login-brand{color:#fff;position:relative;z-index:1}
.login-brand h2{font-size:32px;font-weight:700;margin:0 0 16px 0;line-height:1.2}
.login-brand p{font-size:16px;opacity:0.9;margin:0 0 32px 0;line-height:1.5}
.login-features{list-style:none;padding:0;margin:0}
.login-features li{color:#fff;opacity:0.85;padding:8px 0;display:flex;align-items:center;gap:10px;font-size:14px}
.login-features li::before{content:'✓';display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:rgba(255,255,255,0.2);border-radius:50%;font-size:12px;font-weight:bold}
.login-right{background:#fff;padding:48px;display:flex;flex-direction:column;justify-content:center}
.login-form-header{margin-bottom:32px}
.login-form-header h3{font-size:24px;font-weight:700;color:#111827;margin:0 0 8px 0}
.login-form-header p{font-size:14px;color:#6b7280;margin:0}
.login-form-actions{display:flex;flex-direction:column;gap:12px}
.login-form-actions .primary{width:100%;padding:14px 20px;font-size:16px;font-weight:600;justify-content:center;display:flex;align-items:center;transition:all 0.2s}
.login-form-actions .primary:hover{background:#5b21b6;transform:translateY(-1px);box-shadow:0 4px 12px rgba(109,40,217,0.3)}
.login-form-actions .secondary{width:100%;padding:14px 20px;font-size:16px;color:#4b5563;background:#f9fafb;border:1px solid #e5e7eb;justify-content:center;display:flex;align-items:center;transition:all 0.2s}
.login-form-actions .secondary:hover{background:#f3f4f6;border-color:#d1d5db}
.login-divider{text-align:center;margin:24px 0;position:relative}
.login-divider::before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:#e5e7eb}
.login-divider span{position:relative;background:#fff;padding:0 16px;color:#6b7280;font-size:13px}
.login-help{text-align:center;margin-top:24px}
.login-help p{font-size:13px;color:#6b7280;margin:0 0 12px 0}
.login-privacy{position:static;text-align:center;margin:16px 0 0;font-size:13px;line-height:1.4}
.login-privacy a{color:var(--fd-text-muted,#6b7280)}
.muted{font-size:12px;color:#6b7280}
.kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.kpi .it{border:1px solid #e5e7eb;border-radius:10px;padding:10px}
.kpi .tt{font-size:12px;color:#6b7280}
.kpi .vv{font-size:20px;font-weight:700}
.kpi .delta{font-size:12px;margin-top:4px}
.kpi .delta.up{color:#16a34a}
.kpi .delta.down{color:#dc2626}
.kpi .delta.muted{color:#9ca3af}
.analytics-filters{margin:8px 0 12px}
.analytics-filters .filter-row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 12px;
  align-items:end;
}
.analytics-filters label{
  display:flex;
  flex-direction:column;
  font-size:12px;
  color:#6b7280;
  min-width:0;
  width:100%;
}
.analytics-filters label > span{margin-bottom:4px}
.analytics-filters select,
.analytics-filters input{
  width:100%;
  box-sizing:border-box;
  padding:6px 8px;
  border:1px solid #e5e7eb;
  border-radius:8px;
  background:#fff;
  font-size:13px;
}
.analytics-filters .search-select{
  width:100%;
  max-width:none;
}
.analytics-filters .filter-actions{
  grid-column:1 / -1;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.analytics-breadcrumbs{font-size:13px;color:#475569;margin-bottom:8px}
.analytics-breadcrumbs a{cursor:pointer;text-decoration:underline}
.analytics-funnel{display:flex;flex-direction:column;gap:6px;margin:12px 0}
.funnel-row{display:grid;grid-template-columns:140px 1fr 220px;gap:8px;align-items:center}
.funnel-label{font-size:13px;color:#1f2937}
.funnel-bar{position:relative;height:14px;background:#f1f5f9;border-radius:8px;overflow:hidden}
.funnel-bar-fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,#3b82f6,#9333ea)}
.funnel-meta{font-size:12px;color:#1f2937;text-align:right}
.analytics-chart-wrap{margin:12px 0}
.analytics-chart{border:1px solid #e5e7eb;border-radius:10px;padding:6px;background:#fff}
.chart-legend{display:flex;gap:12px;font-size:12px;color:#475569;margin-top:6px}
.chart-legend .lg{display:inline-flex;align-items:center;gap:6px}
.chart-legend .lg::before{content:"";display:inline-block;width:10px;height:10px;border-radius:2px}
.chart-legend .lg-blue::before{background:#8eaae8}
.chart-legend .lg-green::before{background:#8faf96}
.chart-legend .lg-purple::before{background:#8C66FF}
.analytics-tabs .tabs{display:flex;gap:6px;border-bottom:1px solid #e5e7eb;margin:12px 0 6px}
.analytics-tabs .tab{background:transparent;border:none;padding:6px 10px;font-size:13px;color:#475569;cursor:pointer;border-bottom:2px solid transparent}
.analytics-tabs .tab.is-active{color:#1f2937;border-bottom-color:#2563eb;font-weight:600}
.analytics-status-table{margin-top:12px}
.analytics-detail-wrap{margin-top:16px}
.analytics-detail-wrap .line{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.analytics-detail-wrap .line-right{display:flex;gap:6px;align-items:center}
.btn.ghost,button.ghost{background:transparent;border:1px solid #e5e7eb;color:#1f2937}
.detail-card{border:1px solid #e5e7eb;border-radius:10px;padding:12px;background:#fff;margin:6px 0}
.kv-list{display:grid;grid-template-columns:140px 1fr;gap:6px 12px;font-size:13px}
.kv-list dt{color:#6b7280}
.kv-list dd{margin:0;color:#1f2937}
.status-chip{display:inline-block;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:600}
.status-chip.ok{background:#ecfdf3;color:#15803d}
.status-chip.warn{background:#fffbeb;color:#a16207}
.status-chip.err{background:#fef2f2;color:#b91c1c}
.status-chip.muted{background:#f3f4f6;color:#6b7280}
table{width:100%;border-collapse:collapse}
th,td{border-bottom:1px solid #e5e7eb;padding:8px;font-size:13px;text-align:left}
th{background:#fafafa}
.table-wrap{overflow:auto;max-width:100%}
.table-wrap table{min-width:620px}
.compact-table th,.compact-table td{white-space:nowrap}
.log-box{max-height:320px;overflow:auto;background:#0f172a;color:#e2e8f0;border-radius:10px;padding:10px;font-size:12px;line-height:1.4}
.pill{padding:2px 8px;border-radius:999px;border:1px solid #ddd;font-size:12px;display:inline-block}
.pill.ok{background:#dcfce7;border-color:#86efac}
.pill.bad{background:#fee2e2;border-color:#fca5a5}
.pill.na{background:#f3f4f6;border-color:#d1d5db;color:#6b7280}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:8px}
.caps{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.acct-list{display:grid;gap:8px;margin-top:10px}
.acct-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px;border:1px solid #e5e7eb;border-radius:12px;background:#fff}
.acct-meta{display:flex;align-items:center;gap:10px;min-width:0}
.acct-photo{position:relative;width:34px;height:34px;flex:0 0 34px}
.acct-photo img,.acct-photo .avatar-fallback{position:absolute;left:0;top:0}
.acct-meta img,.avatar-fallback{width:34px;height:34px;border-radius:50%;background:#e5e7eb;display:flex;align-items:center;justify-content:center;font-size:11px;color:#4b5563}
.acct-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.acct-remove-btn{padding:7px 10px}
.tg-open-help{margin-top:10px;padding:10px;border:1px dashed #c7d2fe;border-radius:12px;background:#f8fafc}
.tg-open-help .hint{margin-top:0}
/* =========================================
   CSS VARIABLES FOR MENU REDESIGN
   ========================================= */
:root {
  --bg-surface: #fff;
  --bg-light: #f8fafc;
  --border-color: #e5e7eb;
  --primary-color: #6d28d9;
  --text-primary: #1f2937;
  --text-secondary: #6b7280;
  --text-muted: #9ca3af;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-lg: 0 10px 15px rgba(0,0,0,0.1);
  --border-radius-md: 8px;
  --border-radius-lg: 14px;
  /* --- W3.7: merged blocks below; later wins per CSS cascade --- */
  --eds-primary: #2563eb;
  --eds-primary-hover: #1d4ed8;
  --eds-bg-app: #f8fafc;
  --eds-bg-surface: #ffffff;
  --eds-text-main: #0f172a;
  --eds-text-muted: #64748b;
  --eds-border: #e2e8f0;
  --eds-radius: 12px;
  --eds-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --eds-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
  --primary-color: var(--eds-primary);
  --bg-body: var(--eds-bg-app);
  --text-primary: var(--eds-text-main);
  /* --- W3.7: merged blocks below; later wins per CSS cascade --- */
  color-scheme: dark;
  --fd-bg-app: #0f172a;
  --fd-bg-surface: #111827;
  --fd-bg-elevated: #1b2436;
  --fd-bg-soft: #1f2c43;
  --fd-border: #2a3952;
  --fd-border-soft: #23324a;
  --fd-text-main: #edf3ff;
  --fd-text-muted: #a8b6cc;
  --fd-text-dim: #8091ad;
  --fd-accent: #60a5fa;
  --fd-accent-hover: #3b82f6;
  --fd-success: #22c55e;
  --fd-warn: #f59e0b;
  --fd-danger: #ef4444;
  --fd-radius-sm: 10px;
  --fd-radius-md: 14px;
  --fd-radius-lg: 18px;
  --fd-shadow-sm: 0 2px 8px rgba(2, 8, 23, 0.28);
  --fd-shadow-md: 0 18px 32px rgba(2, 8, 23, 0.42);
  /* --- W3.7: merged blocks below; later wins per CSS cascade --- */
  --eds-bg-app: #060d1c;
  --eds-bg-surface: #0e1729;
  --eds-bg-soft: #111e34;
  --eds-border: #25344d;
  --eds-text-main: #e6eefc;
  --eds-text-muted: #9fb0cc;
  /* --- W3.7: merged blocks below; later wins per CSS cascade --- */
  /* Новые бренд-токены (для использования напрямую там, где нужен явный
     бренд: hero CTA, фокус, glow). */
  --brand-violet: #8C66FF;
  --brand-violet-soft: #AF94FF;
  --brand-violet-deep: #6c4adb;
  --brand-orange: #FF8600;
  --brand-orange-deep: #FF5E00;
  --brand-red: #e30907;
  --brand-green: #8CC174;
  --brand-blue: #1576E5;
  --brand-faded: #A3A3A5;
  --brand-dark: #031024;
  --brand-dark-main: #03142c;
  --brand-dark-lighter: #142339;
  --brand-dark-soft: #1A293F;
  --brand-pale-gray: #243247;
  --brand-cite: #1D2C43;
  --brand-gradient: linear-gradient(137.93deg, #8C66FF 4.21%, #FF5E00 159.56%);
  --brand-gradient-vertical: linear-gradient(174.93deg, #8C66FF 4.21%, #FF5E00 159.56%);
  --brand-glow: 0 4px 29.4px rgba(140, 102, 255, 0.3);
  --brand-glow-strong: 0 9px 53.5px rgba(140, 102, 255, 0.48);
  --brand-font: 'Jost', 'Inter', "Segoe UI", Roboto, Arial, sans-serif;

  /* Переопределяем существующие --fd-* токены на бренд-эквиваленты.
     Все правила во всём CSS, использующие var(--fd-*), автоматически
     получают новые цвета. */
  --fd-bg-app: var(--brand-dark-main);
  --fd-bg-surface: var(--brand-dark-lighter);
  --fd-bg-elevated: var(--brand-dark-soft);
  --fd-bg-soft: var(--brand-pale-gray);
  --fd-border: var(--brand-cite);
  --fd-border-soft: #18253b;
  --fd-text-main: #ffffff;
  --fd-text-muted: var(--brand-faded);
  --fd-text-dim: #7e8a9d;
  --fd-accent: var(--brand-violet);
  --fd-accent-hover: var(--brand-violet-soft);
  --fd-success: var(--brand-green);
  --fd-warn: var(--brand-orange);
  --fd-danger: var(--brand-red);
  --fd-shadow-sm: 0 2px 10px rgba(3, 16, 36, 0.45);
  --fd-shadow-md: 0 14px 40px rgba(3, 16, 36, 0.55);

  /* Переопределяем --eds-* токены (legacy и hotfix r2). */
  --eds-bg-app: var(--brand-dark-main);
  --eds-bg-surface: var(--brand-dark-lighter);
  --eds-bg-soft: var(--brand-pale-gray);
  --eds-border: var(--brand-cite);
  --eds-text-main: #ffffff;
  --eds-text-muted: var(--brand-faded);
  --eds-primary: var(--brand-violet);
  --eds-primary-hover: var(--brand-violet-soft);
  --eds-shadow-sm: 0 2px 10px rgba(3, 16, 36, 0.45);
  --eds-shadow-md: 0 14px 40px rgba(3, 16, 36, 0.55);
  /* --- W3.7: merged blocks below; later wins per CSS cascade --- */
  --brand-ease: cubic-bezier(0.34, 1.0, 0.64, 1);
  --brand-transition: 220ms var(--brand-ease);
  --chart-line: #8C66FF;
  --chart-area: rgba(140, 102, 255, 0.10);
  --chart-grid: rgba(148, 163, 184, 0.35);
  --chart-axis: #94a3b8;
  --chart-label: #e2e8f0;
  --chart-dot-stroke: #121826;
  --chart-delta-good: #8fa394;
  --chart-delta-muted: #94a3b8;
  --chart-s1: #8eaae8;
  --chart-s2: #8faf96;
  --chart-s3: #8C66FF;
}
/* =========================================
   SIDEBAR MENU REDESIGN
   ========================================= */
.side-menu {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--bg-surface);
  border-radius: 0;
  box-shadow: none;
  border-right: 1px solid var(--border-color);
  padding: 0;
  overflow-y: auto;
  position: relative;
}
.side-menu-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border-color);
  background: var(--bg-surface);
  position: sticky;
  top: 0;
  z-index: 10;
}
.menu-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.02em;
}
.menu-profile {
  padding: 24px;
  background: linear-gradient(to bottom, #f8fafc, #ffffff);
  border-bottom: 1px solid var(--border-color);
}
.side-menu .acc {
  display: flex;
  align-items: center;
  gap: 12px;
}
.side-menu .acc-avatar-wrap {
  position: relative;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
}
.side-menu .acc-avatar-fallback {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #cbd5e1;
  color: #0f172a;
  font-weight: 600;
  font-size: 16px;
  border: 2px solid white;
  box-shadow: var(--shadow-sm);
}
.side-menu .acc-avatar {
  position: relative;
  z-index: 1;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  background: transparent;
  border: 2px solid white;
  box-shadow: var(--shadow-sm);
}
.side-menu .acc-info {
  flex: 1;
  min-width: 0;
}
.side-menu .acc-name {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--text-primary);
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.side-menu .acc-user {
  font-size: 0.8rem;
  color: var(--text-secondary);
  margin-bottom: 4px;
}
.side-menu .acc-role {
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--primary-color);
  background: #eff6ff;
  padding: 2px 8px;
  border-radius: 10px;
  display: inline-block;
}
.side-menu .caps {
  margin-top: 12px;
  font-size: 0.82rem;
  color: var(--text-secondary);
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
}
.side-menu .menu-block {
  padding: 16px 12px;
}
.side-menu .menu-section-title {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  margin: 0 12px 12px 12px;
}
.side-menu .menu-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  padding: 12px 16px;
  margin-bottom: 4px;
  background: transparent;
  border: none;
  border-radius: var(--border-radius-md);
  color: var(--text-secondary);
  font-size: 0.95rem;
  font-weight: 500;
  transition: all 0.2s ease;
  cursor: pointer;
  text-align: left;
}
.side-menu .menu-btn:hover {
  background: #f1f5f9;
  color: var(--text-primary);
}
.side-menu .menu-btn.active {
  background: #eff6ff;
  color: var(--primary-color);
  font-weight: 600;
}
.side-menu .btn-icon {
  margin-right: 12px;
  font-size: 1.1rem;
  width: 20px;
  text-align: center;
  display: inline-flex;
  justify-content: center;
}
.side-menu .btn-arrow {
  margin-left: auto;
  opacity: 0;
  transform: translateX(-5px);
  transition: all 0.2s ease;
  color: var(--text-muted);
}
.side-menu .menu-btn > span:not(.btn-icon) {
  display: inline-block;
  min-width: 0;
  white-space: nowrap;
}
.side-menu .menu-btn:hover .btn-arrow,
.tab-btn.active .btn-arrow {
  opacity: 1;
  transform: translateX(0);
}
.side-menu .side-menu-back, .side-menu .subnav-back {
  justify-content: flex-start;
  color: var(--text-secondary);
  font-size: 0.9rem;
  gap: 8px;
}
.side-menu .side-menu-back {
  display: none;
}
.side-menu .side-menu-back svg, .side-menu .subnav-back svg {
  width: 18px;
  height: 18px;
}
.side-menu .section-submenu {
  margin-left: 20px;
  padding-left: 12px;
  border-left: 2px solid #e2e8f0;
  margin-top: 4px;
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.side-menu .submenu-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 4px;
}
.side-menu .submenu-group.hidden {
  display: none;
}
.side-menu .submenu-group-title {
  padding: 8px 16px 2px;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--text-secondary);
  opacity: 0.85;
  pointer-events: none;
}
.side-menu .submenu-group .submenu-btn {
  padding-left: 22px;
}
.side-menu .submenu-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  background: transparent;
  border: none;
  border-radius: 6px;
  text-align: left;
  font-size: 0.85rem;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.2s;
}
.side-menu .submenu-btn > span:first-child {
  min-width: 0;
}
.side-menu .menu-counter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6em;
  padding: 0 0.45em;
  border-radius: 999px;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1.2;
  color: #1d4ed8;
  background: #dbeafe;
  border: 1px solid #bfdbfe;
  margin-left: 8px;
  flex-shrink: 0;
  vertical-align: middle;
}
.side-menu .submenu-btn:hover {
  background: #f8fafc;
  color: var(--primary-color);
  padding-left: 20px;
}
.term-checks {
  gap: 10px;
}
.term-checks label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #475569;
  background: #fff;
  border: 1px solid var(--eds-border);
  border-radius: 999px;
  padding: 6px 10px;
}
.term-checks input[type="checkbox"] {
  min-height: 0;
}
.side-menu .menu-subnav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: #f8fafc;
  border-radius: var(--border-radius-md);
  margin-bottom: 12px;
  border: 1px solid var(--border-color);
}
.side-menu .menu-subnav-title {
  font-weight: 600;
  color: var(--text-primary);
  font-size: 0.9rem;
}
.side-menu .settings-block {
  margin-top: auto;
  border-top: 1px solid var(--border-color);
  background: #f8fafc;
}
.mobile-menu-toggle {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--primary-color);
  color: white;
  border: none;
  box-shadow: var(--shadow-lg);
  z-index: 998;
  align-items: center;
  justify-content: center;
}
.app-header{position:relative}
.header-greeting{font-size:18px;font-weight:700;line-height:1.25}
.settings-subtabs{display:flex;gap:6px;flex-wrap:wrap}
.side-menu .settings-subtabs .menu-btn{flex:1 1 calc(50% - 6px);text-align:center}
.settings-section{border:1px solid #e5e7eb;border-radius:10px;padding:8px;background:#fff}
.integrations-page-head{margin-bottom:10px}
.integrations-page-head-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.integrations-page-intro{margin:4px 0 0}
.integrations-toolbar{display:flex;align-items:flex-end;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.integrations-hub{margin-bottom:4px}
.integration-hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.integration-hub-card{border:1px solid #e5e7eb;border-radius:12px;padding:16px;background:#f9fafb;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.integration-hub-title{font-weight:600;font-size:16px;color:#111827}
.integration-hub-status{font-size:13px;line-height:1.35}
.integration-hub-status.is-ready{color:#059669}
.integration-hub-status.is-partial{color:#b45309}
.integration-hub-status.is-not_configured{color:#6b7280}
.integration-hub-status.is-disabled{color:#6b7280}
.integrations-intro{margin-bottom:8px}
.integrations-list{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.integrations-list--main{margin-top:0;max-width:720px}
#integrationsList.integration-detail-filter--onec .integration-card:not([data-integration-kind="onec"]),
#integrationsList.integration-detail-filter--digital_kassa .integration-card:not([data-integration-kind="digital_kassa"]){display:none!important}
.integration-card{border:1px solid #e5e7eb;border-radius:10px;padding:10px;background:#f9fafb}
.integration-card-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.integration-title{font-weight:600;font-size:14px;color:#111827}
.integration-status{font-size:12px}
.integration-status.is-ready{color:#059669}
.integration-status.is-partial{color:#b45309}
.integration-status.is-not_configured{color:#6b7280}
.integration-status.is-disabled{color:#6b7280}
.integration-form{display:flex;flex-direction:column;gap:6px;margin-top:8px;padding-top:8px;border-top:1px dashed #e5e7eb}
.integration-form label{font-size:12px;color:#374151}
.integration-form input,.integration-form select{padding:6px 8px;font-size:13px;border:1px solid #d1d5db;border-radius:8px;background:#fff}
.switch-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0}
.switch-label{font-size:13px;color:#1f2937}
.switch-control{position:relative;display:inline-block;width:42px;height:24px}
.switch-control input{opacity:0;width:0;height:0}
.switch-slider{position:absolute;cursor:pointer;inset:0;background:#d1d5db;border-radius:999px;transition:.2s}
.switch-slider:before{position:absolute;content:'';height:18px;width:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.switch-control input:checked + .switch-slider{background:#6d28d9}
.switch-control input:checked + .switch-slider:before{transform:translateX(18px)}
.workers-status{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;background:#e5e7eb;color:#374151}
.workers-status.is-ok{background:#ecfdf3;color:#047857}
.workers-status.is-error{background:#fef2f2;color:#b91c1c}
.workers-status.is-timeout{background:#fffbeb;color:#b45309}
.workers-status.is-none{background:#e5e7eb;color:#6b7280}
.health-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin:8px 0 12px}
.health-card{border:1px solid rgba(148,163,184,.35);border-radius:12px;padding:10px 12px;background:rgba(15,23,42,.35)}
.health-card-title{font-size:11px;opacity:.75;margin-bottom:4px}
.health-card-value{font-size:15px;font-weight:650;line-height:1.25}
.health-card-detail{font-size:11px;opacity:.7;margin-top:4px}
.health-card.is-ok{border-color:rgba(16,185,129,.45)}
.health-card.is-warn{border-color:rgba(245,158,11,.55)}
.health-card.is-bad{border-color:rgba(239,68,68,.6)}
.health-alerts-title{font-size:12px;font-weight:600;margin-bottom:4px}
.health-alert{font-size:12px;padding:4px 0;border-bottom:1px solid rgba(148,163,184,.2)}
.health-alert.is-bad{color:#f87171}
.health-alert.is-warn{color:#fbbf24}
#workersMetricsBody td{font-size:12px;vertical-align:top}
#workersMetricsBody td.workers-error-cell{max-width:280px;color:#b91c1c;word-break:break-word}
.task-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.task-btn{background:#f8fafc}
.feedback{padding:10px;border-radius:10px;border:1px solid #e5e7eb;background:#f9fafb;font-size:13px;line-height:1.4;margin:8px 0}
.feedback.ok{background:#ecfdf3;border-color:#86efac}
.feedback.error{background:#fef2f2;border-color:#fca5a5}
.feedback.warn{background:#fffbeb;border-color:#fcd34d}
@media (max-width:1024px){.wrap{padding:12px} .grid{grid-template-columns:repeat(2,minmax(0,1fr))} .kpi{grid-template-columns:repeat(2,minmax(0,1fr))} .hello-title{font-size:18px} .hero-actions{justify-content:flex-start} .topbar .line{justify-content:flex-start}}
@media (min-width:769px) and (max-width:900px){.shell-layout{grid-template-columns:1fr} .side-menu{position:fixed;left:0;top:0;bottom:0;width:min(72vw,340px);transform:translateX(-110%);transition:transform .22s ease;z-index:80;overflow:auto} body.menu-open .side-menu{transform:translateX(0)} .side-menu-head{display:flex} .content-col{transition:transform .22s ease} body.menu-open .content-col{transform:translateX(220px)} .mobile-menu-toggle{display:inline-flex;position:fixed;right:12px;top:12px;z-index:90}}
@media (max-width:768px){.shell-layout{grid-template-columns:1fr} .app-header{position:sticky;top:0;z-index:70} .mobile-menu-toggle{display:inline-flex} .side-menu{position:fixed;left:0;right:0;top:0;bottom:0;width:100vw;height:100dvh;transform:translateX(-110%);transition:transform .2s ease;z-index:85;overflow:auto;border-radius:0} body.menu-open .side-menu{transform:translateX(0)} body.menu-open{overflow:hidden} .side-menu-head{display:flex}}
@media (max-width:900px){.side-menu .side-menu-back{display:inline-flex}}
@media (max-width:768px){.card{padding:12px} .grid{grid-template-columns:1fr} .kpi{grid-template-columns:1fr 1fr} .line button{flex:1 1 calc(50% - 8px)} .topbar{flex-direction:column} .app-header .topbar{flex-direction:row;align-items:center} .app-header .line{width:auto;justify-content:flex-end} .hero-head{flex-direction:column} .hero-copy{min-width:0;flex:1 1 auto} .hero-actions{width:100%} .hero-actions button{flex:1 1 calc(50% - 8px)} .acct-item{flex-direction:column;align-items:stretch} .acct-name{max-width:100%} .table-wrap table{min-width:560px} th,td{font-size:12px;padding:6px} .partners-table th:nth-child(3),.partners-table td:nth-child(3),.partners-table th:nth-child(6),.partners-table td:nth-child(6),.partners-table th:nth-child(7),.partners-table td:nth-child(7){display:none}}
@media (max-width:560px){.table-wrap table.mobile-stack{min-width:0;width:100%;border:0} .table-wrap table.mobile-stack thead{display:none} .table-wrap table.mobile-stack tbody,.table-wrap table.mobile-stack tr,.table-wrap table.mobile-stack td{display:block;width:100%} .table-wrap table.mobile-stack tr{border:1px solid #e5e7eb;border-radius:10px;padding:6px;margin-bottom:8px;background:#fff} .table-wrap table.mobile-stack td{border:0;padding:4px 8px} .table-wrap table.mobile-stack td::before{content:attr(data-label);display:block;font-size:11px;color:#6b7280;margin-bottom:2px}}
@media (max-width:480px){.wrap{padding:10px} .kpi{grid-template-columns:1fr} .line button{flex:1 1 100%} .tabs .tab-btn{width:100%}}

/* Split Screen Responsive */
@media (max-width:900px){.login-split{grid-template-columns:1fr} .login-left{padding:32px;min-height:200px} .login-brand h2{font-size:24px} .login-brand p{font-size:14px} .login-features{display:none}}
@media (max-width:560px){.login-split{border-radius:12px} .login-left{padding:24px} .login-right{padding:24px} .login-form-header h3{font-size:20px} .login-form-actions .primary,.login-form-actions .secondary{padding:12px 16px;font-size:14px}}

/* =========================================
   EDSOFA CLEAN BUSINESS (COMPAT LAYER)
   ========================================= */
/* W3.7: :root block merged upward (see top of file). */

#appBootstrap.app-bootstrap {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--eds-bg-app, #060d1c);
  color: var(--eds-text-main, #e6eefc);
}

#appBootstrap .app-bootstrap-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 24px;
  text-align: center;
  max-width: 320px;
}

#appBootstrap .app-bootstrap-logo-wrap {
  position: relative;
  width: 88px;
  height: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#appBootstrap .app-bootstrap-logo-wrap--svg {
  width: auto;
  height: auto;
  margin-bottom: 4px;
}

#appBootstrap .app-bootstrap-logo {
  width: 72px;
  height: 72px;
  border-radius: 18px;
  object-fit: cover;
  box-shadow: var(--eds-shadow-md, 0 14px 40px rgba(3, 16, 36, 0.55));
  animation: app-bootstrap-breathe 2.4s ease-in-out infinite;
}

#appBootstrap .app-bootstrap-logo-svg {
  height: 36px;
  width: auto;
  display: block;
  animation: app-bootstrap-breathe 2.4s ease-in-out infinite;
  filter: drop-shadow(0 0 18px rgba(140, 102, 255, 0.5));
}

#appBootstrap .app-bootstrap-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: var(--eds-primary, #7c3aed);
  border-right-color: rgba(124, 58, 237, 0.35);
  animation: app-bootstrap-spin 1.1s linear infinite;
}

#appBootstrap .app-bootstrap-title {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

#appBootstrap .app-bootstrap-status {
  font-size: 14px;
  color: var(--eds-text-muted, #9fb0cc);
  min-height: 1.4em;
}

#appBootstrap .app-bootstrap-progress {
  width: min(240px, 70vw);
  height: 3px;
  border-radius: 999px;
  background: var(--eds-border, #25344d);
  overflow: hidden;
}

#appBootstrap .app-bootstrap-progress-bar {
  display: block;
  width: 40%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, var(--eds-primary, #7c3aed), transparent);
  animation: app-bootstrap-shimmer 1.4s ease-in-out infinite;
}

@keyframes app-bootstrap-breathe {
  0%, 100% { transform: scale(1); opacity: 0.92; }
  50% { transform: scale(1.04); opacity: 1; }
}

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

@keyframes app-bootstrap-shimmer {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(320%); }
}

body.app-bootstrapping {
  overflow: hidden;
}

#appShell.app-shell.bootstrapping .menu-block .tab-btn,
#appShell.app-shell.bootstrapping .work-card {
  visibility: hidden;
  opacity: 0;
}

#appShell.app-shell {
  background: var(--eds-bg-app);
}

#appShell .layout-grid {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 12px;
  min-height: calc(100vh - 220px);
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  align-items: start;
}

#appShell .side-menu {
  width: 280px;
  border-right: 1px solid var(--eds-border);
  background: var(--eds-bg-surface);
  box-shadow: none;
  border-radius: var(--eds-radius);
  flex-shrink: 0;
  overflow-y: auto;
  z-index: 95;
}

#appShell .main-content {
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

/* ── Header topbar layout ── */
#appShell .app-header .topbar {
  align-items: center;
}

#appShell .app-header .header-topbar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0;
}

#appShell .app-header .pwa-site-logo {
  flex: 0 0 auto;
  height: 28px;
  width: auto;
  display: block;
  order: 1;
}

#appShell .app-header .header-greeting-group {
  order: 2;
  margin-left: auto;
  text-align: right;
  line-height: 1.35;
}

#appShell .app-header .header-greeting {
  font-size: 14px;
  opacity: .8;
  font-weight: 600;
}

#appShell .app-header .header-workspace {
  font-size: 12px;
  opacity: .55;
}

#appShell .app-header .header-workspace-switch {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  margin-top: 4px;
}

#appShell .app-header .ws-chip {
  border: 1px solid var(--eds-border);
  background: transparent;
  color: var(--eds-text-muted);
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 12px;
  line-height: 1.3;
  cursor: pointer;
}

#appShell .app-header .ws-chip.is-active {
  border-color: var(--eds-primary);
  color: var(--eds-text-main);
  background: var(--eds-bg-soft, transparent);
}

.tk-op-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
}

.tk-op-card {
  border: 1px solid var(--eds-border);
  border-radius: var(--eds-radius);
  background: var(--eds-bg-surface);
  padding: 12px;
}

.tk-op-card.is-open {
  border-color: var(--eds-primary);
}

#appShell .tk-op-card__toggle,
.tk-op-card__toggle {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  font: inherit;
  box-shadow: none;
  border-radius: 0;
}

#appShell .tk-op-card__toggle:hover,
.tk-op-card__toggle:hover {
  background: transparent;
  border: 0;
  box-shadow: none;
  opacity: 1;
}

#appShell .tk-op-card__toggle:hover .tk-op-card__no,
#appShell .tk-op-card__toggle:hover .tk-op-card__hint,
.tk-op-card__toggle:hover .tk-op-card__no,
.tk-op-card__toggle:hover .tk-op-card__hint {
  color: var(--eds-primary);
}

.tk-op-card__head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
  justify-content: space-between;
}

.tk-op-card__no {
  font-weight: 700;
}

.tk-op-card__hint {
  font-size: 12px;
  font-weight: 500;
  color: var(--eds-text-muted);
}

.tk-op-card__meta {
  color: var(--eds-text-muted);
  font-size: 13px;
  margin-top: 6px;
}

.tk-op-card__body {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--eds-border);
  font-size: 14px;
}

.tk-op-card__body[hidden] {
  display: none;
}

.tk-op-card__body p {
  margin: 0 0 8px;
}

.tk-op-card__body img,
.tk-op-card__body video,
#tkDetail img,
#tkDetail video {
  display: block;
  max-width: 240px;
  width: 100%;
  height: auto;
  margin-top: 6px;
  border-radius: var(--eds-radius);
}

.tk-op-card__body img.tk-file:not([src]),
#tkDetail img.tk-file:not([src]) {
  display: none;
}

.tk-op-card__body audio,
#tkDetail audio {
  display: block;
  max-width: 240px;
  width: 100%;
  margin-top: 6px;
}

.tk-create-files {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.tk-create-files li {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 8px;
}

.tk-op-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.tk-op-card__actions.lean-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
@media (max-width: 720px) {
  .tk-op-card__actions.lean-actions {
    grid-template-columns: 1fr;
  }
  .tk-op-card__actions.lean-actions > .primary {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 42px;
  }
  .tk-op-card__actions.lean-actions > .secondary,
  .tk-op-card__actions.lean-actions > .menu-btn.secondary,
  .tk-op-card__actions.lean-actions > a.menu-btn {
    min-height: 42px;
  }
  .tk-op-card__actions.lean-actions:has(> :nth-child(2)) {
    grid-template-columns: 1fr 1fr;
  }
  .tk-op-card__actions.lean-actions:has(> :nth-child(2)) > .primary {
    grid-column: 1 / -1;
  }
}

.tk-duty-card {
  margin-top: 12px;
  border: 1px solid var(--eds-border);
  border-radius: var(--eds-radius);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 420px;
}

.tk-duty-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
}

.tk-op-action {
  margin-top: 16px;
  border: 1px solid var(--eds-border);
  border-radius: var(--eds-radius);
  padding: 14px;
}

.tk-op-action label {
  display: block;
  margin-top: 8px;
}

.is-partner-blocked {
  display: none;
}

.tk-op-action-backdrop {
  position: fixed;
  inset: 0;
  z-index: 79;
  background: rgba(11, 18, 32, 0.45);
}

#tkOpActionPanel.tk-op-action--sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 80;
  max-height: 85vh;
  overflow: auto;
  margin: 0;
  border-radius: 16px 16px 0 0;
  padding: 16px 16px calc(16px + env(safe-area-inset-bottom));
  background: var(--cabinet-surface, var(--eds-bg-surface, #fff));
  color: var(--cabinet-text, inherit);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.25);
}

#appShell .app-header .mobile-menu-toggle {
  order: 3;
}

/* ── Mobile header ── */
@media (max-width: 768px) {
  #appShell .app-header .header-topbar {
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
  }

  #appShell .app-header .pwa-site-logo {
    order: 1;
    flex: 0 0 auto;
  }

  #appShell .app-header .mobile-menu-toggle {
    order: 2;
    margin-left: auto;
  }

  #appShell .app-header .header-greeting-group {
    order: 3;
    width: 100%;
    margin-left: 0;
    text-align: left;
    margin-top: 6px;
  }
}

#appShell .card.work-card {
  padding: 0 14px 14px;
}

#appShell .work-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  border-bottom: 1px solid var(--eds-border);
}

#appShell .work-card-head > h3,
#appShell .card.work-card > h3 {
  margin: 0;
  min-height: 52px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--eds-border);
  flex: 1 1 auto;
  min-width: 0;
}

#appShell .work-card-head > h3 {
  min-height: 0;
  border-bottom: none;
}

#appShell .work-card-head > .toolbar {
  margin: 0;
  flex: 0 0 auto;
}

#appShell .app-header .line {
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

#appShell .content-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  /* auto: иначе stable резервирует ~15px справа и work-card уже content-scroll */
  scrollbar-gutter: auto;
  padding: 0 0 20px;
}

#appShell .side-menu-head {
  padding: 0 16px;
  min-height: 52px;
}

#appShell .menu-profile {
  padding-top: 16px;
}

#appShell .apps-create-flow {
  display: grid;
  gap: 10px;
}

#appShell .apps-step {
  padding: 12px;
  border: 1px solid var(--eds-border);
  border-radius: 10px;
  background: #fcfdff;
}

#appShell .apps-step-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
/* A long <option> is the cell's min-content. Without min-width: 0 the
   select grows past the card and the label runs off the right edge. */
#appShell .apps-step-row > * {
  min-width: 0;
}
#appShell .apps-step-row select {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#appShell .apps-step label {
  display: block;
  margin-bottom: 6px;
}

#appShell .apps-static-value {
  padding: 10px 12px;
  border: 1px solid var(--eds-border);
  border-radius: 10px;
  background: #fff;
  font-weight: 600;
}

#appShell .apps-create-result {
  margin-top: 8px;
  padding: 12px;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #eff6ff;
}

#appShell .apps-result-title {
  font-weight: 700;
  color: #1d4ed8;
}

#appShell .apps-result-meta {
  margin-top: 6px;
  font-size: 13px;
  color: var(--eds-text-main);
}

#appShell tr.links-row-highlight {
  background: #fffbeb;
  box-shadow: inset 0 0 0 2px #f59e0b;
}

#appShell .menu-btn {
  position: relative;
}

#appShell .menu-btn.active {
  background: #eff6ff;
  color: var(--eds-primary);
  font-weight: 600;
}

#appShell .menu-btn.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 24px;
  background: var(--eds-primary);
  border-radius: 0 4px 4px 0;
}

#appShell .btn-arrow {
  transition: transform 0.2s ease, opacity 0.2s ease;
}

#appShell .menu-btn[aria-expanded="true"] .btn-arrow {
  transform: rotate(90deg);
  opacity: 1;
}

#appShell .menu-overlay {
  position: fixed;
  inset: 0;
  background: rgb(15 23 42 / 0.35);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 90;
}

#appShell .menu-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

#appShell .table-wrap table,
#appShell .data-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--eds-bg-surface);
}

@media (max-width: 768px) {
  /* Одна колонка на всю ширину: fixed side-menu не должен оставлять «дырку» справа. */
  #appShell .layout-grid {
    display: block;
    min-height: 0;
    width: 100%;
  }

  #appShell .main-content,
  #appShell .content-scroll,
  #appShell .content-col,
  #appShell .card.work-card {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  #appShell .mobile-menu-toggle {
    display: inline-flex;
    position: static;
    top: auto;
    right: auto;
    left: auto;
    bottom: auto;
    z-index: auto;
    width: auto;
    height: 38px;
    border-radius: 10px;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 600;
    box-shadow: var(--eds-shadow-sm);
    margin: 0;
  }

  #appShell .side-menu {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(82vw, 320px);
    max-width: 320px;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    box-shadow: var(--eds-shadow-md);
    /* вне потока — иначе flex/grid резервирует колонку под скрытое меню */
    margin: 0;
  }

  #appShell .side-menu.open {
    transform: translateX(0);
  }

  #appShell .content-scroll {
    padding-top: 16px;
  }

  #appShell .table-wrap table {
    min-width: 0;
  }

  #appShell .apps-step-row {
    grid-template-columns: minmax(0, 1fr);
  }

  #appShell .table-wrap table,
  #appShell .data-table,
  #appShell .table-wrap tbody,
  #appShell .table-wrap tr,
  #appShell .table-wrap td {
    display: block;
    width: 100%;
  }

  #appShell .table-wrap thead {
    display: none;
  }

  #appShell .table-wrap tr {
    margin-bottom: 10px;
    padding: 10px;
    border: 1px solid var(--eds-border);
    border-radius: 10px;
    box-shadow: var(--eds-shadow-sm);
    background: var(--eds-bg-surface);
  }

  #appShell .table-wrap td {
    padding: 8px 8px 8px 44%;
    border: 0;
    border-bottom: 1px solid #f1f5f9;
    position: relative;
    text-align: right;
    min-height: 32px;
  }

  #appShell .table-wrap td:last-child {
    border-bottom: 0;
  }

  #appShell .table-wrap td[data-label]::before {
    content: attr(data-label);
    position: absolute;
    left: 8px;
    top: 8px;
    font-size: 12px;
    color: var(--eds-text-muted);
    font-weight: 600;
    text-align: left;
    max-width: 42%;
  }
}

/* Sticky sidebar только на широком десктопе; ≤1024 — оверлей. */
@media (min-width: 1025px) {
  #appShell .side-menu {
    position: sticky;
    top: 0;
    align-self: flex-start;
    max-height: 100vh;
  }
}

/* QR-login modals */
.pwa-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 10050;
  background: rgba(15, 23, 42, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  overflow-y: auto;
}
.pwa-modal-panel {
  position: relative;
  background: #fff;
  border-radius: 16px;
  padding: 20px 20px 22px;
  max-width: 420px;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
}
.pwa-modal-panel--wide {
  max-width: 520px;
}
.pwa-modal-title {
  margin: 0 0 12px 0;
  font-size: 20px;
}
.pwa-modal-close {
  /* C1: readable close — ≥44px hit, light icon on dark circle */
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid rgba(148, 163, 184, 0.38);
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.72);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  color: var(--cabinet-text, #f1f5f9);
  box-shadow: none;
}
.pwa-modal-body {
  margin-top: 8px;
  min-width: 0;
}
.pwa-qr-steps {
  margin: 0;
  padding-left: 20px;
  line-height: 1.45;
  font-size: 14px;
  color: #374151;
}
.pwa-qr-steps li {
  margin-bottom: 8px;
}
.pwa-qr-canvas-wrap {
  display: flex;
  justify-content: center;
  margin: 16px 0;
}
.pwa-otp-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: stretch;
  margin-top: 12px;
  min-width: 0;
}
.pwa-otp-row input {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
  font-size: 20px;
  letter-spacing: 0.12em;
  text-align: center;
}
.pwa-otp-row .primary {
  flex: 0 0 auto;
  min-width: 0;
}
@media (max-width: 520px) {
  .pwa-otp-row {
    flex-direction: column;
    align-items: stretch;
  }
  .pwa-otp-row .primary {
    width: 100%;
  }
}
.pwa-qr-url-input {
  flex: 1 1 180px;
  min-width: 0;
  font-size: 13px;
  padding: 10px 12px;
  border: 1px solid var(--eds-border, #e2e8f0);
  border-radius: 10px;
  background: #f8fafc;
  color: #0f172a;
}
.pwa-qr-fallback-row,
.pwa-qr-paste-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: stretch;
  margin-top: 10px;
}
.pwa-qr-fallback-actions {
  margin-top: 12px;
  justify-content: flex-start;
}
.pwa-qr-paste-title {
  margin-top: 16px;
  margin-bottom: 0;
}

/* =========================================
   FINTECH 2026 PREMIUM DARK (GLOBAL LAYER)
   ========================================= */
/* W3.7: :root block merged upward (see top of file). */
body {
  font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
  background: linear-gradient(180deg, #0b1220 0%, #0f172a 35%, #111827 100%);
  color: var(--fd-text-main);
}
.wrap { max-width: 1320px; }
.card,
#appShell .card,
#appShell .integration-card,
#appShell .integration-hub-card,
#appShell .detail-card,
#appShell .settings-section {
  background: var(--fd-bg-surface);
  border-color: var(--fd-border);
  box-shadow: var(--fd-shadow-sm);
}
.hero {
  background: linear-gradient(135deg, #111d38 0%, #0b1220 100%);
  border-color: var(--fd-border);
}
.hello-subtitle,
.muted,
.hint,
.kpi .tt,
label,
.analytics-breadcrumbs,
.chart-legend,
.kv-list dt {
  color: var(--fd-text-muted);
}
.kpi .vv,
.funnel-label,
.funnel-meta,
.kv-list dd,
.integration-title,
.integration-hub-title {
  color: var(--fd-text-main);
}
pre,
.log-box {
  background: var(--fd-bg-elevated);
  color: var(--fd-text-main);
  border: 1px solid var(--fd-border-soft);
}
button,
input,
select,
textarea {
  border-radius: var(--fd-radius-sm);
  border: 1px solid var(--fd-border);
  background: var(--fd-bg-elevated);
  color: var(--fd-text-main);
}
input::placeholder,
textarea::placeholder {
  color: var(--fd-text-dim);
}
button:hover {
  opacity: 1;
  border-color: #44608c;
  background: #202d45;
}
button:disabled,
button[aria-disabled="true"] {
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
}
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.3);
  border-color: var(--fd-accent);
}
.primary {
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
  border-color: #2563eb;
  color: #eff6ff;
}
.primary:hover {
  background: linear-gradient(180deg, #60a5fa 0%, #3b82f6 100%);
  border-color: #3b82f6;
}
.secondary,
button.secondary {
  background: #1f2b40;
  border-color: #3a4c6c;
  color: #e5efff;
}
.secondary:hover,
button.secondary:hover {
  background: #283754;
  border-color: #5673a6;
}
.ghost,
button.ghost {
  background: transparent;
  border-color: #334155;
  color: #c7d2fe;
}
.danger,
button.danger {
  background: #321622;
  border-color: #7f1d1d;
  color: #fecaca;
}
.feedback {
  border-radius: var(--fd-radius-sm);
  border-color: var(--fd-border);
  background: #18253b;
  color: var(--fd-text-main);
}
.feedback.ok {
  background: #0f2d24;
  border-color: #166534;
}
.feedback.error {
  background: #351824;
  border-color: #7f1d1d;
}
.feedback.warn {
  background: #3b2a0d;
  border-color: #92400e;
}
#uiFeedback {
  position: sticky;
  top: 10px;
  z-index: 40;
}
table,
#appShell .table-wrap table,
#appShell .data-table {
  background: transparent;
}
th,
#appShell th,
#appShell .table-wrap th,
#appShell .data-table th {
  background: var(--fd-bg-elevated);
  color: var(--fd-text-main);
  font-weight: 650;
}
th,
td {
  border-bottom-color: var(--fd-border-soft);
}
td {
  color: var(--fd-text-main);
}
.kpi .it {
  background: var(--fd-bg-elevated);
  border-color: var(--fd-border);
}
.table-wrap tbody tr:nth-child(even) {
  background: rgba(36, 50, 71, 0.38);
}
.pill,
.workers-status,
.status-chip {
  border-color: #334155;
}
.workers-status.is-none {
  color: var(--cabinet-text, #cbd5e1);
  background: #1e293b;
}
.switch-slider {
  background: #334155;
}
.switch-control input:checked + .switch-slider {
  background: var(--fd-accent);
}
.login-split {
  box-shadow: var(--fd-shadow-md);
}
.login-left {
  background: linear-gradient(140deg, #0f172a 0%, #0b2344 55%, #1e3a8a 100%);
}
.login-right {
  background: var(--fd-bg-surface);
}
/* Residual I-fix: desktop login is a full-bleed 50/50 split, not a floating card. */
@media (min-width: 901px) {
  #loginGate {
    position: fixed;
    inset: 0;
    z-index: 20;
    margin: 0;
    display: block;
  }
  #loginGate .login-split {
    width: 100%;
    max-width: none;
    height: 100%;
    min-height: 100%;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr auto 1fr;
  }
  #loginGate .login-left,
  #loginGate .login-right {
    display: grid;
    grid-row: 1 / -1;
    grid-template-rows: subgrid;
    align-items: center;
    justify-items: center;
    padding: 0 28px;
  }
  #loginGate .login-brand,
  #loginGate .login-panel {
    grid-row: 2;
    align-self: start;
    justify-self: center;
    width: 400px;
    max-width: 100%;
  }
  #loginGate .login-brand h2,
  #loginGate .login-form-header h3 {
    font-size: 30px;
    line-height: 1.2;
    font-weight: 700;
    margin: 0 0 8px;
  }
  #loginGate .login-brand p,
  #loginGate .login-form-header p {
    font-size: 14px;
    line-height: 1.45;
    margin: 0;
  }
  #loginGate .login-brand p,
  #loginGate .login-form-header {
    margin-bottom: 18px;
  }
  #loginGate .login-features {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin: 0;
  }
  #loginGate .login-features li {
    padding: 0;
    min-height: 0;
    align-items: center;
    white-space: nowrap;
  }
  #loginGate .login-features li::before {
    flex: 0 0 20px;
  }
  #loginGate .login-form-actions {
    gap: 12px;
  }
  #loginGate .login-divider {
    margin: 16px 0;
  }
  #loginGate .login-help {
    margin-top: 12px;
  }
  #loginGate .acct-list {
    margin-top: 0;
  }
}
.login-form-header h3,
.login-divider span,
.menu-title,
.header-greeting {
  color: var(--fd-text-main);
}
.login-form-header p,
.login-help p,
.login-divider span {
  color: var(--fd-text-muted);
}
.login-divider::before {
  background: var(--fd-border);
}
.login-divider span {
  background: var(--fd-bg-surface);
}
.side-menu,
#appShell .side-menu {
  background: var(--fd-bg-surface);
  border-right-color: var(--fd-border);
}
.side-menu .menu-profile {
  background: var(--fd-bg-elevated);
}
.side-menu .menu-btn:hover,
.side-menu .submenu-btn:hover {
  background: #15213a;
  color: #dbeafe;
}
.side-menu .menu-btn.active,
#appShell .menu-btn.active {
  background: #1e3354;
  color: #bfdbfe;
}
#appShell .menu-btn.active::before {
  background: #60a5fa;
}
.side-menu .menu-counter {
  color: #bfdbfe;
  background: #1e3a8a;
  border-color: #2563eb;
}
.side-menu .menu-subnav {
  background: var(--fd-bg-elevated);
  border-color: var(--fd-border);
}
.side-menu .settings-block {
  background: var(--fd-bg-elevated);
  border-top: 1px solid var(--fd-border);
}
.side-menu .menu-section-title {
  color: #8ea2c2;
}
.term-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--fd-border);
  border-radius: 999px;
  padding: 6px 10px;
  background: var(--fd-bg-elevated);
}
.term-chip input {
  min-height: 0;
}
.term-check-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.apps-step,
#appShell .apps-step {
  background: var(--fd-bg-elevated);
  border-color: var(--fd-border);
}
.apps-create-result,
#appShell .apps-create-result {
  background: #10233f;
  border-color: #274b77;
}
.apps-result-title,
#appShell .apps-result-title {
  color: #93c5fd;
}
.pwa-modal-panel {
  background: var(--fd-bg-surface);
  border: 1px solid var(--fd-border);
  box-shadow: var(--fd-shadow-md);
}
.pwa-modal-close {
  color: var(--cabinet-text, #f1f5f9);
}
.pwa-qr-steps {
  color: var(--cabinet-text, #cbd5e1);
}
.pwa-qr-url-input {
  background: var(--fd-bg-elevated);
  color: var(--fd-text-main);
  border-color: var(--fd-border);
}

/* ≤900: меню-оверлей, контент на всю ширину шапки (без резерва колонки под sidebar).
   Aligned with seller/desk chrome split (≥901 = persistent sidebar). */
@media (max-width: 900px) {
  #appShell .shell-layout.layout-grid,
  #appShell .layout-grid {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0;
  }

  #appShell .main-content,
  #appShell .content-scroll,
  #appShell .content-col,
  #appShell .card.work-card {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  #appShell .side-menu,
  #appShell .card.side-menu {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(82vw, 320px) !important;
    max-width: 320px !important;
    transform: translateX(-105%) !important;
    transition: transform 0.25s ease;
    margin: 0;
    z-index: 95;
  }

  body.menu-open #appShell .side-menu,
  body.menu-open #appShell .card.side-menu,
  #appShell .side-menu.open,
  #appShell .card.side-menu.open {
    transform: translateX(0) !important;
  }

  /* Classic ≤900 drawer toggle; seller/desk chrome uses bottom-nav (hide via Stage 1 L1 CSS). */
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) #appShell .mobile-menu-toggle {
    display: inline-flex !important;
  }

  /* Classic page is a stack of cards. In the installed app the viewport
     starts under the clock (viewport-fit=cover). Push the whole stack down
     so the header card keeps its shape, the way Safari's address bar does.
     Padding inside #shellHeroCard stretched the card under the status bar.
     Seller/desk chrome paints its own full-bleed header and is excluded. */
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) .wrap {
    padding-top: calc(12px + env(safe-area-inset-top, 0px));
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  }
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) #appShell .side-menu,
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) #appShell .card.side-menu {
    top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  #appShell .table-wrap table {
    min-width: 0;
  }

  /* старое правило сдвигало content-col при открытом меню — ломает ширину */
  body.menu-open #appShell .content-col,
  #appShell .content-col {
    transform: none !important;
  }
}
@media (max-width: 480px) {
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) .wrap {
    padding-top: calc(10px + env(safe-area-inset-top, 0px));
    padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  }
}
@media (display-mode: standalone) {
  html,
  body {
    min-height: calc(100dvh + env(safe-area-inset-top, 0px));
  }
}
@media (display-mode: standalone) and (max-width: 900px) {
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) #appShell .app-header {
    top: calc(12px + env(safe-area-inset-top, 0px));
  }
}
@media (display-mode: standalone) and (max-width: 480px) {
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) #appShell .app-header {
    top: calc(10px + env(safe-area-inset-top, 0px));
  }
}

/* Mobile: one consistent card-table pattern */
@media (max-width: 768px) {
  body {
    padding-bottom: env(safe-area-inset-bottom, 0);
  }
  #appShell .table-wrap td {
    padding: 9px 8px 9px 46%;
  }
  #appShell .table-wrap td[data-label]::before {
    color: #9fb2d3;
  }
  #appShell .table-wrap tr {
    background: var(--fd-bg-elevated);
    border-color: var(--fd-border);
  }
  .line button {
    min-height: 38px;
  }
  .kpi {
    grid-template-columns: 1fr;
  }
}

/* =========================================
   HOTFIX ROUND 2 (theme + desktop + overflow)
   ========================================= */
/* W3.7: :root block merged upward (see top of file). */

body {
  font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  background: radial-gradient(circle at 12% 8%, #152847 0%, #091326 42%, #060d1c 100%);
  color: var(--eds-text-main);
  min-height: 100%;
  min-height: -webkit-fill-available;
  min-height: 100dvh;
}

#appShell.app-shell {
  background: transparent;
}

#appShell .layout-grid {
  gap: 14px;
  min-height: calc(100vh - 168px);
  /* stretch: иначе main-content может сжаться по контенту и стать уже баннера/header */
  align-items: stretch;
}

#appShell .main-content {
  gap: 8px;
  min-width: 0;
  align-self: stretch;
}

#appShell .content-scroll,
#appShell .content-col {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

#appShell .content-scroll {
  padding: 0 0 12px;
}

#appShell .card.work-card {
  padding: 0 14px 12px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

#appShell .work-card-head {
  min-height: 46px;
}

#appShell .work-card-head > h3,
#appShell .card.work-card > h3 {
  min-height: 46px;
}

#appShell .work-card-head > h3 {
  min-height: 0;
}

#appShell .apps-step,
#appShell .apps-static-value {
  background: var(--fd-bg-elevated);
  border-color: var(--fd-border);
}

#appShell .apps-create-result {
  background: #10243f;
  border-color: #34598f;
}

#appShell tr.links-row-highlight {
  background: rgba(59, 130, 246, 0.14);
}

.menu-btn,
th,
td,
label,
.hint,
.muted {
  line-height: 1.45;
}

th,
td {
  font-size: 14px;
}

#appShell .menu-btn,
#appShell .submenu-btn {
  font-size: 14px;
}

#appShell .kpi .tt {
  font-size: 13px;
}

#appShell .kpi .vv {
  font-size: 22px;
}

#appShell .kpi .it {
  min-height: 86px;
}

#teamScopeLine {
  margin: 6px 0 10px;
  align-items: center;
}

#teamScopeLine label {
  min-width: 92px;
  color: var(--eds-text-muted);
}

#teamScopeLine select {
  max-width: 420px;
}

#appShell .links-table .links-url-cell {
  min-width: 260px;
}

#appShell .links-table .links-url-cell a {
  display: inline-block;
  max-width: min(100%, 420px);
  overflow-wrap: anywhere;
  word-break: break-word;
  vertical-align: middle;
}

#appShell .links-table .copy-link-btn {
  margin-left: 8px;
}

#appShell .links-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

@media (min-width: 1025px) {
  .wrap {
    padding: 14px 18px;
  }

  #shellHeroCard {
    margin-bottom: 8px;
  }

  #shellKpiCard {
    margin-bottom: 8px;
  }

  #appShell .layout-grid {
    min-height: calc(100vh - 154px);
  }
}

@media (max-width: 768px) {
  #teamScopeLine {
    flex-direction: column;
    align-items: stretch;
  }

  #teamScopeLine label {
    min-width: 0;
  }

  #appShell .links-table .links-url-cell a {
    max-width: 100%;
  }

  #appShell .links-table .copy-link-btn {
    margin: 6px 0 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* =========================================
   HOTFIX ROUND 3 (sidebar dark + pills + mobile + hide integrations)
   ========================================= */

#appShell .side-menu-head {
  background: var(--eds-bg-surface);
  border-bottom-color: var(--eds-border);
  color: var(--eds-text-main);
}
#appShell .menu-title {
  color: var(--eds-text-main);
}
#appShell .menu-profile {
  background: linear-gradient(180deg, #0e1729 0%, #0b1424 100%);
  border-bottom-color: var(--eds-border);
}
#appShell .menu-section-title {
  color: var(--eds-text-muted);
}
#appShell .acc-name {
  color: var(--eds-text-main);
}
#appShell .acc-user,
#appShell .acc-role {
  color: var(--eds-text-muted);
}

/* Pills: dark-friendly with explicit text color so they remain readable */
.pill {
  color: var(--eds-text-main);
  background: rgba(148, 163, 184, 0.16);
  border-color: var(--eds-border);
}
.pill.ok {
  background: rgba(34, 197, 94, 0.22);
  border-color: rgba(34, 197, 94, 0.55);
  color: #bbf7d0;
}
.pill.bad {
  background: rgba(239, 68, 68, 0.22);
  border-color: rgba(239, 68, 68, 0.55);
  color: #fecaca;
}
.pill.na {
  background: rgba(148, 163, 184, 0.18);
  border-color: rgba(148, 163, 184, 0.4);
  color: var(--cabinet-text, #cbd5e1);
}

/* Hide integrations section entirely (feature paused) */
#integrationsMenuSectionBtn,
.section-submenu[data-submenu="integrations"],
.tab-btn[data-tab="integrations"],
.submenu-btn[data-tab="integrations"],
.work-card[data-card="integrations"] {
  display: none !important;
}

/* Mobile card-table pattern: flex label/value, neat pills + actions */
@media (max-width: 768px) {
  #appShell .table-wrap tr {
    background: var(--eds-bg-surface);
    border: 1px solid var(--eds-border);
    border-radius: 12px;
    padding: 4px 12px;
    margin-bottom: 10px;
    box-shadow: var(--eds-shadow-sm, 0 2px 8px rgba(2, 8, 23, 0.28));
  }

  #appShell .table-wrap td {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid var(--eds-border);
    text-align: left;
    min-height: 0;
    position: static;
  }

  #appShell .table-wrap td:last-child {
    border-bottom: 0;
  }

  #appShell .table-wrap td[data-label]::before {
    content: attr(data-label);
    position: static;
    flex: 0 0 38%;
    max-width: 38%;
    color: var(--eds-text-muted);
    font-size: 12px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    text-align: left;
    padding: 0;
  }

  #appShell .table-wrap td > * {
    text-align: right;
  }

  /* Wrap the actual cell value in a flex column that hugs the right side */
  #appShell .table-wrap td > .cell-value,
  #appShell .table-wrap td .pill,
  #appShell .table-wrap td a,
  #appShell .table-wrap td button {
    align-self: flex-end;
  }

  #appShell .table-wrap td {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* Pills cluster inside any cell — line them up to the right */
  #appShell .table-wrap td .line,
  #appShell .table-wrap td > .cell-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
    flex: 1 1 auto;
  }

  #appShell .table-wrap td .pill {
    margin: 0;
  }

  /* Actions column: stacked buttons of equal width */
  #appShell .links-table .links-actions,
  #appShell .table-wrap td .row-team-remove-btn,
  #appShell .table-wrap td .toggle-link-btn,
  #appShell .table-wrap td .edit-link-btn {
    width: 100%;
  }

  #appShell .links-table .links-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: stretch;
    flex: 1 1 auto;
  }

  #appShell .links-table .links-actions > button {
    width: 100%;
  }

  /* Static links: URL cell on mobile — short label + copy button below */
  #appShell .links-table .links-url-cell {
    flex-wrap: wrap;
  }

  #appShell .links-table .links-url-cell a {
    display: inline-block;
    max-width: 100%;
    text-align: right;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  #appShell .links-table .links-url-cell .copy-link-btn {
    margin: 6px 0 0;
    width: 100%;
  }

  /* Empty action placeholder centers on the same axis as button stack */
  #appShell .table-wrap td .muted {
    align-self: center;
    color: var(--eds-text-muted);
  }
}

/* =========================================
   HOTFIX ROUND 4 (form controls, account cards, font, contrast cleanup)
   ========================================= */

/* Make sure Inter is actually used inside form controls and buttons.
   Browsers don't inherit font-family for native widgets by default,
   so without this they fall back to system Arial-like fonts. */
body,
input,
select,
textarea,
button {
  font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Universal dark form controls */
input,
select,
textarea {
  background: var(--eds-bg-soft, #111e34);
  color: var(--eds-text-main);
  border-color: var(--eds-border);
}
input::placeholder,
textarea::placeholder {
  color: var(--eds-text-muted);
  opacity: 0.85;
}
select option {
  background: var(--eds-bg-surface);
  color: var(--eds-text-main);
}
select:disabled,
input:disabled,
textarea:disabled {
  color: var(--eds-text-muted);
  opacity: 0.7;
}

/* Analytics filters & integration form controls had explicit white bg */
.analytics-filters select,
.analytics-filters input,
.integration-form input,
.integration-form select {
  background: var(--eds-bg-soft, #111e34);
  color: var(--eds-text-main);
  border-color: var(--eds-border);
}
.analytics-filters label {
  color: var(--eds-text-muted);
}

/* Generic muted helpers should stay readable on dark */
.muted,
.hint,
.kv-list dt,
.kpi .tt,
.kpi .delta.muted,
.funnel-meta,
.login-help p,
.login-divider span,
.login-form-header p,
label {
  color: var(--eds-text-muted);
}
.funnel-label,
.kv-list dd,
.analytics-tabs .tab.is-active,
.switch-label {
  color: var(--eds-text-main);
}

/* Login: saved-account cards, secondary buttons, help banner */
.acct-item {
  background: var(--eds-bg-surface);
  border-color: var(--eds-border);
  color: var(--eds-text-main);
}
.acct-meta img,
.avatar-fallback {
  background: var(--eds-bg-soft, #111e34);
  color: var(--eds-text-muted);
}
.acct-name {
  color: var(--eds-text-main);
}
.acct-user,
.acct-id,
.acct-meta small,
.acct-meta .muted {
  color: var(--eds-text-muted);
}
.acct-remove-btn {
  background: transparent;
  border-color: var(--eds-border);
  color: var(--eds-text-main);
}
.login-form-actions .secondary {
  background: var(--eds-bg-soft, #111e34);
  color: var(--eds-text-main);
  border: 1px solid var(--eds-border);
}
.login-form-actions .secondary:hover {
  background: #18253f;
  border-color: #34466a;
}
.tg-open-help {
  background: rgba(37, 99, 235, 0.08);
  border-color: rgba(99, 102, 241, 0.35);
  color: var(--eds-text-main);
}
.tg-open-help p {
  color: var(--eds-text-muted);
}
a.tg-bot-wait-open {
  display: inline-block;
  margin-top: 8px;
  color: var(--eds-accent, #7c6af7);
  font-weight: 600;
}

/* Status chips (.status-chip variants) on dark background */
.status-chip {
  color: var(--eds-text-main);
}
.status-chip.muted {
  background: rgba(148, 163, 184, 0.16);
  color: var(--eds-text-muted);
}
.status-chip.warn {
  background: rgba(245, 158, 11, 0.18);
  color: #fcd34d;
}

/* Misc legacy white surfaces still bleeding through inside the app shell */
#appShell .settings-section,
#appShell .detail-card,
#appShell .analytics-chart,
#appShell .integration-card,
#appShell .integration-hub-card {
  background: var(--eds-bg-surface);
  border-color: var(--eds-border);
  color: var(--eds-text-main);
}

/* Workers/system pills */
.workers-status {
  background: rgba(148, 163, 184, 0.16);
  color: var(--eds-text-muted);
}
.workers-status.is-timeout {
  background: rgba(245, 158, 11, 0.18);
  color: #fcd34d;
}
.workers-status.is-none {
  background: rgba(148, 163, 184, 0.16);
  color: var(--eds-text-muted);
}

/* Native mobile table-stack rows still defaulted to white in legacy layer */
.table-wrap table.mobile-stack tr {
  background: var(--eds-bg-surface) !important;
  border-color: var(--eds-border) !important;
}
.table-wrap table.mobile-stack td::before {
  color: var(--eds-text-muted) !important;
}

/* =========================================
   HOTFIX ROUND 6 — placeholder readability across all inputs
   В предыдущих раундах placeholder получался слишком тусклым из-за
   двойной приглушённости (muted color × opacity 0.85). Поднимаем до
   высокого контраста на тёмном фоне.
   ========================================= */
#appShell input::placeholder,
#appShell textarea::placeholder,
input::placeholder,
textarea::placeholder {
  color: rgba(220, 230, 250, 0.62) !important;
  opacity: 1 !important;
}
#appShell input::-webkit-input-placeholder,
input::-webkit-input-placeholder {
  color: rgba(220, 230, 250, 0.62) !important;
  opacity: 1 !important;
}
#appShell input::-moz-placeholder,
input::-moz-placeholder {
  color: rgba(220, 230, 250, 0.62) !important;
  opacity: 1 !important;
}

/* Labels внутри форм статичных ссылок и создания заявок — должны быть
   ярче muted-цвета, чтобы не сливаться с фоном секций. */
#appShell .apps-step label,
#appShell #linksCreateFormShell label,
#appShell #editLinkPanel label {
  color: var(--eds-text-main);
  font-weight: 500;
}
#appShell .apps-step .hint,
#appShell #linksCreateFormShell .hint,
#appShell #linksHint {
  color: var(--eds-text-muted);
}

/* На форме создания статичной ссылки .apps-step выглядел «слишком карточно»
   из-за тяжёлых нестед-обводок. Снижаем визуальный шум, не ломая DOM.
   Hotfix Round 8: применяем тот же визуальный язык к #linksEditFormShell —
   панель редактирования теперь использует apps-step layout идентично форме
   создания. */
#appShell #linksCreateFormShell .apps-step,
#appShell #linksEditFormShell .apps-step {
  background: transparent;
  border: none;
  padding: 0;
  margin-bottom: 16px;
}
#appShell #linksCreateFormShell .apps-step + .apps-step,
#appShell #linksEditFormShell .apps-step + .apps-step {
  border-top: 1px solid rgba(148, 163, 184, 0.12);
  padding-top: 16px;
}
#appShell #linksCreateFormShell .apps-step-row,
#appShell #linksEditFormShell .apps-step-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 640px) {
  #appShell #linksCreateFormShell .apps-step-row,
  #appShell #linksEditFormShell .apps-step-row {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 900px) {
  body.pwa-seller-cabinet-chrome #appShell #linksCreateFormShell .apps-step-row,
  body.pwa-seller-cabinet-chrome #appShell #linksEditFormShell .apps-step-row,
  #appShell.app-shell--seller-cabinet #linksCreateFormShell .apps-step-row,
  #appShell.app-shell--seller-cabinet #linksEditFormShell .apps-step-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
  body.pwa-seller-cabinet-chrome #appShell #linksCreateFormShell .apps-step-row input,
  body.pwa-seller-cabinet-chrome #appShell #linksCreateFormShell .apps-step-row select,
  body.pwa-seller-cabinet-chrome #appShell #linksEditFormShell .apps-step-row input,
  body.pwa-seller-cabinet-chrome #appShell #linksEditFormShell .apps-step-row select,
  #appShell.app-shell--seller-cabinet #linksCreateFormShell .apps-step-row input,
  #appShell.app-shell--seller-cabinet #linksCreateFormShell .apps-step-row select,
  #appShell.app-shell--seller-cabinet #linksEditFormShell .apps-step-row input,
  #appShell.app-shell--seller-cabinet #linksEditFormShell .apps-step-row select {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-edit-context__row,
  #appShell.app-shell--seller-cabinet .links-edit-context__row {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-edit-context,
  #appShell.app-shell--seller-cabinet .links-edit-context {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-edit-context__value,
  body.pwa-seller-cabinet-chrome #appShell .links-edit-context__slug,
  #appShell.app-shell--seller-cabinet .links-edit-context__value,
  #appShell.app-shell--seller-cabinet .links-edit-context__slug {
    flex: 0 1 auto;
    width: auto;
    max-width: 100%;
    align-self: flex-start;
  }
}

/* Контекстный блок в форме редактирования: показывает партнёра и хвост
   ссылки, чтобы пользователь понимал, что именно он редактирует. */
#appShell .links-sec-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: stretch;
  min-width: 160px;
}
#appShell .links-sec-actions .links-copy-btn {
  width: 100%;
  min-height: 42px;
}
#appShell .links-manage-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
#appShell .links-sec-actions .sec {
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(148, 163, 184, 0.06);
  color: var(--cabinet-text, #cbd5e1);
  font-size: 12px;
  font-weight: 650;
  padding: 7px 12px;
  border-radius: 9px;
  line-height: 1.2;
  min-height: 42px;
}
#appShell .links-sec-actions .sec.danger {
  color: #e7b0b0;
  border-color: rgba(248, 113, 113, 0.32);
  background: rgba(248, 113, 113, 0.07);
}
#appShell .links-sec-actions .sec.ok {
  color: #9fd4b8;
  border-color: rgba(52, 211, 153, 0.28);
  background: rgba(52, 211, 153, 0.06);
}
@media (min-width: 901px) {
  #appShell .links-sec-actions {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }
  #appShell .links-sec-actions .links-copy-btn {
    width: auto;
    min-height: 0;
  }
  #appShell .links-manage-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
}

#appShell .apps-client-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 13px;
  line-height: 1.35;
}
@media (min-width: 901px) {
  #appShell .apps-client-cell {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px 12px;
  }
}
#appShell .cabinet-bottom-nav,
#cabinetBottomNav.cabinet-bottom-nav,
#deskBottomNav.cabinet-bottom-nav {
  display: none;
}
@media (max-width: 900px) {
  /* Nav nodes are DOM siblings after #appShell (not descendants) — body flags from syncCabinetChrome. */
  body.pwa-seller-cabinet-chrome #cabinetBottomNav.cabinet-bottom-nav:not(.hidden),
  body.pwa-desk-ops-chrome #deskBottomNav.cabinet-bottom-nav:not(.hidden) {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px;
    position: sticky;
    bottom: 0;
    z-index: 40;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
    background: var(--cabinet-nav-bg, rgba(11, 18, 32, 0.94));
    border-top: 1px solid var(--cabinet-line, rgba(148, 163, 184, 0.16));
    backdrop-filter: blur(10px);
  }
  #appShell .cabinet-bottom-nav__tab,
  #cabinetBottomNav .cabinet-bottom-nav__tab,
  #deskBottomNav .cabinet-bottom-nav__tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    border: 0;
    background: transparent;
    color: var(--cabinet-nav-fg, #94a3b8);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.01em;
    min-height: 48px;
    padding: 6px 4px;
    border-radius: 12px;
    box-shadow: none;
  }
  #cabinetBottomNav .cabinet-bottom-nav__icon,
  #deskBottomNav .cabinet-bottom-nav__icon {
    width: 22px;
    height: 22px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  #appShell .cabinet-bottom-nav__tab.on,
  #cabinetBottomNav .cabinet-bottom-nav__tab.on,
  #deskBottomNav .cabinet-bottom-nav__tab.on {
    color: var(--cabinet-nav-on, #e2e8f0);
    background: var(--cabinet-nav-on-bg, rgba(148, 163, 184, 0.12));
  }
  #appShell.app-shell--seller-cabinet .main-content,
  #appShell.app-shell--desk-ops .main-content {
    padding-bottom: 72px;
  }

  /* Chrome split ≤900: hide primary sidebar tabs (same items as bottom nav).
     Account/notifications open in the content column, not this drawer.
     No !important: #appShell + shell class beats .side-menu .menu-block.
     ≥901: base `#cabinetBottomNav/#deskBottomNav { display:none }` already hides
     mobile chrome (show rules live only inside this max-width:900 block). */
  #appShell.app-shell--seller-cabinet .side-menu > .menu-block:not(.settings-block),
  #appShell.app-shell--desk-ops .side-menu > .menu-block:not(.settings-block) {
    display: none;
  }
}

/* Role-preview banner under seller/desk dark+purple shell (not orange warn) */
#appShell.app-shell--seller-cabinet #rolePreviewBanner,
#appShell.app-shell--desk-ops #rolePreviewBanner {
  background: var(--cabinet-tint, rgba(140, 102, 255, 0.14));
  border: 1px solid var(--cabinet-line, rgba(140, 102, 255, 0.32));
  color: var(--cabinet-text, #e2e8f0);
  border-radius: 12px;
  box-shadow: none;
  margin: 0 0 10px;
}
#appShell.app-shell--seller-cabinet #rolePreviewBanner.feedback.warn,
#appShell.app-shell--desk-ops #rolePreviewBanner.feedback.warn {
  background: rgba(140, 102, 255, 0.14);
  border-color: rgba(140, 102, 255, 0.32);
}
#appShell.app-shell--seller-cabinet #rolePreviewBanner .muted,
#appShell.app-shell--desk-ops #rolePreviewBanner .muted {
  color: var(--cabinet-muted, #94a3b8);
}
#appShell.app-shell--seller-cabinet #rolePreviewBanner .menu-btn.secondary,
#appShell.app-shell--desk-ops #rolePreviewBanner .menu-btn.secondary {
  background: var(--cabinet-tint, rgba(140, 102, 255, 0.18));
  border: 1px solid var(--cabinet-line, rgba(140, 102, 255, 0.35));
  color: var(--cabinet-text, #ede9fe);
}

/* Shared shell: work-head = content title/actions (seller + desk) */
#appShell.app-shell--seller-cabinet .work-card-head,
#appShell.app-shell--desk-ops .work-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
  padding-top: 12px;
  min-height: 0;
  border-bottom: 0;
  position: relative;
}
#appShell.app-shell--seller-cabinet .work-card-head > h3,
#appShell.app-shell--seller-cabinet .work-card-head .work-head-titles > h3,
#appShell.app-shell--desk-ops .work-card-head > h3,
#appShell.app-shell--desk-ops .work-card-head .work-head-titles > h3 {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  min-height: 0;
  margin: 0;
}
#appShell.app-shell--seller-cabinet .work-card-head .work-head-titles,
#appShell.app-shell--desk-ops .work-card-head .work-head-titles {
  flex: 1 1 auto;
  min-width: 0;
  position: static;
}
#appShell.app-shell--seller-cabinet .work-card-head > .toolbar,
#appShell.app-shell--desk-ops .work-card-head > .toolbar {
  flex: 0 1 auto;
  margin: 0;
  position: static;
  justify-content: flex-end;
  gap: 8px;
}
#appShell.app-shell--seller-cabinet .work-head-sub,
#appShell.app-shell--desk-ops .work-head-sub {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--cabinet-muted, #94a3b8);
  line-height: 1.35;
}
@media (max-width: 900px) {
  /* Title full-width on top; actions wrap below — no overlap with «Статичные ссылки». */
  body.pwa-seller-cabinet-chrome #appShell .work-card-head,
  body.pwa-desk-ops-chrome #appShell .work-card-head,
  #appShell.app-shell--seller-cabinet .work-card-head,
  #appShell.app-shell--desk-ops .work-card-head {
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card-head .work-head-titles,
  body.pwa-desk-ops-chrome #appShell .work-card-head .work-head-titles,
  #appShell.app-shell--seller-cabinet .work-card-head .work-head-titles,
  #appShell.app-shell--desk-ops .work-card-head .work-head-titles {
    width: 100%;
    max-width: 100%;
    flex: 0 0 auto;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card-head > .toolbar,
  body.pwa-desk-ops-chrome #appShell .work-card-head > .toolbar,
  #appShell.app-shell--seller-cabinet .work-card-head > .toolbar,
  #appShell.app-shell--desk-ops .work-card-head > .toolbar {
    width: 100%;
    flex: 0 0 auto;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  #appShell.app-shell--seller-cabinet .work-card-head > h3,
  #appShell.app-shell--seller-cabinet .work-card-head .work-head-titles > h3,
  #appShell.app-shell--desk-ops .work-card-head > h3,
  #appShell.app-shell--desk-ops .work-card-head .work-head-titles > h3 {
    font-size: 17px;
  }
}
@media (min-width: 901px) {
  body.pwa-seller-cabinet-chrome #appShell .work-card-head,
  body.pwa-desk-ops-chrome #appShell .work-card-head,
  #appShell.app-shell--seller-cabinet .work-card-head,
  #appShell.app-shell--desk-ops .work-card-head {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card-head .work-head-titles,
  body.pwa-desk-ops-chrome #appShell .work-card-head .work-head-titles {
    flex: 1 1 auto;
    width: auto;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card-head > .toolbar,
  body.pwa-desk-ops-chrome #appShell .work-card-head > .toolbar {
    width: auto;
    flex: 0 0 auto;
    justify-content: flex-end;
  }
}
#appShell.app-shell--seller-cabinet .menu-profile .acc-role,
#appShell.app-shell--desk-ops .menu-profile .acc-role {
  display: inline-flex;
  margin-top: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(140, 102, 255, 0.16);
  color: var(--cabinet-text, #c4b5fd);
  font-size: 11px;
  font-weight: 700;
}

/* ============================================================
   Stage 1 — Shell L1 under sellerCabinetChrome (body flags).
   SPEC §2 + PNG *-d-*: full-bleed logo, greeting/workspace, sidebar «Меню».
   No new !important (budget 58). Caps / apps / links content untouched.
   ============================================================ */
body.pwa-seller-cabinet-chrome,
body.pwa-desk-ops-chrome {
  --cabinet-header: #121a2b;
  background: var(--cabinet-bg, #060d1c);
  color: var(--cabinet-text, #e2e8f0);
  scrollbar-width: none;
}
body.pwa-seller-cabinet-chrome::before,
body.pwa-desk-ops-chrome::before {
  content: "";
  position: fixed;
  z-index: 80;
  top: 0;
  left: 0;
  right: 0;
  height: env(safe-area-inset-top, 0px);
  background-color: var(--cabinet-header, #121a2b);
  pointer-events: none;
}
body.pwa-seller-cabinet-chrome::-webkit-scrollbar,
body.pwa-desk-ops-chrome::-webkit-scrollbar {
  width: 0;
  height: 0;
}
body.pwa-seller-cabinet-chrome *,
body.pwa-desk-ops-chrome * {
  scrollbar-width: none;
}
body.pwa-seller-cabinet-chrome *::-webkit-scrollbar,
body.pwa-desk-ops-chrome *::-webkit-scrollbar {
  width: 0;
  height: 0;
}
body.pwa-seller-cabinet-chrome .wrap,
body.pwa-desk-ops-chrome .wrap {
  max-width: none;
  padding: 0;
}
/* L1 top-bleed: logo spans full window width above sidebar+content */
body.pwa-seller-cabinet-chrome #appShell #shellHeroCard,
body.pwa-desk-ops-chrome #appShell #shellHeroCard {
  margin: 0;
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid var(--cabinet-line, rgba(148, 163, 184, 0.16));
  background-color: var(--cabinet-header, #121a2b);
  background: var(--cabinet-header, #121a2b);
  backdrop-filter: none;
  box-shadow: none;
  padding: calc(12px + env(safe-area-inset-top, 0px)) 20px 12px;
}
body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .pwa-site-logo,
body.pwa-desk-ops-chrome #appShell #shellHeroCard .pwa-site-logo {
  height: 28px;
  width: auto;
  display: block;
}
body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-greeting,
body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-greeting {
  font-size: 13px;
  font-weight: 600;
  opacity: 1;
  color: var(--cabinet-text, #e2e8f0);
}
body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-workspace,
body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-workspace {
  font-size: 11px;
  opacity: 1;
  color: var(--cabinet-muted, #8091ad);
}
/* KPI strip not in SPEC §2 / PNG *-d-* shell — hide under flag ON */
body.pwa-seller-cabinet-chrome #appShell #shellKpiCard,
body.pwa-desk-ops-chrome #appShell #shellKpiCard {
  display: none;
}
/* Sidebar: «Меню» → profile → nav (title/actions stay in .work-card-head) */
body.pwa-seller-cabinet-chrome #appShell .side-menu .menu-title,
body.pwa-desk-ops-chrome #appShell .side-menu .menu-title {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--cabinet-muted, #8091ad);
}
body.pwa-seller-cabinet-chrome #appShell .card.side-menu,
body.pwa-desk-ops-chrome #appShell .card.side-menu {
  border-radius: 0;
  margin-bottom: 0;
  background: var(--cabinet-surface, #0b1424);
  border-color: var(--cabinet-line, rgba(148, 163, 184, 0.14));
}
body.pwa-seller-cabinet-chrome #appShell .shell-layout.layout-grid,
body.pwa-desk-ops-chrome #appShell .shell-layout.layout-grid {
  gap: 0;
  padding: 0;
  min-height: calc(100vh - 56px);
}
body.pwa-seller-cabinet-chrome #appShell .main-content .card.work-card,
body.pwa-desk-ops-chrome #appShell .main-content .card.work-card {
  border-radius: 0;
  border-left: 0;
  margin-bottom: 0;
  background: var(--cabinet-bg, #060d1c);
  box-shadow: none;
}
@media (min-width: 901px) {
  body.pwa-seller-cabinet-chrome #appShell .mobile-menu-toggle,
  body.pwa-desk-ops-chrome #appShell .mobile-menu-toggle {
    display: none;
  }
  body.pwa-seller-cabinet-chrome #appShell .side-menu-head .side-menu-back,
  body.pwa-desk-ops-chrome #appShell .side-menu-head .side-menu-back {
    display: none;
  }
}
@media (max-width: 900px) {
  body.pwa-seller-cabinet-chrome #appShell #shellHeroCard,
  body.pwa-desk-ops-chrome #appShell #shellHeroCard {
    padding: calc(10px + env(safe-area-inset-top, 0px)) 14px 10px;
    background-color: var(--cabinet-header, #121a2b);
    position: sticky;
    top: 0;
    z-index: 70;
  }
  /* Proto phone-header: one row — logo left (~28px), greeting+workspace right.
     Beats classic ≤768 wrap that stacks greeting under the logo. */
  body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-topbar,
  body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-topbar {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px;
  }
  body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .pwa-site-logo,
  body.pwa-desk-ops-chrome #appShell #shellHeroCard .pwa-site-logo {
    order: 1;
    flex: 0 0 166px;
    height: 28px;
    width: 166px;
  }
  body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-greeting-group,
  body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-greeting-group {
    order: 2;
    width: auto;
    max-width: calc(100% - 176px);
    margin-left: auto;
    margin-top: 0;
    text-align: right;
    line-height: 1.25;
    min-width: 0;
  }
  body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-greeting,
  body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-greeting {
    font-size: 11px;
    font-weight: 600;
  }
  body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-workspace,
  body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-workspace {
    font-size: 10px;
  }
  /* ≤900: phone header keeps logo+greeting; classic «Меню» drawer toggle unused — bottom-nav owns IA */
  body.pwa-seller-cabinet-chrome #appShell .mobile-menu-toggle,
  body.pwa-desk-ops-chrome #appShell .mobile-menu-toggle {
    display: none;
  }
}

/* ============================================================
   Stage 2 — Apps dense list under sellerCabinetChrome (SPEC §6).
   Flag OFF keeps #appsAccordion classic tables. No stub banners.
   ============================================================ */
#appShell .work-head-titles {
  min-width: 0;
  flex: 1 1 auto;
}
#appShell .work-head-sub {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--eds-text-muted, #94a3b8);
}
body.pwa-seller-cabinet-chrome #appShell .apps-cabinet-chrome:not(.hidden),
#appShell.app-shell--seller-cabinet .apps-cabinet-chrome:not(.hidden) {
  display: block;
  padding: 0 4px 20px;
}
body.pwa-seller-cabinet-chrome #appShell #appsListTools #loadAppsBtn,
#appShell.app-shell--seller-cabinet #appsListTools #loadAppsBtn {
  background: transparent;
  border: 1px solid var(--cabinet-line, rgba(148, 163, 184, 0.35));
  color: var(--cabinet-text, #e2e8f0);
}
body.pwa-seller-cabinet-chrome #appShell #appsListTools #appsCreateLinkBtn,
#appShell.app-shell--seller-cabinet #appsListTools #appsCreateLinkBtn {
  background: #7c3aed;
  border-color: #7c3aed;
  color: #fff;
  font-weight: 650;
}
.apps-need-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  text-align: left;
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(248, 113, 113, 0.35);
  background: rgba(127, 29, 29, 0.35);
  color: #fecaca;
  cursor: pointer;
}
.apps-need-strip__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.apps-need-strip__title {
  font-weight: 700;
  font-size: 14px;
  color: #fecaca;
}
.apps-need-strip__hint {
  font-size: 12px;
  color: #f5a8a8;
}
.apps-need-strip__right {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.apps-need-strip__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(185, 28, 28, 0.85);
  color: #fff;
  font-weight: 700;
  font-size: 13px;
}
.apps-need-strip__arrow {
  opacity: 0.85;
  font-size: 16px;
}
@media (max-width: 900px) {
  .apps-need-strip__hint {
    display: none;
  }
}
.apps-cab-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}
.apps-cab-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid transparent;
  background: var(--chip-bg, rgba(148, 163, 184, 0.12));
  color: var(--chip-fg, #cbd5e1);
  border-radius: 999px;
  padding: 6px 10px 6px 12px;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
  min-height: 34px;
}
.apps-cab-chip.on {
  background: var(--chip-on-bg, rgba(124, 58, 237, 0.22));
  border-color: var(--chip-on-line, rgba(167, 139, 250, 0.55));
  color: var(--chip-on-fg, #ede9fe);
}
.apps-cab-chip__n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.45);
  font-size: 11px;
  font-weight: 700;
}
.apps-cab-chip.on .apps-cab-chip__n {
  background: rgba(91, 33, 182, 0.65);
  color: #fff;
}
.apps-cab-cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.apps-cab-card {
  border: 1px solid var(--cabinet-line, rgba(148, 163, 184, 0.16));
  background: var(--cabinet-surface, #0f172a);
  border-radius: 12px;
  padding: 12px 14px;
  cursor: default;
  min-width: 0;
}
.apps-cab-card[data-apps-cab-open],
.apps-cab-card[data-apps-cab-open-direct] {
  cursor: pointer;
}
.apps-cab-card[data-apps-cab-open]:hover,
.apps-cab-card[data-apps-cab-open-direct]:hover {
  border-color: rgba(167, 139, 250, 0.55);
}
.apps-cab-card__row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.apps-cab-card__main {
  min-width: 0;
  flex: 1 1 auto;
}
.apps-cab-card__title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.apps-cab-card__product {
  font-weight: 700;
  font-size: 14px;
  color: var(--cabinet-text, #f1f5f9);
  overflow-wrap: anywhere;
}
.apps-cab-card__meta {
  margin-top: 4px;
  font-size: 12px;
  overflow-wrap: anywhere;
}
/* Stage 6 / P-009: client identity under meta — column ≤900, row ≥901; empty omitted in JS */
.apps-cab-card__client {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-top: 8px;
  font-size: 12px;
  color: var(--cabinet-muted, #94a3b8);
}
.apps-cab-card__client .apps-cab-card__name {
  color: var(--cabinet-text, #e2e8f0);
  font-weight: 600;
}
.apps-cab-card__client .apps-cab-card__name--missing {
  color: var(--cabinet-muted, #94a3b8);
  font-weight: 500;
}
.apps-cab-card__client .apps-cab-card__email,
.apps-cab-card__client .apps-cab-card__phone {
  word-break: break-word;
}
@media (min-width: 901px) {
  .apps-cab-card__client {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px 14px;
  }
}
.apps-cab-type {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: rgba(59, 130, 246, 0.18);
  color: #93c5fd;
}
.apps-cab-type.type-fullpay {
  background: rgba(34, 197, 94, 0.16);
  color: #86efac;
}
.apps-cab-type.type-internal {
  background: rgba(168, 85, 247, 0.16);
  color: #d8b4fe;
}
.apps-cab-type.type-sub {
  background: rgba(14, 165, 233, 0.16);
  color: #7dd3fc;
}
.apps-cab-status {
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 8px;
  white-space: nowrap;
}
.apps-cab-status--need,
.apps-cab-status--bad {
  color: var(--status-bad-fg, #fecaca);
  background: var(--status-bad-bg, rgba(185, 28, 28, 0.28));
}
.apps-cab-status--ok {
  color: var(--status-ok-fg, #bbf7d0);
  background: var(--status-ok-bg, rgba(22, 163, 74, 0.22));
}
.apps-cab-status--warn {
  color: var(--status-warn-fg, #fde68a);
  background: var(--status-warn-bg, rgba(180, 83, 9, 0.28));
}
.apps-cab-status--muted {
  color: var(--status-muted-fg, #cbd5e1);
  background: var(--status-muted-bg, rgba(148, 163, 184, 0.18));
}
.apps-cab-empty {
  margin: 8px 0 0;
  font-size: 13px;
}

/* ============================================================
   Stage 7 — Apps create wizard under sellerCabinetChrome (SPEC §7)
   Punch: groups+tiles / horizontal flow-nav / review+success hierarchy.
   Flag OFF: classic progressive #apps*Step; wizard nodes stay .hidden via JS.
   ============================================================ */
.apps-create-wizard {
  margin: 0 0 14px;
}
.apps-wiz-step-label {
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--cabinet-text, #c4b5fd);
}
.apps-wiz-bar {
  /* A4: эталон — только «Шаг N из 4 · …», без кружков 1–4 */
  display: none;
}
.apps-wiz-dot {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--cabinet-muted, #94a3b8);
  background: rgba(148, 163, 184, 0.12);
  border: 1px solid rgba(148, 163, 184, 0.22);
}
.apps-wiz-dot.on {
  color: #fff;
  background: #7c3aed;
  border-color: #7c3aed;
}
.apps-wiz-dot.done {
  color: var(--cabinet-text, #c4b5fd);
  border-color: rgba(124, 58, 237, 0.55);
}
.apps-wiz-q {
  margin: 0 0 14px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--cabinet-text, #f1f5f9);
}
.apps-pay-groups {
  margin: 0 0 12px;
}
.apps-pay-group {
  margin: 0 0 14px;
}
.apps-pay-group-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--cabinet-muted, #94a3b8);
  margin: 0 0 8px;
}
.apps-pay-tiles {
  display: grid;
  gap: 8px;
}
.apps-pay-tiles--bank {
  grid-template-columns: 1fr 1fr;
}
.apps-pay-tiles--direct {
  grid-template-columns: 1fr 1fr 1fr;
}
.apps-pay-tile {
  background: #0f172a;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 12px;
  padding: 14px 8px;
  text-align: center;
  font-size: 12px;
  font-weight: 650;
  color: var(--cabinet-muted, #94a3b8);
  min-height: 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  box-shadow: none;
  background-image: none;
}
/* Color emoji. Tile weight 650 plus light-theme color #0B1220 makes
   Windows and iOS draw these glyphs as black silhouettes. No generic
   family here: an unknown `emoji` token would drop the whole list. */
.apps-pay-tile .apps-pay-tico {
  font-size: 18px;
  line-height: 1;
  font-weight: 400;
  font-style: normal;
  font-synthesis: none;
  font-variant-emoji: emoji;
  font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
  opacity: 1;
  filter: none;
  text-shadow: none;
}
.apps-pay-tile.on {
  border-color: rgba(124, 58, 237, 0.75);
  background: rgba(124, 58, 237, 0.22);
  color: var(--cabinet-text, #ede9fe);
  box-shadow: inset 0 0 0 1px rgba(124, 58, 237, 0.35);
  background-image: none;
}
.apps-pay-tile:not(.on):hover {
  border-color: rgba(148, 163, 184, 0.45);
  color: var(--cabinet-text, #cbd5e1);
  transform: none;
  box-shadow: none;
  background: #111827;
  background-image: none;
}
.apps-create-review__box {
  background: #0f172a;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 12px;
  padding: 14px;
  margin: 0 0 8px;
}
.apps-create-review__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12);
  font-size: 13px;
}
.apps-create-review__row:last-child {
  border-bottom: 0;
}
.apps-create-review__row span {
  color: var(--cabinet-muted, #94a3b8);
}
.apps-create-review__row strong {
  font-weight: 650;
  text-align: right;
  color: var(--cabinet-text, #f1f5f9);
}
/* B2: horizontal flow-nav — Cancel|Next / Back|Next / Back|Submit */
.apps-flow-actions--wizard {
  display: flex;
  gap: 8px;
  margin-top: 8px;
  align-items: stretch;
}
.apps-flow-actions--wizard #appsCreateWizardNav,
.apps-flow-actions--wizard #appsCreateLine {
  display: contents;
}
.apps-flow-actions--wizard #appsWizCancelBtn:not(.hidden),
.apps-flow-actions--wizard #appsWizBackBtn:not(.hidden),
.apps-flow-actions--wizard #appsWizNextBtn:not(.hidden),
.apps-flow-actions--wizard #createAppBtn:not(.hidden) {
  flex: 1;
  margin: 0;
}
.apps-flow-actions--wizard #appsCreateLine {
  margin: 0;
}
/* Keep live #appType in DOM for options/API; visually hide under wizard. */
.apps-create-flow--wizard .apps-type-select-label,
.apps-create-flow--wizard #appType {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.apps-create-flow--wizard .apps-partner-label {
  /* q «Продавец» is the chrome heading; hide duplicate field label */
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
/* Punch-2 step 3: one vertical field stream (no dual cards), pay-type q + hints */
.apps-create-flow--wizard #appsProductStep,
.apps-create-flow--wizard #appsClientStep {
  padding: 0;
  border: none;
  background: transparent;
  border-radius: 0;
  margin: 0;
}
.apps-create-flow--wizard #appsProductStep + #appsClientStep {
  margin-top: 0;
}
.apps-create-flow--wizard .apps-step-row--stack,
.apps-create-flow--wizard #appsProductStep .apps-step-row,
.apps-create-flow--wizard #appsClientStep .apps-step-row {
  display: flex;
  flex-direction: column;
  gap: 14px;
  grid-template-columns: none;
}
.apps-create-flow--wizard .apps-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
}
.apps-create-flow--wizard .apps-field label,
.apps-create-flow--wizard #appsProductStep label,
.apps-create-flow--wizard #appsClientStep label {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--cabinet-muted, #94a3b8);
}
.apps-create-flow--wizard .apps-field-hint {
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  color: #64748b;
}
.apps-create-flow--wizard #appsProductPrompt.apps-wiz-q {
  margin: 0 0 16px;
}
.apps-create-flow--wizard #appsTariffRow:not(.hidden),
.apps-create-flow--wizard #appOfferWrap:not(.hidden) {
  margin-top: 14px;
}
.apps-create-flow--wizard #appOfferWrap:not(.hidden) {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
/* Classic OFF: keep hints compact under fields without forcing wizard stack */
.apps-field-hint {
  margin-top: 4px;
  font-size: 12px;
  color: #64748b;
}
/* B4 success chrome hierarchy */
.apps-create-result--chrome {
  text-align: center;
  padding: 28px 16px;
  background: linear-gradient(180deg, rgba(124, 58, 237, 0.12), transparent);
  border: 1px solid rgba(124, 58, 237, 0.3);
  border-radius: 16px;
}
.apps-create-result--chrome .apps-success-check {
  width: 52px;
  height: 52px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: rgba(52, 211, 153, 0.15);
  color: #6ee7b7;
  display: grid;
  place-items: center;
  font-size: 24px;
  font-weight: 700;
}
.apps-create-result--chrome .apps-result-title {
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 6px;
}
.apps-create-result--chrome .apps-success-help {
  display: block;
  font-size: 13px;
  color: var(--cabinet-muted, #94a3b8);
  margin: 0 0 16px;
}
.apps-create-result--chrome .apps-result-meta {
  display: none;
}
.apps-create-result--chrome .apps-success-url-label {
  display: none;
}
.apps-create-result--chrome .apps-success-url-box:not(.hidden) {
  display: block;
  margin: 0 0 14px;
}
.apps-create-result--chrome .apps-success-url-row {
  display: flex;
  gap: 8px;
  align-items: center;
  background: #0f172a;
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-radius: 10px;
  padding: 10px 12px;
  text-align: left;
}
.apps-create-result--chrome #appsCreateLinkInput {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: var(--cabinet-text, #c4b5fd);
  font-size: 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  padding: 0;
}
.apps-create-result--chrome .apps-success-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 0;
}
.apps-create-result--chrome #appsCreateGoToListBtn:not(.hidden) {
  display: block;
  width: 100%;
  order: 1;
}
.apps-create-result--chrome #createAnotherAppBtn {
  display: block;
  width: 100%;
  order: 2;
  background: transparent;
  border: 1px solid rgba(148, 163, 184, 0.4);
  color: var(--cabinet-text, #e2e8f0);
  box-shadow: none;
}
#appShell .apps-create-result.apps-create-result--chrome #createAnotherAppBtn,
body.pwa-seller-cabinet-chrome #appShell .apps-create-result--chrome #createAnotherAppBtn {
  background: transparent;
  border: 1px solid rgba(148, 163, 184, 0.4);
  color: var(--cabinet-text, #e2e8f0);
  box-shadow: none;
}
.apps-create-result--chrome ~ #appsUsdPreview,
body.pwa-seller-cabinet-chrome #appsCreateResult.apps-create-result--chrome:not(.hidden) ~ #appsUsdPreview {
  display: none;
}
/* Classic: hide chrome-only success bits */
.apps-create-result:not(.apps-create-result--chrome) .apps-success-check,
.apps-create-result:not(.apps-create-result--chrome) .apps-success-help {
  display: none;
}

/* ============================================================
   Stage 3 — Static links dense list (SPEC §5 / P-007)
   ============================================================ */
body.pwa-seller-cabinet-chrome #appShell .links-cabinet-chrome:not(.hidden),
#appShell.app-shell--seller-cabinet .links-cabinet-chrome:not(.hidden) {
  display: block;
  padding: 0 4px 20px;
}
.links-cab-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
@media (min-width: 901px) {
  /* B7: denser Owner/seller desktop list — not one empty full-bleed column */
  body.pwa-seller-cabinet-chrome #appShell .links-cab-cards,
  #appShell.app-shell--seller-cabinet .links-cab-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    max-width: 960px;
  }
}
@media (min-width: 1280px) {
  /* D1: wide desktop — 3 columns across the work area (no right-hand hole). */
  body.pwa-seller-cabinet-chrome #appShell .links-cab-cards,
  #appShell.app-shell--seller-cabinet .links-cab-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    max-width: none;
  }
}
.links-cab-card {
  border: 1px solid var(--cabinet-line, rgba(148, 163, 184, 0.16));
  background: var(--cabinet-surface, #0f172a);
  border-radius: 12px;
  padding: 14px;
  min-width: 0;
}
.links-cab-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.links-cab-card__title {
  font-weight: 700;
  font-size: 15px;
  color: var(--cabinet-text, #f1f5f9);
  line-height: 1.3;
  min-width: 0;
}
.links-cab-status {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 650;
  padding: 3px 8px;
  border-radius: 999px;
  color: var(--cabinet-text, #cbd5e1);
  background: rgba(148, 163, 184, 0.14);
}
.links-cab-status.is-off {
  color: var(--cabinet-muted, #94a3b8);
  background: rgba(71, 85, 105, 0.35);
}
.links-cab-card__amount {
  margin-top: 8px;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.links-cab-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.links-cab-tag {
  display: inline-flex;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 650;
  color: var(--cabinet-text, #cbd5e1);
  background: rgba(148, 163, 184, 0.14);
  border: 1px solid rgba(148, 163, 184, 0.18);
}
.links-cab-tag--terms {
  color: #a5b4fc;
}
.links-cab-card__url {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(2, 6, 23, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.16);
  color: var(--cabinet-muted, #94a3b8);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.links-cab-card .links-sec-actions {
  margin-top: 12px;
}
body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-copy-btn,
#appShell.app-shell--seller-cabinet .links-cab-card .links-copy-btn {
  background: #7c3aed;
  border-color: #7c3aed;
  color: #fff;
  font-weight: 650;
}
/* Desktop P-007: manage = quiet outline, not same primary as Копировать */
body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-manage-row .sec,
#appShell.app-shell--seller-cabinet .links-cab-card .links-manage-row .sec,
body.pwa-seller-cabinet-chrome #appShell .links-sec-actions .links-manage-row .sec,
#appShell.app-shell--seller-cabinet .links-sec-actions .links-manage-row .sec {
  background: transparent;
  border: 1px solid rgba(148, 163, 184, 0.32);
  color: var(--cabinet-text, #cbd5e1);
  font-weight: 650;
  box-shadow: none;
}
body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-manage-row .sec.danger,
#appShell.app-shell--seller-cabinet .links-cab-card .links-manage-row .sec.danger {
  color: #e7b0b0;
  border-color: rgba(248, 113, 113, 0.36);
  background: rgba(248, 113, 113, 0.06);
}
body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-manage-row .sec.ok,
#appShell.app-shell--seller-cabinet .links-cab-card .links-manage-row .sec.ok {
  color: #9fd4b8;
  border-color: rgba(52, 211, 153, 0.32);
  background: rgba(52, 211, 153, 0.06);
}
@media (min-width: 901px) {
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-sec-actions,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-sec-actions {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-copy-btn,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-copy-btn {
    width: auto;
    min-width: 120px;
  }
}

/* ============================================================
   Stage 5 — Static links create/edit forms (SPEC §5 / P-003/004)
   Flag ON: form | preview side-by-side ≥901; stacked ≤900.
   ============================================================ */
.links-sl-layout {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: stretch;
}
.links-sl-fields {
  min-width: 0;
  flex: 1 1 auto;
}
.links-sl-preview {
  display: none;
  box-sizing: border-box;
  background: var(--cabinet-surface, #0f172a);
  border: 1px solid var(--cabinet-line, rgba(148, 163, 184, 0.18));
  border-radius: 14px;
  padding: 16px;
  margin: 0;
}
.links-sl-preview__h {
  margin: 0 0 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--cabinet-muted, #94a3b8);
}
.links-sl-preview__title {
  font-size: 16px;
  font-weight: 700;
  color: var(--cabinet-text, #f1f5f9);
  margin-bottom: 4px;
}
.links-sl-preview__amount {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--cabinet-text, #fff);
  margin-bottom: 10px;
}
.links-sl-preview__meta {
  font-size: 13px;
  color: var(--cabinet-muted, #94a3b8);
  line-height: 1.4;
  margin-bottom: 12px;
}
.links-sl-preview__url {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 11px;
  color: #a78bfa;
  word-break: break-all;
  background: rgba(2, 6, 23, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 10px;
  padding: 10px 12px;
}
.links-sl-preview__url span { color: #64748b; }
.links-pay-tiles {
  display: none;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0 0 10px;
}
.links-pay-tile {
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 12px;
  padding: 14px 10px;
  text-align: center;
  font-size: 13px;
  font-weight: 650;
  color: var(--cabinet-muted, #94a3b8);
  cursor: pointer;
  box-shadow: none;
  background-image: none;
}
.links-pay-tile.on {
  border-color: rgba(140, 102, 255, 0.7);
  background: rgba(140, 102, 255, 0.18);
  color: var(--cabinet-text, #ede9fe);
  box-shadow: inset 0 0 0 1px rgba(140, 102, 255, 0.3);
  background-image: none;
}
.links-pay-tile:not(.on):hover {
  border-color: rgba(148, 163, 184, 0.4);
  color: var(--cabinet-text, #cbd5e1);
  transform: none;
  box-shadow: none;
  background-image: none;
}
.links-adv-toggle {
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 10px 4px;
  font-size: 13px;
  font-weight: 650;
  color: var(--cabinet-muted, #94a3b8);
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  box-shadow: none;
  background-image: none;
  transform: none;
  /* B5: accordion header — not a full-bleed primary CTA */
  min-height: 0;
}
.links-adv-toggle:hover {
  color: var(--cabinet-text, #cbd5e1);
  background: rgba(148, 163, 184, 0.06);
  box-shadow: none;
  transform: none;
  background-image: none;
}
.links-adv-block {
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.35);
  margin-bottom: 4px;
  overflow: hidden;
}
.links-adv-body { padding: 0 14px 14px; }
.links-sl-label {
  display: block;
  font-size: 12px;
  font-weight: 650;
  color: var(--cabinet-muted, #94a3b8);
  margin-bottom: 6px;
}
.links-sl-footer { gap: 8px; flex-wrap: wrap; }
.links-create-success .apps-result-title { font-size: 16px; font-weight: 700; }

/* Chrome ON: tiles + aside preview; hide classic select/inline preview title */
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome > .links-form-panel__classic-title,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome > .links-form-panel__classic-title {
  display: none;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-pay-tiles,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-pay-tiles {
  display: grid;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-type-select-fallback,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-type-select-fallback {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-sl-preview:not(.hidden),
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-sl-preview:not(.hidden) {
  display: block;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-term-chips label,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-term-chips label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: rgba(15, 23, 42, 0.45);
  font-size: 12px;
  font-weight: 650;
  color: var(--cabinet-muted, #94a3b8);
  cursor: pointer;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-term-chips label:has(input:checked),
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-term-chips label:has(input:checked) {
  border-color: rgba(140, 102, 255, 0.55);
  background: rgba(140, 102, 255, 0.14);
  color: #ddd6fe;
  box-shadow: none;
  filter: none;
  outline: none;
  text-shadow: none;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-term-chips input,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-term-chips input {
  accent-color: #8c66ff;
}
/* Fullpay: real 42×24 switch, label left, track right, full row. */
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-opt-fullpay,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-opt-fullpay {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 0;
  border: 0;
  background: transparent;
  gap: 10px;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-opt-fullpay .switch-control,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-opt-fullpay .switch-control {
  width: 42px;
  height: 24px;
  flex: 0 0 42px;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome #createLinkBtn,
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome #updateLinkBtn,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome #createLinkBtn,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome #updateLinkBtn {
  background: #7c3aed;
  border-color: #7c3aed;
  color: #fff;
  font-weight: 650;
  min-height: 44px;
  padding: 10px 18px;
}
@media (min-width: 901px) {
  body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-sl-layout,
  #appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-sl-layout {
    flex-direction: row;
    align-items: flex-start;
    gap: 20px;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-sl-fields,
  #appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-sl-fields {
    flex: 1 1 auto;
    min-width: 0;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-sl-preview:not(.hidden),
  #appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-sl-preview:not(.hidden) {
    flex: 0 0 320px;
    width: 320px;
    max-width: 320px;
    align-self: flex-start;
    position: sticky;
    top: 0;
    margin: 0;
  }
}
/* Flag OFF / non-chrome: keep select visible, hide tiles & chrome aside.
   No !important — specificity beats .links-pay-tiles / aside base rules (budget 58). */
body:not(.pwa-seller-cabinet-chrome) .links-pay-tiles,
#appShell:not(.app-shell--seller-cabinet) .links-pay-tiles {
  display: none;
}
body:not(.pwa-seller-cabinet-chrome) .links-sl-preview,
#appShell:not(.app-shell--seller-cabinet) .links-sl-preview {
  display: none;
}
body:not(.pwa-seller-cabinet-chrome) .links-adv-toggle,
#appShell:not(.app-shell--seller-cabinet) .links-adv-toggle {
  display: none;
}
body:not(.pwa-seller-cabinet-chrome) .links-adv-body,
#appShell:not(.app-shell--seller-cabinet) .links-adv-body {
  display: block;
  padding: 0;
}
body:not(.pwa-seller-cabinet-chrome) .links-adv-block,
#appShell:not(.app-shell--seller-cabinet) .links-adv-block {
  border: 0;
  background: transparent;
}
/* Stage 5 punch: chrome — no «Режим срока»; cancel only under flag.
   JS also toggles .hidden; CSS is belt without !important (budget 58). */
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome #lnkTermModeWrap,
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome #lnkEditTermModeWrap,
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome #lnkTermSingleWrap,
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome #lnkEditTermSingleWrap,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome #lnkTermModeWrap,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome #lnkEditTermModeWrap,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome #lnkTermSingleWrap,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome #lnkEditTermSingleWrap {
  display: none;
}
body:not(.pwa-seller-cabinet-chrome) .links-form-cancel-btn,
#appShell:not(.app-shell--seller-cabinet) .links-form-cancel-btn {
  display: none;
}

/* Mobile «Ещё» sheet (DOM siblings after #appShell — body flags) */
#cabinetMoreOverlay.cabinet-more-overlay,
#cabinetMoreSheet.cabinet-more-sheet,
#appShell .cabinet-more-overlay,
#appShell .cabinet-more-sheet {
  display: none;
}
@media (max-width: 900px) {
  body.pwa-seller-cabinet-chrome #cabinetMoreOverlay.cabinet-more-overlay:not(.hidden),
  body.pwa-desk-ops-chrome #cabinetMoreOverlay.cabinet-more-overlay:not(.hidden) {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 55;
    background: rgba(2, 6, 23, 0.55);
  }
  body.pwa-seller-cabinet-chrome #cabinetMoreSheet.cabinet-more-sheet:not(.hidden),
  body.pwa-desk-ops-chrome #cabinetMoreSheet.cabinet-more-sheet:not(.hidden) {
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 56;
    max-height: min(78vh, 640px);
    overflow: auto;
    padding: 10px 14px calc(18px + env(safe-area-inset-bottom, 0px));
    border-radius: 18px 18px 0 0;
    background: var(--cabinet-sheet, #0b1220);
    border-top: 1px solid var(--cabinet-line, rgba(148, 163, 184, 0.18));
    box-shadow: 0 -16px 40px rgba(0, 0, 0, 0.35);
  }
}
/* Sheet lives outside #appShell — style via #cabinetMoreSheet / body flags. */
#cabinetMoreSheet .cabinet-more-sheet__grab,
#appShell .cabinet-more-sheet__grab {
  width: 40px;
  height: 4px;
  margin: 2px auto 10px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.35);
}
#cabinetMoreSheet .cabinet-more-sheet__title,
#appShell .cabinet-more-sheet__title {
  margin: 0 0 10px;
  font-size: 17px;
  font-weight: 700;
  color: var(--cabinet-text, #f1f5f9);
}
#cabinetMoreSheet .cabinet-more-sec,
#appShell .cabinet-more-sec {
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--cabinet-muted, #94a3b8);
  padding: 4px 4px 8px;
}
#cabinetMoreSheet .cabinet-more-sec--sep,
#appShell .cabinet-more-sec--sep {
  margin-top: 10px;
  padding-top: 12px;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
}
#cabinetMoreSheet .cabinet-more-item--icon {
  display: flex;
  align-items: center;
  gap: 10px;
}
#cabinetMoreSheet .cabinet-more-item--icon svg {
  flex: 0 0 auto;
}
#cabinetMoreSheet .cabinet-more-item,
#appShell .cabinet-more-item {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  color: var(--cabinet-text, #e2e8f0);
  font-size: 14px;
  font-weight: 600;
  padding: 12px 8px;
  border-radius: 10px;
  min-height: 44px;
  cursor: pointer;
}
#cabinetMoreSheet .cabinet-more-item.cabinet-more-item--icon {
  display: flex;
  align-items: center;
  gap: 10px;
}
#cabinetMoreSheet .cabinet-more-item--icon svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  display: block;
  stroke: currentColor;
  fill: none;
}
#cabinetMoreSheet .cabinet-more-item:hover,
#cabinetMoreSheet .cabinet-more-item:focus-visible,
#appShell .cabinet-more-item:hover,
#appShell .cabinet-more-item:focus-visible {
  background: rgba(140, 102, 255, 0.12);
}
#cabinetMoreSheet .cabinet-more-item--sub,
#appShell .cabinet-more-item--sub {
  color: var(--cabinet-text, #cbd5e1);
  font-size: 13px;
  font-weight: 550;
  padding-left: 18px;
}
#cabinetMoreSheet .cabinet-more-item--danger,
#appShell .cabinet-more-item--danger {
  color: #fca5a5;
}
#cabinetMoreSheet .cabinet-more-hint,
#appShell .cabinet-more-hint {
  margin: 0;
  padding: 4px 8px 10px;
  font-size: 12px;
  color: var(--cabinet-muted, #94a3b8);
  line-height: 1.4;
}
#cabinetMoreSheet .cabinet-more-hint--foot,
#appShell .cabinet-more-hint--foot {
  padding-top: 10px;
  font-size: 11px;
}
#cabinetMoreSheet .cabinet-more-proposal,
#appShell .cabinet-more-proposal {
  margin: 4px 0 8px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px dashed rgba(148, 163, 184, 0.28);
  background: rgba(148, 163, 184, 0.06);
}
#cabinetMoreSheet .cabinet-more-proposal__title,
#appShell .cabinet-more-proposal__title {
  font-size: 13px;
  font-weight: 650;
  color: var(--cabinet-text, #e2e8f0);
  margin-bottom: 4px;
}
#appShell .links-edit-context__row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: baseline;
  min-width: 0;
}
#appShell .links-edit-context__label {
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--eds-text-muted);
  flex: 0 0 auto;
  min-width: 120px;
}
#appShell .links-edit-context__value {
  font-size: 14px;
  font-weight: 600;
  color: var(--eds-text-main);
  word-break: break-word;
  min-width: 0;
  flex: 1 1 200px;
}
#appShell .links-edit-context__slug {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13px;
  color: var(--eds-text-main);
  background: var(--chip-bg, rgba(148, 163, 184, 0.14));
  padding: 4px 10px;
  border-radius: 6px;
  border: 1px solid var(--eds-border);
  word-break: break-all;
  min-width: 0;
  flex: 1 1 200px;
}
#appShell .links-edit-context__hint {
  margin: 4px 0 0;
  color: var(--eds-text-muted);
  font-size: 12px;
  line-height: 1.5;
}
@media (max-width: 640px) {
  #appShell .links-edit-context__label {
    min-width: 0;
  }
}

/* =========================================
   TEAM INVITE block (раунд 5 — единый чистый блок «Добавить сотрудника»)
   Один вход — роль + кнопка «Сгенерировать ссылку».
   Партнёр задаётся ОДИН раз через верхний scope-селектор.
   Ручной fallback (по TG ID / @username) скрыт в <details> для admin/curator.
   ========================================= */
.team-invite-block {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px;
  margin: 12px 0;
  background: var(--eds-bg-soft, rgba(255, 255, 255, 0.02));
  border: 1px solid var(--eds-border);
  border-radius: 14px;
}
.team-invite-block[hidden] { display: none !important; }
.team-invite-block__head {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.team-invite-block__head h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--eds-text-main);
  letter-spacing: -0.01em;
}
.team-invite-block__sub {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--eds-text-muted);
}
.team-invite-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
}
.team-invite-form__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.team-invite-form__field label {
  font-size: 12px;
  font-weight: 500;
  color: var(--eds-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.team-invite-form__field select,
.team-invite-form__field input {
  width: 100%;
  height: 40px;
  padding: 0 12px;
}
.team-invite-form__action {
  display: flex;
  align-items: end;
}
.team-invite-form__action button {
  height: 40px;
  padding: 0 18px;
  white-space: nowrap;
}
.team-invite-result {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  background: var(--eds-bg-surface);
  border: 1px solid var(--eds-border);
  border-radius: 10px;
}
.team-invite-result[hidden] { display: none !important; }
.team-invite-result__row {
  display: flex;
  gap: 8px;
  align-items: stretch;
  flex-wrap: wrap;
}
.team-invite-result__row input {
  flex: 1 1 280px;
  min-width: 0;
  height: 40px;
  padding: 0 12px;
  font-size: 13px;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  background: var(--eds-bg-soft, #111e34);
  color: var(--eds-text-main);
  border: 1px solid var(--eds-border);
  border-radius: 8px;
}
.team-invite-result__row button {
  flex: 0 0 auto;
  height: 40px;
  padding: 0 14px;
  white-space: nowrap;
}
.team-invite-result__meta {
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--eds-text-muted);
}
.team-invite-fallback {
  margin-top: 4px;
  border: 1px dashed var(--eds-border);
  border-radius: 10px;
  padding: 0;
  background: transparent;
}
.team-invite-fallback[hidden] { display: none !important; }
.team-invite-fallback > summary {
  padding: 10px 12px;
  cursor: pointer;
  font-size: 13px;
  color: var(--eds-text-muted);
  user-select: none;
  list-style: none;
}
.team-invite-fallback > summary::-webkit-details-marker { display: none; }
.team-invite-fallback > summary::before {
  content: "▸";
  display: inline-block;
  margin-right: 8px;
  transition: transform 120ms ease;
  color: var(--eds-text-muted);
}
.team-invite-fallback[open] > summary::before { transform: rotate(90deg); }
.team-invite-fallback__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  padding: 0 12px 12px;
}
.team-invite-fallback__grid label {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: var(--eds-text-muted);
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.team-invite-fallback #teamManageLine { padding: 0 12px 12px; margin-top: 0 !important; }
.team-invite-fallback #teamUpsertHint { padding: 0 12px 12px; margin: 0; }

@media (max-width: 640px) {
  .team-invite-block { padding: 14px; gap: 12px; }
  .team-invite-form {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }
  .team-invite-form__action { align-items: stretch; }
  .team-invite-form__action button { width: 100%; }
  .team-invite-result__row { flex-direction: column; }
  .team-invite-result__row input {
    flex: 0 0 auto;
    width: 100%;
    height: 40px;
  }
  .team-invite-result__row button { width: 100%; }
}

/* =========================================
   HOTFIX ROUND 9 — BRAND ALIGNMENT WITH edsofa.ai LANDING
   =========================================
   Цель: сделать PWA визуальным продолжением родительского лендинга
   (https://edsofa.ai/lead/), не переписывая 1900 строк существующих
   правил. Стратегия — переопределить ЗНАЧЕНИЯ токенов `--fd-*` / `--eds-*`
   на бренд-палитру в одном месте, ниже всех предыдущих :root-блоков.
   Каскад делает остальное.

   Источник цветов: landing rgtheme/css/all.css
     --accent-color: #8C66FF (Violet — primary brand)
     --light-accent: #AF94FF
     --orange: #FF8600
     --dark-main: #03142c, --lighter-dark: #142339, --dark: #031024
     --pale-gray: #243247, --cite: #1D2C43, --light-text: #48576B
     --faded-text: #A3A3A5, --green: #8CC174, --red: #e30907,
     --blue-bright: #1576E5
     --button-bg: linear-gradient(137.93deg, #8C66FF 4.21%, #FF5E00 159.56%)
     --light-shine: 0px 4px 29.4px 0px rgba(140, 102, 255, 0.3)
     --distant-shadow: 0px 9px 53.5px 0px rgba(140, 102, 255, 0.48)
   Шрифт: Jost из своей статики, затем Inter и системный sans-serif.
   ========================================= */
/* W3.7: :root block merged upward (see top of file). */

/* Шрифт: Jost по всему кабинету. Inter — запас, если файл Jost не загрузился. */
body,
#appShell,
#appShell input,
#appShell select,
#appShell textarea,
#appShell button,
.login-form input,
.login-form select,
.login-form button {
  font-family: var(--brand-font);
}

/* Фон body — глубокий бренд-navy с фиолетовым световым акцентом
   слева сверху (как радиальные подсветки на лендинге edsofa). */
body {
  background:
    radial-gradient(circle at 14% 6%, rgba(140, 102, 255, 0.18) 0%, transparent 38%),
    radial-gradient(circle at 88% 92%, rgba(255, 134, 0, 0.10) 0%, transparent 48%),
    linear-gradient(180deg, var(--brand-dark) 0%, var(--brand-dark-main) 45%, var(--brand-dark-lighter) 100%);
  color: var(--fd-text-main);
}

/* Hero/обёртки получают бренд-градиент-флер. */
.hero,
#appShell .hero,
#appShell .welcome-card {
  background: var(--cabinet-header, radial-gradient(circle at 12% 0%, rgba(140, 102, 255, 0.22) 0%, transparent 55%), linear-gradient(135deg, var(--brand-dark-lighter) 0%, var(--brand-dark-main) 100%));
  border-color: var(--fd-border);
}

/* Первичные кнопки: solid бренд-violet с мягким glow при hover.
   Селекторы повторяют существующую иерархию, чтобы не сломать
   специфичность. */
/* Exclude pay-tiles / outline manage / adv toggles — idle must stay dark, not solid purple. */
#appShell button:not(.secondary):not(.menu-btn):not(.subnav-btn):not(.icon-btn):not(.row-team-remove-btn):not(.tk-op-card__toggle):not(.apps-pay-tile):not(.links-pay-tile):not(.links-adv-toggle):not(.sec):not(.edit-link-btn):not(.toggle-link-btn):not(.apps-cab-chip):not(.an-cat-chip):not(.links-form-cancel-btn):not(.theme-toggle),
#appShell .primary,
.login-form .primary {
  background: var(--brand-violet);
  border: 1px solid var(--brand-violet);
  color: #ffffff;
  border-radius: 12px;
  transition: background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}
#appShell button:not(.secondary):not(.menu-btn):not(.subnav-btn):not(.icon-btn):not(.row-team-remove-btn):not(.tk-op-card__toggle):not(.apps-pay-tile):not(.links-pay-tile):not(.links-adv-toggle):not(.sec):not(.edit-link-btn):not(.toggle-link-btn):not(.apps-cab-chip):not(.an-cat-chip):not(.links-form-cancel-btn):not(.theme-toggle):hover,
#appShell .primary:hover,
.login-form .primary:hover {
  background: var(--brand-violet-soft);
  border-color: var(--brand-violet-soft);
  box-shadow: var(--brand-glow);
}
#appShell button:disabled,
.login-form .primary:disabled {
  background: rgba(140, 102, 255, 0.35);
  border-color: transparent;
  color: rgba(255, 255, 255, 0.7);
  box-shadow: none;
  cursor: not-allowed;
}

/* Hero CTA — особая гордость бренда, использует фирменный градиент
   violet → orange. Применяется через утилитарный класс к одной-двум
   ключевым кнопкам (вход, генерация инвайта, создание заявки). */
#appShell .primary--gradient,
.login-form .primary--gradient,
.primary--gradient {
  background: var(--brand-gradient);
  border: none;
  color: #ffffff;
  font-weight: 600;
  border-radius: 14px;
  box-shadow: var(--brand-glow);
}
#appShell .primary--gradient:hover,
.login-form .primary--gradient:hover,
.primary--gradient:hover {
  filter: brightness(1.06);
  box-shadow: var(--brand-glow-strong);
}

/* Secondary — тонкая бренд-обводка вместо холодно-синей. */
#appShell .secondary,
.login-form .secondary {
  background: transparent;
  color: var(--fd-text-main);
  border: 1px solid rgba(140, 102, 255, 0.35);
  border-radius: 12px;
}
#appShell .secondary:hover,
.login-form .secondary:hover {
  background: rgba(140, 102, 255, 0.12);
  border-color: var(--brand-violet);
}

/* Активный пункт меню в боковой панели получает бренд-акцент,
   а не синий блок. */
#appShell .menu-btn.active,
#appShell .menu-btn[aria-current="true"] {
  background: rgba(140, 102, 255, 0.15);
  border-left: 3px solid var(--brand-violet);
  color: #ffffff;
}

/* Подсветка строки только что созданной статичной ссылки:
   фиолетовый flash вместо холодно-синего. */
#appShell tr.links-row-highlight {
  background: rgba(140, 102, 255, 0.16);
}

/* Pills (status chips) — приводим в брендовую гамму. */
#appShell .pill {
  border-radius: 999px;
}
#appShell .pill.ok {
  background: rgba(140, 193, 116, 0.16);
  border: 1px solid rgba(140, 193, 116, 0.45);
  color: var(--brand-green);
}
#appShell .pill.bad {
  background: rgba(227, 9, 7, 0.14);
  border: 1px solid rgba(227, 9, 7, 0.45);
  color: #ff7e7d;
}
#appShell .pill.na {
  background: rgba(163, 163, 165, 0.12);
  border: 1px solid rgba(163, 163, 165, 0.4);
  color: var(--brand-faded);
}
#appShell .pill.warn {
  background: rgba(255, 134, 0, 0.16);
  border: 1px solid rgba(255, 134, 0, 0.5);
  color: var(--brand-orange);
}
#appShell .cell-pills {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}
#appShell .side-menu .submenu-group-title {
  color: var(--eds-text-muted);
}

/* Фокусные обводки на полях ввода — бренд-violet с soft glow. */
#appShell input:focus,
#appShell select:focus,
#appShell textarea:focus,
.login-form input:focus,
.login-form select:focus {
  outline: none;
  border-color: var(--brand-violet);
  box-shadow: 0 0 0 3px rgba(140, 102, 255, 0.22);
}

/* Заголовки h1-h4 — шрифт Jost с чуть более активным трекингом,
   как на лендинге. */
h1, h2, h3, h4,
#appShell h1, #appShell h2, #appShell h3, #appShell h4 {
  font-family: var(--brand-font);
  letter-spacing: -0.01em;
}

/* Ссылки в тексте — бренд-violet. */
a,
#appShell a {
  color: var(--brand-violet-soft);
}
a:hover,
#appShell a:hover {
  color: var(--brand-violet);
}

/* Подсветка только что созданной/выделенной строки в таблице ссылок —
   фиолетовая тень + бренд-цвет ссылки внутри. */
#appShell tr.links-row-highlight a {
  color: var(--brand-violet-soft);
}

/* =========================================
   HOTFIX ROUND 10 — GRADIENT POLISH + APP CARD MODAL
   =========================================
   Пользователь попросил «больше градиентов и плавных переходов» — делаем
   первичные кнопки с фирменным subtle-градиентом и hover-shift, добавляем
   smooth cubic-bezier transitions на интерактивные элементы.
   ========================================= */

/* Cubic-bezier transition token — единый «дыхание» для всего UI. */
/* W3.7: :root block merged upward (see top of file). */

/* Первичные кнопки теперь имеют subtle бренд-градиент (violet → deep-violet),
   а hover «раскрывается» в фирменный violet → orange. Это даёт «жизнь»
   без crash-кричащей броскости. */
#appShell button:not(.secondary):not(.menu-btn):not(.subnav-btn):not(.icon-btn):not(.row-team-remove-btn):not(.pwa-modal-close):not(.copy-link-btn):not(.tk-op-card__toggle):not(.apps-pay-tile):not(.links-pay-tile):not(.links-adv-toggle):not(.sec):not(.edit-link-btn):not(.toggle-link-btn):not(.apps-cab-chip):not(.an-cat-chip):not(.links-form-cancel-btn):not(.theme-toggle),
#appShell .primary,
.login-form .primary {
  background: linear-gradient(135deg, var(--brand-violet) 0%, #7048e4 100%);
  border: 1px solid rgba(140, 102, 255, 0.6);
  color: #ffffff;
  border-radius: 12px;
  position: relative;
  overflow: hidden;
  transition: transform var(--brand-transition),
              box-shadow var(--brand-transition),
              filter var(--brand-transition),
              background-position 400ms var(--brand-ease);
  background-size: 200% 100%;
  background-position: 0% 0%;
}
#appShell button:not(.secondary):not(.menu-btn):not(.subnav-btn):not(.icon-btn):not(.row-team-remove-btn):not(.pwa-modal-close):not(.copy-link-btn):not(.tk-op-card__toggle):not(.apps-pay-tile):not(.links-pay-tile):not(.links-adv-toggle):not(.sec):not(.edit-link-btn):not(.toggle-link-btn):not(.apps-cab-chip):not(.an-cat-chip):not(.links-form-cancel-btn):not(.theme-toggle):hover,
#appShell .primary:hover,
.login-form .primary:hover {
  background: var(--brand-gradient);
  border-color: rgba(255, 134, 0, 0.55);
  box-shadow: var(--brand-glow);
  transform: translateY(-1px);
}
#appShell button:not(.secondary):not(.menu-btn):not(.subnav-btn):not(.icon-btn):not(.row-team-remove-btn):not(.pwa-modal-close):not(.copy-link-btn):not(.tk-op-card__toggle):not(.apps-pay-tile):not(.links-pay-tile):not(.links-adv-toggle):not(.sec):not(.edit-link-btn):not(.toggle-link-btn):not(.apps-cab-chip):not(.an-cat-chip):not(.links-form-cancel-btn):not(.theme-toggle):active,
#appShell .primary:active {
  transform: translateY(0);
  box-shadow: 0 2px 12px rgba(140, 102, 255, 0.25);
}
#appShell button:disabled,
.login-form .primary:disabled {
  background: rgba(140, 102, 255, 0.28);
  border-color: transparent;
  color: rgba(255, 255, 255, 0.65);
  box-shadow: none;
  transform: none;
  cursor: not-allowed;
  filter: grayscale(0.2);
}

/* A1: idle vs selected. !important beats Hotfix Round 10 gradient
   (#appShell button:not(...) stacks :not specificity above a normal class).
   Light theme is excluded: those declarations would paint tiles black. */
html:not([data-theme="light"]) #appShell button.apps-pay-tile,
html:not([data-theme="light"]) #appShell button.apps-pay-tile:hover,
html:not([data-theme="light"]) #appShell button.apps-pay-tile:active,
html:not([data-theme="light"]) body.pwa-seller-cabinet-chrome #appShell button.apps-pay-tile {
  background: #0b1220 !important;
  background-image: none !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  color: var(--cabinet-muted, #94a3b8) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
html:not([data-theme="light"]) #appShell button.apps-pay-tile.is-selected,
html:not([data-theme="light"]) #appShell button.apps-pay-tile.is-selected:hover,
html:not([data-theme="light"]) #appShell button.apps-pay-tile.on.is-selected,
html:not([data-theme="light"]) body.pwa-seller-cabinet-chrome #appShell button.apps-pay-tile.is-selected {
  background: rgba(124, 58, 237, 0.28) !important;
  background-image: none !important;
  border: 2px solid #ddd6fe !important;
  color: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
#appShell .apps-pay-tile:not(.on):hover,
#appShell button.apps-pay-tile:not(.on):hover {
  background: #111827;
  background-image: none;
  border-color: rgba(148, 163, 184, 0.5);
  color: var(--cabinet-text, #cbd5e1);
  box-shadow: none;
  transform: none;
}
#appShell .links-pay-tile,
#appShell button.links-pay-tile,
body.pwa-seller-cabinet-chrome #appShell .links-pay-tile,
#appShell.app-shell--seller-cabinet .links-pay-tile {
  background: #0f172a;
  background-image: none;
  border: 1px solid rgba(148, 163, 184, 0.32);
  color: var(--cabinet-muted, #94a3b8);
  box-shadow: none;
  filter: none;
  transform: none;
  overflow: visible;
}
#appShell .links-pay-tile.on,
#appShell button.links-pay-tile.on,
body.pwa-seller-cabinet-chrome #appShell .links-pay-tile.on,
#appShell.app-shell--seller-cabinet .links-pay-tile.on {
  background: rgba(124, 58, 237, 0.22);
  background-image: none;
  border-color: rgba(124, 58, 237, 0.8);
  color: var(--cabinet-text, #ede9fe);
  box-shadow: inset 0 0 0 1px rgba(124, 58, 237, 0.4);
}
#appShell .links-pay-tile:not(.on):hover,
#appShell button.links-pay-tile:not(.on):hover {
  background: #111827;
  background-image: none;
  border-color: rgba(148, 163, 184, 0.5);
  color: var(--cabinet-text, #cbd5e1);
  box-shadow: none;
  transform: none;
}
/* A2: numeric stepper must not occupy layout (dots removed from HTML). */
body.pwa-seller-cabinet-chrome #appShell .apps-wiz-bar,
body.pwa-seller-cabinet-chrome #appShell .apps-wiz-dot,
body.pwa-seller-cabinet-chrome #appShell #appsWizBar,
#appShell.app-shell--seller-cabinet .apps-wiz-bar,
#appShell.app-shell--seller-cabinet .apps-wiz-dot {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  pointer-events: none !important;
}
/* A3: step 2 = pay tiles only. Term/product fields out of layout. */
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #appsProductStep,
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #appsClientStep,
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #appsTermExtras,
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #appTermWrap,
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #appInternalFreqWrap,
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #appInternalMonthsWrap,
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #appFirstPaymentWrap {
  display: none !important;
}
/* B2: no list under open create/edit form */
body.pwa-seller-cabinet-chrome #appShell:has(#editLinkPanel:not(.hidden)) #linksCabinetChrome,
body.pwa-seller-cabinet-chrome #appShell:has(#createLinkPanel:not(.hidden)) #linksCabinetChrome,
body.pwa-seller-cabinet-chrome #appShell:has(#editLinkPanel:not(.hidden)) #linksTableWrap,
body.pwa-seller-cabinet-chrome #appShell:has(#createLinkPanel:not(.hidden)) #linksTableWrap,
#appShell.app-shell--seller-cabinet:has(#editLinkPanel:not(.hidden)) #linksCabinetChrome,
#appShell.app-shell--seller-cabinet:has(#createLinkPanel:not(.hidden)) #linksCabinetChrome,
#appShell.app-shell--seller-cabinet:has(#editLinkPanel:not(.hidden)) #linksTableWrap,
#appShell.app-shell--seller-cabinet:has(#createLinkPanel:not(.hidden)) #linksTableWrap {
  display: none;
}
/* B3: Дополнительно = quiet accordion, never primary CTA look */
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-adv-toggle,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-adv-toggle,
#appShell button.links-adv-toggle {
  background: transparent;
  background-image: none;
  border: 0;
  color: var(--cabinet-muted, #94a3b8);
  box-shadow: none;
  filter: none;
  transform: none;
  font-weight: 650;
  min-height: 0;
  padding: 10px 4px;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-adv-toggle:hover,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-adv-toggle:hover,
#appShell button.links-adv-toggle:hover {
  background: rgba(148, 163, 184, 0.06);
  background-image: none;
  color: var(--cabinet-text, #cbd5e1);
  box-shadow: none;
  transform: none;
}
/* B4 mobile P-007: copy primary full-width; manage outline 1fr|1fr */
@media (max-width: 900px) {
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-sec-actions,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-sec-actions {
    flex-direction: column;
    align-items: stretch;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-copy-btn,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-copy-btn {
    width: 100%;
    min-height: 44px;
    background: #7c3aed;
    border-color: #7c3aed;
    color: #fff;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-manage-row,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-manage-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-manage-row .sec,
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-manage-row .secondary,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-manage-row .sec,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-manage-row .secondary {
    width: 100%;
    min-height: 44px;
    background: transparent;
    background-image: none;
    border: 1px solid var(--cabinet-quiet-btn-border, rgba(148, 163, 184, 0.36));
    color: var(--cabinet-quiet-btn-color, #cbd5e1);
    box-shadow: none;
    filter: none;
    transform: none;
  }
}
/* A4: apps list mobile — grid titles | actions (beats column flex-direction). */
@media (max-width: 900px) {
  body.pwa-seller-cabinet-chrome #appShell .work-card[data-card="apps"] .work-card-head.work-card-head--apps,
  #appShell.app-shell--seller-cabinet .work-card[data-card="apps"] .work-card-head.work-card-head--apps {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas: "titles actions" !important;
    align-items: center !important;
    column-gap: 8px !important;
    flex-direction: unset !important;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card[data-card="apps"] .work-card-head--apps .work-head-titles,
  #appShell.app-shell--seller-cabinet .work-card[data-card="apps"] .work-card-head--apps .work-head-titles {
    grid-area: titles !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card[data-card="apps"] .work-card-head--apps > .toolbar,
  #appShell.app-shell--seller-cabinet .work-card[data-card="apps"] .work-card-head--apps > .toolbar {
    grid-area: actions !important;
    width: auto !important;
    max-width: none !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    flex-direction: row !important;
    gap: 6px !important;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card[data-card="apps"] #appsListTools #appsCreateLinkBtn,
  #appShell.app-shell--seller-cabinet .work-card[data-card="apps"] #appsListTools #appsCreateLinkBtn {
    white-space: nowrap;
    padding-left: 10px;
    padding-right: 10px;
  }
}
/* G2: links list ≤900 — same title | actions row as apps. */
@media (max-width: 900px) {
  body.pwa-seller-cabinet-chrome #appShell .work-card[data-card="links"] .work-card-head.work-card-head--links,
  #appShell.app-shell--seller-cabinet .work-card[data-card="links"] .work-card-head.work-card-head--links {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "titles actions";
    align-items: center;
    column-gap: 8px;
    flex-direction: row;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card[data-card="links"] .work-card-head--links .work-head-titles,
  #appShell.app-shell--seller-cabinet .work-card[data-card="links"] .work-card-head--links .work-head-titles {
    grid-area: titles;
    width: auto;
    max-width: none;
    min-width: 0;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card[data-card="links"] .work-card-head--links > .toolbar,
  #appShell.app-shell--seller-cabinet .work-card[data-card="links"] .work-card-head--links > .toolbar {
    grid-area: actions;
    width: auto;
    max-width: none;
    justify-content: flex-end;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 6px;
  }
  body.pwa-seller-cabinet-chrome #appShell .work-card[data-card="links"] #linksListTools button,
  #appShell.app-shell--seller-cabinet .work-card[data-card="links"] #linksListTools button {
    white-space: nowrap;
  }
}
#appShell.app-shell--seller-cabinet .apps-cab-filters {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0 0 12px;
}
#appShell.app-shell--seller-cabinet .apps-cab-filters__row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: flex-end;
}
#appShell.app-shell--seller-cabinet .apps-cab-filters__row > label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 9rem;
  min-width: 0;
  margin: 0;
  font-size: 12px;
}
#appShell.app-shell--seller-cabinet .apps-cab-filters__row select,
#appShell.app-shell--seller-cabinet .apps-cab-filters__row input[type="date"],
#appShell.app-shell--seller-cabinet .apps-cab-filters__row input[type="search"] {
  width: 100%;
  min-height: 40px;
  font-size: 13px;
  box-sizing: border-box;
}
#appShell.app-shell--seller-cabinet .apps-cab-chips {
  flex-wrap: nowrap;
  overflow-x: auto;
  margin: 0;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
#appShell.app-shell--seller-cabinet .apps-cab-chip {
  flex: 0 0 auto;
  white-space: nowrap;
}
@media (min-width: 901px) {
  #appShell.app-shell--seller-cabinet .apps-cab-filters__row {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  #appShell.app-shell--seller-cabinet .apps-cab-filters__row > label {
    flex: 0 1 16rem;
  }
}
#appShell.app-shell--seller-cabinet .links-cab-search {
  display: block;
  margin: 0 0 12px;
}
#appShell.app-shell--seller-cabinet .links-cab-search input {
  width: 100%;
  box-sizing: border-box;
  min-height: 44px;
}
/* G3: analytics under the shell — work-head spacing, existing metrics untouched. */
#appShell.app-shell--seller-cabinet .work-card[data-card="analytics"] .analytics-filters {
  margin-top: 4px;
}
#appShell.app-shell--seller-cabinet .work-card[data-card="analytics"] .an-kpi-primary,
#appShell.app-shell--seller-cabinet .work-card[data-card="analytics"] .analytics-kpi,
#appShell.app-shell--seller-cabinet .work-card[data-card="analytics"] .an-dir-cards {
  gap: 12px;
}
#appShell.app-shell--seller-cabinet .work-card[data-card="analytics"] .an-channel {
  margin-top: 16px;
}
.an-chrome-search { display: none; }
#appShell.app-shell--seller-cabinet .an-native-long { display: none; }
#appShell.app-shell--seller-cabinet .an-chrome-search { display: block; }
/* Ga1: filter fields in a grid; actions stay one row. */
#appShell.app-shell--seller-cabinet #analyticsFilters .filter-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
  align-items: end;
}
#appShell.app-shell--seller-cabinet #analyticsFilters label[data-filter] {
  grid-column: auto;
}
#appShell.app-shell--seller-cabinet #analyticsFilters .filter-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
#appShell.app-shell--seller-cabinet #analyticsFilters .filter-actions button {
  flex: 0 1 auto;
  width: auto;
  min-height: 40px;
}
@media (max-width: 900px) {
  #appShell.app-shell--seller-cabinet #analyticsFilters .filter-row {
    grid-template-columns: 1fr 1fr;
  }
}
/* Ga3: section chips read as one segment and scroll instead of clipping. */
#appShell.app-shell--seller-cabinet .an-cat-chips {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  gap: 4px;
  margin: 4px 0 16px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
#appShell.app-shell--seller-cabinet .an-cat-chip {
  flex: 0 0 auto;
  min-height: 40px;
  padding: 8px 16px;
  font-size: 14px;
  line-height: 1.2;
  white-space: nowrap;
  background: transparent;
  color: var(--cabinet-text, #cbd5e1);
  border: 0;
  box-shadow: none;
}
#appShell.app-shell--seller-cabinet .an-cat-chip.is-active {
  background: var(--chip-on-bg, rgba(140, 102, 255, 0.22));
  color: var(--chip-on-fg, #fff);
  box-shadow: inset 0 0 0 1px rgba(175, 148, 255, 0.45);
}
@media (min-width: 901px) {
  #appShell.app-shell--seller-cabinet .an-cat-chip {
    flex: 1 1 0;
    text-align: center;
  }
}

/* Карточки (`.card`) — добавляем subtle gradient overlay + плавный
   hover-lift, чтобы интерфейс ощущался «живым», не статичным. */
#appShell .card {
  background:
    linear-gradient(180deg, rgba(140, 102, 255, 0.04) 0%, transparent 60%),
    var(--fd-bg-surface);
  transition: box-shadow var(--brand-transition), transform var(--brand-transition);
}

/* Hero/welcome — более выраженный бренд-градиент с фиолетовой подсветкой. */
#appShell .welcome-card,
#appShell .hero {
  background:
    radial-gradient(ellipse at 8% -10%, rgba(140, 102, 255, 0.28) 0%, transparent 55%),
    radial-gradient(ellipse at 92% 110%, rgba(255, 134, 0, 0.14) 0%, transparent 55%),
    linear-gradient(135deg, var(--brand-dark-lighter) 0%, var(--brand-dark-main) 100%);
  border: 1px solid rgba(140, 102, 255, 0.18);
  box-shadow: 0 8px 32px rgba(3, 16, 36, 0.45);
}

/* KPI карточки получают бренд-тёплую обводку при hover. */
#appShell .kpi .it {
  transition: border-color var(--brand-transition), box-shadow var(--brand-transition), transform var(--brand-transition);
}
#appShell .kpi .it:hover {
  border-color: rgba(140, 102, 255, 0.45);
  box-shadow: 0 6px 20px rgba(140, 102, 255, 0.16);
  transform: translateY(-2px);
}

/* Активный пункт меню — теперь с тонким бренд-градиентом-flare. */
#appShell .menu-btn.active,
#appShell .menu-btn[aria-current="true"] {
  background:
    linear-gradient(90deg, rgba(140, 102, 255, 0.22) 0%, rgba(140, 102, 255, 0.06) 100%);
  border-left: 3px solid var(--brand-violet);
  color: #ffffff;
}
#appShell .menu-btn {
  transition: background var(--brand-transition), color var(--brand-transition);
}
#appShell .menu-btn:hover:not(.active) {
  background: rgba(140, 102, 255, 0.08);
}

/* Поля ввода — плавная подсветка фокуса. */
#appShell input,
#appShell select,
#appShell textarea {
  transition: border-color var(--brand-transition), box-shadow var(--brand-transition), background var(--brand-transition);
}

/* ========== APP CARD MODAL (Карточка заявки) ========== */

/* Бренд-вариант оверлея и панели — переопределяет дефолтный белый. */
.pwa-modal-overlay.pwa-modal-overlay--brand {
  background: rgba(3, 16, 36, 0.68);
  backdrop-filter: blur(6px);
}
.pwa-modal-panel.pwa-modal-panel--brand {
  max-height: calc(100dvh - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(ellipse at 6% -5%, rgba(140, 102, 255, 0.18) 0%, transparent 55%),
    linear-gradient(180deg, var(--brand-dark-lighter) 0%, var(--brand-dark-main) 100%);
  color: var(--fd-text-main);
  border: 1px solid rgba(140, 102, 255, 0.22);
  box-shadow: 0 24px 64px rgba(3, 16, 36, 0.65), 0 0 0 1px rgba(140, 102, 255, 0.06);
  border-radius: 18px;
  padding: 22px 22px 24px;
}
.pwa-modal-panel--brand .pwa-modal-body {
  overflow: auto;
  min-height: 0;
}
.pwa-confirm-message {
  white-space: pre-line;
}
.pwa-modal-panel--brand .pwa-modal-title {
  color: var(--fd-text-main);
  font-family: var(--brand-font);
  font-weight: 600;
  letter-spacing: -0.01em;
}
.pwa-modal-panel--brand .pwa-modal-close,
.pwa-modal-panel .pwa-modal-close {
  color: var(--cabinet-text, #f1f5f9);
  background: rgba(148, 163, 184, 0.14);
  border: 1px solid rgba(148, 163, 184, 0.36);
  transition: color var(--brand-transition), background var(--brand-transition), border-color var(--brand-transition);
}
.pwa-modal-panel--brand .pwa-modal-close:hover,
.pwa-modal-panel .pwa-modal-close:hover {
  color: #fff;
  background: rgba(148, 163, 184, 0.28);
  border-color: rgba(196, 181, 253, 0.55);
  transform: none;
}
.pwa-modal-panel--brand .pwa-modal-title,
.pwa-modal-panel .pwa-modal-title {
  padding-right: 48px;
}

/* Сетка карточки заявки. */
.app-card-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 640px) {
  .app-card-grid { grid-template-columns: minmax(0, 1fr); }
}
.app-card-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(140, 102, 255, 0.14);
  border-radius: 14px;
  min-width: 0;
}
.app-card-section__title {
  margin: 0 0 4px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--brand-violet-soft);
}
.app-card-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}
.app-card-row__label {
  flex: 0 0 auto;
  min-width: min(130px, 100%);
  font-size: 12px;
  font-weight: 500;
  color: var(--brand-faded);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.app-card-row__value {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--fd-text-main);
  word-break: break-word;
}
.app-card-events {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.app-card-events li {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: baseline;
  font-size: 13px;
  padding: 6px 10px;
  background: rgba(140, 102, 255, 0.06);
  border-radius: 8px;
  border-left: 2px solid var(--brand-violet-soft);
}
.app-card-events__type {
  font-weight: 600;
  color: var(--fd-text-main);
}
.app-card-events__ts {
  color: var(--brand-faded);
  font-size: 12px;
}

/* Плавное появление модалки. */
@keyframes brandModalIn {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.pwa-modal-overlay.pwa-modal-overlay--brand:not(.hidden) .pwa-modal-panel--brand {
  animation: brandModalIn 220ms var(--brand-ease);
}

/* ========== TERM CHECKBOXES (brand fix) ==========
   Hotfix: legacy `.term-checks label` из светлой темы ставил
   `background: #fff` и тёмный текст. На бренд-навейном фоне получался
   белый куб с невидимым лейблом. Перерисовываем «пилл» в бренд-гамме.
   Дополнительно ограничиваем размер нативного чекбокса (иначе он
   тянется до размеров input-поля из глобального правила). */
#appShell .term-checks {
  flex-wrap: wrap;
  gap: 8px;
}
#appShell .term-checks label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--fd-text-main);
  background: rgba(140, 102, 255, 0.08);
  border: 1px solid rgba(140, 102, 255, 0.32);
  border-radius: 999px;
  padding: 7px 14px;
  cursor: pointer;
  transition: background var(--brand-transition),
              border-color var(--brand-transition),
              box-shadow var(--brand-transition),
              color var(--brand-transition);
  white-space: nowrap;
}
#appShell .term-checks label:hover {
  background: rgba(140, 102, 255, 0.16);
  border-color: var(--brand-violet);
}
#appShell .term-checks label:has(input[type="checkbox"]:checked) {
  background: var(--brand-violet);
  border-color: var(--brand-violet-soft);
  color: #ffffff;
  box-shadow: var(--brand-glow);
}
#appShell .term-checks label:has(input[type="checkbox"]:disabled) {
  opacity: 0.45;
  cursor: not-allowed;
  filter: grayscale(0.4);
}
#appShell .term-checks input[type="checkbox"] {
  /* Сбрасываем глобальные input-стили: фиксированный размер,
     нативный appearance (acccent-color подкрашивает галку в бренд). */
  appearance: auto;
  width: 16px;
  height: 16px;
  min-height: 16px;
  min-width: 16px;
  padding: 0;
  margin: 0;
  border-radius: 4px;
  border: 1px solid rgba(140, 102, 255, 0.5);
  background: transparent;
  accent-color: var(--brand-violet);
  cursor: pointer;
  flex: 0 0 auto;
}

/* ========== MOBILE FIXES — actions cells + modal viewport ==========
   Hotfix Round 12: на мобиле обнаружены два бага:

   1) В декшн-таблице ячейка «Действия» с 4 кнопками (Внутр. рассрочка,
      Полная оплата, Нет, спасибо, Карточка) пыталась уместить всё в
      flex-row с label слева на 38%. Каждой кнопке оставалось 15% и
      текст переносился по букве («китайский ресторан»).

   2) Модалка карточки заявки центрировалась через `align-items: center`.
      Если её панель выше viewport — верх с крестиком уезжал за экран
      и кнопку закрытия было невозможно достать на iPhone/узких экранах.
*/

/* (1) ACTIONS-cell: на мобиле стэкаем кнопки вертикально с полной
   шириной. Триггер — `data-label="Действия"`, который ставит
   `decorateResponsiveTables()` из заголовка `<th>Действия</th>`. */
@media (max-width: 768px) {
  #appShell .table-wrap td[data-label="Действия"] {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 6px;
  }
  #appShell .table-wrap td[data-label="Действия"]::before {
    flex: 0 0 auto;
    max-width: none;
    margin-bottom: 4px;
  }
  #appShell .table-wrap td[data-label="Действия"] > button,
  #appShell .table-wrap td[data-label="Действия"] > a {
    width: 100%;
    min-width: 0;
    align-self: stretch;
    text-align: center;
    white-space: normal;
    padding: 10px 12px;
    font-size: 14px;
    line-height: 1.2;
  }
  /* Доп. защита для блока кнопок, обёрнутых в `.links-actions`
     (статичные ссылки): тот же стэк. */
  #appShell .table-wrap td[data-label="Действия"] > .links-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
  }
  #appShell .table-wrap td[data-label="Действия"] > .links-actions > button {
    width: 100%;
    text-align: center;
    white-space: normal;
    padding: 10px 12px;
  }
}

/* (2) MODAL: на узком экране выравниваем по верху и даём комфортный
   отступ сверху/снизу — крестик всегда виден, длинный контент скроллится
   внутри оверлея, а не вылезает «за горизонт».
   Дополнительно — крестик чуть крупнее и в активной зоне ≥40×40 для
   уверенного попадания пальцем. */
@media (max-width: 640px) {
  .pwa-modal-overlay {
    align-items: flex-start;
    padding: calc(14px + env(safe-area-inset-top, 0px)) 12px calc(32px + env(safe-area-inset-bottom, 0px));
  }
  .pwa-modal-panel,
  .pwa-modal-panel--brand {
    margin-top: 8px;
    max-width: 100%;
  }
  .pwa-modal-close {
    /* DOM contract looks for 40px in this ≤640 block. C1 hit-target stays 44px
       via the later .pwa-modal-close !important rule. */
    width: 40px;
    height: 40px;
    min-width: 44px;
    min-height: 44px;
    font-size: 26px;
    top: 12px;
    right: 10px;
  }
  .pwa-modal-panel--brand .pwa-modal-title,
  .pwa-modal-panel .pwa-modal-title {
    margin-top: 2px;
    padding-right: 48px;
  }
}

/* C1: close always above modal content */
.pwa-modal-panel--brand .pwa-modal-close,
.pwa-modal-panel .pwa-modal-close {
  z-index: 2;
}

/* --- Демо-дашборд оплат мерчанта --- */
.analytics-payments {
  margin: 0 0 16px;
}

/* Category chips + panels
   Segmented tray: ряд сидит на поверхности карточки (--fd-bg-elevated),
   а не на чёрном sticky-слое --bg/#0b1220. Неактивные пункты — текст,
   активный — мягкая фиолетовая вставка, без отдельных «таблеток». */
.an-cat-chips {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  position: sticky;
  top: 0;
  z-index: 5;
  padding: 4px;
  margin: 0 0 14px;
  background: var(--fd-bg-elevated, #1b2436);
  border: 1px solid var(--fd-border, #2a3952);
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.an-cat-chip {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: var(--fd-text-muted, #a8b6cc);
  border-radius: 9px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.an-cat-chip:hover {
  background: rgba(140, 102, 255, 0.1);
  color: var(--fd-text-main, #edf3ff);
}
.an-cat-chip:focus-visible {
  outline: 2px solid var(--brand-violet, #8c66ff);
  outline-offset: 1px;
}
.an-cat-chip.is-active {
  background: rgba(140, 102, 255, 0.22);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(175, 148, 255, 0.45);
}
.an-panel {
  margin-bottom: 16px;
}
.an-panel.hidden {
  display: none !important;
}
.an-panel.is-loading,
.an-channel.is-loading {
  position: relative;
  pointer-events: none;
}
.an-panel.is-loading::after,
.an-channel.is-loading::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 12px;
  background: rgba(10, 16, 28, 0.42);
  z-index: 2;
}
.an-panel.is-loading .vv,
.an-panel.is-loading .an-dir-vv,
.an-channel.is-loading .vv,
.an-channel.is-loading .an-dir-vv {
  color: transparent;
  background: linear-gradient(90deg, rgba(140, 102, 255, 0.12), rgba(140, 102, 255, 0.28), rgba(140, 102, 255, 0.12));
  background-size: 200% 100%;
  animation: an-kpi-shimmer 1.1s linear infinite;
  border-radius: 6px;
  min-width: 2.4em;
}
@keyframes an-kpi-shimmer {
  to { background-position: -200% 0; }
}
.an-panel > h4 {
  margin: 0 0 10px;
}
.an-overview-deals {
  margin: 0 0 12px;
  font-size: 13px;
}
.an-channel {
  margin: 0 0 16px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid var(--fd-border, rgba(255, 255, 255, 0.08));
  background: var(--fd-bg-elevated, rgba(255, 255, 255, 0.03));
}
.an-channel > h4 {
  margin: 0 0 10px;
}
.an-dir-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.an-dir-cards-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.an-dir-card {
  text-align: left;
  border: 1px solid var(--fd-border, rgba(140, 102, 255, 0.45));
  background: var(--fd-bg-elevated, #1a293f);
  border-radius: 10px;
  padding: 12px;
  color: var(--fd-text-main, #e8eefc);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.an-dir-card:hover,
.an-dir-card:focus-visible {
  border-color: rgba(167, 139, 250, 0.85);
  background: var(--fd-bg-soft, #243247);
  outline: none;
}
.an-dir-title {
  font-size: 13px;
  font-weight: 600;
  color: #e8eefc;
}
.an-dir-vv {
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
}
.an-dir-sub {
  font-size: 12px;
  color: #c7d2fe;
}
.an-region-strip {
  margin: 8px 0 4px;
  font-size: 12px;
  line-height: 1.45;
}
.an-default-rate .vv {
  color: #fbbf24;
}
.an-illiquid .vv {
  color: var(--brand-orange);
}
.ap-mini-grid > .an-illiquid {
  grid-column: 1 / -1;
}
/* display:flex сетки и .an-dpd иначе показывают hidden-потомка ЛПР. */
.ap-mini-grid > .an-illiquid[hidden],
.an-dpd[hidden],
[data-an-staff-only][hidden] {
  display: none !important;
}
.an-dpd {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.an-dpd-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--eds-text-main, #e8eef8);
}
.an-dpd-group {
  padding: 8px 10px;
  border: 1px solid var(--eds-border, #24324a);
  border-radius: 10px;
  background: var(--eds-bg-soft, #111e34);
}
.an-dpd-group-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font-size: 11px;
  color: var(--eds-text-muted, #8b9bb5);
  margin-bottom: 8px;
}
.an-dpd-group-head span:last-child {
  color: var(--eds-text-main, #e8eef8);
  font-weight: 600;
}
.an-dpd-stack {
  display: flex;
  height: 8px;
  border-radius: 99px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.04);
  margin-bottom: 8px;
}
.an-dpd-stack i {
  display: block;
  height: 100%;
}
.an-dpd-stack-book i:nth-child(1) { background: #fde68a; }
.an-dpd-stack-book i:nth-child(2) { background: #fbbf24; }
.an-dpd-stack-book i:nth-child(3) { background: #d97706; }
.an-dpd-stack-out i:nth-child(1) { background: #fb923c; }
.an-dpd-stack-out i:nth-child(2) { background: var(--brand-orange, #FF8600); }
.an-dpd-rows {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.an-dpd-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 10px;
  align-items: baseline;
  font-size: 12px;
}
.an-dpd-lbl { color: var(--eds-text-muted, #8b9bb5); }
.an-dpd-n { color: var(--eds-text-main, #e8eef8); font-weight: 600; font-variant-numeric: tabular-nums; }
.an-dpd-pct { color: var(--eds-text-muted, #8b9bb5); font-variant-numeric: tabular-nums; min-width: 2.4em; text-align: right; }
.an-dpd-group.is-out .an-dpd-n { color: var(--brand-orange, #FF8600); }
.ap-default-series {
  margin: 12px 0 4px;
}
.ap-default-series h4 {
  margin: 0 0 4px;
  font-size: 14px;
}
.ap-default-line {
  stroke: var(--chart-line, #8C66FF);
}
.ap-default-series .ap-avg-dot {
  fill: var(--chart-line, #8C66FF);
}
.an-kpi-primary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.an-kpi-primary .it {
  min-width: 0;
}
.an-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 12px 0;
}
.an-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-top: 12px;
}
.an-table-scroll table {
  min-width: 480px;
}
.an-table-scroll th:first-child,
.an-table-scroll td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;
}
.an-table-scroll th:first-child {
  background: var(--fd-bg-elevated, #1a293f);
  z-index: 2;
}
.an-table-scroll td:first-child {
  background: var(--fd-bg-surface, #142339);
}
.an-table-scroll tbody tr:nth-child(even) td:first-child {
  background: var(--fd-bg-soft, #243247);
}
.th-sort {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.th-sort::after {
  content: "↕";
  display: inline-block;
  margin-left: 4px;
  font-size: 10px;
  opacity: 0.35;
}
.th-sort[aria-sort="ascending"]::after {
  content: "↑";
  opacity: 1;
}
.th-sort[aria-sort="descending"]::after {
  content: "↓";
  opacity: 1;
}
.an-cat-empty,
.an-ov-hint {
  margin: 8px 0 12px;
}
.an-pa-subs {
  margin: 12px 0;
}
#analyticsFilters .search-select {
  max-width: none;
  width: 100%;
}
#anPartnerInput {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
@media (max-width: 720px) {
  .an-dir-cards,
  .an-dir-cards-2,
  .an-detail-grid {
    grid-template-columns: 1fr;
  }
  .an-kpi-primary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .an-cat-chips {
    top: env(safe-area-inset-top, 0);
  }
  .ap-bars {
    height: 160px;
  }
  .ap-chart {
    min-height: 160px;
  }
  .analytics-filters .filter-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .analytics-filters .filter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .analytics-filters .filter-actions button {
    flex: 1 1 auto;
    min-height: 40px;
  }
  .analytics-kpi {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (min-width: 721px) and (max-width: 1100px) {
  .analytics-filters .filter-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 721px) {
  .ap-chart {
    min-height: 200px;
  }
  .ap-bars {
    height: 200px;
  }
}

.ap-ingest {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 10px;
  background: var(--surface-2, #f8fafc);
}
.ap-ingest h4 {
  margin: 0 0 8px;
}
.ap-ingest-hint,
.ap-ingest-steps {
  margin: 0 0 10px;
  font-size: 0.9rem;
  line-height: 1.45;
}
.ap-ingest-steps {
  padding-left: 1.2rem;
}
.ap-ingest-modes {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin: 10px 0;
  font-size: 0.92rem;
}
.ap-ingest-modes label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
}
.ap-ingest-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.ap-ingest-status {
  margin-top: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid var(--border, #e2e8f0);
  white-space: pre-wrap;
}
.ap-ingest-status.is-busy {
  border-color: rgba(99, 102, 241, 0.45);
  background: rgba(99, 102, 241, 0.06);
  padding-left: 34px;
  position: relative;
  min-height: 2.6em;
}
.ap-ingest-status.is-busy::before {
  content: '';
  position: absolute;
  left: 10px;
  top: 12px;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(99, 102, 241, 0.25);
  border-top-color: rgba(99, 102, 241, 0.9);
  border-radius: 50%;
  animation: ap-ingest-spin 0.75s linear infinite;
}
.ap-ingest.is-busy {
  opacity: 0.92;
}
@keyframes ap-ingest-spin {
  to { transform: rotate(360deg); }
}
.ap-empty {
  margin: 8px 0 12px;
}
.ap-ingest-partner {
  display: block;
  margin: 0 0 12px;
}
.ap-ingest-partner > span {
  display: block;
  margin-bottom: 6px;
  font-size: 0.92rem;
}
.ap-ingest-partner-context {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(99, 102, 241, 0.08);
  line-height: 1.45;
}
.search-select {
  position: relative;
  max-width: 420px;
}
.search-select input[type="text"] {
  width: 100%;
  box-sizing: border-box;
}
.search-select-list {
  position: absolute;
  z-index: 40;
  left: 0;
  right: 0;
  max-height: 280px;
  overflow-y: auto;
  margin: 4px 0 0;
  padding: 4px 0;
  list-style: none;
  border: 1px solid var(--eds-border, #2a3550);
  border-radius: 8px;
  background: var(--eds-bg-surface, #111827);
  color: var(--eds-text-main, #edf3ff);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}
.search-select-list li {
  padding: 8px 12px;
  cursor: pointer;
  font-size: 0.92rem;
  line-height: 1.35;
  color: inherit;
  white-space: normal;
  overflow-wrap: anywhere;
}
.search-select-list.search-select-list--up {
  top: auto;
  bottom: calc(100% + 4px);
  margin: 0;
}
.role-preview-seller-select {
  max-width: none;
  width: 100%;
}
.role-preview-seller-select .search-select-list {
  max-height: min(280px, 40vh);
}
.usage-body { display: flex; flex-direction: column; gap: 16px; margin-top: 12px; }
.usage-card { border: 1px solid var(--eds-border, #2a3550); border-radius: 12px; padding: 12px; }
.usage-card h4 { margin: 0 0 8px; font-size: 15px; }
.usage-metrics { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 8px; }
.usage-metric { min-width: 88px; }
.usage-metric b { display: block; font-size: 22px; line-height: 1.1; }
.usage-metric span { font-size: 12px; color: var(--eds-text-muted, #94a3b8); }
.usage-chart { width: 100%; overflow: hidden; }
.usage-chart svg { width: 100%; height: 160px; display: block; }
.usage-legend { display: flex; flex-wrap: wrap; gap: 12px; margin: 4px 0 0; font-size: 12px; color: var(--eds-text-muted, #94a3b8); }
.usage-legend i { display: inline-block; width: 14px; height: 3px; margin-right: 4px; vertical-align: middle; border-radius: 2px; }
.usage-chart text { fill: currentColor; font-size: 10px; }
.usage-source-line, .usage-note { margin: 4px 0 8px; font-size: 13px; }
.usage-people { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.usage-people li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; align-items: baseline; }
.usage-growth { display: block; font-size: 12px; font-weight: 400; color: var(--eds-text-muted, #94a3b8); }
#usageWorkCard .toolbar button.is-on { border-color: var(--chart-s3, #8C66FF); box-shadow: inset 0 0 0 1px var(--chart-s3, #8C66FF); }
.usage-bars { display: flex; flex-direction: column; gap: 8px; }
.usage-bar-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.usage-bar-track { height: 8px; border-radius: 999px; background: rgba(148, 163, 184, 0.25); overflow: hidden; }
.usage-bar-track span { display: block; height: 100%; background: var(--chart-s1, #8eaae8); }
.search-select-list li:hover,
.search-select-list li.is-active {
  background: rgba(140, 102, 255, 0.15);
}
.search-select-list li.muted-opt {
  color: var(--muted, #8b9bb5);
  font-style: italic;
}
.ap-chart {
  min-height: 160px;
}
.ap-avg-dynamics {
  margin: 16px 0 12px;
}
.ap-avg-dynamics > h4 {
  margin: 0 0 8px;
}
.ap-avg-dynamics .ap-avg-hint {
  margin: 0 0 10px;
  font-size: 0.9em;
}
.ap-avg-dynamics .ap-avg-sub {
  margin: 18px 0 6px;
}
.ap-avg-chart {
  width: 100%;
  min-height: 160px;
}
.ap-avg-chart svg {
  display: block;
  width: 100%;
  height: 180px;
  overflow: visible;
}
.ap-avg-grid {
  stroke: var(--chart-grid, rgba(148, 163, 184, 0.35));
  stroke-dasharray: 3 3;
  stroke-width: 1;
}
.ap-avg-area {
  fill: var(--chart-area, rgba(140, 102, 255, 0.10));
  stroke: none;
}
.ap-avg-line,
.an-line {
  stroke: var(--chart-line, #8C66FF);
  stroke-width: 2;
  stroke-linejoin: round;
  stroke-linecap: round;
  fill: none;
}
.an-line-submitted { stroke: var(--chart-s1, #8eaae8); }
.an-line-approved { stroke: var(--chart-s2, #8faf96); }
.an-line-signed { stroke: var(--chart-s3, #8C66FF); }
.ap-avg-dot {
  fill: var(--chart-line, #8C66FF);
  stroke: var(--chart-dot-stroke, #121826);
  stroke-width: 1.5;
}
.ap-avg-xlabel {
  font-size: 10px;
  fill: var(--chart-axis, #94a3b8);
}
.ap-pct-label {
  font-size: 11px;
  font-weight: 600;
  fill: var(--chart-label, #e2e8f0);
}
#appShell .ap-avg-dot {
  stroke: var(--chart-dot-stroke, #121826);
}
#appShell .ap-pct-label {
  fill: var(--chart-label, #f8fafc);
}
#appShell .ap-avg-grid {
  stroke: var(--chart-grid, rgba(148, 163, 184, 0.28));
}
.ap-bars {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  height: 160px;
  padding: 6px 2px 0;
  overflow-x: auto;
}
.ap-bar {
  flex: 1 0 26px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  height: 100%;
  min-width: 26px;
}
.tk-an-charts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 12px 0;
}
@media (min-width: 721px) {
  .tk-an-charts {
    grid-template-columns: 1fr 1fr;
  }
}
.ap-bar-fill {
  width: 70%;
  min-height: 2px;
  background: #8C66FF;
  border-radius: 4px 4px 0 0;
  transition: height 0.3s ease;
}
.ap-bar-stack {
  width: 70%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border-radius: 4px 4px 0 0;
  overflow: hidden;
  min-height: 2px;
}
.ap-bar-seg {
  width: 100%;
  min-height: 1px;
}
.ap-bar-seg-po { background: #5b8cff; }
.ap-bar-seg-vr { background: #8c66ff; }
.ap-bar-seg-pa { background: #22c55e; }
.ap-chart-legend {
  display: flex;
  gap: 12px;
  margin-bottom: 6px;
  font-size: 12px;
}
.ap-chart-legend .lg::before {
  content: '';
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  margin-right: 4px;
  vertical-align: middle;
}
.ap-chart-legend .lg-po::before { background: #5b8cff; }
.ap-chart-legend .lg-vr::before { background: #8c66ff; }
.ap-chart-legend .lg-pa::before { background: #22c55e; }
.ap-sales-structure {
  margin-top: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  background: var(--card, rgba(255, 255, 255, 0.04));
  border: 1px solid var(--border, rgba(255, 255, 255, 0.08));
}
.ap-sales-structure > h4 {
  margin: 0 0 12px;
}
.ap-sales-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.ap-sales-section {
  padding: 12px;
  border-radius: 10px;
  background: rgba(140, 102, 255, 0.06);
  border: 1px solid rgba(140, 102, 255, 0.12);
}
.ap-sales-section h5 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
}
.ap-sales-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 10px;
}
.ap-sales-main .vv {
  font-size: 20px;
  font-weight: 700;
}
.ap-sales-subtitle {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted, #8b9bb5);
  margin-bottom: 6px;
}
.ap-sales-rows {
  display: grid;
  gap: 8px;
}
.ap-sales-rows > div {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 8px;
  align-items: baseline;
}
.ap-sales-rows .sub {
  grid-column: 1 / -1;
  font-size: 12px;
}
.ap-portfolio-hint {
  font-size: 12px;
  font-style: italic;
}
@media (max-width: 900px) {
  .ap-sales-grid {
    grid-template-columns: 1fr;
  }
}
.ap-bar-lbl {
  margin-top: 4px;
  font-size: 10px;
  color: var(--muted, #8b9bb5);
  white-space: nowrap;
}
.ap-tables {
  display: grid;
  grid-template-columns: minmax(0, 1.85fr) minmax(200px, 0.75fr);
  gap: 12px;
  margin-top: 12px;
  align-items: start;
}
.ap-tables .table-wrap.ap-products {
  min-width: 0;
  overflow-x: auto;
}
.ap-tables .table-wrap.ap-products table {
  width: 100%;
  table-layout: fixed;
}
.ap-tables .table-wrap.ap-products th:first-child,
.ap-tables .table-wrap.ap-products td:first-child {
  width: 34%;
  word-break: break-word;
  overflow-wrap: anywhere;
  white-space: normal;
  vertical-align: top;
}
.ap-tables .table-wrap.ap-products th:not(:first-child):not(:last-child),
.ap-tables .table-wrap.ap-products td:not(:first-child):not(:last-child) {
  width: 14%;
  white-space: nowrap;
  font-size: 12px;
}
.ap-tables .table-wrap.ap-products th:last-child,
.ap-tables .table-wrap.ap-products td:last-child {
  width: 16%;
  white-space: nowrap;
}
.ap-tables .table-wrap.ap-products td .sub {
  display: block;
  font-size: 11px;
  color: var(--muted, #8b9bb5);
}
.ap-tables .ap-mini.ap-region {
  max-width: 320px;
  justify-self: end;
}
.ap-tables .ap-mini.ap-region .ap-mini-grid {
  grid-template-columns: 1fr;
  gap: 10px;
}
.ap-tables .ap-mini.ap-region .vv {
  font-size: 16px;
}
.ap-tables .ap-months {
  grid-column: 1 / -1;
}
@media (max-width: 720px) {
  .ap-tables {
    grid-template-columns: 1fr;
  }
}
.ap-note {
  margin: 4px 0 12px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(140, 102, 255, 0.08);
  border: 1px solid rgba(140, 102, 255, 0.18);
  font-size: 13px;
}
.ap-ingest-period {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: flex-end;
  margin: 8px 0 12px;
}
.ap-ingest-period label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
}
.ap-ingest-period input[type="date"] {
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid var(--border, #2a3550);
}
.ap-ingest-report-type {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 8px;
}
.ap-ingest-report-type select {
  max-width: 360px;
  padding: 6px 8px;
  border-radius: 6px;
}
.ap-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 12px 0;
}
.ap-structure-grid {
  grid-template-columns: repeat(3, 1fr);
}
.analytics-charts-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 12px 0;
}
.ap-mini {
  border: 1px solid var(--fd-border, #2a3550);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--fd-bg-elevated);
}
.ap-mini h4 {
  margin: 0 0 8px;
}
.ap-mini-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
/* display:grid выше иначе побеждает HTML hidden — сетка с нулями остаётся видимой. */
.ap-mini-grid[hidden] {
  display: none !important;
}
.ap-mini-grid > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ap-mini-grid .tt {
  font-size: 11px;
  color: var(--muted, #8b9bb5);
}
.ap-mini-grid .vv {
  font-size: 18px;
  font-weight: 600;
}
.ap-mini-grid .sub {
  font-size: 11px;
  color: var(--muted, #8b9bb5);
}
@media (max-width: 960px) {
  .ap-cards {
    grid-template-columns: 1fr;
  }
  .analytics-charts-row {
    grid-template-columns: 1fr;
  }
}
.team-staff-block {
  margin-top: 16px;
}
.team-staff-block h4 {
  margin: 0 0 8px;
}
.team-staff-hint {
  margin: 0 0 12px;
}
.team-staff-tables {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-bottom: 12px;
  width: 100%;
  min-width: 0;
}
.team-staff-tables h5 {
  margin: 0 0 8px;
  font-size: 13px;
}
.team-staff-add {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px 12px;
  margin-top: 8px;
}
.team-staff-add label {
  font-size: 12px;
  color: var(--muted, #8b9bb5);
}
.team-staff-add select,
.team-staff-add input {
  min-width: 160px;
}
@media (min-width: 1025px) {
  .team-staff-tables {
    grid-template-columns: 1fr 1fr;
  }
}

/* Кнопки штаба в мобильной карточке строки — не схлопывать в «вертикальный» текст */
@media (max-width: 1024px) {
  #appShell .table-wrap td .row-staff-ext-btn,
  #appShell .table-wrap td .row-staff-remove-btn {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    width: 100%;
    white-space: normal;
    text-align: center;
    align-self: stretch;
  }
}

/* Partner config — installment term checkboxes (not toggle switches) */
.partner-config-terms {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin-top: 6px;
}
.term-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-size: 14px;
  color: var(--eds-text, #e5e7eb);
  user-select: none;
}
.term-checkbox input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #6d28d9;
  flex-shrink: 0;
}
.term-checkbox span {
  white-space: nowrap;
}

/* Team / staff directory tables */
#appShell .team-table,
#appShell .staff-directory-table {
  table-layout: fixed;
  width: 100%;
}
#appShell .team-table th:nth-child(1),
#appShell .team-table td:nth-child(1) { width: 100px; }
#appShell .team-table th:nth-child(2),
#appShell .team-table td:nth-child(2) { width: 140px; }
#appShell .team-table th:nth-child(4),
#appShell .team-table td:nth-child(4) { width: 170px; }
#appShell .team-table th:nth-child(5),
#appShell .team-table td:nth-child(5) { width: 110px; }
#appShell .team-table td .cell-value {
  display: block;
  margin-bottom: 4px;
}
#appShell .team-table td .cell-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
#appShell .staff-directory-table th:nth-child(1),
#appShell .staff-directory-table td:nth-child(1) { width: 100px; }
#appShell .staff-directory-table th:nth-child(2),
#appShell .staff-directory-table td:nth-child(2) { width: 140px; }
#appShell .staff-directory-table th:nth-child(4),
#appShell .staff-directory-table td:nth-child(4) { width: 110px; }

/* Team curator assign block (inside manage_team mode) */
.team-curator-assign-block {
  margin-top: 16px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.02);
}
.team-curator-assign-block h4 {
  margin: 0 0 8px;
  font-size: 15px;
}
.team-curator-assign-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-top: 8px;
}
.team-curator-assign-grid label {
  display: block;
  font-size: 12px;
  color: var(--eds-text-muted);
  margin-bottom: 4px;
}
.team-curator-assign-grid select {
  width: 100%;
}
#teamStaffBlock.team-staff-directory {
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* ============================================================
   Карточка партнёра (read-only сводка)
   ============================================================ */
.pcard-partner-wrap { display: flex; flex-direction: column; gap: 4px; min-width: 260px; }
.pcard-partner-wrap select { min-width: 260px; }

.partner-card-body { margin-top: 4px; }
.partner-card-empty {
  padding: 28px 16px;
  text-align: center;
  color: var(--eds-text-muted);
  border: 1px dashed var(--eds-border);
  border-radius: var(--eds-radius);
  background: color-mix(in srgb, var(--eds-bg-surface) 60%, transparent);
}
.partner-card-empty--error { color: #f87171; border-color: rgba(248, 113, 113, 0.4); }

.pcard-header { margin-bottom: 12px; }
.pcard-title { margin: 0; font-size: 18px; font-weight: 700; color: var(--eds-text-main); }
.pcard-title-id { color: var(--eds-text-muted); font-weight: 500; font-size: 14px; }

.pcard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 12px;
  align-items: start;
}

.pcard-section {
  border: 1px solid var(--eds-border);
  border-radius: var(--eds-radius);
  background: color-mix(in srgb, var(--eds-bg-surface) 70%, transparent);
  padding: 12px 14px;
  min-width: 0;
}
.pcard-section-title {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--eds-text-muted);
}
.pcard-rows { display: flex; flex-direction: column; gap: 8px; }
.pcard-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}
.pcard-label { flex: 0 0 auto; color: var(--eds-text-muted); font-size: 13px; }
.pcard-value {
  flex: 1 1 auto;
  min-width: 0;
  text-align: right;
  font-size: 13px;
  font-weight: 600;
  color: var(--eds-text-main);
  overflow-wrap: anywhere;
}
.pcard-value--mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-weight: 500; }
.pcard-value--off { color: var(--eds-text-muted); font-weight: 500; }

.pcard-badges { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; flex: 1 1 auto; min-width: 0; }
.pcard-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  border: 1px solid transparent;
  white-space: nowrap;
}
.pcard-badge--on { background: rgba(34, 197, 94, 0.14); color: #4ade80; border-color: rgba(34, 197, 94, 0.35); }
.pcard-badge--off { background: rgba(148, 163, 184, 0.14); color: var(--eds-text-muted); border-color: var(--eds-border); }
.pcard-badge--warn { background: rgba(245, 158, 11, 0.16); color: #fbbf24; border-color: rgba(245, 158, 11, 0.38); }
.pcard-badge--neutral { background: rgba(96, 165, 250, 0.14); color: #93c5fd; border-color: rgba(96, 165, 250, 0.32); }
.pcard-badge--on::before { content: "✓"; }
.pcard-badge--off::before { content: "✕"; }

.pcard-link-section { margin-top: 12px; }
.pcard-link-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pcard-link {
  flex: 1 1 240px;
  min-width: 0;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--eds-bg-app);
  border: 1px solid var(--eds-border);
  font-size: 12px;
  color: var(--eds-text-main);
  overflow-wrap: anywhere;
}
.pcard-copy-btn {
  flex: 0 0 auto;
  padding: 8px 14px;
  border-radius: 8px;
  border: 1px solid var(--eds-border);
  background: var(--eds-bg-surface);
  color: var(--eds-text-main);
  font-size: 13px;
  cursor: pointer;
}
.pcard-copy-btn:hover { border-color: var(--brand-violet, #8C66FF); }

.pcard-team { display: flex; flex-direction: column; gap: 8px; }
.pcard-empty-inline { color: var(--eds-text-muted); font-size: 13px; }
.pcard-team-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 10px;
  border: 1px solid var(--eds-border);
  border-radius: 10px;
  background: color-mix(in srgb, var(--eds-bg-surface) 70%, transparent);
  flex-wrap: wrap;
}
.pcard-team-main { display: flex; align-items: baseline; gap: 8px; min-width: 0; flex-wrap: wrap; }
.pcard-team-name { font-weight: 600; color: var(--eds-text-main); font-size: 14px; }
.pcard-team-uname { color: var(--eds-text-muted); font-size: 12px; }
.pcard-team-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pcard-team-role {
  font-size: 12px;
  color: var(--eds-text-muted);
  padding: 2px 8px;
  border-radius: 999px;
  border: 1px solid var(--eds-border);
}

@media (max-width: 640px) {
  .pcard-grid { grid-template-columns: 1fr; }
  .pcard-partner-wrap, .pcard-partner-wrap select { min-width: 0; width: 100%; }
}

/* ── Apps accordion ── */
#appShell .apps-accordion {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 12px;
}

#appShell .apps-section {
  border: 1px solid var(--eds-border);
  border-radius: 10px;
  overflow: hidden;
}

#appShell .apps-section-header {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 10px 14px;
  background: var(--eds-card-bg, #1e2130);
  border: none;
  cursor: pointer;
  text-align: left;
  gap: 10px;
  transition: background 0.15s;
  color: var(--eds-text);
}
#appShell .apps-section-header:hover {
  background: var(--eds-hover, rgba(255,255,255,.04));
}

#appShell .apps-section-title {
  font-weight: 600;
  font-size: 14px;
  flex: 1 1 auto;
}

#appShell .apps-section-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

#appShell .apps-section-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  background: var(--eds-accent, #7c6af7);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
#appShell .apps-section-badge:empty { display: none; }

#appShell .apps-section-amount {
  font-size: 12px;
  opacity: .6;
  white-space: nowrap;
}
#appShell .apps-section-amount:empty { display: none; }

#appShell .apps-section-chevron {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: .5;
  transition: transform 0.2s;
}
#appShell .apps-section-chevron::after {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform 0.2s;
}
#appShell .apps-section-header[aria-expanded="true"] .apps-section-chevron::after {
  transform: rotate(-135deg) translate(-2px, -2px);
}

#appShell .apps-section-body {
  padding: 0 14px 12px;
}
#appShell .apps-section-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: flex-end;
  margin-top: 10px;
}
#appShell .apps-section-filters > label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 0 1 auto;
}
#appShell .apps-section-filters > label > span {
  font-size: 11px;
  opacity: .65;
  line-height: 1.2;
}
#appShell .apps-section-filters select,
#appShell .apps-section-filters input[type="search"] {
  min-height: 34px;
  min-width: 140px;
}
#appShell .apps-section-filters .apps-section-search {
  flex: 1 1 180px;
}
#appShell .apps-section-filters .apps-section-search input {
  width: 100%;
  min-width: 160px;
}
#appShell .apps-section-body .table-wrap {
  margin-top: 8px;
}

#appShell .apps-section-pager {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 8px;
  padding: 0 2px 4px;
}
#appShell .apps-pager-btn {
  min-width: 36px;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--eds-border);
  border-radius: 8px;
  background: transparent;
  color: var(--eds-text);
  cursor: pointer;
}
#appShell .apps-pager-btn:hover:not(:disabled) {
  background: var(--eds-hover, rgba(255,255,255,.04));
}
#appShell .apps-pager-btn:disabled {
  opacity: .35;
  cursor: default;
}
#appShell .apps-pager-info {
  font-size: 12px;
  opacity: .7;
  min-width: 4.5em;
  text-align: center;
}

/* Пустой раздел — бейдж серый */
#appShell .apps-section[data-empty="1"] .apps-section-badge {
  background: var(--eds-muted-bg, rgba(255,255,255,.1));
  color: var(--eds-muted, rgba(255,255,255,.4));
}
#appShell .apps-section[data-empty="1"] .apps-section-header {
  opacity: .65;
}

#appShell .apps-client-cell {
  font-size: 12px;
  line-height: 1.35;
  max-width: 220px;
}
#appShell .apps-client-cell a {
  color: var(--eds-accent, #7c6af7);
  text-decoration: underline;
}

@media (max-width: 640px) {
  #appShell .apps-section-header { padding: 9px 10px; }
  #appShell .apps-section-body { padding: 0 8px 10px; }
  #appShell .apps-section-filters > label { flex: 1 1 calc(50% - 8px); }
  #appShell .apps-section-filters .apps-section-search { flex: 1 1 100%; }
}

/* ============================================================
   LAYOUT FIX: work-card = ширина контентной колонки = правый край шапки
   (перебивает конфликтующие flex/width:100% правила выше)
   ============================================================ */
#appShell {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

#appShell .shell-layout.layout-grid,
#appShell .layout-grid {
  display: grid !important;
  grid-template-columns: 280px minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  align-items: start;
}

#appShell .side-menu,
#appShell .card.side-menu {
  grid-column: 1;
  width: 280px;
  max-width: 280px;
  justify-self: stretch;
}

#appShell .main-content {
  grid-column: 2;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  justify-self: stretch;
}

#appShell .content-scroll {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  box-sizing: border-box;
  scrollbar-gutter: auto;
  padding-left: 0;
  padding-right: 0;
}

#appShell .content-col,
#appShell .card.work-card {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0;
  margin-left: 0;
  margin-right: 0;
  box-sizing: border-box;
}

/* ≤900: без колонки меню — контент на всю ширину шапки/баннера.
   Breakpoint aligned with seller/desk chrome split (SPEC §2 / Gate A: ≥901 sidebar). */
@media (max-width: 900px) {
  #appShell .shell-layout.layout-grid,
  #appShell .layout-grid {
    display: block !important;
    grid-template-columns: none !important;
  }

  #appShell .side-menu,
  #appShell .card.side-menu {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    grid-column: auto;
    width: min(82vw, 320px) !important;
    max-width: 320px !important;
    transform: translateX(-105%) !important;
    z-index: 95;
    margin: 0;
  }

  body.menu-open #appShell .side-menu,
  body.menu-open #appShell .card.side-menu,
  #appShell .side-menu.open,
  #appShell .card.side-menu.open {
    transform: translateX(0) !important;
  }

  #appShell .main-content {
    grid-column: auto;
    width: 100% !important;
    max-width: 100% !important;
    display: flex;
    flex-direction: column;
  }

  /* Classic ≤900 only — chrome L1 hides toggle (bottom-nav / «Ещё»). */
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) #appShell .mobile-menu-toggle {
    display: inline-flex !important;
  }

  body.menu-open #appShell .content-col {
    transform: none !important;
  }
}

/* B1–B4 + C1: beat gradient button polish (!important, same reason as A1). */
#appShell button.links-pay-tile,
#appShell button.links-pay-tile:hover,
#appShell button.links-pay-tile:active,
body.pwa-seller-cabinet-chrome #appShell button.links-pay-tile {
  background: var(--pay-tile-bg, #0b1220) !important;
  background-image: none !important;
  border: 1px solid var(--pay-tile-border, rgba(148, 163, 184, 0.45)) !important;
  color: var(--pay-tile-fg, var(--cabinet-muted, #94a3b8)) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
#appShell button.links-pay-tile.is-selected,
#appShell button.links-pay-tile.is-selected:hover,
body.pwa-seller-cabinet-chrome #appShell button.links-pay-tile.is-selected {
  background: var(--pay-tile-on-bg, #8C66FF) !important;
  background-image: none !important;
  border: 2px solid var(--pay-tile-on-border, #8C66FF) !important;
  color: var(--pay-tile-on-fg, #ffffff) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
body.pwa-seller-cabinet-chrome #appShell .links-copy-btn,
#appShell.app-shell--seller-cabinet .links-copy-btn {
  background: #7c3aed !important;
  background-image: none !important;
  border: 1px solid #7c3aed !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
body.pwa-seller-cabinet-chrome #appShell .links-manage-row .sec,
body.pwa-seller-cabinet-chrome #appShell .links-manage-row .secondary,
#appShell.app-shell--seller-cabinet .links-manage-row .sec,
#appShell.app-shell--seller-cabinet .links-manage-row .secondary {
  background: var(--cabinet-quiet-btn-bg, transparent) !important;
  background-image: none !important;
  border: 1px solid var(--cabinet-quiet-btn-border, rgba(226, 232, 240, 0.5)) !important;
  color: var(--cabinet-quiet-btn-color, #f1f5f9) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
@media (max-width: 900px) {
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-copy-btn,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-copy-btn {
    width: 100% !important;
    min-height: 44px !important;
  }
  body.pwa-seller-cabinet-chrome #appShell .links-cab-card .links-manage-row,
  #appShell.app-shell--seller-cabinet .links-cab-card .links-manage-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
  }
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-sl-preview:not(.hidden),
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-sl-preview:not(.hidden) {
  display: block !important;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome #lnkTermModeWrap,
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome #lnkEditTermModeWrap,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome #lnkTermModeWrap,
#appShell.app-shell--seller-cabinet .links-form-panel--chrome #lnkEditTermModeWrap {
  display: none !important;
}
body.pwa-seller-cabinet-chrome #appShell .links-form-panel--chrome .links-term-chips label:has(input:checked),
#appShell.app-shell--seller-cabinet .links-form-panel--chrome .links-term-chips label:has(input:checked) {
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
}
body.pwa-seller-cabinet-chrome #appShell button.links-adv-toggle,
#appShell.app-shell--seller-cabinet button.links-adv-toggle,
#appShell button.links-adv-toggle {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  color: var(--cabinet-text, #cbd5e1) !important;
  box-shadow: none !important;
  width: 100% !important;
  min-height: 44px !important;
}
#appShell #closeLinkFormsBtn.links-hide-form-btn {
  min-height: 44px !important;
  min-width: 44px !important;
  padding: 8px 14px !important;
  color: #f8fafc !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(248, 250, 252, 0.65) !important;
  box-shadow: none !important;
}
.pwa-modal-close,
.pwa-modal-panel .pwa-modal-close,
.pwa-modal-panel--brand .pwa-modal-close {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  color: var(--cabinet-text, #ffffff) !important;
  background: var(--cabinet-quiet-btn-bg, rgba(255, 255, 255, 0.18)) !important;
  background-image: none !important;
  border: 1px solid var(--cabinet-line, rgba(255, 255, 255, 0.7)) !important;
  font-size: 26px !important;
  line-height: 1 !important;
}

/* Create-3 (эталон seller-m/d-create-3): one stream, pay-type heading, Back|Next row.
   display:contents beats #appShell .apps-step card chrome. Hint/toast off steps 1–3. */
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appShell .apps-create-flow.apps-create-flow--wizard {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsCreateWizardChrome {
  margin: 0;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsProductStep:not(.hidden),
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsClientStep:not(.hidden) {
  display: contents !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsProductPrompt.apps-wiz-q {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--cabinet-text, #f8fafc);
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsProductStep .apps-step-row:not(.hidden),
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsClientStep .apps-step-row:not(.hidden),
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsTermExtras:not(.hidden):has(.apps-field:not(.hidden)),
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appOfferWrap:not(.hidden),
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsTariffRow:not(.hidden) {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: none !important;
  gap: 16px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsTermExtras:not(:has(.apps-field:not(.hidden))) {
  display: none !important;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appProduct,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appAmount,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appPhone,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appTariff,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appOffer,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appTermSelect,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appInternalMonths,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appFirstPayment {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-1 #appsCreateHint,
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #appsCreateHint,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsCreateHint,
body.pwa-seller-cabinet-chrome.apps-wiz-step-1 #uiFeedback,
body.pwa-seller-cabinet-chrome.apps-wiz-step-2 #uiFeedback,
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #uiFeedback {
  display: none !important;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsCreateFlowActions.apps-flow-actions--wizard {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  gap: 10px !important;
  width: 100% !important;
  margin-top: 4px;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsCreateFlowActions #appsCreateWizardNav:not(.hidden) {
  display: contents !important;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsWizBackBtn:not(.hidden),
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsWizNextBtn:not(.hidden) {
  flex: 1 1 0 !important;
  min-height: 44px !important;
  width: auto !important;
  margin: 0 !important;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsWizBackBtn.secondary {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  color: var(--cabinet-text, #e2e8f0) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}
body.pwa-seller-cabinet-chrome.apps-wiz-step-3 #appsWizNextBtn {
  background: #7c3aed !important;
  background-image: none !important;
  border: 1px solid #7c3aed !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}

/* Ef2: account/settings hosts fill the content column at ≥901 (not a centered island). */
@media (min-width: 901px) {
  #appShell.app-shell--seller-cabinet #accountWorkCard,
  #appShell.app-shell--desk-ops #accountWorkCard,
  #appShell.app-shell--seller-cabinet #accountChromeHost,
  #appShell.app-shell--desk-ops #accountChromeHost,
  #appShell.app-shell--seller-cabinet #accountChromeHost #settingsPanel,
  #appShell.app-shell--desk-ops #accountChromeHost #settingsPanel,
  #appShell.app-shell--seller-cabinet #accountChromeHost .settings-section,
  #appShell.app-shell--desk-ops #accountChromeHost .settings-section,
  #appShell.app-shell--seller-cabinet #accountChromeHost .settings-subtabs,
  #appShell.app-shell--desk-ops #accountChromeHost .settings-subtabs,
  #appShell.app-shell--seller-cabinet .work-card .integrations-list--main,
  #appShell.app-shell--desk-ops .work-card .integrations-list--main,
  #appShell.app-shell--seller-cabinet .work-card[data-card="team"],
  #appShell.app-shell--desk-ops .work-card[data-card="team"],
  #appShell.app-shell--seller-cabinet #supportWorkCard,
  #appShell.app-shell--seller-cabinet #teamTableWrap,
  #appShell.app-shell--desk-ops #teamTableWrap {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
  }
  #appShell.app-shell--seller-cabinet #accountChromeHost .settings-subtabs,
  #appShell.app-shell--desk-ops #accountChromeHost .settings-subtabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  #appShell.app-shell--seller-cabinet #accountChromeHost .settings-subtabs .menu-btn,
  #appShell.app-shell--desk-ops #accountChromeHost .settings-subtabs .menu-btn {
    flex: 1 1 180px;
    width: auto;
    max-width: none;
  }
  #appShell.app-shell--seller-cabinet #accountChromeHost .switch-row,
  #appShell.app-shell--desk-ops #accountChromeHost .switch-row {
    width: 100%;
    max-width: none;
  }
  #appShell.app-shell--seller-cabinet #accountChromeHost #accountSettingsSection,
  #appShell.app-shell--desk-ops #accountChromeHost #accountSettingsSection {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
  }
  #appShell.app-shell--seller-cabinet #accountChromeHost #accountSettingsSection > .switch-row,
  #appShell.app-shell--desk-ops #accountChromeHost #accountSettingsSection > .switch-row,
  #appShell.app-shell--seller-cabinet #accountChromeHost #accountSettingsSection > #rolePreviewSettingsBlock,
  #appShell.app-shell--desk-ops #accountChromeHost #accountSettingsSection > #rolePreviewSettingsBlock {
    flex: 1 1 100%;
  }
}

/* Ef3: phone team modes live in the work-card; table keeps its header (≤900 thead is otherwise hidden). */
#teamChromeModes {
  display: none;
}
@media (max-width: 900px) {
  #appShell.app-shell--seller-cabinet #teamChromeModes,
  #appShell.app-shell--desk-ops #teamChromeModes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
    width: 100%;
  }
  #appShell.app-shell--seller-cabinet #teamChromeModes .submenu-btn,
  #appShell.app-shell--desk-ops #teamChromeModes .submenu-btn {
    flex: 1 1 160px;
    min-height: 44px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 10px;
    background: transparent;
    color: var(--cabinet-text, #e2e8f0);
  }
  #appShell.app-shell--seller-cabinet #teamChromeModes .submenu-btn.active,
  #appShell.app-shell--desk-ops #teamChromeModes .submenu-btn.active {
    background: rgba(140, 102, 255, 0.18);
    color: var(--cabinet-text, #ede9fe);
  }
  #appShell.app-shell--seller-cabinet #teamTableWrap,
  #appShell.app-shell--desk-ops #teamTableWrap {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: visible;
  }
  #appShell.app-shell--seller-cabinet #teamTableWrap table,
  #appShell.app-shell--desk-ops #teamTableWrap table {
    display: block;
    width: 100%;
    min-width: 0;
    table-layout: auto;
  }
  #appShell.app-shell--seller-cabinet #teamTableWrap thead,
  #appShell.app-shell--desk-ops #teamTableWrap thead {
    display: none;
  }
  #appShell.app-shell--seller-cabinet #teamTableWrap tbody,
  #appShell.app-shell--desk-ops #teamTableWrap tbody {
    display: block;
  }
  #appShell.app-shell--seller-cabinet #teamTableWrap tr,
  #appShell.app-shell--desk-ops #teamTableWrap tr {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0 0 10px;
    padding: 12px 14px;
    border: 1px solid var(--eds-border, rgba(11, 18, 32, 0.08));
    border-radius: 12px;
    background: var(--eds-bg-surface, #ffffff);
    box-shadow: none;
  }
  #appShell.app-shell--seller-cabinet #teamTableWrap td,
  #appShell.app-shell--desk-ops #teamTableWrap td {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    text-align: left;
    min-height: 0;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }
  #appShell.app-shell--seller-cabinet #teamTableWrap td[data-label]::before,
  #appShell.app-shell--desk-ops #teamTableWrap td[data-label]::before {
    content: attr(data-label);
    display: block;
    position: static;
    flex: none;
    max-width: none;
    margin: 0 0 2px;
    font-size: 11px;
    font-weight: 600;
    color: var(--eds-text-muted, #475569);
  }
  #appShell.app-shell--seller-cabinet #teamTableWrap td > *,
  #appShell.app-shell--desk-ops #teamTableWrap td > * {
    text-align: left;
  }
  /* Ef5b: empty colspan row must not pick up the «TG ID» stack label. */
  #appShell.app-shell--seller-cabinet #teamTableWrap td[colspan]::before,
  #appShell.app-shell--desk-ops #teamTableWrap td[colspan]::before {
    content: none;
    display: none;
  }
}
@media (min-width: 901px) {
  #appShell.app-shell--seller-cabinet #teamChromeModes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
    width: 100%;
  }
  #appShell.app-shell--seller-cabinet #teamChromeModes .submenu-btn {
    flex: 0 1 auto;
    min-height: 40px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 10px;
    background: transparent;
    color: var(--cabinet-text, #e2e8f0);
  }
  #appShell.app-shell--seller-cabinet #teamChromeModes .submenu-btn.active {
    background: rgba(140, 102, 255, 0.18);
    color: var(--cabinet-text, #ede9fe);
  }
}

/* F2: account actions stay a column. Ff1: the card fills the content column. */
#appShell.app-shell--seller-cabinet #accountProfileCard:not(.hidden),
#appShell.app-shell--desk-ops #accountProfileCard:not(.hidden) {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 12px;
  width: 100%;
  max-width: none;
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.45);
  box-sizing: border-box;
}
html[data-theme="light"] #appShell.app-shell--seller-cabinet #accountProfileCard:not(.hidden),
html[data-theme="light"] #appShell.app-shell--desk-ops #accountProfileCard:not(.hidden) {
  background: #ffffff;
  border-color: rgba(11, 18, 32, 0.08);
  color: #0B1220;
}
#appShell.app-shell--seller-cabinet .account-profile-card__avatar,
#appShell.app-shell--desk-ops .account-profile-card__avatar {
  position: relative;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
}
#appShell.app-shell--seller-cabinet .account-profile-card__fallback,
#appShell.app-shell--desk-ops .account-profile-card__fallback {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #334155;
  color: #f8fafc;
  font-weight: 650;
  font-size: 16px;
}
#appShell.app-shell--seller-cabinet .account-profile-card__img,
#appShell.app-shell--desk-ops .account-profile-card__img {
  position: relative;
  z-index: 1;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  background: transparent;
}
#appShell.app-shell--seller-cabinet .account-profile-card__meta,
#appShell.app-shell--desk-ops .account-profile-card__meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
#appShell.app-shell--seller-cabinet #accountProfileName,
#appShell.app-shell--desk-ops #accountProfileName {
  font-size: 16px;
  font-weight: 650;
  color: var(--cabinet-text, #f1f5f9);
}
#appShell.app-shell--seller-cabinet #accountProfileUser,
#appShell.app-shell--desk-ops #accountProfileUser,
#appShell.app-shell--seller-cabinet #accountProfileRole,
#appShell.app-shell--desk-ops #accountProfileRole {
  font-size: 13px;
  color: var(--cabinet-muted, #94a3b8);
}
#appShell.app-shell--seller-cabinet #accountChromeHost #settingsPanel,
#appShell.app-shell--desk-ops #accountChromeHost #settingsPanel,
#appShell.app-shell--seller-cabinet #accountChromeHost #accountSettingsSection,
#appShell.app-shell--desk-ops #accountChromeHost #accountSettingsSection,
#appShell.app-shell--seller-cabinet #accountChromeHost #notificationSettingsSection,
#appShell.app-shell--desk-ops #accountChromeHost #notificationSettingsSection {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}
#appShell.app-shell--seller-cabinet #accountChromeHost #accountSettingsSection,
#appShell.app-shell--desk-ops #accountChromeHost #accountSettingsSection {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 8px;
}
#appShell.app-shell--seller-cabinet #accountChromeHost #accountSettingsSection > .switch-row:first-child,
#appShell.app-shell--desk-ops #accountChromeHost #accountSettingsSection > .switch-row:first-child {
  font-size: 13px;
  font-weight: 650;
  color: var(--cabinet-muted, #94a3b8);
  padding: 2px 2px 4px;
}
#appShell.app-shell--seller-cabinet #accountChromeHost #accountSettingsSection > .menu-btn,
#appShell.app-shell--desk-ops #accountChromeHost #accountSettingsSection > .menu-btn {
  width: 100%;
  max-width: none;
  min-height: 44px;
  text-align: left;
  justify-content: flex-start;
  background: transparent;
  border: 1px solid rgba(148, 163, 184, 0.28);
  color: var(--cabinet-text, #e2e8f0);
  border-radius: 10px;
  box-shadow: none;
}
#appShell.app-shell--seller-cabinet #accountChromeHost #accountSettingsSection > #logoutBtn,
#appShell.app-shell--desk-ops #accountChromeHost #accountSettingsSection > #logoutBtn {
  margin-top: 8px;
  background: transparent;
  border-color: var(--status-bad-fg, rgba(248, 113, 113, 0.45));
  color: var(--status-bad-fg, #fecaca);
}
#appShell.app-shell--seller-cabinet #accountChromeHost .settings-subtabs .menu-btn,
#appShell.app-shell--desk-ops #accountChromeHost .settings-subtabs .menu-btn {
  background: transparent;
  border: 1px solid rgba(148, 163, 184, 0.22);
  color: var(--cabinet-muted, #94a3b8);
  min-height: 40px;
  border-radius: 10px;
  box-shadow: none;
}
#appShell.app-shell--seller-cabinet #accountChromeHost .settings-subtabs .menu-btn.active,
#appShell.app-shell--desk-ops #accountChromeHost .settings-subtabs .menu-btn.active {
  color: var(--cabinet-text, #f1f5f9);
  border-color: rgba(226, 232, 240, 0.4);
  background: rgba(148, 163, 184, 0.1);
}
#appShell.app-shell--seller-cabinet #accountChromeHost #notificationSettingsSection,
#appShell.app-shell--desk-ops #accountChromeHost #notificationSettingsSection {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
#appShell.app-shell--seller-cabinet #accountChromeHost #notificationSettingsSection .switch-row,
#appShell.app-shell--desk-ops #accountChromeHost #notificationSettingsSection .switch-row {
  padding: 10px 2px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12);
}
#appShell.app-shell--seller-cabinet #accountChromeHost #saveNotifPrefsBtn,
#appShell.app-shell--desk-ops #accountChromeHost #saveNotifPrefsBtn {
  align-self: flex-end;
  width: auto;
  min-height: 44px;
  margin-top: 20px;
}

/* H-fix3: hero, ticket table, FAQ. Chat lives on the ticket, not beside the primary. */
#supportWorkCard .support-cab {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 20px;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}
#supportWorkCard .support-hero {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 16px;
  padding: 16px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.45);
}
#supportWorkCard .support-hero__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  flex: 1 1 auto;
  max-width: none;
}
#supportWorkCard .support-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  width: 100%;
}
#supportWorkCard .support-hero__active {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
  flex: 0 1 240px;
  padding: 12px 14px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.35);
}
#supportWorkCard .support-hero__k,
#supportWorkCard .support-hero__meta {
  margin: 0;
}
#supportWorkCard .support-hero__k {
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--cabinet-muted, #94a3b8);
}
#supportWorkCard .support-hero__meta {
  color: var(--cabinet-text, #e2e8f0);
  font-size: 14px;
  line-height: 1.4;
}
@media (min-width: 901px) {
  #supportWorkCard .support-hero {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
  }
}
#supportWorkCard .support-cab__lead,
#supportWorkCard .support-cab__hours,
#supportWorkCard .support-cab__empty,
#supportWorkCard .support-cab__faq p {
  margin: 0;
  color: var(--cabinet-muted, #94a3b8);
  font-size: 14px;
  line-height: 1.45;
}
#supportWorkCard .support-cab__hours {
  font-size: 13px;
}
#supportWorkCard #supportHelpBtn,
#supportWorkCard #supportManagerBtn {
  align-self: stretch;
  width: auto;
  max-width: none;
  min-height: 48px;
  padding: 0 18px;
}
#supportWorkCard #supportHelpBtn {
  min-width: 200px;
}
#supportWorkCard #supportManagerBtn {
  background: transparent;
  border: 1px solid rgba(226, 232, 240, 0.45);
  color: var(--cabinet-text, #e2e8f0);
  box-shadow: none;
}
#supportWorkCard #supportOpenChatBtn,
#supportWorkCard .support-row-chat {
  align-self: flex-start;
  width: auto;
  min-width: 0;
  min-height: 36px;
  padding: 0 12px;
  background: transparent;
  border: 1px solid rgba(226, 232, 240, 0.45);
  color: var(--cabinet-text, #e2e8f0);
  box-shadow: none;
}
#supportWorkCard .support-row-chat__long {
  display: none;
}
#supportWorkCard .support-cab__status {
  margin: 0;
  font-size: 14px;
  color: var(--cabinet-text, #e2e8f0);
}
#supportWorkCard .support-cab__h {
  margin: 0 0 10px;
  font-size: 15px;
  font-weight: 650;
}
#supportWorkCard .support-table__head {
  display: none;
}
#supportWorkCard #supportTicketList {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}
#supportWorkCard .support-ticket-card {
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}
#supportWorkCard .support-col--topic {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (min-width: 901px) {
  #supportWorkCard .support-table__head,
  #supportWorkCard .support-ticket-line {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: none;
  }
  #supportWorkCard .support-table__head > span:nth-child(1),
  #supportWorkCard .support-col--no {
    flex: 0 0 72px;
    width: 72px;
  }
  #supportWorkCard .support-table__head > span:nth-child(2),
  #supportWorkCard .support-col--topic {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }
  #supportWorkCard .support-table__head > span:nth-child(3),
  #supportWorkCard .support-col--status {
    flex: 0 0 140px;
    width: 140px;
  }
  #supportWorkCard .support-table__head > span:nth-child(4),
  #supportWorkCard .support-col--when {
    flex: 0 0 120px;
    width: 120px;
  }
  #supportWorkCard .support-table__head > span:nth-child(5),
  #supportWorkCard .support-row-chat {
    flex: 0 0 104px;
    width: 104px;
    align-self: center;
  }
}
#supportWorkCard .support-table__head {
  padding: 0 0 8px;
  color: var(--cabinet-muted, #94a3b8);
  font-size: 12px;
  letter-spacing: 0.03em;
}
#supportWorkCard .support-ticket-row {
  display: contents;
  cursor: pointer;
  text-align: left;
  color: var(--cabinet-text, #e2e8f0);
}
#supportWorkCard .support-col {
  padding: 12px 0;
  font-size: 14px;
}
#supportWorkCard .support-detail {
  border-top: 1px solid rgba(148, 163, 184, 0.18);
  padding: 12px 0 14px;
}
#supportWorkCard .support-detail__meta {
  margin: 0 0 8px;
  color: var(--cabinet-text, #cbd5e1);
  font-size: 14px;
}
#supportWorkCard .support-msg {
  margin: 0 0 8px;
  font-size: 14px;
  color: var(--cabinet-text, #e2e8f0);
}
#supportWorkCard .support-faq-card {
  padding: 14px 16px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.45);
}
#supportWorkCard .support-cab__faq details {
  border-top: 1px solid rgba(148, 163, 184, 0.16);
  padding: 8px 0;
}
#supportWorkCard .support-cab__faq summary {
  cursor: pointer;
  color: var(--cabinet-text, #e2e8f0);
  font-size: 14px;
}
#supportWorkCard .support-cab__faq details:not([open]) > p {
  display: none;
}
#supportWorkCard .support-cab__empty {
  text-align: left;
}
@media (max-width: 900px) {
  #supportWorkCard .support-cab {
    max-width: none;
  }
  #supportWorkCard .support-hero__copy {
    max-width: none;
  }
  #supportWorkCard .support-hero__actions {
    flex-direction: column;
    align-items: stretch;
  }
  #supportWorkCard #supportHelpBtn,
  #supportWorkCard #supportManagerBtn {
    width: 100%;
    max-width: none;
    min-width: 0;
  }
  #supportWorkCard #supportActive {
    display: none;
  }
  #supportWorkCard .support-table__head {
    display: none;
  }
  #supportWorkCard #supportTicketList {
    gap: 12px;
  }
  #supportWorkCard .support-ticket-card {
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 12px;
    background: rgba(15, 23, 42, 0.45);
    overflow: hidden;
  }
  #supportWorkCard .support-ticket-line {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    width: 100%;
    max-width: none;
    padding: 14px 16px;
  }
  #supportWorkCard .support-ticket-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  #supportWorkCard .support-col {
    padding: 0;
  }
  #supportWorkCard .support-row-chat {
    align-self: stretch;
    width: 100%;
    min-height: 44px;
  }
  #supportWorkCard .support-row-chat__short {
    display: none;
  }
  #supportWorkCard .support-row-chat__long {
    display: inline;
  }
  #supportWorkCard .support-detail {
    padding: 0 16px 14px;
  }
}
#appShell.app-shell--seller-cabinet .side-menu .section-submenu,
#appShell.app-shell--seller-cabinet .side-menu .section-btn .btn-arrow,
#appShell.app-shell--seller-cabinet .settings-block > #settingsPanel {
  display: none;
}
.seller-settings-chrome {
  display: none;
}
@media (min-width: 901px) {
  #appShell.app-shell--seller-cabinet .seller-settings-chrome {
    display: block;
  }
  #appShell.app-shell--seller-cabinet [data-card="bank_products"] .integrations-page-head-row,
  #appShell.app-shell--seller-cabinet [data-card="direct_products"] .integrations-page-head-row,
  #appShell.app-shell--seller-cabinet [data-card="group_menu"] .integrations-page-head-row,
  #appShell.app-shell--seller-cabinet #saveBankProductsBtn,
  #appShell.app-shell--seller-cabinet #saveDirectProductsBtn,
  #appShell.app-shell--seller-cabinet #saveGroupMenuBtn {
    display: none;
  }
  #appShell.app-shell--seller-cabinet .seller-content-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
  }
  #appShell.app-shell--seller-cabinet .seller-content-tab {
    min-height: 40px;
    padding: 0 14px;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 10px;
    background: transparent;
    color: var(--cabinet-text, #e2e8f0);
  }
  #appShell.app-shell--seller-cabinet .seller-content-tab.active {
    background: rgba(140, 102, 255, 0.18);
    color: var(--cabinet-text, #ede9fe);
  }
  #appShell.app-shell--seller-cabinet .seller-settings-save {
    min-height: 40px;
    width: auto;
  }
}

/* Cabinet theme, chart tokens, seller lectures. Login and bootstrap stay on the dark palette. */
.settings-block > .menu-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
#capsWrap:empty { display: none; }
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  margin: 0;
  border-radius: 8px;
  border: 1px solid var(--eds-border, rgba(255, 255, 255, 0.16));
  background: transparent;
  color: var(--eds-text-main, #fff);
  text-transform: none;
  letter-spacing: 0;
  flex: 0 0 auto;
  cursor: pointer;
}
html[data-theme="dark"] .theme-toggle__sun { display: none; }
html[data-theme="light"] .theme-toggle__moon { display: none; }
#themeToggleBtn { display: none; }
@media (min-width: 901px) {
  #themeToggleBtn { display: inline-flex; }
}
@media (max-width: 900px) {
  body:not(.pwa-seller-cabinet-chrome):not(.pwa-desk-ops-chrome) #themeToggleBtn {
    display: inline-flex;
  }
}
.seller-lecture--block { display: block; margin-top: 22px; }
body.pwa-seller-cabinet-chrome .seller-lecture:not(.is-error) { display: none; }
.ap-chart-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0 0 6px;
}
.ap-chart-last {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--eds-text-main, #e6eefc);
}
.ap-chart-delta { font-size: 13px; color: var(--chart-delta-muted, #94a3b8); }
.ap-chart-delta.is-good { color: var(--chart-delta-good, #8fa394); }
html:has(body.pwa-seller-cabinet-chrome),
html:has(body.pwa-desk-ops-chrome) {
  background-color: #121a2b;
}
html[data-theme="light"]:has(#appShell:not(.hidden)) {
  color-scheme: light;
  background-color: #ffffff;
}
html[data-theme="light"] body:has(#appShell:not(.hidden)) {
  background: #F4F6FB;
  color: #0B1220;
  --cabinet-bg: #F4F6FB;
  --cabinet-surface: #ffffff;
  --cabinet-header: #ffffff;
  --cabinet-sheet: #F4F6FB;
  --cabinet-text: #0B1220;
  --cabinet-muted: #475569;
  --cabinet-line: rgba(11, 18, 32, 0.08);
  --cabinet-tint: rgba(140, 102, 255, 0.12);
  --cabinet-nav-bg: #ffffff;
  --cabinet-nav-fg: #0B1220;
  --cabinet-nav-on: #8C66FF;
  --cabinet-nav-on-bg: transparent;
  --chip-bg: rgba(11, 18, 32, 0.06);
  --chip-fg: #0B1220;
  --chip-on-bg: rgba(140, 102, 255, 0.14);
  --chip-on-fg: #0B1220;
  --chip-on-line: rgba(140, 102, 255, 0.35);
  --status-ok-fg: #14532d;
  --status-ok-bg: #dcfce7;
  --status-warn-fg: #713f12;
  --status-warn-bg: #fef9c3;
  --status-bad-fg: #7f1d1d;
  --status-bad-bg: #fee2e2;
  --status-muted-fg: #475569;
  --status-muted-bg: #eef2f7;
  --cabinet-quiet-btn-color: #0B1220;
  --cabinet-quiet-btn-border: rgba(11, 18, 32, 0.35);
  --cabinet-quiet-btn-bg: rgba(11, 18, 32, 0.04);
  --eds-bg-app: #F4F6FB;
  --eds-bg-surface: #ffffff;
  --eds-bg-soft: #ffffff;
  --eds-text-main: #0B1220;
  --eds-text-muted: #475569;
  --eds-border: rgba(11, 18, 32, 0.08);
  --fd-bg-app: #F4F6FB;
  --fd-bg-surface: #ffffff;
  --fd-bg-elevated: #ffffff;
  --fd-bg-soft: #F4F6FB;
  --fd-border: rgba(11, 18, 32, 0.08);
  --fd-border-soft: rgba(11, 18, 32, 0.08);
  --fd-text-main: #0B1220;
  --fd-text-muted: #475569;
  --fd-text-dim: #475569;
  --fd-accent: #8C66FF;
  --text-primary: #0B1220;
  --text-secondary: #475569;
  --text-muted: #475569;
  --bg-surface: #ffffff;
  --border-color: rgba(11, 18, 32, 0.08);
  --chart-label: #0B1220;
  --chart-axis: #475569;
  --chart-grid: rgba(11, 18, 32, 0.12);
  --chart-dot-stroke: #ffffff;
  --chart-delta-good: #5f7d68;
  --chart-delta-muted: #475569;
}
html[data-theme="light"] #appShell,
html[data-theme="light"] #cabinetBottomNav,
html[data-theme="light"] #deskBottomNav,
html[data-theme="light"] #cabinetMoreSheet,
html[data-theme="light"] .pwa-modal-panel {
  --eds-bg-app: #F4F6FB;
  --eds-bg-surface: #ffffff;
  --eds-bg-soft: #F4F6FB;
  --eds-text-main: #0B1220;
  --eds-text-muted: #475569;
  --eds-border: rgba(11, 18, 32, 0.08);
  --fd-bg-app: #F4F6FB;
  --fd-bg-surface: #ffffff;
  --fd-bg-elevated: #ffffff;
  --fd-bg-soft: #F4F6FB;
  --fd-border: rgba(11, 18, 32, 0.08);
  --fd-border-soft: rgba(11, 18, 32, 0.08);
  --fd-text-main: #0B1220;
  --fd-text-muted: #475569;
  --fd-text-dim: #475569;
  --fd-accent: #8C66FF;
  --text-primary: #0B1220;
  --text-secondary: #475569;
  --text-muted: #475569;
  --bg-surface: #ffffff;
  --border-color: rgba(11, 18, 32, 0.08);
  --chart-label: #0B1220;
  --chart-axis: #475569;
  --chart-grid: rgba(11, 18, 32, 0.12);
  --chart-dot-stroke: #ffffff;
  --chart-delta-good: #5f7d68;
  --chart-delta-muted: #475569;
  --cabinet-quiet-btn-color: #0B1220;
  --cabinet-quiet-btn-border: rgba(11, 18, 32, 0.28);
  --pay-tile-bg: #ffffff;
  --pay-tile-border: rgba(11, 18, 32, 0.16);
  --pay-tile-fg: #0B1220;
  --pay-tile-on-bg: #8C66FF;
  --pay-tile-on-border: #8C66FF;
  --pay-tile-on-fg: #ffffff;
  color: #0B1220;
  color-scheme: light;
}
html[data-theme="light"] #appShell {
  background: #F4F6FB;
  color-scheme: light;
}
html[data-theme="light"] #appShell .card,
html[data-theme="light"] .pwa-modal-panel,
html[data-theme="light"] .cabinet-more-sheet,
html[data-theme="light"] .cabinet-bottom-nav {
  background: #ffffff;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.08);
}
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell .card.side-menu,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell .card.side-menu,
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell #shellHeroCard,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell #shellHeroCard {
  background: #ffffff;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.08);
}
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell .main-content .card.work-card,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell .main-content .card.work-card,
html[data-theme="light"] body.pwa-seller-cabinet-chrome #cabinetMoreSheet.cabinet-more-sheet,
html[data-theme="light"] body.pwa-desk-ops-chrome #cabinetMoreSheet.cabinet-more-sheet {
  background: #F4F6FB;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.08);
}
html[data-theme="light"] #appShell .hero,
html[data-theme="light"] #appShell .apps-cab-card,
html[data-theme="light"] #appShell .links-cab-card,
html[data-theme="light"] #appShell .apps-pay-tile,
html[data-theme="light"] #appShell .links-pay-tile,
html[data-theme="light"] #appShell .links-sl-preview,
html[data-theme="light"] #appShell .apps-success-url-row,
html[data-theme="light"] #appShell .apps-create-result,
html[data-theme="light"] #appShell .apps-create-review__box {
  background: #ffffff;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.08);
}
html[data-theme="light"] #appShell .apps-create-review__row {
  border-bottom-color: rgba(11, 18, 32, 0.08);
}
html[data-theme="light"] #appShell .apps-create-review__row span {
  color: #475569;
}
html[data-theme="light"] #appShell .apps-create-review__row strong {
  color: #0B1220;
}
html[data-theme="light"] .feedback {
  background: #f4f6fb;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.12);
}
html[data-theme="light"] .feedback.ok {
  background: #ecfdf3;
  color: #14532d;
  border-color: #86efac;
}
html[data-theme="light"] .feedback.error {
  background: #fef2f2;
  color: #7f1d1d;
  border-color: #fca5a5;
}
html[data-theme="light"] .feedback.warn {
  background: #fffbeb;
  color: #78350f;
  border-color: #fcd34d;
}
html[data-theme="light"] #cabinetBottomNav.cabinet-bottom-nav,
html[data-theme="light"] #deskBottomNav.cabinet-bottom-nav,
html[data-theme="light"] #appShell .cabinet-bottom-nav {
  background: #ffffff;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.08);
}
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-greeting,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-greeting {
  color: #0B1220;
}
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-workspace,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-workspace,
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell .side-menu .menu-title,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell .side-menu .menu-title,
html[data-theme="light"] #cabinetMoreSheet .cabinet-more-sec,
html[data-theme="light"] #appShell .apps-cab-card__client,
html[data-theme="light"] #appShell .apps-cab-card__name--missing,
html[data-theme="light"] #appShell .links-cab-status {
  color: #475569;
}
html[data-theme="light"] #appShell .cabinet-bottom-nav__tab,
html[data-theme="light"] #cabinetBottomNav .cabinet-bottom-nav__tab,
html[data-theme="light"] #deskBottomNav .cabinet-bottom-nav__tab {
  color: #0B1220;
}
html[data-theme="light"] #appShell .apps-cab-card__product,
html[data-theme="light"] #appShell .apps-cab-card__name,
html[data-theme="light"] #appShell .links-cab-card__title,
html[data-theme="light"] #appShell .links-cab-card__amount,
html[data-theme="light"] #appShell #loadAppsBtn,
html[data-theme="light"] #appShell #createAnotherAppBtn,
html[data-theme="light"] #cabinetMoreSheet .cabinet-more-sheet__title,
html[data-theme="light"] #cabinetMoreSheet .cabinet-more-item,
html[data-theme="light"] #appShell.app-shell--seller-cabinet .an-cat-chip,
html[data-theme="light"] #appShell.app-shell--desk-ops .an-cat-chip {
  color: #0B1220;
}
html[data-theme="light"] #appShell .cabinet-bottom-nav__tab.on,
html[data-theme="light"] #cabinetBottomNav .cabinet-bottom-nav__tab.on,
html[data-theme="light"] #deskBottomNav .cabinet-bottom-nav__tab.on {
  color: #8C66FF;
  background: transparent;
}
html[data-theme="light"] .pwa-modal-panel .pwa-modal-close {
  color: #0B1220;
  background: #F4F6FB;
  border-color: rgba(11, 18, 32, 0.08);
}
html[data-theme="light"] #appShell .table-wrap tbody tr:nth-child(even) {
  background: rgba(11, 18, 32, 0.03);
}
html[data-theme="light"] #appShell .apps-pay-tile:not(.on):hover,
html[data-theme="light"] #appShell .links-pay-tile:not(.on):hover {
  background: #F4F6FB;
  color: #0B1220;
}
/* Dark A1 paint is html:not([data-theme="light"]), so these need no !important. */
html[data-theme="light"] #appShell button.apps-pay-tile,
html[data-theme="light"] #appShell button.apps-pay-tile:active,
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell button.apps-pay-tile {
  background: var(--pay-tile-bg, #ffffff);
  background-image: none;
  border: 1px solid var(--pay-tile-border, rgba(11, 18, 32, 0.16));
  color: var(--pay-tile-fg, #0B1220);
  box-shadow: none;
  filter: none;
  transform: none;
}
html[data-theme="light"] #appShell button.apps-pay-tile.is-selected,
html[data-theme="light"] #appShell button.apps-pay-tile.is-selected:hover,
html[data-theme="light"] #appShell button.apps-pay-tile.on.is-selected,
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell button.apps-pay-tile.is-selected {
  background: var(--pay-tile-on-bg, #8C66FF);
  background-image: none;
  border: 2px solid var(--pay-tile-on-border, #8C66FF);
  color: var(--pay-tile-on-fg, #ffffff);
}
html[data-theme="light"] #appShell .menu-profile {
  background: #ffffff;
}
html[data-theme="light"] #appShell input,
html[data-theme="light"] #appShell select,
html[data-theme="light"] #appShell textarea {
  background: #ffffff;
  color: #0B1220;
  -webkit-text-fill-color: #0B1220;
  border-color: rgba(11, 18, 32, 0.16);
  color-scheme: light;
}
html[data-theme="light"] #appShell select option {
  background: #ffffff;
  color: #0B1220;
}
html[data-theme="light"] #appShell input::placeholder,
html[data-theme="light"] #appShell textarea::placeholder {
  color: #475569;
  -webkit-text-fill-color: #475569;
  opacity: 1;
}
html[data-theme="light"] #appShell .muted,
html[data-theme="light"] #appShell .hint,
html[data-theme="light"] #appShell .menu-section-title,
html[data-theme="light"] #appShell .acc-user,
html[data-theme="light"] #appShell .acc-role {
  color: #475569;
}
html[data-theme="light"] #appShell .menu-btn,
html[data-theme="light"] #appShell .acc-name,
html[data-theme="light"] #appShell th,
html[data-theme="light"] #appShell td,
html[data-theme="light"] #appShell h3,
html[data-theme="light"] #appShell h4,
html[data-theme="light"] #appShell label {
  color: #0B1220;
}
html[data-theme="light"] #appShell button.primary,
html[data-theme="light"] #appShell .primary {
  color: #ffffff;
}
html[data-theme="light"] #appShell .an-table-scroll th:first-child,
html[data-theme="light"] #appShell .an-table-scroll td:first-child,
html[data-theme="light"] #appShell .an-table-scroll tbody tr:nth-child(even) td:first-child {
  background: #ffffff;
}
html[data-theme="light"] #loginGate,
html[data-theme="light"] #appBootstrap.app-bootstrap {
  color-scheme: dark;
}
html[data-theme="light"] #appBootstrap.app-bootstrap {
  background: #03142c;
  color: #ffffff;
}

#appShell .pwa-site-logo {
  color: #fff;
  height: 28px;
  width: 166px;
  min-width: 166px;
  max-width: none;
  flex: 0 0 166px;
  display: block;
  overflow: visible;
}
html[data-theme="light"] #appShell .pwa-site-logo {
  color: #0B1220;
}

html[data-theme="light"] #appShell #shellHeroCard,
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell #shellHeroCard,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell #shellHeroCard {
  background: #ffffff;
  background-image: none;
  color: #0B1220;
  border-bottom: 1px solid rgba(11, 18, 32, 0.08);
}
html[data-theme="light"] #appShell .header-greeting,
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-greeting,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-greeting {
  color: #0B1220;
  opacity: 1;
}
html[data-theme="light"] #appShell .header-workspace,
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell #shellHeroCard .header-workspace,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell #shellHeroCard .header-workspace {
  color: #475569;
  opacity: 1;
}
html[data-theme="light"] #appShell .side-menu .menu-btn:hover,
html[data-theme="light"] #appShell .side-menu .submenu-btn:hover {
  background: #F4F6FB;
  color: #0B1220;
}
html[data-theme="light"] #appShell .menu-btn.active,
html[data-theme="light"] #appShell .side-menu .menu-btn.active {
  background: rgba(140, 102, 255, 0.14);
  color: #0B1220;
}

@media (max-width: 900px) {
  html[data-theme="light"] body.pwa-seller-cabinet-chrome #cabinetBottomNav.cabinet-bottom-nav:not(.hidden),
  html[data-theme="light"] body.pwa-desk-ops-chrome #deskBottomNav.cabinet-bottom-nav:not(.hidden) {
    background: #ffffff;
    border-top-color: rgba(11, 18, 32, 0.08);
    color: #0B1220;
  }
  #appShell input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
  #appShell select,
  #appShell textarea,
  #loginGate input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  #loginGate select,
  #loginGate textarea {
    font-size: 16px;
  }
}

#analyticsFilters .filter-row {
  align-items: stretch;
}
#analyticsFilters .filter-row > label {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  grid-column: auto;
  min-width: 0;
}
#analyticsFilters .filter-row > label > span {
  display: block;
  min-height: 16px;
  line-height: 16px;
  margin: 0 0 6px;
}
#analyticsFilters select,
#analyticsFilters input[type="text"],
#analyticsFilters input[type="search"],
#analyticsFilters input[type="date"],
#analyticsFilters .search-select {
  height: 40px;
  min-height: 40px;
  width: 100%;
  max-width: none;
  min-width: 0;
  box-sizing: border-box;
  padding: 0 10px;
  font-size: 14px;
  line-height: 38px;
  border-radius: 8px;
}
#analyticsFilters .search-select:not(.an-chrome-search) {
  display: flex;
  align-items: stretch;
  padding: 0;
  border: 0;
  background: transparent;
}
#appShell.app-shell--seller-cabinet #analyticsFilters .search-select.an-chrome-search {
  display: flex;
  align-items: stretch;
  padding: 0;
  border: 0;
  background: transparent;
}
#analyticsFilters .search-select input[type="text"] {
  height: 40px;
  min-height: 40px;
  max-height: 40px;
  font-size: inherit;
  line-height: 38px;
  padding: 0 10px;
}
@media (max-width: 900px) {
  #analyticsFilters select,
  #analyticsFilters input[type="text"],
  #analyticsFilters input[type="search"],
  #analyticsFilters input[type="date"] {
    font-size: 16px;
  }
}

@media (min-width: 901px) {
  .ap-avg-chart svg {
    height: 380px;
  }
}

html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell .card.side-menu,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell .card.side-menu {
  border-right: 0;
  box-shadow: 10px 0 28px rgba(11, 18, 32, 0.06);
}
html[data-theme="light"] body.pwa-seller-cabinet-chrome #appShell .main-content .card.work-card,
html[data-theme="light"] body.pwa-desk-ops-chrome #appShell .main-content .card.work-card {
  background: linear-gradient(90deg, #ffffff 0, #F4F6FB 72px);
  border-left: 0;
}

html[data-theme="light"] #appShell .an-cat-chips {
  background: #ffffff;
  border-color: rgba(11, 18, 32, 0.1);
}
html[data-theme="light"] #appShell .an-cat-chip,
html[data-theme="light"] #appShell.app-shell--seller-cabinet .an-cat-chip,
html[data-theme="light"] #appShell.app-shell--desk-ops .an-cat-chip {
  color: #0B1220;
}
html[data-theme="light"] #appShell .an-cat-chip.is-active,
html[data-theme="light"] #appShell.app-shell--seller-cabinet .an-cat-chip.is-active,
html[data-theme="light"] #appShell.app-shell--desk-ops .an-cat-chip.is-active {
  background: #8C66FF;
  color: #ffffff;
  box-shadow: none;
}

html[data-theme="light"] #appShell .apps-cab-chip {
  background: #ffffff;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.14);
}
html[data-theme="light"] #appShell .apps-cab-chip.on {
  background: rgba(140, 102, 255, 0.14);
  color: #0B1220;
  border-color: #8C66FF;
}
html[data-theme="light"] #appShell .apps-cab-chip__n,
html[data-theme="light"] #appShell .apps-cab-chip.on .apps-cab-chip__n {
  background: rgba(140, 102, 255, 0.16);
  color: #0B1220;
}
html[data-theme="light"] #appShell .apps-cab-type {
  background: #e0e7ff;
  color: #312e81;
}
html[data-theme="light"] #appShell .apps-cab-type.type-fullpay {
  background: #dcfce7;
  color: #14532d;
}
html[data-theme="light"] #appShell .apps-cab-type.type-internal {
  background: #f3e8ff;
  color: #581c87;
}
html[data-theme="light"] #appShell .apps-cab-type.type-sub {
  background: #e0f2fe;
  color: #0c4a6e;
}
html[data-theme="light"] #appShell .apps-cab-card__meta {
  color: #475569;
}
html[data-theme="light"] #appShell .apps-cab-card__product {
  color: #0B1220;
}

html[data-theme="light"] #appShell .links-sl-preview__url,
html[data-theme="light"] #appShell .links-cab-card__url {
  background: #F4F6FB;
  color: #475569;
  border-color: rgba(11, 18, 32, 0.1);
}
html[data-theme="light"] #appShell .links-sl-preview__url span,
html[data-theme="light"] #appShell .links-sl-preview__title,
html[data-theme="light"] #appShell .links-sl-preview__amount {
  color: #0B1220;
}
html[data-theme="light"] #appShell .links-adv-block,
html[data-theme="light"] #appShell .links-form-panel--chrome .links-term-chips label {
  background: #ffffff;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.14);
}

html[data-theme="light"] #supportWorkCard .support-hero,
html[data-theme="light"] #supportWorkCard .support-hero__active,
html[data-theme="light"] #supportWorkCard .support-faq-card,
html[data-theme="light"] #supportWorkCard .support-ticket-card {
  background: #ffffff;
  border-color: rgba(11, 18, 32, 0.1);
  color: #0B1220;
}
html[data-theme="light"] #appShell .search-select-list li.muted-opt {
  color: #475569;
}
#analyticsFilters .filter-row > label[data-filter="product_type"],
#analyticsFilters .filter-row > label[data-filter="source"] {
  display: none;
}
.decision-next-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}
.decision-next-tile {
  background: var(--eds-bg-surface, #0f172a);
  color: var(--eds-text-main, #e2e8f0);
  border: 1px solid var(--eds-border, rgba(148, 163, 184, 0.4));
  border-radius: 12px;
  min-height: 72px;
  padding: 14px 10px;
  font-weight: 650;
  cursor: pointer;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.decision-next-tile .apps-pay-tico {
  font-size: 18px;
  line-height: 1;
  font-weight: 400;
  font-style: normal;
  font-synthesis: none;
  font-variant-emoji: emoji;
  font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji";
}
#appCardModal {
  z-index: 10080;
}
.decision-next-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.decision-next-form__title {
  margin: 0;
  font-weight: 700;
}
.decision-next-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  font-weight: 650;
}
.decision-next-form input,
.decision-next-form select {
  width: 100%;
  box-sizing: border-box;
  min-height: 44px;
  border-radius: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(148, 163, 184, 0.4);
  background: #0f172a;
  color: #e2e8f0;
}
html[data-theme="light"] .decision-next-form input,
html[data-theme="light"] .decision-next-form select {
  background: #ffffff;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.16);
}
.decision-next-form .hint {
  margin: 0;
  font-weight: 400;
}
.decision-next-form .primary {
  min-height: 44px;
}
html[data-theme="light"] .decision-next-tile {
  background: #ffffff;
  color: #0B1220;
  border-color: rgba(11, 18, 32, 0.16);
}
.decision-next-tile:hover {
  border-color: #8C66FF;
}
@media (max-width: 640px) {
  .decision-next-grid {
    grid-template-columns: 1fr;
  }
}

.device-sessions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0 0 14px;
}
.device-sessions__title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--eds-text-main);
}
.device-session-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid var(--eds-border);
  border-radius: var(--eds-radius);
  background: var(--eds-bg-surface);
  color: var(--eds-text-main);
  box-shadow: var(--eds-shadow-sm);
}
.device-session-row__label {
  font-weight: 600;
  color: var(--eds-text-main);
}
.device-session-row__meta,
.device-session-row__badge,
.device-sessions__empty {
  color: var(--eds-text-muted);
}
.device-session-row__badge {
  font-weight: 500;
  font-size: 13px;
}
.device-limit-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
}
.device-limit-box.hidden,
.device-sessions .hidden {
  display: none;
}