/* app.css — app layout only (scrollbars/arrows moved out) */

.app_container {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  justify-content: center;
  overflow: hidden;

  padding: var(--page-pad);
  padding-top: 0px;
  padding-bottom: 0px;
}

.app_scrollwrap {
  width: 80%;
  flex: 1 1 auto;
  min-height: 0;
  position: relative;

  padding-right: var(--scrollbar-inset);
  box-sizing: border-box;
}

#app {
  width: 100%;
  height: 100%;
  flex: 1 1 auto;
  min-height: 0;

  margin-top: 0;
  margin-bottom: 0px;

  padding: var(--app-pad);
  padding-top: 0px;
  padding-bottom: 0px;
  box-sizing: border-box;

  overflow-y: auto;
  overflow-x: hidden;
  overflow-wrap: break-word;

  /* reserve space so scrollbar doesn't run under arrow buttons */
  border-top: var(--arrow-h) solid transparent;
  border-bottom: var(--arrow-h) solid transparent;
  background-clip: padding-box;

  scroll-behavior: auto;
}