/* Scientific notebook and experiment detail; shared chrome stays in Workspace. */
.ws-experiment { --exp-line: #e5e8eb; --exp-muted: #727b82; background: #fff; color: #293138; min-width: 0; }
.ws-exp-header { display: flex; align-items: flex-start; gap: 24px; justify-content: space-between; padding: 24px 28px 21px; border-bottom: 1px solid var(--exp-line); }
.ws-exp-title-group { flex: 1; min-width: 0; }
.ws-exp-record-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.ws-exp-id { color: #57636b; font: 10px/1.5 var(--mono); overflow-wrap: anywhere; }
.ws-exp-status { display: inline-flex; align-items: center; gap: 6px; padding: 3px 7px; font-size: 10px; font-weight: 500; color: #57636b; background: #f0f2f4; border-radius: 4px; white-space: nowrap; }
.ws-exp-status:before { content: ''; width: 5px; height: 5px; background: currentColor; border-radius: 50%; }
.ws-exp-status[data-status="Running"] { color: #476b87; background: #eaf2f8; }
.ws-exp-status[data-status="Planned"] { color: #7a6f46; background: #f6f1e2; }
.ws-exp-status[data-status="Analysis"] { color: #786497; background: #f1edf7; }
.ws-exp-status[data-status="Completed"] { color: #447356; background: #e4f1e8; }
.ws-exp-status[data-status="Failed"] { color: #9a5c4e; background: #fbede9; }
.ws-exp-title { display: block; min-width: 0; width: 100%; font: 600 26px/1.3 var(--sans); letter-spacing: -.5px; color: #293138; padding: 3px 0; border: 1px solid transparent; background: transparent; border-radius: 3px; }
.ws-exp-title:hover:not([readonly]) { border-bottom-color: #dbe3e8; }
.ws-exp-title:focus { background: #f9fbfd; border-color: #c9dbea; outline: 1px solid #9dbdd7; outline-offset: 2px; }
.ws-exp-header-actions { display: flex; gap: 5px; flex-shrink: 0; padding-top: 4px; }
.ws-exp-header-actions button { border: 1px solid #dde3e8; padding: 7px 11px; border-radius: 5px; }
.ws-exp-layout { display: grid; grid-template-columns: minmax(0, 1fr) 226px; }
.ws-exp-notebook { padding: 2px 28px 24px; min-width: 0; }
.ws-exp-section { padding: 23px 0 24px; border-bottom: 1px solid var(--exp-line); scroll-margin-top: 125px; min-width: 0; }
.ws-exp-section:last-child { border-bottom: 0; }
.ws-exp-section-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.ws-exp-section-head h2 { font: 600 14px/1.5 var(--sans); letter-spacing: -.1px; color: #293138; }
.ws-exp-section-head p { margin-top: 3px; font-size: 10px; line-height: 1.65; color: var(--exp-muted); max-width: 470px; }
.ws-exp-question-grid { display: grid; gap: 16px; grid-template-columns: 1fr 1fr; }
.ws-exp-field { min-width: 0; display: flex; flex-direction: column; gap: 7px; font-size: 11px; }
.ws-exp-field>span { font-size: 10px; color: #57636b; line-height: 1.5; }
.ws-exp-field input, .ws-exp-field select, .ws-exp-field textarea,
.ws-exp-condition-row input, .ws-exp-inline-actions select {
  width: 100%; min-width: 0; border: 1px solid #dfe5e9; background: #fff;
  color: #3e484f; font: 11px/1.65 var(--sans); padding: 8px 10px; border-radius: 4px;
}
.ws-exp-field textarea { min-height: 92px; resize: vertical; }
.ws-exp-field input:hover:not(:disabled):not([readonly]), .ws-exp-field select:hover:not(:disabled),
.ws-exp-field textarea:hover:not([readonly]), .ws-exp-condition-row input:hover:not([readonly]) { border-color: #bbcbd7; }
.ws-exp-field input:focus, .ws-exp-field select:focus, .ws-exp-field textarea:focus,
.ws-exp-condition-row input:focus, .ws-exp-inline-actions select:focus {
  border-color: #a8c5de; background: #f9fcff; outline: 1px solid #a8c5de; outline-offset: 0;
}
.ws-exp-field :disabled, .ws-exp-field [readonly], .ws-exp-condition-row [readonly] { color: #3e484f; background: #fafbfd; opacity: 1; }
.ws-exp-link { color: #57636b; font-size: 10px; line-height: 1.5; padding: 4px 0; text-align: left; }
.ws-exp-link:hover { color: #3e484f; text-decoration: underline; }
.ws-exp-object-link { color: #3e484f; text-align: left; padding: 0; font-size: 11px; line-height: 1.5; font-weight: 500; overflow-wrap: anywhere; }
.ws-exp-object-link:hover { color: #3e484f; text-decoration: underline; }
.ws-exp-inline-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; flex-shrink: 0; max-width: 55%; }
.ws-exp-inline-actions select { width: 156px; max-width: 100%; font-size: 10px; padding: 5px 8px; }
.ws-exp-inline-actions button { white-space: nowrap; }
.ws-exp-empty { font-size: 11px; color: #6b747b; line-height: 1.7; padding: 7px 0; }
.ws-exp-muted { font-size: 10px; color: var(--exp-muted); line-height: 1.7; }
.ws-exp-related-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ws-exp-related-list>.ws-exp-empty { grid-column: 1 / -1; }
.ws-exp-related-row { min-width: 0; display: flex; justify-content: space-between; align-items: center; gap: 10px; border: 1px solid #e1e7eb; border-radius: 5px; padding: 10px 12px; background: #fcfdfe; }
.ws-exp-related-row>div { min-width: 0; }
.ws-exp-related-row small { display: block; font-size: 9px; color: #6b747b; line-height: 1.6; margin-top: 3px; overflow-wrap: anywhere; }
.ws-exp-unlink { color: #6b747b; font-size: 17px; line-height: 1; width: 26px; height: 28px; padding: 0; flex-shrink: 0; border-radius: 4px; }
.ws-exp-unlink:hover { color: #3e484f; background: #f9efec; }
.ws-exp-protocol-list { display: grid; gap: 9px; }
.ws-exp-protocol { border: 1px solid #dfe6eb; border-radius: 5px; padding: 12px 14px; background: #fcfdfe; }
.ws-exp-protocol-heading { display: flex; align-items: center; gap: 10px; }
.ws-exp-protocol-heading .ws-exp-unlink { margin-left: auto; }
.ws-exp-version { color: #718679; font-size: 9px; padding: 3px 6px; border-radius: 3px; background: #eef3ed; white-space: nowrap; }
.ws-exp-protocol-description { font-size: 10px; color: #57636b; line-height: 1.7; margin-top: 8px; white-space: pre-wrap; }
.ws-exp-protocol-steps { margin-top: 9px; font-size: 10px; line-height: 1.7; color: #57636b; }
.ws-exp-protocol-steps summary { cursor: pointer; }
.ws-exp-protocol-steps ol { padding-left: 20px; margin: 10px 0 0; }
.ws-exp-protocol-steps li { padding-left: 4px; margin-bottom: 7px; white-space: pre-wrap; }
.ws-exp-condition-labels, .ws-exp-condition-row { display: grid; grid-template-columns: 1.4fr 1fr .65fr 28px; align-items: center; gap: 8px; }
.ws-exp-condition-labels { color: #6b747b; font-size: 9px; margin-bottom: 7px; padding: 0 10px; }
.ws-exp-conditions { display: grid; gap: 7px; }
.ws-exp-condition-notice { margin-top: 8px; font-size: 10px; color: #7e6a42; }
.ws-exp-condition-notice:empty { display: none; }
.ws-exp-condition-row input { padding: 7px 9px; }
.ws-exp-table-scroll { overflow: auto; border: 1px solid #e1e7ed; border-radius: 4px; }
.ws-exp-result-table { width: 100%; border-collapse: collapse; font-size: 10px; text-align: left; }
.ws-exp-result-table th { font-size: 9px; font-weight: 600; color: #57636b; padding: 9px 11px; background: #f7f9fb; border-bottom: 1px solid #e1e7ed; white-space: nowrap; }
.ws-exp-result-table td { padding: 10px 11px; border-bottom: 1px solid #edf1f4; color: #57636b; }
.ws-exp-result-table tbody tr:last-child td { border-bottom: 0; }
.ws-exp-result-table tbody tr:hover { background: #fafcfd; }
.ws-exp-result-table .ws-exp-object-link { font-size: 10px; }
.ws-exp-result-value { font-variant-numeric: tabular-nums; color: #3e484f !important; white-space: nowrap; }
.ws-exp-file-list { display: grid; margin-top: 10px; }
.ws-exp-file-row { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid #edf1f5; min-width: 0; }
.ws-exp-file-row .ws-exp-object-link { min-width: 0; }
.ws-exp-file-type { display: grid; place-items: center; width: 34px; height: 29px; border: 1px solid #dfe7ee; background: #f7fafc; color: #6b747b; border-radius: 3px; font-size: 7px; font-weight: 600; flex-shrink: 0; }
.ws-exp-file-row small { margin-left: auto; color: #6b747b; font-size: 9px; white-space: nowrap; }
.ws-exp-dropzone { width: 100%; min-height: 57px; border: 1px dashed #cddbe7; background: #fafcfe; border-radius: 5px; font-size: 11px; color: #6b747b; padding: 15px; }
.ws-exp-dropzone:hover, .ws-exp-dropzone.is-dragging { background: #eff7fd; border-color: #8db9da; color: #57636b; }
.ws-exp-upload-status { color: #57636b; font-size: 10px; margin-top: 8px; }
.ws-exp-upload-status:empty { display: none; }

/* The notebook stores only blocks and supported text marks. */
.ws-notebook { border: 1px solid #dbe5ed; border-radius: 5px; overflow: hidden; }
.ws-notebook-toolbar { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; padding: 5px 8px; border-bottom: 1px solid #e3ebf1; background: #f8fafc; }
.ws-notebook-toolbar select { width: 117px; border: 0; background: transparent; color: #57636b; padding: 6px 4px; font-size: 10px; margin-right: 3px; }
.ws-notebook-toolbar button { min-width: 27px; height: 28px; border-radius: 4px; padding: 4px 7px; color: #57636b; font-size: 11px; }
.ws-notebook-toolbar button[aria-label="Bold"] { font-weight: 700; }
.ws-notebook-toolbar button[aria-label="Italic"] { font-style: italic; }
.ws-notebook-toolbar button:hover, .ws-notebook-toolbar button[aria-pressed="true"] { background: #e9f1f7; color: #3e484f; }
.ws-notebook-toolbar .ws-notebook-add { margin-left: auto; font-size: 10px; }
.ws-notebook-toolbar .ws-notebook-remove { font-size: 9px; color: #6b747b; }
.ws-notebook-body { min-height: 175px; padding: 14px 16px 24px; }
.ws-notebook-row { display: flex; align-items: flex-start; gap: 7px; min-width: 0; margin-bottom: 3px; }
.ws-notebook-marker { width: 15px; flex-shrink: 0; text-align: right; color: #6b747b; padding-top: 6px; font-size: 11px; line-height: 1.7; }
.ws-notebook-row>input[type="checkbox"] { margin: 8px 0 0; width: 13px; height: 13px; flex-shrink: 0; accent-color: #648772; }
.ws-notebook-row:not([data-type="bullet"]):not([data-type="numbered"])>.ws-notebook-marker { display: none; }
.ws-notebook-block { flex: 1; min-width: 0; min-height: 30px; padding: 5px 3px; color: #3e484f; font: 12px/1.8 var(--sans); white-space: pre-wrap; overflow-wrap: anywhere; border-radius: 3px; }
.ws-notebook-block:empty:before { content: attr(data-placeholder); color: #6b747b; pointer-events: none; }
.ws-notebook-block[contenteditable="true"]:focus { outline: 1px solid #d3e4f0; outline-offset: 2px; background: #fbfdff; }
.ws-notebook-block[contenteditable="false"]:empty:before { content: 'No notes recorded.'; }
.ws-notebook-block code { font: 10px/1.6 var(--mono); background: #eef4f8; padding: 1px 3px; border-radius: 3px; }
.ws-notebook-row[data-type="heading"] { margin-top: 7px; }
.ws-notebook-row[data-type="heading"] .ws-notebook-block { font-weight: 600; font-size: 17px; color: #3e484f; }
.ws-notebook-row[data-type="heading"][data-level="1"] .ws-notebook-block { font-size: 20px; }
.ws-notebook-row[data-type="heading"][data-level="3"] .ws-notebook-block { font-size: 14px; }
.ws-notebook-row[data-type="code"] .ws-notebook-block { padding: 9px 11px; background: #f5f9fc; font: 11px/1.8 var(--mono); }
.ws-notebook-row[data-type="check"]:has(input:checked) .ws-notebook-block { color: #91a49b; text-decoration: line-through; }
.ws-notebook-help { padding: 7px 12px; background: #fcfdfe; color: #6b747b; font-size: 9px; border-top: 1px solid #eef3f7; line-height: 1.6; }

.ws-exp-properties { min-width: 0; padding: 25px 20px; border-left: 1px solid var(--exp-line); background: #fcfdfe; }
.ws-exp-properties>h2 { font: 600 11px/1.5 var(--sans); color: #57636b; margin-bottom: 20px; }
.ws-exp-properties .ws-exp-field { margin-bottom: 17px; }
.ws-exp-properties .ws-exp-field select, .ws-exp-properties .ws-exp-field input { font-size: 10px; padding: 7px 8px; }
.ws-exp-collaborators { padding: 0; border: 0; margin: 3px 0 19px; min-width: 0; max-height: 170px; overflow: auto; }
.ws-exp-collaborators legend { font-size: 10px; color: #57636b; margin-bottom: 9px; }
.ws-exp-collaborators label { display: flex; gap: 7px; align-items: center; margin: 7px 0; font-size: 10px; color: #57636b; line-height: 1.5; overflow-wrap: anywhere; }
.ws-exp-collaborators input { accent-color: #6b8da3; }
.ws-exp-design-origin { padding-top: 17px; margin-top: 20px; border-top: 1px solid #e3ebf0; }
.ws-exp-design-origin h3, .ws-exp-jump h3 { font-size: 10px; font-weight: 600; color: #57636b; margin-bottom: 10px; }
.ws-exp-design-origin>button { display: block; margin: 8px 0; }
.ws-exp-design-origin p { font-size: 10px; color: #6b747b; line-height: 1.8; margin: 7px 0; }
.ws-exp-jump { border-top: 1px solid #e3ebf0; padding-top: 18px; margin-top: 22px; display: grid; gap: 7px; }
.ws-exp-jump a { font-size: 10px; color: #6b747b; text-decoration: none; }
.ws-exp-jump a:hover { color: #57636b; }

@media (max-width: 1120px) {
  .ws-exp-layout { grid-template-columns: minmax(0, 1fr) 199px; }
  .ws-exp-header { padding: 21px 22px 19px; gap: 15px; }
  .ws-exp-title { font-size: 23px; }
  .ws-exp-notebook { padding: 2px 22px 20px; }
  .ws-exp-properties { padding: 24px 15px; }
  .ws-exp-question-grid { grid-template-columns: 1fr; gap: 13px; }
  .ws-exp-related-list { grid-template-columns: 1fr; }
  .ws-exp-section-head { flex-wrap: wrap; }
  .ws-exp-inline-actions { max-width: 100%; }
}
@media (max-width: 780px) {
  .ws-exp-layout { display: flex; flex-direction: column; }
  .ws-exp-properties { order: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 5px 16px; border-left: 0; border-top: 1px solid var(--exp-line); padding: 22px; }
  .ws-exp-properties>h2, .ws-exp-design-origin { grid-column: 1 / -1; }
  .ws-exp-properties .ws-exp-field { margin-bottom: 12px; }
  .ws-exp-jump { display: none; }
  .ws-exp-question-grid { grid-template-columns: 1fr 1fr; }
  .ws-exp-related-list { grid-template-columns: 1fr 1fr; }
  .ws-exp-title { font-size: 22px; }
}
@media (max-width: 500px) {
  .ws-exp-header { display: block; padding: 19px 16px 15px; }
  .ws-exp-header-actions { padding-top: 12px; }
  .ws-exp-title { font-size: 21px; }
  .ws-exp-notebook { padding: 0 16px 14px; }
  .ws-exp-properties { padding: 20px 16px; }
  .ws-exp-question-grid, .ws-exp-related-list { grid-template-columns: 1fr; }
  .ws-exp-condition-labels, .ws-exp-condition-row { grid-template-columns: 1.2fr 1fr .65fr 23px; gap: 5px; }
  .ws-exp-condition-row input { padding: 7px 6px; font-size: 10px; }
  .ws-exp-condition-labels { padding: 0 6px; }
  .ws-exp-file-row small { font-size: 8px; }
  .ws-notebook-body { padding: 12px 11px 20px; }
  .ws-notebook-toolbar .ws-notebook-remove { display: none; }
  .ws-exp-section { scroll-margin-top: 155px; }
}
