:root{
  --bg:#EDF1EF; --surface:#fff; --surface-2:#F4F8F6; --surface-3:#EAF0EE;
  --ink:#0D1614; --ink-2:#485A55; --ink-3:#778883;
  --rule:#DBE4E1; --rule-2:#E9EFED;
  --accent:#0E6E62; --accent-2:#0A554C; --accent-soft:#DDEDE9; --accent-ink:#fff;
  --gold:#8A6212; --gold-soft:#F7EFDC;
  /* Цвет модулей: спокойный синий. Он не спорит с бирюзовым акцентом (акцент = «нажми»),
     не читается как предупреждение и одинаково разборчив на светлой и тёмной теме. */
  --module:#2B5D86; --module-soft:#E4EDF6; --module-line:#B9D2E8;
  /* Палитра модулей: шесть спокойных оттенков по кругу — соседние модули видно как разные блоки.
     Тройка на оттенок: текст / фон панели / рамка. */
  --m1:#2B5D86;--m1s:#E6EFF7;--m1l:#C2D7EA;  --m2:#1F6B54;--m2s:#E2F1EB;--m2l:#BFDFD2;
  --m3:#574A8C;--m3s:#ECEAF7;--m3l:#D0CAE8;  --m4:#8A5A1E;--m4s:#F7EEE0;--m4l:#E8D6BB;
  --m5:#8C3D5E;--m5s:#F8E9EF;--m5l:#EAC8D5;  --m6:#1E5F70;--m6s:#E1F0F3;--m6l:#BBDBE2;
  --danger:#A62A21; --danger-soft:#FAE6E3;
  --warn:#8A6212; --warn-soft:#F7EFDC;
  --ok:#186A49; --ok-soft:#DFEFE6;
  --s1:#2a78d6; --s2:#eb6834; --s3:#1baf7a; --s4:#eda100; --s5:#e87ba4; --s6:#008300; --s7:#4a3aa7; --s8:#0b8c9b;
  --shadow:0 1px 2px rgba(13,22,20,.06),0 10px 30px -14px rgba(13,22,20,.25);
  --ui:"Golos Text",ui-sans-serif,system-ui,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Noto Sans Mono","DejaVu Sans Mono","Liberation Mono",monospace;
  --nav:240px;
}
/* Тёмная тема описана ДВАЖДЫ: для системной настройки и для кнопки переключения.
   Правите один список — правьте и второй, иначе половина цветов останется светлой. */
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#09110F;--surface:#121B18;--surface-2:#18231F;--surface-3:#1E2B26;
  --ink:#E2EAE7;--ink-2:#9FB1AB;--ink-3:#6F817C;--rule:#24322D;--rule-2:#1B2622;
  --accent:#4FC3B1;--accent-2:#7FDCCC;--accent-soft:#10302B;--accent-ink:#06201C;
  --module:#8FBEE8;--module-soft:#152634;--module-line:#254B6B;
  --m1:#8FBEE8;--m1s:#152634;--m1l:#254B6B;  --m2:#74C8AC;--m2s:#11251E;--m2l:#1F4537;
  --m3:#B0A4E6;--m3s:#1C1A2C;--m3l:#332D4F;  --m4:#DEAF74;--m4s:#291F15;--m4l:#493722;
  --m5:#E29EB6;--m5s:#2A1920;--m5l:#4A2D38;  --m6:#83C3D6;--m6s:#12242A;--m6l:#223F47;
  --gold:#D6AC59;--gold-soft:#2B2411;--danger:#F08A80;--danger-soft:#331815;
  --warn:#D6AC59;--warn-soft:#2B2411;--ok:#5FC494;--ok-soft:#122A20;
  --s1:#3987e5;--s2:#d95926;--s3:#199e70;--s4:#c98500;--s5:#d55181;--s6:#008300;--s7:#9085e9;--s8:#2aa7b8;
  --shadow:0 1px 2px rgba(0,0,0,.5),0 10px 30px -14px rgba(0,0,0,.7);
}}
:root[data-theme=dark]{
  --bg:#09110F;--surface:#121B18;--surface-2:#18231F;--surface-3:#1E2B26;
  --ink:#E2EAE7;--ink-2:#9FB1AB;--ink-3:#6F817C;--rule:#24322D;--rule-2:#1B2622;
  --accent:#4FC3B1;--accent-2:#7FDCCC;--accent-soft:#10302B;--accent-ink:#06201C;
  --module:#8FBEE8;--module-soft:#152634;--module-line:#254B6B;
  --m1:#8FBEE8;--m1s:#152634;--m1l:#254B6B;  --m2:#74C8AC;--m2s:#11251E;--m2l:#1F4537;
  --m3:#B0A4E6;--m3s:#1C1A2C;--m3l:#332D4F;  --m4:#DEAF74;--m4s:#291F15;--m4l:#493722;
  --m5:#E29EB6;--m5s:#2A1920;--m5l:#4A2D38;  --m6:#83C3D6;--m6s:#12242A;--m6l:#223F47;
  --gold:#D6AC59;--gold-soft:#2B2411;--danger:#F08A80;--danger-soft:#331815;
  --warn:#D6AC59;--warn-soft:#2B2411;--ok:#5FC494;--ok-soft:#122A20;
  --s1:#3987e5;--s2:#d95926;--s3:#199e70;--s4:#c98500;--s5:#d55181;--s6:#008300;--s7:#9085e9;--s8:#2aa7b8;
  --shadow:0 1px 2px rgba(0,0,0,.5),0 10px 30px -14px rgba(0,0,0,.7);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--ui);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--accent);text-underline-offset:2px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.mono,.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.mini{font-size:11.5px;color:var(--ink-3)}
.spacer{flex:1}
.hr{height:1px;background:var(--rule-2);margin:12px 0}
.hidden{display:none!important}

