-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
788 lines (707 loc) · 65 KB
/
index.html
File metadata and controls
788 lines (707 loc) · 65 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="theme-color" content="#B5451B">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title" content="Quiz Cuisine ATRIUM">
<title>Quiz – Commis de Cuisine</title>
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&family=Fraunces:wght@700;900&display=swap" rel="stylesheet">
<style>
:root{
--rouge:#B5451B;--rougelt:#F9EDE8;--orge:#D4760A;--orgelt:#FEF3E2;
--vert:#2A7A4B;--vertlt:#E8F5EE;--bleu:#1A5C8A;--bleult:#E8F2FA;
--cream:#FAF7F4;--text:#2C1810;--muted:#7A6660;
--r:14px;--sh:0 4px 20px rgba(43,24,16,.12);
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Nunito',sans-serif;background:var(--cream);color:var(--text);min-height:100vh;overscroll-behavior:none;}
header{background:linear-gradient(135deg,#2C1810,var(--rouge));color:#fff;padding:16px 18px 22px;text-align:center;position:relative;overflow:hidden;}
header::before{content:'';position:absolute;top:-30px;right:-30px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.06);}
header::after{content:'';position:absolute;bottom:-40px;left:-20px;width:100px;height:100px;border-radius:50%;background:rgba(212,118,10,.18);}
.logo{display:inline-block;background:var(--orge);color:#fff;font-family:'Fraunces',serif;font-weight:700;font-size:.9rem;padding:3px 13px;border-radius:20px;letter-spacing:1px;margin-bottom:7px;position:relative;z-index:1;}
.hico{font-size:2rem;display:block;margin-bottom:4px;position:relative;z-index:1;}
header h1{font-family:'Fraunces',serif;font-size:1.45rem;font-weight:900;line-height:1.2;margin-bottom:2px;position:relative;z-index:1;}
header p{font-size:.8rem;opacity:.85;font-weight:600;position:relative;z-index:1;}
.pgwrap{background:#2C1810;padding:9px 18px 12px;}
.pginfo{display:flex;justify-content:space-between;color:rgba(255,255,255,.75);font-size:.74rem;font-weight:700;margin-bottom:5px;text-transform:uppercase;letter-spacing:.5px;}
.pgbg{background:rgba(255,255,255,.15);border-radius:10px;height:7px;overflow:hidden;}
.pgfill{background:linear-gradient(90deg,var(--orge),#F4B942);height:100%;border-radius:10px;transition:width .5s cubic-bezier(.4,0,.2,1);}
main{max-width:600px;margin:0 auto;padding:14px 13px 80px;}
.card{background:#fff;border-radius:var(--r);box-shadow:var(--sh);padding:20px 17px;animation:sli .35s cubic-bezier(.4,0,.2,1);}
@keyframes sli{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes fdi{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
.ttag{display:inline-flex;align-items:center;gap:5px;color:#fff;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.7px;padding:3px 11px;border-radius:20px;margin-bottom:9px;}
.ttag .dot{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.5);}
.qnum{font-size:.74rem;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.7px;margin-bottom:6px;}
.qtxt{font-size:1.02rem;font-weight:800;line-height:1.45;color:var(--text);margin-bottom:15px;white-space:pre-line;}
.opts{display:flex;flex-direction:column;gap:8px;}
.obtn{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:2.5px solid #E8DDD8;border-radius:11px;background:var(--cream);cursor:pointer;transition:all .18s;font-family:'Nunito',sans-serif;font-size:.9rem;font-weight:700;color:var(--text);text-align:left;width:100%;line-height:1.35;}
.obtn:active{transform:scale(.98);}
.obtn:hover:not(:disabled){border-color:var(--rouge);background:#FDF5F2;}
.obtn .lt{min-width:26px;height:26px;border-radius:50%;background:#fff;border:2px solid #D4C5BE;display:flex;align-items:center;justify-content:center;font-size:.73rem;font-weight:900;color:var(--rouge);flex-shrink:0;margin-top:1px;}
.obtn.correct{border-color:var(--vert);background:var(--vertlt);}
.obtn.correct .lt{background:var(--vert);border-color:var(--vert);color:#fff;}
.obtn.wrong{border-color:#E05252;background:#FDEDEC;}
.obtn.wrong .lt{background:#E05252;border-color:#E05252;color:#fff;}
.obtn.missed{border-color:var(--vert);background:var(--vertlt);opacity:.75;}
.obtn:disabled{cursor:default;}
.vfw{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.vfb{padding:15px 10px;border:2.5px solid #E8DDD8;border-radius:12px;background:var(--cream);cursor:pointer;font-family:'Nunito',sans-serif;font-size:1rem;font-weight:800;color:var(--text);text-align:center;transition:all .18s;}
.vfb .vi{font-size:1.8rem;display:block;margin-bottom:2px;}
.vfb:hover:not(:disabled){border-color:var(--rouge);background:#FDF5F2;}
.vfb:disabled{cursor:default;}
.vfb.correct{border-color:var(--vert);background:var(--vertlt);}
.vfb.wrong{border-color:#E05252;background:#FDEDEC;}
.vfb.missed{border-color:var(--vert);background:var(--vertlt);opacity:.75;}
.fb{margin-top:12px;padding:11px 13px;border-radius:10px;font-size:.86rem;font-weight:700;line-height:1.45;display:none;animation:fdi .25s ease;}
.fb.show{display:block;}
.fb.ok{background:var(--vertlt);color:#1A5C35;border-left:4px solid var(--vert);}
.fb.ko{background:#FDEDEC;color:#A03030;border-left:4px solid #E05252;}
.fb .ex{margin-top:5px;font-weight:600;font-size:.81rem;opacity:.9;line-height:1.4;}
.nxbtn{width:100%;margin-top:13px;padding:14px;background:linear-gradient(135deg,var(--rouge),var(--orge));color:#fff;border:none;border-radius:11px;font-family:'Nunito',sans-serif;font-size:.97rem;font-weight:800;cursor:pointer;display:none;box-shadow:0 4px 14px rgba(181,69,27,.35);transition:transform .15s;}
.nxbtn.show{display:block;animation:fdi .3s ease;}
.nxbtn:active{transform:scale(.97);}
/* HOME */
.hcard{background:#fff;border-radius:var(--r);box-shadow:var(--sh);padding:24px 18px;text-align:center;margin-top:16px;}
.hcard h2{font-family:'Fraunces',serif;font-size:1.35rem;font-weight:900;color:var(--rouge);margin-bottom:6px;}
.hcard p{color:var(--muted);font-size:.87rem;font-weight:600;line-height:1.55;margin-bottom:14px;}
.nlbl{font-size:.87rem;font-weight:800;color:var(--text);margin-bottom:6px;display:block;text-align:left;}
.ninp{width:100%;padding:12px 14px;border:2.5px solid #E8DDD8;border-radius:11px;font-family:'Nunito',sans-serif;font-size:1rem;font-weight:700;color:var(--text);background:var(--cream);outline:none;transition:border-color .2s;margin-bottom:12px;}
.ninp:focus{border-color:var(--rouge);}
.nerr{color:#E05252;font-size:.8rem;font-weight:700;margin-top:-8px;margin-bottom:10px;display:none;}
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:16px;text-align:left;}
.titem{display:flex;align-items:flex-start;gap:7px;padding:9px 11px;border-radius:10px;background:var(--cream);font-size:.78rem;font-weight:700;color:var(--text);line-height:1.3;}
.stbtn{width:100%;padding:15px;background:linear-gradient(135deg,#2C1810,var(--rouge));color:#fff;border:none;border-radius:12px;font-family:'Nunito',sans-serif;font-size:1.03rem;font-weight:900;cursor:pointer;box-shadow:0 5px 18px rgba(44,24,16,.3);transition:transform .15s;}
.stbtn:active{transform:scale(.97);}
.flink{display:block;text-align:center;margin-top:14px;font-size:.74rem;font-weight:700;color:var(--muted);cursor:pointer;text-decoration:underline;opacity:.7;}
/* RESULTS */
.rcard{background:#fff;border-radius:var(--r);box-shadow:var(--sh);padding:22px 17px;text-align:center;margin-top:14px;}
.sring{width:115px;height:115px;border-radius:50%;margin:0 auto 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.sring .sn{font-family:'Fraunces',serif;font-size:2rem;font-weight:900;line-height:1;color:#fff;}
.sring .sl{font-size:.7rem;color:rgba(255,255,255,.9);font-weight:700;}
.abadge{display:inline-block;background:var(--cream);border:2px solid #E8DDD8;border-radius:20px;padding:4px 13px;font-size:.83rem;font-weight:800;color:var(--text);margin-bottom:14px;}
.rcard h2{font-family:'Fraunces',serif;font-size:1.25rem;font-weight:900;color:var(--rouge);margin-bottom:4px;}
.rsub{color:var(--muted);font-size:.84rem;font-weight:600;margin-bottom:16px;line-height:1.4;}
.tscores{display:flex;flex-direction:column;gap:8px;margin-bottom:14px;text-align:left;}
.tsrow{padding:10px 13px;border-radius:11px;background:var(--cream);}
.tstop{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;}
.tsname{font-size:.8rem;font-weight:800;color:var(--text);}
.tssc{font-size:.8rem;font-weight:900;color:var(--rouge);}
.bbg{background:#E8DDD8;border-radius:6px;height:6px;overflow:hidden;}
.bf{height:100%;border-radius:6px;}
.bf.good{background:linear-gradient(90deg,var(--vert),#4CBD7A);}
.bf.mid{background:linear-gradient(90deg,var(--orge),#F4B942);}
.bf.low{background:linear-gradient(90deg,#E05252,#E87070);}
/* CODE BOX */
.codebox{background:var(--cream);border:2.5px dashed var(--orge);border-radius:12px;padding:14px;margin-bottom:12px;}
.cbt{font-size:.78rem;font-weight:800;color:var(--orge);text-transform:uppercase;letter-spacing:.5px;margin-bottom:7px;}
.cbd{font-family:monospace;font-size:.72rem;background:#fff;border:1.5px solid #E8DDD8;border-radius:8px;padding:9px 10px;word-break:break-all;color:var(--bleu);font-weight:700;line-height:1.55;cursor:pointer;user-select:all;}
.cbh{font-size:.72rem;color:var(--muted);font-weight:600;margin-top:7px;line-height:1.4;}
.cpybtn{display:inline-block;margin-top:8px;padding:7px 16px;background:var(--orge);color:#fff;border:none;border-radius:20px;font-family:'Nunito',sans-serif;font-size:.77rem;font-weight:800;cursor:pointer;}
.cpymsg{font-size:.75rem;color:var(--vert);font-weight:700;margin-top:5px;display:none;}
.cpymsg.show{display:block;}
.ebtn{width:100%;padding:14px;background:linear-gradient(135deg,var(--vert),#3EA065);color:#fff;border:none;border-radius:12px;font-family:'Nunito',sans-serif;font-size:.96rem;font-weight:900;cursor:pointer;box-shadow:0 4px 14px rgba(42,122,75,.28);margin-bottom:9px;transition:transform .15s;}
.ebtn:active{transform:scale(.97);}
.rbtn{width:100%;padding:13px;background:linear-gradient(135deg,#2C1810,var(--rouge));color:#fff;border:none;border-radius:12px;font-family:'Nunito',sans-serif;font-size:.93rem;font-weight:900;cursor:pointer;margin-bottom:9px;transition:transform .15s;}
.rbtn:active{transform:scale(.97);}
.esent{background:var(--vertlt);border:2px solid var(--vert);border-radius:10px;padding:10px 13px;font-size:.83rem;font-weight:700;color:#1A5C35;margin-bottom:9px;display:none;animation:fdi .3s ease;}
.esent.show{display:block;}
.ihint{font-size:.74rem;color:var(--muted);font-weight:600;line-height:1.5;margin-top:4px;}
/* DASH */
.dcard{background:#fff;border-radius:var(--r);box-shadow:var(--sh);padding:20px 17px;margin-top:14px;}
.dcard h2{font-family:'Fraunces',serif;font-size:1.25rem;font-weight:900;color:var(--rouge);margin-bottom:3px;}
.dsub{color:var(--muted);font-size:.8rem;font-weight:600;margin-bottom:14px;}
.impbox{background:var(--bleult);border:2px solid var(--bleu);border-radius:12px;padding:13px;margin-bottom:16px;}
.impbox .ibt{font-size:.8rem;font-weight:800;color:var(--bleu);margin-bottom:8px;}
.improw{display:flex;gap:7px;}
.impin{flex:1;padding:10px 12px;border:2px solid #C8DCF0;border-radius:10px;font-family:'Nunito',sans-serif;font-size:.8rem;font-weight:700;color:var(--text);background:#fff;outline:none;}
.impin:focus{border-color:var(--bleu);}
.impbtn{padding:10px 14px;background:var(--bleu);color:#fff;border:none;border-radius:10px;font-family:'Nunito',sans-serif;font-size:.8rem;font-weight:800;cursor:pointer;white-space:nowrap;}
.impmsg{font-size:.75rem;font-weight:700;margin-top:6px;display:none;}
.impmsg.ok{color:var(--vert);display:block;}
.impmsg.ko{color:#E05252;display:block;}
.dempty{text-align:center;color:var(--muted);font-size:.88rem;font-weight:600;padding:20px 0;}
.drow{padding:12px 0;border-bottom:1.5px solid #F0E8E4;}
.drow:last-child{border-bottom:none;}
.dname{font-size:.93rem;font-weight:800;color:var(--text);}
.dmeta{font-size:.76rem;color:var(--muted);font-weight:600;margin-bottom:4px;}
.dsrc{font-size:.68rem;color:var(--muted);font-weight:600;margin-bottom:5px;}
.dsbig{display:inline-block;background:var(--cream);border-radius:8px;padding:3px 9px;font-size:.85rem;font-weight:900;color:var(--rouge);margin-bottom:6px;}
.dmods{display:flex;flex-direction:column;gap:3px;}
.dmr{display:flex;align-items:center;gap:7px;}
.dmn{font-size:.72rem;font-weight:700;color:var(--muted);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dbbg{flex:2;background:#F0E8E4;border-radius:4px;height:5px;overflow:hidden;}
.dbf{height:100%;border-radius:4px;}
.dbf.good{background:linear-gradient(90deg,var(--vert),#4CBD7A);}
.dbf.mid{background:linear-gradient(90deg,var(--orge),#F4B942);}
.dbf.low{background:linear-gradient(90deg,#E05252,#E87070);}
.dms{font-size:.72rem;font-weight:900;color:var(--text);min-width:28px;text-align:right;}
.bbtn{width:100%;padding:12px;background:var(--cream);color:var(--text);border:2px solid #E8DDD8;border-radius:11px;font-family:'Nunito',sans-serif;font-size:.88rem;font-weight:800;cursor:pointer;margin-top:12px;transition:all .18s;}
.bbtn:hover{border-color:var(--rouge);}
.clrbtn{width:100%;padding:10px;background:#FDEDEC;color:#A03030;border:2px solid #F4C0C0;border-radius:11px;font-family:'Nunito',sans-serif;font-size:.82rem;font-weight:800;cursor:pointer;margin-top:7px;}
/* LOGIN */
.licard{background:#fff;border-radius:var(--r);box-shadow:var(--sh);padding:24px 18px;text-align:center;margin-top:16px;}
.licard h2{font-family:'Fraunces',serif;font-size:1.3rem;font-weight:900;color:var(--rouge);margin-bottom:6px;}
.licard p{color:var(--muted);font-size:.87rem;font-weight:600;margin-bottom:14px;}
.auinp{width:100%;padding:12px;border:2.5px solid #E8DDD8;border-radius:11px;font-family:'Nunito',sans-serif;font-size:1.2rem;font-weight:700;letter-spacing:4px;text-align:center;color:var(--text);background:var(--cream);outline:none;transition:border-color .2s;margin-bottom:9px;}
.auinp:focus{border-color:var(--rouge);}
.aerr{color:#E05252;font-size:.8rem;font-weight:700;text-align:center;margin-bottom:7px;display:none;}
.ulbtn{width:100%;padding:13px;background:linear-gradient(135deg,#2C1810,var(--rouge));color:#fff;border:none;border-radius:11px;font-family:'Nunito',sans-serif;font-size:.96rem;font-weight:900;cursor:pointer;}
@media(max-width:360px){.qtxt{font-size:.94rem;}header h1{font-size:1.2rem;}.tgrid{grid-template-columns:1fr;}}
</style>
</head>
<body>
<header>
<span class="hico">👨‍🍳</span>
<div class="logo">ATRIUM</div>
<h1>Commis de Cuisine</h1>
<p>Quiz technique avance — FLE/FOS — 50 questions</p>
</header>
<div class="pgwrap" id="pgwrap" style="display:none">
<div class="pginfo"><span id="pgtxt">Question 1 / 50</span><span id="pgpct">0 %</span></div>
<div class="pgbg"><div class="pgfill" id="pgfill" style="width:0%"></div></div>
</div>
<main>
<div id="sh">
<div class="hcard">
<span style="font-size:3rem;display:block;margin-bottom:8px">🍳</span>
<h2>Quiz Commis de Cuisine</h2>
<p>50 questions techniques de niveau avance sur les quatre themes du metier.</p>
<label class="nlbl" for="ninp">👤 Votre prenom et nom :</label>
<input class="ninp" id="ninp" type="text" placeholder="Ex : Maria Garcia" autocomplete="name" maxlength="60">
<div class="nerr" id="nerr">Merci d'ecrire votre prenom et nom avant de commencer.</div>
<div class="tgrid">
<div class="titem">👥 Brigade<br><small style="opacity:.7;font-weight:600">12 questions</small></div>
<div class="titem">🍑 Entrees et desserts<br><small style="opacity:.7;font-weight:600">14 questions</small></div>
<div class="titem">🧹 Hygiene et securite<br><small style="opacity:.7;font-weight:600">13 questions</small></div>
<div class="titem">📋 Tracabilite<br><small style="opacity:.7;font-weight:600">11 questions</small></div>
</div>
<button class="stbtn" onclick="tryStart()">🚀 Commencer le quiz</button>
<span class="flink" onclick="showDL()">🔒 Espace formateur</span>
</div>
</div>
<div id="sq" style="display:none">
<div class="ttag" id="ttag"><span class="dot"></span><span id="tlbl">Theme</span></div>
<div class="card">
<div class="qnum" id="qnum">Question 1 sur 50</div>
<div class="qtxt" id="qtxt"></div>
<div id="qopts"></div>
<div class="fb" id="qfb"></div>
<button class="nxbtn" id="nxbtn" onclick="nextQ()">Continuer →</button>
</div>
</div>
<div id="sr" style="display:none">
<div class="rcard">
<div class="sring" id="sring"><span class="sn" id="snum">0/50</span><span class="sl">Score</span></div>
<div class="abadge" id="abadge">👤 Nom</div>
<h2 id="rtitle">Bravo !</h2>
<p class="rsub" id="rmsg"></p>
<div class="tscores" id="tscores"></div>
<div class="codebox">
<div class="cbt">📤 Code resultat pour le formateur</div>
<div class="cbd" id="rcode" onclick="cpyCode()"></div>
<div class="cbh">→ Copiez ce code et donnez-le au formateur. Il l'importe dans son tableau de bord pour enregistrer votre score.</div>
<button class="cpybtn" onclick="cpyCode()">📋 Copier le code</button>
<div class="cpymsg" id="cpymsg">✓ Code copie !</div>
</div>
<div class="esent" id="esent">✓ E-mail ouvert. Verifiez et envoyez le message.</div>
<button class="ebtn" onclick="sendMail()">📧 Envoyer mes resultats au formateur</button>
<button class="rbtn" onclick="restart()">🔄 Recommencer le quiz</button>
<p class="ihint">Installer le quiz : menu navigateur → "Ajouter a l'ecran d'accueil"</p>
</div>
</div>
<div id="sdl" style="display:none">
<div class="licard">
<span style="font-size:2.4rem;display:block;text-align:center;margin-bottom:8px">🔒</span>
<h2>Espace formateur</h2>
<p>Entrez le code pour acceder au tableau de bord.</p>
<input class="auinp" id="auinp" type="password" placeholder="Code" maxlength="20">
<div class="aerr" id="aerr">Code incorrect. Reessayez.</div>
<button class="ulbtn" onclick="checkCode()">Acceder au tableau de bord</button>
<button class="bbtn" onclick="goHome()" style="margin-top:10px;">← Retour</button>
</div>
</div>
<div id="sd" style="display:none">
<div class="dcard">
<h2>📊 Tableau de bord</h2>
<p class="dsub">Resultats de tous les apprenants</p>
<div class="impbox">
<div class="ibt">🔑 Importer le code resultat d'un apprenant</div>
<div class="improw">
<input class="impin" id="impin" type="text" placeholder="Collez le code resultat ici...">
<button class="impbtn" onclick="importCode()">Importer</button>
</div>
<div class="impmsg" id="impmsg"></div>
</div>
<div id="dcont"></div>
<button class="bbtn" onclick="goHome()">← Retour a l'accueil</button>
<button class="clrbtn" onclick="clearAll()">🗑 Effacer tous les resultats</button>
</div>
</div>
</main>
<script>
var EMAIL='r.fabbri@fjt-tarbes.fr';
var DCODE='CUISINE2025';
var SKEY='quiz_cuisine_v4';
var TH={
T1:{name:'Brigade de cuisine', ico:'👥', bg:'#B5451B'},
T2:{name:'Entrees et desserts', ico:'🍑', bg:'#D4760A'},
T3:{name:'Hygiene et securite', ico:'🧹', bg:'#2A7A4B'},
T4:{name:'Tracabilite', ico:'📋', bg:'#1A5C8A'}
};
// ══════════════════════════════════════════════════
// 50 QUESTIONS – repartition bonnes reponses QCM :
// A x 8 | B x 9 | C x 9 | D x 9
// ══════════════════════════════════════════════════
var QS=[
// ── T1 BRIGADE 12 q (8 QCM + 4 VF) ─────────────────────────
{th:'T1',t:'qcm', // ← bonne rep. C
q:'La temperature minimale reglementaire de maintien des plats chauds pendant le service est :',
o:['45 degres Celsius – suffisant pour un service rapide','55 degres Celsius – recommande en pratique','63 degres Celsius – obligatoire selon la reglementation hygiene','75 degres Celsius – seule temperature vraiment bactericide'],
a:2,e:'La reglementation hygiene impose 63°C minimum pour tout plat chaud en service. En dessous, les bacteries se multiplient rapidement. On verifie avec une sonde thermometrique.'},
{th:'T1',t:'qcm', // ← bonne rep. D
q:'Dans une brigade classique, le poste "garde-manger" est responsable de :',
o:['La cuisson des viandes et des poissons au gril','La preparation des patisseries et desserts chauds','La gestion administrative des stocks et des commandes','Les entrees froides, salades composees, charcuteries et buffets froids'],
a:3,e:'Le garde-manger gere tout le froid : entrees froides, salades, charcuteries, buffets. C\'est un poste cle qui demande precision et sens de la presentation.'},
{th:'T1',t:'vf',
q:'VRAI ou FAUX ?\n\nDans une brigade classique, le "chef saucier" est considere comme le poste le plus valorise apres le chef de cuisine en raison de la technicite des fonds, fumets et sauces.',
a:true,e:'VRAI. Le saucier maitrise les fonds (veau, volaille, poisson), les sauces emulsionnees (hollandaise, bearnaise) et les liaisons. C\'est historiquement le poste de plus haute technicite de la brigade.'},
{th:'T1',t:'qcm', // ← bonne rep. B
q:'Dans une "brigade allégée" ou "brigade restreinte", chaque cuisinier doit :',
o:['Travailler uniquement le midi sans service du soir','Assurer plusieurs postes differents en etant polyvalent','Cuisiner moins de plats avec un menu simplifie','Ne prendre en charge que les taches de nettoyage en plus de la cuisine'],
a:1,e:'Dans une brigade restreinte (petits restaurants, bistrots), la polyvalence est obligatoire. Un cuisinier peut gerer entrees + desserts, ou chaud + froid selon les besoins. On parle aussi de "double poste".'},
{th:'T1',t:'qcm', // ← bonne rep. A
q:'La mission principale du "sous-chef de cuisine" est de :',
o:['Seconder le chef, manager l\'equipe au quotidien et assurer la continuite du service en son absence','Gerer exclusivement les achats et les commandes aux fournisseurs','Prendre en charge uniquement la patisserie et la confiserie','Assurer la communication entre la salle et la cuisine lors du service'],
a:0,e:'Le sous-chef est le bras droit du chef : il encadre l\'equipe, verifie la qualite, assure le service lors des absences et forme les commis. C\'est un poste de management autant que de technique culinaire.'},
{th:'T1',t:'vf',
q:'VRAI ou FAUX ?\n\n"Battre en retraite" en cuisine professionnelle designe le nettoyage et le rangement complet de son poste de travail a la fin de chaque service.',
a:true,e:'VRAI. A la fin du service, chaque cuisinier "bat en retraite" : nettoie son espace, filme et etiquete les restes, range son materiel. C\'est une discipline professionnelle fondamentale.'},
{th:'T1',t:'qcm', // ← bonne rep. C
q:'En cuisine, le terme "faire le marche" designe :',
o:['Transmettre les bons de commande hebdomadaires aux fournisseurs','Effectuer l\'inventaire des stocks en reserve','Choisir et acheter les produits frais du jour, souvent le matin au marche ou chez des producteurs locaux','Preparer le planning de production de la semaine avec le chef'],
a:2,e:'Le "marche" est le moment ou le chef (ou son commis designe) choisit les meilleurs produits frais disponibles. Ce sont ces produits qui determinant souvent le menu du jour. C\'est une pratique cle de la cuisine de marche.'},
{th:'T1',t:'qcm', // ← bonne rep. D
q:'Dans une brigade classique, le "saucier" est responsable de :',
o:['La preparation des garnitures froides et des salades de saison','La confection des patisseries et entremets du restaurant','La reception et le controle de qualite des livraisons','Les fonds bruns et blancs, fumets, sauces chaudes et la cuisson des viandes et poissons nobles'],
a:3,e:'Le saucier realise les fonds (veau, volaille, poisson), sauces emulsionnees (hollandaise, bearnaise), et supervise les cuissons nobles. Il est aux cotes du sous-chef pendant tout le service.'},
{th:'T1',t:'vf',
q:'VRAI ou FAUX ?\n\nL\'expression "Ca marche pour 3 !" en cuisine signifie que le cuisinier confirme qu\'il a bien recu la commande de 3 portions et va les preparer.',
a:true,e:'VRAI. "Ca marche !" est la formule standard pour accuser reception d\'une commande. Le cuisinier repete la commande en annoncant le nombre de portions. Cette communication evite les oublis et les erreurs pendant le service.'},
{th:'T1',t:'qcm', // ← bonne rep. B
q:'Un "bon de commande" envoye a un fournisseur est un document qui :',
o:['Liste les plats vendus durant un service pour calculer le chiffre d\'affaires','Engage formellement le restaurant aupres du fournisseur pour livrer des produits precis en quantites et prix convenus','Sert a controler et noter les temperatures a la reception des marchandises','Definit le planning des horaires de l\'ensemble de l\'equipe de cuisine'],
a:1,e:'Le bon de commande est un document contractuel qui engage les deux parties. Le restaurant commande des produits precis avec quantites et prix, le fournisseur s\'engage a les livrer conformement. C\'est la base de toute tracabilite fournisseur.'},
{th:'T1',t:'qcm', // ← bonne rep. A
q:'Le "tournant" dans une brigade classique est :',
o:['Le cuisinier polyvalent capable de remplacer n\'importe quel chef de partie absent','Le cuisinier specialise uniquement dans les entrees froides et les garnitures','Le cuisinier responsable des desserts chauds et des fondants au chocolat','L\'apprenti qui tourne sur tous les postes pour apprendre la technique'],
a:0,e:'Le tournant connait tous les postes de la brigade. Il remplace les absents sans perturber le service. C\'est le cuisinier le plus polyvalent, dont la valeur est reconnue par toute l\'equipe.'},
{th:'T1',t:'vf',
q:'VRAI ou FAUX ?\n\nUn commis qui constate une erreur (mauvais assaisonnement, cuisson incorrecte) doit le signaler immediatement a son chef de partie plutot que de corriger seul sans autorisation.',
a:true,e:'VRAI. La communication et la hierarchie sont fondamentales en brigade. Signaler l\'erreur permet de corriger dans les regles, d\'eviter un incident grave lors de l\'envoi et d\'apprendre la bonne methode. Corriger seul sans prevenir peut aggraver la situation.'},
// ── T2 ENTREES ET DESSERTS 14 q (9 QCM + 5 VF) ─────────────
{th:'T2',t:'qcm', // ← bonne rep. C
q:'Pour reussir une emulsion (mayonnaise, sauce maltaise), il est essentiel que :',
o:['L\'huile soit tiede et les jaunes d\'oeufs tres froids sortis du refrigerateur','Le vinaigre soit chaud et l\'huile froide au moment du melange','Tous les ingredients soient a la meme temperature ambiante (18-20 degres)','Les oeufs soient congeles 10 minutes avant d\'etre incorpores a l\'huile'],
a:2,e:'Une emulsion reussie necessite que l\'huile et les jaunes soient a la meme temperature. Si l\'huile est trop froide, l\'emulsion ne se forme pas ; si les jaunes sont trop froids, la mayonnaise tranche. Temperature ambiante = regle d\'or.'},
{th:'T2',t:'vf',
q:'VRAI ou FAUX ?\n\nLa creme anglaise est correctement cuite lorsqu\'elle nappe la cuillere et que sa temperature atteint 82-84 degres Celsius. Au-dela de 85 degres, elle tourne et forme des grumeaux.',
a:true,e:'VRAI. A 82-84°C, les proteines des jaunes coagulent suffisamment pour napper. Au-dela de 85°C, les jaunes coagulent trop vite et forment des grumeaux. On arrete la cuisson en placant la casserole dans un bac d\'eau froide.'},
{th:'T2',t:'qcm', // ← bonne rep. D
q:'Un souffle chaud (chocolat, Grand Marnier, fromage) doit etre servi :',
o:['Apres 10 minutes de repos pour stabiliser la texture et eviter les brulures','A temperature ambiante pour permettre aux aromes de se developper pleinement','La veille en le conservant au refrigerateur puis regenere au four avant le service','Immediatement a la sortie du four car il retombe en quelques minutes seulement'],
a:3,e:'Le souffle retombe des la sortie du four car l\'air emprisonne dans les blancs se contracte en refroidissant. Il doit etre envoye instantanement. Le client attend le souffle, jamais le souffle n\'attend le client.'},
{th:'T2',t:'qcm', // ← bonne rep. B
q:'La "brunoise" est une taille culinaire produisant :',
o:['Des batonnets reguliers de 5 cm de long sur 5 mm d\'epaisseur (julienne epaisse)','De tres petits des reguliers de 2 a 3 mm de cote pour garnissages fins','Des lamelles fines et longues d\'epaisseur uniforme (julienne classique)','Des rondelles regulieres d\'environ 1 cm d\'epaisseur (rondelles epaisses)'],
a:1,e:'La brunoise (2-3 mm) sert pour les garnissages fins, farces, sauces. La macedoine = des de 5 mm, la julienne = fines lamelles, la paysanne = petits carres plats de 1 mm. Maitriser ces coupes est fondamental pour tout commis.'},
{th:'T2',t:'vf',
q:'VRAI ou FAUX ?\n\nPour reussir un caramel a sec ou avec eau, il ne faut jamais remuer le sucre avec une spatule pendant la fonte car cela provoque une cristallisation qui fait "masser" le caramel.',
a:true,e:'VRAI. Remuer le sucre en cours de caramelisation brise les cristaux naissants et declenche une reaction en chaine : le sucre recristallise et blanchit (il "masse"). On peut incliner doucement la casserole, mais jamais toucher avec un ustensile.'},
{th:'T2',t:'qcm', // ← bonne rep. A
q:'Pour obtenir une chantilly ferme et stable, la creme liquide entiere doit contenir au minimum :',
o:['30 pourcent de matieres grasses','15 pourcent de matieres grasses','20 pourcent de matieres grasses','50 pourcent de matieres grasses'],
a:0,e:'La MG est indispensable pour emprisonner l\'air et stabiliser la chantilly. En dessous de 30%, elle ne monte pas. La creme fleurette (30-35% MG) est ideale. Elle doit aussi etre tres froide (4°C) avant fouettage pour ne pas chauffer pendant le montage.'},
{th:'T2',t:'qcm', // ← bonne rep. C
q:'Le "blanchiment a l\'anglaise" des legumes verts (haricots, asperges, brocolis) consiste a :',
o:['Les faire revenir rapidement au beurre clarifie a feu tres vif avant de les refroidir','Les cuire doucement a la vapeur jusqu\'a tendrete complete et les conserver a temperature ambiante','Les plonger dans l\'eau bouillante salee puis immediatement dans un bac d\'eau glacee pour fixer la couleur verte','Les mariner plusieurs heures dans du jus de citron pour les attendrir et les blanchir naturellement'],
a:2,e:'Le choc thermique (eau bouillante → eau glacee) fixe la chlorophylle et preserve la couleur verte eclatante. Il stoppe aussi la cuisson a point. C\'est la technique de base pour legumes verts servis froids ou regeneres au dernier moment.'},
{th:'T2',t:'qcm', // ← bonne rep. D
q:'La panna cotta est un dessert italien dont la texture est obtenue grace a :',
o:['Des blancs d\'oeufs montes en neige fermes incorpores a la creme chaude','De la fecule de mais (Maizena) delayee dans du lait froid avant incorporation','Du sucre cuit au stade grand boule (121 degres) verse sur de la creme froide','De la gelatine alimentaire dissoute dans la preparation chaude'],
a:3,e:'La panna cotta (creme cuite) utilise la gelatine comme seul agent de prise. On la dissout dans la creme chaude aromatisee, on coule dans des moules et on laisse figer au froid 3h minimum. La proportion standard : 2g de gelatine pour 100ml de creme.'},
{th:'T2',t:'vf',
q:'VRAI ou FAUX ?\n\nUne terrine de viande ou de gibier doit etre cuite au bain-marie au four pour eviter une chaleur trop directe et garantir une cuisson homogene sans assecher les bords.',
a:true,e:'VRAI. Le bain-marie (moule dans un bac d\'eau a 70°C) protege la terrine : la chaleur est douce et uniforme. Sans bain-marie, les bords cuisent trop vite et se dessechent avant que le centre soit cuit. Temperature a coeur recommandee : 70°C.'},
{th:'T2',t:'qcm', // ← bonne rep. B
q:'Un "coulis" de fruits se distingue d\'une compote car :',
o:['Il est toujours servi chaud contrairement a la compote qui est toujours servie froide','C\'est une puree de fruits mixee et finement filtree, sans morceaux ni liant amidonné — la compote conserve les morceaux et une texture plus epaisse','Il contient obligatoirement de la gelatine pour tenir en decoration d\'assiette','Il est exclusivement utilise en decoration des desserts de patisserie industrielle'],
a:1,e:'Coulis = puree lisse et filtree (cru ou cuit). Compote = morceaux fondants dans leur jus, plus epaisse. Sauce = plus fluide, peut etre liee. Ces trois preparations sont distinctes et chacune a son usage en cuisine professionnelle.'},
{th:'T2',t:'vf',
q:'VRAI ou FAUX ?\n\nUn oeuf poche se cuit dans de l\'eau frémissante (environ 80-85 degres, jamais bouillante) additionnnee de vinaigre blanc qui favorise la coagulation rapide du blanc autour du jaune.',
a:true,e:'VRAI. L\'eau frémissante sans gros bouillons preserve la forme. Le vinaigre (acide) accelere la coagulation du blanc et l\'empeche de se disperser. Duree de cuisson : 3 minutes pour un jaune coulant. On peut pocher jusqu\'a 10 oeufs a la fois en collant chaque blanc au moment de l\'immersion.'},
{th:'T2',t:'qcm', // ← bonne rep. A
q:'La technique de "monter au beurre" une sauce consiste a :',
o:['Incorporer du beurre froid en petits des hors du feu ou a tres faible chaleur, en fouettant pour creer une emulsion brillante et onctueuse','Faire fondre du beurre clarifie dans la sauce a feu tres vif en remuant constamment','Ajouter simultanement de la farine et du beurre pour lier la sauce par un roux expres','Battre du beurre mou avec du sucre glace avant de l\'incorporer en fin de cuisson'],
a:0,e:'Monter au beurre cree une emulsion eau/MG qui rend la sauce brillante, nappante et onctueuse sans farine. Le beurre doit etre tres froid et la sauce en dessous de 70°C pour ne pas casser l\'emulsion. C\'est la finition classique de nombreuses sauces de restaurant.'},
{th:'T2',t:'qcm', // ← bonne rep. C
q:'La "liaison a la creme et aux jaunes d\'oeufs" d\'une sauce (blanquette, veloute) doit s\'effectuer :',
o:['En ajoutant creme et jaunes directement dans la sauce bouillante en fouettant vigoureusement','En cuisant les jaunes d\'oeufs a sec dans une poele a revêtement avant de les incorporer','Hors du feu ou a chaleur tres douce sous 80 degres, en remuant constamment pour eviter la coagulation des jaunes','En ajoutant la creme froide directement dans la sauce bouillante sans prechauffer'],
a:2,e:'Les jaunes coagulent a 70-75°C et tournent en grumeaux si la sauce bout. On doit donc lier hors du feu en remuant. C\'est la "liaison" classique : on verse le melange jaunes+creme dans la sauce chaude en remuant, sans remettre sur le feu.'},
// ── T3 HYGIENE ET SECURITE 13 q (9 QCM + 4 VF) ─────────────
{th:'T3',t:'qcm', // ← bonne rep. D
q:'Selon les normes HACCP, la duree maximale autorisee pour refroidir une preparation chaude de +63 degres a +10 degres Celsius est :',
o:['30 minutes pour les viandes, 1 heure pour les fonds et les sauces','1 heure pour toutes les preparations, sans exception','4 heures en cellule de refroidissement, 6 heures en bac de glace','2 heures, apres quoi les aliments presentent un risque bacteriologique eleve'],
a:3,e:'La reglementation HACCP impose le passage de 63°C a 10°C en moins de 2 heures. Cela permet de traverser rapidement la zone de danger (4-63°C). On utilise une cellule de refroidissement rapide, un bac de glace ou on fractionne en petites portions.'},
{th:'T3',t:'vf',
q:'VRAI ou FAUX ?\n\nL\'utilisation de planches a decouper de couleurs differentes (rouge = viande crue, bleue = poisson, verte = legumes, jaune = volaille) est une bonne pratique recommandee par les normes HACCP pour prevenir la contamination croisee.',
a:true,e:'VRAI. Ce code couleur international reduit le risque de contamination croisee. Chaque couleur est dedicacee a une famille d\'aliments. Cette pratique est recommandee par les normes HACCP et verifiee lors des controles sanitaires.'},
{th:'T3',t:'qcm', // ← bonne rep. B
q:'La difference entre "nettoyer" et "desinfecter" une surface en cuisine professionnelle est :',
o:['La desinfection seule suffit a enlever les souillures et tuer les microbes en une seule operation','Le nettoyage enleve les souillures physiques (graisses, residus) ET la desinfection tue les micro-organismes — les deux etapes sont necessaires dans cet ordre precis','On peut se contenter de nettoyer si la surface parait visuellement propre a l\'oeil nu','Ces deux termes sont synonymes et designe la meme operation dans les protocoles professionnels'],
a:1,e:'Les deux etapes sont obligatoires DANS L\'ORDRE. Nettoyer d\'abord (enlever les salissures), puis desinfecter (tuer les microbes). On ne peut pas desinfecter efficacement une surface sale car les salissures protegent les micro-organismes du desinfectant.'},
{th:'T3',t:'qcm', // ← bonne rep. A
q:'La listeria monocytogenes est particulierement dangereuse dans les cuisines car :',
o:['Elle peut se developper meme a des temperatures de refrigeration entre 0 et 4 degres Celsius','Elle ne se developpe qu\'a des temperatures superieures a 63 degres, lors des cuissons inadequates','Elle est uniquement presente dans les produits de la mer et les coquillages crus','Elle est totalement detruite par le vinaigre et le sel en quelques minutes de contact'],
a:0,e:'La listeria est "psychrotrophe" : elle survit et se multiplie de 0°C a 4°C, donc dans le refrigerateur. Elle est dangereuse pour les femmes enceintes, personnes agees et immunodeprimees. Produits a risque : charcuteries, fromages a pate molle, rillettes.'},
{th:'T3',t:'vf',
q:'VRAI ou FAUX ?\n\nPorter des gants en plastique dispense de se laver les mains : avec des gants, on peut manipuler des aliments propres apres avoir touche des produits crus sans risque de contamination.',
a:false,e:'FAUX. Les gants se contaminent exactement comme les mains. Un gant souille est aussi dangereux que des mains sales. Il faut changer de gants ET se laver les mains a chaque changement de tache. Les gants ne remplacent jamais le lavage des mains.'},
{th:'T3',t:'qcm', // ← bonne rep. C
q:'La reglementation impose un releve de temperature des equipements frigorifiques en cuisine professionnelle :',
o:['Une fois par semaine au minimum, avec consignation sur registre mensuel','Une fois par mois selon la frequence d\'utilisation et le type de produit stocke','Au minimum une fois par jour avec consignation ecrite sur un registre dedie','Uniquement lors des controles annuels de la DDPP ou en cas de panne declaree'],
a:2,e:'Le releve quotidien des temperatures est une obligation reglementaire. Le registre doit etre disponible pour tout controle. Tout ecart (refrigerateur > 4°C, congelateur > -18°C) doit generer une action corrective immediate et documentee.'},
{th:'T3',t:'qcm', // ← bonne rep. B
q:'En cas de suspicion de toxi-infection alimentaire collective (TIAC) dans votre etablissement, la premiere demarche obligatoire est :',
o:['Fermer immediatement le restaurant et tout jeter avant que les autorites n\'arrivent sur place','Alerter sans delai la DDPP (Direction Departementale de la Protection des Populations) et conserver les plats temoins a +4 degres','Appeler uniquement le medecin traitant des clients concernes et attendre son avis','Nettoyer entierement la cuisine avant l\'arrivee des inspecteurs pour montrer un etablissement propre'],
a:1,e:'La TIAC est un evenement a declaration obligatoire. La DDPP doit etre prevenue immediatement. Les plats temoins (echantillons de chaque plat servi, conserves a +4°C pendant 5 jours) permettent d\'identifier l\'agent pathogene. Detruire les preuves est une obstruction grave a l\'enquete sanitaire.'},
{th:'T3',t:'vf',
q:'VRAI ou FAUX ?\n\nLa "marche en avant" est un principe d\'organisation de la cuisine professionnelle imposant que les produits propres et les produits sales ne se croisent jamais, ni dans l\'espace ni dans le temps.',
a:true,e:'VRAI. La marche en avant (spatiale ou temporelle) est un principe HACCP fondamental. En cuisine trop petite pour separer les zones physiquement, on applique la "marche en avant dans le temps" : toutes les operations sales sont terminees avant de commencer les operations propres.'},
{th:'T3',t:'qcm', // ← bonne rep. D
q:'Le "nettoyage a sec" d\'un plan de travail avant le nettoyage humide consiste a :',
o:['Passer une lavette seche sur la surface sans aucun produit pour absorber les graisses','Appliquer un desinfectant en poudre sur la surface pour tuer les bacteries sans eau','Utiliser une lampe UV portable pour steriliser la surface en 5 minutes sans humidite','Eliminer tous les dechets solides (miettes, epluchures, residus) avec une spatule ou une brosse avant d\'appliquer eau et detergent'],
a:3,e:'Le nettoyage a sec est la premiere etape indispensable : debarrasser la surface de tous dechets solides AVANT d\'appliquer eau et detergent. Si on mouille directement, on etale les salissures, on les fixe et on les disperse. Cette etape preparatoire est souvent negligee mais cruciale.'},
{th:'T3',t:'qcm', // ← bonne rep. A
q:'La temperature minimale de cuisson a coeur recommandee pour une volaille entiere (poulet roti, dinde) afin d\'eliminer salmonelles et campylobacter est :',
o:['82 degres Celsius a coeur','65 degres Celsius a coeur','70 degres Celsius a coeur','55 degres Celsius a coeur'],
a:0,e:'82°C a coeur est la temperature de securite pour les volailles entieres. Pour les volailles desossees ou hachees, 74°C suffit. La sonde doit etre inseree dans la partie la plus epaisse (cuisse, epaule), jamais au contact d\'un os qui conduirait mal la chaleur.'},
{th:'T3',t:'vf',
q:'VRAI ou FAUX ?\n\nLes allergenes peuvent etre transmis par contamination croisee indirecte : un ustensile ou une planche ayant ete en contact avec des noix, puis utilises sans nettoyage pour un autre plat, peut suffire a declencer une reaction allergique grave.',
a:true,e:'VRAI. Meme des traces infimes d\'allergenes (quelques microgrammes) suffisent a provoquer un choc anaphylactique chez les personnes sensibles. Tout ustensile ayant touche un allergene doit etre soigneusement lave et desinfecte avant tout autre usage.'},
{th:'T3',t:'qcm', // ← bonne rep. C
q:'Un "plan de nettoyage et desinfection" (PND) complet doit obligatoirement preciser :',
o:['Uniquement les produits d\'entretien agrees CE et leur mode de dilution recommande','Seulement la frequence de nettoyage des sols, plans de travail et equipements principaux','La surface ou l\'equipement concerne, la frequence, le produit, la dilution, le temps de contact, la methode et le responsable de chaque operation','Seulement le nom du produit desinfectant biocide agree et la temperature d\'application'],
a:2,e:'Un PND complet permet a n\'importe quel membre de l\'equipe d\'effectuer le nettoyage correctement, sans autre information. Il doit couvrir TOUS les equipements et surfaces, avec des procedures precises et des responsabilites clairement attribuees. C\'est un document HACCP obligatoire.'},
{th:'T3',t:'qcm', // ← bonne rep. B
q:'La "rupture de la chaine du froid" se definit comme :',
o:['Une panne complete du systeme frigorifique de toute une nuit entrainant une remontee totale en temperature','Le depassement de la temperature de conservation requise pendant un temps significatif, permettant la proliferation bacterielle','Le simple transport de produits frais dans un sac ordinaire pendant moins d\'une heure en periode hivernale','La decongelation complete et soigneuse d\'un produit surgele effectuee au refrigerateur a +4 degres'],
a:1,e:'La rupture de la chaine du froid survient des qu\'un produit refrigere depasse sa temperature de conservation pendant un temps suffisant pour permettre la multiplication bacterienne. Une rupture meme breve (reception sans refrigeration, transport trop long) peut etre irreversible et invisible a l\'oeil.'},
// ── T4 TRACABILITE 11 q (9 QCM + 2 VF) ─────────────────────
{th:'T4',t:'qcm', // ← bonne rep. D
q:'Les documents de tracabilite et relevés de temperatures doivent etre conserves dans un etablissement de restauration pendant :',
o:['1 semaine minimum, puis peuvent etre detruits','1 mois minimum, a renouveler chaque debut de mois','6 mois minimum en classeur accessible a l\'inspection','Au minimum 1 an, et 3 ans sont recommandes en pratique'],
a:3,e:'La reglementation impose 1 an de conservation minimum pour les documents de tracabilite. En pratique, 3 ans sont recommandes. Ce sont les premiers documents demandes lors d\'un controle sanitaire de la DDPP. Les etablissements ayant subi une TIAC doivent conserver bien au-dela.'},
{th:'T4',t:'vf',
q:'VRAI ou FAUX ?\n\nLors d\'une reception de marchandises, un fournisseur qui livre des produits avec des emballages dechires, gonfles ou dont la temperature de livraison est hors norme doit se voir refuser la livraison, quelles que soient les circonstances.',
a:true,e:'VRAI. Accepter une livraison non conforme engage la responsabilite totale du restaurant. Emballages gonfles = activite bacteriologique. Temperature hors norme = rupture de la chaine du froid. Le refus doit etre note et signe sur le bon de livraison pour se proteger.'},
{th:'T4',t:'qcm', // ← bonne rep. A
q:'La mention "UHT" sur une brique de lait ou de creme signifie que le produit a ete traite :',
o:['Par Ultra Haute Temperature (135-150 degres pendant 2-4 secondes) permettant une conservation longue duree sans refrigeration','Par des antibiotiques naturels issus de la flore microbienne certifiee de l\'elevage','Par pasteurisation basse temperature (63-65 degres pendant 30 minutes) dite "lait pasteurise frais"','Par un procede de certification biologique et de protection de l\'origine geographique'],
a:0,e:'UHT (Ultra Haute Temperature) detruit tous les micro-organismes y compris les spores resistantes, d\'ou une conservation de plusieurs mois a temperature ambiante. La pasteurisation (72°C, 15 secondes) ne detruit que les formes vegetatives : le lait frais pasteurise doit rester au froid.'},
{th:'T4',t:'qcm', // ← bonne rep. C
q:'L\'etiquetage d\'un plat prepare a l\'avance et conserve en cuisine (J+1, J+2) doit obligatoirement mentionner :',
o:['Le prix unitaire, le poids de la portion en grammes et le code nutritionnel Nutri-Score','Le nom et le numero de telephone du cuisinier responsable de la preparation','La denomination du produit, la date et heure de fabrication, la DLC, les conditions de conservation et les allergenes','Uniquement la date de fabrication et la DLC – le reste est facultatif'],
a:2,e:'L\'etiquetage interne (plats conserves plus d\'un service) est reglemente. En cas de controle ou d\'intoxication, ces informations garantissent la tracabilite complete. Un allergene oublie sur une etiquette peut engager gravement la responsabilite penale du responsable d\'etablissement.'},
{th:'T4',t:'qcm', // ← bonne rep. B
q:'Dans le systeme HACCP, le "danger biologique" le plus frequent dans une cuisine professionnelle est :',
o:['La contamination involontaire par les produits d\'entretien meles accidentellement aux aliments','La proliferation de micro-organismes pathogenes comme salmonelles, listeria, staphylocoques, campylobacter','La presence de residus de pesticides sur les fruits et legumes insuffisamment laves','La contamination physique par des corps etrangers tels que bris de verre ou eclats de metal'],
a:1,e:'Les dangers biologiques (bacteries, virus, parasites) causent la grande majorite des toxi-infections. Salmonelles (volailles, oeufs), listeria (charcuteries, fromages), campylobacter (volailles), staphylocoques (mains, blessures) sont les pathogenes les plus frequents en restauration.'},
{th:'T4',t:'vf',
q:'VRAI ou FAUX ?\n\nLe registre de tracabilite des viandes bovines doit permettre de remonter jusqu\'a l\'elevage d\'origine de l\'animal grace au numero de lot et au certificat sanitaire accompagnant chaque livraison.',
a:true,e:'VRAI. Le reglement europeen CE n°178/2002 impose une tracabilite "de la ferme a l\'assiette" pour les viandes bovines. Chaque animal a un numero d\'identification unique. En cas de crise sanitaire, tous les produits d\'un meme elevage peuvent etre rappeles en quelques heures.'},
{th:'T4',t:'qcm', // ← bonne rep. D
q:'Lors de la reception d\'une livraison de produits surgeles, la temperature maximale a coeur toleree selon la reglementation est :',
o:['-10 degres Celsius (acceptable pour un transport court)','-12 degres Celsius (norme pour les surgeles vendus au detail)','-15 degres Celsius (norme europeenne de transport frigorifique)','-18 degres Celsius (norme obligatoire pour les surgeles en cuisine professionnelle)'],
a:3,e:'Les produits surgeles doivent etre livres et stockes a -18°C minimum. Un produit surgele recu a -15°C ou au-dessus doit etre refuse ou consomme immediatement selon la procedure interne. La sonde thermometrique doit etre utilisee a chaque reception.'},
{th:'T4',t:'qcm', // ← bonne rep. A
q:'Une "fiche technique de fabrication" complete d\'une recette doit contenir :',
o:['Les ingredients avec quantites precises, temperatures et durees de cuisson, mode operatoire detaille, points de controle hygiene et cout de revient calcule','Seulement la liste des ingredients et leur cout d\'achat HT par portion','Uniquement les photos du plat fini et les instructions de dressage pour les commis','Le nom du cuisinier createur, la date de creation et le numero de version de la recette'],
a:0,e:'La fiche technique est a la fois un outil de production (reproductibilite, uniformite) et de gestion (cout de revient, prix de vente). Elle sert de reference pour la formation des nouveaux cuisiniers et les controles qualite. C\'est un document obligatoire dans tout etablissement serieux.'},
{th:'T4',t:'qcm', // ← bonne rep. C
q:'La DDPP (Direction Departementale de la Protection des Populations) peut effectuer un controle sanitaire :',
o:['Uniquement sur rendez-vous pris au moins 48 heures a l\'avance','Seulement apres le depot d\'une plainte formelle par un client ou un concurrent','A tout moment, de facon inopinee et sans aucun avertissement prealable, pendant les horaires d\'ouverture','Uniquement lors d\'une reinspection programmee apres une fermeture administrative precedente'],
a:2,e:'Les inspections sanitaires sont inopinees par definition pour garantir leur efficacite. Un inspecteur peut se presenter n\'importe quand pendant les horaires d\'ouverture. C\'est pourquoi hygiene et tracabilite doivent etre irreprochables en permanence, pas seulement avant une visite annoncee.'},
{th:'T4',t:'qcm', // ← bonne rep. B
q:'Un "plat temoin" en restauration collective ou en traiteur est :',
o:['Un plat mis en valeur sur la carte pour representer la cuisine du chef aupres des clients','Un echantillon de 100g minimum de chaque plat servi, conserve 5 jours a +4 degres pour analyse en cas de toxi-infection alimentaire collective','Le plat de remplacement prevu pour les clients signalant une allergie alimentaire en debut de repas','L\'assiette presentee a l\'inspection sanitaire lors du controle annuel pour evaluation de la qualite'],
a:1,e:'Le plat temoin est une obligation reglementaire en restauration collective. En cas de TIAC, l\'analyse microbiologique du plat temoin permet d\'identifier l\'aliment responsable et l\'agent pathogene. Sans plats temoins, l\'enquete sanitaire est rendue beaucoup plus difficile.'},
{th:'T4',t:'qcm', // ← bonne rep. D
q:'En HACCP, une "non-conformite" est definie comme :',
o:['Un plat renvoye par un client insatisfait de son gout ou de sa presentation visuelle','Un fournisseur qui ne respecte pas le delai de livraison convenu sans prevenir','Une facture erronee emise par un prestataire de service de la restauration','Tout ecart constate entre les pratiques reelles et les procedures etablies dans le plan de maitrise sanitaire'],
a:3,e:'Une non-conformite HACCP peut etre : temperature incorrecte, document manquant, procedure non respectee, produit perime utilise. Chaque non-conformite doit etre enregistree, analysee (cause racine), et faire l\'objet d\'une action corrective documentee pour eviter la recidive.'}
];
// ═══ VARIABLES ═══════════════════════════════════════════
var cur=0,score=0,answered=false;
var thSc={},thTo={};
var appName='';
var lastCode=null;
function initTh(){
Object.keys(TH).forEach(function(k){thSc[k]=0;thTo[k]=0;});
QS.forEach(function(q){thTo[q.th]++;});
}
// ═══ NAVIGATION ══════════════════════════════════════════
function hideAll(){
['sh','sq','sr','sdl','sd'].forEach(function(id){document.getElementById(id).style.display='none';});
document.getElementById('pgwrap').style.display='none';
}
function goHome(){hideAll();document.getElementById('sh').style.display='block';}
function showDL(){
hideAll();document.getElementById('sdl').style.display='block';
document.getElementById('auinp').value='';
document.getElementById('aerr').style.display='none';
}
// ═══ DEMARRAGE ═══════════════════════════════════════════
function tryStart(){
var n=document.getElementById('ninp').value.trim();
if(!n||n.length<2){document.getElementById('nerr').style.display='block';document.getElementById('ninp').focus();return;}
document.getElementById('nerr').style.display='none';
appName=n; initTh(); cur=0; score=0; answered=false; lastCode=null;
Object.keys(thSc).forEach(function(k){thSc[k]=0;});
hideAll();
document.getElementById('pgwrap').style.display='block';
document.getElementById('sq').style.display='block';
showQ();
}
// ═══ QUESTION ════════════════════════════════════════════
function showQ(){
var q=QS[cur]; answered=false;
var pct=Math.round((cur/QS.length)*100);
document.getElementById('pgfill').style.width=pct+'%';
document.getElementById('pgtxt').textContent='Question '+(cur+1)+' / '+QS.length;
document.getElementById('pgpct').textContent=pct+' %';
document.getElementById('ttag').style.background=TH[q.th].bg;
document.getElementById('tlbl').innerHTML=TH[q.th].ico+' '+TH[q.th].name;
document.getElementById('qnum').textContent='Question '+(cur+1)+' sur '+QS.length;
document.getElementById('qtxt').textContent=q.q;
document.getElementById('qfb').className='fb';
document.getElementById('qfb').innerHTML='';
var nb=document.getElementById('nxbtn');
nb.className='nxbtn';
nb.textContent=cur<QS.length-1?'Continuer \u2192':'Voir mes resultats \uD83C\uDFC1';
var cont=document.getElementById('qopts'); cont.innerHTML='';
if(q.t==='qcm'){
var wrap=document.createElement('div'); wrap.className='opts';
q.o.forEach(function(opt,i){
var btn=document.createElement('button'); btn.className='obtn';
btn.innerHTML='<span class="lt">'+['A','B','C','D'][i]+'</span><span>'+opt+'</span>';
btn.onclick=(function(idx,b){return function(){selQ(idx,b);};})(i,btn);
wrap.appendChild(btn);
});
cont.appendChild(wrap);
} else {
var w=document.createElement('div'); w.className='vfw';
var tb=document.createElement('button'); tb.className='vfb';
tb.innerHTML='<span class="vi">✅</span>VRAI';
tb.onclick=(function(b){return function(){selVF(true,b);};})(tb);
var fb=document.createElement('button'); fb.className='vfb';
fb.innerHTML='<span class="vi">❌</span>FAUX';
fb.onclick=(function(b){return function(){selVF(false,b);};})(fb);
w.appendChild(tb); w.appendChild(fb); cont.appendChild(w);
}
var card=document.querySelector('.card');
if(card){card.style.animation='none';card.offsetHeight;card.style.animation='';}
window.scrollTo(0,0);
}
function selQ(i,btn){
if(answered)return; answered=true;
var q=QS[cur];
document.querySelectorAll('.obtn').forEach(function(b){b.disabled=true;});
var ok=(i===q.a);
if(ok){btn.classList.add('correct');score++;thSc[q.th]++;}
else{btn.classList.add('wrong');document.querySelectorAll('.obtn')[q.a].classList.add('missed');}
showFB(ok,q.e);
document.getElementById('nxbtn').classList.add('show');
}
function selVF(val,btn){
if(answered)return; answered=true;
var q=QS[cur];
document.querySelectorAll('.vfb').forEach(function(b){b.disabled=true;});
var ok=(val===q.a);
if(ok){btn.classList.add('correct');score++;thSc[q.th]++;}
else{btn.classList.add('wrong');document.querySelectorAll('.vfb')[q.a===true?0:1].classList.add('missed');}
showFB(ok,q.e);
document.getElementById('nxbtn').classList.add('show');
}
function showFB(ok,expl){
var f=document.getElementById('qfb');
f.className='fb show '+(ok?'ok':'ko');
f.innerHTML=(ok?'✅ Bonne reponse !':'❌ Ce n\'est pas la bonne reponse.')+
'<div class="ex">💡 '+expl+'</div>';
}
function nextQ(){cur++;if(cur>=QS.length)showRes();else showQ();}
// ═══ RESULTATS ═══════════════════════════════════════════
function showRes(){
hideAll(); document.getElementById('sr').style.display='block'; window.scrollTo(0,0);
var pct=Math.round((score/QS.length)*100);
var bg,emoji,title,msg;
if(pct>=80){bg='linear-gradient(135deg,#2A7A4B,#3EA065)';emoji='🏆';title='Excellent travail !';msg='Vous maitrisez le metier de commis de cuisine a un niveau avance. Bravo !';}
else if(pct>=60){bg='linear-gradient(135deg,#D4760A,#F4B942)';emoji='👍';title='Bon travail !';msg='Bien joue ! Continuez a revoir les themes ou votre score est plus faible.';}
else{bg='linear-gradient(135deg,#B5451B,#D4760A)';emoji='💪';title='Continuez vos efforts !';msg='Reprenez les supports de cours et reessayez. Chaque tentative vous fait progresser !';}
document.getElementById('sring').style.background=bg;
document.getElementById('snum').textContent=score+'/'+QS.length;
document.getElementById('abadge').innerHTML='👤 '+appName;
document.getElementById('rtitle').innerHTML=emoji+' '+title;
document.getElementById('rmsg').textContent=msg;
var cont=document.getElementById('tscores'); cont.innerHTML='';
Object.keys(TH).forEach(function(k){
var s=thSc[k],t=thTo[k],p=Math.round((s/t)*100);
var cls=p>=75?'good':p<50?'low':'mid';
cont.innerHTML+='<div class="tsrow"><div class="tstop"><span class="tsname">'+TH[k].ico+' '+TH[k].name+'</span><span class="tssc">'+s+'/'+t+'</span></div><div class="bbg"><div class="bf '+cls+'" style="width:'+p+'%"></div></div></div>';
});
lastCode=buildCode();
document.getElementById('rcode').textContent=lastCode;
document.getElementById('cpymsg').className='cpymsg';
saveLocal();
document.getElementById('esent').className='esent';
}
// ═══ CODE RESULTAT ════════════════════════════════════════
function buildCode(){
var th={};
Object.keys(TH).forEach(function(k){th[k]=[thSc[k],thTo[k]];});
var obj={n:appName,d:new Date().toISOString(),s:score,t:QS.length,th:th};
try{return btoa(unescape(encodeURIComponent(JSON.stringify(obj))));}catch(e){return '';}
}
function decodeCode(raw){
try{return JSON.parse(decodeURIComponent(escape(atob(raw.trim()))));}catch(e){return null;}
}
function cpyCode(){
var c=document.getElementById('rcode').textContent;
if(navigator.clipboard){navigator.clipboard.writeText(c).then(showCpied).catch(function(){fbCopy(c);});}
else{fbCopy(c);}
}
function fbCopy(t){
var ta=document.createElement('textarea');ta.value=t;
ta.style.cssText='position:fixed;opacity:0;top:0;left:0;';
document.body.appendChild(ta);ta.select();
try{document.execCommand('copy');showCpied();}catch(e){}
document.body.removeChild(ta);
}
function showCpied(){
document.getElementById('cpymsg').className='cpymsg show';
setTimeout(function(){document.getElementById('cpymsg').className='cpymsg';},2500);
}
// ═══ EMAIL ════════════════════════════════════════════════
function sendMail(){
var pct=Math.round((score/QS.length)*100);
var mention=pct>=80?'Excellent':pct>=60?'Bien':'A renforcer';
var date='';try{date=new Date().toLocaleDateString('fr-FR',{day:'2-digit',month:'2-digit',year:'numeric',hour:'2-digit',minute:'2-digit'});}catch(e){}
var body='Resultats – Quiz Commis de Cuisine ATRIUM (50 questions)\n';
body+='==========================================================\n\n';
body+='Apprenant : '+appName+'\nDate : '+date+'\nScore : '+score+' / '+QS.length+' ('+pct+'%) – '+mention+'\n\n';
body+='Par theme :\n-----------\n';
Object.keys(TH).forEach(function(k){
var s=thSc[k],t=thTo[k],p=Math.round((s/t)*100);
body+=TH[k].name+' : '+s+'/'+t+' ('+p+'%) – '+(p>=75?'Maitrise':p<50?'A renforcer':'En cours')+'\n';
});
if(lastCode){body+='\nCode resultat (tableau de bord formateur) :\n'+lastCode;}
body+='\n\n-- Quiz ATRIUM Commis de Cuisine';
var subj='[Quiz Cuisine ATRIUM] '+appName+' – '+pct+'% – '+mention;
window.location.href='mailto:'+EMAIL+'?subject='+encodeURIComponent(subj)+'&body='+encodeURIComponent(body);
setTimeout(function(){document.getElementById('esent').className='esent show';},800);
}
// ═══ STOCKAGE LOCAL ═══════════════════════════════════════
function saveLocal(){
try{
var all=loadAll();
var obj=decodeCode(lastCode); if(!obj) return;
obj._src='local';
var dup=all.some(function(r){return r.n===obj.n&&r.d===obj.d;});
if(!dup){all.push(obj);localStorage.setItem(SKEY,JSON.stringify(all));}
}catch(e){}
}
function loadAll(){try{var r=localStorage.getItem(SKEY);return r?JSON.parse(r):[];}catch(e){return[];}}
// ═══ DASHBOARD ════════════════════════════════════════════
function checkCode(){
if(document.getElementById('auinp').value.trim()===DCODE){
document.getElementById('aerr').style.display='none'; showDash();
} else {
document.getElementById('aerr').style.display='block';
document.getElementById('auinp').value=''; document.getElementById('auinp').focus();
}
}
document.addEventListener('keydown',function(e){
if(document.getElementById('sdl').style.display!=='none'&&e.key==='Enter')checkCode();
if(document.getElementById('sd').style.display!=='none'&&e.key==='Enter')importCode();
});
function importCode(){
var raw=document.getElementById('impin').value.trim();
var msg=document.getElementById('impmsg');
if(!raw){msg.className='impmsg ko';msg.textContent='Veuillez coller un code valide.';return;}
var obj=decodeCode(raw);
if(!obj||!obj.n){msg.className='impmsg ko';msg.textContent='Code invalide ou corrompu. Verifiez la saisie.';return;}
try{
var all=loadAll();
var dup=all.some(function(r){return r.n===obj.n&&r.d===obj.d;});
if(dup){msg.className='impmsg ko';msg.textContent='Ce resultat est deja enregistre ('+esc(obj.n)+').';return;}
obj._src='import';
all.push(obj);
localStorage.setItem(SKEY,JSON.stringify(all));
msg.className='impmsg ok';
msg.textContent='\u2705 Resultat de '+esc(obj.n)+' importe avec succes !';
document.getElementById('impin').value='';
renderDash(loadAll());
}catch(err){msg.className='impmsg ko';msg.textContent='Erreur lors de l\'enregistrement.';}
}
function showDash(){
hideAll(); document.getElementById('sd').style.display='block';
document.getElementById('impmsg').className='impmsg';
document.getElementById('impin').value='';
renderDash(loadAll()); window.scrollTo(0,0);
}
function renderDash(all){
var cont=document.getElementById('dcont');
if(!all||!all.length){cont.innerHTML='<div class="dempty">Aucun resultat enregistre. Importez des codes ci-dessus.</div>';return;}
var sorted=all.slice().sort(function(a,b){return new Date(b.d)-new Date(a.d);});
var html='';
sorted.forEach(function(r){
var name=r.n||'Inconnu';
var sc=r.s; var tot=r.t;
var pct=Math.round((sc/tot)*100);
var mention=pct>=80?'🏆 Excellent':pct>=60?'👍 Bien':'💪 A renforcer';
var date='';try{date=new Date(r.d).toLocaleDateString('fr-FR',{day:'2-digit',month:'2-digit',year:'numeric',hour:'2-digit',minute:'2-digit'});}catch(e){}
var src=r._src==='import'?'📥 Importe':'📱 Cet appareil';
html+='<div class="drow"><div class="dname">'+esc(name)+'</div><div class="dmeta">'+date+'</div>';
html+='<div class="dsrc">'+src+'</div>';
html+='<div class="dsbig">'+sc+'/'+tot+' – '+mention+'</div>';
if(r.th){
html+='<div class="dmods">';
Object.keys(TH).forEach(function(k){
var th=r.th[k]; if(!th) return;
var s=Array.isArray(th)?th[0]:th.s; var t=Array.isArray(th)?th[1]:th.t;
var p=Math.round((s/t)*100); var cls=p>=75?'good':p<50?'low':'mid';
html+='<div class="dmr"><span class="dmn">'+TH[k].ico+' '+esc(TH[k].name)+'</span><div class="dbbg"><div class="dbf '+cls+'" style="width:'+p+'%"></div></div><span class="dms">'+s+'/'+t+'</span></div>';
});
html+='</div>';
}
html+='</div>';
});
cont.innerHTML=html;
}
function clearAll(){
if(confirm('Effacer TOUS les resultats ? Action irreversible.')){
try{localStorage.removeItem(SKEY);}catch(e){}
renderDash([]);
document.getElementById('impmsg').className='impmsg';
}
}
function esc(s){return String(s).replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>');}
function restart(){
hideAll();document.getElementById('ninp').value='';
document.getElementById('sh').style.display='block';window.scrollTo(0,0);
}
</script>
</body>
</html>