/* Friends gallery inspired by fqzlr.com; scoped to preserve the rest of OLX. */
.friends-preview-page {
  --fp-surface: #fff;
  --fp-text: #25262b;
  --fp-muted: #5e6068;
  --fp-border: #d6d7dc;
  --fp-soft: #f0f1f3;
  --fp-gold: #77500d;
  --fp-gold-border: #e4cb87;
  --fp-gold-bg: #fff8dd;
  --fp-violet: #5943a9;
  --fp-violet-bg: #f2eeff;
  --fp-violet-border: #c7b9ed;
}
:root.dark .friends-preview-page {
  --fp-surface: #18191e;
  --fp-text: #f2f2f4;
  --fp-muted: #b5b5bf;
  --fp-border: #3b3c45;
  --fp-soft: #25262d;
  --fp-gold: #f3d695;
  --fp-gold-border: #766138;
  --fp-gold-bg: #312a1c;
  --fp-violet: #d2bffc;
  --fp-violet-bg: #282235;
  --fp-violet-border: #6b588d;
}
.friends-preview-page .friends-page-header {
  align-items: flex-end;
  flex-wrap: nowrap;
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--fp-border);
}
.friends-preview-page .friends-page-header .page-title { margin: 0; }
.friends-preview-page .page-header-toolbar-slot { justify-content: flex-end; gap: 8px; padding-bottom: 2px; }
.friends-preview-page .friend-apply-btn,
.friends-preview-page .friend-view-toggle,
.friends-preview-page .friend-discover-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  padding: 6px 12px;
  border: 1px solid var(--fp-border);
  border-radius: 999px;
  background: var(--fp-soft);
  color: var(--fp-text);
  font: inherit;
  font-size: 12px;
  line-height: 1.4;
  white-space: nowrap;
  cursor: pointer;
}
.friends-preview-page .friend-discover-button { gap: 9px; padding: 4px 10px 4px 6px; }
.friends-preview-page .friend-discover-button > span:first-child {
  display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%;
  background: var(--fp-surface); box-shadow: 0 2px 5px #33333316; font-size: 18px;
}
.friends-preview-page .friend-discover-button strong { display: block; font-size: 12px; }
.friends-preview-page .friend-discover-button small { display: block; font-size: 9px; color: var(--fp-muted); }
.friends-preview-page button:focus-visible,
.friends-preview-page a:focus-visible { outline: 3px solid var(--fp-violet); outline-offset: 4px; }
.friends-preview-page .friends-gallery-toolbar { display: flex; justify-content: space-between; align-items: center; margin: 0 0 20px; gap: 16px; }
.friends-preview-page #friend-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.friends-preview-page #friend-filters button {
  border: 1px solid var(--fp-border); padding: 6px 12px; min-height: 34px; color: var(--fp-text);
  background: var(--fp-surface); font: inherit; font-size: 13px; line-height: 1.4; cursor: pointer;
}
.friends-preview-page #friend-filters button[aria-pressed="true"] { background: var(--fp-text); border-color: var(--fp-text); color: var(--fp-surface); }
.friends-preview-page #friends-visible-count { color: var(--fp-muted); font-size: 12px; white-space: nowrap; }
.friends-preview-page #friends-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 16px; padding: 0 0 24px; }
.friends-preview-page .friend-card { min-width: 0; }
.friends-preview-page [hidden] { display: none !important; }
.friends-preview-page .friend-preview-link {
  display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0;
  height: 100%; color: var(--fp-text); background: var(--fp-surface);
  border: 1px solid var(--fp-border); border-radius: 16px;
  position: relative; isolation: isolate; overflow: hidden;
  text-decoration: none; box-shadow: 0 3px 9px #27273809;
}
.friends-preview-page .friend-preview-image { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--fp-soft); }
.friends-preview-page .friend-preview-shot { display: block; position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.friends-preview-page .friend-preview-image::after { content: ""; position: absolute; inset: 60% 0 0; z-index: 2; background: linear-gradient(transparent, #11121a35); pointer-events: none; }
.friends-preview-page .friend-preview-fallback {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  position: absolute; inset: 0; z-index: 0; padding: 28px 20px; color: var(--fp-text);
  background: radial-gradient(ellipse at 20% 0, #d1c6ef40, transparent 65%), var(--fp-soft);
}
.friends-preview-page .friend-preview-fallback > strong { font-size: 18px; text-align: center; }
.friends-preview-page .friend-preview-fallback > small { font-size: 10px; color: var(--fp-muted); margin-top: 8px; }
.friends-preview-page .friend-preview-link img:not(.is-loaded) { opacity: 0; }
.friends-preview-page .friend-preview-fallback > span:last-child { font-family: system-ui, sans-serif; font-size: 12px; color: var(--fp-muted); }
.friends-preview-page .friend-preview-fallback .friend-preview-avatar { margin: 0 0 4px; width: 54px; height: 54px; }
.friends-preview-page .friend-preview-status {
  position: absolute; top: 7px; right: 7px; z-index: 3; display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 7px; border-radius: 999px; background: #565e6b; color: #fff;
  font-family: system-ui, sans-serif; font-size: 10px; font-weight: 750; line-height: 1.2;
  white-space: nowrap; box-shadow: 0 2px 5px #13172526;
}
.friends-preview-page .friend-preview-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.friends-preview-page .friend-preview-status[data-status="success"] { background: #19834a; }
.friends-preview-page .friend-preview-status[data-status="slow"] { background: #976006; }
.friends-preview-page .friend-preview-info {
  position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-start; flex: 1; gap: 10px;
  min-height: 82px; padding: 12px 12px 11px; border-top: 1px solid var(--fp-border);
  background: var(--fp-surface);
}
.friends-preview-page .friend-preview-avatar {
  position: relative; display: block; flex: 0 0 auto; width: 34px; height: 34px; margin-top: 0;
  border-radius: 50%; background: var(--fp-soft); color: var(--fp-muted); border: 2px solid var(--fp-surface);
  box-shadow: 0 2px 5px #24233220; z-index: 1; overflow: hidden;
}
.friends-preview-page .friend-preview-avatar::before { content: attr(data-initial); position: absolute; inset: 0; display: grid; place-items: center; font-size: 11px; }
.friends-preview-page .friend-preview-avatar img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.friends-preview-page .friend-preview-text { position: relative; z-index: 1; min-width: 0; flex: 1; }
.friends-preview-page .friend-card-title { color: var(--fp-text); font-size: 14px; line-height: 1.4; white-space: normal; overflow-wrap: anywhere; text-overflow: clip; margin: 0; font-weight: 700; }
.friends-preview-page .friend-card-desc { color: var(--fp-muted); font-size: 12px; font-style: italic; line-height: 1.55; margin: 2px 0 0; -webkit-line-clamp: 2; }
.friends-preview-page .friend-preview-host { display: none; }
.friends-preview-page .friend-preview-visit {
  position: absolute; bottom: 13px; right: 12px; z-index: 3; color: #fff; background: #171720bf;
  border: 1px solid #ffffff50; padding: 5px 10px; border-radius: 999px; font-size: 11px; opacity: 0; transform: translateY(6px);
}
.friend-image-preview {
  position: fixed; top: 0; left: 0; z-index: 60; box-sizing: border-box;
  width: min(28rem, 80vw); max-height: min(24rem, 70vh); padding: 8px;
  border: 2px solid var(--deep-text, #1d1d22); border-radius: 14px;
  background: var(--page-bg, #fff); box-shadow: 0 8px 30px #0003;
  pointer-events: none; opacity: 0; visibility: hidden; overflow: hidden;
  transform: scale(.92); transform-origin: center;
  transition: opacity .18s, transform .18s, visibility 0s linear .18s;
}
.friend-image-preview.is-visible {
  opacity: 1; visibility: visible; transform: scale(1);
  transition: opacity .18s, transform .18s, visibility 0s linear;
}
.friend-image-preview img {
  display: block; width: 100%; height: auto; max-height: calc(min(24rem, 70vh) - 16px);
  object-fit: contain; border-radius: 8px;
}
:root.dark .friend-image-preview { border-color: #e9e9ee; background: #17171b; box-shadow: 0 12px 38px #0008; }
.friends-preview-page #friends-grid[data-view="compact"] .friend-preview-image { display: none; }
.friends-preview-page #friends-grid[data-view="compact"] .friend-preview-info { align-items: center; min-height: 108px; padding-top: 29px; border-top: none; }
.friends-preview-page #friends-grid[data-view="compact"] .friend-preview-avatar { margin-top: 0; }
.friends-preview-page #friends-grid[data-view="compact"] .friend-preview-host { display: block; color: var(--fp-muted); font: 10px/1.5 system-ui, sans-serif; overflow-wrap: anywhere; margin-top: 3px; }
.friends-preview-page .friend-discovery { inset: 0; margin: auto; width: min(390px, calc(100% - 32px)); max-height: calc(100dvh - 40px); padding: 24px; border: 1px solid var(--fp-border); border-radius: 22px; background: var(--fp-surface); color: var(--fp-text); overflow: auto; }
.friends-preview-page .friend-discovery::backdrop { background: #11131d99; backdrop-filter: blur(8px); }
.friends-preview-page .friend-discovery h2 { font-size: 21px; margin: 0 0 5px; }
.friends-preview-page .friend-discovery > p { color: var(--fp-muted); font-size: 13px; margin: 0 0 24px; }
.friends-preview-page .friend-discovery-close { position: absolute; right: 14px; top: 12px; width: 30px; height: 30px; font: 22px/1 system-ui; border-radius: 50%; background: var(--fp-soft); color: var(--fp-text); cursor: pointer; }
.friends-preview-page .friend-discovery-again { margin: 20px auto 0; display: block; padding: 8px 18px; border-radius: 999px; border: 1px solid var(--fp-border); background: var(--fp-soft); color: var(--fp-text); font: inherit; font-size: 13px; cursor: pointer; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .friends-preview-page .friend-preview-link { transition: transform .32s cubic-bezier(.2,.7,.2,1), box-shadow .32s; }
  .friends-preview-page .friend-preview-link:hover { transform: translateY(-5px); box-shadow: 0 12px 26px #2922351c; border-color: var(--fp-violet-border); }
  .friends-preview-page .friend-preview-shot { transition: transform .65s cubic-bezier(.2,.7,.2,1); }
  .friends-preview-page .friend-preview-link:hover .friend-preview-shot { transform: scale(1.035); }
  .friends-preview-page .friend-preview-visit { transition: opacity .25s, transform .25s; }
  .friends-preview-page .friend-preview-link:hover .friend-preview-visit { opacity: 1; transform: none; }
}
.friends-preview-page .friend-preview-link:focus-visible .friend-preview-visit { opacity: 1; transform: none; }
@media (prefers-reduced-motion: no-preference) { .friends-preview-page .friend-discovery[open] { animation: friend-arrive .3s ease-out; } }
@keyframes friend-arrive { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 1023px) {
  .friends-preview-page #friends-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .friends-preview-page .friends-page-header { flex-wrap: wrap; align-items: flex-start; }
  .friends-preview-page .page-header-toolbar-slot { justify-content: flex-start; }
}
@media (max-width: 600px) {
  .friends-preview-page > .card-base { padding: 20px 12px; }
  .friends-preview-page .friends-page-header { gap: 18px; }
  .friends-preview-page .page-header-toolbar-slot { width: 100%; gap: 6px; }
  .friends-preview-page .friend-apply-btn, .friends-preview-page .friend-view-toggle { font-size: 11px; padding: 6px 9px; }
  .friends-preview-page .friend-discover-button { margin-left: auto; }
  .friends-preview-page .friend-discover-button small { display: none; }
  .friends-preview-page .friend-discover-button > span:first-child { width: 22px; height: 22px; }
  .friends-preview-page #friends-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .friends-preview-page .friend-preview-info { min-height: 78px; }
  .friends-preview-page .friend-card-title { font-size: 15px; }
  .friends-preview-page .friend-card-desc { font-size: 13px; }
  .friends-preview-page .friends-gallery-toolbar { margin-bottom: 18px; }
  .friends-preview-page .friend-preview-status { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .friends-preview-page .friend-card-recommended-star, .friends-preview-page .friend-owner-flow, .friends-preview-page .friend-recommended-flow { animation: none !important; }
  .friend-image-preview, .friend-image-preview.is-visible { transition: none; }
}
@media (hover: none), (pointer: coarse) { .friend-image-preview { display: none !important; } }

/* Original card effect styles from https://www.fqzlr.com/_astro/FriendCard.BrGaNbZE.css; scoped to the OLX friends page. */
.friends-preview-page .friend-card-link--own .friend-card-info{border-color:color-mix(in srgb, #8d7cff 38%, var(--card-border,#00000014));background:color-mix(in srgb, #ebe8ff 48%, var(--card-bg,#fff));position:relative;box-shadow:0 .28rem .9rem #8d7cff29}.friends-preview-page .friend-card-link--own .friend-card-title{color:#5c49c7;text-shadow:0 0 .32rem #8d7cff4d}.friends-preview-page .friend-card-link--own .friend-card-avatar{border-color:#bbb0ff;box-shadow:0 0 0 2px #8d7cff3d,0 2px 6px #00000014}.friends-preview-page .friend-card-link--own .friend-card-avatar-wrap,.friends-preview-page .friend-card-link--own .friend-card-text{z-index:2;position:relative}.friends-preview-page .friend-card-link--own .friend-card-desc{color:#4a3d99}.friends-preview-page .friend-card-link--own{--friend-owner-cycle:5.2s}.friends-preview-page .friend-card-link--own .friend-owner-flow{z-index:1;pointer-events:none;opacity:1;isolation:isolate;contain:paint;animation:friend-owner-surface-sheen var(--friend-owner-cycle) cubic-bezier(.42, 0, .22, 1) infinite;background:linear-gradient(100deg,#0000 0 16%,#a594ff0d 27%,#baaaff1c 39%,#e2daff3d 50%,#baaaff1f 62%,#9e8afa0d 76%,#0000 94%) 130% 0/250% 100%;transition:opacity .32s cubic-bezier(.16,1,.3,1);display:block;position:absolute;inset:0;overflow:hidden}.friends-preview-page .friend-card-link--own .friend-owner-canvas{z-index:1;opacity:.96;background:0 0;width:100%;height:100%;display:block;position:absolute;inset:0}.friends-preview-page .friend-card-link--own .friend-owner-flow:before,.friends-preview-page .friend-card-link--own .friend-owner-flow:after{pointer-events:none;content:"";position:absolute}.friends-preview-page .friend-card-link--own .friend-owner-flow:before{z-index:2;filter:blur(.18rem)saturate(1.12);transform-origin:50%;width:50%;animation:friend-owner-beam-primary var(--friend-owner-cycle) cubic-bezier(.32, .02, .24, 1) infinite;will-change:transform, opacity;background:linear-gradient(100deg,#0000 0 30%,#8d7cff38 37%,#b2a0ff8c 43%,#f5f2fff2 49%,#d6cdffcc 54%,#7c69e94d 62%,#0000 73%),linear-gradient(98deg,#0000 8%,#9e8afa1f 25%,#c8bcff66 50%,#8d7cff1f 75%,#0000 92%);top:-88%;bottom:-88%;left:-60%;transform:translate(-8%)skew(-9deg);box-shadow:0 0 .8rem #c4b8ff80,0 0 1.5rem #8d7cff42}.friends-preview-page .friend-card-link--own .friend-owner-flow:after{z-index:1;filter:blur(.7rem)saturate(1.12);transform-origin:50%;width:76%;animation:friend-owner-beam-halo var(--friend-owner-cycle) cubic-bezier(.32, .02, .24, 1) infinite;will-change:transform, opacity;background:linear-gradient(100deg,#0000 0 4%,#8d7cff0a 16%,#b2a0ff21 31%,#e2daff66 49%,#9e8afa2e 68%,#d6cdff12 84%,#0000 100%);top:-76%;bottom:-76%;left:-76%;transform:translate(-6%)skew(-7deg);mask-image:linear-gradient(100deg,#0000 0%,#000 12% 84%,#0000 100%)}@keyframes friend-owner-beam-primary{0%{opacity:0;transform:translate(-8%)skew(-9deg)}10%{opacity:.55}46%{opacity:.92}83%{opacity:.55}to{opacity:0;transform:translate(356%)skew(-9deg)}}@keyframes friend-owner-beam-halo{0%{opacity:0;transform:translate(-6%)skew(-7deg)scaleX(.9)}14%{opacity:.24}54%{opacity:.6}84%{opacity:.46}96%{opacity:.18}to{opacity:0;transform:translate(306%)skew(-7deg)scaleX(1.08)}}@keyframes friend-owner-surface-sheen{0%{background-position:130% 0}to{background-position:-170% 0}}.friends-preview-page .friend-card-link--own .friend-card-own-deco{opacity:.3;pointer-events:none;z-index:1;background:linear-gradient(135deg,#a594ff,#8d7cff 70%,#6c5bd9);width:4.6rem;height:4.6rem;transition:opacity .3s,transform .5s cubic-bezier(.2,.8,.2,1);position:absolute;top:.4rem;right:.4rem;transform:rotate(-6deg);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 120'%3E%3Cg fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 58 62 23c4-3 8-3 12 0l38 35' stroke-width='5'/%3E%3Cpath d='M31 54v43c0 6 4 10 10 10h51c6 0 10-4 10-10V54M78 31V19h17v27' stroke-width='4.5'/%3E%3Cpath d='M57 107V78c0-5 4-9 9-9h3c5 0 9 4 9 9v29M42 65h11v12H42zM86 65h8v12h-8z' stroke-width='4'/%3E%3Cpath d='M58 51c0-5 7-7 10-2 3-5 10-3 10 2 0 6-10 12-10 12S58 57 58 51Z' stroke-width='3'/%3E%3C/g%3E%3C/svg%3E");mask-position:50%;mask-size:contain;mask-repeat:no-repeat}.friends-preview-page .friend-card-link--own:hover .friend-card-own-deco{opacity:.5;transform:rotate(-10deg)scale(1.05)}:root.dark .friends-preview-page .friend-card-link--own .friend-card-info{border-color:color-mix(in srgb, #a594ff 36%, var(--card-border,#ffffff1a));background:color-mix(in srgb, #3a2e7a 32%, var(--card-bg,#1c1d20));box-shadow:0 .28rem .9rem #8d7cff2e}:root.dark .friends-preview-page .friend-card-link--own .friend-card-title{color:#c4b8ff;text-shadow:0 0 .5rem #8d7cff5c}:root.dark .friends-preview-page .friend-card-link--own .friend-card-desc{color:#b0a4e8}:root.dark .friends-preview-page .friend-card-link--own .friend-card-avatar{border-color:#c9bfff}.friends-preview-page .friend-card-link--recommended{--friend-recommended-cycle:3.8s}.friends-preview-page .friend-card-link--recommended .friend-card-info{position:relative}.friends-preview-page .friend-card-link--recommended .friend-recommended-flow{z-index:1;pointer-events:none;opacity:1;isolation:isolate;contain:paint;animation:friend-recommended-surface-sheen var(--friend-recommended-cycle) cubic-bezier(.42, 0, .22, 1) infinite;background:linear-gradient(104deg,#0000 0 18%,#ffd23d09 28%,#ffe27017 39%,#fff6b833 50%,#ffe2701a 62%,#ffd0340b 76%,#0000 94%) 130% 0/250% 100%;transition:opacity .32s cubic-bezier(.16,1,.3,1);display:block;position:absolute;inset:0;overflow:hidden}.friends-preview-page .friend-card-link--recommended .friend-recommended-canvas{z-index:1;opacity:.98;background:0 0;width:100%;height:100%;display:block;position:absolute;inset:0}.friends-preview-page .friend-card-link--recommended .friend-recommended-flow:before,.friends-preview-page .friend-card-link--recommended .friend-recommended-flow:after{pointer-events:none;content:"";position:absolute}.friends-preview-page .friend-card-link--recommended .friend-recommended-flow:before{z-index:2;filter:blur(.16rem)saturate(1.08);transform-origin:50%;width:54%;animation:friend-recommended-beam-primary var(--friend-recommended-cycle) cubic-bezier(.32, .02, .24, 1) infinite;will-change:transform, opacity;background:linear-gradient(105deg,#0000 0 31%,#efad1833 37%,#ffdc5b94 43%,#fffff4fa 49%,#fff1a6d1 53%,#e8990c4d 61%,#0000 72%),linear-gradient(101deg,#0000 8%,#f8b51d1a 25%,#ffe26f6b 50%,#f5ae131a 75%,#0000 92%);top:-88%;bottom:-88%;left:-64%;transform:translate(-8%)skew(-10deg);box-shadow:0 0 .75rem #ffe27580,0 0 1.35rem #eb9c0d3d}.friends-preview-page .friend-card-link--recommended .friend-recommended-flow:after{z-index:1;filter:blur(.68rem)saturate(1.1);transform-origin:50%;width:78%;animation:friend-recommended-beam-halo var(--friend-recommended-cycle) cubic-bezier(.32, .02, .24, 1) infinite;will-change:transform, opacity;background:linear-gradient(104deg,#0000 0 4%,#efa30e09 16%,#ffd23f1f 31%,#ffef9b61 49%,#f1a81129 68%,#ffef9b0f 84%,#0000 100%);top:-76%;bottom:-76%;left:-78%;transform:translate(-6%)skew(-8deg);mask-image:linear-gradient(104deg,#0000 0%,#000 12% 84%,#0000 100%)}@keyframes friend-recommended-beam-primary{0%{opacity:0;transform:translate(-8%)skew(-10deg)}10%{opacity:.64}46%{opacity:1}83%{opacity:.62}to{opacity:0;transform:translate(348%)skew(-10deg)}}@keyframes friend-recommended-beam-halo{0%{opacity:0;transform:translate(-6%)skew(-8deg)scaleX(.9)}14%{opacity:.28}54%{opacity:.68}84%{opacity:.52}96%{opacity:.22}to{opacity:0;transform:translate(300%)skew(-8deg)scaleX(1.08)}}@keyframes friend-recommended-surface-sheen{0%{background-position:130% 0}to{background-position:-170% 0}}.friends-preview-page .friend-card-link--recommended .friend-card-recommended-star{opacity:.42;pointer-events:none;z-index:1;background:linear-gradient(138deg,#f7c73f,#ffdc70 70%,#eea915);width:4.6rem;height:4.6rem;transition:opacity .3s,transform .5s cubic-bezier(.2,.8,.2,1);animation:4s ease-in-out infinite starPulse;position:absolute;top:.4rem;right:.4rem;transform:rotate(-8deg);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M60 14c4 0 7 3 9 7l10 21 24 4c4 1 7 3 8 7 1 3 0 7-3 10L90 80l4 24c1 4-1 8-4 10-3 2-7 2-11 0L60 102l-19 12c-4 2-8 2-11 0-3-2-5-6-4-10l4-24-18-17c-3-3-4-7-3-10 1-4 4-6 8-7l24-4 10-21c2-4 5-7 9-7Z' stroke-width='4'/%3E%3Cpath d='m23 26 2 6 6 2-6 2-2 6-2-6-6-2 6-2 2-6Zm79 65 1.5 4 4 1.5-4 1.5-1.5 4-1.5-4-4-1.5 4-1.5-4Z' stroke-width='2.5'/%3E%3C/g%3E%3C/svg%3E");mask-position:50%;mask-size:contain;mask-repeat:no-repeat}.friends-preview-page .friend-card-link--recommended:hover .friend-card-recommended-star{opacity:.6;transform:rotate(-12deg)scale(1.05)}@keyframes starPulse{0%,to{transform:rotate(-8deg)scale(1)}50%{transform:rotate(-6deg)scale(1.04)}}.friends-preview-page .friend-card-link--recommended .friend-card-avatar-wrap,.friends-preview-page .friend-card-link--recommended .friend-card-text{z-index:2;position:relative}.friends-preview-page .friend-card-link--recommended .friend-card-info{border-color:color-mix(in srgb, #f4bb2e 42%, var(--card-border,#00000014));background:color-mix(in srgb, #fff0a2 48%, var(--card-bg,#fff));box-shadow:0 .28rem .9rem #f4bb2e2e}.friends-preview-page .friend-card-link--recommended .friend-card-title{color:#956100;text-shadow:0 0 .32rem #f4bb2e4d}.friends-preview-page .friend-card-link--recommended .friend-card-avatar{border-color:#f8d682;box-shadow:0 0 0 2px #f4bb2e3d,0 2px 6px #00000014}.friends-preview-page .friend-card-link--recommended .friend-card-desc{color:#7a5000}@media (prefers-reduced-motion:reduce){.friends-preview-page .friend-card-link--recommended .friend-recommended-flow,.friends-preview-page .friend-card-link--recommended .friend-recommended-flow:before,.friends-preview-page .friend-card-link--recommended .friend-recommended-flow:after,.friends-preview-page .friend-card-link--recommended .friend-card-recommended-star{animation:none}}:root.dark .friends-preview-page .friend-card-link--recommended .friend-card-info{border-color:color-mix(in srgb, #e9bd51 32%, var(--card-border,#ffffff1a));background:color-mix(in srgb, #7a5714 18%, var(--card-bg,#1c1d20));box-shadow:0 .28rem .9rem #d39b241f}:root.dark .friends-preview-page .friend-card-link--recommended .friend-card-title{color:#f3d17c;text-shadow:0 0 .5rem #f4bb2e52}:root.dark .friends-preview-page .friend-card-link--recommended .friend-card-desc{color:#d9b35a}:root.dark .friends-preview-page .friend-card-link--recommended .friend-card-avatar{border-color:#f2d797}@media (prefers-reduced-motion:reduce){.friends-preview-page .friend-card-link--own .friend-owner-flow,.friends-preview-page .friend-card-link--own .friend-owner-flow:before,.friends-preview-page .friend-card-link--own .friend-owner-flow:after{animation:none}}