/* Shared, screen-only layout for the 65 inline tools and their live results. */
@media screen {
  #work.guided > .panel, #work.focused-document > .panel {
    max-height: none !important;
    overflow: visible !important;
    overscroll-behavior: auto;
  }
  #work .panel { padding: clamp(11px,1.05vw,18px); }
  #work .tool-head { padding: 11px 16px; margin-bottom: 11px; }
  #work .tool-head h1 { font-size: clamp(21px,2.2vw,29px); }
  #work .fields { gap: 8px 10px; }
  #work.guided .fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #work .field { min-width: 0; }
  #work .field.wide, #work .fields>.wide { grid-column: 1/-1; }
  #work .field span { font-size: 12px; font-weight: 730; }
  #work .field :is(input,select,textarea) { max-width: 100%; }
  #work.guided .field :is(input:not([type="file"]),select) { min-height:34px; padding:7px 9px; }
  #work.guided .field textarea { min-height:58px; padding:8px 9px; }
  #work .preview-wrap img { max-height:clamp(175px,29dvh,350px); object-fit:contain; }
  #work .preview-source { margin-bottom:7px; }
  #work .panel-heading { margin-bottom:9px; }
  #work.guided > .result, #work.guided > .result-placeholder { max-height: none !important; overflow: visible !important; }
  #work .result iframe { display: block; width: 100%; min-height: 300px; height: clamp(300px,55dvh,700px); }
  #work .result :is(img.preview,canvas.preview) { max-height: clamp(260px,53dvh,650px); width: auto; max-width: 100%; object-fit: contain; }
  #work .result-placeholder .placeholder-body { min-height: 135px; }
}
@media screen and (min-width: 1800px) {
  #work.guided { grid-template-columns: minmax(0,1fr) minmax(0,1.15fr); gap: 0 22px; }
  #work.guided .fields { grid-template-columns: repeat(3,minmax(0,1fr)); }
  #work.guided .fields .wide { grid-column: 1/-1; }
  #work.guided .result iframe { height: clamp(410px,64dvh,920px); }
}
@media screen and (max-width: 1050px) {
  #work.guided .fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media screen and (max-width: 720px) {
  #work.guided .fields { grid-template-columns: 1fr; }
  #work.guided > .result, #work.guided > .result-placeholder { position: static; }
}