:root {
  color-scheme: dark;
  --bg: #07090b;
  --surface: #111418;
  --card: rgba(25, 27, 32, 0.82);
  --card-2: rgba(34, 37, 43, 0.82);
  --text: #f5f7fa;
  --muted: #a6abb4;
  --soft: #6f747d;
  --line: rgba(255, 255, 255, 0.09);
  --glass: rgba(255, 255, 255, 0.07);
  --lime: #dfff3f;
  --lime-2: #a7ff2f;
  --green: #36e86b;
  --blue: #59b7ff;
  --purple: #8e6bff;
  --danger: #ff5c7a;
  --radius: 18px;
  --shadow: 0 18px 54px rgba(0, 0, 0, 0.32);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at 82% 4%, rgba(89, 183, 255, 0.12), transparent 26%),
    radial-gradient(circle at 6% 18%, rgba(167, 255, 47, 0.08), transparent 24%),
    var(--bg);
  color: var(--text);
}

button {
  border: 0;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.app-shell {
  position: relative;
  width: min(100%, 560px);
  min-height: 100vh;
  margin: 0 auto;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent 28%),
    var(--bg);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.screen {
  display: none;
  min-height: 100vh;
  padding: 20px 18px 128px;
}

.screen-active {
  display: block;
}

.topbar,
.page-header,
.detail-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.topbar {
  padding-top: max(8px, env(safe-area-inset-top));
  align-items: flex-start;
}

.topbar > div {
  min-width: 0;
}

.detail-topbar {
  position: sticky;
  top: 0;
  z-index: 6;
  margin: -18px -18px 16px;
  padding: max(14px, env(safe-area-inset-top)) 18px 14px;
  background: rgba(7, 9, 11, 0.82);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(16px);
}

.detail-topbar span {
  flex: 1;
  color: var(--muted);
  font-weight: 700;
  text-align: center;
}

.detail-topbar .icon-button + span {
  margin-right: 42px;
}

.detail-topbar.has-trailing .icon-button + span {
  margin-right: 0;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1 {
  max-width: 350px;
  font-size: 32px;
  line-height: 1;
  letter-spacing: 0;
}

h2 {
  font-size: 24px;
  line-height: 1.08;
  letter-spacing: 0;
}

h3 {
  font-size: 20px;
  line-height: 1.15;
  letter-spacing: 0;
}

.eyebrow {
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.icon-button {
  display: grid;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.045);
  backdrop-filter: blur(14px);
}

.partner-button {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  margin-top: 2px;
  padding: 0 13px 0 15px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.035)),
    rgba(255, 255, 255, 0.04);
  color: var(--text);
  font-size: 13px;
  font-weight: 850;
  white-space: nowrap;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(14px);
}

.top-actions {
  display: grid;
  flex: 0 0 auto;
  gap: 8px;
  justify-items: end;
}

.partner-button i {
  width: 7px;
  height: 7px;
  border-top: 2px solid var(--lime);
  border-right: 2px solid var(--lime);
  transform: rotate(45deg);
}

.admin-pill {
  display: none;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  min-height: 42px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.035)),
    rgba(255, 255, 255, 0.045);
  color: var(--lime);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(14px);
}

.gear-icon {
  position: relative;
  width: 21px;
  height: 21px;
}

.gear-icon::before {
  position: absolute;
  inset: 0;
  background: currentColor;
  content: "";
  mask:
    url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.43 12.98c.04-.32.07-.65.07-.98s-.02-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46a.5.5 0 0 0-.61-.22l-2.49 1a7.28 7.28 0 0 0-1.69-.98L14.5 2.42A.49.49 0 0 0 14 2h-4a.49.49 0 0 0-.5.42L9.12 5.07c-.61.24-1.18.56-1.69.98l-2.49-1a.5.5 0 0 0-.61.22l-2 3.46c-.12.22-.07.49.12.64l2.11 1.65c-.04.32-.06.65-.06.98s.02.66.07.98l-2.11 1.65a.5.5 0 0 0-.12.64l2 3.46c.13.22.39.31.61.22l2.49-1c.51.4 1.08.73 1.69.98l.38 2.65c.04.24.25.42.49.42h4c.24 0 .45-.18.49-.42l.38-2.65c.61-.24 1.18-.56 1.69-.98l2.49 1c.23.08.48 0 .61-.22l2-3.46a.5.5 0 0 0-.12-.64l-2.11-1.65ZM12 15.5A3.5 3.5 0 1 1 12 8a3.5 3.5 0 0 1 0 7.5Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  -webkit-mask:
    url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.43 12.98c.04-.32.07-.65.07-.98s-.02-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46a.5.5 0 0 0-.61-.22l-2.49 1a7.28 7.28 0 0 0-1.69-.98L14.5 2.42A.49.49 0 0 0 14 2h-4a.49.49 0 0 0-.5.42L9.12 5.07c-.61.24-1.18.56-1.69.98l-2.49-1a.5.5 0 0 0-.61.22l-2 3.46c-.12.22-.07.49.12.64l2.11 1.65c-.04.32-.06.65-.06.98s.02.66.07.98l-2.11 1.65a.5.5 0 0 0-.12.64l2 3.46c.13.22.39.31.61.22l2.49-1c.51.4 1.08.73 1.69.98l.38 2.65c.04.24.25.42.49.42h4c.24 0 .45-.18.49-.42l.38-2.65c.61-.24 1.18-.56 1.69-.98l2.49 1c.23.08.48 0 .61-.22l2-3.46a.5.5 0 0 0-.12-.64l-2.11-1.65ZM12 15.5A3.5 3.5 0 1 1 12 8a3.5 3.5 0 0 1 0 7.5Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

body.is-admin .is-admin-only {
  display: inline-flex;
}

.inline-stat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  width: fit-content;
  max-width: calc(100vw - 36px);
  margin-top: 14px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
  backdrop-filter: blur(14px);
}

