/* Portal da transparência — página pública standalone (tema EVOLT escuro). */
.tp-body{ background:var(--bg); color:var(--texto); min-height:100vh; display:flex; flex-direction:column;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; }

.tp-top{ display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1rem max(18px,env(safe-area-inset-left,0px)); padding-right:max(18px,env(safe-area-inset-right,0px));
  max-width:1000px; width:100%; margin:0 auto; }
.tp-logo img{ height:26px; display:block; }
.tp-entrar{ color:var(--texto-dim); text-decoration:none; font-size:.92rem; font-weight:600;
  border:1px solid var(--borda); border-radius:999px; padding:.4rem 1rem; transition:.15s; }
.tp-entrar:hover{ color:var(--texto); border-color:var(--acento); }

.tp-main{ flex:1; width:100%; max-width:760px; margin:0 auto;
  padding-left:max(18px,env(safe-area-inset-left,0px)); padding-right:max(18px,env(safe-area-inset-right,0px));
  padding-block:clamp(2rem,6vw,3.5rem); }

/* hero + form */
.tp-hero{ text-align:center; }
.tp-selo{ display:inline-block; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:700;
  color:var(--acento); background:var(--acento-suave); border:1px solid rgba(34,230,160,.25);
  border-radius:999px; padding:.3rem .8rem; margin-bottom:1.1rem; }
.tp-hero h1{ font-size:clamp(1.9rem,6vw,2.8rem); line-height:1.08; font-weight:800; letter-spacing:-.02em;
  margin:0 0 .7rem; text-wrap:balance; }
.tp-lede{ color:var(--texto-dim); font-size:1.05rem; max-width:52ch; margin:0 auto 1.8rem; line-height:1.55; }

.tp-form{ max-width:560px; margin:0 auto; }
.tp-campo{ display:flex; gap:.5rem; }
.tp-campo input{ flex:1; min-width:0; background:var(--bg-elevado); border:1px solid var(--borda);
  color:var(--texto); border-radius:12px; padding:.85rem 1rem; font-size:1rem; outline:none; transition:.15s; }
.tp-campo input:focus{ border-color:var(--acento); box-shadow:0 0 0 3px var(--acento-suave); }
.tp-campo button{ flex:none; background:var(--acento); color:#04231a; border:none; border-radius:12px;
  font-weight:800; font-size:1rem; padding:0 1.3rem; cursor:pointer; transition:.15s; }
.tp-campo button:hover{ filter:brightness(1.07); }
.tp-campo button:disabled{ opacity:.6; cursor:default; }
.captcha-box{ margin:.9rem 0 .2rem; display:flex; justify-content:center; min-height:0; }
.tp-aviso-robo{ color:var(--texto-faint); font-size:.82rem; margin:.4rem 0 0; }

/* resultado */
.tp-resultado{ max-width:560px; margin:1.6rem auto 0; text-align:left; background:var(--bg-elevado);
  border:1px solid var(--borda); border-radius:16px; padding:1.2rem 1.3rem; }
.tp-resultado p{ margin:0; }
.tp-carregando{ color:var(--texto-dim); text-align:center; }
.tp-erro{ border-color:rgba(240,101,90,.5); color:#f7b0a9; text-align:center; }

.tp-faixa{ margin:-1.2rem -1.3rem 1.1rem; padding:.75rem 1.3rem; border-radius:16px 16px 0 0; font-weight:700; font-size:.95rem; }
.tp-faixa-ok{ background:rgba(34,230,160,.14); color:var(--acento); }
.tp-faixa-bad{ background:rgba(240,101,90,.16); color:#f7b0a9; }
.tp-resultado.tp-meu{ border-color:rgba(34,230,160,.5); }
.tp-resultado.tp-alerta{ border-color:rgba(240,101,90,.55); }

.tp-card-head{ display:flex; align-items:center; gap:.8rem; }
.tp-loja-chip{ flex:none; width:44px; height:44px; border-radius:11px; background:#fff; padding:6px;
  display:grid; place-items:center; }
.tp-loja-chip img{ max-width:100%; max-height:100%; display:block; }
.tp-card-loja{ font-weight:700; font-size:1.05rem; }
.tp-card-prod{ color:var(--texto-dim); font-size:.88rem; margin-top:.1rem !important; }

.tp-rotulo{ margin-top:1.1rem !important; font-size:.72rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--texto-faint); font-weight:700; }
.tp-id{ display:block; font-size:1.5rem; font-weight:800; letter-spacing:-.01em; word-break:break-all;
  margin:.2rem 0 .1rem; font-family:ui-monospace,"SF Mono",Menlo,monospace; }
.tp-id-vazio{ color:var(--texto-faint); }
.tp-campo{ /* reaproveitado no form; aqui é outro contexto */ }
.tp-resultado .tp-campo{ display:block; color:var(--texto-faint); font-size:.82rem; margin-top:.5rem !important;
  word-break:break-all; }
.tp-resultado .tp-campo code{ color:var(--texto-dim); }
.tp-obs{ margin-top:.9rem !important; padding:.7rem .85rem; border-radius:10px; font-size:.9rem; line-height:1.5;
  background:rgba(224,166,66,.12); color:#e8c07a; border:1px solid rgba(224,166,66,.3); }
.tp-cta{ margin-top:.9rem !important; font-size:.9rem; color:var(--texto-dim); }
.tp-cta a{ color:var(--acento); font-weight:700; text-decoration:none; }

/* lojas */
.tp-lojas{ margin-top:clamp(2.4rem,6vw,3.4rem); text-align:center; }
.tp-lojas-t{ font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--texto-faint); font-weight:700; margin:0 0 1rem; }
.tp-lojas-grid{ display:flex; flex-wrap:wrap; justify-content:center; gap:.7rem; }
.tp-loja{ display:flex; align-items:center; gap:.5rem; background:var(--bg-elevado); border:1px solid var(--borda);
  border-radius:999px; padding:.4rem .9rem .4rem .4rem; font-weight:600; font-size:.9rem; }
.tp-loja .tp-loja-chip{ width:30px; height:30px; border-radius:999px; padding:4px; }

/* como funciona */
.tp-como{ margin-top:clamp(2.4rem,6vw,3.4rem); }
.tp-como h2{ font-size:1.3rem; font-weight:700; margin:0 0 1rem; text-align:center; }
.tp-como-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem; }
.tp-como-card{ background:var(--bg-elevado); border:1px solid var(--borda); border-radius:12px; padding:1rem; }
.tp-como-card p{ margin:.5rem 0 0; color:var(--texto-dim); font-size:.9rem; line-height:1.5; }
.tp-como-card code{ font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:.85em; color:var(--acento); }
.tp-n{ display:grid; place-items:center; width:1.8rem; height:1.8rem; border-radius:50%;
  background:var(--acento-suave); color:var(--acento); font-weight:800; font-size:.9rem; }
.tp-rodape{ margin-top:1.6rem; color:var(--texto-faint); font-size:.85rem; line-height:1.55; text-align:center; }
.tp-rodape a{ color:var(--acento); text-decoration:none; font-weight:600; }

@media (max-width:620px){
  .tp-campo{ flex-direction:column; }
  .tp-campo button{ padding:.8rem; }
  .tp-como-grid{ grid-template-columns:1fr; }
}