@media (min-width: 1101px) {
  body { overflow-x: hidden; }
  main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 410px;
    grid-template-rows: auto auto;
    align-items: start;
    min-height: calc(100vh - 60px);
  }
  .workspace {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }
  .support {
    grid-column: 1;
    grid-row: 2;
  }
  .editor {
    grid-column: 2;
    grid-row: 1 / span 2;
    position: sticky;
    top: 59px;
    height: calc(100vh - 59px);
    overflow-y: auto;
    border-left: 1px solid var(--line);
    box-shadow: -14px 0 35px #0004;
    z-index: 5;
  }
  .editor .tabs {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--surface);
  }
  .editor .tab {
    min-width: 0;
    padding: 16px 6px;
    font-size: .78rem;
  }
  .editor .panel { padding: 20px 18px 32px; }
  .editor .control-grid { grid-template-columns: 1fr; gap: 14px; }
  .editor .layout-options { grid-template-columns: 1fr 1fr; }
  .editor .layout { padding: 14px 8px; }
  .editor .motif-upload { align-items: flex-start; flex-direction: column; }
  .editor .motif-actions { width: 100%; flex-wrap: wrap; }
  .editor .colours { grid-template-columns: 1fr 1fr; }
  .editor .colours > div:last-child { grid-column: 1 / -1; }
  .editor .upload-row { flex-wrap: wrap; }
  .canvas-shell { height: min(68vh, 720px); }
}
