:root {
  
  --bg-0: #0e0e10;          
  --bg-1: #141416;          
  --bg-2: #1a1a1d;          
  --bg-3: #232327;          
  --bg-4: #2c2c30;          

  
  --line-1: rgba(255,255,255,0.06);
  --line-2: rgba(255,255,255,0.10);

  
  --text-1: #f4f4f5;        
  --text-2: #b8b8be;        
  --text-3: #76767e;        
  --text-4: #56565c;        

  
  --red-1: #ff3a3a;
  --red-2: #e02424;         
  --red-3: #b91818;
  --red-4: #7a0e0e;
  --red-glow: 0 0 0 1px rgba(224,36,36,0.3), 0 8px 24px rgba(224,36,36,0.18);

  
  --green: #2ecc71;
  --gold: #d6a93a;
  --blue: #3a8bff;
  --avatar-fallback-bg: linear-gradient(145deg, var(--bg-4) 0%, var(--bg-3) 46%, var(--bg-2) 100%);

  
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 22px;

  
  --font: 'Manrope', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; scrollbar-width: none; }
*::-webkit-scrollbar { display: none; }

html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100dvh;
  background: #0a0a0c;
  font-family: var(--font);
  font-weight: 600;
  color: var(--text-1);
  font-feature-settings: "ss01";
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
  overscroll-behavior: none;
  touch-action: manipulation;
}

button { font-family: inherit; }

#root {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.app-stage {
  width: 100%;
  height: 100%;
  background: var(--bg-0);
  overflow: hidden;
  overscroll-behavior: none;
  display: flex;
  justify-content: center;
}

.phone {
  width: 100%;
  max-width: 480px;
  height: 100%;
  background: var(--bg-1);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
}


.app-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  background: var(--bg-1);
  scrollbar-width: thin;
  scrollbar-color: var(--bg-4) transparent;
  position: relative;
}
.app-body::-webkit-scrollbar { width: 6px; }
.app-body::-webkit-scrollbar-thumb { background: var(--bg-4); border-radius: 3px; }


.native-back {
  position: sticky;
  top: 0;
  z-index: 20;
  background: color-mix(in srgb, var(--bg-1) 92%, transparent);
  border-bottom: 1px solid var(--line-1);
  padding: calc(8px + env(safe-area-inset-top, 0px)) 12px 8px;
  backdrop-filter: blur(12px);
}

.native-back button {
  appearance: none;
  border: 0;
  background: transparent;
  color: #5b9eff;
  display: flex;
  align-items: center;
  gap: 2px;
  font-size: 16px;
  cursor: pointer;
}

.state-screen {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 24px;
  color: var(--text-2);
  text-align: center;
  font-size: 14px;
}

.state-screen img {
  width: 120px;
  height: 120px;
  object-fit: contain;
}


.tabbar {
  position: relative;
  flex-shrink: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background: var(--bg-0);
  border-top: 1px solid var(--line-1);
  padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 16px));
  gap: 4px;
}
.tabbar button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text-3);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 6px 4px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.02em;
  transition: none;
  cursor: pointer;
}
.tabbar button .tab-ico {
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: none;
}
.tabbar button.active {
  color: var(--red-1);
}
.tabbar button.active .tab-ico {
  transform: none;
}
.tabbar button:active .tab-ico {
  transform: scale(0.92);
}



.row { display: flex; }
.col { display: flex; flex-direction: column; }
.gap-2 { gap: 8px; } .gap-3 { gap: 12px; } .gap-4 { gap: 16px; } .gap-6 { gap: 24px; }
.mono { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.tabnum { font-variant-numeric: tabular-nums; }

.section-title {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-3);
  padding: 0 16px;
  margin: 20px 0 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.section-title .more {
  color: var(--red-1);
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  font-size: 12px;
}

.card {
  background: var(--bg-2);
  border: 1px solid var(--line-1);
  border-radius: var(--r-md);
}

/* Missions visual prototype */
.quest-entry-card {
  width: 100%;
  min-height: 28px;
  appearance: none;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text-3);
  padding: 2px 0;
  display: flex;
  align-items: center;
  gap: 6px;
  text-align: left;
  cursor: pointer;
  font-size: 11px;
  transition: color 120ms ease;
}
.quest-entry-card:active { color: var(--text-1); }
.quest-entry-card > span { color: var(--text-2); font-weight: 750; }
.quest-entry-card > b { flex: 1; font-size: 10px; font-weight: 600; color: var(--text-4); }

