.check-page{min-height:100vh;background:var(--paper);color:var(--ink)}.check-header{width:var(--page);height:100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;/* O botão de compartilhar entra por JS como terceiro item e encostava no
     "Voltar". Sem este gap eles ficam com 0px entre si, e no hover o botão
     desloca 2px e passa por cima. */gap:26px;border-bottom:1.5px solid var(--ink)}.check-back{display:inline-flex;align-items:center;gap:8px;padding-bottom:4px;border-bottom:1px solid var(--ink);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}/* No celular o texto "Voltar" some (font-size: 0) e esta seta vira o botao
   inteiro, entao ela precisa de contraste de texto, nao de enfeite. */.check-back span{color:var(--ink);font-size:18px}.check-main{width:var(--page);min-height:calc(100vh - 170px);margin:0 auto;padding:70px 0 80px;display:grid;grid-template-columns:1.1fr .9fr;gap:8vw;align-items:center}.check-intro{position:relative}.check-intro h1{margin:0;font-family:var(--display);font-size:clamp(88px, 10vw, 150px);font-weight:400;line-height:.86;letter-spacing:-.025em;text-transform:uppercase}.check-intro h1 em{color:var(--orange);font-style:normal}.check-intro > p:not(.eyebrow){max-width:520px;margin:30px 0 0;font-size:17px}.check-sticker{position:absolute;right:0;bottom:-55px;padding:13px 17px;border:2px solid var(--ink);background:var(--blue);color:white;box-shadow:5px 5px 0 var(--ink);font-family:var(--display);font-size:24px;text-transform:uppercase;transform:rotate(-5deg)}.check-sticker span{color:var(--acid)}.check-card{width:min(100%, 500px);margin-left:auto;border:2px solid var(--ink);background:var(--white);box-shadow:12px 12px 0 var(--acid),14px 14px 0 2px var(--ink)}.check-card [hidden]{display:none !important}.check-card:not([data-state="desktop"]) .check-desktop{display:none !important}.check-card-bar{min-height:52px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;background:var(--ink);color:white;font-size:11px;font-weight:800;letter-spacing:.1em}.check-card-bar span{display:flex;align-items:center;gap:8px}.check-card-bar i{width:8px;aspect-ratio:1;border-radius:50%;background:var(--orange);animation:check-pulse 1s ease-in-out infinite}.check-card[data-state="desktop"] .check-card-bar i,.check-card[data-state="success"] .check-card-bar i{background:var(--acid);animation:none}.check-card-bar b{color:var(--acid)}@keyframes check-pulse{50%{opacity:.35;transform:scale(.7)}}.check-visual{height:190px;display:grid;place-items:center;position:relative;overflow:hidden;border-bottom:2px solid var(--ink);background:var(--blue)}.check-visual::before,.check-visual::after{content:"";position:absolute;border:1px solid rgba(255,255,255,.45);border-radius:50%;aspect-ratio:1}.check-visual::before{width:170px}.check-visual::after{width:280px}.check-phone{z-index:1;width:76px;height:126px;display:grid;place-items:center;position:relative;border:3px solid white;border-radius:15px;background:var(--ink);box-shadow:7px 8px 0 rgba(17,17,17,.3)}.check-phone::before{content:"";position:absolute;top:8px;width:17px;height:2px;background:white;border-radius:99px}.check-symbol{width:28px;height:28px;position:relative}.check-symbol::before,.check-symbol::after{content:"";position:absolute;left:12px;top:0;width:4px;height:28px;background:var(--acid)}.check-symbol::before{transform:rotate(45deg)}.check-symbol::after{transform:rotate(-45deg)}.check-card[data-state="checking"] .check-phone{animation:phone-float 1.2s ease-in-out infinite alternate}@keyframes phone-float{to{transform:translateY(-7px) rotate(2deg)}}.check-card[data-state="desktop"] .check-symbol::before{width:4px;height:35px;left:12px;top:-8px;transform:none}.check-card[data-state="desktop"] .check-symbol::after{width:22px;height:22px;left:3px;top:4px;background:transparent;border:solid var(--acid);border-width:0 4px 4px 0;transform:rotate(45deg)}.check-card[data-state="success"] .check-symbol::before{width:4px;height:24px;left:7px;top:7px;transform:rotate(-45deg)}.check-card[data-state="success"] .check-symbol::after{width:4px;height:40px;left:20px;top:-6px;transform:rotate(45deg)}.check-message{padding:24px 25px 12px;text-align:center}.check-message h2{margin:0;font-family:var(--body);font-size:26px;font-weight:800;line-height:1.15;letter-spacing:-.045em;text-transform:none}.check-message p{margin:7px 0 0;color:#6a655c;font-size:11px}.check-loading{display:flex;justify-content:center;gap:7px;padding:10px 0 28px}.check-loading span{width:8px;aspect-ratio:1;border-radius:50%;background:var(--ink);animation:loading-dot .9s ease-in-out infinite alternate}.check-loading span:nth-child(2){animation-delay:.2s}.check-loading span:nth-child(3){animation-delay:.4s}@keyframes loading-dot{to{transform:translateY(-7px);background:var(--orange)}}.check-desktop{padding:5px 25px 22px;text-align:center}.check-desktop img{width:min(140px, 100%);height:auto;aspect-ratio:1/1;object-fit:contain;display:block;margin:0 auto 12px;padding:6px;border:2px solid var(--ink);background:white}.check-desktop p{margin:0 0 10px;font-size:10px;color:#6a655c}.check-desktop > a{display:block;margin-bottom:12px;font-size:11px;font-weight:800;text-decoration:underline}.check-desktop button,.check-blocked > button{width:100%;min-height:48px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border:2px solid var(--ink);background:var(--acid);font-size:10px;font-weight:800;text-transform:uppercase;cursor:pointer}.check-desktop small{display:block;min-height:14px;margin-top:7px;color:#26721d;font-size:11px;font-weight:800}.check-success{padding:8px 25px 20px}.check-success > a{min-height:55px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border:2px solid var(--ink);background:var(--acid);box-shadow:5px 5px 0 var(--ink);font-size:11px;font-weight:800;text-transform:uppercase}.check-success p{margin:14px 0 0;text-align:center;color:#5c584f;font-size:11px}/* O numero da contagem em laranja ficava em 3.7 sobre o branco. O destaque
   passa a vir do peso. */.check-success strong{color:var(--ink);font-weight:800}/* O que a checagem encontrou, para a pessoa poder conferir por conta própria. */.check-detected{margin:4px 25px 0;padding:0;border-top:1px dashed #ccc}.check-detected > div{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px dashed #ccc}.check-detected dt{flex:none;color:#5c584f;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.check-detected dd{margin:0;text-align:right;font-size:11px;font-weight:700}.check-blocked{padding:14px 25px 20px}.check-reason{margin:0 0 14px;padding:12px 14px;border:2px solid var(--ink);background:var(--paper);font-size:11px;font-weight:700;line-height:1.5}/* Aparelho fora da lista é beco sem saída para a pessoa, mas não para o link:
   quem não pode usar é justamente quem conhece alguém que pode. Por isso este
   bloco é a ação principal do resultado bloqueado — vem logo abaixo do motivo e
   é o mais alto do cartão (título maior, selo e sombra forte). */.check-share{margin-bottom:14px;padding:18px 16px;border:2px solid var(--ink);background:var(--blue);color:white;box-shadow:6px 6px 0 var(--ink)}.check-share-kicker{display:inline-flex;align-items:center;gap:6px;margin:0 0 11px;padding:4px 10px;background:var(--acid);color:var(--ink);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.check-share-title{margin:0 0 11px;font-size:19px;font-weight:800;line-height:1.15;letter-spacing:-.02em}.check-share-models{margin:0 0 11px;padding:0;list-style:none}.check-share-models li{padding:5px 0;border-bottom:1px solid rgba(255, 255, 255, .35);font-size:11px;font-weight:700}.check-share-models li::before{content:"✓ ";color:var(--acid);font-weight:800}.check-share-text{margin:0 0 13px;font-size:11px;line-height:1.5}.check-share-native,.check-share-whatsapp,.check-share-copy{width:100%;min-height:48px;margin-bottom:9px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;border:2px solid var(--ink);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;cursor:pointer}/* Os dois caminhos de envio ganham corpo e sombra — são o clique que interessa.
   O "copiar link" fica plano, de reserva para quem não usa nenhum dos dois. */.check-share-native,.check-share-whatsapp{min-height:52px;box-shadow:4px 4px 0 var(--ink)}.check-share-native{background:var(--acid);color:var(--ink)}.check-share-whatsapp{background:#25d366;color:var(--ink)}.check-share-copy{background:var(--white);color:var(--ink);margin-bottom:0}#share-feedback{display:block;min-height:15px;margin-top:8px;color:var(--acid);font-size:11px;font-weight:800;overflow-wrap:anywhere}.check-anyway{min-height:50px;margin-bottom:10px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;border:2px solid var(--ink);background:var(--white);font-size:10px;font-weight:800;text-transform:uppercase}.check-blocked > button{color:var(--ink)}/* "Verificar de novo" não é uma das saídas do resultado: sai da fila de botões
   cheios e vira um link miúdo e centralizado, para o cartão mostrar só as duas
   ações de verdade — "Começar a ganhar" e "Compartilhar". A lista completa de
   modelos já vive no <details> logo abaixo do cartão. */#check-again{min-height:0;margin-top:2px;padding:8px;border:none;background:none;justify-content:center;gap:6px;font-size:11px;font-weight:700;color:#6a655c;text-decoration:underline;text-underline-offset:2px}.check-card[data-state="blocked"] .check-card-bar i{background:var(--orange);animation:none}/* ---- Estado "pode não ser" (maybe): modelo fora da lista ou não identificado.
   A lista do site não é a palavra final — quem decide é o app da HUB —, então
   testar é a saída principal. O cartão troca o tom de erro pelo de atenção e o
   "Continuar" ganha o corpo do botão de sucesso. ---- */.check-card[data-state="maybe"] .check-card-bar i{background:var(--orange);animation:none}/* O X do telefone (reprovado) vira um "!" laranja (atenção), sobre o preto do aparelho. */.check-card[data-state="maybe"] .check-symbol::before{width:5px;height:17px;left:11px;top:1px;background:var(--orange);border-radius:2px;transform:none}.check-card[data-state="maybe"] .check-symbol::after{width:5px;height:5px;left:11px;top:23px;background:var(--orange);border-radius:50%;transform:none}/* O DOM já vem na ordem do maybe (continuar, passar, ver-modelos, verificar), então
   ali a ordem visual bate com a de teclado sem mexer em nada. Só as barreiras reais
   (blocked) viram flex para subir o bloco de indicar ao topo e empurrar o "continuar
   mesmo assim" para baixo. */.check-card[data-state="blocked"] .check-blocked{display:flex;flex-direction:column}.check-card[data-state="blocked"] .check-reason{order:0}.check-card[data-state="blocked"] .check-share{order:1}.check-card[data-state="blocked"] .check-anyway{order:2}.check-card[data-state="blocked"] .check-passar{order:3}.check-card[data-state="blocked"] #check-again{order:4}/* As duas saídas ganham o mesmo corpo alto e a mesma sombra, formando um par de
   peso igual: "Começar a ganhar" no verde de ação, "Compartilhar" em branco. */.check-card[data-state="maybe"] .check-anyway,.check-blocked > button.check-passar{min-height:55px;margin-bottom:12px;box-shadow:5px 5px 0 var(--ink)}.check-card[data-state="maybe"] .check-anyway{background:var(--acid)}.check-blocked > button.check-passar{background:var(--white)}.check-note{margin:0 25px 22px;padding-top:15px;border-top:1px dashed #aaa;color:#5c584f;font-size:11px;line-height:1.5;text-align:center}.check-footer{width:var(--page);min-height:70px;margin:0 auto;padding:20px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--ink);font-size:11px;text-transform:uppercase;letter-spacing:.06em}/* A .check-main é uma grade de duas colunas: sem isto a lista de modelos vira um
   terceiro item e fica espremida em metade da largura, centralizada na vertical. */.check-main > .modelos-abrir{grid-column:1/-1;align-self:start}@media (max-width: 980px){.check-main{grid-template-columns:1fr;padding-top:60px}.check-intro{max-width:720px}.check-sticker{right:10%}.check-card{margin:20px auto 0}}@media (max-width: 620px){.check-header{height:82px}.check-back{font-size:0}.check-back span{font-size:20px}.check-main{padding:22px 0 60px;gap:0}/* A página existe para responder "seu celular está pronto?", e no celular a
     pergunta gastava a tela inteira antes de mostrar a resposta. Some da vista,
     mas continua no ar para leitores de tela — é o título da página. Sai do
     fluxo em vez de display:none para não deixar o vão da grade para trás. */.check-intro{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.check-card{box-shadow:7px 7px 0 var(--acid),9px 9px 0 1px var(--ink)}.check-visual{height:165px}.check-message{padding-left:18px;padding-right:18px}.check-message h2{font-size:23px}.check-desktop,.check-success,.check-blocked{padding-left:18px;padding-right:18px}.check-detected{margin-left:18px;margin-right:18px}.check-note{margin-left:18px;margin-right:18px}.check-footer{flex-direction:column;align-items:flex-start;gap:5px}}/* Telas baixas: a ilustração do celular é a parte mais cara do cartão e a menos
   informativa. Encolhendo ela, o veredito e o botão Continuar cabem sem rolar. */@media (max-width: 620px) and (max-height: 720px){.check-main{padding-top:14px}.check-visual{height:118px}.check-visual::before{width:118px}.check-visual::after{width:205px}.check-phone{width:62px;height:100px;border-radius:12px}}