/*
 * ============================================================
 * MAGIQUE CREATION — QUIZ UI FINALISATION
 * ============================================================
 */


/*
 * PLEIN ECRAN
 */

.mc-quiz-fullscreen{
  flex:0 0 46px;
  order:-100;
  width:46px;
  min-width:46px;
  height:42px;
  margin:0 12px 0 0;
  padding:0;
  border:1px solid rgba(147,126,210,.45);
  border-radius:12px;
  background:
    linear-gradient(
      145deg,
      rgba(50,45,70,.98),
      rgba(27,27,36,.98)
    );
  color:#f7f5ff;
  font-size:23px;
  line-height:1;
  font-weight:800;
  cursor:pointer;
  box-shadow:
    0 8px 20px rgba(0,0,0,.17);
  transition:
    transform .15s ease,
    border-color .15s ease,
    background .15s ease;
}

.mc-quiz-fullscreen:hover{
  transform:translateY(-1px);
  border-color:rgba(103,219,255,.75);
}

.mc-quiz-fullscreen:focus-visible{
  outline:3px solid rgba(103,219,255,.35);
  outline-offset:2px;
}

.mc-quiz-fullscreen.active{
  border-color:rgba(255,194,73,.75);
}

#quiz-game .quiz-abandon,
#quiz-multi-game .quiz-abandon,
#quiz-abandon,
#quiz-multi-abandon{
  margin-left:auto;
}

.quiz-game:fullscreen,
.quiz-game:-webkit-full-screen,
.quiz-game.mc-quiz-immersive{
  width:100vw !important;
  max-width:none !important;
  height:100dvh !important;
  max-height:none !important;
  margin:0 !important;
  border-radius:0 !important;
  overflow:auto !important;
  background:#101117 !important;
  padding:
    env(safe-area-inset-top, 0)
    env(safe-area-inset-right, 0)
    env(safe-area-inset-bottom, 0)
    env(safe-area-inset-left, 0);
}

.quiz-game.mc-quiz-immersive{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483000 !important;
}

html.mc-quiz-immersive-document,
body.mc-quiz-immersive-body{
  overflow:hidden !important;
}

.quiz-game:fullscreen .quiz-game-top,
.quiz-game:-webkit-full-screen .quiz-game-top,
.quiz-game.mc-quiz-immersive .quiz-game-top{
  position:sticky;
  top:0;
  z-index:20;
  background:#171821;
}

.quiz-game:fullscreen .quiz-stage,
.quiz-game:-webkit-full-screen .quiz-stage,
.quiz-game.mc-quiz-immersive .quiz-stage{
  min-height:calc(100dvh - 70px);
}

.quiz-game:fullscreen .quiz-media img,
.quiz-game:fullscreen .quiz-media video,
.quiz-game.mc-quiz-immersive .quiz-media img,
.quiz-game.mc-quiz-immersive .quiz-media video{
  max-height:calc(100dvh - 110px);
  object-fit:contain;
}


/*
 * TOGGLES PREMIUM
 */

.mc-toggle-card{
  position:relative;
  display:grid !important;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:12px;
  min-height:62px;
  margin:0 !important;
  padding:11px 13px !important;
  border:1px solid rgba(152,144,180,.22);
  border-radius:14px;
  background:
    linear-gradient(
      145deg,
      rgba(38,38,49,.86),
      rgba(28,29,38,.86)
    );
  cursor:pointer;
  transition:
    border-color .16s ease,
    background .16s ease,
    transform .16s ease;
}

.mc-toggle-card:hover{
  border-color:rgba(137,211,239,.42);
  transform:translateY(-1px);
}

