:root {
  --cor: #e11d48;
  --cor-texto: #fff;
  --fundo: #f6f4f1;
  --cartao: #ffffff;
  --texto: #1c1917;
  --suave: #78716c;
  --borda: #e7e5e4;
  --ok: #16a34a;
  --alerta: #d97706;
  --perigo: #dc2626;
  --raio: 18px;
  --sombra: 0 6px 24px rgba(28, 25, 23, .08);
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: var(--fundo); color: var(--texto);
  -webkit-tap-highlight-color: transparent;
}
button { font: inherit; color: inherit; cursor: pointer; border: 0; background: none; }
input, select, textarea { font: inherit; color: inherit; }
img, video { display: block; max-width: 100%; }
.oculto { display: none !important; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  padding: .8em 1.4em; border-radius: 999px; font-weight: 700;
  background: var(--cor); color: var(--cor-texto); transition: transform .1s, filter .15s;
}
.btn:active { transform: scale(.97); filter: brightness(.92); }
.btn[disabled] { opacity: .45; pointer-events: none; }
.btn.claro { background: #fff; color: var(--texto); border: 2px solid var(--borda); }
.btn.verde { background: var(--ok); color: #fff; }
.btn.perigo { background: var(--perigo); color: #fff; }

/* anúncios */
.ads { position: relative; overflow: hidden; background: #111; }
.ad-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; display: flex; align-items: center; justify-content: center; }
.ad-slide.on { opacity: 1; }
.ad-slide img, .ad-slide video { width: 100%; height: 100%; object-fit: cover; }
.ad-slide.contain img, .ad-slide.contain video { object-fit: contain; }
.ad-qr {
  position: absolute; right: 3%; bottom: 3%; background: #fff; color: #111; border-radius: 16px; padding: 10px;
  display: flex; gap: 10px; align-items: center; box-shadow: 0 8px 30px rgba(0,0,0,.35); max-width: 60%;
}
.ad-qr img { width: clamp(80px, 12vmin, 150px); height: auto; }
.ad-qr small { display: block; font-size: clamp(11px, 1.6vmin, 16px); color: #555; }
.ad-qr b { display: block; font-size: clamp(14px, 2.4vmin, 26px); letter-spacing: .04em; }
.ad-vazio {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2vmin;
  background: radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--cor) 70%, #fff), var(--cor) 60%, color-mix(in srgb, var(--cor) 60%, #000));
  color: #fff; text-align: center; padding: 5vmin;
}
.ad-vazio img { max-width: 40vmin; max-height: 30vmin; object-fit: contain; }
.ad-vazio h1 { font-size: clamp(32px, 8vmin, 96px); margin: 0; }

.toast {
  position: fixed; left: 50%; bottom: 40px; transform: translateX(-50%) translateY(30px); opacity: 0;
  background: #1c1917; color: #fff; padding: 16px 26px; border-radius: 14px; font-weight: 600; z-index: 999;
  transition: .25s; pointer-events: none; max-width: 90vw; text-align: center; font-size: 18px;
}
.toast.on { opacity: 1; transform: translateX(-50%); }
.toast.erro { background: var(--perigo); }

.ativar-som {
  position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.82); color: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; font-size: 26px; text-align: center; padding: 20px;
}
.ativar-som b { font-size: 64px; }