/* Nord Mobile Dock v1 — only on narrow screens.
   No blur, no desktop layout overrides and no changes to existing app navigation. */
#nordMobileDock { display:none!important; }

@media (max-width:1024px) {
  html body #nordMobileDock.nord-mobile-dock:not([hidden]) {
    --dock-accent:var(--accent,#7884ff);
    position:fixed!important;
    inset:auto auto calc(12px + env(safe-area-inset-bottom,0px)) 50%!important;
    transform:translateX(-50%) translateY(0)!important;
    display:grid!important;
    grid-auto-flow:column!important;
    grid-auto-columns:minmax(0,1fr)!important;
    align-items:center!important;
    justify-items:stretch!important;
    box-sizing:border-box!important;
    width:min(430px,calc(100vw - 28px))!important;
    min-width:0!important;
    max-width:calc(100vw - 28px)!important;
    min-height:70px!important;
    height:74px!important;
    margin:0!important;
    padding:7px 9px!important;
    gap:3px!important;
    border:1px solid var(--border,#343d4d)!important;
    border-radius:23px!important;
    background:var(--surface,#171d29)!important;
    color:var(--text,#f1f5fd)!important;
    box-shadow:0 12px 36px rgba(0,0,0,.42),0 2px 7px rgba(0,0,0,.22)!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    isolation:isolate!important;
    overflow:visible!important;
    z-index:950!important;
    pointer-events:auto!important;
    -webkit-tap-highlight-color:transparent!important;
    animation:nord-mobile-dock-enter .2s ease-out both!important;
  }

  html body #nordMobileDock.nord-mobile-dock:not([hidden]) > .nord-mobile-dock-item {
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    box-sizing:border-box!important;
    min-width:0!important;
    max-width:none!important;
    width:100%!important;
    height:60px!important;
    min-height:60px!important;
    padding:3px 1px!important;
    gap:3px!important;
    border:0!important;
    border-radius:15px!important;
    background:transparent!important;
    box-shadow:none!important;
    color:var(--muted,#a3aec1)!important;
    font:inherit!important;
    text-align:center!important;
    cursor:pointer!important;
    touch-action:manipulation!important;
    transition:color .15s ease,background .15s ease!important;
    outline-offset:2px!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item .nord-mobile-dock-icon {
    display:grid!important;
    place-items:center!important;
    flex:0 0 auto!important;
    width:38px!important;
    height:36px!important;
    min-width:0!important;
    border-radius:12px!important;
    background:transparent!important;
    color:inherit!important;
    transition:background .15s ease!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item .nord-mobile-dock-icon i {
    font-size:18px!important;
    line-height:1!important;
    color:inherit!important;
    pointer-events:none!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item .nord-mobile-dock-label {
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    font-family:inherit!important;
    font-size:10px!important;
    font-weight:650!important;
    line-height:1.15!important;
    text-align:center!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    color:inherit!important;
    pointer-events:none!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item.is-active {
    color:var(--dock-accent)!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item.is-active .nord-mobile-dock-icon {
    background:var(--accent-soft,rgba(115,126,255,.16))!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item.is-active::before {
    content:''!important;
    position:absolute!important;
    inset:auto auto 0 50%!important;
    transform:translateX(-50%)!important;
    width:16px!important;
    height:2px!important;
    border-radius:3px!important;
    background:var(--dock-accent)!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item:hover,
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item:active {
    color:var(--text,#f1f5fd)!important;
    background:var(--surface-2,#262e3b)!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item:focus-visible {
    outline:2px solid var(--dock-accent)!important;
  }

  /* Reserve room in every platform page including the independently scrolling Nexus feed. */
  html body.nord-mobile-dock-ready #appShell .nord-main > .nord-page {
    box-sizing:border-box!important;
    padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))!important;
    scroll-padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))!important;
  }
  html body.nord-mobile-dock-ready.nord-nexus-active #appShell .nord-main > .nord-page {
    box-sizing:border-box!important;
    padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))!important;
    scroll-padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))!important;
  }

  /* Drawer and on-screen keyboards take precedence over the dock. */
  html body.sidebar-open #nordMobileDock.nord-mobile-dock,
  html body.nord-mobile-dock-typing #nordMobileDock.nord-mobile-dock,
  html body:has(.ncp-backdrop:not([hidden])) #nordMobileDock.nord-mobile-dock,
  html body:has(.nx-modal-backdrop.open) #nordMobileDock.nord-mobile-dock {
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  @keyframes nord-mobile-dock-enter {
    from { opacity:0; translate:0 9px; }
    to { opacity:1; translate:0 0; }
  }
  @media (prefers-reduced-motion:reduce) {
    html body #nordMobileDock.nord-mobile-dock:not([hidden]) {
      animation:none!important;
    }
    html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item,
    html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-icon {
      transition:none!important;
    }
  }
}

@media (max-width:360px) {
  html body #nordMobileDock.nord-mobile-dock:not([hidden]) {
    width:calc(100vw - 18px)!important;
    max-width:calc(100vw - 18px)!important;
    padding:6px!important;
    gap:1px!important;
    height:70px!important;
  }
  html body #nordMobileDock.nord-mobile-dock .nord-mobile-dock-item .nord-mobile-dock-label {
    font-size:9px!important;
  }
}
