html[data-theme="light"].overview-command-ready #sprites>.stats{display:none}
.mastery-filter-v5{display:flex;gap:6px;flex-wrap:wrap}.mastery-filter-v5 button{min-height:38px;padding:7px 12px;border:1px solid var(--ct-border);border-radius:999px;background:var(--ct-surface-2);color:var(--ct-secondary);font:inherit;font-size:.76rem;font-weight:850;cursor:pointer}.mastery-filter-v5 button.active{background:var(--ct-accent);border-color:var(--ct-accent);color:var(--ct-accent-ink)}.family{content-visibility:auto;contain-intrinsic-size:auto 520px}html[data-sprite-animations="off"] body::before,html[data-sprite-animations="off"] body::after{animation:none!important}
.overview-mastery-group{flex:1 1 100%}.overview-command-center .overview-mastery-group .overview-filters-v5{display:flex;align-items:center;gap:10px;padding:0;border:0;background:none;box-shadow:none}.overview-command-center .overview-mastery-group .overview-filter-title{display:block}.overview-command-center .overview-mastery-group #overviewShownV5{margin-left:auto}
.sprite-animation-preference{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:14px;padding:14px 0;border-top:1px solid var(--ct-border);color:var(--ct-secondary)}.sprite-animation-preference span{display:grid;gap:3px}.sprite-animation-preference small{color:var(--ct-muted);font-weight:500}.sprite-animation-preference input{width:22px;height:22px;accent-color:var(--ct-accent)}
.overview-command-center{display:grid;gap:10px;margin:18px 0 14px}.overview-command-primary,.overview-command-secondary{border:1px solid var(--st-border);border-radius:16px;background:color-mix(in srgb,var(--st-surface) 96%,transparent)}.overview-command-primary{padding:10px}.overview-command-center .toolbar{display:grid;grid-template-columns:minmax(220px,1fr) minmax(145px,auto) minmax(130px,auto) auto;gap:8px;margin:0}.overview-command-secondary{display:flex;align-items:center;gap:12px;padding:10px 12px}.overview-rarity-group{display:flex;align-items:center;gap:9px;min-width:0}.overview-rarity-group>span{color:var(--st-muted);font-size:.6rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.overview-command-center .chips{display:flex;gap:6px;margin:0;overflow:auto;scrollbar-width:none}.overview-command-center .chips::-webkit-scrollbar{display:none}.overview-focus-group{min-width:0;flex:1}.overview-command-center .collection-focus-v4{position:static;display:flex;align-items:center;justify-content:flex-end;gap:10px;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}.overview-command-center .collection-focus-v4>div{gap:8px}.overview-command-center .collection-focus-v4>div>span{display:none}.overview-command-center .collection-focus-v4 button{min-height:36px}.overview-command-center .collection-focus-v4>strong{font-variant-numeric:tabular-nums}.overview-more-filters{position:relative;flex:0 0 auto}.overview-more-filters summary{display:flex;align-items:center;min-height:38px;padding:0 12px;border:1px solid var(--st-border-strong);border-radius:999px;background:var(--st-surface-2);color:var(--st-text-soft);font-size:.68rem;font-weight:850;cursor:pointer;list-style:none;white-space:nowrap}.overview-more-filters summary::-webkit-details-marker{display:none}.overview-more-filters summary::after{content:"+";margin-left:7px;color:var(--st-cyan)}.overview-more-filters[open] summary::after{content:"−"}.overview-more-body{position:absolute;z-index:18;right:0;top:calc(100% + 8px);width:min(560px,calc(100vw - 32px))}.overview-command-center .overview-filters-v5{position:static;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0;padding:12px;border-color:var(--st-border-strong);background:var(--st-surface);box-shadow:var(--st-shadow)}.overview-command-center .overview-filter-title{display:none}.overview-command-center .overview-filters-v5 label{border-color:var(--st-border);background:var(--st-surface-2);color:var(--st-text-soft)}.overview-command-center .overview-filters-v5 strong{grid-column:1/-1;margin:0}html[data-theme="light"] #sprites>:scope>.stats{display:none}html[data-theme="light"] .overview-command-primary,html[data-theme="light"] .overview-command-secondary{box-shadow:none}html[data-theme="light"] .overview-command-center .overview-filters-v5{box-shadow:0 18px 44px rgba(48,43,32,.14)}
@media(max-width:980px){.overview-command-center .toolbar{grid-template-columns:minmax(180px,1fr) 1fr 1fr}.overview-command-center .daily-shortcut-v5{grid-column:1/-1}.overview-command-secondary{align-items:flex-start;flex-wrap:wrap}.overview-rarity-group{flex:1 1 100%}.overview-focus-group{flex:1 1 calc(100% - 130px)}.overview-command-center .collection-focus-v4{justify-content:flex-start}}
@media(max-width:620px){.overview-command-center{margin-top:12px}.overview-command-center .toolbar{position:static;grid-template-columns:1fr 1fr;padding:0;background:none}.overview-command-center .toolbar .input{grid-column:1/-1}.overview-command-secondary{display:grid;gap:10px}.overview-rarity-group{display:grid;gap:6px}.overview-focus-group{overflow:auto}.overview-command-center .collection-focus-v4{position:static;min-width:max-content}.overview-command-center .collection-focus-v4>strong{display:none}.overview-more-filters{justify-self:start}.overview-more-body{position:fixed;left:12px;right:12px;top:auto;bottom:calc(76px + env(safe-area-inset-bottom));width:auto}.overview-command-center .overview-filters-v5{grid-template-columns:1fr}.overview-command-center .overview-filters-v5 strong{grid-column:auto}}

/* Collection controls: rarity and Mastery use separate rows at every width. */
.overview-command-center .overview-command-secondary{display:grid;grid-template-columns:minmax(0,1fr);align-items:start}
.overview-command-center .overview-rarity-group{width:100%;overflow:visible}
.overview-command-center .overview-mastery-group{width:100%;min-width:0}
.overview-command-center .overview-mastery-group .overview-filters-v5{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 18px;width:100%}
.overview-command-center .overview-mastery-group .mastery-filter-v5{justify-content:flex-end;min-width:0}
.overview-command-center .overview-mastery-group #overviewShownV5{grid-column:2;justify-self:end;margin:0;color:var(--st-muted)}
.variantgrid{grid-template-columns:repeat(auto-fit,minmax(112px,1fr))!important;overflow:visible}
.variant.sprite-mastered{outline:1px solid color-mix(in srgb,var(--st-gold) 62%,transparent);outline-offset:3px;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--st-cyan) 30%,transparent));box-shadow:0 0 0 1px color-mix(in srgb,var(--st-gold) 30%,transparent),0 0 26px rgba(255,68,91,.46),0 0 54px rgba(166,93,255,.28),inset 0 0 32px rgba(255,196,94,.13)!important}
@media(max-width:620px){.overview-command-center .overview-mastery-group .overview-filters-v5{grid-template-columns:1fr}.overview-command-center .overview-mastery-group .mastery-filter-v5{justify-content:flex-start}.overview-command-center .overview-mastery-group #overviewShownV5{grid-column:1;justify-self:start}.variantgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(prefers-reduced-motion:reduce){.overview-command-center *{scroll-behavior:auto!important}}


/* Private Sprite Dust balance on Collection overview. */
.collection-dust-overview{
  position:relative;isolation:isolate;display:grid;
  grid-template-columns:52px minmax(250px,1.35fr) minmax(210px,.72fr) minmax(170px,.6fr);
  align-items:center;gap:16px;margin:12px 0 14px;padding:14px 16px;
  overflow:hidden;border:1px solid color-mix(in srgb,var(--st-gold) 42%,var(--st-border));
  border-radius:16px;background:
    radial-gradient(circle at 8% 35%,color-mix(in srgb,var(--st-gold) 20%,transparent),transparent 24%),
    linear-gradient(105deg,color-mix(in srgb,var(--st-cyan) 11%,var(--st-surface)),color-mix(in srgb,var(--st-purple) 13%,var(--st-surface)) 58%,color-mix(in srgb,var(--st-gold) 12%,var(--st-surface)));
  box-shadow:0 12px 34px color-mix(in srgb,var(--st-purple) 12%,transparent)
}
.collection-dust-emblem{display:grid;place-items:center;width:52px;height:52px;border:1px solid color-mix(in srgb,var(--st-gold) 62%,transparent);border-radius:15px;background:color-mix(in srgb,var(--st-gold) 14%,transparent);color:var(--st-gold);font-size:1.5rem;box-shadow:0 0 22px color-mix(in srgb,var(--st-gold) 20%,transparent)}
.collection-dust-copy{min-width:0}.collection-dust-copy h3{margin:2px 0 3px;font-size:1rem}.collection-dust-copy p{margin:0;color:var(--st-muted);font-size:.7rem;line-height:1.45}
.collection-dust-field{display:grid;gap:5px;min-width:0}.collection-dust-field>span:first-child{color:var(--st-text-soft);font-size:.62rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase}
.collection-dust-input{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border:1px solid color-mix(in srgb,var(--st-gold) 50%,var(--st-border));border-radius:12px;background:var(--st-surface-2);overflow:hidden}
.collection-dust-input .input{min-width:0;border:0;border-radius:0;background:transparent;font-size:1rem;font-weight:900;font-variant-numeric:tabular-nums}
.collection-dust-input b{padding:0 11px;color:var(--st-gold);font-size:.56rem;letter-spacing:.1em}
.collection-dust-field small{color:var(--st-muted);font-size:.58rem}
.collection-dust-actions{display:grid;gap:5px;min-width:0}.collection-dust-actions .btn{width:100%;min-height:44px}.collection-dust-actions .sub{min-height:1.15em;font-size:.58rem}.collection-dust-actions .sub[data-state="success"]{color:var(--st-success)}.collection-dust-actions .sub[data-state="error"]{color:var(--st-danger)}
@media(max-width:980px){
  .collection-dust-overview{grid-template-columns:52px minmax(0,1fr) minmax(190px,.75fr)}
  .collection-dust-actions{grid-column:2/-1;grid-template-columns:minmax(150px,220px) minmax(0,1fr);align-items:center}
}
@media(max-width:620px){
  .collection-dust-overview{grid-template-columns:44px minmax(0,1fr);gap:11px;padding:13px}
  .collection-dust-emblem{width:44px;height:44px;border-radius:13px}
  .collection-dust-field,.collection-dust-actions{grid-column:1/-1}
  .collection-dust-actions{grid-template-columns:1fr}.collection-dust-actions .sub{text-align:center}
}


/* Client-side catalogue autocomplete. The existing #search control moves into
   the desktop header without creating a second search state or a database query. */
.header-sprite-search[hidden]{display:none!important}
.header-sprite-search{position:relative;min-width:0}
.header-sprite-search-field{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:6px;min-height:46px;padding:0 12px;border:1px solid var(--st-border-strong);border-radius:12px;background:color-mix(in srgb,var(--st-surface-2) 94%,transparent)}
.header-sprite-search-field>span:first-child{color:var(--st-cyan);font-size:1.15rem;line-height:1}
.header-sprite-search-slot{display:block;min-width:0}
.header-sprite-search .input{width:100%;min-height:42px;padding:0;border:0!important;background:transparent!important;box-shadow:none!important}
.header-sprite-search-results{position:absolute;z-index:60;top:calc(100% + 7px);left:0;right:0;max-height:min(440px,60vh);overflow:auto;padding:6px;border:1px solid var(--st-border-strong);border-radius:12px;background:var(--st-surface);box-shadow:0 18px 44px rgba(0,0,0,.34)}
.header-sprite-search-results[hidden]{display:none}
.header-sprite-search-results button{display:grid;grid-template-columns:46px minmax(0,1fr);align-items:center;gap:10px;width:100%;min-height:54px;padding:5px 8px;border:0;border-radius:8px;background:transparent;color:var(--st-text);text-align:left;cursor:pointer}
.header-sprite-search-results button:hover,.header-sprite-search-results button.active{background:color-mix(in srgb,var(--st-cyan) 10%,var(--st-surface-2))}
.header-sprite-search-results img{width:44px;height:44px;object-fit:contain}
.header-sprite-search-results span,.header-sprite-search-results strong,.header-sprite-search-results small{display:block;min-width:0}
.header-sprite-search-results strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.78rem}
.header-sprite-search-results small{margin-top:2px;color:var(--st-muted);font-size:.65rem}
.sprite-search-target{outline:3px solid var(--st-cyan)!important;outline-offset:4px!important}
@media(prefers-reduced-motion:reduce){.sprite-search-target{scroll-margin-block:20px}}


