.portrait-library { margin: 0 0 16px; min-width: 0; color: var(--ui-ink); }
.portrait-library summary { cursor: pointer; min-height: 44px; align-content: center; font-weight: 600; }
.portrait-library summary span { font-weight: 400; margin-left: 8px; color: var(--ui-muted); }
.portrait-library .portrait-help,.portrait-library .portrait-status { font-size: 13px; line-height: 1.6; color: var(--ui-muted); margin: 8px 0 12px; overflow-wrap: anywhere; }
.portrait-search { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; }
.portrait-search label { flex: 1 1 140px; min-width: 0; display: grid; gap: 4px; }
.portrait-search input { width: 100%; min-width: 0; }
.portrait-library button { min-height: 44px; }
.portrait-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; max-height: 480px; overflow: auto; padding: 4px; scrollbar-color: var(--ui-line) var(--ui-inset); }
.portrait-library .portrait-item { display: flex; flex-direction: column; align-items: stretch; text-align: left; padding: 0 0 10px; overflow: hidden; border: 1px solid var(--ui-line); background: var(--ui-surface); color: var(--ui-ink); border-radius: var(--ui-radius); box-shadow: none; }
.portrait-library .portrait-item:hover { border-color: var(--ui-accent); }
.portrait-library .portrait-item[aria-pressed="true"] { border-color: var(--ui-accent); background: var(--ui-accent-bg); }
.portrait-image { display: grid; place-items: center; aspect-ratio: 3/4; width: 100%; background: var(--ui-inset); overflow: hidden; }
.portrait-image img { width: 100%; height: 100%; object-fit: contain; }
.portrait-image .portrait-fallback { font-size: 13px; color: var(--ui-muted); }
.portrait-item strong,.portrait-item small,.portrait-item em { margin: 8px 10px 0; overflow-wrap: anywhere; }
.portrait-item strong { font-size: 13px; }
.portrait-item small { font-size: 12px; color: var(--ui-muted); }
.portrait-item em { font-size: 13px; font-style: normal; color: var(--ui-accent); }
.portrait-library .portrait-id-only { padding-top: 10px; align-self: start; }
.portrait-missing { margin: 0 10px; font-size: 12px; color: var(--ui-muted); line-height: 1.6; }
.portrait-item .portrait-asset { font-variant-numeric: tabular-nums; line-height: 1.6; }
.portrait-item .portrait-test { color: var(--ui-ink); line-height: 1.6; }
.portrait-item em { margin-top: auto; padding-top: 10px; }
.portrait-selected { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 12px; }
.portrait-selected:empty { display: none; }
.portrait-selected button { white-space: normal; }
.portrait-pages { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 12px; }
.portrait-pages span { font-variant-numeric: tabular-nums; }
.portrait-library :is(button,input,summary):focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 3px; }
.portrait-library [hidden] { display: none !important; }