/* ── публичные страницы ── */
.pub{min-height:100vh;display:flex;flex-direction:column}
.pubtop{display:flex;align-items:center;gap:14px;padding:16px 22px;border-bottom:1px solid var(--rule);background:var(--surface);flex-wrap:wrap}
@media (max-width:420px){
  .pubtop{gap:8px;padding:12px 14px}
  .pubtop .mini{display:none}
}
.pubwrap{flex:1;display:flex;align-items:center;justify-content:center;padding:34px 18px}
.panel{width:min(460px,100%);background:var(--surface);border:1px solid var(--rule);border-radius:16px;box-shadow:var(--shadow);padding:26px}
.panel.wide{width:min(620px,100%)}
.panel h1{margin:0 0 6px;font-size:22px;letter-spacing:-.02em}
.panel p.sub{margin:0 0 20px;color:var(--ink-3);font-size:13.5px}
.hero{max-width:920px;margin:0 auto;padding:46px 20px 10px;text-align:center}
.hero h1{font-size:clamp(26px,4.4vw,40px);line-height:1.12;letter-spacing:-.03em;margin:0 0 14px;text-wrap:balance}
.hero p{font-size:16px;color:var(--ink-2);max-width:60ch;margin:0 auto 22px}
.herocta{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;max-width:960px;margin:34px auto;padding:0 20px}
.feat .card{padding:18px}
.feat b{display:block;font-size:15px;margin-bottom:6px}
.logo{width:32px;height:32px;border-radius:9px;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-weight:700;font-size:16px;flex:none;letter-spacing:-.03em}