.mc-toggle-input{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.mc-toggle-track{
  position:relative;
  display:block;
  width:40px;
  height:22px;
  border:1px solid rgba(190,190,210,.32);
  border-radius:999px;
  background:rgba(14,15,21,.86);
  transition:.18s ease;
}

.mc-toggle-thumb{
  position:absolute;
  width:16px;
  height:16px;
  left:2px;
  top:2px;
  border-radius:50%;
  background:#a7a7b1;
  box-shadow:0 2px 7px rgba(0,0,0,.35);
  transition:.18s ease;
}

.mc-toggle-input:checked + .mc-toggle-track{
  border-color:rgba(91,216,246,.70);
  background:
    linear-gradient(
      90deg,
      rgba(53,157,193,.90),
      rgba(103,91,204,.90)
    );
}

.mc-toggle-input:checked
+ .mc-toggle-track
.mc-toggle-thumb{
  left:20px;
  background:#fff;
}

.mc-toggle-input:focus-visible
+ .mc-toggle-track{
  outline:3px solid rgba(90,210,244,.25);
  outline-offset:3px;
}

.mc-toggle-copy{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:3px;
}

.mc-toggle-copy strong{
  color:#f6f5fa;
  font-size:13px;
  line-height:1.25;
}

.mc-toggle-copy small{
  color:#a9a8b6;
  font-size:11px;
  line-height:1.35;
}


/*
 * PREFERENCES PARTIE RAPIDE
 */

.mc-preference-zone{
  position:relative;
}

.mc-quick-pref-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:48px;
  height:28px;
  margin:8px 0 12px;
  padding:0 10px;
  border:1px solid rgba(255,192,58,.42);
  border-radius:999px;
  color:#ffc34b;
  background:rgba(255,183,30,.08);
  font-size:12px;
  font-weight:800;
}

.mc-quick-pref-grid{
  display:grid;
  grid-template-columns:
    repeat(3,minmax(0,1fr));
  gap:10px;
}

[data-quick-pref-pack].mc-quick-pref-card{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-height:72px;
  width:100%;
  padding:14px 46px 14px 15px;
  border:1px solid rgba(153,146,181,.28);
  border-radius:15px;
  color:#f5f3f8;
  text-align:left;
  background:
    linear-gradient(
      145deg,
      rgba(42,42,54,.92),
      rgba(29,30,39,.95)
    );
  box-shadow:
    0 8px 22px rgba(0,0,0,.09);
  cursor:pointer;
  transition:
    transform .15s ease,
    border-color .15s ease,
    box-shadow .15s ease;
}

[data-quick-pref-pack].mc-quick-pref-card:hover{
  transform:translateY(-1px);
  border-color:rgba(113,207,239,.55);
}

[data-quick-pref-pack].mc-quick-pref-card.selected,
[data-quick-pref-pack].mc-quick-pref-card[aria-pressed="true"]{
  border-color:rgba(255,190,58,.88);
  box-shadow:
    0 0 0 2px rgba(255,190,58,.10),
    0 12px 28px rgba(0,0,0,.17);
  background:
    linear-gradient(
      145deg,
      rgba(64,55,83,.98),
      rgba(38,37,53,.98)
    );
}

.quiz-quick-pref-rank{
  position:absolute;
  top:50%;
  right:12px;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:50%;
  border:1px solid rgba(255,194,73,.65);
  color:#121217;
  background:#ffc249;
  font-size:12px;
  font-weight:900;
}


/*
 * CREATION SALON
 */

.mc-salon-finalise{
  display:flex;
  flex-direction:column;
}

.mc-salon-finalise
.quiz-switch-row{
  display:grid;
  grid-template-columns:
    repeat(2,minmax(0,1fr));
  gap:10px;
}


/*
 * RESPONSIVE
 */

@media (max-width:900px){
  .mc-quick-pref-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }
}

@media (max-width:640px){
  .mc-quick-pref-grid{
    grid-template-columns:1fr;
  }

  .mc-salon-finalise
  .quiz-switch-row{
    grid-template-columns:1fr;
  }

  .mc-quiz-fullscreen{
    width:42px;
    min-width:42px;
    height:40px;
    margin-right:7px;
    border-radius:10px;
    font-size:21px;
  }

  .quiz-game:fullscreen .quiz-stage,
  .quiz-game:-webkit-full-screen .quiz-stage,
  .quiz-game.mc-quiz-immersive .quiz-stage{
    min-height:0;
  }
}

/* MC_QUIZ_POLISH_V2_BEGIN */


