:root {
  --bg: #030006;
  --ink: #fbf7ff;
  --muted: rgba(251, 247, 255, .74);
  --soft: rgba(251, 247, 255, .56);
  --panel: rgba(14, 5, 34, .82);
  --panel-strong: rgba(18, 7, 43, .94);
  --line: rgba(195, 82, 255, .38);
  --line-strong: rgba(255, 47, 174, .72);
  --violet: #8d35ff;
  --purple: #b026ff;
  --pink: #ff2fae;
  --cyan: #2ff6ff;
  --blue: #4472ff;
  --yellow: #ffd84d;
  --green: #a7ff47;
  --danger: #ff477e;
  --radius-xl: 30px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --shadow-pink: 0 0 22px rgba(255, 47, 174, .62), 0 0 52px rgba(141, 53, 255, .38);
  --shadow-cyan: 0 0 18px rgba(47, 246, 255, .36), 0 0 42px rgba(47, 246, 255, .18);
  --font: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --display: Orbitron, Inter, sans-serif;
  --pixel: "Press Start 2P", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  min-height: 100svh;
  color: var(--ink);
  font-family: var(--font);
  background: var(--bg);
  overflow-x: hidden;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}
body.modal-open { overflow: hidden; }
a { color: inherit; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }

.brc-bg {
  position: fixed;
  inset: 0;
  z-index: -5;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at 48% -12%, rgba(141, 53, 255, .22), transparent 34%),
    radial-gradient(circle at 92% 14%, rgba(255, 47, 174, .20), transparent 38%),
    #030006;
}
.bg-orb { position: absolute; border-radius: 999px; filter: blur(2px); opacity: .9; }
.bg-orb-a { width: 72vw; height: 72vw; left: -46vw; top: -24vw; background: radial-gradient(circle, rgba(141,53,255,.42), transparent 66%); }
.bg-orb-b { width: 86vw; height: 86vw; right: -54vw; top: -22vw; background: radial-gradient(circle, rgba(255,47,174,.34), transparent 62%); }
.bg-sun {
  position: absolute;
  width: clamp(122px, 48vw, 270px);
  height: clamp(122px, 48vw, 270px);
  right: -52px;
  top: 126px;
  border-radius: 50%;
  background:
    repeating-linear-gradient(0deg, rgba(3,0,6,0) 0 10px, rgba(3,0,6,.78) 10px 17px),
    linear-gradient(180deg, #ffd84d 0%, #ff7a40 40%, #ff2fae 100%);
  opacity: .42;
  box-shadow: 0 0 70px rgba(255,47,174,.36);
}
.bg-grid {
  position: absolute;
  left: -55%;
  right: -55%;
  bottom: -20vh;
  height: 70vh;
  transform: perspective(520px) rotateX(62deg);
  transform-origin: top;
  background:
    linear-gradient(rgba(141,53,255,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,47,174,.34) 1px, transparent 1px);
  background-size: 34px 34px;
  opacity: .42;
  mask-image: linear-gradient(to bottom, transparent, #000 17%, transparent 85%);
}
.bg-scanlines {
  position: absolute;
  inset: 0;
  opacity: .09;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.55) 0 1px, transparent 1px 5px);
  mix-blend-mode: screen;
}
.bg-noise {
  position: absolute;
  inset: 0;
  opacity: .17;
  mix-blend-mode: screen;
  background-image:
    linear-gradient(rgba(255,255,255,.048) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.032) 1px, transparent 1px);
  background-size: 4px 4px;
}
.pixel {
  position: absolute;
  color: var(--purple);
  font-family: var(--pixel);
  font-size: .68rem;
  opacity: .56;
  text-shadow: 0 0 18px rgba(176,38,255,.9);
  animation: pixelFloat 4.8s ease-in-out infinite;
}
.pixel-a { left: 7vw; top: 8vh; }
.pixel-b { right: 8vw; top: 10vh; animation-delay: .9s; }
.pixel-c { left: 74vw; top: 36vh; color: var(--cyan); animation-delay: 1.7s; }
@keyframes pixelFloat { 0%,100% { transform: translateY(0); opacity:.42 } 50% { transform: translateY(-10px); opacity:.9 } }

.arcade-app {
  width: min(1180px, 100%);
  margin: 0 auto;
  padding: max(12px, env(safe-area-inset-top)) 14px 34px;
}
.arcade-topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 58px;
  padding: 8px 0 10px;
  backdrop-filter: blur(18px);
}
.arcade-topbar::before {
  content: "";
  position: absolute;
  left: -16px;
  right: -16px;
  top: 0;
  bottom: 0;
  background: linear-gradient(180deg, rgba(3,0,6,.98), rgba(3,0,6,.76) 62%, transparent);
  z-index: -1;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  color: #fff;
  text-decoration: none;
  letter-spacing: .05em;
  font-family: var(--display);
  font-weight: 900;
}
.brand-main {
  font-size: 1rem;
  text-shadow: 3px 2px 0 rgba(69,28,196,.9), -1px 0 0 rgba(47,246,255,.8), 1px 0 0 rgba(255,47,174,.65), 0 0 16px rgba(255,255,255,.48);
}
.brand-chip {
  width: 28px;
  height: 12px;
  display: inline-block;
  border-radius: 3px;
  border: 1px solid rgba(255,255,255,.18);
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.9) 0 2px, transparent 2px 4px),
    rgba(47,246,255,.12);
  box-shadow: 0 0 14px rgba(47,246,255,.22);
}
.topbar-action,
.arcade-footer button {
  border: 1px solid rgba(47,246,255,.42);
  background: linear-gradient(180deg, rgba(47,246,255,.14), rgba(141,53,255,.16));
  color: var(--ink);
  border-radius: 999px;
  padding: 10px 13px;
  font-size: .70rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  box-shadow: 0 0 20px rgba(47,246,255,.15);
}