.inline-stat strong {
  color: var(--text);
  font-size: 14px;
}

.icon {
  position: relative;
  display: block;
  width: 20px;
  height: 20px;
}

.icon-back::before {
  position: absolute;
  inset: 3px 0 0 5px;
  width: 12px;
  height: 12px;
  border-bottom: 2px solid var(--text);
  border-left: 2px solid var(--text);
  content: "";
  transform: rotate(45deg);
}

.icon-search::before {
  position: absolute;
  width: 14px;
  height: 14px;
  border: 2px solid var(--text);
  border-radius: 50%;
  content: "";
  transform: translate(1px, 1px);
}

.icon-search::after {
  position: absolute;
  width: 9px;
  height: 2px;
  border-radius: 999px;
  background: var(--text);
  content: "";
  transform: translate(12px, 14px) rotate(45deg);
}

.icon-spark::before {
  position: absolute;
  inset: 2px;
  border: 2px solid var(--lime);
  border-radius: 50%;
  content: "";
}

.icon-spark::after {
  position: absolute;
  top: -1px;
  right: 1px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--lime);
  content: "";
}

.hero-card {
  margin-top: 22px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 22px;
  background: var(--card);
  box-shadow: var(--shadow);
  backdrop-filter: blur(14px);
}

.hero-media,
.card-media,
.detail-media {
  position: relative;
  min-height: 208px;
  overflow: hidden;
  border-radius: 18px;
}

.hero-media::before,
.card-media::before,
.detail-media::before {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 68% 38%, rgba(255, 255, 255, 0.42), transparent 14%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 42%);
  content: "";
  mix-blend-mode: overlay;
}

