/* V635 — Guides compact dans toutes les langues; ouverture geree au survol desktop */
#nav-panel-guides.nav-guides-visual-v630[hidden]{
  display:none!important;
}
#nav-panel-guides.nav-guides-visual-v630{
  display:flex!important;
  flex-direction:column!important;
  gap:4px!important;
  width:min(440px,calc(100vw - 24px))!important;
  min-width:0!important;
  padding:10px!important;
  max-height:min(680px,calc(100vh - 96px))!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(9,24,46,.985),rgba(8,19,37,.985))!important;
  border:1px solid rgba(69,137,220,.38)!important;
  box-shadow:0 24px 64px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
#nav-panel-guides.nav-guides-visual-v630::before{
  background:#0a1a31!important;
  border-color:rgba(69,137,220,.38)!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  min-height:62px!important;
  height:auto!important;
  aspect-ratio:auto!important;
  padding:6px 9px!important;
  border-radius:12px!important;
  overflow:hidden!important;
  border:1px solid transparent!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  transform:none!important;
  text-decoration:none!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:first-child{
  min-height:70px!important;
  margin-bottom:2px!important;
  background:linear-gradient(90deg,rgba(23,57,91,.68),rgba(11,31,56,.42))!important;
  border-color:rgba(68,139,203,.22)!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:hover,
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:focus-visible{
  transform:none!important;
  filter:none!important;
  background:linear-gradient(90deg,rgba(30,75,124,.52),rgba(12,34,62,.36))!important;
  border-color:rgba(71,154,255,.42)!important;
  outline:none!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item::after{
  content:'›'!important;
  display:block!important;
  position:absolute!important;
  right:12px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  color:rgba(154,183,220,.34)!important;
  font-size:30px!important;
  font-weight:300!important;
  line-height:1!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:first-child::after{display:none!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-icon{
  display:grid!important;
  place-items:center!important;
  flex:0 0 92px!important;
  width:92px!important;
  height:52px!important;
  border-radius:10px!important;
  overflow:hidden!important;
  border:1px solid rgba(72,142,255,.25)!important;
  background-color:#0b1b30!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  color:transparent!important;
  font-size:0!important;
  opacity:1!important;
  pointer-events:none!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02)!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:first-child .nav-panel-icon{
  flex-basis:52px!important;
  width:52px!important;
  height:52px!important;
  color:initial!important;
  font-size:25px!important;
  background:linear-gradient(145deg,rgba(14,165,233,.13),rgba(45,212,191,.08))!important;
  border-color:rgba(45,212,191,.20)!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-copy{
  display:flex!important;
  flex:1 1 auto!important;
  min-width:0!important;
  flex-direction:column!important;
  justify-content:center!important;
  line-height:1.15!important;
  opacity:1!important;
  pointer-events:none!important;
  padding-right:24px!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-copy strong{
  display:block!important;
  color:#eef4ff!important;
  font-size:15px!important;
  font-weight:800!important;
  line-height:1.2!important;
  white-space:normal!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-copy>span{
  display:block!important;
  color:#9aaccc!important;
  font-size:12px!important;
  line-height:1.25!important;
  margin-top:3px!important;
  white-space:normal!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:first-child .nav-panel-copy strong{font-size:16px!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:first-child .nav-panel-copy>span{font-size:12px!important}

#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:nth-child(2) .nav-panel-icon{background-image:url('../img/nav-guides-v634/fr/alphabet.webp')!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:nth-child(3) .nav-panel-icon{background-image:url('../img/nav-guides-v634/fr/hello.webp')!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:nth-child(4) .nav-panel-icon{background-image:url('../img/nav-guides-v634/fr/thankyou.webp')!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:nth-child(5) .nav-panel-icon{background-image:url('../img/nav-guides-v634/fr/counting.webp')!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:nth-child(6) .nav-panel-icon{background-image:url('../img/nav-guides-v634/fr/introduce.webp')!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:nth-child(7) .nav-panel-icon{background-image:url('../img/nav-guides-v634/fr/travel.webp')!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:nth-child(8) .nav-panel-icon{background-image:url('../img/nav-guides-v634/fr/pronunciation.webp')!important}
#nav-panel-guides.nav-guides-visual-v630 .nav-panel-item:nth-child(9) .nav-panel-icon{background-image:url('../img/nav-guides-v634/fr/verbs.webp')!important}

@media (max-width:1049px){
  #nav-panel-guides.nav-guides-visual-v630{
    width:auto!important;
    max-height:none!important;
    overflow:visible!important;
    padding:6px 0 10px!important;
    gap:3px!important;
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
  }
  #nav-panel-guides.nav-guides-visual-v630 .nav-panel-item{min-height:58px!important;padding:5px 7px!important}
  #nav-panel-guides.nav-guides-visual-v630 .nav-panel-icon{flex-basis:78px!important;width:78px!important;height:46px!important}
  #nav-panel-guides.nav-guides-visual-v630 .nav-panel-copy strong{font-size:14px!important}
  #nav-panel-guides.nav-guides-visual-v630 .nav-panel-copy>span{font-size:11px!important}
}
@media (max-width:560px){
  #nav-panel-guides.nav-guides-visual-v630 .nav-panel-icon{flex-basis:68px!important;width:68px!important;height:42px!important}
  #nav-panel-guides.nav-guides-visual-v630 .nav-panel-item{gap:8px!important;padding-left:4px!important;padding-right:4px!important}
  #nav-panel-guides.nav-guides-visual-v630 .nav-panel-copy{padding-right:18px!important}
}