/* Grug · Links pages (links/, links/create/, links/page/). Solid colours only, like Rewards. */
.lk-badge{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;font:700 13px var(--display);flex:none;letter-spacing:.02em}
.lk-badge.sm{width:28px;height:28px;font-size:10.5px}

/* a list of link buttons (the follower's page and the builder's preview) */
.lk-list{display:flex;flex-direction:column;gap:10px}
.lk-btn{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:18px;background:var(--card-solid);border:2px solid var(--line2);color:var(--ink);text-decoration:none;transition:transform .15s var(--spring),border-color .15s}
.lk-btn:hover{transform:translateY(-2px);border-color:var(--lc,var(--mode))}
.lk-btn .t{flex:1;min-width:0}
.lk-btn b{display:block;font-size:17px}
.lk-btn small{display:block;color:var(--ink2);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lk-btn .gi{width:20px;height:20px;color:var(--mut);flex:none}

/* the creator's header on their page */
.lk-head{display:flex;align-items:center;gap:14px;padding:16px;border-radius:22px;color:var(--a-ink);background:var(--a);box-shadow:inset 0 -5px 0 var(--a-lo)}
.lk-av{width:58px;height:58px;border-radius:50%;background:var(--a-lo);display:grid;place-items:center;font:700 26px var(--display);flex:none;color:#fff}
.lk-head h1{font-size:clamp(22px,4vw,30px);color:var(--a-ink)}
.lk-head small{font-weight:600;opacity:.85}
.lk-head>div{flex:1;min-width:0}
.lk-earn{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:16px;background:color-mix(in srgb,#C59BFF 16%,var(--card-solid));color:var(--ink2);font-size:14.5px}
.lk-earn .gi{width:22px;height:22px;color:#d16be8;flex:none}
.lk-earn b{color:var(--ink)}

/* the 3D world on a follower's page */
.lk-world{position:relative;height:min(68vh,580px);min-height:360px;border-radius:24px;overflow:hidden;background:var(--page)}
.lk-world canvas{display:block;width:100%;height:100%}
.lk-start{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px;background:rgba(14,12,20,.72)}
.lk-start[hidden]{display:none}
.lk-start h2{color:#fff;font-size:clamp(24px,4.4vw,34px)}
.lk-start p{color:#E6E2F0;max-width:34ch}
.lk-hint{position:absolute;left:12px;bottom:12px;padding:7px 12px;border-radius:999px;background:var(--page);color:var(--ink);font-weight:700;font-size:13px;pointer-events:none}

/* builder bits */
.lk-rows{display:flex;flex-direction:column;gap:8px}
.lk-row{display:flex;align-items:center;gap:12px;padding:8px 10px 8px 12px;border-radius:16px;background:var(--card-solid);border:2px solid var(--line2)}
.lk-row.ok{border-color:var(--mode)}
.lk-row b{width:84px;flex:none;font-size:15px}
.lk-row input{flex:1;min-width:0;min-height:42px;font-size:16px}
.lk-row .ck{width:24px;height:24px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--card3)}
.lk-row.ok .ck{background:var(--mode);color:var(--on-sel)}
.lk-row .ck .gi{width:14px;height:14px;opacity:0}
.lk-row.ok .ck .gi{opacity:1}
.lk-mock{max-width:330px;padding:14px;border-radius:24px;background:#1C1C20;border:1px solid var(--line2);display:flex;flex-direction:column;gap:10px}
.lk-mock .lk-head{padding:12px}
.lk-mock .lk-av{width:44px;height:44px;font-size:20px}
.lk-mock .lk-head h1{font-size:19px}
.lk-mock .lk-btn{padding:9px 11px}
.lk-mock .lk-btn b{font-size:15px}
.lk-mock .lk-btn small{font-size:12.5px}
.lk-worlds{display:flex;gap:6px;margin-left:auto}
.lk-worlds i{width:18px;height:18px;border-radius:50%;display:block;box-shadow:inset 0 -2px 0 rgba(0,0,0,.25)}
.lk-3d{position:relative;width:100%;aspect-ratio:4/3;margin-top:18px;border-radius:22px;overflow:hidden;background:var(--page)}
.lk-3d canvas{display:block;width:100%;height:100%}

/* the Links tab hero art: a stack of link buttons */
.lk-art{display:flex;flex-direction:column;gap:10px;max-width:340px;margin-left:auto;transform:rotate(-3deg)}
.lk-art .lk-btn{box-shadow:0 5px 0 rgba(0,0,0,.28)}
.lk-art .chip{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:#C59BFF;color:#1E1B16;font-weight:700;box-shadow:0 4px 0 #9A6FE0;margin-top:4px}
.lk-art .chip .gi{width:20px;height:20px}