.media-gold {
  background:
    radial-gradient(circle at 20% 88%, #111, transparent 32%),
    linear-gradient(135deg, #ffce4a, #2a1713 42%, #08090a 100%);
}

.media-pink {
  background:
    radial-gradient(circle at 26% 48%, #ff4ab5, transparent 24%),
    linear-gradient(135deg, #421132, #111418 60%, #07090b);
}

.media-blue {
  background:
    radial-gradient(circle at 78% 18%, #63c7ff, transparent 20%),
    linear-gradient(135deg, #10131a, #142c38 48%, #071013);
}

.media-lime {
  background:
    radial-gradient(circle at 70% 28%, #dfff3f, transparent 18%),
    linear-gradient(135deg, #222b16, #101412 48%, #07090b);
}

.has-upload {
  background:
    linear-gradient(180deg, rgba(7, 9, 11, 0.04), rgba(7, 9, 11, 0.66)),
    var(--banner-image);
  background-position: center;
  background-size: cover;
}

.media-copy {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  display: grid;
  gap: 6px;
}

.media-copy span {
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
  font-weight: 800;
}

.media-copy strong {
  max-width: 300px;
  color: white;
  font-size: 28px;
  line-height: 0.98;
}

.chip {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}

.chip-dark {
  background: rgba(7, 9, 11, 0.72);
  color: var(--lime);
  backdrop-filter: blur(12px);
}

.chip-light {
  background: rgba(223, 255, 63, 0.16);
  color: var(--lime);
}

.date-chip {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  background: rgba(7, 9, 11, 0.58);
  color: rgba(245, 247, 250, 0.82);
  font-size: 12px;
  font-weight: 900;
  backdrop-filter: blur(12px);
}

.hero-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
}

.round-arrow {
  position: relative;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(223, 255, 63, 0.46);
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.86), rgba(54, 232, 107, 0.72)),
    rgba(255, 255, 255, 0.1);
  box-shadow: 0 12px 34px rgba(167, 255, 47, 0.18);
}

.round-arrow::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  border-top: 2px solid #07100a;
  border-right: 2px solid #07100a;
  content: "";
  transform: translate(-58%, -50%) rotate(45deg);
}

.quick-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 14px;
}

.home-add-block {
  margin-top: 14px;
}

.home-add-button {
  justify-content: space-between;
  width: 100%;
  min-height: 58px;
  padding: 0 18px 0 20px;
  border-color: rgba(255, 255, 255, 0.12);
  font-size: 16px;
}

.quick-card {
  display: flex;
  min-height: 56px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--text);
  font-size: 13px;
  font-weight: 850;
  backdrop-filter: blur(14px);
}

.quick-icon,
.nav-icon {
  position: relative;
  display: block;
  width: 22px;
  height: 22px;
}

.wheel-icon::before {
  position: absolute;
  inset: 2px;
  border: 2px solid currentColor;
  border-radius: 50%;
  background:
    radial-gradient(circle, currentColor 0 12%, transparent 13% 100%),
    conic-gradient(
      from 0deg,
      currentColor 0 12deg,
      transparent 12deg 45deg,
      currentColor 45deg 57deg,
      transparent 57deg 90deg,
      currentColor 90deg 102deg,
      transparent 102deg 135deg,
      currentColor 135deg 147deg,
      transparent 147deg 180deg,
      currentColor 180deg 192deg,
      transparent 192deg 225deg,
      currentColor 225deg 237deg,
      transparent 237deg 270deg,
      currentColor 270deg 282deg,
      transparent 282deg 315deg,
      currentColor 315deg 327deg,
      transparent 327deg 360deg
    );
  content: "";
}

.wheel-icon::after {
  position: absolute;
  top: 0;
  left: 9px;
  width: 4px;
  height: 7px;
  border-radius: 999px 999px 2px 2px;
  background: currentColor;
  content: "";
}

.menu-icon::before {
  position: absolute;
  inset: 0;
  background: currentColor;
  content: "";
  mask:
    url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 12C2 11.4477 2.44772 11 3 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H3C2.44772 13 2 12.5523 2 12Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 18C2 17.4477 2.44772 17 3 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H3C2.44772 19 2 18.5523 2 18Z' fill='black'/%3E%3C/svg%3E")
    center / contain no-repeat;
  -webkit-mask:
    url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 12C2 11.4477 2.44772 11 3 11H21C21.5523 11 22 11.4477 22 12C22 12.5523 21.5523 13 21 13H3C2.44772 13 2 12.5523 2 12Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 6C2 5.44772 2.44772 5 3 5H21C21.5523 5 22 5.44772 22 6C22 6.55228 21.5523 7 21 7H3C2.44772 7 2 6.55228 2 6Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M2 18C2 17.4477 2.44772 17 3 17H21C21.5523 17 22 17.4477 22 18C22 18.5523 21.5523 19 21 19H3C2.44772 19 2 18.5523 2 18Z' fill='black'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.menu-icon::after {
  content: none;
}

.user-icon::before {
  position: absolute;
  inset: 0;
  background: currentColor;
  content: "";
  mask:
    url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.78633 14.5C10.929 14.5005 13.0717 14.5005 15.2143 14.5C15.941 14.4998 16.4362 14.4997 16.8686 14.576C18.9386 14.941 20.5594 16.5617 20.9244 18.6318C21.0006 19.0642 21.0005 19.5593 21.0003 20.286C21.0003 20.4444 21.0052 20.6038 20.9775 20.7605C20.868 21.3815 20.3818 21.8677 19.7608 21.9772C19.6246 22.0012 19.4812 22.0005 19.4098 22.0001C14.4707 21.9736 9.52999 21.9736 4.59084 22.0001C4.51947 22.0005 4.37602 22.0012 4.23985 21.9772C3.61883 21.8677 3.13261 21.3815 3.02311 20.7605C2.99549 20.6038 3.00034 20.4444 3.00031 20.286C3.00015 19.5593 3.00004 19.0642 3.07628 18.6318C3.44129 16.5617 5.06202 14.941 7.13208 14.576C7.56449 14.4997 8.05965 14.4998 8.78633 14.5Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.50032 7.5C6.50032 4.46243 8.96276 2 12.0003 2C15.0379 2 17.5003 4.46243 17.5003 7.5C17.5003 10.5376 15.0379 13 12.0003 13C8.96276 13 6.50032 10.5376 6.50032 7.5Z' fill='black'/%3E%3C/svg%3E")
    center / contain no-repeat;
  -webkit-mask:
    url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.78633 14.5C10.929 14.5005 13.0717 14.5005 15.2143 14.5C15.941 14.4998 16.4362 14.4997 16.8686 14.576C18.9386 14.941 20.5594 16.5617 20.9244 18.6318C21.0006 19.0642 21.0005 19.5593 21.0003 20.286C21.0003 20.4444 21.0052 20.6038 20.9775 20.7605C20.868 21.3815 20.3818 21.8677 19.7608 21.9772C19.6246 22.0012 19.4812 22.0005 19.4098 22.0001C14.4707 21.9736 9.52999 21.9736 4.59084 22.0001C4.51947 22.0005 4.37602 22.0012 4.23985 21.9772C3.61883 21.8677 3.13261 21.3815 3.02311 20.7605C2.99549 20.6038 3.00034 20.4444 3.00031 20.286C3.00015 19.5593 3.00004 19.0642 3.07628 18.6318C3.44129 16.5617 5.06202 14.941 7.13208 14.576C7.56449 14.4997 8.05965 14.4998 8.78633 14.5Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.50032 7.5C6.50032 4.46243 8.96276 2 12.0003 2C15.0379 2 17.5003 4.46243 17.5003 7.5C17.5003 10.5376 15.0379 13 12.0003 13C8.96276 13 6.50032 10.5376 6.50032 7.5Z' fill='black'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.user-icon::after {
  content: none;
}

.handshake-icon::before {
  position: absolute;
  inset: 8px 2px;
  border-radius: 10px;
  background: currentColor;
  content: "";
  transform: rotate(-12deg);
}

.handshake-icon::after {
  position: absolute;
  right: 3px;
  bottom: 6px;
  width: 11px;
  height: 11px;
  border-radius: 4px;
  background: var(--lime);
  content: "";
  transform: rotate(18deg);
}

.section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin-top: 26px;
  margin-bottom: 12px;
}

.text-link {
  padding: 0;
  background: transparent;
  color: var(--lime);
  font-weight: 900;
}

.giveaway-list {
  display: grid;
  gap: 12px;
}

.giveaway-card {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.095);
  border-radius: 20px;
  background: var(--card);
  backdrop-filter: blur(14px);
}

.card-media {
  min-height: 178px;
  border-radius: 0;
}

.card-body {
  display: grid;
  gap: 12px;
  padding: 15px 16px 16px;
}

.card-body h3 {
  padding: 0 4px;
}

.card-meta,
.detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.meta-pill {
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.primary-button,
.secondary-button,
.joined-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  min-height: 52px;
  overflow: hidden;
  border-radius: 999px;
  font-size: 16px;
  font-weight: 900;
  isolation: isolate;
}

.primary-button {
  border: 1px solid rgba(223, 255, 63, 0.48);
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.92) 0%, rgba(167, 255, 47, 0.82) 45%, rgba(54, 232, 107, 0.74) 100%),
    rgba(255, 255, 255, 0.08);
  color: #07100a;
  box-shadow: 0 14px 34px rgba(167, 255, 47, 0.16);
  backdrop-filter: blur(12px);
}

