.Sidebar {
  --sidebar-size-s: 260px;
  --sidebar-size-m: 320px;
  --sidebar-size-l: 480px;
  --sidebar-size-1-of-4: calc(1 / 4 * 100);
  --sidebar-size-3-of-4: calc(3 / 4 * 100);
  --sidebar-size-1-of-2: calc(1 / 2 * 100);
  --sidebar-size-1-of-3: calc(1 / 3 * 100);
  --sidebar-size-2-of-3: calc(2 / 3 * 100);
  --sidebar-size-full: 100;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}

  .Sidebar_position_top {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
    }

  .Sidebar_position_bottom {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-pack: end;
          -ms-flex-pack: end;
              justify-content: flex-end;
    }

  .Sidebar_position_right {
      -webkit-box-pack: end;
          -ms-flex-pack: end;
              justify-content: flex-end;
    }

  .Sidebar-Overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    background: var(--color-bg-tone);
    border: none;
  }

  .Sidebar-Window {
    z-index: 100;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    background-color: var(--color-bg-default);
    -webkit-box-shadow: var(--shadow-modal);
            box-shadow: var(--shadow-modal);
  }

  .Sidebar-Window_position_right,
      .Sidebar-Window_position_left {
        width: var(--sidebar-width);
        height: 100vh;
      }

  .Sidebar-Window_position_bottom,
      .Sidebar-Window_position_top {
        width: 100vw;
        height: var(--sidebar-height);
      }

  .Sidebar-Window_size_s {
        --sidebar-width: var(--sidebar-size-s);
        --sidebar-height: var(--sidebar-size-s);
      }

  .Sidebar-Window_size_m {
        --sidebar-width: var(--sidebar-size-m);
        --sidebar-height: var(--sidebar-size-m);
      }

  .Sidebar-Window_size_l {
        --sidebar-width: var(--sidebar-size-l);
        --sidebar-height: var(--sidebar-size-l);
      }

  .Sidebar-Window_size_full {
        --sidebar-width: calc(var(--sidebar-size-full) * 1vw);
        --sidebar-height: calc(var(--sidebar-size-full) * 1vh);
      }

  .Sidebar-Window_size_1\/4 {
        --sidebar-width: calc(var(--sidebar-size-1-of-4) * 1vw);
        --sidebar-height: calc(var(--sidebar-size-1-of-4) * 1vh);
      }

  .Sidebar-Window_size_3\/4 {
        --sidebar-width: calc(var(--sidebar-size-3-of-4) * 1vw);
        --sidebar-height: calc(var(--sidebar-size-3-of-4) * 1vh);
      }

  .Sidebar-Window_size_1\/2 {
        --sidebar-width: calc(var(--sidebar-size-1-of-2) * 1vw);
        --sidebar-height: calc(var(--sidebar-size-1-of-2) * 1vh);
      }

  .Sidebar-Window_size_1\/3 {
        --sidebar-width: calc(var(--sidebar-size-1-of-3) * 1vw);
        --sidebar-height: calc(var(--sidebar-size-1-of-3) * 1vh);
      }

  .Sidebar-Window_size_2\/3 {
        --sidebar-width: calc(var(--sidebar-size-2-of-3) * 1vw);
        --sidebar-height: calc(var(--sidebar-size-2-of-3) * 1vh);
      }

  .Sidebar-Content {
    overflow: auto;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
  }

  .Sidebar-Actions {
    -ms-flex-negative: 0;
        flex-shrink: 0;
    border-top: 1px solid var(--color-bg-border);
  }

  .Sidebar_animate_appear .Sidebar-Overlay, .Sidebar_animate_enter .Sidebar-Overlay, .Sidebar_animate_exit .Sidebar-Overlay, .Sidebar_animate_appearActive .Sidebar-Overlay, .Sidebar_animate_enterActive .Sidebar-Overlay, .Sidebar_animate_exitActive .Sidebar-Overlay {
          -webkit-transition: opacity 0.2s ease;
          transition: opacity 0.2s ease;
        }

  .Sidebar_animate_appear .Sidebar-Window, .Sidebar_animate_enter .Sidebar-Window, .Sidebar_animate_exit .Sidebar-Window, .Sidebar_animate_appearActive .Sidebar-Window, .Sidebar_animate_enterActive .Sidebar-Window, .Sidebar_animate_exitActive .Sidebar-Window {
          -webkit-transition: -webkit-transform 0.2s ease;
          transition: -webkit-transform 0.2s ease;
          transition: transform 0.2s ease;
          transition: transform 0.2s ease, -webkit-transform 0.2s ease;
        }

  .Sidebar_animate_appear .Sidebar-Overlay, .Sidebar_animate_enter .Sidebar-Overlay {
          opacity: 0;
        }

  .Sidebar_animate_appear .Sidebar-Window_position_right, .Sidebar_animate_enter .Sidebar-Window_position_right {
              -webkit-transform: translate3d(100%, 0, 0);
                      transform: translate3d(100%, 0, 0);
            }

  .Sidebar_animate_appear .Sidebar-Window_position_bottom, .Sidebar_animate_enter .Sidebar-Window_position_bottom {
              -webkit-transform: translate3d(0, 100%, 0);
                      transform: translate3d(0, 100%, 0);
            }

  .Sidebar_animate_appear .Sidebar-Window_position_left, .Sidebar_animate_enter .Sidebar-Window_position_left {
              -webkit-transform: translate3d(-100%, 0, 0);
                      transform: translate3d(-100%, 0, 0);
            }

  .Sidebar_animate_appear .Sidebar-Window_position_top, .Sidebar_animate_enter .Sidebar-Window_position_top {
              -webkit-transform: translate3d(0, -100%, 0);
                      transform: translate3d(0, -100%, 0);
            }

  .Sidebar_animate_appearActive .Sidebar-Overlay, .Sidebar_animate_enterActive .Sidebar-Overlay {
          opacity: 1;
        }

  .Sidebar_animate_appearActive .Sidebar-Window_position_right,
            .Sidebar_animate_appearActive .Sidebar-Window_position_bottom,
            .Sidebar_animate_appearActive .Sidebar-Window_position_left,
            .Sidebar_animate_appearActive .Sidebar-Window_position_top,
            .Sidebar_animate_enterActive .Sidebar-Window_position_right,
            .Sidebar_animate_enterActive .Sidebar-Window_position_bottom,
            .Sidebar_animate_enterActive .Sidebar-Window_position_left,
            .Sidebar_animate_enterActive .Sidebar-Window_position_top {
              -webkit-transform: translate3d(0, 0, 0);
                      transform: translate3d(0, 0, 0);
            }

  .Sidebar_animate_exit .Sidebar-Overlay {
          opacity: 1;
        }

  .Sidebar_animate_exit .Sidebar-Window_position_right,
            .Sidebar_animate_exit .Sidebar-Window_position_bottom,
            .Sidebar_animate_exit .Sidebar-Window_position_left,
            .Sidebar_animate_exit .Sidebar-Window_position_top {
              -webkit-transform: translate3d(0, 0, 0);
                      transform: translate3d(0, 0, 0);
            }

  .Sidebar_animate_exitActive .Sidebar-Overlay {
          opacity: 0;
        }

  .Sidebar_animate_exitActive .Sidebar-Window_position_right {
              -webkit-transform: translate3d(100%, 0, 0);
                      transform: translate3d(100%, 0, 0);
            }

  .Sidebar_animate_exitActive .Sidebar-Window_position_bottom {
              -webkit-transform: translate3d(0, 100%, 0);
                      transform: translate3d(0, 100%, 0);
            }

  .Sidebar_animate_exitActive .Sidebar-Window_position_left {
              -webkit-transform: translate3d(-100%, 0, 0);
                      transform: translate3d(-100%, 0, 0);
            }

  .Sidebar_animate_exitActive .Sidebar-Window_position_top {
              -webkit-transform: translate3d(0, -100%, 0);
                      transform: translate3d(0, -100%, 0);
            }