/* Shared identity metadata. Credentials never alter roles or capabilities. */
.pk-member-identity-summary { display: grid; gap: 4px; margin-top: 8px; }
.pk-member-credentials {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
	max-width: 100%;
	color: #AFB2B1;
	font: 500 12px/1.5 Montserrat, sans-serif;
	vertical-align: middle;
}
.pk-member-credentials__title { overflow-wrap: anywhere; }
.pk-member-credentials__badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	max-width: 100%;
	color: #6BC8CC;
}
.pk-member-credentials__badge > span { overflow-wrap: anywhere; }
.pk-member-credentials .pk-member-credentials__artwork {
	box-sizing: border-box;
	display: block;
	flex: 0 0 24px;
	width: 24px;
	height: 24px;
	padding: 0;
	object-fit: contain;
	border: 0;
	border-radius: 0;
	background: transparent;
}

/* Shared display-only identity and achievement components. No avatar rules. */
/* SVG credentials share no control padding or minimum height with the older text badge/status primitive. */
svg.pk-badge,
img.pk-badge--approved-png {
	display: inline-block;
	flex: 0 0 auto;
	width: var(--pk-badge-size, 24px);
	height: var(--pk-badge-size, 24px);
	min-width: 0;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	overflow: visible;
	vertical-align: middle;
}
img.pk-badge--approved-png { object-fit: contain; }
.pk-badge-catalog { margin-top: 24px; }
.pk-badge-catalog__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); gap: 16px; }
.pk-badge-catalog__item { display: grid; justify-items: start; gap: 8px; min-width: 0; }
.pk-badge-catalog__item img { width: 48px; height: 48px; object-fit: contain; background: transparent; border: 0; padding: 0; }
.pk-badge-catalog__item span, .pk-badge-catalog__item small { overflow-wrap: anywhere; }
.pk-badge-group { display: inline-flex; align-items: center; flex-wrap: nowrap; gap: 4px; width: calc(var(--pk-badge-count) * (var(--pk-badge-size, 24px) + 4px) - 4px); max-width: 100%; min-width: 0; vertical-align: middle; }
.pk-badge-info { display: inline-flex; flex-shrink: 0; }
.pk-badge-info[hidden], .pk-badge-panel[hidden], .pk-badge-panel li[hidden], .pk-badge-management [hidden] { display: none; }
button.pk-badge-trigger { display: inline-flex; align-items: center; justify-content: center; width: var(--pk-badge-size, 24px); height: var(--pk-badge-size, 24px); min-width: var(--pk-badge-size, 24px); min-height: 0; flex-shrink: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #6BC8CC; font: 500 12px/1 Montserrat, sans-serif; cursor: pointer; }
button.pk-badge-trigger:hover { background: transparent; color: #7FF3F7; }
button.pk-badge-trigger:focus-visible { outline: 2px solid #6BC8CC; outline-offset: 2px; }
.pk-badge-trigger .pk-badge { width: 100%; height: 100%; object-fit: contain; flex-shrink: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
.pk-badge-panel { position: fixed; z-index: 10000; box-sizing: border-box; width: 260px; max-width: calc(100vw - 16px); max-height: calc(100dvh - 16px); overflow: auto; padding: 12px; border: 1px solid #AFB2B14D; border-radius: 4px; background: #1A1A1A; color: #AFB2B1; font: 500 12px/1.5 Montserrat, sans-serif; overflow-wrap: anywhere; }
.pk-badge-panel > header { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.pk-badge-panel h3 { margin: 0; color: #6BC8CC; font: 600 16px/24px Montserrat, sans-serif; }
.pk-badge-panel > h3, .pk-badge-panel p { margin: 8px 0 0; }
.pk-badge-panel p { font: 500 12px/18px Montserrat, sans-serif; }
.pk-badge-panel__artwork .pk-badge { --pk-badge-size: 48px; width: 48px; height: 48px; object-fit: contain; padding: 0; border: 0; background: transparent; box-shadow: none; }
button.pk-badge-panel__close { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 36px; height: 36px; min-height: 36px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #AFB2B1; cursor: pointer; }
button.pk-badge-panel__close:hover { background: transparent; color: #6BC8CC; }
.pk-badge-panel__close .pk-shared-icon { color: inherit; }
.pk-badge-panel .pk-badge-panel__close .pk-icon__outline { stroke: currentColor; }
.pk-badge-panel :is(button, a):focus-visible, .pk-badge-featured button:focus-visible, .pk-badge-management input:focus-visible { outline: 2px solid #6BC8CC; outline-offset: 2px; }
.pk-badge-panel__overflow-list { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.pk-badge-panel__overflow-list button { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 36px; padding: 0; border: 0; background: transparent; color: #6BC8CC; font: inherit; text-align: left; cursor: pointer; }
.pk-badge-panel__overflow-list button:hover { color: #7FF3F7; }
.pk-badge-panel__overflow-list .pk-badge { width: var(--pk-badge-size, 24px); height: var(--pk-badge-size, 24px); flex-shrink: 0; object-fit: contain; }
.pk-badge-management { margin-top: 24px; display: grid; gap: 16px; }
.pk-badge-management > p, .pk-badge-management h2, .pk-badge-management h3 { margin: 0; }
.pk-badge-management h3 { color: #6BC8CC; font: 600 16px/24px Montserrat, sans-serif; }
.pk-badge-management form { display: grid; gap: 16px; min-width: 0; }
.pk-badge-management__summary, .pk-badge-management__grid, .pk-badge-management__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 12px; min-width: 0; }
.pk-badge-management__summary > div { display: grid; gap: 4px; padding: 16px; background: #1A1A1A; border: 1px solid #AFB2B14D; border-radius: 4px; }
.pk-badge-management__summary strong { color: #6BC8CC; font: 600 24px/32px Montserrat, sans-serif; }
.pk-badge-management__section { display: grid; gap: 16px; min-width: 0; padding: 16px; border: 1px solid #AFB2B14D; border-radius: 4px; background: #1A1A1A; }
.pk-badge-management__section > p { margin: 0; }
.pk-badge-management__list { padding: 0; margin: 0; list-style: none; }
.pk-badge-management__row, .pk-badge-management__official, .pk-badge-management__locked { display: grid; align-content: start; justify-items: start; gap: 12px; min-width: 0; padding: 12px; border: 1px solid #AFB2B14D; border-radius: 4px; background: #121212; overflow-wrap: anywhere; }
.pk-badge-management__details { display: grid; gap: 4px; min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.pk-badge-management__controls { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.pk-badge-management__controls label { display: inline-flex; align-items: center; gap: 4px; }
.pk-badge-management__row .pk-badge--size-collection { width: 48px; height: 48px; object-fit: contain; flex-shrink: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
.pk-badge-featured { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 12px; min-width: 0; padding: 0; margin: 0; list-style: none; }
.pk-badge-featured > li { display: grid; align-content: start; justify-items: start; gap: 8px; min-width: 0; padding: 12px; border: 1px solid #AFB2B14D; border-radius: 4px; background: #121212; overflow-wrap: anywhere; }
.pk-badge-featured__inspect { width: 48px; height: 48px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.pk-badge-featured__controls { display: flex; flex-wrap: wrap; gap: 4px; }
.pk-badge-management .pk-button { min-height: 36px; border: 0; border-radius: 3px; background: #6BC8CC; color: #121212; }
.pk-badge-management .pk-button:not(:disabled):hover { background: #7FF3F7; }
.pk-badge-management .pk-button:disabled { background: #AFB2B14D; color: #121212; cursor: not-allowed; }
.pk-badge-management [data-pk-badge-status] { min-height: 20px; margin: 0; }
.pk-badge--identity.pk-badge--size-compact { --pk-badge-size: 24px; }
.pk-badge--identity.pk-badge--size-large { --pk-badge-size: 24px; }
.pk-badge--achievement { --pk-badge-size: 24px; }
.pk-badge--achievement.pk-badge--size-compact { --pk-badge-size: 24px; }
.pk-badge--achievement.pk-badge--size-collection { --pk-badge-size: 48px; }
.pk-badge--identity.pk-badge--size-collection { --pk-badge-size: 48px; }
.pk-badge__frame,
.pk-badge__ribbons {
	fill: #1A1A1A;
	stroke: #AFB2B1;
}
.pk-badge__symbol {
	fill: none;
	stroke: #6BC8CC;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.pk-badge__symbol .pk-badge__solid {
	fill: #6BC8CC;
	stroke: none;
}
