const { Card, Callout, Button, Badge, Icon, StepList } = window.GuiaDiabeteDesignSystem_9d1af3;
const APK='./jogo.apk'; // mesmo diretório da página
function Jogo({go}){
  const mobile=useMobile();
  return <Page route="jogo" go={go}>
    <Container width="var(--width-content)" style={{paddingTop:'var(--space-11)'}}>
      <Breadcrumb items={[['home','Início'],[null,'Jogo']]} go={go}/>
      <div style={{display:'flex',alignItems:'center',gap:'var(--space-5)',marginBottom:'var(--space-6)'}}>
        <Badge tone="caution" icon="gamepad-2">Jogo para crianças</Badge>
        <span style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-caption)',color:'var(--text-muted)'}}>Gratuito · sem anúncios</span>
      </div>
      <h1 style={{fontSize:'var(--fs-h1)',lineHeight:'var(--lh-h1)',letterSpacing:'var(--ls-heading)'}}>A jornada de Lucas</h1>
      <p style={{fontFamily:'var(--font-editorial)',fontSize:'var(--fs-lead)',lineHeight:'var(--lh-lead)',color:'var(--text-body)',marginTop:'var(--space-6)'}}>As insulinas de Lucas são roubadas e para recuperá-las ele precisa entrar em uma longa jornada contra monstros para poder tê-las de volta.</p>
      <div style={{display:'flex',flexWrap:'wrap',alignItems:'center',gap:'var(--space-5)',marginTop:'var(--space-9)'}}>
        <Button size="lg" icon="download" as="a" href={APK} download="jogo.apk">Baixar o jogo (APK)</Button>
        <span style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-caption)',color:'var(--text-muted)'}}>Android · instalação manual</span>
      </div>
      <div className="prose" style={{display:'flex',flexDirection:'column',gap:'var(--space-7)',marginTop:'var(--space-11)',maxWidth:'100%'}}>
        <h2 style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-h2)'}}>A história</h2>
        <p>Lucas descobre que suas insulinas foram roubadas. A partir daí começa uma longa jornada: ele enfrenta monstros ao longo do caminho para recuperar, uma a uma, as insulinas que são dele.</p>
        <p>Errar não encerra a jornada: dá para tentar de novo até recuperar a insulina daquela etapa.</p>
        <h2 style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-h2)'}}>Para quem é</h2>
        <p>Crianças de todas as idades, com um adulto por perto na primeira partida. Pode ser repetido quantas vezes quiser.</p>
      </div>
      <div style={{display:'grid',gridTemplateColumns:mobile?'1fr':'1fr 1fr',gap:'var(--space-7)',marginTop:'var(--space-10)'}}>
        {[['smartphone','Android','Arquivo APK, instalação manual'],['wifi-off','Funciona offline','Depois de instalar, não precisa de internet'],['shield-check','Sem coleta de dados','Nenhum cadastro, nenhum anúncio'],['users','Todas as idades','Feito para crianças de qualquer idade']].map(([ic,t,s])=>
          <Card key={t} padding="var(--space-8)" style={{display:'flex',gap:'var(--space-6)'}}>
            <Icon name={ic} size={22} color="var(--teal-600)"/>
            <div style={{display:'flex',flexDirection:'column',gap:4}}>
              <strong style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-h4)',color:'var(--text-strong)'}}>{t}</strong>
              <span style={{fontFamily:'var(--font-editorial)',fontSize:'var(--fs-body-sm)',color:'var(--text-muted)'}}>{s}</span>
            </div></Card>)}
      </div>
      <Callout tone="info" title="Como instalar no Android" style={{marginTop:'var(--space-10)'}}>Baixe o arquivo <strong>jogo.apk</strong>, abra a notificação de download e confirme a instalação. Na primeira vez o Android pede permissão para instalar arquivos desta origem — é o comportamento normal para apps fora da loja.</Callout>
      <Callout tone="caution" title="O jogo não substitui o plano da equipe médica" style={{marginTop:'var(--space-10)'}}>Os valores e as quantidades usadas são referências gerais, para ensinar a sequência. As metas da criança são as definidas pela equipe que a acompanha.</Callout>
      <Card tone="brand" padding="var(--space-9)" style={{marginTop:'var(--space-11)',display:'flex',flexWrap:'wrap',alignItems:'center',justifyContent:'space-between',gap:'var(--space-7)'}}>
        <div style={{display:'flex',flexDirection:'column',gap:'var(--space-3)'}}>
          <strong style={{fontFamily:'var(--font-ui)',fontSize:'var(--fs-h3)',color:'var(--text-strong)'}}>Ajude Lucas a recuperar as insulinas</strong>
          <span style={{fontFamily:'var(--font-editorial)',fontSize:'var(--fs-body-sm)',color:'var(--text-body)'}}>Baixe, abra e jogue a primeira fase junto com a criança.</span>
        </div>
        <div style={{display:'flex',alignItems:'center',gap:'var(--space-5)'}}>
          <Share variant="compact" label="" url={window.shareUrl('jogo')} title="A jornada de Lucas — jogo do Além do Açúcar"/>
          <Button size="lg" icon="download" as="a" href={APK} download="jogo.apk">Baixar o jogo</Button>
        </div>
      </Card>
    </Container>
  </Page>;
}
window.Jogo=Jogo;