@import url('https://fonts.googleapis.com/css2?family=Geologica:wght@300;400;500;600;700&display=swap');
/* ============================================================
   NAKOPCHIK — общая тема «Cumulative Light»
   Применяется на всех страницах (накоп, вход, подготовка).
   ============================================================ */
:root{
  /* --- РЕДИЗАЙН: песочная база, бирюзовый акцент, неоморфные тени --- */
  --nk-ink:#D6CFC0; --nk-surface:#F1ECE2; --nk-surface-2:#E4DBC9; --nk-hairline:rgba(120,101,72,.15);
  --nk-indigo:#14595C; --nk-violet:#123E41; --nk-violet-300:#14595C;
  --nk-emerald:#2A6F70; --nk-teal:#14595C; --nk-green:#17805C; --nk-gold:#8A5A0F;
  --nk-text:#1C2422; --nk-muted:#5F594C; --nk-dim:#6E6759;
  --nk-grad-progress:linear-gradient(90deg,#2A6F70 0%,#14595C 100%);
  --nk-grad-cta:linear-gradient(152deg,#22625F 0%,#123E41 100%);
  --nk-grad-exam:linear-gradient(0deg,#F3CE8A 0%,#C08F33 58%,#6B4C15 100%);
  --nk-r-card:26px; --nk-r-inner:24px; --nk-r-tile:18px; --nk-r-input:14px; --nk-r-pill:999px;
  --nk-font-display:'Geologica',system-ui,-apple-system,'Segoe UI',sans-serif;
  --nk-font-mono:'JetBrains Mono',ui-monospace,'SF Mono',monospace;
  --nk-font-accent:var(--nk-font-display);
  --nk-shadow-card:var(--nk-up);
  --nk-glow-brand:inset 0 1px 0 rgba(219,238,231,.2), 5px 7px 16px rgba(20,89,92,.35);
  --nk-glow-mark:0 8px 18px rgba(20,89,92,.26);
  --nk-focus:inset 0 0 0 2px #14595C, inset 2px 3px 7px rgba(126,108,80,.16);
  --nk-ease:220ms cubic-bezier(.4,0,.2,1);

  /* --- ступени поверхностей (светлая тема) --- */
  --nk-bg:linear-gradient(180deg,#DAD3C5 0%,#D6CFC0 44%,#CEC6B5 100%);
  --nk-card-a:#F5F1E9;  --nk-card-b:#EBE5D9;      /* плитка: верх/низ градиента */
  --nk-plate-a:#FBF9F3; --nk-plate-b:#F1EDE2;     /* плашка внутри плитки */
  --nk-btn-a:#FAF7F0;   --nk-btn-b:#F2EDE2;       /* кнопка */
  --nk-btn-ha:#FEFCF7;  --nk-btn-hb:#F6F2E8;      /* кнопка под курсором */
  --nk-on-dark:#F7F3EA;                            /* текст на тёмных заливках */
  --nk-well-focus:#EDE7DC;                         /* лунка в фокусе */
  --nk-head-bg:rgba(200,192,175,.86);              /* план шапки */
  --nk-scrim:rgba(72,60,42,.45);                   /* затемнение под модалками */
  --nk-chip-bg:#EAE3D6;                            /* чип ника */
  --nk-chip-hover:#E4DDCE;
  --nk-ghost-bg:linear-gradient(180deg,rgba(250,247,240,.62) 0%,rgba(242,237,226,.5) 100%);
  --nk-danger:#8E4B33;                             /* опасные действия */

  /* неоморфные заготовки и палитра тёмного «подноса» итога */
  /* ГЛУБИНА ЧЕРЕЗ ЛЕСТНИЦУ ВЫСОТ.
     Тень набирается слоями: контактная (резкая, у самой кромки) + три ступени
     рассеивания. Чем выше поверхность, тем шире и мягче дальний слой — именно
     эта разница между уровнями и читается глазом как высота.
     Кольцо слабеет с высотой: высокой поверхности контур не нужен, её отрывает
     тень; низкой — нужен, её тень слишком мала, чтобы отделить от подложки.
     Светлая inset-кромка сверху остаётся везде — это метка «свет сверху». */

  /* уровень 3 — плитки и панели. Кольца нет: его роль играет «прилегание» —
     узкая плотная тень вплотную под кромкой. Она даёт линию отрыва от фона,
     но, в отличие от контура, не спорит с высотой. Дальше три ступени
     рассеивания: чем дальше слой, тем шире и бледнее. */
  --nk-up:0 1px 0 rgba(120,101,72,.13),
    2px 3px 4px rgba(96,78,52,.17),
    4px 6px 10px rgba(102,84,56,.15),
    9px 12px 20px rgba(100,82,54,.16),
    16px 22px 38px rgba(88,70,44,.17),
    -4px -4px 9px rgba(255,255,255,.5),
    inset 0 1px 0 rgba(255,255,255,.92);

  /* уровень 1 — кнопки: тот же приём в миниатюре */
  --nk-up-sm:0 0 0 1px rgba(120,101,72,.07),
    0 1px 0 rgba(120,101,72,.10),
    1px 2px 3px rgba(96,78,52,.13),
    3px 4px 8px rgba(102,84,56,.12),
    -2px -2px 6px rgba(255,255,255,.5),
    inset 0 1px 0 rgba(255,255,255,.9);

  /* уровень 2 — плашки внутри плитки */
  --nk-up-xs:0 0 0 1px rgba(120,101,72,.06),
    0 1px 0 rgba(120,101,72,.09),
    1px 2px 3px rgba(96,78,52,.12),
    3px 4px 7px rgba(102,84,56,.10),
    6px 8px 14px rgba(100,82,54,.09),
    -2px -2px 6px rgba(255,255,255,.45),
    inset 0 1px 0 rgba(255,255,255,.88);

  /* кнопка под курсором — поднимается на ступень */
  --nk-up-hover:0 1px 0 rgba(120,101,72,.12),
    2px 3px 5px rgba(96,78,52,.17),
    5px 7px 13px rgba(102,84,56,.15),
    11px 15px 26px rgba(100,82,54,.15),
    -3px -3px 8px rgba(255,255,255,.6),
    inset 0 1px 0 rgba(255,255,255,.94);

  /* Углубления: внешнее кольцо снято — на утопленном элементе оно читается
     как рамка и убивает вдавленность. Вместо него двойной inset сверху
     (резкий + мягкий) и светлая кромка по нижнему краю. */
  --nk-in:inset 0 1px 1px rgba(96,78,52,.26), inset 0 3px 6px rgba(96,78,52,.22),
    inset 0 -1px 0 rgba(255,255,255,.7);
  --nk-in-sm:inset 0 1px 1px rgba(96,78,52,.22), inset 0 2px 5px rgba(96,78,52,.18),
    inset 0 -1px 0 rgba(255,255,255,.65);
  --nk-in-warm:inset 0 1px 1px rgba(126,98,48,.28), inset 0 3px 6px rgba(126,98,48,.24),
    inset 0 -1px 0 rgba(255,255,255,.66);
  --nk-inner-bg:#F7F4EC; --nk-warm:#F6EEDF; --nk-warm-well:#EBDFC6;
  --nk-tray:linear-gradient(158deg,#246663 0%,#134043 54%,#0B2C2F 100%);
  --nk-tray-sh:0 0 0 1px rgba(9,36,38,.5), inset 0 1px 0 rgba(219,238,231,.22),
    inset 0 -24px 40px rgba(6,26,28,.45), 14px 20px 40px rgba(17,54,57,.42), -5px -5px 14px rgba(255,255,255,.55);
  --nk-tray-text:#F2EEE2; --nk-tray-soft:#CFE0DA; --nk-tray-mute:#A9C4C0;
  --nk-lime:#D9E8BF; --nk-mint:#C9DCAE; --nk-gold-chip:#EFC06A;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--nk-bg);
  background-attachment:fixed;
  color:var(--nk-text); font-family:var(--nk-font-display);
  -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%;
}
a{color:var(--nk-violet-300);text-decoration:none}
a:hover{color:var(--nk-violet)}
.mono{font-family:var(--nk-font-mono)}
.muted{color:var(--nk-muted)} .dim{color:var(--nk-dim)}
.hide{display:none!important}

/* ---------- бренд / логотип ---------- */
.brand{display:flex;align-items:center;gap:12px}
.brand img,.brand .nkN{width:38px;height:38px;display:block;filter:drop-shadow(var(--nk-glow-mark))}
/* локап: буква-знак и строчное «akopchik» по базовой линии */
.brand.lockup{align-items:flex-end;gap:1px;transform:translateY(-3px)}   /* строчные буквы сидят ниже центра — поднимаем локап, чтобы он читался вровень с кнопками */
.brand.lockup .nkN{width:34px;height:34px;filter:none}
.brand.lockup .wm{font-size:27px;line-height:.86;letter-spacing:-.01em;padding-bottom:1px}
.brand .wm{font-family:var(--nk-font-display);font-weight:800;font-size:22px;letter-spacing:.01em;color:var(--nk-text)}
.brand .wm small{font-family:var(--nk-font-mono);font-weight:400;font-size:11px;color:var(--nk-dim);display:block;letter-spacing:.18em;text-transform:uppercase;margin-top:-2px}

/* ---------- кнопки ---------- */
.btn{font-family:var(--nk-font-display);font-weight:600;font-size:14px;border-radius:var(--nk-r-pill);
  padding:9px 16px;border:1px solid var(--nk-hairline);background:var(--nk-surface);color:var(--nk-text);
  cursor:pointer;transition:transform var(--nk-ease),box-shadow var(--nk-ease),border-color var(--nk-ease);white-space:nowrap}
.btn:hover{border-color:var(--nk-violet-300)}
.btn:active{transform:scale(.92)}
.btn.sm{padding:6px 10px;font-size:13px}
.btn.icononly{padding:6px 8px;display:inline-flex;align-items:center;justify-content:center}
.btn.icononly svg{display:block}
.btn.hasicon{display:inline-flex;align-items:center;gap:6px}
.ico{display:inline-block;vertical-align:-2px}
.btn.hasicon .ico{vertical-align:0}
#toggleEdit.on{background:rgba(74,222,128,.14);border-color:var(--nk-green)}
/* на телефоне — компактные иконки без подписей; на широком экране остаются названия */
@media (max-width:560px){
  /* верхняя панель в одну строку: прячем подписи и лишнее, кнопки не переносятся */
  .hbar{flex-wrap:nowrap;overflow-x:auto;gap:5px;padding:9px 12px;scrollbar-width:none}
  .hbar::-webkit-scrollbar{display:none}
  .hbar .spacer{display:none}
  .brand .wm{display:none}
  .brand img,.brand .nkN,.brand.lockup .nkN{width:30px;height:30px}
  .status{display:none}
  .btn.hasicon .lbl{display:none}
  .btn.sm{padding:6px 8px}
  .btn.hasicon{gap:0;padding:6px 8px}
  .who{max-width:96px;font-size:11px;padding:5px 9px}
  .hbar > .btn,.hbar > .who,.hbar > a.btn,.brand{flex:0 0 auto}
}
.btn.primary{color:#fff;background:var(--nk-grad-cta);border:0;box-shadow:var(--nk-glow-brand)}
.btn.ghost{background:transparent}
.btn.edit{color:var(--nk-green);border-color:rgba(74,222,128,.45)}
.btn.edit:hover{border-color:var(--nk-green)}
.btn.danger{color:#FF8A8A;border-color:rgba(255,107,107,.45)}
.btn.danger:hover{border-color:#FF6B6B}
.btn.good{color:#06281b;background:linear-gradient(135deg,var(--nk-emerald),var(--nk-green));border:0;font-weight:700}
.btnfull{width:100%;font-family:var(--nk-font-display);font-weight:600;font-size:16px;border-radius:14px;
  padding:14px 18px;border:1px solid var(--nk-hairline);background:var(--nk-surface-2);color:var(--nk-text);
  cursor:pointer;display:flex;flex-direction:column;gap:3px;align-items:center;transition:border-color var(--nk-ease),transform var(--nk-ease)}
.btnfull:hover{border-color:var(--nk-violet-300)}
.btnfull:active{transform:scale(.975)}
.btnfull .s{font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-muted);font-weight:400}
.btnfull.primary{color:#fff;background:var(--nk-grad-cta);border:0;box-shadow:var(--nk-glow-brand)}
.btnfull.good{color:#06281b;background:linear-gradient(135deg,var(--nk-emerald),var(--nk-green));border:0}
.linkbtn{background:none;border:0;color:var(--nk-muted);font-family:var(--nk-font-mono);font-size:13px;cursor:pointer;padding:4px}
.linkbtn:hover{color:var(--nk-violet-300)}

/* ---------- поля ---------- */
.field{height:46px;padding:0 14px;background:var(--nk-surface-2);border:1px solid var(--nk-hairline);
  border-radius:var(--nk-r-input);color:var(--nk-text);font-family:var(--nk-font-display);font-size:16px;width:100%}
.field:focus{outline:none;border-color:var(--nk-indigo);box-shadow:var(--nk-focus)}
.field::placeholder{color:var(--nk-dim)}

/* ============================================================
   КАЛЬКУЛЯТОР НАКОПА
   ============================================================ */
.wrap{max-width:1800px;margin:0 auto;padding:18px}
header.app{position:sticky;top:0;z-index:5;background:rgba(11,14,20,.5);
  backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%);
  border-bottom:1px solid rgba(34,43,61,.55)}
.hbar{max-width:1800px;margin:0 auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:13px 18px 11px}
.spacer{flex:1}
.who{font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-text);background:var(--nk-surface);
  border:1px solid var(--nk-hairline);padding:6px 12px;border-radius:var(--nk-r-pill);white-space:nowrap;
  max-width:180px;overflow:hidden;text-overflow:ellipsis}
.who b{color:var(--nk-violet-300);font-weight:700}
.who.clickable{cursor:pointer;transition:border-color .15s,background .15s}
.who.clickable:hover{border-color:var(--nk-violet-300);background:var(--nk-surface-2)}
.who .tgdot{color:#2AABEE;font-weight:700}
.status{font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-muted);min-width:104px;text-align:right}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:20px;align-items:stretch;justify-content:center}
.card{background:var(--nk-surface);border:1px solid var(--nk-hairline);border-radius:var(--nk-r-card);
  box-shadow:var(--nk-shadow-card);padding:22px;display:flex;flex-direction:column;gap:14px;height:100%;position:relative}
.card .idx{position:absolute;top:18px;right:20px;font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-dim);letter-spacing:.1em}
.card h2{margin:0;display:flex;align-items:center;gap:8px;padding-right:34px}
.subject-title,.card h2 input{font-family:var(--nk-font-display);font-weight:700;font-size:24px;color:var(--nk-text);letter-spacing:.01em}

.rows{display:flex;flex-direction:column;gap:8px}
.row{display:grid;grid-template-columns:minmax(0,1fr) auto 92px;gap:12px;align-items:center}
.row .nm{font-size:17px;color:var(--nk-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .nm.exam{color:var(--nk-gold)}
.row .w{font-family:var(--nk-font-mono);font-size:14px;color:var(--nk-muted);text-align:right}
.input{height:44px;min-width:92px;padding:0 12px;background:var(--nk-surface-2);border:1px solid var(--nk-hairline);
  border-radius:var(--nk-r-input);color:var(--nk-text);font-family:var(--nk-font-display);font-weight:700;font-size:18px;text-align:center}
.input:focus{outline:none;border-color:var(--nk-indigo);box-shadow:var(--nk-focus)}
.input::placeholder{color:var(--nk-dim)}
.input.wt{min-width:0;width:60px;font-size:15px}

.group{border:1px solid var(--nk-hairline);border-radius:var(--nk-r-tile);padding:12px;background:var(--nk-surface-2);display:flex;flex-direction:column;gap:9px}
.group .ghead{display:flex;align-items:center;gap:8px}
.group .gname{flex:1;min-width:0;width:100%;font-family:var(--nk-font-display);font-weight:600;font-size:16px;color:var(--nk-text)}
.group .gitems{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.git{display:flex;flex-direction:column;gap:3px}
.git label{font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-muted);text-align:center}
.git .input{min-width:0;height:40px;font-size:16px;padding:0 6px}

/* блок результата */
.result{margin-top:auto;background:var(--nk-surface-2);border:1px solid var(--nk-hairline);
  border-radius:var(--nk-r-inner);padding:18px 18px 16px;display:flex;flex-direction:column;gap:12px}
.accrual{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.num{font-family:var(--nk-font-display);font-weight:800;font-size:48px;line-height:1;color:var(--nk-violet-300)}
.num-of{font-family:var(--nk-font-display);font-weight:700;font-size:24px;color:var(--nk-text)}
.num.empty{color:var(--nk-muted)}
.progress{height:9px;border-radius:6px;background:var(--nk-hairline);overflow:hidden}
.progress>i{display:block;height:100%;border-radius:6px;background:var(--nk-grad-progress);transition:width var(--nk-ease)}
.passed{font-size:16px;color:var(--nk-muted)}
.passed b{color:var(--nk-text);font-weight:700}
.whatif{display:flex;align-items:center;gap:10px;font-size:15px;flex-wrap:wrap;color:var(--nk-muted)}
.whatif .ex{color:var(--nk-gold);font-weight:600}
.whatif .input{width:78px;height:42px}
.fin{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.fin .fin-label{font-size:15px;color:var(--nk-muted)}
.fin .fin-v{font-family:var(--nk-font-display);font-weight:800;font-size:40px;line-height:1;color:var(--nk-green)}
.fin .fin-of{font-family:var(--nk-font-display);font-weight:800;font-size:22px;color:var(--nk-green)}
.fin .fin-of.muted{font-weight:400;font-size:14px;color:var(--nk-muted)}
.fin.risk .fin-v,.fin.risk .fin-of{color:var(--nk-muted)}
.fin-wait{font-size:14px;line-height:1.45;color:var(--nk-muted);max-width:40ch}
.wsum{font-family:var(--nk-font-mono);font-size:12px;line-height:1.4;color:var(--nk-gold);
  background:rgba(245,182,66,.10);border:1px solid rgba(245,182,66,.34);
  border-radius:var(--nk-r-tile);padding:8px 12px;margin-top:12px}
.need-label{font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-muted);letter-spacing:.04em;margin-top:6px;margin-bottom:10px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.pill{display:inline-flex;align-items:center;gap:5px;font-family:var(--nk-font-mono);font-size:14px;color:var(--nk-green);
  border:1px solid rgba(74,222,128,.40);background:rgba(74,222,128,.08);border-radius:var(--nk-r-pill);padding:6px 13px}
.pill b{color:var(--nk-text);font-weight:700}
.pill.have{background:rgba(74,222,128,.16)}

.settings{display:flex;flex-wrap:wrap;gap:12px;font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-muted);
  align-items:center;border-top:1px solid var(--nk-hairline);padding-top:10px;margin-top:2px}
.settings label{display:flex;align-items:center;gap:6px}
.iconbtn{border:0;background:transparent;color:#FF6B6B;cursor:pointer;font-size:18px;font-weight:700;line-height:1;padding:2px 6px;border-radius:8px}
.iconbtn:hover{color:#FF9B9B}
.editonly{display:none}
.editing .editonly{display:revert}
/* Режим правки: название элемента — отдельной строкой во всю ширину (в одной строке
   с весом, оценкой и стрелками ему оставалось ~20px), органы управления — под ним. */
.editing .row{grid-template-columns:16px minmax(0,1fr) auto auto 30px;gap:6px 9px;
  grid-template-areas:"grip name name name del" ". w grade ord .";align-items:center}
.editing .row > .bgrip{grid-area:grip;align-self:start;margin-top:4px}
.editing .row > .subject-title{grid-area:name;font-size:16px!important;padding:4px 0 5px!important;
  border-bottom:1px solid var(--nk-hairline)!important;border-radius:0}
.editing .row > .wwrap{grid-area:w;justify-self:start;display:inline-flex;align-items:center;gap:5px}
.editing .row > .wwrap .w{font-family:var(--nk-font-mono);font-size:14px;color:var(--nk-muted)}
.editing .row > .input:not(.wt){grid-area:grade;justify-self:start;width:92px}
.editing .row > .ord{grid-area:ord;flex-direction:row;gap:4px;justify-self:start}
.editing .row > .ord .ordb{width:30px;height:22px}
.editing .row > .iconbtn{grid-area:del;align-self:start}
.editing .row + .row,.editing .row + .group,.editing .group + .row{margin-top:6px}

/* «тряска» плиток в режиме редактирования (как иконки в iOS) */
@keyframes nk-wobble{0%{transform:rotate(-.55deg)}50%{transform:rotate(.55deg)}100%{transform:rotate(-.55deg)}}
@keyframes nk-pop{0%{transform:scale(.93)}45%{transform:scale(1.03) rotate(1.6deg)}72%{transform:rotate(-1.1deg)}100%{transform:none}}
.editing .card{animation:nk-wobble .3s ease-in-out infinite}
.editing .card:nth-child(2n){animation-duration:.34s;animation-direction:reverse}
.editing .card:nth-child(3n){animation-duration:.27s}
.editing .card.still{animation:none}
.card.justadded{animation:nk-pop .55s ease-out !important}
@media (prefers-reduced-motion:reduce){.editing .card,.card.justadded{animation:none!important}}

footer{color:var(--nk-dim);font-family:var(--nk-font-mono);font-size:12px;text-align:center;padding:22px 0;letter-spacing:.03em}

/* дата экзамена и календарь */
.examdate{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;
  background:var(--nk-surface-2);border:1px solid var(--nk-hairline);border-radius:var(--nk-r-tile);padding:9px 12px}
/* Название работы — главное в плашке: крупно, основным цветом, до двух строк.
   Дата под ним остаётся золотой, срок — приглушённым. */
.examdate .ed-lbl{font-family:var(--nk-font-display);font-size:16px;font-weight:700;line-height:1.2;
  letter-spacing:-.01em;color:var(--nk-text);
  flex:1 0 100%;order:-1;min-width:0;margin-bottom:-2px;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow-wrap:anywhere}
.examdate .ed-when{min-width:0}
.examdate .ed-cal{display:flex;gap:8px;flex:0 0 auto;margin-left:auto}
.examdate .ed-when{color:var(--nk-gold);font-weight:600}
.examdate .ed-when b{color:var(--nk-text)}
.examdate .ed-days{font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-muted);font-weight:400;margin-left:4px}
.calbtn{font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-violet-300);border:1px solid var(--nk-hairline);
  background:var(--nk-surface);border-radius:var(--nk-r-pill);padding:6px 13px;cursor:pointer}
.calbtn:hover{border-color:var(--nk-violet-300)}
.calpanel{background:var(--nk-surface);border:1px solid var(--nk-hairline);border-radius:var(--nk-r-card);
  box-shadow:var(--nk-shadow-card);padding:20px 22px;margin-bottom:20px}
.calpanel h3{margin:0 0 8px;font-family:var(--nk-font-display);font-weight:700;font-size:21px}
.calrow{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:13px 0;border-top:1px solid var(--nk-hairline)}
.calrow:first-of-type{border-top:0}
.caldate{font-family:var(--nk-font-display);font-weight:800;font-size:19px;color:var(--nk-text);min-width:92px;line-height:1.1}
.caldate small{display:block;font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-muted);font-weight:400;text-transform:uppercase;letter-spacing:.08em;margin-top:2px}
.calname{flex:1;min-width:120px;font-family:var(--nk-font-display);font-weight:600;font-size:17px}
.caltime{font-family:var(--nk-font-mono);font-size:14px;color:var(--nk-gold)}
.caldays{font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-muted);min-width:96px}
.calactions{display:flex;gap:8px}
.calhead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.subjbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:2px}
.subjbar-mv,.subjbar-act{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.subjbar-act{margin-left:auto}
.subjbar-act .btn{white-space:nowrap}
.draghint{font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-dim);cursor:grab;user-select:none;padding:2px 4px}
.card.dragging{opacity:.4}
.editing .card.dragging{animation:none}
.card.dragover{outline:2px dashed var(--nk-violet);outline-offset:-3px}
.calbtn,.iconbtn,.pill{transition:transform var(--nk-ease),border-color var(--nk-ease),background var(--nk-ease),color var(--nk-ease)}
.calbtn:active,.pill:active{transform:scale(.93)}
.iconbtn:active{transform:scale(.82)}

/* чат импорта (ИИ) */
.chatpanel{max-width:560px;width:100%;height:min(86vh,720px);display:flex;flex-direction:column;padding:0;overflow:hidden;text-align:left;gap:0}
.chat-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--nk-hairline)}
.ch-title{display:flex;align-items:center;gap:9px;font-family:var(--nk-font-display);font-weight:700;font-size:16px}
.ch-mark{width:26px;height:26px;filter:drop-shadow(var(--nk-glow-mark));border-radius:7px}
.ch-x{background:none;border:0;color:var(--nk-muted);font-size:18px;cursor:pointer;padding:4px 9px;border-radius:8px}
.ch-x:hover{color:var(--nk-text)}
.chat-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.bubble{max-width:88%;padding:10px 13px;border-radius:14px;font-size:14.5px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word;-webkit-user-select:text;user-select:text;cursor:text}
.bubble.assistant{align-self:flex-start;background:var(--nk-surface-2);border:1px solid var(--nk-hairline);border-bottom-left-radius:5px;color:var(--nk-text)}
.bubble.user{align-self:flex-end;background:var(--nk-grad-cta);color:#fff;border-bottom-right-radius:5px}
.bubble.typing{color:var(--nk-muted)}
.bubble.apply{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.apply-h{font-weight:700;font-size:14px;color:var(--nk-text)}
.apply-list{font-size:13px;color:var(--nk-muted);line-height:1.65}
.apply-list b{color:var(--nk-text);font-weight:600}
.chat-atts{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px}
.chat-atts:empty{display:none}
.attchip{display:inline-flex;align-items:center;gap:6px;font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-violet-300);border:1px solid var(--nk-hairline);background:var(--nk-surface-2);border-radius:999px;padding:4px 6px 4px 10px}
.attx{background:none;border:0;color:var(--nk-muted);cursor:pointer;font-size:12px;padding:0 2px}
.chat-input{display:flex;align-items:flex-end;gap:8px;padding:12px 14px;border-top:1px solid var(--nk-hairline)}
.chat-input .btn{height:42px;width:42px;min-width:42px;padding:0;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.chat-input .btn svg{display:block}
.chat-input textarea{flex:1;resize:none;max-height:120px;background:var(--nk-surface-2);border:1px solid var(--nk-hairline);border-radius:12px;color:var(--nk-text);font-family:var(--nk-font-display);font-size:15px;padding:10px 12px;line-height:1.4}
.chat-input textarea:focus{outline:none;border-color:var(--nk-indigo)}

/* ---- чат-импорт: на ПК — плитка предмета (первая в сетке), на телефоне — шторка снизу ---- */
.chattile{display:flex;flex-direction:column;background:var(--nk-surface);border:1px solid var(--nk-hairline);
  border-radius:var(--nk-r-card);box-shadow:var(--nk-shadow-card);overflow:hidden;min-height:440px;text-align:left}
@keyframes nkChatIn{from{opacity:0;transform:scale(.9) translateY(-10px)}to{opacity:1;transform:none}}
@keyframes nkChatOut{from{opacity:1;transform:none}to{opacity:0;transform:scale(.93)}}
@keyframes nkSheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes nkSheetDown{from{transform:translateY(0)}to{transform:translateY(100%)}}
.chattile.chat-in{animation:nkChatIn .42s var(--nk-spring);transform-origin:top left}
.chattile.chat-closing{animation:nkChatOut .24s ease-in forwards;transform-origin:top left}
#chatBackdrop{position:fixed;inset:0;background:rgba(7,10,16,.55);opacity:0;pointer-events:none;
  transition:opacity .25s;z-index:55}
@media (max-width:560px){
  .chattile{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:60;min-height:0;
    height:88vh;max-height:88vh;border-radius:22px 22px 0 0;box-shadow:0 -14px 44px rgba(0,0,0,.55)}
  .chattile.chat-in{animation:nkSheetUp .4s var(--nk-spring)}
  .chattile.chat-closing{animation:nkSheetDown .26s ease-in forwards}
  body.chat-open #chatBackdrop{opacity:1;pointer-events:auto}
  .chattile .chat-head{position:relative;padding-top:18px}
  .chattile .chat-head::before{content:'';position:absolute;top:7px;left:50%;transform:translateX(-50%);
    width:38px;height:4px;border-radius:2px;background:var(--nk-hairline)}
}
@media (prefers-reduced-motion:reduce){ .chattile.chat-in,.chattile.chat-closing{animation:none!important} }

/* обучающий тур */
#tourCatch{position:fixed;inset:0;z-index:9997}
#tourHole{position:fixed;z-index:9998;border-radius:12px;box-shadow:0 0 0 9999px rgba(8,11,18,.82);
  outline:2px solid var(--nk-violet-300);outline-offset:0;pointer-events:none;transition:left .25s,top .25s,width .25s,height .25s}
#tourTip{position:fixed;z-index:9999;background:var(--nk-surface);border:1px solid var(--nk-hairline);border-radius:14px;
  padding:14px 16px;box-shadow:0 14px 44px rgba(0,0,0,.6);max-width:340px}
#tourTip .t-title{font-family:var(--nk-font-display);font-weight:700;font-size:16px;margin-bottom:5px;color:var(--nk-text)}
#tourTip .t-text{font-size:14px;color:var(--nk-muted);line-height:1.5}
#tourTip .t-nav{display:flex;align-items:center;gap:10px;margin-top:13px}
#tourTip .t-prog{font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-dim);margin-right:auto}
#tourTip .t-skip{background:none;border:0;color:var(--nk-muted);font-size:13px;cursor:pointer;padding:6px}
#tourTip .t-skip:hover{color:var(--nk-text)}
#tourTip .t-next{background:var(--nk-grad-cta);color:#fff;border:0;border-radius:999px;padding:8px 18px;font-weight:600;font-size:13px;cursor:pointer;font-family:var(--nk-font-display)}
#tourTip .t-next:active{transform:scale(.95)}
#tourTip .t-arrow{position:absolute;width:0;height:0}
#tourTip .t-arrow.up{top:-9px;border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:9px solid var(--nk-surface)}
#tourTip .t-arrow.down{bottom:-9px;border-left:9px solid transparent;border-right:9px solid transparent;border-top:9px solid var(--nk-surface)}
#tourTip .t-arrow.left{left:-9px;border-top:9px solid transparent;border-bottom:9px solid transparent;border-right:9px solid var(--nk-surface)}
#tourTip .t-arrow.right{right:-9px;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:9px solid var(--nk-surface)}

/* ---------- экраны входа ---------- */
.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}
.panel{background:var(--nk-surface);border:1px solid var(--nk-hairline);border-radius:24px;box-shadow:var(--nk-shadow-card);
  padding:30px 26px;max-width:400px;width:100%;display:flex;flex-direction:column;gap:14px;text-align:center}
.panel .mark{width:64px;height:64px;margin:0 auto 2px;filter:drop-shadow(var(--nk-glow-mark))}
.panel h2{margin:0;font-family:var(--nk-font-display);font-weight:700;font-size:24px}
.panel p{margin:0;font-size:14px;color:var(--nk-muted);line-height:1.55}
.bigpass{font-family:var(--nk-font-mono);font-size:23px;font-weight:700;letter-spacing:2px;
  background:var(--nk-surface-2);border:1px dashed var(--nk-green);border-radius:12px;padding:15px;color:var(--nk-green);user-select:all}
.err{color:#FF7A7A;font-size:13px;min-height:16px}

/* ---------- тост ---------- */
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:var(--nk-surface);
  border:1px solid var(--nk-hairline);padding:10px 16px;border-radius:12px;font-size:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.5);opacity:0;transition:.2s;z-index:60}
.toast.show{opacity:1}

@media (max-width:520px){
  .wrap{padding:12px}
  header.app{padding:12px;gap:9px}
  .brand .wm{font-size:19px}
  .brand.lockup .wm{font-size:22px}
  .grid{grid-template-columns:1fr;gap:14px}
  .card{padding:18px;border-radius:18px}
  .subject-title,.card h2 input{font-size:21px}
  .num{font-size:40px}
  .fin .fin-v{font-size:32px}
  .row{grid-template-columns:1fr auto 82px}
}

/* ---- вход через Telegram (виджет на гейте) ---- */
.tgsep{display:flex;align-items:center;gap:12px;color:var(--nk-dim);font-family:var(--nk-font-mono);font-size:12px;margin:2px 0}
.tgsep::before,.tgsep::after{content:"";flex:1;height:1px;background:var(--nk-hairline)}
.tglogin{display:flex;justify-content:center;min-height:48px}

/* ---- настройки аккаунта ---- */
.setpanel{position:relative;text-align:left;align-items:stretch}
.setpanel h2{text-align:center}
.setpanel .ch-x{position:absolute;top:14px;right:14px}
.setrow{display:flex;flex-direction:column;gap:7px}
.setlabel{font-family:var(--nk-font-display);font-size:14px;font-weight:700;letter-spacing:.01em;color:var(--nk-text);
  display:block;margin-bottom:8px}
.setline{display:flex;gap:8px;align-items:center}
.setline .field{flex:1}
.setline .btn.sm{white-space:nowrap}
.passline{flex:1;font-family:var(--nk-font-mono);font-size:15px;font-weight:700;letter-spacing:1px;color:var(--nk-green);
  background:var(--nk-surface-2);border:1px solid var(--nk-hairline);border-radius:12px;padding:11px 13px;word-break:break-all}
.sethint{margin:0;font-size:12.5px;color:var(--nk-muted);line-height:1.45}
.tgok{font-family:var(--nk-font-display);font-weight:700;font-size:16px;color:var(--nk-green);
  background:var(--nk-surface-2);border:1px solid var(--nk-hairline);border-radius:12px;padding:11px 13px}

/* ============================================================
   Анимации карточки предмета (референс nakopchik-animations)
   ============================================================ */
:root{ --nk-spring:cubic-bezier(.16,1,.3,1); --nk-out:cubic-bezier(.22,.61,.36,1); --nk-t-bar:.7s; }

.result{position:relative;overflow:visible}
.result.lock::after{content:'';position:absolute;inset:-1px;border-radius:var(--nk-r-inner);
  pointer-events:none;animation:nkLock .9s var(--nk-out)}
@keyframes nkLock{0%{box-shadow:0 0 0 0 rgba(239,192,106,.5),0 0 0 0 rgba(198,150,66,.4)}
  100%{box-shadow:0 0 0 10px rgba(239,192,106,0),0 0 0 10px rgba(198,150,66,0)}}

/* поле: фиксация значения — пружинный «поп» + кольцо */
@keyframes nkCommit{0%{transform:scale(1);box-shadow:0 0 0 0 rgba(99,102,241,.5)}
  40%{transform:scale(1.06)}100%{transform:scale(1);box-shadow:0 0 0 8px rgba(99,102,241,0)}}
.input.commit{animation:nkCommit .42s var(--nk-spring)}

/* большое число «накоп» — импульс яркости */
.num{will-change:transform,filter}
@keyframes nkNum{0%{transform:translateY(0) scale(1);filter:brightness(1)}
  32%{transform:translateY(-2px) scale(1.045);filter:brightness(1.3)}
  100%{transform:translateY(0) scale(1);filter:brightness(1)}}
.num.pulse{animation:nkNum .62s var(--nk-out)}
/* фикс «дрожания»: резервируем стабильную ширину у анимируемых чисел,
   чтобы счёт вверх не менял ширину каждый кадр и строки не пере-переносились */
.num{display:inline-block;min-width:3.8ch;font-variant-numeric:tabular-nums}
.num-of{font-variant-numeric:tabular-nums}
.num-of .maxv{display:inline-block;min-width:2.4ch;text-align:right}
.fin-v{display:inline-block;min-width:3.8ch;text-align:right;font-variant-numeric:tabular-nums}
.passed b{font-variant-numeric:tabular-nums}
.passed .pf{display:inline-block;min-width:3.6ch;text-align:right}

/* прогресс-бар — плавная ширина + блик */
.progress{position:relative}
.progress>i{transition:width var(--nk-t-bar) var(--nk-spring)}
.progress .shine{position:absolute;top:0;bottom:0;width:38%;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);
  animation:nkShine .85s var(--nk-out) forwards}
