/* ============================================================
   CRM — современная светлая тема.
   Все имена классов сохранены — меняется только внешний вид.
   Анимации «в меру»: мягкие появления, плавный hover, без перегруза.
   ============================================================ */

:root{
  /* Палитра */
  --bg:            #eef1f7;
  --bg-grad-1:     #eaf0fb;
  --bg-grad-2:     #f4eefb;
  --surface:       #ffffff;
  --surface-2:     #f7f9fc;
  --ink:           #1a2233;
  --ink-soft:      #5a6478;
  --muted:         #8b94a7;
  --line:          #e7ebf3;
  --line-soft:     #eef1f7;

  /* Бренд / акценты */
  --brand:         #5b6ef5;   /* индиго-фиолетовый */
  --brand-2:       #7c5cf0;
  --brand-ink:     #3f4fd6;
  --accent:        #f59e3c;   /* янтарь — баланс/деньги */
  --accent-soft:   #fff2df;
  --green:         #1faa6c;
  --green-soft:    #e3f7ee;
  --red:           #e2553f;
  --red-soft:      #fdeae6;

  /* Геометрия */
  --r-sm: 10px;
  --r:    14px;
  --r-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(26,34,51,.05), 0 2px 8px rgba(26,34,51,.04);
  --shadow:    0 2px 6px rgba(26,34,51,.06), 0 14px 40px rgba(26,34,51,.07);
  --shadow-lg: 0 8px 28px rgba(45,55,120,.16), 0 30px 70px rgba(45,55,120,.14);
  --ring: 0 0 0 4px rgba(91,110,245,.16);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);
  font-size:14.5px;
  line-height:1.55;
  background:
    radial-gradient(1200px 600px at 12% -10%, var(--bg-grad-1), transparent 60%),
    radial-gradient(1000px 600px at 110% 0%, var(--bg-grad-2), transparent 55%),
    var(--bg);
  background-attachment:fixed;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:"Manrope","Inter",sans-serif;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
a{color:var(--brand-ink)}

::selection{background:rgba(91,110,245,.18)}

/* Тонкий красивый скроллбар */
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:#cdd4e3;border-radius:20px;border:2px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background:#b6bfd4;background-clip:padding-box}

/* ===================== РАЗМЕТКА ===================== */
.layout{display:flex;min-height:100vh;
  /* Фиолетовая полоса под сайдбаром на всю высоту страницы: если
     position:sticky у сайдбара не сработал (его ломает overflow-x:hidden
     на body в части браузеров), при скролле под меню не остаётся белого. */
  background:linear-gradient(185deg,#222a55 0%,#2b2466 60%,#3a2670 100%);
  background-size:248px 100%;background-repeat:no-repeat}

/* ===================== САЙДБАР ===================== */
.sidebar{
  width:248px;flex-shrink:0;padding:22px 16px;
  position:sticky;top:0;height:100vh;
  background:linear-gradient(185deg,#222a55 0%,#2b2466 60%,#3a2670 100%);
  color:#c9cffc;
  box-shadow:inset -1px 0 0 rgba(255,255,255,.05);
  overflow-y:auto;
}
.brand{
  font-family:"Manrope",sans-serif;font-weight:800;font-size:18px;color:#fff;
  display:flex;align-items:center;gap:10px;margin:4px 8px 24px;letter-spacing:-.02em;
}
.brand-mark{
  width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:#fff;font-size:14px;box-shadow:0 6px 16px rgba(91,110,245,.5);
}
.nav{display:flex;flex-direction:column;gap:3px}
.nav-section{
  font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;
  color:#8088c4;margin:18px 12px 7px;font-weight:700;
}
.nav-link{
  position:relative;color:#c2c8f5;text-decoration:none;
  padding:9px 13px;border-radius:10px;font-size:14px;font-weight:500;
  display:flex;align-items:center;gap:11px;
  transition:background .18s ease,color .18s ease,transform .12s ease;
}
.nav-ico{
  width:22px;height:22px;flex-shrink:0;display:grid;place-items:center;
  font-size:14px;opacity:.85;
}
.nav-link:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(2px)}
.nav-link:hover .nav-ico{opacity:1}
.nav-link.active{
  background:linear-gradient(100deg,rgba(124,92,240,.9),rgba(91,110,245,.75));
  color:#fff;box-shadow:0 8px 20px rgba(72,60,180,.45);
}
.nav-link.active .nav-ico{opacity:1}

/* ===================== ОСНОВНОЕ ===================== */
.main{flex:1;display:flex;flex-direction:column;min-width:0}
/* Значки задач и важных событий стоят рядом, а не разъезжаются по шапке. */
.topbar-bells{display:flex;align-items:center;gap:8px;flex-shrink:0}
.topbar-bells .btn{position:relative;padding:9px 12px}
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 32px;position:sticky;top:0;z-index:20;
  background:rgba(255,255,255,.72);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
}
.page-title{margin:0;font-size:22px}
.user-chip{display:flex;align-items:center;gap:12px;font-size:13px}
.user-name{font-weight:600}
.user-role{
  background:var(--accent-soft);color:#b9722a;padding:3px 10px;border-radius:20px;
  font-size:11.5px;font-weight:600;text-transform:capitalize;
}
.logout{
  color:var(--ink-soft);text-decoration:none;border:1px solid var(--line);
  padding:6px 13px;border-radius:10px;font-weight:500;transition:all .16s;
  background:var(--surface);
}
.logout:hover{color:var(--red);border-color:var(--red);box-shadow:var(--shadow-sm)}

.content{padding:30px 32px 48px;max-width:1280px;width:100%;animation:rise .45s cubic-bezier(.2,.7,.2,1) backwards}

/* ===================== КАРТОЧКИ ===================== */
.card{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);box-shadow:var(--shadow-sm);padding:22px;
  transition:box-shadow .22s ease,transform .22s ease,border-color .22s ease;
}
.card:hover{box-shadow:var(--shadow)}
.card + .card{margin-top:18px}
.grid{display:grid;gap:18px;align-items:stretch}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.cols-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:stretch}
/* Карточки в сетках (.grid/.cols-2/.dash-grid) — без отступа от .card + .card,
   иначе вторая/третья карточка в строке визуально получается короче. */
.grid > .card,.cols-2 > .card{margin-top:0;height:100%}

/* Лёгкое каскадное появление карточек на странице */
.content .card{animation:rise .5s cubic-bezier(.2,.7,.2,1) backwards}
.content .grid-4 .card:nth-child(1){animation-delay:.02s}
.content .grid-4 .card:nth-child(2){animation-delay:.06s}
.content .grid-4 .card:nth-child(3){animation-delay:.10s}
.content .grid-4 .card:nth-child(4){animation-delay:.14s}

@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}