/* ── каркас приложения ── */
.app{display:grid;grid-template-columns:var(--nav) minmax(0,1fr);min-height:100vh}
.nav{position:sticky;top:0;height:100vh;align-self:start;background:var(--surface);border-right:1px solid var(--rule);display:flex;flex-direction:column;overflow:hidden}
.brandrow{padding:16px;border-bottom:1px solid var(--rule-2);display:flex;gap:10px;align-items:center}
.brandrow b{font-size:14.5px;font-weight:600;display:block;line-height:1.2}
.brandrow small{font-size:10.5px;color:var(--ink-3);font-family:var(--mono)}
.navlist{flex:1;overflow-y:auto;padding:10px;scrollbar-width:thin}
.navlist .grp{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding:14px 10px 6px;font-family:var(--mono)}
.navlist a{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:8px;text-decoration:none;color:var(--ink-2);font-size:13.5px}
.navlist a:hover{background:var(--surface-2);color:var(--ink)}
.navlist a.on{background:var(--accent-soft);color:var(--accent-2);font-weight:600}
.navlist a .cnt{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.navfoot{border-top:1px solid var(--rule-2);padding:10px 12px;display:flex;gap:6px;flex-wrap:wrap}
.topbar{position:sticky;top:0;z-index:30;background:var(--surface);border-bottom:1px solid var(--rule);display:flex;align-items:center;gap:10px;padding:0 18px;height:53px}
.crumb{font-size:13px;color:var(--ink-3);display:flex;gap:7px;align-items:center;min-width:0;white-space:nowrap;overflow:hidden}
.crumb b{color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis}
main{padding:20px 18px 80px;max-width:1280px}

/* ── элементы ── */
.btn{background:var(--surface);border:1px solid var(--rule);border-radius:8px;padding:7px 13px;font-size:13px;cursor:pointer;color:var(--ink-2);white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.btn:hover{border-color:var(--ink-3);color:var(--ink)}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}
.btn.pri:hover{background:var(--accent-2);border-color:var(--accent-2);color:var(--accent-ink)}
.btn.sm{padding:5px 10px;font-size:12.5px;border-radius:7px}
.btn.lg{padding:11px 20px;font-size:15px;border-radius:10px}
.btn.danger{color:var(--danger)} .btn.danger:hover{background:var(--danger-soft);border-color:var(--danger)}
.btn[disabled]{opacity:.5;cursor:not-allowed}
select,input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],input[type=date],textarea{background:var(--surface);border:1px solid var(--rule);border-radius:8px;padding:8px 10px;font-size:13.5px;color:var(--ink);width:100%}
textarea{font-family:var(--ui);line-height:1.5;resize:vertical}
label.fld{display:flex;flex-direction:column;gap:5px;font-size:11px;color:var(--ink-3);font-family:var(--mono);letter-spacing:.05em;text-transform:uppercase;margin-bottom:12px}
label.fld>*{font-family:var(--ui);font-size:13.5px;letter-spacing:0;text-transform:none;color:var(--ink)}
.row2{display:flex;gap:10px;flex-wrap:wrap}
.row2>*{flex:1 1 140px;min-width:0}
.hint{font-size:11.5px;color:var(--ink-3);margin:-8px 0 12px}
.err{font-size:12px;color:var(--danger);margin:-8px 0 12px}
input.bad,select.bad,textarea.bad{border-color:var(--danger);box-shadow:0 0 0 3px var(--danger-soft)}
#regerr{background:var(--danger-soft);border-radius:9px;padding:10px 13px;margin:0 0 14px;font-size:13px;line-height:1.45}
#regerr a{color:var(--danger)}
.errbox{background:var(--danger-soft);color:var(--danger);border-radius:9px;padding:10px 13px;font-size:13px;margin-bottom:14px}
.okbox{background:var(--ok-soft);color:var(--ok);border-radius:9px;padding:10px 13px;font-size:13px;margin-bottom:14px}
.ib{border:1px solid transparent;background:none;width:29px;height:29px;border-radius:8px;cursor:pointer;color:var(--ink-2);font-size:14px;display:inline-grid;place-items:center;flex:none}
.ib:hover{background:var(--surface-2);color:var(--ink);border-color:var(--rule)}
.ib.danger:hover{background:var(--danger-soft);color:var(--danger);border-color:var(--danger-soft)}
.sw-toggle{position:relative;display:inline-flex;align-items:center;gap:9px;cursor:pointer;font-size:13px;color:var(--ink-2)}
.sw-toggle input{position:absolute;opacity:0;width:0;height:0}
.sw-toggle .tr{width:34px;height:19px;border-radius:999px;background:var(--surface-3);border:1px solid var(--rule);position:relative;flex:none;transition:background .15s}
.sw-toggle .tr::after{content:"";position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;background:var(--surface);box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .15s}
.sw-toggle input:checked+.tr{background:var(--accent);border-color:var(--accent)}
.sw-toggle input:checked+.tr::after{transform:translateX(15px)}
.card{background:var(--surface);border:1px solid var(--rule);border-radius:12px}
.card>.hd{padding:14px 18px;border-bottom:1px solid var(--rule-2);display:flex;align-items:center;gap:12px}
.card>.hd h2{margin:0;font-size:15px;font-weight:600}
.card>.bd{padding:16px 18px}
.stack{display:flex;flex-direction:column;gap:14px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.pagehead{display:flex;align-items:flex-end;gap:10px 16px;margin:0 0 18px;flex-wrap:wrap}
.pagehead h1{margin:0;font-size:23px;font-weight:600;letter-spacing:-.025em}
.pagehead p{margin:3px 0 0;font-size:13px;color:var(--ink-3)}
.crumbs{display:flex;gap:7px;font-size:12.5px;color:var(--ink-3);margin:0 0 10px;flex-wrap:wrap}
.crumbs a{color:var(--ink-3);text-decoration:none} .crumbs a:hover{color:var(--accent)}
.crumbs b{color:var(--ink)}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--rule);margin:0 0 18px;overflow-x:auto}
.tabs button{border:0;background:none;padding:9px 14px;font-size:13.5px;cursor:pointer;color:var(--ink-2);border-bottom:2px solid transparent;white-space:nowrap}
.tabs button.on{color:var(--accent-2);border-bottom-color:var(--accent);font-weight:600}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px}
.kpi{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:14px 16px}
.kpi .k{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-family:var(--mono)}
.kpi .v{font-family:var(--mono);font-size:25px;font-weight:500;letter-spacing:-.035em;margin-top:6px;line-height:1}
.kpi .s{font-size:12px;color:var(--ink-3);margin-top:5px}
.tbl-wrap{overflow-x:auto}
table.t{width:100%;border-collapse:collapse;font-size:13.2px}
table.t th{text-align:left;font-family:var(--mono);font-weight:500;font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);padding:9px 12px;border-bottom:1px solid var(--rule);white-space:nowrap;background:var(--surface);position:sticky;top:0;z-index:5}
table.t th.sortable{cursor:pointer} table.t th[aria-sort]{color:var(--accent)}
table.t td{padding:10px 12px;border-bottom:1px solid var(--rule-2);vertical-align:middle;color:var(--ink-2)}
table.t tbody tr:hover td{background:var(--surface-2)}
table.t td.n,table.t th.n{text-align:right;white-space:nowrap}
table.t td.n{font-family:var(--mono);font-variant-numeric:tabular-nums}
.rowlink{cursor:pointer}
.who{display:flex;align-items:center;gap:10px;min-width:0}
.av{width:28px;height:28px;border-radius:8px;flex:none;display:grid;place-items:center;font-size:11px;font-weight:600;background:var(--surface-3);color:var(--ink-2);font-family:var(--mono)}
.who .nm b{display:block;font-weight:500;color:var(--ink);font-size:13.2px}
.rk{font-family:var(--mono);font-size:13px;color:var(--ink-3);display:inline-block;text-align:right;width:32px}
tr.top .rk{color:var(--gold);font-weight:600} tr.top .av{background:var(--gold-soft);color:var(--gold)}
tr.me td{background:var(--accent-soft)!important}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--rule);background:var(--surface);border-radius:999px;padding:4px 11px;font-size:12.5px;cursor:pointer;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px}
.chip.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:500}
.chip.dis{opacity:.4;cursor:not-allowed}
.chip .dot{width:8px;height:8px;border-radius:3px;flex:none}
.seg{display:inline-flex;border:1px solid var(--rule);border-radius:8px;overflow:hidden;background:var(--surface)}
.seg button{border:0;background:none;padding:5px 11px;font-size:12.5px;cursor:pointer;color:var(--ink-2);border-right:1px solid var(--rule)}
.seg button:last-child{border-right:0}
.seg button.on{background:var(--accent);color:var(--accent-ink);font-weight:600}
.bdg{display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:2px 8px;border-radius:6px;font-weight:500;white-space:nowrap}
.bdg.ok{background:var(--ok-soft);color:var(--ok)} .bdg.warn{background:var(--warn-soft);color:var(--warn)}
.bdg.bad{background:var(--danger-soft);color:var(--danger)} .bdg.mut{background:var(--surface-3);color:var(--ink-3)}
.bdg.acc{background:var(--accent-soft);color:var(--accent-2)}
.bar{display:flex;height:8px;border-radius:4px;overflow:hidden;background:var(--surface-3);min-width:70px}
.bar i{height:100%;box-shadow:0 0 0 1px var(--surface)}
.legend{display:flex;flex-wrap:wrap;gap:9px 16px;font-size:12px;color:var(--ink-2)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:9px;height:9px;border-radius:3px}
.empty{padding:36px 22px;text-align:center;color:var(--ink-3)}
.empty b{display:block;color:var(--ink);font-size:14.5px;margin-bottom:5px}
.empty p{margin:0 auto 14px;max-width:52ch;font-size:13px}
.note{background:var(--surface-2);border:1px solid var(--rule-2);border-left:3px solid var(--accent);border-radius:0 9px 9px 0;padding:11px 14px;font-size:12.8px;color:var(--ink-2)}
.note.w{border-left-color:var(--warn)} .note.d{border-left-color:var(--danger)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;font-size:13px}
.kv dt{color:var(--ink-3);font-size:12px} .kv dd{margin:0;color:var(--ink)}
.pager{display:flex;align-items:center;gap:8px;padding:12px 18px;border-top:1px solid var(--rule-2);font-size:12.5px;color:var(--ink-3);flex-wrap:wrap}
.fbar{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.fbar label.fld{margin:0;min-width:150px}

/* модалка */
.scrim{position:fixed;inset:0;background:rgba(6,14,12,.5);z-index:80;display:grid;place-items:center;padding:20px}
.modal{background:var(--surface);border:1px solid var(--rule);border-radius:14px;box-shadow:var(--shadow);width:min(540px,100%);max-height:88vh;overflow-y:auto}
.modal .hd{padding:16px 20px 12px;border-bottom:1px solid var(--rule-2)}
.modal .hd h3{margin:0;font-size:16px} .modal .hd p{margin:4px 0 0;font-size:12.5px;color:var(--ink-3)}
.modal .bd{padding:16px 20px} .modal .ft{padding:12px 20px 16px;display:flex;gap:8px;justify-content:flex-end}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:95;background:var(--ink);color:var(--bg);font-size:13px;padding:10px 16px;border-radius:10px;box-shadow:var(--shadow);max-width:min(520px,92vw)}