@keyframes nkShine{0%{transform:translateX(-130%) skewX(-18deg)}100%{transform:translateX(330%) skewX(-18deg)}}

/* итог — флип округлённой оценки + зелёная вспышка */
.fin-of{perspective:240px}
.fin-of .grade{display:inline-block;backface-visibility:hidden;font-variant-numeric:tabular-nums}
@keyframes nkFlip{0%{transform:rotateX(92deg);opacity:0}100%{transform:rotateX(0);opacity:1}}
.fin-of .grade.flip{animation:nkFlip .42s var(--nk-spring)}
@keyframes nkGreen{0%{filter:brightness(1.6) drop-shadow(0 0 7px rgba(255,255,255,.55))}100%{filter:brightness(1)}}
.fin-of.win{animation:nkGreen .6s var(--nk-out)}
/* экзамен заполнен — итог золотой; если не хватает на «4» — красный */
.fin.examset .fin-v,.fin.examset .fin-of{color:var(--nk-gold)}
.fin.fail .fin-v,.fin.fail .fin-of{color:#FF6B6B}

/* блок «нужно» — сворачивание при сдаче экзамена; «пока без экзамена» — растворение */
.needblock{overflow:hidden;transition:max-height .4s var(--nk-out),opacity .3s,margin .4s;max-height:240px;opacity:1}
.needblock.gone{max-height:0;opacity:0;margin:0}

/* чипы «нужно» — вход/выход со стаггером + смена значения */
@keyframes nkChipIn{0%{opacity:0;transform:translateY(9px) scale(.84)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes nkChipOut{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.84) translateY(4px)}}
.pill.in{animation:nkChipIn .34s var(--nk-spring) both}
.pill.out{animation:nkChipOut .26s ease-in forwards}
@keyframes nkRise{0%{opacity:0;transform:translateY(46%);color:var(--nk-violet-300)}
  70%{color:var(--nk-violet-300)}100%{opacity:1;transform:translateY(0)}}
.pill .nv{display:inline-block;min-width:2.4ch;text-align:right;font-variant-numeric:tabular-nums}
.pill .nv.rise{animation:nkRise .26s var(--nk-out)}

/* спец-анимация экзамена: ячейка с градиентной заливкой + ореол */
.exfield{position:relative;min-width:92px}
.exbox{position:relative;width:100%;height:44px;border:1px solid var(--nk-hairline);border-radius:var(--nk-r-input);
  background:var(--nk-surface-2);overflow:hidden;display:flex}
.exbox:focus-within{border-color:var(--nk-indigo);box-shadow:var(--nk-focus)}
.input.bare{background:transparent;border:0;box-shadow:none;height:100%;width:100%;min-width:0;color:var(--nk-gold);font-size:24px;font-weight:800;letter-spacing:-.02em}
.input.bare:focus{box-shadow:none}
.exfill{position:absolute;inset:0;pointer-events:none;border-radius:inherit;opacity:0;
  transform:scale(.28);transform-origin:50% 50%;
  background:radial-gradient(56% 130% at 50% 50%, rgba(247,214,150,.85) 0%,
    rgba(214,160,74,.42) 44%, rgba(192,143,51,0) 76%)}
.exhalo{position:absolute;inset:-3px;border-radius:15px;background:var(--nk-grad-exam);opacity:0;
  filter:blur(4px);z-index:-1;pointer-events:none;transform:scale(.5);transform-origin:50% 50%}
/* Свет расходится из центра поля, а не наползает плашкой снизу. */
@keyframes nkExamBurst{0%{opacity:0;transform:scale(.28)}
  40%{opacity:1;transform:scale(1.06)}
  100%{opacity:0;transform:scale(1.3)}}
@keyframes nkHalo{0%{opacity:0;transform:scale(.5)}
  30%{opacity:.8;transform:scale(1.04)}
  100%{opacity:0;transform:scale(1.2)}}
/* Цифра экзамена коротко распухает — она и так крупнее прочих оценок. */
@keyframes nkExamNum{0%{transform:scale(.8)}46%{transform:scale(1.22)}100%{transform:scale(1)}}
.exfield.fillin .exfill{animation:nkExamBurst .72s var(--nk-out)}
.exfield.fillin .exhalo{animation:nkHalo .9s var(--nk-out)}
.exfield.fillin .input.bare{animation:nkExamNum .68s var(--nk-spring)}

/* искры при фиксации экзамена */
.spark{position:absolute;width:7px;height:7px;border-radius:50%;pointer-events:none;z-index:6;
  animation:nkSpark .72s var(--nk-out) forwards}
@keyframes nkSpark{0%{opacity:1;transform:translate(0,0) scale(1)}
  100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.35)}}