.quest-hub { min-height: 100%; padding-bottom: 22px; background: var(--bg-1); }
.quest-hub__header {
  padding: calc(18px + env(safe-area-inset-top,0px)) 16px 12px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.native-back + .quest-hub__header { padding-top: 14px; }
.quest-hub__header > div:first-child span {
  display: block; color: var(--red-1); font-size: 10px; text-transform: uppercase;
  letter-spacing: .12em; margin-bottom: 3px;
}
.quest-hub__header h1 { margin: 0; font-size: 26px; font-weight: 900; letter-spacing: -.035em; }
.quest-balance {
  display: flex; align-items: center; gap: 6px; padding: 7px 0 7px 7px;
  border-radius: 13px; background: transparent; border: 0;
}
.quest-balance > img { animation: quest-token-float 3.1s ease-in-out infinite; }
.quest-balance span { display: flex; flex-direction: column; line-height: 1; gap: 3px; }
.quest-balance small { color: var(--text-3); font-size: 8px; white-space: nowrap; text-transform: uppercase; letter-spacing: .06em; }
.quest-balance b { font-size: 16px; font-variant-numeric: tabular-nums; }

.quest-season-panel {
  min-height: 118px; margin: 0 16px; padding: 10px 12px 10px 8px;
  border: 0; border-radius: 0; background: transparent;
  display: grid; grid-template-columns: 100px minmax(0,1fr); align-items: center;
  position: relative;
}
.quest-season-panel__emblem {
  width: 98px; height: 100px; position: relative; display: grid; place-items: center;
}
.quest-season-panel__emblem img {
  position: relative; z-index: 1; width: 98px; height: 98px; object-fit: contain;
}
.quest-season-panel__body { min-width: 0; position: relative; z-index: 1; }
.quest-season-panel__top { display: flex; align-items: center; justify-content: space-between; gap: 7px; }
.quest-season-panel__top > span {
  min-width: 0; color: var(--text-3); font-size: 8px; font-weight: 850;
  letter-spacing: .07em; text-transform: uppercase; white-space: nowrap;
}
.quest-season-panel__top > b {
  display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto;
  color: var(--text-3); font-size: 8px; font-weight: 750;
}
.quest-season-panel__level { margin-top: 5px; display: flex; align-items: baseline; gap: 6px; }
.quest-season-panel__level small { color: var(--text-2); font-size: 10px; font-weight: 750; }
.quest-season-panel__level strong { color: #fff; font-size: 27px; line-height: 1; font-weight: 950; letter-spacing: -.04em; }
.quest-season-panel__track {
  height: 5px; margin-top: 9px; border-radius: 999px; overflow: hidden; background: var(--bg-4);
}
.quest-season-panel__track i {
  display: block; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, var(--red-3), #ff4a4a);
  box-shadow: 0 0 10px rgba(224,36,36,.28);
  transform-origin: left; animation: quest-progress-in .7s cubic-bezier(.2,.8,.2,1) both;
}
.quest-season-panel__meta {
  margin-top: 6px; display: flex; align-items: flex-end; justify-content: space-between; gap: 8px;
  color: var(--text-4); font-size: 8px; font-variant-numeric: tabular-nums;
}
.quest-season-panel__meta > span:first-child b { color: var(--text-2); font-size: 9px; }
.quest-season-panel__meta > span:last-child { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.quest-season-panel__meta > span:last-child b { color: var(--red-1); font-size: 9px; }

.quest-tabs {
  margin: 14px 16px 0; padding: 4px; display: grid; grid-template-columns: 1fr 1fr;
  gap: 4px; background: var(--bg-2); border: 1px solid var(--line-1); border-radius: 11px;
}
.quest-tabs button {
  appearance: none; border: 0; background: transparent; color: var(--text-3);
  min-height: 38px; border-radius: 8px; display: flex; align-items: center;
  justify-content: center; gap: 7px; font-size: 13px; font-weight: 700; cursor: pointer;
}
.quest-tabs button:active { transform: scale(.97); }
.quest-tabs button.active { background: var(--bg-4); color: var(--text-1); box-shadow: 0 3px 12px rgba(0,0,0,.18); }
.quest-tabs button i {
  width: 17px; height: 17px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--red-2); color: #fff; font-size: 9px; font-style: normal;
}
.quest-content { animation: fadeIn 150ms ease; }
.quest-section-head {
  margin: 18px 16px 9px; display: flex; justify-content: space-between; align-items: center;
}
.quest-section-head > div { display: flex; flex-direction: column; gap: 2px; }
.quest-section-head strong { font-size: 13px; font-weight: 800; }
.quest-section-head span { font-size: 9px; color: var(--text-4); }
.quest-section-head > b { color: var(--text-3); font-size: 11px; font-variant-numeric: tabular-nums; }
.quest-list { margin: 0 16px; border-radius: 15px; overflow: hidden; border: 1px solid var(--line-1); }
.quest-row {
  padding: 12px; display: flex; gap: 11px; background: var(--bg-2);
  border-bottom: 1px solid var(--line-1); transition: opacity .15s ease;
  animation: quest-row-in .28s ease both;
}
.quest-row:nth-child(2) { animation-delay: 45ms; }
.quest-row:nth-child(3) { animation-delay: 90ms; }
.quest-row:last-child { border-bottom: 0; }
.quest-row--claimed { opacity: .58; }
.quest-row__main { flex: 1; min-width: 0; }
.quest-row__top { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.quest-row__top > div { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.quest-row__top strong { font-size: 13px; font-weight: 800; }
.quest-row__top span { font-size: 10px; color: var(--text-3); line-height: 1.35; }
.quest-token-amount { display: inline-flex; align-items: center; gap: 2px; flex-shrink: 0; color: var(--red-1); font-variant-numeric: tabular-nums; }
.quest-token-amount b { font-size: 12px; }
.quest-token-amount.muted { color: var(--text-4); }
.quest-row__progress { margin-top: 9px; display: flex; align-items: center; gap: 8px; }
.quest-row__progress > div { flex: 1; height: 4px; border-radius: 999px; overflow: hidden; background: var(--bg-4); }
.quest-row__progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--red-3), var(--red-1)); transform-origin: left; animation: quest-progress-in .65s cubic-bezier(.2,.8,.2,1) both; }
.quest-row__progress span { color: var(--text-4); font-size: 9px; font-variant-numeric: tabular-nums; min-width: 52px; text-align: right; }
.quest-claim {
  appearance: none; border: 0; border-radius: 7px; background: var(--green); color: #07150d;
  padding: 5px 9px; margin-top: 8px; font-size: 10px; font-weight: 900; cursor: pointer;
  display: inline-flex; align-items: center; gap: 4px;
}
.quest-claim:not(:disabled):active { transform: scale(.94); }
.quest-claim.claimed { background: var(--bg-4); color: var(--text-3); }
.quest-bonus {
  margin: 9px 16px 0; border-radius: 13px; padding: 10px 12px; display: flex; align-items: center; gap: 10px;
  border: 1px dashed rgba(224,36,36,.26); background: rgba(224,36,36,.04);
}
.quest-bonus__gift { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; color: var(--red-1); background: rgba(224,36,36,.09); border-radius: 10px; }
.quest-bonus > div { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.quest-bonus strong { font-size: 11px; color: var(--text-2); }
.quest-bonus span { font-size: 9px; color: var(--text-4); }

.quest-shop-head { margin: 18px 16px 10px; display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; }
.quest-shop-head > div { display: flex; flex-direction: column; gap: 3px; }
.quest-shop-head strong { font-size: 15px; font-weight: 850; }
.quest-shop-head div span { font-size: 10px; color: var(--text-3); }
.quest-shop-head > span { font-size: 9px; color: var(--text-3); display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.quest-shop-head > span i { width: 5px; height: 5px; background: var(--green); border-radius: 50%; }
.quest-reward-grid { padding: 0 16px; display: grid; grid-template-columns: 1fr; gap: 8px; }
.quest-reward-card {
  min-width: 0; min-height: 96px; overflow: hidden; border-radius: 14px; background: var(--bg-2);
  border: 1px solid var(--line-1); position: relative;
  display: grid; grid-template-columns: 92px minmax(0,1fr);
  animation: quest-card-in .32s ease both;
  transition: transform 120ms ease, border-color 120ms ease, background 120ms ease;
}
.quest-reward-card:nth-child(2) { animation-delay: 40ms; }
.quest-reward-card:nth-child(3) { animation-delay: 80ms; }
.quest-reward-card:nth-child(4) { animation-delay: 120ms; }
.quest-reward-card:nth-child(5) { animation-delay: 160ms; }
.quest-reward-card:nth-child(6) { animation-delay: 200ms; }
.quest-reward-card--owned { opacity: .62; }
.quest-reward-art {
  min-height: 96px; display: flex; align-items: center; justify-content: center; position: relative;
  color: rgba(255,255,255,.84); overflow: hidden;
  background: var(--bg-3); border-right: 1px solid var(--line-1);
}
.quest-reward-art--minecraft {
  background-image: linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.34)), url("/assets/profile-textures/minecraft.webp");
  background-size: cover; background-position: center;
}
.quest-reward-art--minecraft::after {
  content: ""; position: absolute; inset: -40% -80%; transform: rotate(20deg);
  background: linear-gradient(90deg, transparent 43%, rgba(255,255,255,.12) 50%, transparent 57%);
  animation: quest-art-shine 5s ease-in-out infinite;
}
.quest-reward-art--minecraft span { font-size: 25px; font-weight: 1000; letter-spacing: -.08em; text-shadow: 0 3px 14px #000; }
.quest-reward-art--premium { color: #f3c254; background: radial-gradient(circle at 50% 30%, rgba(242,170,46,.22), transparent 55%), #171719; flex-direction: column; }
.quest-reward-art--premium b { position: absolute; font-size: 20px; color: white; right: 10px; bottom: 12px; }
.quest-reward-art--premium small { position: absolute; font-size: 7px; color: var(--text-3); right: 9px; bottom: 6px; text-transform: uppercase; }
.quest-reward-art--frame { background: radial-gradient(circle, rgba(70,99,255,.28), transparent 58%), #15151a; }
.quest-reward-art--frame span { width: 58px; height: 58px; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 4px solid transparent; background: linear-gradient(#17171a,#17171a) padding-box, conic-gradient(#22d3ee,#a855f7,#ff3a7c,#22d3ee) border-box; box-shadow: 0 0 20px rgba(100,80,255,.28); }
.quest-reward-art--rename { gap: 9px; color: #e6e6e8; }
.quest-reward-art--rename b { font-size: 26px; letter-spacing: -.06em; }
.quest-reward-art--tag { background: linear-gradient(145deg, #18202d, #111216); }
.quest-reward-art--tag span { padding: 8px 12px; border-radius: 8px; background: rgba(58,139,255,.13); border: 1px solid rgba(58,139,255,.35); color: #7eb1ff; font-size: 19px; font-weight: 900; transform: rotate(-4deg); }
.quest-reward-art--banner {
  background: radial-gradient(circle at 50% 42%, rgba(255,255,255,.06), transparent 62%), var(--bg-3);
}
.quest-reward-banner-stack {
  width: 78px; height: 82px; position: relative; display: flex; align-items: center; justify-content: center;
}
.quest-reward-banner-stack img {
  position: absolute; width: 47px; height: 68px; object-fit: cover; object-position: center;
  border-radius: 7px; border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 7px 15px rgba(0,0,0,.45);
}
.quest-reward-banner-stack img[data-index="0"] { z-index: 3; transform: translateX(-1px); }
.quest-reward-banner-stack img[data-index="1"] { z-index: 2; transform: translateX(-14px) rotate(-8deg); opacity: .85; }
.quest-reward-banner-stack img[data-index="2"] { z-index: 1; transform: translateX(13px) rotate(8deg); opacity: .78; }
.quest-reward-banner-stack > b {
  position: absolute; z-index: 4; right: 5px; bottom: 5px; width: 21px; height: 21px;
  border-radius: 50%; display: grid; place-items: center;
  background: var(--red-2); border: 2px solid var(--bg-2); color: #fff;
  box-shadow: 0 3px 8px rgba(0,0,0,.4); font-size: 11px; font-weight: 950;
}
.quest-reward-card__body { min-width: 0; padding: 11px 12px; display: flex; flex-direction: column; }
.quest-reward-card__body > strong { font-size: 13px; font-weight: 850; line-height: 1.2; }
.quest-reward-card__body > span { font-size: 9px; line-height: 1.35; color: var(--text-3); margin-top: 3px; }
.quest-reward-card__body > button {
  width: 100%; min-height: 30px; appearance: none; border: 1px solid var(--line-2);
  border-radius: 8px; background: var(--bg-3); color: var(--text-1); margin-top: auto;
  display: flex; align-items: center; justify-content: center; gap: 4px; font-size: 9px; font-weight: 800; cursor: pointer;
}
.quest-reward-card__body > button:not(:disabled):active { transform: scale(.96); }
.quest-reward-card__body > button:disabled { color: var(--text-4); background: var(--bg-3); border-color: var(--line-1); cursor: default; }
.quest-demo-label { text-align: center; margin: 18px 0 5px; color: var(--text-4); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.quest-toast {
  position: fixed; z-index: 1000; bottom: 72px; left: 50%;
  transform: translateX(-50%); background: rgba(30,30,34,.97); border: 1px solid var(--line-2);
  color: #fff; border-radius: 999px; box-shadow: 0 4px 20px rgba(0,0,0,.5);
  pointer-events: none; padding: 10px 18px; font-size: 13px; font-weight: 500;
  white-space: nowrap; animation: fadeIn 160ms ease;
}

@keyframes quest-token-float {
  0%,100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-2px) rotate(2deg); }
}
@keyframes quest-flare {
  from { transform: translate3d(-8px,2px,0) scale(.9); opacity: .6; }
  to { transform: translate3d(10px,-7px,0) scale(1.14); opacity: 1; }
}
@keyframes quest-progress-in {
  from { transform: scaleX(.04); filter: brightness(1.8); }
  to { transform: scaleX(1); filter: brightness(1); }
}
@keyframes quest-row-in {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes quest-card-in {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes quest-art-shine {
  0%,60% { transform: translateX(-45%) rotate(20deg); opacity: 0; }
  70% { opacity: 1; }
  90%,100% { transform: translateX(45%) rotate(20deg); opacity: 0; }
}
@media (hover:hover) {
  .quest-entry-card:hover { color: var(--text-1); }
  .quest-reward-card:not(.quest-reward-card--owned):hover { transform: translateY(-2px); }
}
@media (prefers-reduced-motion: reduce) {
  .quest-hub *, .quest-entry-card *, .quest-entry-card::before { animation: none !important; transition: none !important; }
}

.divider {
  height: 1px;
  background: var(--line-1);
}


.placeholder-img {
  background:
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,0.04) 0 6px,
      rgba(255,255,255,0.01) 6px 12px
    ),
    var(--bg-3);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 10px;
  color: var(--text-4);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}


.chip {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 4px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 500;
  background: var(--bg-3);
  color: var(--text-2);
  border: 1px solid var(--line-1);
  white-space: nowrap;
}
.chip.red {
  background: rgba(224,36,36,0.12);
  color: var(--red-1);
  border-color: rgba(224,36,36,0.25);
}
.chip.green {
  background: rgba(46,204,113,0.12);
  color: var(--green);
  border-color: rgba(46,204,113,0.22);
}
.chip.gold {
  background: rgba(214,169,58,0.12);
  color: var(--gold);
  border-color: rgba(214,169,58,0.22);
}
.chip.dot::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: currentColor;
  display: block;
}


.btn {
  appearance: none;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  border-radius: 12px;
  padding: 12px 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: transform 80ms ease, background 120ms ease;
}
.btn:active { transform: scale(0.98); }
.btn-primary {
  background: var(--red-2);
  color: white;
  box-shadow: 0 1px 0 rgba(255,255,255,0.08) inset, 0 6px 14px -6px rgba(224,36,36,0.6);
}
.btn-primary:hover { background: var(--red-1); }
.btn-secondary {
  background: var(--bg-3);
  color: var(--text-1);
  border: 1px solid var(--line-2);
}
.btn-secondary:hover { background: var(--bg-4); }
.btn-block { width: 100%; }
.btn-ghost {
  background: transparent;
  color: var(--text-2);
  border: 1px solid var(--line-2);
}
.btn-red {
  background: var(--red-2);
  color: white;
  box-shadow: 0 6px 14px -6px rgba(224,36,36,0.5);
}
.btn-red:hover { background: var(--red-1); }
.btn-sm {
  font-size: 12px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 8px;
}


.avatar {
  --avatar-size: 96px;
  --ring-color: #2ecc71;
  --ring-glow: rgba(46,204,113,0.32);
  width: var(--avatar-size);
  height: var(--avatar-size);
  position: relative;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 3px solid var(--ring-color);
  background: var(--avatar-fallback-bg);
  box-shadow:
    0 0 18px var(--ring-glow);
  overflow: hidden;
}
.avatar.premium {
  --ring-color: var(--premium-ring-color, #a855f7);
  --ring-glow: var(--premium-ring-glow, rgba(168,85,247,0.38));
}
.avatar::before {
  content: none;
}
.avatar > * {
  position: relative;
  z-index: 1;
  font-size: 38px;
  font-weight: 800;
  color: var(--text-1);
  letter-spacing: 0;
  line-height: 1;
  text-shadow: none;
}
.avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  text-shadow: none;
}
.avatar-wrap {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
}
.avatar-frame-shell{position:relative;display:inline-flex;width:var(--avatar-shell-size);height:var(--avatar-shell-size);align-items:center;justify-content:center;flex-shrink:0;overflow:visible}
.avatar-frame-shell__image{position:absolute;left:50%;top:50%;z-index:3;max-width:none;object-fit:contain;pointer-events:none;transform:translate(-50%,-50%);filter:drop-shadow(0 3px 8px rgba(0,0,0,.7))}
.profile-avatar-frame-wrap{position:relative;z-index:1;display:flex;width:124px;height:124px;align-items:center;justify-content:center;flex-shrink:0;margin:-22px 0}
.profile-avatar-frame{position:absolute;inset:0;width:124px;height:124px;object-fit:contain;z-index:3;pointer-events:none;filter:drop-shadow(0 3px 8px rgba(0,0,0,.7))}
.profile-avatar-frame--crimson{inset:5px;width:114px;height:114px}
label:hover .avatar-edit-overlay { opacity: 1 !important; }

.profile-banner-card {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid var(--line-1);
  background: var(--bg-2);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 20px 20px;
  gap: 14px;
  margin: 0 16px;
}
.stats-grid {
  display: grid;
  gap: 1px;
  background: var(--line-1);
  border-radius: var(--r-md);
  overflow: hidden;
  border: 1px solid var(--line-1);
}
.stat-cell {
  background: var(--bg-2);
  padding: 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.stat-cell .v {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.stat-cell .v.red { color: var(--red-1); }
.stat-cell .v.green { color: var(--green); }
.stat-cell .l {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-3);
}


.match {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  padding: 12px;
  background: var(--bg-2);
  border: 1px solid var(--line-1);
  border-radius: var(--r-md);
  align-items: center;
  cursor: pointer;
  transition: border-color 120ms ease, transform 80ms ease;
}
.match:hover { border-color: var(--line-2); }
.match:active { transform: scale(0.995); }
.match .map-thumb {
  width: 56px;
  height: 56px;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
.match.win  .map-thumb { box-shadow: inset 3px 0 0 var(--green); }
.match.loss .map-thumb { box-shadow: inset 3px 0 0 var(--red-1); }

.match-card {
  overflow: hidden;
  border: 1px solid var(--line-1);
  border-radius: var(--r-lg);
  background: var(--bg-2);
}

.match-map {
  height: 116px;
  padding: 14px;
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid var(--line-1);
  overflow: hidden;
}

.match-meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--line-1);
}

.match-meta > div {
  min-width: 0;
  padding: 10px 8px;
  background: var(--bg-2);
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.match-meta .l {
  color: var(--text-3);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.match-meta .v {
  color: var(--text-1);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.match-demo-btn {
  appearance: none;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(20,20,22,0.58);
  color: var(--text-2);
  min-height: 26px;
  padding: 0 9px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
  backdrop-filter: blur(8px);
}
.match-demo-btn:active {
  transform: scale(0.96);
}


.review-bar {
  height: 8px;
  background: var(--bg-3);
  border-radius: 999px;
  overflow: hidden;
  display: flex;
}
.review-bar .pos { background: var(--green); }
.review-bar .neg { background: var(--red-2); }

.review-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}
.review-action {
  appearance: none;
  min-height: 38px;
  border: 1px solid var(--line-1);
  border-radius: 11px;
  background: transparent;
  color: var(--text-3);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font: 700 13px/1 var(--font);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  transition: color 120ms ease, border-color 120ms ease, transform 80ms ease;
}
.review-action:active { transform: scale(.97); }
.review-action:disabled { cursor: default; opacity: .48; }
.review-action--like.active {
  color: var(--green);
  border-color: color-mix(in srgb, var(--green) 38%, transparent);
}
.review-action--dislike.active {
  color: var(--red-1);
  border-color: color-mix(in srgb, var(--red-1) 38%, transparent);
}


.shop-card {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  border: 1px solid var(--line-1);
  background: var(--bg-2);
}

.shop-tabs-wrap {
  padding: 16px 16px 0;
}

.shop-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  padding: 4px;
  border-radius: 10px;
  background: var(--bg-2);
  border: 1px solid var(--line-1);
}

.shop-tabs button {
  appearance: none;
  min-width: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text-3);
  padding: 8px 0;
  text-align: center;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 120ms ease;
}

.shop-tabs button span {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shop-tabs button.active {
  background: var(--bg-4);
  color: var(--text-1);
}

.shop-list {
  padding: 0 16px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.shop-item-card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--line-1);
  background: var(--bg-2);
  box-shadow: 0 10px 26px rgba(0,0,0,0.24);
  display: flex;
  flex-direction: column;
  cursor: pointer;
  appearance: none;
  color: inherit;
  text-align: left;
  transition: opacity 120ms ease, transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease;
}
.shop-item-card:not(:disabled):active {
  transform: translateY(1px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.28);
  border-color: var(--line-2);
}
.shop-item-card:disabled {
  opacity: 0.5;
  cursor: default;
}
.shop-item-card__img-wrap {
  width: 100%;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  box-sizing: border-box;
  overflow: hidden;
  background: transparent;
}
.shop-item-card__img-wrap--banner {
  padding: 12px;
}
.shop-item-card__img {
  width: 108%;
  height: 108%;
  max-width: none;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 10px 14px rgba(0,0,0,0.42));
}
.shop-item-card__img--banner {
  width: 96%;
  height: 96%;
}
.shop-item-card__img-placeholder {
  width: 100%;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 36px;
  color: var(--text-4);
}
.shop-item-card__body {
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
}
.shop-item-card__title {
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.shop-item-card__sub {
  font-size: 11px;
  color: var(--text-3);
  line-height: 1.3;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.shop-item-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 6px;
  gap: 4px;
}
.shop-item-card__price {
  font-size: 15px;
  font-weight: 900;
  color: var(--text-1);
  white-space: nowrap;
}
.shop-item-card__badge {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--bg-4);
  color: var(--text-3);
  border: 1px solid var(--line-2);
  white-space: nowrap;
}
.shop-item-card__active {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(0, 200, 80, 0.12);
  color: var(--green);
  border: 1px solid rgba(0, 200, 80, 0.3);
}

.banner-pack-card {
  appearance: none;
  color: inherit;
  text-align: left;
  border: 1px solid var(--line-1);
  border-radius: 16px;
  background:
    radial-gradient(circle at 18% 14%, rgba(224,36,36,0.18), transparent 34%),
    var(--bg-2);
  box-shadow: 0 10px 26px rgba(0,0,0,0.24);
  cursor: pointer;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow: hidden;
  transition: transform 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}
.banner-pack-card:active {
  transform: translateY(1px);
  border-color: var(--line-2);
  box-shadow: 0 6px 18px rgba(0,0,0,0.28);
}
.banner-pack-card__preview {
  display: flex;
  min-height: 96px;
  align-items: center;
  justify-content: center;
  padding-left: 18px;
}
.banner-pack-card__tile {
  width: 72px;
  aspect-ratio: 3 / 4;
  border-radius: 14px;
  border: 1px solid var(--line-2);
  background: var(--bg-3);
  box-shadow: 0 12px 24px rgba(0,0,0,0.34);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-3);
  font-size: 12px;
  font-weight: 900;
  flex-shrink: 0;
}
.banner-pack-card__tile img,
.banner-pack-sheet-preview__item img,
.banner-pack-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}
.banner-pack-card__body {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.banner-pack-card__top {
  display: flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
}
.banner-pack-card__title {
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.banner-pack-card__discount {
  flex-shrink: 0;
  border-radius: 999px;
  padding: 2px 6px;
  background: rgba(55,180,105,0.14);
  color: #62d28f;
  border: 1px solid rgba(55,180,105,0.26);
  font-size: 10px;
  font-weight: 900;
}
.banner-pack-card__sub {
  font-size: 11px;
  color: var(--text-3);
}
.banner-rarity {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 2px 7px;
  font-size: 10px;
  font-weight: 900;
  border: 1px solid transparent;
  white-space: nowrap;
}
.banner-rarity--green {
  color: #62d28f;
  background: rgba(55,180,105,0.13);
  border-color: rgba(55,180,105,0.28);
}
.banner-rarity--blue {
  color: #70a7ff;
  background: rgba(80,140,255,0.13);
  border-color: rgba(80,140,255,0.28);
}
.banner-rarity--red {
  color: #ff6666;
  background: rgba(224,36,36,0.15);
  border-color: rgba(224,36,36,0.32);
}
.banner-rarity-glow {
  --rarity-rgb: 55, 180, 105;
  --rarity-border: rgba(var(--rarity-rgb), 0.42);
  --rarity-soft: rgba(var(--rarity-rgb), 0.22);
  --rarity-fill: rgba(var(--rarity-rgb), 0.10);
  position: relative;
  border-color: var(--rarity-border) !important;
  box-shadow:
    0 8px 18px rgba(0,0,0,0.30),
    0 0 0 1px var(--rarity-border),
    0 0 16px var(--rarity-soft);
  isolation: isolate;
}
.banner-rarity-glow::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 50% 18%, var(--rarity-fill), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,0.04), transparent 45%);
  pointer-events: none;
  z-index: 0;
}
.banner-rarity-glow > img,
.banner-rarity-glow > span {
  position: relative;
  z-index: 0;
}
.banner-rarity-glow--green {
  --rarity-rgb: 55, 180, 105;
}
.banner-rarity-glow--blue {
  --rarity-rgb: 80, 140, 255;
}
.banner-rarity-glow--red {
  --rarity-rgb: 224, 36, 36;
}
.banner-sheet-meta {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 10px;
  font-size: 11px;
  color: var(--text-3);
}
.banner-sheet-meta > span:first-child {
  border: 1px solid var(--line-1);
  background: var(--bg-2);
  border-radius: 999px;
  padding: 2px 8px;
}
.banner-pack-sheet-preview {
  display: flex;
  justify-content: center;
  gap: 0;
  padding: 18px 0 8px;
}
.banner-pack-sheet-preview__item {
  width: 74px;
  aspect-ratio: 3 / 4;
  margin-left: -10px;
  border: 1px solid var(--line-2);
  border-radius: 14px;
  background: var(--bg-3);
  overflow: hidden;
  box-shadow: 0 10px 22px rgba(0,0,0,0.3);
}
.banner-pack-sheet-preview__item:first-child {
  margin-left: 0;
}
.banner-pack-progress {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 8px 0 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--bg-2);
  border: 1px solid var(--line-1);
  color: var(--text-3);
  font-size: 12px;
}
.banner-pack-progress b {
  color: #62d28f;
  font-size: 11px;
}
.banner-pack-items {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.banner-pack-item {
  appearance: none;
  color: inherit;
  text-align: left;
  border: 1px solid var(--line-1);
  background: var(--bg-2);
  border-radius: 12px;
  padding: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}
.banner-pack-item__thumb {
  width: 48px;
  aspect-ratio: 3 / 4;
  border-radius: 10px;
  background: var(--bg-3);
  border: 1px solid var(--line-1);
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-3);
  font-size: 12px;
  font-weight: 900;
}
.banner-pack-item__body {
  min-width: 0;
  flex: 1;
}
.banner-pack-item__name {
  font-size: 13px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.banner-pack-item__meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
  color: var(--text-3);
  font-size: 11px;
}
.shop-empty-card {
  min-height: 150px;
  border-radius: 16px;
  border: 1px solid var(--line-1);
  background: var(--bg-2);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 22px;
}
.shop-empty-card__title {
  font-size: 18px;
  font-weight: 900;
}
.shop-empty-card__sub {
  max-width: 260px;
  color: var(--text-3);
  font-size: 13px;
  line-height: 1.45;
  margin-top: 8px;
}

.empty-state-card {
  min-height: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 28px 20px;
  box-sizing: border-box;
  animation: empty-state-enter 420ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
.empty-state-card--compact {
  min-height: 132px;
  padding: 20px 16px;
}
.empty-state-card__emoji {
  width: 96px;
  height: 96px;
  margin-bottom: 18px;
  display: grid;
  place-items: center;
  filter: drop-shadow(0 10px 16px rgba(0, 0, 0, 0.24));
}
.empty-state-card--compact .empty-state-card__emoji {
  width: 78px;
  height: 78px;
  margin-bottom: 14px;
}
.empty-state-card__emoji img { display: block; width: 100%; height: 100%; object-fit: contain; }
.empty-state-card__title {
  color: var(--text-1);
  font-size: 16px;
  font-weight: 800;
  animation: empty-state-copy-enter 420ms 80ms ease-out both;
}
.empty-state-card__subtitle {
  max-width: 280px;
  color: var(--text-3);
  font-size: 13px;
  line-height: 1.45;
  margin-top: 7px;
  animation: empty-state-copy-enter 420ms 130ms ease-out both;
}
.empty-state-card__action {
  margin-top: 20px;
  animation: empty-state-copy-enter 420ms 180ms ease-out both;
}

@keyframes empty-state-enter {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes empty-state-copy-enter {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .empty-state-card,
  .empty-state-card__emoji,
  .empty-state-card__title,
  .empty-state-card__subtitle,
  .empty-state-card__action {
    animation: none;
  }
}

.admin-banner-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.admin-banner-card {
  width: 100%;
  position: relative;
  box-shadow: 0 12px 30px rgba(0,0,0,0.28);
}
.admin-banner-card .shop-item-card__img-wrap--banner {
  padding: 12px;
}
.admin-banner-card .shop-item-card__img--banner {
  width: 96%;
  height: 96%;
  filter: drop-shadow(0 12px 16px rgba(0,0,0,0.48));
}
.admin-banner-upload {
  width: min(100%, 360px);
  aspect-ratio: 16 / 9;
  align-self: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  border: 1px solid var(--line-1);
  background: var(--bg-2);
  cursor: pointer;
  overflow: hidden;
  position: relative;
  padding: 12px;
  box-shadow: 0 14px 34px rgba(0,0,0,0.28);
}
.admin-banner-upload__image-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.admin-banner-upload__image {
  width: 96%;
  height: 96%;
  object-fit: contain;
  display: block;
  border-radius: 10px;
  filter: drop-shadow(0 12px 16px rgba(0,0,0,0.5));
  pointer-events: none;
}
.admin-banner-upload__placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(ellipse at 50% 30%, rgba(224,36,36,0.12), transparent 70%);
  color: var(--text-4);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.admin-banner-upload__action {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 2;
  background: rgba(0,0,0,0.62);
  border-radius: 8px;
  padding: 4px 8px;
  font-size: 11px;
  color: #fff;
}

.premium-card {
  padding: 18px;
  background:
    radial-gradient(circle at 100% 0%, rgba(224,36,36,0.4), transparent 50%),
    radial-gradient(circle at 0% 100%, rgba(122,14,14,0.6), transparent 60%),
    linear-gradient(135deg, #2a0808 0%, #150404 100%);
  border: 1px solid rgba(224,36,36,0.3);
  border-radius: var(--r-lg);
  position: relative;
  overflow: hidden;
}
.premium-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(45deg, rgba(255,255,255,0.02) 0 1px, transparent 1px 4px);
  pointer-events: none;
}


.plan {
  background: var(--bg-2);
  border: 1px solid var(--line-1);
  border-radius: var(--r-md);
  padding: 14px;
  cursor: pointer;
  transition: all 120ms ease;
  position: relative;
}
.plan.selected {
  border-color: var(--red-2);
  background: linear-gradient(180deg, rgba(224,36,36,0.08), rgba(224,36,36,0.02));
  box-shadow: 0 0 0 1px var(--red-2) inset;
}
.plan .badge {
  position: absolute;
  top: -8px;
  right: 12px;
  background: var(--red-2);
  color: white;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 999px;
}


.input {
  width: 100%;
  height: 44px;
  padding: 0 14px;
  background: var(--bg-2);
  border: 1px solid var(--line-1);
  color: var(--text-1);
  border-radius: var(--r-md);
  font-family: inherit;
  font-size: 15px;
  outline: none;
  transition: border 120ms ease;
}
.input:focus { border-color: var(--red-2); }
.input:invalid { box-shadow: none !important; border-color: var(--line-1) !important; outline: none !important; }
.input:focus:invalid { border-color: var(--red-2) !important; }
.input[type=number]::-webkit-inner-spin-button,
.input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.input[type=number] { -moz-appearance: textfield; }
.input::placeholder { color: var(--text-4); }
textarea.input { height: auto; padding: 10px 14px; }

.admin-page {
  touch-action: pan-x pan-y;
}

.admin-page .phone {
  max-width: 100%;
}

.admin-sale-fields {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
}

.admin-sale-fields > * {
  min-width: 0;
}

.admin-sale-fields .input {
  width: 100%;
  min-width: 0;
}

.admin-sale-label {
  font-size: 10px;
  font-weight: 800;
  color: var(--text-3);
  text-transform: uppercase;
}

.admin-sale-footer,
.admin-sale-options,
.admin-sale-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.admin-sale-footer {
  justify-content: space-between;
}

@media (max-width: 560px) {
  .admin-sale-fields {
    grid-template-columns: 82px minmax(0, 1fr);
  }

  .admin-sale-fields > :last-child {
    grid-column: 1 / -1;
  }

  .admin-sale-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .admin-sale-options {
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .admin-sale-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .admin-sale-actions .btn {
    width: 100%;
    min-width: 0;
  }
}


.filter-row {
  display: flex;
  gap: 6px;
  padding: 10px 16px 6px;
  overflow-x: auto;
  scrollbar-width: none;
}
.filter-row::-webkit-scrollbar { display: none; }
.filter-row .fp {
  flex-shrink: 0;
  height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--bg-2);
  border: 1px solid var(--line-1);
  color: var(--text-2);
  font-size: 12px;
  font-weight: 500;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: all 120ms ease;
}
.filter-row .fp.active {
  background: var(--red-2);
  border-color: var(--red-2);
  color: white;
}


@keyframes skeleton-sweep {
  from { transform: translate3d(-160%, 0, 0); }
  to { transform: translate3d(260%, 0, 0); }
}

.skeleton {
  position: relative;
  display: block;
  min-width: 0;
  overflow: hidden;
  isolation: isolate;
  pointer-events: none;
  user-select: none;
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.018);
  contain: paint;
}
.skeleton::after {
  content: "";
  position: absolute;
  inset: -1px auto -1px -1px;
  width: 48%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.075), transparent);
  transform: translate3d(-160%, 0, 0);
  will-change: transform;
  animation: skeleton-sweep 1.55s linear infinite;
}
.skeleton-card {
  overflow: hidden;
  border: 1px solid var(--line-1);
  border-radius: 16px;
  background: var(--bg-2);
}
.skeleton-stack {
  min-width: 0;
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 7px;
}

@media (prefers-reduced-motion: reduce) {
  .skeleton::after { animation: none; opacity: 0.45; }
}

@keyframes slideUp {
  from { transform: translateY(100%); }
  to   { transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes slideInRight {
  from { transform: translateX(100%); }
  to   { transform: translateX(0); }
}

@keyframes tabContentEnter {
  from {
    opacity: 0;
    transform: translate3d(0, 10px, 0) scale(0.995);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

.tab-enter {
  animation: tabContentEnter 300ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
  transform-origin: center top;
}

.subtab-panel {
  animation: tabContentEnter 240ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
  transform-origin: center top;
}

.subtab-panel--compact {
  animation-duration: 220ms;
}

@media (prefers-reduced-motion: reduce) {
  .tab-enter,
  .app-tab-panel--active,
  .subtab-panel,
  .tabbar button,
  .tabbar button .tab-ico {
    animation: none;
    transition: none;
  }
}


.sheet-backdrop {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100dvh;
  min-height: 100%;
  background: rgba(0,0,0,0.72);
  z-index: 1000;
  animation: fadeIn 200ms ease;
  display: flex;
  align-items: flex-end;
  overscroll-behavior: contain;
}
.sheet {
  width: 100%;
  background: var(--bg-1);
  border-radius: 24px 24px 0 0;
  border-top: 1px solid var(--line-2);
  box-shadow: 0 -18px 50px rgba(0,0,0,0.58);
  padding: 8px 0 0;
  animation: slideUp 280ms cubic-bezier(0.2, 0.9, 0.3, 1.05);
  max-height: calc(100dvh - env(safe-area-inset-top, 0px));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.sheet--banner-product {
  max-height: min(78dvh, 640px);
}
.sheet .grabber {
  width: 36px;
  height: 4px;
  background: var(--bg-4);
  border-radius: 999px;
  margin: 6px auto 12px;
  cursor: grab;
  touch-action: none;
}
.sheet .grabber:active { cursor: grabbing; }
.shop-sheet-grabber-row {
  height: 28px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.shop-sheet-grabber-row .grabber {
  margin: 0;
  flex-shrink: 0;
}


.verified {
  color: var(--blue);
  flex-shrink: 0;
}
.premium-prefix {
  color: var(--gold);
  font-weight: 600;
}
.banned {
  color: var(--red-1);
  flex-shrink: 0;
}

.prediction-widget {
  position: fixed;
  z-index: 850;
  left: auto;
  right: max(14px, calc((100vw - 480px) / 2 + 14px));
  bottom: calc(82px + env(safe-area-inset-bottom, 0px));
  transform: none;
  width: min(310px, calc(100% - 42px));
  min-height: 76px;
  margin: 0;
  padding: 12px 44px 12px 62px;
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 12px;
  background: rgba(18,19,21,.96);
  box-shadow: 0 16px 38px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  overflow: visible;
  cursor: pointer;
  display: flex;
  align-items: center;
  animation: predictionWidgetIn 220ms cubic-bezier(.2,.8,.2,1) both;
}
.prediction-widget__event-mark { position: absolute; left: 10px; top: 12px; bottom: 12px; width: 40px; border-right: 1px solid rgba(255,255,255,.1); display: grid; place-items: center; }
.prediction-widget__event-mark img { width: 35px; height: 35px; object-fit: contain; }
.prediction-widget__content { position: relative; min-width: 0; z-index: 1; }
.prediction-widget__eyebrow { display: flex; align-items: center; gap: 6px; color: #79c9dc; font-size: 8px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.prediction-widget__eyebrow span { width: 5px; height: 5px; border-radius: 50%; background: #63b9cc; box-shadow: 0 0 8px rgba(99,185,204,.5); }
.prediction-widget__title { margin-top: 4px; color: #fff; font-size: 13px; line-height: 1.15; font-weight: 850; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.prediction-widget__meta { margin-top: 4px; color: rgba(255,255,255,.43); font-size: 8px; line-height: 1.3; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.prediction-widget__dock { position: absolute; z-index: 3; right: 0; top: 0; width: 36px; height: 34px; padding: 0; border: 0; border-left: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); border-radius: 0 11px 0 9px; background: rgba(255,255,255,.035); color: #79c9dc; display: grid; place-items: center; cursor: pointer; }
@keyframes predictionWidgetIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.tabbar .prediction-nav-handle { position: absolute; z-index: 4; left: auto; right: 18px; top: -23px; transform: none; width: 54px; height: 24px; min-height: 0; padding: 0; border: 1px solid var(--line-1); border-bottom: 0; border-radius: 11px 11px 0 0; background: var(--bg-0); color: #79c9dc; display: grid; place-items: center; box-shadow: 0 -7px 16px rgba(0,0,0,.2); }
.tabbar .prediction-nav-handle:active { transform: translateY(-1px); }
.predictions-screen { min-height: 100%; padding-bottom: 36px; background: radial-gradient(circle at 80% 0, rgba(210,20,42,.13), transparent 30%); }
.predictions-hero { position: sticky; top: 0; z-index: 20; height: 62px; padding: env(safe-area-inset-top, 0) 14px 0; display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 10px; background: rgba(10,10,12,.76); border-bottom: 1px solid rgba(255,255,255,.07); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.predictions-hero--telegram { grid-template-columns: 1fr auto; }
.predictions-back { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.06); color: #fff; }
.predictions-hero > div:nth-child(2) { display: flex; align-items: baseline; gap: 5px; letter-spacing: -.04em; }
.predictions-hero > div:nth-child(2) span { color: #ed2339; font-size: 16px; font-weight: 950; }
.predictions-hero > div:nth-child(2) strong { color: #fff; font-size: 16px; font-weight: 950; }
.predictions-balance { color: rgba(255,255,255,.68); font-size: 11px; font-weight: 800; white-space: nowrap; }
.prediction-tournament-tabs { display: flex; gap: 8px; padding: 14px 14px 0; overflow-x: auto; scrollbar-width: none; }
.prediction-tournament-tabs::-webkit-scrollbar { display: none; }
.prediction-tournament-tabs button { flex: 0 0 auto; border: 1px solid rgba(255,255,255,.09); border-radius: 999px; padding: 9px 13px; background: rgba(255,255,255,.04); color: rgba(255,255,255,.55); font-size: 11px; font-weight: 800; }
.prediction-tournament-tabs button.active { color: #fff; border-color: rgba(237,35,57,.45); background: rgba(237,35,57,.16); }
.prediction-tournament { padding: 14px; }
.prediction-cover { position: relative; min-height: 190px; padding: 20px; border-radius: 26px; overflow: hidden; background: linear-gradient(145deg, #241116, #101012 58%, #171719); border: 1px solid rgba(255,255,255,.1); box-shadow: 0 20px 55px rgba(0,0,0,.34); display: flex; flex-direction: column; justify-content: flex-end; }
.prediction-cover__glow { position: absolute; width: 260px; height: 260px; right: -85px; top: -130px; border-radius: 50%; background: radial-gradient(circle, rgba(237,35,57,.72), rgba(237,35,57,0) 67%); }
.prediction-cover > *:not(.prediction-cover__glow) { position: relative; z-index: 1; }
.prediction-cover .prediction-status { align-self: flex-start; margin-bottom: 13px; }
.prediction-cover h1 { max-width: 92%; margin: 0; color: #fff; font-size: 28px; line-height: 1.02; font-weight: 950; letter-spacing: -.045em; }
.prediction-cover p { max-width: 92%; margin: 10px 0 0; color: rgba(255,255,255,.58); font-size: 12px; line-height: 1.45; }
.prediction-cover > div:last-child { margin-top: 16px; color: rgba(255,255,255,.4); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.prediction-status { display: inline-flex; align-items: center; min-height: 24px; padding: 0 9px; border-radius: 999px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.65); font-size: 9px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; }
.prediction-status--open { color: #ff8d99; background: rgba(237,35,57,.16); border: 1px solid rgba(237,35,57,.24); }
.prediction-status--settled { color: #73d89c; background: rgba(57,183,108,.13); }
.prediction-bracket { margin-top: 14px; padding: 14px; border-radius: 20px; background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.08); }
.prediction-bracket > div { display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px; }
.prediction-bracket span { color: #fff; font-size: 10px; font-weight: 900; letter-spacing: .13em; }
.prediction-bracket small { color: rgba(255,255,255,.35); font-size: 9px; }
.prediction-bracket a { display: block; max-height: 280px; overflow: auto; border-radius: 13px; background: #09090a; }
.prediction-bracket img { display: block; width: 100%; height: auto; }
.prediction-market-list { display: flex; flex-direction: column; gap: 12px; margin-top: 14px; }
.prediction-market { padding: 16px; border-radius: 21px; background: linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.025)); border: 1px solid rgba(255,255,255,.09); }
.prediction-market__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.prediction-market__head h3 { margin: 0; color: #fff; font-size: 15px; line-height: 1.25; font-weight: 900; }
.prediction-market__head p { margin: 5px 0 0; color: rgba(255,255,255,.45); font-size: 11px; line-height: 1.4; }
.prediction-market__deadline { margin-top: 10px; color: rgba(255,255,255,.34); font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }
.prediction-options { display: grid; gap: 7px; margin-top: 13px; }
.prediction-option { width: 100%; min-height: 55px; padding: 8px 12px 8px 9px; border-radius: 15px; border: 1px solid rgba(255,255,255,.09); background: rgba(0,0,0,.18); color: #fff; display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left; }
.prediction-option:not(:disabled):active { transform: scale(.985); }
.prediction-option:disabled { opacity: .62; }
.prediction-option--selected { opacity: 1 !important; border-color: rgba(237,35,57,.46); background: rgba(237,35,57,.12); }
.prediction-option--winner { opacity: 1 !important; border-color: rgba(72,205,127,.45); background: rgba(72,205,127,.1); }
.prediction-option__team { min-width: 0; display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 800; }
.prediction-option__team img, .prediction-option__team i { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 11px; object-fit: contain; background: rgba(255,255,255,.07); display: grid; place-items: center; color: rgba(255,255,255,.72); font-size: 14px; font-style: normal; }
.prediction-option > strong { color: #ff7180; font-size: 13px; font-weight: 900; }
.prediction-entry { margin-top: 11px; padding: 11px 12px; border-radius: 14px; background: rgba(255,255,255,.04); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.prediction-entry__result-emoji { width: 32px; height: 32px; flex: 0 0 32px; object-fit: contain; }
.prediction-entry > div { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.prediction-entry span { color: #fff; font-size: 11px; font-weight: 800; }
.prediction-entry small { color: rgba(255,255,255,.42); font-size: 9px; }
.prediction-entry strong { color: rgba(255,255,255,.64); font-size: 10px; white-space: nowrap; }
.prediction-entry--won strong { color: #67d795; }
.prediction-entry--lost strong { color: #ff6676; }
.prediction-rules { margin: 16px 2px 0; padding: 16px; border-radius: 18px; background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.06); display: flex; flex-direction: column; gap: 8px; }
.prediction-rules strong { color: #fff; font-size: 12px; }
.prediction-rules span { color: rgba(255,255,255,.4); font-size: 10px; line-height: 1.5; }
.predictions-state { min-height: 260px; padding: 30px; color: rgba(255,255,255,.5); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; font-size: 13px; }
.predictions-state strong { color: #fff; font-size: 18px; }
.predictions-state button { border: 1px solid rgba(255,255,255,.1); border-radius: 999px; padding: 9px 14px; background: rgba(255,255,255,.06); color: #fff; }
.prediction-sheet-backdrop { position: fixed; inset: 0; z-index: 1600; display: flex; align-items: flex-end; background: rgba(0,0,0,.75); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); }
.prediction-sheet { width: 100%; max-height: 92dvh; padding: 8px 18px calc(18px + env(safe-area-inset-bottom, 0px)); overflow-y: auto; border-radius: 26px 26px 0 0; border-top: 1px solid rgba(255,255,255,.14); background: linear-gradient(150deg, #202024, #111113 58%); box-shadow: 0 -30px 70px rgba(0,0,0,.6); }
.prediction-sheet__grabber { width: 38px; height: 4px; margin: 2px auto 20px; border-radius: 999px; background: rgba(255,255,255,.22); }
.prediction-sheet__eyebrow { color: #ed5364; font-size: 9px; font-weight: 900; letter-spacing: .16em; }
.prediction-sheet h2 { margin: 7px 0 0; color: #fff; font-size: 24px; line-height: 1.1; font-weight: 950; }
.prediction-sheet > p { margin: 7px 0 19px; color: rgba(255,255,255,.42); font-size: 11px; }
.prediction-segment { padding: 4px; border-radius: 14px; background: rgba(0,0,0,.28); display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.prediction-segment--source { margin-top: 8px; }
.prediction-segment button { min-height: 39px; border: 0; border-radius: 11px; background: transparent; color: rgba(255,255,255,.48); font-size: 11px; font-weight: 800; }
.prediction-segment button.active { color: #fff; background: rgba(255,255,255,.1); box-shadow: inset 0 1px 0 rgba(255,255,255,.09); }
.prediction-amount { display: block; margin-top: 17px; }
.prediction-amount > span { color: rgba(255,255,255,.45); font-size: 10px; font-weight: 700; }
.prediction-amount > div { height: 58px; margin-top: 7px; padding: 0 15px; border: 1px solid rgba(255,255,255,.1); border-radius: 15px; background: rgba(0,0,0,.2); display: flex; align-items: center; }
.prediction-amount input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: #fff; font: 900 24px/1 Manrope, sans-serif; }
.prediction-amount b { color: rgba(255,255,255,.65); font-size: 16px; }
.prediction-return { margin-top: 9px; padding: 12px 2px; display: flex; align-items: center; justify-content: space-between; color: rgba(255,255,255,.45); font-size: 11px; }
.prediction-return strong { color: #73da9d; font-size: 13px; }
.prediction-error { margin: 4px 0 9px; color: #ff7583; font-size: 11px; text-align: center; }
.prediction-submit { width: 100%; min-height: 52px; border: 0; border-radius: 15px; background: linear-gradient(135deg, #ef2c43, #b80e25); color: #fff; font-size: 13px; font-weight: 900; box-shadow: 0 12px 30px rgba(217,22,45,.25); }
.prediction-submit:disabled { opacity: .55; }
.prediction-cancel { width: 100%; min-height: 42px; margin-top: 5px; border: 0; background: transparent; color: rgba(255,255,255,.38); font-size: 11px; }
.prediction-admin { display: flex; flex-direction: column; gap: 12px; }
.prediction-admin__section { padding: 15px; }
.prediction-admin__heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 13px; }
.prediction-admin__heading--list { margin: 8px 2px 0; }
.prediction-admin__heading h2 { margin: 0; color: var(--text-1); font-size: 15px; font-weight: 900; }
.prediction-admin__heading p { margin: 3px 0 0; color: var(--text-3); font-size: 10px; }
.prediction-admin__textarea { min-height: 78px; resize: vertical; padding-top: 10px; }
.prediction-admin__label { display: flex; flex-direction: column; gap: 6px; color: var(--text-3); font-size: 10px; font-weight: 750; }
.prediction-admin__check { display: flex; align-items: center; gap: 8px; color: var(--text-2); font-size: 11px; }
.prediction-admin__options { display: flex; flex-direction: column; gap: 7px; }
.prediction-admin__options > div { display: grid; grid-template-columns: minmax(0, 1fr) 96px 28px; gap: 6px; }
.prediction-admin__options button { border: 1px solid rgba(224,36,36,.3); border-radius: 9px; background: rgba(224,36,36,.1); color: #ff6d78; font-size: 18px; }
.prediction-admin__tournament { padding: 13px; overflow: hidden; }
.prediction-admin__tournament > img { width: calc(100% + 26px); max-height: 210px; margin: -13px -13px 13px; object-fit: cover; background: var(--bg-0); border-bottom: 1px solid var(--line-1); }
.prediction-admin__tournament-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.prediction-admin__tournament-head h3 { margin: 0; color: var(--text-1); font-size: 14px; font-weight: 900; }
.prediction-admin__tournament-head p { margin: 4px 0 0; color: var(--text-3); font-size: 10px; }
.prediction-admin__actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }
.prediction-admin__actions .btn { min-height: 34px; padding: 7px 10px; font-size: 10px; }
.prediction-admin__actions input { display: none; }
.prediction-admin__markets { display: flex; flex-direction: column; gap: 7px; margin-top: 12px; }
.prediction-admin__market { padding: 10px; border-radius: 12px; border: 1px solid var(--line-1); background: var(--bg-0); }
.prediction-admin__market > div:first-child { display: flex; flex-direction: column; gap: 3px; }
.prediction-admin__market strong { color: var(--text-1); font-size: 11px; }
.prediction-admin__market span { color: var(--text-3); font-size: 9px; }
.prediction-admin__resolve { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.prediction-admin__resolve button { min-height: 29px; padding: 5px 8px; border: 1px solid var(--line-1); border-radius: 8px; background: var(--bg-2); color: var(--text-2); font-size: 9px; font-weight: 750; }
.prediction-admin__resolve button.danger { color: #ff7782; border-color: rgba(224,36,36,.25); background: rgba(224,36,36,.08); }

.prediction-admin-simple { display: flex; flex-direction: column; gap: 14px; }
.prediction-admin-simple button { min-height: 34px; padding: 6px 10px; border: 1px solid var(--line-1); border-radius: 9px; color: var(--text-2); font-size: 10px; font-weight: 750; }
.prediction-admin-simple button:disabled { opacity: .4; }
.prediction-admin-simple__top { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; }
.prediction-admin-simple__save-status { margin-top: -8px; color: var(--text-4); font-size: 8px; text-align: right; }
.prediction-admin-simple__save-status.saving { color: #82cfdf; }
.prediction-admin-simple__save-status.error { color: #ff7a86; }
.prediction-admin-simple__archive { margin-top: -5px; border-top: 1px solid var(--line-1); border-bottom: 1px solid var(--line-1); }
.prediction-admin-simple__archive-toggle { width: 100%; min-height: 38px !important; padding: 0 2px !important; border: 0 !important; border-radius: 0 !important; display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left; }
.prediction-admin-simple__archive-toggle > span { color: var(--text-3); font-size: 10px; font-weight: 750; }
.prediction-admin-simple__archive-toggle b { min-width: 18px; height: 18px; margin-left: 5px; padding: 0 5px; border-radius: 999px; background: var(--bg-3); color: var(--text-2); display: inline-grid; place-items: center; font-size: 8px; }
.prediction-admin-simple__archive-toggle svg { flex: 0 0 auto; color: var(--text-4); }
.prediction-admin-simple__archive-list { padding: 0 0 7px; display: flex; flex-direction: column; }
.prediction-admin-simple__archive-item { min-height: 35px; border-top: 1px solid var(--line-1); display: grid; grid-template-columns: minmax(0,1fr) 32px; align-items: center; }
.prediction-admin-simple__archive-select { width: 100%; min-width: 0; min-height: 34px !important; padding: 6px 4px 6px 2px !important; border: 0 !important; border-radius: 0 !important; display: flex; align-items: center; justify-content: space-between; gap: 10px; text-align: left; }
.prediction-admin-simple__archive-select span { min-width: 0; overflow: hidden; color: var(--text-2); font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.prediction-admin-simple__archive-select small { flex: 0 0 auto; color: var(--text-4); font-size: 8px; }
.prediction-admin-simple__archive-item.active .prediction-admin-simple__archive-select span, .prediction-admin-simple__archive-item.active .prediction-admin-simple__archive-select small { color: #82cfdf; }
.prediction-admin-simple__archive-delete { width: 32px; min-width: 32px; min-height: 32px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: #ff7a86 !important; font-size: 18px !important; font-weight: 400 !important; }
.prediction-admin-simple__form { padding: 13px; border: 1px solid var(--line-1); border-radius: 14px; display: flex; flex-direction: column; gap: 8px; }
.prediction-admin-simple__form textarea { min-height: 68px; padding-top: 10px; resize: vertical; }
.prediction-admin-simple__form label, .prediction-admin-simple__dates label { display: flex; flex-direction: column; gap: 5px; color: var(--text-3); font-size: 9px; font-weight: 700; }
.prediction-admin-simple__dates { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.prediction-admin-simple__tournament { padding: 2px 1px 14px; border-bottom: 1px solid var(--line-1); }
.prediction-admin-simple__tournament > div:first-child > span { color: var(--red-1); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.prediction-admin-simple__tournament h2 { margin: 5px 0 0; font-size: 20px; line-height: 1.15; }
.prediction-admin-simple__tournament p { margin: 6px 0 0; color: var(--text-3); font-size: 11px; line-height: 1.45; }
.prediction-admin-simple__tournament > img { display: block; width: 100%; max-height: 230px; margin-top: 12px; border: 1px solid var(--line-1); border-radius: 12px; object-fit: contain; background: var(--bg-0); }
.prediction-admin-simple__actions, .prediction-admin-simple__form-actions, .prediction-admin-simple__market-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.prediction-admin-simple__actions label { min-height: 34px; padding: 6px 10px; border: 1px solid var(--line-1); border-radius: 9px; color: var(--text-2); display: inline-flex; align-items: center; font-size: 10px; font-weight: 750; }
.prediction-admin-simple__actions input { display: none; }
.prediction-admin-simple__options { display: flex; flex-direction: column; gap: 6px; }
.prediction-admin-simple__options > div { display: grid; grid-template-columns: minmax(0,1fr) 82px auto; gap: 6px; }
.prediction-admin-simple__options > div > button { min-width: 34px; padding: 0; color: #ff7582; }
.prediction-admin-simple__form-actions { justify-content: space-between; }
.prediction-admin-simple__markets { display: flex; flex-direction: column; border-top: 1px solid var(--line-1); }
.prediction-admin-simple__market { padding: 13px 1px; border-bottom: 1px solid var(--line-1); }
.prediction-admin-simple__market-title strong { color: var(--text-1); font-size: 12px; }
.prediction-admin-simple__market-title span { display: block; margin-top: 3px; color: var(--text-3); font-size: 9px; }
.prediction-admin-simple__settle { display: flex; flex-direction: column; gap: 7px; margin-top: 10px; }
.prediction-admin-simple__settle > span { color: var(--text-3); font-size: 9px; font-weight: 750; }
.prediction-admin-simple__winner-options { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px; }
.prediction-admin-simple__winner-options button { min-width: 0; min-height: 42px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.prediction-admin-simple__winner-options button small { color: var(--text-3); font-size: 8px; }
.prediction-admin-simple__winner-options button.selected { border-color: rgba(121,201,220,.5); background: rgba(121,201,220,.12); color: #9bd9e7; }
.prediction-admin-simple__waiting { margin-top: 9px; color: var(--text-4); font-size: 9px; }
.prediction-admin-simple__market-actions { margin-top: 6px; }
.prediction-admin-simple__market-actions button:last-child { color: #ff7582; }
.prediction-admin-simple__empty { padding: 28px 0; color: var(--text-3); font-size: 11px; text-align: center; }

.predictions-screen { background: var(--bg-0); }
.predictions-hero { background: rgba(10,10,12,.94); }
.predictions-brand { min-width: 0; display: flex; align-items: center; gap: 8px; }
.predictions-brand img { width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; }
.predictions-hero .predictions-brand strong { min-width: 0; color: #fff; font-size: 14px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.predictions-back { background: transparent; }
.prediction-tournament-tabs button, .prediction-tournament-tabs button.active { background: transparent; }
.prediction-tournament-tabs button.active { border-color: rgba(121,201,220,.42); color: #79c9dc; }
.prediction-cover { min-height: auto; padding: 20px 2px; border: 0; border-bottom: 1px solid rgba(255,255,255,.09); border-radius: 0; background: transparent; box-shadow: none; display: grid; grid-template-columns: 72px minmax(0,1fr); align-items: center; gap: 14px; }
.prediction-cover__glow { display: none; }
.prediction-cover__emblem { width: 72px; height: 72px; object-fit: contain; filter: drop-shadow(0 8px 14px rgba(0,0,0,.28)); }
.prediction-cover > .prediction-cover__body { min-width: 0; margin: 0; color: inherit; font-size: inherit; letter-spacing: normal; text-transform: none; }
.prediction-cover__kicker { display: flex; align-items: center; gap: 7px; color: rgba(255,255,255,.42); font-size: 8px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.prediction-cover__kicker i { width: 3px; height: 3px; border-radius: 50%; background: rgba(255,255,255,.28); }
.prediction-cover .prediction-status { min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: #79c9dc; font-size: 8px; letter-spacing: .08em; }
.prediction-cover h1 { max-width: 100%; margin-top: 7px; font-size: 25px; }
.prediction-cover p { max-width: 100%; margin-top: 8px; }
.prediction-highlights { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid rgba(255,255,255,.09); }
.prediction-highlights > div { min-width: 0; min-height: 72px; padding: 10px 5px; display: flex; align-items: center; gap: 8px; }
.prediction-highlights > div + div { border-left: 1px solid rgba(255,255,255,.08); padding-left: 10px; }
.prediction-highlights img { width: 43px; height: 43px; flex: 0 0 43px; object-fit: contain; }
.prediction-highlights span { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.prediction-highlights strong { color: rgba(255,255,255,.88); font-size: 9px; line-height: 1.2; }
.prediction-highlights small { color: rgba(255,255,255,.38); font-size: 8px; line-height: 1.25; }
.predictions-section-tabs { position: sticky; z-index: 18; top: 62px; height: 45px; padding: 0 14px; border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(10,10,12,.94); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); display: flex; gap: 20px; }
.predictions-section-tabs button { position: relative; height: 45px; padding: 0; border: 0; background: transparent; color: rgba(255,255,255,.42); font-size: 10px; font-weight: 850; display: flex; align-items: center; gap: 6px; }
.predictions-section-tabs button.active { color: #fff; }
.predictions-section-tabs button.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: #79c9dc; }
.predictions-section-tabs button span { min-width: 18px; height: 18px; padding: 0 5px; border: 1px solid rgba(121,201,220,.3); border-radius: 999px; color: #79c9dc; display: grid; place-items: center; font-size: 8px; }
.my-predictions { padding: 14px; }
.my-predictions section + section { margin-top: 22px; }
.my-predictions__title { min-height: 28px; display: flex; align-items: center; justify-content: space-between; }
.my-predictions__title strong { color: #fff; font-size: 12px; }
.my-predictions__title span { color: rgba(255,255,255,.35); font-size: 9px; }
.my-prediction { appearance: none; width: 100%; padding: 13px 0; border: 0; border-bottom: 1px solid rgba(255,255,255,.08); background: transparent; color: inherit; display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 11px; text-align: left; }
.my-prediction > img { width: 46px; height: 46px; object-fit: contain; }
.my-prediction__body { min-width: 0; }
.my-prediction__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.my-prediction__head > span { min-width: 0; color: rgba(255,255,255,.48); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.my-prediction__status { flex: 0 0 auto; color: rgba(255,255,255,.52); font-size: 8px; font-weight: 850; }
.my-prediction__status--placed { color: #79c9dc; }
.my-prediction__status--won { color: #75d89c; }
.my-prediction__status--lost { color: #ff7784; }
.my-prediction__body > small { display: block; margin-top: 4px; color: rgba(255,255,255,.34); font-size: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.my-prediction__body > strong { display: block; margin-top: 6px; color: #fff; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.my-prediction__numbers { margin-top: 11px; padding-top: 9px; border-top: 1px solid rgba(255,255,255,.06); display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.my-prediction__numbers > span { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.my-prediction__numbers small { color: rgba(255,255,255,.3); font-size: 7px; }
.my-prediction__numbers b { color: rgba(255,255,255,.78); font-size: 9px; white-space: nowrap; }
.my-prediction__source { margin-top: 9px; color: rgba(255,255,255,.27); font-size: 7px; }
.my-prediction:active { opacity: .68; }
.my-predictions-empty img { width: 78px; height: 78px; object-fit: contain; }
.my-predictions__more { width: 100%; min-height: 42px; padding: 10px 0; border: 0; background: transparent; color: var(--text-3); display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 11px; font-weight: 700; }
.my-predictions__more:disabled { opacity: .5; }
.my-predictions__count { padding: 5px 0 10px; color: var(--text-4); font-size: 9px; text-align: center; }
.my-predictions__page-error { padding: 10px 0; color: #ff7784; font-size: 9px; text-align: center; }
.prediction-bracket { padding: 12px 0; border-width: 0 0 1px; border-radius: 0; background: transparent; }
.prediction-market-list { gap: 0; }
.prediction-market { padding: 17px 0; border-width: 0 0 1px; border-radius: 0; background: transparent; }
.prediction-option { background: transparent; border-color: rgba(255,255,255,.11); }
.prediction-option--selected { background: transparent; border-color: rgba(237,35,57,.55); }
.prediction-option--winner { background: transparent; border-color: rgba(72,205,127,.55); }
.prediction-entry, .prediction-rules { background: transparent; }
.prediction-sheet { background: #111113; }
.prediction-segment, .prediction-segment button.active { background: transparent; box-shadow: none; }
.prediction-segment button.active { border: 1px solid rgba(255,255,255,.18); }
.prediction-submit { background: linear-gradient(135deg, #ef2c43, #b80e25); border: 1px solid #ef2c43; color: #fff; box-shadow: 0 10px 24px rgba(217,22,45,.22); }
.prediction-sheet-backdrop { display: block; padding: 0; background: rgba(0,0,0,.72); backdrop-filter: none; -webkit-backdrop-filter: none; overscroll-behavior: none; touch-action: none; }
.prediction-sheet { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(420px, calc(100% - 28px)); max-height: calc(100dvh - 28px); padding: 16px 15px calc(15px + env(safe-area-inset-bottom, 0px)); border: 1px solid rgba(255,255,255,.1); border-radius: 17px; background: #111214; box-shadow: 0 22px 60px rgba(0,0,0,.55); touch-action: pan-y; }
.prediction-sheet__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.prediction-sheet__header > div { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.prediction-sheet__header span { color: #79c9dc; font-size: 8px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.prediction-sheet__header strong { color: #fff; font-size: 16px; line-height: 1.2; }
.prediction-sheet__header > button { width: 34px; height: 34px; flex: 0 0 34px; padding: 0; border: 0; border-radius: 0; background: transparent; color: rgba(255,255,255,.45); font-size: 24px; font-weight: 400; line-height: 1; }
.prediction-sheet__choice { min-height: 58px; margin-top: 12px; padding: 8px 0 11px; border: 0; border-bottom: 1px solid rgba(255,255,255,.09); border-radius: 0; background: transparent; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; align-items: center; gap: 10px; }
.prediction-sheet__choice img { width: 36px; height: 36px; object-fit: contain; }
.prediction-sheet__choice > div { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.prediction-sheet__choice small { color: rgba(255,255,255,.38); font-size: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.prediction-sheet__choice strong { color: #fff; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.prediction-sheet__choice > b { min-width: 54px; color: #7dd0e0; font-size: 13px; text-align: right; }
.prediction-sheet__section-title { margin-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.prediction-sheet__section-title span { color: rgba(255,255,255,.76); font-size: 10px; font-weight: 800; }
.prediction-sheet__section-title small { color: rgba(255,255,255,.3); font-size: 8px; }
.prediction-segment--currency { margin-top: 5px; padding: 0; border-bottom: 1px solid rgba(255,255,255,.08); background: transparent; gap: 0; }
.prediction-segment--currency button { min-height: 40px; padding: 0 4px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; display: flex; align-items: center; justify-content: center; gap: 7px; }
.prediction-segment--currency button b { color: rgba(255,255,255,.78); font-size: 15px; }
.prediction-segment--currency button span { color: rgba(255,255,255,.53); font-size: 10px; }
.prediction-segment--currency button.active { border-color: #79c9dc; background: transparent; }
.prediction-segment--currency button.active span { color: #fff; }
.prediction-payment-source { margin-top: 4px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.prediction-payment-source button { min-width: 0; min-height: 49px; padding: 7px 4px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: inherit; display: flex; align-items: center; justify-content: space-between; gap: 7px; text-align: left; }
.prediction-payment-source button > span { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.prediction-payment-source button b { color: rgba(255,255,255,.7); font-size: 9px; }
.prediction-payment-source button small { color: rgba(255,255,255,.3); font-size: 7px; line-height: 1.3; }
.prediction-payment-source button i { width: 13px; height: 13px; flex: 0 0 13px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; }
.prediction-payment-source button.active { border-color: #79c9dc; }
.prediction-payment-source button.active b { color: #fff; }
.prediction-payment-source button.active i { border: 4px solid #79c9dc; }
.prediction-inline-currency { display: inline-flex !important; align-items: center; justify-content: center; gap: 3px; }
.prediction-currency-icon { display: inline-flex; align-items: center; justify-content: center; }
.prediction-amount { margin-top: 14px; }
.prediction-amount > span { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.prediction-amount > span > b { color: rgba(255,255,255,.76); font-size: 10px; }
.prediction-amount > span > small { color: rgba(255,255,255,.3); font-size: 8px; }
.prediction-amount > div { height: 51px; margin-top: 5px; padding: 0 2px; border: 0; border-bottom: 1px solid rgba(255,255,255,.15); border-radius: 0; background: transparent; }
.prediction-amount input { font-size: 22px; }
.prediction-quick-amounts { margin-top: 5px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; }
.prediction-quick-amounts button { min-width: 0; min-height: 30px; padding: 4px; border: 0; border-right: 1px solid rgba(255,255,255,.08); border-radius: 0; background: transparent; color: rgba(255,255,255,.38); display: flex; align-items: center; justify-content: center; gap: 3px; font-size: 8px; font-weight: 750; }
.prediction-quick-amounts button:last-child { border-right: 0; }
.prediction-quick-amounts button.active { color: #8fd5e3; }
.prediction-return { margin-top: 13px; padding: 12px 0; border-top: 1px solid rgba(255,255,255,.07); }
.prediction-return > span { display: flex; flex-direction: column; gap: 3px; }
.prediction-return small { color: rgba(255,255,255,.25); font-size: 7px; }
.prediction-return strong { color: #76d99d; font-size: 15px; }
.prediction-submit { min-height: 46px; border-radius: 11px; background: #e72b3f; box-shadow: none; font-size: 12px; }
.prediction-sheet__notice { margin-top: 9px; color: rgba(255,255,255,.27); font-size: 7px; line-height: 1.4; text-align: center; }
.prediction-admin-simple button { background: transparent; box-shadow: none; }
.prediction-admin-simple button.primary { background: var(--red-1); border-color: var(--red-1); color: #fff; }
.prediction-admin-simple__bracket-size { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.prediction-admin-simple__bracket-size button.active { background: var(--bg-3); border-color: var(--line-2); color: var(--text-1); }
.prediction-admin-simple__options > div { grid-template-columns: 24px minmax(0,1fr) 82px; align-items: center; }
.prediction-admin-simple__options > div > span { color: var(--text-3); font-size: 9px; font-weight: 800; text-align: center; }
.prediction-admin-simple button.danger { border-color: rgba(255,90,103,.32); color: #ff7a86; }
.prediction-admin-bracket { min-width: 0; padding-top: 2px; }
.prediction-admin-bracket__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.prediction-admin-bracket__top > div:first-child { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.prediction-admin-bracket__top strong { color: var(--text-1); font-size: 13px; font-weight: 900; }
.prediction-admin-bracket__top span { color: var(--text-3); font-size: 9px; line-height: 1.35; }
.prediction-admin-bracket__controls { flex: 0 0 auto; display: flex; gap: 2px; }
.prediction-admin-bracket__controls button { width: 30px; min-height: 30px; padding: 0; border: 0; background: transparent; display: grid; place-items: center; }
.prediction-admin-bracket__viewport { width: 100%; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: none; touch-action: pan-x pan-y; }
.prediction-admin-bracket__viewport::-webkit-scrollbar { display: none; }
.prediction-admin-bracket__surface { position: relative; min-width: 100%; }
.prediction-admin-bracket__lines { position: absolute; inset: 0; overflow: visible; pointer-events: none; }
.prediction-admin-bracket__lines path { fill: none; stroke: rgba(255,255,255,.2); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.prediction-admin-bracket__round { position: absolute; top: 0; bottom: 0; scroll-snap-align: start; }
.prediction-admin-bracket__round-name { height: 34px; color: var(--text-3); font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; display: flex; align-items: flex-start; }
.prediction-admin-bracket__matches { position: absolute; inset: 34px 0 0; }
.prediction-admin-bracket__match { position: absolute; left: 0; width: 180px; min-height: 0 !important; padding: 0 !important; transform: translateY(-50%); overflow: hidden; border: 1px solid var(--line-1) !important; border-radius: 10px !important; background: var(--bg-1) !important; text-align: left; box-shadow: 0 8px 18px rgba(0,0,0,.18) !important; }
.prediction-admin-bracket__match > span { min-height: 29px; padding: 0 9px; color: var(--text-2); display: flex; align-items: center; border-bottom: 1px solid var(--line-1); }
.prediction-admin-bracket__match > span:nth-child(2) { border-bottom: 0; }
.prediction-admin-bracket__match > span.winner { color: #77dca0; background: rgba(70,190,117,.09); }
.prediction-admin-bracket__match b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; font-weight: 800; }
.prediction-admin-bracket__match small { display: block; padding: 5px 8px; border-top: 1px solid var(--line-1); color: var(--text-4); font-size: 7px; font-weight: 750; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.prediction-admin-bracket__match--open { border-color: rgba(121,201,220,.28) !important; }
.prediction-admin-bracket__match--open small { color: #82cfdf; }
.prediction-admin-bracket__match--settled { border-color: rgba(72,205,127,.25) !important; }
.prediction-admin-bracket__match--settled small { color: #71d799; }
.prediction-admin-bracket__match--cancelled { opacity: .62; }
.prediction-admin-match-popup__panel { width: min(430px, 100%); }
.prediction-admin-match-popup__status { color: var(--text-3); font-size: 8px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.prediction-admin-match-popup__status--open { color: #82cfdf; }
.prediction-admin-match-popup__status--settled { color: #71d799; }
.prediction-admin-match-popup__status--cancelled { color: #ff7a86; }
.prediction-admin-match-popup__settle { margin-top: 18px; }
.prediction-admin-match-popup__settle > strong { color: var(--text-2); font-size: 10px; }
.prediction-admin-match-popup__options { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; margin-top: 8px; }
.prediction-admin-match-popup__options button { min-width: 0; min-height: 50px; padding: 8px 10px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 3px; text-align: left; }
.prediction-admin-match-popup__options button span { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-1); font-size: 11px; }
.prediction-admin-match-popup__options button small { color: var(--text-3); font-size: 8px; }
.prediction-admin-match-popup__options button.selected { border-color: rgba(121,201,220,.6); background: rgba(121,201,220,.13); }
.prediction-admin-match-popup__resolve { width: 100%; min-height: 43px !important; margin-top: 9px; }
.prediction-admin-match-popup__waiting, .prediction-admin-match-popup__result { margin-top: 16px; padding: 12px; border: 1px solid var(--line-1); border-radius: 11px; color: var(--text-3); font-size: 10px; line-height: 1.45; }
.prediction-admin-match-popup__result strong { color: #71d799; }
.prediction-admin-match-popup__actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.prediction-admin-match-popup__actions .danger { flex: 1 1 auto; }

.tournament-bracket-wrap { margin-top: 14px; padding: 14px 0 8px; border-top: 1px solid rgba(255,255,255,.08); border-bottom: 1px solid rgba(255,255,255,.08); }
.tournament-bracket__top { padding: 0 2px 13px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tournament-bracket__top > div:first-child { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.tournament-bracket__top strong { color: #fff; font-size: 13px; }
.tournament-bracket__top span { color: rgba(255,255,255,.38); font-size: 9px; text-align: right; }
.tournament-bracket__top > div:first-child span { text-align: left; }
.tournament-bracket__controls { flex: 0 0 auto; display: flex; gap: 5px; }
.tournament-bracket__controls button { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: rgba(255,255,255,.7); display: grid; place-items: center; }
.tournament-bracket { min-height: 440px; padding: 0 2px 8px; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; touch-action: pan-x pan-y; -webkit-overflow-scrolling: touch; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.18) transparent; cursor: grab; }
.tournament-bracket.dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.tournament-bracket__surface { position: relative; min-width: 100%; }
.tournament-bracket__lines { position: absolute; inset: 0; z-index: 0; overflow: visible; pointer-events: none; }
.tournament-bracket__lines path { fill: none; stroke: rgba(255,255,255,.3); stroke-width: 1.25; vector-effect: non-scaling-stroke; shape-rendering: geometricPrecision; }
.tournament-bracket__round { position: absolute; z-index: 1; top: 0; bottom: 0; display: flex; flex-direction: column; scroll-snap-align: start; scroll-margin-left: 2px; }
.tournament-bracket__round-name { height: 30px; color: rgba(255,255,255,.4); font-size: 9px; font-weight: 800; text-align: center; text-transform: uppercase; letter-spacing: .07em; }
.tournament-bracket__matches { position: relative; min-height: 0; flex: 1; }
.tournament-bracket__match { position: absolute; left: 0; right: 0; transform: translateY(-50%); border: 1px solid rgba(255,255,255,.14); border-radius: 8px; background: #222225; box-shadow: 0 5px 14px rgba(0,0,0,.22); }
.tournament-bracket__team { width: 100%; min-height: 42px; padding: 8px 9px; border: 0; border-bottom: 1px solid rgba(255,255,255,.09); background: #303034; color: rgba(255,255,255,.84); display: flex; align-items: center; justify-content: space-between; gap: 8px; text-align: left; touch-action: manipulation; cursor: pointer; }
.tournament-bracket__team:first-child { border-radius: 7px 7px 0 0; }
.tournament-bracket__team:nth-child(2) { border-bottom: 0; border-radius: 0 0 7px 7px; }
.tournament-bracket__team:not(:disabled):active { background: #3a3a3f; }
.tournament-bracket__team:disabled { opacity: .42; }
.tournament-bracket__team.selected { background: rgba(218,29,49,.28); color: #fff; opacity: 1; }
.tournament-bracket__team.winner { background: rgba(52,173,102,.22); color: #9becba; opacity: 1; }
.tournament-bracket__team span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; font-weight: 750; }
.tournament-bracket__team b { flex-shrink: 0; color: #ff7b89; font-size: 9px; }
.tournament-bracket__match > small { position: absolute; left: 0; top: calc(100% + 4px); color: rgba(255,255,255,.42); font-size: 8px; white-space: nowrap; }

.admin-layout { padding: 14px 16px 16px; }
.admin-modal-backdrop {
  position: fixed;
  z-index: 2100;
  inset: 0;
  width: 100%;
  height: 100dvh;
  padding: max(14px, env(safe-area-inset-top, 0px)) 14px max(14px, env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
  background: rgba(0,0,0,.74);
  display: grid;
  place-items: center;
  overflow: hidden;
  overscroll-behavior: none;
}
.admin-modal {
  position: relative;
  width: min(460px, 100%);
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--line-2);
  border-radius: 18px;
  background: #151517;
  box-shadow: 0 24px 70px rgba(0,0,0,.58);
  display: flex;
  flex-direction: column;
}
.admin-modal__header {
  min-height: 66px;
  flex: 0 0 auto;
  padding: 13px 14px;
  border-bottom: 1px solid var(--line-1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.admin-modal__heading { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.admin-modal__heading strong { overflow: hidden; color: var(--text-1); font-size: 16px; font-weight: 900; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.admin-modal__heading span { overflow: hidden; color: var(--text-3); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.admin-modal__header-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.admin-modal__close {
  width: 34px;
  height: 34px;
  min-height: 34px !important;
  flex: 0 0 34px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--text-3) !important;
  font-size: 23px !important;
  font-weight: 400 !important;
  line-height: 1;
}
.admin-modal__close:disabled { opacity: .35; }
.admin-modal__body {
  min-height: 0;
  padding: 14px 15px calc(18px + env(safe-area-inset-bottom, 0px));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.admin-modal__body .row { min-width: 0; }
.admin-modal__body .input { min-width: 0; }
.admin-modal__rating { color: var(--text-1); font-size: 17px; font-weight: 900; font-variant-numeric: tabular-nums; }
.admin-modal__header .prediction-admin-match-popup__status { max-width: 104px; line-height: 1.25; text-align: right; }
@media (max-width: 420px) {
  .admin-modal-backdrop { padding-right: 10px; padding-left: 10px; }
  .admin-modal { border-radius: 16px; }
  .admin-modal__header { min-height: 60px; padding: 11px 12px; gap: 8px; }
  .admin-modal__body { padding: 12px 13px calc(16px + env(safe-area-inset-bottom, 0px)); }
  .admin-modal__header .prediction-admin-match-popup__status { display: none; }
}
.admin-layout__header { min-height: 52px; margin-bottom: 16px; display: flex; align-items: center; gap: 12px; }
.admin-layout__header h1 { margin: 0; color: var(--text-1); font-size: 20px; line-height: 1.1; }
.admin-layout__header p { margin: 4px 0 0; color: var(--text-3); font-size: 10px; }
.admin-menu-button { width: 40px; height: 40px; flex: 0 0 40px; padding: 0; border: 1px solid var(--line-1); border-radius: 11px; background: var(--bg-2); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.admin-menu-button span { width: 16px; height: 1.5px; border-radius: 2px; background: var(--text-1); }
.admin-drawer-backdrop { position: fixed; inset: 0; z-index: 1800; width: 100%; height: 100dvh; background: rgba(0,0,0,.66); opacity: 0; pointer-events: none; transition: opacity 180ms ease; }
.admin-drawer-backdrop.open { opacity: 1; pointer-events: auto; }
.admin-drawer { position: fixed; z-index: 1810; left: 0; top: 0; bottom: auto; width: min(82vw, 292px); height: 100dvh; box-sizing: border-box; padding: env(safe-area-inset-top, 0px) 0 env(safe-area-inset-bottom, 0px); background: #121214; border-right: 1px solid var(--line-1); box-shadow: 24px 0 60px rgba(0,0,0,.5); display: flex; flex-direction: column; transform: translateX(-102%); transition: transform 220ms cubic-bezier(.2,.8,.2,1); overflow: hidden; }
.admin-drawer.open { transform: translateX(0); }
.admin-drawer__head { min-height: 72px; padding: 16px; border-bottom: 1px solid var(--line-1); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.admin-drawer__head > div { display: flex; flex-direction: column; gap: 4px; }
.admin-drawer__head strong { color: var(--text-1); font-size: 16px; }
.admin-drawer__head span { color: var(--text-3); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.admin-drawer__head button { width: 34px; height: 34px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--text-2); font-size: 20px; }
.admin-drawer__nav { min-height: 0; flex: 1; padding: 8px; overflow-y: auto; overscroll-behavior: contain; }
.admin-drawer__nav button { position: relative; width: 100%; min-height: 44px; padding: 0 13px; border: 0; border-radius: 10px; background: transparent; color: var(--text-3); display: flex; align-items: center; justify-content: space-between; text-align: left; font-size: 12px; font-weight: 750; }
.admin-drawer__nav button.active { background: var(--bg-3); color: var(--text-1); }
.admin-drawer__nav button.active i { width: 6px; height: 6px; border-radius: 50%; background: var(--red-1); box-shadow: 0 0 9px rgba(224,36,36,.55); }
.profile-medals{display:flex;align-items:center;gap:10px;height:58px;margin:12px 16px 0;padding:7px 9px;border:1px solid var(--line-1);border-radius:8px;background:linear-gradient(180deg,var(--bg-2),var(--bg-1));overflow:hidden}.profile-medals__head{display:flex;flex:0 0 auto;align-items:center;gap:6px;padding-right:9px;border-right:1px solid var(--line-1);font-size:10px;font-weight:800;color:var(--text-3);text-transform:uppercase;letter-spacing:.06em}.profile-medals__head b{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:3px;background:var(--bg-4);color:var(--text-2);font-size:10px}.profile-medals__rail{display:flex;min-width:0;flex:1;gap:7px;overflow-x:auto;scrollbar-width:none}.profile-medals__rail::-webkit-scrollbar{display:none}.profile-medal{appearance:none;display:flex;flex:0 0 44px;width:44px;height:44px;align-items:center;justify-content:center;padding:0;border:0;background:transparent;cursor:pointer;transition:transform .14s ease,filter .14s ease}.profile-medal:active{transform:scale(.9)}.profile-medal img{display:block;width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 3px 4px rgba(0,0,0,.45))}.medal-details-backdrop{position:fixed;inset:0;z-index:1200;display:flex;align-items:flex-end;justify-content:center;padding:16px;background:rgba(0,0,0,.72);backdrop-filter:blur(8px);animation:fadeIn .16s ease}.medal-details{position:relative;width:min(100%,390px);overflow:hidden;padding:28px 22px 24px;border:1px solid var(--line-2);border-radius:22px;background:linear-gradient(160deg,var(--bg-3),var(--bg-1));box-shadow:0 24px 70px rgba(0,0,0,.58);text-align:center;animation:medalDetailsUp .2s ease}.medal-details__close{position:absolute;top:12px;right:12px;z-index:2;width:32px;height:32px;border:1px solid var(--line-1);border-radius:50%;background:rgba(0,0,0,.2);color:var(--text-2);font-size:22px;line-height:1;cursor:pointer}.medal-details__glow{position:absolute;top:-90px;left:50%;width:230px;height:230px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(214,169,58,.2),transparent 68%);pointer-events:none}.medal-details__image{position:relative;width:128px;height:128px;object-fit:contain;filter:drop-shadow(0 12px 18px rgba(0,0,0,.48))}.medal-details h2{position:relative;margin:12px 0 7px;font-size:21px;letter-spacing:-.02em}.medal-details p{position:relative;margin:0 auto;max-width:300px;color:var(--text-2);font-size:13px;line-height:1.55}.medal-details__date{position:relative;display:inline-flex;margin-top:16px;padding:6px 10px;border:1px solid var(--line-1);border-radius:999px;background:rgba(0,0,0,.16);color:var(--text-3);font-size:10px;font-weight:700}@keyframes medalDetailsUp{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
.admin-medals{display:flex;flex-direction:column;gap:12px}.admin-medals h2{margin:0 0 10px;font-size:14px}.admin-medals__create,.admin-medals__assign{display:flex;flex-direction:column;gap:9px;padding:14px}.admin-medals__file{display:flex;align-items:center;justify-content:center;min-height:42px;padding:8px 12px;border:1px dashed var(--line-2);border-radius:10px;color:var(--text-2);font-size:12px;font-weight:700;cursor:pointer}.admin-medals__file input{display:none}.admin-medals__player{display:flex;justify-content:space-between;align-items:center;padding:9px 10px;border-radius:9px;background:var(--bg-1);font-size:12px}.admin-medals__player span{color:var(--text-3)}.admin-medals__catalog{padding-top:2px}.admin-medals__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.admin-medals__grid button{appearance:none;display:flex;min-width:0;flex-direction:column;align-items:center;padding:10px 6px;border:1px solid var(--line-1);border-radius:12px;background:var(--bg-2);color:var(--text-1);cursor:pointer}.admin-medals__grid button.owned{border-color:rgba(67,190,115,.55);background:rgba(67,190,115,.08)}.admin-medals__grid button.inactive{opacity:.48}.admin-medals__grid img{width:58px;height:58px;object-fit:contain;margin-bottom:6px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.35))}.admin-medals__grid span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:800}.admin-medals__grid small{margin-top:3px;color:var(--text-3);font-size:9px;text-align:center}.admin-medals__empty{padding:16px;text-align:center;color:var(--text-3);font-size:12px}.admin-medal-editor{display:flex;flex-direction:column;gap:12px}.admin-medal-editor__preview{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line-1);border-radius:13px;background:var(--bg-2)}.admin-medal-editor__preview img{width:64px;height:64px;flex:0 0 64px;object-fit:contain;filter:drop-shadow(0 5px 8px rgba(0,0,0,.4))}.admin-medal-editor__preview div{min-width:0;display:flex;flex-direction:column;gap:4px}.admin-medal-editor__preview strong{overflow:hidden;color:var(--text-1);font-size:14px;text-overflow:ellipsis;white-space:nowrap}.admin-medal-editor__preview span{display:-webkit-box;overflow:hidden;color:var(--text-3);font-size:10px;line-height:1.4;-webkit-box-orient:vertical;-webkit-line-clamp:2}.admin-medal-editor label{display:flex;flex-direction:column;gap:6px}.admin-medal-editor label>span{color:var(--text-3);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.admin-medal-editor textarea{min-height:112px;resize:vertical;line-height:1.45}.admin-medal-editor__actions{display:grid;grid-template-columns:1fr 1.35fr;gap:8px}.prediction-admin-simple__reward,.prediction-tournament__reward{display:flex;align-items:center;gap:9px;margin-top:10px;padding:8px 10px;border:1px solid rgba(214,169,58,.24);border-radius:10px;background:rgba(214,169,58,.07);color:var(--text-2);font-size:11px}.prediction-admin-simple__reward img,.prediction-tournament__reward img{width:36px;height:36px;object-fit:contain;flex-shrink:0}.prediction-admin-simple__reward b,.prediction-tournament__reward b{color:#d6a93a}
.profile-medals{background:transparent}
.profile-medals__head b{background:transparent;border:1px solid var(--line-1)}
.profile-medals{width:100%;height:40px;margin:2px 0 0;padding:3px 5px;gap:6px;border-radius:7px}.profile-medals__head{gap:4px;padding-right:6px;font-size:8px}.profile-medals__head b{min-width:15px;height:15px;padding:0 4px;font-size:8px}.profile-medals__rail{gap:4px}.profile-medal{flex-basis:32px;width:32px;height:32px}.profile-medal img{width:31px;height:31px}
.profile-medals{border:0}.profile-medals__head{border-right:0}.profile-medals__head b{border:0}
.medal-details{padding-bottom:48px}.medal-details__image{width:164px;height:164px}.medal-details__date{position:absolute;left:16px;bottom:14px;margin:0;padding:0;border:0;border-radius:0;background:transparent;font-size:9px;text-align:left}
.profile-medals{display:block;width:auto;height:auto;margin:12px 16px 0;padding:0;border:0;border-radius:5px;background:rgba(0,0,0,.2);overflow:hidden}.profile-medals__head{display:block;padding:5px 10px;color:#fff;background:linear-gradient(90deg,rgba(55,70,79,.78) 0%,rgba(36,44,49,.38) 90%);font-size:14px;font-weight:300;line-height:28px;letter-spacing:0;text-transform:none}.profile-medals__content{padding:12px 10px 5px}.profile-medals__rail{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none}.profile-medal{flex:0 0 54px;width:54px;height:54px}.profile-medal img{width:54px;height:54px;filter:none}.profile-medals__stats{display:flex;align-items:baseline;gap:7px;padding:3px 10px 10px;white-space:nowrap}.profile-medals__stats strong{color:#fff;font-size:23px;font-weight:300;line-height:1}.profile-medals__stats span{color:#9b9b9b;font-size:11px;font-weight:400}
.profile-medals{margin-top:10px}.profile-medals__head{padding:2px 8px;font-size:11px;line-height:22px}.profile-medals__content{padding:6px 8px 2px}.profile-medals__rail{gap:8px}.profile-medal{flex-basis:38px;width:38px;height:38px}.profile-medal img{width:38px;height:38px}.profile-medals__stats{gap:5px;padding:1px 8px 6px}.profile-medals__stats strong{font-size:16px}.profile-medals__stats span{font-size:9px}
.profile-setting-segments{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:3px;border-radius:9px;background:var(--bg-1)}.profile-setting-segments button{appearance:none;padding:8px 5px;border:0;border-radius:7px;background:transparent;color:var(--text-3);font-size:11px;font-weight:700;cursor:pointer}.profile-setting-segments button.active{background:var(--bg-4);color:var(--text-1)}.profile-accent-options{display:flex;gap:12px}.profile-accent-options button{appearance:none;width:30px;height:30px;padding:0;border:3px solid var(--bg-2);border-radius:50%;background:var(--accent-option);box-shadow:0 0 0 1px var(--line-2);cursor:pointer}.profile-accent-options button.active{box-shadow:0 0 0 2px var(--text-1)}.profile-info-order{display:flex;flex-direction:column;gap:5px}.profile-info-order>div{display:flex;align-items:center;justify-content:space-between;min-height:36px;padding:5px 7px 5px 10px;border-radius:8px;background:var(--bg-1);font-size:12px;font-weight:600}.profile-info-order>div>div{display:flex;gap:4px}.profile-info-order button{appearance:none;width:28px;height:26px;border:1px solid var(--line-1);border-radius:6px;background:var(--bg-3);color:var(--text-2);cursor:pointer}.profile-info-order button:disabled{opacity:.3}
.profile-header-game{display:inline-flex;align-items:center;align-self:flex-start;gap:6px;padding:4px 8px;border:1px solid var(--line-1);border-radius:8px;background:var(--bg-2);color:var(--text-1)}.profile-header-game span{color:var(--text-3);font-size:9px;font-weight:900;text-transform:uppercase}.profile-header-game b{font-size:12px;font-weight:800}.profile-identity-card{width:140px!important;height:178px;min-width:140px;max-width:140px;min-height:178px;max-height:178px;align-self:flex-start}.profile-identity-card__banner{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;pointer-events:none}.profile-identity-card__shade{position:absolute;inset:0;background:rgba(0,0,0,.5);pointer-events:none}.profile-header--expanded{flex-direction:column}.profile-header--expanded .profile-identity-card{align-self:center}.profile-header--expanded .profile-header-info{width:100%;padding:2px 4px}.profile-header--expanded .profile-header-info>.col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 10px}.profile-header--expanded .profile-header-info>.col>*{min-width:0}.profile-header--expanded .profile-medals{grid-column:1/-1;margin:2px 0 0}.profile-customized .profile-medals__head{background:linear-gradient(90deg,rgba(var(--profile-accent-rgb),.38),rgba(var(--profile-accent-rgb),.08) 90%)}
.profile-customization-locked{display:flex;align-items:center;gap:11px;padding:14px;color:var(--gold)}.profile-customization-locked>div{display:flex;min-width:0;flex-direction:column;gap:3px}.profile-customization-locked strong{color:var(--text-1);font-size:13px}.profile-customization-locked span{color:var(--text-3);font-size:11px;line-height:1.4}
.profile-header--compact>.profile-header-actions{grid-column:1/-1;grid-row:2}.profile-header-actions{width:100%}.profile-header-actions:empty{display:none}.profile-header--compact .profile-header-about p{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}.profile-header--expanded>.profile-header-actions{align-self:stretch}
.profile-picker-backdrop{display:block!important;padding:0!important;background:transparent!important;backdrop-filter:none!important}.profile-picker{position:fixed!important;width:min(250px,calc(100vw - 20px))!important;padding:12px!important;border-radius:12px!important}.profile-picker>strong{margin-bottom:10px!important;font-size:12px!important}.profile-picker__palette{gap:7px!important}.profile-picker__palette button{border-radius:9px!important}.profile-picker__palette--rings button{border:4px solid var(--palette-color)!important;border-radius:50%!important;background:var(--bg-3)!important}.profile-setting-choice>i.profile-setting-choice__ring{border-width:4px;background:var(--bg-3)}
.profile-setting-choice{appearance:none;display:flex;width:100%;min-height:52px;align-items:center;gap:10px;padding:9px 14px;border:0;border-bottom:1px solid var(--line-1);background:transparent;color:var(--text-1);text-align:left;cursor:pointer}.profile-setting-choice>span{display:flex;min-width:0;flex:1;flex-direction:column;gap:2px}.profile-setting-choice strong{font-size:13px}.profile-setting-choice small{color:var(--text-3);font-size:10px}.profile-setting-choice>i{width:19px;height:19px;flex:0 0 19px;border:2px solid var(--bg-2);border-radius:50%;box-shadow:0 0 0 1px var(--line-2)}.profile-setting-choice>svg{flex:0 0 auto;color:var(--text-4)}.profile-setting-choice:disabled{opacity:.55}.profile-picker-backdrop{position:fixed;inset:0;z-index:1800;display:flex;align-items:flex-end;justify-content:center;padding:14px;background:rgba(0,0,0,.68);backdrop-filter:blur(5px)}.profile-picker{width:min(100%,360px);padding:15px 14px calc(15px + env(safe-area-inset-bottom,0px));border:1px solid var(--line-2);border-radius:18px;background:var(--bg-2);box-shadow:0 22px 60px rgba(0,0,0,.55)}.profile-picker>strong{display:block;margin-bottom:12px;font-size:15px}.profile-picker__options{display:flex;flex-direction:column;gap:5px}.profile-picker__options button{appearance:none;display:flex;min-height:42px;align-items:center;justify-content:space-between;padding:0 12px;border:1px solid var(--line-1);border-radius:10px;background:var(--bg-1);color:var(--text-2);font-size:12px;font-weight:700;cursor:pointer}.profile-picker__options button.active{border-color:var(--red-2);color:var(--text-1)}.profile-picker__palette{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.profile-picker__palette button{appearance:none;display:flex;aspect-ratio:1;align-items:center;justify-content:center;padding:0;border:3px solid var(--bg-2);border-radius:13px;background:var(--palette-color);color:#fff;box-shadow:0 0 0 1px var(--line-2);cursor:pointer}.profile-picker__palette button.active{box-shadow:0 0 0 2px #fff}
.profile-header--compact{display:grid!important;grid-template-columns:140px minmax(0,1fr);align-items:start!important}.profile-header--compact>.profile-identity-card{grid-column:1;grid-row:1}.profile-header--compact>.profile-header-info{grid-column:2;grid-row:1;align-self:stretch}.profile-header--expanded{display:flex!important}
.profile-picker__palette button.profile-picker__texture{background-position:center;background-size:cover;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),0 0 0 1px var(--line-2)}.profile-picker__palette button.profile-picker__texture.active{box-shadow:inset 0 0 0 1px rgba(255,255,255,.25),0 0 0 2px #fff}
.profile-identity-card__fallback{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 30%,rgba(var(--profile-accent-rgb),.16),transparent 70%)}
.profile-level-card__accent{position:absolute;inset:0;background:radial-gradient(circle at 100% 0%,rgba(var(--profile-accent-rgb),.2),transparent 50%);pointer-events:none}
.profile-texture--minecraft .profile-medals{background:rgba(0,0,0,.2)}.profile-texture--minecraft .profile-medals__head{background-image:linear-gradient(90deg,rgba(64,119,45,.58),rgba(20,38,16,.48)),url("/assets/profile-textures/minecraft.webp");background-position:center;background-size:auto,220px 220px}
.profile-texture--minecraft .profile-level-card__accent{left:auto;width:62%;background-image:linear-gradient(rgba(13,22,11,.2),rgba(8,14,7,.48)),url("/assets/profile-textures/minecraft.webp");background-position:right center;background-size:auto,240px 240px;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 22%,#000 72%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 22%,#000 72%)}.profile-texture--minecraft .profile-level-progress{background:linear-gradient(90deg,#4f9f38,#8bd45f)!important;box-shadow:0 0 8px rgba(111,196,76,.48)}
.profile-texture--cats .profile-medals{background:rgba(0,0,0,.2)}.profile-texture--cats .profile-medals__head{background-image:linear-gradient(90deg,rgba(213,101,119,.48),rgba(72,38,44,.5)),url("/assets/profile-textures/cats.webp");background-position:center;background-size:auto,220px 220px}
.profile-texture--cats .profile-level-card__accent{left:auto;width:62%;background-image:linear-gradient(rgba(66,35,39,.08),rgba(31,18,20,.42)),url("/assets/profile-textures/cats.webp");background-position:right center;background-size:auto,240px 240px;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 22%,#000 72%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 22%,#000 72%)}.profile-texture--cats .profile-level-progress{background:linear-gradient(90deg,#dc7184,#f2a38d)!important;box-shadow:0 0 8px rgba(232,126,142,.42)}
.profile-texture--binary .profile-medals{background:rgba(0,0,0,.2)}.profile-texture--binary .profile-medals__head{background-image:linear-gradient(90deg,rgba(36,42,50,.26),rgba(5,7,10,.58)),url("/assets/profile-textures/binary.webp");background-position:center;background-size:auto,220px 220px}
.profile-texture--binary .profile-level-card__accent{left:auto;width:62%;background-image:linear-gradient(rgba(3,5,8,.02),rgba(3,5,8,.36)),url("/assets/profile-textures/binary.webp");background-position:right center;background-size:auto,240px 240px;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 22%,#000 72%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.18) 22%,#000 72%)}.profile-texture--binary .profile-level-progress{background:linear-gradient(90deg,#818a96,#f2f5f8)!important;box-shadow:0 0 8px rgba(226,233,240,.35)}
.profile-layout-preview{display:grid;grid-template-columns:88px minmax(0,1fr);gap:8px;padding:9px;border:1px solid var(--line-1);border-radius:12px;background:var(--bg-1)}.profile-layout-preview__banner{position:relative;display:flex;grid-column:1;grid-row:1;min-height:112px;overflow:hidden;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:10px 6px;border:1px solid color-mix(in srgb,var(--preview-accent) 36%,var(--line-1));border-radius:10px;background:radial-gradient(circle at 50% 15%,color-mix(in srgb,var(--preview-accent) 24%,transparent),transparent 70%),var(--bg-3)}.profile-layout-preview__banner strong{max-width:100%;overflow:hidden;color:var(--text-1);font-size:9px;text-overflow:ellipsis;white-space:nowrap}.profile-layout-preview__avatar{display:flex;width:44px;height:44px;align-items:center;justify-content:center;border:2px solid var(--preview-accent);border-radius:50%;background:var(--bg-2);color:var(--text-1);font-size:14px;font-weight:900}.profile-layout-preview__slots{display:flex;grid-column:2;grid-row:1;min-width:0;flex-direction:column;gap:4px}.profile-layout-preview__item{display:flex;min-width:0;min-height:31px;align-items:center;gap:5px;padding:3px 4px;border:1px solid var(--line-1);border-radius:7px;background:var(--bg-2);transition:opacity .12s,transform .12s,border-color .12s;cursor:grab}.profile-layout-preview__item.is-dragging{opacity:.35;transform:scale(.98)}.profile-layout-preview__item.is-hidden{opacity:.38}.profile-layout-preview__handle{flex:0 0 auto;color:var(--text-4);font-size:14px}.profile-layout-preview__value{display:flex;min-width:0;flex:1;flex-direction:column;overflow:hidden;color:var(--text-2);font-size:9px;text-overflow:ellipsis;white-space:nowrap}.profile-layout-preview__value small{color:var(--text-4);font-size:7px;line-height:1.1;text-transform:uppercase}.profile-layout-preview__controls{display:flex;flex:0 0 auto;gap:2px}.profile-layout-preview__controls button{width:23px;height:23px;padding:0;border:0;border-radius:5px;background:var(--bg-4);color:var(--text-2);font-size:10px;cursor:pointer}.profile-layout-preview__controls button:disabled{opacity:.22}.profile-layout-preview__medals{display:flex;grid-column:1/-1;align-items:center;gap:5px;min-height:30px;padding:4px 7px;border-radius:7px;background:color-mix(in srgb,var(--preview-accent) 13%,var(--bg-2))}.profile-layout-preview__medals span{width:21px;height:21px;border-radius:50%;background:linear-gradient(145deg,var(--gold),#75561c)}.profile-layout-preview__medals b{margin-left:auto;color:var(--text-3);font-size:8px;text-transform:uppercase}.profile-layout-preview--expanded{grid-template-columns:1fr}.profile-layout-preview--expanded .profile-layout-preview__banner{grid-column:1;justify-self:center;width:88px}.profile-layout-preview--expanded .profile-layout-preview__slots{display:grid;grid-column:1;grid-row:2;grid-template-columns:repeat(2,minmax(0,1fr))}.profile-layout-preview--expanded .profile-layout-preview__medals{grid-column:1;grid-row:3}
.admin-quests{display:flex;flex-direction:column;gap:12px}.admin-quests__settings,.admin-quests__season{display:flex;flex-direction:column;gap:12px;padding:14px}.admin-quests__status{display:flex;align-items:center;justify-content:space-between;gap:12px}.admin-quests__status>div,.admin-quests__season>div:first-child{display:flex;min-width:0;flex-direction:column;gap:3px}.admin-quests__status strong,.admin-quests__season strong{font-size:14px}.admin-quests__status span,.admin-quests__season span{color:var(--text-3);font-size:10px}.admin-quests__switch{appearance:none;position:relative;width:42px;height:24px;flex:0 0 42px;padding:0;border:1px solid var(--line-2);border-radius:999px;background:var(--bg-1);cursor:pointer}.admin-quests__switch i{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--text-3);transition:left .16s,background .16s}.admin-quests__switch.active{border-color:rgba(67,190,115,.45);background:rgba(67,190,115,.15)}.admin-quests__switch.active i{left:20px;background:var(--green)}.admin-quests__counts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.admin-quests__counts label,.admin-quests__quest-values label{display:flex;min-width:0;flex-direction:column;gap:5px}.admin-quests__counts label span,.admin-quests__quest-values label span{color:var(--text-3);font-size:9px;font-weight:800;text-transform:uppercase}.admin-quests__counts button{grid-column:1/-1}.admin-quests__season small{color:var(--text-4);font-size:9px;line-height:1.45}.admin-quests__medal{display:flex!important;align-items:center!important;flex-direction:row!important;gap:10px!important;padding:8px;border-radius:10px;background:var(--bg-1)}.admin-quests__medal img{width:48px;height:48px;object-fit:contain}.admin-quests__medal span{color:var(--text-1)!important;font-size:12px!important;font-weight:800}.admin-quests__leaders h2{margin:4px 0 9px;font-size:14px}.admin-quests__leaders{display:flex;flex-direction:column;gap:6px}.admin-quests__leaders>.card{display:flex;align-items:center;gap:10px;padding:10px}.admin-quests__leaders>.card>b{width:24px;color:var(--red-1);font-size:12px}.admin-quests__leaders>.card>span{display:flex;min-width:0;flex:1;flex-direction:column;font-size:12px;font-weight:800}.admin-quests__leaders small{color:var(--text-4);font-size:9px;font-weight:500}.admin-quests__leaders>.card>strong{display:flex;flex-direction:column;align-items:flex-end;font-size:12px}.admin-quests__empty{justify-content:center!important;color:var(--text-3);font-size:11px}.admin-quests__filters{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}.admin-quests__filters>div{display:flex;min-width:0;gap:4px}.admin-quests__filters button{appearance:none;padding:8px 9px;border:1px solid var(--line-1);border-radius:8px;background:var(--bg-2);color:var(--text-3);font-size:10px;font-weight:800}.admin-quests__filters button.active{border-color:var(--red-2);color:var(--text-1)}.admin-quests__filters select{width:118px}.admin-quests__list{display:flex;flex-direction:column;gap:8px}.admin-quests__list article{display:flex;flex-direction:column;gap:7px;padding:11px}.admin-quests__list article.disabled{opacity:.58}.admin-quests__quest-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.admin-quests__quest-head>div{display:flex;min-width:0;flex-direction:column;gap:2px}.admin-quests__quest-head strong{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.admin-quests__quest-head span{color:var(--text-4);font-size:8px;text-transform:uppercase}.admin-quests__quest-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.admin-quests__quest-values .input{min-width:0;padding-right:6px;padding-left:6px}