.primary-button::after {
  position: absolute;
  top: -40%;
  bottom: -40%;
  left: -45%;
  z-index: -1;
  width: 34%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.52), transparent);
  content: "";
  filter: blur(1px);
  transform: translateX(-120%) rotate(16deg);
  animation: button-shimmer 4.8s ease-in-out infinite;
}

.secondary-button {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.045);
  color: var(--text);
  backdrop-filter: blur(12px);
}

.joined-button {
  border: 1px solid rgba(223, 255, 63, 0.18);
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.11), rgba(255, 255, 255, 0.035)),
    rgba(255, 255, 255, 0.05);
  color: rgba(245, 247, 250, 0.88);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
  backdrop-filter: blur(12px);
}

.check-icon {
  position: relative;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(223, 255, 63, 0.18);
}

.check-icon::after {
  position: absolute;
  top: 4px;
  left: 6px;
  width: 5px;
  height: 8px;
  border-right: 2px solid var(--lime);
  border-bottom: 2px solid var(--lime);
  content: "";
  transform: rotate(45deg);
}

.stats-panel,
.metric-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.stats-panel {
  margin-top: 18px;
}

.stats-panel > div {
  min-height: 120px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--card);
}

.stats-panel strong {
  display: block;
  margin-bottom: 4px;
  font-size: 30px;
  line-height: 1;
}

.stats-panel span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.25;
}

.glass {
  border-color: rgba(255, 255, 255, 0.12);
  background: var(--glass);
  backdrop-filter: blur(16px);
}

.metrics-board {
  position: relative;
  display: grid;
  gap: 16px;
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 22px;
  overflow: hidden;
  background:
    radial-gradient(circle at 86% 0%, rgba(223, 255, 63, 0.2), transparent 26%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.035));
}

.metrics-board::before {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(223, 255, 63, 0.16);
  box-shadow: 0 0 44px rgba(167, 255, 47, 0.16);
  content: "";
  filter: blur(2px);
}

.metrics-board > * {
  position: relative;
  z-index: 1;
}

.metrics-head {
  display: block;
}

.metrics-head h2 {
  max-width: none;
  font-size: 20px;
  white-space: nowrap;
}

.metric-tile {
  min-height: 86px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 18px;
  background: rgba(7, 9, 11, 0.24);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.metric-tile:first-child {
  border-color: rgba(223, 255, 63, 0.22);
  background:
    linear-gradient(145deg, rgba(223, 255, 63, 0.13), rgba(255, 255, 255, 0.035)),
    rgba(7, 9, 11, 0.22);
}

.metric-tile span {
  display: block;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.metric-tile strong {
  display: block;
  font-size: 25px;
  line-height: 1;
}

.metric-tile:first-child strong {
  color: var(--lime);
}

.filter-row {
  display: flex;
  gap: 8px;
  margin: 22px -18px 18px;
  padding: 0 18px;
  overflow-x: auto;
  scrollbar-width: none;
}

.filter-row::-webkit-scrollbar {
  display: none;
}

.filter-chip {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  color: var(--muted);
  font-weight: 900;
}

.filter-chip.active {
  border-color: transparent;
  background: linear-gradient(135deg, var(--lime), var(--green));
  color: #07100a;
}

@media (min-width: 430px) {
  .filter-row {
    display: grid;
    grid-template-columns: 0.72fr 0.92fr 1.28fr 1fr;
    margin-right: 0;
    margin-left: 0;
    padding: 0;
    overflow: visible;
  }

  .filter-chip {
    min-width: 0;
    padding: 0 10px;
  }
}

.detail-media {
  min-height: 360px;
  margin-bottom: 16px;
}

.detail-card,
.conditions-card,
.profile-card,
.coop-hero {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--card);
}

.detail-card,
.conditions-card {
  display: grid;
  gap: 18px;
  padding: 20px;
}

.detail-card p,
.conditions-card p,
.coop-hero p {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.42;
}

.conditions-text {
  white-space: pre-line;
}

.prize-list,
.channel-list {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.prize-list li,
.channel-list li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.06);
  color: var(--muted);
}

.prize-list li {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  align-items: center;
}

.prize-list strong {
  white-space: nowrap;
}

.prize-list span {
  justify-self: end;
  text-align: right;
}

.channel-list li {
  display: block;
  padding: 0;
  background: transparent;
}

.channel-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 54px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.06);
  color: var(--muted);
  text-align: left;
  backdrop-filter: blur(10px);
}

.channel-button span {
  margin-left: auto;
  color: var(--lime);
  font-size: 12px;
  font-weight: 900;
}

.channel-button i {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--lime);
  border-right: 2px solid var(--lime);
  transform: rotate(45deg);
}

.prize-list strong,
.channel-list strong {
  color: var(--text);
}

.sticky-cta {
  position: sticky;
  bottom: 88px;
  z-index: 5;
  display: grid;
  gap: 10px;
  margin-top: 16px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(17, 20, 24, 0.82);
  backdrop-filter: blur(16px);
}

.joined-state {
  display: grid;
  gap: 6px;
  padding: 16px;
  border-radius: 18px;
  background: rgba(223, 255, 63, 0.12);
  color: var(--lime);
  font-weight: 900;
  text-align: center;
}

.joined-state span {
  color: rgba(245, 247, 250, 0.72);
  font-size: 13px;
  font-weight: 700;
}

.requirement-note {
  padding: 0 8px 4px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
}

.profile-avatar {
  display: grid;
  width: 56px;
  height: 56px;
  place-items: center;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--lime), var(--green));
  color: #07100a;
  font-size: 24px;
  font-weight: 900;
}

.profile-card {
  display: grid;
  gap: 1px;
  margin-top: 22px;
  overflow: hidden;
}