/* ============================================================
   1. HUD — GRAND ECRAN
   ============================================================ */

.quiz-game
.quiz-game-top.mc-game-top-v2{
  display:grid !important;

  grid-template-columns:
    minmax(120px,1fr)
    minmax(120px,1fr)
    minmax(120px,1fr)
    auto !important;

  grid-template-areas:
    "question score third quit";

  align-items:stretch !important;

  gap:0 !important;

  width:100% !important;

  min-width:0 !important;

  padding:0 !important;
}


.mc-game-fullscreen-v2{
  position:absolute !important;
  left:12px !important;
  bottom:12px !important;
  z-index:6 !important;

  width:44px !important;
  min-width:44px !important;
  height:44px !important;

  margin:0 !important;
  padding:0 !important;

  border:1px solid rgba(255,255,255,.28) !important;
  border-radius:12px !important;
  background:rgba(7,8,12,.78) !important;
  color:#fff !important;
  backdrop-filter:blur(12px);
  box-shadow:0 8px 24px rgba(0,0,0,.28) !important;
}

.quiz-game .quiz-media-kind{
  left:auto !important;
  right:14px !important;
}


.mc-game-stat-v2{
  min-width:0 !important;

  margin:0 !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  gap:7px !important;

  padding:
    12px
    clamp(10px,1.7vw,20px)
    !important;

  text-align:center !important;
}


.mc-game-stat-1{
  grid-area:question !important;
}

.mc-game-stat-2{
  grid-area:score !important;
}

.mc-game-stat-3{
  grid-area:third !important;
}


.mc-game-quit-v2{
  grid-area:quit !important;

  align-self:center !important;
  justify-self:end !important;

  width:auto !important;

  min-width:max-content !important;

  min-height:38px !important;

  margin:
    0
    11px
    0
    10px
    !important;

  padding:
    8px
    14px
    !important;

  border:
    1px solid
    rgba(177,158,220,.48)
    !important;

  border-radius:
    11px
    !important;

  background:
    rgba(94,77,130,.18)
    !important;

  color:
    #f7f4ec
    !important;

  box-shadow:
    none
    !important;

  white-space:
    nowrap
    !important;

  font-weight:
    800
    !important;
}


.mc-game-quit-v2:hover{
  border-color:
    rgba(207,190,250,.72)
    !important;

  background:
    rgba(116,94,157,.27)
    !important;
}


/* ============================================================
   2. HUD — PETIT ECRAN
   ============================================================ */

@media(max-width:720px){

  .quiz-game
  .quiz-game-top.mc-game-top-v2{

    grid-template-columns:
      minmax(70px,1fr)
      minmax(62px,.82fr)
      minmax(72px,.9fr)
      minmax(88px,auto)
      !important;

    grid-template-areas:
      "question score third quit";

    border-bottom:
      1px solid
      rgba(255,255,255,.10);
  }


  .mc-game-stat-v2{
    min-height:
      54px
      !important;

    flex-direction:column !important;
    gap:2px !important;

    padding:
      7px
      3px
      !important;
  }


  .mc-game-stat-3{
    border-top:0 !important;
  }


  .mc-game-quit-v2{
    align-self:
      stretch
      !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    margin:
      5px
      6px
      5px
      5px
      !important;

    min-width:
      88px
      !important;
  }
}


@media(max-width:440px){

  .quiz-game
  .quiz-game-top.mc-game-top-v2{

    grid-template-columns:
      minmax(66px,1fr)
      minmax(52px,.75fr)
      minmax(62px,.85fr)
      88px
      !important;
  }


  .mc-game-stat-v2{
    font-size:
      .72rem
      !important;
  }


  .mc-game-quit-v2{
    min-width:
      86px
      !important;

    padding:
      7px
      9px
      !important;

    font-size:
      .72rem
      !important;
  }
}


/* ============================================================
   3. RESULTAT SOLO
   ============================================================ */

