#workspace-sources[hidden], #sources-selection[hidden], #source-write-actions[hidden], #source-prompt-panel[hidden], #sources-empty[hidden] { display: none; }
.library-page:has(#workspace-sources:not([hidden])) { background: var(--surface); }
.workspace:has(#workspace-sources:not([hidden])) > .workspace__heading { max-width: 54rem; margin: 0 auto 2rem; }
.sources-heading { flex-wrap: wrap; }
#sources-heading:focus { outline: none; }
.sources-heading > div:first-child { flex: 1 1 18rem; }
.sources-actions, .sources-toolbar, .sources-selection { align-items: center; display: flex; gap: .65rem; }
.sources-actions { flex-wrap: wrap; }
.sources-actions .context-button { white-space: nowrap; }
.sources-toolbar { margin-bottom: 1rem; }
.sources-search { flex: 1; min-width: 0; }
.sources-selection { background: #edf4f6; border: 1px solid #cadce3; border-radius: .65rem; margin: 1rem 0; padding: .8rem 1rem; flex-wrap: wrap; }
.sources-selection span { margin-right: auto; }
#source-list { margin: 1rem 0; }
.source-row input { width: 1.125rem; height: 1.125rem; accent-color: var(--blue); flex: 0 0 auto; margin: 0; cursor: pointer; }
.context-source-list .source-row:has(input:checked) { background: #edf4f6; border-color: #9dbdcb; }
.sources-helper { color: var(--muted); line-height: 1.6; margin: 1.5rem 0 0; }
#sources-library[hidden], #source-editor[hidden], #source-artifact-panel[hidden], #source-discard-confirm[hidden] { display: none; }
#source-editor-heading:focus, #source-artifact-heading:focus { outline: none; }
.source-back { display: inline-block; background: none; border: 0; color: var(--blue-dark); cursor: pointer; font: inherit; padding: .75rem 0; margin: 0 0 1.25rem; text-align: left; }
.source-back:hover { text-decoration: underline; text-underline-offset: .2rem; }
.source-editor-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.25rem; }
.source-editor-actions:not(:has(button:not([hidden]))) { display: none; }
.source-discard-confirm { border: 1px solid #cadce3; background: #edf4f6; border-radius: .65rem; padding: 1rem; margin-top: 1rem; }
.source-discard-confirm p { line-height: 1.6; margin: 0 0 1rem; }
#source-artifact-form > .field { margin-top: 1rem; }
.source-title-field { margin-bottom: 1rem; }
.source-title-field input { border: 1px solid #b7c8ce; border-radius: .5rem; padding: .75rem; background: #fff; }
.source-details { margin: 0 0 1rem; color: var(--muted); font-size: .8rem; }
.source-details summary { cursor: pointer; padding: .35rem 0; }
.source-details .field { margin-top: .75rem; max-width: 16rem; }
#source-used-in { font-size: .875rem; line-height: 1.6; margin-top: 1.25rem; }
#source-used-in:empty { display: none; }
#source-used-in ul { padding-left: 1.25rem; margin: .35rem 0 0; }
#source-used-in a { color: var(--blue-dark); text-underline-offset: .2rem; }
#source-prompt-panel { border-top: 1px solid var(--border); margin-top: 1rem; padding-top: 1rem; }
#source-prompt-panel p { color: var(--muted); font-size: .875rem; line-height: 1.6; }
#source-prompt { font-size: .75rem; }
#source-save-status[data-error="true"], #source-prompt-status[data-error="true"] { color: #a12424; }
@media (max-width: 720px) {
  .sources-heading > div:first-child { flex-basis: 100%; }
  .sources-actions { width: 100%; }
  .sources-selection .context-button { flex: 1 1 auto; }
  .source-editor-actions .context-button { flex: 1 1 auto; }
}

.source-add-menu { position: relative; }
.source-add-menu[hidden], .source-image[hidden] { display: none; }
.source-add-menu summary { cursor: pointer; list-style: none; }
.source-add-menu summary::-webkit-details-marker { display: none; }
.source-add-options { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 5; min-width: 12rem; padding: .5rem; background: var(--surface); border: 1px solid var(--border); border-radius: .65rem; box-shadow: 0 .35rem 1rem #1232; }
.source-add-options button { display: block; width: 100%; text-align: left; }
#source-paste-dialog { width: min(42rem, calc(100vw - 2rem)); max-height: 90vh; overflow: auto; padding: 1.5rem; border: 1px solid var(--border); border-radius: .8rem; }
#source-paste-dialog::backdrop { background: #10263180; }
#source-paste-dialog .field { margin-bottom: 1rem; }
.source-image { display: block; max-width: 100%; max-height: 32rem; object-fit: contain; margin: 1rem auto; }