.wins-button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 58px;
  margin-top: 14px;
  overflow: hidden;
  border: 1px solid rgba(223, 255, 63, 0.48);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.92) 0%, rgba(167, 255, 47, 0.82) 45%, rgba(54, 232, 107, 0.74) 100%),
    rgba(255, 255, 255, 0.08);
  color: #07100a;
  font-size: 16px;
  font-weight: 950;
  box-shadow: 0 14px 34px rgba(167, 255, 47, 0.16);
  backdrop-filter: blur(12px);
  isolation: isolate;
}

.wins-button::after {
  position: absolute;
  top: -40%;
  bottom: -40%;
  left: -45%;
  z-index: -1;
  width: 34%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.52), transparent);
  content: "";
  filter: blur(1px);
  transform: translateX(-120%) rotate(16deg);
  animation: button-shimmer 4.8s ease-in-out infinite;
}

.wins-button strong {
  position: absolute;
  top: 9px;
  right: 15px;
  display: grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  padding: 0 7px;
  border: 1px solid rgba(7, 16, 10, 0.18);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(223, 255, 63, 0.76)),
    rgba(255, 255, 255, 0.72);
  color: #07100a;
  font-size: 12px;
  line-height: 1;
  box-shadow: 0 8px 20px rgba(7, 16, 10, 0.16);
}

.profile-placement-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  min-height: 58px;
  margin-top: 14px;
  padding: 0 18px;
  border: 1px solid rgba(223, 255, 63, 0.2);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(223, 255, 63, 0.13), rgba(255, 255, 255, 0.045)),
    rgba(255, 255, 255, 0.045);
  color: var(--text);
  font-weight: 900;
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(14px);
}

.profile-placement-button i {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-top: 2px solid var(--lime);
  border-right: 2px solid var(--lime);
  transform: rotate(45deg);
}

.profile-bot-button {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  min-height: 58px;
  margin-top: 14px;
  padding: 0 18px;
  overflow: hidden;
  border: 1px solid rgba(223, 255, 63, 0.42);
  border-radius: 999px;
  background:
    radial-gradient(circle at 16% 14%, rgba(255, 255, 255, 0.28), transparent 30%),
    linear-gradient(135deg, rgba(223, 255, 63, 0.28), rgba(110, 218, 70, 0.14)),
    rgba(255, 255, 255, 0.06);
  color: var(--text);
  font-weight: 950;
  box-shadow: 0 16px 42px rgba(167, 255, 47, 0.14);
  backdrop-filter: blur(14px);
  isolation: isolate;
}

.profile-bot-button::after {
  position: absolute;
  top: -45%;
  bottom: -45%;
  left: -45%;
  z-index: -1;
  width: 34%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.42), transparent);
  content: "";
  filter: blur(1px);
  transform: translateX(-120%) rotate(16deg);
  animation: button-shimmer 4.8s ease-in-out infinite;
}

.profile-bot-button i {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-top: 2px solid var(--lime);
  border-right: 2px solid var(--lime);
  transform: rotate(45deg);
}

.profile-admin-button {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  min-height: 54px;
  margin-top: 12px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--text);
  font-weight: 900;
  backdrop-filter: blur(14px);
}

.profile-admin-button i {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-top: 2px solid var(--lime);
  border-right: 2px solid var(--lime);
  transform: rotate(45deg);
}

.wins-header {
  margin-bottom: 18px;
}

.wins-list {
  display: grid;
  gap: 12px;
}

.win-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 94px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 22px;
}

.win-card span {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.empty-state {
  display: grid;
  gap: 10px;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 22px;
}

.empty-state p {
  color: var(--muted);
  line-height: 1.4;
}

.profile-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 62px;
  padding: 0 16px;
  background: rgba(255, 255, 255, 0.035);
}

.profile-row span {
  color: var(--muted);
  font-weight: 800;
}

.profile-row strong {
  text-align: right;
}

.menu-list {
  display: grid;
  gap: 1px;
  margin-top: 22px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--card);
}

.menu-list button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  padding: 0 18px;
  background: rgba(255, 255, 255, 0.035);
  text-align: left;
}

.menu-list details {
  background: rgba(255, 255, 255, 0.035);
}

.menu-list summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  padding: 0 18px;
  color: var(--text);
  font-weight: 850;
  list-style: none;
  cursor: pointer;
}

.menu-list summary::-webkit-details-marker {
  display: none;
}

.menu-list i {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  border-top: 2px solid var(--soft);
  border-right: 2px solid var(--soft);
  transform: rotate(45deg);
  transition: transform 180ms ease;
}

.menu-list details[open] i {
  transform: rotate(135deg);
}

.menu-list details p {
  margin: -6px 18px 18px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 760;
  line-height: 1.35;
}

.danger-row {
  width: 100%;
  min-height: 58px;
  margin-top: 22px;
  border: 1px solid rgba(255, 92, 122, 0.22);
  border-radius: 18px;
  background: rgba(255, 92, 122, 0.1);
  color: var(--danger);
  font-weight: 900;
}

.coop-hero {
  display: grid;
  gap: 14px;
  padding: 24px;
  background:
    radial-gradient(circle at 82% 14%, rgba(223, 255, 63, 0.22), transparent 24%),
    var(--card);
}

.coop-hero h1 {
  font-size: 37px;
}

.coop-metrics {
  margin-top: 16px;
}

.coop-formats {
  margin-top: 28px;
  margin-bottom: 18px;
}

.pricing-block {
  margin-bottom: 18px;
}

.pricing-head {
  margin-top: 0;
  margin-bottom: 10px;
}

.pricing-head h2 {
  font-size: 22px;
}

.pricing-grid {
  display: grid;
  gap: 9px;
}

