*{box-sizing:border-box}
:root{
  --bg:#77a9d6;
  --ink:#111;
  --paper:#f7f3e8;
  --red:#e93f33;
  --blue:#1f57d6;
  --yellow:#ffd84d;
}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:"Courier New",monospace}
body{
  background-image:
    linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);
  background-size:16px 16px;
}
.wrap{max-width:920px;margin:0 auto;padding:28px 18px 48px}
.hero,.panel,footer{
  background:var(--paper);
  border:4px solid var(--ink);
  box-shadow:8px 8px 0 var(--ink);
  margin-bottom:24px;
}
.hero{text-align:center;padding:28px}
.badge{
  display:inline-block;
  padding:7px 12px;
  background:var(--yellow);
  border:3px solid var(--ink);
  font-weight:700;
  margin-bottom:18px;
}
.avatar{
  display:block;
  width:min(420px,88vw);
  aspect-ratio:1/1;
  object-fit:cover;
  margin:0 auto 18px;
  border:4px solid var(--ink);
  image-rendering:pixelated;
}
h1{font-size:clamp(42px,8vw,82px);line-height:.9;margin:10px 0 4px;letter-spacing:-4px}
.ticker{font-size:28px;font-weight:700;color:var(--blue);margin:8px 0}
.tagline{font-size:20px;margin:10px 0 22px}
.actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.btn{
  display:inline-block;
  padding:14px 18px;
  border:3px solid var(--ink);
  color:var(--ink);
  text-decoration:none;
  font-weight:700;
  font-size:16px;
  cursor:pointer;
  box-shadow:4px 4px 0 var(--ink);
}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.primary{background:var(--red);color:#fff}
.secondary{background:var(--yellow)}
.ca-box{
  margin:22px auto 0;
  max-width:720px;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  padding:12px;
  border:3px dashed var(--ink);
  word-break:break-all;
}
.label{font-weight:700;background:var(--ink);color:#fff;padding:4px 7px}
.panel{padding:24px}
.panel h2{margin:0 0 14px;font-size:28px}
.panel p{font-size:18px;line-height:1.5}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.stats div{border:3px solid var(--ink);padding:18px;text-align:center;background:#fff}
.stats strong{display:block;font-size:28px;color:var(--red)}
.stats span{display:block;margin-top:6px}
footer{padding:16px;text-align:center;font-size:14px}
@media(max-width:640px){
  .stats{grid-template-columns:1fr}
  h1{letter-spacing:-2px}
}