.lt-development-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,380px);
  grid-template-areas:"preview controls" "preview diagnostics";
  gap:18px;
  align-items:start;
}

.lt-preview-region{grid-area:preview;position:sticky;top:12px;align-self:start;min-width:0;z-index:5}
.lt-dev-panel{grid-area:controls}
.lt-diagnostic-panel{grid-area:diagnostics}
.lt-preview-toolbar{display:none}
.lt-page-viewport{min-height:0;overflow:hidden;box-sizing:border-box}

.lt-controls label{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:5px 8px;
  align-items:center;
}

.lt-control-label{min-width:0}
.lt-control-adjust{display:grid;grid-template-columns:28px minmax(48px,auto) 28px;align-items:center;gap:4px}
.lt-control-adjust button{width:28px;height:28px;padding:0;border:1px solid #b7aa99;border-radius:6px;background:#fff;color:#493e34;font-size:17px;font-weight:800;line-height:1;cursor:pointer}
.lt-control-adjust output{float:none;text-align:center;font-variant-numeric:tabular-nums}
.lt-controls input{grid-column:1/-1}

@media(max-width:1100px){
  .lt-development-layout{display:flex;flex-direction:column}
  .lt-preview-region{top:0;order:-1;width:100%;background:#eeeae2;padding-bottom:8px}
  .lt-preview-toolbar{display:flex;align-items:center;justify-content:space-between;min-height:38px;padding:0 8px;background:#fff;border:1px solid #d8d0c4;border-radius:9px 9px 0 0}
  .lt-preview-toolbar button{border:0;background:transparent;color:#795f30;font-weight:800;cursor:pointer}
  .lt-page-viewport{border-radius:0 0 9px 9px}
  .is-preview-collapsed .lt-page-viewport{display:none}
  .is-preview-collapsed .lt-preview-toolbar{border-radius:9px}
  .lt-dev-panel,.lt-diagnostic-panel{width:100%;max-width:none;box-sizing:border-box}
}
