/* Keep the original compact circle grid and inline controls. */
.ug-library [hidden] { display: none !important; }
.ug-library .user-icons-header { flex-wrap: wrap; }
.ug-library .user-icons-controls { flex-wrap: wrap; }
.ug-library .user-icons { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.ug-library .user-icon {
  box-sizing: border-box; flex: 0 0 56px; width: 56px; height: 56px;
  border-radius: 50%; padding: 0; margin: 0; color: #202020;
  cursor: pointer; font-family: inherit; box-shadow: none;
}
.ug-library .user-icon .user-icon-text {
  padding: 0; line-height: 1.1; letter-spacing: 0; font-weight: 700;
  color: #202020; -webkit-text-stroke: 2px white; paint-order: stroke fill;
}
.ug-library .user-icon-text > span { display: block; white-space: nowrap; }
.ug-library .user-icons-controls [aria-pressed="true"] { outline: 2px solid var(--primary, #4285f4); }
.ug-library button:focus-visible { outline: 2px solid var(--primary, #4285f4); outline-offset: 2px; }
.ug-library .ug-status { margin: 6px 0; font-size: 12px; line-height: 1.5; }
.ug-library .ug-error { color: #b32636; }
.ug-library .ug-color-panel { margin: 8px 0; font-size: 12px; line-height: 1.5; }
.ug-library .ug-color-tools, .ug-library #ug-palette { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ug-library .ug-color-tools { margin-top: 6px; }
.ug-library .ug-color-choice {
  box-sizing: border-box; width: 32px; height: 32px; border: 1px solid #777;
  border-radius: 50%; padding: 0; margin: 0; font-size: 14px; font-weight: bold;
  color: #202020; -webkit-text-stroke: 2px white; paint-order: stroke fill; cursor: pointer;
}
.ug-library .ug-color-choice[aria-pressed="true"] { outline: 2px solid var(--primary, #4285f4); outline-offset: 1px; }
.ug-library .ug-data { margin-top: 8px; font-size: 12px; }
.ug-library .ug-data > summary { cursor: pointer; color: #666; }
.ug-library .ug-data-tools { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ug-library #ug-import-preview { margin-top: 8px; }
body.dark-mode .ug-library .ug-data > summary { color: #bbb; }
body.dark-mode .ug-library .ug-error { color: #ff9aaa; }
body.dark-mode .ug-library .user-icon .user-icon-text { color: #202020; }
.ug-library .ug-row { margin-top: 8px; padding-top: 6px; border-top: 1px solid #ddd; min-width: 0; }
.ug-library .ug-row:first-child { border-top: 0; padding-top: 0; }
.ug-library .ug-row-head { display: flex; align-items: center; gap: 3px; min-height: 24px; font-size: 12px; }
.ug-library .ug-row-name { font-weight: 600; overflow-wrap: anywhere; min-width: 0; }
.ug-library .ug-pencil, .ug-library .ug-row-delete { background: transparent; color: #666; border: 0; padding: 4px; margin: 0; cursor: pointer; font: inherit; }
.ug-library .ug-pencil { display: inline-flex; align-items: center; flex: 0 0 24px; justify-content: center; height: 24px; }
.ug-library .ug-row-delete { margin-left: auto; flex: 0 0 28px; height: 28px; padding: 0; font-size: 22px; line-height: 28px; color: #b32636; border-radius: 4px; }
.ug-library .ug-row-delete[aria-pressed="true"] { background: #fce2e5; outline: 1px solid #b32636; }
.ug-library .ug-category-will-delete { outline: 1px dashed #b32636; outline-offset: 3px; }
.ug-library .ug-category-will-delete .ug-row-name { text-decoration: line-through; color: #b32636; }
.ug-library .ug-row-icons { margin-top: 4px; min-height: 56px; }
.ug-library .ug-row-editor { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; width: 100%; }
.ug-library .ug-row-name-input { box-sizing: border-box; width: 180px; max-width: 100%; min-height: 30px; margin: 0; padding: 3px 6px; font-size: 16px; border: 1px solid #aaa; border-radius: 4px; }
.ug-library .ug-row-editor .ug-error { width: 100%; }
.ug-library .ug-row-editor .ug-error:empty { display: none; }
.ug-library #ug-add-row { margin-top: 8px; }
.ug-library .ug-row-dragover { outline: 2px dashed var(--primary, #4285f4); outline-offset: 2px; }
.ug-library .ug-move-here { margin-left: 6px; white-space: nowrap; }
.ug-library .mode-reorder .user-icon { cursor: grab; border-color: #64b5f6; }
.ug-library .mode-delete .user-icon { border-color: #e57373; }
.ug-library button:disabled { cursor: default; opacity: .5; }
.ug-library #ug-import-rows { max-height: 360px; overflow: auto; padding: 4px 6px; border: 1px solid #ddd; border-radius: 4px; }
.ug-library .ug-preview-icon { cursor: default; }
body.dark-mode .ug-library .ug-row, body.dark-mode .ug-library #ug-import-rows { border-color: #444; }
body.dark-mode .ug-library .ug-pencil, body.dark-mode .ug-library .ug-row-delete { color: #bbb; }
body.dark-mode .ug-library .ug-row-name-input { background: #222; color: #eee; border-color: #777; }
body.dark-mode .ug-library .ug-row-delete, body.dark-mode .ug-library .ug-category-will-delete .ug-row-name { color: #ff9aaa; }
body.dark-mode .ug-library .ug-row-delete[aria-pressed="true"] { background: #512d34; outline-color: #ff9aaa; }
.ug-library .ug-storage-note { margin: 6px 0 0; font-size: 11px; color: #666; }
body.dark-mode .ug-library .ug-storage-note { color: #bbb; }
