/* One desktop reference beside the current workspace; mobile has no entry points. */
.portal-reference {
  box-sizing: border-box;
  color: var(--ink);
  background: var(--panel-strong);
  backdrop-filter: var(--blur);
  -webkit-backdrop-filter: var(--blur);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  font-size: var(--type-body);
  font-weight: var(--weight-body);
}
.portal-reference {
  position: fixed;
  z-index: 2300;
  top: var(--portal-reference-card-top, var(--space-5));
  right: var(--space-5);
  bottom: var(--portal-reference-card-bottom, max(80px, calc(var(--sdo-native-tray-inset, 0px) + 12px)));
  width: 380px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.portal-reference[hidden] { display: none; }
.portal-reference__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-2);
  padding: var(--space-4);
  border-bottom: 1px solid var(--line);
}
.portal-reference__header h2 { margin: 0; font-size: var(--type-card); font-weight: var(--weight-medium); overflow-wrap: anywhere; }
.portal-reference__header p { margin: var(--space-1) 0 0; font-size: var(--type-caption); color: var(--muted); }
.portal-reference__controls { display: flex; }
.portal-reference__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 var(--space-4); background: var(--card-surface); }
.portal-reference__rows { margin: 0; }
.portal-reference__rows > div { padding: var(--space-3) 0; border-bottom: 1px solid var(--line); }
.portal-reference__rows dt { color: var(--muted); font-size: var(--type-caption); }
.portal-reference__rows dd { margin: var(--space-1) 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--type-body); font-weight: var(--weight-body); line-height: 1.45; }
.portal-reference__body summary { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) 0; cursor: pointer; font-weight: var(--weight-body); list-style: none; }
.portal-reference__body summary::marker { content: ""; }
.portal-reference__body summary::-webkit-details-marker { display: none; }
.portal-reference__chevron { display: inline-flex; flex: 0 0 16px; width: 16px; height: 16px; align-items: center; justify-content: center; color: var(--muted); transition: transform var(--motion-fast); }
.portal-reference__chevron .ui-icon { width: 16px; height: 16px; }
.portal-reference__body details[open] > summary .portal-reference__chevron { transform: rotate(90deg); }
.portal-reference__item { padding: var(--space-2); margin-bottom: var(--space-3); background: var(--surface); border-radius: var(--radius-sm); }
.portal-reference__item h3 { margin: 0; font-size: var(--type-body); font-weight: var(--weight-body); overflow-wrap: anywhere; }
.portal-reference__footer { padding: var(--space-3) var(--space-4); border-top: 1px solid var(--line); }
.portal-reference__footer p { margin: 0 0 var(--space-2); color: var(--muted); font-size: var(--type-caption); line-height: 1.4; }
.portal-reference__footer [role=status]:empty { display: none; }
.portal-reference__footer[hidden] { display: none; }
.portal-reference.is-empty { background: var(--card-surface); backdrop-filter: none; -webkit-backdrop-filter: none; }
.portal-reference.is-empty .portal-reference__body { display: flex; }
.portal-reference__empty { margin: auto; padding: var(--space-5) 0; line-height: 1.5; }
.portal-reference__empty-icon { margin-bottom: var(--space-4); }
.portal-reference__empty h3 { margin: 0 0 var(--space-2); font-size: var(--type-card); font-weight: var(--weight-medium); }
.portal-reference__empty p { margin: 0; color: var(--muted); }
.portal-reference__empty ol { margin: var(--space-4) 0 0; padding-left: var(--space-5); }
.portal-reference__empty li + li { margin-top: var(--space-2); }
.portal-reference-open .ui-icon { transform: scaleX(-1); }
.contract-reference-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-bottom: var(--space-3); }
.portal-reference-pin .ui-icon,
.portal-reference__empty-icon .ui-icon { stroke-width: 1.35; transform: scaleX(-1); }
@media (min-width: 1121px) {
  .window-managed-head > .portal-reference-pin { margin-left: auto; }
  .window-managed-head > .portal-reference-pin ~ .window-minimize { margin-left: 0; }
  #portalWorkspace { margin-right: var(--portal-reference-inset, 0px); }
  /* Retained SDO editors keep their DOM and writer while making room for the reference. */
  :host([data-sdo-native-invoice]) .modal-bg,
  :host([data-sdo-native-material]) .modal-bg {
    /* Keep one continuous backdrop; only the editor's content area is narrowed. */
    right: 0;
    padding-right: calc(var(--portal-reference-inset, 0px) + min(18px, 2vw));
    grid-template-columns: minmax(0, 1fr);
  }
  :host([data-sdo-native-invoice]) .modal-bg > .modal,
  :host([data-sdo-native-material]) .modal-bg > .modal { max-width: 100%; }
}
@media (max-width: 1120px) {
  .portal-reference, .portal-reference-pin, .portal-reference-open { display: none !important; }
}