.rk-art, .rk-emblem { display: block; flex: none; width: 56px; height: 56px; object-fit: contain; image-rendering: auto; }
.rk-art--blank { border: 1px dashed var(--line-strong); border-radius: var(--r); background: var(--panel-sunken); }
.rk-emblem { width: 40px; height: 40px; }
.rk-rarity { display: inline-flex; align-items: center; gap: .4rem; font: 500 .64rem/1 var(--font-mono); font-stretch: 87.5%; letter-spacing: .1em; text-transform: uppercase; color: var(--body); }
.rk-rarity::before { content: ""; width: 7px; height: 7px; background: var(--rarity, var(--muted)); flex: none; }
[data-rarity="common"] { --rarity: #a39c8c; }
[data-rarity="uncommon"] { --rarity: #f3ece0; }
[data-rarity="rare"] { --rarity: #6fb7ff; }
[data-rarity="epic"] { --rarity: #c08bff; }
[data-rarity="legendary"] { --rarity: #f5b83d; }
[data-rarity="mythic"] { --rarity: #ff6a1a; }

.rk-rows { list-style: none; margin: 0; padding: 0; }
.rk-row { display: grid; grid-template-columns: 2.6rem 32px minmax(0, 1fr) minmax(9rem, auto) 6.5rem; align-items: center; gap: .9rem; padding: .6rem 1.2rem; border-top: 1px solid var(--line-soft); }
.rk-row__pos { font: 500 .8rem/1 var(--font-mono); font-stretch: 87.5%; color: var(--faint); text-align: right; }
.rk-row__avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: var(--panel-raised); border: 1px solid var(--line); color: var(--text); font: 700 .8rem var(--font-sans); }
.rk-row__name { color: var(--text); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rk-row__rank { display: flex; align-items: center; gap: .6rem; }
.rk-row__rank b { display: block; color: var(--text); font-weight: 600; font-size: .9rem; }
.rk-row__rank small, .rk-row__total small { display: block; font: 500 .62rem/1.3 var(--font-mono); font-stretch: 87.5%; letter-spacing: .1em; text-transform: uppercase; color: var(--faint); }
.rk-row__total { text-align: right; font: 500 .95rem/1.2 var(--font-mono); font-stretch: 87.5%; color: var(--text); }
.rk-showcase { display: flex; gap: .3rem; flex-wrap: wrap; }
.rk-showcase:empty { display: none; }
.rk-showcase .rk-art { width: 30px; height: 30px; }
.rk-pager { display: flex; gap: .6rem; justify-content: flex-end; padding: .9rem 1.2rem; border-top: 1px solid var(--line); background: var(--panel-sunken); }
[data-locked="true"] .rk-rows, [data-locked="true"] .rk-grid { opacity: .55; }

.rk-grid { list-style: none; margin: 0; padding: 1px; display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); overflow: hidden; }
.rk-grid > .rk-tile { box-shadow: 0 0 0 1px var(--line); }
.rk-tile { display: flex; gap: 1rem; align-items: flex-start; border: 0; border-radius: 0; padding: 1rem 1.1rem; }
.rk-tile .rk-art { width: 64px; height: 64px; }
.rk-tile__text { min-width: 0; flex: 1; }
.rk-tile__text h3 { font-size: 1rem; margin-bottom: .3rem; }
.rk-tile__text p { margin: 0 0 .55rem; color: var(--muted); font-size: .86rem; line-height: 1.45; }
.rk-tile__meta { display: flex; flex-wrap: wrap; gap: .4rem .9rem; align-items: center; }
.rk-tile__meta .label { font-size: .6rem; }
.rk-tile__pct { margin: .55rem 0 0 !important; font: 500 .7rem/1 var(--font-mono) !important; font-stretch: 87.5%; letter-spacing: .06em; color: var(--body) !important; }
.rk-tile__text p.rk-tile__rule { font: 500 .66rem/1.4 var(--font-mono); font-stretch: 87.5%; letter-spacing: .06em; text-transform: uppercase; color: var(--faint); }
.rk-achievements { margin-top: 1.1rem; }
.rk-achievements .section-head { flex-wrap: wrap; gap: .5rem 1rem; }

.rk-hero { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.5rem; align-items: end; margin: 2.5rem 0 1.5rem; }
.rk-hero h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin: .8rem 0 .6rem; }
.rk-hero p { margin: 0; color: var(--muted); max-width: 40rem; }
.rk-board .rk-row { grid-template-columns: 2.6rem 32px minmax(0, 1fr) auto minmax(9rem, auto) 6.5rem; }
.rk-board .rk-row:first-child { border-top: 0; }
.rk-board .rk-row[data-top="true"] .rk-row__pos { color: var(--text); }
.rk-note { padding: .9rem 1.2rem; border-top: 1px solid var(--line); color: var(--muted); font-size: .86rem; margin: 0; }

.rk-filters { display: flex; flex-wrap: wrap; gap: .6rem; align-items: end; padding: .9rem 1.2rem; border-bottom: 1px solid var(--line); background: var(--panel-sunken); }
.rk-filters label.field { margin: 0; min-width: 8.5rem; }
.rk-filters label.field--grow { flex: 1; min-width: 12rem; }
.rk-studio-row { display: flex; align-items: center; gap: .8rem; }
.rk-studio-row .rk-art { width: 40px; height: 40px; }
.rk-tag { color: var(--faint); font: 500 .62rem/1 var(--font-mono); font-stretch: 87.5%; letter-spacing: .08em; text-transform: uppercase; }

.rk-editor { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 1.1rem; align-items: start; }
.rk-preview { position: sticky; top: 1rem; display: grid; gap: 1rem; justify-items: center; text-align: center; }
.rk-preview__stage { width: 100%; display: grid; place-items: center; padding: 1.4rem 0; background: var(--panel-sunken); border: 1px solid var(--line); border-radius: var(--r); }
.rk-preview__stage .rk-art { width: 192px; height: 192px; }
.rk-preview__sizes { display: flex; gap: 1rem; align-items: end; justify-content: center; }
.rk-preview__sizes .rk-art:nth-child(1) { width: 64px; height: 64px; }
.rk-preview__sizes .rk-art:nth-child(2) { width: 32px; height: 32px; }
.rk-preview__sizes .rk-art:nth-child(3) { width: 22px; height: 22px; }
.rk-preview__name { color: var(--text); font-weight: 700; font-stretch: 125%; }
.rk-fieldset { border: 0; border-top: 1px solid var(--line); margin: 0; padding: 1.1rem 0 .2rem; }
.rk-fieldset:first-of-type { border-top: 0; padding-top: 0; }
.rk-fieldset legend { padding: 0 0 .9rem; }
.rk-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.rk-cols--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rk-cols--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rk-checks { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; margin-bottom: 1rem; }
.rk-glyph { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: .8rem; align-items: center; margin-bottom: 1rem; }
.rk-glyph__now { width: 48px; height: 48px; padding: 6px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r); object-fit: contain; }
.rk-glyph label.field { margin: 0; }
.rk-picker { margin: -.3rem 0 1rem; border: 1px solid var(--line); border-radius: var(--r); background: var(--panel-sunken); }
.rk-picker[hidden] { display: none; }
.rk-picker__head { display: flex; gap: .6rem; align-items: center; padding: .6rem; border-bottom: 1px solid var(--line); }
.rk-picker__head input { flex: 1; min-width: 0; }
.rk-picker__count { color: var(--faint); font: 500 .62rem/1 var(--font-mono); letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.rk-picker__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)); gap: 1px; max-height: 18rem; overflow-y: auto; background: var(--line-soft); }
.rk-picker__item { display: grid; place-items: center; aspect-ratio: 1; padding: 6px; background: var(--line); border: 0; cursor: pointer; }
.rk-picker__item img { width: 100%; height: 100%; object-fit: contain; }
.rk-picker__item:hover { background: var(--line-strong); }
.rk-picker__item[aria-pressed="true"] { outline: 2px solid var(--signal); outline-offset: -2px; background: var(--line-strong); }
.rk-rule-note { color: var(--muted); font-size: .84rem; margin: -.4rem 0 1rem; }

.rk-health { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r-panel); overflow: hidden; margin-bottom: 1.25rem; }
.rk-health > div { background: var(--panel-sunken); padding: 1rem 1.1rem; display: grid; gap: .5rem; align-content: start; }
.rk-health strong { font: 400 1.5rem/1 var(--font-mono); font-stretch: 87.5%; color: var(--text); font-variant-numeric: tabular-nums; }
.rk-health span { font-size: .84rem; color: var(--muted); }
.rk-metrics { width: 100%; border-collapse: collapse; margin-bottom: 1rem; }
.rk-metrics th { text-align: left; font: 500 .6rem/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--faint); padding: 0 .4rem .5rem 0; }
.rk-metrics td { padding: .25rem .4rem .25rem 0; vertical-align: middle; }
.rk-metrics td:first-child { color: var(--body); font: 500 .76rem/1.2 var(--font-mono); font-stretch: 87.5%; }
.rk-metrics input { width: 100%; }