/* редактор программы */
.mod{background:var(--surface);border:1px solid var(--rule);border-radius:12px;overflow:hidden}
.modhd{display:flex;align-items:center;gap:10px;padding:12px 15px;border-bottom:1px solid var(--rule-2)}
.modhd b{font-size:14.5px}
/* Название модуля — цвет из палитры модуля (--mod), иначе общий синий (--module).
   Так один и тот же модуль выглядит одинаково и у ученика, и у преподавателя. */
.modt{color:var(--mod,var(--module));font-weight:650}
.modhd .modt{font-size:14.5px}
.modnum{background:var(--mod-soft,var(--module-soft));color:var(--mod,var(--module));border:1px solid var(--mod-line,var(--module-line))}
.bdg.modb{background:var(--mod-soft,var(--module-soft));color:var(--mod,var(--module));border-color:var(--mod-line,var(--module-line))}
.mc1{--mod:var(--m1);--mod-soft:var(--m1s);--mod-line:var(--m1l)}
.mc2{--mod:var(--m2);--mod-soft:var(--m2s);--mod-line:var(--m2l)}
.mc3{--mod:var(--m3);--mod-soft:var(--m3s);--mod-line:var(--m3l)}
.mc4{--mod:var(--m4);--mod-soft:var(--m4s);--mod-line:var(--m4l)}
.mc5{--mod:var(--m5);--mod-soft:var(--m5s);--mod-line:var(--m5l)}
.mc6{--mod:var(--m6);--mod-soft:var(--m6s);--mod-line:var(--m6l)}
/* Панель модуля в кабинете ученика: свой фон у каждого модуля — их видно как отдельные блоки. */
.mbox{background:var(--mod-soft,var(--module-soft));border:1px solid var(--mod-line,var(--module-line));
  border-left:3px solid var(--mod,var(--module));border-radius:10px;padding:8px 12px 4px;margin-bottom:10px}
