#app {
  display: grid;
  grid-template-columns: var(--nav-width) minmax(0, 1fr);
  width: calc(100vw - 28px);
  min-width: 1180px;
  height: calc(100vh - 28px);
  margin: 14px;
  overflow: hidden;
  border: 1px solid rgba(214, 217, 222, 0.9);
  border-radius: var(--radius-xl);
  background: var(--surface);
  box-shadow: var(--shadow-shell);
}

#navigation {
  min-width: 0;
  border-right: 1px solid var(--border);
}

#main {
  display: grid;
  grid-template-rows: var(--header-height) minmax(0, 1fr);
  min-width: 0;
  overflow: hidden;
  background: var(--surface);
}

#header {
  min-width: 0;
}

#content {
  min-width: 0;
  overflow: auto;
  padding: 26px;
  background: var(--surface);
}

@media (max-width: 1250px) {
  #app {
    margin: 0;
    width: 100vw;
    height: 100vh;
    border: 0;
    border-radius: 0;
  }
}