/* Оформление в стиле учебной платформы: светлый серый фон, белые панели, тонкие заголовки с разрядкой,
   серо-голубые подписи полей, прямоугольные кнопки, вкладки с подчёркиванием.
   Все цвета — переменные: светлая тема в :root, тёмная — в :root[data-theme="dark"] (включает public/theme.js). */
:root{color-scheme:light;
  --bg:#f5f6f8;--fg:#202124;--card:#fff;--line:#dfe3e8;--ac:#2d7be5;--ok:#219653;--okb:#e9f7ef;--no:#d93f3f;--nob:#fdeeee;
  --lbl:#6e8fb4;--warnbg:#faf3e0;--muted:#7b848f;--wn:#9a6200;--wnb:#fdf1d8;
  --title:#2b2f33;--btnline:#c8ced6;--btnhover:#9aa4b1;--disabled:#d9dde2;--tabtext:#4a5560;--exbg:#f7f9fc;--pagebg2:#fafbfb;
  --tl:#17919c;--tlb:#d4e6eb;--mint:#e7f6ee;--mline:#c6e0d3;--tlline:#2bbf9f;--seg:#56707a;
  --segdone:#b8d6de;--segdonefg:#24414a;--segok:#c5ead2;--segokfg:#1d6b3a;--segno:#f6d3d3;--segnofg:#a52a2a;
  --timerline:#e1e5e8;--timerfill:#dff2e0;--timeredge:#4caf50;--timertext:#43a047;--timerlowfill:#fbe3e3;--timerlow:#e53935;
  --qtext:#1f2328;--lxhint:#6c8a7e;--optok:#c9ecd5;--optno:#f8d6d6;--lxbtn:#fff;--lxbtnhover:#f3f7f6;--lxbtndis:#a3adb4;
  --soft:rgba(255,255,255,.55);--exlx:rgba(255,255,255,.6)}
:root[data-theme="dark"]{color-scheme:dark;
  --bg:#14171c;--fg:#e3e6ea;--card:#1d2127;--line:#30363f;--ac:#5b9cf0;--ok:#4cc38a;--okb:#16332a;--no:#f07a72;--nob:#3c1e1c;
  --lbl:#8ea8c8;--warnbg:#3a3220;--muted:#9aa3ad;--wn:#e3b35a;--wnb:#3a2e15;
  --title:#eef1f4;--btnline:#3a414c;--btnhover:#5a6370;--disabled:#353b45;--tabtext:#b4bcc6;--exbg:#232830;--pagebg2:#14171c;
  --tl:#2aa9b5;--tlb:#22303a;--mint:#17221e;--mline:#2a3b33;--tlline:#2bbf9f;--seg:#9fb3bb;
  --segdone:#2f4a52;--segdonefg:#d5e6eb;--segok:#1f4a30;--segokfg:#a9e5c0;--segno:#4d2626;--segnofg:#f3b0b0;
  --timerline:#30363f;--timerfill:#1d3a22;--timeredge:#4caf50;--timertext:#5cc463;--timerlowfill:#4a2020;--timerlow:#ff6b66;
  --qtext:#eef1f4;--lxhint:#8fb0a3;--optok:#1f4a30;--optno:#4d2626;--lxbtn:#262b33;--lxbtnhover:#2e343d;--lxbtndis:#6b7480;
  --soft:rgba(255,255,255,.05);--exlx:rgba(255,255,255,.05)}