#quiz-result.mc-result-v2{
  position:
    relative
    !important;

  width:
    min(820px,100%)
    !important;

  max-width:
    820px
    !important;

  margin:
    22px
    auto
    !important;

  padding:
    clamp(30px,4vw,44px)
    !important;

  border:
    1px solid
    rgba(255,255,255,.15)
    !important;

  border-radius:
    24px
    !important;

  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(106,72,174,.10),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #1c1d25,
      #121319
    )
    !important;

  box-shadow:
    0 24px 70px
    rgba(0,0,0,.22)
    !important;

  text-align:
    center
    !important;
}


/*
 * Croix résultat
 */

.mc-result-close-v2{
  position:
    absolute
    !important;

  top:
    14px
    !important;

  right:
    14px
    !important;

  z-index:
    5
    !important;

  display:grid !important;
  place-items:center !important;

  width:
    40px
    !important;

  min-width:
    40px
    !important;

  height:
    40px
    !important;

  min-height:
    40px
    !important;

  padding:
    0
    !important;

  border:
    1px solid
    rgba(255,255,255,.16)
    !important;

  border-radius:
    12px
    !important;

  background:
    rgba(255,255,255,.045)
    !important;

  color:
    #f7f4ec
    !important;

  box-shadow:
    none
    !important;

  font-size:
    1.55rem
    !important;

  font-weight:
    400
    !important;

  line-height:
    1
    !important;
}


.mc-result-close-v2:hover{
  background:
    rgba(255,255,255,.09)
    !important;

  border-color:
    rgba(255,255,255,.28)
    !important;
}


/*
 * Deux cartes résultat.
 */

#quiz-result
.quiz-result-actions.mc-result-actions-v2{
  display:grid !important;

  grid-template-columns:
    repeat(2,minmax(0,1fr))
    !important;

  gap:
    10px
    !important;

  width:
    min(650px,100%)
    !important;

  margin:
    20px
    auto
    0
    !important;
}


/* ============================================================
   4. CARTE ACTION — LANGAGE VISUEL ACCUEIL
   ============================================================ */

.mc-home-action-card-v2,
#quiz-quick-start.mc-quick-launch-v2{

  appearance:
    none
    !important;

  display:grid !important;

  grid-template-columns:
    32px
    minmax(0,1fr)
    !important;

  align-items:
    center
    !important;

  gap:
    11px
    !important;

  width:
    100%
    !important;

  min-height:
    68px
    !important;

  margin:
    0
    !important;

  padding:
    12px
    14px
    !important;

  border:
    1px solid
    rgba(255,255,255,.17)
    !important;

  border-radius:
    14px
    !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.065),
      rgba(255,255,255,.026)
    )
    !important;

  color:
    #f7f4ec
    !important;

  box-shadow:
    none
    !important;

  text-align:
    left
    !important;

  text-decoration:
    none
    !important;

  cursor:
    pointer
    !important;

  transition:
    border-color .16s ease,
    background .16s ease,
    transform .16s ease
    !important;
}


.mc-home-action-card-v2:hover,
#quiz-quick-start.mc-quick-launch-v2:hover{

  transform:
    translateY(-1px)
    !important;

  border-color:
    rgba(176,151,235,.62)
    !important;

  background:
    linear-gradient(
      145deg,
      rgba(113,83,173,.13),
      rgba(255,255,255,.035)
    )
    !important;
}


.mc-home-action-icon-v2{
  display:grid;

  place-items:center;

  width:
    30px;

  height:
    30px;

  border:
    1px solid
    rgba(242,184,75,.26);

  border-radius:
    9px;

  background:
    rgba(242,184,75,.055);

  color:
    #f2b84b;

  font-size:
    1rem;

  font-weight:
    900;
}


.mc-home-action-copy-v2{
  display:flex;

  min-width:0;

  flex-direction:column;

  gap:3px;
}


.mc-home-action-copy-v2 strong{
  color:
    #f7f4ec;

  font-size:
    .90rem;

  line-height:
    1.2;

  font-weight:
    850;
}


.mc-home-action-copy-v2 small{
  color:
    #9f9ba9;

  font-size:
    .70rem;

  line-height:
    1.25;

  font-weight:
    500;
}


