/* ============================================================
   Globosafe — app pages (check, login, welcome)
   Extends site.css. Same scale, same rhythm.
   ============================================================ */

.app-body{background:var(--paper)}

.app-main{padding-block:clamp(2.5rem,5vw,4.5rem)}
.app-h1{
  font-size:var(--t-2xl);
  line-height:var(--lh-tight);
  font-weight:800;
  letter-spacing:-0.025em;
  max-width:20ch;
  margin-bottom:var(--s3);
}
.app-main .lede{margin-bottom:var(--s5)}

/* ---------- paste area ---------- */

.paste-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:var(--s3);
  box-shadow:var(--shadow);
  margin-bottom:var(--s3);
}
.paste-card:focus-within{outline:3px solid var(--lime);outline-offset:2px}
.paste-card textarea{
  width:100%;
  min-height:190px;
  border:0;
  resize:vertical;
  background:transparent;
  padding:var(--s2);
  font-family:inherit;
  font-size:var(--t-base);
  line-height:var(--lh-body);
  color:var(--ink);
}
.paste-card textarea:focus{outline:none}
.paste-card textarea::placeholder{color:#96a29d}

.paste-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--s3);
  flex-wrap:wrap;
  border-top:1px solid var(--line);
  padding:var(--s3) var(--s2) var(--s1);
}
.paste-hint{font-size:var(--t-xs);color:var(--muted)}
.paste-hint.over{color:var(--danger);font-weight:600}

/* ---------- result ---------- */

.result{margin-top:var(--s6)}

.result-head{
  border-radius:var(--radius-lg);
  padding:clamp(1.5rem,3vw,2rem);
  color:var(--white);
  margin-bottom:var(--s3);
}
.v-scam{background:var(--danger)}
.v-caution{background:var(--warn)}
.v-unlikely{background:var(--green)}

.result-verdict{
  font-size:var(--t-xs);
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
  opacity:.92;
  margin:0 0 var(--s2);
}
.result-headline{
  font-family:Manrope,sans-serif;
  font-weight:800;
  font-size:var(--t-lg);
  line-height:var(--lh-snug);
  letter-spacing:-0.018em;
  margin:0 0 var(--s4);
  text-wrap:balance;
}
.meter{height:8px;border-radius:999px;background:#ffffff33;overflow:hidden}
.meter span{display:block;height:100%;border-radius:999px;background:#fff;transition:width .5s ease}
.meter-label{font-size:var(--t-xs);margin:var(--s2) 0 0;opacity:.92}

.provenance{
  font-size:var(--t-xs);
  line-height:var(--lh-body);
  color:var(--muted);
  margin:0 0 var(--s4);
}

.result-sec{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:var(--s4);
  margin-bottom:var(--s3);
}
.result-sec h3{
  font-size:var(--t-xs);
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--green-deep);
  margin:0 0 var(--s3);
}
.result-sec p{font-size:var(--t-sm);line-height:var(--lh-body);color:var(--muted);margin:0}

.flags{list-style:none;padding:0;margin:0;display:grid;gap:var(--s3)}
.flags li{display:grid;gap:2px}
.flags strong{font-size:var(--t-sm);line-height:var(--lh-snug);color:var(--ink);font-weight:600}
.flags span{font-size:var(--t-sm);line-height:var(--lh-body);color:var(--muted)}
.flags.safe strong{color:var(--green-deep)}

.steps-list{margin:0;padding-left:1.15em;font-size:var(--t-sm);line-height:var(--lh-body);color:var(--muted);display:grid;gap:var(--s1)}
.steps-list.dont{color:var(--danger)}

.result-sec.verify{background:var(--paper-2);border-style:dashed}

/* ---------- paywall ---------- */

.paywall{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:clamp(1.5rem,3.5vw,2.5rem);
  box-shadow:var(--shadow);
}
.paywall h2{font-size:var(--t-xl);max-width:24ch;margin-bottom:var(--s3)}
.paywall .lede{margin-bottom:var(--s5)}
.link-quiet{
  display:inline-block;
  margin-top:var(--s4);
  font-size:var(--t-sm);
  color:var(--muted);
  border-bottom:1px solid var(--line-strong);
}
.link-quiet:hover{color:var(--ink)}

/* ---------- forms (login / welcome) ---------- */

.form-card{
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:clamp(1.5rem,3.5vw,2.25rem);
  max-width:520px;
  box-shadow:var(--shadow);
}
.form-card label{
  display:block;
  font-size:var(--t-sm);
  font-weight:600;
  margin-bottom:var(--s1);
}
.form-card input{
  width:100%;
  padding:13px 16px;
  border:1px solid var(--line-strong);
  border-radius:12px;
  font-family:inherit;
  font-size:var(--t-base);
  line-height:1.4;
  color:var(--ink);
  background:var(--white);
  margin-bottom:var(--s3);
}
.form-card input:focus-visible{outline:3px solid var(--lime);outline-offset:1px;border-color:var(--ink)}
.form-card .btn{width:100%}
.form-note{font-size:var(--t-sm);line-height:var(--lh-body);color:var(--muted);margin:var(--s3) 0 0}
.form-err{
  background:#fdf1e8;
  border:1px solid #f0b184;
  color:#8a3c10;
  padding:var(--s2) var(--s3);
  border-radius:12px;
  font-size:var(--t-sm);
  line-height:var(--lh-snug);
  margin-bottom:var(--s3);
}