.mbox .mbhd{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px}
.mbox .les{padding:7px 0;border-bottom:1px solid var(--mod-line,var(--module-line));background:transparent}
.mbox .les:last-of-type{border-bottom:0}
.mbox .les:hover{background:transparent}
.mbox .lnum{background:var(--surface);color:var(--mod,var(--module));border:1px solid var(--mod-line,var(--module-line))}
/* Шапка модуля в программе курса — тем же цветом, чтобы преподаватель и ученик говорили об одном модуле. */
.mod.mc .modhd{background:var(--mod-soft,var(--module-soft));border-bottom-color:var(--mod-line,var(--module-line))}
.mod.mc{border-left:3px solid var(--mod,var(--module))}
.modnum,.lnum{font-family:var(--mono);font-size:10.5px;color:var(--ink-3);background:var(--surface-3);padding:2px 6px;border-radius:5px}
.les{display:flex;align-items:center;gap:10px;padding:9px 15px 9px 22px;border-bottom:1px solid var(--rule-2)}
.les:last-of-type{border-bottom:0} .les:hover{background:var(--surface-2)}
.ltitle{font-size:13.5px;color:var(--ink);text-decoration:none;font-weight:500;cursor:pointer}
.ltitle:hover{color:var(--accent)}
.modfoot{padding:9px 15px;border-top:1px solid var(--rule-2);background:var(--surface-2)}
.addmod{width:100%;justify-content:center;border-style:dashed;padding:12px}
.ccard{cursor:pointer} .ccard:hover{border-color:var(--accent)}
.cico{width:38px;height:38px;border-radius:10px;background:var(--accent-soft);display:grid;place-items:center;font-size:18px;flex:none}
.lgrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start}
.blk{background:var(--surface);border:1px solid var(--rule);border-radius:11px;overflow:hidden}
.blkhd{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--rule-2)}
.blkhd b{font-size:13.5px}
.btype{font-family:var(--mono);font-size:10.5px;color:var(--accent-2);background:var(--accent-soft);padding:3px 8px;border-radius:6px;white-space:nowrap}
.blkbd{padding:12px 14px;font-size:13px;color:var(--ink-2);white-space:pre-wrap}
.struct{margin:0;padding-left:18px;font-size:12.8px;color:var(--ink-2)}
.picker{display:flex;flex-direction:column;gap:6px}
.pick{display:flex;gap:12px;align-items:center;text-align:left;width:100%;border:1px solid var(--rule);background:var(--surface);border-radius:10px;padding:10px 12px;cursor:pointer}
.pick:hover{border-color:var(--accent);background:var(--surface-2)}
.pick b{display:block;font-size:13.5px;color:var(--ink)}
.pico{width:32px;height:32px;border-radius:9px;background:var(--surface-3);display:grid;place-items:center;font-size:15px;flex:none}
.optrow{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.optrow input[type=radio],.optrow input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent);flex:none}
.opts{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:4px}
.opts li{font-size:12.5px;color:var(--ink-3);padding-left:16px;position:relative}
.opts li::before{content:"○";position:absolute;left:0}
.opts li.ok{color:var(--ok)} .opts li.ok::before{content:"●"}
.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.rule{background:var(--surface);border:1px solid var(--rule);border-radius:12px;overflow:hidden}
.rule .rh{display:flex;align-items:center;gap:9px;padding:12px 15px;border-bottom:1px solid var(--rule-2)}
.rule .rh .sw{width:10px;height:10px;border-radius:3px;flex:none} .rule .rh b{flex:1;font-size:14px}
.rule .rb{padding:13px 15px}
.hist .row{display:flex;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid var(--rule-2)}
.hist .row:last-child{border-bottom:0}
.hist .pt{font-family:var(--mono);font-weight:500;width:62px;text-align:right;flex:none}
.hist .pt.pos{color:var(--ok)} .hist .pt.neg{color:var(--danger)}
.hist .meta{flex:1;min-width:0} .hist .meta b{display:block;font-weight:500;color:var(--ink);font-size:13px}
.hist .when{font-family:var(--mono);font-size:11px;color:var(--ink-3);white-space:nowrap}
.qbox{background:var(--surface);border:1px solid var(--rule);border-radius:12px;padding:16px 18px;margin-bottom:12px}
.qbox h3{margin:0 0 12px;font-size:15px}
.qopt{display:flex;gap:10px;align-items:flex-start;padding:9px 11px;border:1px solid var(--rule);border-radius:9px;margin-bottom:7px;cursor:pointer}
.qopt:hover{border-color:var(--accent)}
.qopt input{margin-top:3px;accent-color:var(--accent);width:16px;height:16px;flex:none}
@media (max-width:900px){.lgrid{grid-template-columns:1fr}}
@media (max-width:980px){
  .app{grid-template-columns:1fr}
  .nav{position:fixed;inset:0 auto 0 0;width:min(280px,84vw);z-index:70;transform:translateX(-102%);transition:transform .2s;box-shadow:var(--shadow)}
  .nav.open{transform:none}
  .navscrim{position:fixed;inset:0;background:rgba(6,14,12,.45);z-index:65;display:none}
  .navscrim.on{display:block}
  main{padding:14px 12px 70px} table.t th{top:0}
}
@media (min-width:981px){.menubtn{display:none}}

/* ── аналитика ── */
.meter{display:inline-block;vertical-align:middle;width:110px;max-width:60%;height:8px;border-radius:4px;background:var(--surface-3);overflow:hidden;margin-right:6px}
.meter i{display:block;height:100%;border-radius:4px}
.vchart{display:flex;align-items:flex-end;gap:3px;height:150px;padding:6px 2px 18px;overflow-x:auto}
.vbar{flex:1 1 0;min-width:9px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative}
.vbar i{display:block;width:100%;min-height:2px;border-radius:3px 3px 0 0;background:var(--accent);opacity:.85}
.vbar:hover i{opacity:1}
.vbar span{position:absolute;bottom:-16px;font-size:9.5px;color:var(--ink-3);font-family:var(--mono)}
.vbar:nth-child(2n) span{display:none}
@media (max-width:640px){.vbar:nth-child(3n) span,.vbar:nth-child(5n) span{display:none}}
.formula{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:14px}
.formula .num{font-size:20px;color:var(--ink)}

