:root {
  --bg: #05080a;
  --bg-2: #0a0f10;
  --ink: #eaf6ee;
  --ink-dim: #9db0a6;
  --line: rgba(120, 240, 180, 0.12);
  --green: #00e676;
  --green-deep: #00b957;
  --green-glow: #7cffbf;
  --red: #ff4d6d;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: 'Inter', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body { min-height: 100dvh; }

button { font-family: inherit; }

/* Coluna central no mobile */
.app-shell {
  max-width: 440px;
  margin: 0 auto;
  min-height: 100dvh;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(0, 230, 118, 0.12), transparent 60%),
    radial-gradient(80% 50% at 50% 30%, rgba(0, 230, 118, 0.06), transparent 70%),
    linear-gradient(180deg, #06100c 0%, #05080a 40%, #05080a 100%);
}

/* Grade sutil de fundo */
.grid-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(0, 230, 118, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 230, 118, 0.05) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(80% 60% at 50% 30%, black 40%, transparent 85%);
  -webkit-mask-image: radial-gradient(80% 60% at 50% 30%, black 40%, transparent 85%);
}

/* Ponto "AO VIVO" piscando no badge do topo */
@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.55; transform: scale(0.88); }
}