:root {
  --bg: #1a0e0c;
  --bg-deep: #0d0706;
  --surface: #2a1714;
  --surface-2: #3a201b;
  --surface-3: #4a2821;
  --cream: #fff0c6;
  --cream-soft: #d5bda0;
  --white: #fff8eb;
  --coral: #ff7359;
  --frosting: #ff9d9a;
  --gold: #ffc75f;
  --violet: #a84d65;
  --danger: #ff6471;
  --stroke: rgba(255, 240, 194, .13);
  --stroke-strong: rgba(255, 240, 194, .23);
  --nav-height: 76px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --pixel: "Press Start 2P", monospace;
  --ui: "Inter", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; min-height: 100%; background: var(--bg); }
body {
  color: var(--white);
  font-family: var(--ui);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
}
button, input { font: inherit; }
button { color: inherit; }
button:disabled { opacity: .58; cursor: not-allowed; }
.data-placeholder {
  width: 100%;
  padding: 22px 12px;
  color: var(--cream-soft);
  text-align: center;
  font-size: 12px;
}

.app-shell {
  width: min(100%, 520px);
  height: 100dvh;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    radial-gradient(circle at 50% -5%, rgba(255,115,89,.28), transparent 36%),
    radial-gradient(circle at 110% 66%, rgba(255,199,95,.1), transparent 30%),
    var(--bg);
  background-size: 12px 12px, 12px 12px, auto, auto, auto;
}
.app-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 50;
  opacity: .1;
  background: repeating-linear-gradient(0deg, transparent 0 3px, rgba(0,0,0,.2) 3px 4px);
}

.loading-screen {
  position: fixed;
  z-index: 200;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background:
    linear-gradient(rgba(255,255,255,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px),
    #140e0c;
  background-size: 10px 10px;
  transition: opacity .35s ease, visibility .35s ease;
}
.loading-screen.hidden { opacity: 0; visibility: hidden; }
.loading-word {
  margin-top: 22px;
  color: var(--cream);
  font: 18px/1 var(--pixel);
  letter-spacing: 4px;
  text-shadow: 4px 4px 0 #5c2d22;
}
.loading-label { margin-top: 17px; color: var(--frosting); font: 8px/1 var(--pixel); }
.loading-track {
  width: 210px;
  height: 19px;
  margin-top: 12px;
  padding: 3px;
  border: 3px solid var(--cream);
  box-shadow: 4px 4px 0 #5c2d22;
}
.loading-track span {
  display: block;
  width: 0;
  height: 100%;
  background: repeating-linear-gradient(90deg, var(--coral) 0 12px, transparent 12px 15px);
  animation: loading 1s ease forwards;
}
@keyframes loading { to { width: 100%; } }
.loading-cookie {
  width: 74px;
  height: 74px;
  position: relative;
  border: 5px solid #5b2c21;
  background: #cc7656;
  clip-path: polygon(14% 0, 86% 0, 86% 7%, 100% 7%, 100% 72%, 93% 72%, 93% 86%, 79% 86%, 79% 100%, 21% 100%, 21% 93%, 7% 93%, 7% 79%, 0 79%, 0 21%, 7% 21%, 7% 7%, 14% 7%);
  animation: cookie-bob 1.2s steps(2) infinite;
}
.loading-cookie::after {
  content: "";
  position: absolute;
  inset: 6px;
  background: var(--frosting);
  clip-path: polygon(0 0, 100% 0, 100% 67%, 88% 67%, 88% 76%, 68% 76%, 68% 67%, 49% 67%, 49% 76%, 28% 76%, 28% 67%, 9% 67%, 9% 57%, 0 57%);
}
.loading-cookie i {
  position: absolute;
  z-index: 2;
  width: 7px;
  height: 7px;
  background: var(--gold);
}
.loading-cookie i:nth-child(1) { left: 18px; top: 18px; }
.loading-cookie i:nth-child(2) { right: 15px; top: 27px; background: var(--coral); }
.loading-cookie i:nth-child(3) { left: 30px; top: 42px; background: #5a291f; }
.loading-cookie i:nth-child(4) { right: 23px; top: 10px; background: var(--cream); }
@keyframes cookie-bob { 50% { transform: translateY(-7px); } }

.app-header {
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  position: relative;
  z-index: 20;
  padding: max(11px, env(safe-area-inset-top)) 16px 8px;
}
.brand-lockup { display: flex; align-items: center; min-width: 0; gap: 10px; }
.mini-cookie {
  width: 35px;
  height: 35px;
  flex: 0 0 auto;
  position: relative;
  border: 3px solid #5b2c21;
  background: #cc7656;
  clip-path: polygon(14% 0, 86% 0, 86% 8%, 100% 8%, 100% 72%, 92% 72%, 92% 87%, 78% 87%, 78% 100%, 20% 100%, 20% 93%, 7% 93%, 7% 79%, 0 79%, 0 21%, 7% 21%, 7% 7%, 14% 7%);
}
.mini-cookie::before {
  content: "";
  position: absolute;
  inset: 4px;
  background: var(--frosting);
  clip-path: polygon(0 0, 100% 0, 100% 64%, 79% 64%, 79% 75%, 57% 75%, 57% 65%, 35% 65%, 35% 75%, 14% 75%, 14% 60%, 0 60%);
}
.mini-cookie { animation: logo-bob 3.4s ease-in-out infinite; }
@keyframes logo-bob {
  50% { transform: translateY(-2px) rotate(-4deg); filter: drop-shadow(0 4px 6px rgba(255,115,89,.25)); }
}
.brand-copy { min-width: 0; }
.brand-copy strong {
  display: block;
  color: var(--cream);
  font: 10px/1 var(--pixel);
  letter-spacing: .5px;
  white-space: nowrap;
}

.wallet-pill {
  height: 39px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--stroke-strong);
  border-radius: 14px;
  padding: 0 11px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(74,40,33,.95), rgba(42,23,20,.95));
  box-shadow: 0 8px 22px rgba(0,0,0,.25), 0 0 18px rgba(255,199,95,.05);
  cursor: pointer;
}
.wallet-pill::after {
  content: "";
  width: 30px;
  height: 70px;
  position: absolute;
  left: -45px;
  top: -18px;
  transform: rotate(25deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent);
  animation: wallet-shine 5s ease-in-out infinite;
}
@keyframes wallet-shine { 55%, 100% { left: 120%; } }
.wallet-pill svg { width: 16px; height: 16px; color: var(--gold); }
.wallet-pill b { color: var(--cream); font-size: 13px; }

.pages {
  height: calc(100dvh - 70px);
  position: relative;
}
.page {
  position: absolute;
  inset: 0;
  display: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 10px 16px calc(var(--nav-height) + var(--safe-bottom) + 25px);
  scrollbar-width: none;
}
.page::-webkit-scrollbar { display: none; }
.page.active { display: block; animation: page-enter .25s ease both; }
@keyframes page-enter {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.page-kicker {
  margin: 0 0 7px;
  color: var(--gold);
  font: 7px/1.4 var(--pixel);
  text-transform: uppercase;
  letter-spacing: .5px;
}
.page-title {
  margin: 0;
  color: var(--cream);
  font: 800 28px/1.1 var(--ui);
  letter-spacing: -.8px;
}
.page-subtitle {
  max-width: 350px;
  margin: 10px 0 0;
  color: var(--cream-soft);
  font-size: 12px;
  line-height: 1.55;
}

.pixel-card {
  position: relative;
  border: 1px solid var(--stroke);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(70,37,31,.97), rgba(35,19,17,.98));
  box-shadow: 0 14px 34px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,240,198,.035);
}
.pixel-card::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  right: 12px;
  top: 12px;
  background: rgba(255,240,194,.25);
  box-shadow: 8px 0 0 rgba(255,240,194,.12), 0 8px 0 rgba(255,240,194,.12);
}

.profile-hero {
  min-height: 162px;
  margin-top: 18px;
  padding: 18px;
  overflow: hidden;
}
.profile-hero::before {
  content: "";
  position: absolute;
  width: 190px;
  height: 190px;
  right: -60px;
  top: -74px;
  border: 1px dashed rgba(255,157,154,.28);
  border-radius: 50%;
  animation: orbit 14s linear infinite;
}
@keyframes orbit { to { transform: rotate(360deg); } }
.profile-orbit {
  width: 124px;
  height: 124px;
  position: absolute;
  z-index: 1;
  left: -22px;
  top: -16px;
  border: 1px dashed rgba(255,199,95,.34);
  border-radius: 50%;
  animation: orbit 10s linear infinite;
  pointer-events: none;
}
.profile-orbit::before {
  content: "";
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(255,115,89,.12);
  border-radius: 50%;
}
.profile-orbit i {
  width: 7px;
  height: 7px;
  position: absolute;
  border-radius: 2px;
  background: var(--gold);
  box-shadow: 0 0 12px rgba(255,199,95,.7);
}
.profile-orbit i:first-child { left: 13px; top: 9px; }
.profile-orbit i:last-child { right: 4px; bottom: 29px; background: var(--frosting); box-shadow: 0 0 12px rgba(255,157,154,.7); }
.profile-row { display: flex; align-items: center; gap: 14px; position: relative; z-index: 2; }
.avatar {
  width: 82px;
  height: 82px;
  flex: 0 0 auto;
  position: relative;
  border: 3px solid var(--cream);
  background: #c97554;
  box-shadow: 0 9px 25px rgba(0,0,0,.34), 0 0 0 5px rgba(255,199,95,.12), 0 0 24px rgba(255,115,89,.13);
  clip-path: polygon(10% 0, 90% 0, 90% 5%, 100% 5%, 100% 90%, 95% 90%, 95% 100%, 10% 100%, 10% 95%, 0 95%, 0 10%, 5% 10%, 5% 5%, 10% 5%);
  animation: avatar-float 4s ease-in-out infinite;
}
@keyframes avatar-float { 50% { transform: translateY(-4px) rotate(-2deg); } }
.avatar-icing {
  position: absolute;
  inset: 8px 7px 22px;
  background: var(--frosting);
  clip-path: polygon(0 0, 100% 0, 100% 73%, 84% 73%, 84% 88%, 67% 88%, 67% 77%, 49% 77%, 49% 92%, 31% 92%, 31% 76%, 14% 76%, 14% 64%, 0 64%);
}
.avatar-face::before, .avatar-face::after {
  content: "";
  position: absolute;
  z-index: 3;
  top: 35px;
  width: 8px;
  height: 8px;
  background: #53251e;
  box-shadow: 0 1px 0 rgba(255,255,255,.18);
}
.avatar-face::before { left: 23px; }
.avatar-face::after { right: 21px; }
.avatar-mouth {
  position: absolute;
  z-index: 3;
  left: 35px;
  top: 48px;
  width: 13px;
  height: 7px;
  border: 3px solid #53251e;
  border-top: 0;
}
.avatar-sprinkle { position: absolute; z-index: 2; width: 5px; height: 9px; background: var(--gold); }
.avatar-sprinkle.s1 { left: 18px; top: 17px; transform: rotate(-35deg); }
.avatar-sprinkle.s2 { right: 14px; top: 24px; background: var(--coral); transform: rotate(35deg); }
.avatar-sprinkle.s3 { left: 42px; top: 12px; background: var(--cream); transform: rotate(75deg); }
.avatar-sprinkle.s4 { right: 30px; top: 43px; background: var(--gold); transform: rotate(55deg); }

.profile-copy { min-width: 0; flex: 1; }
.profile-label { color: var(--cream-soft); font-size: 10px; }
.profile-name {
  max-width: 100%;
  margin-top: 5px;
  overflow: hidden;
  color: var(--white);
  font: 10px/1.35 var(--pixel);
  text-overflow: ellipsis;
  white-space: nowrap;
}
.profile-id { margin-top: 7px; color: var(--cream-soft); font-size: 10px; }
.profile-balance {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 9px;
  color: var(--gold);
  font-weight: 800;
  font-size: 14px;
}
.profile-balance svg { width: 15px; height: 15px; }