.hero-screen {
  display: grid;
  align-content: start;
  gap: 14px;
  padding: 18px 0 18px;
}
.hero-card {
  position: relative;
  padding: 20px 15px 18px;
  border: 1px solid rgba(197,74,255,.48);
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 50% 10%, rgba(47,246,255,.15), transparent 36%),
    radial-gradient(circle at 84% 24%, rgba(255,47,174,.18), transparent 34%),
    linear-gradient(180deg, rgba(20, 8, 48, .88), rgba(4, 2, 14, .78));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 44px rgba(141,53,255,.32),
    0 22px 80px rgba(0,0,0,.58);
  overflow: hidden;
  isolation: isolate;
}
.hero-card::before {
  content: "";
  position: absolute;
  inset: -1px;
  background:
    linear-gradient(110deg, transparent 0%, rgba(47,246,255,.18) 22%, transparent 44%, rgba(255,47,174,.16) 62%, transparent 86%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 7px);
  opacity: .78;
  pointer-events: none;
  mask-image: linear-gradient(#000, transparent 74%);
  z-index: -1;
}
.hero-card::after {
  content: "";
  position: absolute;
  right: -92px;
  top: 54px;
  width: 188px;
  height: 188px;
  border-radius: 50%;
  background:
    repeating-linear-gradient(0deg, transparent 0 10px, rgba(3,0,6,.7) 10px 16px),
    linear-gradient(180deg, #ffd84d, #ff6d3d 42%, #ff2fae);
  opacity: .28;
  box-shadow: 0 0 64px rgba(255,47,174,.36);
  z-index: -1;
}
.hero-hud {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
  color: rgba(47,246,255,.78);
  font-family: var(--pixel);
  font-size: .48rem;
  line-height: 1.7;
  letter-spacing: .08em;
}
.hero-kicker,
.section-kicker {
  position: relative;
  z-index: 1;
  margin: 0 0 12px;
  color: var(--cyan);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-family: var(--pixel);
  font-size: clamp(.50rem, 2.15vw, .72rem);
  line-height: 1.75;
  text-shadow: 0 0 14px rgba(47,246,255,.85);
}
.arcade-logo {
  position: relative;
  z-index: 1;
  margin: 0;
  line-height: .86;
  letter-spacing: -.055em;
  filter: drop-shadow(0 0 22px rgba(141,53,255,.78));
}
.logo-b,
.logo-a { display: block; }
.logo-b {
  font-family: var(--pixel);
  font-size: clamp(1.8rem, 10.3vw, 4.4rem);
  color: #fff;
  text-shadow: 4px 4px 0 #4b13c9, -2px 0 0 rgba(47,246,255,.75), 2px 0 0 rgba(255,47,174,.6), 0 0 18px rgba(255,255,255,.72);
}
.logo-a {
  font-family: var(--display);
  font-size: clamp(3.05rem, 17vw, 8.6rem);
  font-weight: 900;
  background: linear-gradient(180deg, #fff 0%, #75efff 24%, #8d35ff 56%, #ff2fae 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,.18);
}
.edition {
  position: relative;
  z-index: 1;
  width: fit-content;
  margin: 8px 0 0;
  color: var(--pink);
  font-size: clamp(1.22rem, 6.6vw, 3.4rem);
  font-weight: 900;
  font-style: italic;
  letter-spacing: -.045em;
  transform: rotate(-3deg);
  text-shadow: 0 0 18px rgba(255,47,174,.9), 0 0 42px rgba(255,47,174,.36);
}
.tagline {
  position: relative;
  z-index: 1;
  margin: 26px 0 12px;
  color: var(--cyan);
  font-family: var(--pixel);
  font-size: clamp(.56rem, 2.55vw, .95rem);
  line-height: 1.85;
  text-shadow: 0 0 16px rgba(47,246,255,.78);
}
.hero-copy {
  position: relative;
  z-index: 1;
  max-width: 690px;
  margin: 0;
  color: var(--muted);
  font-size: .94rem;
  line-height: 1.68;
}
.hero-actions {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 11px;
  margin-top: 18px;
}
.quick-steps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.quick-steps article {
  position: relative;
  min-height: 112px;
  padding: 14px 12px;
  border: 1px solid rgba(197,74,255,.34);
  border-radius: 20px;
  background:
    radial-gradient(circle at 22% 16%, rgba(47,246,255,.12), transparent 38%),
    linear-gradient(180deg, rgba(16, 5, 38, .78), rgba(5, 1, 16, .68));
  box-shadow: 0 0 26px rgba(141,53,255,.18), inset 0 0 0 1px rgba(255,255,255,.025);
  overflow: hidden;
}
.quick-steps article::after {
  content: "";
  position: absolute;
  inset: auto -30px -38px auto;
  width: 92px;
  height: 92px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,47,174,.15), transparent 62%);
}
.step-icon,
.boost-icon {
  position: relative;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-bottom: 10px;
  border: 1px solid rgba(47,246,255,.45);
  border-radius: 14px;
  color: var(--cyan);
  background: rgba(47,246,255,.08);
  box-shadow: 0 0 18px rgba(47,246,255,.24), inset 0 0 16px rgba(47,246,255,.06);
  font-family: var(--pixel);
  font-size: .52rem;
  line-height: 1;
}
.step-icon::before,
.boost-icon::before { display: block; text-shadow: 0 0 14px currentColor; }
.icon-qr::before { content: "QR"; }
.icon-play::before { content: "▶"; font-family: var(--display); font-size: .86rem; }
.icon-star::before { content: "★"; font-family: var(--display); font-size: 1.05rem; color: var(--yellow); }
.icon-gift::before { content: "BOX"; font-size: .43rem; color: var(--pink); }
.icon-rocket::before { content: "GO"; color: var(--cyan); }
.quick-steps strong {
  position: relative;
  z-index: 1;
  display: block;
  font-family: var(--display);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .025em;
  font-size: .86rem;
}
.quick-steps small {
  position: relative;
  z-index: 1;
  display: block;
  color: var(--muted);
  line-height: 1.35;
  margin-top: 4px;
  font-size: .78rem;
}

.btn {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 9px;
  min-height: 52px;
  border: 0;
  border-radius: 16px;
  padding: 14px 18px;
  color: #fff;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .055em;
  text-decoration: none;
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
  user-select: none;
  overflow: hidden;
}
.btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent, rgba(255,255,255,.20), transparent);
  transform: translateX(-120%);
  transition: transform .55s ease;
  pointer-events: none;
}
.btn:hover::after { transform: translateX(120%); }
.btn:active { transform: translateY(2px) scale(.99); }
.btn:focus-visible,
input:focus-visible,
textarea:focus-visible,
button:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
.btn-primary,
.btn-spin {
  width: 100%;
  background: linear-gradient(180deg, #ff78d2 0%, #ff2fae 34%, #a914ff 66%, #5b18c9 100%);
  border: 1px solid rgba(255,255,255,.42);
  box-shadow: 0 0 18px rgba(255,47,174,.72), 0 0 42px rgba(141,53,255,.52), 0 6px 0 rgba(52,10,96,.9);
}
.btn-pulse {
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 10px solid #fff;
  filter: drop-shadow(0 0 8px #fff);
}
.btn-secondary {
  width: 100%;
  background: linear-gradient(180deg, #38f8ff 0%, #593cff 55%, #e123ff 100%);
  border: 1px solid rgba(255,255,255,.32);
  box-shadow: 0 0 20px rgba(47,246,255,.48), 0 0 36px rgba(255,47,174,.32), 0 6px 0 rgba(25,14,92,.9);
}
.btn-soft,
.btn-ghost {
  width: 100%;
  background: rgba(255,255,255,.045);
  border: 1px solid var(--line);
  color: var(--ink);
  box-shadow: 0 0 24px rgba(141,53,255,.16);
}
.btn-spin {
  max-width: 250px;
  min-height: 70px;
  margin: 18px auto 0;
  font-family: var(--pixel);
  font-size: clamp(.88rem, 4.2vw, 1.12rem);
  border-radius: 18px;
  letter-spacing: .08em;
}
.btn[disabled] { opacity: .72; filter: grayscale(.15); cursor: wait; }

.game-screen { padding: 14px 0 28px; }
.machine-wrap { position: relative; }
.slot-shell {
  position: relative;
  padding: 16px 12px 15px;
  border: 1px solid rgba(197,74,255,.56);
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 50% 14%, rgba(47,246,255,.16), transparent 34%),
    radial-gradient(circle at 86% 22%, rgba(255,216,77,.12), transparent 26%),
    linear-gradient(180deg, rgba(24, 8, 54, .96), rgba(3, 1, 12, .94));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.035) inset,
    0 0 46px rgba(141,53,255,.34),
    0 26px 90px rgba(0,0,0,.6);
  overflow: hidden;
}
.slot-shell::before {
  content: "";
  position: absolute;
  inset: 10px;
  border-radius: 22px;
  border: 1px dashed rgba(47,246,255,.18);
  pointer-events: none;
}
.slot-marquee {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin: 0 auto 12px;
  color: rgba(255,255,255,.92);
  font-family: var(--pixel);
  font-size: .58rem;
  line-height: 1.5;
  letter-spacing: .10em;
  text-shadow: 0 0 14px rgba(255,255,255,.56);
}
.slot-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--pink);
  box-shadow: 0 0 12px var(--pink), 0 0 24px rgba(255,47,174,.58);
}
.slot-window {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  max-width: 620px;
  margin: 0 auto;
  padding: 10px;
  border: 1px solid rgba(47,246,255,.58);
  border-radius: 22px;
  background:
    linear-gradient(rgba(0,0,0,.56), rgba(5,0,12,.82)),
    radial-gradient(circle at 50% 50%, rgba(141,53,255,.28), transparent 64%);
  box-shadow: inset 0 0 28px rgba(0,0,0,.85), 0 0 28px rgba(47,246,255,.25), 0 0 46px rgba(141,53,255,.28);
  overflow: hidden;
}
.slot-window::before {
  content: "";
  position: absolute;
  left: 10px;
  right: 10px;
  top: 50%;
  height: clamp(46px, 16vw, 78px);
  transform: translateY(-50%);
  border-top: 1px solid rgba(255,255,255,.16);
  border-bottom: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.035);
  pointer-events: none;
  z-index: 2;
}
.reel {
  position: relative;
  display: grid;
  grid-template-rows: repeat(3, 1fr);
  gap: 7px;
  padding: 7px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(0,0,0,.42));
  border: 1px solid rgba(255,255,255,.10);
  overflow: hidden;
}
.slot-symbol {
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(48px, 15.5vw, 82px);
  border-radius: 13px;
  background:
    radial-gradient(circle at 50% 22%, rgba(255,255,255,.12), transparent 44%),
    rgba(255,255,255,.055);
  box-shadow: inset 0 0 18px rgba(0,0,0,.35), 0 0 18px rgba(141,53,255,.10);
  border: 1px solid rgba(255,255,255,.06);
  color: #fff;
  text-shadow: 0 0 16px currentColor;
}
.slot-symbol::before {
  content: "";
  display: grid;
  place-items: center;
  width: clamp(30px, 9vw, 52px);
  height: clamp(30px, 9vw, 52px);
  border-radius: 12px;
  font-family: var(--display);
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.03em;
}
.sym-star::before { content: "★"; color: var(--yellow); font-size: clamp(1.8rem, 8vw, 3.2rem); }
.sym-heart::before { content: "♥"; color: #ff5ad0; font-size: clamp(1.8rem, 8vw, 3.1rem); }
.sym-bolt::before { content: "⚡"; color: var(--yellow); font-size: clamp(1.8rem, 7.8vw, 3.1rem); }
.sym-qr::before,
.sym-floppy::before,
.sym-rocket::before,
.sym-card::before,
.sym-bottle::before,
.sym-candy::before {
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.25);
  font-family: var(--pixel);
  text-align: center;
}
.sym-qr::before { content: "QR"; color: var(--cyan); font-size: clamp(.62rem, 3vw, .92rem); box-shadow: 0 0 18px rgba(47,246,255,.2); }
.sym-floppy::before { content: "04"; color: #fff; font-size: clamp(.58rem, 2.8vw, .82rem); box-shadow: 0 0 18px rgba(255,255,255,.18); }
.sym-rocket::before { content: "GO"; color: var(--green); font-size: clamp(.58rem, 2.8vw, .82rem); box-shadow: 0 0 18px rgba(167,255,71,.18); }
.sym-card::before { content: "CARD"; color: #ff9ff0; font-size: clamp(.38rem, 1.9vw, .58rem); box-shadow: 0 0 18px rgba(255,47,174,.18); }
.sym-bottle::before { content: "BRC"; color: var(--cyan); font-size: clamp(.44rem, 2.15vw, .64rem); box-shadow: 0 0 18px rgba(47,246,255,.18); }
.sym-candy::before { content: "YUM"; color: #ffd84d; font-size: clamp(.46rem, 2.2vw, .66rem); box-shadow: 0 0 18px rgba(255,216,77,.18); }
.slot-window.is-spinning .slot-symbol { animation: flickerSymbol .16s linear infinite; }
.slot-window.is-spinning .reel:nth-child(2) .slot-symbol { animation-duration: .12s; }
.slot-window.is-spinning .reel:nth-child(3) .slot-symbol { animation-duration: .1s; }
@keyframes flickerSymbol { 0%{ transform: translateY(-4px); filter: blur(.8px); } 100%{ transform: translateY(5px); filter: blur(1px); } }
.slot-note {
  position: relative;
  z-index: 1;
  margin: 14px auto 0;
  max-width: 560px;
  color: var(--soft);
  font-size: .78rem;
  line-height: 1.5;
  text-align: center;
}
.machine-lever { display: none; }

.result-screen { padding: 8px 0 28px; }
.result-card,
.boost-card {
  position: relative;
  border: 1px solid rgba(255,47,174,.56);
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 50% 14%, rgba(255,47,174,.22), transparent 34%),
    radial-gradient(circle at 86% 6%, rgba(255,216,77,.12), transparent 25%),
    linear-gradient(180deg, rgba(21, 8, 52, .96), rgba(4, 1, 15, .94));
  box-shadow: 0 0 0 1px rgba(255,255,255,.035) inset, 0 0 46px rgba(255,47,174,.3), 0 24px 80px rgba(0,0,0,.58);
  overflow: hidden;
}
.result-card { padding: 23px 15px 18px; }
.result-card::before,
.boost-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.028) 0 1px, transparent 1px 8px);
  pointer-events: none;
  opacity: .6;
}
.result-burst {
  position: absolute;
  width: 190px;
  height: 190px;
  right: -68px;
  top: -58px;
  border-radius: 999px;
  background: repeating-conic-gradient(from 0deg, rgba(255,216,77,.30) 0 8deg, transparent 8deg 16deg);
  filter: blur(.2px);
  opacity: .76;
}
.result-eyebrow {
  position: relative;
  z-index: 1;
  margin: 0 0 10px;
  font-family: var(--pixel);
  color: var(--yellow);
  font-size: .66rem;
  line-height: 1.8;
  text-shadow: 0 0 16px rgba(255,216,77,.85);
}
.result-card h2,
.boost-card h2,
.modal-panel h2 {
  position: relative;
  z-index: 1;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(1.35rem, 6.15vw, 3rem);
  line-height: 1.08;
  letter-spacing: -.045em;
}
.result-card p,
.boost-card p,
.modal-panel p { position: relative; z-index: 1; color: var(--muted); line-height: 1.62; }
.claim-form,
.boost-form { position: relative; z-index: 1; display: grid; gap: 12px; margin-top: 18px; }
.field-grid { display: grid; gap: 12px; }
label { display: grid; gap: 7px; color: rgba(251,247,255,.87); font-size: .84rem; font-weight: 800; }
input,
textarea {
  width: 100%;
  border: 1px solid rgba(197,74,255,.44);
  border-radius: 14px;
  background: rgba(0,0,0,.42);
  color: var(--ink);
  min-height: 50px;
  padding: 13px 13px;
  box-shadow: inset 0 0 18px rgba(0,0,0,.34), 0 0 18px rgba(141,53,255,.08);
}
textarea { min-height: 116px; resize: vertical; }
input::placeholder,
textarea::placeholder { color: rgba(251,247,255,.38); }
.check {
  grid-template-columns: 18px 1fr;
  align-items: start;
  gap: 10px;
  font-weight: 600;
  color: var(--muted);
  line-height: 1.45;
}
.check input { width: 18px; height: 18px; min-height: 18px; margin-top: 2px; accent-color: var(--pink); }
.check a { color: var(--cyan); font-weight: 900; }
.code-box {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 8px;
  margin-top: 18px;
  padding: 16px 12px;
  border-radius: 18px;
  border: 1px solid rgba(47,246,255,.50);
  background: rgba(0,0,0,.38);
  box-shadow: 0 0 28px rgba(47,246,255,.16);
  text-align: center;
}
.code-box span { color: var(--muted); font-size: .70rem; text-transform: uppercase; letter-spacing: .12em; }
.code-box strong {
  color: var(--cyan);
  font-family: var(--display);
  font-size: clamp(.98rem, 4.75vw, 2rem);
  letter-spacing: .01em;
  text-shadow: 0 0 16px rgba(47,246,255,.72);
  white-space: nowrap;
  overflow-x: auto;
  max-width: 100%;
  padding-bottom: 2px;
}
.code-box small { color: var(--muted); line-height: 1.45; }
.boost-card { margin-top: 8px; padding: 20px 15px; }
.boost-head { position: relative; z-index: 1; display: grid; gap: 12px; }
.boost-icon {
  width: 58px;
  height: 58px;
  margin: 0;
  font-size: .58rem;
  border-color: rgba(47,246,255,.42);
  border-radius: 19px;
  background: rgba(47,246,255,.09);
}
.legal-note { margin: 0; font-size: .76rem; color: var(--soft) !important; }
.form-message { min-height: 22px; margin-top: 12px; color: var(--cyan); font-weight: 800; position: relative; z-index: 1; }