@media (prefers-reduced-motion: reduce){
  .input.commit,.num.pulse,.progress .shine,.fin-of .grade.flip,.fin-of.win,
  .pill.in,.pill.out,.pill .nv.rise,.exfield.fillin .exfill,.exfield.fillin .exhalo,
  .exfield.fillin .input.bare,
  .spark,.result.lock::after{animation:none!important}
  .progress>i{transition:none!important}
}

/* ============================================================
   РЕДИЗАЙН — неоморфная подача поверх исходной разметки.
   Ни один селектор не переименован: nakop.html не меняется,
   вся логика сайта работает как прежде.
   ============================================================ */

/* --- поверхности: приподняты, без рамок --- */
.card,.calpanel,.panel,.chattile,#tourTip,.toast{border:0;box-shadow:var(--nk-up)}
/* Освещённая поверхность не бывает плоской заливкой: сверху светлее, снизу
   темнее на пару процентов. Это и даёт объём вместе с многослойной тенью. */
.card,.calpanel,.panel,.chattile{background:linear-gradient(180deg,var(--nk-card-a) 0%,var(--nk-surface) 55%,var(--nk-card-b) 100%)}
.card.dragover{outline:2px dashed var(--nk-teal);outline-offset:-4px}
.card .idx{color:#8A8172}

/* --- поля: утопленные лунки --- */
.input,.field,.chat-input textarea,.exbox{border:0;background:var(--nk-surface-2);box-shadow:var(--nk-in);
  color:var(--nk-text);font-family:var(--nk-font-mono);font-weight:700}
.field{font-family:var(--nk-font-display);font-weight:400}
.chat-input textarea{font-family:var(--nk-font-display);font-weight:400;box-shadow:var(--nk-in-sm)}
.input:focus,.field:focus,.chat-input textarea:focus{outline:none;box-shadow:var(--nk-focus);background:var(--nk-well-focus);color:var(--nk-teal)}
/* Ввод оценки за экзамен — обводка золотая, по цвету самой строки экзамена,
   а не бирюзовая как у остальных полей. */
.exbox:focus-within{box-shadow:inset 0 0 0 2px var(--nk-gold),
  inset 0 2px 5px rgba(126,98,48,.22), 0 0 0 4px rgba(138,110,60,.14)}
.exbox:focus-within .exfill{opacity:.10}
.input::placeholder,.field::placeholder{color:#8A7A5A;font-weight:700}
.field::placeholder{font-weight:400}

/* --- группа элементов: песочная плашка СВЕТЛЕЕ плитки, рельеф вместо цвета --- */
.group{border:0;background:linear-gradient(180deg,var(--nk-plate-a) 0%,var(--nk-inner-bg) 60%,var(--nk-plate-b) 100%);
  box-shadow:var(--nk-up-xs);padding:14px}
.group .gname{color:var(--nk-text)}
.group .ghead .w,.group .ghead .input.wt{color:var(--nk-teal)}
.git label{color:var(--nk-dim)}

/* Плашка — признак ГРУППЫ работ (МКР с МКР1…МКР4, Квизы и т.п.).
   Одиночная работа — КР, Экзамен, Выступление — остаётся обычной строкой:
   плашка на каждой строке уравнивала группу с одиночным элементом. */

/* --- строка экзамена: тёплая --- */
.row .nm.exam{color:var(--nk-gold);font-weight:600}
.exbox{background:var(--nk-warm-well);box-shadow:var(--nk-in-warm)}
.input.bare{background:transparent;box-shadow:none;color:var(--nk-gold)}
.input.bare:focus{box-shadow:none;background:transparent}
.examdate{border:0;background:var(--nk-warm);box-shadow:var(--nk-up-xs)}
.examdate .ed-when{color:var(--nk-gold)}
.examdate .ed-when b{color:#7A5410}

/* ============================================================
   ПОДНОС ИТОГА — единственное тёмное место интерфейса,
   поэтому читается первым (как в редизайне).
   ============================================================ */
.result{border:0;background:var(--nk-tray);box-shadow:var(--nk-tray-sh);color:var(--nk-tray-text);
  border-radius:var(--nk-r-inner);padding:22px 20px 20px}
.result::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  background:radial-gradient(120% 95% at 88% -12%, rgba(199,216,174,.20), rgba(199,216,174,0) 62%)}
.result > *{position:relative;z-index:1}
/* Искры салюта — вне потока. Правило выше делало их relative, они вставали
   в колонку подноса (8 × (7px + gap)) и он «растягивался» до animationend. */
.result > .spark{position:absolute;z-index:6}
.result .num{color:var(--nk-tray-text);font-family:var(--nk-font-mono);letter-spacing:-.04em;
  text-shadow:0 3px 14px rgba(5,24,26,.5)}
.result .num.empty{color:var(--nk-tray-mute);text-shadow:none}
.result .num-of{color:var(--nk-tray-soft);font-family:var(--nk-font-mono)}
.result .progress{background:rgba(6,26,28,.55);box-shadow:inset 0 2px 4px rgba(0,0,0,.4)}
.result .progress>i{background:linear-gradient(90deg,#8FC6A4,#C9DCAE);box-shadow:0 0 12px rgba(201,220,174,.5)}
.result .passed{color:var(--nk-tray-mute);font-family:var(--nk-font-mono);font-size:13px;letter-spacing:.03em}
.result .passed b{color:var(--nk-tray-soft);font-weight:700}
.result .fin .fin-label{color:var(--nk-tray-mute);font-family:var(--nk-font-mono);font-size:11px;
  letter-spacing:.18em;text-transform:uppercase}
.result .fin .fin-v,.result .fin .fin-of{color:var(--nk-lime);font-family:var(--nk-font-mono);
  letter-spacing:-.045em;text-shadow:0 4px 16px rgba(5,24,26,.5)}
.result .fin .fin-of.muted{color:var(--nk-tray-mute);text-shadow:none}
.result .fin.risk .fin-v,.result .fin.risk .fin-of{color:var(--nk-tray-mute);text-shadow:none}
.result .fin.examset .fin-v,.result .fin.examset .fin-of{color:var(--nk-gold-chip)}
.result .fin.fail .fin-v,.result .fin.fail .fin-of{color:#FF9B8A}
.result .fin-wait{color:var(--nk-tray-mute);line-height:1.5}
.result .need-label{color:var(--nk-tray-mute);letter-spacing:.16em;text-transform:uppercase;font-size:10px}
.result .pill{border:0;color:var(--nk-lime);border-radius:13px;padding:8px 13px;
  background:linear-gradient(158deg,#2C7370 0%,#1B5155 100%);
  /* кольцо по всему периметру, а не диагональные тени: иначе слева и справа
     подсветки нет и края градиента читаются жёсткими полосами */
  box-shadow:0 0 0 1px rgba(150,205,195,.16),
    inset 0 1px 0 rgba(219,238,231,.18),
    0 2px 7px rgba(4,20,22,.42)}
.result .pill b{color:var(--nk-tray-text)}
.result .pill:active{transform:scale(.93);
  box-shadow:0 0 0 1px rgba(150,205,195,.10), inset 0 2px 7px rgba(4,18,20,.6)}
/* уже обеспеченный порог — утоплен, а не приподнят */
.result .pill.have{color:var(--nk-mint);background:rgba(6,26,28,.5);
  box-shadow:0 0 0 1px rgba(150,205,195,.10), inset 0 2px 8px rgba(4,18,20,.6)}
.result .whatif{color:var(--nk-tray-mute)}
.result .whatif .ex{color:var(--nk-gold-chip)}
.result .whatif .input{background:var(--nk-warm-well);box-shadow:var(--nk-in-warm);color:var(--nk-gold)}

/* предупреждение о сумме весов — тёплая плашка на светлой карточке */
.wsum{color:#7A5410;background:var(--nk-warm);border:0;box-shadow:var(--nk-up-xs)}
.settings{border-top:1px solid rgba(126,108,80,.18);color:var(--nk-dim)}

/* --- шапка --- */
header.app{background:var(--nk-head-bg);border-bottom:1px solid rgba(108,90,62,.26);box-shadow:inset 0 -1px 0 rgba(255,255,255,.35);
  backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%)}
.brand .wm small{color:var(--nk-dim)}
.who{border:0;background:var(--nk-chip-bg);box-shadow:var(--nk-in-sm);color:var(--nk-text)}
.who b{color:var(--nk-teal)}
.who.clickable:hover{background:var(--nk-chip-hover)}
.status{color:var(--nk-dim)}

/* --- кнопки --- */
.btn,.btnfull,.calbtn{border:0;background:linear-gradient(180deg,var(--nk-btn-a) 0%,var(--nk-btn-b) 100%);
  box-shadow:var(--nk-up-sm);color:var(--nk-text)}
.btn:hover,.btnfull:hover,.calbtn:hover{background:linear-gradient(180deg,var(--nk-btn-ha) 0%,var(--nk-btn-hb) 100%);
  box-shadow:var(--nk-up-hover)}
.btn:active,.btnfull:active,.calbtn:active{box-shadow:var(--nk-in-sm)}
.btn:active,.calbtn:active{transform:scale(.94)}
.btn.primary,.btnfull.primary{color:var(--nk-on-dark);background:var(--nk-grad-cta);box-shadow:var(--nk-glow-brand)}
.btn.ghost{background:var(--nk-ghost-bg);
  box-shadow:0 0 0 1px rgba(120,101,72,.09), 0 1px 2px rgba(108,90,62,.10),
    inset 0 1px 0 rgba(255,255,255,.75)}
.btn.ghost:hover{background:linear-gradient(180deg,var(--nk-btn-ha) 0%,var(--nk-btn-hb) 100%);box-shadow:var(--nk-up-sm)}
.btn.good,.btnfull.good{color:var(--nk-on-dark);background:var(--nk-grad-cta);box-shadow:var(--nk-glow-brand)}
.btn.edit{color:var(--nk-teal)}
.btn.danger{color:#8E4B33}
.btn.danger:hover{color:#A3543A}
#toggleEdit.on{background:var(--nk-chip-hover);box-shadow:var(--nk-in-sm);color:var(--nk-teal)}
.btnfull .s{color:var(--nk-dim)}
.linkbtn{color:var(--nk-muted)}
.linkbtn:hover{color:var(--nk-teal)}
.iconbtn{color:#8E4B33}
.iconbtn:hover{color:#A3543A}

/* --- экраны входа, настройки, тост --- */
.panel{background:var(--nk-surface)}
.bigpass,.passline,.tgok{border:0;background:var(--nk-surface-2);box-shadow:var(--nk-in);color:var(--nk-teal)}
.err{color:#8E4B33}
.tgsep::before,.tgsep::after{background:rgba(126,108,80,.25)}
.toast{background:var(--nk-surface);color:var(--nk-text)}
.setlabel{color:var(--nk-text)}

/* --- календарь экзаменов --- */
.calpanel{background:var(--nk-surface)}
.calrow{border-top:1px solid rgba(126,108,80,.18)}
.caltime{color:var(--nk-gold)}
.calbtn{color:var(--nk-teal);font-weight:600}

/* --- чат импорта (ИИ) --- */
.chattile{background:var(--nk-surface)}
.chat-head,.chat-input{border-color:rgba(126,108,80,.18)}
.bubble.assistant{border:0;background:var(--nk-inner-bg);box-shadow:var(--nk-up-xs);color:var(--nk-text)}
.bubble.user{background:var(--nk-grad-cta);color:var(--nk-on-dark)}
.bubble.typing{color:var(--nk-muted)}
.apply-list{color:var(--nk-muted)}
.attchip{border:0;background:var(--nk-inner-bg);box-shadow:var(--nk-up-xs);color:var(--nk-teal)}
#chatBackdrop{background:rgba(72,60,42,.45)}
@media (max-width:560px){
  .chattile{box-shadow:0 -14px 44px rgba(126,108,80,.4)}
  .chattile .chat-head::before{background:rgba(126,108,80,.35)}
}

/* --- обучающий тур --- */
#tourHole{box-shadow:0 0 0 9999px rgba(72,60,42,.72);outline-color:var(--nk-teal)}
#tourTip{background:var(--nk-surface)}
#tourTip .t-text{color:var(--nk-muted)}
#tourTip .t-next{background:var(--nk-grad-cta);color:var(--nk-on-dark);box-shadow:var(--nk-glow-brand)}
#tourTip .t-arrow.up{border-bottom-color:var(--nk-surface)}
#tourTip .t-arrow.down{border-top-color:var(--nk-surface)}
#tourTip .t-arrow.left{border-right-color:var(--nk-surface)}
#tourTip .t-arrow.right{border-left-color:var(--nk-surface)}

/* --- анимации: перекрашиваем под новую палитру, тайминги не трогаем --- */
@keyframes nkCommit{0%{transform:scale(1);box-shadow:var(--nk-in),0 0 0 0 rgba(20,89,92,.5)}
  40%{transform:scale(1.06)}100%{transform:scale(1);box-shadow:var(--nk-in),0 0 0 8px rgba(20,89,92,0)}}
@keyframes nkLock{0%{box-shadow:0 0 0 0 rgba(201,220,174,.55),0 0 0 0 rgba(42,111,112,.45)}
  100%{box-shadow:0 0 0 10px rgba(201,220,174,0),0 0 0 10px rgba(42,111,112,0)}}
@keyframes nkGreen{0%{filter:brightness(1.6) drop-shadow(0 0 7px rgba(217,232,191,.65))}100%{filter:brightness(1)}}
@keyframes nkRise{0%{opacity:0;transform:translateY(46%);color:var(--nk-mint)}
  70%{color:var(--nk-mint)}100%{opacity:1;transform:translateY(0)}}
.progress .shine{background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent)}

/* ============================================================
   Выбор шаблона предмета — инлайновый слот в конце сетки.
   Раньше это была модалка поверх всего; теперь страница
   прокручивается туда, где встанет новая плитка, и выбор
   происходит на её месте (как в мобильном приложении).
   ============================================================ */
.tplslot{display:flex;flex-direction:column;gap:12px;padding:22px;height:100%;
  border-radius:var(--nk-r-card);
  background:linear-gradient(180deg,var(--nk-card-a) 0%,var(--nk-surface) 55%,var(--nk-card-b) 100%);
  box-shadow:var(--nk-up);transform-origin:top center}
.tplslot-title{font-family:var(--nk-font-display);font-weight:700;font-size:22px;
  letter-spacing:-.01em;color:var(--nk-text)}
.tplslot-sub{font-size:13.5px;line-height:1.5;color:var(--nk-muted);margin-top:-4px}
.tplslot-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:2px}
.tplcard{display:flex;flex-direction:column;justify-content:center;gap:3px;text-align:left;
  min-height:74px;padding:12px 14px;border:0;border-radius:var(--nk-r-tile);cursor:pointer;
  background:linear-gradient(180deg,var(--nk-plate-a) 0%,var(--nk-inner-bg) 60%,var(--nk-plate-b) 100%);
  box-shadow:var(--nk-up-xs);transition:box-shadow var(--nk-ease),transform var(--nk-ease)}
.tplcard:hover{box-shadow:var(--nk-up-hover)}
.tplcard:active{transform:scale(.97);box-shadow:var(--nk-in-sm)}
.tplcard .t{font-family:var(--nk-font-display);font-weight:600;font-size:15.5px;color:var(--nk-text)}
.tplcard .s{font-family:var(--nk-font-mono);font-size:10.5px;line-height:1.4;color:var(--nk-dim)}
.tplcard.blank{grid-column:1 / -1;min-height:60px}
.tplcard.blank .t{color:var(--nk-teal)}
.tplslot .linkbtn{align-self:center;margin-top:auto;padding-top:8px}

/* кнопка «+ Предмет» держится нажатой, пока слот открыт */
#addSubject.on{background:var(--nk-grad-cta);color:var(--nk-on-dark);box-shadow:var(--nk-glow-brand)}

/* появление и сворачивание слота */
@keyframes nkSlotIn{0%{opacity:0;transform:translateY(-14px) scale(.94)}
  100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes nkSlotOut{0%{opacity:1;transform:scale(1)}
  100%{opacity:0;transform:translateY(-8px) scale(.95)}}
.tplslot.opening{animation:nkSlotIn .44s var(--nk-spring)}
.tplslot.closing{animation:nkSlotOut .22s ease-in forwards}
.tplslot.opening .tplcard{animation:nkChipIn .38s cubic-bezier(.16,1,.3,1) both}
.tplslot.opening .tplcard:nth-child(1){animation-delay:.06s}
.tplslot.opening .tplcard:nth-child(2){animation-delay:.11s}
.tplslot.opening .tplcard:nth-child(3){animation-delay:.16s}
.tplslot.opening .tplcard:nth-child(4){animation-delay:.21s}

@media (prefers-reduced-motion:reduce){
  .tplslot.opening,.tplslot.closing,.tplslot.opening .tplcard{animation:none!important}
}

/* ---- выбор образовательной программы и курса ---- */
.pglist{display:flex;flex-direction:column;gap:8px}
.pgopt{display:flex;flex-direction:column;gap:2px;text-align:left;border:0;cursor:pointer;
  padding:12px 14px;border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-plate-a) 0%,var(--nk-inner-bg) 60%,var(--nk-plate-b) 100%);
  box-shadow:var(--nk-up-xs);transition:box-shadow var(--nk-ease),transform var(--nk-ease)}
.pgopt:hover{box-shadow:var(--nk-up-hover)}
.pgopt:active{transform:scale(.98)}
.pgopt .t{font-family:var(--nk-font-display);font-weight:600;font-size:15px;color:var(--nk-text)}
.pgopt .s{font-family:var(--nk-font-mono);font-size:10.5px;color:var(--nk-gold)}
.pgopt.on{background:var(--nk-grad-cta);box-shadow:var(--nk-glow-brand)}
.pgopt.on .t{color:var(--nk-on-dark)}
.pgopt.on .s{color:var(--nk-gold-chip)}
.pgcourse{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.pgnum{border:0;cursor:pointer;padding:12px 0;border-radius:var(--nk-r-tile);
  font-family:var(--nk-font-mono);font-weight:700;font-size:17px;color:var(--nk-text);
  background:linear-gradient(180deg,var(--nk-plate-a) 0%,var(--nk-inner-bg) 60%,var(--nk-plate-b) 100%);
  box-shadow:var(--nk-up-xs);transition:box-shadow var(--nk-ease),transform var(--nk-ease)}
.pgnum:hover{box-shadow:var(--nk-up-hover)}
.pgnum:active{transform:scale(.94)}
.pgnum.on{background:var(--nk-grad-cta);color:var(--nk-on-dark);box-shadow:var(--nk-glow-brand)}
#progGate .panel{max-width:440px;gap:16px}
#pgSave{transition:opacity var(--nk-ease)}

/* ---- «Новый предмет» с названием в слоте добавления ---- */
.tplnew{display:flex;flex-direction:column;gap:8px;margin-top:4px;padding:14px;
  border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-plate-a) 0%,var(--nk-inner-bg) 60%,var(--nk-plate-b) 100%);
  box-shadow:var(--nk-up-xs)}
.tplnew-lbl{font-family:var(--nk-font-display);font-weight:600;font-size:15px;color:var(--nk-teal)}
.tplnew .field{height:42px;font-size:15px}
.tplslot .sethint{margin:0;line-height:1.5}

/* ---- вкладка дедлайнов ---- */
.dlform{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:14px;margin-bottom:14px;
  border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-plate-a) 0%,var(--nk-inner-bg) 60%,var(--nk-plate-b) 100%);
  box-shadow:var(--nk-up-xs)}
.dlform .field{width:auto;height:40px;font-size:14px;font-family:var(--nk-font-display);font-weight:500}
.dlform .dlf-type{min-width:132px}
.dlform .dlf-subj{min-width:160px}
.dlform .dlf-title{min-width:190px;flex:1}
.dlform .dlf-date{width:158px}
.dlform .dlf-time{width:112px}
.dlf-sep{font-family:var(--nk-font-mono);font-size:12px;color:var(--nk-dim)}
.dltype{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px;flex:0 0 auto}
.dlsub{color:var(--nk-dim);font-size:14px;font-weight:400}
.dlkind{margin-left:9px;font-family:var(--nk-font-mono);font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--nk-dim)}
.caledit{display:flex;gap:6px;flex-wrap:wrap}
.caledit .field{height:38px;font-size:13px;width:auto;font-family:var(--nk-font-mono);font-weight:500}
.caledit .dlf-date{width:150px}
.caledit .dlf-time{width:104px}
.calname{display:flex;align-items:center;flex-wrap:wrap}
@media (max-width:720px){
  .dlform .dlf-title,.dlform .dlf-subj,.dlform .dlf-type{min-width:0;flex:1 1 140px}
  .caledit{width:100%}
}
.calrow .calname{min-width:210px;gap:0;row-gap:2px}
.calrow .caldays{min-width:104px;text-align:right}

/* ============================================================
   Затемнение под модалками, страница настроек и плавающие
   кнопки для телефона.
   ============================================================ */

/* Модалка больше не висит в воздухе: фон под ней притемняется и слегка
   размывается, поэтому окно выбора программы читается как отдельный слой. */
.overlay{background:rgba(58,47,32,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.overlay > .panel{animation:nkPanelIn .34s cubic-bezier(.16,1,.3,1)}
@keyframes nkPanelIn{0%{opacity:0;transform:translateY(12px) scale(.97)}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .overlay > .panel{animation:none} }

/* ---- страница настроек аккаунта ---- */
.setwrap{max-width:640px;padding-top:22px}
#settings .setpanel{max-width:none;width:100%;text-align:left;gap:20px}
#settings .brand .wm{font-size:19px}
.setdanger{display:flex;gap:10px;flex-wrap:wrap}

/* ---- плавающие кнопки (только телефон) ---- */
.fab{position:fixed;bottom:calc(18px + env(safe-area-inset-bottom));z-index:58;
  width:58px;height:58px;border:0;border-radius:50%;cursor:pointer;display:none;
  align-items:center;justify-content:center;color:var(--nk-on-dark);
  background:var(--nk-grad-cta);box-shadow:var(--nk-glow-brand),0 10px 26px rgba(17,54,57,.34);
  transition:transform var(--nk-ease),box-shadow var(--nk-ease)}
.fab:active{transform:scale(.92)}
.fab.fabedit{right:calc(18px + env(safe-area-inset-right))}
.fab.fabmenu{left:calc(18px + env(safe-area-inset-left));
  background:linear-gradient(180deg,var(--nk-btn-a) 0%,var(--nk-btn-b) 100%);color:var(--nk-text);
  box-shadow:var(--nk-up-sm)}
.fab.fabmenu.on{background:var(--nk-grad-cta);color:var(--nk-on-dark);box-shadow:var(--nk-glow-brand)}
.fab.fabedit.on{background:linear-gradient(180deg,var(--nk-btn-a) 0%,var(--nk-btn-b) 100%);color:var(--nk-teal);
  box-shadow:var(--nk-up-sm)}
.fabdim{position:fixed;inset:0;z-index:56;display:none;
  background:rgba(58,47,32,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.fabsheet{position:fixed;z-index:57;display:none;flex-direction:column;gap:8px;
  left:calc(16px + env(safe-area-inset-left));right:calc(16px + env(safe-area-inset-right));
  bottom:calc(88px + env(safe-area-inset-bottom))}
.fabitem{border:0;cursor:pointer;text-align:left;padding:15px 18px;font-size:16px;font-weight:500;
  font-family:var(--nk-font-display);color:var(--nk-text);border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-btn-a) 0%,var(--nk-btn-b) 100%);box-shadow:var(--nk-up-sm);
  animation:nkFabIn .26s cubic-bezier(.16,1,.3,1) both}
.fabitem:active{transform:scale(.98)}
@keyframes nkFabIn{0%{opacity:0;transform:translateY(10px) scale(.96)}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .fabitem{animation:none} }

@media (max-width:560px){
  /* на телефоне действия уезжают в плавающие кнопки, шапка остаётся информационной */
  .hbar > .btn,.hbar > a.btn{display:none}
  .hbar{gap:8px;overflow:visible}
  .hbar .status{display:none}
  #settings .hbar > .btn{display:inline-flex}      /* «Назад» на странице настроек нужен */
  .fab{display:flex}
  .fabsheet{display:none}
  .fabsheet:not(.hide){display:flex}
  .fabdim:not(.hide){display:block}
  .wrap{padding-bottom:96px}                        /* чтобы кнопки не накрывали контент */
  body.on-settings .fab{display:none}
}

/* На странице настроек мобильные сокращения не нужны: подписи кнопок
   и заголовок должны остаться, иначе «опасная зона» — два безымянных значка. */
@media (max-width:560px){
  #settings .btn.hasicon .lbl{display:inline}
  #settings .btn.hasicon{gap:6px;padding:9px 14px}
  #settings .brand .wm{display:block}
  #settings .setdanger{flex-direction:column;align-items:stretch}
  #settings .setdanger .btn{justify-content:center}
}

/* ============================================================
   Анимация плавающих кнопок, аватарка и сжатие шапки
   ============================================================ */

/* Каждая кнопка держит две иконки и переключает их поворотом:
   карандаш ↔ галочка у правки, «гамбургер» ↔ крестик у меню. */
.fab .ficon{position:absolute;display:grid;place-items:center;
  transition:opacity .26s cubic-bezier(.22,.61,.36,1), transform .34s cubic-bezier(.34,1.25,.4,1)}
.fab .ficon.a{opacity:1;transform:rotate(0) scale(1)}
.fab .ficon.b{opacity:0;transform:rotate(-90deg) scale(.6)}
.fab.on .ficon.a{opacity:0;transform:rotate(90deg) scale(.6)}
.fab.on .ficon.b{opacity:1;transform:rotate(0) scale(1)}
.fab{position:fixed;overflow:visible}

/* появление кнопок и «дыхание» правки, когда режим включён */
@keyframes nkFabPop{0%{opacity:0;transform:scale(.6) translateY(14px)}
  60%{transform:scale(1.06) translateY(0)}100%{opacity:1;transform:scale(1)}}
@keyframes nkFabRing{0%{box-shadow:var(--nk-glow-brand),0 0 0 0 rgba(20,89,92,.42)}
  100%{box-shadow:var(--nk-glow-brand),0 0 0 16px rgba(20,89,92,0)}}
.fab{animation:nkFabPop .42s cubic-bezier(.34,1.25,.4,1) both}
.fab.fabedit{animation-delay:.05s}
.fabedit.on::after{content:'';position:absolute;inset:0;border-radius:50%;pointer-events:none;
  animation:nkFabRing 1.6s cubic-bezier(.22,.61,.36,1) infinite}
.fab:active{transform:scale(.9)}
@media (prefers-reduced-motion:reduce){
  .fab,.fab .ficon,.fabedit.on::after{animation:none!important;transition:none!important}
}

/* ---- кнопка профиля с аватаркой ---- */
.who{display:inline-flex;align-items:center;gap:8px;padding:5px 13px 5px 5px}
.ava{width:26px;height:26px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  color:var(--nk-on-dark);font-family:var(--nk-font-display);font-weight:700;font-size:13px;line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 2px 5px rgba(96,78,52,.28)}
.whoname{font-family:var(--nk-font-display);font-weight:600;font-size:13.5px;
  max-width:132px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who .tgdot{display:inline-flex;align-items:center}

/* ---- сжатие шапки при прокрутке (телефон) ---- */
@media (max-width:560px){
  header.app{transition:box-shadow .24s var(--nk-ease)}
  .hbar{padding:11px 14px;transition:padding .24s cubic-bezier(.22,.61,.36,1)}
  .brand img{transition:width .24s,height .24s}
  .brand .wm{transition:font-size .24s,opacity .2s}
  .who{transition:padding .24s,transform .24s}

  body.scrolled .hbar{padding:5px 12px}
  body.scrolled .brand img{width:24px;height:24px}
  body.scrolled .brand .wm{display:none}               /* остаётся только знак */
  body.scrolled .brand{gap:0}
  body.scrolled .who{padding:2px 10px 2px 2px}
  body.scrolled .ava{width:22px;height:22px;font-size:11.5px}
  body.scrolled .whoname{font-size:12.5px;max-width:104px}
  body.scrolled header.app{box-shadow:0 6px 18px rgba(96,78,52,.16)}
}
.scrollsentinel{position:absolute;top:0;left:0;width:1px;height:44px;pointer-events:none;opacity:0}

/* ---- двусторонний ползунок модулей ---- */
.mrange{position:relative;height:34px;display:flex;align-items:center;margin-top:2px}
.mrange-track{position:absolute;left:0;right:0;height:8px;border-radius:6px;
  background:var(--nk-surface-2);box-shadow:var(--nk-in-sm)}
.mrange-fill{position:absolute;top:0;bottom:0;border-radius:6px;background:var(--nk-grad-cta);
  transition:left .12s linear,width .12s linear}
.mrange input[type=range]{position:absolute;left:0;width:100%;margin:0;background:none;
  -webkit-appearance:none;appearance:none;pointer-events:none;height:34px}
.mrange input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;
  width:26px;height:26px;border-radius:50%;cursor:grab;border:0;
  background:linear-gradient(180deg,var(--nk-btn-a),#EFE9DE);
  box-shadow:0 0 0 1px rgba(120,101,72,.18),0 2px 5px rgba(96,78,52,.3),inset 0 1px 0 rgba(255,255,255,.9)}
.mrange input[type=range]::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(.94)}
.mrange input[type=range]::-moz-range-thumb{pointer-events:auto;width:26px;height:26px;border-radius:50%;
  border:0;background:#F5F1E8;box-shadow:0 0 0 1px rgba(120,101,72,.18),0 2px 5px rgba(96,78,52,.3)}
.mrange-ticks{display:flex;justify-content:space-between;padding:0 9px;margin-top:-2px;
  font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-dim)}

/* ---- переключатель «обязательный / по желанию» ---- */
.segm{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;border-radius:var(--nk-r-tile);
  background:var(--nk-surface-2);box-shadow:var(--nk-in-sm)}
.segb{border:0;cursor:pointer;padding:10px 8px;border-radius:12px;background:transparent;
  font-family:var(--nk-font-display);font-weight:600;font-size:14px;color:var(--nk-muted);
  transition:background var(--nk-ease),color var(--nk-ease),box-shadow var(--nk-ease)}
.segb.on{background:linear-gradient(180deg,var(--nk-btn-a),var(--nk-btn-b));color:var(--nk-text);box-shadow:var(--nk-up-sm)}

/* ---- группы и метки в списке шаблонов ---- */
.tplgroup{grid-column:1 / -1;font-family:var(--nk-font-mono);font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--nk-dim);margin:6px 0 -2px}
.tplcard .tplmeta{color:var(--nk-teal);font-size:10px;letter-spacing:.04em}
#shareModal .panel{max-width:440px;gap:16px}

/* ============================================================
   Нажатие «внутрь»: неоморфная кнопка при клике должна
   продавливаться, а не просто уменьшаться.
   ============================================================ */
.btn:active,.btnfull:active,.calbtn:active,.tplcard:active,.tpllib:active,
.pgopt:active,.pgnum:active,.segb:active,.libcard .btn:active,.iconbtn:active{
  box-shadow:var(--nk-in) !important;
  transform:translateY(1px) scale(.985);
  transition:box-shadow .06s linear,transform .06s linear}
.btn.primary:active,.btnfull.primary:active,.btn.good:active,.btnfull.good:active,
.pgopt.on:active,.pgnum.on:active{
  box-shadow:inset 0 2px 6px rgba(4,26,28,.55),inset 0 -1px 0 rgba(219,238,231,.18) !important}
.fab:active{box-shadow:inset 0 3px 8px rgba(4,26,28,.5) !important;transform:scale(.92)}
@media (prefers-reduced-motion:reduce){
  .btn:active,.btnfull:active,.calbtn:active,.tplcard:active,.tpllib:active,
  .pgopt:active,.pgnum:active,.segb:active{transform:none}
}

/* ---- слот добавления: два пути ---- */
.tplor{font-family:var(--nk-font-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--nk-dim);text-align:center;margin:2px 0}
.tpllib{display:flex;flex-direction:column;gap:3px;text-align:left;border:0;cursor:pointer;
  padding:14px 16px;border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-plate-a) 0%,var(--nk-inner-bg) 60%,var(--nk-plate-b) 100%);
  box-shadow:var(--nk-up-xs);transition:box-shadow var(--nk-ease)}
.tpllib:hover{box-shadow:var(--nk-up-hover)}
.tpllib .t{font-family:var(--nk-font-display);font-weight:600;font-size:15.5px;color:var(--nk-text)}
.tpllib .s{font-family:var(--nk-font-mono);font-size:10.5px;line-height:1.45;color:var(--nk-teal)}

/* ---- страница библиотеки ---- */
.libwrap{max-width:1180px;margin:0 auto;padding:22px 18px 70px}
.libintro{max-width:70ch;margin:0 0 16px}
.libfilters{display:flex;flex-wrap:wrap;gap:9px;padding:14px;border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-plate-a) 0%,var(--nk-inner-bg) 60%,var(--nk-plate-b) 100%);
  box-shadow:var(--nk-up-xs);margin-bottom:14px}
.libfilters .field{width:auto;height:40px;font-size:14px;font-family:var(--nk-font-display);font-weight:500}
.libfilters #libQ{flex:1 1 220px;min-width:180px}
.libcount{font-family:var(--nk-font-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--nk-dim);margin:0 0 12px 2px}
.libgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(272px,1fr));gap:16px;align-items:start}
.libcard{display:flex;flex-direction:column;gap:9px;padding:18px 18px 16px;border-radius:var(--nk-r-card);
  background:linear-gradient(180deg,var(--nk-card-a) 0%,var(--nk-surface) 55%,var(--nk-card-b) 100%);
  box-shadow:var(--nk-up);animation:nkChipIn .34s cubic-bezier(.16,1,.3,1) both}
