/* ════════════════════════════════════════
   OBJECTIF BAC PRO MCV – JEU EN ÉQUIPES
   © Cerpeg – Lycée Henri Brulle, Libourne
   ════════════════════════════════════════ */

:root{
  --jaune:#FFC107; --vert:#4CAF50; --rose:#E91E8C;
  --bleu:#5B8BF5;  --orange:#FF9800; --menthe:#3ABFA0;
  --rouge:#e91e3c;
  --bg:#0f0f1a;    --card:#1a1a2e;  --white:#ffffff;
  --radius:18px;   --shadow:0 8px 32px rgba(0,0,0,.45);

  --col-orange:#E8821A;   --col-orange-bg:#c96c0a;
  --col-teal:#27AE7A;     --col-teal-bg:#1a9466;
  --col-purple:#9B59B6;   --col-purple-bg:#7d3fa0;
  --col-red:#D94F6C;      --col-red-bg:#b83555;
  --col-blue:#5B9BD5;     --col-blue-bg:#3a7ab8;

  /* Couleurs équipes (6 max) */
  --team0:#E91E8C; --team1:#27AE7A; --team2:#FFC107;
  --team3:#5B9BD5; --team4:#9B59B6; --team5:#FF6B35;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Nunito',sans-serif;background:var(--bg);color:var(--white);min-height:100vh;overflow-x:hidden;}

.screen{display:none;min-height:100vh;}
.screen.active{display:flex;flex-direction:column;align-items:center;justify-content:center;}

/* ══ ACCUEIL ══ */
#screen-home{background:radial-gradient(ellipse at 30% 20%,#0d2a1e 0%,var(--bg) 60%);gap:24px;padding:40px 20px;text-align:center;}
.logo-top{display:flex;align-items:center;gap:12px;background:var(--col-teal);color:#fff;padding:14px 28px;border-radius:var(--radius);font-family:'Black Han Sans',sans-serif;font-size:1.7rem;}
#screen-home h1{font-family:'Black Han Sans',sans-serif;font-size:clamp(1.6rem,5vw,3rem);color:var(--col-teal);line-height:1.15;}
#screen-home p{font-size:1.05rem;opacity:.8;max-width:520px;}
.btn-start{background:var(--vert);color:#fff;font-weight:900;font-size:1.2rem;border:none;border-radius:50px;padding:15px 48px;cursor:pointer;box-shadow:0 4px 24px rgba(76,175,80,.4);transition:.2s;display:flex;align-items:center;gap:10px;}
.btn-start:hover{transform:scale(1.05);background:#3da83d;}
.note-calc{display:flex;align-items:center;gap:10px;font-size:.9rem;opacity:.7;background:rgba(255,255,255,.06);padding:10px 18px;border-radius:10px;max-width:480px;}

/* ── Setup équipes ── */
.teams-setup{background:var(--card);border-radius:var(--radius);padding:22px 28px;max-width:560px;width:100%;border:1.5px solid rgba(255,255,255,.08);}
.teams-count-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.teams-count-label{font-weight:800;font-size:.95rem;}
.teams-count-btns{display:flex;gap:8px;}
.tcnt-btn{width:42px;height:42px;border-radius:50%;border:2px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);color:#fff;font-weight:900;font-size:1.1rem;cursor:pointer;transition:.2s;}
.tcnt-btn:hover{background:rgba(255,255,255,.15);}
.tcnt-btn.active{background:var(--col-teal);color:#fff;border-color:var(--col-teal);}

/* Cartes commerce */
.team-card-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.team-color-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0;}
.team-name-card{
  flex:1;display:flex;align-items:center;justify-content:space-between;
  background:rgba(255,255,255,.07);border:2px solid rgba(255,255,255,.1);
  border-radius:12px;padding:9px 14px;gap:8px;
}
.team-name-card .tnc-icon{
  flex-shrink:0;
  width:36px;height:36px;border-radius:50%;
  background:rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;
}
.team-name-card .tnc-label{flex:1;font-weight:800;font-size:.92rem;color:#fff;line-height:1.2;}
.team-name-card .tnc-sub{font-size:.72rem;opacity:.5;margin-top:1px;}
.tnc-roll-btn{
  background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.2);
  color:#fff;border-radius:8px;padding:4px 8px;cursor:pointer;font-size:.75rem;
  font-weight:800;transition:.18s;white-space:nowrap;flex-shrink:0;
  display:flex;align-items:center;gap:4px;
}
.tnc-roll-btn:hover{background:rgba(39,174,122,.2);border-color:var(--col-teal);color:var(--col-teal);}
@keyframes rollBounce{0%{transform:rotate(0)}30%{transform:rotate(-15deg)}60%{transform:rotate(15deg)}100%{transform:rotate(0)}}
.tnc-roll-btn.rolling svg{animation:rollBounce .3s ease;}

/* ══ PANNEAU ÉQUIPES (gauche grille + question) ══ */
#screen-grid{display:none;min-height:100vh;padding:0;}
#screen-grid.active{display:flex;flex-direction:row;align-items:stretch;}
#screen-question{display:none;min-height:100vh;padding:0;transition:background .4s;}
#screen-question.active{display:flex;flex-direction:row;align-items:stretch;}
#screen-question.theme-orange{background:var(--col-orange-bg);}
#screen-question.theme-teal  {background:var(--col-teal-bg);}
#screen-question.theme-purple{background:var(--col-purple-bg);}
#screen-question.theme-red   {background:var(--col-red-bg);}
#screen-question.theme-blue  {background:var(--col-blue-bg);}

.teams-panel{
  width:130px;flex-shrink:0;
  display:flex;flex-direction:column;align-items:center;
  padding:16px 8px 12px;gap:8px;
  background:rgba(0,0,0,.35);
  border-right:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(6px);
  min-height:100vh;
}
.tp-title{font-size:.7rem;font-weight:900;letter-spacing:1px;opacity:.5;text-transform:uppercase;margin-bottom:2px;}
.tp-list{display:flex;flex-direction:column;gap:6px;width:100%;}
.tp-team-item{
  display:flex;flex-direction:column;align-items:center;
  background:rgba(255,255,255,.06);border-radius:10px;
  padding:8px 6px;border-left:4px solid transparent;
  transition:.25s;
}
.tp-team-item.active-team{
  background:rgba(255,255,255,.16);
  transform:scale(1.03);
  box-shadow:0 2px 14px rgba(0,0,0,.5);
}
.tp-team-name{font-weight:900;font-size:.8rem;text-align:center;word-break:break-word;line-height:1.2;margin-bottom:4px;color:rgba(255,255,255,.95);width:100%;}
.tp-team-score{font-weight:900;font-size:1.25rem;color:var(--col-teal);font-variant-numeric:tabular-nums;line-height:1;}
.tp-team-good{font-size:.68rem;opacity:.6;margin-top:2px;}
@keyframes scoreUp{0%{transform:scale(1)}40%{transform:scale(1.4)}100%{transform:scale(1)}}
.score-bump{animation:scoreUp .4s cubic-bezier(.34,1.56,.64,1);}

.tp-turn-label{font-size:.65rem;font-weight:700;opacity:.45;text-transform:uppercase;letter-spacing:.5px;margin-top:8px;}
.tp-current{
  font-family:'Black Han Sans',sans-serif;
  font-size:.9rem;color:var(--col-teal);
  text-align:center;word-break:break-word;
  line-height:1.2;max-width:118px;padding:4px 0;
}
.tp-questions{text-align:center;margin-top:auto;padding-top:8px;}
.tp-q-num{font-weight:900;font-size:1.4rem;color:rgba(255,255,255,.7);}
.tp-q-sub{font-size:.65rem;opacity:.45;}

/* ══ GRILLE ══ */
#screen-grid .main-col{padding:22px 16px;gap:18px;align-items:center;justify-content:center;flex:1;display:flex;flex-direction:column;}
#screen-grid h2{font-family:'Black Han Sans',sans-serif;font-size:clamp(1rem,3vw,1.6rem);color:var(--col-teal);text-align:center;}
.turn-name-inline{color:var(--white);}
.grid-table{width:100%;max-width:900px;border-collapse:separate;border-spacing:7px;table-layout:fixed;}
.grid-table th,.grid-table td{width:20%;}
.grid-table th{padding:9px 5px;font-weight:900;font-size:.7rem;text-align:center;border-radius:10px;color:#fff;letter-spacing:.4px;}
.th-orange{background:var(--col-orange);}
.th-teal{background:var(--col-teal);}
.th-purple{background:var(--col-purple);}
.th-red{background:var(--col-red);}
.th-blue{background:var(--col-blue);}
.grid-table td{text-align:center;padding:3px;}
.cell-btn{width:100%;padding:13px 5px;font-family:'Nunito',sans-serif;font-weight:900;font-size:1.4rem;border:none;border-radius:11px;cursor:pointer;transition:.2s;color:#fff;text-shadow:1px 1px 3px rgba(0,0,0,.3);}
.cell-btn:hover:not(:disabled){transform:scale(1.07);filter:brightness(1.12);}
.cell-btn:disabled{opacity:.35;cursor:default;filter:grayscale(.5);}
.cell-btn.done{background:#2a2a3a !important;color:#555;text-decoration:line-through;}
.cell-btn.done-by{position:relative;}
.cell-team-badge{position:absolute;bottom:3px;right:4px;font-size:.5rem;font-weight:900;background:rgba(0,0,0,.5);padding:1px 4px;border-radius:4px;pointer-events:none;}
.col-orange.val-100{background:#F0A860;} .col-orange.val-200{background:#D88030;} .col-orange.val-300{background:#B86010;} .col-orange.val-400{background:#904200;} .col-orange.val-500{background:#622800;}
.col-teal.val-100{background:#5ADAB0;} .col-teal.val-200{background:#27AE7A;} .col-teal.val-300{background:#107858;} .col-teal.val-400{background:#065438;} .col-teal.val-500{background:#023020;}
.col-purple.val-100{background:#C898E0;} .col-purple.val-200{background:#9B59B6;} .col-purple.val-300{background:#7030A0;} .col-purple.val-400{background:#4E1878;} .col-purple.val-500{background:#300050;}
.col-red.val-100{background:#F09090;} .col-red.val-200{background:#D94F6C;} .col-red.val-300{background:#B02848;} .col-red.val-400{background:#880830;} .col-red.val-500{background:#5A0018;}
.col-blue.val-100{background:#90C0F0;} .col-blue.val-200{background:#5B9BD5;} .col-blue.val-300{background:#2868B0;} .col-blue.val-400{background:#0848A0;} .col-blue.val-500{background:#022870;}

.btn-results-big{background:var(--col-teal);color:#fff;font-weight:900;font-size:1.1rem;border:none;border-radius:50px;padding:14px 42px;cursor:pointer;box-shadow:0 4px 20px rgba(39,174,122,.4);transition:.2s;display:none;align-items:center;gap:10px;}
.btn-results-big:hover{transform:scale(1.05);}

/* ══ QUESTION ══ */
#screen-question .main-col{flex:1;display:flex;flex-direction:column;padding:18px 18px 22px;gap:12px;align-items:center;justify-content:flex-start;}
.q-header{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:820px;}
.pts-badge{font-weight:900;font-size:.95rem;padding:6px 18px;border-radius:50px;min-width:90px;text-align:center;color:#111;}
.cat-label{font-size:.82rem;opacity:.55;text-align:center;font-weight:700;letter-spacing:.5px;flex:1;padding:0 12px;}
.calc-badge{display:flex;align-items:center;gap:7px;background:#fff;border:2.5px solid #f0a000;padding:7px 16px;border-radius:50px;font-size:.85rem;font-weight:900;color:#a06000;box-shadow:0 3px 14px rgba(0,0,0,.35);animation:calcPulse 1.6s ease-in-out infinite;letter-spacing:.2px;}
@keyframes calcPulse{0%,100%{box-shadow:0 3px 14px rgba(0,0,0,.35),0 0 0 0 rgba(39,174,122,.6);}50%{box-shadow:0 3px 14px rgba(0,0,0,.35),0 0 0 7px rgba(39,174,122,0);}}
.timer-zone{display:flex;align-items:center;gap:18px;width:100%;max-width:820px;background:rgba(0,0,0,.25);border-radius:16px;padding:10px 18px;border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(4px);}
.clock-wrap{position:relative;flex-shrink:0;}
#clock-svg{transform:rotate(-90deg);}
#clock-track{fill:none;stroke:rgba(255,255,255,.2);stroke-width:5;}
#clock-arc{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset .95s linear;}
.clock-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;}
.clock-label span{font-weight:900;font-size:1.15rem;color:#fff;font-variant-numeric:tabular-nums;}
.timer-bar-wrap{flex:1;display:flex;flex-direction:column;gap:6px;}
.timer-bar-bg{height:8px;background:rgba(255,255,255,.2);border-radius:6px;overflow:hidden;}
.timer-bar{height:100%;border-radius:6px;background:rgba(255,255,255,.8);transition:width .95s linear;}
.timer-hint{font-size:.78rem;color:rgba(255,255,255,.75);font-weight:700;}
.question-card{background:rgba(0,0,0,.30);border-radius:var(--radius);padding:22px 30px;max-width:820px;width:100%;box-shadow:0 8px 40px rgba(0,0,0,.5);border:1.5px solid rgba(255,255,255,.18);backdrop-filter:blur(6px);}
.question-card p{font-size:clamp(.95rem,2vw,1.1rem);font-weight:700;line-height:1.4;text-align:center;color:#fff;letter-spacing:.01em;text-shadow:0 1px 4px rgba(0,0,0,.4);}
.question-card p .q-sentence{display:block;margin-bottom:.3em;}
.question-card p .q-sentence:last-child{margin-bottom:0;}
.question-card p .q-ask{display:block;font-size:clamp(1rem,2.2vw,1.15rem);font-weight:900;color:#fff;margin-top:.4em;}
.answers-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:820px;width:100%;}
.ans-btn{background:rgba(255,255,255,.18);border:2px solid rgba(255,255,255,.35);color:#fff;font-family:'Nunito',sans-serif;font-weight:800;font-size:1rem;padding:16px 14px;border-radius:14px;cursor:pointer;transition:.18s;text-align:left;line-height:1.4;display:flex;align-items:center;gap:12px;text-shadow:0 1px 2px rgba(0,0,0,.3);min-height:54px;}
.ans-letter{flex-shrink:0;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:900;color:#fff;}
.ans-btn:hover:not(:disabled){background:rgba(255,255,255,.30);border-color:rgba(255,255,255,.7);}
.ans-btn.selected{background:rgba(255,255,255,.38);border-color:#fff;}
.ans-btn.selected .ans-letter{background:rgba(255,255,255,.7);color:#111;}
.ans-btn.correct{background:rgba(76,175,80,.5) !important;border-color:#7ef09a !important;}
.ans-btn.correct .ans-letter{background:#4CAF50;color:#fff;}
.ans-btn.wrong{background:rgba(233,30,60,.35) !important;border-color:#ff9aaa !important;}
.ans-btn.wrong .ans-letter{background:#e91e3c;color:#fff;}
.ans-btn:disabled{cursor:default;}
.feedback-row{display:flex;align-items:center;gap:10px;max-width:820px;width:100%;padding:10px 18px;border-radius:12px;font-weight:800;font-size:1rem;min-height:48px;}
.feedback-row.ok{background:rgba(30,180,80,.4);border:1.5px solid rgba(120,255,160,.6);color:#e0ffe8;}
.feedback-row.ko{background:rgba(200,20,40,.35);border:1.5px solid rgba(255,140,160,.5);color:#ffe0e4;}
.feedback-row.hidden{background:transparent;border-color:transparent;}
.validate-btn{background:rgba(255,255,255,.92);color:#222;font-weight:900;font-size:1.05rem;border:none;border-radius:50px;padding:12px 44px;cursor:pointer;transition:.2s;box-shadow:0 4px 18px rgba(0,0,0,.3);display:flex;align-items:center;gap:8px;}
.validate-btn:hover:not(:disabled){background:#fff;transform:scale(1.03);}
.validate-btn:disabled{opacity:.38;cursor:default;}

/* retour auto */
.auto-return{position:fixed;bottom:24px;right:24px;z-index:999;display:flex;align-items:center;gap:12px;padding:12px 18px;border-radius:50px;background:rgba(10,10,20,.82);border:1.5px solid rgba(255,255,255,.22);backdrop-filter:blur(10px);box-shadow:0 6px 28px rgba(0,0,0,.5);font-weight:800;font-size:.92rem;color:#fff;max-width:380px;animation:slideInRight .3s cubic-bezier(.34,1.56,.64,1);}
@keyframes slideInRight{from{transform:translateX(60px);opacity:0}to{transform:translateX(0);opacity:1}}
.auto-return.hidden{display:none !important;}
.return-wheel{flex-shrink:0;position:relative;width:44px;height:44px;}
.return-wheel svg{transform:rotate(-90deg);}
.wheel-track{fill:none;stroke:rgba(255,255,255,.2);stroke-width:4;}
.wheel-arc{fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round;transition:stroke-dashoffset .9s linear;}
.return-wheel-num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1rem;color:#fff;}
.auto-return-text{flex:1;opacity:.9;font-size:.9rem;}
.cancel-return{background:rgba(255,255,255,.15);border:1.5px solid rgba(255,255,255,.3);color:#fff;font-family:'Nunito',sans-serif;font-weight:800;font-size:.8rem;padding:5px 14px;border-radius:50px;cursor:pointer;transition:.18s;white-space:nowrap;}
.cancel-return:hover{background:rgba(255,255,255,.25);}
.go-return{background:rgba(255,255,255,.92);color:#222;font-family:'Nunito',sans-serif;font-weight:900;font-size:.88rem;border:none;border-radius:50px;padding:8px 22px;cursor:pointer;transition:.18s;display:flex;align-items:center;gap:6px;white-space:nowrap;}
.go-return:hover{background:#fff;transform:scale(1.03);}
.auto-return.stayed .return-wheel{display:none;}
.auto-return.stayed .cancel-return{display:none;}

/* ══ CLASSEMENT FINAL ══ */
#screen-results{background:radial-gradient(ellipse at 50% 0%,#0d2a20 0%,var(--bg) 65%);padding:28px 16px;gap:20px;text-align:center;}
#screen-results h2{font-family:'Black Han Sans',sans-serif;font-size:clamp(1.4rem,5vw,2.4rem);color:var(--col-teal);display:flex;align-items:center;gap:10px;justify-content:center;}

.podium{display:flex;align-items:flex-end;justify-content:center;gap:16px;width:100%;max-width:660px;padding:0 20px;}
.podium-step{display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;}
.podium-name{font-family:'Black Han Sans',sans-serif;font-size:.9rem;text-align:center;word-break:break-word;}
.podium-score{font-weight:900;font-size:1.1rem;color:var(--col-teal);}
.podium-block{width:100%;border-radius:10px 10px 0 0;display:flex;align-items:center;justify-content:center;font-family:'Black Han Sans',sans-serif;font-size:2rem;color:rgba(255,255,255,.5);}
.podium-step:nth-child(1) .podium-block{height:120px;background:linear-gradient(135deg,#c49000,#ffd740);}
.podium-step:nth-child(2) .podium-block{height:90px;background:linear-gradient(135deg,#607080,#9ab0c0);}
.podium-step:nth-child(3) .podium-block{height:70px;background:linear-gradient(135deg,#7a4010,#c07040);}
.podium-step:nth-child(4) .podium-block{height:55px;background:rgba(255,255,255,.1);}
.podium-step:nth-child(5) .podium-block{height:45px;background:rgba(255,255,255,.08);}
.podium-step:nth-child(6) .podium-block{height:38px;background:rgba(255,255,255,.06);}
.podium-step:nth-child(1) .podium-name{font-size:1.05rem;color:#ffd740;}
.podium-step:nth-child(2) .podium-name{color:#9ab0c0;}
.podium-step:nth-child(3) .podium-name{color:#c07040;}

.teams-detail{width:100%;max-width:700px;display:flex;flex-direction:column;gap:10px;}
.team-result-card{background:var(--card);border-radius:14px;padding:14px 20px;display:flex;align-items:center;gap:16px;border-left:5px solid transparent;}
.tr-rank{font-family:'Black Han Sans',sans-serif;font-size:1.5rem;opacity:.4;min-width:28px;}
.tr-name{font-weight:900;font-size:1.05rem;flex:1;}
.tr-score{font-weight:900;font-size:1.3rem;color:var(--col-teal);}
.tr-stats{font-size:.8rem;opacity:.6;margin-top:2px;}

.btn-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;}
.btn-print{background:var(--bleu);color:#fff;font-weight:900;font-size:.98rem;border:none;border-radius:50px;padding:12px 36px;cursor:pointer;transition:.2s;display:flex;align-items:center;gap:8px;}
.btn-print:hover{background:#4a78e0;}
.btn-retry{background:rgba(255,255,255,.09);color:#fff;font-weight:700;font-size:.98rem;border:2px solid rgba(255,255,255,.2);border-radius:50px;padding:12px 36px;cursor:pointer;transition:.2s;display:flex;align-items:center;gap:8px;}
.btn-retry:hover{background:rgba(255,255,255,.14);}

/* ══ IMPRESSION ══ */
@media print{
  body{background:#fff;color:#111;}
  .screen{display:none !important;}
  #print-zone{display:block !important;}
  @page{size:A4 portrait;margin:14mm 12mm;}
}
#print-zone{display:none;font-family:'Nunito',sans-serif;}
.pz-header{text-align:center;margin-bottom:12px;}
.pz-header h1{font-size:16px;color:#0d5c3a;}
.pz-header p{font-size:10px;color:#555;margin-top:2px;}
.pz-section-title{font-size:11px;font-weight:800;color:#0d5c3a;margin-bottom:8px;padding-bottom:3px;border-bottom:2px solid #eee;}
.pz-rank-item{padding:8px 12px;margin-bottom:6px;border-radius:6px;font-size:11px;border-left:4px solid #ccc;}
.pz-rank-item:nth-child(1){border-left-color:#ffd740;background:#f9fbe7;}
.pz-rank-item:nth-child(2){border-left-color:#9ab0c0;background:#f0f4f8;}
.pz-rank-item:nth-child(3){border-left-color:#c07040;background:#fff5ee;}
.pz-footer{text-align:center;margin-top:16px;font-size:9px;color:#aaa;}

.site-footer{width:100%;text-align:center;padding:10px 20px;font-size:.72rem;color:rgba(255,255,255,.3);font-weight:600;letter-spacing:.4px;font-style:italic;flex-shrink:0;}
#screen-question .site-footer{color:rgba(255,255,255,.45);}

.hidden{display:none !important;}
@keyframes popIn{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}
.pop{animation:popIn .28s cubic-bezier(.34,1.56,.64,1);}
@keyframes floatUp{0%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-60px) scale(.8)}}
.score-particle{position:fixed;pointer-events:none;font-family:'Nunito',sans-serif;font-weight:900;font-size:1.1rem;color:var(--col-teal);text-shadow:0 2px 8px rgba(0,0,0,.5);animation:floatUp .9s ease-out forwards;z-index:9999;}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}