@media (max-width: 1000px) {
	.rk-editor { grid-template-columns: minmax(0, 1fr); }
	.rk-preview { position: static; }
}
@media (max-width: 700px) {
	.rk-row, .rk-board .rk-row { grid-template-columns: 1.8rem 28px minmax(0, 1fr) auto; gap: .5rem .7rem; padding: .6rem .9rem; }
	.rk-row__avatar { width: 28px; height: 28px; }
	.rk-row__rank { grid-column: 3 / 4; }
	.rk-row__total { grid-column: 4; grid-row: 1 / span 2; }
	.rk-board .rk-showcase { grid-column: 3 / -1; }
	.rk-hero { grid-template-columns: minmax(0, 1fr); margin-top: 1.5rem; }
	.rk-cols, .rk-cols--3, .rk-cols--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.rk-health { grid-template-columns: minmax(0, 1fr); }
	.rk-grid { grid-template-columns: minmax(0, 1fr); }
	.rk-filters label.field { min-width: calc(50% - .3rem); flex: 1; }
}
.rk-editor [hidden] { display: none !important; }
.rk-cols > label.field { min-width: 0; }
.rk-cols > label.field > :is(input, select) { width: 100%; min-width: 0; }
.rk-filters label.field > :is(input, select) { width: 100%; min-width: 0; }
@media (max-width: 700px) {
	.rk-filters label.field--grow { min-width: 100%; }
}
.rk-health .pill { justify-self: start; }
.rk-settings label.field small { font: 400 .78rem/1.35 var(--font-sans); letter-spacing: 0; text-transform: none; margin: 0; }
.rk-settings label.field small.hint { color: var(--faint); }
.rk-backfill { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 1rem; align-items: end; margin-top: 1rem; }
.rk-backfill__text { display: grid; gap: .25rem; min-width: 0; }
.rk-backfill__text strong { color: var(--text); font-weight: 600; }
.rk-backfill .field { margin: 0; }
.rk-backfill .field-error { grid-column: 1 / -1; margin: 0; }
@media (max-width: 760px) { .rk-backfill { grid-template-columns: minmax(0, 1fr); align-items: stretch; } }
.rk-danger { display: grid; gap: .8rem; }
.rk-danger p, .rk-danger .alert { margin: 0; }
.rk-danger__row { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.rk-danger__row form { margin: 0; }

.rk-row__avatar--mask { display: block; border: 0; background: none; }
.rk-row__name--mask { display: flex; align-items: center; align-self: center; height: 32px; line-height: 0; color: var(--body); }
.mk-glyphs { display: inline-flex; align-items: center; gap: 2px; color: var(--body); }
.mk-glyph { width: 20px; height: 20px; flex: none; display: block; }
.rk-row[data-masked="true"] .rk-row__name { font-weight: 500; }