.arcade-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin: 24px 0 0;
  padding: 18px 0 max(10px, env(safe-area-inset-bottom));
  color: var(--soft);
  font-size: .80rem;
}
.arcade-footer a,
.arcade-footer button { color: var(--muted); text-decoration: none; }
.arcade-footer button { min-height: auto; padding: 0; border: 0; background: transparent; box-shadow: none; text-transform: none; letter-spacing: 0; font-weight: 700; }

.toast {
  position: fixed;
  left: 14px;
  right: 14px;
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 110;
  transform: translateY(120%);
  opacity: 0;
  padding: 14px 16px;
  border: 1px solid rgba(47,246,255,.42);
  border-radius: 18px;
  background: rgba(7, 3, 20, .95);
  box-shadow: 0 0 32px rgba(47,246,255,.22);
  color: var(--ink);
  font-weight: 800;
  transition: .24s ease;
}
.toast.is-visible { transform: translateY(0); opacity: 1; }

.modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: end center;
  padding: 18px 12px max(14px, env(safe-area-inset-bottom));
}
.modal[hidden] { display: none; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.76); backdrop-filter: blur(10px); }
.modal-panel {
  position: relative;
  width: min(720px, 100%);
  max-height: min(82svh, 760px);
  overflow: auto;
  padding: 22px 15px;
  border: 1px solid rgba(197,74,255,.54);
  border-radius: 26px;
  background:
    radial-gradient(circle at 20% 0%, rgba(47,246,255,.14), transparent 36%),
    radial-gradient(circle at 86% 10%, rgba(255,47,174,.16), transparent 32%),
    linear-gradient(180deg, rgba(17, 8, 44, .98), rgba(4, 1, 13, .98));
  box-shadow: 0 0 56px rgba(141,53,255,.35), 0 28px 110px rgba(0,0,0,.72);
}
.modal-close {
  position: sticky;
  top: 0;
  margin-left: auto;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 14px;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 1.6rem;
  line-height: 1;
  z-index: 2;
}
.modal-steps { display: grid; gap: 10px; margin: 18px 0; }
.modal-steps article {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(197,74,255,.30);
  border-radius: 18px;
  background: rgba(255,255,255,.035);
}
.modal-steps span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid rgba(47,246,255,.42);
  color: var(--cyan);
  font-family: var(--pixel);
  font-size: .54rem;
  background: rgba(47,246,255,.08);
}
.modal-steps h3 { margin: 0 0 3px; font-family: var(--display); text-transform: uppercase; font-size: .92rem; letter-spacing: .02em; }
.modal-steps p { margin: 0; font-size: .88rem; }
.modal-note {
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(255,216,77,.35);
  background: rgba(255,216,77,.08);
  color: rgba(251,247,255,.78);
  line-height: 1.55;
}
.modal-note strong { color: var(--yellow); }

