/* Захист України — тактичний темний. Офлайн: усе локально. */

@font-face{font-family:"e-Ukraine";src:url("../шрифти/e-Ukraine-Light.woff2")format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"e-Ukraine";src:url("../шрифти/e-Ukraine-Regular.woff2")format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"e-Ukraine";src:url("../шрифти/e-Ukraine-Medium.woff2")format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"e-Ukraine";src:url("../шрифти/e-Ukraine-Bold.woff2")format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"e-Ukraine Head";src:url("../шрифти/e-UkraineHead-Regular.woff2")format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"e-Ukraine Head";src:url("../шрифти/e-UkraineHead-Bold.woff2")format("woff2");font-weight:700;font-display:swap}

:root{
  --тло:#0e1210; --тло-2:#151b18; --тло-3:#1c2320;
  --лінія:#2a3430; --лінія-2:#3a4741;
  --текст:#e8ede9; --текст-2:#9aa8a1; --текст-3:#6b7a73;
  --акцент:#d8c04a; --акцент-тьмяний:#8f7f2e;
  --хакі:#5c6b4a; --тривога:#c2542f;
  --r:2px; --край:1200px;
  --пер:.42s cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--тло); color:var(--текст);
  font:400 16px/1.6 "e-Ukraine",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  background-image:linear-gradient(var(--лінія) 1px,transparent 1px),linear-gradient(90deg,var(--лінія) 1px,transparent 1px);
  background-size:64px 64px; background-position:center;
}
body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(ellipse 90% 60% at 50% 0%,transparent 30%,var(--тло) 78%)}
main,header,footer{position:relative;z-index:1}
h1,h2,h3{font-family:"e-Ukraine Head","e-Ukraine",sans-serif;font-weight:700;line-height:1.08;letter-spacing:-.02em}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.обгортка{max-width:var(--край);margin:0 auto;padding:0 24px}

/* Шапка */
.шапка{position:sticky;top:0;z-index:20;height:64px;display:flex;align-items:center;
  background:color-mix(in srgb,var(--тло) 88%,transparent);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--лінія)}
.шапка .обгортка{display:flex;align-items:center;gap:24px;width:100%}
.знак{font-family:"e-Ukraine Head";font-weight:700;font-size:15px;letter-spacing:.04em;white-space:nowrap}
.знак b{color:var(--акцент)}
.шапка nav{margin-left:auto;display:flex;gap:22px;font-size:14px;color:var(--текст-2)}
.шапка nav a{padding:4px 0;border-bottom:1px solid transparent;transition:var(--пер)}
.шапка nav a:hover,.шапка nav a[aria-current]{color:var(--текст);border-color:var(--акцент)}

/* Пошук */
.пошук{position:relative;margin-left:auto}
.пошук input{width:210px;background:var(--тло-2);border:1px solid var(--лінія);border-radius:var(--r);
  color:var(--текст);font:400 14px/1 "e-Ukraine";padding:9px 12px;transition:var(--пер)}
.пошук input:focus{outline:none;border-color:var(--акцент);width:300px}
.пошук input::placeholder{color:var(--текст-3)}
.знахідки{position:absolute;top:46px;right:0;width:520px;max-height:64vh;overflow:auto;
  background:var(--тло-2);border:1px solid var(--лінія-2);border-radius:var(--r);display:none}
.знахідки.є{display:block}
.знахідки a{display:block;padding:12px 16px;border-bottom:1px solid var(--лінія);transition:var(--пер)}
.знахідки a:hover{background:var(--тло-3)}
.знахідки .шлях{font-size:11.5px;color:var(--текст-3);letter-spacing:.04em;text-transform:uppercase}
.знахідки .назва{font-size:14.5px;margin-top:3px}
.знахідки mark{background:var(--акцент-тьмяний);color:var(--тло);padding:0 2px}

/* Головна */
.герой{min-height:calc(100dvh - 64px);display:grid;grid-template-columns:1.15fr .85fr;
  align-items:center;gap:56px;padding:72px 0 64px}