.pricing-card {
  position: relative;
  display: grid;
  gap: 8px;
  min-height: 104px;
  padding: 14px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.105);
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.065), rgba(255, 255, 255, 0.032)),
    rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(14px);
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.pricing-card:focus-visible {
  outline: 2px solid rgba(223, 255, 63, 0.7);
  outline-offset: 3px;
}

.pricing-card.selected {
  border-color: rgba(223, 255, 63, 0.74);
  background:
    radial-gradient(circle at 92% 0%, rgba(223, 255, 63, 0.22), transparent 34%),
    linear-gradient(135deg, rgba(223, 255, 63, 0.16), rgba(255, 255, 255, 0.05)),
    rgba(255, 255, 255, 0.055);
}

.pricing-card.selected::after {
  content: "";
  position: absolute;
  top: 14px;
  right: 14px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--lime), #43d45b);
  box-shadow: 0 0 24px rgba(223, 255, 63, 0.34);
}

.pricing-card-featured {
  border-color: rgba(223, 255, 63, 0.32);
  background:
    radial-gradient(circle at 92% 0%, rgba(223, 255, 63, 0.2), transparent 32%),
    linear-gradient(135deg, rgba(223, 255, 63, 0.13), rgba(255, 255, 255, 0.04)),
    rgba(255, 255, 255, 0.045);
}

.pricing-card > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.pricing-card p {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text);
  font-size: 18px;
  font-weight: 950;
}

.pricing-card strong {
  color: var(--lime);
  font-size: 22px;
  line-height: 1;
}

.pricing-card span {
  max-width: 340px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 760;
  line-height: 1.28;
}

.pricing-card small {
  display: inline-flex;
  min-height: 22px;
  align-items: center;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(223, 255, 63, 0.16);
  color: var(--lime);
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

.pricing-block + .primary-button {
  margin-top: 4px;
}

.admin-header {
  margin-bottom: 18px;
}

.admin-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 22px;
}

.admin-summary div {
  display: grid;
  gap: 8px;
  min-height: 78px;
  align-content: center;
  padding: 12px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.045);
}

.admin-summary span,
.admin-row span,
.admin-form label span,
.admin-inline-form label span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 850;
}

.admin-summary strong {
  font-size: 24px;
  line-height: 1;
}

.admin-metrics-section {
  padding-bottom: 120px;
}

.admin-users-entry {
  width: 100%;
  min-height: 58px;
  margin-top: 12px;
  padding: 0 24px;
  box-sizing: border-box;
  justify-content: space-between;
  text-align: left;
}

.admin-users-entry span {
  flex: 0 1 auto;
}

.admin-users-entry i {
  position: relative;
  width: 12px;
  height: 12px;
  flex: 0 0 auto;
  border-top: 3px solid currentColor;
  border-right: 3px solid currentColor;
  opacity: 0.8;
  transform: rotate(45deg);
}

.admin-users-shortcut {
  margin-top: 18px;
}

.admin-users-shortcut .admin-users-entry {
  margin-top: 0;
}

.users-header {
  margin-bottom: 16px;
}

.user-search-panel {
  margin: -2px 0 14px;
}

.user-search-panel input {
  width: 100%;
  min-height: 54px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 18px;
  outline: 0;
  background: rgba(255, 255, 255, 0.055);
  color: var(--text);
  font: inherit;
  font-size: 15px;
  font-weight: 850;
  backdrop-filter: blur(14px);
}

.user-search-panel input:focus {
  border-color: rgba(223, 255, 63, 0.38);
}

.users-filter-row {
  margin-bottom: 14px;
}

.users-list {
  display: grid;
  gap: 12px;
  padding-bottom: 120px;
}

.user-row {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 22px;
  cursor: pointer;
}

.user-row.selected {
  border-color: rgba(223, 255, 63, 0.28);
  background:
    radial-gradient(circle at 96% 0%, rgba(223, 255, 63, 0.1), transparent 28%),
    rgba(255, 255, 255, 0.045);
}

.user-row.risk-medium {
  border-color: rgba(255, 220, 114, 0.24);
}

.user-row.risk-high {
  border-color: rgba(255, 115, 115, 0.3);
}

.user-row-main {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  align-items: center;
  min-width: 0;
}

.user-avatar {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 16px;
  background: linear-gradient(135deg, #86d7ff, var(--lime));
  color: #06080a;
  font-size: 18px;
  font-weight: 950;
}

.user-row h3 {
  margin: 3px 0 5px;
  color: var(--text);
  font-size: 20px;
  line-height: 1.05;
}

.user-row span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 820;
}

.user-badges,
.user-actions,
.user-wins {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.user-badges span,
.user-wins span {
  min-height: 34px;
  padding: 9px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.055);
}

.user-badges .user-risk-pill {
  color: var(--text);
}

.user-badges .risk-clean {
  background: rgba(223, 255, 63, 0.1);
  color: var(--lime);
}

.user-badges .risk-low,
.user-badges .risk-medium {
  background: rgba(255, 220, 114, 0.12);
  color: #ffdc72;
}

.user-badges .risk-high {
  background: rgba(255, 115, 115, 0.12);
  color: #ff9c9c;
}

.user-risk-details {
  display: grid;
  gap: 8px;
  padding: 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
}

.user-risk-details p {
  margin: 0;
  color: #ffdc72;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.35;
}

.user-actions {
  padding-top: 2px;
}

.user-actions .secondary-button,
.user-actions .danger-row {
  width: auto;
  min-height: 46px;
  margin-top: 0;
  padding: 0 16px;
}

.user-actions button:disabled {
  opacity: 0.42;
}

.user-danger-action {
  border-radius: 999px;
}

.admin-metrics-form {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.105);
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 0%, rgba(223, 255, 63, 0.1), transparent 32%),
    rgba(255, 255, 255, 0.035);
}