@media (max-width: 380px) {
  .arcade-app { padding-left: 10px; padding-right: 10px; }
  .hero-card,
  .result-card,
  .boost-card { border-radius: 24px; }
  .topbar-action { font-size: .62rem; padding: 9px 10px; }
  .brand-main { font-size: .9rem; }
  .slot-window { gap: 6px; padding: 8px; }
  .reel { gap: 6px; padding: 6px; }
  .slot-symbol { min-height: 44px; border-radius: 11px; }
  .quick-steps article { min-height: 104px; padding: 12px 10px; }
  .quick-steps strong { font-size: .76rem; }
  .quick-steps small { font-size: .72rem; }
}
@media (min-width: 560px) {
  .arcade-app { padding-left: 20px; padding-right: 20px; }
  .hero-actions { grid-template-columns: minmax(180px, 280px) minmax(160px, 220px); }
  .quick-steps { grid-template-columns: repeat(4, 1fr); }
  .field-grid { grid-template-columns: 1fr 1fr; }
  .code-box strong { font-size: clamp(1.28rem, 4vw, 2rem); }
}
@media (min-width: 860px) {
  .arcade-app { padding-top: 18px; }
  .arcade-topbar { min-height: 68px; }
  .hero-screen { grid-template-columns: 1.25fr .75fr; align-items: center; gap: 20px; min-height: auto; padding: 78px 0 36px; }
  .hero-card { min-height: 570px; display: flex; flex-direction: column; justify-content: center; padding: 40px; }
  .quick-steps { grid-template-columns: 1fr; align-self: stretch; }
  .quick-steps article { min-height: 0; display: grid; align-content: center; }
  .game-screen { padding: 22px 0 34px; }
  .slot-shell { padding: 28px; }
  .slot-window { gap: 12px; padding: 16px; border-radius: 28px; }
  .reel { padding: 12px; gap: 12px; border-radius: 20px; }
  .slot-symbol { min-height: 82px; }
  .machine-lever {
    display: block;
    position: absolute;
    right: -8px;
    top: 50%;
    transform: translateY(-50%);
    width: 58px;
    height: 190px;
    border-radius: 999px;
    border: 1px solid rgba(255,47,174,.46);
    background: linear-gradient(180deg, rgba(255,47,174,.28), rgba(141,53,255,.22));
    box-shadow: 0 0 28px rgba(255,47,174,.24);
  }
  .machine-lever span {
    position: absolute;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--pink);
    box-shadow: 0 0 24px var(--pink);
  }
  .result-card { padding: 30px; }
  .boost-card { padding: 28px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 24px; align-items: start; }
  .boost-head { align-content: start; }
  .modal { place-items: center; padding: 24px; }
  .modal-panel { padding: 32px; border-radius: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* === BRC04 Arcade v0.4.1 — mobile/responsive repair === */
.game-screen { padding-top: 18px; }
.machine-wrap { max-width: 660px; margin: 0 auto; }
.slot-shell { padding-left: clamp(12px, 4vw, 28px); padding-right: clamp(12px, 4vw, 28px); }
.slot-controls { position: relative; z-index: 5; display: flex; justify-content: center; align-items: center; width: 100%; }
.btn-spin { display: flex !important; align-items: center; justify-content: center; text-align: center; width: min(100%, 292px) !important; max-width: 292px; margin: 18px auto 0 !important; padding-inline: 18px; line-height: 1.2; }
.slot-window { align-items: stretch; }
.reel { min-width: 0; }
.slot-symbol { aspect-ratio: 1.35 / 1; min-width: 0; }
.slot-symbol::before { max-width: 100%; max-height: 100%; }
.modal { padding: 10px; align-items: end; }
.modal-panel { width: min(100%, 720px); max-height: min(88svh, 760px); padding: 18px 14px 16px; overflow-x: hidden; }
.modal-panel h2 { font-size: clamp(1.35rem, 6.4vw, 2.35rem); line-height: 1.08; letter-spacing: -.035em; }
.modal-steps { display: grid; grid-template-columns: 1fr; gap: 10px; }
.modal-steps article { grid-template-columns: 46px minmax(0, 1fr); align-items: start; gap: 12px; padding: 13px; }
.modal-steps article > * { min-width: 0; }
.modal-steps h3 { font-size: clamp(.86rem, 3.9vw, 1.05rem); line-height: 1.15; overflow-wrap: normal; word-break: normal; hyphens: none; }
.modal-steps p { font-size: clamp(.86rem, 3.6vw, .96rem); line-height: 1.55; overflow-wrap: normal; word-break: normal; hyphens: none; }
.modal-steps span { width: 40px; height: 40px; flex: none; }
.quick-steps article { overflow-wrap: normal; word-break: normal; }
.boost-form label, .claim-form label { min-width: 0; }
.code-box strong { white-space: normal; word-break: break-word; }
@media (max-width: 380px) {
  .slot-window { gap: 7px; padding: 8px; }
  .reel { gap: 6px; padding: 6px; }
  .slot-symbol { min-height: 42px; }
  .btn-spin { width: min(92%, 270px) !important; min-height: 68px; }
  .modal-panel { padding: 16px 12px 14px; }
  .modal-steps article { grid-template-columns: 42px minmax(0, 1fr); gap: 10px; padding: 12px; }
  .modal-steps span { width: 38px; height: 38px; font-size: .50rem; }
}
@media (min-width: 560px) {
  .btn-spin { width: 292px !important; }
  .modal { place-items: center; padding: 22px; }
  .modal-panel { padding: 28px; }
}

/* === BRC04 Arcade v0.5 — modal result flow + mobile stability === */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overscroll-behavior-x: none;
}
@supports (overflow: clip) {
  html,
  body { overflow-x: clip; }
}
body { touch-action: pan-y; }
.brc-bg,
.arcade-app,
.hero-screen,
.game-screen,
.machine-wrap,
.slot-shell,
.slot-window,
.modal,
.modal-panel { max-width: 100%; }
.arcade-app { overflow-x: hidden; }
.bg-grid { pointer-events: none; }

