.aw-dock {
     --dock-bottom: env(safe-area-inset-bottom, 0px);
     --dock-height: calc(67vh - 2.75rem);
 
     display: flex;
     flex-direction: column;
 
     width: 100%;
     height: auto;
     max-height: 100%;
 
     position: fixed;
     left: 0;
     bottom: 0;
     z-index: 21;
 
     touch-action: pan-y;
 
     &--active {
          height: 100%;
     }
 
     &__panel {
          @apply bg-surface;
          display: flex;
          flex-direction: column;
 
          padding: 0 1.25rem calc(var(--dock-bottom, 0px) + 1.25rem);
          border-radius: 1.25rem 1.25rem 0 0;
          box-shadow: 0 -20px 25px -5px rgba(var(--c-overlay-rgb), 0.1),
          0 -10px 10px -5px rgba(var(--c-overlay-rgb), 0.04);
          width: 100%;
          height: auto;
          max-height: 67vh;
 
          position: relative;
 
          &--padding {
                padding-top: 1rem;
          }
     }
 
     &__overlay {
          @apply bg-overlay;
 
          margin-bottom: -1.25rem;
          flex: 1;
          opacity: var(--dock-open-progress, 0);
     }
 
     &__toggler {
         display: flex;
         align-items: center;
         justify-content: center;
         width: 100%;
         padding: 0.5rem;
 
         & > span {
               @apply bg-mono-700;
               display: block;
               width: 1.5rem;
               height: 0.25rem;
               border-radius: 0.125rem;
         }
     }
 
     &__content {
          overflow: hidden;
          opacity: calc(var(--dock-open-progress, 0) * 1.35 - 0.35);
          padding-bottom: calc(var(--dock-open-progress, 0) * 1rem);
          min-height: 0;
          max-height: calc(var(--dock-open-progress, 0) * var(--dock-height));
          transform: scaleX(
              min(1, calc(0.9 + 0.1 * var(--dock-open-progress, 0)))
          )
          translateY(max(0, calc(15% - 15% * var(--dock-open-progress, 0))));
          overflow: hidden;
          overscroll-behavior: contain;
 
         &--scroll {
              overflow: auto;
              padding-right: 0.75rem;
              margin-right: -0.75rem;
         }
     }
 
     &__visible {
          padding-top: 0.5rem;
     }
 }
 