/* Unified Collection toolbar v2: one status control, one result count, and a single dropdown reserved for sorting. */

.overview-command-center.collection-toolbar-v2{
  container-type:inline-size;
  display:block;
  margin:14px 0 16px;
}
.collection-toolbar-v2__mobile-search{display:none}
.collection-toolbar-v2__strip{
  position:relative;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:9px 12px;
  min-width:0;
  padding:11px 12px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--st-cyan) 24%,var(--st-border));
  border-radius:15px;
  background:
    linear-gradient(110deg,color-mix(in srgb,var(--st-cyan) 7%,var(--st-surface)) 0 36%,color-mix(in srgb,var(--st-purple) 8%,var(--st-surface)) 68%,color-mix(in srgb,var(--st-gold) 6%,var(--st-surface)));
  box-shadow:0 10px 28px color-mix(in srgb,var(--st-purple) 10%,transparent);
}
.collection-toolbar-v2__strip::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:1px;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--st-cyan),var(--st-purple),transparent);
  opacity:.58;
}
.collection-toolbar-v2__group,
.collection-toolbar-v2__sort{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}
.collection-toolbar-v2__label{
  flex:0 0 auto;
  color:var(--st-muted);
  font-size:.56rem;
  font-weight:950;
  letter-spacing:.1em;
  text-transform:uppercase;
  white-space:nowrap;
}
.collection-toolbar-v2__choices,
.collection-toolbar-v2 .chips,
.collection-toolbar-v2 .mastery-filter-v5{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:4px;
  min-width:0;
  margin:0;
}
.collection-toolbar-v2 .overview-filters-v5{
  position:static;
  display:block;
  width:auto;
  margin:0;
  padding:0;
  border:0;
  background:none;
  box-shadow:none;
}
.collection-toolbar-v2 .overview-filter-title,
.collection-toolbar-v2 #overviewShownV5{display:none!important}
.collection-toolbar-v2 [data-collection-status],
.collection-toolbar-v2 [data-r],
.collection-toolbar-v2 [data-mastery-filter]{
  min-height:34px;
  padding:6px 9px;
  border:1px solid var(--st-border-strong);
  border-radius:999px;
  background:color-mix(in srgb,var(--st-surface-2) 94%,transparent);
  color:var(--st-text-soft);
  font:inherit;
  font-size:.65rem;
  font-weight:850;
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  transition:border-color .16s ease,background-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.collection-toolbar-v2 [data-collection-status]:hover,
.collection-toolbar-v2 [data-r]:hover,
.collection-toolbar-v2 [data-mastery-filter]:hover{
  border-color:color-mix(in srgb,var(--st-cyan) 62%,var(--st-border));
  color:var(--st-text);
}
.collection-toolbar-v2 [data-collection-status]:focus-visible,
.collection-toolbar-v2 [data-r]:focus-visible,
.collection-toolbar-v2 [data-mastery-filter]:focus-visible,
.collection-toolbar-v2 #sort:focus-visible,
.collection-toolbar-v2 #openDailyV5:focus-visible{
  outline:3px solid color-mix(in srgb,var(--st-cyan) 72%,transparent);
  outline-offset:2px;
}
.collection-toolbar-v2 [data-collection-status].active{
  border-color:color-mix(in srgb,var(--st-cyan) 72%,white 6%);
  background:color-mix(in srgb,var(--st-cyan) 22%,var(--st-surface-2));
  color:var(--st-text);
  box-shadow:0 0 15px color-mix(in srgb,var(--st-cyan) 22%,transparent);
}
.collection-toolbar-v2 [data-r].active{
  border-color:color-mix(in srgb,var(--st-purple) 72%,var(--st-cyan));
  background:color-mix(in srgb,var(--st-purple) 24%,var(--st-surface-2));
  color:var(--st-text);
  box-shadow:0 0 15px color-mix(in srgb,var(--st-purple) 22%,transparent);
}
.collection-toolbar-v2 [data-mastery-filter].active{
  border-color:color-mix(in srgb,var(--st-gold) 74%,white 5%);
  background:color-mix(in srgb,var(--st-gold) 20%,var(--st-surface-2));
  color:var(--st-text);
  box-shadow:0 0 15px color-mix(in srgb,var(--st-gold) 20%,transparent);
}
.collection-toolbar-v2__sort{margin-left:auto}
.collection-toolbar-v2 #sort{
  width:128px;
  min-height:36px;
  padding:6px 28px 6px 10px;
  border:1px solid var(--st-border-strong);
  border-radius:10px;
  background-color:var(--st-surface-2);
  color:var(--st-text);
  font-size:.68rem;
  font-weight:800;
}
.collection-toolbar-v2 #openDailyV5{
  min-height:36px;
  padding:6px 11px;
  border-color:color-mix(in srgb,var(--st-purple) 52%,var(--st-border));
  border-radius:10px;
  white-space:nowrap;
}
.collection-toolbar-v2__count{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 9px;
  border-left:1px solid var(--st-border);
  color:var(--st-muted);
  font-size:.6rem;
  font-variant-numeric:tabular-nums;
  letter-spacing:.03em;
  white-space:nowrap;
}
.collection-toolbar-v2__legacy[hidden]{display:none!important}