.admin-metrics-intro p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 760;
  line-height: 1.35;
}

.admin-metric-row {
  display: grid;
  grid-template-columns: 1fr 112px 124px;
  gap: 8px;
  align-items: center;
  min-height: 72px;
  padding: 10px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.045);
}

.admin-metric-row > div {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.admin-metric-row strong {
  color: var(--text);
  font-size: 15px;
  line-height: 1.05;
}

.admin-metric-row span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}

.admin-metric-row select,
.admin-metric-row input {
  width: 100%;
  min-height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.22);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 900;
}

.admin-metric-row select {
  padding: 0 10px;
}

.admin-metric-row label {
  position: relative;
  display: block;
}

.admin-metric-row input {
  padding: 0 28px 0 10px;
}

.admin-metric-row input:disabled {
  opacity: 0.45;
}

.admin-metric-row label span {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  color: var(--lime);
}

.admin-package-grid {
  display: grid;
  gap: 12px;
}

.admin-package-card {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.095);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.035);
}

.admin-package-card legend {
  padding: 0 8px;
  color: var(--lime);
  font-size: 13px;
  font-weight: 950;
  text-transform: uppercase;
}

.admin-welcome-preview {
  display: grid;
  gap: 8px;
}

.admin-welcome-preview img {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  border: 1px solid rgba(255, 255, 255, 0.095);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.035);
}

.admin-welcome-preview span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-form,
.admin-inline-form {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 24px;
}

.admin-form {
  margin-top: 16px;
}

.admin-inline-form {
  margin-top: 2px;
  padding: 14px;
  border-color: rgba(223, 255, 63, 0.18);
  background: rgba(255, 255, 255, 0.035);
}

.admin-form label,
.admin-inline-form label {
  display: grid;
  gap: 8px;
}

.admin-form .checkbox-field,
.admin-inline-form .checkbox-field {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 54px;
  padding: 12px 14px;
  border: 1px solid rgba(223, 255, 63, 0.18);
  border-radius: 18px;
  background: rgba(223, 255, 63, 0.055);
}

.admin-form .checkbox-field input,
.admin-inline-form .checkbox-field input {
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  margin: 0;
  accent-color: var(--lime);
}

.admin-form .checkbox-field span,
.admin-inline-form .checkbox-field span {
  color: var(--text);
  font-size: 15px;
  font-weight: 900;
}

.admin-form input,
.admin-form textarea,
.admin-form select,
.admin-inline-form input,
.admin-inline-form textarea,
.admin-inline-form select {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 15px;
  outline: 0;
  background: rgba(255, 255, 255, 0.055);
  color: var(--text);
  font: inherit;
  font-weight: 800;
}

.admin-form input,
.admin-form select,
.admin-inline-form input,
.admin-inline-form select {
  min-height: 48px;
  padding: 0 14px;
}

.admin-form select,
.admin-inline-form select {
  appearance: none;
}

.admin-form input[type="file"],
.admin-inline-form input[type="file"] {
  display: grid;
  align-items: center;
  padding: 12px 14px;
  color: var(--muted);
}

.admin-form input[type="file"]::file-selector-button,
.admin-inline-form input[type="file"]::file-selector-button {
  margin-right: 12px;
  padding: 10px 14px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--lime), var(--green));
  color: #07100a;
  font: inherit;
  font-size: 13px;
  font-weight: 900;
}

.admin-form textarea,
.admin-inline-form textarea {
  min-height: 116px;
  padding: 14px;
  line-height: 1.35;
  resize: vertical;
}

.admin-form small,
.admin-inline-form small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.admin-form-actions,
.admin-row-actions {
  display: grid;
  gap: 10px;
}

.admin-view-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin: -2px 0 22px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.045);
  backdrop-filter: blur(12px);
}

.admin-view-tabs button {
  min-height: 38px;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.admin-view-tabs button.active {
  background: linear-gradient(135deg, var(--lime), var(--green));
  color: #07100a;
}

.admin-actions-menu {
  display: grid;
  gap: 10px;
}

.admin-actions-menu summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--text);
  font-weight: 900;
  list-style: none;
  cursor: pointer;
}

.admin-actions-menu summary::-webkit-details-marker {
  display: none;
}

.admin-actions-menu summary i {
  width: 9px;
  height: 9px;
  border-right: 2px solid var(--lime);
  border-bottom: 2px solid var(--lime);
  transform: rotate(45deg);
  transition: transform 180ms ease;
}

.admin-actions-menu[open] summary i {
  transform: rotate(225deg);
}

.admin-status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding-top: 8px;
}

.admin-status-actions button {
  min-height: 34px;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.045);
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}

.admin-status-actions [data-action="archive-giveaway"] {
  border-color: rgba(255, 115, 115, 0.22);
  color: #ff9c9c;
}

.admin-actions-menu .admin-row-actions {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.hidden {
  display: none !important;
}

.admin-section {
  margin-top: 24px;
}

.admin-section-head {
  margin-top: 0;
}

.admin-list {
  display: grid;
  gap: 12px;
}

.admin-row {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 22px;
}

.admin-row h3 {
  margin-bottom: 8px;
}

.admin-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 8px;
}

.admin-badges span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  padding: 0 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.055);
}

.admin-status {
  color: var(--text);
}

.admin-status.status-draft {
  color: rgba(245, 247, 250, 0.66);
}

.admin-status.status-new,
.admin-status.status-all {
  color: var(--lime);
}

.admin-status.status-ending {
  color: #ffdc72;
}

.admin-status.status-completed {
  color: #80b9ff;
}

.admin-status.status-archived {
  color: rgba(245, 247, 250, 0.46);
}

