.zombs { margin: 28px auto 0; max-width: 900px; }
.zombs-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.zombs-eyebrow { margin: 0 0 4px; color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .15em; }
.zombs-header h2 { margin: 0; font-size: 36px; letter-spacing: -.04em; }
.zombs-counter { display: flex; align-items: center; gap: 10px; font-weight: 800; font-variant-numeric: tabular-nums; }
.zombs-counter img { object-fit: contain; }
.zombs-instructions { color: var(--muted); font-size: 14px; line-height: 1.6; }
.zombs-arena { position: relative; overflow: hidden; background: #111d20; border: 1px solid #31484b; border-radius: 16px; }
.zombs-arena canvas { display: block; width: 100%; height: auto; touch-action: none; }
.zombs-arena--running canvas { cursor: none; }
.zombs-arena canvas:focus-visible { outline: 3px solid #bbec8c; outline-offset: -3px; }
.zombs-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 20px; background: rgb(11 22 25 / 90%); color: #f4f7f2; text-align: center; }
.zombs-arena--ready .zombs-overlay { pointer-events: none; }
.zombs-portrait { object-fit: contain; filter: drop-shadow(0 5px 12px rgb(0 0 0 / 40%)); }
.zombs-overlay h3 { margin: 0; font-size: clamp(20px, 4vw, 32px); }
.zombs-overlay p { margin: 0; max-width: 400px; color: #b9cbc9; font-size: 14px; line-height: 1.5; }
.zombs-overlay .kyc-start-button { background: #b8ed84; color: #14211b; }
.zombs-overlay .kyc-start-button:hover { background: #d5ffad; }
.zombs-overlay .kyc-start-button:focus-visible { outline-color: #d5ffad; }
@media (max-width: 600px) {
  .zombs-header h2 { font-size: 28px; }
  .zombs-counter { font-size: 14px; }
  .zombs-overlay { gap: 12px; }
}