/* ===================== КНОПКИ ===================== */
.btn{
  display:inline-flex;align-items:center;gap:7px;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:#fff;border:none;padding:10px 18px;border-radius:11px;
  font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;text-decoration:none;
  box-shadow:0 6px 16px rgba(91,110,245,.32);
  transition:transform .14s ease,box-shadow .2s ease,filter .2s ease;
}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(91,110,245,.42);filter:brightness(1.04)}
.btn:active{transform:translateY(0)}
.btn-accent{background:linear-gradient(135deg,#f7a83f,#ef8a2c);box-shadow:0 6px 16px rgba(239,138,44,.34)}
.btn-green{background:linear-gradient(135deg,#1faa6c,#128f6b);box-shadow:0 6px 16px rgba(31,170,108,.34)}
.btn-green:hover{box-shadow:0 10px 24px rgba(31,170,108,.44)}
.btn-accent:hover{box-shadow:0 10px 24px rgba(239,138,44,.44)}
.btn-ghost{
  background:var(--surface);color:var(--ink);border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
}
.btn-ghost:hover{border-color:#cfd6e6;background:var(--surface-2);transform:translateY(-1px)}

/* ===================== ТАБЛИЦЫ ===================== */
table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px}
th{
  text-align:left;color:var(--muted);font-weight:600;font-size:11.5px;
  text-transform:uppercase;letter-spacing:.05em;padding:11px 14px;
  border-bottom:1px solid var(--line);
}
td{padding:13px 14px;border-bottom:1px solid var(--line-soft)}
tbody tr{transition:background .14s ease}
tbody tr:hover td{background:var(--surface-2)}
/* Строка-ссылка: вся строка кликабельна (сотрудники, карты, изъятия). */
tr.row-click{cursor:pointer}
tr.row-click:hover td{background:color-mix(in srgb,var(--brand) 6%,var(--surface-2))}
tbody tr:last-child td{border-bottom:none}

/* ===================== ПИЛЮЛИ БАЛАНСА ===================== */
.bal{
  display:inline-flex;align-items:center;gap:5px;padding:3px 11px;border-radius:20px;
  font-size:12.5px;font-weight:700;margin:2px 2px 0 0;
}
.bal-pos{background:var(--green-soft);color:#138a55}
.bal-neg{background:var(--red-soft);color:#cf4023}
.bal-zero{background:#eef1f7;color:var(--muted)}

/* ===================== STAT-КАРТОЧКИ ===================== */
.stat{text-decoration:none;color:var(--ink);display:block;position:relative;overflow:hidden}
.stat::after{
  content:"";position:absolute;right:-30px;top:-30px;width:120px;height:120px;border-radius:50%;
  background:radial-gradient(circle,rgba(91,110,245,.10),transparent 70%);
}
a.stat:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.stat-label{font-size:13px;color:var(--muted);margin-bottom:8px;font-weight:500}
.stat-value{font-family:"Manrope",sans-serif;font-size:27px;font-weight:800;letter-spacing:-.02em}

/* ===================== ТУЛБАР / ПОИСК ===================== */
.toolbar{display:flex;gap:12px;align-items:center;margin-bottom:20px;flex-wrap:wrap}
.toolbar h2{font-size:21px}
.toolbar .search,.search{
  flex:1;min-width:240px;padding:11px 16px;border:1px solid var(--line);
  border-radius:12px;font-size:14.5px;background:var(--surface);box-shadow:var(--shadow-sm);
  transition:border-color .16s,box-shadow .16s;
}
.search:focus{outline:none;border-color:var(--brand);box-shadow:var(--ring)}
.spacer{flex:1}

/* ===================== ФОРМЫ ===================== */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-grid .full{grid-column:1/-1}
label.lbl{display:block;font-size:12.5px;color:var(--ink-soft);margin-bottom:6px;font-weight:600}
input[type=text],input[type=tel],input[type=email],input[type=password],
input[type=date],input[type=time],input[type=number],select,textarea{
  width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:11px;
  font-size:14px;font-family:inherit;background:var(--surface);color:var(--ink);
  transition:border-color .16s,box-shadow .16s;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:var(--ring)}
textarea{resize:vertical}
.actions{display:flex;gap:10px;margin-top:20px}

/* ===================== БЕЙДЖИ ===================== */
.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11.5px;font-weight:600;background:#eef1fb;color:var(--brand-ink)}
.badge-role{background:var(--accent-soft);color:#b9722a}
.badge-warn{background:var(--red-soft);color:#cf4023}

/* ===================== KANBAN ===================== */
.kanban{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.kanban-col{
  background:linear-gradient(180deg,rgba(255,255,255,.6),rgba(247,249,252,.6));
  border:1px solid var(--line);border-radius:var(--r);padding:14px;min-height:140px;
}
.kanban-col h4{margin:0 0 12px;font-size:14px;display:flex;align-items:center;gap:6px}
.kanban-card{
  background:var(--surface);border:1px solid var(--line);border-radius:12px;
  padding:13px;margin-bottom:11px;box-shadow:var(--shadow-sm);
  transition:transform .15s,box-shadow .2s;animation:pop .3s ease backwards;
}
.kanban-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.kanban-card .meta{font-size:11.5px;color:var(--muted);margin-top:7px}
.prio-high{border-left:3px solid var(--red)}
.prio-medium{border-left:3px solid var(--accent)}
.prio-low{border-left:3px solid var(--green)}
.task-new{outline:2px solid var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}

/* ===================== РАСПИСАНИЕ ===================== */
.sched-day{display:flex;flex-direction:column;gap:10px}
.sched-row{
  display:flex;gap:14px;align-items:flex-start;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);padding:15px 16px;
  box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .2s;animation:rise .4s ease backwards;
}
.sched-row:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.sched-time{
  font-weight:700;min-width:118px;color:var(--brand-ink);
  font-family:"Manrope",sans-serif;
}

/* ===================== МОДАЛКИ ===================== */
dialog{
  border:none;border-radius:var(--r-lg);padding:0;max-width:580px;width:92%;
  box-shadow:var(--shadow-lg);color:var(--ink);
  animation:dialogIn .26s cubic-bezier(.2,.8,.2,1);
}
dialog::backdrop{background:rgba(26,30,60,.45);backdrop-filter:blur(3px)}
@keyframes dialogIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.modal-head{padding:20px 24px;border-bottom:1px solid var(--line);font-family:"Manrope",sans-serif;font-weight:700;font-size:18px}
.modal-body{padding:24px}
.modal-foot{padding:16px 24px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px;background:var(--surface-2);border-radius:0 0 var(--r-lg) var(--r-lg)}

/* ===================== ТУР ПО САЙТУ ===================== */
.tour-pulse{
  outline:3px solid var(--amber, #f5a623)!important;
  outline-offset:3px;border-radius:8px;
  animation:tourPulse 1.2s ease-in-out infinite;
  position:relative;z-index:5;
}
@keyframes tourPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(245,166,35,.55)}
  50%{box-shadow:0 0 0 8px rgba(245,166,35,0)}
}
.tour-panel{
  position:fixed;right:18px;bottom:18px;width:320px;max-width:90vw;
  background:var(--surface,#fff);color:var(--ink);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);z-index:9999;border:1px solid var(--line);
  animation:dialogIn .26s cubic-bezier(.2,.8,.2,1);
}
.tour-head{
  padding:14px 18px;font-family:"Manrope",sans-serif;font-weight:700;font-size:15px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  cursor:move;user-select:none;touch-action:none;
}
.tour-min-btn{
  flex:none;border:none;background:var(--surface-2);color:var(--ink);border-radius:8px;
  width:26px;height:26px;cursor:pointer;font-size:14px;line-height:1;
}
.tour-text{padding:4px 18px 12px;font-size:13.5px;color:var(--muted,#666)}
.tour-actions{padding:0 14px 14px;display:flex;flex-wrap:wrap;gap:8px}
.tour-goto{display:inline-block;margin:0 18px 12px}
.tour-panel.tour-min .tour-collapsible{display:none}
.tour-panel.tour-min{width:auto}

/* ===================== AUTOCOMPLETE ===================== */
.autocomplete-list{
  position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:50;
  background:var(--surface,#fff);border:1px solid var(--line);border-radius:var(--r-sm);
  box-shadow:var(--shadow-lg);max-height:260px;overflow-y:auto;
}
.autocomplete-item{padding:9px 12px;cursor:pointer;font-size:13.5px;border-bottom:1px solid var(--line-soft)}
.autocomplete-item:last-child{border-bottom:none}
.autocomplete-item:hover,.autocomplete-item.active{background:var(--surface-2)}
.autocomplete-item .ac-name{font-weight:600}
.autocomplete-item .ac-meta{color:var(--muted);font-size:12px}

/* ===================== ВСПЛЫВАЮЩИЕ УВЕДОМЛЕНИЯ (TOAST) ===================== */
.toasts{
  position:fixed;top:18px;right:18px;z-index:10000;
  display:flex;flex-direction:column;gap:10px;max-width:360px;
}
.toast{
  background:var(--surface,#fff);color:var(--ink);border-radius:var(--r);
  box-shadow:var(--shadow-lg);padding:14px 16px;display:flex;align-items:flex-start;gap:10px;
  border-left:4px solid var(--brand);font-size:14px;line-height:1.4;
  animation:toastIn .3s cubic-bezier(.2,.8,.2,1);
}
.toast span{flex:1}
.toast-error{border-left-color:var(--red)}
.toast-success{border-left-color:var(--green)}
.toast-close{
  border:none;background:none;cursor:pointer;color:var(--muted);font-size:18px;line-height:1;
  padding:0 2px;
}
@keyframes toastIn{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}

/* ===================== ВХОД ===================== */
.auth-wrap{
  min-height:100vh;display:grid;place-items:center;padding:20px;
  background:
    radial-gradient(900px 500px at 20% 10%, #3b2f7a, transparent 60%),
    radial-gradient(800px 500px at 90% 90%, #2b3a8f, transparent 55%),
    linear-gradient(160deg,#232a55,#2a2266);
}
.auth-card{
  background:rgba(255,255,255,.96);width:100%;max-width:380px;padding:38px 34px;
  border-radius:var(--r-lg);box-shadow:var(--shadow-lg);
  animation:rise .5s cubic-bezier(.2,.7,.2,1) backwards;
}
.auth-card h1{margin:0 0 4px;font-size:25px}
.auth-sub{color:var(--muted);margin:0 0 24px;font-size:14px}
.field{margin-bottom:16px}
.field label{display:block;font-size:12.5px;color:var(--ink-soft);margin-bottom:6px;font-weight:600}
.field input{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:12px;font-size:15px;transition:border-color .16s,box-shadow .16s}
.field input:focus{outline:none;border-color:var(--brand);box-shadow:var(--ring)}
.auth-error{background:var(--red-soft);color:#cf4023;padding:11px 14px;border-radius:11px;font-size:13px;margin-bottom:16px}
.btn-block{width:100%;justify-content:center;padding:13px}

/* ===================== УТИЛИТЫ ===================== */
.flex{display:flex;gap:10px;align-items:center}
.muted{color:var(--muted)}
.right{text-align:right}
.mt{margin-top:18px}
.inline-form{display:inline}

/* Уважение к настройкам «уменьшить движение» */
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
}

/* ===================== АДАПТИВ ===================== */
@media(max-width:920px){
  .grid-3,.grid-4{grid-template-columns:1fr 1fr}
  .kanban{grid-template-columns:1fr 1fr}
  .cols-2{grid-template-columns:1fr}
}
.sidebar-close{display:none}
.sidebar-backdrop{display:none}
.sidebar-foot{display:none}
@media(max-width:680px){
  .layout{background:none} /* на мобильных сайдбар — выезжающая панель, полоса не нужна */
  .sidebar{position:fixed;left:-260px;z-index:60;transition:left .25s;display:flex;flex-direction:column;height:100vh}
  .sidebar.open{left:0}
  .brand{display:flex;align-items:center;gap:10px}
  .sidebar-close{
    display:grid;place-items:center;margin-left:auto;width:30px;height:30px;flex-shrink:0;
    background:rgba(255,255,255,.1);border:none;border-radius:9px;color:#fff;font-size:20px;
    line-height:1;cursor:pointer;
  }
  .sidebar-close:hover{background:rgba(255,255,255,.18)}
  .nav{flex:1;overflow-y:auto}
  .sidebar-foot{
    display:block;margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12);flex-shrink:0;
  }
  .sidebar-user{
    display:flex;flex-direction:column;gap:2px;padding:8px 13px;text-decoration:none;border-radius:10px;
  }
  .sidebar-user:hover{background:rgba(255,255,255,.08)}
  .sidebar-user-name{color:#fff;font-weight:600;font-size:14px}
  .sidebar-user-role{color:#9aa0d8;font-size:12px;text-transform:capitalize}
  .sidebar-logout{
    display:block;margin:8px 13px 2px;text-align:center;
  }
  .sidebar-backdrop{
    display:none;position:fixed;inset:0;z-index:55;background:rgba(20,18,45,.45);
  }
  .sidebar-backdrop.show{display:block}
  .grid-3,.grid-4,.kanban,.form-grid{grid-template-columns:1fr}
  .content{padding:20px 16px 40px}
  .topbar{padding:14px 18px}
}

/* Кнопка-гамбургер (видна только на узких экранах) */
.menu-toggle{
  display:none;background:var(--surface);border:1px solid var(--line);
  width:40px;height:40px;border-radius:11px;font-size:18px;cursor:pointer;
  color:var(--ink);box-shadow:var(--shadow-sm);
}
@media(max-width:680px){ .menu-toggle{display:grid;place-items:center} }

/* ===================== МОБИЛЬНЫЙ ВИД: НИКАКОГО ГОРИЗОНТАЛЬНОГО СКРОЛЛА =====================
   На узких экранах строки таблиц превращаются в вертикальные карточки.
   Подпись поля берётся из data-label на <td> (заголовок <th> при этом скрыт).
   .rate-table — настоящая матрица (ставка × кол-во детей), её оставляем как есть,
   со своим внутренним overflow-x внутри обёртки в разметке. */
html,body{overflow-x:hidden;max-width:100%}
@media(max-width:680px){
  table:not(.rate-table){display:block;width:100%}
  table:not(.rate-table) thead{display:none}
  table:not(.rate-table) tbody,
  table:not(.rate-table) tfoot,
  table:not(.rate-table) tr{display:block;width:100%}
  table:not(.rate-table) tr{
    border:1px solid var(--line);border-radius:var(--r);margin-bottom:10px;
    padding:2px 14px;box-shadow:var(--shadow-sm);background:var(--surface);
  }
  table:not(.rate-table) td{
    display:flex;justify-content:space-between;align-items:center;gap:10px;
    width:100%;text-align:right;padding:9px 0;border-bottom:1px dashed var(--line-soft);
  }
  table:not(.rate-table) td:last-child{border-bottom:none}
  table:not(.rate-table) td.right{justify-content:flex-end}
  table:not(.rate-table) td[colspan]{justify-content:center;text-align:center}
  table:not(.rate-table) td::before{
    content:attr(data-label);flex-shrink:0;text-align:left;
    font-weight:600;font-size:11.5px;color:var(--muted);
    text-transform:uppercase;letter-spacing:.05em;
  }
  table:not(.rate-table) td:not([data-label])::before,
  table:not(.rate-table) td[data-label=""]::before{content:none}
  table tfoot tr{box-shadow:none}
}

/* ===== МОБИЛЬНЫЙ АДАПТИВ: длинное содержимое переносится ВНИЗ, вправо ничего не вылезает ===== */
@media(max-width:680px){
  /* Строки уроков (посещаемость, журнал посещений): время, название и бейджи
     переносятся на следующую строку, а не выталкивают карточку за край экрана. */
  .att-lesson{flex-wrap:wrap;gap:4px 12px;padding-right:12px}
  .att-time{min-width:0;padding:12px 0 0}
  .att-info{flex:1 1 170px;min-width:0;padding:12px 0 6px}
  .att-subj,.att-sub{overflow-wrap:anywhere}
  .att-go{display:none} /* вся строка и так кликабельна */
  .att-lesson .att-flag,.att-lesson .lg{margin-bottom:10px}
  /* Строки дашборда («Скоро закончатся», «Долги», «Занятия сегодня») */
  .alert-row{flex-wrap:wrap}
  .alert-row>span:first-child{min-width:0;overflow-wrap:anywhere}
  .tl-subj,.tl-meta{overflow-wrap:anywhere}
  /* Содержимое карточек не растягивает страницу длинными словами/ФИО */
  .card{min-width:0;overflow-wrap:break-word}
}

/* Живая сводка в окне продажи абонемента */
.buy-summary{
  margin-top:18px;padding:14px 16px;border-radius:12px;
  background:linear-gradient(120deg,var(--accent-soft),#fff6ea);
  border:1px solid #f4dcb8;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
}
.buy-summary #sumMain{font-family:"Manrope",sans-serif;font-weight:800;font-size:18px;color:#a4641f}

/* ============== СЕГМЕНТ-ПЕРЕКЛЮЧАТЕЛЬ ============== */
.seg{display:inline-flex;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:3px;gap:2px}
.seg-btn{padding:7px 16px;border-radius:9px;font-weight:600;font-size:13.5px;color:var(--ink-soft);text-decoration:none;transition:all .15s}
.seg-btn.on{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;box-shadow:0 2px 8px rgba(91,110,245,.35)}
.seg-btn:hover:not(.on){color:var(--ink);background:var(--surface)}

/* ============== НАВИГАЦИЯ ПО ДАТЕ ============== */
.date-nav{display:flex;align-items:center;gap:8px}
.nav-btn{
  width:36px;height:36px;border-radius:10px;border:1px solid var(--line);background:var(--surface);
  display:grid;place-items:center;font-size:20px;color:var(--ink-soft);text-decoration:none;
  box-shadow:var(--shadow-sm);transition:all .15s;line-height:1;
}
.nav-btn:hover{border-color:var(--brand);color:var(--brand-ink);transform:translateY(-1px)}
.nav-btn.disabled{opacity:.4;pointer-events:none}
.date-label{font-family:"Manrope",sans-serif;font-weight:700;font-size:15px;min-width:200px;text-align:center}

.bell-badge{
  position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 3px;
  background:var(--red);color:#fff;border-radius:20px;font-size:10px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;line-height:1;
}
.branch-switcher select{
  padding:7px 11px;border:1px solid var(--line);border-radius:10px;font-size:13px;
  font-family:inherit;background:var(--surface);color:var(--ink);cursor:pointer;
}
.edit-series-ico{cursor:pointer;opacity:.55;transition:opacity .14s}
.edit-series-ico:hover{opacity:1}

/* ============== ПАГИНАЦИЯ СПИСКОВ ============== */
.pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:18px}
.pager-label{font-size:13.5px;color:var(--ink-soft);font-weight:600}

/* ============== ДЕНЬ: СЕТКА ПО ЧАСАМ ============== */
.day-wrap{padding:0;overflow:hidden}
.day-grid{position:relative;padding:14px 14px 14px 64px}
.hour-line{position:absolute;left:0;right:0;border-top:1px solid var(--line-soft);height:0}
.hour-label{position:absolute;left:10px;top:-9px;font-size:11.5px;color:var(--muted);font-weight:600;background:var(--surface);padding-right:6px}
.day-lessons{position:absolute;left:64px;right:14px;top:14px;bottom:14px}
.lesson{
  position:absolute;left:0;right:0;display:flex;gap:0;overflow:hidden;
  background:color-mix(in srgb, var(--c) 9%, #fff);
  border:1px solid color-mix(in srgb, var(--c) 30%, #fff);
  border-radius:12px;text-decoration:none;color:var(--ink);
  box-shadow:var(--shadow-sm);transition:transform .14s,box-shadow .2s,filter .2s;
  animation:rise .35s ease backwards;
}
.lesson:hover{transform:translateY(-1px) scale(1.004);box-shadow:var(--shadow);filter:brightness(1.01);z-index:5}
.lesson-bar{width:5px;background:var(--c);flex-shrink:0}
.lesson-in{padding:6px 12px;min-width:0;flex:1;overflow:hidden}
.lesson-top{display:flex;align-items:baseline;gap:10px;flex-wrap:nowrap;min-width:0}
.lesson-time{font-family:"Manrope",sans-serif;font-weight:700;font-size:13px;color:color-mix(in srgb, var(--c) 70%, #333);flex-shrink:0}
.lesson-subj{font-weight:700;font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.lesson-meta{font-size:12.5px;color:var(--ink-soft);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* линия текущего времени */
.now-line{position:absolute;left:54px;right:14px;border-top:2px solid var(--red);height:0;z-index:6}
.now-dot{position:absolute;left:-6px;top:-6px;width:10px;height:10px;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px rgba(226,85,63,.18)}

.hint{margin-top:12px;text-align:center;font-size:13px}
.field-hint{margin:4px 0 0;font-size:12px;color:var(--muted)}

/* ============== НЕДЕЛЯ: КОЛОНКИ ============== */
.week-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
.week-col{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-sm);min-height:160px}
.week-col.is-today{border-color:var(--brand);box-shadow:var(--ring)}
.week-head{padding:10px 12px;background:var(--surface-2);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:1px}
.week-col.is-today .week-head{background:linear-gradient(120deg,rgba(91,110,245,.12),rgba(124,92,240,.10))}
.week-head .wd{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.week-head .wn{font-family:"Manrope",sans-serif;font-weight:700;font-size:14px}
.week-body{padding:10px;display:flex;flex-direction:column;gap:8px}
.week-empty{color:var(--muted);text-align:center;padding:14px 0;font-size:18px}
.wk-card{display:flex;flex-direction:column;gap:1px;padding:8px 10px;border-radius:10px;text-decoration:none;color:var(--ink);
  background:color-mix(in srgb, var(--c) 10%, #fff);border-left:3px solid var(--c);transition:transform .14s,box-shadow .2s}
.wk-card:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.wk-time{font-family:"Manrope",sans-serif;font-weight:700;font-size:12px;color:color-mix(in srgb,var(--c) 70%,#333)}
.wk-subj{font-weight:700;font-size:13.5px;line-height:1.2}
.wk-meta{font-size:11.5px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ============== НЕДЕЛЯ: СЕТКА-КАЛЕНДАРЬ ============== */
.weekcal{padding:0;overflow:hidden}
/* Только горизонтальная прокрутка. Вертикальную браузер всё равно считает
   скролл-портом (это следствие overflow-x), поэтому колёсико над сеткой
   пробрасывается странице скриптом в schedule/index.php. */
.weekcal-scroll{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain}
.wc-head,.wc-body{display:grid;grid-template-columns:58px repeat(7,minmax(132px,1fr))}
.wc-head{position:sticky;top:0;z-index:6;background:var(--surface);border-bottom:1px solid var(--line)}
.wc-dayhead{display:flex;flex-direction:column;gap:1px;align-items:center;padding:9px 6px;text-decoration:none;color:var(--ink);border-left:1px solid var(--line-soft);transition:background .15s}
.wc-dayhead:hover{background:var(--surface-2)}
.wc-dayhead .wd{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.wc-dayhead .wn{font-family:"Manrope",sans-serif;font-weight:700;font-size:14px}
.wc-dayhead.is-today{background:linear-gradient(120deg,rgba(91,110,245,.14),rgba(124,92,240,.10))}
.wc-dayhead.is-today .wn{color:var(--brand-ink)}
.wc-body{position:relative}
.wc-gutter{position:relative}
.wc-hour{position:absolute;right:8px;transform:translateY(-50%);font-size:11px;color:var(--muted);font-family:"Manrope",sans-serif;font-weight:600;white-space:nowrap}
.wc-col{position:relative;border-left:1px solid var(--line-soft);cursor:pointer}
.wc-col.is-today{background:color-mix(in srgb,var(--brand) 4%,transparent)}
.wc-col.drop-hot{background:color-mix(in srgb,var(--brand) 9%,transparent)}
.wc-line{position:absolute;left:0;right:0;border-top:1px solid var(--line-soft);height:0}
.wc-now{position:absolute;left:0;right:0;height:0;border-top:2px solid var(--red);z-index:4}
.wc-now::before{content:"";position:absolute;left:-3px;top:-4.5px;width:8px;height:8px;border-radius:50%;background:var(--red)}
.wc-lesson{position:absolute;left:3px;right:3px;display:flex;flex-direction:column;gap:0;overflow:hidden;
  border-radius:8px;text-decoration:none;color:var(--ink);background:color-mix(in srgb,var(--c) 15%,#fff);
  border-left:3px solid var(--c);padding:3px 7px;box-shadow:var(--shadow-sm);z-index:3;
  transition:transform .12s,box-shadow .2s,filter .2s}
.wc-lesson:hover{transform:scale(1.012);box-shadow:var(--shadow);filter:brightness(1.01);z-index:5}
.wc-lesson.dragging{opacity:.5}
/* Узкая карточка (несколько уроков в одно время делят ширину дня) — компактнее. */
.wc-lesson.is-narrow{padding:2px 4px;border-radius:6px;gap:1px}
.wc-lesson.is-narrow .wcl-time{font-size:10px}
.wc-lesson.is-narrow .wcl-subj{font-size:11.5px}
.wc-lesson.is-narrow .wc-room{font-size:9.5px;padding:0 4px}
/* Три и более одновременных урока — ещё компактнее, но предмет и кабинет
   остаются читаемыми и кликабельными (полные детали — в подсказке и по клику). */
.wc-lesson.is-tiny{padding:2px 3px;border-left-width:2px}
.wc-lesson.is-tiny .wcl-subj{font-size:10.5px;line-height:1.1}
.wc-lesson.is-tiny .wc-room{font-size:9px;padding:0 3px;margin-top:1px}
.wc-lesson.is-tiny .wcl-meta{font-size:9.5px}
.wcl-time{font-family:"Manrope",sans-serif;font-weight:700;font-size:11px;color:color-mix(in srgb,var(--c) 70%,#333);white-space:nowrap;flex-shrink:0}
.wcl-subj{font-weight:700;font-size:12.5px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}
.wcl-meta{font-size:11px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:720px){
  .wc-head,.wc-body{grid-template-columns:44px repeat(7,minmax(104px,1fr))}
  .wc-hour{right:5px;font-size:10px}
}

/* ===== Бейдж кабинета с цветом филиала (фон = цвет филиала) ===== */
.wc-room,.day-room,.mc-room{display:inline-block;font-weight:700;border-radius:5px;white-space:nowrap;
  background:color-mix(in srgb,var(--bc) 28%,#fff);
  color:color-mix(in srgb,var(--bc) 62%,#181818);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bc) 45%,transparent)}
.wc-room{font-size:10.5px;padding:1px 6px;align-self:flex-start;margin-top:2px}
.day-room{font-size:12px;padding:1px 8px}
.mc-room{font-size:10px;padding:0 4px;flex-shrink:0;max-width:54px;overflow:hidden;text-overflow:ellipsis}

/* ===== Легенда филиалов (цвет → название) ===== */
.branch-legend{display:flex;flex-wrap:wrap;align-items:center;gap:7px 16px;margin:14px 2px 0;font-size:12.5px;color:var(--ink-soft)}
.branch-legend .bl-label{font-weight:700;color:var(--ink)}
.bl-item{display:inline-flex;align-items:center;gap:6px}
.bl-dot{width:13px;height:13px;border-radius:4px;display:inline-block;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}

/* ============== МЕСЯЦ (календарь) ============== */
.month-card{padding:14px}
.month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.month-head{margin-bottom:6px}
.month-dow{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700;text-align:center;padding:4px 0}
.month-cell{min-height:96px;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:6px;display:flex;flex-direction:column;gap:4px}
.month-cell.out{background:var(--surface-2);opacity:.55}
.month-cell.is-today{border-color:var(--brand);box-shadow:var(--ring)}
.month-daynum{font-family:"Manrope",sans-serif;font-weight:700;font-size:13px;color:var(--ink);text-decoration:none;align-self:flex-start;min-width:22px;text-align:center;border-radius:6px;padding:1px 4px}
.month-cell.is-today .month-daynum{background:var(--brand);color:#fff}
.month-items{display:flex;flex-direction:column;gap:3px;overflow:hidden}
.month-chip{display:flex;align-items:center;gap:4px;font-size:11px;line-height:1.25;padding:2px 5px;border-radius:6px;text-decoration:none;color:var(--ink);
  background:color-mix(in srgb, var(--c) 12%, #fff);border-left:3px solid var(--c)}
.month-chip .mc-time{font-weight:700;color:color-mix(in srgb,var(--c) 70%,#333);flex-shrink:0}
.month-chip .mc-subj{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.month-more{font-size:11px;color:var(--ink-soft);text-decoration:none;padding:1px 5px}
.month-more:hover{color:var(--brand-ink)}
@media (max-width:720px){
  .month-cell{min-height:64px}
  .month-chip{font-size:10px}
  .mc-room{display:none} /* в узкой ячейке месяца бейдж кабинета не помещается */
}

/* ============== ФИЛЬТРЫ (чекбоксы-чипы) ============== */
.hidden{display:none}
.filter-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.chip-check{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;
  background:var(--surface);font-size:13px;cursor:pointer;user-select:none;transition:border-color .15s,background .15s}
.chip-check:hover{border-color:var(--brand)}
.chip-check:has(input:checked){border-color:var(--brand);background:color-mix(in srgb,var(--brand) 12%,#fff)}

/* ============== ПУСТЫЕ СОСТОЯНИЯ ============== */
.empty{
  text-align:center;padding:60px 24px;background:var(--surface);border:1px dashed var(--line);
  border-radius:var(--r-lg);animation:rise .4s ease backwards;
}
.empty-emoji{font-size:46px;margin-bottom:8px;opacity:.9}
.empty h3{margin:0 0 6px;font-size:19px}
.empty p{margin:0 0 18px}

@media(max-width:920px){
  .week-grid{grid-template-columns:repeat(3,1fr)}
  .date-label{min-width:auto}
}
@media(max-width:680px){
  .week-grid{grid-template-columns:1fr 1fr}
  .toolbar{gap:8px}
}

/* ============== ПОСЕЩАЕМОСТЬ ============== */
.lesson-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;margin-bottom:18px}
/* Шапка урока окрашивается по статусу отметки: зелёная — отмечены все, янтарная — часть */
.lesson-head.att-done{background:linear-gradient(120deg,var(--green-soft),#f4fcf8);border-color:#c5ecd6}
.lesson-head.att-partial{background:linear-gradient(120deg,var(--accent-soft),#fffaf1);border-color:#f4dcb8}
.lh-subj{font-family:"Manrope",sans-serif;font-weight:800;font-size:21px;letter-spacing:-.02em}
.lh-meta{color:var(--ink-soft);margin-top:5px;font-size:14px}
.lh-legend{display:flex;flex-direction:column;gap:5px;font-size:12px}
.lg{padding:3px 10px;border-radius:20px;font-weight:600}
.lg-present{background:var(--green-soft);color:#138a55}
.lg-excused{background:var(--accent-soft);color:#b9722a}
.lg-unexcused{background:var(--red-soft);color:#cf4023}

.att-list{display:flex;flex-direction:column;gap:10px}
.att-row{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:14px 18px;box-shadow:var(--shadow-sm);animation:rise .35s ease backwards;
}
.att-row-unmarked{border-color:#f3c8bd;background:color-mix(in srgb,var(--red) 4%,var(--surface))}
.att-who{display:flex;align-items:center;gap:12px;min-width:200px}
.avatar{
  width:40px;height:40px;border-radius:12px;flex-shrink:0;display:grid;place-items:center;
  font-family:"Manrope",sans-serif;font-weight:700;font-size:14px;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
}
.att-name{font-weight:600;font-size:15px}
.att-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

.seg-status{
  border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);
  padding:9px 16px;border-radius:11px;font-weight:700;font-size:13.5px;cursor:pointer;
  font-family:inherit;transition:all .14s;
}
.seg-status:hover{transform:translateY(-1px)}
.s-present.on{background:var(--green);border-color:var(--green);color:#fff;box-shadow:0 6px 16px rgba(31,170,108,.32)}
.s-excused.on{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 6px 16px rgba(245,158,60,.32)}
.s-unexcused.on{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 6px 16px rgba(226,85,63,.32)}

.reason-input{max-width:220px}
.reason-input.hidden{display:none}

.att-foot{
  position:sticky;bottom:16px;margin-top:18px;display:flex;align-items:center;justify-content:space-between;
  gap:16px;flex-wrap:wrap;box-shadow:var(--shadow);
}
.att-summary{font-size:14px;color:var(--ink-soft)}
.att-summary b{color:var(--ink);font-family:"Manrope",sans-serif}

/* Список уроков для отметки (посещаемость, главная) */
.att-lesson{
  display:flex;align-items:center;gap:16px;text-decoration:none;color:var(--ink);
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:0 18px 0 0;overflow:hidden;box-shadow:var(--shadow-sm);
  transition:transform .14s,box-shadow .2s;animation:rise .35s ease backwards;margin-bottom:10px;
}
.att-lesson:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.att-bar{width:6px;align-self:stretch;background:var(--c)}
.att-time{font-family:"Manrope",sans-serif;font-weight:800;font-size:15px;color:color-mix(in srgb,var(--c) 70%,#333);padding:16px 0;min-width:120px}
.att-info{display:flex;flex-direction:column;flex:1;padding:14px 0}
.att-subj{font-weight:700;font-size:15.5px}
.att-sub{font-size:13px;color:var(--ink-soft)}
.att-go{font-weight:700;color:var(--brand-ink);font-size:14px}
.att-lesson:hover .att-go{text-decoration:underline}

/* Кликабельное имя внутри строки-ссылки (журнал, дашборд): переход по вложенной цели */
.jlink{cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
.jlink:hover{color:var(--brand-ink)}

/* Флаг отметки посещаемости в списке уроков */
.att-flag{font-size:12px;font-weight:700;padding:4px 11px;border-radius:20px;white-space:nowrap;flex-shrink:0}
.att-flag-warn{background:var(--red-soft);color:#cf4023}
.att-flag-partial{background:var(--accent-soft);color:#b9722a}
.att-flag-ok{background:var(--green-soft);color:#138a55}

/* Индикатор непроверенных уроков в чипах месячного вида */
.month-chip-warn{box-shadow:inset 0 0 0 1px #cf4023}
.month-chip-partial{box-shadow:inset 0 0 0 1px #b9722a}

/* ============================================================
   ДАШБОРД — образовательный центр
   ============================================================ */
.hero{
  position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:30px 32px;border-radius:var(--r-lg);margin-bottom:20px;overflow:hidden;
  background:
    radial-gradient(600px 200px at 90% -20%, rgba(245,158,60,.20), transparent 60%),
    linear-gradient(120deg,#2a2f63 0%,#3a2c78 55%,#4a2d82 100%);
  color:#fff;box-shadow:var(--shadow-lg);animation:rise .5s ease backwards;
}
.hero::after{
  content:"✎ ✏ ✐ ✑ ✒";position:absolute;right:-10px;bottom:-26px;font-size:90px;opacity:.06;letter-spacing:8px;white-space:nowrap;
}
.hero-eyebrow{font-size:13px;font-weight:600;color:#c7c2f5;letter-spacing:.01em;margin-bottom:8px}
.hero-title{font-family:"Manrope",sans-serif;font-weight:800;font-size:28px;margin:0 0 8px;letter-spacing:-.02em;color:#fff}
.hero-sub{margin:0 0 18px;color:#d9d8f3;font-size:15px;max-width:520px}
.hero-sub b{color:#fff}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.hero .btn-ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff;box-shadow:none}
.hero .btn-ghost:hover{background:rgba(255,255,255,.2)}
.hero-badge{
  position:relative;z-index:1;flex-shrink:0;text-align:center;padding:18px 24px;border-radius:var(--r);
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(6px);
}
.hb-num{font-family:"Manrope",sans-serif;font-weight:800;font-size:38px;line-height:1;color:#ffd9a8}
.hb-label{font-size:12px;color:#e4e2f7;margin-top:8px;line-height:1.4}

/* KPI-карточки */
.kpi-row{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:20px}
.kpi{
  display:flex;align-items:center;gap:14px;padding:16px 18px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);text-decoration:none;color:var(--ink);
  box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .2s;animation:rise .45s ease backwards;
}
.kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.kpi-ico{
  width:46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:21px;flex-shrink:0;
  background:color-mix(in srgb, var(--k) 14%, #fff);
}
.kpi-main{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.kpi-num{font-family:"Manrope",sans-serif;font-weight:800;font-size:24px;letter-spacing:-.02em}
.kpi-cap{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Баннер: есть прошедшие уроки без отметки посещаемости */
.dash-alert-banner{
  display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--ink);
  background:linear-gradient(120deg,var(--red-soft),color-mix(in srgb,var(--red) 6%,#fff));
  border:1px solid #f3c8bd;border-radius:var(--r-lg);padding:14px 20px;margin-bottom:18px;
  box-shadow:var(--shadow-sm);transition:box-shadow .15s,transform .15s;
}
.dash-alert-banner:hover{box-shadow:var(--shadow);transform:translateY(-1px)}
.dab-ico{font-size:22px;flex-shrink:0}
.dab-text{flex:1;font-size:14px;line-height:1.4}
.dab-text b{font-family:"Manrope",sans-serif;color:#cf4023}
.dab-go{font-weight:700;color:#cf4023;font-size:14px;flex-shrink:0}

/* Сетки дашборда */
.dash-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;margin-bottom:18px;align-items:stretch}
.dash-grid.three{grid-template-columns:1fr 1fr 1fr}
.dash-grid > .card{margin-top:0;height:100%}
.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.card-head h3{margin:0;font-size:16px}
.card-link{font-size:13px;font-weight:600;color:var(--brand-ink);text-decoration:none}
.card-link:hover{text-decoration:underline}
.mini-empty{padding:26px 10px;text-align:center;color:var(--muted);font-size:14px}

/* Таймлайн занятий на сегодня */
.tl{display:flex;flex-direction:column}
.tl-row{
  display:flex;align-items:center;gap:14px;padding:11px 8px;text-decoration:none;color:var(--ink);
  border-radius:10px;transition:background .14s;position:relative;
}
.tl-row:hover{background:var(--surface-2)}
.tl-time{font-family:"Manrope",sans-serif;font-weight:700;font-size:14px;color:var(--ink-soft);min-width:46px}
.tl-dot{width:11px;height:11px;border-radius:50%;background:var(--c);flex-shrink:0;box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 18%,#fff)}
.tl-body{display:flex;flex-direction:column;flex:1;min-width:0}
.tl-subj{font-weight:700;font-size:14.5px}
.tl-meta{font-size:12.5px;color:var(--ink-soft)}
.tl-go{font-size:12.5px;font-weight:600;color:var(--brand-ink);opacity:0;transition:opacity .14s}
.tl-row:hover .tl-go{opacity:1}

/* Пульс центра */
.pulse{display:flex;flex-direction:column;gap:11px}
.pulse-row{display:flex;align-items:center;gap:12px}
.pulse-name{font-size:13.5px;font-weight:600;min-width:96px}
.pulse-bar{flex:1;height:9px;background:var(--surface-2);border-radius:20px;overflow:hidden}
.pulse-bar span{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 60%,#fff));animation:grow .6s ease both}
.pulse-val{font-family:"Manrope",sans-serif;font-weight:700;font-size:14px;min-width:24px;text-align:right}
@keyframes grow{from{width:0 !important}}

/* Алерт-строки (заканчивающиеся / долги / др) */
.alert-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 8px;
  text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line-soft);font-size:14px;transition:background .14s;
}
.alert-row:last-child{border-bottom:none}
a.alert-row:hover{background:var(--surface-2)}

@media(max-width:1100px){
  .kpi-row{grid-template-columns:repeat(3,1fr)}
  .dash-grid,.dash-grid.three{grid-template-columns:1fr}
}
@media(max-width:680px){
  .hero{flex-direction:column;align-items:flex-start;padding:24px}
  .hero-badge{align-self:stretch}
  .kpi-row{grid-template-columns:1fr 1fr}
}

/* ============== ВХОД: двухпанельный экран ============== */
.auth-split{
  display:grid;grid-template-columns:1.1fr 1fr;width:100%;max-width:880px;
  background:var(--surface);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);
  animation:rise .5s cubic-bezier(.2,.7,.2,1) backwards;
}
.auth-promo{
  position:relative;padding:44px 40px;color:#fff;overflow:hidden;
  background:
    radial-gradient(500px 240px at 110% -10%, rgba(245,158,60,.28), transparent 60%),
    linear-gradient(150deg,#2a2f63,#3a2c78 55%,#4a2d82);
}
.auth-promo::after{content:"✎ ✏ ✐ ✑";position:absolute;right:-6px;bottom:14px;font-size:64px;opacity:.08;letter-spacing:6px}
.auth-promo .auth-logo{font-family:"Manrope",sans-serif;font-weight:800;font-size:20px;display:flex;align-items:center;gap:10px;margin-bottom:34px;color:#ffffff !important}
.auth-promo .auth-eyebrow{color:#cbd0ff !important;font-size:13px;font-weight:600;margin-bottom:10px}
.auth-promo .auth-promo-title{font-family:"Manrope",sans-serif;font-weight:800;font-size:27px;line-height:1.25;letter-spacing:-.02em;margin:0 0 26px;color:#ffffff !important}
.auth-promo .auth-feats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.auth-promo .auth-feats li{font-size:14.5px;color:#eceaff !important}
.auth-split .auth-card{width:auto;box-shadow:none;border-radius:0;display:flex;flex-direction:column;justify-content:center;animation:none}

@media(max-width:760px){
  .auth-split{grid-template-columns:1fr;max-width:400px}
  .auth-promo{display:none}
}

/* ============== ЗАРПЛАТЫ ============== */
.grand-total{font-size:14px;color:var(--ink-soft)}
.grand-total b{font-family:"Manrope",sans-serif;font-size:17px;color:var(--ink)}
.rate-table th{text-align:center;padding:8px 6px}
.rate-table td{padding:6px}
.rate-table .rk{font-weight:600;white-space:nowrap;color:var(--ink-soft)}
.rate-table input{text-align:center;padding:8px 6px}
table tfoot td{border-top:2px solid var(--line);border-bottom:none;padding-top:12px}
.kids-form{display:flex;gap:6px;align-items:center;justify-content:flex-end}

/* ============== КАССА ============== */
.cash-now{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px;border-radius:12px;
  background:linear-gradient(120deg,var(--green-soft),#eafaf2);border:1px solid #c5ecd6;
}
.cash-amount{font-family:"Manrope",sans-serif;font-weight:800;font-size:24px;color:#138a55}

/* ============== СВЯЗИ УЧЕНИК ↔ РОДИТЕЛЬ ============== */
.rel-card{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 14px;margin-bottom:9px;border:1px solid var(--line);border-radius:12px;
  background:var(--surface-2);transition:border-color .15s,box-shadow .15s;
}
.rel-card:hover{border-color:#d7ddec;box-shadow:var(--shadow-sm)}
.rel-main{min-width:0}
.rel-name{font-weight:700;color:var(--ink);text-decoration:none;font-size:15px}
.rel-name:hover{color:var(--brand-ink);text-decoration:underline}
.rel-phone{font-size:13px;color:var(--ink-soft);margin-top:2px}
.rel-actions{display:flex;align-items:center;gap:6px;flex-shrink:0}
.icon-btn{
  width:34px;height:34px;border:1px solid var(--line);background:var(--surface);border-radius:9px;
  display:grid;place-items:center;cursor:pointer;color:var(--ink-soft);text-decoration:none;font-size:15px;
  transition:all .14s;
}
.icon-btn:hover{border-color:var(--brand);color:var(--brand-ink);transform:translateY(-1px)}

/* Итог отметки урока: остаток уроков «было -> стало» по каждому ученику. */
.att-result{max-width:520px}
.att-res-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.att-res-row{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2)}
.att-res-name{font-weight:600}
.att-res-bal{display:flex;align-items:center;gap:8px;white-space:nowrap;font-variant-numeric:tabular-nums}
.att-res-bal b{min-width:26px;text-align:center;padding:2px 8px;border-radius:8px;
  background:var(--surface);border:1px solid var(--line)}
.att-res-bal b.neg{color:#b3261e;border-color:#f2b8b5;background:#fdeceb}
.att-res-bal .arr{color:var(--muted)}
.att-res-warn{margin-top:12px;padding:10px 12px;border-radius:10px;
  background:#fdeceb;border:1px solid #f2b8b5;color:#8c1d18;font-size:14px}
@media (max-width:680px){
  .att-res-row{flex-direction:column;align-items:flex-start;gap:6px}
}

/* Фильтр расписания по педагогу. */
.t-filter{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border:1px solid var(--line);
  border-radius:999px;background:var(--surface);font-size:14px}
.t-filter select{border:0;background:transparent;font:inherit;color:inherit;max-width:190px;outline:none;cursor:pointer}
@media (max-width:680px){ .t-filter{width:100%} .t-filter select{max-width:none;flex:1} }

/* Удобное время педагога: зелёные полосы за карточками уроков. */
.av-band{position:absolute;left:0;right:0;z-index:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(22,163,74,.16),rgba(22,163,74,.09));
  border-top:1px solid rgba(22,163,74,.35);border-bottom:1px solid rgba(22,163,74,.35)}
.bl-dot-av{background:rgba(22,163,74,.45)}

/* Страница «Удобное время». */
.av-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.av-row select,.av-row input[type=time]{padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface)}
.av-row .av-note{flex:1;min-width:180px;padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface)}
.av-dash{color:var(--muted)}
.av-actions{display:flex;align-items:center;gap:10px;margin-top:14px}
.av-preview{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.av-day{padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2)}
.av-day.on{border-color:rgba(22,163,74,.45);background:rgba(22,163,74,.08)}
.av-day-name{font-weight:700;margin-bottom:6px}
.av-chip{font-size:13px;padding:3px 0}
@media (max-width:680px){
  .av-row{gap:6px}
  .av-row .av-note{min-width:100%}
}

/* Галочка «Удобное время» в шапке расписания. */
.av-toggle{cursor:pointer;user-select:none}
.av-toggle input{margin:0;cursor:pointer}
.av-toggle.on{border-color:rgba(22,163,74,.5);background:rgba(22,163,74,.10)}

/* Окно «слот занят»: заметная замена всплывашке при неудачном переносе/создании. */
.cf-modal{max-width:620px}
.cf-lead{margin:0 0 12px}
.cf-list{display:flex;flex-direction:column;gap:6px;max-height:320px;overflow-y:auto}
.cf-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;padding:9px 12px;
  border:1px solid #f2b8b5;border-radius:10px;background:#fdeceb}
.cf-row b{font-variant-numeric:tabular-nums}
.cf-what{color:#8c1d18}
.cf-by{font-size:13px;flex-basis:100%}
.cf-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}
.cf-act{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cf-act select{flex:1;min-width:180px;padding:8px 10px;border:1px solid var(--line);
  border-radius:9px;background:var(--surface)}
@media (max-width:680px){
  .cf-act{flex-direction:column;align-items:stretch}
  .cf-act select,.cf-act .btn{width:100%}
}

/* Блок «применить к этому уроку / ко всем следующим» в правке урока. */
.scope-box{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--surface-2)}
.scope-box.scope-hot{border-color:#f0a202;background:#fff7e6;box-shadow:0 0 0 3px rgba(240,162,2,.15)}
.scope-warn{margin:8px 0 0;font-size:13px;font-weight:600;color:#8a5a00}
/* Варианты «применить к»: у каждого своя строка с числом занятий, чтобы до
   сохранения было видно, сколько занятий изменится и сколько из них проведено. */
.scope-opt{display:flex;align-items:flex-start;gap:8px;padding:5px 0;font-weight:400;cursor:pointer}
.scope-opt input{margin-top:3px;flex-shrink:0}
.scope-opt b{font-weight:600}
.scope-cnt{display:block;font-size:12px;line-height:1.35;margin-top:1px}
.scope-series{background:color-mix(in srgb,var(--accent) 9%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);
  border-radius:9px;padding:8px 10px;margin-bottom:8px;font-size:13px;line-height:1.4}
.scope-done{margin:8px 0 0;font-size:12.5px;line-height:1.45;color:var(--ink-soft);
  border-left:3px solid var(--accent,#f59e3c);padding-left:9px}
.att-res-why{font-size:12px}

/* Дашборд: деньги за месяц — поступило / потрачено / отработано / прибыль. */
.money-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.money-box{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:12px;
  border:1px solid var(--line);background:var(--surface-2);color:inherit;text-decoration:none}
a.money-box:hover{border-color:var(--accent,#5b6ef5)}
.money-cap{font-size:13px;color:var(--muted)}
.money-num{font-family:"Manrope",sans-serif;font-weight:700;font-size:24px;line-height:1.1;
  font-variant-numeric:tabular-nums}
.money-hint{font-size:12px;color:var(--muted)}
.money-in .money-num{color:#1faa6c}
.money-out .money-num{color:#e2553f}
.money-work{border-color:rgba(31,170,108,.45);background:rgba(31,170,108,.08)}
.money-note{margin:12px 0 0;font-size:13px;color:var(--muted)}


/* Страницы, которым тесно в 1280px (расписание): разворачиваем на всю ширину. */
.content-wide{max-width:none}
.content-wide .weekcal{margin-left:0;margin-right:0}

/* Условия аренды в карточке сотрудника. */
.rent-box{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--surface-2)}
.rent-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
.rent-row label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);flex:1;min-width:170px}
.rent-row input{padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink)}

/* Чужое занятие в общем расписании арендатора: видно, что время занято,
   но кто и с кем — не его дело, и открыть карточку нельзя. */
.wc-lesson.is-foreign,.lesson.is-foreign,.month-chip.is-foreign{
  opacity:.55;cursor:default;pointer-events:none;
  background:repeating-linear-gradient(135deg,
    color-mix(in srgb,var(--c) 10%,#fff) 0 7px,
    color-mix(in srgb,var(--c) 16%,#fff) 7px 14px)}
.wc-lesson.is-foreign:hover,.lesson.is-foreign:hover{transform:none;box-shadow:none}

/* Раздел аренды: пояснение про потолок месяца. */
.rent-note{margin:14px 0 0;padding:10px 12px;border-radius:10px;font-size:14px;
  background:#fff7e6;border:1px solid #f0d08a;color:#7a5300}
.rent-note-ok{background:rgba(31,170,108,.10);border-color:rgba(31,170,108,.45);color:#0f6b45}

/* Адрес филиала под шапкой расписания. */
.branch-addr{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0 0 8px;font-size:13px}
.ba-item{display:inline-flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.ba-name{font-weight:700}
.ba-text{color:var(--muted)}
.ba-phone{color:var(--muted);text-decoration:none;border-bottom:1px dotted currentColor}

/* Выбор дней недели для повтора урока — как в форме создания. */
.wd-pick{display:flex;gap:6px;flex-wrap:wrap}
.wd-btn{min-width:46px;padding:9px 10px;border:1px solid var(--line);border-radius:10px;
  background:var(--surface);font:inherit;font-weight:600;cursor:pointer;transition:.15s}
.wd-btn:hover{border-color:var(--brand,#5b6ef5)}
.wd-btn.on{background:linear-gradient(135deg,#5b6ef5,#7c5cf0);color:#fff;border-color:transparent;
  box-shadow:0 2px 8px rgba(91,110,245,.35)}
.wd-time{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}
.wd-time label{display:flex;flex-direction:column;gap:4px;font-size:13px}
.wd-time input{padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface)}
@media (max-width:680px){ .wd-time{flex-direction:column} .wd-time input{width:100%} }

/* Логин и пароль сотрудника в карточке (видит директор). */
.creds-box{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--surface-2);margin-bottom:14px}
.creds-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:3px 0}
.creds-cap{min-width:66px;font-size:13px;color:var(--muted)}
.creds-row b{font-family:monospace;font-size:15px}
.creds-copy{padding:2px 8px}

/* Отчёты: показатели занятий и блоки личных средств. */
.rep-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.rep-box{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid var(--line);
  border-radius:11px;background:var(--surface-2)}
.rep-box-accent{border-color:rgba(31,170,108,.45);background:rgba(31,170,108,.08)}
.rep-cap{font-size:13px;color:var(--muted)}
.rep-num{font-family:"Manrope",sans-serif;font-weight:700;font-size:22px;line-height:1.1;
  font-variant-numeric:tabular-nums}
.rep-hint{font-size:12px;color:var(--muted)}
.pers-block{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.pers-block:first-of-type{border-top:0;padding-top:0}
.pers-head{display:flex;align-items:baseline;gap:10px;margin-bottom:6px}
.pers-sum{font-weight:700;color:var(--red)}

/* Предупреждение в шапке карточки урока (филиал ученика не совпал). */
.lh-warn{margin-top:8px;padding:8px 11px;border-radius:9px;font-size:13px;
  background:#fff7e6;border:1px solid #f0d08a;color:#7a5300}

/* Выбор кабинета в строках «изменить расписание серии». */
.pattern-room{padding:7px 9px;border:1px solid var(--line);border-radius:9px;
  background:var(--surface);max-width:190px}
@media (max-width:680px){ .pattern-room{max-width:none;width:100%} }

/* Строки серии: день без будущих уроков и подсказка «менять нечего». */
.pattern-row-past{opacity:.65}
.pattern-note{margin:0 0 10px;padding:10px 12px;border-radius:10px;font-size:13px;
  background:#fff7e6;border:1px solid #f0d08a;color:#7a5300}

/* Фильтры журнала операций в «Финансах». */
.tx-filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}
.tx-chip{padding:4px 11px;border:1px solid var(--line);border-radius:999px;background:var(--surface);
  font-size:12.5px;text-decoration:none;color:inherit;transition:.15s}
.tx-chip:hover{border-color:var(--brand,#5b6ef5)}
.tx-chip.on{background:linear-gradient(135deg,#5b6ef5,#7c5cf0);color:#fff;border-color:transparent}
.tx-total{margin:0 0 10px;font-size:13px}

/* Разовый гость занятия. */
.badge-guest{background:rgba(124,92,240,.14);color:#5b3fd6;border:1px solid rgba(124,92,240,.35)}
.guest-add{margin-bottom:14px}
.guest-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.guest-row .search{flex:1;min-width:180px}
.guest-row select{min-width:200px;padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface)}
@media (max-width:680px){ .guest-row{flex-direction:column;align-items:stretch} }

/* Предупреждение о неприменённой миграции истории ставок. */
.rate-warn{border:1px solid #f0a202;background:#fff7e6;color:#7a5300;margin-bottom:14px}
.rate-warn code{background:rgba(0,0,0,.06);padding:1px 5px;border-radius:5px}
