Главная Обзор Помощь
Вход
u23-27burdyko
/
anti_Slakbaym
1
0
Ответвить 0
Файлы Задачи 0 Запросы на слияние 0 Вики
Ветка: master
Ветки Метки
anti_Slakbaym
/
slakbaum.html

slakbaum.html 105 KB
Постоянная ссылка История Исходник

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390 
  1. <!DOCTYPE html>
    2. 

  2. <html lang="ru">
    3. 

  3. <head>
    4. 

  4. <meta charset="UTF-8">
    5. 

  5. <title>КПП-3 · СКУД · Пост охраны</title>
    6. 

  6. <style>
    7. 

  7.   * { box-sizing: border-box; margin: 0; padding: 0; }
    8. 

  8.   html, body { height: 100%; overflow: hidden; background: #050810;
    9. 

  9.     color: #a8b8c8; font-family: "Courier New", monospace; font-size: 13px; }
    10. 

  10.   .app { height: 100vh; display: flex; flex-direction: column; }
    11. 

  11.   header { display: flex; align-items: center; gap: 20px; padding: 8px 20px;
    12. 

  12.     background: linear-gradient(180deg, #202830, #10161e);
    13. 

  13.     border-bottom: 1px solid #000; flex-shrink: 0; }
    14. 

  14.   .brand { color: #ffd060; font-weight: bold; letter-spacing: 2px;
    15. 

  15.     font-size: 14px; text-shadow: 0 0 10px rgba(255,208,96,.5); }
    16. 

  16.   .brand small { color: #506080; font-weight: normal; letter-spacing: 1px;
    17. 

  17.     font-size: 10px; margin-left: 8px; }
    18. 

  18.   .model-badge { color: #80e0ff; font-size: 11px; letter-spacing: 1px;
    19. 

  19.     border: 1px solid #2a4a6a; padding: 3px 8px; border-radius: 2px;
    20. 

  20.     background: rgba(64,160,224,.08); }
    21. 

  21.   .header-status { display: flex; align-items: center; gap: 10px; margin-left: auto; }
    22. 

  22.   .clock { color: #6090c0; letter-spacing: 2px; font-size: 13px; }
    23. 

  23.   .sys-status { display: flex; align-items: center; gap: 8px;
    24. 

  24.     color: #40d080; font-weight: bold; font-size: 12px; letter-spacing: 1px; }
    25. 

  25.   .sys-status .led { width: 10px; height: 10px; border-radius: 50%;
    26. 

  26.     background: #40d080; box-shadow: 0 0 10px #40d080; }
    27. 

  27.   .sys-status.alarm { color: #ff4040; }
    28. 

  28.   .sys-status.alarm .led { background: #ff4040;
    29. 

  29.     box-shadow: 0 0 15px #ff4040; animation: blink .4s infinite; }
    30. 

  30.   .sys-status.wait { color: #ffb040; }
    31. 

  31.   .sys-status.wait .led { background: #ffb040; box-shadow: 0 0 10px #ffb040; }
    32. 

  32.   .sys-status.pause { color: #60a0e0; }
    33. 

  33.   .sys-status.pause .led { background: #60a0e0; box-shadow: 0 0 10px #60a0e0; }
    34. 

  34.   .sys-status.senior { color: #a0c8ff; }
    35. 

  35.   .sys-status.senior .led { background: #a0c8ff; box-shadow: 0 0 10px #a0c8ff; }
    36. 

  36.   @keyframes blink { 50% { opacity: .2; } }
    37. 

  37. 

  38.   .log-toggle {
    39. 

  39.     background: linear-gradient(180deg, #1a2028, #101418);
    40. 

  40.     color: #a0c0e0; border: 1px solid #304050;
    41. 

  41.     border-radius: 3px; padding: 5px 12px;
    42. 

  42.     font-family: inherit; font-size: 11px; letter-spacing: 1.2px;
    43. 

  43.     cursor: pointer; transition: all .15s; margin-left: 8px;
    44. 

  44.   }
    45. 

  45.   .log-toggle:hover { border-color: #4080c0; color: #c0e0ff;
    46. 

  46.     box-shadow: 0 0 10px rgba(96,160,224,.3); }
    47. 

  47.   .log-toggle.has-alarm { border-color: #702020; color: #ffb0b0;
    48. 

  48.     animation: blink 1s infinite; }
    49. 

  49. 

  50.   main { flex: 1; display: grid; grid-template-columns: 1fr 420px; min-height: 0; }
    51. 

  51.   .stage { position: relative; background: #02040a; overflow: hidden; }
    52. 

  52.   .stage canvas { display: block; width: 100%; height: 100%; }
    53. 

  53.   aside { background: #0a0e14; border-left: 1px solid #1a2028;
    54. 

  54.     display: flex; flex-direction: column; overflow-y: auto; }
    55. 

  55.   aside .section { border-bottom: 1px solid #1a2028; flex-shrink: 0; }
    56. 

  56.   aside .section h3 { padding: 8px 14px; background: #080c12; color: #6070a0;
    57. 

  57.     font-size: 10.5px; letter-spacing: 2px; font-weight: normal;
    58. 

  58.     border-bottom: 1px solid #1a2028; }
    59. 

  59.   aside .content { padding: 10px 12px; }
    60. 

  60. 

  61.   .model-switcher { display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
    62. 

  62.     padding: 10px 12px; }
    63. 

  63.   .model-btn {
    64. 

  64.     background: linear-gradient(180deg, #10161e, #0a0e14);
    65. 

  65.     border: 1px solid #2a3442; border-radius: 3px;
    66. 

  66.     padding: 8px 8px; cursor: pointer; transition: all .15s;
    67. 

  67.     font-family: inherit; color: #8090a8; text-align: left;
    68. 

  68.     font-size: 10.5px; line-height: 1.35;
    69. 

  69.   }
    70. 

  70.   .model-btn:hover { border-color: #4080c0; background: #0f1822; color: #c0d0e0; }
    71. 

  71.   .model-btn.active {
    72. 

  72.     border-color: #40d080; color: #c0f0d0;
    73. 

  73.     background: linear-gradient(180deg, #10201a, #0a1a14);
    74. 

  74.     box-shadow: 0 0 12px rgba(64,208,128,.25), inset 0 0 8px rgba(64,208,128,.08);
    75. 

  75.   }
    76. 

  76.   .model-btn .mb-code { display: block; color: #ffd060; font-weight: bold;
    77. 

  77.     font-size: 12px; letter-spacing: 1.5px; margin-bottom: 2px; }
    78. 

  78.   .model-btn .mb-name { display: block; color: #80e0ff; font-size: 10px;
    79. 

  79.     margin-bottom: 3px; }
    80. 

  80.   .model-btn .mb-spec { display: block; color: #506080; font-size: 9.5px; }
    81. 

  81.   .model-btn.active .mb-spec { color: #80a0c0; }
    82. 

  82. 

  83.   .passport-grid { display: grid; grid-template-columns: 1fr 1fr;
    84. 

  84.     gap: 3px 12px; font-size: 11px; }
    85. 

  85.   .passport-row { display: flex; justify-content: space-between;
    86. 

  86.     padding: 3px 0; border-bottom: 1px dashed #1a2028; }
    87. 

  87.   .passport-row .pk { color: #607890; }
    88. 

  88.   .passport-row .pv { color: #a0d0ff; font-weight: bold; }
    89. 

  89.   .passport-title { color: #ffd060; font-size: 12.5px;
    90. 

  90.     font-weight: bold; letter-spacing: 1.5px; margin-bottom: 8px; }
    91. 

  91.   .passport-sub { color: #80e0ff; font-size: 10.5px;
    92. 

  92.     letter-spacing: 1px; margin-bottom: 8px; }
    93. 

  93.   .passport-desc { color: #8090a8; font-size: 10.5px;
    94. 

  94.     line-height: 1.5; margin-bottom: 10px;
    95. 

  95.     padding: 6px 8px; background: #060a10; border-left: 2px solid #2a4a6a;
    96. 

  96.     border-radius: 2px; }
    97. 

  97.   .terminal-list { display: flex; flex-wrap: wrap; gap: 4px;
    98. 

  98.     margin-top: 8px; }
    99. 

  99.   .terminal-chip { font-size: 9.5px; padding: 2px 6px;
    100. 

  100.     border-radius: 2px; background: #060a10; border: 1px solid #2a3442;
    101. 

  101.     color: #8090a8; letter-spacing: .5px; }
    102. 

  102.   .terminal-chip.on { background: rgba(64,208,128,.12); color: #80e0a0;
    103. 

  103.     border-color: rgba(64,208,128,.5); }
    104. 

  104.   .terminal-chip.alarm { background: rgba(255,64,64,.12); color: #ff8080;
    105. 

  105.     border-color: rgba(255,64,64,.5); }
    106. 

  106. 

  107.   .skud-group { margin-bottom: 12px; }
    108. 

  108.   .skud-group:last-child { margin-bottom: 0; }
    109. 

  109.   .skud-group-title { color: #4a5a70; font-size: 9.5px;
    110. 

  110.     letter-spacing: 1.5px; margin-bottom: 6px;
    111. 

  111.     padding-bottom: 3px; border-bottom: 1px solid #141c24; }
    112. 

  112. 

  113.   .skud-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px;
    114. 

  114.     font-size: 11px; }
    115. 

  115.   .skud-row { display: flex; align-items: center; gap: 6px; padding: 3px 0;
    116. 

  116.     color: #8090a0; }
    117. 

  117.   .skud-led { width: 9px; height: 9px; border-radius: 50%;
    118. 

  118.     background: #1a2028; border: 1px solid #2a3442; flex-shrink: 0;
    119. 

  119.     transition: all .1s; }
    120. 

  120.   .skud-led.on { background: #40d080; box-shadow: 0 0 8px #40d080; border-color: #40d080; }
    121. 

  121.   .skud-led.red { background: #ff4040; box-shadow: 0 0 8px #ff4040; border-color: #ff4040; }
    122. 

  122.   .skud-led.yel { background: #ffb040; box-shadow: 0 0 8px #ffb040; border-color: #ffb040; }
    123. 

  123.   .skud-led.blu { background: #60a0e0; box-shadow: 0 0 8px #60a0e0; border-color: #60a0e0; }
    124. 

  124.   .skud-led.blink { animation: blink .5s infinite; }
    125. 

  125. 

  126.   .fsm-table { background: #060a10; border: 1px solid #1a2028;
    127. 

  127.     border-radius: 2px; padding: 8px 10px; }
    128. 

  128.   .fsm-row { display: flex; justify-content: space-between;
    129. 

  129.     padding: 3px 0; font-size: 11px; }
    130. 

  130.   .fsm-k { color: #607890; }
    131. 

  131.   .fsm-v { color: #80e0ff; font-weight: bold; letter-spacing: .5px; }
    132. 

  132. 

  133.   .scope-canvas { display: block; width: 100%;
    134. 

  134.     background: #04060a; border: 1px solid #1a2028; border-radius: 2px;
    135. 

  135.     image-rendering: pixelated; }
    136. 

  136. 

  137.   .passes-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    138. 

  138.   .pass-card { background: #060a10; border: 1px solid #202836;
    139. 

  139.     border-radius: 3px; padding: 8px 10px; font-size: 11.5px; }
    140. 

  140.   .pass-card .head { color: #506080; font-size: 9.5px; letter-spacing: 1.5px;
    141. 

  141.     margin-bottom: 6px; text-transform: uppercase; }
    142. 

  142.   .pass-card .num { color: #ffd060; font-weight: bold; font-size: 15px;
    143. 

  143.     letter-spacing: 1px; margin-bottom: 4px; }
    144. 

  144.   .pass-card .name { color: #c0d0e0; margin-bottom: 4px; font-size: 11px; line-height: 1.3; }
    145. 

  145.   .pass-card .dept { color: #607890; font-size: 10px; margin-bottom: 6px; }
    146. 

  146.   .pass-card .status { padding: 3px 6px; border-radius: 2px; font-size: 10px;
    147. 

  147.     letter-spacing: 1px; text-align: center; display: inline-block; }
    148. 

  148.   .pass-card .status.ok { background: rgba(64,208,128,.15); color: #40d080;
    149. 

  149.     border: 1px solid rgba(64,208,128,.4); }
    150. 

  150.   .pass-card .status.bad { background: rgba(255,64,64,.15); color: #ff6060;
    151. 

  151.     border: 1px solid rgba(255,64,64,.4); }
    152. 

  152.   .pass-card .status.empty { background: rgba(80,90,110,.1); color: #506080;
    153. 

  153.     border: 1px dashed #303848; }
    154. 

  154.   .decision-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
    155. 

  155.     padding: 10px 12px; border-bottom: 1px solid #1a2028; }
    156. 

  156.   button.big { background: linear-gradient(180deg, #1a2028, #101418);
    157. 

  157.     color: #c0d0e0; border: 1px solid #304050;
    158. 

  158.     border-radius: 3px; padding: 12px 10px;
    159. 

  159.     font-family: inherit; font-size: 12.5px; letter-spacing: 1.5px;
    160. 

  160.     cursor: pointer; transition: all .15s; font-weight: bold; }
    161. 

  161.   button.big.allow { border-color: #206030; color: #80e0a0; }
    162. 

  162.   button.big.allow:hover:not(:disabled) {
    163. 

  163.     background: linear-gradient(180deg, #204830, #103020); border-color: #40d080; }
    164. 

  164.   button.big.deny { border-color: #702020; color: #ffb0b0; }
    165. 

  165.   button.big.deny:hover:not(:disabled) {
    166. 

  166.     background: linear-gradient(180deg, #401818, #200808); border-color: #ff4040; }
    167. 

  167.   button.big:disabled { opacity: .3; cursor: not-allowed; }
    168. 

  168.   .action-buttons { padding: 10px 12px; display: flex; flex-direction: column;
    169. 

  169.     gap: 6px; border-bottom: 1px solid #1a2028; }
    170. 

  170.   button.ctrl { background: linear-gradient(180deg, #1a2028, #101418);
    171. 

  171.     color: #c0d0e0; border: 1px solid #304050;
    172. 

  172.     border-radius: 2px; padding: 8px 12px;
    173. 

  173.     font-family: inherit; font-size: 11.5px; letter-spacing: .5px;
    174. 

  174.     cursor: pointer; transition: all .15s; }
    175. 

  175.   button.ctrl:hover:not(:disabled) { background: linear-gradient(180deg, #243040, #182028);
    176. 

  176.     border-color: #4080c0; }
    177. 

  177.   button.ctrl:disabled { opacity: .35; cursor: not-allowed; }
    178. 

  178.   button.ctrl.primary { border-color: #4060a0; color: #a0d0ff; }
    179. 

  179.   button.ctrl.danger { border-color: #702020; color: #ffb0b0; }
    180. 

  180.   button.ctrl.green { border-color: #206030; color: #80e0a0; }
    181. 

  181.   button.ctrl.yel { border-color: #706020; color: #ffd060; }
    182. 

  182.   button.ctrl.red { border-color: #702020; color: #ffb0b0; }
    183. 

  183.   button.ctrl.active { background: linear-gradient(180deg, #2a3a4a, #1a2028);
    184. 

  184.     border-color: #60a0e0; color: #c0e0ff; box-shadow: 0 0 8px rgba(96,160,224,.4); }
    185. 

  185. 

  186.   .ctrl-panel-grid { display: grid; grid-template-columns: 1fr 1fr 1fr;
    187. 

  187.     gap: 6px; padding: 10px 12px; }
    188. 

  188.   .ctrl-panel-grid button { padding: 10px 4px; font-size: 11px;
    189. 

  189.     letter-spacing: 1px; font-weight: bold; }
    190. 

  190.   .mode-row { display: flex; gap: 6px; padding: 0 12px 10px; }
    191. 

  191.   .mode-row button { flex: 1; padding: 7px 4px; font-size: 10.5px; }
    192. 

  192. 

  193.   .cond-row { display: flex; align-items: center; gap: 8px;
    194. 

  194.     padding: 6px 0; font-size: 11.5px; color: #8090a0; }
    195. 

  195.   .cond-row label { min-width: 60px; color: #607890; }
    196. 

  196.   .cond-row select {
    197. 

  197.     flex: 1; background: #060a10; color: #c0d0e0;
    198. 

  198.     border: 1px solid #304050; border-radius: 2px;
    199. 

  199.     padding: 5px 8px; font-family: inherit; font-size: 11.5px;
    200. 

  200.     cursor: pointer; }
    201. 

  201. 

  202.   .log { overflow-y: auto; padding: 8px 12px;
    203. 

  203.     font-size: 10.5px; line-height: 1.7; }
    204. 

  204.   .log .entry { color: #8090a8; }
    205. 

  205.   .log .entry.warn { color: #ffb040; }
    206. 

  206.   .log .entry.alarm { color: #ff4040; font-weight: bold; }
    207. 

  207.   .log .entry.ok { color: #40d080; }
    208. 

  208.   .log .entry.info { color: #60a0e0; }
    209. 

  209.   .log .entry.senior { color: #a0c8ff; font-weight: bold; }
    210. 

  210.   .log .entry.skud { color: #80e0ff; }
    211. 

  211.   .log .entry .time { color: #405060; margin-right: 6px; }
    212. 

  212. 

  213.   .log-full { max-height: 60vh; min-height: 300px;
    214. 

  214.     background: #060a10; border: 1px solid #1a2028; border-radius: 3px;
    215. 

  215.     padding: 12px 14px; font-size: 11.5px; line-height: 1.8; }
    216. 

  216. 

  217.   .hint { padding: 8px 12px; background: rgba(96,160,224,.08);
    218. 

  218.     border-left: 2px solid #4080c0; color: #a0c0e0;
    219. 

  219.     font-size: 11px; line-height: 1.5; }
    220. 

  220.   .hint b { color: #ffd060; }
    221. 

  221.   .modal { position: fixed; inset: 0; background: rgba(0,0,0,.85);
    222. 

  222.     display: none; align-items: center; justify-content: center;
    223. 

  223.     z-index: 100; padding: 20px; }
    224. 

  224.   .modal.on { display: flex; }
    225. 

  225.   .modal-content {
    226. 

  226.     background: linear-gradient(180deg, #1a2230, #0d141c);
    227. 

  227.     border: 2px solid #3a4858;
    228. 

  228.     border-radius: 4px;
    229. 

  229.     box-shadow: 0 0 0 1px #000, 0 20px 60px rgba(0,0,0,.9);
    230. 

  230.     padding: 24px 28px; width: min(640px, 100%);
    231. 

  231.     max-height: 90vh; overflow-y: auto;
    232. 

  232.     color: #c0d0e0; font-family: "Courier New", monospace; }
    233. 

  233.   .modal-content h2 {
    234. 

  234.     color: #ffd060; font-size: 16px; letter-spacing: 2px;
    235. 

  235.     margin-bottom: 20px; text-align: center;
    236. 

  236.     text-shadow: 0 0 10px rgba(255,208,96,.4); }
    237. 

  237.   .modal-content .row {
    238. 

  238.     display: flex; justify-content: space-between;
    239. 

  239.     padding: 8px 0; border-bottom: 1px solid #1a2028;
    240. 

  240.     font-size: 12.5px; }
    241. 

  241.   .modal-content .row:last-of-type { border-bottom: none; }
    242. 

  242.   .modal-content .row .k { color: #8090a0; }
    243. 

  243.   .modal-content .row .v { color: #a0d0ff; font-weight: bold; }
    244. 

  244.   .modal-content .row .v.good { color: #40d080; }
    245. 

  245.   .modal-content .row .v.bad { color: #ff6060; }
    246. 

  246.   .modal-content button {
    247. 

  247.     display: block; margin: 20px auto 0;
    248. 

  248.     padding: 10px 30px; font-family: inherit;
    249. 

  249.     font-size: 13px; letter-spacing: 1.5px;
    250. 

  250.     background: linear-gradient(180deg, #1a2028, #101418);
    251. 

  251.     color: #c0d0e0; border: 1px solid #4060a0;
    252. 

  252.     border-radius: 3px; cursor: pointer; }
    253. 

  253.   .modal-content button:hover { background: linear-gradient(180deg, #243040, #182028); }
    254. 

  254.   .refuse-menu {
    255. 

  255.     display: none; padding: 10px 12px;
    256. 

  256.     background: rgba(200,80,80,.08);
    257. 

  257.     border-top: 1px solid rgba(255,64,64,.3);
    258. 

  258.     border-bottom: 1px solid #1a2028; }
    259. 

  259.   .refuse-menu.on { display: block; }
    260. 

  260.   .refuse-menu .title {
    261. 

  261.     font-size: 10.5px; color: #ffb040; letter-spacing: 1.5px;
    262. 

  262.     margin-bottom: 8px; }
    263. 

  263.   .refuse-menu button.ctrl {
    264. 

  264.     width: 100%; margin-bottom: 5px;
    265. 

  265.     text-align: left; font-size: 11.5px; padding: 7px 10px; }
    266. 

  266.   .refuse-menu button.ctrl:last-child { margin-bottom: 0; }
    267. 

  267. </style>
    268. 

  268. </head>
    269. 

  269. <body>
    270. 

  270. 

  271. <div class="app">
    272. 

  272.   <header>
    273. 

  273.     <div class="brand">◤ КПП-3<small>СКУД · ПОСТ ОХРАНЫ</small></div>
    274. 

  274.     <div class="model-badge" id="modelBadge">МОДЕЛЬ: —</div>
    275. 

  275.     <div class="header-status">
    276. 

  276.       <div class="clock" id="clock">--:--:--</div>
    277. 

  277.       <div class="sys-status" id="sysStatus"><span class="led"></span><span id="sysStatusText">ПОСТ СВОБОДЕН</span></div>
    278. 

  278.       <button class="log-toggle" id="btnLogToggle" title="Журнал событий (F2)">☰ ЖУРНАЛ</button>
    279. 

  279.     </div>
    280. 

  280.   </header>
    281. 

  281. 

  282.   <main>
    283. 

  283.     <div class="stage"><canvas id="cv"></canvas></div>
    284. 

  284.     <aside>
    285. 

  285.       <div class="section">
    286. 

  286.         <h3>ПАСПОРТ МОДЕЛИ · ТЕХНИЧЕСКИЕ ХАРАКТЕРИСТИКИ</h3>
    287. 

  287.         <div class="content" id="modelPassport"></div>
    288. 

  288.       </div>
    289. 

  289. 

  290.       <div class="section">
    291. 

  291.         <h3>МОДЕЛЬ ШЛАГБАУМА · ПЕРЕКЛЮЧАТЕЛЬ</h3>
    292. 

  292.         <div class="model-switcher" id="modelSwitcher"></div>
    293. 

  293.       </div>
    294. 

  294. 

  295.       <div class="section">
    296. 

  296.         <h3>СТАНЦИЯ СКУД · ИНДИКАЦИЯ</h3>
    297. 

  297.         <div class="content">
    298. 

  298.           <div class="skud-group">
    299. 

  299.             <div class="skud-group-title">ПИТАНИЕ И ПРИВОД</div>
    300. 

  300.             <div class="skud-grid">
    301. 

  301.               <div class="skud-row"><span class="skud-led" id="ledPower"></span>ПИТАНИЕ 24V</div>
    302. 

  302.               <div class="skud-row"><span class="skud-led" id="ledArmState"></span>СОСТОЯНИЕ ПРИВОДА</div>
    303. 

  303.             </div>
    304. 

  304.           </div>
    305. 

  305.           <div class="skud-group">
    306. 

  306.             <div class="skud-group-title">КОНЦЕВЫЕ ВЫКЛЮЧАТЕЛИ</div>
    307. 

  307.             <div class="skud-grid">
    308. 

  308.               <div class="skud-row"><span class="skud-led" id="ledKW1"></span>КВ-1 · СТРЕЛА ВНИЗ</div>
    309. 

  309.               <div class="skud-row"><span class="skud-led" id="ledKW2"></span>КВ-2 · СТРЕЛА ВВЕРХ</div>
    310. 

  310.             </div>
    311. 

  311.           </div>
    312. 

  312.           <div class="skud-group">
    313. 

  313.             <div class="skud-group-title">ДАТЧИКИ И ПЕТЛИ</div>
    314. 

  314.             <div class="skud-grid">
    315. 

  315.               <div class="skud-row"><span class="skud-led" id="ledLoop1"></span>ПЕТЛЯ 1 · ВХОД</div>
    316. 

  316.               <div class="skud-row"><span class="skud-led" id="ledLoop2"></span>ПЕТЛЯ 2 · ВЫХОД</div>
    317. 

  317.               <div class="skud-row"><span class="skud-led" id="ledPhoto"></span>ФОТОЭЛЕМЕНТ</div>
    318. 

  318.               <div class="skud-row"><span class="skud-led" id="ledImpact"></span>ДАТЧИК УДАРА</div>
    319. 

  319.             </div>
    320. 

  320.           </div>
    321. 

  321.           <div class="skud-group">
    322. 

  322.             <div class="skud-group-title">РЕЛЕ КОНТРОЛЛЕРА</div>
    323. 

  323.             <div class="skud-grid">
    324. 

  324.               <div class="skud-row"><span class="skud-led" id="ledRelayOpen"></span>РЕЛЕ 1 · OPEN</div>
    325. 

  325.               <div class="skud-row"><span class="skud-led" id="ledRelayClose"></span>РЕЛЕ 2 · CLOSE</div>
    326. 

  326.               <div class="skud-row"><span class="skud-led" id="ledRelayStop"></span>РЕЛЕ 3 · STOP</div>
    327. 

  327.               <div class="skud-row"><span class="skud-led" id="ledPass"></span>СИГНАЛ ПРОПУСКА</div>
    328. 

  328.             </div>
    329. 

  329.           </div>
    330. 

  330. 

  331.           <div class="skud-group">
    332. 

  332.             <div class="skud-group-title">ТАБЛО СОСТОЯНИЙ КОНТРОЛЛЕРА</div>
    333. 

  333.             <div class="fsm-table">
    334. 

  334.               <div class="fsm-row"><span class="fsm-k">Состояние:</span>
    335. 

  335.                 <span class="fsm-v" id="fsmState">IDLE</span></div>
    336. 

  336.               <div class="fsm-row"><span class="fsm-k">Таймер автозакрытия:</span>
    337. 

  337.                 <span class="fsm-v" id="fsmTimer">0.0 / 0.0 с</span></div>
    338. 

  338.               <div class="fsm-row"><span class="fsm-k">Позиция стрелы:</span>
    339. 

  339.                 <span class="fsm-v" id="fsmLevel">0 %</span></div>
    340. 

  340.               <div class="fsm-row"><span class="fsm-k">Активных тревог:</span>
    341. 

  341.                 <span class="fsm-v" id="fsmAlarms">0</span></div>
    342. 

  342.             </div>
    343. 

  343.           </div>
    344. 

  344. 

  345.           <div class="skud-group">
    346. 

  346.             <div class="skud-group-title">ОСЦИЛЛОГРАММА СИГНАЛОВ · REALTIME</div>
    347. 

  347.             <canvas id="scopeCanvas" class="scope-canvas" width="360" height="90"></canvas>
    348. 

  348.           </div>
    349. 

  349.         </div>
    350. 

  350.       </div>
    351. 

  351. 

  352.       <div class="section">
    353. 

  353.         <h3>ПУЛЬТ ОПЕРАТОРА</h3>
    354. 

  354.         <div class="ctrl-panel-grid">
    355. 

  355.           <button class="ctrl green" id="btnOpen">▲ ОТКР</button>
    356. 

  356.           <button class="ctrl red"   id="btnClose">▼ ЗАКР</button>
    357. 

  357.           <button class="ctrl yel"   id="btnStop">■ СТОП</button>
    358. 

  358.         </div>
    359. 

  359.         <div class="mode-row">
    360. 

  360.           <button class="ctrl" id="btnHold">УДЕРЖАНИЕ</button>
    361. 

  361.           <button class="ctrl" id="btnMode">РЕЖИМ: АВТО</button>
    362. 

  362.           <button class="ctrl" id="btnResetAlarm">СБРОС АВАРИИ</button>
    363. 

  363.         </div>
    364. 

  364.       </div>
    365. 

  365. 

  366.       <div class="section">
    367. 

  367.         <h3>СРАВНЕНИЕ ПРОПУСКОВ</h3>
    368. 

  368.         <div class="content"><div class="passes-compare" id="passesCompare"></div></div>
    369. 

  369.       </div>
    370. 

  370.       <div class="hint" id="hint">Нажмите «Следующая машина».</div>
    371. 

  371.       <div class="decision-buttons">
    372. 

  372.         <button class="big allow" id="btnAllow" disabled>✓ РАЗРЕШИТЬ</button>
    373. 

  373.         <button class="big deny" id="btnDeny" disabled>✕ ЗАПРЕТИТЬ</button>
    374. 

  374.       </div>
    375. 

  375.       <div class="refuse-menu" id="refuseMenu">
    376. 

  376.         <div class="title">МАШИНА ЖДЁТ РЕШЕНИЯ</div>
    377. 

  377.         <button class="ctrl" data-refuse="explain">📢 Объяснить причину отказа</button>
    378. 

  378.         <button class="ctrl" data-refuse="senior">📞 Вызвать старшего смены</button>
    379. 

  379.       </div>
    380. 

  380.       <div class="action-buttons">
    381. 

  381.         <button class="ctrl primary" id="btnNext">▸ Следующая машина</button>
    382. 

  382.         <button class="ctrl danger" id="btnBreach">⚠ Силовой проезд</button>
    383. 

  383.         <button class="ctrl" id="btnNote">✎ Отметить в журнале</button>
    384. 

  384.         <button class="ctrl" id="btnEndShift">⏹ Закончить смену</button>
    385. 

  385.         <button class="ctrl" id="btnReset">↻ Сброс</button>
    386. 

  386.       </div>
    387. 

  387.       <div class="section">
    388. 

  388.         <h3>ВНЕШНИЕ УСЛОВИЯ</h3>
    389. 

  389.         <div class="content">
    390. 

  390.           <div class="cond-row">
    391. 

  391.             <label>Время</label>
    392. 

  392.             <select id="selTimeOfDay">
    393. 

  393.               <option value="day">☀ День</option>
    394. 

  394.               <option value="night" selected>🌙 Ночь</option>
    395. 

  395.             </select>
    396. 

  396.           </div>
    397. 

  397.           <div class="cond-row">
    398. 

  398.             <label>Погода</label>
    399. 

  399.             <select id="selWeather">
    400. 

  400.               <option value="clear" selected>☀ Ясно</option>
    401. 

  401.               <option value="rain">🌧 Дождь</option>
    402. 

  402.               <option value="snow">❄ Снег</option>
    403. 

  403.               <option value="fog">🌫 Туман</option>
    404. 

  404.             </select>
    405. 

  405.           </div>
    406. 

  406.         </div>
    407. 

  407.       </div>
    408. 

  408.     </aside>
    409. 

  409.   </main>
    410. 

  410. </div>
    411. 

  411. 

  412. <div class="modal" id="logModal">
    413. 

  413.   <div class="modal-content" style="width: min(900px, 100%);">
    414. 

  414.     <h2>ЖУРНАЛ СОБЫТИЙ · СКУД</h2>
    415. 

  415.     <div class="log log-full" id="logContentFull"></div>
    416. 

  416.     <div style="display:flex; gap:8px; justify-content:center; margin-top:16px;">
    417. 

  417.       <button id="btnLogClear" style="margin:0;">ОЧИСТИТЬ</button>
    418. 

  418.       <button id="btnLogClose" style="margin:0;">ЗАКРЫТЬ</button>
    419. 

  419.     </div>
    420. 

  420.   </div>
    421. 

  421. </div>
    422. 

  422. 

  423. <div class="modal" id="shiftModal">
    424. 

  424.   <div class="modal-content">
    425. 

  425.     <h2>СМЕНА ЗАВЕРШЕНА</h2>
    426. 

  426.     <div class="row"><span class="k">Впущено автомобилей:</span><span class="v good" id="statIn">0</span></div>
    427. 

  427.     <div class="row"><span class="k">Отказано в проезде:</span><span class="v" id="statOut">0</span></div>
    428. 

  428.     <div class="row"><span class="k">Верных решений:</span><span class="v good" id="statCorrect">0</span></div>
    429. 

  429.     <div class="row"><span class="k">Ошибок оператора:</span><span class="v bad" id="statWrong">0</span></div>
    430. 

  430.     <div class="row"><span class="k">Сработало тревог:</span><span class="v bad" id="statAlarms">0</span></div>
    431. 

  431.     <div class="row"><span class="k">Срабатываний датчиков:</span><span class="v" id="statSensors">0</span></div>
    432. 

  432.     <div class="row"><span class="k">Силовых проездов:</span><span class="v bad" id="statBreaches">0</span></div>
    433. 

  433.     <div class="row"><span class="k">Вызовов старшего:</span><span class="v" id="statSenior">0</span></div>
    434. 

  434.     <div class="row"><span class="k">Оценка смены:</span><span class="v" id="statGrade">—</span></div>
    435. 

  435.     <button id="btnCloseShift">ЗАКРЫТЬ И СБРОСИТЬ</button>
    436. 

  436.   </div>
    437. 

  437. </div>
    438. 

  438. 

  439. <script>
    440. 

  440. const cv = document.getElementById('cv');
    441. 

  441. const ctx = cv.getContext('2d');
    442. 

  442. let W = 0, H = 0;
    443. 

  443. 

  444. function resizeCanvas() {
    445. 

  445.   const stage = cv.parentElement;
    446. 

  446.   const dpr = window.devicePixelRatio || 1;
    447. 

  447.   W = stage.clientWidth; H = stage.clientHeight;
    448. 

  448.   cv.width = Math.floor(W * dpr); cv.height = Math.floor(H * dpr);
    449. 

  449.   ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
    450. 

  450. }
    451. 

  451. window.addEventListener('resize', resizeCanvas);
    452. 

  452. 

  453. function L() {
    454. 

  454.   return {
    455. 

  455.     horizonY: H * 0.32,
    456. 

  456.     topLaneY: H * 0.58, topLaneTop: H * 0.52, topLaneBot: H * 0.66,
    457. 

  457.     botLaneY: H * 0.78, botLaneTop: H * 0.72, botLaneBot: H * 0.84,
    458. 

  458.     boothX: W * 0.40, boothW: 150, boothH: 165, boothBaseY: H * 0.55,
    459. 

  459.     pillarX: W * 0.72, pillarW: 30, pillarH: 260,
    460. 

  460.     pivotX: W * 0.72, pivotY: H * 0.58 - 80,
    461. 

  461.     armLen: 240, armH: 16
    462. 

  462.   };
    463. 

  463. }
    464. 

  464. 

  465. /* ===== МОДЕЛИ ===== */
    466. 

  466. const BARRIER_MODELS = {
    467. 

  467.   A: {
    468. 

  468.     code:'A', name:'СКОРОСТНОЙ', short:'«Спринт-90»',
    469. 

  469.     vendor:'СКУД-Системы', series:'SP-90',
    470. 

  470.     desc:'Высокоскоростная модель для офисных КПП и паркингов. Полный цикл ~1 с.',
    471. 

  471.     openTime:0.9, closeTime:1.2, autoClose:3, armLen:180,
    472. 

  472.     hasHold:true, hasPhoto:false, hasLoop:false, hasImpact:false, hasKW2:true,
    473. 

  473.     driveType:'Линейный', driveVoltage:'24 В DC', drivePower:'120 Вт',
    474. 

  474.     ingressProtection:'IP54', operatingTemp:'−40…+55 °C',
    475. 

  475.     dutyCycle:'80 %', mttr:'~15 мин',
    476. 

  476.     terminals:['+24V','GND','OPEN','CLOSE','STOP','KW1','KW2','LOOP1','LOOP2','PHOTO']
    477. 

  477.   },
    478. 

  478.   B: {
    479. 

  479.     code:'B', name:'МАГИСТРАЛЬНЫЙ', short:'«Стандарт-240»',
    480. 

  480.     vendor:'СКУД-Системы', series:'ST-240',
    481. 

  481.     desc:'Для въезда на территорию предприятий. Петля + фотоэлемент.',
    482. 

  482.     openTime:3.5, closeTime:3.5, autoClose:8, armLen:240,
    483. 

  483.     hasHold:false, hasPhoto:true, hasLoop:true, hasImpact:false, hasKW2:true,
    484. 

  484.     driveType:'Рычажный', driveVoltage:'230 В AC', drivePower:'250 Вт',
    485. 

  485.     ingressProtection:'IP65', operatingTemp:'−40…+60 °C',
    486. 

  486.     dutyCycle:'60 %', mttr:'~30 мин',
    487. 

  487.     terminals:['L','N','PE','OPEN','CLOSE','STOP','KW1','KW2','LOOP1','LOOP2','PHOTO','BUZZ']
    488. 

  488.   },
    489. 

  489.   C: {
    490. 

  490.     code:'C', name:'ПРОМЫШЛЕННЫЙ', short:'«Терминал-280»',
    491. 

  491.     vendor:'ПромАвтоматика', series:'IND-280',
    492. 

  492.     desc:'Для грузового транспорта. Две петли, фотоэлемент, датчик удара.',
    493. 

  493.     openTime:6, closeTime:6, autoClose:15, armLen:280,
    494. 

  494.     hasHold:false, hasPhoto:true, hasLoop:true, hasImpact:true, hasKW2:true,
    495. 

  495.     driveType:'Редукторный', driveVoltage:'380 В AC', drivePower:'750 Вт',
    496. 

  496.     ingressProtection:'IP66', operatingTemp:'−50…+60 °C',
    497. 

  497.     dutyCycle:'100 %', mttr:'~45 мин',
    498. 

  498.     terminals:['L1','L2','L3','N','PE','OPEN','CLOSE','STOP','KW1','KW2',
    499. 

  499.                'LOOP1','LOOP2','PHOTO','IMPACT','ALARM','READY']
    500. 

  500.   },
    501. 

  501.   D: {
    502. 

  502.     code:'D', name:'БЮДЖЕТНЫЙ', short:'«Мини-200»',
    503. 

  503.     vendor:'ЭкономСервис', series:'EC-200',
    504. 

  504.     desc:'Для внутренних КПП. Без автоматики, ручное управление с пульта.',
    505. 

  505.     openTime:4, closeTime:4, autoClose:0, armLen:200,
    506. 

  506.     hasHold:true, hasPhoto:false, hasLoop:false, hasImpact:false, hasKW2:false,
    507. 

  507.     driveType:'Линейный', driveVoltage:'24 В DC', drivePower:'90 Вт',
    508. 

  508.     ingressProtection:'IP44', operatingTemp:'−25…+50 °C',
    509. 

  509.     dutyCycle:'50 %', mttr:'~20 мин',
    510. 

  510.     terminals:['+24V','GND','OPEN','CLOSE','STOP','KW1']
    511. 

  511.   }
    512. 

  512. };
    513. 

  513. let selectedModelCode = 'B';
    514. 

  514. 

  515. const state = {
    516. 

  516.   time: 0,
    517. 

  517.   model: null,
    518. 

  518.   barrier: { level: 0, target: 0, moving: false },
    519. 

  519.   holdMode: false,
    520. 

  520.   manualMode: false,
    521. 

  521.   autoCloseTimer: 0,
    522. 

  522.   car: null,
    523. 

  523.   correctPass: null, presentedPass: null,
    524. 

  524.   phase: 'idle',
    525. 

  525.   userDecision: null, correctDecision: null,
    526. 

  526.   alarm: false, alarmEnd: 0, sparks: [],
    527. 

  527.   police: null, tow: null, towDriver: null, towCable: false, leaving: false,
    528. 

  528.   timeOfDay: 'night',
    529. 

  529.   weather: 'clear',
    530. 

  530.   weatherParticles: [],
    531. 

  531.   senior: null,
    532. 

  532.   skud: {
    533. 

  533.     power: true, kw1: true, kw2: false,
    534. 

  534.     loop1: false, loop2: false,
    535. 

  535.     photo: false, impact: false,
    536. 

  536.     relayOpen: false, relayClose: false, relayStop: false,
    537. 

  537.     passValid: false, alarm: false
    538. 

  538.   },
    539. 

  539.   stats: { in:0, out:0, correct:0, wrong:0, alarms:0, breaches:0, senior:0, sensors:0 }
    540. 

  540. };
    541. 

  541. 

  542. /* ===== ЖУРНАЛ ===== */
    543. 

  543. const logEntries = [];
    544. 

  544. function logEvent(text, cls) {
    545. 

  545.   const now = new Date();
    546. 

  546.   const t = String(now.getHours()).padStart(2,'0')+':'+String(now.getMinutes()).padStart(2,'0')+':'+String(now.getSeconds()).padStart(2,'0');
    547. 

  547.   logEntries.push({ t, text, cls: cls||'info' });
    548. 

  548.   if (logEntries.length > 200) logEntries.shift();
    549. 

  549.   renderLog();
    550. 

  550. }
    551. 

  551. function logSkud(text, cls) { logEvent('[СКУД] ' + text, cls || 'skud'); }
    552. 

  552. function renderLog() {
    553. 

  553.   const html = logEntries.map(e =>
    554. 

  554.     `<div class="entry ${e.cls}"><span class="time">${e.t}</span>${e.text}</div>`
    555. 

  555.   ).join('');
    556. 

  556.   const el = document.getElementById('logContentFull');
    557. 

  557.   if (el) {
    558. 

  558.     const wasBottom = (el.scrollHeight - el.scrollTop - el.clientHeight) < 30;
    559. 

  559.     el.innerHTML = html;
    560. 

  560.     if (wasBottom) el.scrollTop = el.scrollHeight;
    561. 

  561.   }
    562. 

  562.   updateLogBadge();
    563. 

  563. }
    564. 

  564. function updateLogBadge() {
    565. 

  565.   const btn = document.getElementById('btnLogToggle');
    566. 

  566.   if (!btn) return;
    567. 

  567.   const modal = document.getElementById('logModal');
    568. 

  568.   const modalOpen = modal && modal.classList.contains('on');
    569. 

  569.   const hasAlarm = logEntries.slice(-5).some(e => e.cls === 'alarm');
    570. 

  570.   btn.classList.toggle('has-alarm', hasAlarm && !modalOpen);
    571. 

  571. }
    572. 

  572. function setStatus(text, cls) {
    573. 

  573.   document.getElementById('sysStatusText').textContent = text;
    574. 

  574.   document.getElementById('sysStatus').className = 'sys-status' + (cls ? ' ' + cls : '');
    575. 

  575. }
    576. 

  576. function setHint(text) { document.getElementById('hint').innerHTML = text; }
    577. 

  577. 

  578. /* ===== ОСВЕЩЕНИЕ ===== */
    579. 

  579. function lighting() {
    580. 

  580.   const isDay = state.timeOfDay === 'day';
    581. 

  581.   const w = state.weather;
    582. 

  582.   if (w === 'fog') return isDay ? { mode: 'dawn' } : { mode: 'dusk' };
    583. 

  583.   if (w === 'rain') return isDay ? { mode: 'overcast' } : { mode: 'wetnight' };
    584. 

  584.   if (w === 'snow') return isDay ? { mode: 'overcast' } : { mode: 'snownight' };
    585. 

  585.   return isDay ? { mode: 'day' } : { mode: 'night' };
    586. 

  586. }
    587. 

  587. function skyColors() {
    588. 

  588.   const m = lighting().mode;
    589. 

  589.   switch (m) {
    590. 

  590.     case 'day':       return ['#3d5d80', '#98c4dc', '#d8e8f2'];
    591. 

  591.     case 'dawn':      return ['#2a3a5c', '#7a94b4', '#c4b8b0'];
    592. 

  592.     case 'dusk':      return ['#1a1428', '#382a48', '#605060'];
    593. 

  593.     case 'overcast':  return ['#48505c', '#6a7280', '#8a94a4'];
    594. 

  594.     case 'night':     return ['#02040a', '#0a1220', '#182230'];
    595. 

  595.     case 'wetnight':  return ['#060a14', '#0e1626', '#1a2032'];
    596. 

  596.     case 'snownight': return ['#0a0e1a', '#1a2234', '#2a3044'];
    597. 

  597.   }
    598. 

  598.   return ['#02040a', '#0a1220', '#182230'];
    599. 

  599. }
    600. 

  600. function isSunVisible() {
    601. 

  601.   const m = lighting().mode;
    602. 

  602.   return m === 'day' || m === 'dawn';
    603. 

  603. }
    604. 

  604. function isStarVisible() {
    605. 

  605.   const m = lighting().mode;
    606. 

  606.   return m === 'night' || m === 'wetnight' || m === 'snownight' || m === 'dusk';
    607. 

  607. }
    608. 

  608. function isWet() {
    609. 

  609.   return state.weather === 'rain';
    610. 

  610. }
    611. 

  611. function weatherLabel() {
    612. 

  612.   const w = { clear:'ясно', rain:'дождь', snow:'снег', fog:'туман' }[state.weather];
    613. 

  613.   const t = state.timeOfDay === 'night' ? 'ночь' : 'день';
    614. 

  614.   return t + ', ' + w;
    615. 

  615. }
    616. 

  616. 

  617. /* ===== ПРОПУСКА ===== */
    618. 

  618. const firstNames = ['Иванов','Петров','Сидоров','Кузнецов','Морозов','Волков','Соколов','Лебедев'];
    619. 

  619. const initials = ['И.И.','П.П.','С.С.','А.В.','Д.А.','М.Н.'];
    620. 

  620. const departments = ['Администрация','Служба охраны','Бухгалтерия','Отдел кадров','ИТ-отдел','Логистика'];
    621. 

  621. const series = ['А','Б','В','Г'];
    622. 

  622. function randomPass() {
    623. 

  623.   return {
    624. 

  624.     num: series[Math.floor(Math.random()*series.length)]+'-'+String(Math.floor(Math.random()*900)+100),
    625. 

  625.     name: firstNames[Math.floor(Math.random()*firstNames.length)]+' '+initials[Math.floor(Math.random()*initials.length)],
    626. 

  626.     dept: departments[Math.floor(Math.random()*departments.length)],
    627. 

  627.     valid: Math.random() > 0.25
    628. 

  628.   };
    629. 

  629. }
    630. 

  630. function generateScenario(mode) {
    631. 

  631.   const correct = randomPass(); correct.valid = true;
    632. 

  632.   if (mode === 'breach') return { correct, presented: null, shouldAllow: false };
    633. 

  633.   const r = Math.random();
    634. 

  634.   let presented, shouldAllow;
    635. 

  635.   if (r < 0.4) { presented = { ...correct }; shouldAllow = true; }
    636. 

  636.   else if (r < 0.65) { presented = randomPass(); while (presented.num === correct.num) presented = randomPass(); shouldAllow = false; }
    637. 

  637.   else { presented = { ...correct, valid: false }; shouldAllow = false; }
    638. 

  638.   return { correct, presented, shouldAllow };
    639. 

  639. }
    640. 

  640. function renderPasses() {
    641. 

  641.   const el = document.getElementById('passesCompare');
    642. 

  642.   const c = state.correctPass, p = state.presentedPass;
    643. 

  643.   const card = (head, pass) => {
    644. 

  644.     if (!pass) return `<div class="pass-card"><div class="head">${head}</div><div class="num">—</div><div class="name">не предъявлен</div><div class="dept">—</div><div class="status empty">НЕТ ДАННЫХ</div></div>`;
    645. 

  645.     return `<div class="pass-card"><div class="head">${head}</div><div class="num">${pass.num}</div><div class="name">${pass.name}</div><div class="dept">${pass.dept}</div><div class="status ${pass.valid?'ok':'bad'}">${pass.valid?'АКТИВЕН':'ОТОЗВАН'}</div></div>`;
    646. 

  646.   };
    647. 

  647.   el.innerHTML = card('В БАЗЕ', c) + card('ПРЕДЪЯВЛЕН', p);
    648. 

  648.   const active = state.phase === 'waiting' && state.userDecision === null;
    649. 

  649.   document.getElementById('btnAllow').disabled = !active;
    650. 

  650.   document.getElementById('btnDeny').disabled = !active;
    651. 

  651.   state.skud.passValid = !!(c && c.valid);
    652. 

  652. }
    653. 

  653. function showRefuseMenu() { document.getElementById('refuseMenu').classList.add('on'); }
    654. 

  654. function hideRefuseMenu() { document.getElementById('refuseMenu').classList.remove('on'); }
    655. 

  655. 

  656. function speedMult() {
    657. 

  657.   if (state.weather === 'rain') return 0.75;
    658. 

  658.   if (state.weather === 'snow') return 0.6;
    659. 

  659.   if (state.weather === 'fog')  return 0.85;
    660. 

  660.   return 1;
    661. 

  661. }
    662. 

  662. 

  663. /* ===== ПЕРЕКЛЮЧАТЕЛЬ МОДЕЛИ ===== */
    664. 

  664. function renderModelSwitcher() {
    665. 

  665.   const el = document.getElementById('modelSwitcher');
    666. 

  666.   el.innerHTML = Object.values(BARRIER_MODELS).map(m => `
    667. 

  667.     <button class="model-btn ${m.code===selectedModelCode?'active':''}" data-model="${m.code}">
    668. 

  668.       <span class="mb-code">МОДЕЛЬ ${m.code}</span>
    669. 

  669.       <span class="mb-name">${m.name}</span>
    670. 

  670.       <span class="mb-spec">▸ ${m.openTime}с/${m.closeTime}с · стрела ${m.armLen}</span>
    671. 

  671.     </button>`).join('');
    672. 

  672.   el.querySelectorAll('.model-btn').forEach(b => {
    673. 

  673.     b.onclick = () => switchModel(b.dataset.model);
    674. 

  674.   });
    675. 

  675. }
    676. 

  676. function switchModel(code) {
    677. 

  677.   if (!BARRIER_MODELS[code]) return;
    678. 

  678.   selectedModelCode = code;
    679. 

  679.   state.model = BARRIER_MODELS[code];
    680. 

  680.   document.getElementById('modelBadge').textContent = 'МОДЕЛЬ: ' + state.model.code + ' · ' + state.model.name;
    681. 

  681.   document.getElementById('btnHold').style.display = state.model.hasHold ? '' : 'none';
    682. 

  682.   document.getElementById('btnHold').classList.remove('active');
    683. 

  683.   state.holdMode = false;
    684. 

  684.   state.skud.kw1 = state.barrier.level < 0.05;
    685. 

  685.   state.skud.kw2 = state.barrier.level > 0.95;
    686. 

  686.   if (!state.model.hasLoop) state.skud.loop1 = false;
    687. 

  687.   if (!state.model.hasPhoto) state.skud.photo = false;
    688. 

  688.   if (!state.model.hasImpact) state.skud.impact = false;
    689. 

  689.   renderModelSwitcher();
    690. 

  690.   renderModelPassport();
    691. 

  691.   logSkud('▸ ПЕРЕКЛЮЧЕНИЕ МОДЕЛИ: ' + state.model.code + ' · ' + state.model.name, 'warn');
    692. 

  692.   logSkud('Открытие/закрытие: ' + state.model.openTime + 'с / ' + state.model.closeTime + 'с');
    693. 

  693.   logSkud('Автозакрытие: ' + (state.model.autoClose ? state.model.autoClose + ' с' : 'отключено'));
    694. 

  694.   setHint('Модель <b>' + state.model.code + '</b> активна. Нажмите «Следующая машина».');
    695. 

  695. }
    696. 

  696. 

  697. /* ===== ПАСПОРТ МОДЕЛИ ===== */
    698. 

  698. function isTerminalActive(t) {
    699. 

  699.   const s = state.skud;
    700. 

  700.   const power = t === '+24V' || t === 'GND' || t === 'L' || t === 'N' ||
    701. 

  701.                 t === 'PE' || t === 'L1' || t === 'L2' || t === 'L3';
    702. 

  702.   if (power) return s.power ? 'on' : null;
    703. 

  703.   if (t === 'OPEN') return s.relayOpen ? 'on' : null;
    704. 

  704.   if (t === 'CLOSE') return s.relayClose ? 'on' : null;
    705. 

  705.   if (t === 'STOP') return s.relayStop ? 'alarm' : null;
    706. 

  706.   if (t === 'KW1') return s.kw1 ? 'on' : null;
    707. 

  707.   if (t === 'KW2') return s.kw2 ? 'on' : null;
    708. 

  708.   if (t === 'LOOP1') return s.loop1 ? 'on' : null;
    709. 

  709.   if (t === 'LOOP2') return s.loop2 ? 'on' : null;
    710. 

  710.   if (t === 'PHOTO') return s.photo ? 'alarm' : 'on';
    711. 

  711.   if (t === 'IMPACT') return s.impact ? 'alarm' : null;
    712. 

  712.   if (t === 'ALARM') return s.alarm ? 'alarm' : null;
    713. 

  713.   if (t === 'READY') return !s.alarm ? 'on' : null;
    714. 

  714.   return null;
    715. 

  715. }
    716. 

  716. function renderModelPassport() {
    717. 

  717.   const m = state.model;
    718. 

  718.   if (!m) return;
    719. 

  719.   const el = document.getElementById('modelPassport');
    720. 

  720.   const rows = [
    721. 

  721.     ['Производитель', m.vendor],
    722. 

  722.     ['Серия', m.series],
    723. 

  723.     ['Тип привода', m.driveType],
    724. 

  724.     ['Питание', m.driveVoltage],
    725. 

  725.     ['Мощность', m.drivePower],
    726. 

  726.     ['Открытие', m.openTime + ' с'],
    727. 

  727.     ['Закрытие', m.closeTime + ' с'],
    728. 

  728.     ['Автозакрытие', m.autoClose ? m.autoClose + ' с' : 'нет'],
    729. 

  729.     ['Длина стрелы', m.armLen + ' см'],
    730. 

  730.     ['Защита', m.ingressProtection],
    731. 

  731.     ['Температура', m.operatingTemp],
    732. 

  732.     ['Режим работы', m.dutyCycle],
    733. 

  733.   ];
    734. 

  734.   const term = (m.terminals || []).map(t => {
    735. 

  735.     const active = isTerminalActive(t);
    736. 

  736.     const cls = active === 'on' ? 'on' : (active === 'alarm' ? 'alarm' : '');
    737. 

  737.     return `<span class="terminal-chip ${cls}">${t}</span>`;
    738. 

  738.   }).join('');
    739. 

  739. 

  740.   el.innerHTML = `
    741. 

  741.     <div class="passport-title">МОДЕЛЬ ${m.code} · ${m.short}</div>
    742. 

  742.     <div class="passport-sub">${m.name} · ${m.vendor} ${m.series}</div>
    743. 

  743.     <div class="passport-desc">${m.desc}</div>
    744. 

  744.     <div class="passport-grid">
    745. 

  745.       ${rows.map(([k,v]) => `<div class="passport-row"><span class="pk">${k}</span><span class="pv">${v}</span></div>`).join('')}
    746. 

  746.     </div>
    747. 

  747.     <div style="color:#607890;font-size:10px;letter-spacing:1.5px;margin-top:12px;">КЛЕММЫ ПОДКЛЮЧЕНИЯ</div>
    748. 

  748.     <div class="terminal-list">${term}</div>
    749. 

  749.   `;
    750. 

  750. }
    751. 

  751. 

  752. /* ===== СЦЕНАРИИ ===== */
    753. 

  753. function nextCar() {
    754. 

  754.   if (state.phase !== 'idle') return;
    755. 

  755.   const scen = generateScenario('normal');
    756. 

  756.   state.correctPass = scen.correct;
    757. 

  757.   state.presentedPass = scen.presented;
    758. 

  758.   state.correctDecision = scen.shouldAllow ? 'allow' : 'deny';
    759. 

  759.   state.userDecision = null;
    760. 

  760.   state.senior = null;
    761. 

  761.   state.phase = 'approaching';
    762. 

  762.   hideRefuseMenu();
    763. 

  763.   const colors = ['#3a5a8a','#8a3a3a','#2a2a30','#3a6a4a','#7a6a2a','#5a3a6a'];
    764. 

  764.   state.car = {
    765. 

  765.     x: -250, speed: 160 * speedMult(),
    766. 

  766.     color: colors[Math.floor(Math.random()*colors.length)],
    767. 

  767.     wheelAngle: 0, isPriora: false
    768. 

  768.   };
    769. 

  769.   state.skud.loop1 = false; state.skud.loop2 = false;
    770. 

  770.   setStatus('ПРИБЛИЖАЕТСЯ АВТО', 'wait');
    771. 

  771.   logEvent('Приближается автомобиль' + (state.weather !== 'clear' || state.timeOfDay === 'night' ? ` (${weatherLabel()})` : ''), 'info');
    772. 

  772.   renderPasses();
    773. 

  773.   setHint('Автомобиль подъезжает.');
    774. 

  774. }
    775. 

  775. function breachCar() {
    776. 

  776.   if (state.phase !== 'idle') return;
    777. 

  777.   const scen = generateScenario('breach');
    778. 

  778.   state.correctPass = scen.correct;
    779. 

  779.   state.presentedPass = null;
    780. 

  780.   state.correctDecision = 'deny';
    781. 

  781.   state.userDecision = null;
    782. 

  782.   state.senior = null;
    783. 

  783.   state.phase = 'approaching';
    784. 

  784.   hideRefuseMenu();
    785. 

  785.   state.car = { x: -250, speed: 340 * speedMult(), color: '#0a0a0a', wheelAngle: 0, isPriora: true };
    786. 

  786.   setStatus('НАРУШИТЕЛЬ !', 'alarm');
    787. 

  787.   logEvent('Тёмный автомобиль не сбрасывает скорость!', 'alarm');
    788. 

  788.   renderPasses();
    789. 

  789.   setHint('Нарушитель не останавливается.');
    790. 

  790. }
    791. 

  791. 

  792. function decide(decision) {
    793. 

  793.   if (state.phase !== 'waiting' || state.userDecision !== null) return;
    794. 

  794.   state.userDecision = decision;
    795. 

  795.   const correct = (decision === state.correctDecision);
    796. 

  796.   if (correct) state.stats.correct++; else state.stats.wrong++;
    797. 

  797.   logEvent(`Решение «${decision==='allow'?'РАЗРЕШИТЬ':'ЗАПРЕТИТЬ'}» — ${correct?'верно':'ОШИБКА'}`,
    798. 

  798.            correct?'ok':'warn');
    799. 

  799.   if (decision === 'allow') {
    800. 

  800.     state.car.action = 'pass';
    801. 

  801.     openBarrier();
    802. 

  802.     state.phase = 'resolved';
    803. 

  803.     setStatus('ПРОЕЗД РАЗРЕШЁН');
    804. 

  804.     setHint('Шлагбаум открывается, автомобиль проезжает.');
    805. 

  805.     hideRefuseMenu();
    806. 

  806.   } else {
    807. 

  807.     state.car.action = 'wait';
    808. 

  808.     state.phase = 'refuse_wait';
    809. 

  809.     setStatus('МАШИНА ЖДЁТ', 'pause');
    810. 

  810.     setHint('Объясните причину отказа или вызовите старшего смены.');
    811. 

  811.     showRefuseMenu();
    812. 

  812.   }
    813. 

  813.   renderPasses();
    814. 

  814. }
    815. 

  815. 

  816. /* ===== ПУЛЬТ ОПЕРАТОРА ===== */
    817. 

  817. function openBarrier() {
    818. 

  818.   if (state.skud.alarm && !state.manualMode) { logSkud('Отказ: авария не сброшена', 'warn'); return; }
    819. 

  819.   state.barrier.target = 1;
    820. 

  820.   state.barrier.moving = true;
    821. 

  821.   state.skud.relayOpen = true;
    822. 

  822.   state.skud.relayClose = false;
    823. 

  823.   state.skud.relayStop = false;
    824. 

  824.   logSkud('РЕЛЕ «ОТКРЫТЬ»: вкл');
    825. 

  825.   state.autoCloseTimer = 0;
    826. 

  826. }
    827. 

  827. function closeBarrier() {
    828. 

  828.   if (state.skud.alarm && !state.manualMode) { logSkud('Отказ: авария не сброшена', 'warn'); return; }
    829. 

  829.   if (state.skud.photo) {
    830. 

  830.     logSkud('Отказ закрытия: фотоэлемент разорван', 'warn');
    831. 

  831.     setHint('Фотоэлемент разорван — стрела не опускается.');
    832. 

  832.     return;
    833. 

  833.   }
    834. 

  834.   if (state.holdMode) { logSkud('Отказ: включено удержание', 'warn'); return; }
    835. 

  835.   state.barrier.target = 0;
    836. 

  836.   state.barrier.moving = true;
    837. 

  837.   state.skud.relayClose = true;
    838. 

  838.   state.skud.relayOpen = false;
    839. 

  839.   state.skud.relayStop = false;
    840. 

  840.   logSkud('РЕЛЕ «ЗАКРЫТЬ»: вкл');
    841. 

  841. }
    842. 

  842. function stopBarrier() {
    843. 

  843.   state.barrier.target = state.barrier.level;
    844. 

  844.   state.barrier.moving = false;
    845. 

  845.   state.skud.relayStop = true;
    846. 

  846.   state.skud.relayOpen = false;
    847. 

  847.   state.skud.relayClose = false;
    848. 

  848.   logSkud('РЕЛЕ «СТОП»: вкл — привод остановлен', 'warn');
    849. 

  849.   setHint('Шлагбаум остановлен оператором.');
    850. 

  850. }
    851. 

  851. function resetAlarm() {
    852. 

  852.   state.skud.alarm = false;
    853. 

  853.   state.alarm = false;
    854. 

  854.   state.skud.impact = false;
    855. 

  855.   logSkud('СБРОС АВАРИИ выполнен', 'ok');
    856. 

  856. }
    857. 

  857. document.getElementById('btnOpen').onclick = openBarrier;
    858. 

  858. document.getElementById('btnClose').onclick = closeBarrier;
    859. 

  859. document.getElementById('btnStop').onclick = stopBarrier;
    860. 

  860. document.getElementById('btnResetAlarm').onclick = resetAlarm;
    861. 

  861. document.getElementById('btnHold').onclick = () => {
    862. 

  862.   if (!state.model.hasHold) return;
    863. 

  863.   state.holdMode = !state.holdMode;
    864. 

  864.   document.getElementById('btnHold').classList.toggle('active', state.holdMode);
    865. 

  865.   logSkud('УДЕРЖАНИЕ: ' + (state.holdMode ? 'включено' : 'выключено'), state.holdMode ? 'warn' : 'info');
    866. 

  866. };
    867. 

  867. document.getElementById('btnMode').onclick = () => {
    868. 

  868.   state.manualMode = !state.manualMode;
    869. 

  869.   document.getElementById('btnMode').textContent = 'РЕЖИМ: ' + (state.manualMode ? 'РУЧНОЙ' : 'АВТО');
    870. 

  870.   document.getElementById('btnMode').classList.toggle('active', state.manualMode);
    871. 

  871.   logSkud('Режим: ' + (state.manualMode ? 'РУЧНОЙ' : 'АВТО'));
    872. 

  872. };
    873. 

  873. 

  874. document.querySelectorAll('[data-refuse]').forEach(b => {
    875. 

  875.   b.onclick = () => {
    876. 

  876.     const action = b.dataset.refuse;
    877. 

  877.     if (action === 'explain') {
    878. 

  878.       logEvent('Оператор объяснил причину отказа водителю', 'info');
    879. 

  879.       state.stats.out++;
    880. 

  880.       state.car.action = 'turn';
    881. 

  881.       state.phase = 'resolved';
    882. 

  882.       setStatus('ОТКАЗ', 'wait');
    883. 

  883.       setHint('Машина уезжает в обратном направлении.');
    884. 

  884.       hideRefuseMenu();
    885. 

  885.       renderPasses();
    886. 

  886.     }
    887. 

  887.     if (action === 'senior') {
    888. 

  888.       state.stats.senior++;
    889. 

  889.       logEvent('Оператор вызвал старшего смены', 'senior');
    890. 

  890.       state.phase = 'senior_walk';
    891. 

  891.       const carX = state.car ? state.car.x : 0;
    892. 

  892.       state.senior = { x: W + 40, y: L().botLaneY, targetX: carX + 130, targetY: L().topLaneY,
    893. 

  893.         state: 'walk_to_lane', walking: true, alpha: 0, decideTimer: 0 };
    894. 

  894.       hideRefuseMenu();
    895. 

  895.       setStatus('СТАРШИЙ ВЫЗВАН', 'senior');
    896. 

  896.       setHint('Старший смены направляется к машине.');
    897. 

  897.     }
    898. 

  898.   };
    899. 

  899. });
    900. 

  900. 

  901. function resetAll() {
    902. 

  902.   state.car = null; state.correctPass = null; state.presentedPass = null;
    903. 

  903.   state.userDecision = null; state.correctDecision = null;
    904. 

  904.   state.phase = 'idle'; state.barrier.target = 0; state.barrier.level = 0;
    905. 

  905.   state.alarm = false; state.sparks = []; state.police = null;
    906. 

  906.   state.tow = null; state.towDriver = null; state.towCable = false; state.leaving = false;
    907. 

  907.   state.senior = null; state.holdMode = false; state.autoCloseTimer = 0;
    908. 

  908.   state.skud = { power:true, kw1:true, kw2:false, loop1:false, loop2:false,
    909. 

  909.     photo:false, impact:false, relayOpen:false, relayClose:false, relayStop:false,
    910. 

  910.     passValid:false, alarm:false };
    911. 

  911.   document.getElementById('btnHold').classList.remove('active');
    912. 

  912.   hideRefuseMenu();
    913. 

  913.   logEntries.length = 0; renderLog(); renderPasses();
    914. 

  914.   setStatus('ПОСТ СВОБОДЕН'); setHint('Нажмите <b>«Следующая машина»</b>.');
    915. 

  915.   logEvent('Система сброшена', 'ok');
    916. 

  916. }
    917. 

  917. document.getElementById('btnNext').onclick = nextCar;
    918. 

  918. document.getElementById('btnBreach').onclick = breachCar;
    919. 

  919. document.getElementById('btnReset').onclick = resetAll;
    920. 

  920. document.getElementById('btnAllow').onclick = () => decide('allow');
    921. 

  921. document.getElementById('btnDeny').onclick = () => decide('deny');
    922. 

  922. document.getElementById('btnNote').onclick = () => {
    923. 

  923.   const txt = prompt('Введите отметку для журнала:', '');
    924. 

  924.   if (txt && txt.trim()) logEvent('[ОПЕРАТОР] ' + txt.trim(), 'info');
    925. 

  925. };
    926. 

  926. document.getElementById('btnEndShift').onclick = () => {
    927. 

  927.   const s = state.stats;
    928. 

  928.   document.getElementById('statIn').textContent = s.in;
    929. 

  929.   document.getElementById('statOut').textContent = s.out;
    930. 

  930.   document.getElementById('statCorrect').textContent = s.correct;
    931. 

  931.   document.getElementById('statWrong').textContent = s.wrong;
    932. 

  932.   document.getElementById('statAlarms').textContent = s.alarms;
    933. 

  933.   document.getElementById('statSensors').textContent = s.sensors;
    934. 

  934.   document.getElementById('statBreaches').textContent = s.breaches;
    935. 

  935.   document.getElementById('statSenior').textContent = s.senior;
    936. 

  936.   const total = s.correct + s.wrong;
    937. 

  937.   let grade = '—';
    938. 

  938.   if (total > 0) {
    939. 

  939.     const pct = s.correct / total;
    940. 

  940.     if (pct >= 0.95) grade = 'ОТЛИЧНО';
    941. 

  941.     else if (pct >= 0.8) grade = 'ХОРОШО';
    942. 

  942.     else if (pct >= 0.6) grade = 'УДОВЛЕТВОРИТЕЛЬНО';
    943. 

  943.     else grade = 'ТРЕБУЕТСЯ ПОДГОТОВКА';
    944. 

  944.   }
    945. 

  945.   document.getElementById('statGrade').textContent = grade;
    946. 

  946.   document.getElementById('shiftModal').classList.add('on');
    947. 

  947.   logEvent('Смена завершена. Открыт отчёт.', 'info');
    948. 

  948. };
    949. 

  949. document.getElementById('btnCloseShift').onclick = () => {
    950. 

  950.   document.getElementById('shiftModal').classList.remove('on');
    951. 

  951.   state.stats = { in:0, out:0, correct:0, wrong:0, alarms:0, breaches:0, senior:0, sensors:0 };
    952. 

  952.   logEntries.length = 0; renderLog();
    953. 

  953.   logEvent('Начата новая смена', 'ok');
    954. 

  954. };
    955. 

  955. 

  956. /* ===== ЖУРНАЛ: кнопки ===== */
    957. 

  957. document.getElementById('btnLogToggle').onclick = () => {
    958. 

  958.   document.getElementById('logModal').classList.add('on');
    959. 

  959.   const el = document.getElementById('logContentFull');
    960. 

  960.   el.scrollTop = el.scrollHeight;
    961. 

  961.   updateLogBadge();
    962. 

  962. };
    963. 

  963. document.getElementById('btnLogClose').onclick = () => {
    964. 

  964.   document.getElementById('logModal').classList.remove('on');
    965. 

  965.   updateLogBadge();
    966. 

  966. };
    967. 

  967. document.getElementById('btnLogClear').onclick = () => {
    968. 

  968.   logEntries.length = 0;
    969. 

  969.   renderLog();
    970. 

  970.   logEvent('Журнал очищен оператором', 'info');
    971. 

  971. };
    972. 

  972. document.addEventListener('keydown', (e) => {
    973. 

  973.   if (e.key === 'F2') {
    974. 

  974.     e.preventDefault();
    975. 

  975.     document.getElementById('btnLogToggle').click();
    976. 

  976.   }
    977. 

  977.   if (e.key === 'Escape') {
    978. 

  978.     document.getElementById('logModal').classList.remove('on');
    979. 

  979.     updateLogBadge();
    980. 

  980.   }
    981. 

  981. });
    982. 

  982. 

  983. document.getElementById('selTimeOfDay').onchange = (e) => {
    984. 

  984.   state.timeOfDay = e.target.value;
    985. 

  985.   logEvent('Время суток: ' + (state.timeOfDay === 'day' ? 'день' : 'ночь'), 'info');
    986. 

  986.   if (state.timeOfDay === 'night') logEvent('Камеры переведены в ИК-режим', 'info');
    987. 

  987. };
    988. 

  988. document.getElementById('selWeather').onchange = (e) => {
    989. 

  989.   state.weather = e.target.value;
    990. 

  990.   const names = { clear:'ясно', rain:'дождь', snow:'снег', fog:'туман' };
    991. 

  991.   logEvent('Погода: ' + names[state.weather], 'info');
    992. 

  992.   if (state.weather === 'fog') logEvent('Туман — сумеречный режим', 'warn');
    993. 

  993.   if (state.weather === 'rain') logEvent('Мокрое покрытие — снижение скорости ТС', 'warn');
    994. 

  994.   if (state.weather === 'snow') logEvent('Снегопад — ограничение скорости ТС', 'warn');
    995. 

  995.   state.weatherParticles = [];
    996. 

  996. };
    997. 

  997. 

  998. /* ===== LED ===== */
    999. 

  999. function setLed(id, on, cls) {
    1000. 

  1000.   const el = document.getElementById(id);
    1001. 

  1001.   if (!el) return;
    1002. 

  1002.   el.className = 'skud-led' + (on ? ' ' + (cls || 'on') : '');
    1003. 

  1003. }
    1004. 

  1004. function updateSkudLeds() {
    1005. 

  1005.   const s = state.skud;
    1006. 

  1006.   setLed('ledPower', s.power);
    1007. 

  1007.   setLed('ledArmState', true,
    1008. 

  1008.     state.barrier.moving ? 'yel blink' :
    1009. 

  1009.     (state.barrier.level > 0.9 ? 'on' : 'red'));
    1010. 

  1010.   setLed('ledKW1', s.kw1);
    1011. 

  1011.   setLed('ledKW2', s.kw2);
    1012. 

  1012.   setLed('ledLoop1', s.loop1, 'blu');
    1013. 

  1013.   setLed('ledLoop2', s.loop2, 'blu');
    1014. 

  1014.   setLed('ledPhoto', s.photo, 'yel');
    1015. 

  1015.   setLed('ledImpact', s.impact, 'red blink');
    1016. 

  1016.   setLed('ledRelayOpen', s.relayOpen);
    1017. 

  1017.   setLed('ledRelayClose', s.relayClose);
    1018. 

  1018.   setLed('ledRelayStop', s.relayStop, 'yel');
    1019. 

  1019.   setLed('ledPass', s.passValid);
    1020. 

  1020.   renderModelPassport();
    1021. 

  1021.   updateFsmTable();
    1022. 

  1022. }
    1023. 

  1023. 

  1024. /* ===== ТАБЛО FSM ===== */
    1025. 

  1025. function updateFsmTable() {
    1026. 

  1026.   const s = state.skud;
    1027. 

  1027.   let fsm = 'IDLE';
    1028. 

  1028.   if (state.phase === 'approaching') fsm = 'APPROACH';
    1029. 

  1029.   else if (state.phase === 'waiting') fsm = 'WAIT_OPERATOR';
    1030. 

  1030.   else if (state.phase === 'resolved') fsm = 'RESOLVED';
    1031. 

  1031.   else if (state.phase === 'refuse_wait') fsm = 'REFUSE_WAIT';
    1032. 

  1032.   else if (state.phase === 'senior_walk') fsm = 'SENIOR_CALL';
    1033. 

  1033.   else if (state.phase === 'crash_scene') fsm = 'EMERGENCY';
    1034. 

  1034.   else if (state.barrier.moving) fsm = state.barrier.target > 0 ? 'OPENING' : 'CLOSING';
    1035. 

  1035.   else if (state.barrier.level > 0.95) fsm = 'OPEN';
    1036. 

  1036.   else if (state.barrier.level < 0.05) fsm = 'CLOSED';
    1037. 

  1037. 

  1038.   const el = document.getElementById('fsmState');
    1039. 

  1039.   if (el) el.textContent = fsm;
    1040. 

  1040. 

  1041.   const tEl = document.getElementById('fsmTimer');
    1042. 

  1042.   if (tEl) {
    1043. 

  1043.     const max = state.model ? state.model.autoClose : 0;
    1044. 

  1044.     tEl.textContent = max > 0
    1045. 

  1045.       ? state.autoCloseTimer.toFixed(1) + ' / ' + max.toFixed(1) + ' с'
    1046. 

  1046.       : '— отключено —';
    1047. 

  1047.   }
    1048. 

  1048. 

  1049.   const lEl = document.getElementById('fsmLevel');
    1050. 

  1050.   if (lEl) lEl.textContent = Math.round(state.barrier.level * 100) + ' %';
    1051. 

  1051. 

  1052.   const aEl = document.getElementById('fsmAlarms');
    1053. 

  1053.   if (aEl) {
    1054. 

  1054.     const count = (s.alarm ? 1 : 0) + (s.impact ? 1 : 0) +
    1055. 

  1055.       (s.photo && state.barrier.moving && state.barrier.target === 0 ? 1 : 0);
    1056. 

  1056.     aEl.textContent = count;
    1057. 

  1057.     aEl.style.color = count > 0 ? '#ff6060' : '#80e0ff';
    1058. 

  1058.   }
    1059. 

  1059. }
    1060. 

  1060. 

  1061. /* ===== ОСЦИЛЛОГРАММА ===== */
    1062. 

  1062. const scopeCv = document.getElementById('scopeCanvas');
    1063. 

  1063. const scopeCtx = scopeCv.getContext('2d');
    1064. 

  1064. const scopeSignals = [
    1065. 

  1065.   { id:'relayOpen',  color:'#40d080', label:'OPEN' },
    1066. 

  1066.   { id:'relayClose', color:'#ff4040', label:'CLOSE' },
    1067. 

  1067.   { id:'relayStop',  color:'#ffb040', label:'STOP' },
    1068. 

  1068.   { id:'photo',      color:'#60a0e0', label:'PHOTO' },
    1069. 

  1069.   { id:'loop1',      color:'#a0c8ff', label:'LOOP1' }
    1070. 

  1070. ];
    1071. 

  1071. const scopeHistory = scopeSignals.map(() => new Array(120).fill(0));
    1072. 

  1072. let scopeFrame = 0;
    1073. 

  1073. 

  1074. function drawScope() {
    1075. 

  1075.   const SW = scopeCv.width, SH = scopeCv.height;
    1076. 

  1076.   scopeCtx.fillStyle = '#04060a';
    1077. 

  1077.   scopeCtx.fillRect(0, 0, SW, SH);
    1078. 

  1078. 

  1079.   scopeCtx.strokeStyle = 'rgba(40,60,80,.35)';
    1080. 

  1080.   scopeCtx.lineWidth = 1;
    1081. 

  1081.   for (let x = 0; x < SW; x += 30) {
    1082. 

  1082.     scopeCtx.beginPath(); scopeCtx.moveTo(x, 0); scopeCtx.lineTo(x, SH); scopeCtx.stroke();
    1083. 

  1083.   }
    1084. 

  1084. 

  1085.   const rowH = SH / scopeSignals.length;
    1086. 

  1086.   scopeSignals.forEach((sig, i) => {
    1087. 

  1087.     const y = rowH * i + rowH * 0.7;
    1088. 

  1088.     scopeCtx.strokeStyle = 'rgba(40,60,80,.35)';
    1089. 

  1089.     scopeCtx.beginPath(); scopeCtx.moveTo(0, y); scopeCtx.lineTo(SW, y); scopeCtx.stroke();
    1090. 

  1090.     const hist = scopeHistory[i];
    1091. 

  1091.     scopeCtx.strokeStyle = sig.color;
    1092. 

  1092.     scopeCtx.lineWidth = 1.6;
    1093. 

  1093.     scopeCtx.beginPath();
    1094. 

  1094.     for (let x = 0; x < hist.length; x++) {
    1095. 

  1095.       const px = (x / hist.length) * SW;
    1096. 

  1096.       const py = y - hist[x] * (rowH * 0.55);
    1097. 

  1097.       if (x === 0) scopeCtx.moveTo(px, py);
    1098. 

  1098.       else scopeCtx.lineTo(px, py);
    1099. 

  1099.     }
    1100. 

  1100.     scopeCtx.stroke();
    1101. 

  1101.     scopeCtx.fillStyle = sig.color;
    1102. 

  1102.     scopeCtx.font = 'bold 8px "Courier New"';
    1103. 

  1103.     scopeCtx.fillText(sig.label, 4, rowH * i + 9);
    1104. 

  1104.   });
    1105. 

  1105. }
    1106. 

  1106. function pushScopeSample() {
    1107. 

  1107.   scopeFrame++;
    1108. 

  1108.   if (scopeFrame % 4 !== 0) return;
    1109. 

  1109.   scopeSignals.forEach((sig, i) => {
    1110. 

  1110.     const val = state.skud[sig.id] ? 1 : 0;
    1111. 

  1111.     scopeHistory[i].shift();
    1112. 

  1112.     scopeHistory[i].push(val);
    1113. 

  1113.   });
    1114. 

  1114. }
    1115. 

  1115. 

  1116. /* ===== ФОН ===== */
    1117. 

  1117. function drawSky() {
    1118. 

  1118.   const l = L();
    1119. 

  1119.   const [c1, c2, c3] = skyColors();
    1120. 

  1120.   const grad = ctx.createLinearGradient(0, 0, 0, l.horizonY);
    1121. 

  1121.   grad.addColorStop(0, c1); grad.addColorStop(0.6, c2); grad.addColorStop(1, c3);
    1122. 

  1122.   ctx.fillStyle = grad; ctx.fillRect(0, 0, W, l.horizonY);
    1123. 

  1123. 

  1124.   if (isStarVisible()) {
    1125. 

  1125.     for (let i = 0; i < 90; i++) {
    1126. 

  1126.       const x = (i * 173.5) % W, y = (i * 97.3) % (l.horizonY - 15);
    1127. 

  1127.       const a = (0.15 + 0.4 * Math.abs(Math.sin(state.time * 0.5 + i))) *
    1128. 

  1128.                 (state.weather === 'clear' ? 1 : 0.35);
    1129. 

  1129.       ctx.fillStyle = `rgba(200,220,255,${a})`;
    1130. 

  1130.       ctx.fillRect(x, y, 1.5, 1.5);
    1131. 

  1131.     }
    1132. 

  1132.     const mx = W * 0.78, my = l.horizonY * 0.30;
    1133. 

  1133.     const moonG = ctx.createRadialGradient(mx, my, 3, mx, my, 55);
    1134. 

  1134.     moonG.addColorStop(0, 'rgba(220,230,255,.55)');
    1135. 

  1135.     moonG.addColorStop(0.4, 'rgba(180,200,230,.10)');
    1136. 

  1136.     moonG.addColorStop(1, 'rgba(180,200,230,0)');
    1137. 

  1137.     ctx.fillStyle = moonG; ctx.fillRect(mx - 60, my - 60, 120, 120);
    1138. 

  1138.     ctx.beginPath(); ctx.arc(mx, my, 12, 0, Math.PI * 2);
    1139. 

  1139.     ctx.fillStyle = 'rgba(240,240,220,.85)'; ctx.fill();
    1140. 

  1140.     ctx.beginPath(); ctx.arc(mx - 4, my - 3, 10, 0, Math.PI * 2);
    1141. 

  1141.     ctx.fillStyle = 'rgba(230,235,220,.75)'; ctx.fill();
    1142. 

  1142.   }
    1143. 

  1143. 

  1144.   if (isSunVisible()) {
    1145. 

  1145.     const isDawn = lighting().mode === 'dawn';
    1146. 

  1146.     const sy = l.horizonY * (isDawn ? 0.55 : 0.32);
    1147. 

  1147.     const sx = W * 0.22;
    1148. 

  1148.     const sg = ctx.createRadialGradient(sx, sy, 6, sx, sy, 130);
    1149. 

  1149.     sg.addColorStop(0, isDawn ? 'rgba(255,220,180,.9)' : 'rgba(255,250,210,.95)');
    1150. 

  1150.     sg.addColorStop(0.3, isDawn ? 'rgba(255,200,140,.25)' : 'rgba(255,240,180,.25)');
    1151. 

  1151.     sg.addColorStop(1, 'rgba(255,240,180,0)');
    1152. 

  1152.     ctx.fillStyle = sg; ctx.fillRect(sx - 140, sy - 140, 280, 280);
    1153. 

  1153.     ctx.beginPath(); ctx.arc(sx, sy, 22, 0, Math.PI * 2);
    1154. 

  1154.     ctx.fillStyle = isDawn ? 'rgba(255,220,180,.95)' : 'rgba(255,252,220,.98)'; ctx.fill();
    1155. 

  1155.     ctx.save();
    1156. 

  1156.     ctx.globalCompositeOperation = 'lighter';
    1157. 

  1157.     for (let i = 0; i < 8; i++) {
    1158. 

  1158.       const a = -0.4 + i * 0.1 + Math.sin(state.time * 0.3 + i) * 0.02;
    1159. 

  1159.       const len = 180 + (i % 3) * 40;
    1160. 

  1160.       ctx.beginPath();
    1161. 

  1161.       ctx.moveTo(sx, sy);
    1162. 

  1162.       ctx.lineTo(sx + Math.cos(a) * len, sy + Math.sin(a) * len);
    1163. 

  1163.       ctx.lineTo(sx + Math.cos(a + 0.04) * len, sy + Math.sin(a + 0.04) * len);
    1164. 

  1164.       ctx.closePath();
    1165. 

  1165.       ctx.fillStyle = isDawn ? 'rgba(255,220,180,.06)' : 'rgba(255,250,220,.05)';
    1166. 

  1166.       ctx.fill();
    1167. 

  1167.     }
    1168. 

  1168.     ctx.restore();
    1169. 

  1169.   }
    1170. 

  1170. 

  1171.   const m = lighting().mode;
    1172. 

  1172.   let bcol = '#0a1220';
    1173. 

  1173.   if (m === 'day') bcol = '#3a4a5a';
    1174. 

  1174.   else if (m === 'overcast') bcol = '#454e58';
    1175. 

  1175.   else if (m === 'dawn') bcol = '#3a4050';
    1176. 

  1176.   else if (m === 'dusk') bcol = '#1c1a28';
    1177. 

  1177.   ctx.fillStyle = bcol; ctx.globalAlpha = 0.55;
    1178. 

  1178.   for (let i = 0; i < 30; i++) {
    1179. 

  1179.     const bx = i * (W / 30), bw = 20 + (i % 5) * 14, bh = 20 + (i % 7) * 12;
    1180. 

  1180.     ctx.fillRect(bx, l.horizonY - bh, bw, bh);
    1181. 

  1181.   }
    1182. 

  1182.   ctx.globalAlpha = 1;
    1183. 

  1183.   for (let i = 0; i < 24; i++) {
    1184. 

  1184.     const bx = i * (W / 24), bw = 18 + (i % 4) * 12, bh = 30 + (i % 5) * 12;
    1185. 

  1185.     ctx.fillRect(bx, l.horizonY - bh, bw, bh);
    1186. 

  1186.     if (isStarVisible() && (i * 13) % 5 === 0) {
    1187. 

  1187.       ctx.fillStyle = 'rgba(255,200,120,.35)';
    1188. 

  1188.       ctx.fillRect(bx + 4, l.horizonY - bh + 8, 3, 3);
    1189. 

  1189.       ctx.fillRect(bx + 12, l.horizonY - bh + 20, 3, 3);
    1190. 

  1190.       ctx.fillStyle = bcol;
    1191. 

  1191.     }
    1192. 

  1192.   }
    1193. 

  1193. }
    1194. 

  1194. 

  1195. function drawGround() {
    1196. 

  1196.   const l = L();
    1197. 

  1197.   const m = lighting().mode;
    1198. 

  1198.   let g;
    1199. 

  1199.   if (m === 'day' || m === 'overcast') {
    1200. 

  1200.     g = ctx.createLinearGradient(0, l.horizonY, 0, H);
    1201. 

  1201.     g.addColorStop(0, '#2a3a28'); g.addColorStop(1, '#101810');
    1202. 

  1202.   } else if (m === 'dawn' || m === 'dusk') {
    1203. 

  1203.     g = ctx.createLinearGradient(0, l.horizonY, 0, H);
    1204. 

  1204.     g.addColorStop(0, '#1a2018'); g.addColorStop(1, '#0a0e08');
    1205. 

  1205.   } else {
    1206. 

  1206.     g = ctx.createLinearGradient(0, l.horizonY, 0, H);
    1207. 

  1207.     g.addColorStop(0, '#0a1410'); g.addColorStop(1, '#03060a');
    1208. 

  1208.   }
    1209. 

  1209.   ctx.fillStyle = g; ctx.fillRect(0, l.horizonY, W, H - l.horizonY);
    1210. 

  1210. 

  1211.   const haze = ctx.createLinearGradient(0, l.horizonY - 4, 0, l.horizonY + 30);
    1212. 

  1212.   haze.addColorStop(0, 'rgba(80,110,140,.35)');
    1213. 

  1213.   haze.addColorStop(1, 'rgba(80,110,140,0)');
    1214. 

  1214.   ctx.fillStyle = haze;
    1215. 

  1215.   ctx.fillRect(0, l.horizonY - 4, W, 34);
    1216. 

  1216. }
    1217. 

  1217. 

  1218. function drawRoads() {
    1219. 

  1219.   const l = L();
    1220. 

  1220.   const m = lighting().mode;
    1221. 

  1221.   let c1, c2, edge, dash;
    1222. 

  1222.   if (m === 'day') {
    1223. 

  1223.     c1 = ['#3a3e44', '#25282c']; c2 = ['#3a3e44', '#25282c'];
    1224. 

  1224.     edge = 'rgba(180,180,180,.7)'; dash = 'rgba(220,200,140,.6)';
    1225. 

  1225.   } else if (m === 'overcast' || m === 'dawn') {
    1226. 

  1226.     c1 = ['#2a2e34', '#1a1d22']; c2 = ['#2a2e34', '#1a1d22'];
    1227. 

  1227.     edge = 'rgba(140,150,160,.6)'; dash = 'rgba(200,180,140,.5)';
    1228. 

  1228.   } else if (m === 'dusk') {
    1229. 

  1229.     c1 = ['#1a1d24', '#0d1014']; c2 = ['#1a1d24', '#0d1014'];
    1230. 

  1230.     edge = 'rgba(120,130,140,.5)'; dash = 'rgba(200,180,140,.4)';
    1231. 

  1231.   } else {
    1232. 

  1232.     c1 = ['#1a1e24', '#0d1014']; c2 = ['#1a1e24', '#0d1014'];
    1233. 

  1233.     edge = 'rgba(120,130,140,.5)'; dash = 'rgba(220,200,140,.4)';
    1234. 

  1234.   }
    1235. 

  1235.   const g1 = ctx.createLinearGradient(0, l.topLaneTop, 0, l.topLaneBot);
    1236. 

  1236.   g1.addColorStop(0, c1[0]); g1.addColorStop(1, c1[1]);
    1237. 

  1237.   ctx.fillStyle = g1; ctx.fillRect(0, l.topLaneTop, W, l.topLaneBot - l.topLaneTop);
    1238. 

  1238.   const g2 = ctx.createLinearGradient(0, l.botLaneTop, 0, l.botLaneBot);
    1239. 

  1239.   g2.addColorStop(0, c2[0]); g2.addColorStop(1, c2[1]);
    1240. 

  1240.   ctx.fillStyle = g2; ctx.fillRect(0, l.botLaneTop, W, l.botLaneBot - l.botLaneTop);
    1241. 

  1241.   ctx.strokeStyle = edge; ctx.lineWidth = 2;
    1242. 

  1242.   ctx.beginPath(); ctx.moveTo(0, (l.topLaneBot + l.botLaneTop) / 2);
    1243. 

  1243.   ctx.lineTo(W, (l.topLaneBot + l.botLaneTop) / 2); ctx.stroke();
    1244. 

  1244.   ctx.strokeStyle = dash; ctx.lineWidth = 3;
    1245. 

  1245.   ctx.setLineDash([30, 25]);
    1246. 

  1246.   ctx.beginPath(); ctx.moveTo(0, (l.topLaneBot + l.botLaneTop) / 2 + 6);
    1247. 

  1247.   ctx.lineTo(W, (l.topLaneBot + l.botLaneTop) / 2 + 6); ctx.stroke();
    1248. 

  1248.   ctx.setLineDash([]);
    1249. 

  1249. 

  1250.   if (isWet()) {
    1251. 

  1251.     ctx.fillStyle = 'rgba(120,150,200,.06)';
    1252. 

  1252.     ctx.fillRect(0, l.topLaneTop, W, l.topLaneBot - l.topLaneTop);
    1253. 

  1253.     ctx.fillRect(0, l.botLaneTop, W, l.botLaneBot - l.botLaneTop);
    1254. 

  1254.     if (state.car) {
    1255. 

  1255.       const cx = state.car.x;
    1256. 

  1256.       const refl = ctx.createLinearGradient(cx, 0, cx, l.topLaneBot);
    1257. 

  1257.       refl.addColorStop(0, 'rgba(255,240,180,.22)');
    1258. 

  1258.       refl.addColorStop(1, 'rgba(255,240,180,0)');
    1259. 

  1259.       ctx.fillStyle = refl;
    1260. 

  1260.       ctx.fillRect(cx - 90, l.topLaneTop, 180, l.topLaneBot - l.topLaneTop);
    1261. 

  1261.     }
    1262. 

  1262.   }
    1263. 

  1263. }
    1264. 

  1264. 

  1265. function drawBooth() {
    1266. 

  1266.   const l = L();
    1267. 

  1267.   const bx = l.boothX, by = l.boothBaseY, bw = l.boothW, bh = l.boothH;
    1268. 

  1268.   const m = lighting().mode;
    1269. 

  1269.   const bright = (m === 'day' || m === 'overcast' || m === 'dawn');
    1270. 

  1270. 

  1271.   ctx.fillStyle = 'rgba(0,0,0,.55)';
    1272. 

  1272.   ctx.beginPath(); ctx.ellipse(bx + bw/2, by + 6, bw/2 + 14, 9, 0, 0, Math.PI * 2); ctx.fill();
    1273. 

  1273.   ctx.fillStyle = '#0a0f14'; ctx.fillRect(bx - 8, by, bw + 16, 12);
    1274. 

  1274. 

  1275.   const wg = ctx.createLinearGradient(bx, 0, bx + bw, 0);
    1276. 

  1276.   if (bright) { wg.addColorStop(0, '#6a7482'); wg.addColorStop(0.5, '#8a94a4'); wg.addColorStop(1, '#4a5462'); }
    1277. 

  1277.   else { wg.addColorStop(0, '#2a3442'); wg.addColorStop(0.5, '#4a5a6a'); wg.addColorStop(1, '#182028'); }
    1278. 

  1278.   ctx.fillStyle = wg; ctx.fillRect(bx, by - bh, bw, bh);
    1279. 

  1279.   ctx.strokeStyle = '#4a5a70'; ctx.lineWidth = 2; ctx.strokeRect(bx, by - bh, bw, bh);
    1280. 

  1280. 

  1281.   ctx.fillStyle = '#0a0f14'; ctx.fillRect(bx - 12, by - bh - 14, bw + 24, 14);
    1282. 

  1282.   ctx.strokeStyle = '#3a4452'; ctx.strokeRect(bx - 12, by - bh - 14, bw + 24, 14);
    1283. 

  1283.   ctx.fillStyle = 'rgba(255,255,255,.08)';
    1284. 

  1284.   ctx.fillRect(bx - 12, by - bh - 14, bw + 24, 4);
    1285. 

  1285. 

  1286.   const glow = bright ? 0.4 : 0.8 + 0.15 * Math.sin(state.time * 1.5);
    1287. 

  1287.   ctx.fillStyle = `rgba(255,220,140,${glow})`;
    1288. 

  1288.   ctx.fillRect(bx + 15, by - bh + 25, 60, 60);
    1289. 

  1289.   const wgl = ctx.createLinearGradient(bx + 15, by - bh + 25, bx + 75, by - bh + 85);
    1290. 

  1290.   wgl.addColorStop(0, 'rgba(255,255,255,.28)');
    1291. 

  1291.   wgl.addColorStop(0.5, 'rgba(255,255,255,0)');
    1292. 

  1292.   wgl.addColorStop(1, 'rgba(255,255,255,.10)');
    1293. 

  1293.   ctx.fillStyle = wgl; ctx.fillRect(bx + 15, by - bh + 25, 60, 60);
    1294. 

  1294.   ctx.strokeStyle = '#4a5a70'; ctx.strokeRect(bx + 15, by - bh + 25, 60, 60);
    1295. 

  1295.   ctx.beginPath(); ctx.moveTo(bx + 45, by - bh + 25); ctx.lineTo(bx + 45, by - bh + 85); ctx.stroke();
    1296. 

  1296.   ctx.beginPath(); ctx.moveTo(bx + 15, by - bh + 55); ctx.lineTo(bx + 75, by - bh + 55); ctx.stroke();
    1297. 

  1297.   const oGlow = ctx.createRadialGradient(bx + 45, by - bh + 55, 8, bx + 45, by - bh + 55, 60);
    1298. 

  1298.   oGlow.addColorStop(0, `rgba(255,220,140,${0.18 * glow + 0.08})`);
    1299. 

  1299.   oGlow.addColorStop(1, 'rgba(255,220,140,0)');
    1300. 

  1300.   ctx.fillStyle = oGlow; ctx.fillRect(bx + 15 - 60, by - bh + 25 - 60, 180, 180);
    1301. 

  1301. 

  1302.   ctx.fillStyle = '#1a2028'; ctx.fillRect(bx + bw - 45, by - bh + 25, 35, bh - 25);
    1303. 

  1303.   ctx.strokeStyle = '#4a5a70'; ctx.strokeRect(bx + bw - 45, by - bh + 25, 35, bh - 25);
    1304. 

  1304.   ctx.fillStyle = '#e8c070';
    1305. 

  1305.   ctx.beginPath(); ctx.arc(bx + bw - 40, by - bh/2 - 5, 2.6, 0, Math.PI * 2); ctx.fill();
    1306. 

  1306.   ctx.fillStyle = 'rgba(255,255,255,.5)';
    1307. 

  1307.   ctx.beginPath(); ctx.arc(bx + bw - 41, by - bh/2 - 6, 1.1, 0, Math.PI * 2); ctx.fill();
    1308. 

  1308. 

  1309.   ctx.fillStyle = '#80a0c0'; ctx.font = 'bold 11px "Courier New"';
    1310. 

  1310.   ctx.textAlign = 'center';
    1311. 

  1311.   ctx.fillText('ОХРАНА', bx + bw/2, by - bh - 22);
    1312. 

  1312.   ctx.textAlign = 'left';
    1313. 

  1313. }
    1314. 

  1314. 

  1315. function drawGuard(x, y) {
    1316. 

  1316.   ctx.fillStyle = 'rgba(0,0,0,.55)';
    1317. 

  1317.   ctx.beginPath(); ctx.ellipse(x, y + 2, 14, 4, 0, 0, Math.PI * 2); ctx.fill();
    1318. 

  1318.   ctx.fillStyle = '#1a2230';
    1319. 

  1319.   ctx.fillRect(x - 8, y - 35, 7, 35); ctx.fillRect(x + 1, y - 35, 7, 35);
    1320. 

  1320.   ctx.fillStyle = '#0a0a0a';
    1321. 

  1321.   ctx.fillRect(x - 10, y - 3, 10, 5); ctx.fillRect(x, y - 3, 10, 5);
    1322. 

  1322.   const bg = ctx.createLinearGradient(x - 11, 0, x + 11, 0);
    1323. 

  1323.   bg.addColorStop(0, '#1a3a5e'); bg.addColorStop(0.4, '#3a6a9a'); bg.addColorStop(1, '#1a3050');
    1324. 

  1324.   ctx.fillStyle = bg; ctx.fillRect(x - 11, y - 68, 22, 36);
    1325. 

  1325.   ctx.strokeStyle = '#0a1a30'; ctx.lineWidth = 1; ctx.strokeRect(x - 11, y - 68, 22, 36);
    1326. 

  1326.   ctx.fillStyle = '#e8e8f0';
    1327. 

  1327.   ctx.fillRect(x - 11, y - 68, 5, 3); ctx.fillRect(x + 6, y - 68, 5, 3);
    1328. 

  1328.   ctx.fillStyle = '#0a0a0a'; ctx.fillRect(x - 11, y - 38, 22, 4);
    1329. 

  1329.   ctx.fillStyle = '#1a3a5e';
    1330. 

  1330.   ctx.fillRect(x - 16, y - 66, 6, 30); ctx.fillRect(x + 10, y - 66, 6, 30);
    1331. 

  1331.   ctx.fillStyle = '#d0a880';
    1332. 

  1332.   ctx.fillRect(x - 16, y - 38, 6, 7); ctx.fillRect(x + 10, y - 38, 6, 7);
    1333. 

  1333.   ctx.fillStyle = '#d0a880'; ctx.fillRect(x - 3, y - 72, 6, 4);
    1334. 

  1334.   ctx.beginPath(); ctx.arc(x, y - 81, 9, 0, Math.PI * 2);
    1335. 

  1335.   const fg = ctx.createRadialGradient(x - 3, y - 83, 2, x, y - 81, 9);
    1336. 

  1336.   fg.addColorStop(0, '#e8b890'); fg.addColorStop(1, '#b08868');
    1337. 

  1337.   ctx.fillStyle = fg; ctx.fill();
    1338. 

  1338.   ctx.fillStyle = '#1a1a1a';
    1339. 

  1339.   ctx.beginPath(); ctx.arc(x - 3, y - 82, 1, 0, Math.PI * 2); ctx.fill();
    1340. 

  1340.   ctx.beginPath(); ctx.arc(x + 3, y - 82, 1, 0, Math.PI * 2); ctx.fill();
    1341. 

  1341.   ctx.fillStyle = '#0f2340';
    1342. 

  1342.   ctx.beginPath(); ctx.arc(x, y - 88, 10, Math.PI, Math.PI * 2); ctx.fill();
    1343. 

  1343.   ctx.fillRect(x - 11, y - 88, 22, 3);
    1344. 

  1344.   ctx.fillStyle = '#050a15'; ctx.fillRect(x - 12, y - 85, 24, 3);
    1345. 

  1345.   ctx.fillStyle = '#c0a040'; ctx.beginPath(); ctx.arc(x, y - 90, 2, 0, Math.PI * 2); ctx.fill();
    1346. 

  1346.   ctx.fillStyle = 'rgba(255,220,140,.6)'; ctx.beginPath(); ctx.arc(x - 0.5, y - 90.5, 0.8, 0, Math.PI * 2); ctx.fill();
    1347. 

  1347. }
    1348. 

  1348. 

  1349. function drawBarrier() {
    1350. 

  1350.   const l = L();
    1351. 

  1351.   const pillarX = l.pillarX, pillarW = l.pillarW, pillarH = l.pillarH;
    1352. 

  1352.   const groundBase = l.topLaneY;
    1353. 

  1353.   const pillarTopY = groundBase - pillarH;
    1354. 

  1354.   const pivotX = pillarX, pivotY = groundBase - 80;
    1355. 

  1355.   const armLen = (state.model ? state.model.armLen : 240);
    1356. 

  1356.   const armH = l.armH;
    1357. 

  1357.   const level = state.barrier.level;
    1358. 

  1358.   const m = lighting().mode;
    1359. 

  1359.   const bright = (m === 'day' || m === 'overcast' || m === 'dawn');
    1360. 

  1360. 

  1361.   ctx.fillStyle = 'rgba(0,0,0,.55)';
    1362. 

  1362.   ctx.beginPath(); ctx.ellipse(pillarX + pillarW/2, groundBase + 4, 26, 8, 0, 0, Math.PI * 2); ctx.fill();
    1363. 

  1363.   ctx.fillStyle = '#1a1e24'; ctx.fillRect(pillarX - 10, groundBase - 10, pillarW + 20, 16);
    1364. 

  1364.   ctx.strokeStyle = '#3a4858'; ctx.lineWidth = 1.5; ctx.strokeRect(pillarX - 10, groundBase - 10, pillarW + 20, 16);
    1365. 

  1365.   ctx.fillStyle = 'rgba(255,255,255,.06)';
    1366. 

  1366.   ctx.fillRect(pillarX - 10, groundBase - 10, pillarW + 20, 3);
    1367. 

  1367. 

  1368.   const g = ctx.createLinearGradient(pillarX, 0, pillarX + pillarW, 0);
    1369. 

  1369.   if (bright) { g.addColorStop(0, '#3a4858'); g.addColorStop(0.35, '#7a8898'); g.addColorStop(0.6, '#5a6878'); g.addColorStop(1, '#2a3442'); }
    1370. 

  1370.   else { g.addColorStop(0, '#1a2028'); g.addColorStop(0.35, '#4a5a6a'); g.addColorStop(0.6, '#2a3442'); g.addColorStop(1, '#0a1018'); }
    1371. 

  1371.   ctx.fillStyle = g; ctx.fillRect(pillarX, pillarTopY, pillarW, pillarH);
    1372. 

  1372.   ctx.strokeStyle = '#000'; ctx.lineWidth = 1.5; ctx.strokeRect(pillarX, pillarTopY, pillarW, pillarH);
    1373. 

  1373. 

  1374.   const shine = ctx.createLinearGradient(pillarX + 4, 0, pillarX + 12, 0);
    1375. 

  1375.   shine.addColorStop(0, 'rgba(255,255,255,.18)');
    1376. 

  1376.   shine.addColorStop(1, 'rgba(255,255,255,0)');
    1377. 

  1377.   ctx.fillStyle = shine; ctx.fillRect(pillarX + 4, pillarTopY + 4, 8, pillarH - 8);
    1378. 

  1378. 

  1379.   for (let i = 0; i < 4; i++) {
    1380. 

  1380.     ctx.fillStyle = i % 2 === 0 ? '#a08030' : '#1a1a1a';
    1381. 

  1381.     ctx.fillRect(pillarX, pillarTopY + pillarH - 90 + i * 20, pillarW, 20);
    1382. 

  1382.   }
    1383. 

  1383.   ctx.fillStyle = 'rgba(255,220,140,.12)';
    1384. 

  1384.   ctx.fillRect(pillarX, pillarTopY + pillarH - 90, pillarW, 80);
    1385. 

  1385. 

  1386.   ctx.fillStyle = '#505860';
    1387. 

  1387.   ctx.beginPath();
    1388. 

  1388.   ctx.moveTo(pillarX - 5, pillarTopY); ctx.lineTo(pillarX + pillarW + 5, pillarTopY);
    1389. 

  1389.   ctx.lineTo(pillarX + pillarW, pillarTopY - 12); ctx.lineTo(pillarX, pillarTopY - 12);
    1390. 

  1390.   ctx.closePath(); ctx.fill();
    1391. 

  1391.   ctx.strokeStyle = '#000'; ctx.stroke();
    1392. 

  1392.   ctx.fillStyle = 'rgba(255,255,255,.12)';
    1393. 

  1393.   ctx.fillRect(pillarX, pillarTopY - 12, pillarW, 3);
    1394. 

  1394. 

  1395.   const blink = Math.sin(state.time * 4) > 0;
    1396. 

  1396.   const lampColor = level > 0.9 ? '#40d080' : (level > 0.1 ? '#ffb040' : '#ff2020');
    1397. 

  1397.   const lampX = pillarX + pillarW/2, lampY = pillarTopY - 26;
    1398. 

  1398.   if (blink) {
    1399. 

  1399.     const lampGlow = ctx.createRadialGradient(lampX, lampY, 3, lampX, lampY, 40);
    1400. 

  1400.     lampGlow.addColorStop(0, lampColor + 'cc');
    1401. 

  1401.     lampGlow.addColorStop(0.4, lampColor + '44');
    1402. 

  1402.     lampGlow.addColorStop(1, lampColor + '00');
    1403. 

  1403.     ctx.fillStyle = lampGlow;
    1404. 

  1404.     ctx.fillRect(lampX - 44, lampY - 44, 88, 88);
    1405. 

  1405.   }
    1406. 

  1406.   ctx.beginPath(); ctx.arc(lampX, lampY, 9, 0, Math.PI * 2);
    1407. 

  1407.   const lampGrad = ctx.createRadialGradient(lampX - 3, lampY - 3, 2, lampX, lampY, 9);
    1408. 

  1408.   if (blink) {
    1409. 

  1409.     lampGrad.addColorStop(0, '#ffffff');
    1410. 

  1410.     lampGrad.addColorStop(0.4, lampColor);
    1411. 

  1411.     lampGrad.addColorStop(1, lampColor);
    1412. 

  1412.   } else {
    1413. 

  1413.     lampGrad.addColorStop(0, '#3a3a3a');
    1414. 

  1414.     lampGrad.addColorStop(1, '#1a1a1a');
    1415. 

  1415.   }
    1416. 

  1416.   ctx.fillStyle = lampGrad; ctx.fill();
    1417. 

  1417.   ctx.strokeStyle = '#000'; ctx.lineWidth = 1; ctx.stroke();
    1418. 

  1418.   ctx.beginPath(); ctx.arc(lampX - 3, lampY - 3, 2.5, 0, Math.PI * 2);
    1419. 

  1419.   ctx.fillStyle = 'rgba(255,255,255,.6)'; ctx.fill();
    1420. 

  1420. 

  1421.   ctx.beginPath(); ctx.arc(pivotX, pivotY, 15, 0, Math.PI * 2);
    1422. 

  1422.   ctx.fillStyle = '#2a3442'; ctx.fill();
    1423. 

  1423.   ctx.strokeStyle = '#000'; ctx.lineWidth = 2; ctx.stroke();
    1424. 

  1424.   ctx.beginPath(); ctx.arc(pivotX, pivotY, 6, 0, Math.PI * 2);
    1425. 

  1425.   const hg = ctx.createRadialGradient(pivotX - 2, pivotY - 2, 1, pivotX, pivotY, 6);
    1426. 

  1426.   hg.addColorStop(0, '#c8d4e0'); hg.addColorStop(1, '#506070');
    1427. 

  1427.   ctx.fillStyle = hg; ctx.fill();
    1428. 

  1428.   ctx.beginPath(); ctx.arc(pivotX - 3, pivotY - 3, 2, 0, Math.PI * 2);
    1429. 

  1429.   ctx.fillStyle = 'rgba(255,255,255,.5)'; ctx.fill();
    1430. 

  1430. 

  1431.   const angle = Math.PI + level * Math.PI / 2;
    1432. 

  1432.   ctx.save();
    1433. 

  1433.   ctx.translate(pivotX, pivotY); ctx.rotate(angle);
    1434. 

  1434.   const seg = 14;
    1435. 

  1435.   for (let i = 0; i < seg; i++) {
    1436. 

  1436.     ctx.fillStyle = i % 2 === 0 ? '#e04040' : '#e8e8e8';
    1437. 

  1437.     ctx.fillRect(i * (armLen / seg), -armH/2, armLen / seg, armH);
    1438. 

  1438.   }
    1439. 

  1439.   ctx.fillStyle = 'rgba(0,0,0,.35)';
    1440. 

  1440.   ctx.fillRect(0, armH/2 - 2, armLen, 2);
    1441. 

  1441.   ctx.fillStyle = 'rgba(255,255,255,.4)';
    1442. 

  1442.   ctx.fillRect(0, -armH/2, armLen, 2);
    1443. 

  1443.   ctx.strokeStyle = '#000'; ctx.lineWidth = 2; ctx.strokeRect(0, -armH/2, armLen, armH);
    1444. 

  1444.   ctx.beginPath(); ctx.arc(armLen, 0, 12, 0, Math.PI * 2);
    1445. 

  1445.   const ng = ctx.createRadialGradient(armLen - 3, -3, 2, armLen, 0, 12);
    1446. 

  1446.   ng.addColorStop(0, '#ffffff'); ng.addColorStop(1, '#a8b0b8');
    1447. 

  1447.   ctx.fillStyle = ng; ctx.fill();
    1448. 

  1448.   ctx.strokeStyle = '#000'; ctx.lineWidth = 2; ctx.stroke();
    1449. 

  1449.   ctx.beginPath(); ctx.arc(armLen, 0, 5, 0, Math.PI * 2);
    1450. 

  1450.   ctx.fillStyle = '#8090a0'; ctx.fill();
    1451. 

  1451.   ctx.restore();
    1452. 

  1452. 

  1453.   if (level < 0.9) {
    1454. 

  1454.     const endX = pivotX + Math.cos(angle) * armLen;
    1455. 

  1455.     const endY = pivotY + Math.sin(angle) * armLen;
    1456. 

  1456.     const blinkE = Math.sin(state.time * 6) > 0;
    1457. 

  1457.     if (blinkE) {
    1458. 

  1458.       const eGlow = ctx.createRadialGradient(endX, endY, 2, endX, endY, 26);
    1459. 

  1459.       eGlow.addColorStop(0, 'rgba(255,64,64,.55)');
    1460. 

  1460.       eGlow.addColorStop(1, 'rgba(255,64,64,0)');
    1461. 

  1461.       ctx.fillStyle = eGlow;
    1462. 

  1462.       ctx.fillRect(endX - 28, endY - 28, 56, 56);
    1463. 

  1463.     }
    1464. 

  1464.     ctx.beginPath(); ctx.arc(endX, endY, 6, 0, Math.PI * 2);
    1465. 

  1465.     ctx.fillStyle = blinkE ? '#ff4040' : '#601010'; ctx.fill();
    1466. 

  1466.     ctx.strokeStyle = '#000'; ctx.lineWidth = 1; ctx.stroke();
    1467. 

  1467.   }
    1468. 

  1468. 

  1469.   if (state.model && state.model.hasLoop) {
    1470. 

  1470.     const loopX = l.pivotX - 280;
    1471. 

  1471.     const loopY = l.topLaneY + 10;
    1472. 

  1472.     const loopW = 200, loopH = 18;
    1473. 

  1473.     ctx.strokeStyle = state.skud.loop1 ? 'rgba(96,180,255,.85)' : 'rgba(96,160,224,.35)';
    1474. 

  1474.     ctx.lineWidth = 2;
    1475. 

  1475.     ctx.strokeRect(loopX, loopY, loopW, loopH);
    1476. 

  1476.     if (state.skud.loop1) {
    1477. 

  1477.       ctx.fillStyle = 'rgba(96,180,255,.18)';
    1478. 

  1478.       ctx.fillRect(loopX, loopY, loopW, loopH);
    1479. 

  1479.       const lg = ctx.createRadialGradient(loopX + loopW/2, loopY + loopH/2, 5, loopX + loopW/2, loopY + loopH/2, loopW/2);
    1480. 

  1480.       lg.addColorStop(0, 'rgba(120,200,255,.18)');
    1481. 

  1481.       lg.addColorStop(1, 'rgba(120,200,255,0)');
    1482. 

  1482.       ctx.fillStyle = lg;
    1483. 

  1483.       ctx.fillRect(loopX - 30, loopY - 30, loopW + 60, loopH + 60);
    1484. 

  1484.     }
    1485. 

  1485.   }
    1486. 

  1486.   if (state.model && state.model.hasPhoto) {
    1487. 

  1487.     const px1 = l.pivotX - state.model.armLen - 5;
    1488. 

  1488.     const px2 = l.pivotX + 55;
    1489. 

  1489.     const py = l.topLaneY - 4;
    1490. 

  1490.     ctx.fillStyle = '#304050';
    1491. 

  1491.     ctx.fillRect(px1 - 3, py - 44, 6, 44);
    1492. 

  1492.     ctx.fillRect(px2 - 3, py - 44, 6, 44);
    1493. 

  1493.     ctx.strokeStyle = '#506070'; ctx.lineWidth = 1;
    1494. 

  1494.     ctx.strokeRect(px1 - 3, py - 44, 6, 44);
    1495. 

  1495.     ctx.strokeRect(px2 - 3, py - 44, 6, 44);
    1496. 

  1496.     const on = !state.skud.photo;
    1497. 

  1497.     const dCol = on ? '#40d080' : '#ff4040';
    1498. 

  1498.     if (on) {
    1499. 

  1499.       const dg = ctx.createRadialGradient(px1, py - 36, 2, px1, py - 36, 16);
    1500. 

  1500.       dg.addColorStop(0, dCol + 'aa'); dg.addColorStop(1, dCol + '00');
    1501. 

  1501.       ctx.fillStyle = dg;
    1502. 

  1502.       ctx.fillRect(px1 - 18, py - 54, 36, 36);
    1503. 

  1503.       ctx.fillRect(px2 - 18, py - 54, 36, 36);
    1504. 

  1504.     }
    1505. 

  1505.     ctx.fillStyle = dCol;
    1506. 

  1506.     ctx.beginPath(); ctx.arc(px1, py - 36, 3.5, 0, Math.PI * 2); ctx.fill();
    1507. 

  1507.     ctx.beginPath(); ctx.arc(px2, py - 36, 3.5, 0, Math.PI * 2); ctx.fill();
    1508. 

  1508.     ctx.strokeStyle = '#000'; ctx.lineWidth = 1;
    1509. 

  1509.     ctx.beginPath(); ctx.arc(px1, py - 36, 3.5, 0, Math.PI * 2); ctx.stroke();
    1510. 

  1510.     ctx.beginPath(); ctx.arc(px2, py - 36, 3.5, 0, Math.PI * 2); ctx.stroke();
    1511. 

  1511.     if (on) {
    1512. 

  1512.       ctx.strokeStyle = 'rgba(64,208,128,.6)';
    1513. 

  1513.       ctx.setLineDash([4,4]); ctx.lineWidth = 1.2;
    1514. 

  1514.       ctx.beginPath(); ctx.moveTo(px1, py - 36); ctx.lineTo(px2, py - 36); ctx.stroke();
    1515. 

  1515.       ctx.setLineDash([]);
    1516. 

  1516.     } else {
    1517. 

  1517.       ctx.strokeStyle = 'rgba(255,64,64,.5)';
    1518. 

  1518.       ctx.setLineDash([2,6]);
    1519. 

  1519.       ctx.beginPath(); ctx.moveTo(px1, py - 36); ctx.lineTo(px2, py - 36); ctx.stroke();
    1520. 

  1520.       ctx.setLineDash([]);
    1521. 

  1521.     }
    1522. 

  1522.   }
    1523. 

  1523. }
    1524. 

  1524. 

  1525. /* ===== МАШИНЫ ===== */
    1526. 

  1526. function drawWheels(x, y, dxRear, dxFront, radius, rim, angle) {
    1527. 

  1527.   [x - dxRear, x + dxFront].forEach(wx => {
    1528. 

  1528.     ctx.beginPath(); ctx.arc(wx, y, radius, 0, Math.PI * 2);
    1529. 

  1529.     const tg = ctx.createRadialGradient(wx - radius*0.3, y - radius*0.3, 1, wx, y, radius);
    1530. 

  1530.     tg.addColorStop(0, '#2a2a2a'); tg.addColorStop(1, '#000');
    1531. 

  1531.     ctx.fillStyle = tg; ctx.fill();
    1532. 

  1532.     ctx.beginPath(); ctx.arc(wx, y, radius * 0.62, 0, Math.PI * 2);
    1533. 

  1533.     ctx.fillStyle = '#1a2028'; ctx.fill();
    1534. 

  1534.     ctx.strokeStyle = rim; ctx.lineWidth = 1.5; ctx.stroke();
    1535. 

  1535.     ctx.save(); ctx.translate(wx, y); ctx.rotate(angle);
    1536. 

  1536.     ctx.strokeStyle = rim; ctx.lineWidth = 1.4; ctx.lineCap = 'round';
    1537. 

  1537.     for (let i = 0; i < 5; i++) {
    1538. 

  1538.       const a = (i / 5) * Math.PI * 2;
    1539. 

  1539.       ctx.beginPath(); ctx.moveTo(0, 0);
    1540. 

  1540.       ctx.lineTo(Math.cos(a) * radius * 0.5, Math.sin(a) * radius * 0.5); ctx.stroke();
    1541. 

  1541.     }
    1542. 

  1542.     ctx.beginPath(); ctx.arc(0, 0, radius * 0.16, 0, Math.PI * 2);
    1543. 

  1543.     ctx.fillStyle = rim; ctx.fill();
    1544. 

  1544.     ctx.strokeStyle = '#303840'; ctx.lineWidth = 1; ctx.stroke();
    1545. 

  1545.     ctx.restore();
    1546. 

  1546.     ctx.beginPath(); ctx.arc(wx - radius*0.35, y - radius*0.35, radius*0.18, 0, Math.PI * 2);
    1547. 

  1547.     ctx.fillStyle = 'rgba(255,255,255,.10)'; ctx.fill();
    1548. 

  1548.   });
    1549. 

  1549. }
    1550. 

  1550. 

  1551. function drawSedan(x, y, color, wheelAngle) {
    1552. 

  1552.   ctx.fillStyle = 'rgba(0,0,0,.55)';
    1553. 

  1553.   ctx.beginPath(); ctx.ellipse(x, y + 4, 92, 7, 0, 0, Math.PI * 2); ctx.fill();
    1554. 

  1554. 

  1555.   const bg = ctx.createLinearGradient(0, y - 55, 0, y);
    1556. 

  1556.   bg.addColorStop(0, color); bg.addColorStop(0.55, color); bg.addColorStop(1, '#050505');
    1557. 

  1557.   ctx.fillStyle = bg; ctx.strokeStyle = '#000'; ctx.lineWidth = 2;
    1558. 

  1558.   ctx.beginPath();
    1559. 

  1559.   ctx.moveTo(x + 85, y - 8); ctx.lineTo(x + 78, y - 26); ctx.lineTo(x + 40, y - 30);
    1560. 

  1560.   ctx.lineTo(x + 15, y - 52); ctx.lineTo(x - 25, y - 54); ctx.lineTo(x - 55, y - 42);
    1561. 

  1561.   ctx.lineTo(x - 78, y - 24); ctx.lineTo(x - 85, y - 8); ctx.lineTo(x - 85, y);
    1562. 

  1562.   ctx.lineTo(x + 85, y); ctx.closePath(); ctx.fill(); ctx.stroke();
    1563. 

  1563. 

  1564.   ctx.fillStyle = 'rgba(255,255,255,.18)';
    1565. 

  1565.   ctx.beginPath();
    1566. 

  1566.   ctx.moveTo(x - 70, y - 22); ctx.lineTo(x + 70, y - 22);
    1567. 

  1567.   ctx.lineTo(x + 65, y - 26); ctx.lineTo(x - 65, y - 26);
    1568. 

  1568.   ctx.closePath(); ctx.fill();
    1569. 

  1569. 

  1570.   const gk = ctx.createLinearGradient(0, y - 54, 0, y - 30);
    1571. 

  1571.   gk.addColorStop(0, 'rgba(90,140,180,.85)');
    1572. 

  1572.   gk.addColorStop(1, 'rgba(30,60,90,.75)');
    1573. 

  1573.   ctx.fillStyle = gk;
    1574. 

  1574.   ctx.beginPath();
    1575. 

  1575.   ctx.moveTo(x + 12, y - 50); ctx.lineTo(x - 22, y - 52); ctx.lineTo(x - 48, y - 40);
    1576. 

  1576.   ctx.lineTo(x - 48, y - 30); ctx.lineTo(x + 12, y - 30); ctx.closePath(); ctx.fill();
    1577. 

  1577.   ctx.fillStyle = 'rgba(255,255,255,.20)';
    1578. 

  1578.   ctx.beginPath();
    1579. 

  1579.   ctx.moveTo(x + 8, y - 48); ctx.lineTo(x - 18, y - 50);
    1580. 

  1580.   ctx.lineTo(x - 30, y - 44); ctx.lineTo(x - 20, y - 44);
    1581. 

  1581.   ctx.closePath(); ctx.fill();
    1582. 

  1582. 

  1583.   ctx.strokeStyle = 'rgba(0,0,0,.4)'; ctx.lineWidth = 1;
    1584. 

  1584.   ctx.beginPath(); ctx.moveTo(x - 8, y - 30); ctx.lineTo(x - 8, y - 8); ctx.stroke();
    1585. 

  1585. 

  1586.   ctx.fillStyle = '#fff8c0'; ctx.shadowColor = '#fff8c0'; ctx.shadowBlur = 18;
    1587. 

  1587.   ctx.beginPath(); ctx.arc(x + 80, y - 14, 4.5, 0, Math.PI * 2); ctx.fill(); ctx.shadowBlur = 0;
    1588. 

  1588.   ctx.fillStyle = 'rgba(255,255,255,.9)';
    1589. 

  1589.   ctx.beginPath(); ctx.arc(x + 79, y - 15, 1.8, 0, Math.PI * 2); ctx.fill();
    1590. 

  1590. 

  1591.   ctx.fillStyle = '#c02020'; ctx.shadowColor = '#c02020'; ctx.shadowBlur = 10;
    1592. 

  1592.   ctx.fillRect(x - 85, y - 22, 4, 10); ctx.shadowBlur = 0;
    1593. 

  1593.   ctx.fillStyle = 'rgba(255,140,140,.7)';
    1594. 

  1594.   ctx.fillRect(x - 84, y - 21, 2, 3);
    1595. 

  1595. 

  1596.   drawWheels(x, y, 55, 55, 14, '#a0a8b0', wheelAngle);
    1597. 

  1597. }
    1598. 

  1598. 

  1599. function drawDarkCar(x, y, wheelAngle) {
    1600. 

  1600.   ctx.fillStyle = 'rgba(0,0,0,.65)';
    1601. 

  1601.   ctx.beginPath(); ctx.ellipse(x, y + 4, 108, 8, 0, 0, Math.PI * 2); ctx.fill();
    1602. 

  1602. 

  1603.   const bg = ctx.createLinearGradient(0, y - 58, 0, y);
    1604. 

  1604.   bg.addColorStop(0, '#3a3a3a');
    1605. 

  1605.   bg.addColorStop(0.25, '#1a1a1a');
    1606. 

  1606.   bg.addColorStop(0.7, '#050505');
    1607. 

  1607.   bg.addColorStop(1, '#000');
    1608. 

  1608.   ctx.fillStyle = bg; ctx.strokeStyle = '#000'; ctx.lineWidth = 2;
    1609. 

  1609.   ctx.beginPath();
    1610. 

  1610.   ctx.moveTo(x - 105, y - 10); ctx.lineTo(x - 100, y - 28);
    1611. 

  1611.   ctx.lineTo(x - 80, y - 34); ctx.lineTo(x - 55, y - 42);
    1612. 

  1612.   ctx.lineTo(x - 35, y - 54); ctx.lineTo(x + 25, y - 54);
    1613. 

  1613.   ctx.lineTo(x + 45, y - 42); ctx.lineTo(x + 55, y - 34);
    1614. 

  1614.   ctx.lineTo(x + 92, y - 30); ctx.lineTo(x + 105, y - 12);
    1615. 

  1615.   ctx.lineTo(x + 105, y); ctx.lineTo(x - 105, y);
    1616. 

  1616.   ctx.closePath(); ctx.fill(); ctx.stroke();
    1617. 

  1617. 

  1618.   ctx.strokeStyle = 'rgba(220,230,240,.7)'; ctx.lineWidth = 1.5;
    1619. 

  1619.   ctx.beginPath(); ctx.moveTo(x - 100, y - 22); ctx.lineTo(x + 100, y - 22); ctx.stroke();
    1620. 

  1620.   ctx.strokeStyle = 'rgba(255,255,255,.25)'; ctx.lineWidth = 1;
    1621. 

  1621.   ctx.beginPath(); ctx.moveTo(x - 100, y - 23); ctx.lineTo(x + 100, y - 23); ctx.stroke();
    1622. 

  1622. 

  1623.   const gk = ctx.createLinearGradient(0, y - 54, 0, y - 28);
    1624. 

  1624.   gk.addColorStop(0, 'rgba(20,40,60,.95)');
    1625. 

  1625.   gk.addColorStop(0.5, 'rgba(5,10,20,.95)');
    1626. 

  1626.   gk.addColorStop(1, 'rgba(2,4,8,.95)');
    1627. 

  1627.   ctx.fillStyle = gk;
    1628. 

  1628.   ctx.beginPath();
    1629. 

  1629.   ctx.moveTo(x + 45, y - 40); ctx.lineTo(x + 18, y - 40);
    1630. 

  1630.   ctx.lineTo(x + 18, y - 30); ctx.lineTo(x + 52, y - 30);
    1631. 

  1631.   ctx.closePath(); ctx.fill();
    1632. 

  1632.   ctx.beginPath();
    1633. 

  1633.   ctx.moveTo(x - 55, y - 40); ctx.lineTo(x - 35, y - 50);
    1634. 

  1634.   ctx.lineTo(x - 10, y - 50); ctx.lineTo(x - 10, y - 30);
    1635. 

  1635.   ctx.lineTo(x - 55, y - 30); ctx.closePath(); ctx.fill();
    1636. 

  1636.   ctx.fillStyle = 'rgba(120,180,220,.35)';
    1637. 

  1637.   ctx.beginPath();
    1638. 

  1638.   ctx.moveTo(x - 50, y - 42); ctx.lineTo(x - 40, y - 48);
    1639. 

  1639.   ctx.lineTo(x - 30, y - 48); ctx.lineTo(x - 40, y - 42);
    1640. 

  1640.   ctx.closePath(); ctx.fill();
    1641. 

  1641.   ctx.fillStyle = 'rgba(120,180,220,.30)';
    1642. 

  1642.   ctx.beginPath();
    1643. 

  1643.   ctx.moveTo(x + 22, y - 38); ctx.lineTo(x + 30, y - 38);
    1644. 

  1644.   ctx.lineTo(x + 30, y - 32); ctx.lineTo(x + 22, y - 32);
    1645. 

  1645.   ctx.closePath(); ctx.fill();
    1646. 

  1646. 

  1647.   ctx.fillStyle = '#0a0a0a'; ctx.fillRect(x + 15, y - 50, 4, 20);
    1648. 

  1648. 

  1649.   ctx.fillStyle = '#050505';
    1650. 

  1650.   ctx.strokeStyle = '#404040';
    1651. 

  1651.   ctx.lineWidth = 1;
    1652. 

  1652.   ctx.fillRect(x + 82, y - 26, 20, 12);
    1653. 

  1653.   ctx.strokeRect(x + 82, y - 26, 20, 12);
    1654. 

  1654.   for (let i = 0; i < 3; i++) {
    1655. 

  1655.     ctx.strokeStyle = '#505860';
    1656. 

  1656.     ctx.beginPath();
    1657. 

  1657.     ctx.moveTo(x + 83, y - 24 + i * 4);
    1658. 

  1658.     ctx.lineTo(x + 101, y - 24 + i * 4);
    1659. 

  1659.     ctx.stroke();
    1660. 

  1660.   }
    1661. 

  1661. 

  1662.   ctx.fillStyle = '#fff8c0'; ctx.shadowColor = '#fff8c0'; ctx.shadowBlur = 22;
    1663. 

  1663.   ctx.beginPath();
    1664. 

  1664.   ctx.moveTo(x + 84, y - 22); ctx.lineTo(x + 100, y - 22);
    1665. 

  1665.   ctx.lineTo(x + 100, y - 12); ctx.lineTo(x + 84, y - 12);
    1666. 

  1666.   ctx.closePath(); ctx.fill(); ctx.shadowBlur = 0;
    1667. 

  1667.   ctx.fillStyle = '#c0e8ff'; ctx.fillRect(x + 86, y - 20, 12, 2);
    1668. 

  1668.   ctx.fillStyle = 'rgba(255,255,255,.7)';
    1669. 

  1669.   ctx.fillRect(x + 90, y - 21, 8, 1.5);
    1670. 

  1670. 

  1671.   ctx.fillStyle = '#c02020'; ctx.shadowColor = '#c02020'; ctx.shadowBlur = 18;
    1672. 

  1672.   ctx.fillRect(x - 105, y - 24, 6, 14); ctx.shadowBlur = 0;
    1673. 

  1673.   ctx.fillStyle = 'rgba(255,160,160,.6)';
    1674. 

  1674.   ctx.fillRect(x - 104, y - 23, 3, 4);
    1675. 

  1675. 

  1676.   drawWheels(x, y, 62, 58, 17, '#c8d0d8', wheelAngle);
    1677. 

  1677. }
    1678. 

  1678. 

  1679. function drawPoliceCar(x, y, wheelAngle) {
    1680. 

  1680.   ctx.fillStyle = 'rgba(0,0,0,.6)';
    1681. 

  1681.   ctx.beginPath(); ctx.ellipse(x, y + 4, 105, 8, 0, 0, Math.PI * 2); ctx.fill();
    1682. 

  1682. 

  1683.   const bg = ctx.createLinearGradient(0, y - 58, 0, y);
    1684. 

  1684.   bg.addColorStop(0, '#f04444');
    1685. 

  1685.   bg.addColorStop(0.35, '#c82020');
    1686. 

  1686.   bg.addColorStop(0.75, '#700a0a');
    1687. 

  1687.   bg.addColorStop(1, '#400404');
    1688. 

  1688.   ctx.fillStyle = bg; ctx.strokeStyle = '#000'; ctx.lineWidth = 2;
    1689. 

  1689.   ctx.beginPath();
    1690. 

  1690.   ctx.moveTo(x + 105, y - 10); ctx.lineTo(x + 100, y - 28);
    1691. 

  1691.   ctx.lineTo(x + 80, y - 34); ctx.lineTo(x + 55, y - 42);
    1692. 

  1692.   ctx.lineTo(x + 35, y - 54); ctx.lineTo(x - 25, y - 54);
    1693. 

  1693.   ctx.lineTo(x - 45, y - 42); ctx.lineTo(x - 55, y - 34);
    1694. 

  1694.   ctx.lineTo(x - 92, y - 30); ctx.lineTo(x - 105, y - 12);
    1695. 

  1695.   ctx.lineTo(x - 105, y); ctx.lineTo(x + 105, y);
    1696. 

  1696.   ctx.closePath(); ctx.fill(); ctx.stroke();
    1697. 

  1697. 

  1698.   ctx.fillStyle = 'rgba(255,255,255,.20)';
    1699. 

  1699.   ctx.beginPath();
    1700. 

  1700.   ctx.moveTo(x - 90, y - 20); ctx.lineTo(x + 90, y - 20);
    1701. 

  1701.   ctx.lineTo(x + 85, y - 24); ctx.lineTo(x - 85, y - 24);
    1702. 

  1702.   ctx.closePath(); ctx.fill();
    1703. 

  1703. 

  1704.   const gk = ctx.createLinearGradient(0, y - 54, 0, y - 30);
    1705. 

  1705.   gk.addColorStop(0, 'rgba(70,120,170,.85)');
    1706. 

  1706.   gk.addColorStop(1, 'rgba(20,40,70,.85)');
    1707. 

  1707.   ctx.fillStyle = gk;
    1708. 

  1708.   ctx.beginPath();
    1709. 

  1709.   ctx.moveTo(x - 45, y - 40); ctx.lineTo(x - 18, y - 40);
    1710. 

  1710.   ctx.lineTo(x - 18, y - 30); ctx.lineTo(x - 52, y - 30);
    1711. 

  1711.   ctx.closePath(); ctx.fill();
    1712. 

  1712.   ctx.beginPath();
    1713. 

  1713.   ctx.moveTo(x + 55, y - 40); ctx.lineTo(x + 35, y - 50);
    1714. 

  1714.   ctx.lineTo(x + 10, y - 50); ctx.lineTo(x + 10, y - 30);
    1715. 

  1715.   ctx.lineTo(x + 55, y - 30); ctx.closePath(); ctx.fill();
    1716. 

  1716.   ctx.fillRect(x - 12, y - 30, 25, 10);
    1717. 

  1717. 

  1718.   ctx.save();
    1719. 

  1719.   ctx.fillStyle = '#ffffff';
    1720. 

  1720.   ctx.font = 'bold 11px "Courier New"';
    1721. 

  1721.   ctx.textAlign = 'center'; ctx.textBaseline = 'middle';
    1722. 

  1722.   ctx.shadowColor = 'rgba(0,0,0,.9)'; ctx.shadowBlur = 3;
    1723. 

  1723.   ctx.fillText('ПОЛИЦИЯ', x - 40, y - 12);
    1724. 

  1724.   ctx.fillText('ПОЛИЦИЯ', x + 30, y - 12);
    1725. 

  1725.   ctx.restore();
    1726. 

  1726. 

  1727.   ctx.fillStyle = '#1a3a80'; ctx.fillRect(x - 95, y - 6, 190, 3);
    1728. 

  1728.   ctx.fillStyle = 'rgba(120,180,255,.4)'; ctx.fillRect(x - 95, y - 6, 190, 1);
    1729. 

  1729. 

  1730.   ctx.fillStyle = '#fff8c0'; ctx.shadowColor = '#fff8c0'; ctx.shadowBlur = 20;
    1731. 

  1731.   ctx.fillRect(x - 100, y - 20, 14, 6); ctx.shadowBlur = 0;
    1732. 

  1732.   ctx.fillStyle = '#c02020'; ctx.shadowColor = '#c02020'; ctx.shadowBlur = 14;
    1733. 

  1733.   ctx.fillRect(x + 100, y - 24, 5, 14); ctx.shadowBlur = 0;
    1734. 

  1734. 

  1735.   const blink = Math.sin(state.time * 12) > 0;
    1736. 

  1736.   ctx.fillStyle = '#1a1a1a';
    1737. 

  1737.   ctx.fillRect(x - 30, y - 60, 60, 5);
    1738. 

  1738.   if (blink) {
    1739. 

  1739.     const rg = ctx.createRadialGradient(x - 15, y - 68, 4, x - 15, y - 68, 50);
    1740. 

  1740.     rg.addColorStop(0, 'rgba(255,50,50,.9)');
    1741. 

  1741.     rg.addColorStop(1, 'rgba(255,50,50,0)');
    1742. 

  1742.     ctx.fillStyle = rg; ctx.fillRect(x - 65, y - 118, 100, 100);
    1743. 

  1743.   }
    1744. 

  1744.   ctx.fillStyle = blink ? '#ff2020' : '#401010';
    1745. 

  1745.   ctx.beginPath();
    1746. 

  1746.   ctx.moveTo(x - 30, y - 60); ctx.lineTo(x, y - 60);
    1747. 

  1747.   ctx.lineTo(x, y - 70); ctx.lineTo(x - 30, y - 70);
    1748. 

  1748.   ctx.closePath(); ctx.fill();
    1749. 

  1749.   ctx.strokeStyle = '#000'; ctx.lineWidth = 1; ctx.stroke();
    1750. 

  1750. 

  1751.   if (!blink) {
    1752. 

  1752.     const bg2 = ctx.createRadialGradient(x + 15, y - 68, 4, x + 15, y - 68, 50);
    1753. 

  1753.     bg2.addColorStop(0, 'rgba(50,120,255,.9)');
    1754. 

  1754.     bg2.addColorStop(1, 'rgba(50,120,255,0)');
    1755. 

  1755.     ctx.fillStyle = bg2; ctx.fillRect(x - 35, y - 118, 100, 100);
    1756. 

  1756.   }
    1757. 

  1757.   ctx.fillStyle = !blink ? '#2060ff' : '#101040';
    1758. 

  1758.   ctx.beginPath();
    1759. 

  1759.   ctx.moveTo(x, y - 60); ctx.lineTo(x + 30, y - 60);
    1760. 

  1760.   ctx.lineTo(x + 30, y - 70); ctx.lineTo(x, y - 70);
    1761. 

  1761.   ctx.closePath(); ctx.fill();
    1762. 

  1762.   ctx.strokeStyle = '#000'; ctx.stroke();
    1763. 

  1763. 

  1764.   const beamGrad = ctx.createLinearGradient(x - 105, y - 14, x - 300, y + 10);
    1765. 

  1765.   beamGrad.addColorStop(0, 'rgba(255,240,180,.5)');
    1766. 

  1766.   beamGrad.addColorStop(1, 'rgba(255,240,180,0)');
    1767. 

  1767.   ctx.fillStyle = beamGrad;
    1768. 

  1768.   ctx.beginPath();
    1769. 

  1769.   ctx.moveTo(x - 105, y - 20); ctx.lineTo(x - 300, y - 28);
    1770. 

  1770.   ctx.lineTo(x - 300, y + 20); ctx.lineTo(x - 105, y - 4);
    1771. 

  1771.   ctx.closePath(); ctx.fill();
    1772. 

  1772. 

  1773.   drawWheels(x, y, 65, 60, 15, '#606060', wheelAngle);
    1774. 

  1774. }
    1775. 

  1775. 

  1776. function drawTowTruck(x, y, wheelAngle, doorOpen) {
    1777. 

  1777.   ctx.fillStyle = 'rgba(0,0,0,.55)';
    1778. 

  1778.   ctx.beginPath(); ctx.ellipse(x, y + 4, 105, 7, 0, 0, Math.PI * 2); ctx.fill();
    1779. 

  1779. 

  1780.   const bg = ctx.createLinearGradient(0, y - 60, 0, y);
    1781. 

  1781.   bg.addColorStop(0, '#e8c840'); bg.addColorStop(0.4, '#c8a020'); bg.addColorStop(1, '#705010');
    1782. 

  1782.   ctx.fillStyle = bg; ctx.strokeStyle = '#000'; ctx.lineWidth = 2;
    1783. 

  1783.   ctx.beginPath();
    1784. 

  1784.   ctx.moveTo(x - 100, y - 8); ctx.lineTo(x - 100, y - 55);
    1785. 

  1785.   ctx.lineTo(x - 55, y - 55); ctx.lineTo(x - 40, y - 25);
    1786. 

  1786.   ctx.lineTo(x - 20, y - 25); ctx.lineTo(x - 20, y - 8);
    1787. 

  1787.   ctx.lineTo(x - 20, y); ctx.lineTo(x - 100, y);
    1788. 

  1788.   ctx.closePath(); ctx.fill(); ctx.stroke();
    1789. 

  1789. 

  1790.   const gk = ctx.createLinearGradient(0, y - 50, 0, y - 28);
    1791. 

  1791.   gk.addColorStop(0, 'rgba(90,140,180,.85)');
    1792. 

  1792.   gk.addColorStop(1, 'rgba(30,60,90,.8)');
    1793. 

  1793.   ctx.fillStyle = gk;
    1794. 

  1794.   ctx.beginPath();
    1795. 

  1795.   ctx.moveTo(x - 95, y - 50); ctx.lineTo(x - 60, y - 50);
    1796. 

  1796.   ctx.lineTo(x - 48, y - 28); ctx.lineTo(x - 95, y - 28);
    1797. 

  1797.   ctx.closePath(); ctx.fill();
    1798. 

  1798.   ctx.fillStyle = 'rgba(255,255,255,.20)';
    1799. 

  1799.   ctx.beginPath();
    1800. 

  1800.   ctx.moveTo(x - 90, y - 48); ctx.lineTo(x - 75, y - 48);
    1801. 

  1801.   ctx.lineTo(x - 80, y - 32); ctx.lineTo(x - 90, y - 32);
    1802. 

  1802.   ctx.closePath(); ctx.fill();
    1803. 

  1803. 

  1804.   const pg = ctx.createLinearGradient(0, y - 20, 0, y - 8);
    1805. 

  1805.   pg.addColorStop(0, '#d0b040'); pg.addColorStop(1, '#705010');
    1806. 

  1806.   ctx.fillStyle = pg; ctx.fillRect(x + 20, y - 18, 85, 10);
    1807. 

  1807.   ctx.strokeStyle = '#000'; ctx.strokeRect(x + 20, y - 18, 85, 10);
    1808. 

  1808.   ctx.fillStyle = 'rgba(255,255,255,.15)';
    1809. 

  1809.   ctx.fillRect(x + 20, y - 18, 85, 2);
    1810. 

  1810. 

  1811.   ctx.strokeStyle = '#806010'; ctx.lineWidth = 5;
    1812. 

  1812.   ctx.beginPath();
    1813. 

  1813.   ctx.moveTo(x + 5, y - 18); ctx.lineTo(x + 40, y - 55); ctx.lineTo(x + 80, y - 55); ctx.stroke();
    1814. 

  1814.   ctx.strokeStyle = '#c0a020'; ctx.lineWidth = 2;
    1815. 

  1815.   ctx.beginPath(); ctx.moveTo(x + 80, y - 55); ctx.lineTo(x + 90, y - 32); ctx.stroke();
    1816. 

  1816.   ctx.strokeStyle = '#a0a8b0';
    1817. 

  1817.   ctx.beginPath(); ctx.arc(x + 90, y - 28, 4, 0, Math.PI * 1.5); ctx.stroke();
    1818. 

  1818. 

  1819.   const blink = Math.sin(state.time * 8) > 0;
    1820. 

  1820.   if (blink) {
    1821. 

  1821.     const mg = ctx.createRadialGradient(x - 59, y - 59, 3, x - 59, y - 59, 40);
    1822. 

  1822.     mg.addColorStop(0, 'rgba(255,180,70,.9)');
    1823. 

  1823.     mg.addColorStop(1, 'rgba(255,180,70,0)');
    1824. 

  1824.     ctx.fillStyle = mg;
    1825. 

  1825.     ctx.fillRect(x - 100, y - 100, 80, 80);
    1826. 

  1826.   }
    1827. 

  1827.   ctx.fillStyle = blink ? '#ffb040' : '#604010';
    1828. 

  1828.   ctx.fillRect(x - 65, y - 62, 12, 6);
    1829. 

  1829. 

  1830.   ctx.fillStyle = '#fff8c0'; ctx.shadowColor = '#fff8c0'; ctx.shadowBlur = 15;
    1831. 

  1831.   ctx.beginPath(); ctx.arc(x - 95, y - 14, 4, 0, Math.PI * 2); ctx.fill(); ctx.shadowBlur = 0;
    1832. 

  1832.   ctx.fillStyle = 'rgba(255,255,255,.7)';
    1833. 

  1833.   ctx.beginPath(); ctx.arc(x - 96, y - 15, 1.5, 0, Math.PI * 2); ctx.fill();
    1834. 

  1834. 

  1835.   drawWheels(x, y, 70, 25, 14, '#606060', wheelAngle);
    1836. 

  1836.   const wx = x + 60;
    1837. 

  1837.   ctx.beginPath(); ctx.arc(wx, y, 14, 0, Math.PI * 2);
    1838. 

  1838.   ctx.fillStyle = '#0a0a0a'; ctx.fill();
    1839. 

  1839.   ctx.beginPath(); ctx.arc(wx, y, 5, 0, Math.PI * 2);
    1840. 

  1840.   ctx.fillStyle = '#606060'; ctx.fill();
    1841. 

  1841. }
    1842. 

  1842. 

  1843. function drawTowDriver(x, y, walking, alpha) {
    1844. 

  1844.   ctx.save();
    1845. 

  1845.   ctx.globalAlpha = alpha !== undefined ? Math.max(0, Math.min(1, alpha)) : 1;
    1846. 

  1846.   const wobble = walking ? Math.sin(state.time * 10) * 2 : 0;
    1847. 

  1847.   ctx.fillStyle = 'rgba(0,0,0,.5)';
    1848. 

  1848.   ctx.beginPath(); ctx.ellipse(x, y + 2, 13, 4, 0, 0, Math.PI * 2); ctx.fill();
    1849. 

  1849.   ctx.fillStyle = '#252c38';
    1850. 

  1850.   ctx.fillRect(x - 8, y - 33, 7, 29 + wobble);
    1851. 

  1851.   ctx.fillRect(x + 1, y - 33, 7, 29 - wobble);
    1852. 

  1852.   ctx.fillStyle = '#0a0a0a';
    1853. 

  1853.   ctx.fillRect(x - 10, y + 1 + wobble, 11, 3);
    1854. 

  1854.   ctx.fillRect(x, y + 1 - wobble, 11, 3);
    1855. 

  1855.   const jg = ctx.createLinearGradient(x - 11, 0, x + 11, 0);
    1856. 

  1856.   jg.addColorStop(0, '#b06818'); jg.addColorStop(0.4, '#f09030'); jg.addColorStop(1, '#a85810');
    1857. 

  1857.   ctx.fillStyle = jg; ctx.fillRect(x - 10, y - 63, 20, 33);
    1858. 

  1858.   ctx.strokeStyle = '#703810'; ctx.lineWidth = 1; ctx.strokeRect(x - 10, y - 63, 20, 33);
    1859. 

  1859.   ctx.fillStyle = '#f0f0f0';
    1860. 

  1860.   ctx.fillRect(x - 10, y - 56, 20, 3);
    1861. 

  1861.   ctx.fillRect(x - 10, y - 44, 20, 3);
    1862. 

  1862.   ctx.fillStyle = '#d0a880';
    1863. 

  1863.   ctx.fillRect(x - 16, y - 60, 6, 23);
    1864. 

  1864.   ctx.fillRect(x + 10, y - 60, 6, 23);
    1865. 

  1865.   ctx.fillStyle = '#d0a880'; ctx.fillRect(x - 3, y - 67, 6, 5);
    1866. 

  1866.   ctx.beginPath(); ctx.arc(x, y - 76, 9, 0, Math.PI * 2);
    1867. 

  1867.   const fg = ctx.createRadialGradient(x - 3, y - 78, 2, x, y - 76, 9);
    1868. 

  1868.   fg.addColorStop(0, '#e8b890'); fg.addColorStop(1, '#c09870');
    1869. 

  1869.   ctx.fillStyle = fg; ctx.fill();
    1870. 

  1870.   ctx.fillStyle = '#e8c020';
    1871. 

  1871.   ctx.beginPath(); ctx.arc(x, y - 82, 11, Math.PI, 0); ctx.fill();
    1872. 

  1872.   ctx.fillRect(x - 11, y - 83, 22, 4);
    1873. 

  1873.   ctx.strokeStyle = '#8a6a10'; ctx.lineWidth = 1;
    1874. 

  1874.   ctx.beginPath(); ctx.arc(x, y - 82, 11, Math.PI, 0); ctx.stroke();
    1875. 

  1875.   ctx.fillStyle = '#c0a010';
    1876. 

  1876.   ctx.fillRect(x - 1.5, y - 93, 3, 12);
    1877. 

  1877.   ctx.restore();
    1878. 

  1878. }
    1879. 

  1879. 

  1880. function drawSenior(x, y, walking, alpha) {
    1881. 

  1881.   ctx.save();
    1882. 

  1882.   ctx.globalAlpha = alpha !== undefined ? Math.max(0, Math.min(1, alpha)) : 1;
    1883. 

  1883.   const wobble = walking ? Math.sin(state.time * 9) * 2 : 0;
    1884. 

  1884.   ctx.fillStyle = 'rgba(0,0,0,.55)';
    1885. 

  1885.   ctx.beginPath(); ctx.ellipse(x, y + 2, 15, 5, 0, 0, Math.PI * 2); ctx.fill();
    1886. 

  1886.   ctx.fillStyle = '#1a2340';
    1887. 

  1887.   ctx.fillRect(x - 8, y - 35, 7, 31 + wobble);
    1888. 

  1888.   ctx.fillRect(x + 1, y - 35, 7, 31 - wobble);
    1889. 

  1889.   ctx.fillStyle = '#0a0a0a';
    1890. 

  1890.   ctx.fillRect(x - 10, y - 3 + wobble, 11, 7);
    1891. 

  1891.   ctx.fillRect(x + 1, y - 3 - wobble, 11, 7);
    1892. 

  1892.   const un = ctx.createLinearGradient(x - 12, 0, x + 12, 0);
    1893. 

  1893.   un.addColorStop(0, '#1a2a4a'); un.addColorStop(0.4, '#2a3a5a'); un.addColorStop(1, '#141e38');
    1894. 

  1894.   ctx.fillStyle = un; ctx.fillRect(x - 12, y - 70, 24, 38);
    1895. 

  1895.   ctx.strokeStyle = '#0a1428'; ctx.lineWidth = 1; ctx.strokeRect(x - 12, y - 70, 24, 38);
    1896. 

  1896.   ctx.fillStyle = '#c0a040';
    1897. 

  1897.   for (let i = 0; i < 3; i++) {
    1898. 

  1898.     ctx.beginPath(); ctx.arc(x, y - 60 + i * 10, 1.2, 0, Math.PI * 2); ctx.fill();
    1899. 

  1899.   }
    1900. 

  1900.   ctx.fillStyle = '#e0e0f0';
    1901. 

  1901.   ctx.fillRect(x - 13, y - 70, 6, 3);
    1902. 

  1902.   ctx.fillRect(x + 7, y - 70, 6, 3);
    1903. 

  1903.   ctx.fillStyle = '#ffd060';
    1904. 

  1904.   ctx.beginPath(); ctx.arc(x - 10, y - 71, 1.5, 0, Math.PI * 2); ctx.fill();
    1905. 

  1905.   ctx.beginPath(); ctx.arc(x + 10, y - 71, 1.5, 0, Math.PI * 2); ctx.fill();
    1906. 

  1906.   ctx.fillStyle = '#2a3a5a';
    1907. 

  1907.   ctx.fillRect(x - 18, y - 68, 6, 32);
    1908. 

  1908.   ctx.fillRect(x + 12, y - 68, 6, 32);
    1909. 

  1909.   ctx.fillStyle = '#0a0a0a';
    1910. 

  1910.   ctx.fillRect(x - 18, y - 38, 7, 8);
    1911. 

  1911.   ctx.fillRect(x + 12, y - 38, 7, 8);
    1912. 

  1912.   ctx.fillStyle = '#d0a880'; ctx.fillRect(x - 3, y - 74, 6, 5);
    1913. 

  1913.   ctx.beginPath(); ctx.arc(x, y - 83, 10, 0, Math.PI * 2);
    1914. 

  1914.   const fg = ctx.createRadialGradient(x - 3, y - 85, 2, x, y - 83, 10);
    1915. 

  1915.   fg.addColorStop(0, '#e8b890'); fg.addColorStop(1, '#c09870');
    1916. 

  1916.   ctx.fillStyle = fg; ctx.fill();
    1917. 

  1917.   ctx.fillStyle = '#1a1a1a';
    1918. 

  1918.   ctx.beginPath(); ctx.arc(x - 3, y - 84, 1.3, 0, Math.PI * 2); ctx.fill();
    1919. 

  1919.   ctx.beginPath(); ctx.arc(x + 3, y - 84, 1.3, 0, Math.PI * 2); ctx.fill();
    1920. 

  1920.   const cap = ctx.createLinearGradient(x - 13, 0, x + 13, 0);
    1921. 

  1921.   cap.addColorStop(0, '#0f1a35'); cap.addColorStop(0.5, '#1a2c52'); cap.addColorStop(1, '#0a1428');
    1922. 

  1922.   ctx.fillStyle = cap;
    1923. 

  1923.   ctx.beginPath(); ctx.arc(x, y - 90, 13, Math.PI, 0); ctx.fill();
    1924. 

  1924.   ctx.fillRect(x - 13, y - 90, 26, 5);
    1925. 

  1925.   ctx.strokeStyle = '#0a1428'; ctx.lineWidth = 1.5;
    1926. 

  1926.   ctx.beginPath(); ctx.arc(x, y - 90, 13, Math.PI, 0); ctx.stroke();
    1927. 

  1927.   ctx.beginPath(); ctx.moveTo(x - 13, y - 85); ctx.lineTo(x + 13, y - 85); ctx.stroke();
    1928. 

  1928.   ctx.fillStyle = '#05080f';
    1929. 

  1929.   ctx.beginPath();
    1930. 

  1930.   ctx.moveTo(x - 14, y - 85); ctx.lineTo(x + 14, y - 85);
    1931. 

  1931.   ctx.lineTo(x + 12, y - 81); ctx.lineTo(x - 12, y - 81);
    1932. 

  1932.   ctx.closePath(); ctx.fill();
    1933. 

  1933.   ctx.strokeStyle = '#000'; ctx.stroke();
    1934. 

  1934.   ctx.fillStyle = '#c0a040';
    1935. 

  1935.   ctx.beginPath(); ctx.arc(x, y - 96, 2.5, 0, Math.PI * 2); ctx.fill();
    1936. 

  1936.   ctx.fillStyle = 'rgba(255,220,140,.7)';
    1937. 

  1937.   ctx.beginPath(); ctx.arc(x - 0.8, y - 96.8, 1, 0, Math.PI * 2); ctx.fill();
    1938. 

  1938.   ctx.restore();
    1939. 

  1939. }
    1940. 

  1940. 

  1941. const CAR_SCALE = 1.56;
    1942. 

  1942. function drawCarScaled(drawFn, x, y, ...args) {
    1943. 

  1943.   ctx.save();
    1944. 

  1944.   ctx.translate(x, y);
    1945. 

  1945.   ctx.scale(CAR_SCALE, CAR_SCALE);
    1946. 

  1946.   ctx.translate(-x, -y);
    1947. 

  1947.   drawFn(x, y, ...args);
    1948. 

  1948.   ctx.restore();
    1949. 

  1949. }
    1950. 

  1950. 

  1951. /* ===== ПОГОДА ===== */
    1952. 

  1952. function updateWeatherParticles(dt) {
    1953. 

  1953.   if (state.weather === 'clear' || state.weather === 'fog') {
    1954. 

  1954.     state.weatherParticles = []; return;
    1955. 

  1955.   }
    1956. 

  1956.   const targetCount = state.weather === 'rain' ? 240 : 140;
    1957. 

  1957.   while (state.weatherParticles.length < targetCount) {
    1958. 

  1958.     state.weatherParticles.push({
    1959. 

  1959.       x: Math.random() * W, y: Math.random() * H,
    1960. 

  1960.       vx: state.weather === 'rain' ? 60 + Math.random() * 40 : -10 + Math.random() * 20,
    1961. 

  1961.       vy: state.weather === 'rain' ? 600 + Math.random() * 200 : 30 + Math.random() * 40,
    1962. 

  1962.       size: state.weather === 'rain' ? 1 : 1.5 + Math.random() * 1.5,
    1963. 

  1963.       alpha: state.weather === 'rain' ? 0.5 + Math.random() * 0.4 : 0.7 + Math.random() * 0.3
    1964. 

  1964.     });
    1965. 

  1965.   }
    1966. 

  1966.   if (state.weatherParticles.length > targetCount) state.weatherParticles.length = targetCount;
    1967. 

  1967.   state.weatherParticles.forEach(p => {
    1968. 

  1968.     p.x += p.vx * dt; p.y += p.vy * dt;
    1969. 

  1969.     if (p.y > H) { p.y = -10; p.x = Math.random() * W; }
    1970. 

  1970.   });
    1971. 

  1971. }
    1972. 

  1972. function drawWeatherParticles() {
    1973. 

  1973.   if (state.weather === 'rain') {
    1974. 

  1974.     ctx.strokeStyle = 'rgba(180,200,220,.55)';
    1975. 

  1975.     ctx.lineWidth = 1;
    1976. 

  1976.     state.weatherParticles.forEach(p => {
    1977. 

  1977.       ctx.beginPath(); ctx.moveTo(p.x, p.y); ctx.lineTo(p.x - 1, p.y - 12); ctx.stroke();
    1978. 

  1978.     });
    1979. 

  1979.   } else if (state.weather === 'snow') {
    1980. 

  1980.     state.weatherParticles.forEach(p => {
    1981. 

  1981.       ctx.fillStyle = `rgba(240,248,255,${p.alpha})`;
    1982. 

  1982.       ctx.beginPath(); ctx.arc(p.x, p.y, p.size, 0, Math.PI * 2); ctx.fill();
    1983. 

  1983.     });
    1984. 

  1984.   } else if (state.weather === 'fog') {
    1985. 

  1985.     const fogGrad = ctx.createLinearGradient(0, 0, 0, H);
    1986. 

  1986.     fogGrad.addColorStop(0, 'rgba(200,205,215,.30)');
    1987. 

  1987.     fogGrad.addColorStop(1, 'rgba(200,205,215,.35)');
    1988. 

  1988.     ctx.fillStyle = fogGrad; ctx.fillRect(0, 0, W, H);
    1989. 

  1989.   }
    1990. 

  1990. }
    1991. 

  1991. 

  1992. /* ===== ЛОГИКА ===== */
    1993. 

  1993. let lastTs = 0;
    1994. 

  1994. 

  1995. function updateScene(dt) {
    1996. 

  1996.   const l = L();
    1997. 

  1997.   if (!state.model) return;
    1998. 

  1998. 

  1999.   if (state.alarm && state.time > state.alarmEnd) state.alarm = false;
    2000. 

  2000. 

  2001.   const diff = state.barrier.target - state.barrier.level;
    2002. 

  2002.   if (Math.abs(diff) > 0.001) {
    2003. 

  2003.     const speedUp = 1 / state.model.openTime;
    2004. 

  2004.     const speedDown = 1 / state.model.closeTime;
    2005. 

  2005.     const spd = diff > 0 ? speedUp : speedDown;
    2006. 

  2006.     const step = Math.min(Math.abs(diff), dt * spd);
    2007. 

  2007.     state.barrier.level += Math.sign(diff) * step;
    2008. 

  2008.     state.barrier.moving = true;
    2009. 

  2009.     if (Math.abs(diff - Math.sign(diff)*step) < 0.005) {
    2010. 

  2010.       state.barrier.level = state.barrier.target;
    2011. 

  2011.       state.barrier.moving = false;
    2012. 

  2012.     }
    2013. 

  2013.   } else {
    2014. 

  2014.     state.barrier.moving = false;
    2015. 

  2015.   }
    2016. 

  2016. 

  2017.   state.skud.kw1 = state.barrier.level < 0.05;
    2018. 

  2018.   state.skud.kw2 = state.barrier.level > 0.95;
    2019. 

  2019.   if (state.skud.kw1) { state.skud.relayClose = false; }
    2020. 

  2020.   if (state.skud.kw2) { state.skud.relayOpen = false; }
    2021. 

  2021. 

  2022.   if (state.barrier.level > 0.95 && !state.holdMode && state.model.autoClose > 0 && !state.manualMode) {
    2023. 

  2023.     state.autoCloseTimer += dt;
    2024. 

  2024.     if (state.autoCloseTimer >= state.model.autoClose && !state.skud.photo && !state.skud.loop1 && !state.skud.loop2) {
    2025. 

  2025.       closeBarrier();
    2026. 

  2026.       state.autoCloseTimer = 0;
    2027. 

  2027.     }
    2028. 

  2028.   } else if (state.barrier.level < 0.95) {
    2029. 

  2029.     state.autoCloseTimer = 0;
    2030. 

  2030.   }
    2031. 

  2031. 

  2032.   const stopX = l.pivotX - (state.model.armLen) - 60;
    2033. 

  2033. 

  2034.   if (state.car) {
    2035. 

  2035.     const c = state.car;
    2036. 

  2036.     if (state.phase === 'approaching') {
    2037. 

  2037.       if (c.x < stopX) {
    2038. 

  2038.         c.x += c.speed * dt; c.wheelAngle += c.speed * dt * 0.06;
    2039. 

  2039.       } else if (c.isPriora) {
    2040. 

  2040.         c.x += c.speed * dt; c.wheelAngle += c.speed * dt * 0.06;
    2041. 

  2041.         if (c.x >= l.pivotX - state.model.armLen - 20 && state.barrier.level < 0.5) {
    2042. 

  2042.           c.x = l.pivotX - state.model.armLen - 20; crash();
    2043. 

  2043.         } else if (c.x > W + 300) {
    2044. 

  2044.           state.car = null; state.phase = 'idle';
    2045. 

  2045.         }
    2046. 

  2046.       } else {
    2047. 

  2047.         state.phase = 'waiting';
    2048. 

  2048.         setStatus('ОЖИДАНИЕ РЕШЕНИЯ', 'wait');
    2049. 

  2049.         setHint('Сравните пропуска и примите решение.');
    2050. 

  2050.         if (state.model.hasLoop) {
    2051. 

  2051.           state.skud.loop1 = true;
    2052. 

  2052.           logSkud('ПЕТЛЯ 1: занята', 'blu');
    2053. 

  2053.           state.stats.sensors++;
    2054. 

  2054.         }
    2055. 

  2055.         renderPasses();
    2056. 

  2056.       }
    2057. 

  2057.     }
    2058. 

  2058.     else if (state.phase === 'resolved') {
    2059. 

  2059.       if (c.action === 'pass') {
    2060. 

  2060.         if (state.barrier.level > 0.9) {
    2061. 

  2061.           c.x += c.speed * dt; c.wheelAngle += c.speed * dt * 0.06;
    2062. 

  2062.           if (state.model.hasPhoto) {
    2063. 

  2063.             if (!state.skud.photo && c.x > l.pivotX - state.model.armLen - 40 && c.x < l.pivotX + 40) {
    2064. 

  2064.               state.skud.photo = true;
    2065. 

  2065.               logSkud('ФОТОЭЛЕМЕНТ: разрыв луча', 'yel');
    2066. 

  2066.               state.stats.sensors++;
    2067. 

  2067.             }
    2068. 

  2068.             if (state.skud.photo && (c.x < l.pivotX - state.model.armLen - 60 || c.x > l.pivotX + 60)) {
    2069. 

  2069.               state.skud.photo = false;
    2070. 

  2070.             }
    2071. 

  2071.           }
    2072. 

  2072.           if (c.x > W + 300) {
    2073. 

  2073.             logEvent('Автомобиль проехал КПП', 'ok');
    2074. 

  2074.             state.stats.in++;
    2075. 

  2075.             state.car = null; state.phase = 'idle';
    2076. 

  2076.             if (state.model.hasLoop) { state.skud.loop1 = false; logSkud('ПЕТЛЯ 1: свободна'); }
    2077. 

  2077.             if (state.skud.photo) state.skud.photo = false;
    2078. 

  2078.             state.barrier.target = 0;
    2079. 

  2079.             setStatus('ПОСТ СВОБОДЕН');
    2080. 

  2080.             setHint('Нажмите <b>«Следующая машина»</b>.');
    2081. 

  2081.             state.senior = null;
    2082. 

  2082.           }
    2083. 

  2083.         }
    2084. 

  2084.       } else if (c.action === 'turn') {
    2085. 

  2085.         c.x -= c.speed * dt; c.wheelAngle -= c.speed * dt * 0.06;
    2086. 

  2086.         if (c.x < -350) {
    2087. 

  2087.           logEvent('Автомобиль уехал', 'info');
    2088. 

  2088.           state.car = null; state.phase = 'idle';
    2089. 

  2089.           if (state.model.hasLoop) { state.skud.loop1 = false; logSkud('ПЕТЛЯ 1: свободна'); }
    2090. 

  2090.           setStatus('ПОСТ СВОБОДЕН');
    2091. 

  2091.           setHint('Нажмите <b>«Следующая машина»</b>.');
    2092. 

  2092.           state.senior = null;
    2093. 

  2093.         }
    2094. 

  2094.       }
    2095. 

  2095.     }
    2096. 

  2096.   }
    2097. 

  2097. 

  2098.   if (state.senior) {
    2099. 

  2099.     const s = state.senior;
    2100. 

  2100.     const SPEED = 90;
    2101. 

  2101.     if (s.state === 'walk_to_lane') {
    2102. 

  2102.       s.alpha = Math.min(1, (s.alpha || 0) + dt * 1.5);
    2103. 

  2103.       s.walking = true; s.y = l.botLaneY;
    2104. 

  2104.       const targetX = (state.car ? state.car.x : 0) + 140;
    2105. 

  2105.       if (s.x > targetX) s.x -= SPEED * dt;
    2106. 

  2106.       else s.state = 'walk_up';
    2107. 

  2107.     } else if (s.state === 'walk_up') {
    2108. 

  2108.       s.walking = true;
    2109. 

  2109.       if (s.y > l.topLaneY + 2) s.y -= SPEED * 0.7 * dt;
    2110. 

  2110.       else {
    2111. 

  2111.         s.y = l.topLaneY; s.walking = false; s.state = 'review'; s.decideTimer = 0;
    2112. 

  2112.         setStatus('СТАРШИЙ У МАШИНЫ', 'senior');
    2113. 

  2113.         setHint('Старший смены проверяет документы...');
    2114. 

  2114.         logEvent('Старший смены подошёл к машине', 'senior');
    2115. 

  2115.       }
    2116. 

  2116.     } else if (s.state === 'review') {
    2117. 

  2117.       s.decideTimer += dt; s.walking = false;
    2118. 

  2118.       if (s.decideTimer > 2.0) {
    2119. 

  2119.         const allow = (state.correctDecision === 'allow');
    2120. 

  2120.         if (allow) {
    2121. 

  2121.           logEvent('Старший смены: пропуск действителен — пропускаем', 'senior');
    2122. 

  2122.           setStatus('СТАРШИЙ ПРОПУСКАЕТ', 'ok');
    2123. 

  2123.           state.car.action = 'pass';
    2124. 

  2124.           openBarrier();
    2125. 

  2125.           state.phase = 'resolved';
    2126. 

  2126.           state.userDecision = 'allow';
    2127. 

  2127.           renderPasses();
    2128. 

  2128.         } else {
    2129. 

  2129.           logEvent('Старший смены: пропуск недействителен — отказ', 'senior');
    2130. 

  2130.           setStatus('СТАРШИЙ ОТКАЗЫВАЕТ', 'wait');
    2131. 

  2131.           state.car.action = 'turn';
    2132. 

  2132.           state.phase = 'resolved';
    2133. 

  2133.           state.userDecision = 'deny';
    2134. 

  2134.           state.stats.out++;
    2135. 

  2135.           renderPasses();
    2136. 

  2136.         }
    2137. 

  2137.         s.state = 'returning';
    2138. 

  2138.       }
    2139. 

  2139.     } else if (s.state === 'returning') {
    2140. 

  2140.       s.walking = true;
    2141. 

  2141.       if (s.y < l.botLaneY - 2) s.y += SPEED * 0.7 * dt;
    2142. 

  2142.       else {
    2143. 

  2143.         s.y = l.botLaneY; s.x += SPEED * dt;
    2144. 

  2144.         if (s.x > W + 60) state.senior = null;
    2145. 

  2145.       }
    2146. 

  2146.     }
    2147. 

  2147.   }
    2148. 

  2148. 

  2149.   if (state.phase === 'crash_scene') {
    2150. 

  2150.     if (state.police) {
    2151. 

  2151.       const p = state.police;
    2152. 

  2152.       if (p.state === 'arriving') {
    2153. 

  2153.         p.x -= p.speed * dt; p.wheelAngle -= p.speed * dt * 0.06;
    2154. 

  2154.         if (p.x <= p.targetX) { p.x = p.targetX; p.state = 'stopped'; }
    2155. 

  2155.       } else if (p.state === 'leaving') {
    2156. 

  2156.         p.x += p.speed * dt; p.wheelAngle += p.speed * dt * 0.06;
    2157. 

  2157.       }
    2158. 

  2158.     }
    2159. 

  2159.     if (state.tow) {
    2160. 

  2160.       const t2 = state.tow;
    2161. 

  2161.       if (t2.state === 'arriving') {
    2162. 

  2162.         t2.x += t2.speed * dt; t2.wheelAngle -= t2.speed * dt * 0.06;
    2163. 

  2163.         if (t2.x >= t2.targetX) { t2.x = t2.targetX; t2.state = 'stopped'; t2.stopTimer = 0; }
    2164. 

  2164.       } else if (t2.state === 'stopped') {
    2165. 

  2165.         t2.stopTimer = (t2.stopTimer || 0) + dt;
    2166. 

  2166.       } else if (t2.state === 'leaving') {
    2167. 

  2167.         t2.x -= t2.speed * dt; t2.wheelAngle += t2.speed * dt * 0.06;
    2168. 

  2168.       }
    2169. 

  2169.     }
    2170. 

  2170.     if (state.car && state.car.towed && state.tow) {
    2171. 

  2171.       state.car.x = state.tow.x + 220;
    2172. 

  2172.       state.car.wheelAngle += state.tow.speed * dt * 0.06;
    2173. 

  2173.     }
    2174. 

  2174.     if (state.tow && state.tow.state === 'stopped' && state.tow.stopTimer > 1.2 && !state.towDriver && !state.leaving && state.car) {
    2175. 

  2175.       const doorX = state.tow.x - 150;
    2176. 

  2176.       state.towDriver = { x: doorX, y: l.topLaneY, doorX: doorX,
    2177. 

  2177.         carApproachX: state.car.x - 160,
    2178. 

  2178.         state: 'exiting', exitTimer: 0, alpha: 0, walking: false, attachTimer: 0, boardTimer: 0 };
    2179. 

  2179.       state.tow.doorOpen = true;
    2180. 

  2180.       logEvent('Водитель выходит из кабины эвакуатора', 'info');
    2181. 

  2181.     }
    2182. 

  2182.     if (state.towDriver) {
    2183. 

  2183.       const td = state.towDriver;
    2184. 

  2184.       const underY = l.topLaneBot + 25;
    2185. 

  2185.       const SPD = 55;
    2186. 

  2186.       if (td.state === 'exiting') {
    2187. 

  2187.         td.exitTimer += dt; td.alpha = Math.min(1, td.exitTimer / 0.8);
    2188. 

  2188.         if (td.exitTimer > 0.8) { td.alpha = 1; td.state = 'walking_out_down'; }
    2189. 

  2189.       } else if (td.state === 'walking_out_down') {
    2190. 

  2190.         if (td.y < underY - 2) { td.y += SPD * dt; td.walking = true; }
    2191. 

  2191.         else { td.y = underY; td.state = 'walking_right'; }
    2192. 

  2192.       } else if (td.state === 'walking_right') {
    2193. 

  2193.         if (td.x < td.carApproachX - 2) { td.x += SPD * dt; td.walking = true; }
    2194. 

  2194.         else { td.x = td.carApproachX; td.state = 'walking_up'; }
    2195. 

  2195.       } else if (td.state === 'walking_up') {
    2196. 

  2196.         if (td.y > l.topLaneY + 2) { td.y -= SPD * dt; td.walking = true; }
    2197. 

  2197.         else { td.y = l.topLaneY; td.state = 'attaching'; td.attachTimer = 0; }
    2198. 

  2198.       } else if (td.state === 'attaching') {
    2199. 

  2199.         td.attachTimer += dt; td.walking = false;
    2200. 

  2200.         if (td.attachTimer > 0.6 && !state.towCable) { state.towCable = true; logEvent('Автомобиль зацеплен', 'info'); }
    2201. 

  2201.         if (td.attachTimer > 1.4) td.state = 'returning_down';
    2202. 

  2202.       } else if (td.state === 'returning_down') {
    2203. 

  2203.         if (td.y < underY - 2) { td.y += SPD * dt; td.walking = true; }
    2204. 

  2204.         else { td.y = underY; td.state = 'returning_left'; }
    2205. 

  2205.       } else if (td.state === 'returning_left') {
    2206. 

  2206.         if (td.x > td.doorX + 2) { td.x -= SPD * dt; td.walking = true; }
    2207. 

  2207.         else { td.x = td.doorX; td.state = 'returning_up'; }
    2208. 

  2208.       } else if (td.state === 'returning_up') {
    2209. 

  2209.         if (td.y > l.topLaneY + 2) { td.y -= SPD * dt; td.walking = true; }
    2210. 

  2210.         else { td.y = l.topLaneY; td.state = 'boarding'; td.boardTimer = 0; td.walking = false; }
    2211. 

  2211.       } else if (td.state === 'boarding') {
    2212. 

  2212.         td.boardTimer += dt; td.walking = false;
    2213. 

  2213.         td.alpha = Math.max(0, 1 - td.boardTimer / 0.8);
    2214. 

  2214.         td.x += 20 * dt;
    2215. 

  2215.         if (td.boardTimer > 0.8) {
    2216. 

  2216.           td.state = 'gone'; td.alpha = 0;
    2217. 

  2217.           if (state.tow) state.tow.doorOpen = false;
    2218. 

  2218.           if (!state.leaving) {
    2219. 

  2219.             state.leaving = true;
    2220. 

  2220.             setTimeout(() => {
    2221. 

  2221.               logEvent('Эвакуатор увозит автомобиль', 'info');
    2222. 

  2222.               if (state.car) state.car.towed = true;
    2223. 

  2223.               if (state.police) state.police.state = 'leaving';
    2224. 

  2224.               if (state.tow) state.tow.state = 'leaving';
    2225. 

  2225.             }, 600);
    2226. 

  2226.           }
    2227. 

  2227.         }
    2228. 

  2228.       }
    2229. 

  2229.     }
    2230. 

  2230.     if (state.tow && state.tow.state === 'leaving' && state.tow.x < -600) {
    2231. 

  2231.       state.car = null; state.police = null; state.tow = null;
    2232. 

  2232.       state.towDriver = null; state.towCable = false; state.leaving = false;
    2233. 

  2233.       state.phase = 'idle'; state.barrier.target = 0;
    2234. 

  2234.       state.alarm = false; state.skud.alarm = false;
    2235. 

  2235.       setStatus('ПОСТ СВОБОДЕН');
    2236. 

  2236.       setHint('Инцидент исчерпан. Нажмите «Следующая машина».');
    2237. 

  2237.       logEvent('Инцидент закрыт', 'ok');
    2238. 

  2238.     }
    2239. 

  2239.   }
    2240. 

  2240. 

  2241.   updateWeatherParticles(dt);
    2242. 

  2242.   updateSkudLeds();
    2243. 

  2243. }
    2244. 

  2244. 

  2245. function crash() {
    2246. 

  2246.   logEvent('!!! СТОЛКНОВЕНИЕ СО ШЛАГБАУМОМ !!!', 'alarm');
    2247. 

  2247.   setStatus('ТРЕВОГА !', 'alarm');
    2248. 

  2248.   setHint('Нарушитель врезался. Вызваны полиция и эвакуатор.');
    2249. 

  2249.   state.alarm = true;
    2250. 

  2250.   state.alarmEnd = state.time + 5;
    2251. 

  2251.   state.phase = 'crash_scene';
    2252. 

  2252.   state.leaving = false;
    2253. 

  2253.   state.stats.alarms++;
    2254. 

  2254.   state.stats.breaches++;
    2255. 

  2255.   state.skud.alarm = true;
    2256. 

  2256.   if (state.model.hasImpact) {
    2257. 

  2257.     state.skud.impact = true;
    2258. 

  2258.     logSkud('ДАТЧИК УДАРА: сработал', 'alarm');
    2259. 

  2259.     state.stats.sensors++;
    2260. 

  2260.   }
    2261. 

  2261.   if (state.car) { state.car.action = 'crashed'; state.car.speed = 0; }
    2262. 

  2262. 

  2263.   const l = L();
    2264. 

  2264.   for (let i = 0; i < 40; i++) {
    2265. 

  2265.     state.sparks.push({
    2266. 

  2266.       x: l.pivotX - state.model.armLen - 30, y: l.topLaneY - 40,
    2267. 

  2267.       vx: (Math.random() - .5) * 400, vy: (Math.random() - .5) * 300 - 80,
    2268. 

  2268.       life: 1
    2269. 

  2269.     });
    2270. 

  2270.   }
    2271. 

  2271.   setTimeout(() => {
    2272. 

  2272.     state.police = { x: W + 300, targetX: l.pivotX - 100, speed: 260, state: 'arriving', wheelAngle: 0 };
    2273. 

  2273.     logEvent('Прибывает полицейский автомобиль', 'warn');
    2274. 

  2274.   }, 700);
    2275. 

  2275.   setTimeout(() => {
    2276. 

  2276.     const carX = state.car ? state.car.x : (l.pivotX - state.model.armLen - 20);
    2277. 

  2277.     state.tow = { x: -300, targetX: carX - 340, speed: 200, state: 'arriving',
    2278. 

  2278.       wheelAngle: 0, stopTimer: 0, doorOpen: false };
    2279. 

  2279.     logEvent('Прибывает эвакуатор', 'warn');
    2280. 

  2280.   }, 1400);
    2281. 

  2281. }
    2282. 

  2282. 

  2283. /* ===== ОТРИСОВКА ===== */
    2284. 

  2284. function drawScene() {
    2285. 

  2285.   const l = L();
    2286. 

  2286.   const t = state.time;
    2287. 

  2287.   ctx.fillStyle = '#02040a'; ctx.fillRect(0, 0, W, H);
    2288. 

  2288.   if (!state.model) return;
    2289. 

  2289. 

  2290.   drawSky(); drawGround(); drawRoads();
    2291. 

  2291.   drawBooth();
    2292. 

  2292.   drawGuard(l.boothX + l.boothW + 25, l.boothBaseY);
    2293. 

  2293. 

  2294.   if (state.towCable && state.tow && state.car) {
    2295. 

  2295.     const fromX = state.tow.x + 140;
    2296. 

  2296.     const fromY = l.topLaneY - 20;
    2297. 

  2297.     const toX = state.car.x - 140;
    2298. 

  2298.     const toY = l.topLaneY - 15;
    2299. 

  2299.     ctx.strokeStyle = 'rgba(200,200,200,.85)'; ctx.lineWidth = 2;
    2300. 

  2300.     ctx.beginPath(); ctx.moveTo(fromX, fromY);
    2301. 

  2301.     ctx.quadraticCurveTo((fromX + toX) / 2, Math.max(fromY, toY) + 22, toX, toY); ctx.stroke();
    2302. 

  2302.   }
    2303. 

  2303. 

  2304.   drawBarrier();
    2305. 

  2305. 

  2306.   if (state.car) {
    2307. 

  2307.     if (state.car.isPriora) drawCarScaled(drawDarkCar, state.car.x, l.topLaneY, state.car.wheelAngle);
    2308. 

  2308.     else drawCarScaled(drawSedan, state.car.x, l.topLaneY, state.car.color, state.car.wheelAngle);
    2309. 

  2309.   }
    2310. 

  2310.   if (state.police) drawCarScaled(drawPoliceCar, state.police.x, l.botLaneY, state.police.wheelAngle);
    2311. 

  2311.   if (state.tow) drawCarScaled(drawTowTruck, state.tow.x, l.topLaneY, state.tow.wheelAngle, state.tow.doorOpen);
    2312. 

  2312. 

  2313.   if (state.towDriver && state.towDriver.state !== 'gone') {
    2314. 

  2314.     drawTowDriver(state.towDriver.x, state.towDriver.y, state.towDriver.walking, state.towDriver.alpha);
    2315. 

  2315.   }
    2316. 

  2316.   if (state.senior) {
    2317. 

  2317.     drawSenior(state.senior.x, state.senior.y, state.senior.walking, state.senior.alpha);
    2318. 

  2318.   }
    2319. 

  2319. 

  2320.   state.sparks = state.sparks.filter(s => s.life > 0);
    2321. 

  2321.   state.sparks.forEach(s => {
    2322. 

  2322.     s.x += s.vx / 60; s.y += s.vy / 60; s.vy += 500 / 60; s.life -= 1.2 / 60;
    2323. 

  2323.     ctx.fillStyle = `rgba(255,${Math.floor(160 + Math.random()*90)},60,${Math.max(0, s.life)})`;
    2324. 

  2324.     ctx.beginPath(); ctx.arc(s.x, s.y, 2 + s.life * 3, 0, Math.PI * 2); ctx.fill();
    2325. 

  2325.   });
    2326. 

  2326. 

  2327.   drawWeatherParticles();
    2328. 

  2328. 

  2329.   if (state.alarm) {
    2330. 

  2330.     const pulse = 0.5 + Math.sin(t * 8) * 0.5;
    2331. 

  2331.     ctx.strokeStyle = `rgba(255,40,40,${pulse * 0.5})`; ctx.lineWidth = 12;
    2332. 

  2332.     ctx.strokeRect(6, 6, W - 12, H - 12);
    2333. 

  2333.     ctx.fillStyle = `rgba(255,60,60,${0.5 + 0.3 * Math.abs(Math.sin(t * 5))})`;
    2334. 

  2334.     ctx.font = 'bold 36px "Courier New"'; ctx.textAlign = 'center';
    2335. 

  2335.     ctx.fillText('!!! ТРЕВОГА !!!', W / 2, 60); ctx.textAlign = 'left';
    2336. 

  2336.   }
    2337. 

  2337. 

  2338.   const hintText = {
    2339. 

  2339.     idle: 'ПОСТ СВОБОДЕН · НАЖМИТЕ «СЛЕДУЮЩАЯ МАШИНА»',
    2340. 

  2340.     approaching: 'АВТОМОБИЛЬ ПРИБЛИЖАЕТСЯ',
    2341. 

  2341.     waiting: 'ОЖИДАНИЕ РЕШЕНИЯ ОПЕРАТОРА',
    2342. 

  2342.     refuse_wait: 'МАШИНА ЖДЁТ · ОБЪЯСНИТЕ ПРИЧИНУ ИЛИ ВЫЗОВИТЕ СТАРШЕГО',
    2343. 

  2343.     senior_walk: 'СТАРШИЙ СМЕНЫ ИДЁТ К МАШИНЕ',
    2344. 

  2344.     resolved: 'ОБРАБОТКА РЕЗУЛЬТАТА',
    2345. 

  2345.     crash_scene: 'НА МЕСТЕ ПРОИСШЕСТВИЯ'
    2346. 

  2346.   }[state.phase] || '';
    2347. 

  2347. 

  2348.   if (hintText) {
    2349. 

  2349.     ctx.font = 'bold 12px "Courier New"';
    2350. 

  2350.     const tw = ctx.measureText(hintText).width + 40;
    2351. 

  2351.     ctx.fillStyle = 'rgba(10,14,20,.78)';
    2352. 

  2352.     ctx.fillRect(W / 2 - tw / 2, 20, tw, 28);
    2353. 

  2353.     ctx.strokeStyle = 'rgba(96,160,224,.5)'; ctx.lineWidth = 1;
    2354. 

  2354.     ctx.strokeRect(W / 2 - tw / 2, 20, tw, 28);
    2355. 

  2355.     ctx.fillStyle = '#a0c0e0'; ctx.textAlign = 'center'; ctx.textBaseline = 'middle';
    2356. 

  2356.     ctx.fillText(hintText, W / 2, 34); ctx.textAlign = 'left'; ctx.textBaseline = 'alphabetic';
    2357. 

  2357.   }
    2358. 

  2358. }
    2359. 

  2359. 

  2360. function loop(ts) {
    2361. 

  2361.   if (!lastTs) lastTs = ts;
    2362. 

  2362.   const dt = Math.min(0.05, (ts - lastTs) / 1000);
    2363. 

  2363.   lastTs = ts;
    2364. 

  2364.   state.time += dt;
    2365. 

  2365.   updateScene(dt);
    2366. 

  2366.   drawScene();
    2367. 

  2367.   drawScope();
    2368. 

  2368.   pushScopeSample();
    2369. 

  2369.   requestAnimationFrame(loop);
    2370. 

  2370. }
    2371. 

  2371. 

  2372. function updateClock() {
    2373. 

  2373.   const d = new Date();
    2374. 

  2374.   document.getElementById('clock').textContent =
    2375. 

  2375.     String(d.getHours()).padStart(2,'0')+':'+String(d.getMinutes()).padStart(2,'0')+':'+String(d.getSeconds()).padStart(2,'0');
    2376. 

  2376. }
    2377. 

  2377. setInterval(updateClock, 1000); updateClock();
    2378. 

  2378. 

  2379. /* ===== СТАРТ ===== */
    2380. 

  2380. resizeCanvas(); renderPasses(); renderLog();
    2381. 

  2381. renderModelSwitcher();
    2382. 

  2382. switchModel('B');
    2383. 

  2383. renderModelPassport();
    2384. 

  2384. drawScope();
    2385. 

  2385. logSkud('Запуск СКУД КПП-3...', 'ok');
    2386. 

  2386. logSkud('Контроллер инициализирован, клеммы опрошены');
    2387. 

  2387. requestAnimationFrame(loop);
    2388. 

  2388. </script>
    2389. 

  2389. </body>
    2390. 

  2390. </html>
    2391.