diff --git a/batys-shygys-turik.html b/batys-shygys-turik.html
new file mode 100644
index 0000000..ae7a8dd
--- /dev/null
+++ b/batys-shygys-turik.html
@@ -0,0 +1,417 @@
+<!-- no-design-system -->
+<!DOCTYPE html>
+<html lang="kk" data-theme="auto">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>ҰБТ: Батыс және Шығыс Түрік қағанаттары</title>
+<link rel="stylesheet" href="design-system/kt-ai-fonts.css">
+<link rel="stylesheet" href="design-system/kt-ai-tokens.css">
+<link rel="stylesheet" href="design-system/kt-ai-components.css">
+<link rel="stylesheet" href="design-system/kt-ai-page.css">
+<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>⚔️</text></svg>">
+<style>
+  .kt-ai-hero { background: linear-gradient(135deg, var(--kt-ai-bg-soft) 0%, var(--kt-ai-bg) 100%); }
+  .question-card { margin-bottom: var(--kt-ai-space-6); }
+  .options-grid { display: grid; gap: var(--kt-ai-space-3); margin-top: var(--kt-ai-space-5); }
+  .option-btn { text-align: left; justify-content: flex-start; padding-left: var(--kt-ai-space-4); }
+  .option-btn::before { content: ''; width: 24px; height: 24px; border-radius: 50%; border: 2px solid var(--kt-ai-fg-muted); margin-right: var(--kt-ai-space-3); flex-shrink: 0; display: inline-block; vertical-align: middle; }
+  .option-btn[data-selected="true"]::before { background: var(--kt-ai-primary); border-color: var(--kt-ai-primary); }
+  .option-btn.correct { background: #dcfce7 !important; border-color: #22c55e !important; color: #166534; }
+  .option-btn.wrong { background: #fee2e2 !important; border-color: #ef4444 !important; color: #991b1b; }
+  .score-display { font-size: var(--kt-ai-text-3xl); font-weight: var(--kt-ai-weight-bold); color: var(--kt-ai-primary); margin: var(--kt-ai-space-6) 0; }
+  .progress-bar { height: 8px; background: var(--kt-ai-bg-soft); border-radius: var(--kt-ai-radius-full); overflow: hidden; margin-bottom: var(--kt-ai-space-5); }
+  .progress-fill { height: 100%; background: var(--kt-ai-primary); transition: width 0.3s ease; }
+  .hidden { display: none; }
+  .fade-in { animation: fadeIn 0.4s ease; }
+  @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
+  .timer-badge { display: inline-flex; align-items: center; gap: var(--kt-ai-space-2); padding: var(--kt-ai-space-2) var(--kt-ai-space-4); background: var(--kt-ai-bg-soft); border-radius: var(--kt-ai-radius-lg); font-weight: var(--kt-ai-weight-semibold); }
+  .timer-badge.warning { background: #fef3c7; color: #92400e; }
+  .timer-badge.danger { background: #fee2e2; color: #991b1b; }
+  .stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--kt-ai-space-4); margin-bottom: var(--kt-ai-space-6); }
+  .stat-card { text-align: center; padding: var(--kt-ai-space-4); background: var(--kt-ai-bg-soft); border-radius: var(--kt-ai-radius-xl); }
+  .stat-value { font-size: var(--kt-ai-text-2xl); font-weight: var(--kt-ai-weight-bold); color: var(--kt-ai-primary); }
+  .stat-label { font-size: var(--kt-ai-text-sm); color: var(--kt-ai-fg-muted); }
+  .welcome-text { font-size: var(--kt-ai-text-lg); color: var(--kt-ai-fg-muted); margin-bottom: var(--kt-ai-space-3); }
+  .name-input { max-width: 400px; margin: var(--kt-ai-space-6) auto; }
+  .answer-feedback { margin-top: var(--kt-ai-space-4); padding: var(--kt-ai-space-3); border-radius: var(--kt-ai-radius-lg); font-weight: var(--kt-ai-weight-medium); }
+  .answer-feedback.correct { background: #dcfce7; color: #166534; }
+  .answer-feedback.wrong { background: #fee2e2; color: #991b1b; }
+</style>
+</head>
+<body>
+
+<header class="kt-ai-pagehead">
+  <div class="kt-ai-wrap kt-ai-pagehead-in">
+    <strong>⚔️ Батыс және Шығыс Түрік қағанаттары</strong>
+    <span class="kt-ai-spacer"></span>
+    <span id="header-user-name" style="color: var(--kt-ai-primary); font-weight: var(--kt-ai-weight-semibold);"></span>
+    <span class="kt-ai-spacer"></span>
+    <a class="kt-ai-btn" data-variant="ghost" href="index.html">Басқа тест</a>
+    <button class="kt-ai-btn" data-variant="ghost" onclick="showStartScreen()">Қайта бастау</button>
+  </div>
+</header>
+
+<section class="kt-ai-hero" data-align="center">
+  <div class="kt-ai-wrap">
+    <h1>Батыс және Шығыс Түрік қағанаттары</h1>
+    <p class="kt-ai-hero-sub">Біліміңді тексер және қайталауды ұмытпа!</p>
+    
+    <div id="login-section" style="max-width: 400px; margin: var(--kt-ai-space-6) auto;">
+      <div class="kt-ai-field">
+        <label>Аты-жөніңізді енгізіңіз:</label>
+        <input class="kt-ai-input" id="user-name" placeholder="Мысалы: Алиев Арман" type="text">
+      </div>
+      <button class="kt-ai-btn" data-variant="primary" data-size="lg" onclick="startQuiz()" style="margin-top: var(--kt-ai-space-4);">Тестілеуді бастау</button>
+    </div>
+    
+    <div id="welcome-section" class="hidden">
+      <p class="welcome-text">Қош келдіңіз, <strong id="user-display-name" style="color: var(--kt-ai-primary); font-weight: var(--kt-ai-weight-bold);"></strong>!</p>
+      <button class="kt-ai-btn" data-variant="primary" data-size="lg" onclick="startQuiz()">Тестілеуді бастау</button>
+    </div>
+  </div>
+</section>
+
+<section id="quiz-section" class="kt-ai-section hidden">
+  <div class="kt-ai-wrap" data-width="narrow">
+    <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--kt-ai-space-4);">
+      <div class="timer-badge" id="timer">
+        ⏱️ <span id="timer-value">00:00</span>
+      </div>
+      <div style="color: var(--kt-ai-fg-muted);">Сұрақ <span id="q-current">1</span> / <span id="q-total">60</span></div>
+    </div>
+    
+    <div class="progress-bar">
+      <div class="progress-fill" id="progress"></div>
+    </div>
+    
+    <div class="kt-ai-card question-card fade-in">
+      <h2 id="question-text" style="margin-bottom: var(--kt-ai-space-5); font-size: var(--kt-ai-text-xl);">Сұрақ мәтіні</h2>
+      <div class="options-grid" id="options-container"></div>
+      <div id="answer-feedback" class="answer-feedback hidden"></div>
+    </div>
+    
+    <div style="display: flex; gap: var(--kt-ai-space-3); justify-content: space-between; margin-top: var(--kt-ai-space-6);">
+      <button class="kt-ai-btn" data-variant="ghost" id="prev-btn" onclick="prevQuestion()">← Артқа</button>
+      <button class="kt-ai-btn" data-variant="primary" id="next-btn" onclick="nextQuestion()">Алға →</button>
+    </div>
+  </div>
+</section>
+
+<section id="result-section" class="kt-ai-section hidden">
+  <div class="kt-ai-wrap" data-width="narrow">
+    <div class="kt-ai-card" style="text-align: center">
+      <h2>Тестілеу аяқталды!</h2>
+      <div class="stats-grid">
+        <div class="stat-card">
+          <div class="stat-value" id="correct-count">0</div>
+          <div class="stat-label">Дұрыс жауап</div>
+        </div>
+        <div class="stat-card">
+          <div class="stat-value" id="wrong-count">0</div>
+          <div class="stat-label">Қате жауап</div>
+        </div>
+        <div class="stat-card">
+          <div class="stat-value" id="percentage">0%</div>
+          <div class="stat-label">Нәтиже</div>
+        </div>
+      </div>
+      <div class="score-display" id="score">0 / 60</div>
+      <p id="score-message" style="color: var(--kt-ai-fg-muted); margin-bottom: var(--kt-ai-space-6); font-size: var(--kt-ai-text-lg);"></p>
+      
+      <div class="kt-ai-hero-actions">
+        <button class="kt-ai-btn" data-variant="primary" data-size="lg" onclick="showStartScreen()">Қайта тапсыру</button>
+        <a class="kt-ai-btn" data-variant="ghost" data-size="lg" href="index.html" style="margin-left: var(--kt-ai-space-3);">Басқа тест</a>
+      </div>
+    </div>
+  </div>
+</section>
+
+<footer class="kt-ai-wrap kt-ai-pagefoot">
+  <span>ҰБТ 2027 жыл | Айбек Бахытжанұлы</span>
+  <span class="kt-ai-spacer"></span>
+  <span>Сәттілік тілейміз!</span>
+</footer>
+
+<script>
+const QUESTIONS = [
+  { q: "Қазақстан тарихында VI–IX ғасырларды қамтитын кезең қалай аталады?", options: ["Ежелгі дәуір", "Ерте орта ғасыр", "Дамыған орта ғасыр", "Кейінгі орта ғасыр"], correct: 1 },
+  { q: "Түрік қағанаты қай жылы екіге бөлінді?", options: ["552 жылы", "603 жылы", "610 жылы", "682 жылы"], correct: 1 },
+  { q: "Түрік қағанатының екіге бөлінуінің негізгі себептерінің бірі:", options: ["Арабтардың шапқыншылығы", "Моңғолдардың шабуылы", "Ішкі талас-тартыс және Қытай шапқыншылығы", "Егіншіліктің тоқтауы"], correct: 2 },
+  { q: "Батыс түркілердің өз мемлекетін құруының саяси себебі қандай болды?", options: ["Сауда жолдарын бақылау", "Қаған әулеттерінің дербес билікке ұмтылуы", "Мал шаруашылығын дамыту", "Қытаймен бейбіт келісім жасау"], correct: 1 },
+  { q: "Батыс түркілердің жеке мемлекет құруының экономикалық себебі:", options: ["Әр өлкенің шаруашылық ерекшелігі", "Қытайдың салық саясаты", "Сауда жолдарының жабылуы", "Қалалардың жойылуы"], correct: 0 },
+  { q: "Батыс Түрік қағанатының халқы қандай бірлестікке бірікті?", options: ["Үш жүз", "Тоғыз оғыз", "Он оқ тайпа одағы", "Қарлұқ бірлестігі"], correct: 2 },
+  { q: "«Он оқ» жүйесінде бір тайпа қанша әскер шығарды?", options: ["5 мың", "10 мың", "20 мың", "50 мың"], correct: 1 },
+  { q: "Әр «оқты» кім басқарды?", options: ["Тудун", "Шад", "Қолбасы", "Би"], correct: 2 },
+  { q: "Әр «оқтың» қандай ерекшелігі болды?", options: ["Өз қаласы болды", "Өз әскери жалауы болды", "Өз теңгесі болды", "Өз ордасы болды"], correct: 1 },
+  { q: "Батыс Түрік қағанатының аумақтық өзегі қай жерде қалыптасты?", options: ["Алтайда", "Жетісуда", "Моңғолияда", "Сырдарияның төменгі ағысында"], correct: 1 },
+  { q: "Батыс Түрік қағанатының қысқы ордасы орналасқан қала:", options: ["Баласағұн", "Тараз", "Суяб", "Испиджаб"], correct: 2 },
+  { q: "Суяб қаласы қай өзеннің алқабында орналасты?", options: ["Іле", "Ертіс", "Шу", "Сырдария"], correct: 2 },
+  { q: "Батыс Түрік қағанатының жазғы ордасы орналасқан жер:", options: ["Мыңбұлақ", "Өтікен", "Суяб", "Қаратау"], correct: 0 },
+  { q: "Мыңбұлақ қай жердің маңында орналасқан?", options: ["Тараз", "Түркістан", "Алматы", "Балқаш"], correct: 1 },
+  { q: "Жетісу Батыс Түрік қағанатының аумақтық өзегіне айналуының басты себебі:", options: ["Мұнда алтын кендері көп болды", "Барлық керуен жолдары түйісті", "Қытай астанасына жақын болды", "Тек мал шаруашылығы дамыды"], correct: 1 },
+  { q: "«Он оқ бұдун» тайпаларының қаншасы Дулу тайпасынан тұрды?", options: ["3", "4", "5", "7"], correct: 2 },
+  { q: "«Он оқ бұдун» құрамындағы Нушеби тайпаларының саны:", options: ["2", "3", "5", "10"], correct: 2 },
+  { q: "Дулу тайпалары негізінен қай аймақта орналасты?", options: ["Шу өзенінің батысында", "Шу өзенінің шығысында", "Сырдарияның батысында", "Каспий теңізінің маңында"], correct: 1 },
+  { q: "Нушеби тайпалары мекендеген аймақ:", options: ["Шу өзенінің батысы", "Шу өзенінің шығысы", "Алтайдың шығысы", "Іленің солтүстігі"], correct: 0 },
+  { q: "Қытай деректерінде Иштеми қаған қалай аталды?", options: ["Ұлы қаған", "Он тайпа қағаны", "Шығыс қағаны", "Жетісу қағаны"], correct: 1 },
+  { q: "Иштеми қағанның әскері қанша адам болған?", options: ["50 мың", "70 мың", "100 мың", "200 мың"], correct: 2 },
+  { q: "Л.Н. Гумилевтің зерттеуінше, Иштеми қағаннан кейін билікке кім келді?", options: ["Тон-ябғу", "Шегу", "Тардуш Дато", "Ешбар Елтеріс"], correct: 2 },
+  { q: "Батыс Түрік қағанатының алғашқы қағаны:", options: ["Иштеми", "Тардуш Дато", "Шегу", "Тон-ябғу"], correct: 1 },
+  { q: "Тардуш Дато тұсында қандай тарихи жағдай орын алды?", options: ["Қағанат Қытайға тәуелді болды", "Батыс Түрік қағанаты түпкілікті жеке мемлекетке айналды", "Түрік қағанаты қайта құрылды", "Ашина әулеті жойылды"], correct: 1 },
+  { q: "Батыс Түрік қағанаты қай қағандар тұсында VII ғасырдың бірінші жартысында өркендеді?", options: ["Құтлық пен Қапаған", "Білге мен Күлтегін", "Шегу мен Тон-ябғу", "Тардуш пен Иштеми"], correct: 2 },
+  { q: "Шегу қаған қай жылдары билік құрды?", options: ["552–603 жж.", "610–618 жж.", "618–630 жж.", "716–731 жж."], correct: 1 },
+  { q: "Тон-ябғу қағанның билік құрған жылдары:", options: ["603–610 жж.", "610–618 жж.", "618–630 жж.", "630–650 жж."], correct: 2 },
+  { q: "Тон-ябғу тұсында Орталық Азия мемлекеттеріне қандай жағдай қалыптасты?", options: ["Қағанаттың бақылауынан шықты", "Қатаң бақылау орнықты", "Қытайға қосылды", "Тәуелсіз мемлекеттерге айналды"], correct: 1 },
+  { q: "Тон-ябғу қаған қол астындағы иеліктерге кімдерді жіберді?", options: ["Шадтарды", "Тудундарды", "Қолбасшыларды", "Билерді"], correct: 1 },
+  { q: "Қытай шежірешісі Тон-ябғу билігі туралы қандай пікір айтты?", options: ["Түркілер әлсіз болды", "Батыс варварлары ешқашан дәл осындай қуатты болған жоқ", "Қағанат Қытайға тәуелді болды", "Түркілердің қалалары болмады"], correct: 1 },
+  { q: "«Он тайпа – он оқ бұдун» жүйесін енгізген қаған:", options: ["Иштеми", "Тон-ябғу", "Ешбар Елтеріс", "Құтлық"], correct: 2 },
+  { q: "«Он оқ бұдун» әскери жүйесінде барлығы қанша түмен болды?", options: ["5", "10", "20", "100"], correct: 1 },
+  { q: "Бір түмендегі әскер саны:", options: ["1 мың", "5 мың", "10 мың", "20 мың"], correct: 2 },
+  { q: "Батыс Түрік қағанатында қандай шаруашылық жүйесі біртұтас дамыды?", options: ["Тек көшпелі мал шаруашылығы", "Тек отырықшы егіншілік", "Көшпелі және отырықшы-егіншілік", "Тек қолөнер"], correct: 2 },
+  { q: "Батыс Түрік қағанаты халқының негізгі кәсіптерінің бірі ЕМЕС:", options: ["Қолөнер", "Сауда", "Егіншілік", "Теңіз кәсіпшілігі"], correct: 3 },
+  { q: "VI–VIII ғасырларда Шу алқабында шамамен қанша ірі қала мен қоныс болды?", options: ["5-ке жуық", "10-ға жуық", "20-ға жуық", "50-ге жуық"], correct: 2 },
+  { q: "Шу алқабындағы қалаларда қоныстанған халықтардың бірі:", options: ["Түркілер", "Римдіктер", "Византиялықтар", "Славяндар"], correct: 0 },
+  { q: "Батыс Түрік қағанатына тәуелді болған ортаазиялық мемлекеттерді анықтаңыз.", options: ["Хорезм, Ферғана, Шаш", "Қытай, Үндістан, Иран", "Хазар, Оғыз, Қимақ", "Соғды, Қытай, Моңғолия"], correct: 0 },
+  { q: "Батыс Түрік қағанатында ақша соғу ісін кімдер жүзеге асырды?", options: ["Түркілер", "Парсылар", "Соғдылықтар", "Қытайлар"], correct: 2 },
+  { q: "VII ғасырдағы Қытай саяхатшысы Жетісу туралы қандай мәлімет қалдырды?", options: ["Жер өңдеушілер мен қолөнершілердің көп екенін жазды", "Қалалардың толық қирағанын жазды", "Халықтың тек мал шаруашылығымен айналысқанын жазды", "Жетісуда халық болмағанын жазды"], correct: 0 },
+  { q: "Түркі қағандары жаулап алынған жерлерде қандай саясат жүргізді?", options: ["Бұрынғы тәртіпті толығымен өзгертті", "Бұрыннан бар тәртіпті сақтап, салық алумен шектелді", "Халықты түгел көшірді", "Қалаларды қиратты"], correct: 1 },
+  { q: "Қаған билігін әлсіреткен негізгі факторлардың бірі:", options: ["Қолөнердің дамуы", "Тайпалар арасындағы қырқыс", "Сауданың өсуі", "Қалалардың көбеюі"], correct: 1 },
+  { q: "Батыс Түрік қағанатының әлсіреуін пайдаланған мемлекет:", options: ["Хазар қағанаты", "Қытайдың Таң империясы", "Оғыз мемлекеті", "Қимақ қағанаты"], correct: 1 },
+  { q: "Батыс Түрік қағанатының орнына Жетісуда қандай мемлекет құрылды?", options: ["Оғыз мемлекеті", "Қимақ қағанаты", "Түргеш мемлекеті", "Хазар қағанаты"], correct: 2 },
+  { q: "682 жылы қандай тарихи оқиға болды?", options: ["Батыс Түрік қағанаты құрылды", "Шығыс түркілер мемлекетін қайта құрды", "Хазар қағанаты жойылды", "Тон-ябғу билікке келді"], correct: 1 },
+  { q: "Шығыс Түрік қағанаты қай аумақта құрылды?", options: ["Жетісуда", "Моңғолия аумағында", "Қазақстанның батысында", "Солтүстік Кавказда"], correct: 1 },
+  { q: "Шығыс Түрік қағанатының орталығы:", options: ["Суяб", "Мыңбұлақ", "Өтікен", "Тараз"], correct: 2 },
+  { q: "Шығыс Түрік қағанатының алғашқы қағаны:", options: ["Білге", "Құтлық", "Қапаған", "Күлтегін"], correct: 1 },
+  { q: "716 жылы Шығыс Түрік қағанатының билеушісі болған:", options: ["Қапаған", "Құтлық", "Білге қаған", "Тон-ябғу"], correct: 2 },
+  { q: "Білге қағанның інісі және Түрік қағанатын қайта өркендетуге үлес қосқан тұлға:", options: ["Иштеми", "Күлтегін", "Шегу", "Ешбар Елтеріс"], correct: 1 },
+  { q: "744 жылы Шығыс Түрік қағанатын талқандаған күштер:", options: ["Қытай мен Хазарлар", "Оғыздар мен Қимақтар", "Ұйғыр және қарлұқ күштері", "Соғдылар мен парсылар"], correct: 2 },
+  { q: "Шығыс Түрік қағанаты Қапаған қаған тұсында қай аймақты бағындырды?", options: ["Батыс Қазақстанды", "Орталық Азияны", "Жетісуды", "Солтүстік Кавказды"], correct: 1 },
+  { q: "Білге қаған Қытайға қарсы қай жылы соғысты?", options: ["716 жылы", "723 жылы", "731 жылы", "744 жылы"], correct: 1 },
+  { q: "Білге қағанның Қытаймен соғыстағы жеңісінің нәтижесі:", options: ["Қытай Түрік қағанатын жаулап алды", "Түріктер Қытайға толық тәуелді болды", "Ұтымды бейбіт келісімге қол жеткізілді", "Шығыс Түрік қағанаты жойылды"], correct: 2 },
+  { q: "Қытай императоры Түрік ордасына не жіберді?", options: ["Алтын мен күміс", "Үлкен көлемде жібек", "Әскер мен қару", "Азық-түлік"], correct: 1 },
+  { q: "Білге мен Күлтегінге арналған құлпытастар қай жерде орнатылды?", options: ["Шу өзені бойында", "Орхон өзені маңында", "Алтай тауларында", "Сырдария бойында"], correct: 1 },
+  { q: "Шығыс Түрік қағанатының орталығы Өтікен қай жерде орналасты?", options: ["Алтай тауларында", "Хангай тауларында", "Қаратау тауларында", "Тянь-Шань тауларында"], correct: 1 },
+  { q: "Білге қаған мен Күлтегін қай мемлекетті қайта өркендетті?", options: ["Батыс Түрік қағанатын", "Хазар қағанатын", "Түрік қағанатын", "Түргеш қағанатын"], correct: 2 },
+  { q: "Күлтегін қай жылы дүние салды?", options: ["716 жылы", "723 жылы", "731 жылы", "744 жылы"], correct: 2 },
+  { q: "Күлтегін қайтыс болғаннан кейін көп ұзамай кім дүние салды?", options: ["Қапаған қаған", "Білге қаған", "Құтлық қаған", "Тардуш Дато"], correct: 1 },
+  { q: "744 жылы Шығыс Түрік қағанаты талқандалғаннан кейін қандай әулеттің өмір сүруі тоқтады?", options: ["Ашина әулеті", "Дулу әулеті", "Нушеби әулеті", "Қарлұқ әулеті"], correct: 0 }
+];
+
+let currentQuestion = 0;
+let answers = {};
+let quizStarted = false;
+let timerInterval = null;
+let seconds = 0;
+let userName = '';
+let answered = false;
+let shuffledQuestions = [];
+
+function shuffleArray(array) {
+  const shuffled = [...array];
+  for (let i = shuffled.length - 1; i > 0; i--) {
+    const j = Math.floor(Math.random() * (i + 1));
+    [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];
+  }
+  return shuffled;
+}
+
+function checkLogin() {
+  const savedName = localStorage.getItem('ebtUserName');
+  if (savedName) {
+    userName = savedName;
+    document.getElementById('login-section').classList.add('hidden');
+    document.getElementById('welcome-section').classList.remove('hidden');
+    document.getElementById('user-display-name').textContent = userName;
+    document.getElementById('header-user-name').textContent = userName;
+  }
+}
+
+function showStartScreen() {
+  document.getElementById('quiz-section').classList.add('hidden');
+  document.getElementById('result-section').classList.add('hidden');
+  document.querySelector('.kt-ai-hero').classList.remove('hidden');
+  quizStarted = false;
+  stopTimer();
+  checkLogin();
+}
+
+function startTimer() {
+  seconds = 0;
+  timerInterval = setInterval(() => {
+    seconds++;
+    const mins = Math.floor(seconds / 60);
+    const secs = seconds % 60;
+    document.getElementById('timer-value').textContent = 
+      (mins < 10 ? '0' : '') + mins + ':' + (secs < 10 ? '0' : '') + secs;
+    
+    const badge = document.getElementById('timer');
+    if (seconds > 600) {
+      badge.className = 'timer-badge danger';
+    } else if (seconds > 300) {
+      badge.className = 'timer-badge warning';
+    }
+  }, 1000);
+}
+
+function stopTimer() {
+  if (timerInterval) {
+    clearInterval(timerInterval);
+    timerInterval = null;
+  }
+  document.getElementById('timer').className = 'timer-badge';
+}
+
+function startQuiz() {
+  const nameInput = document.getElementById('user-name');
+  if (nameInput && nameInput.value.trim()) {
+    userName = nameInput.value.trim();
+    localStorage.setItem('ebtUserName', userName);
+    document.getElementById('user-display-name').textContent = userName;
+    document.getElementById('header-user-name').textContent = userName;
+  }
+  
+  if (!userName) {
+    alert('Аты-жөніңізді енгізіңіз!');
+    return;
+  }
+  
+  document.querySelector('.kt-ai-hero').classList.add('hidden');
+  document.getElementById('result-section').classList.add('hidden');
+  document.getElementById('quiz-section').classList.remove('hidden');
+  quizStarted = true;
+  currentQuestion = 0;
+  answers = {};
+  seconds = 0;
+  shuffledQuestions = shuffleArray(QUESTIONS);
+  startTimer();
+  document.getElementById('q-total').textContent = shuffledQuestions.length;
+  showQuestion();
+}
+
+function showQuestion() {
+  const q = shuffledQuestions[currentQuestion];
+  document.getElementById('q-current').textContent = currentQuestion + 1;
+  document.getElementById('question-text').textContent = q.q;
+  
+  const container = document.getElementById('options-container');
+  container.innerHTML = '';
+  
+  const feedback = document.getElementById('answer-feedback');
+  feedback.className = 'answer-feedback hidden';
+  answered = answers[currentQuestion] !== undefined;
+  
+  const letters = ['A', 'B', 'C', 'D'];
+  q.options.forEach((opt, i) => {
+    const btn = document.createElement('button');
+    btn.className = 'kt-ai-btn option-btn';
+    btn.setAttribute('data-selected', answers[currentQuestion] === i);
+    btn.innerHTML = `<span style="font-weight: bold; margin-right: 8px;">${letters[i]})</span> ${opt}`;
+    btn.onclick = () => selectAnswer(i);
+    
+    if (answered) {
+      btn.disabled = true;
+      if (i === q.correct) {
+        btn.classList.add('correct');
+      } else if (answers[currentQuestion] === i && i !== q.correct) {
+        btn.classList.add('wrong');
+      }
+    } else {
+      if (answers[currentQuestion] === i) {
+        btn.style.borderColor = 'var(--kt-ai-primary)';
+        btn.style.background = 'var(--kt-ai-bg-soft)';
+      } else {
+        btn.style.borderColor = 'var(--kt-ai-border)';
+        btn.style.background = 'var(--kt-ai-card-bg)';
+      }
+    }
+    container.appendChild(btn);
+  });
+  
+  if (answered) {
+    const isCorrect = answers[currentQuestion] === q.correct;
+    feedback.textContent = isCorrect ? '✅ Дұрыс!' : '❌ Қате! Дұрыс жауап: ' + letters[q.correct] + ') ' + q.options[q.correct];
+    feedback.className = 'answer-feedback ' + (isCorrect ? 'correct' : 'wrong');
+    feedback.classList.remove('hidden');
+  }
+  
+  updateProgress();
+  updateButtons();
+}
+
+function selectAnswer(index) {
+  if (answered) return;
+  answers[currentQuestion] = index;
+  showQuestion();
+}
+
+function nextQuestion() {
+  if (currentQuestion < QUESTIONS.length - 1) {
+    currentQuestion++;
+    showQuestion();
+  } else {
+    showResults();
+  }
+}
+
+function prevQuestion() {
+  if (currentQuestion > 0) {
+    currentQuestion--;
+    answered = false;
+    showQuestion();
+  }
+}
+
+function updateProgress() {
+  const progress = ((currentQuestion + 1) / QUESTIONS.length) * 100;
+  document.getElementById('progress').style.width = progress + '%';
+}
+
+function updateButtons() {
+  document.getElementById('prev-btn').style.visibility = currentQuestion === 0 ? 'hidden' : 'visible';
+  const nextBtn = document.getElementById('next-btn');
+  nextBtn.textContent = currentQuestion === QUESTIONS.length - 1 ? 'Аяқтау' : 'Алға →';
+}
+
+function showResults() {
+  stopTimer();
+  
+  let correct = 0;
+  let wrong = 0;
+  shuffledQuestions.forEach((q, i) => {
+    if (answers[i] === q.correct) {
+      correct++;
+    } else {
+      wrong++;
+    }
+  });
+  
+  const percentage = Math.round((correct / shuffledQuestions.length) * 100);
+  
+  document.getElementById('quiz-section').classList.add('hidden');
+  document.getElementById('result-section').classList.remove('hidden');
+  document.getElementById('correct-count').textContent = correct;
+  document.getElementById('wrong-count').textContent = wrong;
+  document.getElementById('percentage').textContent = percentage + '%';
+  document.getElementById('score').textContent = `${correct} / ${QUESTIONS.length}`;
+  
+  let message = '';
+  if (percentage >= 90) message = 'Өте жақсы! ҰБТ-ға дайынсың 🎉';
+  else if (percentage >= 70) message = 'Жақсы нәтиже! 👍';
+  else if (percentage >= 50) message = 'Жаман емес, бірақ жақсартуға болады 👌';
+  else message = 'Әлі де дайындалу керек 📚';
+  
+  document.getElementById('score-message').textContent = message + ' | Уақыт: ' + document.getElementById('timer-value').textContent;
+}
+
+document.addEventListener('keydown', (e) => {
+  if (!quizStarted) return;
+  if (e.key === 'ArrowRight' || e.key === ' ') nextQuestion();
+  if (e.key === 'ArrowLeft') prevQuestion();
+});
+
+checkLogin();
+</script>
+
+</body>
+</html>