.libtop{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.libname{font-family:var(--nk-font-display);font-weight:700;font-size:19px;letter-spacing:-.01em;color:var(--nk-text)}
.libkind{flex:0 0 auto;font-family:var(--nk-font-mono);font-size:9.5px;letter-spacing:.08em;
  text-transform:uppercase;padding:4px 8px;border-radius:8px;white-space:nowrap}
.libkind.req{color:#17805C;background:rgba(23,128,92,.10)}
.libkind.elect{color:#8A5A0F;background:rgba(138,90,15,.12)}
.libparts{font-size:13.5px;line-height:1.5;color:var(--nk-muted)}
.libmeta{font-family:var(--nk-font-mono);font-size:10.5px;line-height:1.5;color:var(--nk-teal)}
.libfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:4px}
.libby{font-family:var(--nk-font-mono);font-size:10.5px;color:var(--nk-dim);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:560px){
  .libfilters .field{flex:1 1 140px}
  .libgrid{grid-template-columns:1fr}
}

/* ---- формула оценки в карточке библиотеки ---- */
.libformbtn{align-self:flex-start;border:0;cursor:pointer;padding:7px 12px;border-radius:10px;
  font-family:var(--nk-font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--nk-teal);background:var(--nk-inner-bg);box-shadow:var(--nk-up-xs);
  transition:box-shadow var(--nk-ease),color var(--nk-ease)}
.libformbtn:hover{box-shadow:var(--nk-up-hover)}
.libformbtn.on{color:var(--nk-text);box-shadow:var(--nk-in-sm)}
.libform{display:flex;flex-direction:column;gap:7px;padding:12px 13px;border-radius:var(--nk-r-tile);
  background:var(--nk-surface-2);box-shadow:var(--nk-in-sm)}
.frow{display:grid;grid-template-columns:minmax(0,1fr) 68px 44px;gap:9px;align-items:center}
.fname{font-size:13px;color:var(--nk-text);min-width:0}
.fsub{font-family:var(--nk-font-mono);font-size:9.5px;line-height:1.4;color:var(--nk-dim);margin-top:2px}
.fbar{height:7px;border-radius:5px;background:rgba(120,101,72,.16);overflow:hidden}
.fbar i{display:block;height:100%;border-radius:5px;background:var(--nk-grad-cta)}
.fw{font-family:var(--nk-font-mono);font-size:12px;font-weight:700;color:var(--nk-teal);text-align:right}
.frow.exam .fname{color:var(--nk-gold);font-weight:600}
.frow.exam .fbar i{background:linear-gradient(90deg,#C79A45,#8A5A0F)}
.frow.exam .fw{color:var(--nk-gold)}
.fwarn{font-family:var(--nk-font-mono);font-size:10px;line-height:1.4;color:#8E4B33;
  padding-top:4px;border-top:1px solid rgba(120,101,72,.16)}

/* ---- админка: редактор элементов шаблона ---- */
.blocksed{display:flex;flex-direction:column;gap:7px;margin:10px 0 6px}
.brow{display:grid;grid-template-columns:minmax(0,1fr) 84px auto minmax(0,1fr) auto;gap:8px;align-items:center}
.brow .wt{text-align:center}
.brow.exam .afield{border-color:rgba(245,182,66,.5)}
@media (max-width:720px){ .brow{grid-template-columns:1fr 78px auto auto} .brow .who{display:none} }

/* ============================================================
   Страница календаря
   ============================================================ */
.calwrap{max-width:820px;margin:0 auto;padding:22px 18px 80px}
.calhead2{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.calmonth{flex:1;border:0;cursor:pointer;padding:12px 18px;border-radius:var(--nk-r-pill);
  font-family:var(--nk-font-display);font-weight:700;font-size:19px;letter-spacing:-.01em;color:var(--nk-text);
  background:linear-gradient(180deg,var(--nk-btn-a),var(--nk-btn-b));box-shadow:var(--nk-up-sm)}
.calnav{border:0;cursor:pointer;width:44px;height:44px;border-radius:50%;flex:0 0 auto;
  font-size:22px;line-height:1;color:var(--nk-teal);
  background:linear-gradient(180deg,var(--nk-btn-a),var(--nk-btn-b));box-shadow:var(--nk-up-sm)}
.calnav:hover{box-shadow:var(--nk-up-hover)}
.calnav{transition:box-shadow var(--nk-ease),transform var(--nk-ease)}
.calnav:active{transform:translateY(1px) scale(.94);box-shadow:var(--nk-in-sm)!important}
.calmonth{transition:box-shadow var(--nk-ease),transform var(--nk-ease)}
.calmonth:active,.calmonth.open{box-shadow:var(--nk-in-sm)}
.calhead2{position:relative}
/* окошко выбора месяца */
.calpick{position:absolute;top:calc(100% + 8px);left:54px;right:54px;z-index:30;padding:12px;border-radius:var(--nk-r-card);
  background:linear-gradient(180deg,var(--nk-card-a),var(--nk-card-b));box-shadow:var(--nk-up);
  animation:nkSelIn .2s cubic-bezier(.16,1,.3,1) both}
.cp-year{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:10px;
  font-family:var(--nk-font-display);font-weight:700;font-size:18px;color:var(--nk-text)}
.calnav.sm{width:34px;height:34px;font-size:18px}
.cp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.cp-m{border:0;cursor:pointer;padding:11px 6px;border-radius:12px;font-family:var(--nk-font-display);font-weight:600;font-size:14px;
  color:var(--nk-muted);background:var(--nk-surface-2);box-shadow:var(--nk-in-sm);
  transition:background var(--nk-ease),color var(--nk-ease),box-shadow var(--nk-ease),transform var(--nk-ease)}
.cp-m:hover{color:var(--nk-text)}
.cp-m.now{color:var(--nk-teal)}
.cp-m.on{background:linear-gradient(180deg,var(--nk-btn-a),var(--nk-btn-b));color:var(--nk-text);box-shadow:var(--nk-up-sm)}
.cp-m:active{transform:translateY(1px);box-shadow:var(--nk-in-sm)!important}
@media (max-width:640px){ .calpick{left:0;right:0} }

.calgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;
  padding:14px;border-radius:var(--nk-r-card);
  background:linear-gradient(180deg,var(--nk-card-a) 0%,var(--nk-surface) 55%,var(--nk-card-b) 100%);
  box-shadow:var(--nk-up);margin-bottom:16px}
.calwd{font-family:var(--nk-font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--nk-dim);text-align:center;padding-bottom:4px}
.calcell{position:relative;min-height:52px;border-radius:14px;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  background:linear-gradient(180deg,var(--nk-plate-a),var(--nk-plate-b));box-shadow:var(--nk-up-xs);
  transition:box-shadow var(--nk-ease),transform var(--nk-ease)}
.calcell.empty{background:none;box-shadow:none;cursor:default;min-height:0}
.calcell:not(.empty):hover{box-shadow:var(--nk-up-hover)}
.calcell:not(.empty):active{box-shadow:var(--nk-in-sm);transform:scale(.96)}
.calcell .cald{font-family:var(--nk-font-mono);font-size:15px;font-weight:700;color:var(--nk-text)}
.calcell.wknd .cald{color:var(--nk-muted)}
.calcell.today{box-shadow:var(--nk-up-xs),inset 0 0 0 2px var(--nk-teal)}
.calcell.sel{background:var(--nk-grad-cta);box-shadow:var(--nk-glow-brand)}
.calcell.sel .cald{color:var(--nk-on-dark)}
.caldots{display:flex;gap:3px}
.caldot{width:6px;height:6px;border-radius:50%;display:block}
.caldot.big{width:10px;height:10px;flex:0 0 auto}

.calagenda{padding:16px 18px;border-radius:var(--nk-r-card);
  background:linear-gradient(180deg,var(--nk-card-a) 0%,var(--nk-surface) 55%,var(--nk-card-b) 100%);
  box-shadow:var(--nk-up);margin-bottom:16px}
.calagenda-h{font-family:var(--nk-font-display);font-weight:700;font-size:17px;color:var(--nk-text);margin-bottom:12px}
.calitem{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-plate-a),var(--nk-plate-b));box-shadow:var(--nk-up-xs);margin-bottom:8px}
.calitem-mid{flex:1;min-width:0}
.calitem-nm{font-family:var(--nk-font-display);font-weight:600;font-size:15px;color:var(--nk-text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calitem-sub{font-family:var(--nk-font-mono);font-size:10.5px;color:var(--nk-dim);margin-top:2px}
.caladd{padding:16px 18px;border-radius:var(--nk-r-card);
  background:linear-gradient(180deg,var(--nk-card-a) 0%,var(--nk-surface) 55%,var(--nk-card-b) 100%);box-shadow:var(--nk-up)}
.caladd-h{font-family:var(--nk-font-display);font-weight:700;font-size:17px;color:var(--nk-text);margin-bottom:10px}
.caladd .dlform{margin-bottom:0}
@media (max-width:560px){
  .calgrid{gap:5px;padding:10px}
  .calcell{min-height:44px;border-radius:11px}
  .calcell .cald{font-size:13.5px}
  .calmonth{font-size:16px;padding:10px 12px}
  .calnav{width:38px;height:38px}
}
/* точки видны и на выбранном дне */
.calcell.sel .caldot{box-shadow:0 0 0 1.5px rgba(247,243,234,.75)}

/* ---- шапка: одна строка + меню «ещё» ---- */
.hbar{flex-wrap:nowrap!important;overflow:visible}
.hbar-actions{display:flex;align-items:center;gap:6px;flex:0 1 auto;min-width:0;flex-wrap:nowrap}
.hbar-more{flex:0 0 auto}
.hbar-menu{position:absolute;top:calc(100% - 4px);right:14px;z-index:40;
  display:none;flex-direction:column;gap:6px;padding:10px;min-width:210px;
  border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-card-a) 0%,var(--nk-surface) 55%,var(--nk-card-b) 100%);
  box-shadow:var(--nk-up)}
.hbar-menu.open{display:flex;animation:nkChipIn .22s cubic-bezier(.16,1,.3,1) both}
.hbar-menu .btn{width:100%;justify-content:flex-start;border-radius:12px}
.hbar-menu .btn .lbl{display:inline!important}       /* в меню подписи всегда видны */
.hbar-menu .btn.icononly{padding:9px 14px;display:inline-flex;gap:9px}
.hbar-menu .btn.icononly::after{content:attr(title);font-family:var(--nk-font-display);
  font-weight:600;font-size:14px}
header.app{position:sticky;overflow:visible}
header.app .hbar{position:relative}
@media (max-width:900px){
  .hbar .btn.hasicon .lbl{display:none}              /* сначала прячем подписи */
  .hbar .btn.hasicon{gap:0;padding:7px 10px}
  .hbar-menu .btn.hasicon .lbl{display:inline!important}
  .hbar-menu .btn.hasicon{gap:9px;padding:9px 14px}
}

/* ============================================================
   ТЁМНАЯ ТЕМА
   Тот же песочный характер, но в тёмном: ground не чёрный, а
   тёплый угольный, поверхности теплее фона, лунки — глубже него.
   Переопределяем только токены: правила остаются общими.
   ============================================================ */
html[data-theme="dark"]{
  --nk-ink:#191713;
  --nk-bg:linear-gradient(180deg,#1E1B17 0%,#191713 44%,#131110 100%);
  --nk-surface:#242019;
  --nk-surface-2:#151310;                       /* лунка глубже фона */
  --nk-inner-bg:#2B2620;
  --nk-hairline:rgba(255,244,224,.10);

  --nk-card-a:#2A251D;  --nk-card-b:#1F1B16;
  --nk-plate-a:#312B23; --nk-plate-b:#252019;
  --nk-btn-a:#2F2921;   --nk-btn-b:#242019;
  --nk-btn-ha:#3A332A;  --nk-btn-hb:#2C2620;
  --nk-well-focus:#1B1815;
  --nk-head-bg:rgba(20,18,15,.86);
  --nk-scrim:rgba(8,6,4,.62);

  --nk-text:#EFE9DC; --nk-muted:#A79E8D; --nk-dim:#847B6C;
  --nk-teal:#5FB9AC; --nk-indigo:#5FB9AC; --nk-violet:#7FD3C6; --nk-violet-300:#5FB9AC;
  --nk-emerald:#4FA89C; --nk-green:#6FC49A; --nk-gold:#E2A94F;
  --nk-warm:#332B1E; --nk-warm-well:#241E14;

  --nk-grad-cta:linear-gradient(152deg,#2C7A72 0%,#17514C 100%);
  --nk-grad-progress:linear-gradient(90deg,#4FA89C 0%,#8FC6A4 100%);

  /* Свет по-прежнему сверху-слева, но блик еле заметный, а тени глубже. */
  --nk-up:0 1px 0 rgba(0,0,0,.55),
    2px 3px 4px rgba(0,0,0,.42),
    4px 6px 10px rgba(0,0,0,.34),
    9px 12px 20px rgba(0,0,0,.30),
    16px 22px 38px rgba(0,0,0,.34),
    -4px -4px 9px rgba(255,244,224,.045),
    inset 0 1px 0 rgba(255,244,224,.07);
  --nk-up-sm:0 0 0 1px rgba(0,0,0,.35),
    0 1px 0 rgba(0,0,0,.45),
    1px 2px 3px rgba(0,0,0,.36),
    3px 4px 8px rgba(0,0,0,.30),
    -2px -2px 6px rgba(255,244,224,.04),
    inset 0 1px 0 rgba(255,244,224,.06);
  --nk-up-xs:0 0 0 1px rgba(0,0,0,.30),
    0 1px 0 rgba(0,0,0,.40),
    1px 2px 3px rgba(0,0,0,.30),
    3px 4px 7px rgba(0,0,0,.24),
    6px 8px 14px rgba(0,0,0,.22),
    -2px -2px 6px rgba(255,244,224,.035),
    inset 0 1px 0 rgba(255,244,224,.055);
  --nk-up-hover:0 1px 0 rgba(0,0,0,.5),
    2px 3px 5px rgba(0,0,0,.4),
    5px 7px 13px rgba(0,0,0,.34),
    11px 15px 26px rgba(0,0,0,.32),
    -3px -3px 8px rgba(255,244,224,.06),
    inset 0 1px 0 rgba(255,244,224,.08);
  --nk-in:inset 0 1px 1px rgba(0,0,0,.62), inset 0 3px 6px rgba(0,0,0,.5),
    inset 0 -1px 0 rgba(255,244,224,.055);
  --nk-in-sm:inset 0 1px 1px rgba(0,0,0,.5), inset 0 2px 5px rgba(0,0,0,.4),
    inset 0 -1px 0 rgba(255,244,224,.05);
  --nk-in-warm:inset 0 1px 1px rgba(0,0,0,.55), inset 0 3px 6px rgba(0,0,0,.45),
    inset 0 -1px 0 rgba(226,169,79,.14);
  --nk-shadow-card:var(--nk-up);
  --nk-glow-brand:inset 0 1px 0 rgba(219,238,231,.16), 4px 6px 14px rgba(0,0,0,.5);
  --nk-focus:inset 0 0 0 2px #5FB9AC, inset 0 2px 5px rgba(0,0,0,.45);

  /* Чип ника был зашит светлым — на тёмном выходил белый кружок с белым ником. */
  --nk-chip-bg:#2C2720;
  --nk-chip-hover:#37312A;
  /* Полупрозрачные кнопки (три точки, импорт, экспорт, подсказка, настройки)
     тоже были зашиты светлым и оставались серыми пятнами на тёмном. */
  --nk-ghost-bg:linear-gradient(180deg,rgba(255,244,224,.07) 0%,rgba(255,244,224,.035) 100%);
  --nk-danger:#E88B6B;
  /* Золото даты экзамена на тёмном тёплом фоне тонуло — поднял светлоту. */
  --nk-gold:#F0BC63;
}

/* Поднос итога на тёмном не может быть «единственным тёмным местом» —
   поэтому он становится самым насыщенным и получает мягкое свечение. */
html[data-theme="dark"] .result{
  background:linear-gradient(158deg,#2A6F6B 0%,#17494C 54%,#0E3336 100%);
  /* свечение сжато до аккуратного ореола: широкое подсвечивало плитку вокруг */
  box-shadow:0 0 0 1px rgba(120,200,190,.16), inset 0 1px 0 rgba(219,238,231,.18),
    inset 0 -24px 40px rgba(4,20,22,.5), 0 10px 26px rgba(0,0,0,.5),
    0 0 14px rgba(47,150,140,.10);
}
html[data-theme="dark"] .exbox{background:var(--nk-warm-well)}
html[data-theme="dark"] .examdate{background:#3A3122}
html[data-theme="dark"] .examdate .ed-when b{color:#FFD9A0}
html[data-theme="dark"] .examdate .ed-days{color:#C9B48C}
html[data-theme="dark"] .btn.ghost{box-shadow:0 0 0 1px rgba(255,244,224,.09),
  0 1px 2px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,244,224,.06)}
html[data-theme="dark"] .btn.ghost:hover{background:linear-gradient(180deg,var(--nk-btn-ha),var(--nk-btn-hb));
  box-shadow:var(--nk-up-sm)}
html[data-theme="dark"] .btn.danger,html[data-theme="dark"] .iconbtn{color:var(--nk-danger)}
html[data-theme="dark"] .btn.danger:hover,html[data-theme="dark"] .iconbtn:hover{color:#FFB199}
html[data-theme="dark"] .status,html[data-theme="dark"] .who .tgdot{color:var(--nk-dim)}
html[data-theme="dark"] .caltime{color:var(--nk-gold)}
html[data-theme="dark"] .row .nm.exam{color:var(--nk-gold)}
html[data-theme="dark"] .libkind.req{color:#7FD3B4;background:rgba(79,168,156,.16)}
html[data-theme="dark"] .libkind.elect{color:var(--nk-gold);background:rgba(226,169,79,.16)}
html[data-theme="dark"] .fwarn,html[data-theme="dark"] .err{color:#FF9B8A}
html[data-theme="dark"] .btn.danger,html[data-theme="dark"] .iconbtn{color:#FF9B8A}
html[data-theme="dark"] .ava{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 2px 6px rgba(0,0,0,.5)}
html[data-theme="dark"] .brand img,html[data-theme="dark"] .panel .mark{filter:none}

/* переключатель темы в настройках */
.themesw{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:5px;
  border-radius:var(--nk-r-tile);background:var(--nk-surface-2);box-shadow:var(--nk-in-sm)}
.themesw button{border:0;cursor:pointer;padding:11px 6px;border-radius:12px;background:transparent;
  font-family:var(--nk-font-display);font-weight:600;font-size:13.5px;color:var(--nk-muted);
  display:flex;align-items:center;justify-content:center;gap:7px;
  transition:background var(--nk-ease),color var(--nk-ease),box-shadow var(--nk-ease)}
.themesw button.on{background:linear-gradient(180deg,var(--nk-btn-a),var(--nk-btn-b));
  color:var(--nk-text);box-shadow:var(--nk-up-sm)}
.themesw button:active{box-shadow:var(--nk-in-sm)!important;transform:translateY(1px)}
.themesw svg{display:block;flex:0 0 auto}
.themesw.two{grid-template-columns:repeat(2,minmax(0,1fr))}

/* ---- анимация смены темы: круговое раскрытие ---- */
/* Старый слой стоит на месте, новый обрезается растущим кругом поверх него. */
::view-transition-old(root){animation:none;z-index:1}
::view-transition-new(root){animation:none;z-index:2}
::view-transition-image-pair(root){isolation:none}

.theme-ring{position:fixed;transform:translate(-50%,-50%);border-radius:50%;
  pointer-events:none;z-index:9998;
  border:2px solid var(--nk-teal);
  box-shadow:0 0 26px rgba(95,185,172,.45), inset 0 0 26px rgba(95,185,172,.28)}
.theme-orb{position:fixed;pointer-events:none;z-index:9999;color:var(--nk-teal);
  display:grid;place-items:center;width:40px;height:40px;border-radius:50%;
  background:var(--nk-surface);box-shadow:var(--nk-up-sm)}
@media (prefers-reduced-motion:reduce){
  .theme-ring,.theme-orb{display:none}
}

/* ============================================================
   Поднос итога: свечение и пружина при смене оценки
   ============================================================ */
/* Свечение вернулось: раньше «растекалось» не оно, а декоративный блик,
   который торчал за границы. Теперь ореол ровный по всему периметру. */
.result{transform-origin:50% 42%}
html[data-theme="dark"] .result{
  box-shadow:0 0 0 1px rgba(120,200,190,.18), inset 0 1px 0 rgba(219,238,231,.18),
    inset 0 -24px 40px rgba(4,20,22,.5), 0 10px 26px rgba(0,0,0,.5),
    0 0 18px rgba(47,150,140,.22), 0 0 46px rgba(47,150,140,.20);
}

/* Пружина: поднос коротко подскакивает, когда накоп пересчитался. */
@keyframes nkTrayPop{
  0%{transform:scale(1) translateY(0)}
  34%{transform:scale(1.016) translateY(-3px)}
  68%{transform:scale(.997) translateY(0)}
  100%{transform:scale(1) translateY(0)}
}
.result.bump{animation:nkTrayPop .52s cubic-bezier(.34,1.35,.4,1)}

/* В тёмной вместе с прыжком коротко разгорается ореол. */
@keyframes nkTrayFlare{
  0%{box-shadow:0 0 0 1px rgba(120,200,190,.18), inset 0 1px 0 rgba(219,238,231,.18),
     inset 0 -24px 40px rgba(4,20,22,.5), 0 10px 26px rgba(0,0,0,.5),
     0 0 18px rgba(47,150,140,.22), 0 0 46px rgba(47,150,140,.20)}
  38%{box-shadow:0 0 0 1px rgba(150,220,208,.34), inset 0 1px 0 rgba(219,238,231,.26),
     inset 0 -24px 40px rgba(4,20,22,.5), 0 12px 30px rgba(0,0,0,.5),
     0 0 26px rgba(47,150,140,.42), 0 0 74px rgba(47,150,140,.38)}
  100%{box-shadow:0 0 0 1px rgba(120,200,190,.18), inset 0 1px 0 rgba(219,238,231,.18),
     inset 0 -24px 40px rgba(4,20,22,.5), 0 10px 26px rgba(0,0,0,.5),
     0 0 18px rgba(47,150,140,.22), 0 0 46px rgba(47,150,140,.20)}
}
html[data-theme="dark"] .result.bump{
  animation:nkTrayPop .52s cubic-bezier(.34,1.35,.4,1), nkTrayFlare .62s var(--nk-out);
}
/* В светлой ореол мягче — на песочном фоне яркий выглядел бы грязью. */
.result{box-shadow:var(--nk-tray-sh), 0 0 22px rgba(20,89,92,.16)}

@media (prefers-reduced-motion:reduce){
  .result.bump{animation:none!important}
}

/* ---- перестановка элементов контроля внутри плитки ---- */
.ord{display:flex;flex-direction:column;gap:2px;flex:0 0 auto}
.ordb{width:24px;height:16px;border:0;cursor:pointer;padding:0;border-radius:6px;
  font-size:11px;line-height:1;color:var(--nk-muted);
  background:linear-gradient(180deg,var(--nk-btn-a),var(--nk-btn-b));
  box-shadow:var(--nk-up-sm);
  transition:box-shadow var(--nk-ease),color var(--nk-ease),transform var(--nk-ease)}
.ordb:hover:not(:disabled){color:var(--nk-teal);box-shadow:var(--nk-up-hover)}
.ordb:active:not(:disabled){box-shadow:var(--nk-in-sm)!important;transform:translateY(1px)}
.ordb:disabled{opacity:.32;cursor:default;box-shadow:none;background:transparent}
.group .ghead .ord{margin-left:2px}

/* ---- архив предметов: те же плитки, что на главной, только чтение ---- */
.archwrap{max-width:1800px;margin:0 auto;padding:18px 18px 70px}   /* как .wrap — иначе плитки уже, чем на главной */
.archintro{max-width:70ch;margin:0 0 14px}
#archList > .sethint{grid-column:1/-1;justify-self:start}   /* пустое состояние — не в одну колонку по центру */
.card.readonly{animation:none!important;cursor:default}
/* UA-стили :disabled (особенно iOS: text-fill-color + прозрачность) не должны глушить оценки */
.card.readonly .input:disabled{opacity:1;color:var(--nk-text);-webkit-text-fill-color:var(--nk-text);cursor:default}
.card.readonly .input.bare:disabled{color:var(--nk-gold);-webkit-text-fill-color:var(--nk-gold)}
.card.readonly .input:disabled::placeholder{color:var(--nk-dim);-webkit-text-fill-color:var(--nk-dim)}
.card.readonly .subject-title:disabled{color:var(--nk-text);-webkit-text-fill-color:var(--nk-text);opacity:1}
.card.readonly .exbox{cursor:default}
/* кнопки «Вернуть на главную» / «Удалить» — внизу плитки, под подносом */
.archacts{display:flex;gap:8px;flex-wrap:wrap}
.card.readonly .archacts{margin-top:0;padding-top:12px;border-top:1px solid var(--nk-hairline)}

/* ============================================================
   Библиотека: свои списки, ровные карточки, окно формулы
   ============================================================ */

/* ---- выпадающий список ---- */
.nksel{position:relative;display:inline-flex;flex:0 1 auto;min-width:0}
.nksel > select{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.nksel-btn{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;
  width:100%;height:40px;padding:0 12px;border:0;cursor:pointer;border-radius:var(--nk-r-input);
  font-family:var(--nk-font-display);font-weight:500;font-size:14px;color:var(--nk-text);
  background:linear-gradient(180deg,var(--nk-btn-a),var(--nk-btn-b));box-shadow:var(--nk-up-sm);
  transition:box-shadow var(--nk-ease)}
.nksel-btn:hover{box-shadow:var(--nk-up-hover)}
.nksel-val{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nksel-ch{flex:0 0 auto;color:var(--nk-muted);transition:transform .24s cubic-bezier(.34,1.25,.4,1)}
.nksel.open .nksel-btn{box-shadow:var(--nk-in-sm)}
.nksel.open .nksel-ch{transform:rotate(180deg);color:var(--nk-teal)}
.nksel-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:100%;max-height:270px;overflow:auto;
  z-index:60;display:none;flex-direction:column;gap:3px;padding:6px;border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-card-a) 0%,var(--nk-surface) 55%,var(--nk-card-b) 100%);
  box-shadow:var(--nk-up)}
.nksel.open .nksel-menu{display:flex;animation:nkSelIn .2s cubic-bezier(.16,1,.3,1) both}
@keyframes nkSelIn{from{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}
.nksel-opt{text-align:left;border:0;cursor:pointer;padding:9px 11px;border-radius:10px;white-space:nowrap;
  font-family:var(--nk-font-display);font-weight:500;font-size:14px;color:var(--nk-text);
  background:transparent;transition:background var(--nk-ease),color var(--nk-ease)}
.nksel-opt:hover{background:var(--nk-inner-bg)}
.nksel-opt.on{background:var(--nk-grad-cta);color:var(--nk-on-dark)}
.libfilters .nksel{flex:1 1 150px}
.libfilters .nksel-btn{min-width:0}

/* ---- карточки одной высоты, метка не вылезает ---- */
.libgrid{align-items:stretch}
.libcard{height:100%}
.libtop{display:block;gap:0}
.libtop::after{content:'';display:block;clear:both}
.libname{min-width:0;overflow-wrap:break-word;word-break:normal;hyphens:manual;font-size:18px;line-height:1.22}
.libkind{float:right;margin:1px 0 4px 10px}

/* ---- метки вместо длинной строки ---- */
.libmeta{display:flex;flex-wrap:wrap;gap:6px;color:inherit;font-family:inherit;font-size:inherit}
.lm{font-family:var(--nk-font-mono);font-size:10.5px;letter-spacing:.02em;padding:5px 9px;border-radius:9px;
  background:var(--nk-inner-bg);box-shadow:var(--nk-up-xs);color:var(--nk-muted);white-space:nowrap;
  max-width:100%;overflow:hidden;text-overflow:ellipsis}
.lm.prog{color:var(--nk-text)}
.lm.course{color:var(--nk-teal)}
.lm.mod{color:var(--nk-teal)}
.lm.stream{color:var(--nk-gold)}
.lm.year{color:var(--nk-dim)}
.libfoot{flex-wrap:wrap;gap:8px}
.libacts{display:flex;gap:7px;margin-left:auto}

/* ---- окно формулы ---- */
.fmpanel{max-width:440px}
#fmBody{margin-top:4px}


/* ============================================================
   Строка прогноза/итога и золотой акцент закрытого курса
   ============================================================ */
/* Раньше подпись, число и пояснение стояли в одну строку: между «ПРОГНОЗ» и
   числом зияла дыра от min-width у .fin-v, а пояснение сваливалось третьей
   строкой. Теперь микро-подпись сверху (как у «НУЖНО НА ЭКЗАМЕНЕ»), числа — под ней. */
.fin{flex-direction:column;align-items:flex-start;gap:7px}
.fin-num{display:flex;align-items:baseline;gap:12px}
.result .fin .fin-label{font-size:10px;letter-spacing:.16em}
/* Итог — главное число строки, поэтому он крупнее сырого балла слева от стрелки. */
.result .fin .fin-v{min-width:0;text-align:left;font-size:25px;opacity:.9}
.result .fin .fin-of{display:inline-flex;align-items:baseline;gap:11px}
/* Стрелка мелкая и потому садилась на базовую линию заметно ниже цифр:
   выключаем её из baseline-выравнивания и центруем по высоте плашки. */
.result .fin .fin-arrow{align-self:center;color:var(--nk-tray-mute);font-size:17px;
  line-height:1;text-shadow:none;letter-spacing:0}
/* Паддинг симметричный: снизу было на 2px больше, и плашка казалась просевшей. */
.result .fin-of .grade{font-size:34px;line-height:1.08;padding:7px 15px;border-radius:14px;
  background:rgba(6,26,28,.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.fin.risk .fin-arrow,.fin.fail .fin-arrow{opacity:.7}

/* Оценка за экзамен проставлена — курс закрыт. Зелёный акцент «идёт по курсу»
   сменяется золотым «результат зафиксирован»: ореол, полоса и блик. */
.result.done{box-shadow:var(--nk-tray-sh), 0 0 22px rgba(196,138,42,.20)}
.result.done::before{background:radial-gradient(120% 95% at 88% -12%,
  rgba(239,192,106,.22), rgba(239,192,106,0) 62%)}
.result.done .progress>i{background:linear-gradient(90deg,#C79A45,#EFC06A);
  box-shadow:0 0 12px rgba(239,192,106,.5)}
.result.done .fin-of .grade{background:rgba(58,40,12,.5)}
html[data-theme="dark"] .result.done{
  box-shadow:0 0 0 1px rgba(226,180,104,.20), inset 0 1px 0 rgba(255,232,190,.16),
    inset 0 -24px 40px rgba(4,20,22,.5), 0 10px 26px rgba(0,0,0,.5),
    0 0 18px rgba(198,150,66,.24), 0 0 46px rgba(198,150,66,.20);
}
@keyframes nkTrayFlareGold{
  0%{box-shadow:0 0 0 1px rgba(226,180,104,.20), inset 0 1px 0 rgba(255,232,190,.16),
     inset 0 -24px 40px rgba(4,20,22,.5), 0 10px 26px rgba(0,0,0,.5),
     0 0 18px rgba(198,150,66,.24), 0 0 46px rgba(198,150,66,.20)}
  38%{box-shadow:0 0 0 1px rgba(240,200,130,.38), inset 0 1px 0 rgba(255,232,190,.24),
     inset 0 -24px 40px rgba(4,20,22,.5), 0 12px 30px rgba(0,0,0,.5),
     0 0 26px rgba(212,164,78,.46), 0 0 74px rgba(212,164,78,.40)}
  100%{box-shadow:0 0 0 1px rgba(226,180,104,.20), inset 0 1px 0 rgba(255,232,190,.16),
     inset 0 -24px 40px rgba(4,20,22,.5), 0 10px 26px rgba(0,0,0,.5),
     0 0 18px rgba(198,150,66,.24), 0 0 46px rgba(198,150,66,.20)}
}
html[data-theme="dark"] .result.done.bump{
  animation:nkTrayPop .52s cubic-bezier(.34,1.35,.4,1), nkTrayFlareGold .62s var(--nk-out);
}
@media (prefers-reduced-motion:reduce){
  html[data-theme="dark"] .result.done.bump{animation:none!important}
}


/* ============================================================
   Календарь: «Ближайшие дедлайны» под повесткой дня
   ============================================================ */
.calupcoming{margin-top:16px;padding-top:14px;border-top:1px dashed var(--nk-hairline)}
.calup-h{font-family:var(--nk-font-mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--nk-muted);margin-bottom:10px}
.calup-date{display:flex;align-items:baseline;gap:10px;margin:12px 2px 6px;
  font-family:var(--nk-font-display);font-size:14px;color:var(--nk-text)}
.calup-date b{font-weight:700}
.calup-date span{font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-muted)}
.calupcoming .calitem+.calitem{margin-top:6px}
/* обёртки-списки в форме добавления: те же размеры, что у нативных полей */
.dlform .nksel{flex:0 1 auto;min-width:150px}
.dlf-times{display:inline-flex;align-items:center;gap:8px}
.dlform .nksel .nksel-btn{height:40px;font-size:14px;width:100%;min-width:0}
@media (max-width:640px){ .dlform .nksel{flex:1 1 140px;min-width:0} }


/* ============================================================
   Множественный выбор в модалке «В общие»: чипы-переключатели
   ============================================================ */
.multi{display:flex;flex-wrap:wrap;gap:8px;padding:6px 0 2px}
.mchip{border:0;cursor:pointer;padding:8px 13px;border-radius:12px;
  font-family:var(--nk-font-display);font-weight:600;font-size:13.5px;color:var(--nk-muted);
  background:var(--nk-surface-2);box-shadow:var(--nk-in-sm);
  transition:background var(--nk-ease),color var(--nk-ease),box-shadow var(--nk-ease),transform var(--nk-ease)}
.mchip:hover{color:var(--nk-text)}
.mchip.on{background:linear-gradient(180deg,var(--nk-btn-a),var(--nk-btn-b));color:var(--nk-text);box-shadow:var(--nk-up-sm)}
.mchip:active{transform:translateY(1px);box-shadow:var(--nk-in-sm)!important}


/* ============================================================
   Соцсети: кнопки входа на главном экране и строки привязки в настройках
   ============================================================ */
.passline.masked{letter-spacing:3px;color:var(--nk-muted)}
.socialrow{display:flex;flex-direction:column;gap:8px;margin-top:2px}
.social-btn{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px}
.social-btn .ico{flex:0 0 auto}
.social{display:flex;flex-direction:column;gap:8px}
.socrow{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--nk-r-tile);
  background:linear-gradient(180deg,var(--nk-plate-a),var(--nk-plate-b));box-shadow:var(--nk-up-xs)}
.soc-ic{flex:0 0 auto;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  background:var(--nk-surface-2);box-shadow:var(--nk-in-sm);color:var(--nk-muted)}
.socrow.on .soc-ic{color:var(--nk-teal)}
.soc-mid{flex:1;min-width:0}
.soc-name{font-family:var(--nk-font-display);font-weight:700;font-size:15px;color:var(--nk-text)}
.soc-sub{font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-muted);margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.socrow.on .soc-sub{color:var(--nk-teal)}
.socrow .btn{flex:0 0 auto;white-space:nowrap}


/* ============================================================
   Календарь: строка дедлайна — крупно работа, предмет, дата и время
   ============================================================ */
.caladd{margin-bottom:16px}                       /* форма теперь не последняя — нужен отступ до повестки */
.calitem{align-items:center;gap:12px;padding:12px 14px}
.calitem-mid{flex:1;min-width:0}
.ci-type{font-family:var(--nk-font-display);font-weight:700;font-size:17px;line-height:1.2;letter-spacing:-.01em;color:var(--nk-text)}
.ci-subj{font-family:var(--nk-font-display);font-weight:600;font-size:14.5px;color:var(--nk-teal);margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ci-when{flex:0 0 auto;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.ci-date{font-family:var(--nk-font-display);font-weight:700;font-size:16px;color:var(--nk-text);white-space:nowrap}
.ci-time{font-family:var(--nk-font-mono);font-weight:700;font-size:15px;color:var(--nk-gold);white-space:nowrap}
.ci-time.none{font-weight:400;font-size:12px;color:var(--nk-muted)}
.ci-days{font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-muted)}
.ci-acts{flex:0 0 auto;display:flex;align-items:center;gap:6px}
.calup-h{font-family:var(--nk-font-display);font-size:17px;font-weight:700;letter-spacing:-.01em;text-transform:none;color:var(--nk-text);margin-bottom:12px}
.calup-date{font-size:15px}
.calup-date b{font-size:16px}
@media (max-width:560px){
  .calitem{flex-wrap:wrap}
  .ci-when{flex-direction:row;gap:8px;align-items:baseline;flex:1 0 100%;order:3;justify-content:flex-start;padding-left:24px}
  .ci-acts{order:4;margin-left:auto}
}
html[data-theme="dark"] .ci-time{color:#F0BC63}

/* ============================================================
   Перетаскивание элементов контроля внутри предмета
   ============================================================ */
.bgrip{flex:0 0 auto;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;
  font-size:14px;line-height:1;color:var(--nk-dim);padding:8px 2px;margin-left:-3px;border-radius:8px;text-align:center;
  transition:color var(--nk-ease),background var(--nk-ease)}
.bgrip:hover{color:var(--nk-muted);background:var(--nk-ghost-bg)}
.bgrip:active{cursor:grabbing}
.rows.sorting{cursor:grabbing}
.rows.sorting > *{transition:none}
.rows > .lifting{position:relative;z-index:3;transform:scale(1.02);box-shadow:var(--nk-up);opacity:.96;cursor:grabbing}
.rows > .row.lifting{border-radius:var(--nk-r-tile);background:linear-gradient(180deg,var(--nk-plate-a),var(--nk-plate-b))}


/* ============================================================
   Логотип: цвета буквы N по теме
   ============================================================ */
:root{--nk-logo-left:#8A5A0F;--nk-logo-diag-a:#4FA882;--nk-logo-diag-b:#17805C;
  --nk-logo-right-a:#2A6F70;--nk-logo-right-b:#123E41;--nk-logo-plate:#F1ECE2;--nk-logo-ring:rgba(120,101,72,.18)}
/* На тёмном охра и глубокая бирюза тонут — все три штриха на ступень светлее,
   плашка знака остаётся песочной, чтобы буква читалась как на аватарке. */
html[data-theme="dark"]{--nk-logo-left:#E2A94F;--nk-logo-diag-a:#8BDCB8;--nk-logo-diag-b:#3FA884;
  --nk-logo-right-a:#6CC4B8;--nk-logo-right-b:#2A6F70;--nk-logo-plate:#F1ECE2;--nk-logo-ring:rgba(0,0,0,.25)}
.panel .mark{border-radius:15px}
/* Знак на песочной плашке (аватарка, вход, чат) — буква всегда в «светлых» цветах:
   плашка не темнеет, значит и светлить штрихи не надо. */
.mark,.ch-mark{--nk-logo-left:#8A5A0F;--nk-logo-diag-a:#4FA882;--nk-logo-diag-b:#17805C;
  --nk-logo-right-a:#2A6F70;--nk-logo-right-b:#123E41}

/* поток в заголовке карточки библиотеки */
.libname .libstream{font-weight:600;font-size:14px;color:var(--nk-teal);letter-spacing:0;white-space:nowrap}

/* потоки по программам в модалке «В общие» и в админке */
.sgroup{margin-top:6px}
.sgroup-h{font-family:var(--nk-font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--nk-muted);margin:4px 0 2px}


/* ============================================================
   Импорт через ИИ: компактная сводка перед добавлением
   ============================================================ */
.bubble.apply.imp{max-width:100%;width:100%;align-self:stretch;cursor:default;white-space:normal;gap:8px}
.imp-sub{align-self:stretch;padding:9px 11px 8px;border-radius:12px;background:var(--nk-surface-2);box-shadow:var(--nk-in-sm)}
.imp-head{display:flex;align-items:baseline;gap:8px;margin-bottom:4px}
.imp-name{flex:1;min-width:0;font-family:var(--nk-font-display);font-weight:700;font-size:14.5px;color:var(--nk-text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.imp-sum{font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-muted)}
.imp-sum.bad{color:var(--nk-danger)}
.imp-rows{display:flex;flex-direction:column;gap:3px}
.imp-row{display:flex;align-items:baseline;gap:6px;font-size:12.5px;line-height:1.35;color:var(--nk-text);min-width:0}
.imp-bn{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}
.imp-row.exam .imp-bn{color:var(--nk-gold);font-weight:600}
.imp-row.grp .imp-bn{font-weight:600}
.imp-dots{flex:1 1 8px;min-width:8px;border-bottom:1px dotted var(--nk-hairline);transform:translateY(-3px)}
.imp-bw{flex:0 0 auto;font-family:var(--nk-font-mono);font-size:11.5px;color:var(--nk-muted);min-width:34px;text-align:right}
.imp-g{flex:0 0 auto;font-family:var(--nk-font-mono);font-size:12px;font-weight:700;color:var(--nk-teal);min-width:18px;text-align:right}
.imp-g.none{color:var(--nk-dim);font-weight:400}
.imp-g.cnt{font-weight:400;color:var(--nk-muted);font-size:11px}
.imp-items{display:flex;flex-wrap:wrap;gap:4px 6px;padding:1px 0 3px 12px}
.imp-it{display:inline-flex;align-items:baseline;gap:4px;font-family:var(--nk-font-mono);font-size:11px;padding:2px 7px;border-radius:7px;background:var(--nk-chip-bg)}
.imp-it .n{color:var(--nk-muted)}
.imp-it .v{font-weight:700;color:var(--nk-teal)}
.imp-it .v.none{font-weight:400;color:var(--nk-dim)}
.imp-empty{font-family:var(--nk-font-mono);font-size:11px;color:var(--nk-dim)}
.imp-acts{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:2px}
.imp-note{font-size:12px;color:var(--nk-muted)}
/* сам чат не должен растягивать ряд плиток: сообщения прокручиваются внутри */
.chattile{max-height:min(640px,86vh)}