#view-admin {
  --admin-card-border: color-mix(in srgb, var(--cyan, #75dbe6) 22%, var(--line));
  --admin-card-hover: color-mix(in srgb, var(--cyan, #75dbe6) 9%, transparent);
  --admin-card-ink: var(--text, #f0f7fa);
  --admin-card-muted: var(--muted, #a4b4c1);
}
#view-admin .admin-control-head {
  border: 1px solid var(--admin-card-border);
  background: linear-gradient(110deg, var(--admin-card-hover), transparent 70%), var(--panel);
}
#view-admin .admin-control-title h2 { font-size: clamp(1.25rem, 2.5vw, 1.7rem); }
#view-admin .admin-control-title p { color: var(--admin-card-muted); }
#view-admin .admin-refresh-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: .65rem;
}
#view-admin .admin-refresh-group {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: .75rem;
  margin: .55rem 0 .05rem;
  padding-inline: .15rem;
  color: var(--admin-card-muted);
  font-size: .73rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#view-admin .admin-refresh-group::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--admin-card-border);
}
#view-admin .admin-refresh-stack > :is(.admin-section, .admin-refresh-roulette) {
  --section-accent: var(--cyan, #75dbe6);
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--admin-card-border);
  border-radius: .85rem;
  color: var(--admin-card-ink);
  background: var(--panel);
}
#view-admin .admin-refresh-stack > :is([data-admin-section="promo"], [data-admin-section="catalog"]) {
  --section-accent: #e7bd76;
}
#view-admin .admin-refresh-stack > :is([data-admin-section="integrations"], [data-admin-section="audit"], .admin-refresh-roulette) {
  --section-accent: #baa9f4;
}
#view-admin .admin-refresh-stack > :is(.admin-section[open], .admin-refresh-roulette) { grid-column: 1 / -1; }
#view-admin .admin-refresh-stack > details[open] { border-color: color-mix(in srgb, var(--section-accent) 42%, var(--line)); }

#view-admin .admin-refresh-stack > details > .admin-section-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: .68rem;
  min-height: 4.65rem;
  padding: .65rem .85rem;
  color: var(--admin-card-ink);
  list-style: none;
  cursor: pointer;
}
#view-admin .admin-refresh-stack > details > .admin-section-summary::-webkit-details-marker { display: none; }
#view-admin .admin-refresh-stack > details > .admin-section-summary:hover,
#view-admin .admin-refresh-stack > details[open] > .admin-section-summary {
  background: color-mix(in srgb, var(--section-accent) 9%, transparent);
}
#view-admin .admin-refresh-stack > details > .admin-section-summary:focus-visible {
  outline: 2px solid var(--section-accent);
  outline-offset: -3px;
}
#view-admin .admin-refresh-stack > details > .admin-section-summary::after {
  content: '';
  grid-column: 4;
  justify-self: center;
  width: .55rem;
  height: .55rem;
  margin: 0 .3rem .25rem;
  border: solid var(--section-accent);
  border-width: 0 2px 2px 0;
  border-radius: 0;
  transform: rotate(45deg);
  transition: transform .16s ease;
}
#view-admin .admin-refresh-stack > details[open] > .admin-section-summary::after {
  content: '';
  transform: translateY(.25rem) rotate(225deg);
}
#view-admin .admin-refresh-stack .admin-section-icon {
  display: grid;
  width: 2.4rem;
  height: 2.4rem;
  border: 1px solid color-mix(in srgb, var(--section-accent) 28%, transparent);
  border-radius: .68rem;
  color: var(--section-accent);
  background: color-mix(in srgb, var(--section-accent) 11%, transparent);
}
#view-admin .admin-refresh-stack .admin-section-icon svg { width: 1.25rem; height: 1.25rem; }
#view-admin .admin-refresh-stack .admin-section-copy strong {
  color: var(--admin-card-ink);
  font-size: .92rem;
  line-height: 1.25;
}
#view-admin .admin-refresh-stack .admin-section-copy small {
  margin-top: .23rem;
  color: var(--admin-card-muted);
  font-size: .74rem;
  line-height: 1.38;
}
#view-admin .admin-refresh-stack .admin-section-badge {
  grid-column: 3;
  min-height: 1.55rem;
  padding: .2rem .52rem;
  border: 1px solid var(--line);
  border-radius: .5rem;
  color: var(--admin-card-muted);
  font-size: .67rem;
  font-weight: 750;
  white-space: nowrap;
}
#view-admin .admin-refresh-stack > details > .admin-section-body {
  padding: clamp(.68rem, 1.45vw, 1.2rem);
  border-top: 1px solid var(--admin-card-border);
}
#view-admin .admin-refresh-stack > .admin-section[open] > .admin-section-summary { border-bottom: 0; }
#view-admin .admin-refresh-stack .admin-subcard { border: 1px solid var(--line); border-radius: .75rem; }
#view-admin .admin-refresh-stack .admin-subcard-head { margin-bottom: .9rem; }
#view-admin .admin-refresh-stack .admin-subcard-head h3 { font-size: 1rem; }
#view-admin .admin-refresh-stack .admin-section-toolbar small,
#view-admin .admin-refresh-stack .admin-subcard-head small { color: var(--admin-card-muted); font-size: .75rem; }
#view-admin .admin-refresh-stack .admin-promo-create { margin-top: 0; }
#view-admin .admin-refresh-stack .admin-promo-create .admin-inline-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .6rem;
}

#view-admin .admin-refresh-roulette .admin-roulette-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 11.5rem), 1fr));
  min-width: 0;
  gap: .55rem;
  padding: 0;
  margin: 0;
  border: 0;
}
#view-admin .admin-refresh-roulette .admin-roulette-sector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .48rem;
  padding: .65rem;
  border: 1px solid var(--line);
  border-radius: .64rem;
  background: var(--panel2);
}
#view-admin .admin-roulette-sector > strong { grid-column: 1 / -1; font-size: .81rem; }
#view-admin .admin-roulette-sector label {
  display: grid;
  gap: .25rem;
  min-width: 0;
  color: var(--admin-card-muted);
  font-size: .72rem;
}
#view-admin .admin-roulette-sector .input { width: 100%; min-width: 0; padding: .45rem; }
#view-admin .admin-roulette-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .65rem 1rem;
  margin-top: .75rem;
}
#view-admin .admin-roulette-actions { display: flex; flex-wrap: wrap; gap: .4rem; }
#view-admin .admin-roulette-total { font-size: .82rem; }
#view-admin .admin-roulette-status { display: block; margin-top: .24rem; color: var(--admin-card-muted); font-size: .73rem; }
#view-admin .admin-refresh-stack .admin-refresh-warning { color: #ffbe79; }

@media (max-width: 760px) {
  #view-admin .admin-refresh-stack { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
  #view-admin .admin-refresh-stack > details > .admin-section-summary {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .24rem .56rem;
    padding: .65rem;
  }
  #view-admin .admin-refresh-stack > details > .admin-section-summary::after { grid-column: 3; grid-row: 1; }
  #view-admin .admin-refresh-stack .admin-section-badge { grid-column: 2; grid-row: 2; justify-self: start; }
  #view-admin .admin-refresh-stack .admin-section-icon { width: 2rem; height: 2rem; }
  #view-admin .admin-roulette-actions { width: 100%; }
  #view-admin .admin-roulette-actions > .btn { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
  #view-admin .admin-refresh-stack > details > .admin-section-summary::after { transition: none; }
}