@container (min-width:1900px){
  .collection-toolbar-v2__strip{flex-wrap:nowrap}
  .collection-toolbar-v2__choices,
  .collection-toolbar-v2 .chips,
  .collection-toolbar-v2 .mastery-filter-v5{flex-wrap:nowrap}
  .collection-toolbar-v2__group--status,
  .collection-toolbar-v2__group--rarity,
  .collection-toolbar-v2__group--mastery{flex:0 0 auto}
}
@container (min-width:1000px) and (max-width:1899px){
  .collection-toolbar-v2__strip{
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    align-items:center;
    column-gap:12px;
    row-gap:10px;
  }
  .collection-toolbar-v2__group{width:100%;max-width:100%;overflow:visible}
  .collection-toolbar-v2__group--status{grid-column:1/span 7}
  .collection-toolbar-v2__group--rarity{grid-column:8/-1}
  .collection-toolbar-v2__group--mastery{grid-column:1/span 6}
  .collection-toolbar-v2__sort{grid-column:7/span 2;margin-left:0}
  .collection-toolbar-v2__sort #sort{width:100%;min-width:0}
  .collection-toolbar-v2 #openDailyV5{grid-column:9/span 2;width:100%;min-width:0}
  .collection-toolbar-v2__count{grid-column:11/-1;justify-content:flex-end;min-width:0}
  .collection-toolbar-v2__choices,
  .collection-toolbar-v2 .chips,
  .collection-toolbar-v2 .mastery-filter-v5{flex-wrap:wrap}
}
@container (max-width:999px){
  .collection-toolbar-v2__group--status{flex:1 1 100%}
  .collection-toolbar-v2__group--rarity{flex:1 1 360px}
  .collection-toolbar-v2__group--mastery{flex:1 1 450px}
}
@media(max-width:900px){
  .collection-toolbar-v2__mobile-search{
    display:block;
    margin-bottom:8px;
  }
  .collection-toolbar-v2__mobile-search .toolbar{
    position:static;
    display:block;
    margin:0;
    padding:0;
    border:0;
    background:none;
  }
  .collection-toolbar-v2__mobile-search .header-sprite-search{width:100%}
  .collection-toolbar-v2__group--status,
  .collection-toolbar-v2__group--rarity,
  .collection-toolbar-v2__group--mastery{flex:1 1 100%}
  .collection-toolbar-v2__sort{margin-left:0}
}
@media(max-width:620px){
  .overview-command-center.collection-toolbar-v2{margin-top:10px}
  .collection-toolbar-v2__strip{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:10px;
    padding:10px;
    overflow:visible;
  }
  .collection-toolbar-v2__group{
    grid-column:1/-1;
    display:grid;
    gap:6px;
  }
  .collection-toolbar-v2__choices,
  .collection-toolbar-v2 .chips,
  .collection-toolbar-v2 .mastery-filter-v5{gap:6px}
  .collection-toolbar-v2 [data-collection-status],
  .collection-toolbar-v2 [data-r],
  .collection-toolbar-v2 [data-mastery-filter]{
    flex:1 1 auto;
    min-height:42px;
    padding:8px 11px;
    font-size:.7rem;
  }
  .collection-toolbar-v2__sort{
    display:grid;
    gap:5px;
    min-width:0;
  }
  .collection-toolbar-v2 #sort{
    width:100%;
    min-height:42px;
  }
  .collection-toolbar-v2 #openDailyV5{
    align-self:end;
    min-height:42px;
  }
  .collection-toolbar-v2__count{
    grid-column:1/-1;
    justify-content:center;
    min-height:30px;
    border-top:1px solid var(--st-border);
    border-left:0;
    padding-top:7px;
  }
}
html[data-theme="light"] .collection-toolbar-v2__strip{
  box-shadow:0 8px 22px rgba(56,48,84,.08);
}
@media(prefers-reduced-motion:reduce){
  .collection-toolbar-v2 [data-collection-status],
  .collection-toolbar-v2 [data-r],
  .collection-toolbar-v2 [data-mastery-filter]{transition:none}
}

