/* Keeps very long LaTeX documents inside the editor viewport. */
html, body, .app-shell {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.workspace {
  width: 100%;
  max-width: 100vw;
  min-width: 0;
  overflow: hidden;
  grid-template-columns: 220px minmax(0, 1.08fr) minmax(0, .92fr);
}

.editor-pane,
.preview-pane {
  position: relative;
  width: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.editor-toolbar,
.preview-toolbar,
.compile-group,
.tab {
  min-width: 0;
}

.code-wrap {
  width: 100%;
  height: 0;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  grid-template-columns: 46px minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
}

.line-numbers {
  width: 46px;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.code-wrap textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 100%;
  min-height: 0;
  overflow: auto;
  overflow-wrap: normal;
}

.preview-canvas {
  width: 100%;
  min-width: 0;
  min-height: 0;
  overflow: auto;
}

.compiler-log {
  left: 0;
  right: 0;
  bottom: 32px;
  width: 100%;
  max-width: 100%;
  height: min(240px, 42%);
  z-index: 20;
}

@media (max-width: 900px) {
  .workspace { display: block; }
  .code-wrap { height: 0; }
}
.pane-heading .file-actions{gap:4px}
.pane-heading .file-actions button{font-size:16px;line-height:1}
.pane-heading .file-actions button:hover{background:#34506d}
.pane-heading .file-actions button.danger:hover{background:#a93643;color:#fff}
.file.folder{color:#e3b85c;font-weight:650}
.file.folder .file-icon{background:#b27a25}
.file.nested{padding-left:25px}