.admin-status.status-home-banner {
  color: var(--lime);
}

.admin-home-banner {
  display: grid;
  gap: 14px;
  margin-top: 16px;
  padding: 18px;
  border: 1px solid rgba(223, 255, 63, 0.22);
  border-radius: 24px;
  background:
    radial-gradient(circle at 86% 18%, rgba(223, 255, 63, 0.18), transparent 32%),
    rgba(255, 255, 255, 0.035);
}

.admin-home-banner h3 {
  margin-top: 4px;
  font-size: 22px;
}

.admin-home-banner span {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.admin-home-banner.is-empty {
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.03);
}

.admin-row-action {
  min-height: 46px;
}

.danger-action {
  border-color: rgba(255, 115, 115, 0.22);
  color: #ff9c9c;
}

.admin-preview,
.admin-participants {
  display: grid;
  gap: 10px;
  padding-top: 2px;
}

.admin-report-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(223, 255, 63, 0.18);
  border-radius: 20px;
  background:
    radial-gradient(circle at 92% 0%, rgba(223, 255, 63, 0.12), transparent 28%),
    rgba(255, 255, 255, 0.035);
}

.admin-report-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.admin-report-head h4 {
  margin: 0 0 6px;
  color: var(--text);
  font-size: 18px;
  line-height: 1.08;
}

.admin-report-head small {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}

.report-metric-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}

.report-metric-grid div {
  display: grid;
  gap: 6px;
  min-height: 68px;
  align-content: center;
  padding: 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.045);
}

.report-metric-grid strong {
  color: var(--lime);
  font-size: 20px;
  line-height: 1;
}

.report-lines {
  display: grid;
  gap: 8px;
}

.report-lines p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 760;
  line-height: 1.35;
}

.report-lines strong {
  color: var(--text);
}

.admin-preview-card {
  box-shadow: none;
}

.participant-list {
  display: grid;
  gap: 8px;
}

.participant-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.045);
}

.participant-row h4 {
  font-size: 15px;
}

.risk-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.risk-ok,
.risk-score,
.risk-flag {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
}

.risk-ok {
  background: rgba(223, 255, 63, 0.12);
  color: var(--lime);
}

.risk-score {
  background: rgba(255, 255, 255, 0.075);
  color: var(--text);
}

.risk-score-clean {
  background: rgba(223, 255, 63, 0.12);
  color: var(--lime);
}

.risk-score-low,
.risk-score-medium {
  background: rgba(255, 220, 114, 0.11);
  color: #ffdc72;
}

.risk-score-high {
  background: rgba(255, 115, 115, 0.12);
  color: #ff9c9c;
}

.risk-flag {
  background: rgba(255, 220, 114, 0.11);
  color: #ffdc72;
}

.bottom-nav {
  position: fixed;
  right: max(14px, calc((100vw - 460px) / 2 + 14px));
  bottom: max(10px, env(safe-area-inset-bottom));
  left: max(14px, calc((100vw - 460px) / 2 + 14px));
  z-index: 10;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  max-width: 432px;
  margin: 0 auto;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 26px;
  background: rgba(17, 20, 24, 0.82);
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(18px);
}

.nav-item {
  display: grid;
  justify-items: center;
  gap: 4px;
  min-height: 54px;
  padding: 8px 0 6px;
  border-radius: 20px;
  background: transparent;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.nav-item.active {
  background: rgba(223, 255, 63, 0.11);
  color: var(--lime);
}

.toast {
  position: fixed;
  right: max(18px, calc((100vw - 460px) / 2 + 18px));
  bottom: 98px;
  left: max(18px, calc((100vw - 460px) / 2 + 18px));
  z-index: 20;
  display: none;
  max-width: 424px;
  margin: 0 auto;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(17, 20, 24, 0.92);
  color: var(--text);
  box-shadow: var(--shadow);
  backdrop-filter: blur(16px);
}

.toast.show {
  display: block;
}

.modal-layer {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: none;
  align-items: end;
  justify-content: center;
  padding: 18px max(18px, calc((100vw - 460px) / 2 + 18px)) 92px;
  background: rgba(0, 0, 0, 0.38);
}

.modal-layer.show {
  display: flex;
}

.modal-card {
  display: grid;
  width: min(100%, 424px);
  gap: 16px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 24px;
  background: rgba(17, 20, 24, 0.92);
  box-shadow: var(--shadow);
}

.modal-card label {
  display: grid;
  gap: 10px;
}

.modal-card label span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 900;
}

.modal-card input {
  width: 100%;
  min-height: 52px;
  padding: 0 16px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 16px;
  outline: 0;
  background: rgba(255, 255, 255, 0.06);
  color: var(--text);
  font: inherit;
  font-weight: 800;
}

.modal-card input:focus {
  border-color: rgba(223, 255, 63, 0.42);
}

.modal-actions {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 10px;
}

@media (max-width: 374px) {
  h1 {
    font-size: 30px;
  }

  .screen {
    padding-right: 14px;
    padding-left: 14px;
  }

  .stats-panel {
    grid-template-columns: 1fr;
  }

  .admin-metric-row {
    grid-template-columns: 1fr 100px;
  }

  .admin-metric-row label {
    grid-column: 1 / -1;
  }
}

@keyframes button-shimmer {
  0%,
  62% {
    opacity: 0;
    transform: translateX(-120%) rotate(16deg);
  }

  70% {
    opacity: 0.9;
  }

  84%,
  100% {
    opacity: 0;
    transform: translateX(420%) rotate(16deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .primary-button::after {
    animation: none;
  }
}

@supports not (backdrop-filter: blur(1px)) {
  .glass,
  .detail-topbar,
  .sticky-cta,
  .bottom-nav,
  .toast {
    background: #171a1f;
  }
}