/* Gameplay checklist: artwork and labels keep their size as the list grows. */
#sprites[data-collection-view="missing-board"]>#grid{display:none!important}
.missing-collection-board[hidden]{display:none!important}
.missing-collection-board{
  --missing-tile-width:136px;
  --missing-art-size:80px;
  display:block;
  width:100%;
  margin:10px 0 18px;
  padding:14px;
  scroll-margin-top:calc(16px + env(safe-area-inset-top));
  border:1px solid color-mix(in srgb,var(--st-cyan) 42%,var(--st-border));
  border-radius:16px;
  background:var(--st-surface);
  color:var(--st-text);
}
.missing-collection-board[data-size="compact"]{--missing-tile-width:112px;--missing-art-size:64px}
.missing-collection-board[data-size="large"]{--missing-tile-width:180px;--missing-art-size:112px}
.missing-collection-board__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px 16px;
  padding-bottom:12px;
}
.missing-collection-board__header>div{display:flex;align-items:baseline;flex-wrap:wrap;gap:9px}
.missing-collection-board__header>div>span{color:var(--st-cyan);font-size:.75rem;font-weight:950;letter-spacing:.1em}
.missing-collection-board__header strong{font-size:1.1rem}
.missing-collection-board__header p{display:grid;gap:4px;margin:0}
.missing-collection-board__header p b{color:var(--st-gold);font-size:.95rem;font-variant-numeric:tabular-nums}
.missing-collection-board__header p small{color:var(--st-muted);font-size:.8rem}
.missing-collection-board__controls{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px 16px;
  padding:10px 0 14px;
  border-top:1px solid var(--st-border);
}
.missing-collection-board__controls>div{display:flex;align-items:center;flex-wrap:wrap;gap:5px}
.missing-collection-board__controls span,
.missing-collection-board__controls label{font-size:.8rem;color:var(--st-text-soft)}
.missing-collection-board__controls label{display:flex;align-items:center;gap:6px;min-height:36px;cursor:pointer}
.missing-collection-board__controls input{width:18px;height:18px;accent-color:var(--st-cyan)}
.missing-collection-board__controls button{
  min-height:36px;
  padding:7px 11px;
  border:1px solid var(--st-border-strong);
  border-radius:8px;
  background:var(--st-surface-2);
  color:var(--st-text);
  font:inherit;
  font-size:.8rem;
  font-weight:800;
  cursor:pointer;
}
.missing-collection-board__controls button[aria-pressed="true"]{
  border-color:var(--st-cyan);
  background:color-mix(in srgb,var(--st-cyan) 18%,var(--st-surface-2));
}
.missing-collection-board__controls button[hidden]{display:none}
#missingFullscreen{margin-left:auto}
#missingFullscreenStatus:empty{display:none}
.missing-collection-board__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--missing-tile-width)),1fr));
  align-items:stretch;
  gap:10px;
  min-width:0;
}
.missing-sprite-tile{
  --missing-accent:var(--st-cyan);
  display:grid;
  grid-template-rows:1fr auto;
  min-width:0;
  border:1px solid var(--st-border-strong);
  border-top:3px solid var(--missing-accent);
  border-radius:12px;
  overflow:hidden;
  background:var(--st-surface-2);
  color:var(--st-text);
  font:inherit;
}
.missing-sprite-tile[data-rarity="epic"]{--missing-accent:var(--st-purple)}
.missing-sprite-tile[data-rarity="legendary"],
.missing-sprite-tile[data-rarity="mythic"]{--missing-accent:var(--st-gold)}
.missing-sprite-open,
.missing-sprite-collect{min-width:0;border:0;color:inherit;font:inherit;cursor:pointer}
.missing-sprite-open{
  display:grid;
  grid-template-rows:var(--missing-art-size) auto;
  align-content:start;
  justify-items:center;
  gap:8px;
  padding:12px 8px 10px;
  background:transparent;
  text-align:center;
}
.missing-sprite-open img{
  width:var(--missing-art-size);
  height:var(--missing-art-size);
  max-width:100%;
  object-fit:contain;
  opacity:.95;
  filter:drop-shadow(0 4px 8px color-mix(in srgb,var(--missing-accent) 24%,transparent));
}
.missing-sprite-tile__copy{display:grid;gap:5px;min-width:0;width:100%}
.missing-sprite-tile__copy strong{
  display:block;
  font-size:.9rem;
  line-height:1.2;
  overflow-wrap:anywhere;
}
.missing-sprite-tile__copy small{
  display:block;
  color:var(--missing-accent);
  font-size:.82rem;
  font-weight:850;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.missing-sprite-collect{
  min-height:36px;
  padding:7px 5px;
  border-top:1px solid var(--st-border-strong);
  background:color-mix(in srgb,var(--missing-accent) 10%,var(--st-surface-2));
  color:var(--st-text);
  font-size:.78rem;
  font-weight:800;
}
.missing-sprite-open:hover,
.missing-sprite-collect:hover{background:color-mix(in srgb,var(--missing-accent) 16%,var(--st-surface-2))}
.missing-sprite-collect:disabled{color:var(--st-muted);background:var(--st-surface);cursor:default}
.missing-sprite-tile[data-collecting="true"]{opacity:.48;pointer-events:none}
.missing-sprite-open:focus-visible,
.missing-sprite-collect:focus-visible,
.missing-collection-board__controls button:focus-visible,
.missing-collection-board__controls input:focus-visible{
  outline:3px solid var(--st-cyan);
  outline-offset:-3px;
}
.missing-collection-board__empty{grid-column:1/-1;padding:24px;margin:0;color:var(--st-muted);text-align:center}
.missing-collection-board:fullscreen{
  display:flex;
  flex-direction:column;
  width:100%;
  height:100%;
  margin:0;
  padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  border:0;
  border-radius:0;
  background:var(--st-surface);
}
.missing-collection-board:fullscreen .missing-collection-board__header,
.missing-collection-board:fullscreen .missing-collection-board__controls{flex:0 0 auto}
.missing-collection-board:fullscreen .missing-collection-board__grid{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  align-content:start;
  padding:3px 4px 8px;
  scrollbar-gutter:stable;
}
html[data-theme="light"] .missing-sprite-collect{color:var(--st-text)}
html[data-theme="light"] .missing-sprite-tile__copy small{color:var(--st-text);background:color-mix(in srgb,var(--missing-accent) 14%,var(--st-surface));border-radius:5px;padding:3px}
@media(max-width:620px){
  .missing-collection-board{padding:10px}
  .missing-collection-board__header{gap:8px}
  .missing-collection-board__header>div{display:grid;gap:3px}
  .missing-collection-board__controls{gap:8px}
  .missing-collection-board__controls button,
  .missing-collection-board__controls label,
  .missing-sprite-collect{min-height:44px}
  .missing-collection-board__grid{gap:8px}
  .missing-sprite-open{padding:10px 6px}
  .missing-sprite-tile__copy strong{font-size:.85rem}
}
@media(prefers-reduced-motion:reduce){
  .missing-collection-board{scroll-behavior:auto}
}

/* Hold one calm loading surface until the final collection layout owns the DOM. */
html[data-collection-ui="loading"] #sprites>#grid{display:block;min-height:420px;position:relative}
html[data-collection-ui="loading"] #sprites>#grid>*{visibility:hidden}
html[data-collection-ui="loading"] #sprites>#grid::before{
  content:"Preparing your collection…";
  position:absolute;
  inset:0 0 auto;
  display:grid;
  place-items:center;
  min-height:220px;
  padding:32px;
  border:1px solid var(--st-border);
  border-radius:18px;
  background:linear-gradient(110deg,color-mix(in srgb,var(--st-cyan) 6%,var(--st-surface)),var(--st-surface),color-mix(in srgb,var(--st-gold) 5%,var(--st-surface)));
  color:var(--st-muted);
  font-weight:850;
  letter-spacing:.02em;
}
