.creator-workspace {
  position: absolute;
  inset: 0;
  display: grid !important;
  grid-template-columns: 260px minmax(0, 1fr);
  background: #171d22;
  color: #e5e9ed;
  overflow: hidden;
}
.creator-workspace[hidden] {
  display: none !important;
}
.creator-tools {
  background: #20272d;
  color: #e5e9ed;
  padding: 14px;
  overflow: auto;
  min-height: 0;
  border-right: 1px solid #37434b;
}
.creator-tools h2 {
  font-size: 20px;
  margin: 10px 0;
}
.creator-tools .subtle {
  font-size: 11px;
}
.creator-tools .compact-tools {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
}
.creator-tools button {
  font-size: 11px;
  padding: 8px;
}
.creator-tools > .row {
  margin-top: 12px;
}
.creator-artboard {
  display: flex;
  flex-direction: column;
  padding: 22px;
  align-items: center;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}
.creator-artboard svg {
  flex: 1;
  min-height: 60px;
  max-height: calc(100% - 70px);
  width: 100%;
  background: #eef0ed;
  box-shadow: 0 8px 40px #0003;
  touch-action: none;
}
.selected-part {
  filter: drop-shadow(0 0 1px #228e68);
}
.part-props {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  align-items: center;
}
.part-props .field-label {
  margin: 0;
}
.part-props input {
  min-width: 0;
  width: 100%;
  min-height: 30px;
}
.part-props label {
  font-size: 11px;
}
.creator-artboard [data-part-handle] {
  cursor: nwse-resize;
}
.creator-tools .field {
  font-size: 12px;
}
.asset-creation-mode .tool-rail,
.asset-creation-mode .canvas-toolbar,
.asset-creation-mode .master-toolbar,
.asset-creation-mode .area-chip,
.asset-creation-mode .map-controls,
.asset-creation-mode .selection-bar {
  display: none !important;
}
@media (max-aspect-ratio: 1/1) {
  .creator-workspace {
    grid-template-columns: 1fr;
    grid-template-rows: 44% 56%;
  }
  .creator-tools {
    border-bottom: 1px solid #37434b;
  }
  .creator-tools .compact-tools {
    grid-template-columns: repeat(3, 1fr);
  }
  .creator-artboard {
    padding: 10px;
  }
  .creator-artboard svg {
    max-height: calc(100% - 35px);
  }
}