/* ============================================================
   5. PARTIE RAPIDE — CONTENEUR
   ============================================================ */

#quiz-quick-form.mc-quick-form-v2{
  width:
    min(920px,100%)
    !important;

  margin:
    0
    auto
    !important;

  padding:
    20px
    !important;

  gap:
    13px
    !important;

  border:
    1px solid
    rgba(255,255,255,.14)
    !important;

  border-radius:
    22px
    !important;

  background:
    linear-gradient(
      145deg,
      rgba(29,30,39,.97),
      rgba(18,19,26,.98)
    )
    !important;

  box-shadow:
    0 18px 50px
    rgba(0,0,0,.18)
    !important;
}


/*
 * Header propre et compact.
 */

#quiz-quick-form
.mc-quick-heading-v2{
  margin:
    0
    !important;

  padding:
    0
    0
    13px
    !important;

  border-bottom:
    1px solid
    rgba(255,255,255,.10)
    !important;
}


/*
 * Règle compte.
 */

#quiz-quick-account-rule.mc-quick-account-v2{
  margin:
    0
    !important;

  padding:
    11px
    13px
    !important;

  border:
    1px solid
    rgba(255,255,255,.13)
    !important;

  border-radius:
    12px
    !important;

  background:
    rgba(255,255,255,.028)
    !important;

  color:
    #c5c1cc
    !important;

  font-size:
    .76rem
    !important;

  line-height:
    1.45
    !important;
}


/*
 * Résumé V4.
 */

#quiz-quick-form
.mc-quick-summary-v2{
  margin:
    0
    !important;

  padding:
    11px
    13px
    !important;

  border:
    1px solid
    rgba(145,118,205,.24)
    !important;

  border-radius:
    12px
    !important;

  background:
    rgba(105,82,157,.07)
    !important;

  color:
    #d7d2df
    !important;

  line-height:
    1.4
    !important;
}


/*
 * Contribution.
 */

#quiz-quick-form
.mc-quick-contribution-v2{
  display:grid !important;

  gap:
    7px
    !important;

  margin:
    0
    !important;
}


#quiz-quick-form
#quiz-quick-contribution{
  width:
    100%
    !important;

  min-height:
    44px
    !important;

  padding:
    9px
    12px
    !important;

  border:
    1px solid
    rgba(174,157,217,.42)
    !important;

  border-radius:
    11px
    !important;

  background:
    #111219
    !important;

  color:
    #f7f4ec
    !important;

  box-shadow:
    none
    !important;
}


/* ============================================================
   6. PARTIE RAPIDE — PREFERENCES
   ============================================================ */

/*
 * Ancienne grosse barre violette.
 */

#quiz-quick-form
.mc-quick-pref-title-v2{

  width:
    max-content
    !important;

  min-height:
    auto
    !important;

  margin:
    2px
    0
    0
    !important;

  padding:
    0
    !important;

  border:
    0
    !important;

  border-radius:
    0
    !important;

  background:
    transparent
    !important;

  color:
    #f7f4ec
    !important;

  box-shadow:
    none
    !important;

  font-size:
    .83rem
    !important;

  font-weight:
    850
    !important;

  text-align:
    left
    !important;
}


/*
 * Résumé + 0/3.
 */

.mc-quick-pref-meta-v2{
  display:flex;

  align-items:center;

  justify-content:
    space-between;

  gap:
    12px;

  min-height:
    38px;

  padding:
    8px
    11px;

  border:
    1px solid
    rgba(255,255,255,.10);

  border-radius:
    11px;

  background:
    rgba(255,255,255,.024);
}


#quiz-quick-preferences-summary.mc-quick-pref-summary-v2{
  min-width:
    0;

  margin:
    0
    !important;

  color:
    #bdb9c5
    !important;

  font-size:
    .76rem
    !important;

  line-height:
    1.3
    !important;
}