.герой h1{font-size:clamp(40px,6.6vw,80px)}
.герой h1 span{color:var(--акцент);display:block}
.герой p{color:var(--текст-2);font-size:17px;max-width:46ch;margin-top:22px}
.дії{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.кнопка{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;border-radius:var(--r);
  background:var(--акцент);color:#14180f;font-weight:700;font-size:15px;white-space:nowrap;
  border:1px solid var(--акцент);transition:var(--пер)}
.кнопка:hover{background:transparent;color:var(--акцент)}
.кнопка:active{transform:translateY(1px)}
.кнопка.друга{background:transparent;color:var(--текст);border-color:var(--лінія-2)}
.кнопка.друга:hover{border-color:var(--акцент);color:var(--акцент)}
.числа{display:flex;gap:40px;margin-top:56px;border-top:1px solid var(--лінія);padding-top:26px}
.числа div b{display:block;font-family:"e-Ukraine Head";font-size:30px;color:var(--акцент);line-height:1}
.числа div span{font-size:13px;color:var(--текст-3)}
.герой-фото{position:relative;aspect-ratio:4/5;overflow:hidden;border:1px solid var(--лінія-2);border-radius:var(--r)}
.герой-фото img{width:100%;height:100%;object-fit:cover;filter:grayscale(.55) contrast(1.08) brightness(.72)}
.герой-фото::after{content:"";position:absolute;inset:0;
  background:linear-gradient(200deg,transparent 40%,rgba(216,192,74,.14),var(--тло) 96%)}

/* Секції */
.секція{padding:88px 0}
.секція>h2{font-size:clamp(26px,3.4vw,40px);margin-bottom:8px}
.секція>p.лід{color:var(--текст-2);max-width:60ch;margin-bottom:40px}

/* Вибір класу */
.класи{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.клас-картка{position:relative;min-height:290px;display:flex;flex-direction:column;justify-content:flex-end;
  padding:32px;border:1px solid var(--лінія);border-radius:var(--r);overflow:hidden;transition:var(--пер)}
.клас-картка img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:grayscale(.7) brightness(.4);transition:var(--пер);z-index:-1}
.клас-картка::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,transparent 25%,var(--тло) 100%)}
.клас-картка:hover{border-color:var(--акцент)}
.клас-картка:hover img{filter:grayscale(.35) brightness(.55);transform:scale(1.03)}
.клас-картка b{font-family:"e-Ukraine Head";font-size:64px;line-height:.9;color:var(--акцент)}
.клас-картка span{font-size:15px;color:var(--текст-2);margin-top:10px}

/* Модулі */
.модулі{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1px;
  background:var(--лінія);border:1px solid var(--лінія)}
.модуль{background:var(--тло);padding:26px;display:flex;flex-direction:column;gap:12px;
  min-height:210px;transition:var(--пер);position:relative}
.модуль:hover{background:var(--тло-2)}
.модуль .н{font-family:"e-Ukraine Head";font-size:13px;color:var(--акцент);letter-spacing:.1em}
.модуль h3{font-size:19px;line-height:1.25}
.модуль .мета{margin-top:auto;display:flex;gap:16px;font-size:12.5px;color:var(--текст-3)}
.модуль.порожній{opacity:.45}
.модуль.порожній:hover{background:var(--тло)}
.бирка{display:inline-block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--лінія-2);color:var(--текст-3);padding:3px 8px;border-radius:var(--r)}
.бирка.готово{border-color:var(--акцент-тьмяний);color:var(--акцент)}
.бирка.частково{border-color:#5c6b52;color:#a8b89a}
.урок-рядок h3 .уточнення{display:block;font-size:14px;font-weight:400;color:var(--текст-3);margin-top:5px}
/* Заліковий тест — підсумок модуля, виділений акцентом */
.урок-рядок.залік{border-top:1px solid var(--акцент-тьмяний);background:linear-gradient(90deg,rgba(216,192,74,.07),transparent 62%)}
.урок-рядок.залік .н{color:var(--акцент);font-size:18px}
.урок-рядок.залік h3{color:var(--акцент)}
.урок-рядок.залік .мета{color:var(--акцент-тьмяний)}
.урок-рядок.залік:hover{background:linear-gradient(90deg,rgba(216,192,74,.13),transparent 62%)}

/* Уроки */
.уроки{border-top:1px solid var(--лінія)}
.урок-рядок{display:grid;grid-template-columns:64px 1fr auto;gap:20px;align-items:center;
  padding:20px 12px;border-bottom:1px solid var(--лінія);transition:var(--пер)}
.урок-рядок:hover{background:var(--тло-2);padding-left:20px}
.урок-рядок .н{font-family:"e-Ukraine Head";font-size:15px;color:var(--текст-3)}
.урок-рядок:hover .н{color:var(--акцент)}
.урок-рядок h3{font-size:16.5px;font-weight:500;font-family:"e-Ukraine"}
.урок-рядок .мета{font-size:12.5px;color:var(--текст-3);white-space:nowrap}

/* Хлібні крихти */
.крихти{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--текст-3);padding:22px 0}
.крихти a:hover{color:var(--акцент)}
.крихти span{color:var(--лінія-2)}