/* ── Вариант ЕНТ: плеер, разбор, ключи. Палитра — из тренажёра «Алхимия с Жасланом». ── */
.ent{--ent-accent:#2e90d1;--ent-accent-2:#6bd0ff;--ent-border:#b6d8ea;--ent-soft:#e9f6fc;--ent-soft-2:rgba(182,216,234,.35);
  --ent-ok:#29a36a;--ent-ok-bg:#d1f0e0;--ent-ok-border:#a3dcb8;--ent-ok-text:#0f5132;--ent-bad:#e04e4e;--ent-bad-bg:#ffe0e0;--ent-bad-border:#ffb3b3;--ent-bad-text:#842029;
  --ent-warn:#ffb703;--ent-warn-bg:#fff4d9;--ent-shadow:0 4px 20px rgba(46,144,209,.08);max-width:920px}
:root[data-theme=dark] .ent,.ent.dark{--ent-border:#24404d;--ent-soft:#0f1e26;--ent-soft-2:rgba(86,182,227,.12);--ent-ok-bg:#12301f;--ent-ok-border:#1f5a39;--ent-ok-text:#9be3bd;--ent-bad-bg:#3a1a1a;--ent-bad-border:#6a2b2b;--ent-bad-text:#ffb3b3;--ent-warn-bg:#2f2611;--ent-shadow:0 4px 20px rgba(0,0,0,.35)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ent{--ent-border:#24404d;--ent-soft:#0f1e26;--ent-soft-2:rgba(86,182,227,.12);--ent-ok-bg:#12301f;--ent-ok-border:#1f5a39;--ent-ok-text:#9be3bd;--ent-bad-bg:#3a1a1a;--ent-bad-border:#6a2b2b;--ent-bad-text:#ffb3b3;--ent-warn-bg:#2f2611;--ent-shadow:0 4px 20px rgba(0,0,0,.35)}}
.ent-top{position:sticky;top:53px;z-index:20;background:var(--bg);padding:10px 0 12px;border-bottom:1px solid var(--rule-2);margin-bottom:6px}
.ent-nums{display:flex;flex-wrap:wrap;gap:7px;padding:2px}
.ent-num{width:36px;height:36px;border-radius:10px;background:var(--surface);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-weight:700;font-size:13px;border:1px solid var(--ent-border);transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:var(--ent-shadow);position:relative;user-select:none}
.ent-num:hover{transform:translateY(-2px);border-color:var(--ent-accent)}
.ent-num.answered{border-color:var(--ent-accent);background:var(--ent-soft)}
.ent-num.current{background:var(--ent-accent);color:#fff;border-color:var(--ent-accent);box-shadow:0 0 0 3px rgba(46,144,209,.3);transform:scale(1.06)}
.ent-num.correct{background:var(--ent-ok);color:#fff;border-color:var(--ent-ok)}
.ent-num.wrong{background:var(--ent-bad);color:#fff;border-color:var(--ent-bad)}
.ent-num.partial{background:var(--ent-warn);color:#3a2a00;border-color:var(--ent-warn)}
.ent-num.flagged::after{content:'';position:absolute;top:4px;right:4px;width:7px;height:7px;background:var(--ent-warn);border-radius:50%;box-shadow:0 0 0 1.5px var(--surface)}
.ent-progress{display:flex;align-items:center;gap:12px;margin-top:10px}
.ent-track{flex:1;height:8px;background:var(--ent-soft-2);border-radius:999px;overflow:hidden}
.ent-fill{height:100%;width:0;background:linear-gradient(90deg,var(--ent-accent),var(--ent-accent-2));border-radius:999px;transition:width .5s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}
.ent-fill::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);animation:entshimmer 2s infinite}
@keyframes entshimmer{0%{left:-100%}100%{left:100%}}
.ent-ptext{min-width:64px;text-align:right;font-weight:700;font-size:14px;color:var(--ent-accent);font-family:var(--mono)}
.ent-timer{font-family:var(--mono);font-weight:700;font-size:14px;padding:3px 10px;border-radius:999px;background:var(--ent-soft);color:var(--ent-accent)}
.ent-timer.low{background:var(--ent-bad-bg);color:var(--ent-bad-text)}
.ent-head{display:flex;justify-content:space-between;align-items:center;margin:16px 0 12px;gap:12px;flex-wrap:wrap}
.ent-title{font-size:19px;font-weight:800;color:var(--ent-accent);letter-spacing:-.3px}
.ent-qindex{font-size:13.5px;font-weight:600;color:var(--ink-2);background:var(--ent-soft-2);padding:6px 14px;border-radius:999px}
.ent-cardbox{background:var(--surface);border:1px solid var(--ent-border);border-radius:18px;overflow:hidden;box-shadow:var(--ent-shadow);animation:entslide .35s ease-out}
@keyframes entslide{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.ent-cardhead{padding:22px 24px;border-bottom:1px solid var(--ent-soft-2);background:linear-gradient(180deg,var(--ent-soft),transparent)}
.ent-question{font-size:17.5px;line-height:1.65;font-weight:500;color:var(--ink)}
.ent-context{margin:0 0 16px;padding:16px 20px;background:var(--ent-warn-bg);border:1px solid rgba(255,183,3,.25);border-left:4px solid var(--ent-warn);border-radius:14px;font-size:14px;line-height:1.6;color:var(--ink);position:relative}
.ent-context::before{content:'💡';position:absolute;top:-11px;left:16px;background:var(--surface);padding:0 8px;font-size:16px;border-radius:8px}
.ent-opts{display:flex;flex-direction:column;gap:11px;padding:18px 24px 26px}
.ent-hint{background:linear-gradient(90deg,var(--ent-soft-2),transparent);padding:10px 14px;margin:-4px -24px 8px;border-left:3px solid var(--ent-accent);font-size:13px;color:var(--ink-2)}
.ent-hint::before{content:'ⓘ ';color:var(--ent-accent)}
.ent-opt{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border:1px solid var(--ent-border);border-radius:14px;background:var(--surface);transition:all .2s cubic-bezier(.4,0,.2,1);cursor:pointer;position:relative;overflow:hidden}
.ent-opt:hover:not(.disabled){background:var(--ent-soft);border-color:var(--ent-accent);transform:translateX(4px);box-shadow:var(--ent-shadow)}
.ent-opt input{margin-top:3px;width:19px;height:19px;accent-color:var(--ent-accent);cursor:pointer;flex-shrink:0}
.ent-letter{font-weight:800;width:24px;flex-shrink:0;color:var(--ent-accent);font-size:15px}
.ent-otext{flex:1;min-width:0;line-height:1.55}
.ent-opt.disabled{cursor:default;pointer-events:none}
.ent-opt.correct-now{background:var(--ent-ok-bg);border-color:var(--ent-ok-border);color:var(--ent-ok-text);animation:entpulse .5s ease}
.ent-opt.wrong-now{background:var(--ent-bad-bg);border-color:var(--ent-bad-border);color:var(--ent-bad-text);animation:entshake .5s ease}
.ent-opt.correct-now .ent-letter{color:var(--ent-ok)} .ent-opt.wrong-now .ent-letter{color:var(--ent-bad)}
@keyframes entpulse{0%,100%{transform:scale(1)}50%{transform:scale(1.015)}}
@keyframes entshake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
.ent-opt.correct-now::after,.ent-opt.wrong-now::after{content:'';position:absolute;right:14px;top:50%;transform:translateY(-50%);width:22px;height:22px;background-size:contain;background-repeat:no-repeat}
.ent-opt.correct-now::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2329a36a'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E")}
.ent-opt.wrong-now::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23e04e4e'%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/%3E%3C/svg%3E")}
.ent-match{padding:18px 24px 26px;display:flex;flex-direction:column;gap:14px}
.ent-match .ent-hint{margin-bottom:0}
.ent-text{padding:18px 24px 26px}
.ent-text textarea{width:100%;box-sizing:border-box;border:1px solid var(--ent-border);border-radius:14px;padding:14px 16px;font:inherit;font-size:15px;line-height:1.55;background:var(--surface);color:var(--ink);resize:vertical;min-height:120px}
.ent-text textarea:focus{outline:none;border-color:var(--ent-accent);box-shadow:0 0 0 3px var(--ent-soft-2)}
.ent-num.pending{background:var(--ent-warn-bg);border-color:var(--ent-warn);color:var(--ink)}
.qstat{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--ink-3);margin-top:8px}
.qstat b{color:var(--ink)}
.chk-list{display:flex;flex-direction:column;gap:6px;max-height:320px;overflow:auto;border:1px solid var(--rule);border-radius:10px;padding:8px 10px;margin-bottom:10px}
.chk-list label{display:flex;gap:10px;align-items:center;padding:6px 4px;border-radius:8px;cursor:pointer}
.chk-list label:hover{background:var(--surface-2,rgba(0,0,0,.03))}
.chk-list input{width:17px;height:17px;flex:none;accent-color:var(--accent)}
.chk-list .mini{margin-left:auto;white-space:nowrap}
.ent-mrow{display:grid;grid-template-columns:1fr 300px;border:1px solid var(--ent-border);border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:var(--ent-shadow)}
.ent-mleft{padding:16px 18px;display:flex;align-items:center;gap:12px;background:linear-gradient(90deg,var(--ent-soft),transparent)}
.ent-badge{font-weight:800;color:var(--ent-accent);font-size:15px;min-width:24px}
.ent-meq{font-size:15px;line-height:1.55}
.ent-mright{display:flex;flex-direction:column;justify-content:center;gap:8px;padding:12px 14px;background:var(--ent-soft-2);border-left:1px solid var(--ent-border)}
.ent-mright select{padding:11px 36px 11px 14px;border-radius:10px;border:1px solid var(--ent-border);font-size:14px;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%232e90d1' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.ent-mright select.correct-now{background-color:var(--ent-ok-bg);border-color:var(--ent-ok);color:var(--ent-ok-text)}
.ent-mright select.wrong-now{background-color:var(--ent-bad-bg);border-color:var(--ent-bad);color:var(--ent-bad-text)}
.ent-correct-label{font-size:13px;color:var(--ent-ok-text);font-weight:700}
.ent-toolbar{position:sticky;bottom:0;z-index:15;background:linear-gradient(180deg,transparent,var(--bg) 25%);padding:18px 0 14px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.ent-btn{background:var(--ent-accent);color:#fff;border:none;padding:12px 22px;border-radius:14px;font-weight:700;font-size:15px;cursor:pointer;min-width:120px;box-shadow:0 4px 15px rgba(46,144,209,.3);transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;gap:6px}
.ent-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(46,144,209,.4)}
.ent-btn:active{transform:translateY(0)} .ent-btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
.ent-btn.secondary{background:var(--surface);color:var(--ent-accent);border:1.5px solid var(--ent-accent);box-shadow:none}
.ent-btn.ghost{background:transparent;color:var(--ent-accent);border:1.5px dashed var(--ent-accent);min-width:auto;box-shadow:none}
.ent-resbox{margin:16px 0;background:var(--surface);border:1px solid var(--ent-border);border-radius:18px;overflow:hidden;box-shadow:var(--ent-shadow);animation:entslide .45s ease}
.ent-resbox h3{margin:0;padding:18px 24px;border-bottom:1px solid var(--ent-border);background:linear-gradient(90deg,var(--ent-soft),transparent);font-size:19px;color:var(--ent-accent)}
.ent-summary{padding:24px;font-size:18px;text-align:center;background:linear-gradient(180deg,var(--ent-soft),transparent)}
.ent-review{padding:0 24px 20px}
.ent-rv-item{border-top:1px solid var(--ent-border);padding:16px 0}
.ent-rv-q{font-size:15.5px;margin-bottom:6px;display:flex;gap:8px;align-items:flex-start}
.ent-rv-q .tex{flex:1}
.ent-rv-pts{margin-left:auto;font-family:var(--mono);font-size:13px;white-space:nowrap}
.ent-rv-line{margin-left:12px;padding:4px 0}
.ent-rv-pair{margin:6px 0 6px 12px;padding:8px 10px;background:var(--ent-soft-2);border-radius:8px}
.ent-ok{color:var(--ent-ok);font-weight:700} .ent-bad{color:var(--ent-bad);font-weight:700} .ent-part{color:var(--ent-warn);font-weight:700}
.ent-signoff{padding:18px;background:linear-gradient(90deg,var(--ent-soft),var(--ent-soft-2));border-top:1px solid var(--ent-border);font-weight:800;text-align:center;color:var(--ent-accent);font-size:16px}
.ent-confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:1000}
.ent-confetti i{position:absolute;width:10px;height:16px;opacity:.9;border-radius:2px;animation:entfall linear forwards}
@keyframes entfall{to{transform:translateY(110vh) rotate(720deg);opacity:.3}}
.ent-keys{padding:6px 18px 14px}
.ent-key{border-top:1px solid var(--rule-2);padding:12px 0}
.ent-key-h{display:flex;gap:8px;align-items:center;margin-bottom:4px}
.ent-key-q{font-size:14.5px;margin-bottom:8px;line-height:1.55}
.ent-kopts{display:flex;flex-direction:column;gap:3px;font-size:13.5px;color:var(--ink-2)}
.ent-kopts .ent-kok{color:var(--ent-ok-text);background:var(--ent-ok-bg);border-radius:6px;padding:1px 6px;display:inline-block;font-weight:600}
.ent-kpairs{display:flex;flex-direction:column;gap:6px;font-size:13.5px}
.brand-preview{display:flex;gap:10px;align-items:center;padding:12px 14px;border:1px dashed var(--rule);border-radius:12px;margin-bottom:14px}
.brand-preview .logo{font-size:18px} .brand-preview b{display:block;font-size:14.5px} .brand-preview small{color:var(--ink-3);font-family:var(--mono);font-size:10.5px}
mjx-container{overflow-x:auto;overflow-y:hidden;max-width:100%}
@media (max-width:768px){
  .ent-mrow{grid-template-columns:1fr} .ent-mright{border-left:none;border-top:1px solid var(--ent-border)}
  .ent-btn{padding:11px 14px;min-width:auto;flex:1;font-size:14px} .ent-btn.ghost{flex:0 0 auto}
  .ent-top{top:53px} .ent-num{width:33px;height:33px;font-size:12px}
  .ent-opts,.ent-match,.ent-text{padding:14px 14px 20px} .ent-hint{margin:-4px -14px 8px} .ent-match .ent-hint{margin-bottom:0} .ent-cardhead{padding:16px}
}

/* ── защищённый видеоплеер ── */
.vp [hidden]{display:none!important}
.vp{background:#0b0f14;border-radius:14px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.25);color:#fff;user-select:none;-webkit-user-select:none;margin:6px 0 4px;outline:none;max-width:100%}
.vp:focus-visible{box-shadow:0 0 0 3px var(--accent-soft),0 8px 24px rgba(0,0,0,.25)}
.vp-head{display:flex;gap:10px;align-items:baseline;padding:10px 14px;background:rgba(255,255,255,.06);font-size:13px}
.vp-brand{font-weight:800;letter-spacing:.3px} .vp-title{color:#bbb;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vp-stage{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.vp-frame,.vp-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vp-overlay{position:absolute;inset:0;z-index:5;cursor:pointer;background:transparent}
.vp-mark{position:absolute;z-index:6;left:10%;top:10%;font-size:12px;color:rgba(255,255,255,.55);text-shadow:0 1px 2px rgba(0,0,0,.6);pointer-events:none;transition:left 1.2s ease,top 1.2s ease;white-space:nowrap;font-family:var(--mono)}
.vp-loader{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:7;background:rgba(0,0,0,.7);padding:10px 18px;border-radius:10px;font-size:14px;pointer-events:none}
.vp-big{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:8;width:72px;height:72px;border-radius:50%;border:0;background:var(--accent);color:#fff;font-size:28px;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;padding-left:6px}
.vp-big:hover{transform:translate(-50%,-50%) scale(1.06)}
.vp-end{position:absolute;inset:0;z-index:9;background:rgba(0,0,0,.82);display:flex;align-items:center;justify-content:center;text-align:center;font-size:18px}
.vp-end .btn{margin-top:14px;background:#fff;color:#111}
.vp-controls{display:flex;gap:10px;align-items:center;padding:10px 12px;background:rgba(255,255,255,.06)}
.vp-btn{width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;font-size:15px;cursor:pointer;flex:none;display:flex;align-items:center;justify-content:center}
.vp-btn:hover{background:rgba(255,255,255,.22)}
.vp-time{font-family:var(--mono);font-size:12px;color:#ddd;min-width:44px;text-align:center}
.vp-bar{flex:1;min-width:60px;appearance:none;-webkit-appearance:none;height:6px;border-radius:3px;background:linear-gradient(to right,var(--accent) var(--p,0%),rgba(255,255,255,.25) var(--p,0%));outline:none;cursor:pointer}
.vp-bar::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.5);cursor:pointer}
.vp-bar::-moz-range-thumb{width:15px;height:15px;border:0;border-radius:50%;background:#fff;cursor:pointer}
.vp-speed{background:rgba(255,255,255,.12);color:#fff;border:0;border-radius:8px;padding:6px 8px;font-size:12px;width:auto;min-width:0}
.vp-speed option{color:#111}
.vp-err{padding:10px 14px;background:#3a1416;color:#ffb4b4;font-size:13px}
.vp.fs{border-radius:0;display:flex;flex-direction:column;height:100%;background:#000}
.vp.fs .vp-stage{flex:1;aspect-ratio:auto}
.vp:fullscreen{width:100%;height:100%}
@media (max-width:600px){.vp-controls{gap:6px;padding:8px}.vp-time{min-width:38px;font-size:11px}.vp-speed{padding:5px 4px;font-size:11px}.vp-btn{width:34px;height:34px}}

/* Навигация по урокам внизу страницы: предыдущий / следующий. */
.lnav { display: flex; gap: 10px; align-items: stretch; margin: 18px 0 4px; flex-wrap: wrap; }
.lnav-side { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 2px;
  padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card);
  text-decoration: none; color: var(--ink); }
.lnav-side:hover { border-color: var(--accent); }
.lnav-side b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lnav-side:last-child { text-align: right; align-items: flex-end; }
.lnav-off { opacity: .55; cursor: not-allowed; }
.lnav-off:hover { border-color: var(--line); }
.lnav-side:empty { border: 0; background: none; padding: 0; }
.lnav-mid { flex: 0 0 auto; align-self: center; padding: 0 6px; }
@media (max-width: 700px) { .lnav-side:last-child { text-align: left; align-items: flex-start; } }