/* link.css — the few pieces only the Link pages (link.battlezone.gg) have.
   Everything else on those pages is bz.css: same tokens, same type, same frame. */

.lk{max-width:980px}
.lk .shead{padding-bottom:22px}
.lk .shead .sub b{color:var(--bone)}

/* 1 Steam · 2 Discord · Done */
.lk-steps{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--line);background:var(--steel)}
.lk-steps li{display:flex;align-items:center;gap:12px;padding:14px 16px;min-width:0;
  border-right:1px solid var(--line);color:var(--ash-dim)}
.lk-steps li:last-child{border-right:0}
.lk-steps .n{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border:1px solid var(--line-2);font-family:var(--mono);font-size:13px;color:var(--ash)}
.lk-steps .t{display:flex;flex-direction:column;min-width:0}
.lk-steps b{font-family:var(--display);font-size:17px;letter-spacing:.05em;text-transform:uppercase;line-height:1.1}
.lk-steps small{font-size:12.5px;color:var(--ash);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lk-steps li.on{background:var(--steel-2);color:var(--bone);box-shadow:inset 0 -2px 0 var(--brass)}
.lk-steps li.on .n{border-color:var(--brass);color:var(--brass)}
.lk-steps li.ok{color:var(--bone)}
.lk-steps li.ok .n{border-color:var(--live);color:var(--live)}

/* the step card */
.lk-card{border:1px solid var(--line);background:var(--steel);padding:clamp(18px,3vw,32px)}
.lk-card h3{font-family:var(--display);font-size:clamp(20px,2.6vw,27px);letter-spacing:.03em;text-transform:uppercase;
  line-height:1.1;margin:0 0 12px}
.lk-card p{font-size:16px;line-height:1.6;color:#c2c8c8;margin:0 0 16px;max-width:62ch}
.lk-card a:not(.btn){color:var(--brass);text-underline-offset:3px}
.lk-card code{font-family:var(--mono);font-size:.92em;color:var(--bone);background:var(--steel-3);padding:1px 6px}
.lk-who{color:var(--blue-hot);text-transform:none;letter-spacing:.01em}
.lk-small{font-size:14px!important;color:var(--ash)!important;margin-top:16px!important}
.lk-big{font-size:18px!important;color:var(--bone)!important}

.lk-btn{display:inline-flex;align-items:center;gap:10px;font-size:15.5px;padding:13px 22px;margin:4px 0}
.lk-steam{background:var(--bone);border-color:var(--bone);color:#0d0f0f}
.lk-steam:hover{background:#fff;border-color:#fff}
.lk-discord{background:#5865f2;border-color:#5865f2;color:#fff}
.lk-discord:hover{background:#6d78f5;border-color:#6d78f5}
.lk-card .btn-go:not(.lk-steam):not(.lk-discord){background:var(--brass);border-color:var(--brass);color:#0d0f0f}

.lk-acct{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:#c2c8c8}
.lk-acct img{width:40px;height:40px;border:1px solid var(--line-2)}
.lk-acct b{color:var(--bone)}

/* done */
.lk-pair{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:6px 0 18px}
.lk-pair span{display:flex;flex-direction:column;border:1px solid var(--line);background:var(--steel-2);padding:10px 16px;min-width:0}
.lk-pair small{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ash-dim)}
.lk-pair b{font-size:17px;overflow-wrap:anywhere}
.lk-pair i{font-style:normal;font-size:22px;color:var(--live)}
.lk-notes{list-style:none;margin:0 0 20px;padding:0}
.lk-notes li{position:relative;padding:6px 0 6px 21px;font-size:15.5px;line-height:1.55;color:#c2c8c8}
.lk-notes li::before{content:"+";position:absolute;left:0;color:var(--live)}
.lk-notes b{color:var(--bone)}
.lk-err h3{color:var(--red-hot)}

/* what linking gets you */
.lk-perks{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);
  margin-top:clamp(18px,3vw,28px)}
.lk-perks>div{background:var(--steel);padding:clamp(16px,2.4vw,24px)}
.lk-perks h4{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;margin:0 0 12px}
.lk-perks .pve h4{color:var(--blue-hot)}
.lk-perks .pvp h4{color:var(--red-hot)}
.lk-perks .dc h4{color:#8f98ff}
.lk-perks ul{list-style:none;margin:0;padding:0}
.lk-perks li{font-size:14.5px;line-height:1.5;color:#b0b7b7;padding:6px 0}
.lk-perks li b{display:block;color:var(--bone);font-size:15.5px}
.lk-privacy{margin-top:18px}

@media(max-width:760px){
  .lk-perks{grid-template-columns:1fr}
  .lk-steps li{flex-direction:column;align-items:flex-start;gap:6px;padding:11px 10px}
  .lk-steps b{font-size:15px}
  .lk-btn{width:100%;justify-content:center}
}
@media(max-width:380px){
  .lk-steps small{display:none}
}