body{font:16px/1.5 Roboto,"Segoe UI",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;letter-spacing:.01em;background:var(--bg);color:var(--fg)}
main{max-width:1240px;padding:32px 36px 48px}
h1{font-size:2.75rem;font-weight:300;letter-spacing:.07em;margin:0 0 4px;color:var(--title)}
.sub{font-size:.95rem;color:var(--muted);opacity:1;margin:0 0 24px}
h2{font-weight:300;font-size:1.6rem;letter-spacing:.04em;color:var(--title)}
.card{border:0;border-radius:2px;box-shadow:0 1px 2px rgba(16,24,40,.06);padding:24px 32px}
button,select{font:inherit;border-radius:2px;border:1px solid var(--btnline);background:var(--card);color:var(--fg);padding:10px 26px;letter-spacing:.02em}
button:hover:not(:disabled){border-color:var(--btnhover)}
button.p{background:var(--ac);border-color:var(--ac);color:#fff}
button.p:hover:not(:disabled){filter:brightness(.95);border-color:var(--ac)}
button:disabled,button.p:disabled{opacity:1;background:var(--disabled);border-color:var(--disabled);color:#fff;cursor:default}
button.warn{border-color:var(--no);color:var(--no);background:var(--card)}
button.ok{border-color:var(--ok);color:var(--ok)}
a.btn{background:var(--card);border-color:var(--btnline);color:var(--fg)}
.tabs{gap:0;border-bottom:1px solid var(--line);margin-bottom:20px}
.tabs button{border:0;border-bottom:3px solid transparent;border-radius:0;background:none;padding:14px 18px;color:var(--tabtext)}
.tabs button.on{background:none;color:var(--ac);border-bottom-color:var(--ac)}
.tabs.sm{border:0;gap:8px;margin-bottom:12px}
.tabs.sm button{border:1px solid var(--btnline);border-radius:2px;padding:8px 14px}
.tabs.sm button.on{background:var(--ac);border-color:var(--ac);color:#fff}
label{border-radius:2px;border-color:var(--line);padding:12px 16px;background:var(--card)}
label.sw{background:none}
.hint{color:var(--muted);opacity:1}
.sec{font-weight:400;font-size:1.2rem;letter-spacing:.03em;color:var(--title)}
.q{font-size:1.2rem;font-weight:500}
.ex{background:var(--exbg);border-left-color:var(--ac)}
.tb{border-radius:2px}
.n{border-radius:2px}
.gk{background:var(--okb)}.rd{background:var(--nob)}
.msg{border-radius:2px}
.i{border-radius:50%}
input.fi{border-radius:2px;background:var(--card)}
footer{color:var(--muted);opacity:1}
/* Блоки в духе страницы тестирования */
.lms-title{font-size:2.6rem;font-weight:300;letter-spacing:.07em;margin:0 0 22px;color:var(--title);line-height:1.2}
.lms-banner{display:flex;gap:14px;align-items:center;background:var(--warnbg);padding:18px 26px;margin:0 0 22px;font-size:1.05rem;border-radius:2px}
.lms-banner svg{flex:none}
.lms-actions{display:flex;gap:28px;margin:0 0 40px;flex-wrap:wrap}
.lms-actions button{display:inline-flex;align-items:center;gap:10px;padding:12px 32px}
.lms-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.lms-cols h3{font-weight:300;font-size:1.65rem;letter-spacing:.04em;margin:0 0 26px;color:var(--title)}
.lms-f{margin:0 0 22px}
.lms-f .l{color:var(--lbl);font-size:1rem;letter-spacing:.04em;margin:0 0 6px}
.lms-f .v{font-size:1.2rem;margin:0}
.vscore{font-weight:300;letter-spacing:.04em}
/* Страница прохождения теста: шапка с таймером, полоса номеров, мятная панель вопроса */
body:has(.lx){background:var(--pagebg2)}
main:has(.lx)>h1,main:has(.lx)>.sub,main:has(.lx)>.nav{display:none}
.lx-head{display:flex;align-items:center;gap:24px;margin:4px 0 32px}
.lx-title{flex:1;margin:0;font-size:2.75rem;font-weight:300;letter-spacing:.06em;line-height:1.15;color:var(--title)}
.lx-timer{position:relative;flex:0 1 575px;height:52px;border:1px solid var(--timerline);border-radius:26px;background:var(--card);overflow:hidden;display:flex;align-items:center;justify-content:center}
.lx-timer i{position:absolute;left:0;top:0;bottom:0;min-width:12px;width:0;background:var(--timerfill);box-shadow:inset -12px 0 0 var(--timeredge);transition:width .9s linear}
.lx-timer b{position:relative;font-size:1.7rem;font-weight:500;color:var(--timertext);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.lx-timer.low i{background:var(--timerlowfill);box-shadow:inset -12px 0 0 var(--timerlow)}
.lx-timer.low b{color:var(--timerlow)}
.lx-close{flex:none;display:flex;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:none;color:var(--title)}
.lx-close:hover:not(:disabled){border:0;color:var(--tl)}
.lx-ask{display:flex;flex-wrap:wrap;align-items:center;gap:12px;background:var(--warnbg);padding:14px 20px;margin:-12px 0 24px}
.lx-ask span{flex:1 1 220px}
.lx-nav{display:flex;background:var(--tlb);border-bottom:3px solid var(--tlline);border-radius:12px;overflow:hidden}
.lx-s{flex:1;min-width:0;border:0;border-radius:0;background:none;padding:12px 0;font-size:1.15rem;letter-spacing:0;color:var(--seg)}
.lx-s:hover:not(:disabled){border:0;background:rgba(23,145,156,.13)}
.lx-s.done{background:var(--segdone);color:var(--segdonefg)}
.lx-s.ok{background:var(--segok);color:var(--segokfg)}
.lx-s.no{background:var(--segno);color:var(--segnofg)}
.lx-s.cur,.lx-s.cur:hover:not(:disabled){background:var(--tl);color:#fff}
.lx-panel{display:flex;flex-direction:column;background:var(--mint);padding:36px;margin-top:36px;min-height:max(420px,calc(100vh - 330px));box-shadow:0 1px 3px rgba(16,24,40,.05)}
.lx-q{font-size:1.25rem;font-weight:600;line-height:1.5;margin:0 0 6px;color:var(--qtext)}
.lx-hint{color:var(--lxhint);margin:0 0 18px}
.lx #o label{align-items:center;gap:14px;margin:0;padding:14px 6px;border:0;border-bottom:1px solid var(--mline);border-radius:0;background:none;font-size:1.1rem}
.lx #o label:first-child{border-top:1px solid var(--mline)}
.lx #o label:hover{background:var(--soft)}
.lx #o label:has(input:checked:not(:disabled)){background:rgba(23,145,156,.12)}
.lx #o input{flex:none;width:19px;height:19px;margin:0;accent-color:var(--tl)}
.lx #o label.ok{background:var(--optok)}
.lx #o label.no{background:var(--optno)}
.lx #o label.miss{outline:2px dashed var(--ok);outline-offset:-2px}
.lx .ex{background:var(--exlx);border-left-color:var(--tl)}
.lx-foot{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:auto;padding-top:36px}
.lx-b{display:inline-flex;align-items:center;gap:14px;padding:14px 34px;border:0;border-radius:4px;background:var(--lxbtn);color:var(--title);font-size:1.15rem;box-shadow:0 1px 2px rgba(16,24,40,.06)}
.lx-b:hover:not(:disabled){border:0;background:var(--lxbtnhover)}
.lx-b:disabled{background:var(--lxbtn);color:var(--lxbtndis)}
.lx-b.go{background:var(--tl);color:#fff}
.lx-b.go:hover:not(:disabled){filter:brightness(.9);background:var(--tl)}
.lx-b.self{margin-left:auto}
.lx-b svg{flex:none}
.lx-end{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:18px;color:var(--muted)}
.lx-end .msg{flex-basis:100%;margin:0}
/* Переключатель оформления в шапке */
.theme-btn{padding:6px 10px;font-size:.9rem}
@media(max-width:700px){
  .lx-head{flex-wrap:wrap;gap:14px;margin-bottom:22px}
  .lx-title{flex-basis:100%;font-size:2rem}
  .lx-timer{flex:1;height:46px}
  .lx-timer b{font-size:1.4rem}
  .lx-nav{display:grid;grid-template-columns:repeat(10,1fr)}
  .lx-s{padding:10px 0;font-size:.95rem}
  .lx-panel{min-height:0;margin-top:20px;padding:22px 16px}
  .lx-q{font-size:1.1rem}
  .lx #o label{font-size:1rem;padding:12px 4px}
  .lx-foot{gap:10px;padding-top:24px}
  .lx-b{padding:12px 18px;font-size:1rem;gap:10px}
  .lx-b.self{flex-basis:100%;justify-content:center;margin-left:0}
}
@media(max-width:900px){
  main{padding:20px 16px 40px}
  .card{padding:18px}
  h1,.lms-title{font-size:2rem}
  .lms-cols{grid-template-columns:1fr;gap:8px}
  .lms-cols h3{margin:16px 0 14px}
  .lms-actions{gap:12px;margin-bottom:20px}
  .lms-actions button{padding:10px 20px}
}