/* Сторінка уроку */
.урок-шапка{padding:20px 0 44px;border-bottom:1px solid var(--лінія)}
.урок-шапка .н{font-family:"e-Ukraine Head";color:var(--акцент);font-size:13px;letter-spacing:.1em}
.урок-шапка h1{font-size:clamp(28px,4vw,46px);margin-top:12px;max-width:22ch}
.урок-шапка .мета{display:flex;gap:24px;margin-top:22px;font-size:13px;color:var(--текст-3);flex-wrap:wrap}

.вкладки{display:flex;gap:2px;margin:36px 0 0;border-bottom:1px solid var(--лінія);flex-wrap:wrap}
.вкладки button{background:none;border:none;border-bottom:2px solid transparent;color:var(--текст-3);
  font:500 14px/1 "e-Ukraine";padding:14px 18px;cursor:pointer;transition:var(--пер)}
.вкладки button:hover{color:var(--текст)}
.вкладки button[aria-selected="true"]{color:var(--акцент);border-color:var(--акцент)}
.панель{display:none;padding:36px 0}
.панель.видно{display:block}

/* Слайдер */
.слайдер{position:relative;border:1px solid var(--лінія-2);border-radius:var(--r);background:var(--тло-2);overflow:hidden}
.слайд{display:none;padding:0;height:var(--вис-слайда);overflow:hidden}
.слайд.видно{display:flex;animation:зʼява .5s cubic-bezier(.16,1,.3,1)}
@keyframes зʼява{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.слайд h2{font-size:clamp(22px,2.8vw,34px);margin-bottom:22px;max-width:26ch}
.слайд ul{list-style:none;display:grid;gap:11px;max-width:66ch}
.слайд ul:has(li:nth-child(6)){gap:9px}
.слайд ul li{padding-left:22px;position:relative;color:var(--текст-2);font-size:16px}
.слайд ul li::before{content:"";position:absolute;left:0;top:11px;width:9px;height:1px;background:var(--акцент)}
.слайд p{color:var(--текст-2);max-width:66ch;margin-bottom:12px}
.слайд .схема{border-left:2px solid var(--акцент);background:var(--тло-3);padding:18px 22px;margin-top:22px;max-width:76ch}
.слайд .схема b{color:var(--акцент);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;display:block;margin-bottom:8px}
.слайд .схема p{color:var(--текст);font-size:14.5px;margin:0}
.кермо{display:flex;align-items:center;gap:18px;padding:16px 24px;border-top:1px solid var(--лінія);background:var(--тло)}
.кермо button{background:var(--тло-2);border:1px solid var(--лінія-2);color:var(--текст);border-radius:var(--r);
  width:40px;height:40px;cursor:pointer;font-size:17px;transition:var(--пер)}
.кермо button:hover:not(:disabled){border-color:var(--акцент);color:var(--акцент)}
.кермо button:disabled{opacity:.3;cursor:not-allowed}
.смуга{flex:1;height:2px;background:var(--лінія);position:relative}
.смуга i{position:absolute;left:0;top:0;height:100%;background:var(--акцент);transition:width var(--пер)}
.лічильник{font-family:"e-Ukraine Head";font-size:13px;color:var(--текст-3);min-width:64px;text-align:right}

/* Схеми, відео, перевірка */
.схеми{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.схема-картка{border:1px solid var(--лінія);border-radius:var(--r);padding:22px;background:var(--тло-2)}
.схема-картка b{display:block;color:var(--акцент);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}
.схема-картка p{font-size:14.5px;color:var(--текст-2)}
.відео-заглушка{border:1px dashed var(--лінія-2);border-radius:var(--r);padding:40px;text-align:center;color:var(--текст-3)}
.джерела{display:grid;gap:1px;background:var(--лінія);border:1px solid var(--лінія)}
.джерела a,.джерела div{background:var(--тло);padding:18px 22px;display:flex;justify-content:space-between;gap:16px;transition:var(--пер)}
.джерела a:hover{background:var(--тло-2);color:var(--акцент)}
.джерела .тип{font-size:12px;color:var(--текст-3);white-space:nowrap}
.питання{border-left:2px solid var(--лінія-2);padding:4px 0 4px 22px;margin-bottom:26px}
.питання b{display:block;margin-bottom:10px;font-weight:500}
.питання button{background:none;border:none;color:var(--акцент);font:400 13.5px "e-Ukraine";cursor:pointer;padding:0}
.питання button:hover{text-decoration:underline}
.питання .відповідь{display:none;margin-top:10px;color:var(--текст-2);font-size:15px}
.питання.розкрито .відповідь{display:block;animation:зʼява .3s}

/* Підвал */
footer{border-top:1px solid var(--лінія);padding:44px 0;margin-top:56px;color:var(--текст-3);font-size:13.5px}
footer .обгортка{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}

/* Поява при скролі */
.зʼявись{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.зʼявись.тут{opacity:1;transform:none}

@media (max-width:900px){
  .герой{grid-template-columns:1fr;gap:36px;padding:44px 0}
  .герой-фото{aspect-ratio:16/10;order:-1}
  .класи{grid-template-columns:1fr}
  .числа{gap:24px;flex-wrap:wrap}
  .слайд{padding:32px 24px}
  .шапка nav{display:none}
  .пошук input{width:150px}
  .пошук input:focus{width:190px}
  .знахідки{width:min(92vw,420px)}
  .урок-рядок{grid-template-columns:44px 1fr;gap:14px}
  .урок-рядок .мета{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .зʼявись{opacity:1;transform:none}
  html{scroll-behavior:auto}
}


/* ── Слайди: фіксований форм-фактор ── */
:root{--вис-слайда:clamp(460px,58vh,620px);--вис-тесту:clamp(540px,70vh,740px)}
.слайдер{position:relative}
.слайд.видно{display:block;animation:зʼява .45s cubic-bezier(.16,1,.3,1)}
.слайд-вміст{height:100%;padding:40px 52px;display:flex;flex-direction:column;justify-content:center;
  overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--лінія-2) transparent}
.слайд-вміст::-webkit-scrollbar{width:6px}
.слайд-вміст::-webkit-scrollbar-thumb{background:var(--лінія-2);border-radius:3px}
.слайд-вміст.з-медіа{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.слайд-вміст.дві-колонки{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:start}
.слайд h2{font-size:clamp(21px,2.5vw,31px);margin-bottom:18px;max-width:24ch}
.слайд .велике{font-family:"e-Ukraine Head";font-size:clamp(40px,5.6vw,72px);color:var(--акцент);line-height:.98;margin:6px 0 16px;text-wrap:balance}
.слайд-медіа{margin:0;min-width:0}
.слайд-медіа img{width:100%;max-height:calc(var(--вис-слайда) - 130px);object-fit:contain;border-radius:var(--r)}
.слайд-медіа figcaption{margin-top:12px;font-size:12.5px;color:var(--текст-3);text-align:center}
.схема-блок img{background:transparent}
.слайд.титул .слайд-вміст{display:grid;grid-template-columns:1.25fr .75fr;gap:44px;align-items:center}
.слайд.титул .мітка{font-family:"e-Ukraine Head";font-size:12px;letter-spacing:.12em;color:var(--акцент);margin-bottom:20px}
.слайд.титул h2{font-size:clamp(28px,3.9vw,44px);margin-bottom:10px}
.слайд .підзаг{font-family:"e-Ukraine Head";font-size:clamp(17px,2.2vw,25px);color:var(--акцент);margin-bottom:20px}
.слайд .мета-текст{font-size:16.5px;color:var(--текст-2);max-width:52ch}
.титул-фото{min-width:0;display:flex;align-items:center;justify-content:center}
.титул-фото img{width:100%;max-height:calc(var(--вис-слайда) - 120px);object-fit:contain;opacity:.95}
.титул-текст{min-width:0}
.план-список{margin-left:20px;display:grid;gap:11px;color:var(--текст-2);font-size:16px}
.цілі-блок{border-left:2px solid var(--акцент);padding-left:20px}
.цілі-блок b{display:block;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--текст-3);margin-bottom:12px}
.цілі-блок ul{list-style:none;display:grid;gap:10px}
.цілі-блок li{color:var(--текст-2);font-size:14.5px;padding-left:16px;position:relative}
.цілі-блок li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:1px;background:var(--акцент)}
.слайд.фінал{background:linear-gradient(160deg,var(--тло-3),var(--тло-2))}
.акцент{border-left:2px solid var(--акцент);background:var(--тло-3);padding:14px 18px;margin-top:18px;max-width:66ch;font-size:15px}
.кнопка-екран{width:40px;height:40px;background:var(--тло-2);border:1px solid var(--лінія-2);color:var(--текст);
  border-radius:var(--r);cursor:pointer;font-size:15px;transition:var(--пер)}
.кнопка-екран:hover{border-color:var(--акцент);color:var(--акцент)}
.слайдер:fullscreen{background:var(--тло);display:flex;flex-direction:column}
.слайдер:fullscreen .слайд{height:auto;flex:1}
.слайдер:fullscreen .слайд.видно{display:flex}
.слайдер:fullscreen .слайд-вміст{padding:5vh 7vw;max-height:none}
.слайдер:fullscreen .слайд h2{font-size:clamp(30px,3.6vw,52px)}
.слайдер:fullscreen .слайд li,.слайдер:fullscreen .слайд p{font-size:clamp(17px,1.7vw,24px)}
.слайдер:fullscreen .слайд-медіа img{max-height:60vh}

/* ── Конспект ── */
.конспект-сітка{display:grid;grid-template-columns:220px 1fr;gap:48px;align-items:start}
.конспект-зміст{position:sticky;top:88px;border-left:1px solid var(--лінія);padding-left:18px}
.конспект-зміст b{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--текст-3);margin-bottom:14px}
.конспект-зміст ol{list-style:none;display:grid;gap:9px;counter-reset:з}
.конспект-зміст li{counter-increment:з}
.конспект-зміст a{font-size:13.5px;color:var(--текст-2);transition:var(--пер);display:block}
.конспект-зміст a::before{content:counter(з) ". ";color:var(--текст-3)}
.конспект-зміст a:hover{color:var(--акцент)}
.конспект{max-width:70ch;font-size:16px}

/* ── Рівень 1: розділ ── */
.розділ+.розділ{margin-top:72px}
.розділ-шапка{display:flex;align-items:baseline;gap:16px;
  padding-bottom:14px;border-bottom:2px solid var(--лінія-2);margin-bottom:8px}
.розділ-н{font-family:"e-Ukraine Head";font-size:13px;letter-spacing:.08em;
  color:var(--акцент);flex:0 0 auto;padding-top:2px}
.конспект h3{font-size:24px;line-height:1.25;font-weight:600;color:var(--текст);margin:0;flex:1 1 auto}

/* ── Рівень 2: підтема ── */
.конспект h4.підтема{font-size:15px;font-weight:600;line-height:1.35;
  color:var(--акцент);letter-spacing:.01em;
  margin:34px 0 12px;padding-left:15px;position:relative}
.конспект h4.підтема::before{content:"";position:absolute;left:0;top:.15em;bottom:.15em;
  width:3px;background:var(--акцент);border-radius:2px}
.конспект h4.підтема.перша{margin-top:26px}

/* ── Рівень 3: абзаци ── */
.конспект p{color:var(--текст-2);line-height:1.75;margin:0 0 13px;padding-left:18px}
.конспект p:last-child{margin-bottom:0}
.конспект h4.підтема+p{color:var(--текст);margin-top:0}
.конспект-медіа{margin:30px 0 0;border:1px solid var(--лінія);border-radius:var(--r);padding:20px;background:var(--тло-2)}
.конспект-медіа img{width:100%}
.конспект-медіа.вузька img{max-width:380px;margin:0 auto}
.конспект-медіа figcaption{margin-top:12px;font-size:12.5px;color:var(--текст-3);text-align:center}

/* ── Матеріали ── */
.блок-заголовок{font-size:20px;margin-bottom:20px}
.джерела-сітка{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:18px}
.джерело{border:1px solid var(--лінія);border-radius:var(--r);padding:24px;background:var(--тло-2);display:flex;flex-direction:column;gap:10px}
.джерело-тип{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--акцент)}
.джерело h4{font-size:16px;line-height:1.3;font-weight:500}
.джерело p{font-size:14px;color:var(--текст-2)}
.джерело .гриф{font-size:12px;color:var(--текст-3)}
.кнопка.мала{padding:10px 18px;font-size:13.5px;margin-top:auto;align-self:flex-start}
.ілюстрації{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.ілюстрація{margin:0;border:1px solid var(--лінія);border-radius:var(--r);overflow:hidden;background:var(--тло-2)}
.ілюстрація img{width:100%;aspect-ratio:4/3;object-fit:contain;background:var(--тло-3);padding:10px}
.ілюстрація figcaption{padding:14px 16px;font-size:12.5px;color:var(--текст-2);line-height:1.5}

/* ── Тест ── */
.анкета{border:1px solid var(--лінія-2);border-radius:var(--r);padding:34px;background:var(--тло-2);max-width:640px}
.анкета h3{font-size:22px;margin-bottom:8px}
.анкета .лід{margin-bottom:24px}
.анкета .поля{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:26px}
.анкета label{font-size:13px;color:var(--текст-2)}
.анкета input{display:block;width:100%;margin-top:7px;background:var(--тло);border:1px solid var(--лінія-2);
  border-radius:var(--r);color:var(--текст);font:400 15px "e-Ukraine";padding:11px 13px}
.анкета input:focus{outline:none;border-color:var(--акцент)}
.тест-кермо{display:flex;align-items:center;gap:18px;margin-top:28px;border-top:1px solid var(--лінія);padding-top:20px}
.лічильник-т{font-size:12.5px;color:var(--текст-3);margin-left:auto;margin-right:auto}
.варіант.обрано{border-color:var(--акцент);background:rgba(216,192,74,.1)}
.розбори{display:grid;gap:16px;max-width:80ch}
.розбір{border:1px solid var(--лінія);border-left-width:2px;border-radius:var(--r);padding:22px;background:var(--тло-2)}
.розбір.ок{border-left-color:var(--акцент)}
.розбір.не-ок{border-left-color:var(--тривога)}
.розбір-шапка{display:flex;gap:12px;align-items:center;margin-bottom:12px}
.розбір .номер{font-family:"e-Ukraine Head";font-size:12px;color:var(--текст-3)}
.розбір .вердикт{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}
.розбір.ок .вердикт{color:var(--акцент)}
.розбір.не-ок .вердикт{color:var(--тривога)}
.розбір b{display:block;font-weight:500;margin-bottom:14px;font-size:16px}
.варіанти-розбір{display:grid;gap:6px;margin-bottom:14px}
.варіанти-розбір .рядок{display:flex;justify-content:space-between;gap:12px;padding:9px 13px;
  border:1px solid var(--лінія);border-radius:var(--r);font-size:14.5px;color:var(--текст-3)}
.варіанти-розбір .вірна{border-color:var(--акцент);color:var(--текст);background:rgba(216,192,74,.08)}
.варіанти-розбір .обрана-хибна{border-color:var(--тривога);color:var(--текст)}
.варіанти-розбір i{font-style:normal;font-size:11px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;opacity:.8}
.розбір .чому{font-size:14px;color:var(--текст-2);border-top:1px solid var(--лінія);padding-top:12px}
.розбір .чому.підказка{color:var(--текст-3);font-style:italic}
/* Оцінка за 12-бальною шкалою — головна цифра підсумку */
.бал12{display:flex;align-items:baseline;gap:12px;margin-top:18px;padding-top:18px;
  border-top:1px solid var(--лінія)}
.бал12-цифра{font-family:"e-Ukraine Head";font-size:44px;line-height:1;color:var(--акцент)}
.бал12-підпис{font-size:14px;color:var(--текст-2);max-width:26ch}
.підсумок .бал{display:flex;align-items:baseline;gap:10px}
.підсумок .бал b{font-family:"e-Ukraine Head";font-size:60px;color:var(--акцент);line-height:1}
.підсумок .бал span{color:var(--текст-3)}
.підсумок .оцінка{font-size:19px;margin-top:8px}
.підсумок .учень-рядок{color:var(--текст-3);font-size:13.5px;margin-top:6px}
.тест{border:1px solid var(--лінія-2);border-radius:var(--r);padding:32px;background:var(--тло-2);max-width:76ch}
.тест-шапка{display:flex;justify-content:space-between;font-size:12.5px;color:var(--текст-3);margin-bottom:12px}
.тест-смуга{height:2px;background:var(--лінія);margin-bottom:28px}
.тест-смуга i{display:block;height:100%;background:var(--акцент);transition:width var(--пер)}
.тест-питання{font-size:21px;margin-bottom:18px;line-height:1.32}
.варіанти{display:grid;gap:9px}
.варіант{text-align:left;background:var(--тло);border:1px solid var(--лінія-2);border-radius:var(--r);
  color:var(--текст);font:400 15.5px/1.42 "e-Ukraine";padding:13px 18px;cursor:pointer;transition:var(--пер)}
.варіант:hover{border-color:var(--акцент);background:var(--тло-3)}
.вікно-дії{display:flex;gap:12px}
@media print{.шапка,.вкладки,.крихти,footer,.дії,.тест-кермо{display:none!important}
  body{background:#fff;color:#000}.тест,.розбір{border:1px solid #999;background:#fff}}
@media (max-width:900px){
  :root{--вис-слайда:auto;--вис-тесту:auto}
  .слайд{height:auto}
  .слайд-вміст,.слайд-вміст.з-медіа,.слайд-вміст.дві-колонки,.слайд.титул .слайд-вміст{
    display:block;padding:28px 22px}
  .слайд-медіа{margin-top:22px}
  .конспект-сітка{grid-template-columns:1fr;gap:24px}
  .конспект-зміст{position:static}
  .анкета .поля{grid-template-columns:1fr}
}

/* ── Слайд зі схемою: на всю ширину ── */
.слайд-вміст.стос{display:flex;flex-direction:column;gap:10px;justify-content:flex-start;
  padding:20px 36px 20px}
.слайд-вміст.стос .шапка-слайда{flex:0 0 auto}
.слайд-вміст.стос .шапка-слайда h2{margin-bottom:2px;font-size:24px;line-height:1.2;max-width:none}
.слайд-вміст.стос .шапка-слайда p{color:var(--текст-2);max-width:96ch;font-size:14.5px;line-height:1.4}
.слайд-вміст.стос .слайд-медіа{flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center}
/* схема тягнеться по ширині; висота рахується з пропорції й обрізається рамкою слайда */
.слайд-вміст.стос .слайд-медіа img{width:100%;height:auto;max-height:100%;max-width:100%;object-fit:contain}
/* Збільшення по кліку */
.слайд-медіа img,.конспект-медіа img,.ілюстрація img{cursor:zoom-in}
.лупа{position:fixed;inset:0;z-index:60;background:rgba(6,9,8,.94);display:none;
  align-items:center;justify-content:center;padding:3vh 3vw;cursor:zoom-out}
.лупа.видно{display:flex;animation:зʼява .25s}
.лупа img{max-width:100%;max-height:94vh;object-fit:contain}
.лупа-підпис{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:var(--текст-2);font-size:13.5px;padding:0 24px}
.слайдер:fullscreen .слайд-вміст.стос{padding:4vh 6vw 2vh}
.слайдер:fullscreen .слайд-вміст.стос .шапка-слайда p{font-size:clamp(16px,1.5vw,22px)}

/* ── Тест: стала висота і повний екран ── */
#тест.іде .тест.сталий{height:var(--вис-тесту);display:flex;flex-direction:column;padding:0;max-width:none}
.тест.сталий .тест-верх{padding:26px 32px 0;flex:0 0 auto}
.тест.сталий .тест-тіло{flex:1 1 auto;min-height:0;overflow-y:auto;padding:24px 32px;
  display:flex;flex-direction:column;
  scrollbar-width:thin;scrollbar-color:var(--лінія-2) transparent}
.тест.сталий .тест-центр{margin-block:auto;width:100%}
.тест.сталий .тест-тіло::-webkit-scrollbar{width:6px}
.тест.сталий .тест-тіло::-webkit-scrollbar-thumb{background:var(--лінія-2);border-radius:3px}
.тест.сталий .тест-питання{margin-bottom:16px;max-width:60ch}
.тест.сталий .варіанти{max-width:60ch}
.тест.сталий .тест-кермо{margin:0;padding:16px 24px;border-top:1px solid var(--лінія);
  background:var(--тло);flex:0 0 auto}
.тест-кермо .кнопка-екран{margin-left:6px}
/* На екрані питань усередині один блок, на екрані результатів — три
   (бал, заголовок, розбори). Без column вони шикуються в рядок і наїжджають. */
#тест:fullscreen{background:var(--тло);padding:0;display:flex;flex-direction:column;
  align-items:stretch;overflow-y:auto}
#тест:fullscreen .тест.підсумок{margin:5vh 8vw 0;max-width:none;flex:0 0 auto}
#тест:fullscreen .блок-заголовок{margin:44px 8vw 20px;flex:0 0 auto}
#тест:fullscreen .розбори{padding:0 8vw 8vh;max-width:none;flex:0 0 auto}
#тест:fullscreen .вихід-екран{position:fixed;top:18px;right:22px;z-index:5}
#тест:fullscreen .тест.сталий{height:100vh;width:100%;border:none;border-radius:0}
#тест:fullscreen .тест-верх{padding:4vh 8vw 0}
#тест:fullscreen .тест-тіло{padding:3vh 8vw}
#тест:fullscreen .тест-питання{font-size:clamp(24px,2.6vw,40px);max-width:26ch}
#тест:fullscreen .варіант{font-size:clamp(16px,1.5vw,23px);padding:clamp(14px,1.6vh,22px) 24px;max-width:none}
#тест:fullscreen .варіанти{max-width:none;gap:14px}
#тест:fullscreen .тест-кермо{padding:2vh 8vw}
@media (max-width:900px){
  #тест.іде .тест.сталий{height:auto}
  .тест.сталий .тест-тіло{overflow:visible;padding:20px 18px}
  .тест.сталий .тест-верх{padding:20px 18px 0}
  .тест.сталий .тест-кермо{padding:14px 18px;flex-wrap:wrap}
  .лічильник-т{order:3;width:100%;text-align:center;margin:8px 0 0}
}

/* Низькі екрани (ноутбуки 13"): слайд стискається до 460px — підтягуємо щільність,
   щоб довгі переліки не вилазили за фіксовану висоту. */
@media (max-height:780px){
  .слайд-вміст{padding:32px 44px}
  .слайд ul{gap:9px}
  .слайд ul:has(li:nth-child(6)){gap:7px}
  .слайд ul li{font-size:15px}
  .слайд ul li::before{top:10px}
  .слайд .велике{font-size:clamp(36px,4.8vw,60px)}
  .тест.сталий .тест-тіло{padding:18px 28px}
  .тест.сталий .тест-питання{font-size:19px;margin-bottom:16px}
  .варіанти{gap:8px}
  .варіант{padding:12px 16px;font-size:15px}
}

/* Класна контрольна робота */
.контрольна-картка{display:block;padding:30px;border:1px solid var(--акцент-тьмяний);border-radius:var(--r);
  background:linear-gradient(120deg,rgba(216,192,74,.09),transparent 60%);transition:var(--пер)}
.контрольна-картка:hover{background:linear-gradient(120deg,rgba(216,192,74,.16),transparent 60%)}
.контрольна-картка .н{font-family:"e-Ukraine Head";font-size:13px;color:var(--акцент);letter-spacing:.1em}
.контрольна-картка h3{font-size:24px;margin:12px 0 8px}
.контрольна-картка p{color:var(--текст-2);font-size:15px;max-width:70ch}
.контрольна-картка .мета{display:flex;gap:18px;margin-top:16px;font-size:12.5px;color:var(--акцент-тьмяний)}

/* Теоретичне питання */
.теорія-поле{width:100%;background:var(--тло);border:1px solid var(--лінія-2);border-radius:var(--r);
  color:var(--текст);font:inherit;font-size:16px;line-height:1.6;padding:14px 16px;resize:vertical}
.теорія-поле:focus{outline:none;border-color:var(--акцент)}
.теорія-лічильник{margin-top:8px;font-size:12.5px;color:var(--текст-3)}
.теорія-підсумок{margin-top:24px;text-align:left;padding:22px;border:1px solid var(--акцент-тьмяний);
  border-radius:var(--r);background:rgba(216,192,74,.05)}
.теорія-підсумок .теорія-мітка{font-family:"e-Ukraine Head";font-size:12px;letter-spacing:.1em;
  color:var(--акцент);margin-bottom:10px}
.теорія-підсумок b{display:block;font-size:17px;line-height:1.35;margin-bottom:12px}
.теорія-відповідь{white-space:pre-wrap;color:var(--текст-2);font-size:15px;line-height:1.65}
.теорія-джерело{margin-top:12px;font-size:12.5px;color:var(--текст-3)}

/* Журнал результатів */
.анкета.заборона{border-color:var(--акцент-тьмяний);background:linear-gradient(140deg,rgba(216,192,74,.07),var(--тло-2) 60%)}
.заборона-бал{display:flex;align-items:baseline;gap:12px;margin-top:18px}
.заборона-бал b{font-family:"e-Ukraine Head";font-size:44px;color:var(--акцент);line-height:1}
.заборона-бал span{font-size:14px;color:var(--текст-2)}
.журнал-мітка{margin-top:14px;font-size:12.5px;color:var(--текст-3)}