.rank-panel {
  margin-top: 17px;
  position: relative;
  z-index: 2;
  cursor: pointer;
}
.rank-overview { display: grid; grid-template-columns: 39px 1fr 25px; align-items: center; gap: 10px; }
.rank-summary small { display: block; color: var(--cream-soft); font-size: 9px; }
.rank-summary b { display: block; margin-top: 4px; color: var(--cream); font-size: 13px; }
.rank-open { display: grid; place-items: center; color: var(--cream-soft); }
.rank-open svg { width: 17px; height: 17px; }
.rank-progress-copy {
  display: flex;
  justify-content: space-between;
  margin-top: 13px;
  color: var(--cream-soft);
  font-size: 9px;
}
.rank-progress-copy b { color: var(--cream); font-weight: 600; }
.rank-track {
  height: 7px;
  margin-top: 8px;
  position: relative;
  overflow: visible;
  border: 0;
  border-radius: 99px;
  background: rgba(242,223,183,.1);
}
.rank-fill {
  width: 12%;
  height: 100%;
  position: relative;
  border-radius: inherit;
  background: linear-gradient(90deg, #9e6249, var(--gold));
  box-shadow: 0 0 14px rgba(221,182,110,.2);
  transition: width .5s ease;
}
.rank-fill i {
  width: 11px;
  height: 11px;
  position: absolute;
  right: -5px;
  top: 50%;
  border: 2px solid #2b1c17;
  border-radius: 50%;
  background: var(--cream);
  transform: translateY(-50%);
  box-shadow: 0 0 0 2px rgba(242,223,183,.14);
}

.rank-emblem {
  --rank-main: #9a674c;
  --rank-dark: #56392c;
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  position: relative;
  flex: 0 0 auto;
  color: var(--cream);
  background: linear-gradient(145deg, var(--rank-main), var(--rank-dark));
  clip-path: polygon(20% 0, 80% 0, 100% 20%, 92% 78%, 50% 100%, 8% 78%, 0 20%);
  filter: drop-shadow(0 5px 8px rgba(0,0,0,.3));
}
.rank-emblem::before {
  content: "";
  position: absolute;
  inset: 4px;
  border: 1px solid rgba(255,255,255,.24);
  clip-path: inherit;
}
.rank-emblem i { position: relative; z-index: 1; font: normal 6px/1 var(--pixel); }
.rank-emblem.pro {
  --rank-main: #8f8176;
  --rank-dark: #4e4641;
  clip-path: polygon(50% 0, 96% 23%, 86% 80%, 50% 100%, 14% 80%, 4% 23%);
}
.rank-emblem.legend {
  --rank-main: #d2a853;
  --rank-dark: #76532d;
  clip-path: polygon(50% 0, 63% 13%, 82% 8%, 88% 29%, 100% 42%, 87% 58%, 91% 80%, 68% 84%, 50% 100%, 32% 84%, 9% 80%, 13% 58%, 0 42%, 12% 29%, 18% 8%, 37% 13%);
}
.rank-emblem.rank-2 { --rank-main: #ab7551; }
.rank-emblem.rank-3 { --rank-main: #bd8055; }
.rank-emblem.rank-5 { --rank-main: #a3988d; }
.rank-emblem.rank-6 { --rank-main: #b5aaa0; }
.rank-emblem.rank-8 { --rank-main: #e0b75f; }
.rank-emblem.rank-9 { --rank-main: #f0c96d; color: #332116; }

.stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 11px;
  margin-top: 12px;
}
.stat-card { min-height: 128px; padding: 16px; overflow: hidden; }
.stat-card .stat-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(221,182,110,.25);
  border-radius: 11px;
  color: var(--gold);
  background: rgba(221,182,110,.07);
}
.stat-card .stat-icon.gold { color: var(--gold); border-color: rgba(255,200,87,.28); background: rgba(255,200,87,.08); }
.stat-icon svg { width: 19px; height: 19px; }
.stat-value { margin-top: 15px; color: var(--cream); font: 12px/1 var(--pixel); }
.stat-label { margin-top: 8px; color: var(--cream-soft); font-size: 10px; }

.referral-card { margin-top: 12px; padding: 17px; }
.section-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.section-copy h3 { margin: 0; color: var(--cream); font-size: 15px; }
.section-copy p { margin: 6px 0 0; color: var(--cream-soft); font-size: 10px; line-height: 1.45; }
.pixel-tag {
  flex: 0 0 auto;
  padding: 6px 8px;
  border: 1px solid rgba(221,182,110,.28);
  color: var(--gold);
  background: rgba(221,182,110,.08);
  font: 7px/1 var(--pixel);
}
.referral-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 15px;
}
.metric { padding: 11px; border: 1px solid var(--stroke); border-radius: 12px; background: rgba(12,8,7,.34); }
.metric b { display: block; color: var(--cream); font-size: 15px; }
.metric span { display: block; margin-top: 4px; color: var(--cream-soft); font-size: 9px; }
.referral-actions { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 11px; }

.pixel-button {
  min-height: 44px;
  border: 0;
  border-radius: 14px;
  padding: 0 15px;
  cursor: pointer;
  font-weight: 800;
  font-size: 12px;
  transition: transform .12s ease, filter .12s ease;
}
.pixel-button:active { transform: translateY(2px) scale(.985); }
.pixel-button.primary {
  color: #26110d;
  background: linear-gradient(135deg, var(--coral), #ff8c68);
  box-shadow: 0 4px 0 #943f31, 0 8px 22px rgba(255,115,89,.18);
}
.pixel-button.cream {
  color: #2a1a10;
  background: linear-gradient(135deg, var(--cream), var(--gold));
  box-shadow: 0 4px 0 #8d6535, 0 8px 24px rgba(255,199,95,.16);
}
.pixel-button.ghost { color: var(--cream); border: 1px solid var(--stroke-strong); background: rgba(255,240,194,.06); }
.pixel-button.joined {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: var(--cream);
  border: 1px solid rgba(221,182,110,.28);
  background: rgba(221,182,110,.1);
}
.pixel-button.joined svg { width: 16px; height: 16px; }
.icon-button { width: 44px; padding: 0; }
.icon-button svg { width: 18px; height: 18px; }

.floating-nav {
  height: calc(var(--nav-height) + var(--safe-bottom));
  position: absolute;
  z-index: 40;
  left: 14px;
  right: 14px;
  bottom: calc(10px + var(--safe-bottom));
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
  padding: 7px;
  border: 1px solid var(--stroke-strong);
  border-radius: 22px;
  background: rgba(43,23,20,.9);
  box-shadow: 0 14px 40px rgba(0,0,0,.38), 0 0 25px rgba(255,115,89,.07);
  backdrop-filter: blur(16px);
}
.nav-button {
  min-width: 0;
  border: 0;
  border-radius: 16px;
  padding: 7px 4px 6px;
  background: transparent;
  color: var(--cream-soft);
  cursor: pointer;
}
.nav-icon-wrap {
  width: 28px;
  height: 25px;
  display: grid;
  place-items: center;
  margin: 0 auto;
  border-radius: 9px;
}
.nav-icon-wrap svg { width: 18px; height: 18px; }
.nav-button span:last-child { display: block; margin-top: 4px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.nav-button.active { color: var(--cream); background: rgba(255,115,89,.14); }
.nav-button.active .nav-icon-wrap {
  color: #2a110b;
  background: linear-gradient(145deg, var(--coral), var(--frosting));
  box-shadow: 0 4px 12px rgba(255,115,89,.22);
}

.floating-nav.hidden-by-game { opacity: 0; visibility: hidden; pointer-events: none; }
.games-page {
  padding-top:18px;
  background:
    radial-gradient(circle at 88% 12%,rgba(255,126,91,.1),transparent 25%),
    linear-gradient(180deg,transparent,rgba(11,8,7,.25));
}
.games-hub-head { display:flex; align-items:flex-end; justify-content:space-between; }
.games-hub-head small { display:block; color:var(--gold); font:5px/1 var(--pixel); }
.games-hub-head b { display:block; margin-top:10px; color:var(--cream); font:19px/1 var(--pixel); }
.games-hub-head em {
  border:1px solid rgba(255,255,255,.08);
  border-radius:9px;
  padding:7px 8px;
  color:#8f8883;
  background:rgba(255,255,255,.035);
  font:normal 5px/1 var(--pixel);
}
.game-banner {
  width: 100%;
  height: 292px;
  margin-top: 18px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius:22px;
  overflow: hidden;
  padding: 0;
  color: var(--cream);
  text-align: left;
  cursor: pointer;
  background:
    radial-gradient(circle at 76% 41%,rgba(255,136,105,.25),transparent 25%),
    radial-gradient(circle at 12% 5%,rgba(255,199,95,.08),transparent 24%),
    linear-gradient(145deg,#39211c,#171210 72%);
  box-shadow:0 18px 40px rgba(0,0,0,.25);
}
.game-banner::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity:.35;
  background:
    radial-gradient(circle at 14% 31%,var(--gold) 0 2px,transparent 3px),
    radial-gradient(circle at 88% 23%,var(--frosting) 0 2px,transparent 3px),
    radial-gradient(circle at 48% 73%,var(--cream) 0 1px,transparent 2px);
}
.game-banner-glow {
  position:absolute;
  width:210px;
  height:210px;
  right:-30px;
  top:18px;
  border:1px solid rgba(255,240,198,.08);
  border-radius:50%;
  box-shadow:0 0 70px rgba(255,115,89,.15),inset 0 0 55px rgba(255,199,95,.04);
}
.game-banner-copy { position: absolute; z-index: 3; left: 20px; top: 24px; }
.game-banner-copy small { display:block; color:#8ee1aa; font:5px/1 var(--pixel); }
.game-banner-copy b { display:block; margin-top:16px; color:var(--cream); font:20px/1.25 var(--pixel); text-shadow:4px 4px 0 #54261e; }
.game-banner-cookie {
  width: 112px;
  height: 112px;
  position: absolute;
  z-index: 2;
  right: 42px;
  top: 87px;
  border: 8px solid #51271f;
  border-radius:50%;
  background:linear-gradient(145deg,#df8a60,#b85f47);
  transform:rotate(13deg);
  clip-path:polygon(25% 2%,65% 0,65% 5%,84% 5%,84% 12%,95% 12%,95% 28%,100% 28%,100% 66%,94% 66%,94% 82%,84% 82%,84% 92%,66% 92%,66% 100%,30% 100%,30% 96%,15% 96%,15% 88%,6% 88%,6% 72%,0 72%,0 34%,5% 34%,5% 18%,14% 18%,14% 8%,25% 8%);
  filter:drop-shadow(12px 14px 0 rgba(35,14,11,.5));
}
.game-banner-cookie::before { content:""; position:absolute; inset:8px 8px 43px; border-radius:15px; background:linear-gradient(135deg,#ffaaa5,#ff8582); clip-path:polygon(0 0,100% 0,100% 62%,82% 62%,82% 88%,58% 88%,58% 68%,34% 68%,34% 92%,0 76%); }
.game-banner-cookie::after { content:""; position:absolute; width:13px; height:13px; right:0; top:31px; background:#24100d; box-shadow:4px -10px 0 #24100d,10px 3px 0 #24100d; }
.game-banner-cookie i { width:8px; height:8px; position:absolute; z-index:2; background:var(--gold); }
.game-banner-cookie i:nth-child(1){left:20px;top:20px}.game-banner-cookie i:nth-child(2){left:46px;top:14px;background:var(--cream)}.game-banner-cookie i:nth-child(3){left:34px;top:55px;background:#56251d}
.game-banner-footer {
  position:absolute;
  z-index:3;
  left:18px;
  right:18px;
  bottom:15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:13px;
}
.game-banner-footer small { color:#8d8580; font:5px/1 var(--pixel); }
.game-banner-footer b { display:flex; align-items:center; gap:5px; color:var(--gold); font:6px/1 var(--pixel); }
.game-banner-footer svg { width:14px; height:14px; }

.game-screen {
  position: absolute;
  z-index: 45;
  inset: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 80% 18%, rgba(255,157,154,.12), transparent 26%),
    radial-gradient(circle at 10% 72%, rgba(255,199,95,.08), transparent 24%),
    linear-gradient(180deg, #20100e, #100908);
}
.game-screen[hidden] { display: none; }
.game-screen-head {
  height: 68px;
  display: grid;
  grid-template-columns: 72px 1fr auto auto;
  align-items: center;
  gap: 8px;
  position: relative;
  z-index: 4;
  padding: max(9px, env(safe-area-inset-top)) 14px 7px;
  border-bottom: 1px solid var(--stroke);
  background: rgba(24,12,10,.84);
  backdrop-filter: blur(12px);
}
.game-screen-head > div { text-align: center; }
.game-screen-head small { display:block; color:var(--gold); font:5px/1 var(--pixel); }
.game-screen-head b { display:block; margin-top:6px; color:var(--cream); font:8px/1 var(--pixel); }
.game-back { height:36px; display:flex; align-items:center; gap:4px; border:1px solid var(--stroke); border-radius:10px; padding:0 8px; color:var(--cream); background:rgba(255,240,198,.05); font-size:10px; font-weight:800; }
.game-back svg { width:14px; height:14px; transform:rotate(180deg); }
.game-screen-scroll { height:calc(100% - 68px); position:relative; z-index:2; overflow-y:auto; padding:0 14px calc(20px + var(--safe-bottom)); scrollbar-width:none; }
.game-screen-scroll::-webkit-scrollbar { display:none; }
.game-cookie-cloud { position:absolute; inset:68px 0 0; overflow:hidden; pointer-events:none; }
.game-cookie-cloud i { width:46px; height:46px; position:absolute; border:5px solid rgba(112,53,40,.18); background:rgba(207,121,88,.07); transform:rotate(20deg); clip-path:polygon(14% 0,86% 0,86% 8%,100% 8%,100% 72%,92% 72%,92% 87%,78% 87%,78% 100%,20% 100%,20% 93%,7% 93%,7% 79%,0 79%,0 21%,7% 21%,7% 7%,14% 7%); }
.game-cookie-cloud i:nth-child(1){left:-12px;top:70px}.game-cookie-cloud i:nth-child(2){right:10px;top:155px;transform:rotate(-24deg) scale(.7)}.game-cookie-cloud i:nth-child(3){left:12%;top:470px;transform:rotate(42deg) scale(.55)}.game-cookie-cloud i:nth-child(4){right:-15px;top:540px;transform:rotate(12deg) scale(1.25)}.game-cookie-cloud i:nth-child(5){left:65%;top:740px;transform:rotate(-15deg) scale(.6)}.game-cookie-cloud i:nth-child(6){left:-18px;top:820px;transform:rotate(28deg) scale(.9)}
.crash-demo-tag {
  padding: 6px 8px;
  border: 1px solid rgba(255,199,95,.28);
  border-radius: 8px;
  color: var(--gold);
  background: rgba(255,199,95,.08);
  font: 7px/1 var(--pixel);
  box-shadow: 3px 3px 0 rgba(0,0,0,.2);
}
.crash-history {
  display: flex;
  gap: 9px;
  margin: 16px -2px 12px;
  padding: 3px 2px 6px;
  overflow-x: auto;
  scrollbar-width: none;
}
.crash-history::-webkit-scrollbar { display: none; }
.crash-history span, .crash-history button {
  min-width: 72px;
  min-height: 36px;
  flex: 0 0 auto;
  padding: 9px 11px 8px;
  border: 1px solid rgba(255,240,194,.16);
  border-radius: 9px;
  color: var(--cream-soft);
  background: rgba(42,23,20,.8);
  box-shadow: 0 3px 0 rgba(0,0,0,.18);
  font: 8px/1 var(--pixel);
}
.crash-history .win { color: #9ee2b3; border-color: rgba(102,214,142,.28); background: rgba(45,116,72,.16); }
.crash-history .hot { color: var(--gold); border-color: rgba(255,199,95,.34); background: rgba(255,199,95,.1); }
.crash-history .loss { color: #ff9a8b; border-color: rgba(255,115,89,.3); background: rgba(255,115,89,.09); }

.crash-arena {
  --lvl-ground: 1;
  --lvl-candy: 0;
  --lvl-space: 0;
  height: 350px;
  overflow: hidden;
  isolation: isolate;
  background: #0d0907;
}
.crash-layers {
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
}
.crash-layers::after {
  content: "";
  position: absolute;
  z-index: 4;
  inset: 0;
  border-radius: inherit;
  box-shadow:
    inset 0 0 54px rgba(0,0,0,.26),
    inset 0 -42px 48px rgba(0,0,0,.22);
}
.crash-layer {
  position: absolute;
  inset: 0;
  transition: opacity .38s ease-out;
  will-change: opacity;
}
.crash-layer-ground {
  opacity: var(--lvl-ground);
  background:
    radial-gradient(circle at 78% 24%, #ffc27b 0 3%, rgba(255,180,93,.28) 4%, transparent 20%),
    radial-gradient(ellipse at 50% 85%, rgba(255,102,45,.18), transparent 48%),
    linear-gradient(180deg, #3a2119 0%, #241511 52%, #100a08 100%);
}
.crash-layer-ground::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .55;
  background:
    radial-gradient(ellipse at 12% 38%, rgba(255,226,183,.13) 0 7%, transparent 8%),
    radial-gradient(ellipse at 24% 42%, rgba(255,226,183,.1) 0 10%, transparent 11%),
    radial-gradient(ellipse at 88% 48%, rgba(255,151,89,.1) 0 11%, transparent 12%);
  animation: crash-cloud-drift 12s ease-in-out infinite alternate;
}
.crash-layer-ground::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 23px;
  height: 62px;
  background: linear-gradient(180deg, transparent, rgba(17,9,7,.76));
}
.crash-layer-ground .hill {
  position: absolute;
  z-index: 1;
  bottom: 18px;
  width: 120px;
  height: 48px;
  border-radius: 50% 50% 0 0;
  background: linear-gradient(180deg, #5a3023, #21120e);
  box-shadow: inset 0 5px 12px rgba(255,134,69,.08);
}
.crash-layer-ground .hill:nth-child(1) { left: -16px; width: 150px; height: 58px; }
.crash-layer-ground .hill:nth-child(2) { left: 98px; width: 170px; height: 42px; background: linear-gradient(180deg, #47261d, #1b100d); }
.crash-layer-ground .hill:nth-child(3) { right: -20px; left: auto; width: 140px; height: 52px; }
.crash-layer-candy {
  opacity: var(--lvl-candy);
  background:
    radial-gradient(circle at 18% 28%, rgba(255,147,190,.26), transparent 23%),
    radial-gradient(circle at 82% 62%, rgba(255,187,96,.2), transparent 28%),
    linear-gradient(165deg, #4b2230 0%, #28151d 48%, #120c0e 100%);
}
.crash-layer-candy::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .42;
  background:
    radial-gradient(circle at 12% 78%, #ff9a73 0 13px, transparent 14px),
    radial-gradient(circle at 18% 78%, #ffd28a 0 9px, transparent 10px),
    radial-gradient(circle at 76% 22%, #ff8eb8 0 16px, transparent 17px),
    radial-gradient(circle at 83% 22%, #ffbe73 0 11px, transparent 12px);
  filter: blur(1px);
  animation: crash-candy-clouds 7s ease-in-out infinite alternate;
}
.crash-layer-candy::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .18;
  background: repeating-linear-gradient(118deg, transparent 0 44px, rgba(255,221,177,.18) 45px 47px, transparent 48px 88px);
}
.crash-layer-candy i {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  opacity: .85;
  background: #ff8fae;
  box-shadow: 0 0 8px rgba(255,139,89,.3);
  animation: crash-candy-drift 3.4s linear infinite;
}
.crash-layer-candy i:nth-child(1) { left: 8%; top: 18%; background: #ff8fae; animation-duration: 3.1s; }
.crash-layer-candy i:nth-child(2) { left: 22%; top: 48%; width: 6px; height: 6px; background: #ff9b69; animation-duration: 4.2s; animation-delay: -.6s; }
.crash-layer-candy i:nth-child(3) { left: 38%; top: 26%; background: #ffd36a; border-radius: 50%; animation-duration: 2.8s; }
.crash-layer-candy i:nth-child(4) { left: 54%; top: 62%; width: 10px; height: 5px; background: #e58cff; animation-duration: 3.7s; animation-delay: -1.1s; }
.crash-layer-candy i:nth-child(5) { left: 68%; top: 22%; background: #ff7f9a; animation-duration: 3.3s; }
.crash-layer-candy i:nth-child(6) { left: 78%; top: 52%; width: 7px; height: 7px; background: #f8b778; border-radius: 50%; animation-duration: 4.6s; }
.crash-layer-candy i:nth-child(7) { left: 12%; top: 72%; background: #ffb4e2; animation-duration: 3.9s; animation-delay: -.4s; }
.crash-layer-candy i:nth-child(8) { left: 46%; top: 40%; width: 5px; height: 9px; background: #ffa078; animation-duration: 2.9s; }
.crash-layer-candy i:nth-child(9) { left: 86%; top: 34%; background: #ff9a6a; border-radius: 50%; animation-duration: 3.5s; }
.crash-layer-candy i:nth-child(10) { left: 30%; top: 14%; width: 9px; height: 4px; background: #ffe08a; animation-duration: 4.1s; animation-delay: -1.5s; }
.crash-layer-space {
  opacity: var(--lvl-space);
  background:
    radial-gradient(ellipse at 70% 22%, rgba(255,111,42,.18), transparent 28%),
    radial-gradient(ellipse at 24% 70%, rgba(139,68,115,.13), transparent 34%),
    linear-gradient(165deg, #161015 0%, #09070a 56%, #030303 100%);
}
.crash-layer-space::before {
  content: "";
  position: absolute;
  width: 110px;
  height: 110px;
  right: -28px;
  bottom: -34px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #c96e3c, #5a271d 45%, #160d0b 72%);
  box-shadow: 0 0 42px rgba(255,111,42,.12);
  animation: crash-planet-float 7s ease-in-out infinite alternate;
}
.crash-layer-space canvas {
  width: 100%;
  height: 100%;
  display: block;
}
@keyframes crash-candy-drift {
  0% { transform: translate3d(0, -18px, 0) rotate(0deg); opacity: 0; }
  15% { opacity: .9; }
  100% { transform: translate3d(12px, 160px, 0) rotate(160deg); opacity: 0; }
}
@keyframes crash-cloud-drift {
  from { transform: translate3d(-5px, 0, 0); }
  to { transform: translate3d(8px, 3px, 0); }
}
@keyframes crash-candy-clouds {
  from { transform: translate3d(-4px, 1px, 0) scale(.98); }
  to { transform: translate3d(7px, -3px, 0) scale(1.03); }
}
@keyframes crash-planet-float {
  from { transform: translate3d(0, 2px, 0) rotate(-2deg); }
  to { transform: translate3d(-3px, -4px, 0) rotate(3deg); }
}
.crash-arena::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: calc(.16 + var(--countdown-progress, 0) * .12);
  background:
    radial-gradient(circle at 15% 28%, rgba(255,240,198,.42) 0 2px, transparent 3px),
    radial-gradient(circle at 86% 70%, rgba(255,157,154,.38) 0 3px, transparent 4px),
    radial-gradient(circle at 62% 45%, rgba(255,199,95,.25) 0 2px, transparent 3px);
}
.crash-round-status {
  position: absolute;
  z-index: 4;
  left: 16px;
  top: 15px;
  padding: 5px 7px;
  border: 1px solid var(--stroke);
  border-radius: 7px;
  color: var(--cream-soft);
  background: rgba(13,7,6,.42);
  font: 6px/1 var(--pixel);
  letter-spacing: .4px;
}
.crash-multiplier {
  position: relative;
  z-index: 3;
  margin-top: 49px;
  color: var(--cream);
  font: 30px/1 var(--pixel);
  text-align: center;
  letter-spacing: -2px;
  text-shadow: 4px 4px 0 #6c3025, 0 0 24px rgba(255,157,154,.14);
}
.crash-arena.waiting .crash-multiplier {
  width: 92px;
  height: 92px;
  display: grid;
  place-items: center;
  margin: 45px auto 0;
  border: 4px solid rgba(255,199,95,.7);
  border-radius: 50%;
  font-size: 38px;
  letter-spacing: 0;
  background: rgba(20,11,9,.72);
  box-shadow: 0 0 0 7px rgba(255,199,95,.06), 0 0 34px rgba(255,115,89,.2);
  animation: crash-countdown .85s steps(2) infinite;
}
.crash-arena.waiting .crash-cookie-wrap { opacity:.58; filter:saturate(.7); }
.crash-payout {
  position: relative;
  z-index: 3;
  margin-top: 13px;
  color: var(--cream-soft);
  font-size: 10px;
  font-weight: 700;
  text-align: center;
}
.crash-arena.flying .crash-payout,
.crash-arena.cashed .crash-payout {
  color:#9ce2b3;
  font:7px/1.2 var(--pixel);
  text-shadow:0 0 13px rgba(111,211,145,.28);
}
.crash-track {
  position: absolute;
  z-index: 1;
  inset: 78px 0 0;
  width: 100%;
  height: calc(100% - 78px);
  overflow: visible;
}
.crash-track path {
  fill: none;
  stroke-linecap: round;
}
.crash-track-glow {
  stroke: rgba(255,115,89,.34);
  stroke-width: 12;
  filter: blur(7px);
}
.crash-track-main {
  stroke: url(#crashLine);
  stroke-width: 4;
  filter: drop-shadow(0 0 6px rgba(255,199,95,.65));
}
.crash-ground {
  position: absolute;
  z-index: 1;
  left: 14px;
  right: 14px;
  bottom: 24px;
  height: 2px;
  opacity: .35;
  background: linear-gradient(90deg, var(--coral), transparent 84%);
  box-shadow: 0 0 14px rgba(255,115,89,.5);
}
.crash-cookie-wrap {
  width: 92px;
  height: 92px;
  position: absolute;
  z-index: 5;
  left: 24px;
  bottom: 28px;
  transform: translate(0, 0) rotate(-8deg);
  transition: transform .32s linear, filter .18s ease;
  will-change: transform;
}
.crash-cookie-wrap::before {
  content: "";
  position: absolute;
  inset: -13px;
  border-radius: 50%;
  opacity: 0;
  background: radial-gradient(circle, rgba(255,199,95,.26), rgba(255,115,89,.08) 45%, transparent 68%);
  transform: scale(.7);
}
.crash-cookie-wrap::after {
  content: "";
  width: 52px;
  height: 12px;
  position: absolute;
  z-index: -1;
  left: -37px;
  top: 45px;
  opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(255,115,89,.2), var(--gold));
  clip-path: polygon(0 42%, 100% 0, 100% 100%, 0 58%);
  filter: blur(2px);
}
.crash-cookie {
  width: 76px;
  height: 76px;
  position: absolute;
  left: 6px;
  top: 6px;
  border: 5px solid #5b2c21;
  background: #cf7958;
  clip-path: polygon(14% 0, 86% 0, 86% 7%, 100% 7%, 100% 72%, 93% 72%, 93% 86%, 79% 86%, 79% 100%, 21% 100%, 21% 93%, 7% 93%, 7% 79%, 0 79%, 0 21%, 7% 21%, 7% 7%, 14% 7%);
  filter: drop-shadow(7px 9px 0 rgba(63,24,18,.55));
}
.crash-cookie::before {
  content: "";
  position: absolute;
  inset: 5px 5px 25px;
  background: var(--frosting);
  clip-path: polygon(0 0, 100% 0, 100% 62%, 87% 62%, 87% 86%, 66% 86%, 66% 70%, 45% 70%, 45% 92%, 22% 92%, 22% 70%, 0 70%);
}
.crash-cookie::after {
  content: "";
  position: absolute;
  width: 9px;
  height: 9px;
  right: 1px;
  top: 23px;
  background: #160d0b;
  box-shadow: 3px -7px 0 #160d0b, 7px 2px 0 #160d0b;
}
.crash-cookie i {
  width: 6px;
  height: 6px;
  position: absolute;
  z-index: 2;
  background: var(--gold);
}
.crash-cookie i:nth-child(1) { left: 13px; top: 13px; }
.crash-cookie i:nth-child(2) { left: 29px; top: 8px; background: var(--cream); }
.crash-cookie i:nth-child(3) { left: 20px; top: 31px; background: #6b3023; }
.crash-cookie i:nth-child(4) { left: 37px; top: 37px; background: var(--coral); }
.crash-cookie b, .crash-cookie em {
  width: 5px;
  height: 5px;
  position: absolute;
  z-index: 2;
  left: 13px;
  bottom: 10px;
  background: #673025;
}
.crash-cookie em { left: 36px; bottom: 16px; background: #53241c; }
.crumb {
  width: 7px;
  height: 7px;
  position: absolute;
  left: 34px;
  top: 34px;
  opacity: 0;
  background: var(--gold);
}
.crash-arena.flying .crash-cookie-wrap { filter: drop-shadow(-9px 10px 8px rgba(255,115,89,.3)); }
.crash-arena.flying .crash-cookie-wrap { transition: none; }
.crash-arena.flying .crash-cookie-wrap::before { opacity: 1; transform: scale(1); animation: cookie-aura 1s ease-in-out infinite; }
.crash-arena.flying .crash-cookie-wrap::after { opacity: 1; animation: cookie-boost .42s steps(3) infinite; }
.crash-arena.flying .crash-cookie { animation: crash-cookie-fly .34s steps(2) infinite; }
.crash-arena.flying .crash-round-status { color: var(--gold); border-color: rgba(255,199,95,.28); }
.crash-arena.cashed .crash-multiplier { color: #a9ebb9; text-shadow: 4px 4px 0 #27593b; }
.crash-arena.crashed .crash-cookie { opacity: 0; transform: scale(.4) rotate(30deg); transition: .16s ease; }
.crash-arena.crashed .crash-multiplier { color: #ff8b7c; }
.crash-arena.crashed .crumb { opacity: 1; animation: crumb-pop .65s steps(4) forwards; }
.crash-arena.crashed .c1 { --cx: -35px; --cy: -28px; }
.crash-arena.crashed .c2 { --cx: 34px; --cy: -38px; background: var(--frosting); }
.crash-arena.crashed .c3 { --cx: -44px; --cy: 12px; background: #cf7958; }
.crash-arena.crashed .c4 { --cx: 42px; --cy: 20px; background: var(--coral); }
.crash-arena.crashed .c5 { --cx: 8px; --cy: -52px; background: var(--cream); }
.crash-sky-pixels i {
  width: 20px;
  height: 20px;
  position: absolute;
  z-index: 0;
  border: 3px solid rgba(105,48,36,.28);
  border-radius: 50%;
  background: rgba(207,121,88,.12);
  opacity: .65;
  transform: rotate(22deg);
}
.crash-sky-pixels i::before {
  content: "";
  width: 3px;
  height: 3px;
  position: absolute;
  left: 4px;
  top: 4px;
  background: rgba(255,199,95,.45);
  box-shadow: 7px 5px 0 rgba(91,44,33,.45);
}
.crash-sky-pixels i:nth-child(1) { left: 8%; top: 31%; transform:rotate(18deg) scale(.55); }
.crash-sky-pixels i:nth-child(2) { left: 78%; top: 17%; transform:rotate(-25deg) scale(.8); }
.crash-sky-pixels i:nth-child(3) { left: 69%; top: 59%; transform:rotate(35deg) scale(.45); }
.crash-sky-pixels i:nth-child(4) { left: 88%; top: 76%; transform:rotate(8deg) scale(.65); }
.crash-sky-pixels i:nth-child(5) { left: 34%; top: 70%; transform:rotate(-17deg) scale(.42); }
.crash-sky-pixels i:nth-child(6) { left: 52%; top: 28%; transform:rotate(28deg) scale(.35); }
.crash-sky-pixels i:nth-child(7) { left: 19%; top: 55%; transform:rotate(-34deg) scale(.32); }
.crash-sky-pixels i:nth-child(8) { left: 91%; top: 42%; transform:rotate(44deg) scale(.3); }
@keyframes crash-cookie-fly { 50% { margin-top: -4px; } }
@keyframes crash-dash { to { stroke-dashoffset: -28; } }
@keyframes cookie-aura { 50% { transform:scale(1.14); opacity:.66; } }
@keyframes cookie-boost { 50% { transform:scaleX(1.25); opacity:.55; } }
@keyframes crash-countdown { 50% { transform:scale(1.06); border-color:var(--frosting); } }
@keyframes crumb-pop {
  55% { opacity: 1; transform: translate(var(--cx), var(--cy)) rotate(90deg); }
  100% { opacity: 0; transform: translate(calc(var(--cx) * 1.5), calc(var(--cy) * 1.5 + 24px)) rotate(180deg); }
}

.crash-controls {
  margin-top: 12px;
  padding: 15px;
}
.crash-my-bet {
  display: grid;
  grid-template-columns: 46px minmax(0,1fr) auto;
  align-items: center;
  gap: 11px;
  margin-bottom: 10px;
  padding: 11px;
  border: 1px solid rgba(255,199,95,.2);
  border-radius: 15px;
  background:
    linear-gradient(120deg, rgba(255,115,89,.12), transparent 42%),
    rgba(14,7,6,.28);
}
.crash-my-avatar {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 2px solid rgba(255,199,95,.34);
  border-radius: 13px;
  color: #28120d;
  background: linear-gradient(135deg,var(--frosting),var(--gold));
  font: 8px/1 var(--pixel);
  box-shadow: 3px 4px 0 rgba(0,0,0,.24);
}
.crash-my-avatar img { width:100%; height:100%; object-fit:cover; }
.crash-my-copy { min-width:0; }
.crash-my-copy small,
.crash-live-return small {
  display:block;
  color:var(--cream-soft);
  font:5px/1.25 var(--pixel);
}
.crash-my-copy b {
  display:block;
  margin-top:7px;
  color:var(--cream);
  font-size:13px;
}
.crash-live-return { text-align:right; }
.crash-live-return b {
  display:block;
  margin-top:7px;
  color:#a9ebb9;
  font:11px/1 var(--pixel);
  text-shadow:0 0 12px rgba(100,220,130,.2);
}
.crash-arena.flying + .crash-controls .crash-live-return b { animation:crash-return-pulse .7s steps(2) infinite; }
.crash-balance-row {
  display:flex;
  justify-content:space-between;
  margin:0 3px 9px;
  color:var(--cream-soft);
  font-size:9px;
}
.crash-balance-row b { color:var(--gold); }
@keyframes crash-return-pulse { 50% { opacity:.72; } }
.crash-bet-head {
  display: flex;
  justify-content: space-between;
  margin-bottom: 11px;
}
.crash-bet-head span:last-child { text-align: right; }
.crash-bet-head small { display: block; color: var(--cream-soft); font: 6px/1 var(--pixel); }
.crash-bet-head b { display: block; margin-top: 6px; color: var(--cream); font-size: 13px; }
.crash-bet-row {
  display: grid;
  grid-template-columns: 38px minmax(90px, 1fr) 43px 50px;
  gap: 7px;
}
.crash-step {
  height: 43px;
  border: 1px solid var(--stroke-strong);
  border-radius: 11px;
  color: var(--cream);
  background: rgba(255,240,194,.06);
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.crash-step:active { transform: translateY(2px); }
.crash-step.max { color: var(--gold); font-size: 9px; }
.crash-input {
  height: 43px;
  display: flex;
  align-items: center;
  border: 1px solid rgba(255,199,95,.25);
  border-radius: 11px;
  padding: 0 11px;
  background: rgba(13,7,6,.36);
}
.crash-input input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  color: var(--cream);
  background: transparent;
  font-size: 14px;
  font-weight: 800;
  appearance: textfield;
  -moz-appearance: textfield;
}
.crash-input input::-webkit-inner-spin-button,
.crash-input input::-webkit-outer-spin-button {
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
}
.crash-input span { color: var(--gold); font-weight: 800; }
.crash-action { width: 100%; margin-top: 11px; font-size: 13px; }
.crash-arena.flying + .crash-controls .crash-action {
  color: #2a110b;
  background: linear-gradient(135deg, #8fdfa3, #d9f29b);
  box-shadow: 0 4px 0 #397b4b, 0 8px 24px rgba(100,220,130,.14);
}
.crash-disclaimer { margin: 11px 0 0; color: var(--cream-soft); font-size: 8px; text-align: center; }
.crash-feed { margin-top: 20px; }
.crash-player-list { display: grid; gap: 8px; }
.crash-player {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 76px;
  padding: 11px 13px;
  border: 1px solid var(--stroke);
  border-radius: 14px;
  background: rgba(48,26,22,.72);
  animation: crash-player-in .22s ease both;
}
.crash-player-avatar {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 14px;
  color: #2b1410;
  background: var(--coral);
  font: 10px/1 var(--pixel);
}
.crash-player-avatar img { width:100%; height:100%; display:block; object-fit:cover; }
.crash-player-avatar.cream { background: var(--cream); }
.crash-player-avatar.pink { background: var(--frosting); }
.crash-player > span:nth-child(2) { min-width: 0; }
.crash-player b { display: flex; align-items: center; gap: 6px; min-width: 0; overflow: hidden; color: var(--cream); font-size: 13px; white-space: nowrap; }
.crash-player b > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.crash-bet-bonus {
  flex: none;
  display: inline-grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border-radius: 5px;
  background: #f0c94d;
  color: #2b1a08;
  font: 700 10px/1 var(--pixel);
  text-decoration: none;
}
.crash-player.bonus { border-color: rgba(240, 201, 77, .34); }
.crash-player small { display: block; margin-top: 7px; color: var(--cream-soft); font-size: 9px; }
.crash-player small i { font-style:normal; font-weight:800; }
.crash-player strong { font-size: 13px; }
.crash-player.flying { border-color:rgba(220,214,205,.18); background:rgba(79,70,65,.22); }
.crash-player.flying small i, .crash-player.flying strong { color:#bdb7af; }
.crash-player.won { border-color:rgba(103,218,143,.32); background:linear-gradient(90deg,rgba(44,126,74,.2),rgba(48,26,22,.72)); }
.crash-player.won small i, .crash-player.won strong { color:#9ee2b3; }
.crash-player.lost { border-color:rgba(255,115,89,.2); background:linear-gradient(90deg,rgba(122,48,38,.15),rgba(48,26,22,.72)); }
.crash-player.lost small i, .crash-player.lost strong { color:#d78578; }
@keyframes crash-player-in { from { opacity:0; transform:translateY(-5px); } }
.crash-record-board { margin-top:20px; }
.crash-record-board .section-title-row > span { color:var(--cream-soft); font:5px/1 var(--pixel); }
.crash-records { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.crash-record {
  min-width:0;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:9px;
  border:1px solid rgba(255,199,95,.18);
  border-radius:14px;
  padding:10px;
  color:var(--cream);
  background:linear-gradient(140deg,rgba(255,199,95,.1),rgba(48,26,22,.7));
  text-align:left;
  cursor:pointer;
}
.crash-record.multiplier { background:linear-gradient(140deg,rgba(255,115,89,.12),rgba(48,26,22,.7)); }
.crash-record-avatar {
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:11px;
  color:#28120d;
  background:var(--gold);
  font:7px/1 var(--pixel);
}
.crash-record-avatar img { width:100%; height:100%; object-fit:cover; }
.crash-record span:last-child { min-width:0; }
.crash-record small { display:block; color:var(--cream-soft); font:4.5px/1.2 var(--pixel); }
.crash-record b { display:block; margin-top:5px; color:var(--gold); font:8px/1 var(--pixel); }
.crash-record em { display:block; margin-top:5px; overflow:hidden; color:var(--cream-soft); font:normal 8px/1 sans-serif; text-overflow:ellipsis; white-space:nowrap; }
.crash-record.empty { display:block; cursor:default; }
.crash-record.empty b { margin-top:9px; }
.crash-history button small { margin-left:4px; color:rgba(255,240,198,.45); font-size:6px; }
.crash-verify-button { width:100%; margin-top:15px; border:1px solid rgba(255,199,95,.25); border-radius:12px; padding:12px; color:var(--gold); background:rgba(255,199,95,.06); font-size:10px; font-weight:800; }
.crash-proof[hidden] { display:none; }
.crash-proof { position:fixed; z-index:80; inset:0; display:flex; align-items:flex-end; justify-content:center; }
.crash-proof-backdrop { position:absolute; inset:0; border:0; background:rgba(8,4,3,.72); backdrop-filter:blur(5px); }
.crash-proof-card {
  width:min(520px,100%);
  max-height:84vh;
  position:relative;
  z-index:1;
  overflow:auto;
  border:1px solid rgba(255,199,95,.24);
  border-radius:23px 23px 0 0;
  padding:18px 17px 24px;
  background:linear-gradient(155deg,#392019,#160c0a 65%);
  box-shadow:0 -18px 60px rgba(0,0,0,.45);
  animation:crash-proof-in .24s ease-out;
}
.crash-proof-head { display:flex; align-items:center; justify-content:space-between; }
.crash-proof-head small { display:block; color:var(--gold); font:5px/1 var(--pixel); }
.crash-proof-head b { display:block; margin-top:7px; color:var(--cream); font-size:17px; }
.crash-proof-head button { width:36px; height:36px; display:grid; place-items:center; border:1px solid var(--stroke); border-radius:10px; color:var(--cream); background:rgba(255,255,255,.04); }
.crash-proof-head svg { width:18px; height:18px; }
.crash-top-up[hidden] { display:none; }
.crash-top-up { position:fixed; z-index:82; inset:0; display:flex; align-items:flex-end; justify-content:center; }
.crash-top-up-card {
  width:min(520px,100%);
  position:relative;
  z-index:1;
  border:1px solid rgba(91,184,248,.18);
  border-radius:23px 23px 0 0;
  padding:18px 16px calc(22px + var(--safe-bottom));
  background:#181413;
  box-shadow:0 -20px 60px rgba(0,0,0,.55);
  animation:crash-proof-in .22s ease-out;
}
.crash-top-up-card .crash-proof-head small { color:#71bdf3; }
.crash-top-up-provider {
  display:flex;
  align-items:center;
  gap:11px;
  margin-top:17px;
  border:1px solid rgba(91,184,248,.2);
  border-radius:14px;
  padding:12px;
  background:linear-gradient(135deg,rgba(59,150,218,.14),rgba(255,255,255,.025));
}
.crash-top-up-provider > i {
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:11px;
  color:#fff;
  background:#2698e9;
  box-shadow:0 7px 18px rgba(38,152,233,.22);
  font-size:20px;
  font-style:normal;
  font-weight:900;
}
.crash-top-up-provider span { display:flex; flex-direction:column; gap:5px; }
.crash-top-up-provider b { color:#ecf7ff; font-size:12px; }
.crash-top-up-provider small { color:#8194a0; font-size:8px; }
.crash-top-up-presets { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-top:12px; }
.crash-top-up-presets button {
  min-height:38px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  color:#a5a09c;
  background:#24201e;
  font-size:9px;
  font-weight:900;
}
.crash-top-up-presets button.active {
  border-color:rgba(91,184,248,.48);
  color:#8bd0ff;
  background:rgba(51,143,211,.14);
}
.crash-top-up-input {
  height:52px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:10px;
  margin-top:9px;
  border:1px solid rgba(91,184,248,.35);
  border-radius:12px;
  padding:0 13px;
  background:#110f0e;
}
.crash-top-up-input span { color:#7d7772; font-size:9px; font-weight:800; }
.crash-top-up-input input {
  min-width:0;
  border:0;
  outline:0;
  color:#f0f7fc;
  background:transparent;
  font:13px/1 var(--pixel);
  text-align:right;
}
.crash-top-up-input b { color:#71bdf3; font-size:14px; }
.crash-top-up-status {
  min-height:31px;
  display:flex;
  align-items:center;
  margin-top:8px;
  border-radius:9px;
  padding:7px 9px;
  color:#817b77;
  background:rgba(255,255,255,.025);
  font-size:8px;
  line-height:1.35;
}
.crash-top-up-status.pending { color:#8ac8ef; background:rgba(47,137,201,.09); }
.crash-top-up-status.paid { color:#9ce2b3; background:rgba(63,139,88,.11); }
.crash-top-up-status.expired { color:#d98d83; background:rgba(157,71,60,.1); }
.crash-top-up-action { width:100%; min-height:49px; margin-top:7px; border-radius:12px; }
.crash-proof-result { margin-top:16px; border:1px solid rgba(255,115,89,.24); border-radius:14px; padding:14px; background:rgba(255,115,89,.08); }
.crash-proof-result.valid { border-color:rgba(103,218,143,.3); background:rgba(44,126,74,.15); }
.crash-proof-result strong { display:block; color:#ff9a8b; font:8px/1.2 var(--pixel); }
.crash-proof-result.valid strong { color:#9ee2b3; }
.crash-proof-result span { display:block; margin-top:8px; color:var(--cream-soft); font-size:10px; }
.crash-proof-fields { display:grid; gap:9px; margin-top:11px; }
.crash-proof-fields label { display:block; border:1px solid var(--stroke); border-radius:12px; padding:11px; background:rgba(8,4,3,.28); }
.crash-proof-fields label span { display:block; color:var(--cream-soft); font-size:8px; }
.crash-proof-fields code { display:block; margin-top:7px; overflow-wrap:anywhere; color:var(--cream); font:8px/1.45 monospace; }
.crash-proof-checks { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.crash-proof-checks span { border:1px solid var(--stroke); border-radius:10px; padding:10px; color:#d78578; background:rgba(8,4,3,.25); font-size:9px; text-align:center; }
.crash-proof-checks span.ok { color:#9ee2b3; border-color:rgba(103,218,143,.24); }
.crash-proof-fields p { margin:2px 1px 0; color:var(--cream-soft); font-size:9px; line-height:1.45; }
@keyframes crash-proof-in { from { transform:translateY(35px); opacity:0; } }

.game-screen {
  background:
    radial-gradient(circle at 50% -10%, rgba(255,121,89,.16), transparent 34%),
    linear-gradient(180deg,#171312,#0d0b0a);
}
.game-screen-head {
  height:64px;
  grid-template-columns:72px 1fr 40px;
  border-bottom-color:rgba(255,255,255,.06);
  background:rgba(16,13,12,.9);
}
.game-screen-head small { color:#8e8883; }
.game-screen-head small i {
  width:6px;
  height:6px;
  display:inline-block;
  margin-right:3px;
  border-radius:2px;
  background:#7e7772;
}
.game-screen-head small i.live { background:#78d59a; box-shadow:0 0 8px rgba(120,213,154,.55); }
.game-screen-head small i.connecting { background:var(--gold); }
.game-screen-head small i.offline { background:#d36e62; }
.game-screen-head b { margin-top:5px; font-size:9px; letter-spacing:.4px; }
.game-back {
  border:0;
  padding:0 5px;
  background:transparent;
  box-shadow:none;
}
.crash-menu-button {
  width:38px;
  height:36px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:11px;
  color:var(--cream);
  background:rgba(255,255,255,.04);
  font-size:13px;
  letter-spacing:1px;
}
.game-screen-scroll { height:calc(100% - 64px); padding:0 12px calc(92px + var(--safe-bottom)); }
.crash-bonus-page {
  height:calc(100% - 64px);
  position:relative;
  z-index:2;
  overflow-y:auto;
  padding:14px 12px calc(94px + var(--safe-bottom));
  scrollbar-width:none;
}
.crash-bonus-page[hidden] { display:none; }
.crash-bonus-page::-webkit-scrollbar { display:none; }
.crash-bonus-hero {
  height:184px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,139,84,.15);
  border-radius:21px;
  padding:17px;
  background:
    radial-gradient(circle at 68% 40%,rgba(255,129,76,.2),transparent 23%),
    linear-gradient(145deg,#321a14,#171210 72%);
  box-shadow:0 16px 36px rgba(0,0,0,.2);
}
.crash-bonus-hero::before {
  content:"";
  width:108px;
  height:108px;
  position:absolute;
  left:57%;
  top:28px;
  border:7px solid #5b2d21;
  border-radius:50%;
  background:
    radial-gradient(circle at 31% 30%,#ffb09d 0 8%,transparent 9%),
    radial-gradient(circle at 67% 25%,#7e3a29 0 8%,transparent 9%),
    radial-gradient(circle at 61% 69%,#ffc75f 0 7%,transparent 8%),
    radial-gradient(circle at 29% 73%,#783525 0 9%,transparent 10%),
    #d47b59;
  transform:translateX(-50%) rotate(-8deg);
  box-shadow:7px 9px 0 rgba(20,7,5,.36);
}
.crash-bonus-hero::after {
  content:"";
  width:38px;
  height:38px;
  position:absolute;
  left:calc(57% + 28px);
  top:21px;
  border-radius:0 0 0 32px;
  background:#1c120f;
  transform:rotate(15deg);
}
.crash-bonus-hero > span,.crash-bonus-hero > em { position:relative; z-index:2; }
.crash-bonus-hero small { color:#c27b46; font:5px/1 var(--pixel); }
.crash-bonus-hero b { display:block; margin-top:8px; color:#f6ede7; font:10px/1.45 var(--pixel); }
.crash-bonus-hero > em {
  border:1px solid rgba(255,199,95,.16);
  border-radius:8px;
  padding:7px;
  color:#dca64e;
  background:rgba(255,199,95,.05);
  font:normal 5px/1 var(--pixel);
}
.crash-bonus-page .crash-benefits { margin-top:20px; }
.crash-subnav {
  height:58px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  position:absolute;
  z-index:14;
  left:12px;
  right:12px;
  bottom:calc(10px + var(--safe-bottom));
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  padding:6px;
  background:rgba(24,19,17,.94);
  box-shadow:0 14px 35px rgba(0,0,0,.48),0 0 22px rgba(255,115,73,.06);
  backdrop-filter:blur(16px);
}
.crash-subnav button {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:0;
  border-radius:13px;
  color:#817974;
  background:transparent;
  font-size:9px;
  font-weight:900;
}
.crash-subnav svg { width:17px; height:17px; }
.crash-subnav button.active {
  color:#28130d;
  background:linear-gradient(135deg,#ff8b5e,#f5be5c);
  box-shadow:0 7px 18px rgba(255,123,75,.16);
}
.game-cookie-cloud { display:none; }
.crash-history { gap:7px; margin:11px 0 9px; padding:2px 0 4px; }
.crash-history span,.crash-history button {
  min-width:58px;
  min-height:31px;
  border-color:rgba(255,255,255,.08);
  border-radius:10px;
  padding:8px 9px 7px;
  background:#211c1a;
  box-shadow:none;
  font-size:7px;
}
.crash-history button small { display:none; }
.crash-arena {
  height:326px;
  border-color:rgba(255,255,255,.07);
  border-radius:20px;
  background:#0d0907;
  box-shadow:inset 0 0 55px rgba(0,0,0,.24),0 12px 32px rgba(0,0,0,.18);
}
.crash-arena::before { opacity:.3; }
.crash-round-status {
  left:14px;
  top:13px;
  border:0;
  border-radius:8px;
  padding:6px 8px;
  color:#918985;
  background:rgba(255,255,255,.045);
}
.crash-multiplier {
  margin-top:46px;
  font-size:37px;
  text-shadow:3px 4px 0 #4e2520,0 0 28px rgba(255,117,89,.17);
}
.crash-arena.waiting .crash-multiplier {
  width:82px;
  height:82px;
  margin-top:48px;
  border:2px solid rgba(255,199,95,.42);
  border-radius:18px;
  font-size:32px;
  box-shadow:0 0 0 5px rgba(255,199,95,.035),0 15px 35px rgba(0,0,0,.24);
}
.crash-track-glow { stroke:rgba(255,105,78,.26); stroke-width:10; filter:blur(8px); }
.crash-track-main { stroke-width:3.2; filter:drop-shadow(0 0 5px rgba(255,174,94,.55)); }
.crash-ground { opacity:.15; }
.crash-cookie-wrap { width:80px; height:80px; }
.crash-cookie-wrap::before { inset:-10px; }
.crash-cookie-wrap::after { width:62px; height:10px; left:-49px; top:39px; }
.crash-cookie {
  width:66px;
  height:66px;
  left:7px;
  top:7px;
  border:5px solid #51271f;
  border-radius:50%;
  background:linear-gradient(145deg,#df8a60,#b85f47);
  clip-path:polygon(25% 2%,65% 0,65% 5%,84% 5%,84% 12%,95% 12%,95% 28%,100% 28%,100% 66%,94% 66%,94% 82%,84% 82%,84% 92%,66% 92%,66% 100%,30% 100%,30% 96%,15% 96%,15% 88%,6% 88%,6% 72%,0 72%,0 34%,5% 34%,5% 18%,14% 18%,14% 8%,25% 8%);
  filter:drop-shadow(6px 7px 0 rgba(35,14,11,.55));
}
.crash-cookie::before {
  inset:6px 7px 28px;
  border-radius:12px 15px 9px 12px;
  background:linear-gradient(135deg,#ffaaa5,#ff8582);
  clip-path:polygon(0 0,100% 0,100% 62%,87% 62%,87% 82%,66% 82%,66% 68%,43% 68%,43% 88%,22% 88%,22% 70%,0 70%);
}
.crash-cookie::after { right:0; top:25px; }
.crash-sky-pixels i {
  width:3px;
  height:3px;
  border:0;
  border-radius:0;
  opacity:.36;
  background:var(--cream);
  box-shadow:5px 5px 0 rgba(255,199,95,.28);
}
.crash-sky-pixels i::before { display:none; }
.crash-controls {
  margin-top:10px;
  border-color:rgba(255,255,255,.07);
  border-radius:18px;
  padding:13px;
  background:#191514;
  box-shadow:none;
}
.crash-control-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:0 2px 8px;
  color:#918985;
  font-size:10px;
  font-weight:800;
}
.crash-control-head button {
  margin-left:auto;
  border:1px solid rgba(255,199,95,.18);
  border-radius:8px;
  padding:6px 8px;
  color:var(--gold);
  background:rgba(255,199,95,.06);
  font-size:8px;
  font-weight:800;
}
.crash-wallet-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:0 2px 7px;
  color:#6f6965;
  font-size:8px;
  font-weight:800;
}
.crash-wallet-head button {
  border:1px solid rgba(86,169,238,.3);
  border-radius:8px;
  padding:6px 8px;
  color:#7fc5ff;
  background:rgba(58,139,211,.09);
  font-size:7px;
  font-weight:900;
}
.crash-wallet-picker {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-bottom:9px;
}
.crash-wallet {
  min-width:0;
  display:grid;
  grid-template-columns:9px minmax(0,1fr);
  gap:8px;
  align-items:start;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:10px;
  color:#9d9690;
  background:#211e1c;
  text-align:left;
}
.crash-wallet > i {
  width:8px;
  height:8px;
  margin-top:2px;
  border-radius:50%;
  background:currentColor;
  box-shadow:0 0 10px currentColor;
}
.crash-wallet span { min-width:0; display:flex; flex-direction:column; gap:4px; }
.crash-wallet small { color:currentColor; font:5px/1 var(--pixel); }
.crash-wallet b {
  overflow:hidden;
  color:#e7dfd9;
  font:10px/1.1 var(--pixel);
  text-overflow:ellipsis;
  white-space:nowrap;
}
.crash-wallet em { color:#6f6965; font-size:7px; font-style:normal; font-weight:700; }
.crash-wallet.main { color:#d8a83f; }
.crash-wallet.game { color:#58aee9; }
.crash-wallet.bonus {
  grid-column:1 / -1;
  grid-template-columns:9px minmax(0,1fr) auto;
  align-items:center;
  overflow:hidden;
  position:relative;
  border-color:rgba(255,199,95,.3);
  padding:12px;
  color:#ffc75f;
  background:
    radial-gradient(circle at 92% 0,rgba(255,210,103,.16),transparent 37%),
    linear-gradient(135deg,rgba(255,181,54,.1),#211b16 64%);
  box-shadow:inset 0 0 0 1px rgba(255,199,95,.04);
}
.crash-wallet.bonus[hidden] { display:none; }
.crash-wallet.bonus > strong {
  min-width:82px;
  color:#d4a74b;
  text-align:right;
}
.crash-wallet.bonus > strong small {
  display:block;
  color:#8d713d;
  font:5px/1 var(--pixel);
}
.crash-wallet.bonus > strong b {
  display:block;
  margin-top:6px;
  overflow:visible;
  color:#ffe3a0;
  font:7px/1.25 var(--pixel);
  white-space:normal;
}
.crash-wallet.bonus .crash-bonus-bar {
  height:4px;
  display:block;
  grid-column:2 / -1;
  overflow:hidden;
  border-radius:99px;
  background:rgba(255,255,255,.06);
}
.crash-wallet.bonus .crash-bonus-bar i {
  width:0;
  height:100%;
  display:block;
  border-radius:inherit;
  background:linear-gradient(90deg,#e79d28,#ffe29a);
  box-shadow:0 0 12px rgba(255,199,95,.34);
  transition:width .3s ease;
}
.crash-wallet.main.active {
  border-color:rgba(255,199,95,.48);
  background:linear-gradient(135deg,rgba(255,199,95,.12),#211e1c 58%);
  box-shadow:inset 0 0 0 1px rgba(255,199,95,.07);
}
.crash-wallet.game.active {
  border-color:rgba(91,184,248,.52);
  background:linear-gradient(135deg,rgba(70,157,225,.15),#211e1c 58%);
  box-shadow:inset 0 0 0 1px rgba(91,184,248,.08);
}
.crash-wallet.bonus.active {
  border-color:rgba(255,210,103,.58);
  background:
    radial-gradient(circle at 92% 0,rgba(255,226,154,.21),transparent 37%),
    linear-gradient(135deg,rgba(255,190,61,.17),#211b16 64%);
  box-shadow:inset 0 0 0 1px rgba(255,214,119,.1),0 0 20px rgba(255,180,54,.05);
}
.crash-wallet:disabled { opacity:.62; }
.crash-controls[data-balance="bonus"] .crash-input { border-color:rgba(255,199,95,.48); }
.crash-controls[data-balance="bonus"] .crash-input span { color:#ffd36d; }
.crash-benefits { margin:22px 0 4px; }
.crash-benefits-head {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  margin:0 2px 10px;
}
.crash-benefits-head small {
  display:block;
  color:#c98332;
  font:5px/1 var(--pixel);
}
.crash-benefits-head b {
  display:block;
  margin-top:7px;
  color:#e7dfd9;
  font:9px/1 var(--pixel);
}
.crash-benefits-head em {
  border:1px solid rgba(255,199,95,.13);
  border-radius:8px;
  padding:6px 7px;
  color:#9f7d45;
  background:rgba(255,199,95,.04);
  font:normal 5px/1 var(--pixel);
}
.crash-benefits-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.crash-benefit {
  min-width:0;
  min-height:128px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.07);
  border-radius:17px;
  padding:13px;
  color:#e7dfd9;
  text-align:left;
  background:#191514;
  box-shadow:0 10px 26px rgba(0,0,0,.16);
}
.crash-benefit::after {
  content:"";
  width:92px;
  height:92px;
  position:absolute;
  right:-42px;
  top:-42px;
  border-radius:50%;
  opacity:.2;
  background:currentColor;
  filter:blur(12px);
}
.crash-benefit.story {
  min-height:92px;
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  color:#ff9a72;
  background:
    radial-gradient(circle at 86% 20%,rgba(255,122,66,.15),transparent 30%),
    linear-gradient(135deg,#241713,#171312 65%);
}
.crash-benefit.cashback { color:#efbf5d; }
.crash-benefit.referral { color:#e58c71; }
.crash-benefit-icon {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid currentColor;
  border-radius:13px;
  color:currentColor;
  background:color-mix(in srgb,currentColor 10%,transparent);
  box-shadow:inset 0 0 16px color-mix(in srgb,currentColor 8%,transparent);
}
.crash-benefit-icon b { font:10px/1 var(--pixel); }
.crash-benefit > span { min-width:0; margin-top:13px; }
.crash-benefit.story > span { margin-top:0; }
.crash-benefit > span small {
  display:block;
  color:currentColor;
  font:5px/1.2 var(--pixel);
}
.crash-benefit > span b {
  display:block;
  margin-top:8px;
  color:#eee5df;
  font:8px/1.15 var(--pixel);
}
.crash-benefit > span em {
  display:block;
  margin-top:8px;
  overflow:hidden;
  color:#827b76;
  font-size:8px;
  font-style:normal;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.crash-benefit > strong {
  position:absolute;
  right:13px;
  bottom:11px;
  color:#625b56;
  font:18px/1 sans-serif;
}
.crash-benefit.story > strong {
  position:static;
  color:#8c5b48;
}
.crash-game-menu-card.crash-feature-card {
  max-height:min(88vh,760px);
  overflow:auto;
  border-color:rgba(255,199,95,.1);
  background:
    radial-gradient(circle at 90% -4%,rgba(255,117,69,.08),transparent 28%),
    #171312;
}
.crash-rewards-body { display:grid; gap:12px; padding-top:14px; }
.crash-feature-hero {
  min-height:145px;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.07);
  border-radius:18px;
  padding:16px;
  background:#211a17;
}
.crash-feature-hero::after {
  content:"";
  width:150px;
  height:150px;
  position:absolute;
  right:-54px;
  top:-58px;
  border-radius:50%;
  opacity:.16;
  background:var(--hero-color,#ff8d61);
  filter:blur(18px);
}
.crash-feature-hero.story {
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:15px;
  align-items:center;
  --hero-color:#ff7a49;
  background:linear-gradient(145deg,#2b1812,#1b1513 70%);
}
.crash-story-preview {
  width:94px;
  height:132px;
  display:flex;
  flex-direction:column;
  align-items:center;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,197,119,.18);
  border-radius:15px;
  padding-top:14px;
  color:#fff0d8;
  background:
    radial-gradient(circle at 50% 58%,rgba(255,132,65,.2),transparent 29%),
    linear-gradient(165deg,#3a1d14,#120d0b);
  box-shadow:0 12px 24px rgba(0,0,0,.25);
}
.crash-story-preview span { color:#ffcb72; font:5px/1 var(--pixel); }
.crash-story-preview b { margin-top:7px; font:9px/1 var(--pixel); }
.crash-story-preview i {
  width:44px;
  height:44px;
  margin-top:15px;
  border:4px solid #592b20;
  border-radius:50%;
  background:radial-gradient(circle at 34% 30%,#ffaca3 0 19%,transparent 20%),#cf7958;
  box-shadow:4px 5px 0 rgba(0,0,0,.28);
}
.crash-story-preview em { margin-top:13px; color:#d49a68; font-size:7px; font-style:normal; font-weight:800; }
.crash-feature-hero-copy { position:relative; z-index:1; }
.crash-feature-hero-copy small,.crash-feature-hero > div > small {
  display:block;
  color:#bd7b4e;
  font:5px/1.3 var(--pixel);
}
.crash-feature-hero-copy strong,.crash-feature-hero > div > strong {
  display:block;
  margin-top:10px;
  color:#fff0d8;
  font:25px/1 var(--pixel);
}
.crash-feature-hero p {
  position:relative;
  z-index:1;
  margin:11px 0 0;
  color:#9b8f88;
  font-size:9px;
  line-height:1.45;
}
.crash-feature-hero.cashback,.crash-feature-hero.referral { min-height:132px; padding-right:88px; }
.crash-feature-hero.cashback { --hero-color:#ffc75f; background:linear-gradient(145deg,#292117,#191513 70%); }
.crash-feature-hero.referral { --hero-color:#ff8d70; background:linear-gradient(145deg,#2a1915,#191413 70%); }
.crash-feature-hero > span {
  position:absolute;
  right:14px;
  bottom:14px;
  color:#6f5b41;
  font:5px/1 var(--pixel);
}
.crash-feature-status {
  display:grid;
  grid-template-columns:9px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:13px;
  padding:12px;
  background:#201c1a;
}
.crash-feature-status > i { width:8px; height:8px; border-radius:50%; background:#e7ac56; box-shadow:0 0 10px rgba(231,172,86,.45); }
.crash-feature-status > i.paid { background:#78d59a; box-shadow:0 0 10px rgba(120,213,154,.45); }
.crash-feature-status > i.rejected { background:#d8796d; }
.crash-feature-status small,.crash-ref-wallet small,.crash-ref-stats small,.crash-cashback-wallet small {
  display:block;
  color:#746d68;
  font:5px/1.2 var(--pixel);
}
.crash-feature-status b { display:block; margin-top:6px; color:#ddd5cf; font-size:10px; }
.crash-feature-status em { color:#9e7560; font-size:8px; font-style:normal; font-weight:800; }
.crash-story-steps { display:grid; gap:7px; margin:0; padding:0; list-style:none; }
.crash-story-steps li {
  display:grid;
  grid-template-columns:28px 1fr;
  align-items:center;
  gap:10px;
  border-radius:12px;
  padding:9px;
  background:rgba(255,255,255,.025);
}
.crash-story-steps li > i {
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,199,95,.18);
  border-radius:9px;
  color:#d89c4c;
  background:rgba(255,199,95,.05);
  font:normal 6px/1 var(--pixel);
}
.crash-story-steps b { display:block; color:#cfc7c1; font-size:9px; }
.crash-story-steps small { display:block; margin-top:4px; color:#706965; font-size:7px; }
.crash-feature-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.crash-feature-action {
  min-height:44px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  color:#c9c0ba;
  background:#26211f;
  font-size:9px;
  font-weight:900;
}
.crash-feature-action.primary {
  border-color:transparent;
  color:#2b160d;
  background:linear-gradient(135deg,#ff8b5e,#f6be59);
  box-shadow:0 7px 18px rgba(255,126,78,.12);
}
.crash-feature-action:disabled { opacity:.38; box-shadow:none; }
.crash-cashback-list { display:grid; gap:9px; }
.crash-cashback-wallet {
  border:1px solid rgba(255,255,255,.07);
  border-radius:16px;
  padding:13px;
  background:#201c1a;
}
.crash-cashback-wallet.game { border-color:rgba(91,184,248,.13); }
.crash-cashback-wallet-head,.crash-cashback-return {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.crash-cashback-wallet-head b { display:block; margin-top:6px; color:#f0bd60; font:15px/1 var(--pixel); }
.crash-cashback-wallet.game .crash-cashback-wallet-head b { color:#79c5f6; }
.crash-cashback-wallet-head em { color:#827a75; font-size:8px; font-style:normal; }
.crash-tier-track {
  height:4px;
  overflow:hidden;
  margin:11px 0;
  border-radius:99px;
  background:rgba(255,255,255,.05);
}
.crash-tier-track i { height:100%; display:block; border-radius:inherit; background:linear-gradient(90deg,#b8752d,#ffd677); }
.crash-cashback-wallet.game .crash-tier-track i { background:linear-gradient(90deg,#357db7,#82cdfc); }
.crash-cashback-numbers { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.crash-cashback-numbers span { border-radius:10px; padding:9px; background:rgba(255,255,255,.025); }
.crash-cashback-numbers b { display:block; margin-top:6px; color:#b8afa9; font-size:10px; }
.crash-cashback-return { margin-top:10px; border-top:1px solid rgba(255,255,255,.05); padding-top:10px; }
.crash-cashback-return strong { display:block; margin-top:6px; color:#e9dfd7; font:12px/1 var(--pixel); }
.crash-cashback-return .crash-feature-action { min-width:94px; min-height:38px; }
.crash-ref-wallets { display:grid; gap:8px; }
.crash-ref-wallet {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:8px 12px;
  border:1px solid rgba(255,199,95,.12);
  border-radius:16px;
  padding:13px;
  background:linear-gradient(145deg,rgba(255,199,95,.06),#1e1917);
}
.crash-ref-wallet.game {
  border-color:rgba(91,184,248,.16);
  background:linear-gradient(145deg,rgba(91,184,248,.07),#1b1b1b);
}
.crash-ref-wallet strong { display:block; margin-top:8px; color:#ffe1a0; font:15px/1 var(--pixel); }
.crash-ref-wallet.game strong { color:#91d4ff; }
.crash-ref-wallet span { grid-column:1; color:#786f69; font-size:8px; }
.crash-ref-wallet .crash-feature-action { min-width:88px; min-height:40px; grid-column:2; grid-row:1 / 3; }
.crash-ref-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.crash-ref-stats span { border:1px solid rgba(255,255,255,.06); border-radius:12px; padding:11px; background:#201c1a; }
.crash-ref-stats b { display:block; margin-top:7px; color:#ded5cf; font-size:11px; }
.crash-ref-note { margin:0; color:#77706b; font-size:8px; line-height:1.45; text-align:center; }
.crash-copy-link {
  min-height:58px;
  display:grid;
  grid-template-columns:34px 1fr auto;
  align-items:center;
  gap:10px;
  border:1px solid rgba(255,141,104,.16);
  border-radius:14px;
  padding:10px;
  color:#d6ccc5;
  background:linear-gradient(135deg,rgba(255,126,82,.08),#201b19);
  text-align:left;
}
.crash-copy-link > i { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#f3a078; background:rgba(255,126,82,.09); font-style:normal; }
.crash-copy-link b { display:block; font-size:9px; }
.crash-copy-link small { display:block; margin-top:5px; color:#746c67; font-size:7px; }
.crash-copy-link > strong { color:#755d52; font-size:18px; }
.crash-bet-row { grid-template-columns:42px minmax(90px,1fr) 42px 48px; gap:6px; }
.crash-step,.crash-input {
  height:45px;
  border-color:rgba(255,255,255,.09);
  border-radius:12px;
  background:#24201e;
}
.crash-input { background:#110f0e; }
.crash-controls[data-balance="main"] .crash-input { border-color:rgba(255,199,95,.34); }
.crash-controls[data-balance="main"] .crash-input span { color:var(--gold); }
.crash-controls[data-balance="game"] .crash-input { border-color:rgba(91,184,248,.42); }
.crash-controls[data-balance="game"] .crash-input span { color:#71bdf3; }
.crash-auto-row {
  display:grid;
  grid-template-columns:auto repeat(4,minmax(34px,1fr)) minmax(54px,1.25fr);
  align-items:center;
  gap:5px;
  margin-top:8px;
}
.crash-auto-row > span { padding-right:2px; color:#77716d; font:5px/1 var(--pixel); }
.crash-auto-row button,
.crash-auto-row label {
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.08);
  border-radius:9px;
  color:#9b938e;
  background:#24201e;
  font-size:8px;
  font-weight:800;
}
.crash-auto-row button.active {
  border-color:rgba(255,199,95,.35);
  color:var(--gold);
  background:rgba(255,199,95,.09);
}
.crash-auto-row button:disabled,
.crash-auto-row input:disabled { opacity:.55; }
.crash-auto-row label { padding:0 7px; background:#110f0e; }
.crash-auto-row input {
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  color:var(--cream);
  background:transparent;
  font-size:9px;
  font-weight:800;
  text-align:center;
}
.crash-auto-row label i { color:var(--gold); font-style:normal; font-size:9px; }
.crash-live-win[hidden] { display:none; }
.crash-live-win {
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:9px;
  border:1px solid rgba(111,211,145,.2);
  border-radius:11px;
  padding:9px 11px;
  color:#8f9a92;
  background:rgba(63,139,88,.09);
  font-size:9px;
}
.crash-live-win b { color:#93dfaa; font:9px/1 var(--pixel); }
.crash-action { min-height:48px; border-radius:13px; }
.crash-feed { margin-top:18px; }
.crash-feed .section-title-row { margin-bottom:9px; padding:0 2px; }
.crash-feed .section-title-row h3 { font-size:13px; }
.crash-player-list { gap:8px; }
.crash-player {
  grid-template-columns:50px minmax(0,1fr) auto;
  gap:11px;
  min-height:72px;
  border:1px solid #393735;
  border-radius:18px;
  padding:10px 12px;
  background:#1d1b1a;
  box-shadow:none;
}
.crash-player-avatar {
  width:50px;
  height:50px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
}
.crash-player-info b { display:flex; align-items:center; gap:6px; min-width:0; color:#f3eee9; font-size:13px; }
.crash-player-info b > span { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.crash-player.bonus { border-color:rgba(240,201,77,.42); }
.crash-bet-bonus {
  flex:none;
  display:inline-grid;
  place-items:center;
  width:16px;
  height:16px;
  border-radius:5px;
  background:#f0c94d;
  color:#2b1a08;
  font:700 10px/1 var(--pixel);
  text-decoration:none;
}
.crash-player-info small {
  width:max-content;
  display:block;
  margin-top:7px;
  border-radius:8px;
  padding:5px 7px;
  color:#aaa39e;
  background:#2b2927;
  font-size:9px;
  font-weight:800;
}
.crash-player-info small i { color:#8f8984; }
.crash-player-info small em { margin-left:4px; color:#b8b0aa; font-style:normal; }
.crash-player strong {
  border-radius:12px;
  padding:10px 11px;
  color:#c4bdb7;
  background:#2d2b29;
  font-size:13px;
  white-space:nowrap;
}
.crash-player strong i { color:#8f8984; font-style:normal; font-size:9px; }
.crash-player.flying { border-color:#393735; background:#1d1b1a; }
.crash-player.flying strong,.crash-player.flying small i { color:#c4bdb7; }
.crash-player.won { border-color:rgba(94,192,129,.48); background:#202b25; }
.crash-player.won small { color:#9dd7ad; background:#254232; }
.crash-player.won small i,.crash-player.won small em { color:#9ce2b3; }
.crash-player.won strong { color:#9ce2b3; background:#244d36; }
.crash-player.lost { border-color:rgba(167,85,74,.42); background:#2a211f; }
.crash-player.lost small { color:#c99189; background:#3b2926; }
.crash-player.lost small i,.crash-player.lost small em { color:#d5877d; }
.crash-player.lost strong { color:#d5877d; background:#492b27; }
.crash-arena.flying .crash-sky-pixels i { animation:crash-space-scroll 1.8s linear infinite; }
.crash-arena.flying .crash-sky-pixels i:nth-child(2n) { animation-duration:2.6s; animation-delay:-.8s; }
.crash-arena.flying .crash-sky-pixels i:nth-child(3n) { animation-duration:1.35s; animation-delay:-.35s; }
.crash-sky-pixels {
  opacity:.3;
  transition:opacity .18s linear;
}
.crash-ground {
  opacity:var(--lvl-ground);
  background:linear-gradient(90deg,rgba(255,115,89,.34),transparent 84%);
  box-shadow:0 0 14px rgba(255,115,89,.2);
  transition:opacity .18s linear;
}
@keyframes crash-space-scroll {
  0% { margin-top:-80px; opacity:0; }
  18% { opacity:.4; }
  100% { margin-top:190px; opacity:0; }
}
.crash-game-menu[hidden] { display:none; }
.crash-game-menu { position:fixed; z-index:78; inset:0; display:flex; align-items:flex-end; justify-content:center; }
.crash-game-menu-card {
  width:min(520px,100%);
  position:relative;
  z-index:1;
  border:1px solid rgba(255,255,255,.08);
  border-radius:23px 23px 0 0;
  padding:18px 16px calc(22px + var(--safe-bottom));
  background:#181413;
  box-shadow:0 -20px 55px rgba(0,0,0,.5);
  animation:crash-proof-in .22s ease-out;
}
.crash-game-menu-card .crash-records { margin-top:16px; }
.crash-personal-stats {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:16px;
}
.crash-personal-stats > span {
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  padding:11px;
  background:#211d1b;
}
.crash-personal-stats small { display:block; color:#8f8782; font-size:8px; }
.crash-personal-stats b { display:block; margin-top:7px; color:var(--cream); font-size:13px; }
.crash-personal-stats b.positive { color:#93dfaa; }
.crash-personal-stats b.negative { color:#d5877d; }
.crash-record-title { margin:18px 2px 0; color:var(--cream); font-size:12px; }
.crash-menu-proof-button {
  width:100%;
  margin-top:11px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  padding:12px;
  color:#bbb3ad;
  background:#24201e;
  font-size:10px;
  font-weight:800;
}
.crash-skin-gold .crash-cookie { background:linear-gradient(145deg,#efbf62,#b86f36); border-color:#65361f; }
.crash-skin-gold .crash-cookie::before { background:linear-gradient(135deg,#fff0ad,#ffbf66); }
.crash-skin-mint .crash-cookie { background:linear-gradient(145deg,#78c2a0,#397a68); border-color:#214f45; }
.crash-skin-mint .crash-cookie::before { background:linear-gradient(135deg,#b8f1d5,#66cfa6); }
.crash-skin-choco .crash-cookie { background:linear-gradient(145deg,#9c6044,#583125); border-color:#321a15; }
.crash-skin-choco .crash-cookie::before { background:linear-gradient(135deg,#e7c8a4,#b98b67); }
.crash-skin-berry .crash-cookie { background:linear-gradient(145deg,#df8a60,#b85f47); border-color:#51271f; }
.crash-skin-berry .crash-cookie::before { background:linear-gradient(135deg,#ffaaa5,#ff8582); }
.crash-skin-nyan .crash-cookie {
  width:82px;
  height:54px;
  left:-1px;
  top:13px;
  border:0;
  border-radius:0;
  background:url("./assets/nyan-cat.png") center/contain no-repeat;
  clip-path:none;
  image-rendering:pixelated;
  filter:drop-shadow(5px 6px 0 rgba(35,14,11,.4));
}
.crash-skin-nyan .crash-cookie::before,.crash-skin-nyan .crash-cookie::after { display:none; }
.crash-skin-nyan .crash-cookie i { display:none; }
.crash-skin-nyan .crash-cookie b,.crash-skin-nyan .crash-cookie em { display:none; }
.crash-skin-rich .crash-cookie { background:linear-gradient(145deg,#f3c855,#b87b26); border-color:#684316; }
.crash-skin-rich .crash-cookie::before { inset:7px; border-radius:45%; background:linear-gradient(145deg,#ffd969,#e2a638); clip-path:none; }
.crash-skin-rich .crash-cookie::after {
  width:19px;
  height:13px;
  left:8px;
  right:auto;
  top:22px;
  border:3px solid #171311;
  border-radius:4px;
  background:linear-gradient(145deg,#191919,#5a4a23);
  box-shadow:25px 0 0 -3px #31291c,25px 0 0 0 #171311,18px 3px 0 -7px #171311;
}
.crash-skin-rich .crash-cookie i:nth-child(1) { width:5px; height:3px; left:14px; top:28px; background:#fff3a2; }
.crash-skin-rich .crash-cookie i:nth-child(2) { width:5px; height:3px; left:39px; top:28px; background:#fff3a2; }
.crash-skin-rich .crash-cookie i:nth-child(n+3) { display:none; }
.crash-skin-rich .crash-cookie b { width:22px; height:4px; left:22px; bottom:11px; border-radius:0 0 9px 9px; background:#6f371e; }
.crash-skin-rich .crash-cookie em { width:6px; height:5px; left:31px; bottom:10px; background:#fff2bd; }
.crash-skin-doge .crash-cookie { background:linear-gradient(145deg,#e7bf78,#ad7742); border-color:#563a25; }
.crash-skin-doge .crash-cookie::before {
  inset:6px;
  background:#e9c98f;
  clip-path:polygon(4% 0,28% 13%,50% 7%,72% 13%,96% 0,89% 70%,70% 94%,30% 94%,11% 70%);
}
.crash-skin-doge .crash-cookie::after { width:8px; height:7px; left:29px; right:auto; top:36px; border-radius:50%; background:#36271f; box-shadow:-13px -15px 0 -1px #36271f,13px -15px 0 -1px #36271f; }
.crash-skin-doge .crash-cookie i { display:none; }
.crash-skin-doge .crash-cookie b { width:19px; height:12px; left:24px; bottom:8px; border-radius:0 0 50% 50%; background:#f5ddb0; }
.crash-skin-doge .crash-cookie em { width:3px; height:7px; left:33px; bottom:13px; background:#7e4e36; }
.crash-skin-ninja .crash-cookie { background:linear-gradient(145deg,#34343b,#15151a); border-color:#09090c; }
.crash-skin-ninja .crash-cookie::before { inset:9px 5px 31px; background:#b53238; clip-path:polygon(0 20%,80% 20%,100% 0,92% 55%,100% 100%,75% 70%,0 70%); }
.crash-skin-ninja .crash-cookie::after { width:44px; height:13px; left:6px; right:auto; top:29px; border-radius:3px; background:#d7c3a5; box-shadow:inset 10px 0 0 #1a1718,inset -10px 0 0 #1a1718; }
.crash-skin-ninja .crash-cookie i { display:none; }
.crash-skin-ninja .crash-cookie b,.crash-skin-ninja .crash-cookie em { display:none; }
.crash-skin-zombie .crash-cookie { background:linear-gradient(145deg,#7eb56b,#446e48); border-color:#29452e; }
.crash-skin-zombie .crash-cookie::before { inset:7px; border-radius:42%; background:#8fc77a; clip-path:none; }
.crash-skin-zombie .crash-cookie::after { width:8px; height:8px; left:14px; right:auto; top:23px; border-radius:50%; background:#f2e7bd; box-shadow:28px 3px 0 1px #442936,14px 20px 0 -2px #3b5835; }
.crash-skin-zombie .crash-cookie i:nth-child(1) { width:3px; height:8px; left:18px; top:23px; background:#2d2a25; }
.crash-skin-zombie .crash-cookie i:nth-child(2) { width:4px; height:4px; left:44px; top:29px; background:#f6a4ba; }
.crash-skin-zombie .crash-cookie i:nth-child(n+3) { display:none; }
.crash-skin-zombie .crash-cookie b { width:21px; height:3px; left:24px; bottom:11px; background:#355038; transform:rotate(-8deg); }
.crash-skin-zombie .crash-cookie em { width:2px; height:13px; left:36px; bottom:6px; background:#c9deb0; transform:rotate(55deg); }
.crash-skin-galaxy .crash-cookie { background:radial-gradient(circle at 30% 25%,#e6a8ff 0 5%,transparent 6%),radial-gradient(circle at 65% 65%,#55d8e8 0 4%,transparent 5%),linear-gradient(145deg,#583184,#131b4f); border-color:#17153e; }
.crash-skin-galaxy .crash-cookie::before { inset:7px; border-radius:45%; background:radial-gradient(circle at 70% 25%,#fff 0 2px,transparent 3px),radial-gradient(circle at 25% 65%,#ffd27d 0 2px,transparent 3px),linear-gradient(145deg,rgba(164,82,211,.55),rgba(29,68,150,.4)); clip-path:none; }
.crash-skin-galaxy .crash-cookie::after { width:12px; height:12px; right:9px; top:35px; border-radius:50%; background:#53d9df; box-shadow:-30px -18px 0 -3px #fff4b5,-18px 15px 0 -4px #ff9fcb; }
.crash-skin-galaxy .crash-cookie i,.crash-skin-galaxy .crash-cookie b,.crash-skin-galaxy .crash-cookie em { display:none; }
.crash-skin-king .crash-cookie { background:linear-gradient(145deg,#8c568f,#4f2e60); border-color:#33203f; }
.crash-skin-king .crash-cookie::before { inset:4px 8px 34px; background:#f0bd42; clip-path:polygon(0 100%,0 32%,22% 58%,38% 0,55% 55%,78% 12%,100% 42%,100% 100%); }
.crash-skin-king .crash-cookie::after { width:6px; height:6px; left:16px; right:auto; top:38px; border-radius:50%; background:#241828; box-shadow:27px 0 0 #241828,14px 14px 0 2px #c38e37; }
.crash-skin-king .crash-cookie i:nth-child(1) { width:5px; height:5px; left:31px; top:11px; background:#df4d64; }
.crash-skin-king .crash-cookie i:nth-child(n+2) { display:none; }
.crash-skin-king .crash-cookie b,.crash-skin-king .crash-cookie em { display:none; }
.crash-skin-robot .crash-cookie { background:linear-gradient(145deg,#9fa8ac,#596166); border-color:#343b40; border-radius:18px; }
.crash-skin-robot .crash-cookie::before { inset:8px; border:3px solid #333b3f; border-radius:9px; background:#20292d; clip-path:none; }
.crash-skin-robot .crash-cookie::after { width:9px; height:9px; left:14px; right:auto; top:25px; border-radius:2px; background:#65e2e9; box-shadow:28px 0 0 #ff7793,14px 21px 0 -2px #88979e; }
.crash-skin-robot .crash-cookie i:nth-child(1) { width:4px; height:10px; left:31px; top:-7px; background:#869297; box-shadow:0 -3px 0 2px #ffb85e; }
.crash-skin-robot .crash-cookie i:nth-child(n+2) { display:none; }
.crash-skin-robot .crash-cookie b,.crash-skin-robot .crash-cookie em { display:none; }
.crash-trail-rainbow .crash-track-main { stroke:#ff83b8; }
.crash-trail-rainbow .crash-track-glow { stroke:rgba(99,210,255,.34); }
.crash-trail-rainbow .crash-cookie-wrap::after {
  width:78px;
  height:24px;
  left:-63px;
  top:34px;
  background:linear-gradient(180deg,#ff5e66 0 16.6%,#ffad55 16.6% 33.2%,#ffe66c 33.2% 49.8%,#75df89 49.8% 66.4%,#65c8ff 66.4% 83%,#b281ff 83%);
  clip-path:polygon(0 7%,100% 0,100% 100%,0 93%);
  filter:none;
}
.crash-trail-fire .crash-track-main { stroke:#ff9b58; }
.crash-trail-fire .crash-cookie-wrap::after { background:linear-gradient(90deg,transparent,#ff604f,#ffd264); }
.crash-trail-frost .crash-track-main { stroke:#74d8ee; }
.crash-trail-frost .crash-cookie-wrap::after { background:linear-gradient(90deg,transparent,#589bd6,#9cf4ff); }
.crash-trail-lime .crash-track-main { stroke:#87d998; }
.crash-trail-lime .crash-cookie-wrap::after { background:linear-gradient(90deg,transparent,#4cab6b,#c5f28f); }
.crash-trail-berry .crash-track-main { stroke:#ff8fb7; }
.crash-trail-berry .crash-cookie-wrap::after { background:linear-gradient(90deg,transparent,#b65b9a,#ff9cc2); }

.wheel-stage {
  margin-top: 20px;
  padding: 17px 10px 21px;
  text-align: center;
  overflow: hidden;
}
.wheel-stage::before {
  content: "";
  position: absolute;
  width: 310px;
  height: 310px;
  left: 50%;
  top: 58px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: rgba(217,107,82,.07);
  filter: blur(35px);
}
.wheel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 2;
  padding: 0 7px;
  color: var(--cream-soft);
  font-size: 10px;
}
.wheel-heading b {
  padding: 5px 7px;
  border: 1px solid rgba(221,182,110,.25);
  border-radius: 7px;
  color: var(--gold);
  background: rgba(221,182,110,.07);
  font: 6px/1 var(--pixel);
}
.wheel-wrap {
  width: min(320px, calc(100vw - 52px));
  height: min(320px, calc(100vw - 52px));
  margin: 20px auto 0;
  position: relative;
  border: 1px solid rgba(221,182,110,.32);
  border-radius: 50%;
  padding: 10px;
  background:
    repeating-conic-gradient(from 0deg, rgba(221,182,110,.7) 0 1deg, transparent 1deg 9deg),
    #1a110e;
  box-shadow:
    0 0 0 5px #291b16,
    0 0 0 6px rgba(221,182,110,.16),
    0 25px 45px rgba(0,0,0,.4);
}
.wheel-pointer {
  position: absolute;
  z-index: 8;
  left: 50%;
  top: -4px;
  width: 20px;
  height: 31px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, #9c743d, var(--cream), #9c743d);
  clip-path: polygon(0 0, 100% 0, 72% 72%, 50% 100%, 28% 72%);
  filter: drop-shadow(0 4px 5px rgba(0,0,0,.5));
}
.fortune-wheel {
  width: 100%;
  height: 100%;
  position: relative;
  border: 3px solid #b88b4d;
  border-radius: 50%;
  background: conic-gradient(
    #733f35 0 36deg,
    #c18a4a 36deg 72deg,
    #3c2922 72deg 108deg,
    #9a5a49 108deg 144deg,
    #261a16 144deg 180deg,
    #633730 180deg 216deg,
    #b27b43 216deg 252deg,
    #422b24 252deg 288deg,
    #8d4f42 288deg 324deg,
    #2b1d18 324deg 360deg
  );
  box-shadow: inset 0 0 35px rgba(0,0,0,.3), 0 0 0 3px #38251f;
  transition: transform 4.2s cubic-bezier(.12,.72,.12,1);
}
.fortune-wheel::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background:
    radial-gradient(circle, transparent 0 34%, rgba(12,8,7,.1) 35% 100%),
    repeating-conic-gradient(transparent 0 35.2deg, rgba(14,9,7,.76) 35.2deg 36deg);
}
.wheel-prizes { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.wheel-prize {
  width: 64px;
  min-height: 28px;
  position: absolute;
  left: 50%;
  top: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  color: var(--cream);
  font: 700 8px/1.15 var(--pixel);
  text-align: center;
  text-shadow: 0 2px 4px rgba(0,0,0,.78);
  transform-origin: center;
}
.wheel-prize:nth-child(2),
.wheel-prize:nth-child(7) { color: #271710; text-shadow: none; }
.wheel-cookie { width: 15px; height: 15px; stroke-width: 2.2; }
.wheel-prize b { font: inherit; }
.wheel-center {
  width: 88px;
  height: 88px;
  position: absolute;
  z-index: 6;
  left: 50%;
  top: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
  border: 1px solid #bd9257;
  border-radius: 50%;
  color: var(--cream);
  background: radial-gradient(circle at 38% 30%, #4b3129, #1a110e 65%);
  box-shadow:
    0 0 0 5px #291b16,
    0 0 0 6px rgba(221,182,110,.35),
    0 8px 20px rgba(0,0,0,.45);
}
.wheel-center small { color: var(--cream-soft); font: 5px/1 var(--pixel); letter-spacing: .5px; }
.wheel-center b { margin-top: 6px; color: var(--gold); font: 9px/1 var(--pixel); }
.wheel-center span { margin-top: 7px; color: var(--cream-soft); font: 6px/1 var(--pixel); }
.wheel-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 20px 4px 0;
}
.wheel-facts > div {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--stroke);
  border-radius: 12px;
  background: rgba(255,240,198,.035);
  text-align: left;
}
.wheel-facts svg { width: 17px; height: 17px; flex: 0 0 auto; color: var(--gold); }
.wheel-facts span { min-width: 0; }
.wheel-facts small { display: block; color: var(--cream-soft); font-size: 7px; }
.wheel-facts b { display: block; margin-top: 3px; overflow: hidden; color: var(--cream); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.spin-button { width: min(250px, 82%); margin-top: 14px; }
.reward-list-button {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin-top: 10px;
  border: 0;
  padding: 0 10px;
  color: var(--cream-soft);
  background: transparent;
  cursor: pointer;
  font-size: 10px;
}
.reward-list-button svg { width: 15px; height: 15px; color: var(--gold); }
.reward-list-button:active { color: var(--cream); transform: translateY(1px); }

.live-section { margin-top: 16px; }
.section-title-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.section-title-row h3 { margin: 0; color: var(--cream); font-size: 15px; }
.live-badge { color: var(--coral); font: 6px/1 var(--pixel); animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity: .4; } }
.live-list { display: flex; flex-direction: column; gap: 8px; }
.live-row {
  display: grid;
  grid-template-columns: 32px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--stroke);
  border-radius: 13px;
  background: rgba(44,29,24,.7);
}
.live-avatar {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: #2a110b;
  background: var(--frosting);
  font: 7px/1 var(--pixel);
}
.live-copy b { display: block; color: var(--cream); font-size: 10px; }
.live-copy span { display: block; margin-top: 3px; color: var(--cream-soft); font-size: 8px; }
.live-prize { color: var(--gold); font-weight: 800; font-size: 11px; }

.giveaway-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  margin-top: 18px;
  padding: 4px;
  border: 1px solid var(--stroke);
  border-radius: 14px;
  background: rgba(12,8,7,.36);
}
.giveaway-tab {
  min-height: 38px;
  border: 0;
  border-radius: 10px;
  color: var(--cream-soft);
  background: transparent;
  font-size: 10px;
  font-weight: 800;
  cursor: pointer;
}
.giveaway-tab.active {
  color: #2a110b;
  background: linear-gradient(180deg, var(--gold), #c99c52);
  box-shadow: 0 4px 14px rgba(221,182,110,.16);
}
.giveaway-list { display: flex; flex-direction: column; gap: 11px; margin-top: 11px; }
.giveaway-card { padding: 17px; overflow: hidden; }
.giveaway-card.featured { border-color: rgba(255,113,84,.35); }
.giveaway-card.finished { border-color: rgba(221,182,110,.2); }
.giveaway-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.prize-block small { color: var(--cream-soft); font-size: 9px; }
.prize-block strong { display: block; margin-top: 5px; color: var(--gold); font: 15px/1 var(--pixel); text-shadow: 2px 2px 0 #6b4020; }
.time-block { color: var(--gold); text-align: right; }
.time-block small { display: block; color: var(--cream-soft); font-size: 8px; }
.time-block b { display: block; margin-top: 5px; font: 8px/1 var(--pixel); }
.giveaway-name { margin: 15px 0 0; color: var(--cream); font-size: 15px; }
.requirements { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.requirement {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 8px;
  border: 1px solid var(--stroke);
  border-radius: 9px;
  color: var(--cream-soft);
  background: rgba(12,8,7,.3);
  font-size: 9px;
}
.requirement svg { width: 13px; height: 13px; color: var(--gold); }
.giveaway-winner {
  display: grid;
  grid-template-columns: 22px 1fr;
  align-items: center;
  gap: 2px 8px;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid rgba(221,182,110,.22);
  border-radius: 11px;
  background: rgba(221,182,110,.06);
}
.giveaway-winner svg { grid-row: 1 / 3; width: 18px; color: var(--gold); }
.giveaway-winner span { color: var(--cream-soft); font-size: 8px; }
.giveaway-winner b { color: var(--cream); font-size: 10px; }
.giveaway-button { width: 100%; margin-top: 13px; }

.tasks-section { margin-top: 20px; }
.task-list { display: flex; flex-direction: column; gap: 9px; }
.task {
  display: grid;
  grid-template-columns: 39px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--stroke);
  border-radius: 15px;
  background: rgba(44,29,24,.72);
}
.task-icon {
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,200,87,.25);
  border-radius: 11px;
  color: var(--gold);
  background: rgba(255,200,87,.08);
}
.task-icon svg { width: 19px; height: 19px; }
.task-copy b { display: block; color: var(--cream); font-size: 11px; }
.task-copy span { display: block; margin-top: 4px; color: var(--cream-soft); font-size: 8px; }
.task-reward { color: var(--gold); font-weight: 800; font-size: 11px; }
.task-progress { height: 5px; margin-top: 7px; background: rgba(255,255,255,.07); }
.task-progress i { display: block; height: 100%; background: var(--coral); }

.sheet-backdrop {
  position: absolute;
  z-index: 90;
  inset: 0;
  display: flex;
  align-items: flex-end;
  visibility: hidden;
  opacity: 0;
  background: rgba(5,3,3,.64);
  transition: .2s ease;
}
.sheet-backdrop.open { visibility: visible; opacity: 1; }
.bottom-sheet {
  width: 100%;
  max-height: 82dvh;
  overflow-y: auto;
  padding: 10px 16px calc(20px + var(--safe-bottom));
  border: 1px solid var(--stroke-strong);
  border-bottom: 0;
  border-radius: 25px 25px 0 0;
  background: #1d1310;
  transform: translateY(100%);
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
  scrollbar-width: none;
}
.bottom-sheet::-webkit-scrollbar { display: none; }
.sheet-backdrop.open .bottom-sheet { transform: translateY(0); }
.sheet-handle { width: 42px; height: 4px; margin: 2px auto 16px; border-radius: 9px; background: rgba(255,240,194,.25); }
.sheet-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.sheet-head h2 { margin: 0; color: var(--cream); font: 12px/1.4 var(--pixel); }
.sheet-head p { margin: 7px 0 0; color: var(--cream-soft); font-size: 10px; }
.close-sheet {
  width: 35px;
  height: 35px;
  flex: 0 0 auto;
  border: 1px solid var(--stroke);
  border-radius: 11px;
  background: rgba(255,255,255,.04);
  cursor: pointer;
}
.rank-list { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.rank-item {
  display: grid;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 11px;
  border: 1px solid var(--stroke);
  border-radius: 14px;
  background: rgba(44,29,24,.65);
}
.rank-item.current { border-color: rgba(221,182,110,.38); background: rgba(221,182,110,.07); }
.rank-info b { display: block; color: var(--cream); font-size: 11px; }
.rank-info span { display: block; margin-top: 4px; color: var(--cream-soft); font-size: 8px; line-height: 1.35; }
.rank-needed { display: inline-flex; align-items: center; gap: 4px; color: var(--gold); white-space: nowrap; }
.rank-needed svg { width: 13px; height: 13px; }
.rank-needed b { font: 6px/1 var(--pixel); }
.rank-side { display: flex; flex-direction: column; align-items: flex-end; gap: 7px; }
.rank-claim {
  min-height: 27px;
  padding: 0 10px;
  border: 1px solid rgba(221,182,110,.38);
  border-radius: 9px;
  color: #2f1e18;
  background: linear-gradient(180deg, #e7c47d, #c99c52);
  cursor: pointer;
  font-size: 9px;
  font-weight: 800;
}
.rank-claim:disabled { opacity: .55; cursor: default; }
.rank-reward-status { max-width: 90px; color: var(--gold); font-size: 8px; line-height: 1.2; text-align: right; }
.rank-reward-status.muted { color: var(--cream-soft); }

.sheet-kicker {
  margin: 0 0 7px !important;
  color: var(--gold) !important;
  font: 6px/1 var(--pixel) !important;
  letter-spacing: .4px;
}
.giveaway-sheet { padding-bottom: calc(24px + var(--safe-bottom)); }
.giveaway-detail-prize {
  min-height: 125px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  margin-top: 17px;
  border: 1px solid rgba(221,182,110,.22);
  border-radius: 18px;
  background:
    radial-gradient(circle at 50% 0, rgba(217,107,82,.17), transparent 55%),
    rgba(44,29,24,.74);
}
.giveaway-detail-prize::before,
.giveaway-detail-prize::after {
  content: "";
  width: 7px;
  height: 7px;
  position: absolute;
  border: 1px solid rgba(221,182,110,.34);
}
.giveaway-detail-prize::before { left: 12px; top: 12px; }
.giveaway-detail-prize::after { right: 12px; bottom: 12px; }
.giveaway-detail-prize small { color: var(--cream-soft); font: 6px/1 var(--pixel); }
.giveaway-detail-prize strong { margin-top: 12px; color: var(--gold); font: 18px/1 var(--pixel); }
.giveaway-detail-prize span { margin-top: 11px; color: var(--cream-soft); font-size: 9px; }
.giveaway-description { margin: 16px 2px 0; color: var(--cream-soft); font-size: 11px; line-height: 1.55; }
.giveaway-result {
  display: none;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: 2px 10px;
  margin-top: 14px;
  padding: 12px;
  border: 1px solid rgba(221,182,110,.28);
  border-radius: 13px;
  background: rgba(221,182,110,.08);
}
.giveaway-result.visible { display: grid; }
.giveaway-result svg { grid-row: 1 / 3; width: 25px; color: var(--gold); }
.giveaway-result span { color: var(--cream-soft); font-size: 8px; }
.giveaway-result b { color: var(--gold); font-size: 12px; }
.detail-section { margin-top: 18px; }
.detail-section-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.detail-section-head b { color: var(--cream); font-size: 13px; }
.detail-section-head span { color: var(--cream-soft); font-size: 8px; }
.detail-requirements { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.detail-requirement {
  display: grid;
  grid-template-columns: 35px 1fr 20px;
  align-items: center;
  gap: 10px;
  padding: 11px;
  border: 1px solid var(--stroke);
  border-radius: 13px;
  background: rgba(44,29,24,.62);
}
.detail-requirement > span {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: var(--gold);
  background: rgba(221,182,110,.08);
}
.detail-requirement > span svg { width: 18px; height: 18px; }
.detail-requirement div b { display: block; color: var(--cream); font-size: 10px; }
.detail-requirement div small { display: block; margin-top: 4px; color: var(--cream-soft); font-size: 8px; }
.detail-requirement > svg { width: 16px; height: 16px; color: var(--gold); opacity: .45; }
.giveaway-copy-button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
}
.giveaway-copy-button svg { width: 16px; height: 16px; }
.detail-join-button { width: 100%; margin-top: 16px; }

.reward-sheet { padding-bottom: calc(24px + var(--safe-bottom)); }
.reward-catalog { display: flex; flex-direction: column; gap: 7px; margin-top: 17px; }
.reward-row {
  display: grid;
  grid-template-columns: 27px 36px 1fr;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  border: 1px solid var(--stroke);
  border-radius: 13px;
  background: linear-gradient(135deg, rgba(74,40,33,.74), rgba(42,23,20,.72));
}
.reward-row.empty { opacity: .58; }
.reward-number { color: var(--cream-soft); font: 5px/1 var(--pixel); }
.reward-mark {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,199,95,.25);
  border-radius: 11px;
  color: var(--gold);
  background: rgba(255,199,95,.08);
  font: 8px/1 var(--pixel);
}
.reward-mark svg { width: 18px; height: 18px; }
.reward-copy b { display: block; color: var(--cream); font-size: 11px; }
.reward-copy small { display: block; margin-top: 4px; color: var(--cream-soft); font-size: 8px; line-height: 1.35; }

.toast {
  position: fixed;
  z-index: 250;
  left: 50%;
  bottom: calc(100px + var(--safe-bottom));
  max-width: calc(100% - 32px);
  padding: 10px 13px;
  border: 1px solid var(--stroke-strong);
  border-radius: 12px;
  color: var(--cream);
  background: #2c1d18;
  box-shadow: 4px 4px 0 rgba(0,0,0,.3);
  opacity: 0;
  transform: translate(-50%, 10px);
  pointer-events: none;
  font-size: 10px;
  text-align: center;
  transition: .18s ease;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

svg.icon { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: square; stroke-linejoin: miter; }

/* Cookie Crash: compact controls, public cashouts and animated game card. */
.game-banner-badges {
  position:absolute;
  z-index:4;
  inset:0;
  overflow:hidden;
  pointer-events:none;
}
.game-banner-badges em {
  position:absolute;
  border:1px solid currentColor;
  border-radius:9px;
  padding:6px 8px;
  background:rgba(15,13,25,.78);
  box-shadow:0 0 16px color-mix(in srgb,currentColor 35%,transparent);
  font:normal 7px/1 var(--pixel);
  animation:game-kef-float 2.5s ease-in-out infinite;
}
.game-banner-badges em:nth-child(1) { right:139px; top:102px; color:#9ee2b3; }
.game-banner-badges em:nth-child(2) { right:18px; top:67px; color:var(--gold); animation-delay:-.8s; }
.game-banner-badges em:nth-child(3) { right:12px; top:187px; color:#ff9a8b; animation-delay:-1.6s; }
@keyframes game-kef-float {
  0%,100% { transform:translateY(0) rotate(-2deg); opacity:.75; }
  50% { transform:translateY(-7px) rotate(2deg); opacity:1; }
}
.crash-head-title { display:flex; flex-direction:column; align-items:center; gap:5px; }
.game-screen-head .crash-head-title b {
  margin:0;
  color:#fff8ed;
  font-size:11px;
  letter-spacing:.7px;
  text-shadow:2px 2px 0 #5d2922,0 0 18px rgba(255,121,89,.2);
}
.crash-head-title b em { color:var(--gold); font-style:normal; }
.game-screen-head .crash-head-title small {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  color:#77716d;
  font-size:4px;
  letter-spacing:.5px;
}
.crash-markers { position:absolute; z-index:3; inset:0; pointer-events:none; }
.crash-marker {
  position:absolute;
  display:flex;
  align-items:center;
  gap:3px;
  border:0;
  padding:0;
  color:#d9f5e2;
  background:transparent;
  transform:translate(-50%,-115%);
  pointer-events:auto;
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.65));
  animation:crash-marker-pop .22s ease-out;
}
.crash-marker > span {
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:2px solid #83d9a1;
  border-radius:8px;
  color:#17271d;
  background:#9ee2b3;
  font:6px/1 var(--pixel);
}
.crash-marker img { width:100%; height:100%; display:block; object-fit:cover; }
.crash-marker b {
  border:1px solid rgba(131,217,161,.34);
  border-radius:6px;
  padding:4px 5px;
  background:rgba(20,42,29,.9);
  font:5px/1 var(--pixel);
  white-space:nowrap;
}
.crash-marker.compact > span { width:10px; height:10px; border-width:1px; border-radius:3px; font-size:0; }
.crash-marker.compact b { display:none; }
@keyframes crash-marker-pop { from { opacity:0; transform:translate(-50%,-80%) scale(.4); } }
.crash-action-bar { position:relative; }
.crash-stake-summary[hidden] { display:none; }
.crash-stake-summary {
  margin-bottom:8px;
  color:#c8c1bb;
  font:7px/1 var(--pixel);
  text-align:center;
}
.crash-controls[data-view="cashout"],
.crash-controls[data-view="locked"] {
  padding:11px 13px;
}
.crash-controls[data-view="cashout"] {
  position:sticky;
  z-index:8;
  bottom:calc(8px + var(--safe-bottom));
  border-color:rgba(111,211,145,.25);
  background:rgba(20,25,21,.96);
  box-shadow:0 10px 34px rgba(0,0,0,.45);
  backdrop-filter:blur(12px);
}
.crash-controls[data-view="cashout"] .crash-bet-form,
.crash-controls[data-view="locked"] .crash-bet-form { display:none; }
.crash-controls[data-view="cashout"] .crash-live-win { margin-top:0; }
.crash-controls[data-view="cashout"] .crash-action {
  min-height:58px;
  margin-top:8px;
  font-size:15px;
}
.crash-controls[data-view="locked"] .crash-action { margin-top:0; }
.crash-privacy-toggle {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  padding:12px;
  color:#eee8e2;
  background:#211d1b;
  text-align:left;
}
.crash-privacy-toggle span { min-width:0; }
.crash-privacy-toggle b { display:block; font-size:11px; }
.crash-privacy-toggle small { display:block; margin-top:5px; color:#837d78; font-size:8px; }
.crash-privacy-toggle > i {
  width:42px;
  height:24px;
  flex:0 0 auto;
  position:relative;
  border:1px solid #4c4845;
  border-radius:8px;
  background:#302c2a;
}
.crash-privacy-toggle > i::after {
  content:"";
  width:16px;
  height:16px;
  position:absolute;
  left:3px;
  top:3px;
  border-radius:5px;
  background:#817a75;
  transition:.18s ease;
}
.crash-privacy-toggle.active { border-color:rgba(91,184,248,.3); background:#192631; }
.crash-privacy-toggle.active > i { border-color:#58aee9; background:#17344a; }
.crash-privacy-toggle.active > i::after { left:21px; background:#71bdf3; box-shadow:0 0 10px rgba(113,189,243,.45); }
.crash-privacy-toggle:disabled { opacity:.6; }

@media (min-width: 521px) {
  body { background: #090605; }
  .app-shell { border-left: 1px solid rgba(255,240,194,.08); border-right: 1px solid rgba(255,240,194,.08); }
}
@media (max-width: 370px) {
  .brand-copy strong { font-size: 8px; }
  .wallet-pill { padding: 0 8px; }
  .page { padding-left: 12px; padding-right: 12px; }
  .floating-nav { left: 8px; right: 8px; gap: 2px; }
  .nav-button { padding-left: 2px; padding-right: 2px; }
  .nav-button span:last-child { font-size: 8px; }
  .wheel-wrap { width: min(298px, calc(100vw - 44px)); height: min(298px, calc(100vw - 44px)); }
  .wheel-prize { width: 58px; font-size: 7px; }
  .wheel-facts b { font-size: 8px; }
  .crash-arena { height: 306px; }
  .crash-multiplier { font-size: 25px; }
  .crash-bet-row { grid-template-columns: 35px minmax(76px, 1fr) 40px 46px; gap: 5px; }
  .crash-step { padding: 0 3px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