#mc-quick-pref-count.mc-quick-pref-count-v2{
  flex:
    0 0 auto;

  display:inline-flex !important;

  align-items:center !important;
  justify-content:center !important;

  width:
    auto
    !important;

  min-width:
    48px
    !important;

  height:
    25px
    !important;

  margin:
    0
    !important;

  padding:
    0
    9px
    !important;

  border:
    1px solid
    rgba(242,184,75,.34)
    !important;

  border-radius:
    999px
    !important;

  background:
    rgba(242,184,75,.045)
    !important;

  color:
    #e8b95f
    !important;

  font-size:
    .70rem
    !important;

  font-weight:
    900
    !important;
}


/*
 * Texte d'aide.
 */

#quiz-quick-form
.mc-quick-help-v2{
  margin:
    0
    !important;

  color:
    #8f8b99
    !important;

  font-size:
    .70rem
    !important;

  line-height:
    1.4
    !important;
}


/*
 * Univers / préférences.
 */

#quiz-quick-packs.mc-quick-packs-v2{
  display:grid !important;

  grid-template-columns:
    repeat(3,minmax(0,1fr))
    !important;

  gap:
    9px
    !important;

  margin:
    0
    !important;
}


#quiz-quick-form
[data-quick-pref-pack].mc-quick-pref-card-v2{

  min-height:
    58px
    !important;

  width:
    100%
    !important;

  margin:
    0
    !important;

  padding:
    11px
    40px
    11px
    13px
    !important;

  border:
    1px solid
    rgba(255,255,255,.15)
    !important;

  border-radius:
    13px
    !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.055),
      rgba(255,255,255,.025)
    )
    !important;

  color:
    #f7f4ec
    !important;

  box-shadow:
    none
    !important;

  text-align:
    left
    !important;
}


#quiz-quick-form
[data-quick-pref-pack].mc-quick-pref-card-v2:hover{

  border-color:
    rgba(170,146,225,.55)
    !important;

  background:
    rgba(112,84,166,.10)
    !important;
}


#quiz-quick-form
[data-quick-pref-pack].mc-quick-pref-card-v2.selected,

#quiz-quick-form
[data-quick-pref-pack].mc-quick-pref-card-v2[aria-pressed="true"]{

  border-color:
    rgba(242,184,75,.58)
    !important;

  background:
    linear-gradient(
      145deg,
      rgba(121,91,175,.15),
      rgba(242,184,75,.035)
    )
    !important;
}


/* ============================================================
   7. CTA PARTIE RAPIDE
   ============================================================ */

#quiz-quick-start.mc-quick-launch-v2{

  margin-top:
    3px
    !important;

  min-height:
    64px
    !important;

  border-color:
    rgba(174,150,226,.37)
    !important;
}


/* ============================================================
   8. RESPONSIVE PARTIE RAPIDE / RESULTAT
   ============================================================ */

@media(max-width:760px){

  #quiz-result
  .quiz-result-actions.mc-result-actions-v2{
    grid-template-columns:
      1fr
      !important;
  }


  #quiz-quick-form.mc-quick-form-v2{
    padding:
      16px
      !important;
  }


  #quiz-quick-packs.mc-quick-packs-v2{
    grid-template-columns:
      repeat(2,minmax(0,1fr))
      !important;
  }
}


@media(max-width:500px){

  #quiz-result.mc-result-v2{
    width:
      100%
      !important;

    padding:
      25px
      15px
      18px
      !important;

    border-radius:
      18px
      !important;
  }


  .mc-result-close-v2{
    top:
      9px
      !important;

    right:
      9px
      !important;

    width:
      36px
      !important;

    min-width:
      36px
      !important;

    height:
      36px
      !important;

    min-height:
      36px
      !important;
  }


  #quiz-quick-form.mc-quick-form-v2{
    padding:
      13px
      !important;

    gap:
      11px
      !important;

    border-radius:
      17px
      !important;
  }


  #quiz-quick-packs.mc-quick-packs-v2{
    grid-template-columns:
      1fr
      !important;
  }


  .mc-home-action-card-v2,
  #quiz-quick-start.mc-quick-launch-v2{
    min-height:
      62px
      !important;
  }
}


/* MC_QUIZ_POLISH_V2_END */