/* Fluence V2: animated floating dock adapted from the supplied
   "Menu animation (Community)" SVG. Real accessible HTML navigation. */
@property --dock-cutout-x {
  syntax:'<percentage>';
  inherits:true;
  initial-value:10%;
}
.fluence-v5 {
  --fluence-nav-ink:#141018;
  --fluence-nav-lilac:#e6d0f4;
  --fluence-nav-paper:#fff;
  --fluence-nav-outline:#161018;
}
.fluence-v5 .v4-topbar {
  background:#141018!important;
  background-image:none!important;
  color:#fff!important;
  border-bottom:1px solid #141018!important;
}
.fluence-v5 .v4-brand,
.fluence-v5 .v4-brand>strong {color:#fff!important}
.fluence-v5 .v4-brand>span {
  background:#fff!important;
  color:#141018!important;
  border-radius:10px!important;
}
@media (min-width:901px) {
  .fluence-v5 .v4-shell {display:block!important;min-width:0}
  .fluence-v5 nav.v4-nav.fluence-dock {
    display:grid!important;
    position:sticky!important;
    top:79px!important;
    z-index:35!important;
    margin:26px auto 0!important;
    width:min(520px,calc(100% - 40px))!important;
    max-width:520px!important;
  }
  .fluence-v5 nav.v4-nav.fluence-dock>:is([data-open-lya],[data-open-settings],.v4-nav-spacer) {
    display:none!important;
  }
  .fluence-v5 .v4-main {width:100%!important;min-width:0!important;box-sizing:border-box!important}
}
/* One continuous white surface. Its upper circular notch reveals the
   real lilac page background; no extra card behind navigation items. */
.fluence-v5 nav.fluence-dock {
  --dock-cutout-x:var(--dock-position,10%);
  isolation:isolate!important;
  box-sizing:border-box!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:1px!important;
  height:76px!important;
  min-height:76px!important;
  padding:8px 13px 5px!important;
  border:0!important;
  border-radius:26px!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:visible!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.fluence-v5 nav.fluence-dock::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  box-sizing:border-box;
  background:#fff;
  border:1px solid var(--fluence-nav-outline);
  border-radius:26px;
  box-shadow:2px 3px 0 rgba(22,16,24,.20),0 12px 26px rgba(50,22,69,.10);
  -webkit-mask-image:radial-gradient(circle 31px at var(--dock-cutout-x) 0px,transparent 30px,#000 32px);
  mask-image:radial-gradient(circle 31px at var(--dock-cutout-x) 0px,transparent 30px,#000 32px);
  pointer-events:none;
}
.fluence-v5 nav.fluence-dock.is-traveling::before {
  animation:fluence-dock-notch-slide .34s cubic-bezier(.2,.72,.12,1) both;
}
@keyframes fluence-dock-notch-slide {
  from {--dock-cutout-x:var(--dock-from-position)}
  to {--dock-cutout-x:var(--dock-position)}
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view] {
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:5px!important;
  box-sizing:border-box!important;
  min-width:0!important;
  width:100%!important;
  height:62px!important;
  min-height:62px!important;
  margin:0!important;
  padding:8px 0 4px!important;
  border:0!important;
  border-radius:13px!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  color:#34303a!important;
  font-family:'Poppins',sans-serif!important;
  font-size:10.5px!important;
  font-weight:550!important;
  letter-spacing:-.02em!important;
  line-height:1.15!important;
  text-align:center!important;
  white-space:nowrap!important;
  cursor:pointer;
  transition:color .18s ease,background-color .18s ease!important;
  -webkit-tap-highlight-color:transparent;
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view]>:is(svg,i) {
  display:block!important;
  flex:0 0 auto!important;
  width:22px!important;
  height:22px!important;
  stroke-width:1.9!important;
  color:currentColor!important;
  transform:none;
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view]>span {
  position:relative;
  z-index:1;
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  color:inherit!important;
  font-family:inherit!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view]:hover:not(.active):not([aria-current='page']) {
  background:#f3ecf8!important;
  color:#141018!important;
  border:0!important;
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view].active,
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view][aria-current='page'] {
  background:transparent!important;
  color:#171019!important;
  border:0!important;
  box-shadow:none!important;
  font-weight:700!important;
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view].active::before,
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view][aria-current='page']::before {
  content:''!important;
  display:block!important;
  position:absolute!important;
  z-index:0!important;
  top:-28px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:48px!important;
  height:48px!important;
  border:1px solid #141018!important;
  border-radius:50%!important;
  background:var(--fluence-nav-lilac)!important;
  box-shadow:0 2px 0 rgba(20,16,24,.12)!important;
  pointer-events:none;
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view].active>:is(svg,i),
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view][aria-current='page']>:is(svg,i) {
  position:relative!important;
  z-index:1!important;
  color:#171019!important;
  transform:translateY(-23px)!important;
}
.fluence-v5 nav.fluence-dock.is-traveling>.v4-nav-item[data-view].active>:is(svg,i),
.fluence-v5 nav.fluence-dock.is-traveling>.v4-nav-item[data-view][aria-current='page']>:is(svg,i) {
  animation:fluence-dock-icon-rise .33s cubic-bezier(.22,.82,.24,1) both;
}
@keyframes fluence-dock-icon-rise {
  from {transform:translateY(-4px) scale(.88);opacity:.7}
  to {transform:translateY(-23px) scale(1);opacity:1}
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view].active>span,
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view][aria-current='page']>span {
  color:#161018!important;
}
.fluence-v5 nav.fluence-dock>.v4-nav-item[data-view]:focus-visible {
  outline:2px solid #744c95!important;
  outline-offset:1px!important;
}
@media (max-width:900px) {
  .fluence-v5 .v4-nav {display:none!important}
  .fluence-v5 nav.v4-mobile-nav.fluence-dock {
    position:fixed!important;
    display:grid!important;
    left:max(12px,env(safe-area-inset-left,0px))!important;
    right:max(12px,env(safe-area-inset-right,0px))!important;
    bottom:calc(12px + env(safe-area-inset-bottom,0px))!important;
    z-index:40!important;
    width:auto!important;
    max-width:490px!important;
    margin:0 auto!important;
  }
  .fluence-v5 nav.fluence-dock>.v4-nav-item[data-view] {
    font-size:clamp(9px,2.45vw,10.5px)!important;
  }
  .fluence-v5 .v4-main {padding-bottom:128px!important}
}
@media (max-width:350px) {
  .fluence-v5 nav.v4-mobile-nav.fluence-dock {
    left:7px!important;
    right:7px!important;
    padding:8px 7px 5px!important;
  }
  .fluence-v5 nav.fluence-dock>.v4-nav-item[data-view] {
    font-size:9px!important;
    letter-spacing:-.04em!important;
  }
  .fluence-v5 nav.fluence-dock>.v4-nav-item[data-view].active::before,
  .fluence-v5 nav.fluence-dock>.v4-nav-item[data-view][aria-current='page']::before {
    width:43px!important;
    height:43px!important;
    top:-24px!important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .fluence-v5 nav.fluence-dock::before,
  .fluence-v5 nav.fluence-dock>.v4-nav-item[data-view],
  .fluence-v5 nav.fluence-dock>.v4-nav-item[data-view]>:is(svg,i) {
    animation:none!important;
    transition:none!important;
  }
}