.pipeline-mode .modal.reference-picker { width: 880px; height: min(720px, calc(100dvh - 48px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid #e0e5ec; border-radius: 12px; display: flex; flex-direction: column; overflow: hidden; }
.reference-picker .modal-head { padding: 22px 26px 8px; margin: 0; flex-shrink: 0; }
.reference-picker .modal-head h2 { font-size: 18px; font-weight: 600; }
.reference-picker .modal-head .icon-button { width: 32px; min-height: 32px; padding: 0; border-color: transparent; background: transparent; color: #8792a1; }
.reference-picker .reference-description { padding: 0 26px; margin: 0 0 20px; color: #7b8592; font-size: 12px; line-height: 1.7; flex-shrink: 0; }
.reference-picker .reference-toolbar { display: flex; align-items: center; gap: 18px; padding: 0 26px 20px; flex-shrink: 0; }
.reference-picker .reference-search { display: flex; align-items: center; gap: 9px; min-width: 0; flex: 1; padding: 8px 11px; border: 1px solid #dfe4eb; border-radius: 6px; background: #fff; }
.reference-picker .reference-search:focus-within { border-color: #7798c3; box-shadow: 0 0 0 2px #527fb112; }
.reference-picker .reference-search svg { width: 16px; height: 16px; color: #929dab; }
.reference-picker .reference-search input { min-width: 0; width: 100%; border: 0; padding: 0; font-size: 12px; color: #354253; background: transparent; }
.reference-picker .reference-search input:focus { box-shadow: none; }
.reference-picker .reference-search input::placeholder { color: #9aa3ae; }
.reference-picker .reference-only { display: flex; align-items: center; gap: 7px; white-space: nowrap; font-size: 12px; color: #737f8f; }
.reference-picker input[type=checkbox] { width: 15px; height: 15px; margin: 0; flex-shrink: 0; accent-color: #507bac; }
.reference-picker .reference-layout { flex: 1; min-height: 0; display: grid; grid-template-columns: 156px minmax(0, 1fr); border-top: 1px solid #edf0f4; }
.reference-picker .reference-categories { padding: 16px 10px; border-right: 1px solid #edf0f4; background: #f9fafb; overflow: auto; }
.reference-picker .reference-categories button { display: flex; align-items: center; gap: 9px; padding: 10px; width: 100%; border-radius: 5px; font-size: 12px; color: #6c7787; text-align: left; margin: 2px 0; min-height: 38px; }
.reference-picker .reference-categories button svg { width: 16px; height: 16px; }
.reference-picker .reference-categories button small { margin-left: auto; color: #929ca9; font-size: 11px; }
.reference-picker .reference-categories button:hover { background: #f0f3f6; }
.reference-picker .reference-categories button[aria-pressed=true] { background: #eaf0f7; color: #375f8c; font-weight: 500; }
.reference-picker .reference-results { overflow: auto; min-height: 0; padding: 20px 22px 24px; scrollbar-gutter: stable; }
.reference-picker .reference-group { border: 0; margin: 0 0 22px; padding: 0; min-width: 0; }
.reference-picker .reference-group:last-of-type { margin-bottom: 0; }
.reference-picker .reference-group legend { display: flex; align-items: center; gap: 10px; width: 100%; padding: 0 0 10px; font-size: 11px; color: #929ba6; flex-wrap: wrap; }
.reference-picker .reference-group legend strong { font-size: 12px; font-weight: 500; color: #586679; }
.reference-picker .reference-group-count { font-size: 11px; margin-left: auto; color: #8b97a5; }
.reference-picker .reference-row { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid #e5e9ee; border-radius: 7px; margin-top: 8px; background: #fff; cursor: pointer; }
.reference-picker .reference-row:hover { border-color: #c4d1e0; background: #fafbfd; }
.reference-picker .reference-row:has(input:checked) { border-color: #c6d7e9; background: #f5f8fc; }
.reference-picker .reference-row:focus-within { outline: 2px solid #7c9cc5; outline-offset: 2px; }
.reference-picker .reference-row > input { margin-top: 4px; }
.reference-picker .reference-file-icon { display: grid; place-items: center; background: #eff2f6; border-radius: 5px; width: 30px; height: 32px; color: #7c8b9d; flex-shrink: 0; }
.reference-picker .reference-file-icon svg { width: 16px; height: 16px; }
.reference-picker .reference-copy { min-width: 0; flex: 1; }
.reference-picker .reference-title { display: block; color: #344256; font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }
.reference-picker .reference-excerpt { color: #798594; font-size: 12px; line-height: 1.7; margin-top: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.reference-picker .reference-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 11px; color: #9aa3ae; margin-top: 6px; }
.reference-picker .reference-meta > span { color: #bbc2ca; }
.reference-picker .modal-footer { display: flex; align-items: center; padding: 16px 26px; margin: 0; border-top: 1px solid #e8ecf1; background: #fff; flex-shrink: 0; gap: 10px; }
.reference-picker .reference-summary { margin-right: auto; display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; font-size: 11px; color: #8b95a2; }
.reference-picker .reference-summary strong { font-weight: 500; font-size: 13px; color: #47576d; }
.reference-picker .reference-summary em { font-style: normal; color: #ad7547; }
.reference-picker .modal-footer .primary:disabled { cursor: not-allowed; }
.reference-picker .reference-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 220px; gap: 10px; color: #9aa4b1; font-size: 12px; }
.reference-picker .reference-empty svg { width: 24px; height: 24px; margin-bottom: 4px; }
.reference-picker .reference-empty strong { font-weight: 500; color: #6d7b8e; font-size: 13px; }
.reference-picker [hidden] { display: none !important; }
@media(max-width: 640px) {
  .pipeline-mode .modal.reference-picker { height: calc(100dvh - 32px); }
  .reference-picker .modal-head { padding: 18px 18px 8px; }
  .reference-picker .reference-description { padding: 0 18px; margin-bottom: 14px; }
  .reference-picker .reference-toolbar { padding: 0 18px 14px; gap: 10px; }
  .reference-picker .reference-layout { display: flex; flex-direction: column; }
  .reference-picker .reference-categories { display: flex; gap: 4px; flex-shrink: 0; padding: 8px 12px; border-right: 0; border-bottom: 1px solid #edf0f4; overflow-x: auto; }
  .reference-picker .reference-categories button { width: auto; white-space: nowrap; flex-shrink: 0; }
  .reference-picker .reference-categories button svg { display: none; }
  .reference-picker .reference-results { flex: 1; padding: 16px; }
  .reference-picker .reference-group legend > span { display: none; }
  .reference-picker .reference-row { gap: 9px; padding: 12px; }
  .reference-picker .reference-file-icon { display: none; }
  .reference-picker .modal-footer { padding: 14px 18px; flex-wrap: wrap; }
  .reference-picker .reference-summary { flex-basis: 100%; }
  .reference-picker .modal-footer .button:first-of-type { margin-left: auto; }
}
