:root{
  --font:'Inter',system-ui,-apple-system,sans-serif;
  --shadow-xs:0 4px 14px rgba(15,23,42,.05);
  --shadow-sm:0 12px 28px rgba(15,23,42,.08);
  --shadow-md:0 20px 42px rgba(15,23,42,.11);
  --shadow-lg:0 28px 64px rgba(15,23,42,.16);
  --radius-s:14px;
  --radius-m:20px;
  --radius-l:28px;
  --radius-xl:36px;
  --ease:180ms ease;
}

:root[data-theme="light"]{
  --bg:#eef4fb;
  --bg-2:#f8fbff;
  --surface:#ffffff;
  --surface-2:#f7faff;
  --surface-3:#ffffffd9;
  --line:#dce6f3;
  --line-2:#c5d6ec;
  --text:#132033;
  --muted:#6b7a93;
  --primary:#245cf4;
  --primary-2:#5a84ff;
  --primary-soft:#edf3ff;
  --success:#179867;
  --success-soft:#ecfbf4;
  --danger:#d64c4c;
  --danger-soft:#fff1f1;
  --warning:#9c7300;
  --warning-soft:#fff6dd;
  --rail:#f9fbffcc;
  --rail-line:#deebf9;
  --glass:rgba(255,255,255,.78);
}

:root[data-theme="dark"]{
  --bg:#0f1522;
  --bg-2:#131b2b;
  --surface:#171f31;
  --surface-2:#1b2437;
  --surface-3:rgba(23,31,49,.84);
  --line:#29344a;
  --line-2:#33425d;
  --text:#f1f5fb;
  --muted:#93a0b8;
  --primary:#6d92ff;
  --primary-2:#88a8ff;
  --primary-soft:rgba(109,146,255,.12);
  --success:#3ec88f;
  --success-soft:rgba(62,200,143,.12);
  --danger:#ff7d7d;
  --danger-soft:rgba(255,125,125,.12);
  --warning:#f0c96c;
  --warning-soft:rgba(240,201,108,.12);
  --rail:#0d1320d8;
  --rail-line:#202a40;
  --glass:rgba(18,25,39,.72);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font);
  color:var(--text);
  background:
    radial-gradient(circle at 0% 0%, rgba(36,92,244,.10), transparent 24%),
    radial-gradient(circle at 100% 0%, rgba(90,132,255,.08), transparent 22%),
    linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.hidden{display:none!important}
button,input,select,textarea{font-family:var(--font)}
.light{color:#dbe7ff}

/* Мобильные элементы — скрыты по умолчанию, показываются только на узких экранах */
.mobile-bottom-nav,
.mbn-more-sheet,
.mbn-overlay,
.mobile-fab,
.mobile-fab-menu{
  display:none;
}

/* login stays close to current */
.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:48px 24px}
.login-layout{width:min(1180px,100%);display:grid;grid-template-columns:1.2fr .8fr;gap:52px;align-items:center;animation:fadeUp .6s ease}
.login-hero{padding:8px 6px}
.login-logo{width:104px;height:104px;border-radius:32px;background:linear-gradient(135deg,var(--primary),var(--primary-2));display:flex;align-items:center;justify-content:center;color:#fff;font-size:34px;font-weight:800;margin-bottom:26px;box-shadow:0 24px 70px rgba(36,92,244,.28)}
.hero-copy h1{margin:0 0 16px;font-size:58px;line-height:.94;letter-spacing:-.06em}
.hero-copy p{margin:0 0 24px;max-width:580px;font-size:17px;line-height:1.76;color:var(--muted)}
.hero-list{display:flex;flex-direction:column;gap:12px}
.hero-item{display:flex;align-items:center;gap:12px;font-weight:600}
.hero-item span{width:10px;height:10px;border-radius:999px;background:var(--primary);box-shadow:0 0 0 6px rgba(36,92,244,.10)}
.login-card{background:var(--surface-3);border:1px solid var(--line);border-radius:var(--radius-xl);padding:38px;backdrop-filter:blur(20px);box-shadow:var(--shadow-lg)}
.login-card h2{margin:0 0 10px;font-size:34px;line-height:1.02;letter-spacing:-.04em}
.login-card p{margin:0 0 20px;color:var(--muted);line-height:1.65}
.eyebrow{margin-bottom:10px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* new app */
.workspace{
  display:grid;
  grid-template-columns:290px 1fr;
  gap:24px;
  padding:20px;
  min-height:100vh;
}
.rail{
  position:sticky;
  top:20px;
  height:calc(100vh - 40px);
  display:flex;
  flex-direction:column;
  background:var(--rail);
  border:1px solid var(--rail-line);
  backdrop-filter:blur(18px);
  border-radius:32px;
  padding:18px;
  box-shadow:var(--shadow-md);
  overflow-y:auto;
}
.rail-top{display:flex;flex-direction:column;gap:8px}
.brand-tile{
  display:flex;
  gap:14px;
  align-items:center;
  padding:8px 6px 18px;
}
.brand-avatar{
  width:58px;height:58px;border-radius:20px;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}
.brand-avatar img{width:100%;height:100%;object-fit:cover}
.brand-title{font-size:16px;font-weight:800;line-height:1.12}
.brand-subtitle{margin-top:5px;font-size:12px;color:var(--muted)}

.nav-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:4px;
}
.nav-item{
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid transparent;
  background:transparent;
  color:var(--text);
  padding:11px 14px;
  border-radius:14px;
  cursor:pointer;
  font-size:14px;
  font-weight:600;
  transition:var(--ease);
  text-align:left;
}
.nav-item:hover{
  background:var(--surface);
  border-color:var(--line);
  transform:translateX(2px);
}
.nav-item.active{
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  box-shadow:0 18px 34px rgba(36,92,244,.24);
}
.nav-ico{
  width:20px;
  text-align:center;
  font-size:14px;
}

.rail-bottom{display:flex;flex-direction:column;gap:8px;margin-top:auto;padding-top:14px}

/* Минималистичный API-статус: только точка и короткий текст */
.rail-status{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  font-size:11px;
  color:var(--muted);
  font-weight:600;
  letter-spacing:.02em;
}
.rail-status-text{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.status-dot{
  width:8px;height:8px;border-radius:999px;background:#e2b000;
  box-shadow:0 0 0 2px color-mix(in srgb, currentColor 10%, transparent);
  flex-shrink:0;
}
/* Старые классы оставлены для совместимости с другими местами в коде */
.status-chip{
  display:flex;align-items:center;gap:12px;padding:14px;border-radius:20px;
  background:var(--surface);border:1px solid var(--line);
}
.status-kicker{
  font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:700;
}
.status-text{font-size:12px;margin-top:3px}
.user-panel{
  padding:14px;
  border-radius:20px;
  background:var(--surface);
  border:1px solid var(--line);
  color:var(--muted);
  font-size:12px;
  line-height:1.55;
}
.stack-actions{display:flex;flex-direction:column;gap:10px}

.content{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.masthead{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  background:var(--glass);
  border:1px solid var(--line);
  border-radius:28px;
  padding:14px 16px;
  backdrop-filter:blur(18px);
  box-shadow:var(--shadow-sm);
}
.masthead-left,.masthead-right{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  min-width:0;
}
.period-wrap,.section-top,.toolbar,.actions-row,.surface-head,.surface-head-between,.segment{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.period-wrap{gap:6px}
.range-wrap{
  display:flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:12px;
  background:var(--surface);
  border:1px dashed var(--line);
  flex-wrap:nowrap;
  transition:border-color .2s, background .2s;
}
.range-wrap.is-active{
  border-style:solid;
  border-color:var(--accent);
  background:color-mix(in srgb, var(--accent) 8%, var(--surface));
}
.range-label{font-size:11px;color:var(--text-muted);font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:0 4px;white-space:nowrap}
.range-dash{color:var(--text-muted);font-weight:600;padding:0 2px}
.range-wrap .date-input{padding:6px 8px;font-size:12px;width:auto;min-width:130px;max-width:140px;flex:0 0 auto}
.range-wrap .btn{padding:6px 12px;font-size:12px;flex:0 0 auto}
.date-input{
  padding:8px 12px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  font-family:inherit;
  font-size:13px;
  width:auto;
  flex:0 0 auto;
}
.period-chip{
  min-width:180px;
  text-align:center;
  padding:10px 14px;
  border-radius:14px;
  background:var(--surface);
  border:1px solid var(--line);
  box-shadow:var(--shadow-xs);
  font-weight:700;
  font-size:13px;
  text-transform:capitalize;
}
.page{display:none;animation:fadeUp .28s ease}
.page.active{display:block}
.section-top{margin-bottom:18px}
.section-top-between{justify-content:space-between}
.section-top h1{
  margin:0 0 6px;
  font-size:36px;
  line-height:1.02;
  letter-spacing:-.05em;
}
.section-top p{
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.65;
}

.segment{
  margin-bottom:18px;
}

.kpi-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-bottom:18px;
}
.kpi{
  background:linear-gradient(180deg,var(--surface),var(--surface-2));
  border:1px solid var(--line);
  border-radius:20px;
  padding:18px 20px;
  box-shadow:var(--shadow-xs);
  transition:var(--ease);
  position:relative;
  overflow:hidden;
}
.kpi::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:transparent;transition:var(--ease);
}
.kpi-good::before{background:#23a56f}
.kpi-warn::before{background:#ef8b2d}
.kpi-bad::before{background:#d64a4a}
.kpi-info::before{background:var(--primary)}
.kpi-neutral::before{background:var(--muted)}
.kpi:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-md);
}
.kpi .label{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:10px;
  font-weight:800;
  display:flex;
  align-items:center;
  gap:6px;
}
.kpi-help{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px;height:14px;
  border-radius:50%;
  background:var(--bg);
  color:var(--muted);
  font-size:9px;
  font-weight:700;
  cursor:help;
  border:1px solid var(--line);
}
.kpi-help:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.kpi .value{
  font-size:26px;
  line-height:1.05;
  letter-spacing:-.04em;
  font-weight:800;
}
.kpi .sub{
  margin-top:8px;
  color:var(--muted);
  font-size:12px;
}

.dashboard-layout{
  display:grid;
  grid-template-columns:1.3fr .9fr;
  gap:16px;
}
.surface{
  background:var(--surface-3);
  border:1px solid var(--line);
  border-radius:28px;
  padding:22px;
  backdrop-filter:blur(16px);
  box-shadow:var(--shadow-sm);
  transition:var(--ease);
}
.surface:hover{box-shadow:var(--shadow-md)}
.surface.wide,.surface.narrow{min-width:0}
.surface-head{justify-content:space-between;margin-bottom:18px}
.surface-title{
  font-size:20px;
  font-weight:700;
  letter-spacing:-.02em;
}
.surface-subtitle{
  margin-top:4px;
  color:var(--muted);
  font-size:13px;
}
.chart-box{height:340px}
.stack{display:flex;flex-direction:column;gap:12px}
.insight{
  padding:14px 16px;
  border-radius:16px;
  background:var(--surface-2);
  border:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:6px;
  border-left:3px solid var(--muted);
}
.insight-head{display:flex;justify-content:space-between;align-items:center;gap:14px}
.insight-value{font-weight:800;font-size:16px;letter-spacing:-.02em}
.insight-good{border-left-color:#23a56f}
.insight-warn{border-left-color:#ef8b2d;background:color-mix(in srgb, #ef8b2d 6%, var(--surface-2))}
.insight-bad{border-left-color:#d64a4a;background:color-mix(in srgb, #d64a4a 6%, var(--surface-2))}
.insight-neutral{border-left-color:var(--muted)}

.toolbar{
  display:grid;
  grid-template-columns:220px 220px minmax(240px,1fr);
  gap:12px;
  margin-bottom:18px;
}
.toolbar-wide{
  grid-template-columns:180px 180px 220px 220px minmax(220px,1fr);
}

.duo-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.cards-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.form-stack{display:flex;flex-direction:column;gap:16px}
.field{display:flex;flex-direction:column;gap:8px}
.field span{
  font-size:13px;
  font-weight:600;
  color:var(--muted);
}
input,select,textarea{
  width:100%;
  padding:13px 15px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface);
  color:var(--text);
  font:inherit;
  transition:var(--ease);
}
input:hover,select:hover,textarea:hover{border-color:var(--line-2)}
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:rgba(36,92,244,.55);
  box-shadow:0 0 0 4px rgba(36,92,244,.12);
}
textarea{min-height:110px;resize:vertical}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px 16px;
}
.form-grid .full{grid-column:1 / -1}

.btn,.icon-btn,.switch-btn{
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  padding:11px 15px;
  border-radius:16px;
  font-weight:700;
  cursor:pointer;
  transition:var(--ease);
  box-shadow:var(--shadow-xs);
}
.btn:hover,.icon-btn:hover,.switch-btn:hover{
  transform:translateY(-1px);
  box-shadow:var(--shadow-sm);
}
.btn-primary{
  background:linear-gradient(180deg,var(--primary) 0%, #1f52e8 100%);
  border-color:transparent;
  color:#fff;
}
.btn-secondary{background:var(--surface)}
.btn-ghost{
  background:transparent;
  color:var(--text);
  border-color:var(--line);
  box-shadow:none;
}
:root[data-theme="dark"] .btn-ghost{
  color:var(--text);
  background:transparent;
}
.btn-block{width:100%}
.btn-sm{padding:8px 10px;font-size:12px}
.btn-lg{padding:14px 18px}
.icon-btn{
  width:42px;height:42px;padding:0;
  display:flex;align-items:center;justify-content:center;
}
.switch-btn{
  border-radius:999px;
  padding:10px 16px;
}
.switch-btn.active{
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
.file-btn{position:relative;overflow:hidden}
.file-btn input{position:absolute;inset:0;opacity:0;cursor:pointer}

.table{width:100%;border-collapse:collapse}
.table th,.table td{
  padding:13px 10px;
  border-bottom:1px solid var(--line);
  text-align:left;
  font-size:14px;
  vertical-align:top;
}
.table th{
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
}
.badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
}
.badge.planned{background:var(--warning-soft);color:var(--warning)}
.badge.paid{background:var(--success-soft);color:var(--success)}
.badge.overdue{background:var(--danger-soft);color:var(--danger)}
.empty{
  padding:26px;
  text-align:center;
  color:var(--muted);
}

.calendar{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:6px;
}
.calendar-head,.calendar-day{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px;
}
.calendar-head{
  text-align:center;
  font-size:11px;
  font-weight:800;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  padding:8px;
}
.calendar-day{
  min-height:128px;
  display:flex;
  flex-direction:column;
  gap:6px;
  cursor:pointer;
  transition:var(--ease);
  position:relative;
  overflow:hidden;
}
.calendar-day:hover{
  border-color:rgba(36,92,244,.45);
  transform:translateY(-1px);
  box-shadow:var(--shadow-xs);
}
.calendar-day.is-today{
  border-color:var(--primary);
  border-width:2px;
  padding:9px;
  background:color-mix(in srgb, var(--primary) 5%, var(--surface));
}
.calendar-day.is-weekend{background:color-mix(in srgb, var(--muted) 4%, var(--surface))}
.calendar-day.is-other-month{opacity:.45}
.calendar-day.has-items{border-color:color-mix(in srgb, var(--primary) 15%, var(--line))}

/* Полоска сверху — индикатор чистого потока дня */
.day-pulse{
  position:absolute;top:0;left:0;right:0;height:3px;border-radius:14px 14px 0 0;
}
.day-pulse-pos{background:linear-gradient(90deg, #23a56f, #23a56faa)}
.day-pulse-neg{background:linear-gradient(90deg, #d64a4a, #d64a4aaa)}

.day-header{
  display:flex;justify-content:space-between;align-items:center;
  font-weight:800;font-size:14px;
}
.day-count{
  font-size:10px;font-weight:800;
  background:var(--primary);color:#fff;
  border-radius:10px;padding:1px 7px;
  min-width:18px;text-align:center;
}
.calendar-day.is-today .day-header{color:var(--primary)}

.day-items{display:flex;flex-direction:column;gap:3px;flex:1;min-height:0}
.day-item{
  display:flex;align-items:center;gap:6px;
  font-size:11px;padding:3px 7px;border-radius:8px;
  cursor:pointer;
  transition:background .15s;
  line-height:1.3;
}
.day-item:hover{filter:brightness(1.05)}
.day-item-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-weight:600}
.day-item-sum{font-size:10px;font-weight:800;font-family:'JetBrains Mono',monospace;opacity:.85}
.day-item-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;background:currentColor}

/* Цвета по типу + статусу */
.day-item-income.day-item-paid     {background:color-mix(in srgb, #23a56f 18%, transparent);color:#1a7d54}
.day-item-income.day-item-planned  {background:color-mix(in srgb, #23a56f 9%, transparent); color:#23a56f;border:1px dashed color-mix(in srgb, #23a56f 35%, transparent)}
.day-item-income.day-item-overdue  {background:color-mix(in srgb, #d64a4a 15%, transparent);color:#d64a4a;border:1px solid #d64a4a55}

.day-item-expense.day-item-paid    {background:color-mix(in srgb, #d64a4a 16%, transparent);color:#a83838}
.day-item-expense.day-item-planned {background:color-mix(in srgb, #d64a4a 8%, transparent); color:#d64a4a;border:1px dashed color-mix(in srgb, #d64a4a 35%, transparent)}
.day-item-expense.day-item-overdue {background:#d64a4a;color:#fff}

[data-theme="dark"] .day-item-income.day-item-paid {background:color-mix(in srgb, #23a56f 25%, transparent);color:#6fe3a8}
[data-theme="dark"] .day-item-expense.day-item-paid {background:color-mix(in srgb, #d64a4a 22%, transparent);color:#ff9999}

.day-more{font-size:10px;color:var(--muted);padding:2px 6px;font-weight:600;font-style:italic}

.day-footer{
  display:flex;justify-content:space-between;gap:6px;
  font-size:10px;font-weight:800;font-family:'JetBrains Mono',monospace;
  padding-top:4px;border-top:1px dashed var(--line);
}
.day-in{color:#23a56f}
.day-out{color:#d64a4a}

/* === Тулбар календаря === */
.calendar-toolbar{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  margin:16px 0 12px;flex-wrap:wrap;
}
.cal-filter{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cal-filter-label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:700;margin-right:4px}
.cal-filter-btn{
  padding:6px 14px;border-radius:10px;
  border:1px solid var(--line);background:var(--surface);
  font-size:12px;font-weight:700;cursor:pointer;
  color:var(--text);transition:var(--ease);
}
.cal-filter-btn:hover{border-color:var(--primary)}
.cal-filter-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.cal-legend{display:flex;gap:14px;flex-wrap:wrap}
.cal-legend-item{
  display:flex;align-items:center;gap:5px;
  font-size:11px;color:var(--muted);font-weight:600;
}
.cal-legend-item i{display:inline-block;width:10px;height:10px;border-radius:3px}
.dot-in   {background:#23a56f}
.dot-out  {background:#d64a4a}
.dot-paid {background:linear-gradient(135deg,#23a56f,#d64a4a)}
.dot-plan {border:1px dashed var(--muted);background:transparent;border-radius:3px}
.dot-over {background:#d64a4a;box-shadow:0 0 0 1px #d64a4a inset}

/* === Модалка просмотра дня === */
.day-summary{padding:12px 16px;background:var(--surface-2);border-radius:12px;margin-bottom:14px;border:1px solid var(--line)}
.day-summary-row{display:flex;gap:18px;flex-wrap:wrap;font-size:13px}
.day-sum{color:var(--muted)}
.day-sum strong{font-family:'JetBrains Mono',monospace;font-size:14px}
.day-sum-in strong{color:#23a56f}
.day-sum-out strong{color:#d64a4a}
.day-sum-net.good strong{color:#23a56f}
.day-sum-net.bad strong{color:#d64a4a}

.day-list{display:flex;flex-direction:column;gap:6px;max-height:400px;overflow-y:auto;padding-right:4px}
.day-list-row{
  display:grid;grid-template-columns:8px 1fr auto auto;gap:12px;align-items:center;
  padding:10px 12px;border-radius:10px;background:var(--surface-2);border:1px solid var(--line);
  cursor:pointer;transition:var(--ease);
}
.day-list-row:hover{border-color:var(--primary);background:var(--surface)}
.day-list-dot{width:8px;height:100%;border-radius:3px;background:var(--muted)}
.day-list-income .day-list-dot{background:#23a56f}
.day-list-expense .day-list-dot{background:#d64a4a}
.day-list-overdue .day-list-dot{background:#d64a4a;box-shadow:inset 0 0 0 2px rgba(0,0,0,.15)}
.day-list-main{min-width:0}
.day-list-name{font-weight:700;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.day-list-meta{font-size:11px;color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.day-list-amount{font-family:'JetBrains Mono',monospace;font-weight:800;font-size:14px;white-space:nowrap}
.day-list-amount.good{color:#23a56f}
.day-list-amount.bad{color:#d64a4a}

.day-add-group{display:flex;gap:8px}

/* === Модалка просмотра записи === */
.entry-view-top{
  display:flex;justify-content:space-between;align-items:center;gap:14px;
  padding:16px 0;border-bottom:1px solid var(--line);margin-bottom:14px;
}
.entry-view-amount{font-size:30px;font-weight:800;letter-spacing:-.03em;font-family:'JetBrains Mono',monospace}
.entry-view-amount.income{color:#23a56f}
.entry-view-amount.expense{color:#d64a4a}
.entry-view-grid{display:flex;flex-direction:column;gap:10px}
.entry-view-row{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:8px 0;border-bottom:1px dashed var(--line);
  font-size:13.5px;
}
.entry-view-row:last-child{border-bottom:none}
.entry-view-label{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;flex-shrink:0}
.entry-view-row .good{color:#23a56f;font-weight:700}
.entry-view-row .bad{color:#d64a4a;font-weight:700}
.entry-view-actions{display:flex;gap:6px;flex-wrap:wrap}
.btn.btn-danger{background:#d64a4a;color:#fff;border-color:#d64a4a}
.btn.btn-danger:hover{background:#b83e3e}

.modal{
  position:fixed;
  inset:0;
  background:rgba(9,14,24,.44);
  backdrop-filter:blur(8px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  z-index:50;
}
.modal-card{
  width:min(980px,100%);
  max-height:calc(100vh - 40px);
  overflow-y:auto;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:30px;
  padding:24px;
  box-shadow:var(--shadow-lg);
  animation:fadeUp .22s ease;
  display:flex;
  flex-direction:column;
}
.modal-card.small{width:min(520px,100%)}
.modal-card.wide{width:min(1120px,100%)}
.modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
  position:sticky;
  top:-24px;
  background:var(--surface);
  padding:8px 0 12px;
  margin-top:-8px;
  z-index:2;
  border-bottom:1px solid var(--line);
}
.modal-head h2{
  margin:0;
  font-size:22px;
  line-height:1.1;
  letter-spacing:-.03em;
}
.modal-actions{
  margin-top:16px;
  justify-content:flex-end;
  position:sticky;
  bottom:-24px;
  background:var(--surface);
  padding:12px 0 0;
  border-top:1px solid var(--line);
  z-index:2;
}

.footer{
  text-align:center;
  color:var(--muted);
  font-size:13px;
  padding:6px 0 12px;
}
.footer a{color:var(--primary);text-decoration:none}
.form-error{color:var(--danger);font-size:13px}
.guide h3{margin:0 0 8px}
.guide p{margin:0 0 16px}

@keyframes fadeUp{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}

@media (max-width:1380px){
  .dashboard-layout{grid-template-columns:1fr}
  .surface.wide,.surface.narrow{grid-column:auto}
}
@media (max-width:1280px){
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .duo-grid,.cards-grid{grid-template-columns:1fr}
}
@media (max-width:1040px){
  .workspace{grid-template-columns:1fr;padding:14px}
  .rail{position:relative;top:0;height:auto;max-height:none;overflow:visible}
  .rail-bottom{padding-top:8px}
  .toolbar,.toolbar-wide{grid-template-columns:1fr 1fr}
}
@media (max-width:980px){
  .login-layout{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
}

/* ============================================================ */
/* ПЛАНШЕТ И ТЕЛЕФОН — ≤900px                                   */
/* ============================================================ */
@media (max-width:900px){
  /* Базовая разгрузка */
  .workspace{padding:10px;gap:10px}

  /* Боковая панель: компактная горизонтальная сверху, не сворачиваем в иконки */
  .rail{
    padding:12px 14px;
    border-radius:18px;
    flex-direction:column;
    gap:8px;
  }
  .brand{padding:6px 4px 8px;gap:10px}
  .brand-mark{width:36px;height:36px;border-radius:10px;font-size:14px}
  .brand-title{font-size:14px;line-height:1.2}
  .brand-subtitle{font-size:11px}

  /* Меню — горизонтальный скролл иконок */
  .nav-grid{
    display:flex;
    overflow-x:auto;
    gap:4px;
    padding:2px;
    scrollbar-width:none;
  }
  .nav-grid::-webkit-scrollbar{display:none}
  .nav-item{
    flex-shrink:0;
    flex-direction:column;
    gap:3px;
    padding:8px 10px;
    border-radius:10px;
    font-size:11px;
    min-width:64px;
  }
  .nav-ico{font-size:18px}

  /* Низ панели: компактнее */
  .rail-bottom{padding-top:8px;gap:6px}
  .rail-status{padding:4px 8px;font-size:10px}
  .user-panel{padding:8px 10px}
  .rail-user-name{font-size:13px}
  .stack-actions{display:flex;gap:6px}
  .stack-actions .btn{flex:1}

  /* Шапка */
  .masthead{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
    padding:10px;
  }
  .masthead-left,.masthead-right{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    width:100%;
  }
  .masthead-right{justify-content:space-between}

  /* Range-пикер скрываем — слишком большой */
  .range-wrap{display:none}
  .period-chip{flex:1;min-width:0;padding:8px 10px;font-size:12px}

  /* Заголовки разделов */
  .hero-head h1{font-size:24px;letter-spacing:-.02em}
  .section-top h1{font-size:22px}
  .eyebrow{font-size:10px}
  .surface{padding:14px;border-radius:14px}
  .surface-title{font-size:14px}

  /* Дашборд: 2 колонки KPI */
  .pulse-grid{grid-template-columns:repeat(2,1fr);gap:10px}
  .pulse-card{padding:14px}
  .pulse-value{font-size:22px}
  .pulse-label{font-size:10px;margin-bottom:8px}
  .pulse-hint{font-size:11px}

  .today-strip{grid-template-columns:repeat(2,1fr)}
  .today-cell-value{font-size:15px}

  .signal-bar{padding:12px;flex-wrap:wrap;gap:10px}
  .signal-bar-link{width:100%;text-align:center}

  /* Источники: одна колонка */
  .src-cmp-stats{grid-template-columns:repeat(2,1fr)}

  /* Календарь: режим СПИСКА на мобильных (как Google Calendar) */
  .calendar-toolbar{flex-direction:column;align-items:stretch;gap:10px}
  .cal-filter{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}
  .cal-filter::-webkit-scrollbar{display:none}
  .cal-filter-btn{flex-shrink:0}
  .cal-legend{display:none}

  /* Переопределяем сетку календаря — становится списком */
  .calendar{
    grid-template-columns:1fr !important;
    gap:6px;
  }
  .calendar-head{display:none}  /* заголовки дней не нужны в списке */
  .calendar-day{
    min-height:auto;
    padding:14px 16px !important;
    flex-direction:row;
    flex-wrap:wrap;
    align-items:center;
    gap:12px;
  }
  .calendar-day.is-other-month{display:none}  /* в режиме списка прячем чужие месяцы */
  .calendar-day:not(.has-items):not(.is-today){display:none}  /* пустые дни вообще скрываем */
  .calendar-day.is-today{order:-1}  /* сегодня всегда сверху */
  .day-pulse{display:none}
  .day-header{
    flex-direction:column;
    align-items:flex-start;
    gap:0;
    width:60px;
    flex-shrink:0;
  }
  .day-header::before{
    content:attr(data-weekday);
    display:block;
    font-size:10px;
    color:var(--muted);
    text-transform:uppercase;
    font-weight:700;
    letter-spacing:.06em;
    margin-bottom:2px;
  }
  .day-num{font-size:22px;font-weight:800;line-height:1}
  .day-count{
    align-self:flex-start;
    margin-top:4px;
    font-size:9px;
    padding:1px 6px;
  }
  .day-items{flex:1;min-width:0;gap:4px}
  .day-item{
    padding:6px 10px;
    font-size:13px;
  }
  .day-footer{
    width:100%;
    margin-top:6px;
    padding-top:8px;
    font-size:11px;
  }

  /* Таблицы → карточки на узких экранах */
  .table thead{display:none}
  .table,.table tbody,.table tr,.table td{display:block;width:100%}
  .table tr{
    border:1px solid var(--line);
    border-radius:12px;
    margin-bottom:8px;
    padding:10px 12px;
    background:var(--surface);
  }
  .table td{
    border-bottom:1px dashed var(--line);
    padding:7px 0;
    text-align:right;
    position:relative;
    padding-left:42%;
  }
  .table td:last-child{border-bottom:none}
  .table td::before{
    content:attr(data-label);
    position:absolute;
    left:0;top:7px;
    font-size:11px;
    color:var(--muted);
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
    text-align:left;
  }

  /* Модалки на весь экран */
  .modal-card{
    width:100% !important;
    max-width:100% !important;
    height:100vh;
    max-height:100vh;
    border-radius:0;
    margin:0;
  }

  /* Touch-таргеты не меньше 44px */
  .btn,.icon-btn,.icon-btn-sm{min-height:40px}
  .nav-item{min-height:44px}

  /* Аналитика */
  .pf-table{font-size:12px}
  .pf-table th,.pf-table td{padding:6px 4px}

  /* Источники-переключатель */
  .src-switch{flex-direction:column}
  .src-btn{width:100%;flex-direction:row;justify-content:space-between;min-width:0}

  /* Лестница собственника */
  .owner-kpis{grid-template-columns:repeat(2,1fr)}
  .ladder-row{flex-wrap:wrap;gap:6px}
  .ladder-value{font-size:13px}
}

/* ============================================================ */
/* МАЛЫЙ ТЕЛЕФОН ≤480px                                          */
/* ============================================================ */
@media (max-width:480px){
  .pulse-grid,.today-strip{grid-template-columns:1fr}
  .pulse-value{font-size:24px}
  .src-cmp-stats{grid-template-columns:1fr;gap:6px}
  .owner-kpis{grid-template-columns:1fr}
  .hero-head h1,.section-top h1{font-size:20px}
}

/* ===== Справочники: карточки с действиями ===== */
.dir-list{display:flex;flex-direction:column;gap:6px}
.dir-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  transition:var(--ease);
}
.dir-row:hover{border-color:var(--primary);background:color-mix(in srgb, var(--primary) 4%, var(--surface))}
.dir-dot{
  width:14px;height:14px;
  border-radius:50%;
  flex:0 0 auto;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.15);
}
.dir-dot-empty{background:transparent;box-shadow:inset 0 0 0 1.5px var(--line)}
.dir-name{flex:1;font-weight:600;font-size:13.5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dir-meta{font-size:12px;color:var(--muted);font-weight:500;padding:2px 8px;border-radius:8px;background:var(--bg);white-space:nowrap}
.dir-actions{display:flex;gap:4px;flex:0 0 auto;opacity:.4;transition:var(--ease)}
.dir-row:hover .dir-actions{opacity:1}
.icon-btn-sm{
  width:28px;height:28px;
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);
  background:var(--bg);
  color:var(--text);
  border-radius:8px;
  cursor:pointer;
  font-size:13px;
  font-weight:600;
  transition:var(--ease);
  padding:0;
}
.icon-btn-sm:hover:not(:disabled){border-color:var(--primary);color:var(--primary)}
.icon-btn-sm:disabled{opacity:.3;cursor:not-allowed}
.icon-btn-sm.icon-btn-danger:hover:not(:disabled){border-color:#d64a4a;color:#d64a4a;background:rgba(214,74,74,.08)}

/* ===== Раздел Собственник: KPI + лестница расчёта + сигналы ===== */
.owner-kpis{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:20px;
}
.owner-kpi{
  background:linear-gradient(180deg,var(--surface),var(--surface-2));
  border:1px solid var(--line);
  border-radius:18px;
  padding:16px;
  position:relative;
  overflow:hidden;
}
.owner-kpi::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:transparent;
}
.owner-kpi-good::before{background:#23a56f}
.owner-kpi-warn::before{background:#ef8b2d}
.owner-kpi-bad::before{background:#d64a4a}
.owner-kpi-neutral::before{background:var(--muted)}
.owner-kpi-label{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);font-weight:700;margin-bottom:8px}
.owner-kpi-value{font-size:22px;font-weight:800;letter-spacing:-.03em;line-height:1.05}
.owner-kpi-sub{margin-top:6px;font-size:11px;color:var(--muted)}

.owner-signals{display:flex;flex-direction:column;gap:8px;margin-bottom:20px}
.signal{
  padding:12px 16px;
  border-radius:12px;
  border-left:3px solid var(--muted);
  background:var(--surface-2);
}
.signal-good{border-left-color:#23a56f;background:color-mix(in srgb,#23a56f 6%,var(--surface-2))}
.signal-warn{border-left-color:#ef8b2d;background:color-mix(in srgb,#ef8b2d 8%,var(--surface-2))}
.signal-bad{border-left-color:#d64a4a;background:color-mix(in srgb,#d64a4a 10%,var(--surface-2))}
.signal-text{font-weight:700;font-size:14px;margin-bottom:4px}
.signal-detail{color:var(--muted);font-size:12px}

.owner-ladder{
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:16px;
  padding:6px;
  display:flex;
  flex-direction:column;
}
.ladder-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:12px 14px;
  border-radius:10px;
  transition:var(--ease);
}
.ladder-row:hover{background:var(--surface)}
.ladder-label{
  font-size:13px;
  font-weight:600;
  color:var(--text);
  flex:1;
}
.ladder-explain{
  font-size:11px;
  color:var(--muted);
  font-weight:400;
  margin-top:3px;
}
.ladder-value{
  font-family:'JetBrains Mono','SF Mono',monospace;
  font-feature-settings:"tnum";
  font-weight:700;
  font-size:14px;
  white-space:nowrap;
}
.ladder-base{background:color-mix(in srgb,var(--primary) 8%,var(--surface-2));border:1px solid color-mix(in srgb,var(--primary) 20%,var(--line))}
.ladder-base .ladder-value{color:var(--primary)}
.ladder-sub .ladder-value{color:var(--muted)}
.ladder-sub-bad{background:color-mix(in srgb,#d64a4a 6%,var(--surface-2))}
.ladder-sub-bad .ladder-value{color:#d64a4a}
.ladder-result{
  border-top:2px dashed var(--line);
  margin-top:4px;
  padding-top:14px;
  font-weight:700;
}
.ladder-result .ladder-label{font-size:14px;font-weight:800}
.ladder-result .ladder-value{font-size:16px}
.ladder-final{
  background:linear-gradient(135deg,#23a56f15,#23a56f08);
  border:2px solid #23a56f40;
  margin-top:6px;
}
.ladder-final .ladder-label{font-size:14px;font-weight:800;color:#23a56f}
.ladder-final .ladder-value{font-size:20px;color:#23a56f;font-weight:800}

@media (max-width:900px){
  .owner-kpis{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .owner-kpis{grid-template-columns:1fr}
}

/* ===== Аналитика: таблица план/факт ===== */
.pf-table{width:100%;border-collapse:collapse;font-size:13px}
.pf-table th,.pf-table td{padding:10px 8px;text-align:left;border-bottom:1px solid var(--line)}
.pf-table th{font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--surface-2)}
.pf-table td.num,.pf-table th.num{text-align:right;font-family:'JetBrains Mono','SF Mono',monospace;font-feature-settings:"tnum"}
.pf-table tfoot th{border-top:2px solid var(--line);background:var(--surface-2);font-size:13px;text-transform:none;letter-spacing:0;color:var(--text)}
.pf-table tbody tr:hover{background:var(--surface-2)}
.pf-bad{color:#d64a4a}
.pf-good{color:#23a56f}
.pf-info{color:var(--primary)}
.pf-neutral{color:var(--muted)}
.pf-badge{
  display:inline-block;padding:3px 10px;border-radius:8px;font-size:11px;font-weight:700;
  background:var(--surface-2);border:1px solid var(--line);
}
.pf-badge.pf-bad{background:color-mix(in srgb,#d64a4a 12%,transparent);border-color:#d64a4a40;color:#d64a4a}
.pf-badge.pf-good{background:color-mix(in srgb,#23a56f 12%,transparent);border-color:#23a56f40;color:#23a56f}
.pf-badge.pf-info{background:color-mix(in srgb,var(--primary) 12%,transparent);border-color:transparent;color:var(--primary)}

/* ===== ТОП расходов ===== */
.top-list{display:flex;flex-direction:column;gap:10px}
.top-row{
  display:grid;
  grid-template-columns:24px 1fr 80px 90px 50px;
  gap:10px;align-items:center;
  padding:10px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);
}
.top-rank{
  width:24px;height:24px;border-radius:50%;
  background:var(--primary);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:12px;
}
.top-info{min-width:0}
.top-name{font-weight:600;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.top-meta{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.top-bar{height:6px;background:var(--bg);border-radius:3px;overflow:hidden;grid-column:3/4}
.top-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-2));border-radius:3px}
.top-value{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:12px;text-align:right;white-space:nowrap}
.top-pct{font-size:11px;color:var(--muted);text-align:right;font-weight:600}
@media (max-width:700px){
  .top-row{grid-template-columns:24px 1fr 80px;gap:8px}
  .top-bar,.top-pct{display:none}
}

/* ===== Источники: цветная точка ===== */
.src-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:middle}

/* ===== Динамика: таблица MoM + YoY ===== */
.dyn-table{width:100%;border-collapse:collapse;font-size:13px}
.dyn-table th,.dyn-table td{padding:10px 8px;text-align:left;border-bottom:1px solid var(--line)}
.dyn-table th{font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.dyn-table th.num,.dyn-table td.num{text-align:right;font-family:'JetBrains Mono','SF Mono',monospace;font-feature-settings:"tnum"}
.dyn-table tbody tr:hover{background:var(--surface-2)}
.dyn-label{font-weight:600;color:var(--muted);font-size:13px}
.dyn-now{font-weight:800;font-size:14px}
.dyn-arrow{
  display:inline-block;font-size:12px;font-weight:800;padding:3px 10px;border-radius:8px;
  background:var(--bg);
}
.dyn-good{background:color-mix(in srgb,#23a56f 14%,transparent);color:#23a56f}
.dyn-bad{background:color-mix(in srgb,#d64a4a 14%,transparent);color:#d64a4a}
.dyn-neutral{background:var(--bg);color:var(--muted)}
.dyn-foot{margin-top:10px;font-size:11px;color:var(--muted);text-transform:lowercase}

/* ===== Подсветка типа в карточке справочника ===== */
.dir-meta-kind{background:color-mix(in srgb,var(--primary) 8%,var(--bg));color:var(--primary);font-weight:700}

/* ===== Прогноз остатка ===== */
.forecast-summary{margin-top:14px;display:flex;flex-direction:column;gap:12px}
.forecast-row{
  display:flex;gap:24px;flex-wrap:wrap;
  padding:12px 16px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);
  font-size:14px;
}
.forecast-row strong{font-size:16px;font-family:'JetBrains Mono',monospace;font-feature-settings:"tnum"}
.forecast-label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:600}

/* ===== What-if ===== */
.whatif-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr auto;
  gap:12px;
  margin-bottom:16px;
  align-items:end;
}
.whatif-result{margin-top:10px}
.whatif-summary{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  padding:16px;
  border-radius:14px;
  background:var(--surface-2);
  border:1px solid var(--line);
  margin-bottom:12px;
}
.whatif-col{
  flex:1;
  min-width:140px;
  padding:10px 14px;
  border-radius:10px;
  background:var(--bg);
  border:1px solid var(--line);
}
.whatif-col-scenario{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 6%,var(--bg))}
.whatif-col-final{border-color:#23a56f;background:color-mix(in srgb,#23a56f 6%,var(--bg))}
.whatif-col-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:6px;font-weight:700}
.whatif-col-value{font-size:16px;font-weight:800;font-family:'JetBrains Mono',monospace;font-feature-settings:"tnum"}
.whatif-arrow{color:var(--muted);font-weight:800;font-size:18px}

@media (max-width:900px){
  .whatif-grid{grid-template-columns:1fr 1fr}
  .whatif-summary{flex-direction:column;align-items:stretch}
  .whatif-arrow{display:none}
}

/* ===== Пользователи: карточки ролей ===== */
.roles-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:12px;
  padding:4px 0;
}
.role-card{
  padding:16px;
  border-radius:14px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-top-width:3px;
  transition:var(--ease);
}
.role-card:hover{transform:translateY(-1px);box-shadow:var(--shadow-xs)}
.role-card-owner      {border-top-color:#d64a4a}
.role-card-accountant {border-top-color:#245cf4}
.role-card-manager    {border-top-color:#23a56f}
.role-card-viewer     {border-top-color:var(--muted)}
.role-card-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px;gap:10px}
.role-card-title{font-weight:800;font-size:15px;letter-spacing:-.02em}
.role-card-code{font-size:10px;color:var(--muted);font-family:'JetBrains Mono',monospace;text-transform:lowercase}
.role-card-desc{font-size:12px;color:var(--muted);line-height:1.5;margin-bottom:10px}
.role-perms-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px}
.role-perms-list li{
  font-size:11.5px;padding:4px 8px;
  background:var(--bg);border-radius:6px;
  border-left:2px solid var(--line);
}

/* Цветные бейджи ролей в таблице пользователей */
.role-badge{
  display:inline-block;padding:3px 10px;border-radius:8px;
  font-size:11px;font-weight:700;letter-spacing:.01em;
  background:var(--surface-2);border:1px solid var(--line);
}
.role-badge-owner     {background:color-mix(in srgb,#d64a4a 15%,transparent);color:#d64a4a;border-color:#d64a4a40}
.role-badge-accountant{background:color-mix(in srgb,#245cf4 15%,transparent);color:#245cf4;border-color:#245cf440}
.role-badge-manager   {background:color-mix(in srgb,#23a56f 15%,transparent);color:#23a56f;border-color:#23a56f40}
.role-badge-viewer    {background:var(--surface-2);color:var(--muted);border-color:var(--line)}

/* ===== Модалка пользователя: секции и сетка ===== */
.user-form-section{margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.user-form-section:last-of-type{border-bottom:none;margin-bottom:0;padding-bottom:0}
.user-form-section-title{
  font-size:11px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--muted);font-weight:800;margin-bottom:10px;
}
.user-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:10px;
}
@media (max-width:640px){
  .user-form-grid{grid-template-columns:1fr}
}
.field-hint{display:block;margin-top:4px;font-size:11px}

/* ===== Боковая панель: имя и роль пользователя ===== */
.rail-user-name{
  font-weight:700;font-size:13.5px;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.rail-user-role{
  font-size:11px;color:var(--muted);margin-top:2px;
  text-transform:uppercase;letter-spacing:.04em;font-weight:600;
}

/* ===== Кнопка темы (иконка) в шапке — размер как у обычных кнопок ===== */
.icon-btn-theme{
  width:auto;
  min-width:40px;height:40px;
  padding:0 12px;
  font-size:16px;line-height:1;
  border-radius:12px;
  background:var(--surface);
  border:1px solid var(--line);
  color:var(--text);
  cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  transition:var(--ease);
}
.icon-btn-theme:hover{
  border-color:var(--primary);color:var(--primary);
}
.icon-btn-theme #themeIcon{font-size:16px;line-height:1}

/* ===== File-btn с Импортом: единый размер с Экспортом ===== */
.masthead-right .file-btn,
.masthead-right .btn{
  font-size:13px;
  font-weight:600;
  padding:10px 16px;
  height:40px;
  display:inline-flex;align-items:center;justify-content:center;
}
.masthead-right .file-btn > span{line-height:1}

/* ===== Блок пользователя в сайдбаре: имя по центру ===== */
.user-panel{
  padding:12px 12px;
  border-radius:14px;
  background:var(--surface);
  border:1px solid var(--line);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:4px;
}
.rail-user-name{
  font-weight:700;font-size:13.5px;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  line-height:1.3;
  max-width:100%;
  text-align:center;
}

/* ============================================================ */
/* НОВЫЙ ДАШБОРД                                                */
/* ============================================================ */

/* === 1. Пульс бизнеса — 4 крупные метрики === */
.pulse-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-bottom:18px;
}
.pulse-card{
  background:linear-gradient(180deg,var(--surface),var(--surface-2));
  border:1px solid var(--line);
  border-radius:22px;
  padding:22px 24px;
  position:relative;
  overflow:hidden;
  transition:var(--ease);
  box-shadow:var(--shadow-xs);
}
.pulse-card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:transparent;
}
.pulse-good::before{background:linear-gradient(180deg,#23a56f,#1a7d54)}
.pulse-warn::before{background:linear-gradient(180deg,#ef8b2d,#c47020)}
.pulse-bad::before {background:linear-gradient(180deg,#d64a4a,#a83838)}
.pulse-neutral::before{background:linear-gradient(180deg,var(--muted),color-mix(in srgb,var(--muted) 60%,#000))}
.pulse-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.pulse-label{
  font-size:11px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--muted);font-weight:800;margin-bottom:14px;
}
.pulse-value{
  font-size:32px;
  font-weight:800;
  letter-spacing:-.04em;
  line-height:1;
  font-family:'JetBrains Mono','SF Mono',monospace;
  font-feature-settings:"tnum";
}
.pulse-good .pulse-value{color:#23a56f}
.pulse-bad  .pulse-value{color:#d64a4a}
.pulse-warn .pulse-value{color:#ef8b2d}
.pulse-hint{
  margin-top:8px;font-size:12px;color:var(--muted);font-weight:600;
}
@media (max-width:1100px){
  .pulse-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .pulse-grid{grid-template-columns:1fr}
  .pulse-value{font-size:26px}
}

/* === 2. Сигналы — алерт-бар === */
.signals-stack{
  display:flex;flex-direction:column;gap:8px;margin-bottom:20px;
}
.signal-bar{
  display:flex;align-items:center;gap:14px;
  padding:14px 18px;
  border-radius:14px;
  background:var(--surface);
  border:1px solid var(--line);
  border-left:4px solid var(--muted);
  transition:var(--ease);
}
.signal-bar-good{border-left-color:#23a56f;background:color-mix(in srgb,#23a56f 5%,var(--surface))}
.signal-bar-warn{border-left-color:#ef8b2d;background:color-mix(in srgb,#ef8b2d 6%,var(--surface))}
.signal-bar-bad {border-left-color:#d64a4a;background:color-mix(in srgb,#d64a4a 6%,var(--surface))}
.signal-bar-neutral{border-left-color:var(--primary);background:color-mix(in srgb,var(--primary) 4%,var(--surface))}
.signal-bar-icon{font-size:20px;flex-shrink:0;width:32px;text-align:center}
.signal-bar-body{flex:1;min-width:0}
.signal-bar-text{font-weight:700;font-size:14px;margin-bottom:2px}
.signal-bar-detail{font-size:12.5px;color:var(--muted)}
.signal-bar-link{
  background:transparent;border:1px solid currentColor;
  padding:7px 14px;border-radius:10px;
  font-size:12px;font-weight:700;cursor:pointer;
  color:var(--primary);
  transition:var(--ease);flex-shrink:0;
}
.signal-bar-link:hover{background:var(--primary);color:#fff;border-color:var(--primary)}

/* === 3. Переключатель источников — с суммами === */
.src-switch-wrap{margin-bottom:20px}
.src-switch-label{
  font-size:11px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--muted);font-weight:700;margin-bottom:10px;
}
.src-switch{display:flex;gap:8px;flex-wrap:wrap}
.src-btn{
  display:flex;flex-direction:column;align-items:flex-start;gap:4px;
  padding:12px 18px;
  border-radius:14px;
  background:var(--surface);
  border:2px solid var(--line);
  cursor:pointer;
  transition:var(--ease);
  min-width:140px;
}
.src-btn:hover{border-color:color-mix(in srgb,var(--primary) 50%,var(--line))}
.src-btn.active{
  background:linear-gradient(180deg,var(--primary),#1f52e8);
  border-color:var(--primary);
  color:#fff;
  box-shadow:0 4px 14px color-mix(in srgb,var(--primary) 35%,transparent);
  transform:translateY(-1px);
}
.src-btn-name{
  font-size:11px;text-transform:uppercase;letter-spacing:.06em;
  font-weight:800;opacity:.7;
}
.src-btn.active .src-btn-name{opacity:.85}
.src-btn-sum{
  font-size:16px;font-weight:800;
  font-family:'JetBrains Mono',monospace;font-feature-settings:"tnum";
  letter-spacing:-.02em;
}

/* === 4. Ближайшие платежи === */
.upcoming-list{display:flex;flex-direction:column;gap:8px;max-height:320px;overflow-y:auto}
.upc-row{
  display:grid;grid-template-columns:48px 1fr auto;gap:12px;align-items:center;
  padding:10px 12px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-left:3px solid var(--muted);
  border-radius:10px;
}
.upc-income {border-left-color:#23a56f}
.upc-expense{border-left-color:#d64a4a}
.upc-date{
  text-align:center;
  background:var(--surface);
  border-radius:8px;padding:6px;
}
.upc-day{font-size:18px;font-weight:800;line-height:1;color:var(--text)}
.upc-month{font-size:10px;color:var(--muted);text-transform:uppercase;font-weight:700;margin-top:2px}
.upc-info{min-width:0}
.upc-name{font-weight:700;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upc-when{font-size:11px;color:var(--muted);margin-top:2px}
.upc-amount{font-family:'JetBrains Mono',monospace;font-weight:800;font-size:14px}
.upc-amount-income {color:#23a56f}
.upc-amount-expense{color:#d64a4a}

/* === 5. Сравнение источников === */
.src-cmp-list{display:flex;flex-direction:column;gap:14px}
.src-cmp-row{
  padding:14px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
}
.src-cmp-head{
  display:flex;align-items:center;gap:10px;margin-bottom:10px;
}
.src-cmp-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}
.src-cmp-name{font-weight:700;font-size:14px;flex:1}
.src-cmp-share{
  font-family:'JetBrains Mono',monospace;font-weight:800;font-size:14px;
  color:var(--muted);
}
.src-cmp-bar{
  height:6px;background:var(--bg);border-radius:3px;
  overflow:hidden;margin-bottom:12px;
}
.src-cmp-bar-fill{height:100%;border-radius:3px;transition:width .4s ease}
.src-cmp-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  font-size:12px;
}
.src-cmp-stats .muted{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;margin-bottom:2px}
.src-cmp-stats strong{font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:800}
@media (max-width:700px){
  .src-cmp-stats{grid-template-columns:repeat(2,1fr)}
}

/* === ТОП расходов компактно === */
.top-list-compact{display:flex;flex-direction:column;gap:8px}
.top-compact-row{
  display:grid;grid-template-columns:24px 1fr auto;gap:12px;align-items:center;
  padding:10px 12px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;
}
.top-compact-rank{
  width:24px;height:24px;border-radius:50%;
  background:var(--primary);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:12px;
}
.top-compact-info{min-width:0}
.top-compact-name{font-weight:700;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.top-compact-meta{font-size:11px;color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.top-compact-meta strong{color:var(--text);font-weight:700}
.top-compact-amount{font-family:'JetBrains Mono',monospace;font-weight:800;font-size:13px;white-space:nowrap}

/* === 6. План/Факт прогресс-бары === */
.pf-bars{display:flex;flex-direction:column;gap:14px}
.pf-bar-row{padding:8px 0}
.pf-bar-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.pf-bar-name{font-weight:700;font-size:13px}
.pf-bar-numbers{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--muted);font-weight:700}
.pf-bar-track{
  position:relative;height:10px;background:var(--bg);border-radius:5px;
  overflow:visible;border:1px solid var(--line);
}
.pf-bar-fill{
  height:100%;background:linear-gradient(90deg,#23a56f,#1a7d54);
  border-radius:4px;transition:width .4s ease;
}
.pf-bar-fill-bad{background:linear-gradient(90deg,#ef8b2d,#d64a4a)}
.pf-bar-overrun{
  position:absolute;left:100%;top:-2px;height:calc(100% + 4px);
  background:#d64a4a;border-radius:0 4px 4px 0;
  border-left:2px dashed #fff;
}
.pf-bar-foot{font-size:11px;font-weight:700;margin-top:6px}

/* === Динамика MoM компактно === */
.mom-list{display:flex;flex-direction:column;gap:8px}
.mom-row{
  display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;
  padding:10px 12px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;
}
.mom-label{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.mom-now{font-family:'JetBrains Mono',monospace;font-weight:800;font-size:14px}
.mom-arrow{
  display:inline-block;font-size:11px;font-weight:800;
  padding:3px 9px;border-radius:8px;background:var(--bg);min-width:60px;text-align:center;
}
.mom-good{background:color-mix(in srgb,#23a56f 14%,transparent);color:#23a56f}
.mom-bad {background:color-mix(in srgb,#d64a4a 14%,transparent);color:#d64a4a}
.mom-neutral{background:var(--bg);color:var(--muted)}
.mom-foot{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;margin-bottom:8px}

/* === Тренды в Пульсе (стрелочки vs прошлый месяц) === */
.pulse-trend{
  font-weight:800;
  font-family:'JetBrains Mono','SF Mono',monospace;
  font-feature-settings:"tnum";
  white-space:nowrap;
}
.pulse-trend.up   {color:#23a56f}
.pulse-trend.down {color:#d64a4a}

/* === Полоска "Сегодня" под пульсом === */
.today-strip{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  margin-bottom:18px;
}
.today-strip-cell{
  background:var(--surface);
  padding:14px 18px;
  display:flex;
  flex-direction:column;
  gap:4px;
  transition:var(--ease);
}
.today-strip-cell:hover{background:var(--surface-2)}
.today-cell-label{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.07em;
  color:var(--muted);
  font-weight:700;
}
.today-cell-value{
  font-size:18px;
  font-weight:800;
  letter-spacing:-.02em;
  font-family:'JetBrains Mono','SF Mono',monospace;
  font-feature-settings:"tnum";
  line-height:1.1;
}
.today-cell-value.good{color:#23a56f}
.today-cell-value.bad {color:#d64a4a}
.today-cell-value.muted{color:var(--muted);font-size:13px;font-weight:700}
.today-strip-net{position:relative}
.today-strip-net::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:transparent;
}
.today-strip-net.positive::before{background:#23a56f}
.today-strip-net.negative::before{background:#d64a4a}
.today-strip-net.positive .today-cell-value{color:#23a56f}
.today-strip-net.negative .today-cell-value{color:#d64a4a}

@media (max-width:900px){
  .today-strip{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .today-strip{grid-template-columns:1fr}
}

/* Заголовок блока "За сегодня" с датой */
.today-block{margin-bottom:18px}
.today-block-head{
  display:flex;align-items:baseline;gap:10px;
  margin-bottom:8px;padding:0 4px;
}
.today-block-title{
  font-size:13px;font-weight:800;
  color:var(--text);
  letter-spacing:-.01em;
}
.today-block-date{
  font-size:12px;color:var(--muted);
  text-transform:lowercase;
}
.today-strip{margin-bottom:0 !important}

/* ===== Модалка повторов: dual-input и сопутствующие стили ===== */
.dual-input{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.dual-input input,
.dual-input select{
  flex:1;
  min-width:80px;
}
.dual-input input{max-width:110px}
.dual-sep,.dual-prefix{
  font-size:13px;
  color:var(--muted);
  font-weight:600;
  white-space:nowrap;
}
.dual-prefix{padding-right:4px}

/* Справка-плашка в разделе повторов */
.recurring-help{
  font-size:13px;
  line-height:1.6;
  color:var(--muted);
  padding:8px 4px;
}
.recurring-help strong{color:var(--text)}

/* Список правил */
.recurring-list{display:flex;flex-direction:column;gap:10px}
.recurring-row{
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  gap:14px;
  align-items:center;
  padding:14px 16px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  transition:var(--ease);
}
.recurring-row:hover{border-color:var(--primary)}
.recurring-row.inactive{opacity:.55}
.recurring-row.inactive .recurring-name{text-decoration:line-through}
.recurring-icon{
  width:36px;height:36px;
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:var(--bg);
  font-size:16px;
}
.recurring-row.income .recurring-icon{background:color-mix(in srgb,#23a56f 16%,transparent);color:#23a56f}
.recurring-row.expense .recurring-icon{background:color-mix(in srgb,#d64a4a 16%,transparent);color:#d64a4a}
.recurring-main{min-width:0}
.recurring-name{font-weight:700;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recurring-meta{font-size:12px;color:var(--muted);margin-top:3px}
.recurring-amount{
  font-family:'JetBrains Mono',monospace;
  font-weight:800;font-size:14px;
  text-align:right;white-space:nowrap;
}
.recurring-amount.income{color:#23a56f}
.recurring-amount.expense{color:#d64a4a}
.recurring-actions{display:flex;gap:4px;flex-shrink:0}

@media (max-width:700px){
  .recurring-row{grid-template-columns:auto 1fr auto;gap:10px;padding:12px}
  .recurring-amount{grid-column:2/3;grid-row:2;text-align:left;font-size:13px}
  .recurring-actions{grid-column:1/-1;justify-content:flex-end}
}

/* Бейдж ↻ для операций, созданных правилом */
.recurring-badge{
  display:inline-flex;
  align-items:center;justify-content:center;
  width:18px;height:18px;
  border-radius:50%;
  background:color-mix(in srgb,var(--primary) 15%,transparent);
  color:var(--primary);
  font-size:11px;font-weight:800;
  margin-left:6px;
  cursor:help;
}

/* Заголовок Календаря: группа кнопок справа */
.calendar-header-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
@media (max-width:700px){
  .calendar-header-actions{width:100%;justify-content:stretch}
  .calendar-header-actions .btn{flex:1;min-width:0}
}

/* ============================================================ */
/* НАСТРОЙКИ — полностью переделанный UI (v15.18)                */
/* ============================================================ */

/* Заголовок страницы настроек более спокойный */
#page-settings > .section-top{margin-bottom:18px}
#page-settings > .section-top h1{font-size:26px}

/* Сетка секций: 2 колонки */
.settings-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
  margin-bottom:14px;
  align-items:stretch;
}
.settings-grid > .settings-section{
  margin-bottom:0;
  height:100%;
}
/* Секции вне grid (Telegram-напоминания) */
#page-settings > .settings-section{margin-bottom:14px}
.settings-grid-full{grid-column:1 / -1}

@media (max-width:1100px){
  .settings-grid{grid-template-columns:1fr}
}

/* Базовая карточка секции */
.settings-section{
  padding:22px 24px;
  display:flex;
  flex-direction:column;
  gap:16px;
  border-radius:18px;
  border:1px solid var(--line);
  background:var(--surface);
  transition:border-color .2s ease, box-shadow .2s ease;
}
.settings-section:hover{
  border-color:color-mix(in srgb, var(--line) 60%, var(--primary) 20%);
}

/* Шапка секции */
.settings-section-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding-bottom:14px;
  margin:0;
  border-bottom:1px solid var(--line);
}
.settings-section-head > div:first-child{flex:1;min-width:0}
.settings-section-title{
  font-size:15px;
  font-weight:800;
  letter-spacing:-.01em;
  color:var(--text);
  margin-bottom:4px;
  line-height:1.2;
}
.settings-section-subtitle{
  font-size:12.5px;
  color:var(--muted);
  line-height:1.45;
  font-weight:500;
}

/* Индикатор статуса — более плоский и современный */
.settings-status{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:5px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
  white-space:nowrap;
  flex-shrink:0;
  background:var(--surface-2);
  color:var(--muted);
}
.settings-status.good{
  color:#23a56f;
  background:color-mix(in srgb, #23a56f 12%, transparent);
}
.settings-status.warn{
  color:#ef8b2d;
  background:color-mix(in srgb, #ef8b2d 12%, transparent);
}
.settings-status.bad{
  color:#d64a4a;
  background:color-mix(in srgb, #d64a4a 12%, transparent);
}
.settings-status.neutral{color:var(--muted)}

/* Форма: 2 колонки с правильными отступами */
.form-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.form-grid-2 > .field{margin:0}
@media (max-width:700px){
  .form-grid-2{grid-template-columns:1fr}
}

/* Инлайн-поле (label слева, input справа) */
.field-inline{
  flex-direction:row !important;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.field-inline > span:first-child{
  font-size:12.5px;
  color:var(--text);
  white-space:nowrap;
  font-weight:600;
  margin:0;
}

/* ===== Toggle-switch (вкл/выкл) ===== */
.switch-toggle{
  position:relative;
  display:inline-block;
  width:48px; height:26px;
  flex-shrink:0;
}
.switch-toggle input{opacity:0;width:0;height:0}
.switch-slider{
  position:absolute;
  cursor:pointer;
  inset:0;
  background:var(--line);
  border-radius:999px;
  transition:.25s;
}
.switch-slider:before{
  position:absolute;
  content:'';
  height:20px; width:20px;
  left:3px; bottom:3px;
  background:#fff;
  border-radius:50%;
  transition:.25s cubic-bezier(.4,0,.2,1);
  box-shadow:0 2px 4px rgba(0,0,0,.15);
}
.switch-toggle input:checked + .switch-slider{background:var(--primary)}
.switch-toggle input:checked + .switch-slider:before{transform:translateX(22px)}

/* ===== Telegram-напоминания: карточки типов ===== */
.tg-notify-body{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.tg-notify-types{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
@media (max-width:1280px){
  .tg-notify-types{grid-template-columns:1fr}
}
.tg-type-card{
  padding:16px 18px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:14px;
  display:flex;
  flex-direction:column;
  gap:12px;
  transition:border-color .2s ease;
}
.tg-type-card:hover{border-color:color-mix(in srgb, var(--primary) 30%, var(--line))}
.tg-type-head{display:flex;flex-direction:column;gap:6px}
.tg-type-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  user-select:none;
  color:var(--text);
}
.tg-type-title input[type="checkbox"]{
  width:18px; height:18px;
  cursor:pointer;
  accent-color:var(--primary);
  flex-shrink:0;
}
.tg-type-hint{
  font-size:12px;
  color:var(--muted);
  margin-left:28px;
  line-height:1.5;
}
.tg-type-body{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.tg-type-body textarea{
  font-family:'JetBrains Mono','SF Mono',monospace;
  font-size:12px;
  line-height:1.55;
  min-height:110px;
  resize:vertical;
  background:var(--surface);
}

/* ===== CRON блок — отдельная визуальная плашка ===== */
.tg-cron-box{
  padding:18px 20px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--primary) 3%, var(--surface)), var(--surface));
  border:1px solid color-mix(in srgb, var(--primary) 25%, var(--line));
  border-radius:14px;
}
.tg-cron-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:14px;
  padding-bottom:14px;
  border-bottom:1px solid var(--line);
}
.tg-cron-head > div:first-child{flex:1;min-width:0}
.tg-cron-title{
  font-weight:800;
  font-size:14px;
  letter-spacing:-.01em;
  margin-bottom:4px;
  color:var(--text);
}
.tg-cron-subtitle{
  font-size:12px;
  color:var(--muted);
  line-height:1.45;
}
.tg-cron-status{
  padding:5px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
  background:var(--surface-2);
}
.tg-cron-status.good{
  color:#23a56f;
  background:color-mix(in srgb, #23a56f 12%, transparent);
}
.tg-cron-status.warn{
  color:#ef8b2d;
  background:color-mix(in srgb, #ef8b2d 12%, transparent);
}

.tg-cron-rows{display:flex;flex-direction:column;gap:12px}
.tg-cron-row{
  display:grid;
  grid-template-columns:160px 1fr;
  gap:14px;
  align-items:start;
  font-size:13px;
}
.tg-cron-label{
  font-size:11px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
  padding-top:6px;
}
.tg-cron-value{
  font-size:13px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding-top:2px;
}
.tg-cron-value code{
  font-family:'JetBrains Mono',monospace;
  background:var(--surface);
  border:1px solid var(--line);
  padding:4px 10px;
  border-radius:7px;
  font-size:12px;
  color:var(--text);
  font-weight:600;
}

/* Команда для cron — длинный одностроковый код */
.tg-cron-cmd{
  display:flex;
  align-items:stretch;
  gap:8px;
  flex-wrap:nowrap;
  width:100%;
}
.tg-cron-cmd code{
  flex:1;
  min-width:0;
  overflow-x:auto;
  white-space:nowrap;
  padding:10px 14px;
  font-family:'JetBrains Mono',monospace;
  font-size:11.5px;
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:8px;
  color:var(--text);
  line-height:1.4;
}
.tg-cron-cmd code::-webkit-scrollbar{height:4px}
.tg-cron-cmd code::-webkit-scrollbar-thumb{background:var(--muted);border-radius:2px}

@media (max-width:700px){
  .tg-cron-row{grid-template-columns:1fr;gap:4px}
  .tg-cron-label{padding-top:0}
  .tg-cron-head{flex-direction:column}
}

/* Кнопка "Показать ещё" в справочниках */
/* Кнопка "Показать ещё" в справочниках */
.dir-toggle{
  width:100%;
  margin-top:8px;
  padding:10px;
  background:transparent;
  border:1px dashed var(--line);
  border-radius:10px;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  transition:var(--ease);
}
.dir-toggle:hover{
  border-color:var(--primary);
  color:var(--primary);
  background:color-mix(in srgb,var(--primary) 5%,transparent);
}

/* ============================================================ */
/* ПАТЧ 15.17: Weekdays picker, плейсхолдеры, роли              */
/* ============================================================ */

/* Weekdays picker */
.weekdays-picker{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  align-items:center;
}
.weekday-btn{
  padding:8px 12px;
  min-width:44px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  font-size:12px;font-weight:700;
  cursor:pointer;transition:var(--ease);
}
.weekday-btn:hover{border-color:color-mix(in srgb,var(--primary) 50%,var(--line))}
.weekday-btn.active{
  background:var(--primary);color:#fff;border-color:var(--primary);
  box-shadow:0 2px 6px color-mix(in srgb,var(--primary) 25%,transparent);
}
.weekday-quick{
  padding:6px 10px;margin-left:6px;
  background:transparent;border:1px dashed var(--line);
  color:var(--muted);font-size:11px;font-weight:700;
  border-radius:8px;cursor:pointer;text-transform:uppercase;letter-spacing:.04em;
}
.weekday-quick:hover{border-color:var(--primary);color:var(--primary)}

/* Детали с плейсхолдерами */
.placeholders-details{
  margin-top:8px;
  padding:0;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface-2);
  overflow:hidden;
}
.placeholders-details summary{
  padding:10px 14px;
  cursor:pointer;
  font-size:12px;font-weight:700;
  color:var(--muted);
  user-select:none;
  list-style:none;
}
.placeholders-details summary::-webkit-details-marker{display:none}
.placeholders-details summary:hover{color:var(--primary);background:var(--surface)}
.placeholders-details[open] summary{
  border-bottom:1px solid var(--line);
  background:var(--surface);
}
.placeholders-table{display:flex;flex-direction:column}
.ph-row{
  display:grid;grid-template-columns:160px 1fr 1fr;
  gap:12px;
  padding:8px 14px;
  font-size:12px;
  line-height:1.45;
  border-bottom:1px solid var(--line);
  align-items:start;
}
.ph-row:last-child{border-bottom:none}
.ph-row.ph-head{
  background:var(--bg);
  font-size:10px;font-weight:800;
  text-transform:uppercase;letter-spacing:.06em;color:var(--muted);
}
.ph-row code{
  font-family:'JetBrains Mono','SF Mono',monospace;
  background:var(--bg);
  padding:2px 7px;
  border-radius:5px;
  font-size:11.5px;
  color:var(--primary);
  border:1px solid var(--line);
  display:inline-block;
}
.placeholders-hint{
  padding:10px 14px;
  font-size:12px;
  color:var(--muted);
  border-top:1px dashed var(--line);
  line-height:1.55;
}
.placeholders-hint code{font-size:11px}

@media (max-width:700px){
  .ph-row{grid-template-columns:1fr}
  .ph-row > div:first-child{font-weight:700}
}

/* Сетка 2 колонки для секций Настроек */
.settings-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:14px;
}
.settings-grid .settings-section{margin-bottom:0}
.settings-grid-full{grid-column:1 / -1}
@media (max-width:1100px){
  .settings-grid{grid-template-columns:1fr}
}

/* Роли и права */
.roles-admin-grid{display:flex;flex-direction:column;gap:10px}
.role-admin-row{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  padding:14px 16px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  transition:var(--ease);
}
.role-admin-row:hover{border-color:color-mix(in srgb,var(--primary) 40%,var(--line))}
.role-admin-badge{
  display:inline-flex;
  align-items:center;justify-content:center;
  width:42px;height:42px;
  border-radius:10px;
  background:var(--primary);color:#fff;
  font-size:18px;font-weight:800;
}
.role-admin-badge.system{background:var(--surface)}
.role-admin-info{min-width:0}
.role-admin-name{font-weight:700;font-size:14px;display:flex;align-items:center;gap:8px}
.role-admin-sys{
  font-size:9px;padding:2px 6px;border-radius:4px;
  background:var(--primary);color:#fff;font-weight:800;
  text-transform:uppercase;letter-spacing:.05em;
}
.role-admin-desc{font-size:12px;color:var(--muted);margin-top:3px;line-height:1.4}
.role-admin-meta{font-size:11px;color:var(--muted);margin-top:4px}
.role-admin-meta strong{color:var(--text);font-weight:700}
.role-admin-actions{display:flex;gap:4px;flex-shrink:0}

/* Матрица прав в модалке роли */
.perm-matrix{
  display:flex;flex-direction:column;gap:6px;
  max-height:420px;overflow-y:auto;
  padding:4px;
  border:1px solid var(--line);border-radius:10px;background:var(--surface-2);
}
.perm-row{
  display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;
  padding:10px 12px;
  background:var(--surface);
  border:1px solid var(--line);border-radius:8px;
}
.perm-row-label{font-size:13px;font-weight:700}
.perm-row-label small{display:block;font-size:11px;font-weight:500;color:var(--muted);margin-top:2px;line-height:1.3}
.perm-level{display:flex;gap:4px}
.perm-level-btn{
  padding:5px 10px;
  border-radius:6px;
  border:1px solid var(--line);
  background:var(--surface-2);
  font-size:11px;font-weight:700;
  color:var(--muted);
  cursor:pointer;transition:var(--ease);
  text-transform:uppercase;letter-spacing:.04em;
}
.perm-level-btn:hover{border-color:var(--primary);color:var(--primary)}
.perm-level-btn.active[data-level="full"]{background:#23a56f;border-color:#23a56f;color:#fff}
.perm-level-btn.active[data-level="view"]{background:var(--primary);border-color:var(--primary);color:#fff}
.perm-level-btn.active[data-level="deny"]{background:#d64a4a;border-color:#d64a4a;color:#fff}

.perm-section-title{
  font-size:10px;text-transform:uppercase;letter-spacing:.08em;
  font-weight:800;color:var(--muted);
  padding:8px 12px 4px;
}

.perm-toggle{
  display:flex;align-items:center;gap:10px;
}
.perm-check{
  width:20px;height:20px;accent-color:var(--primary);cursor:pointer;
}

/* ============================================================ */
/* AUDIT LOG UI                                                 */
/* ============================================================ */
.audit-filters{
  display:grid;
  grid-template-columns:repeat(5, 1fr) auto;
  gap:10px;
  align-items:end;
  margin-bottom:14px;
  padding-bottom:14px;
  border-bottom:1px solid var(--line);
}
.audit-filter-field{margin:0}
.audit-filter-field > span{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;margin-bottom:4px}
@media (max-width:1200px){ .audit-filters{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){  .audit-filters{grid-template-columns:1fr} }

.audit-summary{
  padding:10px 14px;
  background:var(--surface-2);
  border-radius:10px;
  margin-bottom:12px;
  font-size:13px;
}
.audit-summary-row strong{color:var(--text);font-weight:800;margin:0 4px}

.audit-list{display:flex;flex-direction:column;gap:4px;max-height:600px;overflow-y:auto}
.audit-list-head{
  display:grid;grid-template-columns:140px 230px 130px 1fr 110px;gap:12px;
  padding:10px 14px;
  background:var(--surface-2);
  border-radius:8px;
  font-size:10px;font-weight:800;letter-spacing:.06em;
  color:var(--muted);
  position:sticky;top:0;z-index:1;
}
.audit-row{
  display:grid;grid-template-columns:140px 230px 130px 1fr 110px;gap:12px;
  padding:10px 14px;
  border-bottom:1px solid var(--line);
  font-size:12.5px;
  align-items:center;
  transition:background .15s;
}
.audit-row:hover{background:var(--surface-2)}
.audit-row-time{color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:11.5px;white-space:nowrap}
.audit-row-action{font-weight:600}
.audit-row-user{font-weight:600;color:var(--primary)}
.audit-row-details{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.audit-row-ip{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--muted);opacity:.7}

@media (max-width:900px){
  .audit-list-head{display:none}
  .audit-row{
    grid-template-columns:1fr;gap:4px;
    background:var(--surface-2);border-radius:10px;border-bottom:none;margin-bottom:6px;padding:12px;
  }
  .audit-row-time::before{content:'⏱ '; opacity:.5}
  .audit-row-action{font-size:14px;font-weight:700;color:var(--text)}
  .audit-row-user::before{content:'👤 '; opacity:.5}
  .audit-row-ip{display:none}
}

/* ============================================================ */
/* МЕНЮ С ГРУППАМИ (v15.20)                                     */
/* ============================================================ */
.nav-grouped{gap:2px}

.nav-group{
  border-radius:12px;
  margin-top:2px;
  transition:background .2s;
}
.nav-group[open]{
  background:color-mix(in srgb, var(--surface) 50%, transparent);
}

.nav-group-head{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  cursor:pointer;
  user-select:none;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  border-radius:10px;
  list-style:none;
  transition:var(--ease);
}
.nav-group-head::-webkit-details-marker{display:none}
.nav-group-head:hover{color:var(--text);background:var(--surface)}
.nav-group-head .nav-ico{
  font-size:13px;
  opacity:.7;
}

.nav-group-arrow{
  margin-left:auto;
  font-size:10px;
  opacity:.5;
  transition:transform .2s ease;
}
.nav-group[open] .nav-group-arrow{transform:rotate(180deg)}

.nav-group-body{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:2px 0 6px 8px;
}
.nav-group-body .nav-item{
  padding:9px 12px;
  font-size:13px;
  border-radius:10px;
}

/* Мобильный адаптив — группы сворачиваются в горизонтальный скролл */
@media (max-width:900px){
  .nav-grouped{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    gap:6px;
    overflow-x:auto;
    padding-bottom:4px;
  }
  .nav-grouped > .nav-item,
  .nav-grouped > .nav-group{
    flex-shrink:0;
  }
  .nav-group{
    padding:0;
    background:var(--surface);
    border:1px solid var(--line);
  }
  .nav-group-head{
    padding:8px 12px;
    font-size:10px;
  }
  .nav-group-body{
    position:absolute;
    top:100%;left:0;
    background:var(--bg);
    border:1px solid var(--line);
    border-radius:12px;
    padding:6px;
    min-width:180px;
    box-shadow:0 12px 24px rgba(0,0,0,.12);
    z-index:100;
  }
  .nav-group{position:relative}
  .nav-group:not([open]) .nav-group-body{display:none}
}

/* ============================================================ */
/* МЕНЮ В СТИЛЕ LINEAR/NOTION (v15.21)                          */
/* ============================================================ */

.nav-modern{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:2px 0;
}

.nav-section{
  display:flex;
  flex-direction:column;
  gap:1px;
}

.nav-section-title{
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--muted);
  padding:4px 14px 6px;
  opacity:.7;
  user-select:none;
}

.nav-modern .nav-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:8px;
  border:1px solid transparent;
  background:transparent;
  color:var(--text);
  font-size:13.5px;
  font-weight:500;
  cursor:pointer;
  transition:background .15s ease, color .15s ease;
  text-align:left;
  width:100%;
  position:relative;
}
.nav-modern .nav-item:hover{
  background:color-mix(in srgb, var(--surface) 70%, transparent);
  transform:none;
}
.nav-modern .nav-item.active{
  background:color-mix(in srgb, var(--primary) 12%, transparent);
  color:var(--primary);
  box-shadow:none;
  font-weight:600;
}
.nav-modern .nav-item.active::before{
  content:'';
  position:absolute;
  left:-2px;
  top:50%;
  transform:translateY(-50%);
  width:3px;
  height:18px;
  background:var(--primary);
  border-radius:0 3px 3px 0;
}

.nav-modern .nav-ico{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;height:20px;
  font-size:13px;
  color:var(--muted);
  flex-shrink:0;
  transition:color .15s ease;
}
.nav-modern .nav-item:hover .nav-ico{color:var(--text)}
.nav-modern .nav-item.active .nav-ico{color:var(--primary)}

.nav-modern .nav-label{
  flex:1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* AI-пункт: выделен градиентом */
.nav-item-ai{
  background:linear-gradient(135deg,
    color-mix(in srgb, #8b5cf6 8%, transparent),
    color-mix(in srgb, var(--primary) 8%, transparent)) !important;
  border:1px solid color-mix(in srgb, #8b5cf6 20%, transparent) !important;
}
.nav-item-ai:hover{
  background:linear-gradient(135deg,
    color-mix(in srgb, #8b5cf6 15%, transparent),
    color-mix(in srgb, var(--primary) 15%, transparent)) !important;
  border-color:color-mix(in srgb, #8b5cf6 40%, transparent) !important;
}
.nav-item-ai.active{
  background:linear-gradient(135deg, #8b5cf6, var(--primary)) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.nav-item-ai.active .nav-ico{color:#fff !important}
.nav-item-ai .nav-ico{
  color:#8b5cf6 !important;
  font-size:15px;
}

.nav-badge{
  font-size:9px;
  font-weight:800;
  padding:1px 6px;
  border-radius:999px;
  background:color-mix(in srgb, #8b5cf6 20%, transparent);
  color:#8b5cf6;
  text-transform:uppercase;
  letter-spacing:.05em;
  flex-shrink:0;
}
.nav-item-ai.active .nav-badge{
  background:rgba(255,255,255,.2);
  color:#fff;
}

/* Мобильный: горизонтальная прокрутка секций */
@media (max-width:900px){
  .nav-modern{
    flex-direction:row;
    overflow-x:auto;
    gap:0;
    padding-bottom:4px;
    scrollbar-width:none;
  }
  .nav-modern::-webkit-scrollbar{display:none}
  .nav-section{
    flex-direction:row;
    gap:4px;
    flex-shrink:0;
    padding-right:12px;
    border-right:1px solid var(--line);
    margin-right:4px;
  }
  .nav-section:last-child{border-right:none}
  .nav-section-title{display:none}
  .nav-modern .nav-item{
    padding:6px 10px;
    white-space:nowrap;
  }
  .nav-modern .nav-item.active::before{display:none}
  .nav-badge{display:none}
}

/* ============================================================ */
/* МЕНЮ НАВИГАЦИИ — современное (v15.21)                        */
/* ============================================================ */
.nav-modern{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.nav-section{
  display:flex;
  flex-direction:column;
  gap:1px;
  padding-top:8px;
}
.nav-section:first-child{padding-top:0}

.nav-section-title{
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--muted);
  padding:6px 14px 4px;
  opacity:.7;
}

.nav-modern .nav-item{
  display:flex;
  align-items:center;
  gap:11px;
  padding:9px 12px;
  border-radius:10px;
  font-size:13.5px;
  font-weight:500;
  color:var(--text);
  background:transparent;
  border:1px solid transparent;
  cursor:pointer;
  text-align:left;
  transition:background .12s ease, color .12s ease, transform .12s ease;
  width:100%;
  position:relative;
}
.nav-modern .nav-item:hover{
  background:var(--surface);
  color:var(--primary);
}
.nav-modern .nav-item.active{
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  font-weight:600;
  box-shadow:0 6px 16px color-mix(in srgb, var(--primary) 25%, transparent);
  transform:none;
}
.nav-modern .nav-item.active .nav-ico{color:#fff}
.nav-modern .nav-ico{
  font-size:14px;
  width:20px;
  text-align:center;
  color:var(--muted);
  flex-shrink:0;
  transition:color .12s ease;
}
.nav-modern .nav-item:hover .nav-ico{color:var(--primary)}
.nav-modern .nav-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* AI-помощник — выделенная кнопка */
.nav-item-ai{
  background:linear-gradient(135deg, color-mix(in srgb, #a855f7 10%, transparent), color-mix(in srgb, #ec4899 8%, transparent)) !important;
  border:1px solid color-mix(in srgb, #a855f7 25%, var(--line)) !important;
}
.nav-item-ai:hover{
  background:linear-gradient(135deg, color-mix(in srgb, #a855f7 18%, transparent), color-mix(in srgb, #ec4899 14%, transparent)) !important;
  color:var(--text) !important;
}
.nav-item-ai.active{
  background:linear-gradient(135deg, #a855f7, #ec4899) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.nav-item-ai .nav-ico{color:#a855f7 !important;font-size:16px}
.nav-item-ai.active .nav-ico{color:#fff !important}

.nav-badge{
  font-size:9px;
  padding:2px 6px;
  border-radius:4px;
  background:color-mix(in srgb, #a855f7 15%, transparent);
  color:#a855f7;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-left:auto;
  flex-shrink:0;
}
.nav-item-ai.active .nav-badge{
  background:rgba(255,255,255,.25);
  color:#fff;
}

/* Адаптив: на мобильных — горизонтальные табы */
@media (max-width:900px){
  .nav-modern{
    flex-direction:row;
    overflow-x:auto;
    gap:4px;
    padding-bottom:4px;
  }
  .nav-modern::-webkit-scrollbar{height:0}
  .nav-section{
    flex-direction:row;
    padding-top:0;
    flex-shrink:0;
    gap:4px;
  }
  .nav-section-title{display:none}
  .nav-modern .nav-item{
    padding:8px 12px;
    white-space:nowrap;
    width:auto;
  }
}

/* ============================================================ */
/* МЕНЮ v15.21 — современный дизайн Linear/Notion style          */
/* ============================================================ */
.nav-modern{
  display:flex;
  flex-direction:column;
  gap:0;
}
.nav-section{
  display:flex;
  flex-direction:column;
  gap:1px;
  padding:6px 0;
  border-bottom:1px solid color-mix(in srgb, var(--line) 40%, transparent);
}
.nav-section:last-child{border-bottom:none}
.nav-section:first-child{padding-top:0}

.nav-section-title{
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--muted);
  padding:8px 14px 4px;
  opacity:.7;
}

.nav-modern .nav-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 14px;
  border-radius:10px;
  border:1px solid transparent;
  background:transparent;
  color:var(--text);
  cursor:pointer;
  font-size:13.5px;
  font-weight:600;
  transition:all .15s ease;
  text-align:left;
  position:relative;
}
.nav-modern .nav-item:hover{
  background:var(--surface);
  transform:none;
}
.nav-modern .nav-item.active{
  background:linear-gradient(135deg, var(--primary), var(--primary-2));
  color:#fff;
  box-shadow:0 6px 16px color-mix(in srgb, var(--primary) 25%, transparent);
}
.nav-modern .nav-ico{
  width:18px;
  min-width:18px;
  text-align:center;
  font-size:13px;
  opacity:.75;
}
.nav-modern .nav-item.active .nav-ico{opacity:1}
.nav-modern .nav-label{
  flex:1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* AI-помощник — особый стиль с градиентом */
.nav-item-ai{
  background:linear-gradient(135deg,
    color-mix(in srgb, #a855f7 12%, transparent),
    color-mix(in srgb, #6366f1 10%, transparent)) !important;
  border:1px solid color-mix(in srgb, #a855f7 30%, transparent) !important;
  color:#a855f7 !important;
  font-weight:700 !important;
}
.nav-item-ai:hover{
  background:linear-gradient(135deg,
    color-mix(in srgb, #a855f7 20%, transparent),
    color-mix(in srgb, #6366f1 16%, transparent)) !important;
  border-color:color-mix(in srgb, #a855f7 50%, transparent) !important;
}
.nav-item-ai.active{
  background:linear-gradient(135deg, #a855f7, #6366f1) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 8px 20px color-mix(in srgb, #a855f7 30%, transparent) !important;
}
.nav-item-ai .nav-ico{color:inherit;opacity:1}

.nav-badge{
  margin-left:auto;
  padding:2px 7px;
  border-radius:6px;
  background:color-mix(in srgb, currentColor 20%, transparent);
  font-size:9px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}

/* Мобильный адаптив */
@media (max-width:900px){
  .nav-modern{
    flex-direction:row;
    overflow-x:auto;
    padding-bottom:4px;
    gap:6px;
  }
  .nav-section{
    flex-direction:row;
    padding:0;
    border:none;
    flex-shrink:0;
    gap:4px;
  }
  .nav-section-title{display:none}
  .nav-modern .nav-item{
    padding:8px 12px;
    font-size:12px;
    white-space:nowrap;
  }
}


/* ============================================================ */
/* AI-ПОМОЩНИК — чат (v15.23, переделано)                       */
/* ============================================================ */

/* Основной контейнер страницы AI — расширяется на всю высоту */
#page-ai.active{
  display:flex;
  flex-direction:column;
  height:calc(100dvh - 130px);
  min-height:480px;
}
#page-ai.active > .section-top{flex-shrink:0}

/* AI-страница — на полный экран по высоте */
#page-ai.active{
  display:flex !important;
  flex-direction:column;
  height:calc(100dvh - 80px);
  padding:0 !important;
  overflow:hidden;
}
.ai-page{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  padding:14px 18px 0;
  gap:12px;
}
.ai-page-head{
  flex-shrink:0;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.ai-page-head h1{margin:2px 0;font-size:22px}
.ai-page-subtitle{
  font-size:12.5px;
  color:var(--muted);
  margin:0;
  line-height:1.4;
}

.ai-chat-box{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
}

.ai-chat-messages{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  padding:20px 24px;
  display:flex;
  flex-direction:column;
  gap:14px;
  scroll-behavior:smooth;
}
.ai-chat-messages::-webkit-scrollbar{width:6px}
.ai-chat-messages::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.ai-chat-messages::-webkit-scrollbar-thumb:hover{background:var(--muted)}

.ai-message{
  display:flex;
  gap:10px;
  max-width:85%;
  animation:ai-msg-in .25s ease;
}
@keyframes ai-msg-in{
  from{opacity:0;transform:translateY(6px)}
  to{opacity:1;transform:translateY(0)}
}
.ai-message-user{align-self:flex-end;flex-direction:row-reverse}

.ai-avatar{
  flex-shrink:0;
  width:32px;height:32px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;font-weight:700;
}
.ai-message-assistant .ai-avatar{
  background:linear-gradient(135deg,#a855f7,#ec4899);
  color:#fff;
}
.ai-message-user .ai-avatar{
  background:var(--surface-2);
  border:1px solid var(--line);
}

.ai-bubble{
  padding:10px 14px;
  border-radius:14px;
  font-size:13.5px;
  line-height:1.55;
  min-width:0;
  word-wrap:break-word;
  overflow-wrap:break-word;
}
.ai-message-assistant .ai-bubble{
  background:var(--surface-2);
  border:1px solid var(--line);
  color:var(--text);
  border-top-left-radius:4px;
}
.ai-message-user .ai-bubble{
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  border-top-right-radius:4px;
}
.ai-bubble strong{font-weight:700}
.ai-bubble em{font-style:italic}
.ai-bubble code{
  background:var(--bg);
  padding:1px 6px;
  border-radius:4px;
  font-size:12px;
  font-family:'JetBrains Mono',monospace;
}
.ai-message-user .ai-bubble code{background:rgba(255,255,255,.2);color:#fff}

.ai-welcome .ai-bubble{
  background:linear-gradient(135deg,color-mix(in srgb,#a855f7 5%,var(--surface-2)),var(--surface-2));
  border-color:color-mix(in srgb,#a855f7 15%,var(--line));
}

/* "Думает..." индикатор */
.ai-dot-pulse{
  display:inline-flex;gap:3px;
  margin-right:8px;vertical-align:middle;
}
.ai-dot-pulse span{
  width:6px;height:6px;
  background:#a855f7;
  border-radius:50%;
  animation:ai-pulse 1.2s ease-in-out infinite;
}
.ai-dot-pulse span:nth-child(2){animation-delay:.2s}
.ai-dot-pulse span:nth-child(3){animation-delay:.4s}
@keyframes ai-pulse{
  0%,80%,100%{opacity:.25;transform:scale(.85)}
  40%{opacity:1;transform:scale(1)}
}

/* Input — фиксированный снизу контейнера */
.ai-chat-footer{
  flex-shrink:0;
  border-top:1px solid var(--line);
  padding:14px 20px 16px;
  background:var(--surface);
  display:flex;
  flex-direction:column;
  gap:10px;
}
.ai-suggestions{
  display:flex;gap:6px;flex-wrap:wrap;
}
.ai-suggestion{
  padding:6px 12px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--text);
  font-size:11.5px;font-weight:500;
  cursor:pointer;
  transition:all .15s ease;
  white-space:nowrap;
}
.ai-suggestion:hover{
  border-color:#a855f7;
  color:#a855f7;
  background:color-mix(in srgb,#a855f7 8%,var(--surface-2));
}
.ai-chat-input-row{
  display:flex;gap:10px;align-items:flex-end;
}
.ai-chat-input{
  flex:1;
  min-width:0;
  padding:10px 14px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--bg);
  color:var(--text);
  font-size:14px;
  line-height:1.5;
  resize:none;
  font-family:inherit;
  max-height:120px;
  transition:border-color .15s;
}
.ai-chat-input:focus{
  outline:none;
  border-color:#a855f7;
  box-shadow:0 0 0 3px color-mix(in srgb,#a855f7 15%,transparent);
}
.ai-chat-send{
  padding:10px 18px;
  background:linear-gradient(135deg,#a855f7,#ec4899) !important;
  border:none !important;
  color:#fff !important;
  font-weight:600;
  min-width:100px;
  flex-shrink:0;
}
.ai-chat-send:hover{filter:brightness(1.08)}
.ai-chat-send:disabled{opacity:.6;cursor:wait}
.ai-chat-hint{
  font-size:11px;
  text-align:center;
  margin:0;
}

/* Адаптив для мобильных */
@media (max-width:700px){
  .ai-chat-box{
    border-radius:12px;
  }
  .ai-chat-messages{padding:14px}
  .ai-chat-footer{padding:10px 12px 14px}
  .ai-message{max-width:95%}
  .ai-suggestions{
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:2px;
    scrollbar-width:none;
  }
  .ai-suggestions::-webkit-scrollbar{display:none}
  .ai-chat-send{min-width:80px;padding:10px 14px;font-size:13px}
}

/* ============================================================ */
/* ЦЕЛИ (GOALS) v15.23                                          */
/* ============================================================ */
.goals-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
  gap:14px;
}
@media (max-width:700px){ .goals-grid{grid-template-columns:1fr} }

.section-subheading{
  font-size:11px;font-weight:800;
  text-transform:uppercase;letter-spacing:.08em;
  color:var(--muted);
  margin-bottom:10px;padding-left:2px;
}

.goal-card{
  padding:18px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:16px;
  display:flex;flex-direction:column;gap:14px;
  position:relative;
  transition:border-color .15s, transform .15s;
}
.goal-card:hover{transform:translateY(-1px)}
.goal-good{border-color:color-mix(in srgb,#23a56f 40%,var(--line))}
.goal-warn{border-color:color-mix(in srgb,#ef8b2d 40%,var(--line))}
.goal-bad{border-color:color-mix(in srgb,#d64a4a 50%,var(--line))}
.goal-neutral{border-color:var(--line)}

.goal-head{
  display:flex;align-items:flex-start;gap:12px;
}
.goal-ico{
  font-size:22px;flex-shrink:0;
  width:40px;height:40px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface-2);
  border-radius:10px;
}
.goal-meta{flex:1;min-width:0}
.goal-name{
  font-weight:700;font-size:14px;line-height:1.3;
  color:var(--text);
}
.goal-type{
  font-size:11.5px;color:var(--muted);margin-top:2px;
}

.goal-numbers{
  display:flex;align-items:baseline;gap:8px;
  font-family:'JetBrains Mono',monospace;
}
.goal-actual{font-size:20px;font-weight:800;color:var(--text)}
.goal-separator{font-size:11px;color:var(--muted)}
.goal-target{font-size:14px;color:var(--muted);font-weight:600}

.goal-progress{
  display:flex;align-items:center;gap:10px;
}
.goal-progress-bar{
  flex:1;
  height:8px;
  background:var(--surface-2);
  border-radius:4px;
  overflow:hidden;
  position:relative;
}
.goal-progress-fill{
  height:100%;
  background:linear-gradient(90deg, var(--primary), var(--primary-2));
  border-radius:4px;
  transition:width .35s ease;
}
.goal-good .goal-progress-fill{background:linear-gradient(90deg, #1b9c68, #23a56f)}
.goal-warn .goal-progress-fill{background:linear-gradient(90deg, #ef8b2d, #f3a656)}
.goal-bad  .goal-progress-fill{background:linear-gradient(90deg, #d64a4a, #e97171)}
.goal-progress-label{
  font-size:12px;font-weight:700;
  color:var(--text);
  min-width:38px;text-align:right;
  font-family:'JetBrains Mono',monospace;
}

.goal-footer{
  display:flex;justify-content:space-between;
  font-size:11px;color:var(--muted);
  padding-top:2px;
  border-top:1px dashed var(--line);
  margin-top:2px;
  padding-top:10px;
}

/* Виджет целей на дашборде — компактный */
.dashboard-goals{margin:0 0 18px}
.dashboard-section-head{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:10px;
}
.dashboard-section-title{
  font-size:13px;font-weight:800;
  text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);
}
.btn-link{
  background:transparent;border:none;padding:4px 8px;
  color:var(--primary);cursor:pointer;font-size:12px;font-weight:600;
}
.btn-link:hover{text-decoration:underline}
.btn-sm{padding:6px 10px;font-size:12px}

.dashboard-goals-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:10px;
}
.dash-goal{
  padding:12px 14px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  display:flex;flex-direction:column;gap:8px;
}
.dash-goal.goal-good{border-color:color-mix(in srgb,#23a56f 40%,var(--line))}
.dash-goal.goal-warn{border-color:color-mix(in srgb,#ef8b2d 40%,var(--line))}
.dash-goal.goal-bad{border-color:color-mix(in srgb,#d64a4a 50%,var(--line))}
.dash-goal-head{
  display:flex;align-items:center;gap:8px;
}
.dash-goal-icon{font-size:14px}
.dash-goal-name{
  flex:1;font-weight:600;font-size:12.5px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.dash-goal-pct{
  font-size:11.5px;font-weight:700;
  font-family:'JetBrains Mono',monospace;color:var(--text);
}
.dash-goal-nums{
  display:flex;justify-content:space-between;font-size:12px;
  font-family:'JetBrains Mono',monospace;
}

/* ============================================================ */
/* AI TOOL CALLS — визуальные плашки действий AI                */
/* ============================================================ */
.ai-tool-calls{
  display:flex;flex-direction:column;gap:6px;
  margin-bottom:10px;
}
.ai-tool-call{
  display:flex;align-items:flex-start;gap:8px;
  padding:8px 12px;
  background:color-mix(in srgb, #a855f7 6%, var(--surface-2));
  border:1px solid color-mix(in srgb, #a855f7 20%, var(--line));
  border-radius:8px;
  font-size:12.5px;
  color:var(--text);
}
.ai-tool-call-ok{
  border-left:3px solid #23a56f;
}
.ai-tool-call-error{
  background:color-mix(in srgb, #d64a4a 6%, var(--surface-2));
  border-color:color-mix(in srgb, #d64a4a 25%, var(--line));
  border-left:3px solid #d64a4a;
}
.ai-tool-icon{font-size:14px;flex-shrink:0}
.ai-tool-label{
  flex:1;line-height:1.4;
  font-weight:500;
}
.ai-tool-call-err{
  width:100%;margin-top:4px;
  font-size:11px;color:#d64a4a;
  font-family:'JetBrains Mono',monospace;
}

/* ============================================================ */
/* DEEPSEEK PROMO БЛОК (v15.24)                                 */
/* ============================================================ */
.ai-deepseek-promo{
  display:flex;
  gap:14px;
  padding:18px 20px;
  margin:14px 0 18px;
  background:linear-gradient(135deg,
    color-mix(in srgb, #4d6bfe 6%, var(--surface)),
    color-mix(in srgb, #ec4899 4%, var(--surface)));
  border:1px solid color-mix(in srgb, #4d6bfe 25%, var(--line));
  border-radius:14px;
  position:relative;
  overflow:hidden;
}
.ai-deepseek-promo::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg, #4d6bfe, #ec4899);
}
.ai-deepseek-promo-icon{
  font-size:32px;
  flex-shrink:0;
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  background:#fff;
  border-radius:12px;
  box-shadow:0 4px 12px color-mix(in srgb, #4d6bfe 20%, transparent);
}
.ai-deepseek-promo-body{
  flex:1;min-width:0;
}
.ai-deepseek-promo-title{
  font-size:14px;font-weight:600;
  color:var(--text);
  margin-bottom:6px;
  line-height:1.4;
}
.ai-deepseek-promo-title strong{
  color:#4d6bfe;
  font-weight:800;
}
.ai-deepseek-promo-hint{
  font-size:12.5px;
  color:var(--muted);
  line-height:1.5;
  margin-bottom:12px;
}
.ai-deepseek-steps{
  margin:0;padding-left:22px;
  display:flex;flex-direction:column;gap:6px;
  font-size:13px;
  color:var(--text);
}
.ai-deepseek-steps li{
  line-height:1.5;
}
.ai-deepseek-steps a{
  color:#4d6bfe;
  font-weight:600;
  text-decoration:none;
}
.ai-deepseek-steps a:hover{text-decoration:underline}
.ai-deepseek-steps code{
  background:var(--bg);
  padding:1px 6px;
  border-radius:4px;
  font-size:11.5px;
  color:#4d6bfe;
  font-family:'JetBrains Mono', monospace;
  border:1px solid var(--line);
}

@media (max-width:600px){
  .ai-deepseek-promo{flex-direction:column;padding:14px}
  .ai-deepseek-promo-icon{width:40px;height:40px;font-size:24px}
}

/* ============================================================ */
/* МОБИЛЬНАЯ ВЕРСТКА — режим приложения (v15.25)                */
/* ============================================================ */

@media (max-width:900px){
  :root{
    --bottom-nav-height:64px;
    --safe-bottom:env(safe-area-inset-bottom, 0px);
    --safe-top:env(safe-area-inset-top, 0px);
  }

  /* Базовая структура: убираем сайдбар, делаем сплошной экран */
  body{
    overflow-x:hidden;
    overflow-y:auto;
    -webkit-tap-highlight-color:transparent;
  }

  .app-shell{
    grid-template-columns:1fr !important;
    grid-template-rows:auto 1fr;
    min-height:100dvh;
    padding:0;
    gap:0;
  }

  /* Полностью прячем сайдбар на мобиле, заменим на bottom nav */
  .rail{
    display:none !important;
  }

  /* Главная область */
  main{
    padding:0;
    margin:0;
    padding-bottom:calc(var(--bottom-nav-height) + var(--safe-bottom) + 16px);
    background:var(--bg);
  }

  /* Sticky шапка с брендом и быстрыми кнопками */
  .masthead{
    position:sticky;
    top:0;
    z-index:50;
    background:var(--surface);
    border-bottom:1px solid var(--line);
    padding:calc(8px + var(--safe-top)) 14px 8px;
    margin:0;
    border-radius:0;
    box-shadow:0 1px 3px rgba(0,0,0,.04);
    display:flex;
    flex-direction:row !important;
    align-items:center;
    gap:8px;
    flex-wrap:nowrap;
    min-height:auto;
  }
  .masthead-title{
    flex:1;min-width:0;
  }
  .masthead-title h1,
  .masthead-title .h1{
    font-size:16px !important;
    margin:0;
    line-height:1.2;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .masthead-title .eyebrow{display:none}
  .masthead-title p{display:none}
  .masthead-right{
    display:flex;
    gap:6px;
    align-items:center;
  }
  .masthead-right .btn{
    padding:8px 12px;
    font-size:12px;
    min-height:36px;
  }
  .masthead-right .btn-secondary span:not(:first-child),
  .masthead-right .file-btn span:not(:first-child){
    display:none;
  }
  .masthead-right .file-btn,
  .masthead-right > .btn{
    width:36px;
    height:36px;
    padding:0;
    justify-content:center;
    border-radius:10px;
  }

  /* Контент страниц */
  .page{
    padding:14px;
  }
  .section-top{
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
    margin-bottom:14px;
  }
  .section-top h1{font-size:22px}
  .section-top p{font-size:13px}

  /* Карточки и surface */
  .surface{
    padding:14px !important;
    border-radius:14px;
    margin-bottom:12px;
  }
  .surface-head{
    flex-wrap:wrap;
    gap:8px;
  }
  .surface-title{font-size:14px}
  .surface-subtitle{font-size:11.5px}

  /* Дашборд: пульс-карточки 2 на строку, не 4 */
  .pulse-grid{
    grid-template-columns:1fr 1fr !important;
    gap:8px;
  }
  .pulse-card{padding:14px 12px}
  .pulse-value{font-size:18px}
  .pulse-label{font-size:10.5px}
  .pulse-hint{font-size:10.5px}

  /* Сигналы дашборда */
  .signal-bar{
    padding:12px;
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }
  .signal-bar-icon{font-size:24px}
  .signal-bar-text{font-size:13px}
  .signal-bar-detail{font-size:11.5px}

  /* Виджет целей дашборда */
  .dashboard-goals-grid{
    grid-template-columns:1fr !important;
  }

  /* Графики и таблицы дашборда: одна колонка */
  .dashboard-layout,
  .dashboard-row,
  .dashboard-grid-2{
    grid-template-columns:1fr !important;
    gap:12px;
  }

  /* ============================================================ */
  /* BOTTOM NAVIGATION BAR — главная фишка мобильной версии       */
  /* ============================================================ */
  .mobile-bottom-nav{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    z-index:100;
    background:var(--surface);
    border-top:1px solid var(--line);
    padding:6px 4px calc(6px + var(--safe-bottom));
    display:flex !important;
    justify-content:space-around;
    align-items:stretch;
    box-shadow:0 -4px 12px rgba(0,0,0,.06);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
  .mobile-bottom-nav-item{
    flex:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    padding:8px 4px;
    background:transparent;
    border:none;
    color:var(--muted);
    font-size:10px;
    font-weight:600;
    cursor:pointer;
    transition:color .15s;
    border-radius:8px;
    text-decoration:none;
    min-height:48px;
  }
  .mobile-bottom-nav-item:hover{color:var(--text)}
  .mobile-bottom-nav-item.active{color:var(--primary)}
  .mobile-bottom-nav-item.active .mbn-icon{
    transform:scale(1.1);
  }
  .mbn-icon{
    font-size:20px;
    line-height:1;
    transition:transform .2s ease;
  }
  .mbn-label{
    line-height:1;
    text-align:center;
    white-space:nowrap;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* "Ещё" кнопка с выпадающим меню */
  .mbn-more-sheet{
    display:block !important;
    position:fixed;
    bottom:calc(var(--bottom-nav-height) + var(--safe-bottom));
    left:0;
    right:0;
    z-index:99;
    background:var(--surface);
    border-top:1px solid var(--line);
    border-radius:18px 18px 0 0;
    padding:16px;
    transform:translateY(110%);
    transition:transform .3s ease;
    box-shadow:0 -8px 24px rgba(0,0,0,.12);
    max-height:60vh;
    overflow-y:auto;
  }
  .mbn-more-sheet.open{transform:translateY(0)}
  .mbn-more-sheet-handle{
    width:40px;height:4px;
    background:var(--line);
    border-radius:2px;
    margin:-4px auto 12px;
  }
  .mbn-more-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .mbn-more-item{
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px;
    background:var(--surface-2);
    border:1px solid var(--line);
    border-radius:12px;
    color:var(--text);
    font-size:14px;
    font-weight:600;
    cursor:pointer;
  }
  .mbn-more-item:hover{background:var(--bg)}
  .mbn-more-icon{font-size:20px}
  .mbn-overlay{
    display:block !important;
    position:fixed;inset:0;z-index:98;
    background:rgba(0,0,0,.4);
    opacity:0;pointer-events:none;
    transition:opacity .25s;
  }
  .mbn-overlay.open{opacity:1;pointer-events:auto}

  /* FAB кнопка "+" для быстрого создания операции */
  .mobile-fab{
    display:flex !important;
    position:fixed;
    bottom:calc(var(--bottom-nav-height) + var(--safe-bottom) + 16px);
    right:16px;
    z-index:90;
    width:56px;
    height:56px;
    border-radius:50%;
    background:linear-gradient(135deg,var(--primary),var(--primary-2));
    color:#fff;
    border:none;
    font-size:28px;
    font-weight:300;
    line-height:1;
    cursor:pointer;
    box-shadow:0 6px 20px color-mix(in srgb,var(--primary) 35%,transparent);
    align-items:center;
    justify-content:center;
    transition:transform .2s ease;
  }
  .mobile-fab:hover{transform:scale(1.05)}
  .mobile-fab:active{transform:scale(.95)}

  /* FAB меню при клике */
  .mobile-fab-menu{
    display:flex !important;
    position:fixed;
    bottom:calc(var(--bottom-nav-height) + var(--safe-bottom) + 88px);
    right:16px;
    z-index:91;
    flex-direction:column;
    gap:10px;
    opacity:0;
    transform:translateY(8px) scale(.95);
    pointer-events:none;
    transition:all .2s ease;
  }
  .mobile-fab-menu.open{
    opacity:1;
    transform:translateY(0) scale(1);
    pointer-events:auto;
  }
  .mobile-fab-menu-item{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 16px;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:24px;
    color:var(--text);
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    box-shadow:0 4px 12px rgba(0,0,0,.1);
    white-space:nowrap;
  }

  /* Модалки на весь экран */
  .modal{
    padding:0 !important;
  }
  .modal-card{
    width:100% !important;
    height:100dvh !important;
    max-width:100% !important;
    max-height:100dvh !important;
    border-radius:0 !important;
    overflow-y:auto;
    padding:calc(16px + var(--safe-top)) 16px calc(16px + var(--safe-bottom));
  }

  /* Формы и поля */
  .field input, .field select, .field textarea{
    font-size:16px !important; /* предотвращает zoom в iOS */
    padding:12px;
  }
  .form-grid-2{
    grid-template-columns:1fr !important;
  }

  /* Таблицы — переключаем в карточный вид */
  .table{
    display:block;
  }
  .table thead{display:none}
  .table tbody, .table tr{display:block}
  .table tr{
    background:var(--surface-2);
    border-radius:12px;
    margin-bottom:8px;
    padding:12px;
    border:1px solid var(--line);
  }
  .table td{
    display:flex;
    justify-content:space-between;
    padding:6px 0;
    border:none;
    font-size:13px;
    align-items:center;
    gap:10px;
  }
  .table td::before{
    content:attr(data-label);
    font-size:11px;
    color:var(--muted);
    text-transform:uppercase;
    letter-spacing:.05em;
    font-weight:700;
    flex-shrink:0;
  }
  .table td:first-child::before{content:''}
  .table td:last-child{padding-bottom:0}

  /* Календарь */
  .cal-wrap{padding:8px}
  .cal-day{font-size:11px}

  /* Селекторы и фильтры */
  .src-switch{
    flex-wrap:nowrap;
    overflow-x:auto;
    padding-bottom:4px;
    scrollbar-width:none;
  }
  .src-switch::-webkit-scrollbar{display:none}
  .src-switch button{flex-shrink:0}

  /* Тосты ниже чтобы не перекрывать bottom nav */
  .toast{
    bottom:calc(var(--bottom-nav-height) + var(--safe-bottom) + 16px) !important;
    left:16px !important;
    right:16px !important;
    max-width:none !important;
  }

  /* AI чат на мобиле */
  .ai-chat-box{
    border-radius:0;
    margin:0;
  }

  /* Скрываем sticky header на странице AI и Settings — там полный экран */
  .page#page-ai,
  .page#page-settings{
    padding-top:0;
  }
}

/* iOS специфичные правки */
@supports (-webkit-touch-callout: none){
  @media (max-width:900px){
    .mobile-bottom-nav,
    .mbn-more-sheet,
    .mobile-fab,
    .mobile-fab-menu,
    .modal-card{
      padding-bottom:calc(var(--safe-bottom) + 12px);
    }
  }
}

/* ============================================================ */
/* ГРАФИКИ ПРОГРЕССА ЦЕЛЕЙ (v15.26)                             */
/* ============================================================ */
.goal-chart{
  margin:6px 0 4px;
  padding:6px 0;
  border-top:1px dashed var(--line);
  border-bottom:1px dashed var(--line);
}
.goal-chart-svg{
  width:100%;
  height:60px;
  display:block;
}

/* На дашбордном мини-виджете цели тоже хочется маленький график */
.dash-goal .goal-chart{
  margin:4px 0 0;
  padding:4px 0 0;
  border:none;
  border-top:1px dashed var(--line);
}
.dash-goal .goal-chart-svg{
  height:40px;
}

/* ============================================================ */
/* МОБИЛЬНАЯ ВЕРСТКА — УСИЛЕНИЕ (v15.26)                        */
/* ============================================================ */
@media (max-width:900px){
  /* Главная — пульс в одну колонку при очень узком экране */
  .pulse-grid{gap:6px}

  /* Карточки целей одна на строку */
  .goals-grid{grid-template-columns:1fr !important}

  /* Графики целей чуть компактнее */
  .goal-chart-svg{height:50px}

  /* Tool-call плашки в чате компактнее */
  .ai-tool-call{
    padding:6px 10px;
    font-size:11.5px;
  }

  /* AI промо-блок — вертикально на мобиле */
  .ai-deepseek-promo{
    flex-direction:column;
    padding:14px;
    gap:10px;
  }
  .ai-deepseek-promo-icon{width:40px;height:40px;font-size:24px}
  .ai-deepseek-promo-title{font-size:13px}
  .ai-deepseek-promo-hint{font-size:12px}
  .ai-deepseek-steps{font-size:12.5px;padding-left:18px}

  /* Кнопки крупнее, тапабельнее */
  .btn{
    min-height:42px;
    padding:10px 16px;
    font-size:13.5px;
  }
  .btn-primary, .btn-secondary, .btn-danger{
    min-height:44px;
  }
  .icon-btn{
    width:38px;
    height:38px;
    font-size:18px;
  }

  /* Section заголовки крупнее на мобиле */
  .section-top{padding-bottom:8px}
  .section-top h1{font-size:20px;line-height:1.2}
  .section-top .eyebrow{font-size:10.5px}

  /* AI чат — на мобиле полный экран без полей */
  #page-ai{padding:0 !important}
  #page-ai .section-top{
    padding:14px 14px 8px;
    margin:0;
  }
  .ai-chat-box{
    margin:0;
    border-radius:0;
    border-left:none;
    border-right:none;
  }

  /* Toggle переключатели крупнее */
  .switch-toggle{
    transform:scale(1.1);
  }

  /* Filter chips/tabs — компактные, скролл */
  .src-switch-wrap{
    margin-bottom:10px;
  }
  .src-switch button{
    padding:8px 14px;
    font-size:12px;
    border-radius:10px;
  }

  /* Поиск/фильтры — в столбик */
  .filter-row, .filters-grid{
    grid-template-columns:1fr !important;
    gap:8px;
  }
  .filter-row input, .filter-row select{
    width:100%;
  }

  /* Грид настроек — одна колонка */
  .settings-grid{
    grid-template-columns:1fr !important;
    gap:10px;
  }

  /* Обращение в шапке "Здравствуйте" — компактно */
  .greeting-strip{
    padding:10px 14px;
    font-size:13px;
  }

  /* Отступы основного контента — учёт нижней нав-панели */
  .page{
    padding-bottom:16px;
  }

  /* Pulse карточки на узких экранах */
  .pulse-card{
    padding:12px 10px;
    border-radius:12px;
  }
  .pulse-value{font-size:17px;font-weight:800}
  .pulse-label{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
  .pulse-hint{font-size:10.5px;line-height:1.3}
  .pulse-trend{font-size:10px}

  /* Календарь — крупнее ячейки */
  .cal-grid{gap:2px}
  .cal-day{
    min-height:40px;
    padding:4px;
    font-size:11px;
  }

  /* Top strip "сегодня" компактный */
  .today-strip{
    padding:10px 12px;
    font-size:12px;
    overflow-x:auto;
    white-space:nowrap;
    scrollbar-width:none;
  }
  .today-strip::-webkit-scrollbar{display:none}
}

@media (max-width:480px){
  /* Совсем узкие — пульс в одну колонку */
  .pulse-grid{grid-template-columns:1fr !important}
  .pulse-value{font-size:22px}

  /* Bottom nav метки чуть мельче */
  .mbn-label{font-size:9.5px}
  .mbn-icon{font-size:18px}

  /* Modal padding меньше */
  .modal-card{padding:14px !important}
}

/* PWA standalone mode — без браузерных границ */
@media (display-mode: standalone){
  body{
    /* Когда установлено как app */
    user-select:none;
    -webkit-user-select:none;
  }
  .field input, .field textarea{
    user-select:text;
    -webkit-user-select:text;
  }
  /* Скрываем кнопки помощи "установить" если уже standalone */
  .pwa-install-prompt{display:none !important}
}

/* Дополнительные правки для masthead на мобиле */
@media (max-width:900px){
  .masthead{
    padding:8px 12px !important;
    gap:6px;
    align-items:center;
    flex-wrap:wrap;
  }
  .masthead-left{
    flex:1 1 100%;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    align-items:center;
    min-width:0;
  }
  .masthead-right{
    flex:1 1 100%;
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    justify-content:flex-end;
  }
  .period-wrap{
    flex-shrink:0;
    display:flex;align-items:center;gap:4px;
  }
  .period-chip{
    padding:6px 10px;
    font-size:13px;
    border-radius:8px;
  }
  .range-wrap{
    flex-wrap:wrap;
    gap:4px;
    width:100%;
    margin-top:4px;
  }
  .range-wrap .date-input{
    flex:1 1 130px;
    font-size:14px !important;
    padding:8px;
  }
  .range-label{display:none}
  .range-dash{display:none}
  .masthead .btn{
    min-height:36px;
    padding:6px 10px;
    font-size:12px;
  }
  .icon-btn{
    width:36px;height:36px;
    font-size:16px;
    border-radius:8px;
  }
  /* Скрыть на самых узких */
}
@media (max-width:600px){
  .masthead-right .btn:not(#btnRefresh) span,
  .masthead-right .file-btn{
    /* Превращаем кнопки в иконки если очень узко */
  }
  .masthead-right .btn{
    flex:1 1 auto;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  /* "Стереть" слишком опасная — скрыть на мобиле */
  #btnWipeAll{display:none !important}
  /* Оставляем только Excel и Экспорт компактными */
  #btnExport, #btnExportXlsx{
    padding:6px 8px;
    font-size:11px;
  }
}

/* ============================================================ */
/* СТРАНИЦА ИНСТРУКЦИЯ (v15.27)                                 */
/* ============================================================ */
.guide-section{
  margin-bottom:18px;
  padding:22px 24px !important;
}
.guide-section-title{
  font-size:18px;
  font-weight:700;
  margin:0 0 14px;
  display:flex;
  align-items:center;
  gap:8px;
}

/* Шаги быстрого старта */
.guide-steps{
  margin:0;
  padding-left:24px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.guide-steps li{
  font-size:13.5px;
  line-height:1.55;
  color:var(--text);
}
.guide-steps li strong{color:var(--primary)}

/* Карточка функции */
.guide-feature{
  padding:14px 0;
  border-bottom:1px dashed var(--line);
}
.guide-feature:last-child{border-bottom:none}
.guide-feature-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:6px;
  flex-wrap:wrap;
}
.guide-feature-icon{
  font-size:18px;
  width:32px;height:32px;
  display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb, var(--primary) 10%, var(--surface-2));
  border-radius:8px;
  flex-shrink:0;
}
.guide-feature-head h3{
  margin:0;
  font-size:15px;
  font-weight:700;
  flex:1;
  min-width:120px;
}
.guide-feature-roles{
  font-size:10.5px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--muted);
  background:var(--surface-2);
  padding:3px 8px;
  border-radius:6px;
  white-space:nowrap;
}
.guide-feature p{
  font-size:13px;
  line-height:1.55;
  margin:6px 0;
  color:var(--text);
}
.guide-feature ul{
  margin:6px 0;
  padding-left:20px;
}
.guide-feature ul li{
  font-size:12.5px;
  line-height:1.5;
  margin-bottom:3px;
}
.guide-feature-tip{
  margin-top:8px;
  padding:8px 12px;
  background:color-mix(in srgb, #ef8b2d 8%, var(--surface-2));
  border-left:3px solid #ef8b2d;
  border-radius:6px;
  font-size:12.5px;
  line-height:1.5;
  color:var(--text);
}

/* Список лайфхаков */
.guide-tips{
  margin:0;
  padding-left:20px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.guide-tips li{
  font-size:13px;
  line-height:1.55;
}
.guide-tips strong{color:var(--primary)}

/* AI-чат внутри инструкции */
.guide-ai-section{
  background:linear-gradient(135deg,
    color-mix(in srgb, #a855f7 4%, var(--surface)),
    color-mix(in srgb, #ec4899 3%, var(--surface)));
  border:1px solid color-mix(in srgb, #a855f7 20%, var(--line));
}
.guide-ai-intro{
  font-size:13px;
  color:var(--text);
  margin-bottom:14px;
  line-height:1.5;
}
.guide-ai-chat{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
}
.guide-ai-messages{
  max-height:380px;
  overflow-y:auto;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.guide-ai-messages .ai-message{max-width:90%}
.guide-ai-suggestions{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  padding:10px 16px;
  border-top:1px solid var(--line);
  background:var(--surface-2);
}
.guide-ai-input-row{
  display:flex;
  gap:8px;
  align-items:flex-end;
  padding:12px 16px;
  border-top:1px solid var(--line);
}
.guide-ai-input-row .ai-chat-input{
  flex:1;
  min-width:0;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--bg);
  color:var(--text);
  font-size:14px;
  line-height:1.5;
  resize:none;
  font-family:inherit;
  max-height:100px;
}
.guide-ai-input-row .ai-chat-send{
  padding:10px 16px;
  min-width:90px;
  flex-shrink:0;
}
.guide-ai-chat .ai-chat-hint{
  padding:0 16px 12px;
  font-size:11px;
  color:var(--muted);
  text-align:center;
}

@media (max-width:700px){
  .guide-section{padding:16px !important}
  .guide-section-title{font-size:16px}
  .guide-feature-head{gap:8px}
  .guide-feature-icon{width:28px;height:28px;font-size:15px}
  .guide-feature-head h3{font-size:14px}
  .guide-feature-roles{font-size:9.5px}
  .guide-ai-messages{max-height:300px;padding:12px}
  .guide-ai-suggestions{padding:8px 12px;overflow-x:auto;flex-wrap:nowrap}
  .guide-ai-suggestions::-webkit-scrollbar{display:none}
  .guide-ai-input-row{padding:10px 12px;flex-direction:column;gap:6px}
  .guide-ai-input-row .ai-chat-send{width:100%}
}

/* ============================================================ */
/* ТЁМНАЯ ТЕМА — финальная полировка (v15.28)                   */
/* ============================================================ */

/* Плавный переход при смене темы */
body, .surface, .nav-item, .btn, .field input, .field select, .field textarea,
.modal-card, .pulse-card, .dash-goal, .goal-card, .ai-bubble, .table tr,
.mobile-bottom-nav, .mbn-more-sheet{
  transition:background-color .25s ease, border-color .25s ease, color .25s ease;
}

/* Иконка темы — крутится при клике */
.icon-btn-theme #themeIcon{
  display:inline-block;
  transition:transform .35s cubic-bezier(.4, 1.5, .5, 1);
}
.icon-btn-theme:hover #themeIcon{
  transform:rotate(360deg);
}

/* Тёмная тема: точечные правки */
[data-theme="dark"]{
  /* Карты целей — лучше читаемые */
  .goal-card, .dash-goal{
    background:var(--surface);
  }
  .goal-card.goal-good, .dash-goal.goal-good{
    background:linear-gradient(135deg, color-mix(in srgb, #23a56f 6%, var(--surface)), var(--surface));
  }
  .goal-card.goal-warn, .dash-goal.goal-warn{
    background:linear-gradient(135deg, color-mix(in srgb, #ef8b2d 6%, var(--surface)), var(--surface));
  }
  .goal-card.goal-bad, .dash-goal.goal-bad{
    background:linear-gradient(135deg, color-mix(in srgb, #d64a4a 8%, var(--surface)), var(--surface));
  }

  /* AI tool-call плашки — темнее */
  .ai-tool-call{
    background:color-mix(in srgb, #a855f7 10%, var(--surface-2));
    border-color:color-mix(in srgb, #a855f7 25%, var(--line));
  }

  /* AI промо-блок DeepSeek в настройках — темнее */
  .ai-deepseek-promo{
    background:linear-gradient(135deg,
      color-mix(in srgb, #4d6bfe 10%, var(--surface)),
      color-mix(in srgb, #ec4899 6%, var(--surface)));
    border-color:color-mix(in srgb, #4d6bfe 30%, var(--line));
  }
  .ai-deepseek-promo-icon{
    background:var(--surface-2);
  }
  .ai-deepseek-promo-title strong{color:#88a8ff}

  /* Guide AI секция */
  .guide-ai-section{
    background:linear-gradient(135deg,
      color-mix(in srgb, #a855f7 8%, var(--surface)),
      color-mix(in srgb, #ec4899 5%, var(--surface)));
    border-color:color-mix(in srgb, #a855f7 30%, var(--line));
  }

  /* Bottom nav — стеклянный блюр */
  .mobile-bottom-nav{
    background:rgba(15, 21, 34, .92);
    box-shadow:0 -4px 12px rgba(0,0,0,.3);
  }
  .mbn-more-sheet{
    background:var(--surface-2);
    box-shadow:0 -8px 24px rgba(0,0,0,.4);
  }

  /* Login screen */
  .hero-copy h1{
    background:linear-gradient(135deg, #88a8ff 0%, #c4d5ff 100%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
  }

  /* Statuses chips */
  .settings-status.good{background:color-mix(in srgb, #23a56f 18%, transparent); color:#6fe3a8}
  .settings-status.bad{background:color-mix(in srgb, #d64a4a 18%, transparent); color:#ff9999}
  .settings-status.warn{background:color-mix(in srgb, #ef8b2d 18%, transparent); color:#ffc788}
  .settings-status.neutral{background:color-mix(in srgb, var(--muted) 18%, transparent); color:var(--text)}

  /* Tableless карточки на мобиле */
  .table tr{background:var(--surface)}

  /* Скроллбары стилизованы */
  *::-webkit-scrollbar-track{background:var(--bg)}
  *::-webkit-scrollbar-thumb{background:var(--line-2)}
  *::-webkit-scrollbar-thumb:hover{background:var(--muted)}
}

/* Светлая тема — улучшения */
[data-theme="light"]{
  .ai-tool-call{
    background:color-mix(in srgb, #a855f7 6%, #ffffff);
    border-color:color-mix(in srgb, #a855f7 20%, var(--line));
  }
}

/* Респектировать prefers-color-scheme при первом заходе */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]):not([data-theme="dark"]){
    color-scheme:dark;
  }
}

/* ============================================================ */
/* ИНТЕГРАЦИИ (v15.29)                                          */
/* ============================================================ */
.integrations-list{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-top:14px;
}

.integration-card{
  padding:16px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:14px;
  display:flex;
  flex-direction:column;
  gap:10px;
  transition:border-color .15s;
}
.integration-card:hover{
  border-color:color-mix(in srgb, var(--primary) 30%, var(--line));
}
.integration-card.integration-disabled{
  opacity:.55;
}

.integration-card-head{
  display:flex;
  align-items:center;
  gap:12px;
}
.integration-icon{
  font-size:24px;
  width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface);
  border-radius:10px;
  flex-shrink:0;
}
.integration-meta{
  flex:1;min-width:0;
}
.integration-name{
  font-weight:700;font-size:14.5px;
  color:var(--text);
  line-height:1.3;
}
.integration-provider{
  font-size:11.5px;color:var(--muted);
  margin-top:2px;
}
.integration-status{
  font-size:11px;font-weight:700;
  padding:4px 10px;
  border-radius:999px;
  white-space:nowrap;
  flex-shrink:0;
}
.integration-status-ok{
  background:color-mix(in srgb, #23a56f 18%, transparent);
  color:#1b9c68;
}
.integration-status-err{
  background:color-mix(in srgb, #d64a4a 18%, transparent);
  color:#d64a4a;
  cursor:help;
}
.integration-status-neutral{
  background:var(--bg);
  color:var(--muted);
  border:1px solid var(--line);
}

.integration-card-info{
  display:flex;gap:14px;flex-wrap:wrap;
  font-size:11.5px;
}
.integration-error{
  padding:8px 12px;
  background:color-mix(in srgb, #d64a4a 8%, transparent);
  border-left:3px solid #d64a4a;
  border-radius:6px;
  font-size:11.5px;
  font-family:'JetBrains Mono', monospace;
  color:#d64a4a;
  line-height:1.4;
}
.integration-card-actions{
  display:flex;gap:8px;flex-wrap:wrap;
}
.integration-card-actions .btn-sm{
  padding:6px 12px;
  font-size:12px;
}

/* Сетка выбора провайдера */
.integration-provider-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:10px;
  margin-top:6px;
}
@media (max-width:600px){
  .integration-provider-grid{grid-template-columns:1fr}
}
.integration-provider-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:14px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  cursor:pointer;
  transition:all .15s;
  text-align:left;
  position:relative;
}
.integration-provider-card:hover:not([disabled]){
  border-color:var(--primary);
  background:color-mix(in srgb, var(--primary) 4%, var(--surface));
  transform:translateY(-1px);
}
.integration-provider-card.coming-soon{
  cursor:not-allowed;
  opacity:.6;
}
.coming-soon-badge{
  position:absolute;
  top:8px;right:8px;
  padding:2px 8px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:999px;
  font-size:10px;font-weight:700;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.05em;
}
.provider-icon{font-size:24px;line-height:1}
.provider-label{
  font-weight:700;font-size:14px;
  color:var(--text);
}
.provider-desc{
  font-size:11.5px;
  color:var(--muted);
  line-height:1.4;
}

/* Тестовый результат */
.integration-test-result{
  padding:10px 14px;
  border-radius:8px;
  font-size:12.5px;
  line-height:1.4;
}
.integration-test-ok{
  background:color-mix(in srgb, #23a56f 12%, transparent);
  border:1px solid color-mix(in srgb, #23a56f 30%, transparent);
  color:#1b9c68;
}
.integration-test-err{
  background:color-mix(in srgb, #d64a4a 12%, transparent);
  border:1px solid color-mix(in srgb, #d64a4a 30%, transparent);
  color:#d64a4a;
  font-family:'JetBrains Mono', monospace;
  word-break:break-word;
}

.modal-card-wide{
  max-width:680px !important;
  width:100% !important;
}

/* Quick-period chips */
.quick-period-buttons{
  display:flex;gap:6px;flex-wrap:wrap;
}
.btn-chip{
  padding:6px 12px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--text);
  font-size:12px;font-weight:600;
  cursor:pointer;
  transition:all .15s;
}
.btn-chip:hover{
  border-color:var(--primary);
  color:var(--primary);
  background:color-mix(in srgb, var(--primary) 8%, var(--surface-2));
}

/* Тёмная тема: интеграции */
[data-theme="dark"] .integration-test-ok{
  background:color-mix(in srgb, #23a56f 18%, var(--surface-2));
  color:#6fe3a8;
}
[data-theme="dark"] .integration-test-err{
  background:color-mix(in srgb, #d64a4a 18%, var(--surface-2));
  color:#ff9999;
}
[data-theme="dark"] .integration-status-ok{color:#6fe3a8}

/* ============================================================ */
/* ИНТЕГРАЦИИ (v15.29)                                          */
/* ============================================================ */

.integrations-list{
  display:flex;flex-direction:column;gap:12px;
}

.integration-card{
  padding:16px 18px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:14px;
  display:flex;flex-direction:column;gap:10px;
  transition:border-color .15s, transform .15s;
}
.integration-card:hover{border-color:color-mix(in srgb, var(--primary) 30%, var(--line))}
.integration-card-inactive{opacity:.55}

.integration-card-head{
  display:flex;align-items:center;gap:12px;
}
.integration-card-icon{
  font-size:24px;
  width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface-2);
  border-radius:10px;
  flex-shrink:0;
}
.integration-card-meta{
  flex:1;min-width:0;
}
.integration-card-name{
  font-weight:700;font-size:15px;
  color:var(--text);
  line-height:1.3;
}
.integration-card-provider{
  font-size:12px;color:var(--muted);margin-top:2px;
}

.integration-card-meta-row{
  display:flex;justify-content:space-between;align-items:center;
  font-size:12px;
  flex-wrap:wrap;gap:8px;
}

.integration-card-error{
  padding:8px 10px;
  background:color-mix(in srgb, #d64a4a 8%, var(--surface-2));
  border-left:3px solid #d64a4a;
  border-radius:6px;
  font-size:11.5px;
  color:#d64a4a;
  font-family:'JetBrains Mono', monospace;
  white-space:pre-wrap;
  max-height:80px;
  overflow-y:auto;
}

.integration-card-actions{
  display:flex;gap:8px;flex-wrap:wrap;
  padding-top:8px;
  border-top:1px dashed var(--line);
}

/* Бейджи статусов */
.int-badge{
  display:inline-flex;align-items:center;gap:4px;
  padding:4px 10px;
  border-radius:999px;
  font-size:11px;font-weight:700;
  white-space:nowrap;
}
.int-badge-success{
  background:color-mix(in srgb, #23a56f 15%, transparent);
  color:#1b9c68;
}
.int-badge-error{
  background:color-mix(in srgb, #d64a4a 15%, transparent);
  color:#c23030;
}
.int-badge-neutral{
  background:var(--surface-2);
  color:var(--muted);
}
.int-badge-info{
  background:color-mix(in srgb, var(--primary) 15%, transparent);
  color:var(--primary);
}

/* Сетка выбора провайдера */
.integration-provider-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));
  gap:10px;
}

.integration-provider-tile{
  position:relative;
  padding:16px 14px;
  background:var(--surface);
  border:2px solid var(--line);
  border-radius:14px;
  text-align:left;
  cursor:pointer;
  transition:all .15s;
  display:flex;flex-direction:column;gap:6px;
  font-family:inherit;
  color:var(--text);
}
.integration-provider-tile:not(.coming-soon):hover{
  border-color:var(--primary);
  transform:translateY(-2px);
  box-shadow:0 6px 20px color-mix(in srgb, var(--primary) 15%, transparent);
}
.integration-provider-tile.coming-soon{
  opacity:.55;
  cursor:not-allowed;
}
.ipt-icon{font-size:28px;line-height:1}
.ipt-name{font-weight:700;font-size:14px}
.ipt-desc{font-size:11.5px;color:var(--muted);line-height:1.4}
.ipt-badge{
  position:absolute;top:8px;right:8px;
  padding:2px 8px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:999px;
  font-size:10px;font-weight:700;
  color:var(--muted);
  text-transform:uppercase;letter-spacing:.05em;
}

/* Карточка текущего провайдера в форме */
.integration-current-provider{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:10px;
  margin-bottom:14px;
}

/* Результат теста подключения / синхронизации */
.integration-test-result{
  margin-top:12px;
  padding:10px 14px;
  border-radius:10px;
  font-size:13px;
  line-height:1.5;
}
.int-result-pending{
  background:var(--surface-2);
  color:var(--muted);
  border:1px solid var(--line);
}
.int-result-success{
  background:color-mix(in srgb, #23a56f 12%, transparent);
  color:#1b9c68;
  border:1px solid color-mix(in srgb, #23a56f 30%, transparent);
}
.int-result-error{
  background:color-mix(in srgb, #d64a4a 12%, transparent);
  color:#c23030;
  border:1px solid color-mix(in srgb, #d64a4a 30%, transparent);
  white-space:pre-wrap;
}

/* Широкая модалка для интеграций */
.modal-card-wide{
  max-width:720px;
}

@media (max-width:700px){
  .integration-provider-grid{grid-template-columns:1fr}
  .integration-card-actions{flex-direction:column}
  .integration-card-actions .btn{width:100%}
}

/* ============================================================ */
/* ИНТЕГРАЦИИ (v15.29)                                          */
/* ============================================================ */
.integrations-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.integration-empty{
  text-align:center;
  padding:32px 18px;
}
.integration-empty-icon{
  font-size:42px;
  margin-bottom:8px;
}
.integration-empty-title{
  font-size:14px;font-weight:700;
  color:var(--text);
  margin-bottom:6px;
}
.integration-empty-hint{
  font-size:12.5px;
  color:var(--muted);
  line-height:1.5;
  max-width:480px;
  margin:0 auto;
}

.integration-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  transition:border-color .15s;
}
.integration-card:hover{border-color:var(--primary)}
.integration-card-disabled{opacity:.6}

.integration-card-icon{
  font-size:28px;
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface);
  border-radius:10px;
  flex-shrink:0;
}

.integration-card-body{flex:1;min-width:0}
.integration-card-head{
  display:flex;align-items:baseline;gap:8px;
  margin-bottom:4px;
  flex-wrap:wrap;
}
.integration-card-name{
  font-weight:700;font-size:14px;
  color:var(--text);
}
.integration-card-provider{
  font-size:11px;font-weight:600;
  text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);
}
.integration-card-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  font-size:12px;
}
.int-status{
  font-size:11px;
  padding:2px 8px;
  border-radius:6px;
  font-weight:600;
}
.int-status-good{background:color-mix(in srgb,#23a56f 12%,transparent);color:#1b9c68}
.int-status-bad {background:color-mix(in srgb,#d64a4a 12%,transparent);color:#d64a4a}
.int-status-warn{background:color-mix(in srgb,#ef8b2d 12%,transparent);color:#c46b1f}
.int-status-neutral{background:var(--surface);color:var(--muted)}

.int-chip{
  font-size:10.5px;font-weight:600;
  padding:2px 8px;
  border-radius:6px;
}
.int-chip-info{background:color-mix(in srgb,var(--primary) 12%,transparent);color:var(--primary)}

.integration-card-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-shrink:0;
}

/* Сетка провайдеров */
.provider-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:10px;
  margin-top:8px;
}
.provider-tile{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  gap:6px;
  padding:14px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  cursor:pointer;
  position:relative;
  transition:all .15s;
  font-family:inherit;
  color:var(--text);
}
.provider-tile:hover:not(:disabled){
  border-color:var(--primary);
  transform:translateY(-1px);
  box-shadow:0 4px 12px color-mix(in srgb,var(--primary) 12%,transparent);
}
.provider-tile-disabled{
  cursor:not-allowed;
  opacity:.5;
}
.provider-tile-icon{font-size:28px}
.provider-tile-name{
  font-weight:700;font-size:14px;
}
.provider-tile-desc{
  font-size:11.5px;
  color:var(--muted);
  line-height:1.4;
}
.provider-tile-badge{
  position:absolute;
  top:8px;right:8px;
  background:color-mix(in srgb,#ef8b2d 18%,var(--surface));
  color:#c46b1f;
  font-size:9.5px;font-weight:700;
  text-transform:uppercase;
  padding:2px 6px;
  border-radius:5px;
  letter-spacing:.05em;
}

@media (max-width:700px){
  .integration-card{
    flex-wrap:wrap;
    gap:10px;
  }
  .integration-card-icon{width:40px;height:40px;font-size:22px}
  .integration-card-body{flex:1 1 calc(100% - 60px)}
  .integration-card-actions{
    flex:1 1 100%;
    justify-content:flex-end;
  }
  .provider-grid{grid-template-columns:1fr}
}

/* ============================================================ */
/* АДАПТИВНЫЙ ЛОГИН (v15.34)                                   */
/* ============================================================ */

@media (max-width:900px){
  .login-screen{
    padding:24px 16px;
    padding-top:max(24px, env(safe-area-inset-top));
    padding-bottom:max(24px, env(safe-area-inset-bottom));
    align-items:flex-start;
  }
  .login-layout{
    grid-template-columns:1fr;
    gap:24px;
  }
  .login-hero{
    padding:0;
    text-align:center;
  }
  .login-logo{
    width:72px;height:72px;
    border-radius:20px;
    font-size:24px;
    margin:0 auto 16px;
  }
  .hero-copy h1{
    font-size:32px;
    line-height:1;
    margin-bottom:10px;
  }
  .hero-copy p{
    font-size:14px;
    line-height:1.5;
    margin-bottom:14px;
  }
  /* Скрываем список преимуществ на мобиле — экономим экран */
  .hero-list{display:none}
  .login-card{
    padding:24px 22px;
    border-radius:18px;
  }
  .login-card h2{font-size:24px}
  .login-card p{font-size:13.5px;margin-bottom:14px}
  .eyebrow{font-size:10.5px}
}

@media (max-width:480px){
  .login-screen{padding:16px 12px}
  .login-hero{margin-bottom:8px}
  .login-logo{width:64px;height:64px;font-size:22px;margin-bottom:12px}
  .hero-copy h1{font-size:26px;margin-bottom:8px}
  .hero-copy p{
    font-size:13px;
    /* Сокращаем — на маленьких экранах вторая строка часто лишняя */
    -webkit-line-clamp:2;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .login-card{padding:20px 18px}
  .login-card h2{font-size:21px}
  .login-card .field input{
    font-size:16px; /* iOS не зумит при фокусе если шрифт ≥16px */
    padding:12px 14px;
  }
  .login-card .btn-lg{
    padding:14px;
    font-size:15px;
  }
}

/* 2FA step внутри login-card — адаптивная типографика */
@media (max-width:480px){
  #login2faCode{
    font-size:24px !important;
    letter-spacing:6px !important;
    padding:14px 10px;
  }
}

/* ============================================================ */
/* FOOD COST CALCULATOR (v15.34)                               */
/* ============================================================ */

/* Toggle ресторанных модулей в Настройках */
.industry-module-row{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  margin-bottom:10px;
}
.industry-module-info{
  display:flex;
  align-items:center;
  gap:14px;
  flex:1;
  min-width:0;
}
.industry-module-icon{
  font-size:28px;
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface);
  border-radius:10px;
  flex-shrink:0;
}
.industry-module-title{
  font-size:14px;font-weight:700;
  color:var(--text);
  margin-bottom:4px;
}
.industry-module-desc{
  font-size:12.5px;
  color:var(--muted);
  line-height:1.45;
}

/* Сводка по меню */
.fc-summary{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
  margin-bottom:18px;
}
.fc-summary-card{
  padding:14px 16px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
}
.fc-summary-card-main{
  background:linear-gradient(135deg,
    color-mix(in srgb,var(--primary) 8%,var(--surface)),
    var(--surface));
  border-color:color-mix(in srgb,var(--primary) 25%,var(--line));
}
.fc-summary-label{
  font-size:11px;font-weight:600;
  text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);
  margin-bottom:4px;
}
.fc-summary-value{
  font-size:24px;font-weight:700;
  color:var(--text);
  font-family:'JetBrains Mono', monospace;
  margin-bottom:2px;
}
.fc-summary-hint{
  font-size:11px;
  color:var(--muted);
}

/* Универсальные цвета FC */
.fc-good{color:#23a56f}
.fc-warn{color:#ef8b2d}
.fc-bad{color:#d64a4a}

/* Фильтр категорий */
.fc-filters{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
  flex-wrap:wrap;
}
.fc-filter-tabs{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  flex:1;
}
.fc-tab{
  padding:7px 12px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  cursor:pointer;
  font-size:12.5px;
  font-weight:500;
  color:var(--text);
  font-family:inherit;
  transition:all .15s;
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.fc-tab:hover{border-color:var(--primary)}
.fc-tab-active{
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
.fc-tab-active .fc-tab-count{background:rgba(255,255,255,.25);color:#fff}
.fc-tab-count{
  background:var(--surface-2);
  color:var(--muted);
  padding:1px 7px;
  border-radius:10px;
  font-size:10.5px;
  font-weight:700;
}

/* Карточки блюд */
.fc-dishes-list{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(340px, 1fr));
  gap:12px;
}
.fc-card{
  padding:14px 16px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  cursor:pointer;
  transition:all .15s;
  position:relative;
}
.fc-card:hover{
  border-color:var(--primary);
  transform:translateY(-1px);
  box-shadow:0 4px 14px color-mix(in srgb,var(--primary) 10%,transparent);
}
.fc-card-good{border-left:3px solid #23a56f}
.fc-card-warn{border-left:3px solid #ef8b2d}
.fc-card-bad{border-left:3px solid #d64a4a}

.fc-card-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
}
.fc-card-name{
  font-size:15px;font-weight:700;
  color:var(--text);
  flex:1;
  min-width:0;
}
.fc-card-cat{
  font-size:10.5px;font-weight:600;
  padding:3px 7px;
  border-radius:6px;
  white-space:nowrap;
  flex-shrink:0;
}

.fc-card-grid{
  display:grid;
  grid-template-columns:repeat(5, 1fr);
  gap:8px;
  padding:10px 0;
  border-top:1px dashed var(--line);
  border-bottom:1px dashed var(--line);
  margin-bottom:10px;
}
.fc-metric{
  text-align:left;
  min-width:0;
}
.fc-metric-label{
  font-size:9.5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);
  margin-bottom:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.fc-metric-value{
  font-size:13px;font-weight:700;
  color:var(--text);
  font-family:'JetBrains Mono', monospace;
}
.fc-metric-highlight .fc-metric-value{color:var(--primary)}

.fc-card-footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.fc-status{
  font-size:11px;font-weight:600;
  padding:3px 8px;
  border-radius:6px;
}
.fc-status-good{background:color-mix(in srgb,#23a56f 12%,transparent);color:#1b9c68}
.fc-status-warn{background:color-mix(in srgb,#ef8b2d 12%,transparent);color:#c46b1f}
.fc-status-bad {background:color-mix(in srgb,#d64a4a 12%,transparent);color:#d64a4a}
.fc-status-neutral{background:var(--surface-2);color:var(--muted)}
.fc-card-competitor{font-size:11px}
.fc-card-note{
  margin-top:8px;
  padding-top:8px;
  border-top:1px dashed var(--line);
  font-size:12px;
  color:var(--muted);
  font-style:italic;
}

/* Empty state */
.fc-empty{
  text-align:center;
  padding:40px 20px;
}
.fc-empty-icon{display:flex;align-items:center;justify-content:center;margin-bottom:10px;opacity:.5;color:var(--muted)}
.fc-empty-title{font-size:16px;font-weight:700;margin-bottom:6px}
.fc-empty-hint{font-size:13px;color:var(--muted);line-height:1.5}

/* Калькулятор в модалке */
.fc-calc-box{
  margin-top:14px;
  padding:14px 16px;
  background:linear-gradient(135deg,
    color-mix(in srgb,var(--primary) 4%,var(--surface)),
    var(--surface));
  border:1px solid color-mix(in srgb,var(--primary) 20%,var(--line));
  border-radius:12px;
}
.fc-calc-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
}
.fc-calc-row > .field{
  flex:1;
  min-width:140px;
}
.fc-calc-arrow{
  font-size:22px;
  color:var(--muted);
  font-weight:700;
  padding-top:30px;
  flex-shrink:0;
}
.fc-calc-result{
  flex:1;
  min-width:140px;
  padding:8px 12px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:10px;
  text-align:center;
  margin-top:18px;
}
.fc-calc-result-label{
  font-size:10.5px;font-weight:600;
  text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted);
  margin-bottom:4px;
}
.fc-calc-result-value{
  font-size:18px;font-weight:700;
  color:var(--text);
  font-family:'JetBrains Mono', monospace;
  line-height:1.2;
}
.fc-calc-result-hint{
  font-size:10.5px;
  color:var(--muted);
  margin-top:2px;
}

/* Категории — модалка */
.categories-list{
  display:flex;
  flex-direction:column;
  gap:6px;
  max-height:300px;
  overflow-y:auto;
  padding:4px 2px;
}
.category-row{
  display:grid;
  grid-template-columns:36px 1fr 36px;
  gap:8px;
  align-items:center;
  padding:6px;
  background:var(--surface-2);
  border-radius:8px;
}
.category-row-icon{
  font-size:18px;
  text-align:center;
}
.category-row-name{
  border:1px solid var(--line);
  background:var(--surface);
  padding:7px 10px;
  border-radius:6px;
  font-size:13px;
  color:var(--text);
  font-family:inherit;
}

/* Адаптив */
@media (max-width:700px){
  .industry-module-row{flex-wrap:wrap}
  .fc-summary{grid-template-columns:1fr 1fr}
  .fc-summary-value{font-size:20px}
  .fc-dishes-list{grid-template-columns:1fr}
  .fc-card-grid{grid-template-columns:repeat(2, 1fr); gap:10px}
  .fc-calc-row{flex-direction:column; gap:6px}
  .fc-calc-arrow{
    padding-top:0;
    font-size:18px;
    text-align:center;
    width:100%;
    transform:rotate(90deg);
  }
  .fc-calc-result{margin-top:0; width:100%}
  .fc-card-name{font-size:14px}
  .modal-card-wide{padding:18px}
}

/* ============================================================ */
/* RESTAURANT TOOLS — ВКЛАДКИ + ВСЕ НОВЫЕ ЭЛЕМЕНТЫ (v15.35)    */
/* ============================================================ */

/* Вкладки */
.rt-tabs{
  display:flex;
  gap:4px;
  border-bottom:1px solid var(--line);
  margin-bottom:18px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.rt-tabs::-webkit-scrollbar{display:none}
.rt-tab{
  padding:10px 16px;
  background:transparent;
  border:none;
  border-bottom:2px solid transparent;
  color:var(--muted);
  font-family:inherit;
  font-size:13.5px;
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
  transition:all .15s;
}
.rt-tab:hover{color:var(--text)}
.rt-tab-active{
  color:var(--primary);
  border-bottom-color:var(--primary);
}

.rt-tab-content{display:none}
.rt-tab-content-active{display:block; animation:fadeIn .25s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

.rt-tab-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:16px;
  flex-wrap:wrap;
}
.rt-tab-title{
  margin:0 0 4px;
  font-size:18px;
  font-weight:700;
}
.rt-tab-head p{margin:0;font-size:13px;line-height:1.4}

/* Подсказка ввода поиска / select-inline */
.search-input{
  width:100%;
  padding:9px 12px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  border-radius:8px;
  font-size:13.5px;
  font-family:inherit;
}
.select-inline{
  padding:9px 12px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  border-radius:8px;
  font-size:13px;
  font-family:inherit;
  min-width:180px;
}

/* iiko dish info (внутри модалки) */
.iiko-dish-info{
  padding:12px 14px;
  background:linear-gradient(135deg, color-mix(in srgb,#a855f7 6%,var(--surface)), var(--surface));
  border:1px solid color-mix(in srgb,#a855f7 20%,var(--line));
  border-radius:10px;
  margin-bottom:14px;
}
.iiko-info-row{margin-bottom:6px;font-size:11px}
.iiko-info-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:8px;
  font-size:13px;
}
.iiko-info-grid > div{padding:4px 0}

/* Ингредиенты и таблицы */
.data-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.data-table thead th{
  text-align:left;
  font-size:11px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--muted);
  padding:10px 12px;
  border-bottom:1px solid var(--line);
  background:var(--surface);
}
.data-table tbody tr{
  border-bottom:1px solid var(--line);
  cursor:pointer;
  transition:background .12s;
}
.data-table tbody tr:hover{background:var(--surface-2)}
.data-table tbody td{padding:10px 12px;color:var(--text)}
.data-table .num{text-align:right;font-family:'JetBrains Mono', monospace}
.data-table .text-right{text-align:right}
.data-table .ing-inactive{opacity:.5}

.ingredients-table{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
}

/* Recipe modal */
.recipe-components{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin:14px 0;
}
.recipe-row{
  display:grid;
  grid-template-columns:2fr 100px 90px 100px 36px;
  gap:6px;
  align-items:center;
  padding:6px;
  background:var(--surface-2);
  border-radius:8px;
}
.recipe-row select, .recipe-row input{
  padding:7px 10px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  border-radius:6px;
  font-size:13px;
  font-family:inherit;
}
.recipe-row-cost{
  text-align:right;
  font-family:'JetBrains Mono', monospace;
  font-weight:700;
  color:var(--text);
  font-size:13px;
  padding:0 8px;
}
.recipe-totals{
  margin-top:14px;
  padding:12px 14px;
  background:linear-gradient(135deg, color-mix(in srgb,var(--primary) 6%,var(--surface)), var(--surface));
  border:1px solid color-mix(in srgb,var(--primary) 20%,var(--line));
  border-radius:10px;
}
.recipe-totals-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

/* Списания */
.writeoffs-list{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
}
.writeoff-cost-preview{margin-top:8px}

/* Банкеты */
.banquets-list{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(360px, 1fr));
  gap:12px;
}
.banquet-card{
  padding:14px 16px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  cursor:pointer;
  transition:all .15s;
}
.banquet-card:hover{
  border-color:var(--primary);
  transform:translateY(-1px);
  box-shadow:0 4px 14px color-mix(in srgb,var(--primary) 10%,transparent);
}
.banquet-card-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:10px;
}
.banquet-card-name{
  font-size:15px;font-weight:700;
  color:var(--text);
}
.banquet-items{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:10px;
}
.banquet-item-row{
  display:grid;
  grid-template-columns:1fr 80px 110px 36px;
  gap:6px;
  align-items:center;
  padding:6px;
  background:var(--surface-2);
  border-radius:8px;
}
.banquet-item-row select, .banquet-item-row input{
  padding:7px 10px;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  border-radius:6px;
  font-size:12.5px;
  font-family:inherit;
}
.banquet-item-cost{
  text-align:right;
  font-family:'JetBrains Mono', monospace;
  font-weight:700;
}
.banquet-totals{
  margin:14px 0;
  padding:12px 14px;
  background:linear-gradient(135deg, color-mix(in srgb,#23a56f 6%,var(--surface)), var(--surface));
  border:1px solid color-mix(in srgb,#23a56f 20%,var(--line));
  border-radius:10px;
}
.banquet-totals-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
  gap:14px;
  font-size:12.5px;
}
.banquet-totals-grid > div{display:flex;flex-direction:column;gap:2px}
.banquet-totals-grid strong{font-size:16px;color:var(--text);font-family:'JetBrains Mono', monospace}

@media (max-width:700px){
  .rt-tab{padding:8px 10px;font-size:12.5px}
  .recipe-row{grid-template-columns:1fr 60px 60px 70px 30px; font-size:12px}
  .banquet-item-row{grid-template-columns:1fr 60px 80px 30px}
  .banquets-list{grid-template-columns:1fr}
  .banquet-totals-grid{grid-template-columns:1fr 1fr}
  .iiko-info-grid{grid-template-columns:1fr}
}

/* ============================================================ */
/* IIKO MENU ACCORDION (v15.36)                                */
/* ============================================================ */

.iiko-menu-search-wrap{margin-bottom:14px}
.iiko-menu-list{display:flex;flex-direction:column;gap:8px}

.iiko-group{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  transition:border-color .15s;
}
.iiko-group:hover{border-color:color-mix(in srgb,var(--primary) 30%,var(--line))}
.iiko-group-expanded{border-color:color-mix(in srgb,var(--primary) 40%,var(--line))}

.iiko-group-header{
  width:100%;
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  background:transparent;
  border:none;
  font-family:inherit;
  text-align:left;
  cursor:pointer;
  color:var(--text);
  transition:background .12s;
}
.iiko-group-header:hover{
  background:color-mix(in srgb,var(--primary) 4%,transparent);
}

.iiko-group-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  flex-shrink:0;
  color:var(--muted);
  transition:transform .18s, color .12s;
}
.iiko-group-expanded .iiko-group-arrow{color:var(--primary);transform:rotate(90deg)}

.iiko-group-name{
  flex:1;
  font-size:14px;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.iiko-group-count{
  font-size:11px;
  font-weight:600;
  background:var(--surface-2);
  color:var(--muted);
  padding:3px 8px;
  border-radius:6px;
}
.iiko-group-fc{
  font-size:12px;
  font-family:'JetBrains Mono', monospace;
  white-space:nowrap;
}

.iiko-group-body{
  padding:8px 14px 14px;
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
  gap:10px;
  border-top:1px dashed var(--line);
  animation:groupSlideDown .2s ease;
}
@keyframes groupSlideDown{
  from{opacity:0;transform:translateY(-4px)}
  to  {opacity:1;transform:translateY(0)}
}

@media (max-width:700px){
  .iiko-group-header{padding:10px;gap:8px}
  .iiko-group-name{font-size:13px}
  .iiko-group-fc{font-size:11px}
  .iiko-group-body{grid-template-columns:1fr;gap:8px;padding:8px 10px 10px}
}

/* ============================================================ */
/* СВОРАЧИВАЕМЫЕ СЕКЦИИ ЛЕВОГО МЕНЮ (v15.37)                   */
/* ============================================================ */

.nav-section-collapsible .nav-section-toggle{
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  background:transparent;
  border:none;
  text-align:left;
  cursor:pointer;
  font-family:inherit;
  font-size:11px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--muted);
  border-radius:8px;
  transition:background .12s, color .12s;
  margin-bottom:2px;
}
.nav-section-collapsible .nav-section-toggle:hover{
  background:var(--surface-2);
  color:var(--text);
}

.nav-section-arrow{
  font-size:9px;
  width:10px;
  text-align:center;
  flex-shrink:0;
  transition:transform .2s ease;
  color:var(--muted);
}

/* Свёрнутая секция */
.nav-section-collapsed .nav-section-arrow{
  transform:rotate(-90deg);
}
.nav-section-collapsed .nav-section-body{
  display:none;
}

.nav-section-body{
  display:flex;
  flex-direction:column;
  gap:1px;
  animation:navSectionExpand .18s ease;
}
@keyframes navSectionExpand{
  from{opacity:0;max-height:0;overflow:hidden}
  to  {opacity:1;max-height:600px}
}

/* На мобильном меню — секции тоже сворачиваются */
@media (max-width:900px){
  .nav-section-collapsible .nav-section-toggle{font-size:10.5px;padding:9px 10px}
}

/* ============================================================ */
/* МОДАЛКА НАСТРОЕК СИНХРОНИЗАЦИИ iiko (v15.38)                */
/* ============================================================ */

.btn-icon{
  width:38px;
  height:38px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  flex-shrink:0;
}

.iiko-settings-section{
  margin-bottom:18px;
  padding:14px;
  background:var(--surface-2);
  border-radius:10px;
}
.iiko-settings-h{
  display:flex;
  align-items:center;
  gap:7px;
  margin:0 0 8px;
  font-size:14px;
  font-weight:700;
  color:var(--text);
}

.iiko-settings-radio{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:8px 10px;
  margin:4px 0;
  cursor:pointer;
  border-radius:8px;
  transition:background .12s;
}
.iiko-settings-radio:hover{background:var(--surface)}
.iiko-settings-radio input{margin-top:3px}

.iiko-groups-checklist{
  margin-top:14px;
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
}
.iiko-groups-actions{
  display:flex;
  gap:6px;
  align-items:center;
  padding:8px 10px;
  background:var(--surface-2);
  border-bottom:1px solid var(--line);
  flex-wrap:wrap;
}
.iiko-groups-counter{
  margin-left:auto;
  font-size:12px;
  color:var(--text-muted);
  font-weight:600;
  white-space:nowrap;
}
.iiko-groups-list{
  max-height:320px;
  overflow-y:auto;
  background:var(--surface);
  padding:4px 0;
}
.iiko-group-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 12px;
  cursor:pointer;
  font-size:13px;
  color:var(--text);
  border-radius:6px;
  transition:background .12s;
  user-select:none;
}
.iiko-group-row:hover{background:var(--surface-2)}
.iiko-group-row input[type="checkbox"]{
  flex-shrink:0;
  width:16px;
  height:16px;
  cursor:pointer;
  accent-color:var(--primary);
}
.iiko-group-row span{
  flex:1;
  min-width:0;
  color:var(--text);
  line-height:1.3;
}

.iiko-last-sync{
  margin-top:8px;
  font-size:12px;
}

@media (max-width:700px){
  .iiko-settings-section{padding:10px}
  .modal-actions{flex-wrap:wrap}
  .modal-actions .btn{flex:1;min-width:120px}
}

/* ============================================================ */
/* ABC-АНАЛИЗ МЕНЮ (v15.50)                                    */
/* ============================================================ */

.abc-section-title{
  margin:24px 0 6px;
  font-size:15px;
  font-weight:700;
}

/* Фиксы периода в summary */
.abc-period-value{
  font-size:14px;
  font-family:'JetBrains Mono', monospace;
  line-height:1.3;
}

/* AI-кнопка (кнопка "Получить рекомендации Виктора") */
.abc-ai-bar{
  display:flex;
  align-items:center;
  gap:14px;
  margin:18px 0;
  padding:14px 16px;
  background:linear-gradient(135deg, color-mix(in srgb,#a855f7 12%,transparent), color-mix(in srgb,#ec4899 12%,transparent));
  border:1px solid color-mix(in srgb,#a855f7 25%,transparent);
  border-radius:12px;
  flex-wrap:wrap;
}
.abc-ai-hint{font-size:12px;flex:1;min-width:200px}

.btn-ai{
  background:linear-gradient(135deg, #a855f7, #ec4899);
  color:#fff;
  border:none;
  font-weight:700;
  padding:10px 16px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  transition:transform .15s, box-shadow .15s;
}
.btn-ai:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(168,85,247,.35);
}
.btn-ai:disabled{opacity:.6;cursor:wait;transform:none}
.abc-ai-icon{font-size:18px}

.abc-ai-block{
  margin-bottom:18px;
  padding:18px;
  background:var(--surface);
  border:1px solid color-mix(in srgb,#a855f7 25%,var(--line));
  border-radius:12px;
}
.abc-ai-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  padding-bottom:14px;
  border-bottom:1px dashed var(--line);
}
.abc-ai-avatar{
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg, #a855f7, #ec4899);
  border-radius:50%;
  font-size:22px;
  flex-shrink:0;
}
.abc-ai-body{font-size:14px;line-height:1.65}
.abc-ai-body h2{font-size:16px;margin:18px 0 8px;color:var(--text)}
.abc-ai-body h3{font-size:15px;margin:14px 0 6px;color:var(--text);font-weight:700}
.abc-ai-body h4{font-size:14px;margin:12px 0 4px;color:var(--primary);font-weight:700}
.abc-ai-body p{margin:6px 0}
.abc-ai-body ul, .abc-ai-body ol{margin:8px 0;padding-left:24px}
.abc-ai-body li{margin:4px 0}
.abc-ai-body strong{color:var(--text)}
.abc-ai-error{padding:14px;background:color-mix(in srgb,#d64a4a 10%,transparent);border-left:3px solid #d64a4a;border-radius:6px}
.abc-loading-spin{padding:24px;text-align:center;color:var(--muted)}

/* Матрица 3×3 */
.abc-matrix{
  margin:14px 0 24px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.abc-matrix-headers{
  display:grid;
  grid-template-columns:120px 1fr 1fr 1fr;
  gap:8px;
}
.abc-matrix-corner{}
.abc-matrix-col-label{
  text-align:center;
  padding:8px;
  font-size:12px;
  color:var(--muted);
}
.abc-matrix-col-label strong{color:var(--text);font-size:13px}
.abc-matrix-col-label small{font-size:10px;opacity:.7}

.abc-matrix-row{
  display:grid;
  grid-template-columns:120px 1fr 1fr 1fr;
  gap:8px;
  align-items:stretch;
}
.abc-matrix-row-label{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  padding:8px;
  text-align:right;
  font-size:12px;
  color:var(--muted);
  font-weight:600;
}
.abc-matrix-row-label small{font-size:10px;opacity:.7;font-weight:400}

.abc-cell{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:18px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface);
  cursor:pointer;
  font-family:inherit;
  color:var(--text);
  text-align:center;
  transition:transform .12s, box-shadow .12s, border-color .12s;
  min-height:120px;
}
.abc-cell:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(0,0,0,.12);
}
.abc-cell-icon{font-size:24px}
.abc-cell-label{font-size:12px;font-weight:700}
.abc-cell-count{font-size:24px;font-weight:800;font-family:'JetBrains Mono', monospace;line-height:1}
.abc-cell-pct{font-size:11px;color:var(--muted)}

/* Цвета 9 ячеек */
.abc-cell-stars{
  background:linear-gradient(135deg, color-mix(in srgb,#23a56f 18%,var(--surface)), var(--surface));
  border-color:color-mix(in srgb,#23a56f 50%,var(--line));
}
.abc-cell-stars .abc-cell-count{color:#23a56f}

.abc-cell-workhorses{
  background:color-mix(in srgb,#23a56f 10%,var(--surface));
  border-color:color-mix(in srgb,#23a56f 35%,var(--line));
}
.abc-cell-workhorses .abc-cell-count{color:#23a56f}

.abc-cell-puzzles{
  background:color-mix(in srgb,#ef8b2d 12%,var(--surface));
  border-color:color-mix(in srgb,#ef8b2d 45%,var(--line));
}
.abc-cell-puzzles .abc-cell-count{color:#ef8b2d}

.abc-cell-gems{
  background:color-mix(in srgb,#23a56f 12%,var(--surface));
  border-color:color-mix(in srgb,#23a56f 35%,var(--line));
}
.abc-cell-gems .abc-cell-count{color:#23a56f}

.abc-cell-middle{
  background:var(--surface);
  border-color:var(--line);
}
.abc-cell-middle .abc-cell-count{color:var(--muted)}

.abc-cell-weak{
  background:color-mix(in srgb,#ef8b2d 6%,var(--surface));
  border-color:color-mix(in srgb,#ef8b2d 25%,var(--line));
}
.abc-cell-weak .abc-cell-count{color:#ef8b2d}

.abc-cell-niche{
  background:color-mix(in srgb,#a855f7 8%,var(--surface));
  border-color:color-mix(in srgb,#a855f7 30%,var(--line));
}
.abc-cell-niche .abc-cell-count{color:#a855f7}

.abc-cell-ballast{
  background:color-mix(in srgb,#d64a4a 8%,var(--surface));
  border-color:color-mix(in srgb,#d64a4a 30%,var(--line));
}
.abc-cell-ballast .abc-cell-count{color:#d64a4a}

.abc-cell-dogs{
  background:linear-gradient(135deg, color-mix(in srgb,#d64a4a 16%,var(--surface)), var(--surface));
  border-color:color-mix(in srgb,#d64a4a 45%,var(--line));
}
.abc-cell-dogs .abc-cell-count{color:#d64a4a}

.abc-cell-nodata{
  background:color-mix(in srgb,#9aa4b8 6%,var(--surface));
  border-color:var(--line);
}
.abc-cell-nodata .abc-cell-count{color:var(--muted)}

/* Бейдж категории в таблице */
.abc-cat-badge{
  display:inline-block;
  padding:3px 8px;
  border-radius:6px;
  font-size:11px;
  font-weight:600;
  white-space:nowrap;
  border:1px solid;
}
.abc-cat-badge.abc-cell-stars,
.abc-cat-badge.abc-cell-workhorses,
.abc-cat-badge.abc-cell-gems{color:#23a56f}
.abc-cat-badge.abc-cell-puzzles,
.abc-cat-badge.abc-cell-weak{color:#ef8b2d}
.abc-cat-badge.abc-cell-niche{color:#a855f7}
.abc-cat-badge.abc-cell-ballast,
.abc-cat-badge.abc-cell-dogs{color:#d64a4a}
.abc-cat-badge.abc-cell-middle,
.abc-cat-badge.abc-cell-nodata{color:var(--muted)}

/* График Парето */
.abc-pareto-wrap{
  margin:14px 0 24px;
  padding:14px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  height:300px;
  position:relative;
}

/* Таблица */
.abc-table-controls{
  display:flex;
  gap:10px;
  margin:8px 0 12px;
  flex-wrap:wrap;
  align-items:center;
}
.abc-table-controls .search-input{flex:1;min-width:240px}
.abc-table-wrap{
  overflow-x:auto;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface);
}
.abc-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.abc-table thead th{
  background:var(--surface-2);
  padding:10px 12px;
  font-weight:700;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.04em;
  text-align:left;
  border-bottom:1px solid var(--line);
}
.abc-table th.abc-th-num{text-align:right}
.abc-table tbody td{
  padding:10px 12px;
  border-bottom:1px solid var(--line);
  vertical-align:middle;
}
.abc-table tbody tr:hover{background:var(--surface-2)}
.abc-table .abc-num{
  text-align:right;
  font-family:'JetBrains Mono', monospace;
  white-space:nowrap;
}
.abc-row-name{font-weight:600}
.abc-row-group{font-size:11px;margin-top:2px}

/* Модалка категории */
.abc-cell-rec{
  display:flex;
  gap:12px;
  margin:12px 0 18px;
  padding:14px;
  background:color-mix(in srgb,#245cf4 8%,transparent);
  border-left:3px solid var(--primary);
  border-radius:8px;
  font-size:14px;
}
.abc-rec-icon{font-size:20px;flex-shrink:0}
.abc-rec-text{line-height:1.55}

.abc-cell-list{
  max-height:400px;
  overflow-y:auto;
  border:1px solid var(--line);
  border-radius:8px;
  padding:6px;
}
.abc-cell-item{
  padding:10px 12px;
  border-bottom:1px solid var(--line);
}
.abc-cell-item:last-child{border-bottom:none}
.abc-cell-item-name{font-weight:600;margin-bottom:4px}
.abc-cell-item-stats{
  display:flex;
  gap:14px;
  font-size:12px;
  margin-bottom:6px;
  flex-wrap:wrap;
}

.abc-dish-ai-content{
  min-height:120px;
  padding:6px 4px;
}

@media (max-width:760px){
  .abc-matrix-headers,
  .abc-matrix-row{
    grid-template-columns:80px 1fr 1fr 1fr;
    gap:4px;
  }
  .abc-matrix-row-label,
  .abc-matrix-col-label{
    font-size:10px;
    padding:4px;
  }
  .abc-cell{
    min-height:90px;
    padding:8px 4px;
  }
  .abc-cell-icon{font-size:18px}
  .abc-cell-label{font-size:10px}
  .abc-cell-count{font-size:18px}
  .abc-cell-pct{font-size:9px}

  .abc-table-controls .search-input{min-width:100%}
  .abc-table{font-size:11px}
  .abc-table thead th{padding:6px 8px;font-size:9px}
  .abc-table tbody td{padding:8px 6px}
}

/* ============================================================ */
/* НЕЙРОШЕФ (v15.51)                                            */
/* ============================================================ */

.ns-tabs{
  display:flex;
  gap:4px;
  margin:14px 0 18px;
  border-bottom:2px solid var(--line);
  flex-wrap:wrap;
}
.ns-tab{
  background:transparent;
  border:none;
  padding:10px 16px;
  font-size:14px;
  font-weight:600;
  color:var(--muted);
  cursor:pointer;
  border-bottom:2px solid transparent;
  margin-bottom:-2px;
  font-family:inherit;
  transition:color .15s;
}
.ns-tab:hover{color:var(--text)}
.ns-tab-active{
  color:var(--primary);
  border-bottom-color:var(--primary);
}
.ns-tab-content{display:none}
.ns-tab-content-active{display:block}

/* ===== Анализ ТТК ===== */
.ns-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.ns-card{
  padding:18px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
}
.ns-card-result{min-height:300px}
.ns-card-title{font-size:15px;font-weight:700;margin:0 0 8px}
.ns-hint{font-size:12px;margin-bottom:14px}

.ns-dropzone{
  border:2px dashed var(--line);
  border-radius:12px;
  padding:34px 20px;
  text-align:center;
  cursor:pointer;
  transition:border-color .15s, background .15s;
}
.ns-dropzone:hover, .ns-dropzone-active{
  border-color:var(--primary);
  background:color-mix(in srgb,var(--primary) 5%,transparent);
}
.ns-dropzone-icon{font-size:36px;margin-bottom:8px;opacity:.7}
.ns-dropzone-label{font-size:13px;line-height:1.5;margin-bottom:6px}
.ns-dropzone-hint{font-size:11px}

.ns-upload-list{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.ns-upload-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:8px 12px;
  background:var(--surface-2);
  border-radius:8px;
  font-size:12px;
  gap:10px;
}
.ns-upload-error{
  border-left:3px solid #d64a4a;
  color:#d64a4a;
}
.ns-upload-status{font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap}

.ns-options{margin-top:14px;display:flex;flex-direction:column;gap:6px}
.ns-option{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:var(--muted);
  cursor:pointer;
  user-select:none;
}
.ns-option:hover{color:var(--text)}

/* Empty состояние */
.ns-empty{
  text-align:center;
  padding:40px 20px;
  color:var(--muted);
}
.ns-empty-icon{font-size:42px;opacity:.5;margin-bottom:12px}
.ns-empty-text{font-size:13px;line-height:1.6}

.ns-loading{
  text-align:center;
  padding:30px 20px;
  color:var(--muted);
  font-size:14px;
}

/* Результат анализа ТТК */
.ns-ttk-header{margin-bottom:14px}
.ns-ttk-header h3{margin:4px 0 0;font-size:18px}
.ns-ttk-stats{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:14px;
}
.ns-ttk-stat{
  padding:8px 12px;
  background:var(--surface-2);
  border-radius:8px;
  font-size:13px;
}
.ns-ttk-stat-cost{
  background:color-mix(in srgb,#23a56f 10%,var(--surface-2));
  border:1px solid color-mix(in srgb,#23a56f 30%,var(--line));
}
.ns-cost-note{margin-bottom:12px;font-size:11px;font-style:italic}

.ns-ingredient-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
  margin:8px 0 14px;
}
.ns-ingredient-table thead th{
  background:var(--surface-2);
  padding:8px;
  text-align:left;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.ns-ingredient-table th.ns-num{text-align:right}
.ns-ingredient-table tbody td{
  padding:7px 8px;
  border-bottom:1px solid var(--line);
}
.ns-ingredient-table .ns-num{
  text-align:right;
  font-family:'JetBrains Mono', monospace;
  white-space:nowrap;
}
.ns-ing-matched td:first-child{color:#23a56f}

.ns-issues-block{
  margin:12px 0;
  padding:12px 14px;
  background:color-mix(in srgb,#d64a4a 10%,transparent);
  border-left:3px solid #d64a4a;
  border-radius:8px;
  font-size:13px;
}
.ns-issues-block strong{display:block;margin-bottom:6px}
.ns-issues-block ul{margin:6px 0 0;padding-left:20px}
.ns-issues-block li{margin:3px 0}

.ns-recs-block{
  margin:12px 0;
  padding:12px 14px;
  background:color-mix(in srgb,var(--primary) 8%,transparent);
  border-left:3px solid var(--primary);
  border-radius:8px;
  font-size:13px;
}
.ns-recs-block strong{display:block;margin-bottom:6px}
.ns-recs-block ul{margin:6px 0 0;padding-left:20px}
.ns-recs-block li{margin:3px 0}

.ns-tech-block{
  margin:12px 0;
  padding:10px 14px;
  background:var(--surface-2);
  border-radius:8px;
}
.ns-tech-block summary{cursor:pointer;font-weight:600;font-size:13px}
.ns-tech-text{
  margin-top:10px;
  font-size:13px;
  line-height:1.6;
  white-space:pre-wrap;
}

.ns-ttk-actions{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap}

/* ===== Шеф-чат ===== */
.ns-chat-layout{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:14px;
  height:calc(100vh - 280px);
  min-height:500px;
}
.ns-chat-sidebar{
  display:flex;
  flex-direction:column;
  gap:8px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px;
  overflow:hidden;
}
.ns-new-chat{width:100%;padding:10px}
.ns-chat-list{
  flex:1;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-top:8px;
}
.ns-chat-item{
  background:transparent;
  border:1px solid transparent;
  padding:8px 10px;
  text-align:left;
  cursor:pointer;
  border-radius:8px;
  transition:background .12s;
  font-family:inherit;
  color:var(--text);
}
.ns-chat-item:hover{background:var(--surface-2)}
.ns-chat-item-active{
  background:color-mix(in srgb,var(--primary) 12%,var(--surface-2));
  border-color:color-mix(in srgb,var(--primary) 30%,var(--line));
}
.ns-chat-item-title{
  font-weight:600;
  font-size:13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin-bottom:2px;
}
.ns-chat-item-meta{font-size:11px}

.ns-chat-main{
  display:flex;
  flex-direction:column;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
}
.ns-chat-header{
  display:flex;
  align-items:center;
  gap:8px;
  padding:14px 18px;
  border-bottom:1px solid var(--line);
}
.ns-chat-title{font-size:15px;font-weight:700}

.ns-chat-messages{
  flex:1;
  overflow-y:auto;
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.ns-chat-empty{
  margin:auto;
  text-align:center;
  padding:30px 20px;
}
.ns-chat-suggestions{
  margin-top:18px;
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:center;
}
.ns-suggestion{
  background:var(--surface-2);
  border:1px solid var(--line);
  padding:9px 14px;
  border-radius:20px;
  font-size:12px;
  cursor:pointer;
  font-family:inherit;
  color:var(--text);
  transition:background .12s, border-color .12s;
}
.ns-suggestion:hover{
  background:color-mix(in srgb,var(--primary) 10%,var(--surface-2));
  border-color:color-mix(in srgb,var(--primary) 35%,var(--line));
}

.ns-chat-system-msg{
  text-align:center;
  font-size:12px;
  padding:8px;
}

.ns-message{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.ns-msg-avatar{
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  background:var(--surface-2);
  border-radius:50%;
  flex-shrink:0;
}
.ns-message-user .ns-msg-avatar{
  background:linear-gradient(135deg, #245cf4, #5b8cf8);
}
.ns-message-assistant .ns-msg-avatar{
  background:linear-gradient(135deg, #a855f7, #ec4899);
  color:#fff;
}
.ns-msg-body{flex:1;min-width:0;max-width:calc(100% - 50px)}
.ns-msg-content{
  padding:10px 14px;
  background:var(--surface-2);
  border-radius:12px;
  font-size:14px;
  line-height:1.55;
  word-wrap:break-word;
}
.ns-message-user .ns-msg-content{
  background:color-mix(in srgb,var(--primary) 14%,var(--surface-2));
}
.ns-message-error .ns-msg-content{
  background:color-mix(in srgb,#d64a4a 12%,var(--surface-2));
  border-left:3px solid #d64a4a;
}
.ns-msg-content h2,.ns-msg-content h3,.ns-msg-content h4{
  margin:12px 0 6px;line-height:1.3;
}
.ns-msg-content h2{font-size:16px}
.ns-msg-content h3{font-size:14px;font-weight:700}
.ns-msg-content h4{font-size:13px;color:var(--primary)}
.ns-msg-content p{margin:6px 0}
.ns-msg-content ul,.ns-msg-content ol{margin:6px 0;padding-left:22px}
.ns-msg-content code{
  background:var(--surface);
  padding:1px 5px;
  border-radius:4px;
  font-size:12px;
}
.ns-msg-files{
  font-size:11px;
  color:var(--muted);
  margin-bottom:6px;
  padding:4px 8px;
  background:var(--surface);
  border-radius:6px;
  display:inline-block;
}

.ns-typing-dots{
  display:inline-block;
  animation:ns-blink 1.4s infinite;
}
@keyframes ns-blink {
  0%, 100% { opacity: .3 }
  50% { opacity: 1 }
}

.ns-chat-attached{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:0 14px;
}
.ns-chat-attached:not(:empty){padding:8px 14px;border-top:1px solid var(--line)}
.ns-attached-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:14px;
  font-size:11px;
}
.ns-attached-chip button{
  background:transparent;
  border:none;
  cursor:pointer;
  font-size:14px;
  color:var(--muted);
  line-height:1;
  padding:0 2px;
}
.ns-attached-chip button:hover{color:#d64a4a}

.ns-chat-input-row{
  display:flex;
  align-items:flex-end;
  gap:8px;
  padding:12px 14px;
  border-top:1px solid var(--line);
}
.ns-chat-attach-btn{
  background:var(--surface-2);
  border:1px solid var(--line);
  width:36px;
  height:36px;
  border-radius:8px;
  cursor:pointer;
  font-size:16px;
  flex-shrink:0;
}
.ns-chat-attach-btn:hover{background:var(--surface)}

.ns-chat-textarea{
  flex:1;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:8px;
  padding:9px 12px;
  font-size:14px;
  font-family:inherit;
  resize:none;
  color:var(--text);
  line-height:1.5;
  min-height:36px;
  max-height:200px;
  overflow-y:auto;
}
.ns-chat-textarea:focus{outline:none;border-color:var(--primary)}
.ns-chat-send{
  width:36px;
  height:36px;
  padding:0;
  font-size:18px;
  flex-shrink:0;
}

/* ===== Библиотека ===== */
.ns-section-title{
  font-size:14px;
  font-weight:700;
  margin:18px 0 10px;
}
.ns-library-controls{
  display:flex;
  gap:10px;
  margin-bottom:14px;
  flex-wrap:wrap;
}
.ns-library-controls .search-input{flex:1;min-width:240px}

.ns-library-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
  gap:10px;
  margin-bottom:18px;
}
.ns-library-card{
  display:flex;
  gap:10px;
  padding:12px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:10px;
  cursor:pointer;
  transition:border-color .12s, transform .12s;
}
.ns-library-card:hover{
  border-color:var(--primary);
  transform:translateY(-1px);
}
.ns-library-card-icon{font-size:24px;flex-shrink:0}
.ns-library-card-body{flex:1;min-width:0}
.ns-library-card-title{
  font-weight:600;
  font-size:13px;
  margin-bottom:3px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ns-library-card-stat{font-size:12px;margin-top:4px}

.ns-files-table-wrap{
  overflow-x:auto;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:10px;
}
.ns-files-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
}
.ns-files-table thead th{
  background:var(--surface-2);
  padding:9px 10px;
  text-align:left;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
}
.ns-files-table tbody td{
  padding:8px 10px;
  border-bottom:1px solid var(--line);
}
.ns-files-table .ns-num{text-align:right;font-family:'JetBrains Mono',monospace}

/* Mobile */
@media (max-width:760px){
  .ns-grid{grid-template-columns:1fr}
  .ns-chat-layout{
    grid-template-columns:1fr;
    height:calc(100vh - 200px);
  }
  .ns-chat-sidebar{
    max-height:140px;
    flex-direction:row;
  }
  .ns-new-chat{width:auto;flex-shrink:0}
  .ns-chat-list{flex-direction:row;overflow-x:auto;margin-top:0}
  .ns-chat-item{min-width:160px;flex-shrink:0}
  .ns-msg-content{font-size:13px}
  .ns-suggestion{font-size:11px}
  .ns-tabs{font-size:12px}
  .ns-tab{padding:8px 10px;font-size:12px}
}

/* ============================================================ */
/* НЕЙРОШЕФ 2.0 + НОВЫЕ МОДУЛИ (v15.52)                         */
/* ============================================================ */

/* ===== Hero-баннер ===== */
.ns2-hero{
  display:flex;
  gap:18px;
  align-items:center;
  padding:22px 26px;
  background:linear-gradient(135deg, #6366f1 0%, #a855f7 50%, #ec4899 100%);
  border-radius:16px;
  color:#fff;
  margin-bottom:20px;
  position:relative;
  overflow:hidden;
}
.ns2-hero::before{
  content:'';
  position:absolute;
  top:-50%; right:-10%;
  width:300px; height:300px;
  background:radial-gradient(circle, rgba(255,255,255,.15) 0%, transparent 60%);
  pointer-events:none;
}
.ns2-hero-icon{
  font-size:48px;
  flex-shrink:0;
  width:72px; height:72px;
  background:rgba(255,255,255,.2);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  backdrop-filter:blur(10px);
}
.ns2-hero-text{flex:1;min-width:0}
.ns2-hero-title{margin:0;font-size:22px;font-weight:800;letter-spacing:-.01em}
.ns2-hero-subtitle{margin:4px 0 0;font-size:13px;opacity:.9;line-height:1.5}
.ns2-hero-stats{
  display:flex;
  gap:14px;
  flex-shrink:0;
}
.ns2-stat{
  text-align:center;
  padding:10px 16px;
  background:rgba(255,255,255,.18);
  border-radius:12px;
  backdrop-filter:blur(10px);
  min-width:70px;
}
.ns2-stat-num{
  font-size:22px;
  font-weight:800;
  font-family:'JetBrains Mono', monospace;
  line-height:1;
}
.ns2-stat-lbl{
  font-size:10px;
  opacity:.85;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-top:4px;
}

/* ===== Sub-tabs (внутри Нейрошефа) ===== */
.ns2-subtabs{
  display:flex;
  gap:6px;
  margin-bottom:18px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  padding:6px;
  overflow-x:auto;
  scrollbar-width:none;
}
.ns2-subtabs::-webkit-scrollbar{display:none}
.ns2-subtab{
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 16px;
  background:transparent;
  border:none;
  border-radius:8px;
  font-size:13px;
  font-weight:600;
  color:var(--muted);
  cursor:pointer;
  font-family:inherit;
  white-space:nowrap;
  transition:all .15s;
}
.ns2-subtab:hover{background:var(--surface-2);color:var(--text)}
.ns2-subtab-active{
  background:linear-gradient(135deg, #a855f7, #ec4899);
  color:#fff;
  box-shadow:0 2px 8px rgba(168,85,247,.3);
}
.ns2-subtab-active:hover{
  background:linear-gradient(135deg, #a855f7, #ec4899);
  color:#fff;
}
.ns2-subtab-icon{font-size:16px}

.ns2-content{display:none}
.ns2-content-active{display:block}

/* ===== Panels ===== */
.ns2-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.ns2-panel{
  padding:22px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:16px;
  transition:border-color .15s;
}
.ns2-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:14px;
}
.ns2-panel-title{
  margin:0;
  font-size:15px;
  font-weight:700;
}
.ns2-badge{
  font-size:10px;
  padding:3px 9px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:10px;
  color:var(--muted);
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  white-space:nowrap;
}
.ns2-panel-result{min-height:340px}

/* ===== Dropzone ===== */
.ns2-dropzone{
  position:relative;
  border:2px dashed var(--line);
  border-radius:14px;
  padding:32px 20px;
  text-align:center;
  cursor:pointer;
  transition:all .2s;
  overflow:hidden;
}
.ns2-dropzone:hover, .ns2-dropzone-active{
  border-color:var(--primary);
  background:color-mix(in srgb,var(--primary) 6%,transparent);
}
.ns2-dropzone-active{
  transform:scale(1.01);
  border-color:#a855f7;
  background:color-mix(in srgb,#a855f7 8%,transparent);
}
.ns2-dropzone-pulse{
  position:absolute;
  top:50%; left:50%;
  width:0; height:0;
  border-radius:50%;
  background:radial-gradient(circle, color-mix(in srgb,var(--primary) 25%,transparent), transparent 70%);
  pointer-events:none;
  animation:ns2-pulse 3.2s infinite ease-out;
}
@keyframes ns2-pulse{
  0% { width:0; height:0; opacity:.6; transform:translate(-50%,-50%) }
  100% { width:340px; height:340px; opacity:0; transform:translate(-50%,-50%) }
}
.ns2-dropzone-content{position:relative;z-index:1}
.ns2-dropzone-icon{font-size:42px;margin-bottom:10px}
.ns2-dropzone-title{font-size:15px;font-weight:700;margin-bottom:6px}
.ns2-dropzone-or{
  font-size:11px;
  color:var(--muted);
  margin:8px 0;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.ns2-dropzone-btn{padding:9px 22px;font-weight:700}
.ns2-dropzone-hint{
  margin-top:14px;
  font-size:11px;
  color:var(--muted);
  line-height:1.5;
}

/* ===== Upload list ===== */
.ns2-upload-list{
  margin-top:14px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.ns2-upload-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  background:var(--surface-2);
  border-radius:10px;
  font-size:12px;
  border:1px solid transparent;
  transition:border-color .15s;
}
.ns2-upload-item:hover{border-color:var(--line)}
.ns2-upload-error{
  border-left:3px solid #d64a4a;
  background:color-mix(in srgb,#d64a4a 6%,var(--surface-2));
}
.ns2-upload-status{
  font-size:11px;
  font-weight:600;
  color:var(--muted);
  white-space:nowrap;
  flex-shrink:0;
}

/* ===== Toggle switches ===== */
.ns2-options{
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:10px;
}
.ns2-toggle{
  display:flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  user-select:none;
}
.ns2-toggle input{display:none}
.ns2-toggle-slider{
  width:36px;
  height:20px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  position:relative;
  transition:background .15s;
  flex-shrink:0;
}
.ns2-toggle-slider::after{
  content:'';
  position:absolute;
  top:2px; left:2px;
  width:14px; height:14px;
  background:var(--muted);
  border-radius:50%;
  transition:all .2s;
}
.ns2-toggle input:checked + .ns2-toggle-slider{
  background:linear-gradient(135deg, #a855f7, #ec4899);
  border-color:transparent;
}
.ns2-toggle input:checked + .ns2-toggle-slider::after{
  left:18px;
  background:#fff;
}
.ns2-toggle-label{font-size:13px;color:var(--text)}

/* ===== Empty state ===== */
.ns2-empty-state{
  text-align:center;
  padding:50px 24px;
  color:var(--muted);
}
.ns2-empty-icon{
  font-size:48px;
  opacity:.5;
  margin-bottom:14px;
}
.ns2-empty-title{
  font-size:14px;
  font-weight:700;
  color:var(--text);
  margin-bottom:6px;
}
.ns2-empty-hint{
  font-size:13px;
  line-height:1.7;
  max-width:340px;
  margin:0 auto;
}

.ns2-loading{
  text-align:center;
  padding:36px 20px;
  color:var(--muted);
  font-size:14px;
}

/* ===== Action buttons row ===== */
.ns2-action-row{
  margin-top:18px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.ns2-btn-icon{font-size:16px}

/* ===== AI-блок (унифицированный) ===== */
.ns2-ai-block{
  margin-top:14px;
  padding:18px;
  background:linear-gradient(135deg, color-mix(in srgb,#a855f7 6%,var(--surface)) 0%, var(--surface) 50%);
  border:1px solid color-mix(in srgb,#a855f7 25%,var(--line));
  border-radius:14px;
}
.ns2-ai-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  padding-bottom:14px;
  border-bottom:1px dashed var(--line);
}
.ns2-ai-avatar{
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg, #a855f7, #ec4899);
  border-radius:50%;
  font-size:22px;
  flex-shrink:0;
  box-shadow:0 4px 12px rgba(168,85,247,.3);
}
.ns2-ai-body{font-size:14px;line-height:1.7}
.ns2-ai-body h2{font-size:17px;margin:18px 0 8px;color:var(--text)}
.ns2-ai-body h3{font-size:15px;margin:14px 0 6px;color:var(--text);font-weight:700}
.ns2-ai-body h4{font-size:14px;margin:12px 0 4px;color:#a855f7;font-weight:700}
.ns2-ai-body p{margin:8px 0}
.ns2-ai-body ul, .ns2-ai-body ol{margin:8px 0;padding-left:24px}
.ns2-ai-body li{margin:4px 0}
.ns2-ai-body strong{color:var(--text)}
.ns2-ai-body code{background:var(--surface-2);padding:1px 6px;border-radius:4px;font-size:12px}
.ns2-ai-error{
  padding:14px 16px;
  background:color-mix(in srgb,#d64a4a 8%,transparent);
  border-left:3px solid #d64a4a;
  border-radius:8px;
  font-size:13px;
}

/* ===== Чат ===== */
.ns2-chat-wrap{
  display:grid;
  grid-template-columns:280px 1fr;
  gap:14px;
  height:calc(100vh - 320px);
  min-height:520px;
}
.ns2-chat-sidebar{
  display:flex;
  flex-direction:column;
  gap:10px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  overflow:hidden;
}
.ns2-new-chat{
  width:100%;
  padding:10px 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:700;
}
.ns2-chat-list{
  flex:1;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.ns2-chat-item{
  background:transparent;
  border:1px solid transparent;
  padding:10px 12px;
  text-align:left;
  cursor:pointer;
  border-radius:10px;
  font-family:inherit;
  color:var(--text);
  transition:all .12s;
}
.ns2-chat-item:hover{background:var(--surface-2)}
.ns2-chat-item-active{
  background:color-mix(in srgb,#a855f7 12%,var(--surface-2));
  border-color:color-mix(in srgb,#a855f7 30%,var(--line));
}
.ns2-chat-item-title{
  font-weight:600;
  font-size:13px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin-bottom:3px;
}
.ns2-chat-item-meta{font-size:11px;color:var(--muted)}

.ns2-chat-main{
  display:flex;
  flex-direction:column;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
}
.ns2-chat-header{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 18px;
  border-bottom:1px solid var(--line);
}
.ns2-chat-header-icon{
  width:38px; height:38px;
  background:linear-gradient(135deg, #a855f7, #ec4899);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  flex-shrink:0;
  box-shadow:0 2px 8px rgba(168,85,247,.25);
}
.ns2-chat-header-text{flex:1;min-width:0}
.ns2-chat-title{font-size:15px;font-weight:700}
.ns2-chat-subtitle{font-size:12px;color:var(--muted);margin-top:2px}
.ns2-chat-header-actions{display:flex;gap:4px}

.ns2-icon-btn{
  width:34px; height:34px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:8px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--muted);
  transition:all .12s;
  font-family:inherit;
  font-size:14px;
}
.ns2-icon-btn:hover{
  background:var(--surface);
  color:var(--text);
  border-color:var(--primary);
}

.ns2-chat-messages{
  flex:1;
  overflow-y:auto;
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.ns2-chat-welcome{
  margin:auto;
  text-align:center;
  padding:30px 20px;
  max-width:520px;
}
.ns2-welcome-icon{font-size:48px;margin-bottom:12px}
.ns2-welcome-title{font-size:18px;font-weight:800;margin-bottom:8px}
.ns2-welcome-text{
  font-size:13px;
  color:var(--muted);
  line-height:1.6;
  margin-bottom:18px;
}
.ns2-suggestions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  max-width:480px;
  margin:0 auto;
}
.ns2-suggestion{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  font-size:12px;
  font-family:inherit;
  color:var(--text);
  cursor:pointer;
  text-align:left;
  transition:all .12s;
}
.ns2-suggestion:hover{
  background:color-mix(in srgb,#a855f7 8%,var(--surface-2));
  border-color:color-mix(in srgb,#a855f7 35%,var(--line));
  transform:translateY(-1px);
}
.ns2-suggestion-icon{font-size:18px;flex-shrink:0}

/* Сообщения чата */
.ns2-message{
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.ns2-message-user{justify-content:flex-end}
.ns2-message-user .ns2-msg-body{align-items:flex-end}

.ns2-msg-avatar{
  width:34px; height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  border-radius:50%;
  flex-shrink:0;
  background:var(--surface-2);
}
.ns2-message-user .ns2-msg-avatar{
  background:linear-gradient(135deg, #245cf4, #5b8cf8);
  color:#fff;
  order:2;
}
.ns2-message-assistant .ns2-msg-avatar{
  background:linear-gradient(135deg, #a855f7, #ec4899);
  color:#fff;
}
.ns2-msg-body{
  display:flex;
  flex-direction:column;
  gap:4px;
  max-width:75%;
  min-width:0;
}
.ns2-msg-content{
  padding:12px 16px;
  background:var(--surface-2);
  border-radius:14px;
  font-size:14px;
  line-height:1.6;
  word-wrap:break-word;
  white-space:pre-wrap;
}
.ns2-message-user .ns2-msg-content{
  background:linear-gradient(135deg, color-mix(in srgb,#245cf4 18%,var(--surface-2)), color-mix(in srgb,#245cf4 8%,var(--surface-2)));
  border-top-right-radius:4px;
}
.ns2-message-assistant .ns2-msg-content{
  border-top-left-radius:4px;
  white-space:normal;
}
.ns2-msg-content h2,.ns2-msg-content h3,.ns2-msg-content h4{
  margin:14px 0 6px; line-height:1.3;
}
.ns2-msg-content h2{font-size:16px}
.ns2-msg-content h3{font-size:14px;font-weight:700}
.ns2-msg-content h4{font-size:13px;color:#a855f7}
.ns2-msg-content p{margin:6px 0}
.ns2-msg-content ul,.ns2-msg-content ol{margin:6px 0;padding-left:22px}
.ns2-msg-content code{
  background:var(--surface);
  padding:1px 5px;
  border-radius:4px;
  font-size:12px;
}
.ns2-msg-files{
  font-size:11px;
  color:var(--muted);
  padding:5px 10px;
  background:var(--surface);
  border-radius:8px;
  display:inline-block;
}

.ns2-typing-dots{
  display:inline-block;
  animation:ns2-blink 1.4s infinite;
}
@keyframes ns2-blink{0%,100%{opacity:.3}50%{opacity:1}}

.ns2-message-error .ns2-msg-content{
  background:color-mix(in srgb,#d64a4a 12%,var(--surface-2));
  border-left:3px solid #d64a4a;
}

.ns2-chat-attached{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:0 18px;
}
.ns2-chat-attached:not(:empty){padding:10px 18px;border-top:1px solid var(--line)}
.ns2-attached-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 10px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:14px;
  font-size:11px;
}
.ns2-attached-chip button{
  background:transparent;
  border:none;
  cursor:pointer;
  font-size:14px;
  color:var(--muted);
  padding:0 2px;
  line-height:1;
}
.ns2-attached-chip button:hover{color:#d64a4a}

.ns2-chat-input-row{
  display:flex;
  align-items:flex-end;
  gap:8px;
  padding:14px 16px 4px;
  border-top:1px solid var(--line);
}
.ns2-attach-btn{flex-shrink:0}

.ns2-chat-textarea{
  flex:1;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 14px;
  font-size:14px;
  font-family:inherit;
  resize:none;
  color:var(--text);
  line-height:1.5;
  min-height:38px;
  max-height:200px;
  overflow-y:auto;
  transition:border-color .15s;
}
.ns2-chat-textarea:focus{outline:none;border-color:var(--primary)}

.ns2-send-btn{
  width:38px; height:38px;
  background:linear-gradient(135deg, #a855f7, #ec4899);
  border:none;
  border-radius:10px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  flex-shrink:0;
  transition:transform .12s, box-shadow .12s;
  box-shadow:0 2px 8px rgba(168,85,247,.3);
}
.ns2-send-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 14px rgba(168,85,247,.45);
}
.ns2-send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}

.ns2-chat-hint{
  font-size:10px;
  text-align:center;
  padding:0 16px 10px;
  color:var(--muted);
}

/* ===== Библиотека ===== */
.ns2-library-controls{
  display:flex;
  gap:10px;
  margin-bottom:18px;
  flex-wrap:wrap;
}
.ns2-library-controls .search-input{flex:1;min-width:240px}

.ns2-library-content{display:flex;flex-direction:column;gap:18px}

.ns2-library-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
  gap:10px;
}
.ns2-library-card{
  display:flex;
  gap:12px;
  padding:14px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
  cursor:pointer;
  transition:all .15s;
}
.ns2-library-card:hover{
  border-color:#a855f7;
  transform:translateY(-2px);
  box-shadow:0 4px 14px rgba(0,0,0,.08);
}
.ns2-library-card-icon{font-size:26px;flex-shrink:0}
.ns2-library-card-body{flex:1;min-width:0}
.ns2-library-card-title{
  font-weight:700;
  font-size:13px;
  margin-bottom:3px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ns2-library-card-stat{font-size:11px;margin-top:6px;color:var(--muted)}
.ns2-library-card-stat strong{color:var(--text)}

.ns2-files-table-wrap{
  overflow-x:auto;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:12px;
}
.ns2-files-table{width:100%;border-collapse:collapse;font-size:13px}
.ns2-files-table thead th{
  background:var(--surface-2);
  padding:10px 12px;
  text-align:left;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.ns2-files-table tbody td{padding:10px 12px;border-bottom:1px solid var(--line)}
.ns2-files-table tbody tr:hover{background:var(--surface-2)}
.ns2-files-table .ns2-num{text-align:right;font-family:'JetBrains Mono',monospace}

.ns2-section-title{
  font-size:14px;
  font-weight:700;
  margin:8px 0 10px;
}

/* ============================================================ */
/* КАЛЬКУЛЯТОР ЧТО-ЕСЛИ                                        */
/* ============================================================ */

.wi-grid{
  display:grid;
  grid-template-columns:380px 1fr;
  gap:18px;
}
.wi-panel{
  padding:22px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:16px;
}
.wi-panel-result{min-height:520px}

.wi-source-tabs{
  display:flex;
  gap:4px;
  margin:12px 0 14px;
  background:var(--surface-2);
  border-radius:10px;
  padding:4px;
}
.wi-source-tab{
  flex:1;
  background:transparent;
  border:none;
  padding:7px 12px;
  border-radius:7px;
  font-size:12px;
  font-weight:600;
  color:var(--muted);
  cursor:pointer;
  font-family:inherit;
  transition:all .12s;
}
.wi-source-tab:hover{color:var(--text)}
.wi-source-tab-active{
  background:var(--surface);
  color:var(--text);
  box-shadow:0 1px 4px rgba(0,0,0,.06);
}

.wi-source-content{display:none}
.wi-source-active{display:block}

.wi-dish-list{
  max-height:440px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:10px;
}
.wi-dish-item{
  background:var(--surface-2);
  border:1px solid transparent;
  padding:10px 12px;
  border-radius:10px;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
  color:var(--text);
  transition:all .12s;
}
.wi-dish-item:hover{
  border-color:var(--primary);
  background:color-mix(in srgb,var(--primary) 6%,var(--surface-2));
}
.wi-dish-name{font-weight:600;font-size:13px;margin-bottom:4px}
.wi-dish-meta{display:flex;gap:10px;font-size:11px;color:var(--muted);flex-wrap:wrap}

.wi-manual-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.wi-field{
  display:flex;
  flex-direction:column;
  gap:5px;
}
.wi-field span{font-size:12px;font-weight:600;color:var(--muted)}
.wi-field input,.wi-field select,.wi-field textarea{
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:8px;
  padding:9px 12px;
  font-size:13px;
  font-family:inherit;
  color:var(--text);
}
.wi-field input:focus,.wi-field select:focus,.wi-field textarea:focus{
  outline:none;
  border-color:var(--primary);
}

.wi-dish-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  margin-bottom:18px;
  padding-bottom:14px;
  border-bottom:1px solid var(--line);
}
.wi-dish-title{margin:4px 0 0;font-size:18px;font-weight:800}

.wi-metrics{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:10px;
  margin-bottom:22px;
}
.wi-metric{
  padding:14px;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  transition:all .15s;
}
.wi-metric.wi-good{
  border-color:color-mix(in srgb,#23a56f 35%,var(--line));
  background:color-mix(in srgb,#23a56f 6%,var(--surface-2));
}
.wi-metric.wi-warn{
  border-color:color-mix(in srgb,#ef8b2d 35%,var(--line));
  background:color-mix(in srgb,#ef8b2d 6%,var(--surface-2));
}
.wi-metric.wi-bad{
  border-color:color-mix(in srgb,#d64a4a 35%,var(--line));
  background:color-mix(in srgb,#d64a4a 6%,var(--surface-2));
}
.wi-metric-label{
  font-size:10px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:600;
}
.wi-metric-value{
  font-size:20px;
  font-weight:800;
  font-family:'JetBrains Mono', monospace;
  margin:5px 0 3px;
}
.wi-metric-delta{
  font-size:10px;
  color:var(--muted);
}
.wi-metric-delta.wi-good{color:#23a56f}
.wi-metric-delta.wi-bad{color:#d64a4a}

/* Sliders */
.wi-sliders{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-bottom:22px;
  padding:18px;
  background:var(--surface-2);
  border-radius:12px;
}
.wi-slider-row{
  display:grid;
  grid-template-columns:130px 1fr 70px;
  align-items:center;
  gap:14px;
}
.wi-slider-label{
  font-size:12px;
  font-weight:600;
  color:var(--muted);
}
.wi-slider{
  width:100%;
  -webkit-appearance:none;
  appearance:none;
  height:6px;
  background:var(--surface);
  border-radius:3px;
  outline:none;
  cursor:pointer;
}
.wi-slider::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:18px; height:18px;
  border-radius:50%;
  background:linear-gradient(135deg, #a855f7, #ec4899);
  cursor:pointer;
  border:2px solid #fff;
  box-shadow:0 2px 6px rgba(168,85,247,.4);
}
.wi-slider::-moz-range-thumb{
  width:18px; height:18px;
  border-radius:50%;
  background:linear-gradient(135deg, #a855f7, #ec4899);
  cursor:pointer;
  border:2px solid #fff;
  box-shadow:0 2px 6px rgba(168,85,247,.4);
}
.wi-slider-value{
  font-size:14px;
  font-weight:800;
  font-family:'JetBrains Mono', monospace;
  text-align:right;
}
.wi-slider-value.wi-good{color:#23a56f}
.wi-slider-value.wi-bad{color:#d64a4a}

/* Forecast */
.wi-forecast{
  padding:18px;
  background:linear-gradient(135deg, color-mix(in srgb,var(--primary) 6%,var(--surface-2)), var(--surface-2));
  border:1px solid var(--line);
  border-radius:12px;
}
.wi-forecast-title{
  margin:0 0 12px;
  font-size:13px;
  font-weight:700;
}
.wi-forecast-grid{display:flex;flex-direction:column;gap:8px}
.wi-forecast-row{
  display:flex;
  justify-content:space-between;
  font-size:13px;
  padding:6px 0;
}
.wi-forecast-row strong{font-family:'JetBrains Mono', monospace;font-size:14px}
.wi-forecast-profit{
  border-top:1px solid var(--line);
  padding-top:10px;
  margin-top:4px;
}
.wi-forecast-profit strong{font-size:18px}
.wi-forecast-delta{font-size:12px;color:var(--muted)}

/* ============================================================ */
/* ДИЗАЙНЕР МЕНЮ + ПОИСК ПОТЕРЬ                                */
/* ============================================================ */

.md-layout, .ls-layout{
  display:grid;
  grid-template-columns:380px 1fr;
  gap:18px;
}
.md-result{min-height:600px}

.md-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.ls-data-checks{
  margin:14px 0;
  padding:14px;
  background:var(--surface-2);
  border-radius:10px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.ls-data-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:13px;
}
.ls-data-label{color:var(--muted)}
.ls-data-status{
  font-size:11px;
  font-weight:600;
  font-family:'JetBrains Mono', monospace;
  padding:2px 8px;
  background:var(--surface);
  border-radius:6px;
  border:1px solid var(--line);
}

/* ============================================================ */
/* MOBILE                                                       */
/* ============================================================ */

@media (max-width:900px){
  .ns2-grid-2{grid-template-columns:1fr}
  .wi-grid, .md-layout, .ls-layout{grid-template-columns:1fr}
  .wi-metrics{grid-template-columns:repeat(2, 1fr)}
}

@media (max-width:760px){
  .ns2-hero{
    flex-direction:column;
    text-align:center;
    padding:18px 16px;
    gap:14px;
  }
  .ns2-hero-icon{width:56px;height:56px;font-size:32px}
  .ns2-hero-title{font-size:18px}
  .ns2-hero-subtitle{font-size:12px}
  .ns2-hero-stats{gap:10px;width:100%;justify-content:space-around}
  .ns2-stat{padding:8px 12px;flex:1}
  .ns2-stat-num{font-size:18px}

  .ns2-subtab{padding:8px 10px;font-size:11px;gap:5px}
  .ns2-subtab-icon{font-size:14px}
  .ns2-subtab-label{font-size:11px}

  .ns2-panel{padding:16px}
  .ns2-dropzone{padding:24px 14px}
  .ns2-dropzone-icon{font-size:32px}
  .ns2-dropzone-title{font-size:13px}

  .ns2-suggestions{grid-template-columns:1fr}

  .ns2-chat-wrap{
    grid-template-columns:1fr;
    height:calc(100vh - 240px);
  }
  .ns2-chat-sidebar{
    max-height:130px;
    flex-direction:row;
    align-items:center;
    padding:10px;
  }
  .ns2-new-chat{flex-shrink:0;width:auto;padding:8px 12px}
  .ns2-chat-list{
    flex-direction:row;
    overflow-x:auto;
    overflow-y:hidden;
  }
  .ns2-chat-item{min-width:170px;flex-shrink:0}
  .ns2-msg-body{max-width:85%}
  .ns2-msg-content{font-size:13px}

  .wi-metrics{grid-template-columns:1fr 1fr;gap:8px}
  .wi-metric-value{font-size:17px}
  .wi-slider-row{
    grid-template-columns:1fr;
    gap:6px;
  }
  .wi-slider-label{font-size:11px}
  .wi-slider-value{text-align:left;font-size:13px}
}

/* Guide features list (v15.53) */
.guide-feature-list{
  margin:8px 0 0;
  padding-left:22px;
  font-size:13px;
  line-height:1.7;
  color:var(--text);
}
.guide-feature-list li{margin:4px 0}
.guide-feature-list code{
  background:var(--surface-2);
  padding:1px 6px;
  border-radius:4px;
  font-size:12px;
}
.guide-feature-list a{color:var(--primary);text-decoration:none}
.guide-feature-list a:hover{text-decoration:underline}

/* ============================================================ */
/* НАСТРОЙКИ 2.0 — современный дизайн (v15.54)                  */
/* ============================================================ */

/* Контейнер страницы настроек */
.settings-page-2 {
  display: grid;
  gap: 18px;
  max-width: 1100px;
  margin: 0 auto;
}

/* Tab-навигация в верхней части */
.settings-nav {
  display: flex;
  gap: 4px;
  padding: 4px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow-x: auto;
  scrollbar-width: none;
  position: sticky;
  top: 0;
  z-index: 10;
  backdrop-filter: blur(10px);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
}
.settings-nav::-webkit-scrollbar { display: none; }

.settings-nav-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: transparent;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  font-family: inherit;
  white-space: nowrap;
  transition: all .15s;
}
.settings-nav-item:hover { color: var(--text); background: var(--surface-2); }
.settings-nav-item-active {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--primary) 30%, transparent);
}
.settings-nav-item-active:hover {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
}
.settings-nav-icon { font-size: 16px; }

/* Контент-секция (карточка настроек) */
.s2-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 24px;
  transition: border-color .15s;
}
.s2-card + .s2-card { margin-top: 14px; }

.s2-card-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px dashed var(--line);
}
.s2-card-icon {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--surface-2);
  border-radius: 12px;
  font-size: 22px;
}
.s2-card-icon-grad {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 60%, #5b8cf8));
  color: #fff;
}
.s2-card-icon-ai {
  background: linear-gradient(135deg, #a855f7, #ec4899);
  color: #fff;
}
.s2-card-icon-push {
  background: linear-gradient(135deg, #f59e0b, #ef4444);
  color: #fff;
}
.s2-card-icon-tg {
  background: linear-gradient(135deg, #0088cc, #229ed9);
  color: #fff;
}
.s2-card-icon-iiko {
  background: linear-gradient(135deg, #fc6c4f, #f59e0b);
  color: #fff;
}
.s2-card-icon-finance {
  background: linear-gradient(135deg, #23a56f, #5cc294);
  color: #fff;
}
.s2-card-icon-restaurant {
  background: linear-gradient(135deg, #d64a4a, #ef8b2d);
  color: #fff;
}

.s2-card-title-block { flex: 1; min-width: 0; }
.s2-card-title {
  font-size: 17px;
  font-weight: 800;
  margin: 0 0 4px;
  line-height: 1.2;
}
.s2-card-subtitle {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.5;
  margin: 0;
}
.s2-card-status {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 8px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.s2-status-good { background: color-mix(in srgb, #23a56f 15%, transparent); color: #23a56f; }
.s2-status-warn { background: color-mix(in srgb, #ef8b2d 15%, transparent); color: #ef8b2d; }
.s2-status-bad  { background: color-mix(in srgb, #d64a4a 15%, transparent); color: #d64a4a; }
.s2-status-neutral { background: var(--surface-2); color: var(--muted); }

/* Тело карточки */
.s2-card-body { display: flex; flex-direction: column; gap: 16px; }

/* Поля формы */
.s2-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.s2-field-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.s2-field-input,
.s2-field-select,
.s2-field-textarea {
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 11px 14px;
  font-size: 14px;
  font-family: inherit;
  color: var(--text);
  transition: border-color .12s;
  width: 100%;
}
.s2-field-input:focus,
.s2-field-select:focus,
.s2-field-textarea:focus {
  outline: none;
  border-color: var(--primary);
  background: var(--surface);
}
.s2-field-hint {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
}
.s2-field-hint a { color: var(--primary); text-decoration: none; }
.s2-field-hint a:hover { text-decoration: underline; }

/* Грид полей */
.s2-fields-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}

/* Toggle row (поле + переключатель в строке) */
.s2-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  background: var(--surface-2);
  border-radius: 12px;
  border: 1px solid transparent;
  transition: border-color .12s;
}
.s2-toggle-row:hover { border-color: var(--line); }
.s2-toggle-row-text { flex: 1; min-width: 0; }
.s2-toggle-row-title { font-size: 14px; font-weight: 600; }
.s2-toggle-row-desc { font-size: 12px; color: var(--muted); margin-top: 2px; }

/* Современный toggle */
.s2-toggle {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 24px;
  flex-shrink: 0;
}
.s2-toggle input { opacity: 0; width: 0; height: 0; }
.s2-toggle-slider {
  position: absolute;
  cursor: pointer;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 24px;
  transition: all .25s;
}
.s2-toggle-slider::before {
  position: absolute;
  content: "";
  height: 18px; width: 18px;
  left: 2px; bottom: 2px;
  background: var(--muted);
  border-radius: 50%;
  transition: all .25s;
}
.s2-toggle input:checked + .s2-toggle-slider {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 60%, #5b8cf8));
  border-color: transparent;
}
.s2-toggle input:checked + .s2-toggle-slider::before {
  transform: translateX(20px);
  background: #fff;
}

/* Action buttons row */
.s2-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 8px;
  border-top: 1px dashed var(--line);
}

/* Info block (с иконкой и текстом, для подсказок) */
.s2-info {
  display: flex;
  gap: 12px;
  padding: 14px 16px;
  background: color-mix(in srgb, var(--primary) 6%, var(--surface-2));
  border-left: 3px solid var(--primary);
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.6;
}
.s2-info-icon { font-size: 18px; flex-shrink: 0; }
.s2-info-content { flex: 1; }
.s2-info-content code {
  background: var(--surface);
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 12px;
}
.s2-info-content a { color: var(--primary); text-decoration: none; font-weight: 600; }
.s2-info-content a:hover { text-decoration: underline; }

.s2-info-warn {
  background: color-mix(in srgb, #ef8b2d 8%, var(--surface-2));
  border-left-color: #ef8b2d;
}
.s2-info-success {
  background: color-mix(in srgb, #23a56f 8%, var(--surface-2));
  border-left-color: #23a56f;
}

/* Stat badge */
.s2-stat-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--surface-2);
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
}
.s2-stat-pill strong { font-family: 'JetBrains Mono', monospace; color: var(--text); }

/* Push subscriptions visualization */
.s2-push-status-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}
.s2-push-stat-card {
  padding: 16px;
  background: var(--surface-2);
  border-radius: 12px;
  text-align: center;
}
.s2-push-stat-num {
  font-size: 28px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  margin-bottom: 4px;
}
.s2-push-stat-label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
}

@media (max-width: 760px) {
  .s2-card { padding: 18px; }
  .s2-card-head { gap: 10px; padding-bottom: 12px; margin-bottom: 14px; }
  .s2-card-icon { width: 38px; height: 38px; font-size: 18px; }
  .s2-card-title { font-size: 15px; }
  .s2-card-subtitle { font-size: 12px; }
  .settings-nav-item { padding: 8px 12px; font-size: 12px; }
  .settings-nav-icon { font-size: 14px; }
}

/* ============================================================ */
/* ПЛАВАЮЩИЙ AI-ЧАТ ВИДЖЕТ (Jivo-style) (v15.54)                */
/* ============================================================ */

.aifab {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  pointer-events: none;
}

.aifab-button {
  width: 60px;
  height: 60px;
  border: none;
  border-radius: 50%;
  background: linear-gradient(135deg, #245cf4, #5b8cf8);
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 24px rgba(36, 92, 244, .35), 0 2px 8px rgba(0,0,0,.1);
  transition: transform .2s, box-shadow .2s;
  position: relative;
  font-family: inherit;
}
.aifab-button:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 10px 32px rgba(36, 92, 244, .45);
}
.aifab-button-active {
  transform: rotate(90deg);
}

.aifab-pulse {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: linear-gradient(135deg, #245cf4, #5b8cf8);
  animation: aifab-pulse 2s infinite;
  z-index: -1;
}
@keyframes aifab-pulse {
  0%   { transform: scale(1); opacity: .6; }
  100% { transform: scale(1.4); opacity: 0; }
}

.aifab-tooltip {
  position: absolute;
  right: calc(100% + 14px);
  top: 50%;
  transform: translateY(-50%);
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--line);
  padding: 8px 14px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity .15s, visibility .15s;
  box-shadow: 0 4px 12px rgba(0,0,0,.08);
}
.aifab-button:hover .aifab-tooltip {
  opacity: 1;
  visibility: visible;
}

/* Окно чата */
.aifab-window {
  width: 380px;
  height: 540px;
  max-width: calc(100vw - 32px);
  max-height: calc(100vh - 110px);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  pointer-events: auto;
  display: none;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.18), 0 4px 12px rgba(0,0,0,.08);
  animation: aifab-popin .3s cubic-bezier(.34, 1.56, .64, 1);
  transform-origin: bottom right;
}
@keyframes aifab-popin {
  from { transform: scale(.7) translateY(20px); opacity: 0; }
  to   { transform: scale(1) translateY(0); opacity: 1; }
}
.aifab-window-open { display: flex; }

.aifab-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  background: linear-gradient(135deg, #245cf4, #5b8cf8);
  color: #fff;
}
.aifab-header-avatar {
  width: 40px;
  height: 40px;
  background: rgba(255,255,255,.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
  backdrop-filter: blur(10px);
}
.aifab-header-text { flex: 1; min-width: 0; }
.aifab-header-title { font-size: 15px; font-weight: 700; }
.aifab-header-subtitle { font-size: 11px; opacity: .85; margin-top: 2px; }
.aifab-header-close {
  width: 30px; height: 30px;
  background: rgba(255,255,255,.2);
  border: none;
  border-radius: 8px;
  color: #fff;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
  flex-shrink: 0;
}
.aifab-header-close:hover { background: rgba(255,255,255,.3); }

.aifab-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--surface-2);
}

.aifab-msg {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  max-width: 90%;
  font-size: 13px;
  line-height: 1.55;
}
.aifab-msg-assistant { align-self: flex-start; }
.aifab-msg-user { align-self: flex-end; flex-direction: row-reverse; }

.aifab-msg-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex-shrink: 0;
}
.aifab-msg-assistant .aifab-msg-avatar {
  background: linear-gradient(135deg, #245cf4, #5b8cf8);
  color: #fff;
}
.aifab-msg-user .aifab-msg-avatar {
  background: var(--surface);
  border: 1px solid var(--line);
}

.aifab-msg-bubble {
  padding: 10px 14px;
  background: var(--surface);
  border-radius: 14px;
  border: 1px solid var(--line);
  word-wrap: break-word;
}
.aifab-msg-user .aifab-msg-bubble {
  background: linear-gradient(135deg, #245cf4, #5b8cf8);
  color: #fff;
  border: none;
}
.aifab-msg-bubble h3, .aifab-msg-bubble h4 {
  margin: 8px 0 4px;
  font-size: 13px;
  font-weight: 700;
}
.aifab-msg-bubble p { margin: 4px 0; }
.aifab-msg-bubble ul, .aifab-msg-bubble ol { margin: 4px 0; padding-left: 18px; }
.aifab-msg-bubble li { margin: 2px 0; }
.aifab-msg-bubble code {
  background: var(--surface-2);
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 11px;
}

.aifab-empty {
  text-align: center;
  padding: 30px 16px;
  color: var(--muted);
}
.aifab-empty-icon { font-size: 36px; margin-bottom: 10px; opacity: .5; }
.aifab-empty-title { font-size: 13px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
.aifab-empty-text { font-size: 12px; line-height: 1.5; }

.aifab-suggestions {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 14px;
}
.aifab-suggestion {
  background: var(--surface);
  border: 1px solid var(--line);
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 12px;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
  color: var(--text);
  transition: all .12s;
}
.aifab-suggestion:hover {
  background: color-mix(in srgb, var(--primary) 8%, var(--surface));
  border-color: var(--primary);
}

.aifab-typing {
  display: inline-block;
  animation: ns2-blink 1.4s infinite;
}

.aifab-input-row {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 12px 14px;
  border-top: 1px solid var(--line);
  background: var(--surface);
}
.aifab-textarea {
  flex: 1;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 13px;
  font-family: inherit;
  color: var(--text);
  resize: none;
  min-height: 36px;
  max-height: 120px;
  line-height: 1.4;
}
.aifab-textarea:focus { outline: none; border-color: var(--primary); }

.aifab-send {
  width: 36px;
  height: 36px;
  border: none;
  background: linear-gradient(135deg, #245cf4, #5b8cf8);
  border-radius: 10px;
  color: #fff;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.aifab-send:hover { transform: translateY(-1px); box-shadow: 0 3px 10px rgba(36,92,244,.3); }
.aifab-send:disabled { opacity: .4; cursor: not-allowed; transform: none; }

@media (max-width: 760px) {
  .aifab { right: 16px; bottom: 16px; }
  .aifab-window {
    width: calc(100vw - 32px);
    height: calc(100vh - 100px);
    max-height: 600px;
  }
  .aifab-button { width: 52px; height: 52px; font-size: 24px; }
}

/* ============================================================ */
/* ЛЕВОЕ МЕНЮ 2.0 — современный креативный дизайн (v15.54)      */
/* ============================================================ */

.sidebar {
  /* Можно оставить существующие переменные, переопределим */
}

/* Логотип-баннер */
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 16px;
  margin: 0 0 10px;
  background: linear-gradient(135deg, color-mix(in srgb, #245cf4 12%, transparent), color-mix(in srgb, #5b8cf8 8%, transparent));
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, #245cf4 20%, var(--line));
}
.sidebar-brand-logo {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, #245cf4, #5b8cf8);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(36, 92, 244, .3);
}
.sidebar-brand-text { flex: 1; min-width: 0; }
.sidebar-brand-name {
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -.01em;
}
.sidebar-brand-tag {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 2px;
}

/* Скрываем брендинг в свернутом сайдбаре */
.sidebar-collapsed .sidebar-brand {
  padding: 8px;
  justify-content: center;
}
.sidebar-collapsed .sidebar-brand-text { display: none; }

/* Секции навигации с новым стилем */
.nav-section-2 { margin-bottom: 6px; }

.nav-section-title-2 {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 12px 14px 6px;
  background: transparent;
  border: none;
  font-family: inherit;
  font-size: 10px;
  font-weight: 800;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .1em;
  cursor: pointer;
  text-align: left;
}
.nav-section-arrow-2 {
  display: inline-block;
  font-size: 8px;
  transition: transform .2s;
  opacity: .5;
}
.nav-section-collapsed .nav-section-arrow-2 { transform: rotate(-90deg); }

/* Пункты меню — стилизованные строки */
.nav-item-2 {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 10px 14px;
  background: transparent;
  border: none;
  border-radius: 10px;
  font-family: inherit;
  font-size: 14px;
  color: var(--text);
  cursor: pointer;
  text-align: left;
  position: relative;
  transition: all .15s;
  margin-bottom: 2px;
}
.nav-item-2:hover {
  background: var(--surface-2);
  transform: translateX(2px);
}
.nav-item-2-active {
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 18%, transparent), color-mix(in srgb, var(--primary) 6%, transparent));
  color: var(--primary);
  font-weight: 700;
}
.nav-item-2-active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 22px;
  background: var(--primary);
  border-radius: 0 3px 3px 0;
}
.nav-item-2-active:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 22%, transparent), color-mix(in srgb, var(--primary) 8%, transparent));
}

.nav-ico-2 {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
  background: var(--surface);
  border-radius: 8px;
  border: 1px solid var(--line);
  transition: all .15s;
}
.nav-item-2:hover .nav-ico-2 {
  background: var(--surface-2);
}
.nav-item-2-active .nav-ico-2 {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
  border-color: transparent;
  box-shadow: 0 2px 6px color-mix(in srgb, var(--primary) 25%, transparent);
}
.nav-label-2 { flex: 1; }

/* Бейдж (счётчик / "новое" / "AI") */
.nav-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 7px;
  background: linear-gradient(135deg, #a855f7, #ec4899);
  color: #fff;
  border-radius: 10px;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.nav-badge-new {
  background: linear-gradient(135deg, #23a56f, #5cc294);
}
.nav-badge-ai {
  background: linear-gradient(135deg, #a855f7, #ec4899);
}

/* Свернутый сайдбар */
.sidebar-collapsed .nav-section-title-2 { display: none; }
.sidebar-collapsed .nav-label-2,
.sidebar-collapsed .nav-badge { display: none; }
.sidebar-collapsed .nav-item-2 {
  justify-content: center;
  padding: 10px;
}
.sidebar-collapsed .nav-item-2-active::before { display: none; }


/* ============================================================ */
/* Применение нового стиля к существующему сайдбару (v15.54)    */
/* ============================================================ */

/* Полностью переопределяю стили сайдбара поверх старых */
.sidebar .nav-section { margin-bottom: 6px; }

.sidebar .nav-section-title {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 14px 14px 6px;
  background: transparent;
  border: none;
  font-family: inherit;
  font-size: 10px !important;
  font-weight: 800;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .1em;
  cursor: pointer;
  text-align: left;
}

.sidebar .nav-section-arrow {
  display: inline-block;
  font-size: 9px;
  transition: transform .2s;
  opacity: .5;
}

.sidebar .nav-section.nav-collapsed .nav-section-arrow,
.sidebar .nav-section[data-collapsed="true"] .nav-section-arrow {
  transform: rotate(-90deg);
}

.sidebar .nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 10px 14px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 10px !important;
  font-family: inherit !important;
  font-size: 14px !important;
  color: var(--text) !important;
  cursor: pointer !important;
  text-align: left !important;
  position: relative !important;
  transition: all .15s !important;
  margin-bottom: 2px !important;
}

.sidebar .nav-item:hover {
  background: var(--surface-2) !important;
  transform: translateX(2px);
}

.sidebar .nav-item.active {
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 16%, transparent), color-mix(in srgb, var(--primary) 5%, transparent)) !important;
  color: var(--primary) !important;
  font-weight: 700 !important;
}

.sidebar .nav-item.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 22px;
  background: var(--primary);
  border-radius: 0 3px 3px 0;
}

.sidebar .nav-ico {
  width: 30px !important;
  height: 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
  background: var(--surface) !important;
  border-radius: 8px !important;
  border: 1px solid var(--line) !important;
  transition: all .15s;
}

.sidebar .nav-item:hover .nav-ico {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line)) !important;
}

.sidebar .nav-item.active .nav-ico {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8)) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--primary) 30%, transparent);
}

.sidebar .nav-label { flex: 1; }

/* ============================================================ */
/* НАСТРОЙКИ — поверх существующих классов (v15.54)             */
/* ============================================================ */

#page-settings .section-top {
  margin-bottom: 22px;
}

#page-settings .settings-grid {
  display: grid;
  gap: 16px;
  max-width: 1100px;
  margin: 0 auto;
  grid-template-columns: 1fr;
}

/* Карточка секции */
#page-settings .surface.settings-section,
#page-settings article.surface {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 16px !important;
  padding: 24px !important;
  transition: border-color .15s, transform .15s;
}
#page-settings .surface.settings-section:hover,
#page-settings article.surface:hover {
  border-color: color-mix(in srgb, var(--primary) 20%, var(--line)) !important;
}

#page-settings .settings-section-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--line);
}

#page-settings .settings-section-head > div:first-child {
  flex: 1;
  min-width: 0;
}

#page-settings .settings-section-title {
  font-size: 16px !important;
  font-weight: 800 !important;
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}

#page-settings .settings-section-subtitle {
  font-size: 13px !important;
  color: var(--muted) !important;
  line-height: 1.5;
  margin: 0 !important;
}

/* Status chip — современный */
#page-settings .settings-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
  flex-shrink: 0;
}
#page-settings .settings-status.good {
  background: color-mix(in srgb, #23a56f 14%, transparent) !important;
  color: #23a56f !important;
}
#page-settings .settings-status.warn {
  background: color-mix(in srgb, #ef8b2d 14%, transparent) !important;
  color: #ef8b2d !important;
}
#page-settings .settings-status.bad {
  background: color-mix(in srgb, #d64a4a 14%, transparent) !important;
  color: #d64a4a !important;
}
#page-settings .settings-status.neutral {
  background: var(--surface-2) !important;
  color: var(--muted) !important;
}

/* Поля */
#page-settings .field {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
#page-settings .field > span {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--muted) !important;
  text-transform: uppercase;
  letter-spacing: .04em;
}
#page-settings .field input,
#page-settings .field select,
#page-settings .field textarea {
  background: var(--surface-2) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  padding: 11px 14px !important;
  font-size: 14px !important;
  font-family: inherit !important;
  color: var(--text) !important;
  transition: border-color .12s, background .12s;
  width: 100%;
}
#page-settings .field input:focus,
#page-settings .field select:focus,
#page-settings .field textarea:focus {
  outline: none !important;
  border-color: var(--primary) !important;
  background: var(--surface) !important;
}
#page-settings .field-hint {
  font-size: 11px !important;
  line-height: 1.5;
}

#page-settings .form-grid-2 {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 14px !important;
}

/* Action row */
#page-settings .actions-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 14px;
  margin-top: 14px;
  border-top: 1px dashed var(--line);
}

/* Промо-блок (как у DeepSeek) — стилизуем под современный info-block */
#page-settings .ai-deepseek-promo {
  display: flex !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  background: linear-gradient(135deg, color-mix(in srgb, #a855f7 7%, var(--surface-2)), color-mix(in srgb, #ec4899 4%, var(--surface-2))) !important;
  border-left: 3px solid #a855f7 !important;
  border-radius: 10px !important;
  margin: 0 !important;
}
#page-settings .ai-deepseek-promo-icon {
  font-size: 24px !important;
  flex-shrink: 0;
}
#page-settings .ai-deepseek-promo-title {
  font-size: 13px !important;
  font-weight: 700 !important;
  margin-bottom: 4px !important;
}
#page-settings .ai-deepseek-promo-hint {
  font-size: 12px !important;
  line-height: 1.6 !important;
  color: var(--muted) !important;
}

/* Toggle переключатель — модерн */
#page-settings .switch-toggle {
  position: relative;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}
#page-settings .switch-toggle input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
#page-settings .switch-slider {
  position: relative;
  display: inline-block;
  width: 44px !important;
  height: 24px !important;
  background: var(--surface-2) !important;
  border: 1px solid var(--line) !important;
  border-radius: 24px !important;
  transition: all .25s;
  flex-shrink: 0;
}
#page-settings .switch-slider::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  background: var(--muted);
  border-radius: 50%;
  transition: all .25s;
}
#page-settings .switch-toggle input:checked + .switch-slider,
#page-settings .switch-toggle input:checked ~ .switch-slider {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 60%, #5b8cf8)) !important;
  border-color: transparent !important;
}
#page-settings .switch-toggle input:checked + .switch-slider::before,
#page-settings .switch-toggle input:checked ~ .switch-slider::before {
  transform: translateX(20px);
  background: #fff;
}

#page-settings .switch-label {
  font-size: 13px;
  color: var(--text);
}

/* ===== Push секция — отдельные стили внутри ===== */
#page-settings .push-info {
  padding: 12px 14px;
  background: color-mix(in srgb, #f59e0b 8%, var(--surface-2));
  border-left: 3px solid #f59e0b;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.6;
  margin-bottom: 16px !important;
}


/* ============================================================ */
/* Локальные инструкции на страницах модулей (v15.54)           */
/* ============================================================ */

.module-help-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 12px;
  color: var(--muted);
  cursor: pointer;
  font-family: inherit;
  transition: all .12s;
}
.module-help-btn:hover {
  background: color-mix(in srgb, var(--primary) 8%, var(--surface));
  border-color: var(--primary);
  color: var(--primary);
}

.module-help-content {
  margin-top: 14px;
  margin-bottom: 18px;
  padding: 18px 22px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 6%, var(--surface)), var(--surface));
  border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line));
  border-radius: 14px;
  display: none;
}
.module-help-content.module-help-open { display: block; }
.module-help-content h4 {
  font-size: 14px;
  font-weight: 700;
  margin: 12px 0 6px;
}
.module-help-content h4:first-child { margin-top: 0; }
.module-help-content p { font-size: 13px; line-height: 1.6; margin: 6px 0; }
.module-help-content ul, .module-help-content ol { font-size: 13px; line-height: 1.7; padding-left: 22px; margin: 6px 0; }
.module-help-content li { margin: 3px 0; }
.module-help-content code {
  background: var(--surface-2);
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 12px;
}


/* section-top — поддержка help-кнопки справа (v15.54) */
.section-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  flex-wrap: wrap;
}
.section-top > div:first-child { flex: 1; min-width: 240px; }

/* AI-виджет скрывается через JS-класс (body:has не везде работает) */
body.aifab-hidden .aifab { display: none; }

/* ============================================================ */
/* ЛЕВОЕ МЕНЮ rail — финальный редизайн (v15.54.1)              */
/* ============================================================ */

aside.rail {
  background: var(--surface) !important;
}

/* Брендинг сверху */
.rail .brand-tile {
  display: flex !important;
  align-items: center;
  gap: 12px;
  padding: 16px 14px !important;
  margin: 8px 8px 14px !important;
  background: linear-gradient(135deg, color-mix(in srgb, #245cf4 14%, transparent), color-mix(in srgb, #5b8cf8 8%, transparent)) !important;
  border-radius: 14px !important;
  border: 1px solid color-mix(in srgb, #245cf4 18%, var(--line)) !important;
}

.rail .brand-avatar {
  width: 42px !important;
  height: 42px !important;
  background: linear-gradient(135deg, #245cf4, #5b8cf8) !important;
  border-radius: 12px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #fff !important;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(36, 92, 244, 0.3);
  font-family: inherit !important;
  letter-spacing: -.5px;
}

.rail .brand-meta { flex: 1; min-width: 0; }
.rail .brand-title {
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rail .brand-subtitle {
  font-size: 10px !important;
  color: var(--muted) !important;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Секции */
.rail .nav-grid { padding: 0 8px !important; }
.rail .nav-section { margin-bottom: 4px !important; }

.rail .nav-section-title {
  display: flex !important;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 14px 10px 6px !important;
  background: transparent !important;
  border: none !important;
  font-family: inherit !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  color: var(--muted) !important;
  text-transform: uppercase;
  letter-spacing: .1em;
  cursor: pointer;
  text-align: left;
}
.rail .nav-section-title span:not(.nav-section-arrow) {
  flex: 1;
}

.rail .nav-section-arrow {
  display: inline-block;
  font-size: 8px;
  transition: transform .2s;
  opacity: .5;
}

.rail .nav-section.collapsed .nav-section-arrow,
.rail .nav-section[data-collapsed="true"] .nav-section-arrow {
  transform: rotate(-90deg);
}
.rail .nav-section.collapsed .nav-section-body,
.rail .nav-section[data-collapsed="true"] .nav-section-body {
  display: none;
}

/* Пункты меню */
.rail .nav-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 10px 12px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 10px !important;
  font-family: inherit !important;
  font-size: 14px !important;
  color: var(--text) !important;
  cursor: pointer !important;
  text-align: left !important;
  position: relative !important;
  transition: all .15s !important;
  margin-bottom: 2px !important;
}

.rail .nav-item:hover {
  background: var(--surface-2) !important;
  transform: translateX(2px);
}

.rail .nav-item.active {
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 16%, transparent), color-mix(in srgb, var(--primary) 5%, transparent)) !important;
  color: var(--primary) !important;
  font-weight: 700 !important;
}

.rail .nav-item.active::before {
  content: "";
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 22px;
  background: var(--primary);
  border-radius: 0 3px 3px 0;
}

/* Иконки */
.rail .nav-item .nav-ico {
  width: 30px !important;
  height: 30px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
  background: var(--surface-2) !important;
  border-radius: 8px !important;
  border: 1px solid var(--line) !important;
  transition: all .15s;
}

.rail .nav-item:hover .nav-ico {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line)) !important;
  background: var(--surface) !important;
}

.rail .nav-item.active .nav-ico {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8)) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--primary) 35%, transparent);
}

.rail .nav-item .nav-label {
  flex: 1;
}

/* Cтили специально для секции AI */
.rail .nav-section-ai .nav-section-title { color: #a855f7 !important; }
.rail .nav-section-ai .nav-item.active {
  background: linear-gradient(135deg, color-mix(in srgb, #a855f7 16%, transparent), color-mix(in srgb, #ec4899 8%, transparent)) !important;
  color: #a855f7 !important;
}
.rail .nav-section-ai .nav-item.active::before { background: #a855f7; }
.rail .nav-section-ai .nav-item.active .nav-ico {
  background: linear-gradient(135deg, #a855f7, #ec4899) !important;
}

/* Свернутый rail */
@media (max-width: 1100px) {
  .rail.collapsed .brand-meta { display: none; }
  .rail.collapsed .brand-tile { padding: 8px !important; justify-content: center; }
  .rail.collapsed .nav-section-title { display: none; }
  .rail.collapsed .nav-item { justify-content: center; padding: 10px !important; }
  .rail.collapsed .nav-item .nav-label { display: none; }
  .rail.collapsed .nav-item.active::before { display: none; }
}


/* ============================================================ */
/* НАСТРОЙКИ — Tab-навигация (v15.54.1)                         */
/* ============================================================ */

.s2-tabs {
  display: flex;
  gap: 4px;
  padding: 6px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow-x: auto;
  scrollbar-width: none;
  margin-bottom: 18px;
  position: sticky;
  top: 0;
  z-index: 10;
  backdrop-filter: blur(10px);
  background: color-mix(in srgb, var(--surface) 92%, transparent);
}
.s2-tabs::-webkit-scrollbar { display: none; }

.s2-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: transparent;
  border: none;
  border-radius: 10px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  white-space: nowrap;
  transition: all .15s;
  flex: 1;
  justify-content: center;
}
.s2-tab:hover {
  color: var(--text);
  background: var(--surface-2);
}
.s2-tab-active {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
  box-shadow: 0 2px 8px color-mix(in srgb, var(--primary) 30%, transparent);
}
.s2-tab-active:hover {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
}
.s2-tab-icon { font-size: 16px; }

/* Скрытие секций по группам */
#page-settings article.surface[data-settings-group] {
  display: none !important;
}
#page-settings.s2-tab-general article[data-settings-group="general"],
#page-settings.s2-tab-ai article[data-settings-group="ai"],
#page-settings.s2-tab-notifications article[data-settings-group="notifications"],
#page-settings.s2-tab-integrations article[data-settings-group="integrations"] {
  display: block !important;
}

@media (max-width: 760px) {
  .s2-tab { padding: 8px 12px; font-size: 12px; }
  .s2-tab-icon { font-size: 14px; }
  .s2-tab span:not(.s2-tab-icon) { font-size: 11px; }
}


/* ============================================================ */
/* "ЧТО НОВОГО" — колокольчик + попап (v15.56)                 */
/* ============================================================ */


/* ============================================================ */
/* ВЫРУЧКА И РАСХОДЫ — карточный дизайн (v15.56)                */
/* ============================================================ */

/* Сводка с метриками */
.rev-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.rev-summary-card {
  --accent: var(--primary);
  position: relative;
  padding: 16px 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.rev-summary-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px;
  height: 100%;
  background: var(--accent);
}
.rev-summary-total { --accent: #245cf4; }
.rev-summary-cash { --accent: #23a56f; }
.rev-summary-card-payment { --accent: #5b8cf8; }
.rev-summary-iiko { --accent: #fc6c4f; }

.rev-summary-label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
  margin-bottom: 6px;
}
.rev-summary-value {
  font-size: 22px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: -.02em;
  color: var(--accent);
}
.rev-summary-sub {
  font-size: 11px;
  color: var(--muted);
  margin-top: 4px;
}

/* Группа (iiko или ручная или категория) */
.rev-group {
  margin-bottom: 22px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.rev-group-iiko {
  border-color: color-mix(in srgb, #fc6c4f 30%, var(--line));
}
.rev-group-manual {
  border-color: var(--line);
}
.rev-group-expense {
  border-color: color-mix(in srgb, var(--cat-color, var(--bad)) 25%, var(--line));
}

.rev-group-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--line);
}
.rev-group-icon {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--muted);
}
.rev-group-title {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  flex: 1;
}
.rev-group-count {
  padding: 3px 9px;
  background: var(--surface);
  border-radius: 10px;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
}
.rev-group-total {
  font-size: 14px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
}

.rev-group-iiko .rev-group-head {
  background: linear-gradient(135deg, color-mix(in srgb, #fc6c4f 8%, var(--surface-2)), var(--surface-2));
}

/* Карточка операции */
.rev-cards {
  display: flex;
  flex-direction: column;
}

.rev-card {
  display: flex;
  align-items: stretch;
  gap: 0;
  border-bottom: 1px solid var(--line);
  transition: background .12s;
  position: relative;
}
.rev-card:last-child { border-bottom: none; }
.rev-card:hover { background: var(--surface-2); }

.rev-card-stripe {
  width: 4px;
  flex-shrink: 0;
  background: var(--primary);
}

.rev-card-body {
  flex: 1;
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.rev-card-row1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.rev-card-name {
  font-size: 14px;
  font-weight: 600;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rev-card-amount {
  font-size: 16px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  color: var(--good);
  flex-shrink: 0;
  letter-spacing: -.02em;
}

.rev-card-row2 {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 11px;
}
.rev-card-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 10px;
  font-weight: 600;
  color: var(--muted);
  white-space: nowrap;
}
.rev-card-tag-cash {
  background: color-mix(in srgb, #23a56f 14%, transparent);
  border-color: color-mix(in srgb, #23a56f 30%, transparent);
  color: #23a56f;
}
.rev-card-tag-card {
  background: color-mix(in srgb, #5b8cf8 12%, transparent);
  border-color: color-mix(in srgb, #5b8cf8 30%, transparent);
  color: #5b8cf8;
}
.rev-card-tag-iiko {
  background: color-mix(in srgb, #fc6c4f 14%, transparent);
  border-color: color-mix(in srgb, #fc6c4f 30%, transparent);
  color: #fc6c4f;
}
.rev-card-iiko {
  background: color-mix(in srgb, #fc6c4f 5%, transparent);
}
.rev-card-iiko:hover {
  background: color-mix(in srgb, #fc6c4f 10%, transparent);
}

/* Multi-column groups layout (2 cols on wide, 1 on narrow) */
.rev-groups-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr));
  gap: 16px;
  margin-bottom: 22px;
  align-items: start;
}

/* Hidden cards (show more) */
.rev-card-hidden { display: none !important; }

/* Show more button */
.rev-show-more {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 10px 16px;
  border: none;
  border-top: 1px solid var(--line);
  background: var(--surface-2);
  color: var(--primary);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background .12s;
  border-radius: 0 0 14px 14px;
}
.rev-show-more:hover {
  background: color-mix(in srgb, var(--primary) 8%, var(--surface-2));
}
.rev-group { margin-bottom: 0; }

.rev-card-date {
  font-size: 11px;
  color: var(--muted);
  font-family: 'JetBrains Mono', monospace;
}
.rev-card-status { margin-left: auto; }
.rev-card-actions { display: flex; gap: 4px; }

/* Empty state */
.rev-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--muted);
}
.rev-empty-icon { display: flex; align-items: center; justify-content: center; opacity: .4; margin-bottom: 12px; }
.rev-empty-title { font-size: 15px; font-weight: 700; margin-bottom: 6px; color: var(--text); }
.rev-empty-hint { font-size: 13px; line-height: 1.5; }

@media (max-width: 760px) {
  .rev-summary { grid-template-columns: 1fr 1fr; }
  .rev-summary-value { font-size: 18px; }
  .rev-card-body { padding: 10px 12px; }
  .rev-card-name { font-size: 13px; }
  .rev-card-amount { font-size: 14px; }
  .rev-card-row2 { font-size: 10px; }
}


/* ============================================================ */
/* ИСТОРИЯ — Timeline UI (v15.57)                               */
/* ============================================================ */

/* Загрузка */
.audit-loading {
  text-align: center;
  padding: 48px 20px;
  color: var(--muted);
  font-size: 13px;
}
.audit-loading-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--surface-2);
  border-top-color: var(--primary);
  border-radius: 50%;
  margin: 0 auto 12px;
  animation: spin 1s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Stats cards (4 шт. сверху) */
.audit-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 22px;
}
.audit-stat-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: border-color .15s;
}
.audit-stat-card:hover {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
}
.audit-stat-total {
  background: linear-gradient(135deg, color-mix(in srgb, #245cf4 8%, var(--surface)), var(--surface));
  border-color: color-mix(in srgb, #245cf4 25%, var(--line));
}
.audit-stat-icon {
  width: 44px;
  height: 44px;
  background: var(--surface-2);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
}
.audit-stat-total .audit-stat-icon {
  background: linear-gradient(135deg, #245cf4, #5b8cf8);
  color: #fff;
}
.audit-stat-body { flex: 1; min-width: 0; }
.audit-stat-num {
  font-size: 26px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: -.02em;
  line-height: 1;
  margin-bottom: 4px;
}
.audit-stat-lbl {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
}
.audit-stat-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 4px;
}
.audit-mini-stat {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  font-family: 'JetBrains Mono', monospace;
}
.audit-mini-create { background: color-mix(in srgb,#23a56f 18%,transparent); color: #23a56f; }
.audit-mini-edit   { background: color-mix(in srgb,#245cf4 16%,transparent); color: #245cf4; }
.audit-mini-delete { background: color-mix(in srgb,#d64a4a 18%,transparent); color: #d64a4a; }
.audit-mini-login  { background: color-mix(in srgb,#23a56f 12%,transparent); color: #23a56f; }
.audit-mini-import { background: color-mix(in srgb,#a855f7 16%,transparent); color: #a855f7; }

/* Группировка по дню */
.audit-day-group { margin-bottom: 26px; }

.audit-day-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  padding: 0 4px;
}
.audit-day-line {
  flex: 1;
  height: 1px;
  background: var(--line);
}
.audit-day-label {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 0 4px;
}
.audit-day-count {
  padding: 2px 9px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 11px;
  font-weight: 700;
  font-family: 'JetBrains Mono', monospace;
  color: var(--muted);
}

/* Timeline */
.audit-timeline {
  position: relative;
  padding-left: 4px;
}

.audit-event {
  display: grid;
  grid-template-columns: 60px 32px 1fr;
  gap: 12px;
  align-items: flex-start;
  padding: 6px 0;
  position: relative;
}

.audit-event:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 75px;
  top: 36px;
  bottom: -6px;
  width: 2px;
  background: linear-gradient(to bottom, var(--line), transparent);
  z-index: 0;
}

.audit-event-time {
  font-size: 12px;
  font-weight: 600;
  font-family: 'JetBrains Mono', monospace;
  color: var(--muted);
  padding-top: 8px;
  text-align: right;
}

.audit-event-dot {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #fff;
  flex-shrink: 0;
  z-index: 1;
  box-shadow: 0 0 0 4px var(--bg, var(--surface));
  font-weight: 700;
}

.audit-event-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  transition: border-color .15s, transform .15s;
  min-width: 0;
}
.audit-event-card:hover {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
  transform: translateX(2px);
}

.audit-event-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 4px;
  flex-wrap: wrap;
}

.audit-event-action {
  font-size: 13px;
  font-weight: 700;
}

.audit-event-user {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--muted);
}
.audit-event-user-avatar {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.audit-event-details {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.5;
  padding: 6px 10px;
  background: var(--surface-2);
  border-radius: 8px;
  margin-top: 4px;
}

.audit-event-meta {
  margin-top: 4px;
}
.audit-event-ip {
  font-size: 10px;
  color: var(--muted);
  font-family: 'JetBrains Mono', monospace;
}

.audit-empty {
  text-align: center;
  padding: 60px 20px;
}
.audit-empty-icon { font-size: 48px; opacity: .4; margin-bottom: 12px; }
.audit-empty-title { font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.audit-empty-hint { font-size: 13px; color: var(--muted); line-height: 1.5; max-width: 320px; margin: 0 auto; }

/* Стилизуем фильтры под современный вид */
#page-audit .audit-filters {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  padding: 16px;
  background: var(--surface-2);
  border-radius: 14px;
  margin-bottom: 20px;
  align-items: end;
}
#page-audit .audit-filters .field { gap: 4px; }
#page-audit .audit-filters .field span {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
#page-audit .audit-filters select,
#page-audit .audit-filters input {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 13px;
  font-family: inherit;
}

@media (max-width: 760px) {
  .audit-event { grid-template-columns: 50px 28px 1fr; gap: 8px; }
  .audit-event-time { font-size: 11px; padding-top: 6px; }
  .audit-event-dot { width: 28px; height: 28px; font-size: 12px; }
  .audit-event:not(:last-child)::before { left: 64px; top: 32px; }
  .audit-event-action { font-size: 12px; }
  .audit-stats { grid-template-columns: 1fr 1fr; }
  .audit-stat-num { font-size: 20px; }
  .audit-stat-icon { width: 36px; height: 36px; font-size: 18px; }
}


/* ============================================================ */
/* ИСТОРИЯ ДЕЙСТВИЙ — финальный полишинг (v15.57)               */
/* ============================================================ */

/* Hero header страницы */
#page-audit .section-top {
  margin-bottom: 22px;
}

/* Карточки статистики — красивее */
.audit-stats {
  margin-bottom: 22px;
}

.audit-stat-card {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  padding: 16px 18px !important;
  display: flex !important;
  gap: 12px !important;
  align-items: center !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform .15s, border-color .15s !important;
}
.audit-stat-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px;
  height: 100%;
  background: var(--primary);
  opacity: .8;
}
.audit-stat-card.audit-stat-total::before { background: linear-gradient(180deg, #245cf4, #5b8cf8); }
.audit-stat-card:nth-child(2)::before { background: linear-gradient(180deg, #f59e0b, #ef8b2d); }
.audit-stat-card:nth-child(3)::before { background: linear-gradient(180deg, #23a56f, #5cc294); }
.audit-stat-card:nth-child(4)::before { background: linear-gradient(180deg, #a855f7, #ec4899); }

.audit-stat-card:hover {
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, var(--primary) 25%, var(--line)) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.06) !important;
}

.audit-stat-icon {
  font-size: 26px !important;
  width: 48px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--surface-2) !important;
  border-radius: 12px !important;
  flex-shrink: 0 !important;
}

.audit-stat-num {
  font-size: 24px !important;
  font-weight: 800 !important;
  font-family: 'JetBrains Mono', monospace !important;
  letter-spacing: -.02em !important;
  line-height: 1 !important;
  margin-bottom: 4px !important;
}

.audit-stat-lbl {
  font-size: 11px !important;
  color: var(--muted) !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  font-weight: 600 !important;
}

/* Mini stats — pill chips */
.audit-stat-flex {
  display: flex !important;
  gap: 4px !important;
  flex-wrap: wrap !important;
  margin-bottom: 6px !important;
}
.audit-mini-stat {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  font-family: 'JetBrains Mono', monospace !important;
  border: 1px solid transparent !important;
}
.audit-mini-create {
  background: color-mix(in srgb, #23a56f 14%, transparent) !important;
  color: #23a56f !important;
}
.audit-mini-edit {
  background: color-mix(in srgb, #245cf4 14%, transparent) !important;
  color: #245cf4 !important;
}
.audit-mini-delete {
  background: color-mix(in srgb, #d64a4a 14%, transparent) !important;
  color: #d64a4a !important;
}
.audit-mini-login {
  background: color-mix(in srgb, #6b7280 14%, transparent) !important;
  color: #6b7280 !important;
}
.audit-mini-import {
  background: color-mix(in srgb, #fc6c4f 14%, transparent) !important;
  color: #fc6c4f !important;
}

/* Day groups */
.audit-day-group {
  margin-bottom: 26px !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}

.audit-day-header {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px 18px !important;
  background: var(--surface-2) !important;
  border-bottom: 1px solid var(--line) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 5 !important;
  backdrop-filter: blur(10px) !important;
  background: color-mix(in srgb, var(--surface-2) 92%, transparent) !important;
}

.audit-day-line {
  flex: 1 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, var(--line), transparent) !important;
}

.audit-day-label {
  font-size: 13px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  color: var(--text) !important;
  white-space: nowrap !important;
}

.audit-day-count {
  padding: 3px 10px !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--muted) !important;
  white-space: nowrap !important;
}

/* Timeline */
.audit-timeline {
  padding: 8px 0 !important;
}

.audit-timeline-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 14px !important;
  padding: 12px 18px !important;
  position: relative !important;
  transition: background .12s !important;
  border-left: 3px solid transparent !important;
}
.audit-timeline-item:hover {
  background: var(--surface-2) !important;
  border-left-color: var(--primary) !important;
}

.audit-action-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #fff !important;
  flex-shrink: 0 !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.1) !important;
}

.audit-item-body {
  flex: 1 !important;
  min-width: 0 !important;
}

.audit-item-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  margin-bottom: 4px !important;
  line-height: 1.4 !important;
}

.audit-item-meta {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  font-size: 11px !important;
  color: var(--muted) !important;
}

.audit-item-user {
  font-weight: 600 !important;
  color: var(--text) !important;
}

.audit-item-time {
  font-family: 'JetBrains Mono', monospace !important;
}

.audit-item-details {
  margin-top: 6px !important;
  padding: 8px 12px !important;
  background: var(--surface-2) !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--muted) !important;
  line-height: 1.5 !important;
  border-left: 2px solid var(--line) !important;
}

/* Empty state */
.audit-empty {
  text-align: center !important;
  padding: 60px 20px !important;
  background: var(--surface) !important;
  border: 1px dashed var(--line) !important;
  border-radius: 14px !important;
}
.audit-empty-icon {
  font-size: 56px !important;
  opacity: .4 !important;
  margin-bottom: 12px !important;
}
.audit-empty-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  margin-bottom: 6px !important;
  color: var(--text) !important;
}
.audit-empty-hint {
  font-size: 13px !important;
  color: var(--muted) !important;
  line-height: 1.5 !important;
}

/* Loading */
.audit-loading {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 60px 20px !important;
  color: var(--muted) !important;
}
.audit-loading-spinner {
  width: 36px !important;
  height: 36px !important;
  border: 3px solid var(--line) !important;
  border-top-color: var(--primary) !important;
  border-radius: 50% !important;
  animation: audit-spin .8s linear infinite !important;
}
@keyframes audit-spin {
  to { transform: rotate(360deg); }
}

/* Filters bar */
.audit-filters {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  padding: 16px !important;
  background: var(--surface-2) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  margin-bottom: 18px !important;
  align-items: flex-end !important;
}

.audit-filter-field {
  flex: 1 !important;
  min-width: 140px !important;
}

.audit-filter-field span {
  font-size: 10px !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  color: var(--muted) !important;
  font-weight: 700 !important;
  margin-bottom: 4px !important;
}

.audit-filter-field input,
.audit-filter-field select {
  padding: 8px 12px !important;
  font-size: 13px !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
}
.audit-filter-field input:focus,
.audit-filter-field select:focus {
  border-color: var(--primary) !important;
}

/* Mobile */
@media (max-width: 760px) {
  .audit-stats { grid-template-columns: 1fr 1fr !important; }
  .audit-stat-num { font-size: 20px !important; }
  .audit-stat-icon { width: 40px !important; height: 40px !important; font-size: 22px !important; }
  .audit-day-header { padding: 10px 14px !important; }
  .audit-timeline-item { padding: 10px 14px !important; gap: 10px !important; }
  .audit-action-icon { width: 30px !important; height: 30px !important; font-size: 14px !important; }
  .audit-filters { padding: 12px !important; }
  .audit-filter-field { min-width: 100% !important; }
}


/* ============================================================ */
/* ИСТОРИЯ ДЕЙСТВИЙ — современный timeline (v15.56.1)           */
/* ============================================================ */

#page-audit .surface,
section[id*="audit"] .surface {
  padding: 22px !important;
  border-radius: 16px !important;
}

/* Фильтры — современные */
#page-audit .audit-filters,
.audit-filters {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 10px !important;
  padding: 18px !important;
  background: var(--surface-2) !important;
  border-radius: 14px !important;
  margin-bottom: 18px !important;
  align-items: end;
}

#page-audit .audit-filter-field span,
.audit-filter-field span {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--muted) !important;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 4px;
}

#page-audit .audit-filter-field input,
#page-audit .audit-filter-field select,
.audit-filter-field input,
.audit-filter-field select {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  padding: 9px 12px !important;
  font-size: 13px !important;
  width: 100%;
}

/* Сводка вверху списка */
.audit-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 22px;
}

.audit-stat-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px 16px;
  position: relative;
  overflow: hidden;
}
.audit-stat-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px;
  height: 100%;
  background: var(--primary);
}
.audit-stat-card .audit-stat-num {
  font-size: 24px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  color: var(--primary);
}
.audit-stat-card .audit-stat-lbl {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
  margin-top: 4px;
}

/* Группа по дням */
.audit-day-group {
  margin-bottom: 28px !important;
  position: relative;
}

.audit-day-header {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
  padding: 0 !important;
}
.audit-day-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line), transparent);
}
.audit-day-label {
  padding: 6px 16px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 12%, var(--surface-2)), var(--surface-2));
  border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line));
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  color: var(--primary);
  white-space: nowrap;
}
.audit-day-count {
  padding: 4px 10px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  font-family: 'JetBrains Mono', monospace;
}

/* Timeline-контейнер */
.audit-timeline {
  position: relative !important;
  padding-left: 24px !important;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Вертикальная линия timeline */
.audit-timeline::before {
  content: "" !important;
  position: absolute !important;
  left: 19px !important;
  top: 18px !important;
  bottom: 18px !important;
  width: 2px !important;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--primary) 30%, transparent) 0%,
    color-mix(in srgb, var(--line) 100%, transparent) 100%) !important;
  border-radius: 2px;
}

/* Запись timeline */
.audit-timeline-item {
  position: relative !important;
  display: flex !important;
  gap: 16px !important;
  padding: 14px 16px !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  transition: all .15s !important;
  margin-left: -8px;
}
.audit-timeline-item:hover {
  background: var(--surface-2) !important;
  border-color: color-mix(in srgb, var(--primary) 35%, var(--line)) !important;
  transform: translateX(2px);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}

/* Круглая иконка с градиентом */
.audit-timeline-item .audit-action-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  color: #fff !important;
  flex-shrink: 0 !important;
  position: relative !important;
  z-index: 2;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
  margin-left: -25px;
  border: 2px solid var(--surface);
}

.audit-item-body {
  flex: 1;
  min-width: 0;
}

.audit-item-title {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 4px;
  color: var(--text);
}

.audit-item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 11px;
  color: var(--muted);
  margin-bottom: 4px;
}
.audit-item-user, .audit-item-time, .audit-item-ip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.audit-item-details {
  margin-top: 8px;
  padding: 8px 12px;
  background: var(--surface-2);
  border-radius: 8px;
  font-size: 12px;
  font-family: 'JetBrains Mono', monospace;
  color: var(--muted);
  line-height: 1.5;
  word-break: break-word;
}

/* Empty state */
.audit-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--muted);
}
.audit-empty-icon { font-size: 56px; opacity: .4; margin-bottom: 12px; }
.audit-empty-title { font-size: 15px; font-weight: 700; color: var(--text); margin-bottom: 6px; }
.audit-empty-hint { font-size: 13px; line-height: 1.5; }

.audit-loading {
  text-align: center;
  padding: 50px 20px;
  color: var(--muted);
}
.audit-loading-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid var(--line);
  border-top-color: var(--primary);
  border-radius: 50%;
  margin: 0 auto 12px;
  animation: audit-spin 1s linear infinite;
}
@keyframes audit-spin { to { transform: rotate(360deg); } }

@media (max-width: 760px) {
  .audit-filters { grid-template-columns: 1fr 1fr !important; }
  .audit-summary { grid-template-columns: 1fr 1fr; }
  .audit-timeline { padding-left: 18px !important; }
  .audit-timeline-item { padding: 10px 12px !important; gap: 10px !important; }
  .audit-timeline-item .audit-action-icon { width: 28px !important; height: 28px !important; font-size: 13px !important; margin-left: -19px; }
  .audit-item-title { font-size: 13px; }
}


/* ============================================================ */
/* ИСТОРИЯ — финальная полировка (v15.58)                      */
/* ============================================================ */

#page-audit {
  padding-bottom: 80px;
}

/* Карточка фильтров */
.audit-filter-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 18px;
  margin-bottom: 18px;
}

#page-audit .audit-filters {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) auto !important;
  gap: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  margin: 0 !important;
  align-items: end;
}

#page-audit .audit-filter-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
#page-audit .audit-filter-field span {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--muted) !important;
  text-transform: uppercase;
  letter-spacing: .04em;
}
#page-audit .audit-filter-field input,
#page-audit .audit-filter-field select {
  background: var(--surface-2) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  padding: 9px 12px !important;
  font-size: 13px !important;
  font-family: inherit !important;
  color: var(--text) !important;
  width: 100%;
  transition: border-color .12s;
}
#page-audit .audit-filter-field input:focus,
#page-audit .audit-filter-field select:focus {
  outline: none !important;
  border-color: var(--primary) !important;
}

#page-audit #btnAuditReset {
  align-self: end;
}

/* Сводка вверху списка */
#page-audit .audit-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 22px;
}

#page-audit .audit-summary:empty {
  display: none;
}

.audit-stat-card {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  padding: 16px 18px !important;
  position: relative;
  overflow: hidden;
}
.audit-stat-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px;
  height: 100%;
  background: var(--primary);
}

.audit-stat-num {
  font-size: 24px !important;
  font-weight: 800 !important;
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--text) !important;
}

.audit-stat-lbl {
  font-size: 11px !important;
  color: var(--muted) !important;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
  margin-top: 4px;
}

.audit-mini-stats {
  display: flex;
  gap: 6px;
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.audit-mini-stat {
  padding: 3px 9px;
  background: var(--surface-2);
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  font-family: 'JetBrains Mono', monospace;
}
.audit-mini-create { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.audit-mini-edit   { background: color-mix(in srgb, #245cf4 14%, transparent); color: #245cf4; }
.audit-mini-delete { background: color-mix(in srgb, #d64a4a 14%, transparent); color: #d64a4a; }
.audit-mini-login  { background: color-mix(in srgb, #6b7280 14%, transparent); color: #6b7280; }
.audit-mini-import { background: color-mix(in srgb, #ef8b2d 14%, transparent); color: #ef8b2d; }

/* День — заголовок */
#page-audit .audit-day-group {
  margin-bottom: 22px !important;
  padding: 0 !important;
}

#page-audit .audit-day-header {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
  padding: 0 !important;
}

#page-audit .audit-day-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--line), transparent);
}

#page-audit .audit-day-label {
  padding: 6px 16px !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 14%, var(--surface-2)), var(--surface-2)) !important;
  border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line)) !important;
  border-radius: 20px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--primary) !important;
  white-space: nowrap;
  margin: 0 !important;
}

#page-audit .audit-day-count {
  padding: 4px 10px !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--muted) !important;
  font-family: 'JetBrains Mono', monospace !important;
  margin: 0 !important;
}

/* Timeline-контейнер */
#page-audit .audit-timeline {
  position: relative !important;
  padding-left: 32px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin: 0 !important;
}

/* Вертикальная линия timeline */
#page-audit .audit-timeline::before {
  content: "" !important;
  position: absolute !important;
  left: 19px !important;
  top: 18px !important;
  bottom: 18px !important;
  width: 2px !important;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--primary) 35%, transparent) 0%,
    color-mix(in srgb, var(--line) 100%, transparent) 100%) !important;
  border-radius: 2px;
}

/* Запись timeline — карточка */
#page-audit .audit-timeline-item {
  position: relative !important;
  display: flex !important;
  gap: 14px !important;
  padding: 14px 16px !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
  transition: all .15s !important;
  margin: 0 !important;
}

#page-audit .audit-timeline-item:hover {
  background: var(--surface-2) !important;
  border-color: color-mix(in srgb, var(--primary) 35%, var(--line)) !important;
  transform: translateX(2px) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.06) !important;
}

/* Круглая иконка с градиентом — поверх линии */
#page-audit .audit-timeline-item .audit-action-icon {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  color: #fff !important;
  flex-shrink: 0 !important;
  position: relative !important;
  z-index: 2 !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.18) !important;
  margin-left: -34px !important;
  margin-top: 0 !important;
  border: 3px solid var(--surface) !important;
  font-weight: 700;
  font-family: inherit;
}

#page-audit .audit-item-body {
  flex: 1 !important;
  min-width: 0 !important;
  padding: 0 !important;
}

#page-audit .audit-item-title {
  font-size: 14px !important;
  font-weight: 700 !important;
  margin-bottom: 6px !important;
  color: var(--text) !important;
  line-height: 1.3 !important;
}

#page-audit .audit-item-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  font-size: 11px !important;
  color: var(--muted) !important;
  margin: 0 !important;
}

#page-audit .audit-item-user,
#page-audit .audit-item-time,
#page-audit .audit-item-ip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
}

#page-audit .audit-item-details {
  margin-top: 8px !important;
  padding: 8px 12px !important;
  background: var(--surface-2) !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-family: 'JetBrains Mono', monospace !important;
  color: var(--muted) !important;
  line-height: 1.5 !important;
  word-break: break-word !important;
}

/* Empty state */
#page-audit .audit-empty {
  text-align: center !important;
  padding: 60px 20px !important;
  color: var(--muted) !important;
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
}
#page-audit .audit-empty-icon {
  font-size: 56px !important;
  opacity: .4 !important;
  margin-bottom: 12px !important;
}
#page-audit .audit-empty-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--text) !important;
  margin-bottom: 6px !important;
}
#page-audit .audit-empty-hint {
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* Loading */
#page-audit .audit-loading {
  text-align: center !important;
  padding: 50px 20px !important;
  color: var(--muted) !important;
}
#page-audit .audit-loading-spinner {
  width: 36px !important;
  height: 36px !important;
  border: 3px solid var(--line) !important;
  border-top-color: var(--primary) !important;
  border-radius: 50% !important;
  margin: 0 auto 12px !important;
  animation: audit-spin 1s linear infinite !important;
}

@media (max-width: 760px) {
  #page-audit .audit-filters {
    grid-template-columns: 1fr 1fr !important;
  }
  #page-audit .audit-filters #btnAuditReset {
    grid-column: 1 / -1;
  }
  #page-audit .audit-summary {
    grid-template-columns: 1fr 1fr !important;
  }
  #page-audit .audit-timeline {
    padding-left: 26px !important;
  }
  #page-audit .audit-timeline-item {
    padding: 12px 14px !important;
    gap: 10px !important;
  }
  #page-audit .audit-timeline-item .audit-action-icon {
    width: 30px !important;
    height: 30px !important;
    font-size: 14px !important;
    margin-left: -28px !important;
  }
  #page-audit .audit-item-title {
    font-size: 13px !important;
  }
}


/* ============================================================ */
/* Icon-btn — расширения для шапки (v15.58)                    */
/* ============================================================ */

.icon-btn-danger {
  color: var(--bad, #d64a4a) !important;
}
.icon-btn-danger:hover {
  background: color-mix(in srgb, #d64a4a 12%, transparent) !important;
  border-color: color-mix(in srgb, #d64a4a 35%, var(--line)) !important;
}

/* file-btn как иконка */
.icon-btn.file-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
}


/* Версия под "API подключено" (v15.58) */
.rail-version {
  font-size: 10px;
  font-weight: 600;
  color: var(--muted);
  text-align: center;
  padding: 2px 8px;
  margin: 4px 8px 8px;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: .04em;
  opacity: .65;
  user-select: none;
}
.rail-version:hover { opacity: 1; }


/* ============================================================ */
/* ПРОГНОЗИРОВАНИЕ И АВТОМАТИЗАЦИЯ (v15.59)                    */
/* ============================================================ */

/* === FORECAST (Cash Flow) === */
.forecast-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.forecast-period-tabs {
  display: inline-flex;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 4px;
  gap: 2px;
}
.forecast-period-tab {
  background: transparent;
  border: none;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  border-radius: 8px;
  transition: all .15s;
  font-family: inherit;
}
.forecast-period-tab:hover { color: var(--text); background: var(--surface-2); }
.forecast-period-active {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
  box-shadow: 0 2px 6px color-mix(in srgb, var(--primary) 30%, transparent);
}
.forecast-period-active:hover { color: #fff; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8)); }

#forecastMetrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.fc-metric {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 18px;
  position: relative;
  overflow: hidden;
}
.fc-metric::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  background: var(--accent, var(--primary));
}
.fc-metric-label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
  margin-bottom: 6px;
}
.fc-metric-value {
  font-size: 22px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
}
.fc-metric-sub {
  font-size: 11px;
  color: var(--muted);
  margin-top: 4px;
}
.fc-metric.fc-warn { --accent: #ef8b2d; }
.fc-metric.fc-warn .fc-metric-value { color: #ef8b2d; }
.fc-metric.fc-bad  { --accent: #d64a4a; }
.fc-metric.fc-bad  .fc-metric-value { color: #d64a4a; }
.fc-metric.fc-good { --accent: #23a56f; }
.fc-metric.fc-good .fc-metric-value { color: #23a56f; }

.forecast-chart-container {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
  margin-bottom: 18px;
}

.forecast-ai-block {
  background: linear-gradient(135deg, color-mix(in srgb, #a855f7 6%, var(--surface)), var(--surface));
  border: 1px solid color-mix(in srgb, #a855f7 30%, var(--line));
  border-radius: 14px;
  padding: 18px;
  margin-bottom: 18px;
}
.forecast-ai-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.forecast-ai-avatar {
  width: 36px; height: 36px;
  background: linear-gradient(135deg, #a855f7, #ec4899);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  font-size: 18px;
}
.forecast-ai-summary {
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 12px;
}
.forecast-ai-recs {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.forecast-ai-rec {
  padding: 10px 14px;
  background: var(--surface-2);
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.6;
  border-left: 3px solid #a855f7;
}

.forecast-table-container {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.fc-table {
  width: 100%;
  font-size: 13px;
  border-collapse: collapse;
}
.fc-table th {
  background: var(--surface-2);
  padding: 10px 14px;
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
}
.fc-table td {
  padding: 10px 14px;
  border-top: 1px solid var(--line);
  font-family: 'JetBrains Mono', monospace;
}
.fc-table tr.fc-row-gap {
  background: color-mix(in srgb, #d64a4a 8%, transparent);
}
.fc-table tr.fc-row-gap td {
  color: #d64a4a;
  font-weight: 700;
}

/* === RECURRING === */
.recurring-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 12px;
}
.rec-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px;
  position: relative;
  transition: all .15s;
}
.rec-card:hover {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
.rec-card.rec-inactive {
  opacity: .55;
}
.rec-card.rec-income {
  border-left: 4px solid #23a56f;
}
.rec-card.rec-expense {
  border-left: 4px solid #d64a4a;
}
.rec-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 10px;
}
.rec-card-name {
  font-size: 15px;
  font-weight: 700;
}
.rec-card-amount {
  font-size: 18px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
}
.rec-card-amount.rec-income { color: #23a56f; }
.rec-card-amount.rec-expense { color: #d64a4a; }

.rec-card-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.rec-tag {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  background: var(--surface-2);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 600;
}

.rec-card-next {
  font-size: 13px;
  margin-bottom: 10px;
  color: var(--muted);
}
.rec-card-next strong { color: var(--text); font-family: 'JetBrains Mono', monospace; }
.rec-card-actions {
  display: flex;
  gap: 6px;
  border-top: 1px dashed var(--line);
  padding-top: 10px;
}

/* === BUDGET === */
.budget-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.budget-period-selector {
  display: flex;
  gap: 8px;
}
.budget-scenarios-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
}
.bs-column {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
}
.bs-column.bs-pessimistic { border-top: 4px solid #d64a4a; }
.bs-column.bs-realistic { border-top: 4px solid #ef8b2d; }
.bs-column.bs-optimistic { border-top: 4px solid #23a56f; }

.bs-column-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px dashed var(--line);
}
.bs-icon { font-size: 22px; }
.bs-title { font-size: 15px; font-weight: 800; }

.bs-totals {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.bs-total {
  padding: 8px 10px;
  background: var(--surface-2);
  border-radius: 8px;
  text-align: center;
}
.bs-total-lbl {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  font-weight: 600;
}
.bs-total-val {
  font-size: 14px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  margin-top: 2px;
}
.bs-profit {
  padding: 10px;
  background: color-mix(in srgb, var(--primary) 10%, var(--surface-2));
  border-radius: 8px;
  text-align: center;
  margin-bottom: 12px;
}

.bs-lines-section {
  margin-bottom: 14px;
}
.bs-lines-title {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--muted);
  font-weight: 700;
  margin-bottom: 8px;
}
.bs-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  font-size: 12px;
  border-radius: 6px;
}
.bs-line:hover { background: var(--surface-2); }
.bs-line-name { flex: 1; }
.bs-line-amt {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 600;
}
.bs-fact-bar {
  height: 4px;
  background: var(--surface-2);
  border-radius: 2px;
  margin-top: 4px;
  overflow: hidden;
}
.bs-fact-fill {
  height: 100%;
  background: linear-gradient(90deg, #23a56f, #5cc294);
  transition: width .3s;
}
.bs-fact-fill.bs-fact-over { background: linear-gradient(90deg, #ef8b2d, #d64a4a); }

/* === KPI === */
.kpi-period-tabs {
  display: inline-flex;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 4px;
  gap: 2px;
  margin-bottom: 18px;
}
.kpi-period-tab {
  background: transparent;
  border: none;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  border-radius: 8px;
  font-family: inherit;
}
.kpi-period-tab:hover { color: var(--text); background: var(--surface-2); }
.kpi-period-active {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
}
.kpi-period-active:hover { color: #fff; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8)); }

.kpi-metrics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-bottom: 22px;
}
.kpi-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
  position: relative;
  overflow: hidden;
}
.kpi-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  background: var(--kpi-color, var(--primary));
}
.kpi-card-icon {
  font-size: 22px;
  margin-bottom: 4px;
}
.kpi-card-label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
  margin-bottom: 6px;
}
.kpi-card-value {
  font-size: 26px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: -.02em;
}
.kpi-card-hint {
  font-size: 11px;
  color: var(--muted);
  margin-top: 6px;
  line-height: 1.4;
}
.kpi-card.kpi-good { --kpi-color: #23a56f; }
.kpi-card.kpi-warn { --kpi-color: #ef8b2d; }
.kpi-card.kpi-bad  { --kpi-color: #d64a4a; }
.kpi-card.kpi-info { --kpi-color: #5b8cf8; }

.kpi-chart-container {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
}

@media (max-width: 900px) {
  .budget-scenarios-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .forecast-controls { flex-direction: column; align-items: stretch; }
  #forecastMetrics, .kpi-metrics-grid { grid-template-columns: 1fr 1fr; }
  .recurring-list { grid-template-columns: 1fr; }
}


/* ============================================================ */
/* SVG ICONS — иконотека Lucide-style (v15.60)                  */
/* ============================================================ */

/* nav-ico содержит SVG */
.rail .nav-item .nav-ico svg,
.nav-ico svg {
  width: 18px !important;
  height: 18px !important;
  display: block;
}

/* SVG в активной иконке — белая (наследуется через currentColor) */
.rail .nav-item.active .nav-ico svg { color: #fff; }

/* Помощник AI — фирменный фиолетовый */
.rail .nav-item-ai .nav-ico {
  color: var(--primary);
}

/* Module help-btn — иконки */
.module-help-btn svg {
  width: 14px;
  height: 14px;
  vertical-align: middle;
}


/* ============================================================ */
/* КОНТРАГЕНТЫ + НАЛОГИ (v15.60)                                */
/* ============================================================ */

/* Сводка */
.cp-summary, .tax-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.cp-summary:empty, .tax-summary:empty { display: none; }

.cp-stat-card, .tax-stat-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 18px;
  position: relative;
  overflow: hidden;
}
.cp-stat-card::before, .tax-stat-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  background: var(--accent, var(--primary));
}
.cp-stat-good { --accent: #23a56f; }
.cp-stat-bad  { --accent: #d64a4a; }
.cp-stat-warn { --accent: #ef8b2d; }
.cp-stat-info { --accent: #5b8cf8; }

.cp-stat-num, .tax-stat-num {
  font-size: 24px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  color: var(--text);
}
.cp-stat-good .cp-stat-num { color: #23a56f; }
.cp-stat-bad .cp-stat-num { color: #d64a4a; }
.cp-stat-warn .cp-stat-num { color: #ef8b2d; }

.cp-stat-lbl, .tax-stat-lbl {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
  margin-top: 4px;
}
.cp-stat-sub, .tax-stat-sub {
  font-size: 11px;
  color: var(--muted);
  margin-top: 4px;
}

/* Tabs */
.cp-tabs {
  display: inline-flex;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 4px;
  gap: 2px;
  margin-bottom: 18px;
}
.cp-tab {
  background: transparent;
  border: none;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  border-radius: 8px;
  font-family: inherit;
}
.cp-tab:hover { color: var(--text); background: var(--surface-2); }
.cp-tab-active {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
}
.cp-tab-active:hover { color: #fff; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8)); }

/* Список контрагентов */
.cp-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 12px;
}
.cp-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px;
  transition: all .15s;
  cursor: pointer;
}
.cp-card:hover {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
.cp-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 10px;
}
.cp-card-name {
  font-size: 15px;
  font-weight: 700;
  flex: 1;
  min-width: 0;
}
.cp-kind-badge {
  padding: 3px 10px;
  background: var(--surface-2);
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.cp-kind-client { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.cp-kind-supplier { background: color-mix(in srgb, #5b8cf8 14%, transparent); color: #5b8cf8; }

.cp-card-meta {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.6;
  margin-bottom: 10px;
}
.cp-card-balance {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
  font-size: 13px;
}
.cp-balance-label { color: var(--muted); }
.cp-balance-value {
  font-family: 'JetBrains Mono', monospace;
  font-weight: 800;
}
.cp-balance-positive { color: #23a56f; }
.cp-balance-negative { color: #d64a4a; }
.cp-balance-zero { color: var(--muted); }

/* Долги */
.debts-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.debt-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  transition: all .15s;
}
.debt-item:hover { transform: translateX(2px); border-color: color-mix(in srgb, var(--primary) 25%, var(--line)); }
.debt-item.debt-settled { opacity: .55; }
.debt-item.debt-overdue { border-left: 3px solid #d64a4a; }

.debt-direction-icon {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  flex-shrink: 0;
}
.debt-direction-they-owe { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.debt-direction-we-owe { background: color-mix(in srgb, #d64a4a 14%, transparent); color: #d64a4a; }

.debt-info { flex: 1; min-width: 0; }
.debt-cp-name { font-size: 14px; font-weight: 700; margin-bottom: 2px; }
.debt-desc { font-size: 12px; color: var(--muted); }
.debt-due {
  font-size: 11px;
  color: var(--muted);
  font-family: 'JetBrains Mono', monospace;
}
.debt-due-overdue { color: #d64a4a; font-weight: 700; }

.debt-amount {
  font-size: 16px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  text-align: right;
}
.debt-amount-positive { color: #23a56f; }
.debt-amount-negative { color: #d64a4a; }
.debt-actions { display: flex; gap: 4px; }

/* Налоги */
.tax-controls {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.tax-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tax-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  transition: all .15s;
}
.tax-item:hover { transform: translateX(2px); }
.tax-item.tax-paid { opacity: .55; }
.tax-item.tax-overdue { border-left: 3px solid #d64a4a; }
.tax-item.tax-upcoming { border-left: 3px solid #ef8b2d; }
.tax-item.tax-future { border-left: 3px solid #5b8cf8; }

.tax-icon-wrap {
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px;
  background: var(--surface-2);
  flex-shrink: 0;
}
.tax-info { flex: 1; min-width: 0; }
.tax-name { font-size: 14px; font-weight: 700; margin-bottom: 2px; }
.tax-period { font-size: 12px; color: var(--muted); }
.tax-due-date {
  font-size: 11px;
  color: var(--muted);
  font-family: 'JetBrains Mono', monospace;
  margin-top: 2px;
}
.tax-amount {
  font-size: 16px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  text-align: right;
  color: var(--text);
}
.tax-actions { display: flex; gap: 4px; }

.tax-calc-result {
  background: linear-gradient(135deg, color-mix(in srgb, #5b8cf8 6%, var(--surface)), var(--surface));
  border: 1px solid color-mix(in srgb, #5b8cf8 25%, var(--line));
  border-radius: 14px;
  padding: 18px;
  margin-bottom: 18px;
}
.tax-calc-row {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
  font-size: 13px;
}
.tax-calc-total {
  font-size: 18px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  color: var(--primary);
}

@media (max-width: 760px) {
  .cp-list { grid-template-columns: 1fr; }
}


/* ============================================================ */
/* КОНТРАГЕНТЫ + НАЛОГИ (v15.60)                                */
/* ============================================================ */

/* Сводка по контрагентам */
.cp-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.cp-stat-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px 18px;
  position: relative;
  overflow: hidden;
}
.cp-stat-card::before {
  content: ""; position: absolute; top: 0; left: 0;
  width: 4px; height: 100%; background: var(--accent, var(--primary));
}
.cp-stat-debt { --accent: #d64a4a; }
.cp-stat-credit { --accent: #23a56f; }
.cp-stat-net { --accent: #245cf4; }
.cp-stat-label { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; font-weight: 600; margin-bottom: 6px; }
.cp-stat-value { font-size: 22px; font-weight: 800; font-family: 'JetBrains Mono', monospace; }
.cp-stat-sub { font-size: 11px; color: var(--muted); margin-top: 4px; }

/* Табы */
.cp-tabs {
  display: inline-flex;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 4px;
  gap: 2px;
  margin-bottom: 18px;
}
.cp-tab {
  background: transparent;
  border: none;
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  border-radius: 8px;
  font-family: inherit;
}
.cp-tab:hover { color: var(--text); background: var(--surface-2); }
.cp-tab-active {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
}
.cp-tab-active:hover { color: #fff; }

/* Карточка контрагента */
.cp-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 14px;
}
.cp-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px;
  transition: all .15s;
}
.cp-card:hover {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0,0,0,.06);
}
.cp-card-client { border-left: 4px solid #23a56f; }
.cp-card-supplier { border-left: 4px solid #5b8cf8; }
.cp-card-inactive { opacity: .55; }

.cp-card-head {
  display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px;
}
.cp-card-icon {
  width: 40px; height: 40px;
  background: var(--surface-2);
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  color: var(--primary);
}
.cp-card-icon span { width: 20px; height: 20px; display: inline-block; }
.cp-card-info { flex: 1; min-width: 0; }
.cp-card-name { font-size: 15px; font-weight: 700; margin-bottom: 4px; }
.cp-card-meta { display: flex; gap: 6px; flex-wrap: wrap; }

.cp-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  background: var(--surface-2);
  border-radius: 8px;
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
}
.cp-tag span[data-icon] { width: 12px; height: 12px; display: inline-block; }
.cp-tag-client { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.cp-tag-supplier { background: color-mix(in srgb, #5b8cf8 14%, transparent); color: #5b8cf8; }

.cp-card-stats {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px;
}
.cp-card-stat { padding: 10px; background: var(--surface-2); border-radius: 10px; }
.cp-card-stat-lbl { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.cp-card-stat-val { font-size: 16px; font-weight: 800; font-family: 'JetBrains Mono', monospace; margin-top: 2px; }
.cp-card-stat-warn { color: #ef8b2d; }

.cp-card-warning {
  grid-column: 1 / -1;
  display: flex; align-items: center; gap: 6px;
  padding: 8px 10px;
  background: color-mix(in srgb, #d64a4a 8%, transparent);
  border-left: 3px solid #d64a4a;
  border-radius: 6px;
  font-size: 11px;
  color: #d64a4a;
  font-weight: 600;
}
.cp-card-warning span[data-icon] { width: 14px; height: 14px; display: inline-block; }

.cp-card-actions {
  display: flex; gap: 6px;
  border-top: 1px dashed var(--line);
  padding-top: 10px;
}

/* Реестр долгов */
.debts-list {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.debt-row {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
}
.debt-row:last-child { border-bottom: none; }
.debt-row:hover { background: var(--surface-2); }
.debt-row-icon {
  width: 32px; height: 32px;
  background: var(--surface-2);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.debt-row-icon span { width: 16px; height: 16px; display: inline-block; }
.debt-row-info { flex: 1; min-width: 0; }
.debt-row-name { font-size: 14px; font-weight: 700; }
.debt-row-label { font-size: 11px; color: var(--muted); margin-top: 2px; }
.debt-row-amount {
  font-size: 16px; font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
}
.debt-credit { color: #23a56f; }
.debt-debit { color: #d64a4a; }

/* Детальный модал */
.cp-detail-stats {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px;
}
.cp-detail-stat {
  padding: 12px; background: var(--surface-2); border-radius: 10px;
}
.cp-detail-stat-lbl { font-size: 11px; color: var(--muted); text-transform: uppercase; }
.cp-detail-stat-val { font-size: 16px; font-weight: 800; font-family: 'JetBrains Mono', monospace; margin-top: 2px; }

.cp-detail-items { display: flex; flex-direction: column; gap: 4px; max-height: 400px; overflow-y: auto; }
.cp-detail-item {
  display: grid; grid-template-columns: 100px 1fr 100px 80px;
  gap: 12px; padding: 10px; border-bottom: 1px solid var(--line);
  font-size: 12px;
  align-items: center;
}
.cp-detail-item-date { font-family: 'JetBrains Mono', monospace; color: var(--muted); }
.cp-detail-item-amt { text-align: right; font-family: 'JetBrains Mono', monospace; font-weight: 700; }
.cp-detail-item-st { text-align: right; font-weight: 700; text-transform: uppercase; font-size: 10px; }

/* Налоги */
.tax-summary {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 18px;
}
.tax-stat-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 16px;
  position: relative;
  overflow: hidden;
}
.tax-stat-card::before { content:""; position:absolute; top:0; left:0; width:4px; height:100%; background: var(--accent, var(--primary)); }
.tax-stat-warn { --accent: #ef8b2d; }
.tax-stat-bad { --accent: #d64a4a; }
.tax-stat-good { --accent: #23a56f; }
.tax-stat-lbl { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; font-weight: 600; }
.tax-stat-val { font-size: 22px; font-weight: 800; font-family: 'JetBrains Mono', monospace; margin: 6px 0 2px; }
.tax-stat-sub { font-size: 11px; color: var(--muted); }

.tax-controls {
  display: flex; gap: 10px; align-items: center; margin-bottom: 16px; flex-wrap: wrap;
}

.tax-list { display: flex; flex-direction: column; gap: 10px; }

.tax-card {
  display: grid;
  grid-template-columns: 1fr 140px 160px auto;
  gap: 14px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  align-items: center;
}
.tax-card.tax-st-paid { border-left: 4px solid #23a56f; }
.tax-card.tax-st-overdue { border-left: 4px solid #d64a4a; }
.tax-card.tax-st-upcoming { border-left: 4px solid #ef8b2d; }
.tax-card.tax-st-skipped { opacity: .55; }

.tax-card-name { font-weight: 700; font-size: 14px; }
.tax-card-meta { display: flex; gap: 6px; margin-top: 4px; flex-wrap: wrap; }
.tax-tag {
  padding: 3px 9px; background: var(--surface-2); border-radius: 8px;
  font-size: 11px; font-weight: 600; color: var(--muted);
}
.tax-tag-status { font-weight: 700; }
.tax-st-upcoming { background: color-mix(in srgb, #ef8b2d 14%, transparent); color: #ef8b2d; }
.tax-st-paid { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.tax-st-overdue { background: color-mix(in srgb, #d64a4a 14%, transparent); color: #d64a4a; }
.tax-st-skipped { background: var(--surface-2); color: var(--muted); }

.tax-card-desc { font-size: 12px; color: var(--muted); margin-top: 6px; }

.tax-card-amount { text-align: right; }
.tax-card-amount-val { font-size: 18px; font-weight: 800; font-family: 'JetBrains Mono', monospace; }

.tax-card-due { text-align: right; }
.tax-card-due-date { font-size: 13px; font-weight: 700; }

.tax-card-actions { display: flex; gap: 6px; }

@media (max-width: 760px) {
  .tax-card { grid-template-columns: 1fr; gap: 8px; }
  .tax-card-amount, .tax-card-due { text-align: left; }
  .cp-list { grid-template-columns: 1fr; }
  .cp-detail-item { grid-template-columns: 1fr 80px; gap: 6px; }
  .cp-detail-item-date, .cp-detail-item-st { display: none; }
}


/* ============================================================ */
/* ПЛАТЕЖИ — интеграция ЮKassa (v15.61)                         */
/* ============================================================ */

.pay-int-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}

.pay-int-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
  position: relative;
  overflow: hidden;
  transition: all .15s;
}
.pay-int-card:hover {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
}

.pay-int-card-yookassa {
  border-left: 4px solid #006848;
}

.pay-int-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.pay-int-name {
  font-size: 16px;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 8px;
}
.pay-int-status {
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.pay-int-status-on {
  background: color-mix(in srgb, #23a56f 14%, transparent);
  color: #23a56f;
}
.pay-int-status-off {
  background: var(--surface-2);
  color: var(--muted);
}
.pay-int-status-error {
  background: color-mix(in srgb, #d64a4a 14%, transparent);
  color: #d64a4a;
}

.pay-int-meta {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.7;
  margin-bottom: 10px;
}
.pay-int-meta strong {
  color: var(--text);
  font-family: 'JetBrains Mono', monospace;
}

.pay-int-stats {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  margin-bottom: 14px;
  padding-top: 12px;
  border-top: 1px dashed var(--line);
}
.pay-int-stat {
  text-align: center;
}
.pay-int-stat-num {
  font-size: 18px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
}
.pay-int-stat-lbl {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-top: 2px;
}

.pay-int-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.pay-int-error {
  margin-top: 10px;
  padding: 8px 12px;
  background: color-mix(in srgb, #d64a4a 8%, transparent);
  border-left: 3px solid #d64a4a;
  border-radius: 6px;
  font-size: 12px;
  color: #d64a4a;
}

/* Список платежей */
.pay-records-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pay-record {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  transition: all .15s;
}
.pay-record:hover {
  border-color: color-mix(in srgb, var(--primary) 25%, var(--line));
}

.pay-record-icon-wrap {
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: color-mix(in srgb, #23a56f 14%, transparent);
  color: #23a56f;
  flex-shrink: 0;
}

.pay-record-info {
  flex: 1;
  min-width: 0;
}
.pay-record-payer {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pay-record-desc {
  font-size: 12px;
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pay-record-meta {
  font-size: 11px;
  color: var(--muted);
  font-family: 'JetBrains Mono', monospace;
  margin-top: 2px;
}

.pay-record-ai {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  background: linear-gradient(135deg, color-mix(in srgb, #a855f7 12%, transparent), color-mix(in srgb, #ec4899 8%, transparent));
  border-radius: 6px;
  font-size: 10px;
  font-weight: 700;
  color: #a855f7;
  margin-top: 4px;
}

.pay-record-amount {
  font-size: 16px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  color: #23a56f;
  text-align: right;
  white-space: nowrap;
}

.pay-record-status {
  padding: 3px 9px;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}
.pay-record-status-linked {
  background: color-mix(in srgb, #23a56f 14%, transparent);
  color: #23a56f;
}
.pay-record-status-imported {
  background: color-mix(in srgb, #ef8b2d 14%, transparent);
  color: #ef8b2d;
}

@media (max-width: 760px) {
  .pay-int-list { grid-template-columns: 1fr; }
}


/* ============================================================ */
/* BANK / ЮKASSA INTEGRATIONS (v15.61)                          */
/* ============================================================ */

.banks-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}

.bank-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 18px;
  position: relative;
  overflow: hidden;
}
.bank-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  background: var(--bank-color, var(--primary));
}
.bank-card.bank-yookassa { --bank-color: #006848; }
.bank-card.bank-tinkoff  { --bank-color: #ffdd2d; }
.bank-card.bank-sber     { --bank-color: #1a9f29; }
.bank-card.bank-alfa     { --bank-color: #ee2c2c; }

.bank-card-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.bank-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--bank-color, var(--primary)) 14%, transparent);
  color: var(--bank-color, var(--primary));
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.bank-card-icon svg { width: 22px; height: 22px; }
.bank-card-title { flex: 1; min-width: 0; }
.bank-card-name {
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 2px;
}
.bank-card-provider {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
}

.bank-card-stats {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px dashed var(--line);
}
.bank-stat {
  text-align: center;
}
.bank-stat-num {
  font-size: 18px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
}
.bank-stat-lbl {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 600;
  margin-top: 2px;
}

.bank-card-meta {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 12px;
  line-height: 1.6;
}
.bank-card-meta strong { color: var(--text); }

.bank-card-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.bank-card-error {
  margin-top: 10px;
  padding: 8px 12px;
  background: color-mix(in srgb, #d64a4a 8%, transparent);
  border: 1px solid color-mix(in srgb, #d64a4a 25%, transparent);
  border-radius: 8px;
  font-size: 12px;
  color: #d64a4a;
}

.bank-status-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
}
.bank-status-active { background: #23a56f; }
.bank-status-error  { background: #d64a4a; }
.bank-status-paused { background: #6b7280; }

/* Табы */
.banks-tabs {
  display: inline-flex;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 4px;
  gap: 2px;
  margin-bottom: 14px;
}
.banks-tab {
  background: transparent;
  border: none;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  border-radius: 8px;
  font-family: inherit;
}
.banks-tab:hover { color: var(--text); background: var(--surface-2); }
.banks-tab-active {
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  color: #fff;
}

/* Лента транзакций */
.bank-tx-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.bank-tx {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
  transition: all .15s;
}
.bank-tx:hover { transform: translateX(2px); border-color: color-mix(in srgb, var(--primary) 25%, var(--line)); }
.bank-tx.bank-tx-imported { opacity: .55; }

.bank-tx-direction-icon {
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  flex-shrink: 0;
}
.bank-tx-income { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.bank-tx-expense { background: color-mix(in srgb, #d64a4a 14%, transparent); color: #d64a4a; }

.bank-tx-info { flex: 1; min-width: 0; }
.bank-tx-name {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bank-tx-meta {
  font-size: 11px;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.bank-tx-meta span { font-family: 'JetBrains Mono', monospace; }

.bank-tx-ai-suggest {
  font-size: 11px;
  margin-top: 4px;
  padding: 3px 8px;
  background: color-mix(in srgb, #a855f7 10%, transparent);
  border-radius: 6px;
  display: inline-block;
  color: #a855f7;
  font-weight: 600;
}

.bank-tx-amount {
  font-size: 16px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
  text-align: right;
  flex-shrink: 0;
}
.bank-tx-amount-income { color: #23a56f; }
.bank-tx-amount-expense { color: #d64a4a; }

.bank-tx-actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}

@media (max-width: 760px) {
  .banks-list { grid-template-columns: 1fr; }
  .bank-tx { flex-wrap: wrap; }
}


/* ============================================================ */
/* БАНКИ И ПЛАТЕЖИ (v15.61)                                     */
/* ============================================================ */

.bank-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 12px;
  margin-bottom: 22px;
}

.bank-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
  position: relative;
  transition: all .15s;
}
.bank-card:hover {
  border-color: color-mix(in srgb, var(--primary) 30%, var(--line));
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0,0,0,.06);
}
.bank-card-inactive { opacity: .55; }

.bank-card-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px dashed var(--line);
}
.bank-card-icon {
  width: 44px; height: 44px;
  background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 70%, #5b8cf8));
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  flex-shrink: 0;
}
.bank-card-icon[data-provider="yookassa"] {
  background: linear-gradient(135deg, #6c5ce7, #a29bfe);
}
.bank-card-info { flex: 1; min-width: 0; }
.bank-card-name { font-size: 15px; font-weight: 700; }
.bank-card-provider { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }

.bank-status-badge {
  padding: 3px 9px;
  border-radius: 8px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space: nowrap;
}
.bank-status-ok { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.bank-status-error { background: color-mix(in srgb, #d64a4a 14%, transparent); color: #d64a4a; }
.bank-status-neutral { background: var(--surface-2); color: var(--muted); }

.bank-card-meta {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.7;
  margin-bottom: 12px;
}
.bank-card-meta strong { color: var(--text); font-family: 'JetBrains Mono', monospace; }
.bank-card-meta-error {
  color: #d64a4a;
  background: color-mix(in srgb, #d64a4a 8%, transparent);
  padding: 6px 10px;
  border-radius: 6px;
  margin-top: 6px;
}

.bank-card-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  border-top: 1px dashed var(--line);
  padding-top: 12px;
}

/* Лента транзакций */
.bank-pending-section {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px;
  margin-bottom: 24px;
}
.bank-pending-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.bank-pending-head h3 { margin: 0; font-size: 15px; font-weight: 800; }

.bank-tx-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.bank-tx-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--surface-2);
  border: 1px solid var(--line);
  border-radius: 10px;
  transition: all .15s;
}
.bank-tx-item:hover { border-color: color-mix(in srgb, var(--primary) 25%, var(--line)); }
.bank-tx-item-pending { border-left: 3px solid #ef8b2d; }
.bank-tx-item-applied { opacity: .7; }
.bank-tx-item-skipped { opacity: .45; }

.bank-tx-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.bank-tx-icon-income { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.bank-tx-icon-expense { background: color-mix(in srgb, #d64a4a 14%, transparent); color: #d64a4a; }

.bank-tx-info { flex: 1; min-width: 0; }
.bank-tx-desc {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bank-tx-meta {
  font-size: 11px;
  color: var(--muted);
}
.bank-tx-meta-ai {
  color: #a855f7;
  font-weight: 600;
}

.bank-tx-amount {
  font-size: 14px;
  font-weight: 800;
  font-family: 'JetBrains Mono', monospace;
}
.bank-tx-amount-positive { color: #23a56f; }
.bank-tx-amount-negative { color: #d64a4a; }

.bank-tx-status {
  font-size: 10px;
  padding: 2px 7px;
  border-radius: 6px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.bank-tx-status-applied { background: color-mix(in srgb, #23a56f 14%, transparent); color: #23a56f; }
.bank-tx-status-pending { background: color-mix(in srgb, #ef8b2d 14%, transparent); color: #ef8b2d; }
.bank-tx-status-skipped { background: var(--surface); color: var(--muted); }

.bank-tx-actions { display: flex; gap: 4px; }

@media (max-width: 760px) {
  .bank-list { grid-template-columns: 1fr; }
  .bank-tx-item { gap: 8px; padding: 8px 10px; }
  .bank-tx-desc { font-size: 12px; }
  .bank-tx-meta { font-size: 10px; }
}


/* ============================================================ */
/* LOGIN SCREEN — премиум редизайн (v15.62)                     */
/* ============================================================ */

.login-screen-v2 {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 20px;
  background:
    radial-gradient(ellipse 80% 60% at 50% 30%, #1a1a1f 0%, #0a0a0d 60%, #060608 100%);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  z-index: 100;
  overflow: auto;
  color: #f4f4f6;
}

/* Декоративный градиент */
.login-bg-glow {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 720px;
  height: 720px;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(36, 92, 244, 0.06) 0%, transparent 70%);
  pointer-events: none;
  filter: blur(40px);
  animation: login-glow-breathe 8s ease-in-out infinite;
}
@keyframes login-glow-breathe {
  0%, 100% { opacity: 0.5; transform: translate(-50%, -50%) scale(1); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.1); }
}

.login-v2-wrap {
  position: relative;
  width: 100%;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 36px;
  z-index: 1;
}

/* Брендинг */
.login-v2-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  width: 100%;
}

.login-v2-logo {
  width: 380px;
  max-width: 85vw;
  height: auto;
  color: #f4f4f6;
  opacity: 0.95;
  transition: opacity 0.3s ease;
}
.login-v2-logo:hover {
  opacity: 1;
}
.login-v2-logo svg {
  width: 100%;
  height: auto;
  display: block;
}
/* Стили SVG-текста */
.vdg-svg-letters {
  font-family: 'Cinzel', 'Trajan Pro', 'Times New Roman', Georgia, serif;
  font-size: 280px;
  font-weight: 500;
  letter-spacing: 14px;
}
.vdg-svg-tagline {
  font-family: 'Inter', -apple-system, 'Helvetica Neue', sans-serif;
  font-size: 32px;
  font-weight: 300;
  letter-spacing: 14px;
}

.login-v2-product {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-align: center;
}

.login-v2-product-name {
  margin: 0;
  font-family: 'Playfair Display', 'Times New Roman', Georgia, serif;
  font-size: 56px;
  font-weight: 400;
  letter-spacing: 8px;
  line-height: 1;
  color: #f4f4f6;
  text-transform: uppercase;
  background: linear-gradient(180deg, #fafafa 0%, #c4c4c8 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.login-v2-product-tagline {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: rgba(244, 244, 246, 0.45);
}

/* Карточка входа */
.login-v2-card {
  width: 100%;
  background: rgba(20, 20, 24, 0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 32px 28px;
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.login-v2-form {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.login-v2-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.login-v2-label {
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: rgba(244, 244, 246, 0.55);
}

.login-v2-input {
  width: 100%;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  color: #f4f4f6;
  font-size: 15px;
  font-family: inherit;
  outline: none;
  transition: all 0.2s ease;
  -webkit-text-fill-color: #f4f4f6;
}
.login-v2-input::placeholder {
  color: rgba(244, 244, 246, 0.25);
}
.login-v2-input:hover {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.05);
}
.login-v2-input:focus {
  border-color: rgba(255, 255, 255, 0.4);
  background: rgba(255, 255, 255, 0.06);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.04);
}

/* Autofill fix */
.login-v2-input:-webkit-autofill,
.login-v2-input:-webkit-autofill:hover,
.login-v2-input:-webkit-autofill:focus {
  -webkit-text-fill-color: #f4f4f6;
  -webkit-box-shadow: 0 0 0 1000px rgba(20, 20, 24, 0.95) inset;
  caret-color: #f4f4f6;
  border-color: rgba(255, 255, 255, 0.18);
}

.login-v2-input-code {
  font-family: 'JetBrains Mono', 'SF Mono', Monaco, monospace;
  font-size: 28px;
  letter-spacing: 16px;
  text-align: center;
  padding: 18px 16px 18px 32px;
  font-weight: 600;
}

/* Кнопка submit */
.login-v2-submit {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px 20px;
  background: linear-gradient(180deg, #f7f7f8 0%, #d8d8dc 100%);
  border: none;
  border-radius: 10px;
  color: #0a0a0d;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.5px;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: 4px;
  box-shadow:
    0 4px 14px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}
.login-v2-submit:hover {
  background: linear-gradient(180deg, #ffffff 0%, #e4e4e8 100%);
  transform: translateY(-1px);
  box-shadow:
    0 6px 20px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
.login-v2-submit:active {
  transform: translateY(0);
  box-shadow:
    0 2px 8px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.login-v2-submit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}
.login-v2-submit svg {
  transition: transform 0.2s ease;
}
.login-v2-submit:hover svg {
  transform: translateX(3px);
}

.login-v2-link {
  background: none;
  border: none;
  color: rgba(244, 244, 246, 0.55);
  font-size: 13px;
  font-family: inherit;
  cursor: pointer;
  text-align: center;
  padding: 8px;
  transition: color 0.2s ease;
}
.login-v2-link:hover {
  color: #f4f4f6;
}

.login-v2-error {
  padding: 12px 14px;
  background: rgba(214, 74, 74, 0.1);
  border: 1px solid rgba(214, 74, 74, 0.3);
  border-radius: 8px;
  color: #f4a4a4;
  font-size: 13px;
  text-align: center;
}

.login-v2-timer {
  text-align: center;
  font-size: 11px;
  color: rgba(244, 244, 246, 0.4);
  letter-spacing: 0.5px;
  font-family: 'JetBrains Mono', monospace;
}

/* 2FA шаг */
.login-v2-2fa-head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.login-v2-2fa-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, rgba(36, 92, 244, 0.2), rgba(36, 92, 244, 0.05));
  border: 1px solid rgba(36, 92, 244, 0.3);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #6b9aff;
}
.login-v2-2fa-title {
  font-size: 16px;
  font-weight: 600;
  color: #f4f4f6;
  margin-bottom: 4px;
}
.login-v2-2fa-sub {
  margin: 0;
  font-size: 13px;
  color: rgba(244, 244, 246, 0.55);
  line-height: 1.4;
}

/* Footer */
.login-v2-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 11px;
  color: rgba(244, 244, 246, 0.3);
  letter-spacing: 0.5px;
}
.login-v2-footer-version {
  font-family: 'JetBrains Mono', monospace;
}
.login-v2-footer-divider {
  opacity: 0.5;
}

/* Mobile */
@media (max-width: 480px) {
  .login-v2-wrap { gap: 28px; }
  .login-v2-logo { width: 180px; }
  .login-v2-product-name { font-size: 44px; letter-spacing: 6px; }
  .login-v2-product-tagline { font-size: 10px; letter-spacing: 3px; }
  .login-v2-card { padding: 24px 20px; }
  .login-v2-input-code { font-size: 24px; letter-spacing: 12px; }
}


/* ============================================================ */
/* BRAND LOGO в sidebar (v15.64) — inline SVG                   */
/* ============================================================ */

.brand-avatar-logo {
  background: #0a0a0d !important;
  padding: 6px;
  color: #f4f4f6;
}
.brand-avatar-logo svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* На светлой теме — тёмный логотип на светлом фоне */
[data-theme="light"] .brand-avatar-logo,
.theme-light .brand-avatar-logo {
  background: #0a0a0d !important;
  color: #f4f4f6;
}


/* ============================================================ */
/* UNIFIED BUSINESS UI SYSTEM (v15.65)                          */
/* Премиальные модалки, карточки, формы для всех новых разделов */
/* ============================================================ */

/* === ДИЗАЙН-ТОКЕНЫ === */
:root {
  --biz-radius-lg: 16px;
  --biz-radius-md: 12px;
  --biz-radius-sm: 8px;
  --biz-shadow-card: 0 1px 3px rgba(15, 23, 42, 0.04), 0 1px 2px rgba(15, 23, 42, 0.03);
  --biz-shadow-card-hover: 0 4px 14px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04);
  --biz-shadow-modal: 0 24px 80px rgba(15, 23, 42, 0.18), 0 8px 24px rgba(15, 23, 42, 0.08);
  --biz-border: 1px solid var(--line);
  --biz-border-strong: 1px solid var(--line-2);
  --biz-transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

/* === МОДАЛЬНЫЕ ОКНА — ЕДИНЫЙ СТИЛЬ (только для новых модалок) === */
/* ВАЖНО: применяется ТОЛЬКО к модалкам внутри .modal-backdrop.
   Старые модалки (без backdrop) сохраняют свой стиль из строки ~743. */

.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9000;
  padding: 24px 16px;
  animation: biz-modal-fade 0.2s ease-out;
}
@keyframes biz-modal-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}

.modal-backdrop > .modal {
  position: static !important;
  inset: auto !important;
  background: var(--surface);
  border: var(--biz-border);
  border-radius: var(--biz-radius-lg);
  box-shadow: var(--biz-shadow-modal);
  width: 100%;
  max-width: 560px;
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: biz-modal-scale 0.22s cubic-bezier(0.16, 1, 0.3, 1);
  padding: 0 !important;
  margin: 0 auto !important;
}
.modal-backdrop > .modal.modal-sm { max-width: 440px; }
.modal-backdrop > .modal.modal-md { max-width: 600px; }
.modal-backdrop > .modal.modal-lg { max-width: 840px; }
.modal-backdrop > .modal.modal-xl { max-width: 1100px; }

@keyframes biz-modal-scale {
  from { opacity: 0; transform: scale(0.96) translateY(8px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

.modal-backdrop > .modal .modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
  border-bottom: var(--biz-border);
}
.modal-backdrop > .modal .modal-head h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--text);
}
.modal-backdrop > .modal .modal-close {
  background: transparent;
  border: none;
  width: 32px;
  height: 32px;
  border-radius: var(--biz-radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  transition: var(--biz-transition);
  font-family: inherit;
  padding: 0;
}
.modal-backdrop > .modal .modal-close:hover {
  background: var(--surface-2);
  color: var(--text);
}

.modal-backdrop > .modal .modal-body {
  padding: 22px 24px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.modal-backdrop > .modal .modal-body::-webkit-scrollbar { width: 8px; }
.modal-backdrop > .modal .modal-body::-webkit-scrollbar-track { background: transparent; }
.modal-backdrop > .modal .modal-body::-webkit-scrollbar-thumb { background: var(--line); border-radius: 4px; }
.modal-backdrop > .modal .modal-body::-webkit-scrollbar-thumb:hover { background: var(--line-2); }

.modal-backdrop > .modal .modal-footer {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 24px;
  border-top: var(--biz-border);
  background: var(--surface-2);
  flex-wrap: wrap;
}

/* === ПОЛЯ ФОРМ В МОДАЛКАХ === */
.modal .field,
.modal-body .field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.modal .field > span,
.modal-body .field > span {
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.01em;
}
.modal .field input,
.modal .field select,
.modal .field textarea,
.modal-body .field input,
.modal-body .field select,
.modal-body .field textarea {
  width: 100%;
  padding: 11px 14px;
  background: var(--surface);
  border: var(--biz-border);
  border-radius: var(--biz-radius-md);
  color: var(--text);
  font-size: 14px;
  font-family: inherit;
  outline: none;
  transition: var(--biz-transition);
  -webkit-text-fill-color: var(--text);
}
.modal .field input:hover,
.modal .field select:hover,
.modal .field textarea:hover,
.modal-body .field input:hover,
.modal-body .field select:hover,
.modal-body .field textarea:hover {
  border-color: var(--line-2);
}
.modal .field input:focus,
.modal .field select:focus,
.modal .field textarea:focus,
.modal-body .field input:focus,
.modal-body .field select:focus,
.modal-body .field textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary) 14%, transparent);
}
.modal .field textarea,
.modal-body .field textarea {
  resize: vertical;
  min-height: 60px;
  font-family: inherit;
}
.modal .field-hint,
.modal-body .field-hint {
  font-size: 11px;
  color: var(--muted);
  margin-top: 2px;
}

/* Сетка для парных полей */
.modal .form-grid-2,
.modal-body .form-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.modal .form-grid-3,
.modal-body .form-grid-3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
}

/* Switch toggle — компактный для модалки */
.modal .switch-toggle,
.modal-body .switch-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: var(--surface-2);
  border-radius: var(--biz-radius-md);
  cursor: pointer;
  user-select: none;
  transition: var(--biz-transition);
}
.modal .switch-toggle:hover,
.modal-body .switch-toggle:hover {
  background: color-mix(in srgb, var(--primary) 5%, var(--surface-2));
}
.modal .switch-toggle input[type="checkbox"],
.modal-body .switch-toggle input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.modal .switch-slider,
.modal-body .switch-slider {
  position: relative;
  width: 36px;
  height: 20px;
  background: var(--line-2);
  border-radius: 100px;
  transition: var(--biz-transition);
  flex-shrink: 0;
}
.modal .switch-slider::after,
.modal-body .switch-slider::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  background: #fff;
  border-radius: 50%;
  transition: var(--biz-transition);
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.modal .switch-toggle input:checked + .switch-slider,
.modal-body .switch-toggle input:checked + .switch-slider {
  background: var(--primary);
}
.modal .switch-toggle input:checked + .switch-slider::after,
.modal-body .switch-toggle input:checked + .switch-slider::after {
  transform: translateX(16px);
}
.modal .switch-label,
.modal-body .switch-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  flex: 1;
}

/* Info-блок в модалке */
.modal .s2-info,
.modal-body .s2-info {
  display: flex;
  gap: 12px;
  padding: 12px 14px;
  background: color-mix(in srgb, var(--primary) 6%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line));
  border-radius: var(--biz-radius-md);
  align-items: flex-start;
}
.modal .s2-info-icon,
.modal-body .s2-info-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  color: var(--primary);
}
.modal .s2-info-icon svg {
  width: 100%; height: 100%;
}
.modal .s2-info-content,
.modal-body .s2-info-content {
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--text);
}
.modal .s2-info-content a {
  color: var(--primary);
  text-decoration: none;
  border-bottom: 1px solid color-mix(in srgb, var(--primary) 30%, transparent);
}
.modal .s2-info-content a:hover {
  border-bottom-color: var(--primary);
}

/* === КНОПКИ В НОВОМ СТИЛЕ === */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border: none;
  border-radius: var(--biz-radius-md);
  font-size: 13.5px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: var(--biz-transition);
  white-space: nowrap;
  letter-spacing: -0.005em;
}
.btn:disabled { opacity: 0.55; cursor: not-allowed; }

.btn svg, .btn [data-icon] {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.btn [data-icon] svg { width: 16px; height: 16px; }

.btn-primary {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 1px 2px rgba(36, 92, 244, 0.2);
}
.btn-primary:hover:not(:disabled) {
  background: color-mix(in srgb, var(--primary) 88%, #000);
  box-shadow: 0 4px 12px rgba(36, 92, 244, 0.3);
  transform: translateY(-1px);
}
.btn-primary:active { transform: translateY(0); }

.btn-secondary {
  background: var(--surface);
  color: var(--text);
  border: var(--biz-border);
}
.btn-secondary:hover:not(:disabled) {
  background: var(--surface-2);
  border-color: var(--line-2);
}

.btn-ghost {
  background: transparent;
  color: var(--text);
}
.btn-ghost:hover:not(:disabled) {
  background: var(--surface-2);
}

.btn-ai {
  background: linear-gradient(135deg, #a855f7 0%, #ec4899 100%);
  color: #fff;
  box-shadow: 0 1px 3px rgba(168, 85, 247, 0.3);
}
.btn-ai:hover:not(:disabled) {
  box-shadow: 0 4px 14px rgba(168, 85, 247, 0.4);
  transform: translateY(-1px);
}

.btn-sm {
  padding: 7px 12px;
  font-size: 12.5px;
  gap: 6px;
}
.btn-sm svg, .btn-sm [data-icon] { width: 14px; height: 14px; }

.btn-lg {
  padding: 14px 22px;
  font-size: 15px;
}
.btn-lg svg, .btn-lg [data-icon] { width: 18px; height: 18px; }

.btn-block { width: 100%; }

/* === БИЗНЕС-КАРТОЧКА (унифицированный стиль) === */
.biz-card {
  background: var(--surface);
  border: var(--biz-border);
  border-radius: var(--biz-radius-lg);
  padding: 18px;
  transition: var(--biz-transition);
  box-shadow: var(--biz-shadow-card);
}
.biz-card:hover {
  box-shadow: var(--biz-shadow-card-hover);
  border-color: var(--line-2);
}
.biz-card-clickable {
  cursor: pointer;
}
.biz-card-clickable:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--primary) 28%, var(--line));
}

.biz-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.biz-card-title {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--text);
  margin: 0;
}
.biz-card-subtitle {
  font-size: 12px;
  color: var(--muted);
  margin-top: 2px;
}

/* Бейдж в карточке */
.biz-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 100px;
  white-space: nowrap;
}
.biz-badge-success { background: color-mix(in srgb, #10b981 14%, transparent); color: #059669; }
.biz-badge-error   { background: color-mix(in srgb, #ef4444 14%, transparent); color: #dc2626; }
.biz-badge-warn    { background: color-mix(in srgb, #f59e0b 14%, transparent); color: #d97706; }
.biz-badge-info    { background: color-mix(in srgb, #3b82f6 14%, transparent); color: #2563eb; }
.biz-badge-neutral { background: var(--surface-2); color: var(--muted); }

/* === ХЕДЕР СТРАНИЦЫ (унифицированный) === */
.section-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}
.section-top h1 {
  margin: 0 0 6px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.015em;
  color: var(--text);
}
.section-top .eyebrow {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 4px;
}
.section-top p {
  margin: 0;
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.5;
  max-width: 600px;
}

/* === STATS GRID (для сводок наверху страниц) === */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 22px;
}
.stat-card {
  background: var(--surface);
  border: var(--biz-border);
  border-radius: var(--biz-radius-lg);
  padding: 16px 18px;
  position: relative;
  overflow: hidden;
}
.stat-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 3px;
  height: 100%;
  background: var(--stat-accent, var(--primary));
}
.stat-card-good { --stat-accent: #10b981; }
.stat-card-bad { --stat-accent: #ef4444; }
.stat-card-warn { --stat-accent: #f59e0b; }
.stat-card-info { --stat-accent: #3b82f6; }
.stat-card-ai { --stat-accent: #a855f7; }

.stat-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 6px;
}
.stat-value {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text);
  font-family: 'JetBrains Mono', monospace;
  font-feature-settings: "tnum";
}
.stat-value-good { color: #10b981; }
.stat-value-bad { color: #ef4444; }
.stat-value-warn { color: #f59e0b; }
.stat-sub {
  font-size: 11.5px;
  color: var(--muted);
  margin-top: 4px;
}

/* === ТАБЫ (унифицированы) === */
.biz-tabs {
  display: inline-flex;
  background: var(--surface);
  border: var(--biz-border);
  border-radius: var(--biz-radius-md);
  padding: 3px;
  gap: 2px;
  margin-bottom: 18px;
}
.biz-tab {
  background: transparent;
  border: none;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  border-radius: var(--biz-radius-sm);
  font-family: inherit;
  transition: var(--biz-transition);
}
.biz-tab:hover { color: var(--text); }
.biz-tab-active {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 1px 3px rgba(36, 92, 244, 0.3);
}
.biz-tab-active:hover { color: #fff; }

/* === ПУСТЫЕ СОСТОЯНИЯ === */
.empty {
  text-align: center;
  padding: 48px 24px;
  color: var(--muted);
  font-size: 13px;
}
.empty-state {
  text-align: center;
  padding: 60px 24px;
}
.empty-state-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  background: var(--surface-2);
  border-radius: 50%;
  margin-bottom: 14px;
  color: var(--muted);
}
.empty-state-icon svg, .empty-state-icon [data-icon] { width: 28px; height: 28px; }
.empty-state-title {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 6px;
}
.empty-state-desc {
  font-size: 13px;
  color: var(--muted);
  max-width: 380px;
  margin: 0 auto;
  line-height: 1.5;
}

/* === BUTTON HELP-MODULE (стандартизирован) === */
.module-help-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  background: var(--surface-2);
  border: var(--biz-border);
  border-radius: var(--biz-radius-md);
  color: var(--muted);
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  transition: var(--biz-transition);
  font-family: inherit;
}
.module-help-btn:hover {
  background: var(--surface);
  color: var(--text);
  border-color: var(--line-2);
}
.module-help-btn svg, .module-help-btn [data-icon] { width: 14px; height: 14px; }
.module-help-content {
  display: none;
  background: var(--surface-2);
  border-left: 3px solid var(--primary);
  border-radius: var(--biz-radius-md);
  padding: 16px 20px;
  margin-bottom: 20px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--text);
}
.module-help-content.module-help-open {
  display: block;
}
.module-help-content h4 {
  margin: 14px 0 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
}
.module-help-content h4:first-child { margin-top: 0; }
.module-help-content ul, .module-help-content ol {
  margin: 6px 0;
  padding-left: 22px;
}
.module-help-content li {
  margin-bottom: 4px;
}

/* === МОБИЛЬНАЯ АДАПТАЦИЯ === */
@media (max-width: 760px) {
  .modal-backdrop > .modal {
    max-height: calc(100vh - 24px);
    border-radius: var(--biz-radius-lg) var(--biz-radius-lg) 0 0;
    margin-top: auto !important;
    margin-bottom: 0 !important;
    align-self: flex-end;
  }
  .modal-backdrop { padding: 0; align-items: flex-end; }
  .modal-backdrop > .modal .modal-head { padding: 16px 18px; }
  .modal-backdrop > .modal .modal-body { padding: 18px; }
  .modal-backdrop > .modal .modal-footer { padding: 14px 18px; }
  .modal-backdrop > .modal .form-grid-2,
  .modal-backdrop > .modal .form-grid-3 {
    grid-template-columns: 1fr;
  }
  .stats-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  .stat-value { font-size: 18px; }
  .section-top h1 { font-size: 20px; }
}


/* ============================================================ */
/* СОВМЕСТИМОСТЬ — старые классы → новые токены (v15.65)        */
/* ============================================================ */

/* Forecast метрики → стиль stat-card */
#forecastMetrics, .cp-summary, .tax-summary, .kpi-metrics-grid, .bank-summary {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 22px !important;
}

.fc-metric, .cp-stat-card, .tax-stat-card, .kpi-card {
  background: var(--surface) !important;
  border: var(--biz-border) !important;
  border-radius: var(--biz-radius-lg) !important;
  padding: 16px 18px !important;
  position: relative;
  overflow: hidden;
}
.fc-metric::before, .cp-stat-card::before, .tax-stat-card::before, .kpi-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 3px;
  height: 100%;
  background: var(--card-accent, var(--primary));
}
.fc-metric.fc-good, .cp-stat-good, .kpi-good { --card-accent: #10b981; }
.fc-metric.fc-bad, .cp-stat-bad, .kpi-bad { --card-accent: #ef4444; }
.fc-metric.fc-warn, .cp-stat-warn, .kpi-warn { --card-accent: #f59e0b; }
.cp-stat-info, .kpi-info { --card-accent: #3b82f6; }

.fc-metric-label, .cp-stat-lbl, .tax-stat-lbl, .kpi-card-label {
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  margin-bottom: 6px !important;
}
.fc-metric-value, .cp-stat-num, .tax-stat-num, .kpi-card-value {
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--text);
  font-family: 'JetBrains Mono', monospace !important;
}
.fc-metric-sub, .cp-stat-sub, .tax-stat-sub, .kpi-card-hint {
  font-size: 11.5px !important;
  color: var(--muted) !important;
  margin-top: 4px !important;
}
.fc-metric.fc-good .fc-metric-value,
.cp-stat-good .cp-stat-num,
.kpi-good .kpi-card-value { color: #10b981 !important; }
.fc-metric.fc-bad .fc-metric-value,
.cp-stat-bad .cp-stat-num,
.kpi-bad .kpi-card-value { color: #ef4444 !important; }
.fc-metric.fc-warn .fc-metric-value,
.cp-stat-warn .cp-stat-num,
.kpi-warn .kpi-card-value { color: #f59e0b !important; }

/* Карточки банков — единый стиль */
.bank-card {
  background: var(--surface);
  border: var(--biz-border);
  border-radius: var(--biz-radius-lg);
  padding: 18px;
  transition: var(--biz-transition);
  box-shadow: var(--biz-shadow-card);
}
.bank-card:hover {
  box-shadow: var(--biz-shadow-card-hover);
  border-color: var(--line-2);
}

/* Карточки контрагентов */
.cp-card, .rec-card {
  background: var(--surface);
  border: var(--biz-border);
  border-radius: var(--biz-radius-lg);
  padding: 16px;
  transition: var(--biz-transition);
  box-shadow: var(--biz-shadow-card);
}
.cp-card:hover, .rec-card:hover {
  box-shadow: var(--biz-shadow-card-hover);
  transform: translateY(-1px);
}

/* Чипы и бейджи */
.cp-kind-badge, .rec-tag, .biz-badge,
.bank-status-badge, .bank-tx-status {
  border-radius: 100px !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  padding: 3px 9px !important;
}

/* Списки транзакций */
.bank-tx-item, .debt-item, .tax-item {
  border-radius: var(--biz-radius-md) !important;
  background: var(--surface) !important;
  border: var(--biz-border) !important;
  transition: var(--biz-transition);
}
.bank-tx-item:hover, .debt-item:hover, .tax-item:hover {
  border-color: var(--line-2) !important;
  background: var(--surface-2) !important;
}

/* Tabs во всех новых разделах */
.cp-tabs, .forecast-period-tabs, .kpi-period-tabs {
  display: inline-flex !important;
  background: var(--surface) !important;
  border: var(--biz-border) !important;
  border-radius: var(--biz-radius-md) !important;
  padding: 3px !important;
  gap: 2px !important;
}
.cp-tab, .forecast-period-tab, .kpi-period-tab {
  padding: 8px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: var(--biz-radius-sm) !important;
  transition: var(--biz-transition) !important;
  background: transparent !important;
  border: none !important;
  color: var(--muted) !important;
  cursor: pointer;
  font-family: inherit;
}
.cp-tab-active, .forecast-period-active, .kpi-period-active {
  background: var(--primary) !important;
  color: #fff !important;
  box-shadow: 0 1px 3px rgba(36, 92, 244, 0.3) !important;
}

/* Бюджет */
.bs-column {
  background: var(--surface) !important;
  border: var(--biz-border) !important;
  border-radius: var(--biz-radius-lg) !important;
  padding: 18px !important;
}


/* ============================================================ */
/* BANK PROVIDER PICKER (v15.67)                                */
/* ============================================================ */

.bank-provider-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}

.bank-provider-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px;
  background: var(--surface);
  border: var(--biz-border);
  border-radius: var(--biz-radius-lg);
  cursor: pointer;
  transition: var(--biz-transition);
  user-select: none;
}
.bank-provider-card:hover {
  border-color: color-mix(in srgb, var(--primary) 35%, var(--line));
  transform: translateY(-2px);
  box-shadow: var(--biz-shadow-card-hover);
}
.bank-provider-card[data-status="coming_soon"] {
  opacity: 0.7;
}

.bank-provider-logo {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 18px;
}
.bank-provider-logo svg, .bank-provider-logo [data-icon] svg {
  width: 22px;
  height: 22px;
}

.bank-provider-info {
  flex: 1;
  min-width: 0;
}
.bank-provider-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.2;
  margin-bottom: 2px;
}
.bank-provider-desc {
  font-size: 11.5px;
  color: var(--muted);
}

@media (max-width: 600px) {
  .bank-provider-grid {
    grid-template-columns: 1fr;
  }
}