.workspace {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 18px;
  height: clamp(480px, 65vh, 760px);
}
#source-pane { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.source-header {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  flex: none; padding: 12px 16px; background: #e6eeea;
}
.panel .source-header > label {
  display: flex; align-items: center; gap: 8px;
  padding: 0; background: transparent; white-space: nowrap;
}
.source-header .line-count { float: none; }
.source-actions {
  display: flex; flex-wrap: wrap; justify-content: flex-end;
  align-items: center; gap: 6px; margin-left: auto; min-width: 0;
}
.source-actions button { padding: 6px 8px; font-size: 12px; white-space: nowrap; }
#source-pane > textarea, #source-pane .CodeMirror {
  flex: 1;
  height: 0;
  min-height: 0;
  width: 100%;
}
#source-pane > textarea { resize: none; }
.results-pane { display: flex; flex-direction: column; gap: 18px; min-width: 0; min-height: 0; }
.results-pane .diagnostics { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.diagnostics h2 { flex: none; }
.diagnostics pre { flex: 1; min-height: 0; overflow: auto; }
#connection { font-size: 14px; }
.CodeMirror .p2f-error-line { background: rgba(190, 30, 45, 0.13); }
.CodeMirror .p2f-error-column { text-decoration: underline wavy #b51d30; text-underline-offset: 3px; }
.CodeMirror-gutter.p2f-errors { width: 20px; }
.p2f-error-marker { color: #b51d30; background: transparent; border: 0; border-radius: 0; padding: 0 4px; font-weight: bold; cursor: pointer; }
#error-note { overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .workspace { grid-template-columns: minmax(0, 1fr); height: auto; }
  #source-pane { height: 420px; }
  .results-pane { height: 500px; }
}
#share-link-field { margin-bottom: 1rem; }
#share-link { display: block; width: 100%; box-sizing: border-box; }