.result-screen,
#result,
#boost { display: none !important; }
.game-screen { padding-bottom: 14px; }
.machine-wrap { overflow: visible; }
.slot-shell { overflow: hidden; }
.slot-controls { display: flex; justify-content: center; align-items: center; width: 100%; }
.btn-spin {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: min(92%, 292px) !important;
  max-width: 292px !important;
  margin: 18px auto 0 !important;
  padding-inline: 18px !important;
}

.modal { width: 100%; max-width: 100dvw; overflow: hidden; }
.modal-panel {
  max-width: min(720px, calc(100dvw - 24px));
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}
.modal-panel > * { min-width: 0; }
.modal-close { z-index: 10; }
.modal-steps article {
  grid-template-columns: 44px minmax(0, 1fr) !important;
  align-items: start;
}
.modal-steps article > div { min-width: 0; }
.modal-steps h3,
.modal-steps p {
  grid-column: auto !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}
.modal-steps p { max-width: 100%; }

.modal-result-panel,
.modal-boost-panel {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  max-height: min(90svh, 820px);
}
.modal-result-panel .modal-close,
.modal-boost-panel .modal-close {
  position: sticky;
  top: 10px;
  right: 10px;
  float: right;
  margin: 10px 10px -52px auto;
  background: rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
}
.result-card-modal,
.boost-card-modal {
  width: 100%;
  margin: 0;
  padding: 24px 15px 18px;
}
.result-card-modal { padding-top: 62px; }
.boost-card-modal { display: block; }
.result-actions {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.result-visual {
  position: relative;
  z-index: 1;
  width: min(170px, 44vw);
  height: min(170px, 44vw);
  margin: 0 auto 16px;
  display: grid;
  place-items: center;
  border-radius: 34px;
  border: 1px solid rgba(47,246,255,.46);
  background:
    radial-gradient(circle at 50% 45%, rgba(47,246,255,.24), transparent 48%),
    radial-gradient(circle at 50% 50%, rgba(255,47,174,.18), transparent 62%),
    rgba(0,0,0,.28);
  box-shadow: 0 0 34px rgba(47,246,255,.18), inset 0 0 26px rgba(255,255,255,.04);
  overflow: hidden;
}
.result-visual::before {
  content: "";
  position: absolute;
  inset: -22%;
  background: repeating-conic-gradient(from 0deg, rgba(255,216,77,.28) 0 8deg, transparent 8deg 18deg);
  opacity: .6;
  animation: resultSpin 8s linear infinite;
}
.result-visual::after {
  content: "";
  position: absolute;
  inset: 16px;
  border-radius: 26px;
  background: radial-gradient(circle at 50% 35%, rgba(255,255,255,.10), transparent 42%), rgba(3,0,6,.55);
  border: 1px solid rgba(255,255,255,.12);
}
.result-visual span {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  min-width: 74px;
  min-height: 74px;
  padding: 12px;
  border-radius: 22px;
  font-family: var(--pixel);
  font-size: clamp(.54rem, 3vw, .82rem);
  line-height: 1.35;
  color: #fff;
  text-align: center;
  background: rgba(0,0,0,.32);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 0 22px rgba(47,246,255,.20);
}
.prize-bottle span {
  width: 58px;
  height: 104px;
  border-radius: 18px 18px 20px 20px;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  background: linear-gradient(180deg, #fefefe, #15101d 15%, #05020b 88%, #d8d8d8);
  color: #fff;
  letter-spacing: .06em;
}
.prize-bottle span::before {
  content: "";
  position: absolute;
  top: -15px;
  left: 50%;
  width: 30px;
  height: 18px;
  transform: translateX(-50%);
  border-radius: 8px 8px 4px 4px;
  background: #d8d8d8;
}
.prize-card span {
  width: 106px;
  height: 68px;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(47,246,255,.95), rgba(141,53,255,.92), rgba(255,47,174,.9));
  box-shadow: 0 0 24px rgba(255,47,174,.35);
}
.prize-candy span {
  width: 102px;
  height: 50px;
  border-radius: 999px;
  background: linear-gradient(90deg, #ffd84d, #ff477e, #ff2fae);
  color: #fff;
}
.prize-candy span::before,
.prize-candy span::after {
  content: "";
  position: absolute;
  width: 25px;
  height: 42px;
  background: #ff8cd9;
  clip-path: polygon(0 50%, 100% 0, 100% 100%);
}
.prize-candy span::before { left: -23px; transform: rotate(180deg); }
.prize-candy span::after { right: -23px; }
.prize-lost span,
.prize-mystery span,
.prize-gift span {
  width: 92px;
  height: 92px;
  border-radius: 26px;
  background: linear-gradient(180deg, rgba(47,246,255,.24), rgba(255,47,174,.20));
  color: var(--cyan);
}
.prize-gift span::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 10px;
  border: 3px solid var(--pink);
  box-shadow: 0 0 16px rgba(255,47,174,.35);
}
@keyframes resultSpin { to { transform: rotate(360deg); } }

.modal-result-panel .result-eyebrow { text-align: center; }
.modal-result-panel h2 { text-align: center; }
.modal-result-panel #resultText { text-align: center; }
.modal-result-panel .claim-form,
.modal-result-panel .code-box { margin-left: auto; margin-right: auto; max-width: 520px; }
.modal-result-panel .code-box strong { white-space: normal; word-break: break-word; }
.modal-boost-panel .boost-card { box-shadow: 0 0 0 1px rgba(255,255,255,.035) inset, 0 0 46px rgba(47,246,255,.22), 0 24px 80px rgba(0,0,0,.58); }

@media (max-width: 380px) {
  .modal-panel { max-width: calc(100dvw - 16px); }
  .modal-result-panel .modal-close,
  .modal-boost-panel .modal-close { margin-top: 8px; margin-right: 8px; }
  .result-card-modal { padding-left: 12px; padding-right: 12px; }
  .result-visual { width: 142px; height: 142px; }
  .result-actions .btn { min-height: 50px; font-size: .78rem; }
  .modal-steps article { grid-template-columns: 40px minmax(0, 1fr) !important; gap: 10px; }
  .modal-steps span { width: 38px; height: 38px; }
}
@media (min-width: 560px) {
  .result-actions { grid-template-columns: 1fr 1fr; }
  .modal-result-panel,
  .modal-boost-panel { max-width: min(760px, calc(100dvw - 44px)); }
  .result-card-modal,
  .boost-card-modal { padding: 34px; padding-top: 72px; }
}
@media (min-width: 860px) {
  .modal-result-panel,
  .modal-boost-panel { max-width: 780px; }
  .boost-card-modal { display: block !important; }
  .boost-form { grid-template-columns: 1fr 1fr; }
  .boost-form label:nth-child(5),
  .boost-form .check,
  .boost-form .btn,
  .boost-form .legal-note { grid-column: 1 / -1; }
  .machine-lever { right: 0; }
}

/* === BRC04 Arcade v0.5.1 — visual polish & mobile fixes === */
html,body{max-width:100%;overflow-x:hidden}body{overflow-x:clip;touch-action:pan-y}.arcade-app,.hero-screen,.game-screen,.modal,.modal-panel,.slot-shell,.slot-window{max-width:100%}
.modal-open{overflow:hidden}
.check{display:flex;align-items:flex-start;gap:14px}.check input{margin-top:.3rem;flex:0 0 auto}.check span{display:block;line-height:1.55}
.modal-result-panel{max-width:560px}.result-card-modal{position:relative;overflow:hidden;padding:22px 18px 18px;text-align:center}.result-card-modal::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top,rgba(41,244,255,.10),transparent 34%),radial-gradient(circle at 50% 20%,rgba(255,47,174,.18),transparent 40%);pointer-events:none}.result-card.is-win{box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 0 34px rgba(255,47,174,.35),0 0 54px rgba(41,244,255,.18)}.result-card.is-loss{box-shadow:0 0 0 1px rgba(255,255,255,.06) inset,0 0 24px rgba(139,53,255,.24)}
.result-burst{position:absolute;inset:-16% -10% auto;height:280px;background:radial-gradient(circle,rgba(255,255,255,.12) 0,rgba(255,255,255,0) 55%);opacity:.28;pointer-events:none}.result-card.is-win .result-burst{animation:burstPulse 1.7s ease-in-out infinite alternate}.result-card.is-loss .result-burst{opacity:.12}
.result-confetti{position:absolute;inset:0;pointer-events:none;opacity:0}.result-card.is-win .result-confetti{opacity:1}.result-confetti span{position:absolute;width:10px;height:18px;border-radius:3px;background:linear-gradient(180deg,var(--cyan),var(--pink));animation:confettiFall 1.8s linear infinite}.result-confetti span:nth-child(1){left:8%;top:8%;animation-delay:.05s}.result-confetti span:nth-child(2){left:22%;top:0%;background:linear-gradient(180deg,var(--yellow),var(--pink));animation-delay:.2s}.result-confetti span:nth-child(3){right:18%;top:6%;background:linear-gradient(180deg,var(--cyan),var(--violet));animation-delay:.4s}.result-confetti span:nth-child(4){right:7%;top:12%;background:linear-gradient(180deg,var(--pink),var(--yellow));animation-delay:.12s}.result-confetti span:nth-child(5){left:36%;top:3%;background:linear-gradient(180deg,var(--green),var(--cyan));animation-delay:.32s}.result-confetti span:nth-child(6){right:34%;top:9%;background:linear-gradient(180deg,var(--violet),var(--pink));animation-delay:.48s}
.result-visual{position:relative;display:grid;place-items:center;width:154px;height:154px;margin:8px auto 16px;border-radius:34px;background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.18),transparent 38%),linear-gradient(180deg,rgba(29,15,64,.96),rgba(9,3,22,.96));border:1px solid rgba(255,255,255,.12);box-shadow:0 0 26px rgba(139,53,255,.34),inset 0 0 18px rgba(255,255,255,.05)}.result-visual span{position:relative;z-index:2;font-family:var(--display);font-weight:900;letter-spacing:.08em}.result-eyebrow{margin:0 0 8px;font-family:var(--pixel);font-size:.68rem;line-height:1.7;color:#fff4ce;text-shadow:0 0 12px rgba(255,216,77,.5)}.result-card h2{margin:0 0 10px;font-family:var(--display);font-size:clamp(1.55rem,6vw,2.3rem);line-height:1.02;text-wrap:balance}.result-card p{margin:0 auto;max-width:40ch;color:var(--muted);line-height:1.62}
.result-visual::before,.result-visual::after{content:"";position:absolute}
.result-visual.prize-bottle::before{width:54px;height:98px;border-radius:16px 16px 20px 20px;background:linear-gradient(180deg,#2f213d 0%,#100a16 100%);box-shadow:0 0 0 2px rgba(255,255,255,.08) inset,0 0 22px rgba(255,47,174,.18)}.result-visual.prize-bottle::after{width:26px;height:20px;top:18px;border-radius:8px 8px 4px 4px;background:linear-gradient(180deg,#2f213d 0%,#100a16 100%)}.result-visual.prize-bottle span{top:14px;font-size:.9rem;color:#fff;writing-mode:vertical-rl;transform:rotate(180deg)}
.result-visual.prize-card::before{width:110px;height:72px;border-radius:18px;background:linear-gradient(135deg,#1c1632 0%,#2f2759 45%,#120b20 100%);box-shadow:0 0 0 2px rgba(255,255,255,.08) inset,0 0 22px rgba(41,244,255,.22)}.result-visual.prize-card::after{width:36px;height:6px;left:50%;top:50%;transform:translate(-50%,-50%);background:linear-gradient(90deg,var(--cyan),var(--pink));border-radius:999px;box-shadow:0 -16px 0 rgba(255,255,255,.08),0 16px 0 rgba(255,255,255,.08)}.result-visual.prize-card span{font-size:1rem;color:#fff;transform:translateY(42px)}
.result-visual.prize-candy::before{width:90px;height:52px;border-radius:22px;background:linear-gradient(135deg,#ff78d2,#9b2cff);box-shadow:0 0 22px rgba(255,47,174,.26)}.result-visual.prize-candy::after{width:118px;height:52px;background:linear-gradient(90deg,transparent 0 8%,rgba(255,255,255,.26) 8% 15%,transparent 15% 85%,rgba(255,255,255,.26) 85% 92%,transparent 92%);clip-path:polygon(0 50%,13% 0,22% 50%,13% 100%,0 50%,100% 50%,87% 0,78% 50%,87% 100%,100% 50%)}.result-visual.prize-candy span{font-size:1rem;color:#fff;text-shadow:0 0 12px rgba(255,255,255,.4)}
.result-visual.prize-gift::before{width:92px;height:84px;border-radius:18px;background:linear-gradient(135deg,#8b35ff,#ff2fae);box-shadow:0 0 22px rgba(139,53,255,.26)}.result-visual.prize-gift::after{width:92px;height:84px;background:linear-gradient(90deg,transparent 45%,rgba(255,255,255,.38) 45% 55%,transparent 55%),linear-gradient(transparent 45%,rgba(255,255,255,.38) 45% 55%,transparent 55%)}.result-visual.prize-gift span{font-size:.98rem;color:#fff}
.result-visual.prize-lost::before{width:88px;height:88px;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.12),transparent 38%),linear-gradient(135deg,#1a1231,#0b0617);box-shadow:0 0 22px rgba(139,53,255,.28)}.result-visual.prize-lost::after{width:64px;height:64px;background:linear-gradient(180deg,var(--cyan),var(--violet));clip-path:polygon(50% 0,67% 24%,61% 40%,76% 60%,56% 62%,49% 100%,36% 68%,18% 67%,33% 44%,26% 22%);filter:drop-shadow(0 0 10px rgba(41,244,255,.5))}.result-visual.prize-lost span{transform:translateY(54px);font-size:.82rem;color:#d9faff}
.result-actions{display:grid;gap:10px;margin-top:16px}.result-card.is-loss #claimForm,.result-card.is-loss #codeBox{display:none!important}.result-card.is-win #claimForm,.result-card.is-win #codeBox{margin-top:16px}.result-card.is-code-ready .code-box{animation:codeFlash .9s ease}.field-grid{display:grid;gap:12px}.claim-form,.boost-form{display:grid;gap:14px;text-align:left}.claim-form label,.boost-form label{display:grid;gap:7px;font-weight:700;color:#fff}.claim-form input,.boost-form input,.boost-form textarea{width:100%;border:1px solid var(--line);background:rgba(0,0,0,.28);color:var(--ink);border-radius:14px;padding:14px 15px}.claim-form input::placeholder,.boost-form input::placeholder,.boost-form textarea::placeholder{color:rgba(250,244,255,.44)}.code-box{margin-top:16px}.code-box strong{display:block;padding:.1em 0}.form-message{margin-top:14px;min-height:24px;color:#bffaff}.legal-note{margin:0;color:var(--muted);font-size:.9rem;line-height:1.55}.boost-card-modal{position:relative}
@media(min-width:700px){.field-grid{grid-template-columns:1fr 1fr}.result-actions{grid-template-columns:1fr 1fr}.modal-result-panel{max-width:610px}}
@media(max-width:560px){.modal-panel{width:min(100%,calc(100vw - 18px));padding:18px 14px;border-radius:22px;max-height:calc(100dvh - 18px)}.modal{padding:9px}.result-card-modal{padding:18px 14px 14px}.result-visual{width:132px;height:132px;border-radius:28px}.result-card h2{font-size:1.6rem}.result-card p{font-size:.96rem}.result-actions{grid-template-columns:1fr}.check{gap:12px}.field-grid{grid-template-columns:1fr}.boost-form,.claim-form{gap:12px}}
@keyframes confettiFall{0%{transform:translateY(-8px) rotate(0deg);opacity:0}10%{opacity:1}100%{transform:translateY(150px) rotate(220deg);opacity:0}}@keyframes burstPulse{0%{transform:scale(.92);opacity:.22}100%{transform:scale(1.06);opacity:.38}}@keyframes codeFlash{0%{transform:scale(.98);box-shadow:0 0 0 rgba(41,244,255,0)}50%{transform:scale(1.01);box-shadow:0 0 26px rgba(41,244,255,.22)}100%{transform:scale(1)}}

/* === BRC04 Arcade v0.5.2 — iPhone/Safari modal & checkbox hardening === */
html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}
html.modal-lock,
html.modal-lock body {
  overscroll-behavior: none !important;
}
body.modal-open {
  overflow: hidden !important;
  touch-action: none !important;
}
.arcade-app,
.brc-bg,
.hero-screen,
.game-screen,
.quick-steps,
.slot-shell,
.slot-window,
.modal,
.modal-panel,
.result-card,
.boost-card {
  max-width: 100% !important;
}
.modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  width: 100dvw !important;
  height: calc(var(--app-vh, 1vh) * 100) !important;
  max-width: 100vw !important;
  overflow: hidden !important;
  padding: max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom)) !important;
}
.modal[hidden] {
  display: none !important;
}
.modal-backdrop {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  touch-action: none !important;
}
.modal-panel {
  position: relative !important;
  width: min(720px, calc(100vw - 20px)) !important;
  max-width: calc(100vw - 20px) !important;
  max-height: calc((var(--app-vh, 1vh) * 100) - max(24px, env(safe-area-inset-top)) - max(24px, env(safe-area-inset-bottom))) !important;
  margin: 0 auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  transform: translateZ(0) !important;
  scrollbar-width: thin;
}
.modal-panel:focus {
  outline: none !important;
}
.modal-close {
  position: sticky !important;
  top: 0 !important;
  right: 0 !important;
  margin-left: auto !important;
  flex: 0 0 auto !important;
  z-index: 20 !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  line-height: 1 !important;
}
.modal-boost-panel,
.modal-result-panel {
  width: min(620px, calc(100vw - 20px)) !important;
  max-width: calc(100vw - 20px) !important;
}
.modal-panel *,
.result-card *,
.boost-card * {
  max-width: 100%;
}
/* Checkbox compatibile iPhone vecchi/nuovi: evita ingrandimento da input globali */
label.check,
.claim-form label.check,
.boost-form label.check {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  align-items: start !important;
  column-gap: 14px !important;
  row-gap: 0 !important;
  width: 100% !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  font-size: .94rem !important;
  line-height: 1.48 !important;
  text-align: left !important;
}
label.check input[type="checkbox"],
.claim-form label.check input[type="checkbox"],
.boost-form label.check input[type="checkbox"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  display: block !important;
  position: relative !important;
  grid-column: 1 !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  min-height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
  padding: 0 !important;
  margin: 1px 0 0 !important;
  border: 2px solid rgba(255,255,255,.72) !important;
  border-radius: 7px !important;
  background: rgba(3,0,6,.82) !important;
  box-shadow: 0 0 0 1px rgba(255,47,174,.10), 0 0 12px rgba(47,246,255,.10) !important;
  flex: 0 0 22px !important;
  overflow: hidden !important;
}
label.check input[type="checkbox"]::after,
.claim-form label.check input[type="checkbox"]::after,
.boost-form label.check input[type="checkbox"]::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 6px;
  height: 12px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg) scale(0);
  transform-origin: center;
  transition: transform .12s ease;
}
label.check input[type="checkbox"]:checked,
.claim-form label.check input[type="checkbox"]:checked,
.boost-form label.check input[type="checkbox"]:checked {
  border-color: rgba(255,255,255,.95) !important;
  background: linear-gradient(135deg, var(--cyan), var(--pink)) !important;
  box-shadow: 0 0 18px rgba(47,246,255,.30), 0 0 18px rgba(255,47,174,.24) !important;
}
label.check input[type="checkbox"]:checked::after,
.claim-form label.check input[type="checkbox"]:checked::after,
.boost-form label.check input[type="checkbox"]:checked::after {
  transform: rotate(45deg) scale(1);
}
label.check span,
.claim-form label.check span,
.boost-form label.check span {
  display: block !important;
  grid-column: 2 !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  color: inherit !important;
  line-height: 1.48 !important;
  overflow-wrap: anywhere !important;
}
label.check a {
  display: inline !important;
  color: var(--cyan) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
}
@media (max-width: 560px) {
  .modal {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  .modal-panel,
  .modal-boost-panel,
  .modal-result-panel {
    width: calc(100vw - 16px) !important;
    max-width: calc(100vw - 16px) !important;
    max-height: calc((var(--app-vh, 1vh) * 100) - 20px) !important;
    border-radius: 22px !important;
  }
  .boost-card-modal,
  .result-card-modal {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  label.check,
  .claim-form label.check,
  .boost-form label.check {
    grid-template-columns: 22px minmax(0, 1fr) !important;
    column-gap: 12px !important;
    font-size: .92rem !important;
  }
  label.check input[type="checkbox"],
  .claim-form label.check input[type="checkbox"],
  .boost-form label.check input[type="checkbox"] {
    width: 21px !important;
    height: 21px !important;
    min-width: 21px !important;
    min-height: 21px !important;
    max-width: 21px !important;
    max-height: 21px !important;
  }
}
@supports not (height: 100dvh) {
  .modal {
    height: calc(var(--app-vh, 1vh) * 100) !important;
  }
}