function Welcome({ onStart, onLogin, onScience }) {
  const { PhoneShell, StatusBar, HomeIndicator, StepBadge, Button, TextLink } = window.GG;
  return (
    <PhoneShell background="var(--bg-hero)" statusBar={false} homeIndicator={false}>
      <div style={{ position: 'absolute', left: 0, right: 0, top: 0, height: 255, background: 'url(' + ((window.__resources && window.__resources['hero']) || '../../assets/hero-spin-bike.png') + ') center center/cover no-repeat' }}>
        <div style={{ position: 'absolute', inset: 0, background: 'linear-gradient(180deg, rgba(0,0,0,0.45) 0%, transparent 14%)' }}></div>
        <div style={{ position: 'absolute', inset: 0, background: 'linear-gradient(0deg, var(--bg-hero) 0%, rgba(9,10,13,0.75) 34%, transparent 72%)' }}></div>
      </div>
      <StatusBar />
      <header style={{ position: 'relative', padding: '20px 28px 0', display: 'flex', justifyContent: 'flex-end' }}><StepBadge current={1} total={5} /></header>
      <main style={{ position: 'relative', marginTop: 'auto', padding: '12px 24px 8px' }}>
        <img src={((window.__resources && window.__resources['logo']) || '../../assets/logo-genius-gyms-on-dark.png')} alt="Genius Gyms" style={{ width: 220, display: 'block', marginBottom: 16, mixBlendMode: 'lighten' }} />
        <h1 style={{ margin: 0, fontSize: 'var(--type-display-size)', lineHeight: 'var(--type-display-lh)', fontWeight: 800, letterSpacing: 'var(--type-display-track)', textShadow: 'var(--text-shadow-hero)' }}>No more boring bike rides</h1>
        <p style={{ margin: '10px 0 0', fontSize: 15, lineHeight: 1.375, color: '#cbd5e1' }}>Your stationary bike brain training companion, games that make every ride fly by.</p>
      </main>
      <footer style={{ position: 'relative', padding: '20px 24px 0', display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
        <Button onClick={onStart} icon="chevron_right">Get Started</Button>
        <p style={{ margin: '14px 0 0', fontSize: 12, fontWeight: 500, color: '#a3a3a3' }}>Already a member? <TextLink href="#login" onClick={e => { e.preventDefault(); onLogin(); }}>Log In</TextLink></p>
        <HomeIndicator />
      </footer>
    </PhoneShell>
  );
}
window.Welcome = Welcome;
